@import url(fonts.css);
	
	* {
	 margin: 0; 
	 padding: 0; 
	 font-size: 100%;
	}

	body{
	 background: #ffffff url(/images/bg.jpg) repeat-x center top;
	 height:100%;
	 margin:0px;
	 padding:0px;
	}

	body, tr, td, input, select, textarea { 
	 font:small/150% Arial, 'Trebuchet MS', Verdana, Helvetica, sans-serif;
	 color: #343433;	 
	}	
	
       .printonly {
         display:none;
       }

	.required { color:Red; padding:0px; font-size: 100%;}

/* ////////////////////////////////// */
/* page containers */
	
	div.container {
	 width: 994px; 
	 margin: 0px auto;
	 padding: 0px;
	 position: relative;
	}	
	
	.parentWrap{
	   position:relative;
	   width: 994px;
	   color:#2D2A28;
	   margin: 0px;
	   padding: 0px;	   
	} 

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

	.parentWrap:after {
	   content: "."; 
	   display: block; 
	   height: 0; 
	   clear: both; 
	   visibility: hidden;
	}	
	
	.contentWrap{
	   position:relative;
	   float:left;
	   display:inline;
	   clear:both;	   
	}

/* HEADLINES AND PARAGRAPHS: =headlines
----------------------------------------------- */			

	h1 { 
	background: url(/images/titlesquare.png) no-repeat left 3px;
    color: #333333;
    display: block;
    font-family: CopperplateGothicBoldRegular;
    font-size: 13px;
    font-weight: normal;
    height: 15px;
    letter-spacing: 2px;
    line-height: 13px;
    margin: 25px 0 17px;
    padding: 2px 0 0 18px;
	}
	
	h2 { 
	   margin: 0px;
	   padding: 0px;
	   font-size: 125%; 
	   margin: 0px 0px 10px 0px;

	}
	
	h3 { 
	   margin: 32px 0px 6px 0px;
	   padding: 0px;
	   font-size: 115%;
	}
	
	p {
	   margin: 0px 0px 18px 0px;
	   padding: 0px;
	   line-height: 140%;
	   font-size: 12px;
	}
	
	div {
	   line-height: 140%;
	   font-size: 12px;
	}	
		

	hr {
	   color: #ebf3ec;
	   height: 1px;
           clear: both;		
	   margin: 10px 0px;
	   padding: 0px;
	   text-align:left;
	}
	
	img.photo {
	   padding: 4px;
	   margin: 0px 0px 4px 0px;
	   border: 3px solid #e3e3e3;	  
	}
			
	div.caption {
	   float: right;	   
	   font-size: 85%;
	   line-height: 110%;
	   text-align: center;
	   width: 267px;
	   margin: 14px 28px;	   
	   padding: 0px;
	}
	


	div.nextprevious, div.back, div.explore, div.category, div.exploreCat {
	  float: right;	  
   	  text-transform: small-caps;
   	  color: #333333;
	  font-family: 'Copperplate Light', 'Copperplate Gothic Light', Trebuchet, Arial, sans-serif;
	  font-size: 12px;
	  margin: 25px 5px 0px 0px;
	  padding: 0px;	    
	}
	
	div.bottom {
	  margin: 0px 5px 0px 0px;	    
	}	
	
	div.nextprevious {  
	  width: 122px;
	  
	}
	
	div.explore {  
	  width: 155px;	  
	}
	
	div.exploreCat {  
	  width: 158px;	  
	}	
	
	div.back {  
	  width: 179px;	  
	  margin-left: 30px;
	}
	
	div.category {  
	  width: 0px;
	  overflow: hidden;
	}	
	
	div.nextprevious a, div.nextprevious a:visited, div.nextprevious a:hover, div.nextprevious a:link, div.explore a, div.explore a:visited, div.explore a:hover, div.explore a:link, div.back a, div.back a:visited, div.back a:hover, div.back a:link, div.category a, div.category a:visited, div.category a:hover, div.category a:link {
	  color: #333333;
	  text-decoration: none;	   	  
	}
	
	
	

	div.explore a span{
	  position: absolute;
	  background: url(/images/hand_exploreprojects.png) no-repeat left top;
	  width: 155px;
	  height: 20px;
	}
	
	div.explore a:hover span{
	  position: absolute;
	  background: url(/images/hand_exploreprojects.png) no-repeat left -20px;
	  width: 155px;
	  height: 20px;
	  cursor: pointer;
	}
	
	
	div.exploreCat a span{
	  position: absolute;
	  background: url(/images/hand_explorecategory.png) no-repeat left top;
	  width: 172px;
	  height: 20px;
	}
	
	div.exploreCat a:hover span{
	  position: absolute;
	  background: url(/images/hand_explorecategory.png) no-repeat left -20px;
	  width: 172px;
	  height: 20px;
	  cursor: pointer;
	}
	
	
	div.nextprevious a span{
	  position: absolute;
	  background: url(/images/hand_nextprojects.png) no-repeat left top;
	  width: 122px;
	  height: 20px;
	}
	
	div.nextprevious a:hover span{
	  position: absolute;
	  background: url(/images/hand_nextprojects.png) no-repeat left -20px;
	  width: 122px;
	  height: 20px;
	  cursor: pointer;
	}
	

	

	div.back a span{
	  position: absolute;
	  background: url(/images/hand_backa-z.png) no-repeat left top;
	  width: 179px;
	  height: 20px;
	}
	
	div.back a:hover span{
	  position: absolute;
	  background: url(/images/hand_backa-z.png) no-repeat left -20px;
	  width: 179px;
	  height: 20px;
	  cursor: pointer;
	}
	
	
	
	div.category a span{
	  position: absolute;
	  background: url(/images/hand_nextcategory.png) no-repeat left top;
	  width: 132px;
	  height: 20px;
	}
	
	div.category a:hover span{
	  position: absolute;
	  background: url(/images/hand_nextcategory.png) no-repeat left -20px;
	  width: 132px;
	  height: 20px;
	  cursor: pointer;
	}
	
	
	
	.blue {
	  color: #2e69b3;
	  font-weight: bold;
	}
		
  /**----Unordered List Styles--------------------------------------------------*/
  
     
       ul {
	 list-style-position: outside;
	 list-style-type: square;
	 margin: 0px;
	 padding: 0px 0px 10px 0px; 
       } 
       
       ol {
	 margin: 0px;
	 padding: 0px 15px 10px 15px; 
       }
       
       ul li, ol li {
         margin: 0px 0px 0px 14px;
         padding: 0px 0px 6px 0px; 
         line-height: 125%; 
       }
       
  /**/
		
	
