/*
Theme Name:     Jason Larkin
Theme URI:      http://www.jasonlarkin.co.uk
Description:    Unusual Light theme for Jason Larkin
Author:         James Dodd
Author URI:     http://unusuallight.com
Template:       photographer_themeV2
Version:        0.1.0
*/

@import url("../photographer_themeV2/style.css");
@import url("fonts/basilia/stylesheet.css");


div, p, li {
line-height: 1.5em;
}

body.menu_position_sl #menu, body.menu_position_sr #menu {
	width: 340px;
	padding:20px 60px 0 10px;

}
body #menu ul li{
	margin-bottom: 0px;
	display:inline-block;
}
body #menu ul li a{
	line-height: 33px;
	padding: 3px 2px 2px 2px;
	display: block
}
	body #menu ul li:hover{
		//background:#000;
		//color: #fff!important;
	}
#header{
	z-index:+999999;
	margin:0!important;
}
#titleblock{
	position: absolute;
	width: 700px;
	top: 379px;
	left: 35px;
	display: block;
	-webkit-transform: rotate(-270deg);
	-moz-transform: rotate(-270deg);
	-ms-transform: rotate(-270deg);
	-o-transform: rotate(-270deg);
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
	letter-spacing: +1px;
}

#title:hover #titlepage{
	color: #333;
}
html body.menu_position_sl #content{
	margin-left: 420px;
}


body{
	font-weight: 200;
	min-width: auto!important;
	margin-top: 20px;
}

body #menu #title{ margin-right: 0px!important;}
#titledash{
	position: relative;
	margin: 0 0 0 2px!important;
}
#titledash, #titlepage{ color: #999;}


.image_box2{
	max-width: 600px;
	width: 45%;
	margin: 0 40px 28px 0;
	padding:0;
	clear: left;
}
	.image_box2:nth-child(even){
		/* margin: 0 2.5% 40px 6%; */
		clear: none;
	}
	.image_box2 h3{
		margin: 5px 0 5px 0;
		font-size: 17px!important;
	}




#img-container{
	position: absolute!important;
	top:0px;
	left: 440px;
	padding:0!important;
	height: 100%!important;
	margin-right:20px!important;
}
	.img-container-wrapper{position:relative;max-height:100%;}
	#img-container ul{
		margin-top: 40px;
	}
	#img-container img{
		background: url('http://jasonlarkin.foliosites.co.uk/files/2013/10/486.gif') no-repeat center center;

	}
	

body.information #blog_content, #img-container .otherbox, #img-container .infobox, #thumbswrap{ width:100%;}
body.information #blog_content{
	position: relative;
}


#thumbswrap{text-align: center;max-width:1300px;}
.one-box.info {
	max-width: 605px!important; margin:auto!important;
	text-align: left;
	background: #efefef;
	padding: 30px;
}

#xofy,
#xofy a,
#xofy a span,
#buttons a,
#buttons a,
#buttons a span{font-size:11px;}

#buttons_over #prev_over,
#buttons_over #prev_over:hover{opacity:0.5;left:0;background: none;}
#buttons_over #prev_over:hover{opacity:0.9;}

#buttons_over #next_over,
#buttons_over #next_over:hover{opacity:0.5;right:0;background: none;}
#buttons_over #next_over:hover{opacity:0.9;}

#buttons_over #prev_over{
	left:0;
	height: 100%;
	cursor: url('img/cursor_minus.png'), pointer;
	z-index: 2000;
	position: absolute;
}
#buttons_over #next_over{
	right:0;
	height: 100%;
	cursor: url('img/cursor_plus.png'), pointer;
	z-index: 1000;

}


#buttons{position: relative; text-transform: uppercase; }

#img-container .caption-box{
	position: absolute;
	left: 130px;
	margin-top: 13px;
}

	#xofy{
		position: absolute;
		left:0;
		text-align: left;
		text-transform: uppercase;
		width:auto;
		min-width: 300px;
		margin-top: 30px!important;
		z-index: +9999999;
	}

	#buttons{
		text-align: right;
		margin: 27px 0 0 -20px;
		right:0;
	}
	#buttons a{margin-left: 10px!important;}

	#xofy, #buttons a{margin: 0;}

#img-container{
	position: relative;
	padding: 0 40px;
	height: auto;
}
#img-container li {
	margin:0!important;
}

#img-container img{
	max-width: 100%;
	height: auto!important;
	width: auto;
	max-height: 100%;
	background: url(/assets/486.gif) center center no-repeat;
}#img-container img.notloaded{min-width:100%;}
#buttons_over{
	width: 100%;
	height: 100%;
}

#img-container #socials_con{
	display: none;
	position: absolute;
	right: 0;
	bottom: -20px;
	width: 250px;
	opacity: 0.7;
	text-align: right;
}
	#img-container #socials_con a{
		display: inline;
		text-align: right;
		margin-left: 10px;
	}
	#img-container #socials_con a:hover{
	}


