/*
Theme Name: Ronny Emborg
Theme URI: http://wordpress.org/extend/themes/toolbox
Author: Rock'n'Roll Grafix / Cadwalk
Author URI: http://cadwalk.dk/
Description: A semantic, HTML5, canvas for CSS artists and an ultra-minimal set of super-clean templates for your own WordPress theme development.
Version: 1.4
Template: toolbox
License: GNU General Public License
License URI: license.txt
Tags: custom-menu, sticky-post, microformats, rtl-language-support, translation-ready, full-width-template, post-formats

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* =Structure
-------------------------------------------------------------- */

img, a {
  border: none;
  border-style:none;
  outline: none;
  background: transparent;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF); 
    zoom: 1;
}

body, html{
	margin: 0;
	padding: 0;
	width: 100%;
	
}

body{
	background:url(images/background_branch.jpg) no-repeat;
}

body.page-template-page-the-book-php{
	background: none;
}

*{
	font-family: 'MuseoSans-300';
	font-size: 13px;
}

a{
	color:#e74011;
	text-decoration:none;
}

h1{
	font-size: 24px; 
	font-family: 'Libre Baskerville', serif;
	font-weight: 400;
	text-transform: uppercase;
}

h2{
	color: #e74011;
	margin-bottom: -17px;
}

h3{
	font-size: 16px; 
	font-family: 'Libre Baskerville', serif;
	font-weight: 400;
	text-transform: uppercase;
}

p{
	line-height: 21px;
	margin: 20px 0;
}

#loader{
	position: fixed;
	left: 50%;
	top: 455px;
	z-index: 400;
	width: 60px;
	height: 60px;
	background: black;
	border-radius: 30px;
	margin: -30px;	
}

#loader img{
	position:absolute;
	top:16px;
	left:16px;
}


/* CLASSES */

.col12{width: 12.5%; float: left}
.col16{width: 16.6%; float: left}
.col20{width: 20%; float: left}
.col25{width: 25%; float: left}
.col33{width: 33.3%; float: left}
.col50{width: 50%; float: left; overflow: hidden}
.col75{width: 75%; float: left}
.col100{width: 100%}

.clear{clear: both; position: relative;}

.tweener{
	-webkit-transition: all .6s ease-in-out;
   	-moz-transition: all .6s ease-in-out;
	-o-transition: all .6s ease-in-out;
	-ms-transition: all .6s ease-in-out;
	opacity:0;
}

.img .alignleft{
	float:left; 
}

.img .alignright{
	float:right; 
	opacity:0.8;	
}

/* ID's */

#navigation{
	position: fixed;
	top:50px;
	left: 50%;
	margin-left: -30px;
	z-index: 100;
}

#navigation .block{
	display: block;
	margin-bottom: 15px;
}



#navigation .icon{
	background: white;
	width: 60px;
	height: 60px;
	border-radius: 30px;
	line-height: 30px;
	text-align: center;
	display: table;
	color: #000;
	cursor: pointer;
	text-decoration: none;
	position:relative;
	
	-webkit-transition: all .1s ease-in-out;
   	-moz-transition: all .1s ease-in-out;
	-o-transition: all .1s ease-in-out;
	-ms-transition: all .1s ease-in-out;
}


	
	#navigation .icon:hover .text{
		display:table-cell;
	}
	
	#navigation .icon:hover .smallicon{
		display:none;
	}


	#navigation .icon:hover{
		background: #000;
		color: #fff;
	}

#navigation .icon .smallicon{
	text-decoration: none;
	color: #000;
	margin: 0;
	display:table-cell;
	vertical-align: middle
}

#navigation .icon .text{
	display:none;
	text-decoration:none;
	font-size:9px;
	text-transform:uppercase;
	color: #fff;
	line-height: 10px;
	vertical-align: middle
}

	


#wrapper{

	position: relative;
}

#the-home{
	position: relative;
}


#left #innercontent,
#right #innercontent{
	padding: 62px 25% 92px 18%;
}

#left #logo{
	margin-bottom: 80px;
}

#right{
	float:right;
}

#biggallery_v2{
	left: 100%;
}

.gallery{
	float: left;
}

.gallery .section{
	display:block;
}

.gallery .section.first{
	display:block;
}

.gallery .img{
	position: relative;
	float: left;
	margin: 0 0 8px 0;
	background:url(images/ajax-loader.gif) no-repeat center;
}

#the-book .gallery .img:last-child{
	margin:0;
}

.gallery .img .border, 
.gallery .img .magnify, 
.gallery .img .title{
	display:none;	
}


.gallery .img .title,
.gallery .img .magnify{
	-webkit-transition: all .1s ease-in-out;
   	-moz-transition: all .1s ease-in-out;
	-o-transition: all .1s ease-in-out;
	-ms-transition: all .1s ease-in-out;
	opacity: 0;
}


