/* ------------------------------------------------------------ *\
	Fonts
\* ------------------------------------------------------------ */

@font-face {
    font-family: 'DINWeb';
    src: url('/fonts/dinotregular-webfont.eot');
    src: url('/fonts/dinotregular-webfont.eot#iefix') format('embedded-opentype'),
         url('/fonts/dinotregular-webfont.woff2') format('woff2'),
         url('/fonts/dinotregular-webfont.woff') format('woff'),
         url('/fonts/dinotregular-webfont.ttf') format('truetype'),
         url('/fonts/dinotregular-webfont.svg#dinotregular') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'DINWeb';
    src: url('/fonts/dinotlight-webfont.eot');
    src: url('/fonts/dinotlight-webfont.eot#iefix') format('embedded-opentype'),
         url('/fonts/dinotlight-webfont.woff2') format('woff2'),
         url('/fonts/dinotlight-webfont.woff') format('woff'),
         url('/fonts/dinotlight-webfont.ttf') format('truetype'),
         url('/fonts/dinotlight-webfont.svg#dinotlight') format('svg');
    font-weight: 200;
    font-style: normal;

}

/* Fix MEGA WEIRD font-size issue when using landscape on iOS */
html { -webkit-text-size-adjust: 100%; }

/* ------------------------------------------------------------ *\
	Responsive
\* ------------------------------------------------------------ */

.nav-trigger { display: none; }


/* max-width: 1150px */

@media (max-width: 1150px) {

	html,
	body { min-width: 320px; }

	#public-head { min-width: 320px; }

	.studio { min-width: 100%; }

	#contact-details { max-width: 350px; }

	#contact-map { max-width: 100%; width: auto; float: none; }

	#recognition-left { min-width: 390px; }
	#recognition-right { float: none; width: auto; max-width: 100%; overflow: hidden; }

	#recognition-list td.data { padding-left: 0; }

	#studio-details { max-width: 100%; width: auto; min-height: 0 !important; padding-bottom: 20px; margin: 0 10px; float: none; overflow: hidden; }
	#studio-info { border: none; }

	#studio-people { margin: 20px 10px 0; width: auto; max-width: 100%; float: none; overflow: hidden; }

	#people-icons ul { height: auto; width: 100% !important; text-align: center; }
	#people-icons li { float: none; display: inline-block; vertical-align: top; }
	#people-icons { display: none; }

	.person-outer-wrapper {
		-webkit-box-sizing: border-box;
		        box-sizing: border-box;
	}

	#studio-folks { max-width: 300px; }

}

/* max-width: 767px */

