@import "http://fonts.googleapis.com/css?family=Lato:300,400,700";

/* menu */
.trigger{position:fixed;display:inline-block;top:20px;right:5%;height:44px;width:44px;z-index:5;overflow:hidden;text-indent:100%;white-space:nowrap;cursor:pointer}.trigger .icon{position:absolute;left:50%;top:50%;bottom:auto;right:auto;-webkit-transform:translateX(-50%) translateY(-50%);-moz-transform:translateX(-50%) translateY(-50%);-ms-transform:translateX(-50%) translateY(-50%);-o-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);display:inline-block;width:18px;height:3px;background-color:#fff;z-index:10}.trigger .icon:before,.trigger .icon:after{position:absolute;top:0;right:0;width:100%;height:100%;background-color:#fff;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transition:-webkit-transform .3s;-moz-transition:-moz-transform .3s;transition:transform .3s}.trigger .icon:before{-webkit-transform:translateY(-6px) rotate(0deg);-moz-transform:translateY(-6px) rotate(0deg);-ms-transform:translateY(-6px) rotate(0deg);-o-transform:translateY(-6px) rotate(0deg);transform:translateY(-6px) rotate(0deg)}.trigger .icon:after{-webkit-transform:translateY(6px) rotate(0deg);-moz-transform:translateY(6px) rotate(0deg);-ms-transform:translateY(6px) rotate(0deg);-o-transform:translateY(6px) rotate(0deg);transform:translateY(6px) rotate(0deg)}.trigger:before,.trigger:after{position:absolute;top:0;right:0;border-radius:50%;height:100%;width:100%;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;transition-property:transform}.trigger:before{background-color:#2e313b;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transition-duration:.3s;-moz-transition-duration:.3s;transition-duration:.3s;-webkit-transition-delay:.4s;-moz-transition-delay:.4s;transition-delay:.4s}.trigger:after{background-color:#2e313b;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);-webkit-transition-duration:0s;-moz-transition-duration:0s;transition-duration:0s;-webkit-transition-delay:0s;-moz-transition-delay:0s;transition-delay:0s}.trigger.close-nav:before{-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0)}.trigger.close-nav:after{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transition-duration:.3s;-moz-transition-duration:.3s;transition-duration:.3s;-webkit-transition-delay:.4s;-moz-transition-delay:.4s;transition-delay:.4s}.trigger.close-nav .icon{background-color:rgba(255,255,255,0)}.trigger.close-nav .icon:before,.trigger.close-nav .icon:after{background-color:#fff}.trigger.close-nav .icon:before{-webkit-transform:translateY(0) rotate(45deg);-moz-transform:translateY(0) rotate(45deg);-ms-transform:translateY(0) rotate(45deg);-o-transform:translateY(0) rotate(45deg);transform:translateY(0) rotate(45deg)}.trigger.close-nav .icon:after{-webkit-transform:translateY(0) rotate(-45deg);-moz-transform:translateY(0) rotate(-45deg);-ms-transform:translateY(0) rotate(-45deg);-o-transform:translateY(0) rotate(-45deg);transform:translateY(0) rotate(-45deg)}nav ul{list-style:none}nav ul.menu{position:fixed;left:0;top:0;height:100%;width:100%;padding:5% 5% 100px;z-index:3;background-color:#2e313b;overflow:auto;visibility:hidden;opacity:0;-webkit-transition:visibility 0s,opacity .3s;-moz-transition:visibility 0s,opacity .3s;transition:visibility 0s,opacity .3s}nav ul.fade-in{visibility:visible;opacity:1}.circle1,.circle1b{position:fixed;top:20px;right:5%;height:4px;width:4px;-webkit-transform:translateX(-20px) translateY(20px);-moz-transform:translateX(-20px) translateY(20px);-ms-transform:translateX(-20px) translateY(20px);-o-transform:translateX(-20px) translateY(20px);transform:translateX(-20px) translateY(20px)}.circle1 span,.circle1b span{display:inline-block;position:absolute;border-radius:50%;-webkit-backface-visibility:hidden;backface-visibility:hidden;will-change:transform;-webkit-transform-origin:50% 50%;-moz-transform-origin:50% 50%;-ms-transform-origin:50% 50%;-o-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0)}.circle1.is-hidden,.circle1b.is-hidden{opacity:0;visibility:hidden;-webkit-transition:opacity .3s 0s,visibility 0s .3s;-moz-transition:opacity .3s 0s,visibility 0s .3s;transition:opacity .3s 0s,visibility 0s .3s}.circle1{z-index:2}.circle1 span{background-color:#2e313b}.circle1b{z-index:4}.circle1b span{background-color:#efefef}

