html {
	-webkit-font-smoothing: antialiased;
	font-family: "ff-tisa-web-pro", georgia, serif;
	background-color: white;
	width: 100%;
	height: 100%;
	color: #2B2E35;
}

body {
	width: 100%;
	height: 100%;
}

a {
	text-decoration: none;
	color: inherit;
}

a:visited {
	color:inherit;
}

a:hover {
	color: #CCD1D9;
}

#aboutlogo{
position:absolute;
height:50px;
width:50px;
margin:auto;
text-align:center;}

/*OVERLAY*/
.itemoverlay {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: black;

	-webkit-transition: opacity .25s;
	-moz-transition: opacity .25s;
	-o-transition: opacity .25s;
	-ms-transition: opacity .25s;
	transition: opacity .25s;
}

.itemoverlay:hover {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}

.itemoverlay p {
	position: absolute;
	font-family: "brandon-grotesque", helvetica, sans-serif;
	font-size: 1em;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .1em;
	color: white;
	top: 50%;
	width: 100%;
	height: 4em;
	margin-top: -20px;
	text-align: center;
	vertical-align: middle;
}

.itemoverlay p em {
	font-family: "ff-tisa-web-pro", georgia, serif;
	font-size: .8em;
	font-weight: 400;
}

/*LAYOUT AND STRUCTURE*/
.page {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 0;
	margin-left: 10px;
}

.page div.wrapper {
	position: relative;
	margin: 0px auto;
	max-width: 1570px;
}

.homepage {
	max-width: 1300px;
}

#content {
	/*width:  1300;
	*/
margin: 0 auto;
}

.item {
	display: block;
	float: left;
	width: 240px;
	margin: 0 20px 20px 0;
	border-radius: 2px;
	overflow: hidden;
}

.item img {
	width: 240px;
	height: auto;
}

.twocol {
	width: 500px;
}

.twocol img {
	width: 500px;
	height: auto;
}

.threecol {
	width: 760px;
}

.threecol img {
	width: 760px;
	height: auto;
}

.textbox {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	padding: 15px 18px;
	margin-bottom: 35px;
	border: solid 3px #ccd1d9;
	border-radius: 2px;

	-webkit-box-shadow: 0px 15px 0px 0px #ccd1d9;
	box-shadow: 0px 15px 0px 0px #ccd1d9;
	color: #2b2c35;
}

nav {
	color: #ADAFBB;
	font-family: "brandon-grotesque", helvetica, sans-serif;
	font-weight: 800;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	width: 100%;
	margin: 15px auto;
	padding: 0px 30px;
}

.menuwrap div {
	display: inline-block;
	margin-top: 10px;
	margin-right: 10px;
}

.menu div {
	margin-top: 2px;
	vertical-align: baseline;
}

.socials {
	margin-right: 50px;
	width: auto;
	overflow: visible;
	padding: 0;
	font-size: 1.9em;
	line-height: .5em;
	float: right;
}

.socials div {
	margin-right: 0px;
	margin-left: 5px;
	margin-top: -15px;
	display: inline-block;
	vertical-align: top;
}

.backbutton {
	display: block;
	text-align: left;
	margin: 0px -15px 20px 0px;
	margin-left: 0px;
	margin-bottom: 20px;
	float: left;
}

/* Titles */
h1 {
	font-family: "brandon-grotesque", helvetica, sans-serif;
	font-weight: normal;
	font-size: 0.9em;
	text-transform: uppercase;
	color: #000;
	letter-spacing: .2em;
	line-height: 1;
	text-align: center;
	margin: 0;
	display: inline;
}

h1 a {
	color: #000;
}

header {
	display: block;
	width: 100%;
	margin: 30px auto auto -10px;
	font-family: "brandon-grotesque", helvetica, sans-serif;
	font-weight: bold;
	font-size: 2em;
	text-align: center;
	clear: both;
	line-height: 1.1;
	letter-spacing: .05em;
}

header:after {
	content: "";
	display: block;
	width: 30px;
	height: 1px;
	margin: 0.8em auto;
	background-color: #111;
}

.name {
display:block;
	color: #ccd1d9;
	font-size:1em;
	font-weight: 200;
	text-align:center;
	margin-bottom:-30px;
}

