
/*-------------- type styling --------------*/
html {
    overflow-y: scroll;
}

body {
background-color: #ffffff;
font-family: 'Source Code Pro', 'Open Sans', sans-serif;
color: black;
}

p {
font-family: 'Source Code Pro','Open Sans', sans-serif;
font-size: 12px;
letter-spacing: .1em;
line-height: 17px;
}

h1 {
font-family: 'Source Code Pro','Open Sans', sans-serif;
text-transform: uppercase;
transition: all .25s ease;
font-size: 12px;
letter-spacing: .1em;
font-weight: medium;
opacity: .5;
line-height: 15px;
}

h3 {
font-family: 'Source Code Pro','Open Sans', sans-serif;
text-transform: uppercase;
transition: all .25s ease;
font-size: 36px;
line-height: 55px;
letter-spacing: .1em;
font-weight: bold;
opacity: .2;
text-decoration: none;
}

a {
text-decoration: underline;
color: inherit;
transition: color .5s ease;
}

a:hover {
/*opacity: 0.4;*/
text-decoration: underline;
opacity: 0.6;
}

#network_links a {
	text-decoration: none;
}

#network_links a:hover {
	opacity: 1;
}

img a {text-decoration: none;}

strong {
font-weight: bold;
}

em {opacity: .6; letter-spacing: 0.08;}

/*-------------- basic structure --------------*/

#logo a{
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  -ms-transition: none !important;
  transition: none !important;
}
header {
position:relative;
width:auto;
max-width:1220px;
height: 50px;
margin-bottom: 15px;
}

#header_desc {
float: right;
opacity: .6;
margin-top: 2px;
font-size: 10px;
padding-right: 8px;
}

#arrow {
position: absolute;
margin-left: -70px;
margin-top: -9px;
padding-top: 30px;
width: 30px;
height:0px;
overflow: hidden;
background-image: url(/images/backarrow_off.gif);
background-repeat: no-repeat;
}

#arrow:hover {
background-image: url(/images/backarrow_on.gif);
}

nav {position: absolute;}

nav ul {list-style:none;}

.mobile_nav {display:none;}

nav ul li {
display:block;
float:left;
padding-right:33px;
}

nav img {
margin-top: -4px;
}

nav ul li a {
font-family: 'Source Code Pro','Open Sans', sans-serif;
text-transform: uppercase;
transition: all .25s ease;
font-size: 12px;
letter-spacing: .1em;
font-weight: bold; /* maybe bold maybe medium */
text-decoration: none;
}


.wrapper {
	margin-top: 50px;
	margin-left: 3%;
	min-height: 100%;
}

.container {
	max-width: 1220px;
	min-width: 805px;
	margin: auto;
	width: 90%;
	height: 100%;
	position: relative;
}
#footer {
width: 100%;
padding-top: 100px;
padding-bottom: 20px;
clear: both;
}

#footer p {
opacity: 0.4;
font-size: 10px;
}



/*-------------- index page --------------*/

#index_grid {
	position: relative;
	margin-top: 1200px;
	width: 90%;
	margin: 0 auto;
	margin-bottom: 100px;
}

#index_grid img{
	position: relative;
	max-width: 130px;
}

#index_grid a:hover {
opacity: 1;
}

.index_link
{
	float: left;
	width: 130px;
	height: 100px;
	margin:0px 5px 5px 0px;
}

.index_link a:hover {
opacity: 0.3;
}

.index_link .hover_text {
width: 100px;
}

.index_thumb{
	padding-right: 0px;
	padding-bottom: 1px;
	}

.hover_text {
display: none;
position: absolute;
opacity: 1;
font-family: 'Source Code Pro','Open Sans', sans-serif;
font-weight: bold;
font-size: 12px;
line-height: 14px;
padding: 10px 0 0 5px;
}

.project-container { 
    position: relative;
	margin-top: 100px;
	margin: 0 auto;
    max-width: 100%; 
    height: auto; 
    width: auto; 
	margin-bottom: 3px; 
    opacity: 0; 
} 
.project-container div { 
    position: relative;
	margin-top: 100px;
	margin: 0 auto;
    max-width: 100%; 
    height: auto; 
    width: auto; 
	margin-bottom: 3px;  
} 

.project-slider { 
    position: relative;
	margin-top: 100px;
	margin: 0 auto;
    max-width: 100%; 
    height: auto; 
    width: auto; 
	margin-bottom: 3px;
    
    
} 

.project-slider a:hover { 
    opacity: 1; 
} 

.project-slider div { 
    position: absolute;
    max-width: 100%; 
    height: auto; 
    width: auto;
    z-index: 10000; 
}

/*-------------- project pages --------------*/

#pro_grid {
	position: absolute;
	margin-top: 150px;
	width: 90%;
	margin: 0 auto;
	height: 100%;
}

#pro-grid img {
padding: 0 0px 0px; 0;
}

#pro-grid img:hover {
opacity: .3;

}

/*#pro-grid iframe {padding-bottom: 5px;}*/

#pro-text {
box-sizing: content-box;
width: 600px;
margin-bottom: 20px;
display: block;
padding-right: 4px;

float: left;
-webkit-margin-before: 20px;
column-fill: auto;
margin-right: 6px;
}

#pro-text-long {
box-sizing: content-box;
width: 1210px;
margin-bottom: 20px;
display: block;
padding-right: 4px;

float: left;
-webkit-margin-before: 20px;
column-fill: auto;
margin-right: 6px;
}

.pro-desc {
/*width: 350px;*/
display: inline-block;
float: left;
margin-bottom: 25px;
padding-left: 5px;
padding-right: 40px;

}

.pro-desc p {
/*width: 280px;*/
letter-spacing: .06em;

}

.pro-caption {
opacity: 0.6;
display: inline-block;
letter-spacing: .06em;
/*position: relative;
float: right;
width: 150px; */
}

.pro-caption p {
font-size: 10px;
padding-left: 10px;
}

.img-caption
{
	width: 600px; 
	float: left;
	margin: 0px 10px 10px 0px;
}

.img-caption.even
{
	margin-right: 0px;
}

.img-caption .hover_text {
font-weight: medium;
line-height: 16px;
}

.pro-links {
display: inline-block;
opacity: 1;
/*float: right;
width: 150px;*/
}

.pro-links a {
color: blue;
}

/*-------------- information page --------------*/

#contact {
opacity: .5;
width: 130px;
display: inline-block;
float: left;
height: 100%;
}

#contact p {
letter-spacing: 0.009em;
}

#bio {
margin-top: -17px;
box-sizing: content-box;
width: 60%;
margin-bottom: 20px;
margin-right: 5px;
display: block;
padding-right: 6px;

margin-left: 20%;
}

#bio p {
letter-spacing: 0.04em;
}

#exhibitions {
width: 60%;
margin-left: 20%;
display: inline-block;
line-height: 13px;

}

#exhibitions p {
letter-spacing: .04em;
/*opacity: .4;*/
}

/*-------------- network page --------------*/

#network_links h3 {
display: inline-block;
padding-right: 15px;

}
#network_links a {
font-family: 'Source Code Pro','Open Sans', sans-serif;
text-transform: uppercase;
transition: all .25s ease;
font-size: 36px;
line-height: 50px;
letter-spacing: .05em;
font-weight: bold;
padding-right: 25px;

}

#network_links a:hover {
/*opacity: .4;*/
color: blue;
text-decoration: none;
}

/* --- page specific things --- */
body.index #arrow
{
	display: none;
}

#compendium {
	width: 522px;
}


