/*

Moved into EE --- site/site_styles

*/

/* ------------------------------------------------------------------------------------------------
	* FONT FACE
*/

	/* first for IE 4-8 */
	@font-face {
	  font-family: DINWeb;
	  src: url(/_assets/css/DINWeb.eot);
	  font-weight: 400;
	}
	/* then for WOFF-capable browsers */
	@font-face {
	  font-family: DINWeb;
	  src: url(/_assets/css/DINWeb.woff) format("woff");
	  font-weight: 400;
	}

	/* first for IE 4-8 */
	@font-face {
	  font-family: DINWeb;
	  src: url(/_assets/css/DINWeb-Light.eot);
	  font-weight: 200;
	}
	/* then for WOFF-capable browsers */
	@font-face {
	  font-family: DINWeb;
	  src: url(/_assets/css/DINWeb-Light.woff) format("woff");
	  font-weight: 200;
	}

		/* define which elements use this font */
		.main-heading,
		#contact-info h2,
		#project-sort h2,
		.person h1,
		#public-menu a,
		#project-sort a,
		#public-info,
		.contact h1,
		.person h2,
		.project-title,
		.layout h2, .layout h3,
		.layout h2, .layout h3,
		.layout h2, .layout h3,
		#recognition-list td.label p.hilite,
		#studio-info h2 {
			font-family: DINWeb, sans-serif;
		}

		.main-heading, .person h1 {
			font-weight: 200;
		}



/* ------------------------------------------------------------------------------------------------
	* GENERIC STYLES
*/
html, body {
	width: 100%;
	min-width: 800px;
	background-color: #000; /* was  #F2F2F0 */
	font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 100%;
    line-height:1.125em; /* 16-1.125=18 */
    color: #333333;
}

em, i {
	font-style: italic;
}

a, a:link {
	text-decoration: none;
	color:  #000;
	outline: none;
}

a:visited {
	color:  #000;
}

a:hover {
	color: #f00;
	text-decoration: none;
}

a:active {
	color:  #000;
}

.main-heading {
	text-transform: uppercase;
	font-size: 1.35em;
}

/*.hand-cursor {
	cursor: pointer;
	cursor: hand;
} */

.titlebox {
	margin: 0 0 6px 0px;
	padding: 10px 0 20px 12px;
	height: 30px;
	background: #fff;
	font-size: 20px;
	line-height: 20px;
	letter-spacing: 1px;
}

#overlay-body{
	position:fixed;
	z-index: 5;				/* Place the new body above the background image */
	overflow:hidden; 			/* restore scrollbars for the content */
	height:100%; width:100%;	/* Make the new body fill the screen */
	min-height: 580px;
	min-width: 700px;
}


/* ------------------------------------------------------------------------------------------------
	* PUBLIC HEADER / MAIN NAV STYLES
*/
#public-head {
	width: 100%;
	min-width: 720px;
	height: 34px;
	background-color: #000;
	color: #fff;
	overflow: hidden;
	clear: both;
	position: fixed;
	z-index: 999;
}

/* ######################################
	* SPECIFIC FONT FORMATTING
	- public-head
*/
#public-head {
	font-size: 0.75em;
}
	#public-head h1 {
		width: 115px;
		height: 34px;
		float: left;
		background: #000 url(/_assets/img/public_logo.png) no-repeat scroll 0 0;
	}
		#public-head h1 a {
			display: block;
			width: 115px;
			height: 34px;
			overflow: hidden;
			text-indent: -999px;
		}
		#public-head a,
		#public-head a:link {
			text-decoration: none;
			color:  #fff;
			outline: none;
		}
		#public-head a:visited {
			color:  #fff;
		}
		#public-head a:hover {
			color: #f00;
		}
		#public-head a:active {
			color:  #fff;
		}

