@import url('https://fonts.googleapis.com/css?family=Open+Sans:300');

* { margin:0; padding:0; }

body {
	font-family: 'Open Sans', Helvetica, "Helvetica Neue", Arial, sans-serif;
	color:#3A3A3A;
	font-size:14px;
    margin: 0px auto 40px;
	width: 100%;
	max-width: 940px;
}

.supersize {
	  background-position: center center;
	  background-repeat: no-repeat;
	  background-attachment: fixed;
	  background-size: cover;
}

.bgcolor { background-color:#FCFCFC; }

.site-title { font-size:52px; opacity:.8; margin-bottom:30px; letter-spacing:0.07em; }
#frontpage {
	position: absolute;
	top: 45%;
	left: 50%;
	transform: translateX(-50%) translateY(-45%);
	white-space:nowrap;
	letter-spacing:0.1em;
	text-align:center;
	color:#fff;
}
#frontpage a {
	color:#fff;
	opacity:.8;
	font-size:19px;
	padding-left:16px;
	padding-right:16px;
	padding-top:7px;
	padding-bottom:7px;
	letter-spacing:0.2em;
	border:3px solid #fff;
	width:800px;
	font-family: 'Open Sans', Helvetica, "Helvetica Neue", Arial, sans-serif;
	transition: 0.3s;
}
#frontpage a:hover { opacity:.6; }

a { text-decoration: none; color:#646464; transition: 0.3s; }
a:hover { text-decoration: none; color:#000; }
a.link {
	text-decoration: underline; 
	text-decoration-color: #BBBBBB; 
	text-decoration-thickness: 0.3%; 
	transition: 0.3s;
	text-underline-offset: 5px;
}
a.link:hover {
	text-decoration: underline; 
	text-decoration-color: #AAAAAA; 
	text-decoration-thickness: 0.3%; 
	color:#000;
	text-underline-offset: 5px;
}

/* Menus */
.nav {
	width:225px;
	float:left;
	position:fixed;
  	z-index:999;
	margin-top:40px;
}

.nav ul {
	list-style: none;
 	text-align: left;
 	padding: 0;
 	margin: 0;
  	z-index:999;
}

.nav li {
	font-size:15px;
	line-height:18px;
	letter-spacing:0.03em;
    padding-bottom: 8px;
}

.nav li.menu-header {
	font-size:18px; margin-bottom:16px; color:#000; letter-spacing:0.9px; font-weight:bold;
}

/* Sections */
.section-legacy, .section-page, .section-featured {
	margin-left:225px;
	position: relative;
	float:left;
	overflow:auto;
	width:715px;
	margin-top:40px;
}
.section-gallery { margin-top:40px; padding-top:0; }
.title-page, .title-gallery {
	font-size:15px;
	line-height:20px;
	text-align:center;
	letter-spacing:0.06em;
	color:#000;
}
.title-page { margin-bottom:20px; }
.title-gallery { margin-left:230px; margin-bottom:24px; }
.featured-edition, .legacy-edition { font-size:14px; text-align:left; letter-spacing:0.06em; font-weight:bold; padding-bottom:15px; margin-bottom:0; }
.featured-edition {clear:both;} 

.landscape { clear:both; padding-top:20px; }
.section-page p {
	text-align:justify;
	font-size:13px;
	line-height:22px;
	padding-bottom:20px;
}
.section-featured p, .section-legacy p {
	text-align:left;
	font-size:13px;
	line-height:20px;
	padding-bottom:20px;
}

.section-legacy img, .section-page img { margin-right:15px; margin-bottom:5px; }
.section-featured img { margin-right:0px; margin-bottom:5px; }

div.publication-txt { text-align:left; clear:both; font-size:13px; line-height:20px; }
.publication { width:350px; transition: 0.3s; padding-bottom:40px; border:0; }
.publication:hover { opacity:.8; }
.drawer-hamburger {	display:none; }

/* Masonry gallery */
figcaption { font-size:12px; letter-spacing:0.06px; }

.gallery-item img { width:350px; }
.img-edition { float:left; transition: 0.5s;}
.img-featured {float:left; padding-bottom:20px; transition: 0.5s; }
.img-featured:hover { opacity:.8; }
img { border: #D7D7D7 solid 1px; }

#gallery { left:230px; z-index:1; }
.gallery-item { margin-bottom: 5px;}
.gallery-item-rollover {
	left: 0;
	top: 0;
	border-radius: 0;
	height: 100%;
	width: 100%;
	position: absolute;
	z-index: 1000;
	opacity:0;
}
#gallery a:hover img {
	opacity:.3;
    transition: opacity 0.2s linear;
    -moz-transition: opacity 0.2s linear;
    -webkit-transition: opacity 0.2s linear;
}
.gallery-item-rollover p {
	margin:0;
	padding:0;
	padding-left:10px;
	padding-right:10px;
	font-size:14px;
	position:relative;
	top:45%;
    text-align:center;
	font-weight:bold;
	opacity:.8;
	color:#000;
	letter-spacing:0.07em;
}
.gallery-item-rollover:hover {
	opacity:1;
    transition: opacity 0.2s linear;
    -moz-transition: opacity 0.2s linear;
    -webkit-transition: opacity 0.2s linear;
}

/* Enquiry form */
.btn {
  font-size: 12px;
  padding: 8px 18px 8px 18px;
  border: solid #111111 2px;
  transition: 0.3s;
  font-weight:bold;
  text-decoration: none;
  color:#3A3A3A;
  font-weight:bold;
  background-color:#FCFCFC;
  letter-spacing:0.1em;
  font-family: 'Open Sans', Helvetica, "Helvetica Neue", Arial, sans-serif;
}
#emailsent { display:none; width:250px; height:75px; padding:10px; }
#emailsent p { text-align:center; }
.btn:hover { opacity:.6; }
legend { font-size: 14px; padding-bottom:10px; padding-left:8px; padding-top:10px; }
#enquiry-form input[type="text"], #enquiry-form input[type="email"], #enquiry-form textarea {
     width: 100%;
     box-sizing: border-box;
     -webkit-box-sizing:border-box;
     -moz-box-sizing: border-box;
	border:1px solid #C8C8C8;
	background:#FFF;
	padding:10px;
	font-family: 'Open Sans', Helvetica, "Helvetica Neue", Arial, sans-serif;
}
#enquiry-modal input[type="text"], #enquiry-modal input[type="title"], #enquiry-modal input[type="email"], #enquiry-modal textarea {
	width:400px;
	border:1px solid #C8C8C8;
	background:#FFF;
	padding:10px;
	font-family: 'Open Sans', Helvetica, "Helvetica Neue", Arial, sans-serif;
}
#enquiry-modal p { font-size:16px; }
#enquiry-form textarea { height:200px; }

