@font-face {
	font-family: 'airship_27regular';
	src: url('airship_27-regular-webfont.eot');
	src: url('airship_27-regular-webfont.eot?#iefix') format('embedded-opentype'),
	url('airship_27-regular-webfont.woff') format('woff'),
	url('airship_27-regular-webfont.ttf') format('truetype'),
	url('airship_27-regular-webfont.svg#airship_27regular') format('svg');
	font-weight: normal;
	font-style: normal;
}

@-webkit-keyframes swing {
	20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; }
	20% { -webkit-transform: rotate(15deg); }
	40% { -webkit-transform: rotate(-10deg); }
	60% { -webkit-transform: rotate(5deg); }
	80% { -webkit-transform: rotate(-5deg); }
	100% { -webkit-transform: rotate(0deg); }
}

@-moz-keyframes swing {
	20% { -moz-transform: rotate(15deg); }
	40% { -moz-transform: rotate(-10deg); }
	60% { -moz-transform: rotate(5deg); }
	80% { -moz-transform: rotate(-5deg); }
	100% { -moz-transform: rotate(0deg); }
}

@-o-keyframes swing {
	20% { -o-transform: rotate(15deg); }
	40% { -o-transform: rotate(-10deg); }
	60% { -o-transform: rotate(5deg); }
	80% { -o-transform: rotate(-5deg); }
	100% { -o-transform: rotate(0deg); }
}

@keyframes swing {
	20% { transform: rotate(15deg); }
	40% { transform: rotate(-10deg); }
	60% { transform: rotate(5deg); }
	80% { transform: rotate(-5deg); }
	100% { transform: rotate(0deg); }
}

