/***** Typography *****/
@font-face 
{
    font-family: 'TradeGothicBold';
    src: url('../fonts/tradegothicltstd-bd2-webfont.woff?b704fc0d1c87') format('woff'),
         url('../fonts/tradegothicltstd-bd2-webfont.ttf?b704fc0d1c87') format('truetype'),
         url('../fonts/tradegothicltstd-bd2-webfont.svg#TradeGothicBold') format('svg');
    font-weight: normal;
    font-style: normal; 
}

@font-face 
{
    font-family: 'TradeGothicLight';
    src: url('../fonts/tradegothicltstd-light-webfont.woff?b704fc0d1c87') format('woff'),
         url('../fonts/tradegothicltstd-light-webfont.ttf?b704fc0d1c87') format('truetype'),
         url('../fonts/tradegothicltstd-light-webfont.svg#TradeGothicLight') format('svg');
    font-weight: normal;
    font-style: normal; 
}


p.hero {
	font-size: 16px;

}
p.hero strong { font-family: 'TradeGothicBold'}


.contact-info i { margin:1px 5px 0 0; }
.contact-info { border-top: 0 solid rgba(50,50,50,.9); padding:20px; background-color:rgb(0,0,0); background:black url('../img/bg-texture-dark.gif?b704fc0d1c87') -20% top repeat; }
.contact-info ul { margin:0; padding:0; color:white; list-style:none; }
.contact-info ul li a { display:inline-block; list-style:none; font-family:'TradeGothicLight', Helvetica, Arial, sans-serif; position:relative; margin:0px 20px 40px 0;  color:white !important; -webkit-transition:all .3s ease-out; -moz-transition:all .3s ease-out; transition:all .3s ease-out; }
.contact-info ul li a:hover, footer ul li:hover { opacity:1; text-decoration:underline; }
.contact-info .address { text-transform:uppercase; }
i.phone {  background:url('../img/phone-icon.png') left top no-repeat; background-size:14px 14px; vertical-align: text-top; width:14px; height:14px;  display:inline-block; }
i.mail {  background:url('../img/mail-icon.png') left top no-repeat; background-size:14px 14px; vertical-align: text-top; width:14px; height:14px;  display:inline-block; }
i.location {  background:url('../img/location-icon.png') left top no-repeat; background-size:14px 14px; vertical-align: text-top; width:14px; height:14px;  display:inline-block; }
i.fb {  background:url('../img/fb-icon.png') left top no-repeat; background-size:14px 14px; vertical-align: text-top; width:14px; height:14px;  display:inline-block; }
i.pk {  background:url('../img/pk-icon.png') left top no-repeat; background-size:14px 14px; vertical-align: text-top; width:14px; height:14px;  display:inline-block; }
#wufoo-z7x3p9 {
	position: relative;
	top: -45px;
}

/** Containers **/
body { background:url('/static/img/bg-texture-gray.jpg?b704fc0d1c87') fixed repeat; color:rgb(50,50,50); font-family:'adelle', serif; -webkit-transform-style:flat; }
body p { font-family:'adelle', serif; }
body, html { height:100%;}
/** Footer **/
.push { height: 59px; }
body#project .push  { height:118px; }
.wrapper { min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -59px; }
.wrapper > .container { padding-top: 18px;  }
/* Page Overrides */
body#project .wrapper > .container { padding-top:48px; }
body#projects .wrapper > .container { padding-top:48px; }
body#clients .wrapper > .container { padding-top:48px; }
body#home .wrapper > .container { padding-top: 0px; margin-bottom: 0; }
body#culture .wrapper > .container { padding-top: 0px; margin-bottom: 0; }

footer i { margin:1px 5px 0 0; }
footer { border-top: 1px solid rgba(50,50,50,.9); padding:20px 0px 20px 0px; background-color:rgb(0,0,0); background:black url('../img/bg-texture-dark.gif?b704fc0d1c87') -20% top repeat; }
footer ul { margin:0; padding:0; color:white; list-style:none; }
footer ul li a { display:inline-block; list-style:none; font-family:'TradeGothicLight', Helvetica, Arial, sans-serif; position:relative; margin:0px 20px 0px 0; float:left; color:white !important; -webkit-transition:all .3s ease-out; -moz-transition:all .3s ease-out; transition:all .3s ease-out; }
footer ul li a:hover, footer ul li:hover { opacity:1; text-decoration:underline; }
footer .address { text-transform:uppercase; }
i.phone {  background:url('../img/phone-icon.png') left top no-repeat; background-size:14px 14px; vertical-align: text-top; width:14px; height:14px;  display:inline-block; }
i.mail {  background:url('../img/mail-icon.png') left top no-repeat; background-size:14px 14px; vertical-align: text-top; width:14px; height:14px;  display:inline-block; }
i.location {  background:url('../img/location-icon.png') left top no-repeat; background-size:14px 14px; vertical-align: text-top; width:14px; height:14px;  display:inline-block; }


