@charset "utf-8";
/* CSS Document */

/*
Theme Name: Mad til det virkelige liv

Author: Mathias Munk

Description: A simple responsive bloggin theme for the book 'Mad til det virkelige liv'.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

This theme, like WordPress, is licensed under the GPL.
*/

 /*-- Dev Tools ------*/
/*-------------------*/

div.windowsize{
	position:fixed;
	left:12px;
	bottom:12px;
}

div.windowsize > div{
	border-radius: 32px;
	height: 64px;
	width: 64px;
	box-shadow:1px 1px 6px 2px rgba(0,0,0,0.5);
	
	color: #FFF;
	text-align: center;
	line-height:64px;
	z-index:500;
}

div.windowsize > .xs{
	background-color: red;
}
div.windowsize > .sm{
	background-color: green;
}
div.windowsize > .md{
	background-color: blue;
}
div.windowsize > .lg{
	background-color: magenta;
}

 /*-- /Dev Tools ------*/
/*--------------------*/

@font-face {
    font-family: Exo;
    src: url('fonts/Exo-Regular.otf') format("opentype"), url('fonts/Exo-Regular.eot') format('eot'), url('fonts/Exo-Regular.woff') format('woff');
}

@font-face {
	/* Light */
    font-family: Exo;
    src: url('fonts/Exo-Light.otf') format("opentype"), url('fonts/Exo-Light.eot') format('eot'), url('fonts/Exo-Light.woff') format('woff');
    font-weight: 300;
}

@font-face {
	/* Regular */
    font-family: Exo;
    src: url('fonts/Exo-Regularf.otf') format("opentype"), url('fonts/Exo-Regularf.eot') format('eot'), url('fonts/Exo-Regularf.woff') format('woff');
    font-weight: 400;
}

@font-face {
	/* Medium */
    font-family: Exo;
    src: url('fonts/Exo-Medium.otf') format("opentype"), url('fonts/Exo-Medium.eot') format('eot'), url('fonts/Exo-Medium.woff') format('woff');
    font-weight: 500;
}

@font-face {
	/* DemiBold */
    font-family: Exo;
    src: url('fonts/Exo-SemiBold.otf') format("opentype"), url('fonts/Exo-SemiBold.eot') format('eot'), url('fonts/Exo-SemiBold.woff') format('woff');
    font-weight: 600;
}

@font-face {
	/* Black */
    font-family: Exo;
    src: url('fonts/Exo-Black.otf') format("opentype"), url('fonts/Exo-Black.eot') format('eot'), url('fonts/Exo-Black.woff') format('woff');
    font-weight: 900;
}

@font-face {
	/* Thirsty Script */
    font-family: thirstyscript;
    src: url('fonts/ThirstyScript.ttf') format("opentype"), url('fonts/ThirstyScript.eot') format('eot'), url('fonts/ThirstyScript.woff') format('woff');
}

html{
	margin: 0 !important;
	
	
}

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

body{
	overflow-x:hidden;
}

#backgroundimage{
	position:fixed;

	top:0px;
	right:0px;
	bottom:-72px;
	left: 0px;
	background-size:cover;
	background-color:#F5F5F5;
	background-position:top center;
	z-index:-1;
}

*{
	font-family: raleway, Helvetica, Arial, sans-serif;
	font-size: 14px;
}

.wrapper{
	background-color: #FFF;
	box-shadow: 0px 2px 12px 4px rgba(0,0,0,0.4);
}

.content{
	overflow: hidden;
	position:relative;
	min-height: 100%;
	width: 100%;
	padding: 32px 64px;
}

.pagetitle{
	margin: 0 auto;
}

h1{
	font-family: thirstyscript;
	color: #7692a6;
	text-align: center;
	margin: 0 auto;
	border-bottom: 2px solid #7692a6;
}

h2{
	font-family: thirstyscript
}

h4{
	font-family: Exo;
	font-weight: 900;
	color: #7692a6;
	text-align: center;
	max-width: 620px;
}

h4.buy{
	font-family: thirstyscript;
	color: #AAA;
	font-size: 24px;
	border-bottom: 1px solid #AAA;
	margin-bottom:32px;
}