@media (max-width: 767px) {

	.gmnoprint { display: none; }
	body { background: #000; color: #fff; }

        #sorted-name div:nth-child(n+15) {display:none;}
	#public-info,
	#public-socialmedia { display: none; }

	#public-head { overflow: visible; top: 0; left: 0; right: 0; z-index: 999; }

	#public-head h1 { background-position: -8px 0; }

	#public-menu { position: absolute; top: 100%; left: 0; right: 0; display: none; }

	#public-menu li { float: none; display: block; padding: 0; background: rgba(0, 0, 0, .9); }
	#public-menu li + li { border-top: 1px solid #4a4648; }
	#public-menu li:nth-child(2) { background: rgba(0, 0, 0, .8); }
	#public-menu li:nth-child(3) { background: rgba(0, 0, 0, .7); }
	#public-menu li:nth-child(4) { background: rgba(0, 0, 0, 0.6); }
	#public-menu a { padding: 16px 20px 17px; font-size: 15px; display: block; }
	#public-menu a:hover { color: #fff; }

	.nav-trigger { display: block; float: right; padding-top: 6px; margin: 11px 13px 0 0; }

	.nav-trigger span { position: relative; display: block; width: 20px; height: 15px; border-top: 2px solid #fff; }

	.nav-trigger span:before,
	.nav-trigger span:after { content: ''; position: absolute; width: 100%; height: 2px; background: #fff; }

	.nav-trigger span:before { top: -7px; }
	.nav-trigger span:after { top: 3px; }

	.nav-trigger span:before,
	.nav-trigger span:after,
	.nav-trigger span {
		-webkit-transition: all .3s linear;
		        transition: all .3s linear;
	 }

	.nav-trigger.active span { border-color: transparent; }

	.nav-trigger.active span:before,
	.nav-trigger.active span:after { background: #e70000; }

	.nav-trigger.active span:before {
	-webkit-transform: rotate(45deg) translate(1px, 6px);
            transform: rotate(45deg) translate(1px, 6px);

	}
	.nav-trigger.active span:after {
	-webkit-transform: rotate(-45deg) translate(1px, -6px);
            transform: rotate(-45deg) translate(1px, -6px);
	}

	#nextslide,
	#prevslide {
		-webkit-transform: scale(.5);
		        transform: scale(.5);
	}

	#nextslide { right: 0px !important; }
	#prevslide { left: 0px !important; }

	#nextslide, #prevslide { display: none !important; }

	#landing .slide-item .entry { display: none; }
	.supersized-img { left: 0 !important; }

	.entry { bottom: 0; top: auto; left: 0; right: 0; margin: 0; padding: 0; height: auto; width: auto; background: #000; }
	.layout h2.small { color: #fff; }

	.entry-content.first { background: none; }

	.entry-content,
	.entry-content-wrapper { position: static; background: none; }

	.entry-content { padding: 10px;
	-webkit-box-sizing: border-box;
			box-sizing: border-box;
	}
	.entry-content p { color: #fff; font-size: 0.9em; }

	.entry-content p a { color: #fff !important; }

	.layout .redback { background: none; }

	.layout-A .entry-content-wrapper { padding: 0; margin: 0; width: 100%; max-width: 100%; }

	#project-nav h1,
	#project-nav,
	#project-sort { float: none; }

	.project-listings { min-width: 0; }
 	/* Hide Social Media and Stats on Mobile */
        #project-details #project-desc .project-statistics, #project-details #project-desc .fb-like { display: none; }

	#project-sort h2,
	#project-nav h1 { width: auto; }

	#project-sort { margin: 6px -3px 0; }


	#project-sort li#sort-name,
	#project-sort li#sort-type { width: 50%; margin: 0; padding: 0 3px;
	-webkit-box-sizing: border-box;
			box-sizing: border-box;
	}

	#project-sort { display: none; }

        #project-nav h1 { height: 30px; }

	.project-listings { margin: 0 13px; overflow: hidden; }

	.project { float: none; width: 100%; margin: 0 0 40px; height: auto; position: relative; min-height: 148px; background: #000; }

	.project img { width: 100%; height: auto; }
	.project .img-grayscale { position: static; width: 100%; height: auto; font-size: 0; line-height: 0; }
	.project .img-color { width: 100%; height: auto; }

	.project-title { top: 0; left: 0; right: 0; bottom: 0; height: auto; width: auto; }

	.project-list { overflow: hidden; }

	.project-list .thumb-data { position: absolute; opacity: 0; }

	.project-title a,
	.project-title a:link { padding: 56.5% 0 0; color: #fff; }

	.project-title a:hover { color: #fff; }

	.separator { background: #f00; }

	.separator .project-title a,
	.separator .project-title a:link { padding-top: 120px; padding-left: 10px; }

	#project-images { position: static; overflow: auto; }
	#project-images img { max-width: 100%; }

	#overlay-body { position: static; min-width: 100%; max-width: 100%; width: 100%; min-height: 0; }

	#page-body.project-single { padding-top: 0; }

	#project-details { display: block !important; float: none; width: 100%; background: #000; opacity: 1 !important; margin: 0; }
	#project-desc { display: block; background: #000; color: #fff; padding: 10px; }

	.project-statistics ul { width: 100%; padding: 0; float: none; }

	.project-text p { width: 100%; float: none; }

	#project-expand { display: none; }
	#project-details h1 { background: #000; height: auto; margin: 0; color: #fff; font-size: 18px; }

	.titlebox { background: #ed1c24; }
	#studio-details { padding: 0;  }
	#studio-details h1 { border: none; padding: 10px; font-size: 16px; }

	#studio-info { padding: 10px 0; float: none; }

	#studio-folks { min-width: 0; float: none; width: auto; background: #000; padding: 0 0 10px; margin: 0; max-width: 100%; }

	#studio-folks ul li a span,
	#studio-folks ul li a { color: #fff; }

	#studio-info { background: #000; }

	.person-outer-wrapper { background: #000; color: #fff; float: none; }

	#studio-people { margin: 0; min-height: 0 !important; }

	.person { background-color: #000; background-size: 100% auto; padding-top: 160%; min-height: 0; }

	#people-icons { float: none; overflow: hidden; font-size: 0; line-height: 0; }
	#people-icons ul { height: auto; margin: 0 -3px; }
	#people-icons li { margin: 0 3px 6px; }
	#people-icons a { display: block; position: relative; }

	.studio { margin: 0; }

	body.body-contact.recognition-page #realBody { background: #000; }

	.main-heading,
	#recognition-left h1.titlebox,
	#recognition-right h1.titlebox { background: #ed1c24; color: #fff; padding: 10px; font-size: 16px; }

	#recognition-details { background: #000; }

	#recognition-left { margin: 0; float: none; max-width: 100%; min-width: 100%; }
	#recognition-featured { background: #000; }

	#recognition-featured li { float: none; width: 100%; padding: 0 0 10px; height: auto; }
	#recognition-featured li a { display: block; }
	#recognition-featured li img { width: 100%; height: auto; }
	#recognition-right { margin: 0; }

	#recognition-list { background: #000; color: #fff; padding-bottom: 10px; }

	.recognition { padding: 0 13px; }

	body.body-contact #realBody { background: #000; }

	#contact-details { float: none; max-width: 100%; }

	#contact-details h1 { height: auto; background: #ed1c24; color: #fff; font-size: 16px; margin: 0; }

	.contact { padding: 0 13px; }

	#contact-employment,
	#contact-folks,
	#contact-info,
	#contact-details h1.titlebox { margin: 0; }

	#contact-info { padding: 10px 7px; }

	#contact-folks .contact-folks-innerwrapper { display: block; max-width: 100%; }

	#contact-info,
	#contact-folks,
	#contact-employment { background: #000; color: #fff; }

	#contact-info { padding-bottom: 15px; }

	#contact-employment,
	#contact-folks { padding: 0; margin-top: 10px; }

	.contact a,
	.contact a:link,
	.contact a:visited { color: #fff; }

	#contact-employment ul,
	.contact-folks-innerwrapper p { padding: 10px 7px; }

	#contact-map { margin: 10px 0 0; height: 210px !important; min-height: 0; }
}