/*** Full Screen Elements */
.full-screen { overflow: hidden; position:relative; min-height:300px; }


/***** Shadows *****/
.shadow {  -webkit-box-shadow:  0px 0px 12px 0px rgba(0,0,0,.5); /* Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ */ -moz-box-shadow: 0px 0px 12px 0px rgba(0,0,0,.5); /* FF3.5 - 3.6 */ box-shadow:   0px 0px 12px 0px rgba(0,0,0,.5); /* Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 */  }



/* Navigation */
.navbar-fixed-top { position:static !important; z-index:100; border-bottom: 1px solid rgba(50,50,50,.9); }
.navbar-inner {  min-height:60px; background:black url('../img/bg-texture-dark.gif?b704fc0d1c87') left top repeat; }
.navbar .brand span {
	display: block;
	height: 35px;
	width: 143px;
	text-indent: -9000em;
	color: #ffffff;
	margin-top: 4px;
	background-image: url(../img/logo.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}
.navbar .brand:hover { text-decoration: none; opacity:1; }
.navbar .nav > li > a {  padding:0 20px; font:normal 18px/60px 'TradeGothicLight', Helvetica, Arial, sans-serif; text-transform:uppercase; color:rgb(180,180,180); -webkit-transition:all .3s ease-out; -moz-transition:all .3s ease-out; transition:all .3s ease-out; }   
.navbar .nav > li > a:hover, .navbar .nav > li > a.active { color:white; background-color:transparent !imporant; }
.navbar .nav .active > a, .navbar .nav .active > a:hover { background-color:transparent;}
.navbar .btn, .navbar .btn-group { margin-top: 15px; }
.btn-navbar {  opacity:.7; -webkit-transition:all .3s ease-out; -moz-transition:all .3s ease-out; transition:all .3s ease-out; }
.btn-navbar:hover, .btn-navbar:active  { opacity:1; }   
.navbar .nav > li > a, .navbar .dropdown-menu a { border-radius:0; }



/* Text Styles */
h1, h2, h3 {
	font-family:Verdana, Geneva, sans-serif;
	font-weight:normal;
	font-style:normal;
	text-transform:uppercase;
}
h4 { font-family:'TradeGothicLight', Helvetica, Arial, sans-serif;  font-weight:normal; font-style:normal; }
hr { border-bottom:1px solid rgb(200,200,200); margin:29px 0; }
hr.no-margin {margin:0;}
hr.margin-hide { border-bottom:1px solid rgb(200,200,200); margin:14px 0; }
.projecttitle { margin-top: 10px; font-weight: bold; color: #999}
.service-text { padding: 10px 0px 20px 0px }
.clients { font-size: 12px }
.hardware { color: #666; }



/* Background Image Magic */
#about-container { position:relative; }
#about-container .tagline { position:absolute; top:30%;}
.backdrop { z-index:0; position:relative; overflow:hidden; height:100%; width:100%; margin:0; padding:0; -webkit-transform-style:preserve-3d; }
.backdrop li { margin:0; padding:0; position:absolute; height:100%; width:100%; background-repeat:no-repeat; background-position:center center; background-attachment:fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
.backdrop li { opacity:0;  -webkit-transition:opacity 1s ease-out; -moz-transition:opacity 1s ease-out; transition:opacity 1s ease-out; }
.backdrop li.active { opacity:1; }


/* Home */
body#index { background:black; }
div.tagline { position:absolute; top:40%; font:normal 24px/30px 'TradeGothicBold', sans-serif; text-transform:uppercase; z-index:5; }
div.tagline h2 {
	font:normal 24px/24px 'TradeGothicBold', sans-serif;
	background-color:rgb(235,135,76);
	color:white;
	width:375px;
	padding:6px 0 3px 25px;
	text-rendering:auto;
}
div.tagline.not-found h2 { width:280px; }
div.tagline h3 {
	font:normal 24px/24px 'TradeGothicBold', sans-serif;
	background-color:rgb(102,51,0);
	color:white;
	padding:3px 4px 6px 25px;
	text-rendering:auto;
}



/***** Clients *****/
body#clients h2.hero { font:normal 24px/32px 'TradeGothicBold', Helvetica, sans-serif; text-transform:uppercase; margin:10px 0 40px; background:url('/static/img/clients/02-clients-enquotes.png?b704fc0d1c87') right bottom no-repeat; text-shadow: 0 -1px 0 rgba(250,250,250 0.5), -1px 0 0 rgba(250,250,250 0.5) ; }
i.openquote { display:inline-block; width:40px; height:40px; margin-right:8px; background:url('/static/img/clients/01-clients-openquotes.png?b704fc0d1c87') left top no-repeat; }
body#clients h3.credit {float:right; text-align:left; color:black; margin:-20px 0 0 }
body#clients h3.credit:before { content:" - "; margin-left:-10px;}
body#clients h3 { font:normal 18px/24px 'TradeGothicLight', Helvetica, sans-serif; text-transform:uppercase; color:rgb(0,180,248);text-align:center; margin:40px auto; }



/* Culture */
body#culture { overflow: hidden; background:black; }
.instagrams { background:black;  overflow: hidden; }
body#culture > .wrapper > .container { margin:0; }
body#culture .thumbnails { margin-left:0px;   }
body#culture .float2 { position:relative; float:left; width:160px; margin:0px; }
body#culture .float2 { opacity:0;  }
body#culture .float2.active { opacity:1; }
body#culture > .wrapper > .container.mgrams { margin-bottom:59px; }
.carousel-inner { background:black; }



/* Projects */
body#project .row {margin-bottom:30px;}

body#project h2 a { color:black; -webkit-transition:all .3s ease-out; -moz-transition:all .3s ease-out; transition:all .3s ease-out; }
body#project h2 a:hover { color:rgb(0,180,248) !important; text-decoration:none !important;}
body#project .float4 { position:relative; float:left; max-width:270px; }
.thumbnail { border:none;padding:0; border-radius:0; opacity:.85; box-shadow:none; -webkit-transition:all .15s ease-out; -moz-transition:all .15s ease-out; transition:all .15s ease-out; }
.thumbnail:hover { opacity:1; }
.thumbnail .caption { height:100px; padding:9px 0; display:block; }
body#project img {display:block; margin:0 auto; }
body#project img { max-width:100%; }
body#project img.ipad-image { padding-top:44px;}

.margin-hide { margin:14px 0; }

.phone-only { display:none; }

body .hero-lead img { width:100%; }

body#trailer h3 { margin-bottom:20px;}

body#project .rider { margin-top:4%;}

body#projects .nav-pills { font-family:'TradeGothicLight', Helvetica, Arial, sans-serif;  text-transform: uppercase; }
body#projects .project { color:black; width:190px; opacity:;}
body#projects .project img { width:100%; }
body#projects .project .caption { height:auto; border-bottom:1px solid #ccc; }
body#projects .project h3 { font-size:14px; line-height:1.5em;}
body#projects .project h4 { font-size:12px; }
body#projects ul.project-cats { font-family:'TradeGothicLight', Helvetica, Arial, sans-serif; font-size:10px; text-transform: uppercase; list-style:none; margin:0;  padding:0;  margin-bottom:2em; }
body#projects ul.project-cats li.active a { font-weight:bold; }
body#projects .project-nav h4 { border-top:1px solid gray; padding-top:8px; font-size:12px; text-transform: uppercase; }


body#contact .hero-lead { width:100%; max-height:300px; overflow:hidden; }
body#contact .hero-lead img { width:100%; }
body#contact .boss { margin-bottom:24px; }
body#contact .leadership { margin-bottom:18px; }
body#contact .hero-image { width:100%;}
body#contact .the-team { margin-bottom:59px; margin-top:18px; }
 h2.hero {font:normal 30px/40px 'TradeGothicBold', Helvetica, sans-serif; text-transform:uppercase; text-shadow: 0 -1px 0 rgba(250,250,250 0.5), -1px 0 0 rgba(250,250,250 0.5); margin-bottom:24px; }
 h3 { font:normal 24px/32px 'TradeGothicBold', H

/***** About *****/
body#about .hero-lead { width:100%; max-height:300px; overflow:hidden; }
body#about .hero-lead img { width:100%; }
body#about .boss { margin-bottom:24px; }
body#about .leadership { margin-bottom:18px; }
body#about .hero-image { width:100%;}
body#about .the-team { margin-bottom:59px; margin-top:18px; }
 h2.hero {font:normal 30px/40px 'TradeGothicBold', Helvetica, sans-serif; text-transform:uppercase; text-shadow: 0 -1px 0 rgba(250,250,250 0.5), -1px 0 0 rgba(250,250,250 0.5); margin-bottom:24px; }
 h3 { font:normal 24px/32px 'TradeGothicBold', Helvetica, sans-serif; text-transform:uppercase; font-style:normal; font-weight:normal; color:rgb(0,180,248); }

body#about .capability { font-size:14px; }

body#about h3.capabilities { margin-bottom:10px; }
body#about h3 { font:normal 15px/20px 'TradeGothicBold', Helvetica, sans-serif; }
body#about p.capabilities-list {  font:normal 14px/22px 'TradeGothicLight', Helvetica, sans-serif;  }
body#about h4 { font:normal 16px/20px 'TradeGothicBold', Helvetica, sans-serif; text-transform:uppercase; margin:10px 0; }
body#about h4.jack {margin-top:0; font:normal 16px/20px 'Adelle', Helvetica, sans-serif; text-transform:none; } 
body#about img { margin:0 14px 0 0; }  
.team { margin-top:40px; }
body#about .hero-image { width:100%; position:relative; height:300px; overflow:hidden; text-align:center; }
body#about .hero-image img { max-width:none; width:100%; position:absolute; }
body#about p.capabilities-list { font-size:12px; }
body#about .jack { margin-bottom:2px; }
body#about .nameplate { margin-bottom:12px; }  



/* 404 Page */
.not-found { text-align:center; display:table-cell; vertical-align: center; }
.not-found h1 { font-size:200px; line-height:1em;}


/***** iPad, iPhone, & TV Carousel Galleries *****/
.carousel-control { position: absolute; border:none; background:none; width:auto; top:350px; }
.carousel-control.right { right:6px;  }
.carousel-control.left { left:11px; }



.ipad { width:571px; height:748px; background:url('/static/img/carousel/6col-ipad.png?b704fc0d1c87'); }
.ipad-inner { margin:0; position:absolute; top:73px; left:65px; width:440px; height:589px;  overflow:hidden; z-index:2;  }   
.ipad .carousel-control.left { left:24px;  }
.ipad .carousel-control.right { right:28px;  }


.iphone { position:relative; width:371px; height:738px; background:transparent url('/static/img/carousel/4col-iphone.png?b704fc0d1c87') left top no-repeat; }
.iphone-inner { position:absolute;  margin:0; position:absolute; top:17.5%; left:8.5%; width:313px; height:469px; overflow:hidden; z-index:2; }
.iphone .carousel-control.right {  }
.iphone .carousel-control.left {  }
.nomargin { margin-left:0px; }
/* Default */

.fluid--video-wrapper {                 
		: 100%;                              
		position: relative;                       
		padding: 0;                            
		}                                                                                   
		.fluid--video-wrapper iframe,        
		.fluid--video-wrapper object,        
		.fluid--video-wrapper embed {           
		position: absolute;                       
		top: 0;                                   
		left: 0;                                  
		: 100%;                              
		height: 100%;                          
		}               


body div.desktop-only { display:none; }

@media (min-width: 1200px)
{
	body div.desktop-only { display:block; }	
	.tv { width:1170px; height: 700px; background:url('/static/img/carousel/12col-tv.png?b704fc0d1c87'); }
	.tv-inner { margin:0; position:absolute; top:30px; left:41px; width:1090px; height:615px;  overflow:hidden; z-index:2;  }  	
	.tv .carousel-control.right { right:10px; }
	hr.mobile-only { border:none; display:block; height:30px; margin:0; }
}


@media (max-width: 1200px)
{
	.navbar-fixed-top a { position:relative; }

	.iphone { width:300px; height:597px; overflow: hidden; background-repeat:no-repeat; -webkit-background-size: 300px 597px; -moz-background-size: 300px 597px; -o-background-size: 300px 597px; background-size: 300px 597px;}
	.iphone-inner { top:104px; left:25px; width:254px; height:380px; }
	.ipad { width:460px; height:603px; overflow: hidden; background-repeat:no-repeat; -webkit-background-size: 460px 603px; -moz-background-size: 460px 603px; -o-background-size: 460px 603px; background-size: 460px 603px;}
	.ipad-inner { top:58px; left:52px; width:356px; height:476px; }	
	
	.carousel-control { font-size:44px; top:280px; }
	.carousel-control.right { right:6px;  }
	.carousel-control.left { left:10px; }
	hr.margin-hide { margin:11px 0; }
	hr.mobile-only { border:none; display:block; height:21px; margin:0; }
	body div.desktop-only { display:block; }

}


@media (max-width: 980px)
{
	.navbar-fixed-top { margin-bottom:0;  }
	.navbar-fixed-top .nav-collapse.pull-right {  float:none; margin-left:-5px; margin-right:-5px;  }
	.navbar-fixed-top.navbar .navbar-inner { padding-bottom:0; }
	.navbar-fixed-top.navbar .nav { margin-bottom:0; }
	.navbar-fixed-top.navbar .nav > li { border-top:1px solid #222;  }
	.navbar-fixed-top.navbar .nav > li > a { padding-top:2px; padding-bottom:0; line-height:2em; font-size:16px; margin-bottom:0; }	
	
	body#projects .thumbnails li { width:280px;}
	body#projects .thumbnails li img { width:100%; }	
	body#project img {display:block; margin:0 auto; }
	body#project img { max-width:100%; }
	
	body#project img.ipad-image { padding-top:28px;}

	.span6wide { display:none !important; }
	.nomargin { margin-left:30px; }
	
	hr.mobile-only { border:none; display:block; height:21px; margin:0; }
	hr.margin-hide { margin:9px 0; }

	body div.desktop-only { margin-right:-30px !important; }

	.carousel-control { top:210px; }

	.iphone { width:228px; height:454px; overflow: hidden; background-repeat:no-repeat; -webkit-background-size: 228px 454px; -moz-background-size: 228px 454px; -o-background-size: 228px 454px; background-size: 228px 454px;}
	.iphone-inner { top:79px; left:19px; width:192px; height:288px; }
	body#project .iphone .carousel-control.left { margin-left:-2px; font-size:32px; }
	body#project .iphone .carousel-control.right { margin-right:-2px; font-size:32px; }

	.ipad { width:352px; height:461px; overflow: hidden; background-repeat:no-repeat; -webkit-background-size: 352px 461px; -moz-background-size: 352px 461px;  -o-background-size: 352px 461px; background-size: 352px 461px;}
	.ipad-inner { top:44px; left:40px; width:273px; height:363px; }		
	body#project .ipad .carousel-control.left { margin-left:-10px; font-size:32px; }
	body#project .ipad .carousel-control.right { margin-right:-11px; font-size:32px; }	
}

@media (max-width: 767px)
{
	footer ul span { display:none; }
	
	.full-screen { margin-left:-20px !important; }
	#about-container { margin-left:-20px; }
	footer { margin-left:-20px; margin-right:-20px; padding-left:20px; }
	body#project h2 {margin-bottom:20px;}
	body#project h4 {margin-bottom:20px;}	
	
	body#project img.ipad-image { padding-top:0px;}

	hr.hide {display:block;  }
	hr.big-margin { margin:70px 0; }
	hr.margin-hide { margin:28px 0; }
	hr.mobile-only { height:0; border-bottom:1px solid rgb(200,200,200); margin:29px 0; }
	body div.desktop-only { display:none !important; }

	body div.desktop-only { display:none; }
	body div.device-bottom-margin { margin-bottom:18px !important; }
	body .device-center { text-align:center;  width:100%; display:block; margin:0; }
	body .device-center .carousel {  margin:0 auto; float:none; }	

	.tv { max-width:570px !important; max-height:324px !important;  }
	.carousel-control.tv-control-left  { display:none !important; }
	.carousel-control.tv-control-right  {display:none !important; }	
	body div.device-bottom-margin { margin-bottom:18px !important; }
}

@media (max-width: 480px)
{
	.full-screen { margin-left:-20px !important; }
	.phone-only { display:block; }
	
	footer ul span { display:none; }

	div.tagline { width:230px; }
	div.tagline h2, div.tagline h3 { font-size:14px; line-height:1em;  }
	div.tagline h2 { width:190px; }

	#about-container .tagline { position:absolute; top:45%;  }	
	body div.desktop-only { display:none; }
	hr.margin-hide { margin:29px 0; }
	
	.iphone { width:192px; height:288px; overflow: hidden; background:none; }
	.iphone-inner { top:0px; left:0px; width:192px; height:288px; }

	.ipad { width:280px; height:374px; overflow: hidden; background:none; }
	.ipad-inner { top:0; left:0; width:280px; height:374px; }

}