.clear{clear:both; height: 1%;}
html {background: #20060B url('img/bg/main.jpg') repeat-x top center;}
#wrapper {margin: 0 auto; width: 760px; position: relative; padding:0;}
#content {float: right; width: 500px; padding: 10px; background: #fff; margin-right: 15px;}

/* TOP LEVEL NAV */
#logo {float: left; margin: 22px 0 0 50px; height: 192px;}
#nav {position: relative; float: right; top: 56px; right: 25px; height: 115px;}
#nav ul {display: inline; font: normal normal normal 16px georgia, times, serif;}
#nav ul li {background: transparent url('img/blt/orange.png') no-repeat center right; padding: 0 27px; float: left;}
#nav ul li.last {background-image: none; padding-right: 0;}
#nav a {color: #3A1B0F; text-decoration: none;}
#nav a:hover {color: #E66D31;}
#services .services, #portfolio .portfolio, #blog .blog, #about .about, #contact .contact, #services .services:hover, #portfolio .portfolio:hover, #blog .blog:hover, #about .about:hover, #contact .contact:hover{color: #8E2A07;}

/* SECONDARY NAV */
#side-nav {float: left; width: 190px; margin: 0px 0 0 5px; padding: 10px 10px 0 10px; background:  #904620 url('img/bg/gradient-sidebar.jpg') repeat-x top left; border-top: 10px solid #fff; border-left: 10px solid #fff; border-bottom: 10px solid #fff; min-height:195px;height:auto !important;height:195px;}
#side-nav p {color: #EFEAC4;}
#side-nav ul {margin-left: -20px;}
#side-nav ul li {margin-bottom: 10px;padding-left: 20px;}
#side-nav ul a { color: #EFEAC4; text-decoration: none; font: italic normal normal 14px georgia, times,serif;}
#side-nav ul a:hover {color: #fff;}
#side-nav ul li.current a {color: #fff;}
#services .brand #side-nav .brand, #services .marketing #side-nav .marketing, #services .design #side-nav .design, #services .communications #side-nav .communications, #services .print #side-nav .print, #services .multimedia #side-nav .multimedia, #services .web #side-nav .web, #about .vision #side-nav .vision, #about .team #side-nav .team, #about .commitment #side-nav .commitment, #about .meet #side-nav .meet {color: #fff; background: url('img/blt/triangle-white.png') no-repeat 5px -2px;}
.emdeongg #side-nav .emdeongg, .meridian #side-nav .meridian, .brookside #side-nav .brookside, .cleburne #side-nav .cleburne, .payments #side-nav .payments, .gaither #side-nav .gaither, .ernie #side-nav .ernie, .jet #side-nav .jet, .data #side-nav .data {color: #fff; background: url('img/blt/triangle-white.png') no-repeat 5px -2px;}

/* Marketing Man Button on  home page */
#home #side-nav {float: left; width: 210px; margin: 0px 0 0 5px; padding: 10px 0 0 0; background:  #904620 url('img/bg/gradient-sidebar.jpg') repeat-x top left; border-top: 10px solid #fff; border-left: 10px solid #fff; border-bottom: 10px solid #fff; min-height:195px;height:auto !important;height:195px;}
#home #side-nav p, #home #side-nav h2 {padding: 0 10px;}
a.marketing-button {display: block; height:86px; background: transparent url('img/btn/marketing-man-button.jpg') no-repeat bottom left; outline: none;}
a:hover.marketing-button {background: transparent url('img/btn/marketing-man-button.jpg') no-repeat top left;}
/* HERO IMAGES */
#hero, .hero {width: 500px; height: 240px;}
#services .brand #hero {background: url('img/heros/services-brand-development.jpg') no-repeat top center;}
#services .web #hero {background: url('img/heros/services-web.jpg') no-repeat top center;}
#services .print #hero {background: url('img/heros/services-print.jpg') no-repeat top center;}
#services .multimedia #hero {background: url('img/heros/services-multi.jpg') no-repeat top center;}
#services .marketing #hero {background: url('img/heros/services-marketing.jpg') no-repeat top center;}
#services .design #hero {background: url('img/heros/services-design.jpg') no-repeat top center;}
#services .communications #hero {background: url('img/heros/services-communication.jpg') no-repeat top center;}
#about .vision #hero {background: url('img/heros/about-vision.jpg') no-repeat top center;}
#about .team #hero {background: url('img/heros/about-team-group-v5.jpg') no-repeat top center;}
#about .commitment #hero {background: url('img/heros/about-commitment.jpg') no-repeat top center;}
#contact .contact #hero {background: url('img/heros/contact.jpg') no-repeat top center;}
#contact .thankyou #hero {background: url('img/heros/thankyou.jpg') no-repeat top center;}
#error404 .error404 #hero {background: url('img/heros/error-404.jpg') no-repeat top center;} 
#error .error #hero {background: url('img/heros/error-solutions.jpg') no-repeat top center;} 
#marketing-man-thanks .marketing-man #hero {background: url('img/heros/marketing-man.jpg') no-repeat top center;}
/* FOOTER */
#footer {text-align: right; clear: both; margin:10px 20px;  color: #776451;}
#footer p {font-size: 10px; color: #776451;}
#footer p span {margin-right: 40px;}
#footer a {color: #776451;}
#footer a:hover {color: #EFEAC4;}
/* SOCIAL */
#social {min-height:50px; margin:0 20px 0 0;}
a.facebook {float: right; display: block; width:25px; height:25px; background: transparent url('img/social/facebook-both-icons.gif') no-repeat bottom left; outline: none; margin:0 0 0 5px;}
a:hover.facebook {background: transparent url('img/social/facebook-both-icons.gif') no-repeat top left; margin:0 0 0 5px;}
a.linkedin {float: right; display: block; width:25px; height:25px; background: transparent url('img/social/linkedin-both-icons.gif') no-repeat bottom left; outline: none; margin:0 0 0 5px;}
a:hover.linkedin {background: transparent url('img/social/linkedin-both-icons.gif') no-repeat top left; margin:0 0 0 5px;}
a.twitter {float: right; display: block; width:25px; height:25px; background: transparent url('img/social/twitter-both-icons.gif') no-repeat bottom left; outline: none; margin:0 0 0 5px;}
a:hover.twitter {background: transparent url('img/social/twitter-both-icons.gif') no-repeat top left; margin:0 0 0 5px;}
a.youtube {float: right; display: block; width:25px; height:25px; background: transparent url('img/social/youtube-both-icons.gif') no-repeat bottom left; outline: none; margin:0 0 0 5px;}
a:hover.youtube {background: transparent url('img/social/youtube-both-icons.gif') no-repeat top left; margin:0 0 0 5px;}

/* BLOG */
#blog .blog #hero {background: url('img/heros/blog.jpg') no-repeat top center;}
.copy {padding: 10px;}
#blog .blog .content h2 {color: #E66D31; font: normal normal normal 24px georgia, times, serif; margin: 10px 0; position: relative;}
#blog p.specs a {font-weight: bold; }
#blog p.specs:first-line {font-weight: normal;}
#blog .internal .post {margin-bottom: 0;}
#blog .blog .post img {display:none;}
#blog .internal .post img {border: 5px solid #BAB2B3; float: right; margin: 5px 0 5px 5px; display: visible!important;}
#blog .comments {border-top: 1px solid #bab2b3;}
#blog a.comments {color: #245358; font-weight: normal; border: 0;}
#blog .internal h1 {margin: 0 0 10px 0;}
#blog h1 a {color: #E66D31;}

/* PORTFOLIO */
#portfolio #content { min-height:600px;height:auto !important;height:600px;}
#portfolio .item  {padding: 0; margin:  0;} 
#portfolio #port-nav {margin-left: 6px;}
#portfolio #port-nav a { width: 24px; height: 24px; background:  #904620 url('img/bg/portfolio-next.jpg') repeat-x 0 0; text-decoration: none; margin: 0 3px; padding: 5px 0 0 0;  color: #EFEAC4; display: block; float: left; text-align: center; font: normal normal normal 14px  "Helvetica Neue", Helvetica, arial, sans-serif;}
#portfolio #port-nav a.activeSlide { background:  #904620 url('img/bg/portfolio-next-active.jpg') repeat-x 0 0; color: #513B33; font-weight: bold; }
#portfolio #port-nav a:focus { outline: none; }

/* MEET THE TEAM */
#the-team h3 {background: url('img/blt/tick.png') no-repeat 0 8px; font: normal normal normal 18px georgia, times, serif; color: #245358; padding-left: 12px; cursor: pointer;}
#the-team h3.over {color: #8E2A07;}
#the-team h3 span {font-size: 14px; color: #513B33;}
#the-team div.bio {padding: 10px; background-color: #F9F3D2; margin: 0 12px; }
#the-team div.bio img {float: right; margin: 0 0 5px 5px; border: 5px solid #fff; }
#the-team div.bio em {font-size: 16px;}

/* 	TYPOGRAPHY */
hr {height: 1px; color: #bab2b3; background-color: #bab2b3; padding: 0; margin: 20px 0; border: 0;}
strong {font-weight: bold;}
em {font-style: italic; font-family:georgia, times, serif;}
a {text-decoration:none; color: #20060B;}
a:hover {text-decoration: underline;}
p {color: #513B33; font: normal normal normal 12px / 1.5 "Helvetica Neue", Helvetica, arial, sans-serif; margin-bottom: 10px;}
p:first-line {font-weight: bold;}
p + p:first-line {font-weight:normal;}
p.last {margin-bottom: 0;}
p.sub {font-size: 10px;}
h1 {color: #E66D31; font: normal normal normal 24px georgia, times, serif; margin: 10px 0; position: relative;}
h1 img {position: absolute; left: -20px; top: 6px;}
h2 {color: #20060B; font: normal normal normal 18px georgia, times, serif; margin-bottom: 10px;}
h2.marketing-man {color: #20060B; font: normal normal normal 28px georgia, times, serif; margin-bottom: 10px;}
h3 {color: #E66D31; font: normal normal normal 18px georgia, times, serif; margin: 10px 0; position: relative;}
h3 span {font-size: 14px; color: #513B33;}
h4 {color:  #513B33; font: italic normal normal 16px / 1.3 georgia, times, serif; margin: 10px 0; position: relative; }
h5 {color: #E66D31; font: normal normal normal 16px georgia, times, serif; margin: 10px 0 0 0; position: relative;}
ul#sitemap li {list-style: disc inside url('img/blt/tick-orange.jpg'); line-height: 1.3;}
ul#sitemap li ul li {list-style: disc inside url('img/blt/tick-orange.jpg'); line-height: 1.3; margin-left: 20px;}
ul#sitemap a {color: #245358;}

/* FORMS */
form {color: #513B33; margin-bottom: 10px; }
form label {width: 100px; float: left; text-align: right; font: normal normal bold 12px / 1.5 "Helvetica Neue", Helvetica, arial, sans-serif; }
form div {clear: both; margin-bottom: 5px;}
form input, form textarea {width: 364px; padding: 2px; font: normal normal normal 12px / 1.5 "Helvetica Neue", Helvetica, arial, sans-serif; margin-left: 10px; border: 1px solid #bab2b3;}
form .submit input {float: right; width: 69px; height: 28px; cursor: pointer; border: 0; padding: 0; outline: none;}
#marketing-man form .submit input {float: right; width: 192px; height: 32px; cursor: pointer; border: 0; padding: 0; outline: none;}
form input:focus, form textarea:focus {border-color: #E66D31; background-color: #F9F3D2;}
form div.req label {background: url('img/blt/tick-orange.jpg') no-repeat center right; padding-right: 10px; width: 90px;}
p.req {font-size: 14px; font-style: italic; font-family:georgia, times, serif; background: url('img/blt/tick-orange.jpg') no-repeat 0 5px; padding-left: 10px;}
p.req:first-line {font-weight: normal;}