#public-menu {
	float: left;
}
	#public-menu a {
		text-transform: uppercase;
	}
	#public-menu li {
		float: left;
		width: auto;
		padding: 8px 36px 0 0;
	}

#public-socialmedia {
	position: absolute;
	right: 190px;
	padding: 7px 20px 0 0;
}
	#public-socialmedia a {
		display: inline-block;
		text-indent: 9000px;
		width: 16px;
		height: 16px;
	}
	#public-socialmedia li {
		float: left;
		width: 16px;
		height: 16px;
		padding-right: 8px;
	}

	#public-socialmedia li.facebook {
		background: #000 url(/_assets/img/sm-facebook.gif) 0 0 no-repeat;
	}
		#public-socialmedia li.facebook:hover {
			opacity: 0.6;
		}

	#public-socialmedia li.linkedin {
		background: #000 url(/_assets/img/sm-linkedin.gif) 0 0 no-repeat;
	}
		#public-socialmedia li.linkedin:hover {
			opacity: 0.6;
		}



#public-info {
	position: absolute;
	right: 15px;
	padding-top: 8px;
}


/* ------------------------------------------------------------------------------------------------
	* PAGE BODY STYLES
*/

	#page-body {
		padding-top: 50px;
		overflow: hidden;
	}

	#page-body.recognition {
		padding-top: 35px;
	}

	#body-project #page-body {
		overflow: visible;
	}

	.project-listings {
		min-width: 696px;/*928px*/;
		margin-left: 15px;
	}

	.studio {
		min-width: 1125px;
	}

	.contact {
		color: #000;
	}

	.project-single {
		overflow: visible;
	}



/* ------------------------------------------------------------------------------------------------
	* HOME/LANDING PAGE
*/

	.entry {
		width:100%;
		position: relative;
		overflow: hidden;
	}
	.entry-bg {
		position: absolute;
		z-index: 1;
	}
	.entry-content {
		position: absolute;
		z-index: 2;
		width: 100%;
		height: 100%;
	}
	.entry-content.first {
		background: transparent url(/_assets/img/public-overlay.png) no-repeat 0 0;
		background-size: auto 30%;
		}

	.entry-content-wrapper {
		position: absolute;
		overflow-x: hidden;
	}



/**
  * COMMON HOME PAGE OVERLAY STYLES
  *
  */

.layout h2 {
	color: #fff;
	font-size: 4.0em;
	font-weight: 200;
	line-height: 1.3em;
	text-transform: uppercase;
	padding: 0 10px;
}

@media screen and (max-device-width: 320px) {
	.layout h2 {
		font-size: 2.0em;
	}

} /* /@media */

	.layout h2.small {
		color: #000;
		font-size: 1.15em;
		padding: 0;
	}

	.layout .redback {
		background: transparent url(/_assets/img/red-back.png) repeat scroll 0 0;
	}

	.layout br.clear-fix {
	/* .layout-B .red-back br { */
		clear: left;
	}

	.layout p {
		color: #fff;
		font-size: 0.8em;
		line-height: 1.3em;
		margin-bottom: 10px;
	}

	.layout a,
	.layout a:link {
		text-decoration: none;
		color: #CCC;
		outline: none;
	}
	.layout a:visited {
		color: #CCC;
	}
	.layout a:hover {
		color: #CCC;
		text-decoration: underline;
	}
	.layout a:active {
		color: #CCC;
	}

	.layout a.learn-more, .layout-A a.learn-more:link {
		font-size: 0.8em;
		text-transform: uppercase;
		color: #fff;
		display: block;
		padding-top: 10px;
	}

	.layout a.learn-more:hover {
		color: #000;
		text-decoration: none;
	}




