@charset "utf-8";
/* CSS Document */
* {
    box-sizing: border-box;
}

body { background-color: #eeeeee; margin: 0; padding: 0; font-size: 100%;}
#page {
	max-width: 1250px;
	margin: 0 auto;
	padding: 10px 125px;
	position: relative;
}

/* text */

h1 { margin: 0 0 .5em 0; font-size: 1.3em; font-weight: 500; line-height: 1.1em }

h2 { margin: 0 0 .5em 0; font-size: 1.4em; font-weight: 600; line-height: 1.1em }

#loader {
  position: absolute;
  left: 52%;
  top: 50%;
  z-index: 1;
  width: 150px;
  height: 150px;
  margin: -75px 0 0 -75px;
  border: 3px solid #FFF;
  border-radius: 50%;
  border-top: 3px solid #CCC;
  width: 50px;
  height: 50px;
  -webkit-animation: spin 1.5s linear infinite;
  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/*previous and next Buttons */

.row .prev, .next {
	cursor: pointer;
	position: absolute;
	top: 30%;
	width: auto;
	padding: 75px 35px;
	color: rgba(80,80,80,.2);
	text-decoration: none;
	font-size: 35px;
	transition: 0.3s ease;
	border-radius: 5px 0 0 5px;
}

.row .prev {
  left: 4%;
}

.row .next {
  right: 4%;
}

.row .prev:hover, .next:hover {
		color: rgba(80,80,80,1);
}


/* Add padding BETWEEN each column */
.row,
.row > .column {
    padding: 0px;
}

/* Create two equal columns that floats next to each other */
.column {
    float: left;
    width: 50%;
	text-align: center;
	position: relative;
}

/* Clear floats after rows */ 
.row:after {
    content: "";
    display: table;
    clear: both;
}




/* row */

.row {
	margin-top: 20px;
	padding-right: 0;
	box-shadow: 5px 10px 18px rgba(15,15,15,.5);
}


.content .artwork_text {
			position: absolute;
			text-align: left;
    		top: 11%;
    		left: 10%;
			padding-right: 40px;
			line-height: 22px;
	 }

.content .artwork_text h2 {
	text-align: left;
	font-weight: bold;
	font-size: 1.2em;
	font-family: Arial, Helvetica, sans-serif;
	margin-bottom: 0px;
	margin-top: 10px;
			 }
	 
/* Section Overleaf */

section.overleaf { 	
	max-width: 1000px;
	margin: auto;
	
  	position: relative;
}

section.overleaf div.text {
	text-align: center;
	padding: 0px;
	margin-top: 20px;
}

section.overleaf div.text a { text-decoration: none; color: rgba(80,80,80,.5); }

section.overleaf div.text p {
	color: rgba(80,80,80,.5);
	font-size: 1.3em;
	font-family: "Minion Pro"; 
	margin:0;
}

section.overleaf div.text a:hover { color: #2b0306; }
section.overleaf div.text a:visited { color: rgba(80,80,80,.5); }


/* Navigation */	
	 
nav {
	position: relative; text-align: center;	
	}

nav ul { 
	width: auto; 
	margin: auto;
	margin-top: 35px;
	padding: 0;
	}
	
nav ul li {
	display: inline-block; 
	padding: 0px 15px 0px 15px;
	text-align: center;
	font-family: "Minion Pro";
	}

nav ul li a { text-decoration: none; color: rgba(80,80,80,.5); }	
	
nav ul li a:hover { color: #2b0306; } 

nav ul li a:visited { color: rgba(80,80,80,.5); }

/* footer */

footer { 
	width: 100%;
	margin-top: 60px;
	text-align: center; 
	} 
	
footer div.text p { 
	color: rgba(80,80,80,.6);
	font-family: "Minion Pro";
 }
	
	
/* Media Queries */

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

#loader {
  left: 55%;
  top: 45%;
}

	#page {
	padding: 10px 45px;
}

.row .prev {
  left: -3%;
}

.row .next {
  right: -3%;
}	
	
	}
	
@media screen and (max-width: 1000px) {
	
	#page {
	padding: 10px 45px;
}

.row .prev {
  left: -3%;
}

.row .next {
  right: -3%;
}	

.content .artwork_text h2 {
	font-size: 1.1em;
}
.content .artwork_text p {
	font-size: 0.9em;
	margin-top:7px;
	line-height: 1.3em;
}
	}

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

#loader {
  left: 60%;
  top: 40%;
}

	#page {
	padding: 10px 200px;
}

.row .prev, .next {
	top: 37%;
}

.row .prev {
  left: 9%;
}

.row .next {
  right: 9%;
}

.column {
       width: 100%;
    }
		
.content .artwork_text {
    		top: 12%;
    		left: 4%;
			padding-right: 10%;
	 }

.content .artwork_text h2 {
	font-size: 1.2em;
}
.content .artwork_text p {
	font-size: 1em;
	line-height: 1.4em;
}

section.overleaf p { clear: both;}

}

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

	#page {
	padding: 10px 175px;
}
}

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

	#page {
	padding: 10px 150px;
}

.row .prev {
  left: 8%;
}

.row .next {
  right: 8%;
}

}

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

	#page {
	padding: 10px 125px;
}

.row .prev {
  left: 6%;
}

.row .next {
  right: 6%;
}

}

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

	#page {
	padding: 10px 100px;
}

.row .prev {
  left: 2%;
}

.row .next {
  right: 2%;
}
}

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

	#page {
	padding: 10px 75px;
}

.row .prev {
  left: 0%;
}

.row .next {
  right: 0%;
}
}

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

#loader {
  left: 65%;
}

	#page {
	padding: 10px 50px;
}

.row .prev {
  left: -4%;
}

.row .next {
  right: -4%;
}
}

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

	#page {
	padding: 10px 33px;
}

.row .prev {
  left: -8%;
}

.row .next {
  right: -8%;
}
}

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

	#page {
	padding: 10px 25px;
}

.row .prev, .next {
	font-size: 30px;
}

.row .prev {
  left: -8%;
}

.row .next {
  right: -8%;
}

.content .artwork_text h2 {
	font-size: 1.1em;
}
.content .artwork_text p {
	font-size: 1em;
	line-height: 1.3em;
}
}

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

	#page {
	padding: 10px 25px;
}

.row .prev, .next {
	font-size: 30px;
}

.row .prev {
  left: -10%;
}

.row .next {
  right: -10%;
}

.content .artwork_text h2 {
	font-size: 1em;
}
.content .artwork_text p {
	font-size: 0.9em;
	line-height: 1.2em;
}

}

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

	#page {
	padding: 10px 20px;
}

.row .prev, .next {
	font-size: 25px;
	top: 33%;
}


.row .prev {
  left: -11%;
}

.row .next {
  right: -11%;
}

.content .artwork_text h2 {
	font-size: 1em;
}
.content .artwork_text p {
	font-size: 0.8em;
	line-height: 1.2em;
}
}