@charset "UTF-8";
/* CSS Document */

* { margin:0; padding:0; }

html, body { height:100%; }

	
body {
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light","Helvetica Neue", sans-serif;
	background: #ffffff;
	margin: 0px; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0px;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
}
.clear {clear:both }
a:hover, a:focus { outline: none; }



/* ######## MAIN #############
------------------------------------------------------------------ */
 /* half of container's height */
#distance { width: 100%; height: 38%; background-color:#fff; margin-bottom:-240px; float:left; position:relative; vertical-align:middle; }
#distance_index { width: 100%; height: 40%; background-color:#fff; margin-bottom:-282.5px; float:left; position:relative; vertical-align:middle; }

/* pos: rel puts container in front of distance */ 
#containerMain { margin:0 auto; text-align:left; position:relative; height:480px; width:960px; clear:left; background-color:#fff; }

/* pos: rel puts container in front of distance */ 
#containerIndex { margin:0 auto; text-align:left; position:relative; height:565px; width:100%; clear:left;  background: url(../_images/layout/bg_wood_large.gif) repeat-x;  }


/* ######## SUCCESS STORIES #############
------------------------------------------------------------------ */
div#containerMain div#success_slogan { width: 198px; float:left; margin: 93px 0px 0px 20px; text-transform:uppercase; font-size:24px; font-weight:800; letter-spacing: 2px; }
div#containerMain div#success_slogan div#strategy{ color:#00217f; }
div#containerMain div#success_slogan div#branding{ color:#427c42; }
div#containerMain div#success_slogan div#design{ color:#7c2000; }
div#containerMain div#success_slogan div#delivery{ color:#f4d13d; }


div#containerMain div#success_gallery { width: 760px; float:left; margin-top: 80px;}
div#containerMain div#success_gallery div.portfolio { width: 190px; float:left; margin: 0px; }


div#containerMain div#success_gallery div.portfolio a.gravis { display: block; width: 190px; height: 310px;  background: url(../_images/success/th_gravis.gif) no-repeat 0px 0px; color: #fff;}
div#containerMain div#success_gallery div.portfolio a.gravis:hover { background: url(../_images/success/th_gravis.gif) no-repeat 0px -310px;}

div#containerMain div#success_gallery div.portfolio a.royal { display: block; width: 190px; height: 310px;  background: url(../_images/success/th_royal.gif) no-repeat 0px 0px; color: #fff;}
div#containerMain div#success_gallery div.portfolio a.royal:hover { background: url(../_images/success/th_royal.gif) no-repeat 0px -310px;}

div#containerMain div#success_gallery div.portfolio a.razor { display: block; width: 190px; height: 310px;  background: url(../_images/success/th_razor.gif) no-repeat 0px 0px; color: #fff;}
div#containerMain div#success_gallery div.portfolio a.razor:hover { background: url(../_images/success/th_razor.gif) no-repeat 0px -310px;}

div#containerMain div#success_gallery div.portfolio a.aera { display: block; width: 190px; height: 310px;  background: url(../_images/success/th_aera.gif) no-repeat 0px 0px; color: #fff;}
div#containerMain div#success_gallery div.portfolio a.aera:hover { background: url(../_images/success/th_aera.gif) no-repeat 0px -310px;}

div.cs_logo { z-index:5; top: 0px; left:10px; position:absolute; }

 /* CAse Study Sub Nav */
div#containerMain ul#cs_nav { margin: 0px 0px 0px 10px; float:left;}
div#containerMain ul#cs_nav li {list-style: none; float: left; height: 38px; width: 106px; margin-right: 5px; padding: 0px; }
div#containerMain ul#cs_nav li.active { border: 0px solid #cccccc; height: 0px; width: 0px; visibility:hidden;}
div#containerMain ul#cs_nav li a {border: 1px solid #ddd; display: block; height: 0px; padding-top: 38px; overflow: hidden; color:#fff; font-size: 0px; line-height: 0px;}
div#containerMain ul#cs_nav li a:hover { color: #999999; border: 1px solid #999;}
div#containerMain ul#cs_nav li.active a {color: #dddddd;  border: 1px solid #ddd;}


