/*
 * Copyright 2012 Lewis Counsel
 * Developed By Contact Point IT Services
 */


/* Reset CSS
   http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/*
 * General Styles
 */
body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #000;
    background: #fff url(images/background.jpg) center 295px no-repeat;
}
a,
a:link,
a:visited{
	color: #000;
	text-decoration: underline;
}
a:hover {
	color: #f00;
}
.active {
	color:#000 !important;
}
p {
    padding-left: 22px;
    padding-right: 28px;
	padding-bottom: 8px;
	overflow: visible;
    font-size: 13px;
}
ul {
     font-size: 13px;
}


hr {
	height: 1px;
	border: 0px;
	background-color: #c0c0c0;
	color: #c0c0c0;
	width: 100%;
	margin: 3px 0px 10px 0px;
}
img { border: 0; }
h1 {
	font-family: "Calisto MT", Arial, Helvetica, sans-serif;
	font-size: 29px;
    font-weight: normal;
	color: #000;
    padding-left: 22px;
    padding-right: 28px;
	padding-bottom: 32px;
    display: inline-block;
    background: url(images/h1_bg.png) no-repeat;
    background-position:23px;
}
h2 {
	font-family: "Calisto MT", Arial, Helvetica, sans-serif;
	font-size: 29px;
	font-weight: normal;
	color: #000;
    padding-left: 22px;
    padding-right: 28px;
	padding-bottom: 5px;
}
h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 17px;
	font-weight: normal;
	color: #000;
    padding-left: 22px;
    padding-right: 28px;
	padding-bottom: 5px;
}
fieldset {
    padding: 5px 15px;
    margin-bottom: 20px;
    border: 1px solid #c0cdd4;
}
legend {
    padding: 0 3px 5px;
}
.clear {
    clear: both;
}


/*
 * General Layout
 */
#container {
    width: 100%;
}
.wrapper {
    width: 926px;
    margin: 0 auto;
}
/*
.left {
    width: 204px;
    padding-left: 5px;
    float: left;
    display: inline-block;
}
.right {
    width: 627px;
    float: right;
    display: inline-block;
}
*/
#header, #navigation, #body, #footer {
    width: 100%;
}

#header {
    height: 106px;
    margin-top: 15px;
}
#navigation {
    height: 34px;
}
#body {
    margin: 30px 0 80px;
}
#footer {
    height: 145px;
}


/*
 * Header Component
 */
#logo {
    width: 50%;
    height: 100px;
    /*margin: 25px 0 0; */
    display: inline-block;
    float: left;
    background: #fff;
}

#header-logo {
  background-image: url('images/logo.jpg');
  display: inline-block;
  width:198px;
  height:76px;
}


#header-right {
    float: right;
    display: inline-block;
    margin-top: 55px;
}

/*
 * Navigation
 */
#menu {
    /*width: 962px;*/
		width: 926px;
    height: 34px;
		border-radius: 10px;
    overflow: hidden;
    background: #000;
}
#menu ul, #menu li {
    list-style: none;
    padding: 0;
    margin: 0;
}
#menu li {
    display: inline-block;
    float: left;
}
/*#menu .menu-home a       { width: 87px; background: url(images/home.jpg) no-repeat; }
#menu .menu-corporate a  { width: 100px; background: url(images/governance.jpg) no-repeat; }
#menu .menu-wills a      { width: 59px; background: url(images/wills.jpg) no-repeat; }
#menu .menu-estates a    { width: 81px; background: url(images/estates.jpg) no-repeat; }
#menu .menu-passion a    { width: 101px; background: url(images/our_passion.jpg) no-repeat; }
#menu .menu-resources a  { width: 104px; background: url(images/resources.jpg) no-repeat; }
#menu .menu-testimony a  { width: 163px; background: url(images/clients.jpg) no-repeat; }
#menu .menu-about a      { width: 160px; background: url(images/about.jpg) no-repeat; }
#menu .menu-contact a    { width: 107px; background: url(images/contact.jpg) no-repeat; }

#menu a {
    display: block;
    height: 34px;
    text-indent: -99999px;
    overflow: hidden;
    background-position: left bottom !important;
}
#menu a:hover, #menu a.hover, #menu a.active {
    background-position: left top !important;
}*/

#menu ul {
	display: flex;
	flex-wrap: nowrap;
}

#menu li {
  flex-grow: 1
}
#menu li:hover a {
	color: black
}
 #menu .menu-home a
,#menu .menu-corporate a
,#menu .menu-wills a
,#menu .menu-estates a
,#menu .menu-passion a
,#menu .menu-resources a
,#menu .menu-testimony a
,#menu .menu-about a
,#menu .menu-contact a {
	background-color: #8C8C8C;
	text-decoration: none;
	color: white;
	text-align: center;
	line-height: 35px;
}


#menu a {
	display: block;
	height: 34px;
}


/*
 * Body Component
 */