/**
  * CUSTOM OVERLAY OVERRIDES (E.G. POSITIONING)
  *
  */

	.layout-A .entry-content-wrapper {
		max-width: 500px;
		width: 80%;
		bottom: 5%;
		margin: 60px 85px auto 85px;
		padding: 15px;
		padding-bottom: 5px;
	}
		.layout-A .description {
		}

	.layout-B .entry-content-wrapper {
		max-width: 875px;
		width: 80%;
		margin: 60px 85px auto 85px;
	}
		.layout-B h2 {
			overflow: hidden;
		}
		.layout-B h2 a,
		.layout-B h2 a:link,
		.layout-B h2 a:visited,
		.layout-B h2 a:active {
			line-height: 0.5em;
			color: #fff;
		}

	.layout-C .entry-content-wrapper {
		max-width: 600px;
		width: 80%;
		bottom: 5%;
		margin: 60px 85px auto 85px;
	}
		.layout-C .description {
			width: 282px;
			padding: 15px;
			padding-bottom: 5px;
		}

@media screen and (max-device-width: 320px) {

		.layout-A .description {
			font-size: 0.625em; /* 10pt/16pt */
		}


	.layout-C .entry-content-wrapper {
		min-width: 282px;
		max-width: 600px;
		width: auto;
	}

} /* /@media */









/* ------------------------------------------------------------------------------------------------
	* PROJECT LISTING'S
*/
#project-nav {
	overflow: hidden;
	clear: left;
	margin-bottom: 23px;
	color: #fff;
}

#project-nav h1 {
	float: left;
	width: 199px; /* 209-10 padding */
	height: 57px;
	background-color: #f00;
	padding: 10px 0 0 10px;
}

#project-sort {
	float: left;
	margin-left: 6px;
}

#project-sort h2 {
	width: 419px; /* 424 - 5 padding */
	height: 21px;
	padding: 15px 0 0 5px;
	margin-bottom: 6px;
	background-color: #f00;
	text-transform: uppercase;
}

#project-sort ul {
	/* no rules set */
}

	#project-sort li {
		margin-right:6px;
		list-style: none none;
		float: left;
		width: 101px; /* (458 - 3x6px margin) / 4 */
		height: 25px;
	}
	#project-sort li#sort-name, #project-sort li#sort-type { width: 209px; } /* was 102 */

	#project-sort li a, #project-sort li a:link {
		height: 20px;
		padding: 5px 0 0 5px;
		display: block;
		background-color: #ccc;
		color: #000;
		text-decoration: none;
		text-transform: uppercase;
	}

	#project-sort li a:visited {
		/* same as above */
	}

	#project-sort li a:hover {
		background-color: #f00;
		color: #fff;
	}

	#project-sort li a:active {
		/* same as above */
	}

	#project-sort li a.active {
		background-color: #f00;
		color: #fff;
	}


.project {
	width: 209px;
	height: 148px;
	margin: 0 6px 6px 0;
	float: left;
	background: #ccc no-repeat scroll 0 0;
}

.project .img-grayscale {
	position: absolute;
	z-index: 7;
	width:209px;
	height:114px;
	overflow: hidden;
}

.project .img-color {
	position: absolute;
	width:209px;
	height:114px;
	z-index: 8;
	/*display:none;*/
}

.project-title {
	position: absolute;
	z-index: 9;
	width: 209px;
	height: 148px;
}

.project-title a, .project-title a:link {
	display:block;
	padding: 120px 0 8px 8px;
	height: 20px;
	text-transform: uppercase;
	line-height: 1.0em;
	vertical-align: bottom;
}

.project-title a:visited {}
.project-title a:hover {
	text-decoration: none;
	color: #000;
}
.project-title a:active {
	color: #000;
}

.project-over {
	/*background-color: #f00;*/
	color: #000;
}


/* ######################################
	* SPECIFIC FONT FORMATTING
	- project-sort
	- project-title
*/
#project-sort h2, #project-sort a { font-size:  0.75em; }
.project-title { font-size:  0.75em; }

	.project-list .thumb-data {
		visibility: hidden;
	}

	.separator {
		background: #f00;
	}
		.separator a:visited,
		.separator a,
		.separator a:hover,
		.separator a:active {
			text-decoration: none;
			color: #fff;
		}


