/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #;
}

html {
    font-size: 1em;
    line-height: 1.4;
}

body {
    overflow-x:hidden;
}

 ul {list-style-type:none;}
* { margin:0; padding:0; }

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #fff;
	color: #6eb8b7;
    text-shadow: none;
}

::selection {
    background: #fff;
	color: #6eb8b7;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

img { border:none; }

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Caliper Styles
   ========================================================================== */

/*
 * Body Wrapper
 */

html, body, #bodywrapper {
	height:100%;
	position:relative;
	}

body > #bodywrapper {
	height: auto;
	min-height: 100%;
	}

/*
 * General Typography
 */

a:link { text-decoration: none; color: #7d7d7d; }
a:active { text-decoration: none; color: #7d7d7d; }
a:visited { text-decoration: none; color: #7d7d7d; }
.no-touch a:hover { text-decoration: none; color: #000000; }

.PFDinTextCompPro-Medium {
	font-family: PFDinTextCompPro-Medium;
	font-weight: normal;
	font-style: normal;
}

.PFDinTextStd-Medium {
	font-family: PFDinTextStd-Medium;
	font-weight: normal;
	font-style: normal;
}

body {
	font-size:11px;
	font-family: "times new roman", Times, serif;
	color: #7d7d7d;
	}

h1 {
	text-transform: uppercase;
	font-family: PFDinTextStd-Medium, Helvetica, "Arial", sans-serif;
	font-weight:400;
	margin-bottom: 6px;
	color: #252525
}

h2 {
	text-transform: uppercase;
	font-weight:400;
	font-style:italic;
	margin-bottom: 6px;
	}

h3 {
	font-weight:400;
	font-style:italic;
	margin-bottom: 6px;
	}


.caption {
	font-size:36px;
	color: #636363;
	padding-top:0px;
	padding-bottom:0px;
	}

.captionsmall {
  	font-size:24px;
  	color: #636363;
  	padding-top:0px;
  	padding-bottom:0px;
  	}

.projtxt h1 a:link,
.projtxt h1 a:active,
.projtxt h1 a:visited,
.projtxt h1 a:hover {
	color:#252525;
	}


.projtxt a:link,
.projtxt a:active,
.projtxt a:visited,
.projtxt a:hover {
	color:#7d7d7d;
	}

.textcolumns a:link,
.textcolumns a:active,
.textcolumns a:visited{
	color:#464646;
	}

.textcolumns a:hover {
	color:#7d7d7d;
	}

.currentpage {
	color:#252525;
	}

/*
 * Header
 */

.headerwrapper {
	top:0;
	height: 70px;
	display:block;
	width: 100%;
	}

.headerbg {
	position:fixed;
	top:0;
	z-index:9;
	width: 100%;
	height: 70px;
	background: #fff;
	}

.navbg {
	position:fixed;
	z-index:7;
	width: 100%;
	background: #fff;
	top:70px;
	}

.header,
.indexheader {
	position:fixed;
	display:block;
	margin-top:15px;
	margin-bottom:15px;
	width:100%;
	clear:both;
	z-index:10;
	}

/* Logo */
.logo,
.indexlogo {
	display:block;
	margin-left:60px;
	float:left;
	}

/* Navigation Menu */
.nav,
.indexnav,
.projnav {
	display:block;
	float:right;
	margin-right:70px;
	padding-top:11px;
	text-align:right;
	}

.nav li,
.indexnav li,
.projnav li {
	float:right;
	padding-left:40px;
	text-transform: uppercase;
	font-family: Helvetica, Arial, sans-serif;
	font-size:10px;
	}

.infolist {
	display:none;
	padding-top:10px;
	}

.infolist li{
	float:none;
	text-align:left;
	padding:0;
	}

.mobileinformation {
	display:none;
	}

/* Header Max Width and Margins */
@media all and (min-width: 1310px) {
.header {
	max-width:1180px;
	left:50%;
	margin-left:-590px;
	padding-left:0px;
	}

.projnav {
	padding-right:8px;
	}

.nav,
.projnav {
	margin-right:0px;
	}

.logo {
	margin-left:0px;
	}
}

/*
 * Index Full Page
 */

 .indexspan {
	height:100%;
	}

 .indextitle {
	position:absolute;
	width: 100%;
	top:40%;
	text-align:center;
	text-transform: uppercase;
	font-family: PFDinTextCompPro-Medium, Helvetica, Arial, sans-serif;
	font-size:7.5vw;
	color:#fff;
	}

@media all and (max-width: 1060px) {
.indextitle {
	font-size:80px;
	}
}

@media all and (max-width: 613px) {
.indextitle {
	line-height:75px;
	}
}

/*
 * Index Full Page Slideshow
 */

 * { margin:0; padding:0; }
body { background:#fff; height:100%; }
	img { border:none; }

	#supersized-loader { position:absolute; top:50%; left:50%; z-index:0; width:60px; height:60px; margin:-30px 0 0 -30px; text-indent:-999em; background:url(../img/progress.gif) no-repeat center center;}

	#supersized {  display:block; position:absolute; left:0; top:0; overflow:hidden; z-index:-999; height:100%; width:100%; }
		#supersized img { width:auto; height:auto; position:relative; display:none; outline:none; border:none; }
			#supersized.speed img { -ms-interpolation-mode:nearest-neighbor; image-rendering: -moz-crisp-edges; }	/*Speed*/
			#supersized.quality img { -ms-interpolation-mode:bicubic; image-rendering: optimizeQuality; }			/*Quality*/

		#supersized li { display:block; list-style:none; z-index:-30; position:absolute; overflow:hidden; top:0; left:0; width:100%; height:100%; padding-top: 70px; background:#fff; }
		#supersized a { width:100%; height:100%; display:block; }
			#supersized li.prevslide { z-index:-20; }
			#supersized li.activeslide { z-index:-10; }
			#supersized li.image-loading { background:#fff url(../img/progress.gif) no-repeat center center; width:100%; height:100%; }
				#supersized li.image-loading img{ visibility:hidden; }
			#supersized li.prevslide img, #supersized li.activeslide img{ display:inline; }

 /*
 * Scrolling Content
 */

 /* Sets Scrolling Content Column Max Width */
.scroll,
.indexscroll {
		max-width:770px;
		padding-bottom:120px;
		margin-left:60px;
		margin-right:70px;
}

 /* Sets Visibility of Navigation Hover Below Index Information Level */
.indexscroll {
		position:relative;
		z-index:8;
		}

/* Sets Scrolling Content Max Width and Centering on Large Browser */
@media all and (min-width: 1310px) {
.scrollmaxwidth {
	max-width:1180px;
	margin-right:auto;
	margin-left:auto;
	}

.scroll {
	margin:0px;
	}
}

.sectionwrapper {
	margin-top:-20px;
	clear:both;
	}

.section {
	padding-top: 80px;
	}

.section  img{
	max-width:100%;
	height:auto;
	width: auto\9; /* ie8 */
	}

.subsection 	{
		margin-top:30px;
		}

.subsection img {
	max-width:100%;
	}

#profile {
	margin-top:-30px;
	}



/* Responsive Description Columns */
.textcolumns {
    -webkit-column-width: 230px; /* Chrome, Safari, Opera */
    -moz-column-width: 230px; /* Firefox */
    column-width: 230px;

	-webkit-column-gap: 40px; /* Chrome, Safari, Opera */
    -moz-column-gap: 40px; /* Firefox */
    column-gap: 40px;

	max-width:770px
}


/* Static Columns */
.columns {
	width:580px;
	overflow-x:hidden;
	}

.fixedcolumns {
	display:inline-block;
	width:230px;
	padding-bottom:15px;
	}

.profilecolumn {
	padding-bottom:30px;
	column-break-inside: avoid;
	}

div.profilecolumn {
	display: inline-block;
	}

.phsection {
	padding-top:20px;
	}

.phlogo {
	float:left;
	margin-top:4px;
	margin-right:10px;
	}

.phlinks {
	float:left;
	}

.researchintro {
	margin-bottom:60px;
	}

.researchimg {
	padding-top:20px;
	}

.researchimg  img{
	width:100%;
	}

.profileimg {
	margin-top:35px;
	margin-bottom:35px;
	}

@media (max-width: 916px) {
.columnhide {
	display:none;
	}
}

@media (min-width: 917px) {
.columnhide {
	display:normal;
	}
}

@media (max-width: 639px) {
#presstitle {
	display:none;
	}
}

@media (min-width: 640px) {
#presstitle {
	display:normal;
	}
}

/*
 * Project Menu Page
 */

.projects {
	display:block;
	padding-top:20px;
	margin-left:60px;
	margin-right:62px;
	}

.projimgwrapper {
	position:relative;
	height:auto;
	width: auto\9; /* ie8 */
	display:block;
	float:left;
	}

.projimg {
	margin-right:8px;
	margin-bottom:8px;
	}

.projimg img {
	width:100%;
	max-width:100%;
	}

.projinfo {
	position:absolute;
	width:100%;
	height:50px;
	margin-top:-50px;
	background:rgba(255,255,255, 1);
	text-align:left;
	padding-top:8px;
	padding-left:6px;
	}

.projecttitle {
	margin-bottom:0px;
	color:#252525;
	font-size:14px;
	font-family: PFDinTextStd-Medium, Helvetica, "Arial", sans-serif;
	text-transform:uppercase;
	}

.projectdescription {
	color: #7d7d7d
	}

.ymcatext {
	width: 315px;
	padding-bottom: 5px;
}

  /* Footer Spacing */
 .clearspan {
	clear:both;
	height:90px;
	}

/* Project Menu Media quires for a responsive layout */

/* For tablets & smart phones */
@media (min-width: 481px) {
.projimgwrapper {
	width:50%;
	}
}

/* For smaller displays */
@media (min-width: 829px) {
.projimgwrapper {
	width:33.33%;
	}
}

/* For smartphones */
@media (max-width: 480px) {
.projimgwrapper {
	width:100%;
	}
}

/* Project Menu Page Centering and Max Width */
@media all and (min-width: 1310px) {
.projects {
	max-width:1180px;
	margin-right:auto;
	margin-left:auto;
	}
}

/*
 * Individual Project Sliding Images
 */

 .slideimg img{
width:100%;
}

/* Navigation */
.slidesjs-navigation {
margin-top:-30%;
position:relative;
z-index:10;
}

/* Previous */
.slidesjs-previous {
margin-left: 10px;
float: left;
}

/* Next */
.slidesjs-next.controls{
margin-right: 10px;
float: right;
}

/* Slide Icons */
.slidesjs-pagination {
margin-top: -25px;
margin-right: 10px;
float: right;
list-style: none;
position:relative;
z-index:10;
}

.slidesjs-pagination li a.active,
.slidesjs-pagination li a:hover.active {
background-position: 0 -13px
}

.slidesjs-pagination li a:hover {
background-position: 0 -26px
}

.slidesjs-pagination li {
float: left;
margin: 0px;
width:10px;
}

/* Prevent the slideshow from flashing on load */
#slides {
display: none;
}

/* Prevent image container to cause footer automatic scrolling*/
.containerwrapper {
padding-top: 20px;
}

/* Image Container*/
.container {
margin-top: 0px;
margin-left: 60px;
margin-right: 70px;
position:relative;
z-index: 1;
}

/* Fixed Project Image Max Width */
@media all and (min-width: 1310px) {
.container {
	max-width:1180px;
	margin-right:auto;
	margin-left:auto;
	}
}

.photocredit {
	float:right;
	padding-top:6px;
	font-size:9.2px;
	color: #7d7d7d;
	font-family: "Helvetica", "Arial", sans-serif;
	}

/*
 * 404 Error Page
 */

 .errorspan {
	padding-top:120px;
	padding-bottom:40px;
	}

 .error {
 	display:block;
 	max-width:455px;
	padding-left:60px;
	padding-right:70px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	text-transform: uppercase;
	font-family: PFDinTextCompPro-Medium, Helvetica, Arial, sans-serif;
	font-size:40px;
	}

.error a:link,
.error a:active,
.error a:visited {
	color:#252525;
	}

.errorlink a:hover {
	color:#252525;
	}

.errorlinkchange a:hover {
	color:#7d7d7d;
	}

/*
 * Footer
 */

.footer,
.indexfooter {
	clear:both;
	position:relative;
	z-index:10;
	height:40px;
	margin-top:-40px;
	padding-left:60px;
	padding-right:70px;
}

.footer li,
.indexfooter li {
	font-family: "Helvetica", "Arial", sans-serif;
	font-size:9.2px;
	color: #acacac;
}

.footertitle {
	float:left;
	margin-left:-5px;
	padding-right:40px;
	font-family: "Helvetica", "Arial", sans-serif;
	color: #acacac;
	font-size:14px;
	text-transform:uppercase;
	font-weight:bold;
}

.footertitle img {
	float:left;
	padding-right:3px;
	}

.footercontact {
	float:right;
	margin-top:-3px;
	}

.footercontact ul {
	display:block;
	float:right;
	width:110px;
	padding-left:20px;
	text-align:right;
}

/* Footer Max Width and Margins */
@media all and (min-width: 1310px) {
.footer {
	max-width:1180px;
	margin-right:auto;
	margin-left:auto;
	}

.footertitle {
	margin-left:0px;
	}
}

/* Project Menu Page Centering and Max Width */
@media all and (max-width: 810px) {
.footercontact {
	display:none;
	}
}

/* Project Menu Page Centering and Max Width */
@media all and (max-width: 530px) {
#studiofooter {
	display:none;
	}
}

