/*

Michele Matyn Web

Author: Michele Matyn
Designer & Programmer: Lauren Grusenmeyer

*/

/**
 * @license
 * MyFonts Webfont Build ID 3045423, 2015-06-19T08:26:37-0400
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: GrotesqueMTStd by Monotype 
 * URL: http://www.myfonts.com/fonts/mti/grotesque-mt/std-roman/
 * Copyright: Copyright 1992, 2002 Adobe Systems Incorporated. All Rights Reserved. Copyright 1992, 2002 The Monotype Corporation. All rights reserved.
 * Licensed pageviews: 250,000
 * 
 * 
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=3045423
 * 
 * © 2015 MyFonts Inc
*/


/* @import must be at top of file, otherwise CSS will not work */
@import url("//hello.myfonts.net/count/2e782f");
@font-face {font-family: 'GrotesqueMTStd';src: url('webfonts/2E782F_0_0.eot');src: url('webfonts/2E782F_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/2E782F_0_0.woff2') format('woff2'),url('webfonts/2E782F_0_0.woff') format('woff'),url('webfonts/2E782F_0_0.ttf') format('truetype');}

@import url("//hello.myfonts.net/count/2ed286");
@font-face {font-family: 'GrotesqueMTStd-Italic';src: url('webfonts/2ED286_0_0.eot');src: url('webfonts/2ED286_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/2ED286_0_0.woff2') format('woff2'),url('webfonts/2ED286_0_0.woff') format('woff'),url('webfonts/2ED286_0_0.ttf') format('truetype');}
@font-face {font-family: 'ClassicGrotesquePro-SemiBold';src: url('webfonts/2ED286_1_0.eot');src: url('webfonts/2ED286_1_0.eot?#iefix') format('embedded-opentype'),url('webfonts/2ED286_1_0.woff2') format('woff2'),url('webfonts/2ED286_1_0.woff') format('woff'),url('webfonts/2ED286_1_0.ttf') format('truetype');}
 
 
/* Main
-------------------------------------------------- */


body {
    font-family: 'GrotesqueMTStd';
    color: black;
    font-size: 14px;
    line-height: 17px;
    margin: 0 0 60px 0;
    }
    
html {
	position: relative;
	min-height: 100%;
	}
		
.container-fluid {
	width: 100%; 
	max-width: 1500px;
	min-width: 786px;
	}

#left, #right, #right-menu {
	min-width: 350px;
	}
		
a, a:visited, a:active, img a {
	color: black;
	font-weight: normal;
	text-decoration: none;
	border-bottom: none;
	}
	
a:hover {
	color: black;
	text-decoration: none;
	font-style: italic;
	}

em {
	font-family: 'GrotesqueMTStd-Italic';
	}

strong {
	font-family: 'ClassicGrotesquePro-SemiBold';
	}
	
p {	
	margin: 10px 0 10px 0;
	}


.container-fluid h1, .container-fluid h3, .container-fluid h4, .container-fluid h5, .container-fluid h6	{
	font-size: 32px;
	font-family: 'ClassicGrotesquePro-SemiBold';
	line-height: 1.1em;
	color: black;
	margin-bottom: 0;
	margin-top: 0;
	}

.container-fluid h2 {
	font-size: 32px;
	line-height: 1.1;
	color: black;
	margin-bottom: 0;
	margin-top: 0;
	}
	
.caption {
	font-size: 12px;
	margin: 5px 0 -5px 0;
	font-family: 'GrotesqueMTStd-Italic';
	}
	
.footer {
	position: absolute;
	width: 100%;
	height: 40px;
	bottom: 0;
	padding-bottom: 20px;
  	}
  	
.footer-home {
	position: absolute;
	width: 100%;
	height: 40px;
	bottom: 0;
	padding-bottom: 20px;
	}
	
.footer-pages {
	position: absolute;
	width: 100%;
	height: 40px;
	bottom: 0;
	padding-bottom: 20px;
	}

img {
	width: 100%;
	}
		
img a:hover	{
	border-bottom: none;}

img.img	{
	width: 100%;
	height: auto;
	}
	
img.img.vertical {
	width: 70%;
	height: auto;
	}
	
.clear {
	clear: both;
	}

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

li {
	margin: 0;
	padding: 0;
	}

.insprong {
	padding-left: 40px;
	}

.index li {
	padding: 0;
	float: left;
	}
	
.green {
	background-color: #2E8B57; 
	/*#009900;  #088A4B;*/
	}

.slideshow {
	padding-top: 15px;
	}
	
.slideshow-title {
	padding-top: 10px;
	padding-bottom: 20px;
	bottom: 0;
	text-align: left;
	font-style: italic;
	}

.slideshow .slide {
	height: 100%;
	}

.thumb {
	height: 100px;
	margin: 10px 0 10px 0;
	}
.thumb img {
	height: 100%;
	width: auto;
	}
.project {
	border-bottom: 1px solid black;
	margin-bottom: 5px;
	}

figure {
	padding-top: 20px;
	}
		
#right {
	height: 100%;
	padding-top: 15px;
	float: right;
	}
		
#left {
	padding-top: 15px;
	margin-bottom: -50px;
	}
	
#right-menu{
	position: fixed;
	right: 0;
	height: 100%;
	padding-top: 15px;
	}

.project-page {
	padding-bottom: 15px;
	}

.project-page-images {
	padding-bottom: 15px;
	padding-top: 15px;
	}
	
.project-page a, .project-text a {
	border-bottom: 1px solid black;
	}

.project-page h1 a, .project-text h1 a {
	border-bottom: none;
	}

 h1.arrow a, .arrow {
	font-family: "times new roman";
	}
	
.arrow-right {
	float: right;}

.next {
	font-family: 'ClassicGrotesquePro-SemiBold';
	}
	
.mmbutton {
	padding-top: 2px;
	}

.tags {
	text-transform: lowercase;
	}

.metadata {
	padding: 0 0 0 40px;
	}

hr {
    margin-top: 25px;
    margin-bottom: 25px;
    border: 0;
    border-top: 1px solid black;
}

.time {
 	font-size: 14px;
	float: right;
    font-family: 'GrotesqueMTStd';
	}

.project-title {
	padding-left: 40px;
	padding-bottom: 120px;
	}

body.black, body.black a {
	background-color: #181818;
	color: white;
	}
	
.image {
	padding-bottom: 15px;
	}

.translate {
	padding-left: 40px;
	}

/* Media Queries*/

@media and screen (max-width: 786px) {
	body {
	font-size: 18px;
    line-height: 21px;
    }
    .container-fluid h1, .container-fluid h2, .container-fluid h3, .container-fluid h4, .container-fluid h5, .container-fluid h6	{
	font-size: 32px;
	line-height: 1.1em;
	}
}

@media only screen and (min-width: 1200px) {
	#left p {
	padding-right: 10%;
	}
}