*::selection {background-color: #222;color: #fff;text-shadow: none;}

body {background: #F6F4D6 repeat center top; font-family: 'Raleway', Helvetica, sans-serif;color: #222;padding: 0 0 50px 0; margin: 0px}
html {height: 100%;}
h1		{
		padding: 0;
		color: #fff;
		/*font-family: 'airship_27regular', Helvetica, Verdana, sans-serif;*/
		font-size: 40px;
		font-weight: 100;
		text-align: left;
		/*background: url('/images/topBox.png') no-repeat center top;*/
		margin: 100px auto 20px auto;
		max-width: 600px;
		}

h2		{
		    color: #f8f6e2;
    font-size: 60px;
    text-transform: uppercase;
    text-align: center;
    margin: -55px 0 50px 0;
    font-weight: 600;
    text-shadow: 0 -1px 0 #fff, 0 -4px 8px rgba(0, 0, 0, .2);
    white-space: nowrap;
    text-align: center;
		}
@media (max-width: 600px) {
  h1 {
    font-size: 26px;
  }
  h2 {
  	  	font-size: 9vw;
	margin-top: -8.7vw;
  }
}
h1 a 	{color: #fff
		}
a 		{
		color: #B26A16;
		text-decoration: none;
		outline: 0;
		transition: color 0.2s;
		}
a:hover {
		color: #222;
		border: none;

		}
div		{margin: 0;padding: 0;}
p		{font-size: 16px;line-height: 24px;margin: 0 0 16px 0}
li		{list-style-type: none;margin: 0;padding: 0;}
li a	{
		margin: 5px 0;
		line-height: 21px;
		padding: 7px;
		display: block;
		font-size: 14px;
		font-family: Helvetica, 'Trebuchet MS', Arial, sans-serif;
		width: 586px;
		border: 0px;
		background-color: #f9f9f9;
		border-radius: 3px;
		-webkit-box-shadow: 0 1px 2px #777;
		box-shadow: 0 1px 2px #777;
		-moz-user-drag: -moz-none;
		-webkit-user-drag: none;
		user-drag: none;
		-moz-user-select: -moz-none;
		-webkit-user-select: none;
		user-select: none;
		}
li a:visited {color: #888;background-color: #ddd;}
li a:hover, li a:focus {
		padding: 5px;
		background-color: #fff;
		border: solid 2px #91C8F2;
		border-radius: 3px;
		}
li a:active {
		-webkit-box-shadow: 0 -1px 2px #999, 0 1px 2px #eee;
		box-shadow: 0 -1px 2px #999, 0 1px 2px #eee;
		transition: box-shadow 0.05s ease-in-out;
		position: relative;
		top: 1px;
		}
li a:active img { position: relative; top: -1px; }
li img		{
		vertical-align: middle;
		position: relative;
		left: -35px;
		margin: 0 -25px 0 0;
		-moz-user-drag: -moz-none;
	    	-webkit-user-drag: none;
	    	user-drag: none;
		}
a img		{ border: none;}

.button {background: url('/images/buttonGradient.jpg') no-repeat center center; border:solid 3px #fff; border-radius: 7px; cursor: pointer;font-weight: bold;font-size: 12px;padding: 10px 20px; text-transform: uppercase; color: #fff;box-shadow: 0 1px 3px #999;text-shadow: 0 -1px rgba(0, 0, 0, .2);}
.button:hover {color: #444;}
.button:active {color: #444; box-shadow:none;border:solid 3px #444;text-shadow: 0 1px 0 rgba(255, 255, 255, .5)}

#openForBusiness {
	display: block;
	width: 183px;
	height: 184px;
	background: url('/images/available.png') no-repeat center center;
	float: right;
	margin:-30px 0 20px 20px;

	-webkit-animation-fill-mode: both;
	-moz-animation-fill-mode: both;
	-ms-animation-fill-mode: both;
	-o-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-ms-animation-duration: 2s;
	-o-animation-duration: 2s;
	animation-duration: 2s;

	-webkit-transform-origin: top center;
	-moz-transform-origin: top center;
	-o-transform-origin: top center;
	transform-origin: top center;
	-webkit-animation-name: swing;
	-moz-animation-name: swing;
	-o-animation-name: swing;
	animation-name: swing;
}

#openForBusiness:hover {
	-webkit-animation-name: rotate; /*how?*/
}

#topRepeat {background: url('/images/topRepeat.jpg') repeat-x top;    background-attachment: fixed;}
#mainIllustration {background: url('/images/mainIllustration.jpg') no-repeat center top; padding: 50px 0 0;background-attachment: fixed;}
.centered {margin: 0 auto;}
.wide {max-width:960px;}
#logo {
		display: block;
		background: url('/images/logoWhite.png') no-repeat center top;
		width: 150px;
		height: 170px;
		margin-top:5px;
		float: left;
	}
#byline {font-size: 20px; color: #fff; color: rgba(255,255,255,.5);max-width:592px; margin: 0 auto}
#portfolio {background-color: #F8F6E1; border: solid 1px #fff;box-shadow: 0 3px 10px rgba(0, 0, 0, .2);padding-bottom:20px;}
#isotope {overflow:hidden;}
#filters {    text-align: center;}
.portfolioWrapper {width: 279px; height: 250px; float: left;margin: 20px 20px 0 20px;}
.portfolioWrapper a {display:block;}
.involvement {font-size: 14px;color: #999;}
.portfolioWrapper.last {margin: 17px 17px;}
.portfolioImages {
	width: 279px;
	height: 180px;
	display: block;
	border-radius: 2px;
	box-shadow: 0 2px 3px #777;
	background-position: center center;
	position: relative;
	transition: all 0.1s;
	line-height: 180px;
	text-align: center;
}

a.portfolioImages.one {background-image: url('/images/art1.jpg')}
a.portfolioImages.two {background-image: url('/images/art2.jpg')}
a.portfolioImages.three {background-image: url('/images/art3.jpg')}
a.portfolioImages.four {background-image: url('/images/art4.jpg')}
a.portfolioImages.five {background-image: url('/images/art5.jpg')}
a.portfolioImages.six {background-image: url('/images/art6.jpg')}
a.portfolioImages.seven {background-image: url('/images/art7.jpg')}
a.portfolioImages.eight {background-image: url('/images/art8.jpg')}
a.portfolioImages.nine {background-image: url('/images/art9.jpg')}
a.portfolioImages.ten {background-image: url('/images/art10.jpg')}
a.portfolioImages.eleven {background-image: url('/images/art11.jpg')}
a.portfolioImages.twelve {background-image: url('/images/art12.jpg')}
a.portfolioImages.thirteen {background-image: url('/images/art13.jpg')}
a.portfolioImages.fourteen {background-image: url('/images/art14.jpg')}
a.portfolioImages.fifteen {background-image: url('/images/art15.jpg')}
.portfolioImages.last {box-shadow: inset 0 3px 7px #555; background:transparent;border: 2px dashed #222;}

a.portfolioImages:hover {
	/*border: solid 5px #fff;
	margin: 15px 15px 0;*/
	box-shadow: 0 3px 7px #777;
	position: relative;
	top: -1px;
}
a.portfolioImages.last:hover {position:relative; top: 0; box-shadow: inset 0 3px 7px #555;}
a.portfolioImages:active {
	box-shadow: 0 -3px 4px -2px rgba(0,0,0,.4), 1px 1px 4px #FFF;
	position: relative;
	top: 1px;
}

#intro {width: 85%; max-width:600px; margin: 100px auto; border-top: solid 5px #fff;padding: 20px 20px 80px;box-sizing:border-box;}
#intro p {font-size: 16px; }

button {
background: rgba(0,0,0,.1);
border: none;
color: #B26A16;
padding: 8px 7px;
border-radius: 2px;
text-transform: lowercase;
cursor: pointer;
outline:none;
margin-bottom:5px;
}

button.is-checked {
	background: rgba(0,0,0,.3);
color: #fff;
}

/* Style browser update */
body .buorg {
	position:fixed;
	width:100%;
	top:0px;
	left:0px;
	border-bottom: 1px solid #fff;
	background:#FFFDDF no-repeat 1em 0.55em url(http://browser-update.org/img/dialog-warning.gif)!important;
	text-align:left;
	cursor:pointer;
	font-family: 'Raleway', Helvetica, sans-serif;
	font-size: 12px;
	box-shadow: 0 0 3px #777;
	text-indent: 34px;
}
body .buorg div {padding: 0;height: 32px; line-height: 32px; color: #222;}
body .buorg a {color:#B26A16;text-decoration:none;}
body .buorg a:hover {color:#000;}
body .buorg b {font-weight: 600;}
body #buorgclose {
    position: absolute;
    right: 0px;
    top:0;
    height: 20px;
    width: 12px;
    font-size:16px;
    height: 33px;
    padding: 0 15px;
    color: #fff;
    background-color: #000;
    text-align: center;
    text-indent: 0;
}
body #buorgclose:hover {color: #999;}
/* Style browser update */

.contactLink {cursor:pointer;}

/* FORM STYLE */
	#ContactForm {
		width: 600px;
		margin: 0 auto;
		padding: 30px;
		background-color: #f9f9f9;
		box-shadow: 0 15px 40px #000, inset 0px 0px 5px #ccc;
		border-radius: 3px;
		border: solid 1px #fff;
		position: fixed;
		top: 20px;
		left:-150%;
		margin-left: -300px;
	}
	.contactActive {}
	#contactFormClose {width: 10px; height: 10px;position: absolute;right: 5px;top: 5px;text-align: center;line-height: 10px;font-weight: bold;font-size:20px;}
	#ContactForm h2 {margin: 0;}
	#ContactForm table {border-top: solid 5px #222; text-align: left; width: 100%; padding: 20px 7px;}
	input, textarea, select {
		font-size: 14px;
		padding: 7px 7px;
		margin: 0;
		vertical-align: top;
		position: relative;
		left: -7px;
		border-radius: 3px;
		border:none;
		border-radius: 3px!important;
		border: solid 3px #92C2C6;
		}

	input:focus, textarea:focus {
		font-size: 14px;
		margin: 0;
		vertical-align: top;
		position: relative;
		left: -7px;
		border-radius: 3px!important;
		outline:none!important;
		border: solid 3px #92C2C6;
		box-shadow: inset 0px 2px 5px #aaa;
		}

	#ContactForm .fullWidth {
		width: 100%;
		}

	#ContactForm .formTag {
		text-align: left;
		font-size: 14px;
		vertical-align: top;
		line-height: 16px;
		}
	#ContactForm table td {
		padding: 0;
		vertical-align: top;
		margin: 0;
		}
	#spamcode {
		font-size: 18px;
		font-weight: bold;
		font-family: monospace;
		color: #444;
		}
	#submitButton {
		}
	#systemMessage {
		padding: 10px;
		margin: 10px 0 10px 0;
		font-size: 14px;
		text-align: left;
		border: #d85c5c solid 2px;
		background-color: #B33536;
		color: #fff;
		}
/* END FORM STYLE */