@import url("reset.css");

/* Global */
html { overflow-y: scroll; }
body { background-color: #ffffff; color: #737169; font-family: Arial, sans-serif; font-size: 12px; line-height: 18px; text-align: center; }
img { behavior: url(iepngfix.htc); }

/* Typography */
h1, h2, h3, h4, h5 { font-family: Arial Narrow, Arial, sans-serif; letter-spacing: 0.05em; }
h1, h2 { -webkit-text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.15); -moz-text-shadow: rgba(0, 0, 0, 0.15) 1px 1px 2px; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.15); }
h1 { color: #737169; font-size: 30px; margin: 0 0 20px 0; line-height: 30px; }
h2 { color: #737169; font-size: 20px; margin: 0 0 10px 0; }
h3 { color: #737169; font-size: 12px; font-weight: bold; height: 20px; letter-spacing: .1em; text-transform: uppercase; }
h4 { color: #737169; font-size: 16px; height: 25px; letter-spacing: normal; }
h5 { color: #737169; font-size: 12px; height: 20px; }
h6 { color: #333; font-size: 1em; line-height: 1em; }
hr { background-color: #ddd; border: 0; clear: both; color: #ddd; height: 1px; margin: 24px 0 20px 0; }
em { font-style: italic; }
p { font-family: Arial, sans-serif; margin: 0 0 18px 0; text-align: left; }
strong { font-weight: bold; }
small { font-size: 75%; }

@font-face {
	font-family: 'INSTITUT';
	src: url('/css/font/INSTITUT.eot');
	src: url('/css/font/INSTITUT.woff') format('woff'), 
		 url('/css/font/INSTITUT.ttf') format('truetype'), 
		 url('/css/font/INSTITUT.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* Architecture */
.clear { clear: both; }
#project_bg { width: 100%; }
#structure { margin: 0px auto; padding: 30px 0 0 0; width: 100%; }
#white_overlay { position: absolute; top: 0px; left: 0px; width: 100%; height: 140px; background: #fff; opacity:0;filter:alpha(opacity=0); display: none; }
#white_page_overlay { z-index:5; position: absolute; top: 140px; height: 100%; left: 0px; width: 100%; background: #fff; opacity:0;filter:alpha(opacity=0); display: none; }
#header_wrapper { height: 110px; width: 100%; }
#header { margin: 0px auto; width: 980px; }
#logo { float: left; height: 90px; left: 0px; position: relative; top: 0px; width: 230px; }
#logo_s2 { float: left; height: 90px; left: 0px; position: relative; top: 15px; width: 230px; }
#menu { float: left; height: 80px; left: 0px; position: relative; top: 20px; width: 350px; }
#top_menu { border-bottom: 1px solid #eaeaea; height: 30px; margin: 0 0 0 30px; }
#top_menu li { display: inline; margin: 0 30px 0 0; }
#project_menu { height: 30px; margin: 10px 0 0 15px; }
/* #project_menu li { display: inline; margin: 0 0 0 15px; } */
#project_menu li { float:left; margin: 0 0 0 15px; }
#s2 { float: right; margin: 40px 0 0 0; position: relative; }
#sekret_back { float: right; margin: 20px 0 0 0; position: relative; }
#page_wrapper { position: relative; clear: both; margin: 40px auto 0px auto; width: 980px; }
#page {  }
#property { border-top: 1px solid #eaeaea; clear: both; float: left; font-size: 9px; height: 40px; padding: 20px 0 0 0; width: 720px; }
#footer { clear: both; float: left; font-size: 9px; height: 40px; margin: 40px 0 0 0; width: 720px; }
#index #footer { float: right; }
#footer ul li { color: #737169; display: inline; margin-right: 20px; }

#menu a {
	font-family: 'INSTITUT', sans-serif;
	text-transform: lowercase;
	color:#73716A;
	font-weight: normal;
}
#menu a:hover, #menu a.lit {
	color: #b8b176;
}
#menu #top_menu a {
	font-size: 24px;
}
#menu #project_menu a {
	font-size: 21px;
}
#pg_video_games,#pg_commercials, #pg_films, #pg_internet { display:block; height:22px; }
#pg_video_games { width:68px; }
#pg_commercials { width:73px; }
#pg_films { width:32px; }
#pg_internet { width:46px; }

/* Home */
#description { color: #737169; float: left; font-size: 11px; line-height: 20px; width: 210px; }
#description span { color: #737169; font: italic 20px/23px Georgia, Times New Roman, serif; text-shadow: #ddd 1px 1px 2px; filter: Shadow(Color=#ddd, Direction=135, Strength=2); }
.read_more { border-top: 1px solid #eaeaea; clear: both; font-size: 12px; height: 30px; line-height: 30px; margin: 10px 0 0 0; }
#projects_wrapper { display:none; z-index: 100; overflow: hidden; position: absolute; top: 0px; left: 120px; width: 750px; }
#index #projects_wrapper { display: block; float: right; overflow: hidden; position: relative; top: 0px; left: 0px; width: 750px; }
.project { float: left; height: 110px; margin: 0 0 30px 30px; width: 219px; }
#news { border-top: 1px solid #eaeaea; clear: both; float: right; margin: 20px 0 0 0; width: 720px; }
#news_items { float: left; height: 120px; width: 550px; }
.news_item { border-right: 1px solid #eaeaea; float: left; height: 80px; margin: 0 15px 0 0; overflow: hidden; padding: 0 15px 0 0; width: 150px; }
#last_news_item { margin: 0; }
#social { float: right; height: 70px; width: 160px; }
#social ul li { height: 20px; }
#social ul li img { margin: 0 5px 0 0; position: relative; top: 4px; }
#news_items, #social { position: relative; top: 10px; }
.hideProjects { display:none; }

/* Subpages */
#content { float: left; width: 580px; }
#demo_reel #content { float: none; width: 980px; }
#sidebar { float: right; width: 320px; }
.inline_image { float: right; margin: 5px 0 20px 20px; }

/* About */
#content ul li { list-style: inside disc; margin: 0 0 0 5px; }
#about_details { border-bottom: 1px solid #eaeaea; margin: 0 0 20px 0; padding: 0 0 20px 0; }
#about_details ul li { font-size: 11px; list-style: inside disc; margin: 0 0 0 5px; }

/* Press */
.press_release { border-bottom: 1px solid #eaeaea; margin: 0 0 30px 0; overflow: hidden; padding: 0 0 20px 0; text-align: center; }
.press_image { margin: 15px 0 15px 0; text-align: center; }
.press_image .image { text-align: left; display: inline; }
.caption, .location, .author, .link { color: #737169; font-size: 11px; }
.detail_item { margin: 0 0 10px 0; }
.detail_item ul { margin: 0 0 0 -18px; }
.label { color: #737169; font-size: 11px; font-weight: bold; }
.location, .author, .link { color: #737169; font-size: 12px; line-height: 18px; }
.attribution { color: #aeaba1; font-family: Arial Narrow, sans-serif; font-size: 11px; padding: 0 10px 0 0; }
.press_release .read_more { border-top: none; height: 20px; line-height: 20px; margin: 0; text-align: left; }
#archives { margin: 10px 0 0 0; }
.archive { color: #737169; font-size: 11px; line-height: 15px; margin: 0 0 10px 0; }
.archive_item { margin: 0 0 40px 0; line-height: 18px; }
.archive_item a { display: block; }

/* Project */
#multimedia { float: left; width: 480px; }
#multimedia p { margin: 0 0 20px -13px; padding: 0 0 0 13px; width: 460px; }
#images { left: 0px; width: 480px; }
#images h3 { margin: 20px 0 0 0; width: 480px; }
#images ul li { display: inline; float: left; margin: 0 0 15px 0; width: 25%; }
a.gallery { 
	border: 1px solid #eaeaea; 
	display: block;
	width: 100px;
	height: 60px;
	overflow: hidden;
	text-align: center;
	line-height: 60px;
}
#project h3 { border-bottom: 1px solid #eaeaea; margin: 20px 0 20px 0; }
#videos { float: right; margin: 20px 0 0 0; width: 100px; }
#videos h3 { float: right; width: 100px; }
#videos img { float: right; margin: 0 0 20px 0; }
.notVisible { display: none; }
#movie_player, #movie_player2, #movie_click { margin: 0 0 20px 0; }
#movie_click { position: relative; width: 460px; }
#demo_reel #movie_click, #demo_reel #movie_player { position: static; width: 853px; margin: 0px auto; }
#movie_click img { border: 1px solid #eaeaea; }
#movie_player2 { display: none; }
#movie_click img {  }
.click_to_play a { height: 258px; left: 0px; line-height: 258px; margin: 0px auto; position: absolute; text-align: center; top: 0px; width: 460px; }
#demo_reel .click_to_play a { height: 418px; line-height: 418px; width: 980px; margin: 0px auto; }
.click_to_play span { background: #fff url('../images/play.gif') no-repeat 6px center; border: 1px solid #737169; font: bold 10px Helvetica, Arial, sans-serif; padding: 10px 10px 10px 30px; text-transform: uppercase; -webkit-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.4); -moz-box-shadow: rgba(0, 0, 0, 0.4) 2px 2px 3px; box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4); }
.review { background: url('/images/quote_open.gif') no-repeat 2px 5px; font-size: 11px; }
.review .attr { color: #9c998d; display: block; font-style: italic; }
.credits { }
.credits .line { display: block; font-size: 11px; }
.gallery img {
	display:-moz-inline-stack;
	display:inline-block;
	zoom:1;
	*display:inline;
	margin: 0px auto;
	vertical-align: middle;
}

/* Project Grid */
#project_container { display: none; background: #fff; height: 450px; left: 0px; opacity: .95; position: fixed; top: 125px; width: 100%; z-index: 50; }
#project_grid { display: none; height: 100%; left: 0px; position: fixed; top: 150px; width: 100%; z-index: 51;}
#project_grid .projects { float: none; margin: 0px auto; opacity: 1; width: 765px; }
.project img { border: 1px solid #eaeaea; }
.project { text-align: center; font-size: 11px; }

/* Contact */
#contact #content { float: none; width: 980px;}
.contact_names { display: block; height: 140px; width: 450px; }
.contact_names img { margin: 3px 0 0 0; }
#studio { margin: 40px 0 0 0; width: 300px; }
.name, .last_name { float: left; font-size: 11px; height: 140px; line-height: 15px; margin: 0 10px 0 0; width: 200px; }
#studio .name { width: 300px; }
.name strong, .last_name strong { font-size: 12px; }
.name em, .last_name em { color: #444; }
.last_name { margin: 0; }
#contact #page { height: 225px; }

/* Terms */
#terms { font-size: 11px; line-height: 14px; }

/* Links */
a:link, a:visited { color: #b8b26e; text-decoration: none; }
a:active, a:hover { color: #737169; text-decoration: none; }

.read_more a:link, .read_more a:visited { background: url('../images/circle_arrow.gif') no-repeat 0 1px; color: #737169; padding: 0 0 0 18px; }
.read_more a:active, .read_more a:hover { background: url('../images/circle_arrow.gif') no-repeat 0 -13px; color: #b8b26e; padding: 0 0 0 18px; }
.news_item a { font: 14px/20px Arial Narrow, Arial, sans-serif; }

.click_to_play a:link, .click_to_play a:visited { color: #737169; }
.click_to_play a:active, .click_to_play a:hover { color: #b8b26e; }

/* Press Articles Links */
.source_link:link, .print_link:link, .pdf_link:link, .source_link:visited, .print_link:visited, .pdf_link:visited { color: #b8b26e; padding: 0 0 0 18px; }
.source_link:active, .print_link:active, .pdf_link:active, .source_link:hover, .print_link:hover, .pdf_link:hover { color: #737169; }

.source_link:link, .source_link:visited { background: url('../images/external.gif') no-repeat 0 1px; }
.source_link:active, .source_link:hover { background: url('../images/external.gif') no-repeat 0 -11px; }
.pdf_link:link, .pdf_link:visited { background: url('../images/pdf.gif') no-repeat 0 1px; }
.pdf_link:active, .pdf_link:hover { background: url('../images/pdf.gif') no-repeat 0 -11px; }
.print_link:link, .print_link:visited { background: url('../images/print.gif') no-repeat 0 1px; }
.print_link:active, .print_link:hover { background: url('../images/print.gif') no-repeat 0 -11px; }

#footer a:link, #footer a:visited { color: #a5a5a5; text-decoration: none; }
#footer a:active, #footer a:hover { color: #737169; text-decoration: none; }
.bio_img { float: left; margin: 0 10px 10px 0; }
.bio_img.right { float: right; margin: 0 0 10px 10px; }