.projsub {
	display: block;
	letter-spacing: .25em;
	text-transform: uppercase;
	font-size: .4em;
	color: #ADAFBB;
}

.mobile-only {
	display: none;
}

/*TEXTBOX*/
.textbox {
	color: #2B2E35;
}

.textbox .title {
	display: inline-block;
	font-family: "brandon-grotesque", helvetica, sans-serif;
	font-weight: bold;
}

.textbox .sub {
	font-family: "brandon-grotesque", helvetica, sans-serif;
	display: block;
	font-size: .9em;
	margin-bottom: -10px;
	color: #ccd1d9;
	padding-bottom: 15px;
	border-bottom: solid 1px #ccd1d9;
}

.textbox p {
	margin-top: 0px;
	font-size: .9em;
	line-height: 1.5em;
	margin-bottom: 0.5em;
}

.textbox p .sig {
	display: block;
	margin-top: 5px;
	font-style: italic;
	text-align: right;
}
.linklist {
	display:block;
	clear:both;
	text-align:center;
}

/*SOCIAL BUTTONS*/
.fb,.twitter {
	-webkit-font-smoothing: subpixel-antialiased;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	font-family: "brandon-grotesque", helvetica, sans-serif;
	background-color: #adafbb;
	padding: 8px 10px 10px 10px;
	color: white;
	text-align: center;
	width: 240px;
	border-radius: 2px;
	font-weight: 500;
	letter-spacing: .2em;
	text-transform: uppercase;
	margin-top: auto;
}

.fb {
	float: left;
	margin-right: 10px;
}

.twitter {
	float: right;
	margin-left: 10px;
}

.sharetext {
	font-size: .8em;
}

.fb:hover {
	background-color: #3B5998;
}

.twitter:hover {
	background-color: #55ACEE;
}

.fb:active,.twitter:active {
	margin-top: 2px;
}

/*TYPICONS*/
.typcn-chevron-left {
	font-size: 2em;
}

.typcn-social-facebook,.typcon-social-twitter {
	font-size: 1em;
}

.typcn-social-twitter-circular,.typcon-social-facebook-circular,.typcon-social-dribbble-circular {
	display: inline-block;
}

/*SHADOW FOR WHITE-ON-WHITE*/
.shadow{
	box-shadow:0px 0px 15px rgba(0,0,0,0.1);
}

/*TEXT STYLING*/
.italic {
	font-style: italic;
}

.bold {
	font-weight: bold;
}

.heavy {
	font-weight: bolder;
}

.regular {
	font-weight: 500;
}

.light {
	font-weight: light;
}

.thin {
	font-weight: lighter;
}

/*TEXT COLORS*/
.textmint {
	color: #50BD92;
}

.textslate {
	color: #2B2E35;
}

.textsmoke {
	color: #ADAFBB;
}

.textsteam {
	color: #CCD1D9;
}

.textsnow {
	color: #F0F5FF;
}

/*BG COLORS*/
.mintbg {
	background-color: #50BD92;
}

.slatebg {
	background-color: #2B2E35;
}

.smokebg {
	background-color: #ADAFBB;
}

.steambg {
	background-color: #CCD1D9;
}

.snowbg {
	background-color: #F0F5FF;
}

/*ANTIALIASING CLASSES*/
.subpixel{
	-webkit-font-smoothing:subpixel-antialiased;
}
.antialiased{
	-webkit-font-smoothing:antialiased;
}

/*OVERLAY COLORS*/
#osteo {
	background: #1b1c1f; /* Old browsers */