#content {
    font-size: 14px;
    color: #596165;
    line-height: 20px;
}
#content p {
    padding-bottom: 15px;
}
#content p a {
    text-decoration: underline;
}
#content ul, #content ol {
    margin-left: 25px;
    padding-bottom: 15px;
}
#content ul ul, #content ol ul {
    padding-bottom: 3px;
}
.round {
    border: 3px solid #000;
    width: 150px;
    height: 50px;
    position: relative;
    -moz-border-radius: 10px; /* Firefox */
	-webkit-border-radius: 10px; /* Chrome & Safari */
	border-radius: 10px; /* Opera 10.50 & IE9 , Also Works for IE-CSS3 the Script */
    -moz-box-shadow: 5px 5px 10px #000;
	-webkit-box-shadow: 5px 5px 10px #000;
    box-shadow: 5px 5px 10px #000;
    z-index: 2;
    behavior: url(ie-css3.htc);
}

.content-column {
  display:inline-block;
  float: left;
}

.one-column {
  width:100%;
  float:none;
}

.two-columns {
  width:50%;
}

.three-columns {
  width:33%;
}

.inner-column-header {
  width: 46%;
  float:right;
  display: none;
}


/*
 * Footer Component
 */
#footer {
    color: #fff;
    background: #231f20;
    padding-top: 28px;
}
#footer a {
    color: #fff;
}
#footer a:hover {
    color: #fff;
}
#footer_separator {
    width: 1px;
    height: 40px;
    background: #fff;
    margin: 0 140px;
}

#footer .wrapper {
  padding: 0 32px;
  position: relative;
}

#footer-copyright { position: absolute; }
#footer-phone     { position: absolute; top: 15px; }
#footer-contact   { position: absolute; top: 30px; }
#footer-privacy   { position: absolute; left: 190px; }
#footer-toc       { position: absolute; top: 15px; left: 190px; }
#footer-cp        { position: absolute; top: 80px;}
/*
#footer table {
    margin-bottom: 40px;
}*/

/*
 * Other Component
 */
.error {
    color: red;
}
.green {
    color: green;
}

#menu-bottom {
    height: 31px;
}

#menu-bottom a {
  display: inline-block;
}

#menu-bottom-blog {
  background-image: url('images/blog_btn.jpg');
  height: 31px;
  width: 164px;
}

#menu-bottom-email {
  background-image: url('images/email_update_btn.jpg');
  height: 31px;
  width: 307px;
}

#red-overflow {
    background: #ed1c24;
    display: block;
    height: 61px;
    width: 50%;
    z-index: -1;
    position: absolute;
}

p.motto {
    font-family: "Calisto MT", Arial, Helvetica, sans-serif;
	font-size: 25px;
    font-weight: normal;
	color: #444;
    padding-top: 22px;
    text-align: center;
	padding-bottom: 22px;
    display: block;
}

#hero-inner {
  margin: 0 0 20px;
  width: 100%;
}

/**
 * blog
 */

#content.narrowcolumn {
  float: left;
  max-width: 500px;
}

#content #sidebar {
  float: right;
}


@media screen and (min-width: 769px) and (max-width: 1024px) {

    .wrapper {
        width: 769px;
    }

    #body > .wrapper > #content {
        padding: 0 32px;
    }

    #content {
      line-height: 24px;
    }


    .left, .right {
        float: none;
        display: block;
        width: 100%;
        padding: 0;
        margin: 0;
    }
    .left {
        position: relative;
    }

    h3 {
      font-size: 28px;
    }

    p {
      font-size: 18px;
    }

    #header-logo {
      background-image: url('images/tab_lewiscounsel_logo.gif');
      display: inline-block;
      width:339px;
      height:84px;
    }

    #red-overflow {
        height: 67px;
        top: 15px;
    }

    #header-right {
      margin: 28px 17px 0;
    }

    #header-right h3, #header-right p {
      padding: 0;
      max-width: 350px
    }

    #header-right p {
      font-size: 14px;
    }


    #navigation {
      height: 0;
    }

    #menu {
      width: 270px;
      float: right;
      margin: 0;
    }

    #menu li {
      display: block;
      float: none;
    }

    /*#menu .menu-home a       { background: url(images/tab_nav_home.gif) no-repeat; }
    #menu .menu-corporate a  { background: url(images/tab_nav_governance.gif) no-repeat; }
    #menu .menu-wills a      { background: url(images/tab_nav_wills.gif) no-repeat; }
    #menu .menu-estates a    { background: url(images/tab_nav_estates.gif) no-repeat; }
    #menu .menu-passion a    { background: url(images/tab_nav_passion.gif) no-repeat; }
    #menu .menu-resources a  { background: url(images/tab_nav_resources.gif) no-repeat; }
    #menu .menu-testimony a  { background: url(images/tab_nav_clients.gif) no-repeat; }
    #menu .menu-about a      { background: url(images/tab_nav_about.gif) no-repeat; }
    #menu .menu-contact a    { background: url(images/tab_nav_contact.gif) no-repeat; }*/

    #menu a {
      height: 43px;
      min-width: 270px;
      width: 25% !important;
    }

    p.motto {
      font-size: 22px;
      padding: 16px 0 12px !important;
    }

    #hero-inner {
      width: 498px;
      height: 387px;
    }

    .inner-column-header {
      width: 100%;
      float: none;
    }

    .three-columns.first-column {
      width: 100%;
      float: none;
    }

    .three-columns.second-column, .two-columns.first-column {
      width: 50%;
      float: left;
    }

    .three-columns.third-column, .two-columns.second-column {
      width: 50%;
      float: right;
    }

    #menu-bottom {
      height: 45px;
    }

    #menu-bottom-blog {
      background-image: url('images/tab_blog_btn.jpg');
      height: 45px;
      width: 236px;
    }

    #menu-bottom-email {
      background-image: url('images/tab_emailupdates_btn.jpg');
      height: 45px;
      width: 450px;
    }

    #footer .wrapper {
      padding: 0 32px;
      position: relative;
    }

    #footer span {
      font-size: 16px;
    }

    #footer-copyright { position: absolute; }
    #footer-phone     { position: absolute; top: 0px;  left: 215px; }
    #footer-contact   { position: absolute; top: 30px; left: 365px;}
    #footer-privacy   { position: absolute; top: 30px; left: 32px; }
    #footer-toc       { position: absolute; top: 30px; left: 148px; }
    #footer-cp        { position: absolute; top: 60px; }

    #footer_separator {
      display: none;
    }

    #content.narrowcolumn {
      max-width: 360px;
    }

    #blog-placeholder {
      height: 387px;
    }


}