div#containerMain ul#cs_nav li a#gravis { display: block; width: 106px; height: 38px;  background: url(../_images/success/cs_gravis.png) no-repeat 0px 0px;}
div#containerMain ul#cs_nav li a#royal { display: block; width: 106px; height: 38px;  background: url(../_images/success/cs_royal.png) no-repeat 0px 0px;}
div#containerMain ul#cs_nav li a#razor { display: block; width: 106px; height: 38px;  background: url(../_images/success/cs_razor.png) no-repeat 0px 0px;}
div#containerMain ul#cs_nav li a#aera { display: block; width: 106px; height: 38px;  background: url(../_images/success/cs_aera.png) no-repeat 0px 0px;}



/* ######## AGENTS #############
------------------------------------------------------------------ */

/* Agent Nav */
ul#agent_nav { margin: 0px; }
ul#agent_nav li {list-style: none; float: left; height: 20px; margin-right: 20px; padding: 10px; vertical-align: middle; }
ul#agent_nav li.active { background-color: #f0f0f0; border: 1px solid #ddd;}
ul#agent_nav li a { color: #aaa; font-size: 12px; text-decoration: none;}
ul#agent_nav li a:hover { color: #777;}
ul#agent_nav li.active a {color: #575757; }


/* Agent Display */
div#containerMain div#agent-content { width: 300px; float:left; text-align:left; margin: 50px 0px 0px 20px; padding-top: 20px;}
div#containerMain div#agent-content .agent-name { color:#00217f; font-size:24px;}
div#containerMain div#agent-content .agent-position { color:#00217f; font-size:12px;}
div#containerMain div#agent-content p { color:#757575; font-size:12px; line-height: 18px;}
       
div#containerMain div#agent-img { width; 600px; margin-top: 50px;}


/* ######## CONNECT #############
------------------------------------------------------------------ */
div#connect_img { width: 450px; float:left; margin-top: 70px;}