/* ------------------------------------------------------------------------------------------------
	* PROJECT SINGLE
*/
#project-images {
	position:absolute;
	z-index: -1;
}

#project-images ul {
    left: 0;
    overflow: hidden;
    position: relative;
    visibility: visible;
    z-index: 2;
}

#project-images li {
	margin-right: 6px;
	float: left;
}

#project-images li:last-child {
	margin-right: 0;
}

#project-details {
	float: left;
	width: 617px;
	padding-bottom: 0;
	overflow: hidden;
	margin: 0 0 6px 15px;
}
	.drop-shadow {
	   -webkit-box-shadow:	5px 5px 10px rgba(0, 0, 0, 0.3);
	   -moz-box-shadow:		5px 5px 10px rgba(0, 0, 0, 0.3);
	   box-shadow:			5px 5px 10px rgba(0, 0, 0, 0.3);
	}

#project-details h1 {
	background: transparent url(/_assets/img/wht.png) repeat scroll 0 0;
	height: 50px;
	padding: 10px;
	margin-bottom: 6px;
}

	#project-expand {
		display: block;
		height: 13px;
		margin-top: 20px;
		font-size: 0.55em;
		line-height: 1.4em;
		color: #666;
	}
		#project-expand a.learn-more,
		#project-expand a.learn-more:link {
			display: block;
			padding-left: 18px;
			height: 13px;
			background: transparent url(/_assets/img/open-close-icon.png) no-repeat scroll 0 -13px;
			color: #666;
		}
		#project-expand a.learn-more:visited {}
		#project-expand a.learn-more:hover { color: #f00; text-decoration: none; }
		#project-expand a.learn-more:visited {}


#project-desc {
	background: transparent url(/_assets/img/wht.png) repeat scroll 0 0;
	display: none;
	padding: 10px 0 10px 10px;
	overflow: hidden;
	clear: both;
	font-size: 0.7em;
	line-height: 1.3em;
}

	.project-statistics {
		display: block;
	}
		.project-statistics ul {
			width: 280px;
			padding-right: 20px;
			float: left;
		}
		.project-statistics li {
			text-transform: uppercase;
		}
		.project-statistics .label {
			font-weight: bold;
		}
		.project-statistics ul li p {
			display: inline;

		}

	.project-text {
		display: block;
		clear: both;
		margin-top: 15px;
	}
		.project-text p {
			width: 280px;
			padding-right: 20px;
			float: left;
		}


	div.fb-like {
		clear: both;
	/* 	float: right; */
/* 		margin-left: 300px; */
		width: 90px;
		height: 20px;
		margin-top: 10px;
	}



#project-icon {
	width: 60px;
	height: 60px;
	background: transparent url(/_assets/img/project-icon.png) no-repeat scroll 0 0;
	position: absolute;
	left: 627px;
	margin-top: -30px;
}


/**
 * SUPERSIZED ARROWS
 *
 */
 				#prevslide, #nextslide{ position:absolute; height:64px; width:64px; top:50%; margin-top:-21px; opacity:0.6; }
					#prevslide{
						left:10px;
						background: transparent url(/_assets/img/project-image-arrows-left.png) no-repeat 0 0;
					}
					#nextslide{
						right:10px;
						background: transparent url(/_assets/img/project-image-arrows-right.png) no-repeat 0 0;
					}
					#nextslide.restart {
						background-image: url(/_assets/img/project-image-arrows-left.png);
					}

						#prevslide:active, #nextslide:active{margin-top:-19px;}
						#prevslide:hover, #nextslide:hover{ cursor:pointer;
							background-position-y: -64px;
						}

					/* init for jQuery on single project pages */
					#body-project #prevslide {
						display: none;
						/* visibility: hidden;*/ /* temp for working launch */
					}