/* Featured work */
p.featured-type { font-size:15px; text-align:center; margin-bottom:15px; }
.pound { font-family: Helvetica, "Helvetica Neue", Arial, sans-serif; color:#7F7F7F;}
.slider-section { clear:both; margin-bottom:40px; }
.red {color: #FF0000; }

/* Enquiry form pop up - editions pages */
#enquiry-modal textarea { height:100px;	resize:none; }
#enquiry-form fieldset { border: medium none !important; padding-bottom:10px; padding-left:0; }
#enquiry-modal fieldset { border: medium none !important; padding: 10px; }
	
/* Smartphones */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
	
	.site-title { font-size:80px; padding-bottom:20px; }
	#frontpage a { font-size:50px; }
	
	/* Drawer */
	.drawer-hamburger { display:block; }
	.drawer--left .drawer-nav { left:100% }
	
	/* Page */
	.publication { width:100%; padding-bottom:10px; }
	div.publication-txt { margin-bottom:70px; font-size:18px; line-height:33px; }	
	.nav ul { display:none; }

	/* Gallery */	
	#gallery { left:140px; margin-left: 0;}
	.gallery-item, .gallery-item img { width:100%;}
	.gallery-item-rollover p { font-size:28px; }
	.img-edition img, .img-featured img { width:90%; }
	figcaption { font-size:30px; padding-bottom:30px; padding-top:20px;}  
	
	/* Edition Titles */ 
	.featured-edition, .legacy-edition { font-size:32px; padding-bottom:30px; clear:both;  }
	
	/* Page Titles */
	.title-page { font-size:38px; margin-top: 12px; padding-bottom:50px}
	.title-gallery { font-size:44px; margin-top: 59px; padding-bottom:50px; padding-left:15px; margin-left: 0; width:100%; }
	
	/* Sections */
	.section-gallery { margin-top: 54px; }
	.section-page, .section-featured, .section-legacy { margin-left:140px; width:80%; padding-top:0px; }
	.section-featured, .section-legacy { padding-top:10px; }		
	.section-page p { font-size:26px; line-height:40px; padding-bottom:30px; }
	.section-featured p, .section-legacy p { font-size:30px; line-height:50px; padding-bottom:30px; }
	
	/* Forms */
	#enquiry-form input[type="text"], #enquiry-form input[type="email"], #enquiry-form textarea { font-size:40px; height:100px; margin-bottom:30px; }
	#enquiry-modal input[type="text"], #enquiry-modal input[type="title"], #enquiry-modal input[type="email"], #enquiry-modal textarea { font-size:28px; width:700px; }
	#enquiry-modal textarea { height:400px; }
	#enquiry-form textarea { height:500px; }
	#enquiry-modal fieldset { font-size:30px; }
	#emailsent { display:none; width:500px; height:160px; padding:10px; }
	#emailsent p { font-size:30px; text-align:center; }
	.btn { font-size: 30px; margin-top:10px; padding: 18px 28px 18px 28px;}
	legend { font-size: 30px; padding-bottom:20px; padding-top:20px; padding-left:10px; }
	
}