/* HEADER BAR: =header
----------------------------------------------- */
			
	div.header { 	   
	   height: 107px;
	   width: 994px;
	   margin: 0px;	
	   padding: 0px;
	   clear: both;
	   background: url(/images/blueline.png) no-repeat left bottom;	  
	}
	
	div.header img#logo { 
	   position: absolute;
	   top: 14px;
	   left: 4px;
	   width: 173px;
	   height: 83px;
	}
	 	
	img.tagline {
	   display: block;
	   margin: 8px 0px 37px 13px;
	   padding: 0px;
	}	 
	 	
	img.taglineFull {
	   display: block;
	   margin: 8px 0px 37px 7px;
	   padding: 0px;
	}
	
	#topRight {
	   position: absolute;
	   right: 12px;
	   top: 18px;
	}
	
	#topRight span.image {
	   position: absolute;
	   right: 0px;
	   top: 2px;	
	   background: #ffffff url(/images/phone.png) no-repeat top left;
	   width: 204px;
	   height: 16px;
	}	
	
	#topRight span.studio {	   
	   color: #0071bc;
	   margin: 2px 0px 0px 0px;
	   padding: 0px 14px 0px 0px;
	}
	
	
	#topRight span.phone {	   
	   color: #333333;
	   margin: 2px 0px 0px 0px;
	   padding: 0px;
	}	
	
	
/* LINKS: =links
----------------------------------------------- */
	
	a { 	    
	   color: #2e67b2; 
	   text-decoration: underline;
	}
	
	a:hover { 
	   color: #1a5199;
	   text-decoration: none;	   
	}
	
	a:visited { 
	   color: #2e67b2;
	   text-decoration: underline;
	}	
	
	a img { 
	   border: none; 
	}	

		
		
/* CONTENT/COLUMNS: =contentWrap class
----------------------------------------------- */
			
	#baseContent {	   
	   width:772px;
	   margin: 0px 5px 0px 0px;
	   padding: 0px;
	   clear:none;
	}
			
	#wideContent {	   
	   width:984px;
	   margin: 0px 5px 0px 6px;
	   padding: 0px;
	   clear:none;
	}		

/* FOOTER: =footer
----------------------------------------------- */
	
	div.footerContainer {
	   margin: 0px;
	   padding: 0px 0px 600px 0px;
    	   clear:both;		   
	}
	
	div#footer { 
	   width: 994px;
	   margin: 0px auto;
	   padding: 0px;
    	   clear:both;			   
	}
	
	div#footerInfo 	{ 
	   background: url(/images/blueline.png) no-repeat 0px 19px;
	   margin: 0px;
	   padding: 0px;
 	   width: 994px;
 	   position:relative;
	   float:left;
	   display:inline;
	   clear: none;
	}
	
	div#footerInfo p { 
	   padding: 0px 0px 14px 0px;
	   margin: 0px;
 	   text-align: left;
	   color: #999999;
	   font-size: 11px;
	}	
	   
	   