/* I THINK ALL THIS PROJECT-IMAGE-BUTTONS CODE CAN BE DELETED */


#project-image-buttons {
	width: 100%;
	min-width: 600px;
	height: 64px;
	background-color: transparent;
	overflow: hidden;
	clear: both;
	position: fixed;
	z-index: 999;
	top: 50%;
	margin-top: -21px;
}
	#project-image-buttons ul {
		width: 100%;
		height: 64px;
	}
	#project-image-buttons li {
/* 		float: left; */
		width: 64px;
		height: 64px;
	}
		#project-image-buttons li.left {
			background: transparent url(/_assets/img/project-image-arrows-left.png) no-repeat 0 0;
			margin-left: 15px;
			float: left;
			visibility: hidden;
		}
		#project-image-buttons li.right {
			background: transparent url(/_assets/img/project-image-arrows-right.png) no-repeat 0 0;
			margin-right: 15px;
			float: right;
		}
		#project-image-buttons li.right.restart {
			background-image: url(/_assets/img/project-image-arrows-left.png);
		}
		#project-image-buttons li:hover {
			background-position-y: -64px;
		}


	#project-image-buttons li a {
		display: block;
		width: 64px;
		height: 64px;
		text-indent: -9000px;
	}





/* ------------------------------------------------------------------------------------------------
	* STUDIO PAGE
*/

.studio {
	margin-bottom: 15px;
}

#studio-details {
	width: 100%;
	max-width: 420px;
	float:left;
	background: #fff;
	margin: 0px 0 0 15px;
	/*padding: 0 0 65px 0;*/
}

#studio-people {
	width: 100%;
	max-width: 687px;
	margin: 0px 0px 0px 5px;
	float:left;
	background: transparent;
}

#studio-details h1 {
	border-bottom: 5px solid #F2F2F0;
	margin-bottom: 0px;
}

#studio-info {
	margin: 0 0 0px 0px;
	background: #fff;
	padding: 10px 10px 25px 12px;
	overflow: hidden;
	float: left;
	border-bottom: 5px solid #f2f2f0;
}

	#studio-info .spacer {
		display: block;
		height: 10px;
	}

	/*.studio-column {
		float: left;
		width: 50%;
	}*/

	#studio-info p {
		font-size: 11px;
		line-height: 14px;
		font-weight: 500;
	}

	#studio-info h1 {
		font-size: 20px;
		margin-bottom: 25px;
		letter-spacing: 1px;
	}

	#studio-info h2 {
		font-size: 16px;
		line-height: 120%;
		margin-bottom: 7px;
		font-weight: 400;
	}


	#studio-info p:first-child {/*margin-right:25px;*/}

	#studio-info p:last-child {/*margin-right:5px;*/}


	#studio-folks {
		margin: 0 0 6px 0px;
		padding: 11px 5px 30px 12px;
		float: left;
		width: 100%;
		max-width: 400px;
		background: #fff;
	}

	.staff-name {
		text-transform: uppercase;
	}

	#studio-folks a.active, #studio-folks a.active span {
		color: #f00;
	}

	#studio-folks ul li {
		font-size: 11px;
		line-height: 14px;
	}

	#studio-folks ul li a {
		font-size: 11px;
		line-height: 14px;
		color: #000000;
		font-family: Arial,Helvetica,Verdana,sans-serif;
		font-weight: 200;
	}

	#studio-folks ul li a:hover {
		color: #f00;
	}

	#studio-folks ul li a span {
		font-size: 11px;
		line-height: 14px;
		text-transform: uppercase;
		color: #000;
		padding: 0 3px 0 0;
	}

	.person-outer-wrapper {
		padding: 0 15px;
		margin: 0 0 0px 0;
		background: #fff;
		float: left;
		width: 100%;
	}

	.person-outer-wrapper-bgimage {
		/*padding: 0 15px;*/
		margin: -15px 0 0 0;
		float: left;
		width: 100%;
	}

	.person {
		min-height: 460px;
		display: none;
		float: left;
		width: 100%;
		padding: 10px 0;
		background-color: #fff;
		background-position: right 15px;
		background-repeat: no-repeat;
		background-size: 300px auto;
	}

	.person .person-content {
		max-width: 328px;
		width: 100%;
		float: left;
	}

	.person h1 {
		padding: 4px 0px 2px 0;
		float: left;
		text-transform: uppercase;
		font-size: 20px;
		letter-spacing: 1px;
		font-weight: 400;
	}
	.person h2 {
		clear: left;
		text-transform: uppercase;
		font-size: 10px;
		line-height: 13px;
		margin-bottom: 14px;
		font-weight: 400;
	}
	.person p {
		font-size: 11px;
		line-height: 14px;
		font-family: Arial,Helvetica,Verdana,sans-serif;
		font-weight: 500;
	}

	#people-icons {
		width: 100%;
		margin: 0px 0 0px 0px;
		float: left;
	}

	#people-icons ul {
		width: 1094px; /* (total staff)*42 + (total staff - 1)*6 = 570 [THIS LINE NEEDS TO BE REVISED WHEN STAFF IS ADDED/REMOVED] */
		height: 64px;
		width: 108% !important;
	}
	#people-icons li {
		list-style: none none;
		float: left;
		width: 42px;
		height: 64px;
		margin-left: 3px;
	}

	#people-icons li:nth-child(16n + 0) { margin-left: 0px; }

	#people-icons li:nth-child(n+16) {
     margin-left: 3px;
    }

	#people-icons li:first-child {
		margin-left: 0;
	}
	#people-icons a {