/* animation */
.ani{-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.ani.hinge{-webkit-animation-duration:2s;animation-duration:2s}@-webkit-keyframes "fadeIn"{0%{opacity:0}to{opacity:1}}@keyframes "fadeIn"{0%{opacity:0}to{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes "slideInDown"{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%);visibility:visible;}100%{-webkit-transform:translateY(0);transform:translateY(0);transition-timing-function: ease-in;}}@keyframes "slideInDown"{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%);visibility:visible;}100%{-webkit-transform:translateY(0);transform:translateY(0);}}.slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}

*
{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	text-decoration: none;
	font-size: 100%;
	-webkit-text-size-adjust: none;
	vertical-align: baseline;
	background: transparent;
	position: relative;
	font-weight: 400;
}

*, *:after, *:before
{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

*:after, *:before { content: ""; }

.group:after
{
	content: "";
	display: table;
	clear: both;
}

html, body
{
	margin: 0;
	width: 100%;
	height: 100%;
}

body { background: #eee; }

body, button, input, select, textarea
{
	font: 16px/1.4 "Lato",sans-serif;
	color: #888;
}

img
{
	border: none;
	max-width: 100%;
}

:focus { outline: 0; }

a
{
	-webkit-transition: color 1s;
	-moz-transition: color 1s;
	transition: color 1s;
}

a:link, a:visited
{
	text-decoration: none;
	color: #888;
}

.no-touch a:hover { color: #111; }
.no-touch a figure { color: #888; }
.no-touch footer a:hover { color: #fff; }

a.uline
{
	position: relative;
	margin-left: 50px;
	padding-left: 10px;
	cursor: pointer;
}

a.uline:before
{
	background-color: #888;
	width: 0;
	height: 1px;
	display: block;
	position: absolute;
	bottom: 3px;
	left: -50px;
	padding-left: 50px;
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-ms-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
}

footer a.uline, nav a.uline, nav a:link, nav a:visited, footer a:link, footer a:visited { color: #7b7f8e; }
footer a.uline:before, nav a.uline:before { background-color: #7b7f8e; }

.no-touch a.uline:hover:before
{
	background-color: #111;
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-ms-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
	padding-left: 10px;
	left: -10px;
}

.no-touch footer a.uline:hover:before, .no-touch nav a.uline:hover:before, nav a.selected.uline:before { background-color: #fff; }
nav ul.menu li a { font-weight: 300; }

nav ul ul
{
	margin-bottom: 20px;
	text-transform: lowercase;
}

.divider
{
	display: block;
	margin: 40px 0 10px;
	padding-bottom: 5px;
	color: #898e9e;
	border-bottom: 1px solid #5d616d;
}

.list-heading
{
	color: #7b7f8e;
	line-height: 2;
	text-transform: uppercase;
}

li .list-heading { color: #5d616d; }
.sort-type { display: none; }
a.uline.ularge { font-size: 1.5em; }
nav p a.uline { font-size: 1em; }

nav ul.menu li li a:link, nav ul.menu li li a:visited
{
	font-size: 1.125em;
	color: #999daa;
}

.no-touch nav a:hover,nav a.selected,#homepage .menu1 a,#team .menu2 a { color: #fff !important; }

h1
{
	font-size: .938em;
	margin-bottom: 30px;
	text-transform: uppercase;
	letter-spacing: 2px;
}

h2
{
	font-size: 1.313em;
	color: #2e313b;
	line-height: 1.2;
}

h3
{
	color: #2e313b;
	margin-bottom: 0;
}

h4
{
	font-size: 1em;
	margin-bottom: 20px;
}

h5
{
	font-size: .75em;
	margin-bottom: 20px;
}

footer h5 { color: #8c8f99; }

p
{
	font-size: .875em;
	-webkit-font-smoothing: subpixel-antialiased;
	margin-bottom: 20px;
}

strong { font-weight: 700; }
.main strong { color: #444; }

hr
{
	display: block;
	position: relative;
	padding: 0;
	margin: 10px 0 20px 0;
	width: 100%;
	clear: both;
	border: none;
	border-top: 1px solid #ddd;
	font-size: 1px;
	line-height: 0;
	overflow: visible;
}

label { font-size: .813em; }

input[type=text]
{
	width: 60%;
	padding: 6px 8px;
	background: #4e525e;
	color: #8c8f99;
	font-size: .875em;
	margin: 10px 0;
}

input[type=text]:focus { background: #393d46; }

input[type=submit]
{
	display: block;
	font-size: .875em;
	color: #eee;
	background: transparent;
	border: 1px solid #9699a3;
	border-radius: 24px;
	padding: 4px 20px;
	cursor: pointer;
}

.no-touch input[type=submit]:hover
{
	background: #aaacb4;
	color: #2E313B;
}

input[type=text], input[type=submit], textarea, select
{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

::-webkit-input-placeholder, ::-moz-placeholder, :-ms-input-placeholder { color: #9699a3; }
.container { overflow: hidden; }

header
{
	width: 100%;
	height: 180px;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 2;
	text-align: center;
	background: rgba(255,255,255,.98);
	-webkit-transition: all 1.2s;
	-moz-transition: all 1.2s;
	transition: all 1.2s;
	-webkit-transform: translateZ(0);
	overflow: hidden;
}

header.shrink
{
	height: 0;
	padding: 0;
}

header .logo img
{
	display: block;
	margin: 20px auto 10px;
	width: 260px;
	opacity: 0.6;
	cursor: pointer;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}

header.shrink .logo img
{
	width: 100px;
	opacity: 0;
	-webkit-transition: all .6s ease-in-out;
	-moz-transition: all .6s ease-in-out;
	transition: all .6s ease-in-out;
}

header p
{
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
	letter-spacing: 6px;
}

header.shrink p { display: none; }

.main
{
	width: 100%;
	max-width: 960px;
	margin: 200px auto 40px;
	padding: 1.6%;
	text-transform: lowercase;
}

figure
{
	margin-bottom: 40px;
	text-align: center;
}

figure img
{
	vertical-align: top;
	background: #dedddf;
	max-width: 100%;
}

figcaption
{
	text-align: left;
	background: #eee;
	padding-top: 10px;
	font-size: .875em;
}

.main.resume { text-transform: lowercase; }

.main.resume h5
{
	text-transform: uppercase;
	margin-bottom: 5px;
}

.resume figure
{
	width: 14%;
	display: block;
	float: left;
	margin: 0 1.333% 2% 1.333%;
	background: #eee;
}

.resume figure img
{
	display: block;
	padding: 0;
	border-radius: 50%;
}

.no-touch .resume figure img, .resume .team-carousel figure img
{
	opacity: .6;
	-webkit-transition: opacity 1s;
	-moz-transition: opacity 1s;
	transition: opacity 1s;
}

.no-touch .resume figure img:hover, .no-touch .resume .selected figure img, .resume figure.full img, .no-touch, .resume .team-carousel .selected figure img { opacity: 1; }
.resume figcaption { text-align: center; }

.resume .team-carousel figure
{
	width: 8%;
	margin: 0 .167% 1% .167%;
	font-size: 80%;
}

.resume figure.full
{
	float: none;
	margin: 20px auto;
	width: 28%;
}

.profile { text-align: center; }

footer
{
	clear: both;
	background-color: #2e313b;
	color: #aaacb4;
	padding: 40px;
	-webkit-transform: translateZ(0);
	width: 100%;
}

footer .group
{
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
}

.col
{
	display: block;
	float: left;
	vertical-align: top;
	margin: 1% 0 1% 1.6%;
}

.col:first-child { margin-left: 0; }
.c1 { width: 100%; }
.c1-2 { width: 49.2%; }
.c2-3 { width: 66.13%; }
.c1-3 { width: 32.26%; }
.c4-5 { width: 79.68%; }
.c3-5 { width: 59.36%; }
.c2-5 { width: 39.04%; }
.c1-5 { width: 18.72%; }
.pad { padding: 1.6%; }

.credit
{
	clear: both;
	font-size: .75em;
	padding-top: 40px;
	opacity: .4;
}

#myMap, .cover
{
	width: 100%;
	height: 800px;
	border: none;
	margin: 30px 0;
}

#myMap img { max-width: none; }

.cover
{
	z-index: 2;
	margin-top: -830px;
}

.iframe-streetview
{
	width: 100%;
	height: 600px;
	border: 0;
}

@media screen and (max-width:640px)
{
	.main { padding: 20px; }
	
	.col, .c2-5
	{
		display: block;
		width: 100%;
		margin: 0;
		clear: both;
	}
	
	.resume figure
	{
		width: 40%;
		margin: 0 5% 5% 5%;
	}
	
	.resume .team-carousel figure
	{
		width: 14%;
		margin: 0 1.333% 3% 1.333%;
	}
	
	.resume figure.full { width: 60%; }
	footer { padding: 20px; }
	#myMap, .cover, .iframe-streetview { height: 300px; }
	.cover { margin-top: -330px; }
}

@media screen and (max-width:420px)
{
	.main h1
	{
		font-size: 0.813em;
		letter-spacing: 0;
	}
	
	.main { margin-top: 160px; }
	
	header
	{
		text-align: left;
		padding-left: 20px;
		height: 160px;
	}
	
	header .logo img
	{
		margin: 20px 0 5px;
		width: 200px;
	}
	
	header p { letter-spacing: 3px; }
	.resume .team-carousel figcaption { line-height: 1; }
	.iframe-streetview { display: none; }
	
	.main h2 { line-height: 1.1; }
}




