@font-face {
    font-family: 'TektonProBold';
    src: url('fonts/tktnbold-webfont.eot');
    src: url('fonts/tktnbold-webfont.eot#iefix') format('embedded-opentype'),
         url('fonts/tktnbold-webfont.svg') format('svg'),
         url('fonts/tktnbold-webfont.woff') format('woff'),
         url('fonts/tktnbold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'TektonProBoldObl';
    src: url('fonts/tktnboldobl-webfont.eot');
    src: url('fonts/tktnboldobl-webfont.eot#iefix') format('embedded-opentype'),
         url('fonts/tktnboldobl-webfont.svg') format('svg'),
         url('fonts/tktnboldobl-webfont.woff') format('woff'),
         url('fonts/tktnboldobl-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'TektonProCnd';
    src: url('fonts/tktnpro-cond-webfont.eot');
    src: url('fonts/tktnpro-cond-webfont.eot#iefix') format('embedded-opentype'),
         url('fonts/tktnpro-cond-webfont.svg') format('svg'),
         url('fonts/tktnpro-cond-webfont.woff') format('woff'),
         url('fonts/tktnpro-cond-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
* { margin: 0; padding: 0; outline: 0; }

body, html { height: 100%; }

/* P {text-align: center;
	font-family: arial, sans-serif;
	text-transform: uppercase;
	color: #60d5d9;
} */

body {
    font-size: 14px;
    line-height: 24px;
    font-family: arial, sans-serif;
    color: #a3a3a3;
    background: url('images/bg-pattern-texture.png') #fff;
    min-width: 1246px;
}

a { color: #60d5d9; text-decoration: none; cursor: pointer; }
a:hover { text-decoration: underline; }
a img { border: 0; }
ul { list-style: none; }
                                   
label {
	float: left;
	width: 100%;
}
input, textarea, select { 
	font-size: 12px; 
	font-family: arial, sans-serif; 
	width: 90%;
	height: 5px;
	padding: 10px;
	background-color: transparent;
	border: 1px solid #ccc;        
}
textarea { 
	overflow: auto; 
	height: 50px;
}            

input.error {
	border: 1px solid #e73c2f;
}

input[type=submit] {
	height: 35px;
	padding: 5px 0 5px 0;
	border: none;
	background-color: #60d5d9;
	color: #fff;
	text-transform: uppercase;   
	width: 95%;
}          

#contact-game { display: none; }

.post-content form label {
	padding-bottom: 10px;
}

.post-content p.confirmation {
	padding-top: 20px;
	text-align: center;
	font-size: 30px;
	color: #60d5d9;      
	width: 95%;
	font-family: 'TektonProCnd', arial;
}

.cl { display: block; height: 0; font-size: 0; line-height: 0; text-indent: -4000px; clear: both; }
.notext { font-size: 0; line-height: 0; text-indent: -4000px; }
.left, .alignleft { float: left; display: inline; }
.right, .alignright { float: right; display: inline; }

.shell { width: 930px; margin: 0 auto; }

.container { width: 100%; background: url('images/ribbon-top.png') center 0 no-repeat; }
.container-inner { width: 100%; padding-bottom: 140px; background: url('images/ribbon-bottom.png') center bottom no-repeat; }

h2 { font-family: 'TektonProCnd', arial; font-size: 40px; line-height: 40px; color: #60d5d9; font-weight: normal; }
h3 { font-family: 'TektonProCnd', arial; font-size: 24px; line-height: 24px; color: #878787; text-transform: uppercase; font-weight: normal; }
h4 { font-size: 9px; line-height: 9px; color: #bbb; font-weight: normal; }
h5 { font-family: 'TektonProCnd', arial; font-size: 30px; line-height: 30px; color: #FF3399; text-transform: uppercase; font-weight: normal; }
h6 { font-family: 'TektonProCnd', arial; font-size: 30px; line-height: 30px; color: #60d5d9; font-weight: normal; }
h7 { font-family: 'TektonProCnd', arial; font-size: 40px; line-height: 40px; color: #FF3399; font-weight: normal; }

/* Navigation */
#navigation { font-family: 'TektonProCnd';  height: 46px; font-size: 22px; line-height: 30px; padding: 16px 0 0 0; }
#navigation .shell { overflow: hidden; }
#navigation ul { overflow: hidden; padding: 0 24px 0 52px; background: url('images/nav-arrow.png') 0 8px no-repeat; float: right; display: inline; }
#navigation li { float: left; display: inline; padding-left: 27px; background: url('images/nav-list-separator.png') 0 11px no-repeat; margin-left: 21px; }
#navigation li:first-child { padding-left: 0; background: transparent; margin-left: 0; }
#navigation a { color: #a4a4a4; text-transform: uppercase; text-decoration: none; padding-left: 29px; }
#navigation a:hover { color: #666666; }
#navigation .selected a { color: #666; }
#navigation .nav-info a { background: url('images/nav-info.png') 0 0 no-repeat; }
#navigation .nav-gallery a { background: url('images/nav-gallery.png') 0 0 no-repeat; }
#navigation .nav-clients a { background: url('images/nav-clients.png') 0 0 no-repeat; }
#navigation .nav-press a { background: url('images/nav-press.png') 0 0 no-repeat; }
#navigation .nav-live a { background: url('images/nav-live.gif') 0 0 no-repeat; }

/* Header */
#header { position: relative; z-index: 100; }
#header .shell { width: 1246px; height: 181px; background: url('images/header-band.png') no-repeat; padding: 0; }

#logo { width: 800px; margin: 0 auto; padding-top: 15px; position: relative; left: 0px; }
#logo a { display: block; width: 800px; height: 120px; background: url('images/logo.gif') no-repeat; }

/* Page Content */
.wrapper { 
	background: url('images/bg-pattern-boxes.png'); 
	width: 960px; 
	margin: 0 auto; 
	padding-bottom: 15px; 
	
	-webkit-box-shadow:  0px 5px 8px 0px rgba(0, 0, 0, .1);
	box-shadow:  0px 5px 8px 0px rgba(0, 0, 0, .1);
}
.wrapper .shell { background: #fff; padding-left: 0; padding-right: 0; }

#main { margin-top: -27px; }
#main .shell { padding: 9px 0 0px; }

.post { overflow: hidden; border-bottom: 1px solid #f2f2f2; padding: 25px 10px 25px 10px; width: 890px; margin: 0 auto; }
.post h2 { padding-bottom: 1px; }
.post h3 { padding-bottom: 30px; }

.post-image { width: 441px; }
.post-image.left { margin-right: 20px; }
.post-image.right { margin-left: 20px; }

#press .post-image-skinny {
	margin: 0px 25px 25px 25px;
}
.post-image-skinny { 
	width: 300px; 
	text-align: center;
}
.post-image-skinny.left { margin-right: 20px; height: 100%;}
.post-image-skinny.right { margin-left: 20px; height: 100%;}

.post-image .caption { text-align: right; color: #ccc; font-size: 12px; line-height: 15px; text-transform: uppercase; padding-top: 7px; }
.post-image .caption strong { color: #bbb }

.post-content.center {
	text-align: center;
}
.post-content { overflow: hidden; height: 100%; }
.post-content p { padding-bottom: 24px; }
.post-content p a { text-decoration: underline; }
.post-content p a:hover { text-decoration: none; }

.gallery ul { width: 900px; margin-right: 10px; display: inline-block; *zoom: 1; }
.gallery ul:after { content: ''; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.gallery ul.spread li { float: left; margin: 0px 0px 10px 0px; position: relative; width: auto; height: auto;}
.gallery ul#gallery-clients li { float: left; display: inline; margin: 0px 10px 10px 0px; position: relative; width: 215px; height: 220px; }
.gallery li { float: left; display: inline; margin: 0 10px 10px 0; position: relative; width: 215px; height: 220px; }
.gallery ul.press ul { padding-bottom: 50px; }
.gallery ul.press li { width: 214px; margin: 0px; border-top: 1px solid #f2f2f2; border-right: 1px solid #f2f2f2; overflow: hidden;}
.gallery li a { display: block; position: relative; }
.gallery li p.client { width: 100%; text-align: left; padding: 10px 0px 0px 0px; text-align: center; font-weight: normal; text-transform: uppercase; line-height: 14px; }
.gallery li p.client a { font-size: 10px; text-transform: uppercase; }

.vault ul { width: 900px; margin-right: 10px; display: inline-block; *zoom: 1; }
.vault ul:after { content: ''; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.vault ul.spread li { float: left; margin: 0px 0px 10px 0px; position: relative; width: auto; height: auto;}
.vault ul#gallery-vault li { float: left; display: inline; margin: 0px 10px 10px 0px; position: relative; width: 440px; height: 293px; }
.vault li { float: left; display: inline; margin: 0 10px 10px 0; position: relative; width: 440px; height: 293px; }
.vault ul.press ul { padding-bottom: 50px; }
.vault ul.press li { width: 438px; margin: 0px; border-top: 1px solid #f2f2f2; border-right: 1px solid #f2f2f2; overflow: hidden;}
.vault li a { display: block; position: relative; }
.vault li p.client { width: 100%; text-align: left; padding: 10px 0px 0px 0px; text-align: center; font-weight: normal; text-transform: uppercase; line-height: 14px; }
.vault li p.client a { font-size: 10px; text-transform: uppercase; }

/*Normal Rollover*/
.gallery .overlay { font-family: 'TektonProCnd', arial; width: 150px; height: 150px; background: #ffff00; border-radius: 75px ; opacity: 0.70 ; position: absolute; top: 50%; left: 50%; margin: -75px 0 0 -75px; text-align: center; color: #666666; font-weight: normal; text-transform: uppercase; white-space: nowrap; visibility: hidden; }
.gallery .overlay span { font-size: 24px; line-height: 20px; position: absolute; left: 50%; top: 50%; }
.gallery .overlay span em { display: block; font-size: 12px; font-style: normal; font-weight: normal; }

/*Vault Rollover*/
.vault .overlay { font-family: 'TektonProCnd', arial; width: 150px; height: 150px; background: #ffff00; border-radius: 75px ; opacity: 0.70 ; position: absolute; top: 50%; left: 50%; margin: -75px 0 0 -75px; text-align: center; color: #666666; font-weight: normal; text-transform: uppercase; white-space: nowrap; visibility: hidden; }
.vault .overlay span { font-size: 24px; line-height: 20px; position: absolute; left: 50%; top: 50%; }
.vault .overlay span em { display: block; font-size: 12px; font-style: normal; font-weight: normal; }

/* Larger Rollover */
.large-circles .overlay { font-family: 'TektonProCnd', arial; width: 222px; height: 222px; background: #ffff00; border-radius: 111px ; opacity: 0.70 ; position: absolute; top: 50%; left: 50%; margin: -111px 0 0 -111px; text-align: center; color: #666666; font-weight: normal; text-transform: uppercase; white-space: nowrap; visibility: hidden; }
.large-circles .overlay span { font-size: 36px; line-height: 30px; position: absolute; left: 50%; top: 50%; }
.large-circles .overlay span em { display: block; font-size: 12px; font-style: normal; font-weight: normal; }



.gallery .tab { position: absolute; top: -11px; left: -11px; width: 140px; height: 41px; background: url('images/gallery-tab.png') no-repeat; color: #999; font-size: 30px; line-height: 36px; font-family: 'TektonProCnd', arial; padding-left: 19px; }
.gallery .arrow-down { padding-left: 20px; background: url('images/gallery-arrow-down.png') 0 9px no-repeat; }
.gallery .arrow-right { padding-right: 35px; background: url('images/gallery-arrow-right.png') right 10px no-repeat; }

/* Footer */
#footer { margin-top: 15px; }
#footer .gallery { padding: 15px 20px 0 20px; background: url('images/dots-bg.png') center bottom no-repeat #fff; }
#footer .gallery #instafeed img { height: 220px; }

.footer-buttons { background: url('images/bg-pattern-boxes.png'); padding: 10px; width: 890px; margin: 5px auto 0; }
.footer-buttons ul { overflow: hidden; }
.footer-buttons li { float: left; display: inline; width: 205px; height: 90px; background: #fff; margin-left: 20px; position: relative; }
.footer-buttons li:first-child { margin-left: 0; }
.footer-buttons li.wide-button { width: 207px; }
.footer-buttons li a:hover { opacity: 0.75; filter:alpha(opacity=75); }
.footer-buttons .separator { position: absolute; top: 12px; right: -14px; width: 8px; height: 58px; background: url('images/separator-dots.png') no-repeat; }

.social { padding: 4px 15px 12px 15px; background: url('images/socials-line.png') center bottom no-repeat; }
.social h4 { text-align: center; background: url('images/socials-line.png') center center no-repeat; font-family: 'TektonProBold', arial; font-weight: normal; font-size: 16px; color: #b2b2b2; padding-bottom: 3px; }
.social h4 span { background: #fff; padding: 0 10px; }
.social p { overflow: hidden; }
.social a { display: block; width: 31px; height: 31px; background: url('images/socials.png') no-repeat; float: left; display: inline; margin-left: 5px; font-size: 0; line-height: 0; text-indent: -4000px; }
.social a:first-child { margin-left: 0; }
.footer-buttons li .social a:hover { opacity: 0.75; filter:alpha(opacity=75); }

.social .instagram-link { background-position: 0 0; }
.social .facebook-link { background-position: -31px 0; }
.social .twitter-link { background-position: -62px 0; }
.social .pinterest-link { background-position: -93px 0; }
.social .vimeo-link { background-position: -124px 0; }

.footer-columns { overflow: hidden; padding: 21px 10px 8px; background: url('images/dots-bg.png') center 5px no-repeat; font-family: Georgia, 'Times New Roman', serif;  }
.footer-columns .col { width: 210px; float: left; display: inline; text-align: center; }
.footer-columns .copyright { color: #9c9c9c; text-transform: uppercase; font-size: 14px; font-style: italic; }
.footer-columns a { color: #9c9c9c; text-decoration: none; }
.footer-columns a:hover { color: #60d5d9; }
.footer-columns .description { font-size: 12px; line-height: 15px; font-style: italic; margin-left: 30px; }
.footer-columns .col-email, .footer-columns .col-phone { width: 190px; margin-left: 30px; }
.footer-columns .col-email p { padding-left: 35px; background: url('images/footer-email.png') 0 0 no-repeat; text-align: left; }
.footer-columns .col-phone p { padding-left: 35px; background: url('images/footer-phone.png') 0 0 no-repeat; text-align: left; }
 



.button-big {
	display: block;    
	width: 800px; 
	padding: 1em; 
	margin: 20px auto 20px auto; 
	text-align: center; 
	background-color: #60d5d9; 
	color: #fff;    
	font-family: 'TektonProCnd', arial; 
	font-size: 42px; 
	line-height: 20px; 
	font-weight: normal;
}  
        

.button-big:hover, .button-faq:hover, input[type=submit]:hover {
	opacity: 0.75;
	text-decoration: none;    
	cursor: pointer;
}