/* 		text-indent: -999px; */
		overflow: hidden;
		display: block;
		height: 64px;
		text-transform: uppercase;
	}
	#people-icons img {
		position: absolute;
		width: 42px;
		height: 64px;
		z-index: 8;
	}
/*
	#people-icons a.active {
		background: transparent url(/_assets/img/person-icon-down.png) no-repeat scroll center 45px;
	}
	#people-icons a:hover {
		background: transparent url(/_assets/img/person-icon-down.png) no-repeat scroll center 45px;
	}
*/

/* ######################################
	* GENERIC FONT FORMATTING
	- studio
	- person
*/
.studio h2 {
	margin-bottom: 5px;
}
.studio p {
	margin-bottom: 10px;
}


/* ######################################
	* SPECIFIC FONT FORMATTING
	- studio-info
	- studio-folks
	- person
*/



/* ------------------------------------------------------------------------------------------------
	* RECOGNITION PAGE
*/

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

#recognition-left {
	width: 100%;
	max-width: 580px;
	margin: 15px 5px 15px 15px;
	float: left;

}

#recognition-right {
	width: 100%;
	max-width: 560px;
	margin: 15px 0px 15px 15px;
	float: left;
}

#recognition-left h1.titlebox, #recognition-right h1.titlebox {
	background: #f7f7f9;
	margin-bottom: 5px;
}

#recognition-details {
	background: #f7f7f9;
	/*width: 620px;*/

}

#recognition-details h1 {
	color: #000;
}

#recognition-featured {
	padding-bottom: 15px;
	background: #f7f7f9;
}

#recognition-list, #recognition-featured {


}

#recognition-list, .recognition-col-text {
	/* width: 100%;
	max-width: 540px; */
	padding: 10px 10px 40px 12px;
	color: #000;
	font-size: 11px;
	line-height: 1.25em;
	background: #f7f7f9;
}

#recognition-list h1, .recognition-col-text h1 {
	font-size: 20px;
	padding: 0px;
	line-height: 100%;
	margin-bottom: 22px;
}