h1,h2,h3,h4{
	opacity:0.9;
}


#thumbswrap img {
	width: 300px!important;
	height: 300px!important;
	float: left;
	margin: 0 15px 13px 0;
}




#text,
#overview{
	display: none;
	height: 100%;
	z-index: +9999999999;
	position: fixed;
	background: #fafafa;
	margin: 40px 0 20px 420px;
	overflow: auto;
	top: 0;
	left: 0;
	right: 0;
	bottom:0;
}#text{margin: 37px 0 20px 440px;}




#backlink{
	position: fixed;
	bottom: 0;
	height: 30px;
	background: #fafafa;
	width: 100%;
	font-size: 13px;
	padding: 20px 0 5px 0;
	text-transform: uppercase;
}



#text .contentss{
	max-width: 700px;
}

.page .storycontent {
	max-width: 750px;
}

b,strong{font-family:basiliatbold; font-weight:normal;}



@media handheld, only screen and (max-width: 768px), only screen and (max-device-width: 768px) {
	body{
		padding:0!important;
		max-width:90%;
		margin: 20px auto;
		padding-bottom:50px!important;
		width: 768px;
	}
	#menu{
		margin-left: 0px!important;
		width: 100%!important;
		background:none!important;
		z-index: +99999999999!important;
	}
	
	body.menu_fixed #menu, #header, #title, #img-container, .img-container-wrapper{
		position: relative!important;
		left:0;
		top:0;
		width: 100%!important;
		text-align: center;
	}
	body #img-container, body .img-container-wrapper{
		width: 100%!important;
		max-width:100%!important;
		height: auto!important;
		max-height:none!important;
	}
	#titleblock a, #titleblock span{
		font-size: 30px;
	}
	
	#img-container{
		margin-bottom: 40px!important;
	}
	#img-container, #overview, #text{
		position:relative!important;
		left:0!important;
		margin-left:0!important
	}
	#img-container img{
		height:auto!important;
		max-width:100%;
	}
	
	#menu-main-menu{text-align: center;}
	#menu-main-menu li{
		display: inline;
		padding: 0 10px;
		line-height: 40px;
		font-weight:400;
	}
	#menu-main-menu li a{font-size: 20px!important}
	#header{
		height: 60px;
	}
	
	#tumblr_embed iframe{
		z-index: +999999;
	}
	#titleblock{
		display: block;
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0);
		top: 0;
		left: 0;
		text-align: center;
		width: 100%;
		font-size: 200%;
	}
	
	body.menu_position_sl #menu .container{
		text-align: center;
		padding:0;
	}
	#content{
		margin-left:0!important;
		margin-right:0!important;
		margin-top: 30px;	
	}


	.image_box2{
		max-width:100%;
		width: 100%;
		margin: 0 0 30px 0;
		padding:0;
		clear:left;
		text-align: center;
	}
		.image_box2:nth-child(even){
			margin: 0 0 30px 0;
			display:block;
		}
		.image_box2 img{display:inline;}
	
	#img-container{
		min-width: auto!important;
	}
	body #img-container li{max-height:auto!important;}
	
		body.information #blog_content, #img-container .otherbox, #img-container .infobox, #thumbswrap{
			width:100%!important;
			height:auto!important;	
		}
	#img-container .infobox{
		margin-bottom: 60px!important;
	}
	#img-container .caption-box {
	left: 0px;
	margin-top: 40px;
	}	
	
	#overview, #text{
		position: relative!important;
		margin:0;
		max-width:100%;
	}
	
	#backlink{
		position: relative!important;
		text-align: center;
		padding: 40px 0 0px 0;
	}
	
	#thumbswrap img{
		height: auto!important;
		width: auto!important;
		max-height: 50%;
	}
		#thumbswrap{text-align:center;}
		#thumbswrap .thumbimg{
			display:inline-block;
			max-width: 48%;
			margin: 0 2% 20px 0!important;
		}
		#thumbswrap .thumbimg:nth-child(even){
			margin: 0 0 20px 0!important;
		}

	#xofy, #buttons{position:absolute;}
	#img-container #buttons, #img-container #xofy{
		top: auto!important;
	}
	#img-container #buttons{right:0;}

	body.menu_position_sl #menu, body.menu_position_sr #menu{padding-left:0;}


	body h2, body h2 span{font-size:25px;}
	body h3, body h3 span{font-size:22px;}
	#backlink, #backlink a, body h4, body h4 span{font-size:20px;}
	
	body, body p, body ul, body li, body pre, body div, body span{
	font-size: 20px;
	}
	
	#xofy, #xofy a, #xofy a span, #buttons a, #buttons a, #buttons a span {
	font-size: 15px;
	}

	#buttons{
		margin: 25px 0 0 -20px;
	}

}