.gallery .img:hover .title,
.gallery .img:hover .magnify{
	opacity: 1;
}

.gallery .img .border{
	position: absolute;
	width: 8px;
	height: 100%;
	background: white;
	display: block;
	z-index: 20;
	
}

.gallery.left .img .border{right: 0px;}
.gallery.right .img .border{left: 0px;}

.gallery .img .magnify{
	position: absolute;
	right: 5px;
	top:5px;
	
	background: url(images/magnifyer.png) no-repeat;
	width: 60px;
	height: 60px;
	z-index: 20;
}

.img.col12 .magnify, 
#the-book .img.col50 .magnify,
#the-book .img.row4 .magnify,
#the-book .img.row5 .magnify{background-size:43px 43px; width:43px; height:43px;}
.img.col16 .magnify,
#the-book .img.row2 .magnify,
#the-book .img.row3 .magnify{background-size:48px 48px; width:48px; height:48px;}
.img.col20 .magnify{background-size:55px 55px; width:55px; height:55px;}


.gallery .img .title{
	position: absolute;
	bottom: 0;
	height: 59px;
	line-height: 59px;
	width: 80%;
	padding: 0 10%;
	background: rgba(0,0,0,0.7);
	color: #fff;
	font-size: 11px;
	text-decoration:none;
}

.gallery .img .title:before{
	content:"• ";
	font-size: 20px;
	position: relative;
	top:-1px;
	margin-right: 2%;
	float:left;
}

.gallery .img img{
	position: relative;
	float: left;
	margin: 0;
	width: 100%;
	opacity:0;
	-webkit-transition: opacity .6s ease-in-out;
   	-moz-transition: opacity .6s ease-in-out;
	-o-transition: opacity .6s ease-in-out;
	-ms-transition: opacity .6s ease-in-out;

}

.gallery .img.zoom {
	display:block;
	overflow:hidden;
}



#the-book{
	padding-bottom: 100px;
}

#the-book .section.even .txt,
#the-book .section.odd .gallery{
	float: left;
	position: relative;
}

#the-book .section.odd .txt,
#the-book .section.even .gallery{
	float: right;
	position: relative;
}

#the-book .section.even .txt .inner{
	padding: 42px 17%;
	text-align: right;
	width: 66%;
	position: relative;
}

#the-book .section.odd .txt .inner{
	padding: 72px 17%;
	width: 66%;
	position: relative;
}

#the-book .section.even .border{
	right: 0px;
}

#the-book .section{
	position: relative;
	clear: both;
}


#the-book .section.bookcount0{
	border-top:none;	
}

#the-book .section.bookcount0 h1, 
#the-book .section.bookcount0 h3,
#the-book .section.bookcount0 address {
	text-align:center;
}

#the-book .section.bookcount0 .txt .inner {
	text-align:left;
}

#the-book .bigimg{
	background: #f2f2f2;
	text-align: center;	
}

#the-book .odd .row1{float:left; width:50%; margin:0}
#the-book .even .row1{float:right; width:50%; margin:0}

#the-book .odd .row2,
#the-book .odd .row3,
#the-book .odd .row4,
#the-book .odd .row5{
	float:right;
	width:50%;
}

#the-book .even .row2,
#the-book .even .row3,
#the-book .even .row4,
#the-book .even .row5{
	float:left;
	width:50%;
}

#the-book .odd .row1 .border{
	right:0px;	
}

#the-book .even .row1 .border{
	left:0px;	
}


#the-book .gallery .img.row1 .magnify{
	right:13px !important;
}

#the-book .img.row2 .magnify,
#the-book .img.row3 .magnify,
#the-book .img.row4 .magnify,
#the-book .img.row5 .magnify{
	left:5px;
}

#the-book #preorder{
	background: rgba(0, 0, 0, 0.8);
	color: #fff;
	padding: 20px;
}

#the-book #preorder h3{
	text-align:left;
}

#the-book #mailchimp input.name,
#the-book #mailchimp input.email
{
	width: 308px;
	background: #e3e3e3;
	border: 1px solid #7a7a7a;
	color: #7a7a7a;
	padding: 5px;
	text-align: center;	
	float: right;
}

#the-book #mailchimp input.submit,
#the-book p.alert,
#the-book a#orderLink
{
	width: 100%;
	background: #e74011;
	color: #fff;
	padding: 10px 0;
	text-align: center;
	text-decoration: none;
	display: block;
}


#press .section a {
	display: block;
	height: 300px;
	margin-bottom: 5px;
	overflow: hidden;
	position: relative;
	-webkit-transition: all .2s ease-in-out;
   	-moz-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	-ms-transition: all .2s ease-in-out;
}