#recognition-list td, .recognition-col-text td {
	vertical-align: top;
}
	#recognition-list td.label, .recognition-col-text td.label {
		width: 55px;
		line-height: 100%;
		padding-top: 5px;
	}
	#recognition-list td.data, .recognition-col-text td.data {
		padding: 0 30px 8px 15px;
	}
	#recognition-list td.data p, .recognition-col-text td.data p {
		font-size: 11px;
		line-height: 14px;
		font-family: Arial,Helvetica,Verdana,sans-serif;
	}

	#recognition-list td.data strong, #recognition-list td.data b, .recognition-col-text td.data strong, .recognition-col-text td.data b {
		font-weight: bold;
		display: block;
	}

#recognition-list td.label p, .recognition-col-text td.label p {
	visibility: hidden;
}

#recognition-list td.label p.hilite, .recognition-col-text td.label p.hilite {
	visibility: visible;
	font-size: 16px;
	letter-spacing: 1px;
}
.recognition-col-text td.label p.hilite {
	line-height: 16px;
}

#recognition-featured ul {
	width: 100%;
	display: inline-block;
}

	#recognition-featured li {
		float: left;
		padding: 10px 0 0 10px;
		width: 180px;
		height: 240px;
		/*background: transparent url(/_assets/img/wht.png) repeat scroll 0 0;*/
	}
	#recognition-featured li.first {
		margin-left: 0;
	}


@media all and (max-width: 1050px) {
	#recognition-list, #recognition-featured {}}

@media all and (max-width: 650px) {
	#recognition-list, #recognition-featured {
		width: auto;
		height: auto;
		min-height: auto;
	}
}

/* ------------------------------------------------------------------------------------------------
	* CONTACT PAGE
*/

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

#contact-details {
	width: 100%;
	max-width: 440px;
	float: left;
}

#contact-details h1 {
	height: 30px;
	background: #fff;
	font-size: 20px;
	line-height: 20px;
	letter-spacing: 1px;
}

#contact-details h1.titlebox {
	margin-left: 15px;
}

#contact-employment {
	min-height: 67px;
}

#contact-info, #contact-folks, #contact-employment{
	margin: 0 0 5px 15px;
	padding: 15px 15px 30px 10px;
	background: #fff;
}

#contact-folks {
	padding-bottom: 40px;
}

#contact-folks .contact-folks-innerwrapper {
	display: inline-block;
	max-width: 305px;
}

#contact-info {
	padding: 14px 15px 25px 10px;
}

#left-contact-info {
	width: 50%;

}

#new-contact-info {
	width: 50%;
	float: right;
}

#contact-info h1 {
	margin-bottom: 13px;
}

#contact-info ul.socialicons {
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: inline-block;
	height: 25px;
}

#contact-info ul.socialicons li {
	float: left;
}

#contact-info ul.socialicons li a.contact-socialicon {
	width: 25px;
	height: 25px;
	display: inline-block;
	margin: 10px 4px 10px 0;
	background-repeat: no-repeat;
	background-position: center center;
}

#contact-info ul.socialicons li a.contact-socialicon.socialicon-linkedin {
	background: url(/_assets/img/linkedin.png) no-repeat 0 0;
}

#contact-info ul.socialicons li a.contact-socialicon.socialicon-pinterest {
	background: url(/_assets/img/pinterest.png) no-repeat 0 0;
}

#contact-info ul.socialicons li a.contact-socialicon.socialicon-facebook {
	background: url(/_assets/img/facebook.png) no-repeat 0 0;
}

#contact-info ul.socialicons li a.contact-socialicon.socialicon-twitter {
	background: url(/_assets/img/twitter.png) no-repeat 0 0;
}


#contact-folks h1 {
	margin: 6px 0 -10px 0;
}

#contact-employment h1 {
	margin-bottom: -10px;
}

#contact-info p, #contact-folks p, #contact-employment p, #contact-employment a {
	font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 11px;
	line-height: 14px;
	font-weight: 500;
}