/* ==========================================================================
   Smartphone Media Query Adjustments
   ========================================================================== */

/* Smartphone (portrait and landscape) */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px) {
.headerwrapper {
	height: 50px;
	}

.headerbg {
	height: 50px;
	}

.header,
.indexheader {
	margin-top:8px;
	margin-bottom:0px;
	}

.logo img,
.indexlogo img {
	width:35px;
	height:35px;
	}

.nav,
.indexnav,
.projnav {
	padding-top:3px;
	}

.nav li,
.indexnav li,
.projnav li {
	float:none;
	padding-left:0px;
	text-align:right;
	line-height: 15px;
	}

.mobileinformation {
	display:inline;
	}

.information {
	display:none;
	}

.calipervideo{
    display:none;
  }


#supersized li {
	padding-top: 50px;
	}

#contact {
	margin-top:-60px;
	}

.caption {
	font-size:25px;
	}

.projects {
	padding-top:3px;
	}

.footer,
.indexfooter {
	min-width:0px;
	}

.studiofooter {
	display:none;
	}

.footercontact{
	display:none;
	}
}

/* Smartphones (landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : landscape) {
.logo,
.indexlogo {
	margin-left:35px;
	}

.nav,
.indexnav,
.projnav {
	margin-right:35px;
	}

.indextitle {
	font-size:45px;
	}

.indexscroll,
.container,
.scroll {
	margin-left:35px;
	margin-right:35px;
	}

.projects {
	margin-left:35px;
	margin-right:27px;
	}

.footer,
.indexfooter {
	padding-left:35px;
	}
}

/* Smartphones (portrait) */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : portrait) {
.logo,
.indexlogo {
	margin-left:20px;
	}

.nav,
.indexnav,
.projnav {
	margin-right:20px;
	}

.indextitle {
	font-size:57px;
	line-height:53px;
	}

.indexscroll,
.container,
.scroll {
	margin-left:20px;
	margin-right:20px;
	}

.projects {
	margin-left:20px;
	margin-right:12px;
	}

.footer,
.indexfooter {
	padding-left:20px;
	}
}
/* ==========================================================================
   Ipad Media Query Adjustments
   ========================================================================== */

/* Ipad (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
.indextitle {
	font-size:105px;
	}

.mobileinformation {
	display:inline;
	}

.information {
	display:none;
	}
}

/* Ipad (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
.indextitle {
	line-height:100px;
	}
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}


.calipervideo{
  max-width: 770px;
  width: auto;
  height: auto;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}