#press .section a:hover {
	height: 330px;
}
	#press .section a img{
		position:relative;
		top:-15px;
		-webkit-transition: all .2s ease-in-out;
		-moz-transition: all .2s ease-in-out;
		-o-transition: all .2s ease-in-out;
		-ms-transition: all .2s ease-in-out;
	}
	
	#press .section a:hover img{
		top: 0px;
	}


#press #right #innercontent {
	padding: 62px 15% 92px 8%;
}

#press .img .title{
	position: absolute;
	bottom: 0;
	height: 59px;
	line-height: 59px;
	width: 80%;
	padding: 0 10%;
	background: rgba(0,0,0,0.7);
	color: #fff;
	font-size: 11px;
	display:none;
}

#press .img .title:before{
	content:"• ";
	font-size: 20px;
	position: relative;
	top:-1px;
	margin-right: 2%;
	float:left;
}

#press .img:hover .title{
	display:block;
}

#press .img .title span,
#the-book .img .title span
{
	font-size:11px;
}



#footer{
	left: 9%;
	position: relative;
	font-size: 11px;
	height: 50px;
	width: 82%;
	text-align: center;
}

#footer p{
	height:50px;
	margin:0;
	padding:0;
	line-height: 50px;
}

#footer span{
	margin: 0px 10px;
	position: relative;
	font-size: 11px;
}

#footer a{
	font-size: 11px;
	color: #000;
	text-decoration: none;
}

#footer a:hover{
	text-decoration: underline;
}

#footer #facebook{
	position: relative;
	top:3px;
}

#footer #twitter{
	position: relative;
	top:2px;
}

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

	#wrapper{
		overflow:visible;			
	}
	
	#loader{
		top:50%;		
	}
	
	#navigation{
		left: 5%;
		top:20px;
		width: 90%;
		display: table;
		margin-left:0;
	}
	
	#navigation .block{
		display: inline-block;
		margin-right: 7%;
	}
	
	#navigation .block.last{
		margin-right: 0;
	}

		
	#navigation .icon{
		width: 40px;
		height: 40px;
		border-radius: 20px;
		overflow:hidden;
	}
	
	#navigation .icon .text,
	#navigation .icon .smallicon{
		display:block;
		height:40px;
		width:40px;
		text-align:center;
		line-height:40px;

	}
	
	#navigation .icon .text{
		opacity:0;
		height:0px;
		
	}
	
	#navigation .icon:hover .text{
		opacity:1;
	}
	
	#navigation .icon:hover .smallicon{
		opacity:0;
	}
	
	
	
	#the-home, #the-book{
		position: relative;
		left: 0;
		opacity:0;
		display:block;
		float:left;
		overflow:hidden;
	}
	
	#left, 
	#right,
	#right #biggallery,
	#right #biggallery .gallery{
		position: relative;
		clear: both;
		width: 100%;
		overflow: auto;
		left: 0;
	}
	
	#left #innercontent{
		padding: 92px 18%;
	}
	
	#right #innercontent{
		padding: 92px 18%;
	}
	
	#left #logo{
		left: 50%;
		margin-left: -152px;
		position: relative;
	}
	
	.gallery.right .img .border{right: 0px; left: inherit}
	.gallery.right .img:last-child .border{width:0px;}
	.gallery.right .img:last-child .magnify{right:5px;}
	.gallery.right .img .border.desk{display: none}
	
	#right .gallery a.img.col100{
		margin: 0 8px 8px;	
		width:auto;
	}

	
	#biggallery_v2 .col12{width: 25%; float: left}
	#biggallery_v2 .col25{width: 50%; float: left}
	#biggallery_v2 .col50{width: 100%; float: left; overflow: hidden}	
	
	#biggallery_v2 .section .col25:nth-of-type(2n+1) .border,
	#biggallery_v2 .section .col33:nth-of-type(3n+1) .border,
	#biggallery_v2 .section .col12:nth-of-type(4n+1) .border,
	#biggallery_v2 .section .col50 .border
	{display:none !important;}
			
	#the-book .col50{
		width: 100%;
	}
	
	#the-book .col100 img{
		width: 100%;
	}
	
	#the-book .bookcount0 .img.col50{
		width: 50%;
	}
	
	#the-book .txt .inner,
	#the-book .section:nth-child(even) .txt .inner {
		padding: 42px 25% 42px 18%;
		text-align: left;
	}
	
	#the-book #mailchimp input.name,
	#the-book #mailchimp input.email
	{
		width: 208px;
	}
	
	#the-book #mailchimp input.submit,
	#the-book p.alert
	{
		width: 220px;
		
	}
	
	#the-book .bookcount0{
		margin-top:50px;
	}
	
	.fancybox-title-float-wrap .child .dot,
	.fancybox-title-float-wrap .child .captionright{
		display:none !important;
	}
	
	#footer{
		top:20px;
	}
	
}