p,
a,
span{
	font-family: Lora, serif;
	font-size: 14px;
	text-align:justify;
	margin-left: auto;
	margin-right: auto;
}

p.headline{
	text-align: center;
	font-family: thirstyscript, Exo, sans-serif;
	color: #666;
	border-bottom: 1px solid #7692a6;
	width: 80%;
	font-size: 18px;
	margin-bottom: 18px;
}

#bannerimages{display:none;} /*Storing banner URLs for jQuery to read*/

.banner{
	position:relative;
	width: 100%;
	height: 248px;
	padding: 46px;
	box-sizing:border-box;
	background-color: #444444;
	background-size: cover;
	background-position:center;
	background-repeat:no-repeat;
}

.banner img{
	position:absolute;
	display: block;
	margin: 0px auto;
	left: 0;
	right: 0;
	z-index:15;
}

.content .text .images{width: 100%; overflow:hidden; margin-bottom: 48px;}

.content .text .images .large,
.content .text .images .small div div{
	background-size: cover;
	background-position:center;
	background-repeat:no-repeat;
}

.content .text .images .small div{
	float:left;
	height: 156px;
}

.content .text .images .small div.image1{width: 60%; padding-right:7px}
.content .text .images .small div.image2{width: 40%; padding-left:7px}

.content .text .images .small div div{width: 100%; height: 100%;}

.content .text .images .large{
	width: 100%;
	height: 260px;
	margin-bottom: 14px;
}

.content .bog{
	overflow:hidden;
}

.content .bog .headline{
	max-width: 220px;
}

.content .bog .info p{
	text-align: center;
}

.content .bog .arrow{
	margin: 12px auto;
}

.bog.more .leavessmall{margin-top:-32px}

.content .arrow{
	margin: 22px auto; 
	display:block;
	max-width: 100%;
	width: 156px;
}

.content .arrow.medium{width: 186px; margin: 22px auto;}

.content .sidebar a.club,
.content .sidebar p.shop,
.content .sidebar p.shop span{display:block; text-align:center; color:#444;}

.sidebarsection.shops .shop:last-of-type {
  border-bottom: none;
}

.content .sidebar div.instagram{text-align:center}
.content .sidebar p.instagram,
.content .sidebar p.instagram span{display:block; text-align:center;}
.content .sidebar a.instagram:hover{text-decoration:none}

.content .sidebar a{margin:4px auto;}
.content .sidebar p.shop{margin:8px auto; border-bottom: 1px solid #999; padding: 4px 0px 12px 0px}
.content .sidebar p.shop.last{border-bottom:none}
.content .sidebar p.shop span,
.content .sidebar p.instagram span{font-size: 13px; color:#666;}


.content .sidebar .book{
	max-width: 100%;
	margin-bottom:22px;
}

.content .sidebar .book img{
	max-width: 100%;
	width: 96px;
	display:block;
	margin: 0 auto;
}

.content .sidebar .book a{
	text-align:center;
	display:block;
	margin: 0 auto;
	transition: opacity 0.3s ease;
	-webkit-transition: opacity 0.3s ease;
	-moz-transition: opacity 0.3s ease;
}

.content .sidebar .book a:hover{
	opacity: 0.8;
}

div.thewriter{
	background-color: #444444;
	background-size: cover;
	background-position:center;
	background-repeat:no-repeat;
	color: #FFF;
	width: 100%;
	overflow:hidden;
}

.content .text,
div.thewriter .info{
	text-align:center;
}

div.thewriter .info h2{
	margin: 0px auto 22px;
	padding: 6px 32px;
	display: block;
	width: 300px;
	border-bottom: 2px solid #FFF;
}
div.thewriter .info p{text-align:justify; text-align-last: center;}

div.thewriter .info .gotoblog{display:none}

div.thewriter .info .gotoblog a{
	color: #FFF;
	font-family: ThirstyScript;
	font-size: 22px;
	margin: 22px 0px;
	text-align:center;
}

div.thewriter .info .gotoblog:hover{text-decoration: underline;}

div.thewriter .image img{
	display: block;
	margin: 0 auto;
}