@media screen and (max-width: 768px) {
    .wrapper {
        width: 300px;
    }

    #body > .wrapper > #content {
        padding: 0 12px;
    }

    #body {
      margin: 30px 0 20px;
    }

    .left, .right {
        float: none;
        display: block;
        width: 100%;
        padding: 0;
        margin: 0;
    }
    .left {
        position: relative;
    }

    h1 {
      font-size: 23px;
      padding: 0 12px 25px;
      background-position: 14px;
    }


    h2 {
      font-size: 20px;
      padding: 0 12px;
    }


    h3 {
      font-size: 17px;
      padding: 0 12px;
    }

    p {
      font-size: 14px;
      padding: 0 12px;
    }

    #header-logo {
      background-image: url('images/phone_lewiscounsel_logo.gif');
      display: inline-block;
      width:277px;
      height:84px;
    }

    #red-overflow {
        height: 67.7px;
        top: 15px;
    }

    #header-right {
      margin: 0 17px;
    }

    #header-right h3, #header-right p {
      padding: 0;
    }

    #header-right p {
      font-size: 10px;
      max-width: 130px;
    }


    #hero-inner {
      display: none;
    }


    #navigation {
    }

    #menu ul {
        display: none;
        position: absolute;
        top: 100%;
        border-top: 5px solid white;
    }

    #menu {
      background-image: url('images/phone_menu_btn.gif');
      width: 118px;
      height: 34px;
      float: left;
      margin: 0;
      position: relative;
      z-index: 10;
    }

    #menu li {
      display: block;
      float: none;
    }

    /*#menu .menu-home a       { background: url(images/phone_nav_home.gif) no-repeat; }
    #menu .menu-corporate a  { background: url(images/phone_nav_governance.gif) no-repeat; }
    #menu .menu-wills a      { background: url(images/phone_nav_wills.gif) no-repeat; }
    #menu .menu-estates a    { background: url(images/phone_nav_estates.gif) no-repeat; }
    #menu .menu-passion a    { background: url(images/phone_nav_passion.gif) no-repeat; }
    #menu .menu-resources a  { background: url(images/phone_nav_resources.gif) no-repeat; }
    #menu .menu-testimony a  { background: url(images/phone_nav_clients.gif) no-repeat; }
    #menu .menu-about a      { background: url(images/phone_nav_about.gif) no-repeat; }
    #menu .menu-contact a    { background: url(images/phone_nav_contact.gif) no-repeat; }*/

    #menu a {
      height: 27px;
      min-width: 173px;
      width: 25% !important;
    }

    #content-motto {
      display: none;
    }

    .inner-column-header {
      width: 100%;
      float: none;
    }

    .first-column,
    .second-column,
    .third-column {
      width: 100%;
      float: none;
    }

    #menu-bottom {
      height: 100px;
      position: relative;
    }
    /*
    #menu-bottom a {
      display: block;
      margin: 0 auto;
    }*/


    #menu-bottom-blog {
      background-image: url('images/phone_blog_btn.gif');
      height: 50px;
      width: 170px;
      position: absolute;
      top: 45px;
      left: 65px;
    }

    #menu-bottom-email {
      background-image: url('images/phone_emailupdates_btn.gif');
      height: 50px;
      width: 300px;
    }

    #footer .wrapper {
      padding: 0 12px;
      position: relative;
    }

    #footer span {
      font-size: 16px;
    }

    #footer-copyright { position: absolute; }
    #footer-phone     { display: none; }
    #footer-contact   { position: absolute; top: 30px; left: 12px;}
    #footer-privacy   { position: absolute; top: 60px; left: 12px; }
    #footer-toc       { position: absolute; top: 90px; left: 12px; }
    #footer-cp        { position: absolute; top: 120px; }

    #footer_separator {
      display: none;
    }
}