/*******************
	Page Layout
********************/
body, html{ background: #dcdcdc; color: #707070; font: 14px Georgia, serif; text-align: left; line-height: 1.4em; overflow-x:hidden; }
#page-container{ width: 960px; margin: 70px auto;  }
	#header{ width: 100%; float: left; position: relative; }
		#navigator{ float: left; margin: 18px 0 0; padding: 0; font-size: 16px; }
		#navigator li{ display: block; float: left; list-style: none; margin-right: 30px; }
		#navigator li a{ color: #505050; text-decoration: none; }
		#navigator li a:hover, #navigator li.on a{ color: #df007a; }

		#logo{float: right;}
		#logo a{display: block; text-indent: -9999px; background: url("../../images/logo.gif") no-repeat right top; width: 188px; height: 58px; }
	#content{ width:100%; float: left; margin: 10px 0 40px; }
	html.ie6 #content{ width:100%; float: left; margin: 20px 0 30px; }

	#footer{ float: left; width: 100%; border-top: 1px solid #bdbcbc; padding: 10px 0; font-size: 12px; line-height: 1.3;}
		#footer dl{ float: left; margin: 0; padding: 0; color: #000000; }
		#footer dl dd,#footer dl dt{ float: left; padding: 0 2px 0 0; font-weight: bold;  }
		#footer dl dd{ margin: 0 20px 0 0; width:160px;}
		#footer dl dt{ width:12px;}
		#footer dl dd a{ color: #000000; text-decoration: none;  }

		#footer p{color: #9e9e9e; float: left; clear: left; margin: .5em 0 0 0; width: 400px;}
		#footer span, #footer strong{display: block;float: left;width: 196px;font-weight: normal;}
		#footer a{color: #9e9e9e; text-decoration: underline;}

		#footer a.client-login{ float: right; color: #df007a; font-size: 14px; text-decoration: none; }


	div.text{ width: 100%; float: left; margin-top: 25px; }


/*************************
	Site wide elements
**************************/
.inside{ padding:12px; }
.margin1{ margin: 1em 0; }
.margin2{ margin: 2em 0; }
.margin3{ margin: 3em 0; }
.margin4{ margin: 4em 0; }
.margin5{ margin: 5em 0; }

span.logo{ font-weight: bold;  }
span.logo strong{color: #df007a; }

h1{ font-size: 30px; color: #df007a; width: 700px; margin: 20px 0; }
h2{ font-size: 22px; color: #707070; width: 700px; margin: 0 0 20px; line-height: 1.3;}
h3{ color: #d20066; font-size: 14px; }
h4{ color: #000000; font-size: 14px; margin: 0 0 12px 0; }

form{ margin: 0; }

p, blockquote{ margin: 0 0 1em 0; }
a, a:hover{ color: #d20066; text-decoration: underline; }
a.rss{ background: url("../../images/icon-rss.jpg") no-repeat left center; padding: 2px 0 2px 15px; font-size: 11px; text-decoration: none; }
a.read-more{color: #000;font-size:12px;text-decoration: none;}

a.gray{color: #707070;text-decoration: none;}

ul.cols{ width: 960px; padding: 0; float: left; margin: 0;}
ul.cols li{ float: left; width: 240px; list-style: none; display: block; margin: 0; padding: 0; }
ul.cols li li{ float: none; width: auto; display: list-item; }

ul.cols h3{ color: #d20066; font-size: 14px; /* height: 40px; */ margin: 0; width: 210px; line-height: 1.3; }
ul.cols h3 span{ color: #707070; display: block; }

ul.cols p, ul.cols ul{ width: 210px; }



#paging{ float: left; clear: both; width: 100%; }
#paging h3{font-size: 14px; padding-top: 8px;  float: left;  }
#paging ul{ margin: 0; padding: 0 0 0 10px; font-size: 12px; float: left; width: 700px;  }
#paging ul li{ float: left; margin:0; display: block; list-style: none; margin-right: 4px; width: 18px; }
#paging ul li a{ float: left; width: 18px; height: 21px; display: block; padding-top: 1px; background:  url("../../images/icon-paging.gif") no-repeat top left; color: #ffffff; text-align: center; text-decoration: none;}
#paging ul li.on a{ background-image: url("../../images/icon-paging-on.gif"); }

form label{ float: left;display: block;width: 100%;clear: both;font-weight: normal;margin: 0 0 10px; }
form label span{float: left;display: block; margin: 0 0 5px 0;}
form label input, form label textarea, form label select{float: left;display: block;clear: left;margin: 0;}
form label input{width: 270px;}
form label input.name, form label textarea{width: 420px;}
#content form label input, #content form label textarea{background-color:#c9c9c9;border:1px solid #f1eff0; margin: 0; }
form input.submit{float: right;color: #df007a;background: none; border: none; padding: 0;font: 14px Georgia, serif; }

/***********
	Utils
************/
.hide{ display: none; }
.show{ display: block; }
.show_{ display: inline; }
.underline{ text-decoration: underline; }
.italic{ font-style: italic; }
.right{ text-align: right; }
.left{ text-align: left; }
.center{ text-align: center; }
.bold{ font-weight: bold; }
.bolder{ font-weight: bolder; }
.sstrike{ text-decoration: line-through; }
.floatRight{ float: right !important; }
.floatLeft{ float: left !important; }
hr{ clear:left; height:1px; color:#52564a; background-color:#52564a; border:0; }

.floatRightImg{ float:right; margin: 0 0 8px 8px; clear: right; }
.floatLeftImg{ float:left; margin: 0 8px 8px 0; clear: left; }

*, *:active, *:focus {outline: 0;outline-style: none;outline-width: 0px;-moz-outline-width: 0px;}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

/* about-us */
#about-us div.left{ width: 475px; float: left; margin-right: 25px; }
#about-us div.right{ width: 460px; float: left; }
#about-us div.right a { position: relative; float:left; text-decoration: none; }
#about-us div.right a h3 { position: absolute; top:0; left:0;  top:10px; left:20px;}
#about-us div.right a .play_icon { width: 31px; height: 30px; margin: 0 0 0 -15px; position: absolute; left: 50%; top: 118px; background: url(../../images/play_sized.png) center no-repeat;  z-index: 1; }


#about-us ul.cols li{ width: 210px; margin-right: 40px;}
#about-us ul.cols li a { position: relative; display: block; text-decoration: none; }
#about-us ul.cols li a .play_icon { width: 31px; height: 30px; margin: 0 0 0 -15px; position: absolute; left: 50%; top: 30px; background: url(../../images/play_sized.png) center no-repeat;  z-index: 1; }
#about-us ul.cols li.last{ margin-right: 0;}

#about-us ul.cols ul.aboutus-clients{ margin: 0; padding: 0; float: left; line-height: 1.3; width: 100%;}
#about-us ul.cols ul.aboutus-clients li{ display: block; list-style: none; float:left; width: 75px; margin: 0; padding: 0; }
#about-us ul.cols ul.aboutus-clients li.odd{ width: 135px; }

#about-us ul.cols{ margin-top: 50px; }

/* blog */
#blog{margin-top: 55px;}
#blog ul.posts{ width: 725px;  float: left; margin: 0 60px 0 0; padding: 0; }
#blog .sidebar{ float: left; width: 175px; }

#blog .posts li{ float: left; width: 725px; display: block; list-style: none; margin: 0 0 50px 0;  }
#blog .posts li li{ float: left; width: 700px; display: block; list-style: none;  }/*todo: reset here*/

#blog .posts .pic{ float: left; width: 250px; }
#blog .posts .entry{ float: left; width: 275px; padding: 0 35px 0 15px; margin: 0;  }
#blog .posts .meta{ float: left; width: 150px; font-size: 12px; }

#blog .posts .entry a.read-more{ color: #000000; font-size: 12px; }
#blog .posts .entry p{ margin: .5em 0;line-height: 1.3em; }
#blog .posts .entry h3{ margin: 0 0 1.3em 0; }

#blog .posts .meta p{ margin: 0; }
#blog .posts .meta a{ text-decoration: none; }


#blog .sidebar label{ display: block; width: 100%; }
#blog .sidebar label select{ width: 100%; }


/* case studies */
#case-studies{margin-top: 10px;}
#case-studies ul.tabs{ float: left; margin: 0; padding: 0; }
#case-studies ul.tabs li{ float: left; display: block; margin-right: 35px; list-style: none; font-size: 18px; }
#case-studies ul.tabs li a{ color: #707070; text-decoration: none; }
#case-studies ul.tabs li.on a,#case-studies ul.tabs li a:hover{ color: #df007a; }

#case-studies div.clip{float: left; margin: 50px 0 60px; padding: 0;}
#case-studies div.clip li{float: left; display: block; list-style: none; width: 100%; }
#case-studies div.clip div.info{float: left; width: 225px; font-size: 13px; }
#case-studies div.clip div.video{float: left; width: 475px; padding: 0 15px; position: relative; }
#case-studies div.clip div.video .play_icon { width: 31px; height: 30px; margin: 0 0 0 -15px; position: absolute; left: 50%; top: 127px; background: url(../../images/play_sized.png) center no-repeat;  z-index: 1; } 


#case-studies div.clip div.video-info{float: left; width: 225px; font-size:  11px; }

#case-studies div.clip div.info h3{ margin: 0 0 25px 0; }
#case-studies div.clip div.video-info dl{ width: 225px; line-height: normal;}
#case-studies div.clip div.video-info dt{ font-weight: normal;width: 102px; clear: left; background: url("../../images/dots.gif") repeat-x bottom; }
#case-studies div.clip div.video-info .s{ margin: 0 0 15px 0;  }
#case-studies div.clip div.video-info dt span{ background: #dcdcdc;  }
#case-studies div.clip div.video-info dd{ color: #df007a; width: 115px; padding-left: 3px; }
#case-studies div.clip div.video-info dd, #case-studies div.clip div.video-info dt{ margin: 0;  float: left; display: block;}

#case-studies ul.tabs-content{margin: 0;padding: 0;float: left;width: 100%;}
#case-studies ul.tabs-content li.tab{display: block;list-style: none;float: left;width: 100%;}

#case-studies .cols h3{ font-size:16px; }
#case-studies .cols li p,#case-studies .cols li h3,#case-studies .cols li blockquote{width: 220px;}

/* contact */
#contact{margin-top: 55px; }
#contact .contact-info{float: left;width: 510px;margin:0 15px 0 0; line-height: 1.6em; }
#contact .contact-form{ float: left; width: 435px; }

#contact textarea{height:120px; }

#contact .contact-info img.map{ float: right; margin: -40px 0 10px 10px; position: relative; }
#contact .contact-info div.clearfix{ margin-bottom: 20px; }
html.ie6 #contact .contact-info div.clearfix{ margin-bottom: 12px; }

/* directors */
#directors{margin-top: 50px;}
#directors .cols li{ line-height: 1.3; }
#directors .cols li img{ width: 100%; margin-bottom: 10px; }
#directors .cols li h3{ font-size: 17px;margin-bottom: .6em; }
#directors .cols li h3 span{ font-size: 12px; color: #000; }
#directors .cols li ul{ padding-left: 17px; }
#directors .cols li li{ list-style: disc; }


#directors #paging{margin-top: 40px;}
/*#directors #paging{float: right;margin-top: 30px;width: 100%; clear:both;}*/
/*#directors #paging li, #directors #paging h3, #directors #paging ul{float: right;}*/

/* news */
#news{ margin-top: 0; }
#news .news{margin: 0;padding: 0;float: left;width: 100%;}
#news .news li{float: left;clear: both;display: block;list-style: none;margin: 0 0 30px 0; width:655px;}

#news .news li .story{float: right;padding: 0;width: 420px;margin:0 0 0 15px;}
#news .news li .pic{float: left;padding: 0;width: 220px;margin: 0;}

#news .news li.detailed{width: 950px;}
#news .news li.detailed h3{font-size: 18px;}
#news .news li.detailed h3 span{font-size: 14px;}
#news .news li.detailed .story{float: left;width: 480px;margin: 0 15px 0 0; }
#news .news li.detailed .pic{float: left;width: 455px;}

#news .news li p{margin:0;}
#news .news li.detailed a.read-more{color: #000;font-size:12px;}
#news .news li h3{ font-size: 14px;}
#news .news li h3 span{ font-size: 12px;display: block;color: #707070;}
#news .news li.detailed h3{ font-size: 18px;}

#news .archive{float: left;width: 100%;}
#news .archive h3 a{text-decoration: none;}
html.ie6 #news .archive{padding-top: 30px; }
html.ie6 #news .archive #paging h3{margin: 0;}

#news .archive #paging{margin: 10px 0 0;}

#news p{line-height: 1.3em;}

/* news open */
#news-open{margin-top: 0;line-height: 1.3;}
#news-open .news-item{float: left;width: 960px;}
#news-open .news-item .story{float: left;width: 560px;margin-right: 40px;}
#news-open .news-item .pic{float: left;width: 360px;}
#news-open .news-item .pic img{margin-bottom: 10px;}

#news-open .news-item h3{ font-size: 18px; margin-bottom: 20px;}
#news-open .news-item h3 span{ font-size: 14px; color: #707070; display: block; }

#news-open .nav{float: left;margin: 70px 0 0; width: 490px; padding: 0;}
html.ie6 #news-open .nav{margin-top: 45px; }
#news-open .nav li{float: right;display: block;list-style: none;padding: 0 4px; color: #df007a;}
#news-open .nav li a{text-decoration: none;}
#news-open .nav li.back{float: left;}

/* portfolio */
#portfolio .cols h3{font-size: 17px; margin: 10px 0; }
#portfolio .cols{margin-top:40px;}
#portfolio .cols li{height: 285px;overflow:hidden; position: relative;}
#portfolio .cols li .play_icon { width: 31px; height: 30px; margin: 0 0 0 -15px; position: absolute; left: 50%; top: 36px; background: url(../../images/play_sized2.png) center no-repeat;  z-index: 1; }

#portfolio .cols .film h3, #portfolio .filters li.film a{ color: #00a79d; }
#portfolio .cols .corp h3, #portfolio .filters li.corp a{ color: #b56c30; }
#portfolio .cols .comm h3, #portfolio .filters li.comm a{ color: #662d91; }
#portfolio .filters li.all a{ color: #df007a; }

#portfolio .filters{margin: 0;padding: 0;float: left;}
#portfolio .filters li{float: left;display: block; margin-right: 25px; color: #000; }
#portfolio .filters li.label{padding-top: 2px;}
#portfolio .filters li a{font-size: 18px; }
#portfolio .filters li a{font-size: 18px; text-decoration: none; }
#portfolio .filters li.off a{color: #999999;}

#portfolio #paging{margin-top: 20px;}
/* homepage */
#home{top: -10px; position: relative;margin-top: 0;margin-bottom: -20px;}
html.ie6 #home{top: -20px; position: relative;margin-top: 0;margin-bottom: -20px;}
#home .flash{float: left;width: 100%;margin-bottom: 35px;}
#home h3{font-size: 22px; margin-bottom: 15px; }
#home .news{float: left;width: 560px;}
#home .contact{ float: left; width: 400px; }

#home .news dl{width:100%;margin: 0;padding: 0;}
#home .news dt{color: #999999; width: 105px; clear: left; }
#home .news dd{color: #000000; width: 400px; }
#home .news dd a{color: #000000; text-decoration: none; }
#home .news dt, #home .news dd{float: left;display: block;margin: 0;padding: 2px 0;font-weight: normal;}

#home .contact p{float: left;width: 50%;line-height: 1.5em;}
#dummy{display:none;}

/*  selectbox  */

.altselect-wrap {position: relative;}
.altselect-wrap span.altselect-display{display: block;width: 163px!important;background: url("../../images/arrow-down.gif") no-repeat 96% 50%!important; border: 1px solid #ababab!important; cursor: default;color: #707070!important;padding: 2px 5px!important;font: 14px Georgia, serif;}
.altselect-wrap ul{position: absolute;width: 100%;margin: 0;padding: 0;top: 23px;left:0;}
.altselect-wrap ul li{display: block;float: left;background: #dcdcdc; border: 1px solid #ababab;width: 163px;padding: 1px 5px;font-size: 12px;color: #707070!important;margin-top: -1px;cursor:default;}
.altselect-wrap ul li.hover{background: #bbb!important;}
.altselect-wrap ul li.selected{color: #000!important;background: #ccc!important;}

/* Homepage Flash Movie Replacement */
#homepage{ width:960px; float:left; height:594px; margin-bottom:35px; }
		#intro{ width:920px; float:left; padding:20px; }
		.ie6 #intro, .ie7 #intro{ padding-bottom:0px; }
			#intro a{ display:block; float:right; width:456px; border:8px solid #000; }
			#intro div{ margin-left:7px; color:#fff; font-size:150%; width:420px; line-height:120%; margin-bottom:20px; }
			#intro img{ display:block; }
		#homepage ul{ margin:0 0 0 16px; width:944px; float:left; padding:0; }
		.ie6 #homepage ul{ margin:0 0 0 8px; }
		#homepage ul li{ margin:0; padding:8px; list-style:none; float:left; width:282px; color:#fff; background-color:#000; height:235px; }		
		#homepage ul li.middle{ margin:0 16px 0 15px; }
		#homepage ul li h2{ font-size:160%; margin:0; padding-left:10px; color:#df007a; width:auto; }
		#homepage ul li p{ margin:5px 0; line-height:normal; padding-left:10px; color:#727272; }
		#homepage ul li a{ text-decoration:none; color:#000; }
		#homepage ul li a:hover{ text-decoration:underline; }
		#homepage ul li a.more{ padding-left:10px; }

/* Social */
#social{
    position:relative;
    top:-60px;
    width:200px;
    float:right;
    }
#social ul{ list-style:none;margin:0;padding:0;}
#social ul li{}
#socail ul li a{}