background: -webkit-linear-gradient(-45deg, #1b1c1f 0%, #566673 50%, #a8b5b3 100%);

	background: -moz-linear-gradient(-45deg, #1b1c1f 0%, #566673 50%, #a8b5b3 100%);
	background: -o-linear-gradient(-45deg, #1b1c1f 0%, #566673 50%, #a8b5b3 100%);
	background: -ms-linear-gradient(-45deg, #1b1c1f 0%, #566673 50%, #a8b5b3 100%);
	background: linear-gradient(-45deg, #1b1c1f 0%, #566673 50%, #a8b5b3 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1b1c1f', endColorstr='#a8b5b3',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#mountain {
	background: #b9c0ef; /* Old browsers */
background: -webkit-linear-gradient(-45deg, #CCC 0%, #9a89b6 50%, #c66b51 100%);

	background: -moz-linear-gradient(-45deg, #CCC 0%, #9a89b6 50%, #c66b51 100%);
	background: -o-linear-gradient(-45deg, #CCC 0%, #9a89b6 50%, #c66b51 100%);
	background: -ms-linear-gradient(-45deg, #CCC 0%, #9a89b6 50%, #c66b51 100%);
	background: linear-gradient(-45deg, #CCC 0%, #9a89b6 50%, #c66b51 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#CCC', endColorstr='#c66b51',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#automaton {
	background: #3ba78f; /* Old browsers */
background: -webkit-linear-gradient(-45deg, #3ba78f 0%, #b9ca93 50%, #fba41f 100%);

	background: -moz-linear-gradient(-45deg, #3ba78f 0%, #b9ca93 50%, #fba41f 100%);
	background: -o-linear-gradient(-45deg, #3ba78f 0%, #b9ca93 50%, #fba41f 100%);
	background: -ms-linear-gradient(-45deg, #3ba78f 0%, #b9ca93 50%, #fba41f 100%);
	background: linear-gradient(-45deg, #3ba78f 0%, #b9ca93 50%, #fba41f 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3ba78f', endColorstr='#fba41f',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#innovation {
	background: #a11fe2; /* Old browsers */
background: -webkit-linear-gradient(-45deg, #a11fe2 0%, #ff6e00 100%);

	background: -moz-linear-gradient(-45deg, #a11fe2 0%, #ff6e00 100%);
	background: -o-linear-gradient(-45deg, #a11fe2 0%, #ff6e00 100%);
	background: -ms-linear-gradient(-45deg, #a11fe2 0%, #ff6e00 100%);
	background: linear-gradient(-45deg, #a11fe2 0%, #ff6e00 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a11fe2', endColorstr='#ff6e00',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#greyflood {
	background: #c6c6c6; /* Old browsers */
background: -webkit-linear-gradient(-45deg, #c6c6c6 0%, #939393 36%, #3a3a3a 100%);

	background: -moz-linear-gradient(-45deg, #c6c6c6 0%, #939393 36%, #3a3a3a 100%);
	background: -o-linear-gradient(-45deg, #c6c6c6 0%, #939393 36%, #3a3a3a 100%);
	background: -ms-linear-gradient(-45deg, #c6c6c6 0%, #939393 36%, #3a3a3a 100%);
	background: linear-gradient(-45deg, #c6c6c6 0%, #939393 36%, #3a3a3a 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c6c6c6', endColorstr='#3a3a3a',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#scuf {
	background: #6db1ff; /* Old browsers */
background: -webkit-linear-gradient(-45deg, #6db1ff 0%, #000000 0%, #383838 100%);

	background: -moz-linear-gradient(-45deg, #6db1ff 0%, #000000 0%, #383838 100%);
	background: -o-linear-gradient(-45deg, #6db1ff 0%, #000000 0%, #383838 100%);
	background: -ms-linear-gradient(-45deg, #6db1ff 0%, #000000 0%, #383838 100%);
	background: linear-gradient(-45deg, #6db1ff 0%, #000000 0%, #383838 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6db1ff', endColorstr='#383838',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#numerals {
	background: #ffd394; /* Old browsers */
background: -webkit-linear-gradient(-45deg, #ffd394 0%, #fda484 50%, #9982b8 100%);

	background: -moz-linear-gradient(-45deg, #ffd394 0%, #fda484 50%, #9982b8 100%);
	background: -o-linear-gradient(-45deg, #ffd394 0%, #fda484 50%, #9982b8 100%);
	background: -ms-linear-gradient(-45deg, #ffd394 0%, #fda484 50%, #9982b8 100%);
	background: linear-gradient(-45deg, #ffd394 0%, #fda484 50%, #9982b8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffd394', endColorstr='#9982b8',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#bound {
	background: #fff093; /* Old browsers */
background: -webkit-linear-gradient(-45deg, #fff093 0%, #4fbeff 100%);

	background: -moz-linear-gradient(-45deg, #fff093 0%, #4fbeff 100%);
	background: -o-linear-gradient(-45deg, #fff093 0%, #4fbeff 100%);
	background: -ms-linear-gradient(-45deg, #fff093 0%, #4fbeff 100%);
	background: linear-gradient(-45deg, #fff093 0%, #4fbeff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff093', endColorstr='#4fbeff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#basketball {
	background: #005daa;
}

#night {
	background: #1b156d; /* Old browsers */
background: -webkit-linear-gradient(-45deg, #1b156d 1%, #1c1c1c 100%);

	background: -moz-linear-gradient(-45deg, #1b156d 1%, #1c1c1c 100%);
	background: -o-linear-gradient(-45deg, #1b156d 1%, #1c1c1c 100%);
	background: -ms-linear-gradient(-45deg, #1b156d 1%, #1c1c1c 100%);
	background: linear-gradient(-45deg, #1b156d 1%, #1c1c1c 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1b156d', endColorstr='#1c1c1c',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

/*MEDIA QUERIES*/
@media (min-width:540px) and (max-width:799px) {
	.threecol {
	width: 500px;
}

.threecol img {
	width: 500px;
}

.backbutton {
	font-size: .8em;
	margin-left: -15px;
}

nav {
	width: 500px;
	margin: 10px auto;
	margin-bottom: 20px;
	padding: 0;
}

.socials {
	margin-right: 10px;
}

}

@media (max-width:539px) {
	.projsub {
	width: 90%;
	margin: auto;
}

.itemoverlay {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
	filter: alpha(opacity=85);
	opacity: .85;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: black;

	-webkit-transition: opacity .25s;
	-moz-transition: opacity .25s;
	-o-transition: opacity .25s;
	-ms-transition: opacity .25s;
	transition: opacity .25s;
}

.itemoverlay:hover {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
	filter: alpha(opacity=85);
	opacity: .85;
}

.mobile-only {
	display: block;
}

.threecol {
	width: 240px;
}

.threecol img {
	width: 240px;
}

.twocol {
	width: 240px;
}

.twocol img {
	width: 240px;
}

nav {
	height: auto;
	color: #ADAFBB;
	font-family: "brandon-grotesque", helvetica, sans-serif;
	font-weight: 800;
	display: block;
	width: 100%;
	margin: 15px 0;
	padding: 0px 20px 0px 0px;
}

.menuwrap div {
	width: 100%;
	display: inline-block;
	margin-top: 5px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}

.menu {
	position: relative;
	width: 100%;
	margin: auto;
}

.menu div {
	width: auto;
	position: relative;
	text-align: center;
	float: none;
	margin-left: 5px;
	margin-right: 5px;
	display: inline-block;
	margin-top: 2px;
}

.socials {
	text-align: left;
	display: block;
	position: relative;
	margin-right: auto;
	margin-left: auto;
	width: 100%;
	font-size: 1.9em;
	line-height: .85em;
}

.socials span {
	position: relative;
	margin-right: auto;
	margin-left: auto;
	margin-top: auto;
	padding-right: 0px;
	display: inline-block;
	vertical-align: auto;
}

.backbutton {
	display: none;
	text-align: left;
	margin: 0px -15px 20px 0px;
	margin-left: 0px;
	margin-bottom: 20px;
	float: left;
}

.socials:after {
	content: "";
	display: block;
	width: 30px;
	height: 1px;
	margin: 0.4em auto;
	background-color: #CCD1D9;
}

header {
	line-height: 1;
}

}

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

/* For image replacement */
.ir {
	border: 0;
	font: 0/0 a;
	text-shadow: none;
	color: transparent;
	background-color: transparent;
}

/* 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;
}

/* Contain floats:  h5bp.com/q */
.clearfix:before,.clearfix:after {
	content: "";
	display: table;
}

.clearfix:after {
	clear: both;
}

.clearfix {
	*zoom: 1;
}

@media print {
	* {
	background: transparent !important;
	color: black !important;

	-webkit-box-shadow: none !important;
	box-shadow: none !important;
	text-shadow: none !important;
	filter: none !important;
}

/* Black prints faster:  h5bp.com/s */
a,a:visited {
	text-decoration: underline;
}

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

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

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

/* Don't show links for images, or javascript/internal links */
pre,blockquote {
	border: 1px solid #999;
	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;
}

}
