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

/* Font inclusion
   --------------------------------------------------- */
	
	@font-face {
		font-family: FreeSans;
		font-style:  normal;
		font-weight: normal;
		src: url(/site_media/fonts/FreeSans0.eot);	
	}
	
/*	@font-face {  
	  font-family: FreeSans;  
	  src: url(/site_media/fonts/FreeSans.ttf) format("truetype");  
	} 	*/
	
/* Base overrides
   --------------------------------------------------- */
	body { margin-top: 15px; font-family: Arial, Helvetica, sans-serif; color: #3b3b3b; }
	img { display: block; }
	.box-shadow { -moz-box-shadow: 4px 4px 10px #b8b8b8; -webkit-box-shadow: 4px 4px 10px #b8b8b8; }
	blockquote { margin: 0 0 1em; font-style:normal; }
	
/* Headings
   --------------------------------------------------- */	
	h1 { color:#ff4800 !important; font-size:2.5em; font-weight:bold; letter-spacing:-0.04em; padding:0; margin-bottom: 20px; line-height: 1em; }
	h1.image { margin-bottom: 0; }
	h2 { color:#3B3B3B;  font-size:1.5em; font-weight:bold; line-height:1em; padding: 0; margin: 0; }
	h1 a { color:#ff4800 !important; }
	h1 a:hover { color:#7f7f7f !important; text-decoration:none !important; }
	a { color:#ff4800; font-weight: bold; text-decoration: none; }
	a:hover { text-decoration: underline; }
	#main #right-panel h2 { font-family: Helvetica, Arial, sans-serif; font-weight: bold; font-size: 1.4em; color:#3b3b3b; padding-bottom:26px; margin-bottom:0; margin-top:17px; background: url('/site_media/img/bg-h2.gif') bottom left no-repeat; background-position: bottom right; line-height: 1;  }
	#main #right-panel h2 a { color:#3b3b3b; }
	#subnav { height: 60px; background: url('../img/header-line.gif') repeat-x bottom left; margin-bottom: 10px; }
	#main #subnav a, #main #subnav a:hover { text-decoration:none; }
	#subnav div { display: inline-block; width: auto; height: 40px; line-height: 1; font-family: Helvetica, Arial, sans-serif; font-weight: bold; font-size: 18px; color: #3a3a3a; margin: 12px 0 0 0; padding: 0; } 
	#subnav h1 { width: auto; height: 40px; font-weight: bold; font-size: 18px; color: #ff4800;  }
	#subnav span { height: 50px; background: url('../img/bg-h1.gif') no-repeat center 40px; display: inline-block; }
	#subnav div.title { margin-right: 30px; float: left; }
	#subnav .prevnext { height: 30px; float: right; font-size: 13px; text-align: right; padding-top: 3px; }
	#subnav .prevnext ul { margin: 0; padding: 0; }
	#subnav .prevnext ul li { margin: 0; padding: 0; list-style: none; float: left; }
	#subnav .prevnext span { background: none; margin: 0 10px 0 7px; }
	#subnav img#subnav-divide { margin: 0 10px 0 7px; }
	#subnav .prev {padding-left: 20px; background: url('../img/prev-arrow.gif') left 4px no-repeat; }
	#subnav .next { padding-right: 20px; background: url('../img/next-arrow.gif') right 4px no-repeat; }
	#homepage h1 { font-family: Helvetica, Arial, sans-serif; font-weight: bold; font-size: 2.2em; color: #3b3b3b; letter-spacing: -0.06em; margin:0; padding-bottom:0.1em; background:none; background-position: bottom right; }
	h3 { font-family: Helvetica, Arial, sans-serif; font-weight: bold; font-size: 2.2em; color: #3b3b3b; letter-spacing: -0.04em; }
	#footer h2 { font-family: Helvetica, Arial, sans-serif; font-weight: bold; font-size: 2.2em; color: #3a3a3a; margin-bottom: 5px; letter-spacing: -0.06em; }
	
/* Header
   --------------------------------------------------- */
	#header { height: 82px; margin-bottom: 10px; }	
	#header a img#citrus-logo { position:absolute; }
	ul#header-share-icons { float: right;padding: 0; margin: 0; margin: 0 25px 0 0; list-style: none; list-style-type: none; }
	ul#header-share-icons li { padding: 0; margin: 0; float:left; margin-right: 5px; list-style: none; list-style-type: none; }
	ul#header-share-icons li.twitter a { background: url('../img/header-icon-twitter-a.png') top left no-repeat; width:22px; height:22px; display: block; }
	ul#header-share-icons li.twitter a:hover { background: url('../img/header-icon-twitter-b.png') top left no-repeat; width:22px; height:22px; display: block; }
	ul#header-share-icons li.fb a { background: url('../img/header-icon-fb-a.png') top left no-repeat; width:24px; height:22px; display: block; }
	ul#header-share-icons li.fb a:hover { background: url('../img/header-icon-fb-b.png') top left no-repeat; width:24px; height:22px; display: block; }
	ul#header-share-icons li.email a { background: url('../img/header-icon-email-a.png') top left no-repeat; width:22px; height:22px; display: block; }
	ul#header-share-icons li.email a:hover { background: url('../img/header-icon-email-b.png') top left no-repeat; width:22px; height:22px; display: block; }
	ul#header-share-icons li.heart a { background: url('../img/header-icon-heart-a.png') top left no-repeat; width:22px; height:22px; display: block; }
	ul#header-share-icons li.heart a:hover { background: url('../img/header-icon-heart-b.png') top left no-repeat; width:22px; height:22px; display: block; }
	img#shadow-top { float: right; }
	div#header-right { float:right; width: 790px; margin: 27px 0 0;}

    #header p {
        color: #ff4800;
        font-size: 1.4em;
        font-weight: bold;
    }


/* Navigation LHS
   --------------------------------------------------- */
	#nav-lhs { color: #3b3b3b; margin-right: 0!important; }
	#nav-lhs ul { margin: 0; border-top: 1px solid #3b3b3b; padding: 21px 0 21px 0; width: 190px; }
	#nav-lhs li { margin: 0; padding: 0; list-style: none; margin: 2px 0 35px; }
	#nav-lhs li { position: relative; margin-bottom: 2px; height: 26px; }
	#nav-lhs li.blog { margin-bottom: -4px; height: 32px; }
	#nav-lhs a { color: #3b3b3b; text-decoration: none; display: block; z-index: 2000; position: relative; }
	/*#nav-lhs a:hover,*/ #nav-lhs a.hover { background: #e6e6e6; }	
	#nav-lhs span { background: #e6e6e6; display: block; position: absolute; top: 0; left: 0; height: 23px; z-index: 100; }
	#nav-lhs p { margin-top: 36px; padding: 20px 0 50px; border-top: 3px solid #bebec0; border-bottom: 3px solid #bebec0; font-size: 1.5em; line-height: 1.2em; letter-spacing: -0.05em; color: #666666 }

/* Shadow Container
   --------------------------------------------------- */	
	#shadow-container { background: url("../img/bg-shadow-01.jpg") repeat-y scroll left top transparent; padding: 6px 0 0 20px; } 
	

/* Main Content
   --------------------------------------------------- */	
	#main { padding: 21px 0 20px 0; border-top: 1px solid #3b3b3b; min-height: 392px; }
	#main-inline { margin: 7px 0 12px 21px; }
	#main p, #main-inline p {  }
	#main a, #main-inline a { color: #ff4800; font-weight: bold; text-decoration: none; }
	#main a:hover, #main-inline a:hover { text-decoration: underline; }
	#main h3 a, #main-inline h3 a { color: #3b3b3b; }
	#main h3 a:hover, #main-inline h3 a:hover { color: #ff4800; }
	#main .tags, #main-inline .tags { }
	#main .tags ul, #main .tags li, #main-inline .tags ul, #main-inline .tags li { margin: 0; padding: 0; list-style: none; }
	#main .tags ul, #main-inline .tags ul { overflow: auto; }
	#main .tags li, #main-inline .tags li { float: left; margin-right: 0.5em; }	
	#main img.staff { margin-right: 10px; margin-bottom: 10px;}
	#main h2, #main-inline h2 {margin: 0}
	#main h4, #main-inline h4  {margin-bottom: 0}
	.no-margin {margin: 0;}	
	div.no-heading-col { margin-top: 44px; }
	
	.inner-content { padding: 0 20px;}
	
	
/* Homepage
   --------------------------------------------------- */	
	#homepage { height: 445px; }
	#homepage dl{ margin: 0; }
	#homepage dl dt { color: #ff4800; font-weight: bold; font-size: 1.4em; font-family: Helvetica, Arial, sans-serif; margin-bottom: 85px; }
	#homepage dl dd { margin: 0; }
	#homepage ul, #homepage li { list-style: none; margin: 0; padding: 0; }
	#homepage ul li a { color: #7f7f7f; text-decoration: none; font-weight: bold; }
	#homepage ul li a:hover { text-decoration: underline; }

	

/* Homepage Columns
   --------------------------------------------------- */
   	#news-feeds { margin: 0px 0 15px; }
	#news-feeds .divide, #footer .divide { background: #fff url("../img/bg-col-news-feed.gif") no-repeat left top;}
	#homepage #news, #footer .col2 { margin-right: 0; padding: 0 14px 0 0;}
	#homepage #working-on, #footer .col3 { margin-right: 0; padding: 0 14px; }
	#homepage #now-showing, #footer .col4 {  margin-right: 0; padding: 0 0 0 14px;}
	#homepage #now-showing ul li a {  font-size: 1.4em;  font-family: Helvetica, Arial, sans-serif; }
	#homepage #now-showing ul li a:hover { color: #ff4800; text-decoration: none; }
	#homepage #news dd { margin-bottom: 0.5em; }
	#homepage img.news-feed-img { position:absolute; margin: 54px 0 0 -18px; }
	#news-feeds .span-4 { border: 0; }
	#news-feeds img { border: 2px solid #fff; -moz-box-shadow: 0 5px 15px 0px #5f5f5f; -webkit-box-shadow: 0 0 5px 5px#5f5f5f; box-shadow: 0 0 5px 5px #5f5f5f; margin-bottom: 15px; }
	#news-feeds h2 { font-family: Helvetica, Arial, sans-serif; font-weight: bold; font-size: 2.2em; color: #3a3a3a; margin-bottom: 10px; letter-spacing: -0.06em; }
	#news-feeds h3 { font-family: Helvetica, Arial, sans-serif; font-weight: 
bold; font-size: 1.5em; color: #ff4800; margin-bottom: 10px; letter-spacing: -0.02em; }

/* Work List
   --------------------------------------------------- */
	ul.ul-work-list { margin: 0; padding: 0; margin-bottom: 30px; }
	ul.ul-work-list li { float: left; list-style: none; width: 221px; margin-right: 15px; margin-top: 20px; }
	ul.ul-work-list li.right {margin-right: 0; } 
	ul.ul-work-list li img {width: 221px; height: 171px; }
	ul.ul-work-list li span {background: #bebec0; color: #fff; display: block; padding: 5px 20px; font-size: 1.4em; font-weight: bold; }
	
	ul.ul-work-list a:hover span { text-decoration:underline; }
	div#client-copy { margin: 15px 0;}

/* Work List
   --------------------------------------------------- */
	ul.ul-client-list { margin: 0; padding: 0; }
	ul.ul-client-list li { float: left; list-style: none; position: relative; width: 124px; height: 124px; margin-right: 18px; margin-top: 28px; }
	ul.ul-client-list li.right { margin-right: 0; } 
	ul.ul-client-list li img { width: 124px; height: 124px; }
	ul.ul-client-list li .portfolio-flag { position: absolute; top: -0; left: -3px; }
	ul.ul-client-list li .portfolio-flag a { display: block; width: 127px; height: 127px; background: url(../img/client-list-flag.gif) no-repeat top right; }
	
	div#portfolio-page { }
	div#portfolio-page h1 { margin-left: 20px; }
	ul#portfolio-list { margin:0; padding:0; }
	ul#portfolio-list li { margin:0; padding:0; list-style: none; float: left; margin: 0 10px 10px 0; width: 180px; height: 180px; }
	ul#portfolio-list li.last { margin-right: 0; }
	
	ul#portfolio-list li img.img-off { position:absolute; z-index: 10; }
	ul#portfolio-list li img.img-on { position:absolute; }
	

/* Work List
   --------------------------------------------------- */

	#aboutpage .leader { padding: 15px 0 0; }
	#aboutpage .leader.first { padding: 5px 0; border: none; }
	#aboutpage .leader img { width: 100px; height: 100px; float: left; background-color:#CCCCCC; margin-right: 10px; }
	#aboutpage .leader p {  }
	#aboutpage .leader div.title { margin: 0; padding: 0; float: left; width: 220px; margin-bottom: 12px; }
	#aboutpage h2 { color: #3B3B3B; font-size: 1.5em; font-weight: bold; padding: 5px 0 15px; line-height: 1em; }
	#aboutpage h3{ color: #f16523; font-size: 1.4em; display: block; font-weight: bold; margin: 65px 0 0 0; padding: 0; font-weight: bold;}
	#aboutpage h4 { color: #f16523;  font-size: 1.1em; font-weight: normal; }

/* Brands
   --------------------------------------------------- */
   
   div#brands { background: #232323 url("../img/bg-our-clients.png") no-repeat left top; height: 101px; margin-bottom: 10px; }
   
   div#brands ul#brands-list { margin-left: 116px; width: 634px; }
   div#brands ul#brands-list li { list-style: none; float:left; margin: 0; padding: 0; color: #fff; }
   div#brands ul#brands-list li a { color: #fff; }


/* Blog detail
   --------------------------------------------------- */
/*	h3 { margin: 0; font-weight: normal} */
	
/* Footer
   --------------------------------------------------- */	
	#footer { padding: 0 0 50px; }	
	#footer a { color: #ff4800; font-weight: bold; text-decoration: none; }
	#footer a:hover { text-decoration: underline; }
	#footer .connect ul, #footer .connect ul li { list-style: none; margin: 0; padding: 0; }
	#footer .connect ul.tabs { margin-bottom: 1em; }
	#footer .connect ul.tabs li { float: left; margin-right: 5px; }
	#footer .connect ul.tabs li.last {  margin-right: 0; }
	#footer .connect ul.tabs li a { display: inline-block; }
	#footer .connect .twitter ul li { margin-bottom: 1em; font-weight: bold; font-size: 0.9em; }
	#footer .connect .twitter ul li span { display: block; color: #333333; font-weight: normal; }
	#footer .connect .twitter ul li img {float:left; border:1px solid #666; margin:0 5px 3px 0;}
	#footer .connect div.panes .facebook { display: none; }
	#footer ul.tabs li.twitter a { background: #fff url("../img/bn-twitter-a.png") no-repeat left top; height: 24px; width: 24px; }
	#footer ul.tabs li.twitter a.current, #footer ul.tabs li.twitter a:hover { background: #fff url("../img/bn-twitter-b.png") no-repeat left top; }
	#footer ul.tabs li.facebook a { background: #fff url("../img/bn-fb-a.png") no-repeat left top; height: 24px; width: 24px; }
	#footer ul.tabs li.facebook a.current, #footer ul.tabs li.facebook a:hover { background: #fff url("../img/bn-fb-b.png") no-repeat left top; }
	#footer ul#jobs-list { margin: 0; padding: 0!important; margin: 0 0 5px 0!important; }
	#footer ul#jobs-list li { margin: 0; padding: 0; list-style: none; }
	p.join { margin-bottom: 5px; }
	div.footer-spacer { height: 18px; display: block; background: #bbbbbb; border-left: 1px solid #9f9f9f; border-right: 1px solid #9f9f9f; }
	#footer .span-4 { border: none; }
	
/* Blog
   --------------------------------------------------- */	
	#blog h3 { margin-bottom: 2px; }
	#blog h3 a:hover { text-decoration:none; }
	#tags a { display:inline-block; margin-right:0.5em; }
	ul.recent-posts { color:#7f7f7f !important; }
	ul.archives { margin-left:0 !important; }
	ul.archives li { list-style-type:none; }
	#blog em { color:#7f7f7f !important; font-style:normal; }
	#blog { color:#3b3b3b; }
	#blog .posted-by { border-bottom:1px solid #bebec0; padding-bottom:1em; margin-bottom:2em; margin-top:1em; }
	#blog .posted-by a:hover { color:#ff4800; text-decoration:none; }
	#blog img { -moz-box-shadow: 4px 4px 10px #b8b8b8; -webkit-box-shadow: 4px 4px 10px #b8b8b8; margin-bottom:10px; display:block; max-width:540px; }
	
/* Service
   --------------------------------------------------- */
   
   #services-page h3 { margin: 0; color:#3B3B3B; font-size:1.5em; font-weight:bold; line-height:1em; padding: 0 0 10px; border-bottom: 1px solid #9d9d9d; letter-spacing: -0.04em; }
   #services-page ul { margin-top: 5px; }
   #services-page ul li { list-style:square; }
   #services-page ul li.filler { list-style:none; }   

/* Contact
   --------------------------------------------------- */
   div#contact-page ul#address { margin: 0; padding: 0; margin-bottom: 15px; }
   div#contact-page ul#address li { list-style-type: none; }
   div#contact-page ul#address li.phone { list-style-type: none; margin-top: 10px; }
   div#contact-page dl { margin: 0; padding: 0; margin-bottom: 10px; }
   div#contact-page dl dd { margin: 0; padding: 0;}
   div#contact-page dl dd a { margin: 0; padding: 0; color: #ff4800; }
   ul.google { font-size: 0.9em; margin: 0!important; padding: 0!important; }
   ul.google { list-style-type: none;}
   ul.google li.phone { list-style-type: none; margin-top: 4px; }
   div#map_canvas { height: 350px; width: 330px; }
   
	
/* Side Panel
   --------------------------------------------------- */
	#right-panel a:hover { text-decoration:none; color:#ff4800; }
	
	
/* Client Detail
   --------------------------------------------------- */
	#client-detail { margin: 0 0 0 0; }	
	#client-detail h2 { margin: 0; padding: 0; color:#ff4800; font-weight: bold; font-size: 3em; margin: 0 0 15px 20px; letter-spacing: -0.04em; }	
	#client-info { border-top: 1px solid #3b3b3b; padding: 10px 20px 20px 20px; margin: 5px 0 0 0; }
	
	
/* Job Description
   --------------------------------------------------- */
   
   div#job-detail h2 { margin-bottom: 15px; }
   div#job-detail dl { margin: 0; padding: 0; margin-bottom: 10px; }
   div#job-detail dl dd { margin: 0; padding: 0;}
   div#job-detail dl dd a { margin: 0; padding: 0; color: #ff4800; }
   
   
/* New Blog
   --------------------------------------------------- */
   body#blog-new { padding: 0; margin: 0; width: 100%; background:url('../img/bg-blog-topleft.gif') top left no-repeat, url('../img/bg-blog-btmright.gif') right 1313px no-repeat; overflow:auto; }
   div.blog-container { width: 660px;  margin: 0 auto; background:transparent; overflow:auto; color:#757575; }
   div.blog-container div.post a { color: #2297F2; }
   div.blog-container h1 a:hover { text-decoration: underline!important; color: #ff4800!important; }
   
   div.blog-container div#main-blog { float:left; width:460px; }
   div.blog-container div#sidebar { float:right; width:150px; }
   div.post { border-bottom:1px dotted #CCCCCC; margin-bottom: 40px; padding-bottom: 35px; }
   div.post-date-author p { font-size: 1em; margin-bottom: 10px; color: #999999; }
   
	div#main-blog label { font-weight:bold; color:#f4783d; }
	div#main-blog #comments input[type=text], div#main-blog #comments textarea { border:1px solid #ccc;
		-moz-border-radius:0.5em; -webkit-border-radius:0.5em; -border-radius:0.5em;
		box-shadow:inset 0px 7px 10px rgba(0,0,0,0.15);
		-moz-box-shadow:inset 0px 7px 10px rgba(0,0,0,0.15);
		-webkit-box-shadow:inset 0px 7px 10px rgba(0,0,0,0.15);
		background-clip: padding-box;
		-webkit-background-clip: padding-box;
	}
	div#main-blog input[type=submit] { background:#f36e2e; border:none; color:#fff; font-weight:bold; padding:0.25em 0.5em; }
   
   div.share { border-bottom:1px dotted #CCCCCC; margin-bottom: 40px; padding-bottom: 35px;  } 
   
   #sidebar ul { border-bottom:1px dotted #CCC; list-style:none outside none; margin:0 0 1.5em; padding:0 0 1.5em; }
   #sidebar li { list-style: none; font:1.0em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif; letter-spacing:0.1em; margin:0; padding:0 0 0.25em 15px; text-indent:-15px; text-transform:uppercase; }
   #sidebar p { color:#666; line-height:0.7em; }
   #sidebar a, #sidebar a:link, #sidebar a:hover { font:0.8em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif; color:#2297F2; text-decoration:none; }
   #sidebar h3, #sidebar h4 { color:#999999; font:0.9em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif; letter-spacing:0.2em; margin:1.5em 0 0.75em; text-transform:uppercase; } 


    div.paging ul li {
        float: left;
        padding-left: 5px;
        list-style: none;
    }
div#news-feeds p a,
div#news-feeds h3 a { 
    color:  #ff4800;
}