@font-face {
	font-family: proxima-light;
	src: url('fonts/proximanova-light.otf');
} 

@font-face {
	font-family: proxima-semibold;
	src: url('fonts/proximanova-semibold.otf');
}



body {
	color:black;
	font:90% proxima-light,sans-serif;
	line-height:2em;
	background:white; 
	margin:0;
	padding:0;	
}



p {
	font-size: 1em; 
	line-height:1.5em;
	margin:0;
	margin-bottom:1em;
}



h1 {
	font-size: 1.4em;
	font-family: proxima-semibold;
	font-weight: normal;
	margin: 0;
	width:100%;
	text-align:right;
	
}


h2 {
	font-size: 1.1em; 
	font-family: proxima-semibold;
	font-weight: normal;
	line-height: 1.5em;
	margin: 1.5em 0 1.2em 0;

}

h3 {
	font-size: 1.1em; 
	font-family: proxima-semibold;
	font-weight: normal;
	margin: 1em 0 1em 0;
}


strong  {
	font-size: 1em; 
	font-family: proxima-semibold;
	font-weight: normal;
}



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


menu a{
	text-decoration: none;
}


a {
	margin: 0;
	padding: 0;
	text-decoration: underline;
	color:black;

}



a:hover {
	margin: 0;
	padding: 0;

	text-decoration: underline;
}




#wrapper {
	position:relative;
	margin: 2.4em auto;
	padding:0;
	width:94%;
	max-width:1200px;
}

#nav {
	position:absolute;
	margin: 0;
	padding:0;
	width:15%;
}

#menu {
	position:relative;
	top:5.5em;
	margin: 0;
	width:100%;
	text-align:right;
}



#menu li{

	color:#91918e;
	font: 1.1em;
	font-family: proxima-semibold;
	font-weight: normal;
	margin-bottom:0.3em;
}

#menu a{
	color:black;
	text-decoration:none;
}

.works_default {
	color:#91918e;
}



#main {
	position:relative;
	left:23%;
	width:77%;
	margin: 0;
	padding: 0;
}

#content {
	position: relative;
	width: 61%;
	margin:0;
	margin-bottom:2em;
	padding:0;
}

#picbox {
	position:relative;
	width:100%;
}

#picbox img{
	margin: 0;
	margin-top:0.2em;
	padding: 0;
	width:61%;
}


#quote {
	position: absolute;
	width: 28%;
	right:0px;
	bottom: 0px;

}

#quote p{

	margin-bottom:0;
	margin-top:2em;
}

.quote_credit {
	font-size:0.8em;
	font-style: italic;
}



.credit {
	position: relative;
	width: 100%;
	text-align:right;
	font-size:0.7em;
	line-height:0.7em;
	color:#91918e;

}

.works_menu {
	position:absolute;
	left:78%;
	top: 0px;

	width:20%;
	line-height:1.2em;
	z-index:5000;
}

.works_menu ul {
	margin:0;
	margin-bottom:2em;
	padding:0;
	width:100%;
}

.works_menu li {
	margin:0;
	margin-bottom: 0.7em;
	color:#91918e;
	font: 1.1em;
	font-family: proxima-semibold;
	font-weight: normal;
}

.works_menu a {
	text-decoration: none;
}

.works_menu h2 {
	margin-bottom:0.6em;
	margin-top:1.5em;
}
	
table {
	width:100%;
	line-height:1.2em;
	border-bottom:  1px #91918e dotted;
}


td {
	vertical-align:top;
	border-top: 1px #91918e dotted;
	padding:0.5em 0;
}

.column1 {
	width:15%;
	padding-right:0.5em;
}

.column2 {
	width:25%;
	padding-left:0.5em;
	padding-right:0.5em;
}

.column3 {
	width:25%;
	padding-left:0.5em;
	padding-right:0.5em;
}

.column4 {
	width:35%;
	padding-left:0.5em;
}


.first_work a{
	color:#91918e;
}

#mobile_black {
	color:#91918e;
}


.js-video {
  height: 0;
  padding-top: 0;
  padding-bottom: 51%;
  margin-top: 2em;
  margin-bottom: 2em;
	margin-left:0;
  position: relative;
  overflow: hidden;
}
 

.js-video iframe {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
}




/* Tablet */

@media screen and (max-device-width: 900px) {

body {
	font-size:140%;

}

h1 {
	font-size: 1.6em;
	text-align:left;
}

#wrapper {
	margin: 1.4em auto;
	width:94%;
	max-width:900px;
}	

#nav {
	width:15%;
}

#main {
	left:25%;
	width:75%;
}

#content {
	position: relative;
	width: 100%;
}

#menu {
	top:2em;
	text-align:left;
	left:0px;
}



#quote {
	position: absolute;
	width: 0px;
	height:0px;
	right:0px;
	bottom: 0px;
	overflow:hidden;
}

#picbox img{
	margin-top:0.2em;
	width:100%;
}

.works_menu {
	font-size:0.8em;
	position:absolute;
	left:0%;
	top: 27em;
	width:15%;
}



}


/* Mobile */

@media screen and (max-device-width: 500px) {

body {
	font-size:170%;

}
#wrapper {
	margin: 1.4em auto;
	max-width:90%;
	width:90%;

}	

#nav {
	position:relative;
	width:100%;
	border-bottom: 1px solid black;
	margin-bottom:2em;
}

#main {
	left:0;
	width:100%;
}


#menu {
	top:0;
	height:5em;
	font-size:1.7em;
	margin-top:0.6em;
	margin-bottom:0.4em;
	padding-top:0.8em;
	border-top:1px black solid;
	text-align:left;
}


h1 {
	font-size:3em;
	
}


#menu_left {
	position:absolute;
	left:0;
	top:1em;
	margin-bottom:0;
}


#menu_right {
	position:absolute;
	left:50%;
	top:1em;
	margin-bottom:0;
}

p.credit {
	margin-bottom:3em;
}

	


.works_menu {
	position:relative;
	font-size: 1em;
	width:100%;
	top:1.2em;
	padding-top:3em;
	padding-bottom:0.6em;
	border-top: 1px solid black;

}


.menu_only {
	top:0;
	padding-top:0;
	border-top: 0;
}

.hide_content {
	width:0;
	height:0;
	overflow:hidden;
}


.works_default {
	color:black;
}

.credit {
	font-size: 0.5em;
}

#mobile_black {
	color:black;
}
}