/* REPLACE FIXES: =replace
----------------------------------------------- */	
	
	/* 
	 * Image replacement using the Gilder/Levin IR technique 
	 * http://www.ryznardesign.com/pages/web_page_coding/gilder_levin_ir_mac/gilder_levin_ir_mac_2.html
	 */		
	.replace { 
		position: relative;
		/* hide overflow: hidden from mac ie5 \*/
		overflow: hidden;
		
		/* end hide from mac ie5 */
	}
	.replace span {
		display: block;
		position: absolute;
		top: 0px; left: 0px;
		z-index:1; /*for Opera 5 and 6*/
	 }
	.replace a { display:block; cursor: pointer; }
	a.replace { cursor: pointer; }
	
	
	/*
	 * "How To Clear Floats Without Structural Markup" -
	 * http://www.positioniseverything.net/easyclearing.html
	 */
	 .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
	 .clearfix 	 { display: inline-block; }  


	/* Holly Hack Targets IE Win only \*/
	* html .clearfix {height: 1%;}
	.clearfix {display: block;}
	/* End Holly Hack */

/* ////////////////////////////////// */
/* HOME */


	div.homeFlash {
	  float: left;
	  margin: 0px 12px 36px 0px;
	}


/* ////////////////////////////////// */
/* Projects A-Z */


	table.az {
	  width: 100%;
	  padding:0px;
	  margin: -2px 0px 10px 0px;
	}
	
	table.az td {
	  width: 20%;
	  padding:0px;
	  margin:0px;
	}
	
	
	table.az td ul{
	  list-style: none;
	  margin: 0px;
	}	
	
	table.az td ul li{
	  margin: 0px;
	  padding: 0px 0px 8px 0px;
	  font-size: 12px;
	}	
	
	table.az td ul li a, table.az td ul li a.visited {
	  color: #333333;
	  text-decoration: none;
	}	
	
	table.az td ul li a:hover {
	  color: #2e67b2;
	}	

/* ////////////////////////////////// */
/* ContactForm */

	textarea.ContactTextBox {
	  width: 280px;
	}

/* ////////////////////////////////// */
/* GALLERY POP UP: =gallery pop up
----------------------------------------------- */
   			
	#overlay {
	     display: block;
	     top: 0px;
	     left: 0px;
	     width: 100%;
	     height: 100%;
	     background: #000;
	     opacity: 0.60;
	     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
	     filter: alpha(opacity=60);
	     -moz-opacity: 0.32;
	     z-index: 14;
	}

	#popupOne {
	     display: block;
	     background: #000000;
	     top: 0px;
	     left: 0px;
	     margin: 0px;
	     padding: 0px;	     
	     text-align: center;
	     z-index: 15;
	     color: #ffffff;
	     cursor: pointer;
	}
	

	
	#popupOne a:hover {
	     text-decoration: none;
	}
	
	
div#rotator {
	position: relative;
	padding: 0px;
	height: 579px;
	overflow: hidden;
}

div#rotator ul {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}

div#rotator ul li {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
	float:left;
	position:absolute;
	list-style: none;
}

/* videos page style starts here */

#animations-video-placeholder{
  width: 772px;
  height: auto;
  margin: 35px auto 125px auto;
}

#player-container,#player-container_wrapper{
  background: #000;
  width: 650px;
  height: auto;
  overflow: hidden;
  margin: 0 auto 54px auto;
  height:389px;
}

#player_wrapper,#player1_wrapper{
  background: #000;
  width: 650px;
  height: auto;
  overflow: hidden;
  margin: 0px auto 0px auto;
  height:389px;
}

#video-thumbs{
  width: 685px;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
}
    #video-thumbs .thumb{
      width: 106px;
      height: auto;
      float: left;
      margin-left: 38px;
    }
    #video-thumbs .thumb:first-child{
      margin-left: 0;
    }
    
  
        #video-thumbs .thumb .image{
        }
        #video-thumbs .thumb .text{
          display: block;
          text-align: center;
          font-size: 11px;
          text-decoration: none;
          margin-top: 9px;
          color: #0F0F0F;
        }

.thumb a{
  display: block;
  width: 106px;
  height: 106px;
  overflow: hidden;
  text-indent: 1000px;
  white-space: nowrap;
}

.thumb a:hover{
  background-position: 0 -106px;
}


.thumb .demo{
  background: transparent url(../../UserFiles/Image/animationshome/thumb-demo.png) no-repeat 0 -212px;
}

.thumb .architecture{
  background: transparent url(../../UserFiles/Image/animationshome/thumb-architecture.png) no-repeat 0 -212px;
}

.thumb .engineering{
  background: transparent url(../../UserFiles/Image/animationshome/thumb-engineering.png) no-repeat 0 -212px;
}

.thumb .interiors{
  background: transparent url(../../UserFiles/Image/animationshome/thumb-interiors.png) no-repeat 0 -212px;
}

.thumb .featured{
  background: transparent url(../../UserFiles/Image/animationshome/thumb-featured.png) no-repeat 0 -212px;
}

#video-thumbs .playing{
  background-position: 0 0px !important;
}


/* videos page style ends here */