#contact-map {
	width: 100%;
	max-width: 820px;
	min-height: 440px;
	margin: 66px 15px 15px 5px;
	float: left;
	background:#fff;
}



/* Media Queries */

@media all and (max-width: 1300px) {
	#contact-map {
		max-width: 720px;
	}

}

@media all and (max-width: 1200px) {
	#contact-map {
		max-width: 620px;
	}

	#recognition-right { max-width: 460px; }
	#recognition-list { max-width: 440px; }

}

@media all and (max-width: 1100px) {
	#contact-map {
		max-width: 520px;
	}
	#recognition-right { max-width: 460px; }
	#recognition-list { max-width: 440px; }
	#recognition-left { max-width: 490px;}
}

@media all and (max-width: 1000px) {
	#contact-map {
		max-width: 420px;
	}
	#recognition-left { max-width: 390px;}

}

@media all and (max-width: 900px) {
	#contact-map {
		max-width: 320px;
	}
	#recognition-right { max-width: 360px; }
	#recognition-list { max-width: 340px; }
}

@media all and (max-width: 800px) {
	#contact-map {
		max-width: 220px;
	}
	#recognition-left { max-width: 250px;}

}

@media all and (max-width: 700px) {
	#contact-map {
		max-width: 100%;
	}
	#recognition-right { max-width: 95%; }
	#recognition-list { max-width: 95%; }
	#recognition-left { max-width: 95%;}
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
	#public-head h1 {
		background: #000 url(/_assets/img/public_logo@2x.png) no-repeat scroll 0 0;
		background-size: 100%;
	}
}

.poork {
	border: 1px solid black;
}

@-webkit-keyframes pulsate {
    0% {-webkit-transform: scale(0.1, 0.1); opacity: 0.0;}
    50% {opacity: 1.0;}
    100% {-webkit-transform: scale(1.2, 1.2); opacity: 0.0;}
}

.contact a, .contact a:link {
	text-decoration: none;
	color:  #000;
	outline: none;
}

.contact a:visited {
	color:  #000;
}

.contact a:hover {
	color: #000;
	text-decoration: none;
}

.contact a:active {
	color:  #000;
}


/* ######################################
	* SPECIFIC FONT FORMATTING
	- contact-info
	- contact-folks
*/


#contact-folks li {
	font-size: 0.7em;
	line-height: 1.25em;
}



/* Employment Opportunities */

body.employment-opportunities #contact-details {
	max-width: 800px;
	width: 100%;
}

body.employment-opportunities #contact-details h1 {
	margin-bottom: 0px;
}

body.employment-opportunities #contact-details h1.employment-opportunity-title {
	font-size: 24px;
	line-height: 200%;
	border-top: 1px solid #f2f2f2;
	padding: 20px 0 13px 0;
}

body.employment-opportunities #contact-details span.employment-opportunity-posted {
	/*line-height: 300%;*/
	display: inline-block;
	padding: 0 0 10px 0;
}

body.employment-opportunities #contact-details #how-to-apply {
	width: 100%;
	border-top: 1px solid #f2f2f2;
	padding-top: 20px;
	margin-top: 60px;
}

/* FULLSCREENR STYLES */

body.body-contact,
body.body-projects,
body.body-error {
	overflow:hidden; 		/* needed to eliminate scrollbars caused by the background image */
	padding:0;margin:0;		/* necesarry for the raster to fill the screen */
	height:100%;width:100%;
}

#bgimg {
	position:absolute;
	z-index: -1;
}

#realBody{
	position:absolute;
	z-index: 5;				/* Place the new body above the background image */
	overflow:auto; 			/* restore scrollbars for the content */
	height:100%;width:100%;	/* Make the new body fill the screen */
}


#recognition-details #recognition-left  #recognition-list, #recognition-details #recognition-left .recognition-col-text {
   width: auto;
   max-width: none;
}

video
{
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
}