.blue { color:#00217f; }
.yellow { color:#f4d13d; }
.red { color:#7c2000; }
.green { color:#427C42 };

div#connect_content { width: 500px; float:left;}
div#connect_content div.location { float: left; text-align:left; margin: 20px 20px 20px 30px;}
div#connect_content div.location #title { text-transform:uppercase; font-size:36px; font-weight:500; text-align:left; padding: 0px;}
div#connect_content div.location .address { font-size: 14px; color:#757575; line-height: 16px;}
div#connect_content div.location .email a { font-size: 14px; color:#061835; line-height: 16px; font-weight:300; text-decoration:none; letter-spacing: 1px;}
div#connect_content div.location .email a:hover { color:#757575; }



/* ######## THOUGHTS #############
------------------------------------------------------------------ */
div#thoughts { padding: 0px; float:left; width: 718px; margin-top: 50px;}
div#thoughts p { font-size: 14px; line-height: 20px; color: #757575; padding: 20px;}
div#thoughts_slogan { font-size: 30px; font-weight:600; text-transform:uppercase; padding: 20px; letter-spacing: 2px;}
        

/* ######## ACCOLADES #############
------------------------------------------------------------------ */
div#accolades { padding: 0px; float:left; width: 718px;}
div#accolades p { font-size: 18px; line-height: 26px; color: #506696; padding: 20px;}
div#title { font-size: 50px; font-weight:600; text-transform:uppercase; padding-left: 20px; letter-spacing: 2px;}
        

/* ######## CLIENTS #############
------------------------------------------------------------------ */
div#clients { padding: 0px; float:left; width: 718px; margin-top: 50px;}
div#thoughts_slogan { font-size: 30px; font-weight:600; text-transform:uppercase; padding: 20px; letter-spacing: 2px;}
div#clients div.client_img { margin:10px; float:left;}

        

/* ######## FOOTER #############
------------------------------------------------------------------ */

#flahnav { margin:0 auto; position:relative; height:85px; width:100%; clear:left; background-image: url(../_images/layout/bg_wood.jpg); background-repeat: repeat-x; }

#footer_nav { margin:0 auto; position:relative; height:70px; width:100%; clear:left; background-color:#fff; border-bottom: 1px solid #ddd; }
#social_footer { width: 960px; margin: 0 auto; }
#social_footer .leftWrapperFooter { float: left; width: 200px; height: 50px;}
#social_footer .rightWrapperFooter { float: right; margin-top: 20px; }
ul.footerNav li { list-style: none; text-align:left; font-size:12px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light","Helvetica Neue", sans-serif; font-weight:300; height: 20px; border-bottom: 1px dotted #292929; padding: 5px 0 0 5px; margin: 0px 0px 0px -40px;}
ul.footerNav li a { color: #393939; text-decoration:none; }
ul.footerNav li a:hover { color: #999; text-decoration:none; }
#social_footer p {color: #393939; padding:0; text-align:left; font-family: "HelveticaNeue-Light", "Helvetica Neue Light","Helvetica Neue", sans-serif; font-weight:300; letter-spacing: 1px; font-size:12px; line-height: 16px;}

/* Social Links */
#social_footer .rightWrapperFooter ul#sociallinks { list-style: none; position: relative; height: 18px; }
#social_footer .rightWrapperFooter ul#sociallinks li { list-style: none; float: right; height: 18px; margin-right: 20px;}
#social_footer .rightWrapperFooter ul#sociallinks li a { display: block; height: 18px; font-family:Arial, Helvetica, sans-serif; font-size:10px; color:#666666; text-decoration:none; vertical-align:middle; line-height: 24px;}
#social_footer .rightWrapperFooter ul#sociallinks li.twitter { width: 86px;}
#social_footer .rightWrapperFooter ul#sociallinks li.twitter a { background: url(../_images/layout/icons/twitter_18x18.png) no-repeat top right; font-weight:900;}
#social_footer .rightWrapperFooter ul#sociallinks li.facebook { width: 105px;}
#social_footer .rightWrapperFooter ul#sociallinks li.facebook a { background: url(../_images/layout/icons/facebook_18x18.png) no-repeat top right; font-weight:900;}
#social_footer .rightWrapperFooter ul#sociallinks li.blog { width: 88px; }
#social_footer .rightWrapperFooter ul#sociallinks li.blog a { background: url(../_images/layout/icons/powerline_18x18.png) no-repeat top right;}
#social_footer .rightWrapperFooter ul#sociallinks li.linkedin { width: 92px;}
#social_footer .rightWrapperFooter ul#sociallinks li.linkedin a { background: url(../_images/layout/icons/linkedin_18x18.png) no-repeat top right; }
#social_footer .rightWrapperFooter ul#sociallinks li.skype { width: 103px;}
#social_footer .rightWrapperFooter ul#sociallinks li.skype a { background: url(../_images/layout/icons/skype_18x18.png) no-repeat top right; }
#social_footer .rightWrapperFooter ul#sociallinks li a:hover { background-position: bottom right; color: #08193a; }


/* KCRW */
a.kcrw { color: #00217f; padding: 15px; font-size: 14px; text-decoration: none; font-weight: bold;}
a.kcrw:hover { color: #ca813c; }


/* Sub Footer */

#footer { margin:0; position:relative; height: 100px; width:100%; background-image:url(../_images/layout/bg_footer.jpg); background-repeat: repeat-x;}
#footer .sub_footer { width: 940px; margin: 0 auto; padding-top: 10px;} 
#footer .sub_footer .copyright {color: #bcbcbc; font-size:10px; line-height: 22px; letter-spacing: 1px; margin:0px; }
#footer .sub_footer .copyright a { color: #bcbcbc; text-decoration: none; }
#footer .sub_footer .copyright a:hover { color: #e56b28; text-decoration: none; }
#footer .sub_footer ul#sub_nav { margin-left: 0px; margin-top: 0px; }
#footer .sub_footer ul#sub_nav li {list-style: none; float: left; height: 18px; margin-right: 20px; }
#footer .sub_footer ul#sub_nav li a { color: #aaa; font-size: 12px; text-decoration: none;}
#footer .sub_footer ul#sub_nav li a:hover { color: #777;}



.oneColElsCtrHdr #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}