/*
Theme Name: Bootstrap Basic / Saluti dalla Puglia
Theme URI: 
Author: Vee Winch
Author URI: http://okvee.net
Description: Bootstrap v.3 basic theme for developers to build their new theme very fast and easy.
Version: 1.0.2
License: MIT
License URI: http://opensource.org/licenses/MIT
Text Domain: saluti-dalla-puglia
Domain Path: /languages/
Tags: white, gray, light, one-column, two-columns, three-columns, left-sidebar, right-sidebar, custom-background, custom-menu, featured-images, front-page-post-form, post-formats, threaded-comments, translation-ready

This theme built with Twitter Bootstrap v.3. It is basic theme with basic style for build new theme with Bootstrap.

*/

/* ==========================================================================
   BASICS // TYPE
   ========================================================================== */

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

body {
	font-family: 'Libre Baskerville', 'Palatino', 'Times New Roman', 'Georgia', serif;
	font-style: normal;
	font-weight: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.6em;
	color: #281e1e;
	background-color: #FDFDFC;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}

@media screen and (min-width: 992px)  { body { 	font-size: 18px; } }

h1, h2, h3, h4, h5, h6 { 
	font-family: 'cooper_hewittbold'; font-weight: normal; line-height: 1.5em; 	
}

.headline { font-family: 'cooper_hewittbold'; font-weight: normal; }

h1, h2, h3, h4, h5, h6 { margin: 1em 0 0.3em 0; line-height: 1.5em; }

h1 { font-size: 36px; }
h1.headline { font-size: 72px; }

h2 { font-size: 30px; }
h3 { font-size: 26px; }
h4 { font-size: 22px; }
h5 { font-size: 18px; }
h6 { font-size: 16px; }

.chapters h5 { font-family: 'cooper_hewittsemibold'; font-weight: normal; }
.chapters h6 { font-family: 'cooper_hewittsemibold'; font-weight: normal; }

p { margin-top: 0; margin-bottom: 25px; }
p:last-child { margin-bottom: 0px; }

.spitzmarke, .teaser, .authors { 
	font-family: 'cooper_hewittbold'; font-weight: normal;
	letter-spacing: 0.02em;
}


.text-center { text-align: center; }
.text-right { text-align: right; }
.nowrap { white-space: nowrap; }



@media (max-width: 767px) {
	.side-story .story-heading h1.headline, .story-heading .teaser, 
	.old-trips-content .single-old-trip h3
	{
		-webkit-hyphens: auto;
		-moz-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;
	}

	.gemeinschaftskueche .story-heading h1.headline {
		-webkit-hyphens: manual;
		-moz-hyphens: manual;
		-ms-hyphens: manual;
		hyphens: manual;
	}
} 

.site-title, h1, h2, h3, h4, h5, h6, .site-description,
.story-heading .spitzmarke, .story-heading h1.headline, .story-heading .teaser, .story-heading .authors, 
.story-content .image-container .captions, 
.author-content .single-author,
.old-trips-content .single-old-trip h3,
{
		-webkit-hyphens: none;
		-moz-hyphens: none;
		-ms-hyphens: none;
		hyphens: none;
}


@media (min-width: 1200px) { 
	blockquote {
		-webkit-hyphens: none;
		-moz-hyphens: none;
		-ms-hyphens: none;
		hyphens: none;
	}
}

/* ==========================================================================
   Margins
   ========================================================================== */

.margin-bottom-100  { margin-bottom: 100px; }
.margin-bottom-75   { margin-bottom: 75px; }
.margin-bottom-50   { margin-bottom: 50px; }
.margin-bottom-25   { margin-bottom: 25px; }
.margin-bottom-15   { margin-bottom: 15px; }
.margin-bottom-10   { margin-bottom: 10px; }

.padding-top-50 { padding-top: 50px; }


/* ==========================================================================
   Colors
   ========================================================================== */

.green  { color: #148c00; color: rgba(20, 140, 0, 1); }
.back-green { background-color: #148c00; background-color: rgba(20, 140, 0, 1); }

.dark-green { color: #0b4d00; color: rgba(11, 77, 0, 1); }
.back-dark-green { background-color: #0b4d00; color: rgba(11, 77, 0, 1); } 


.yellow  { color: #F0E600; color: rgba(240, 230, 0, 1); }
.back-yellow { background-color: #F0E600; background-color: rgba(240, 230, 0, 1); }

.dark-yellow { color: #DCD200; color: rgba(220, 210, 0, 1); }
.back-dark-yello { background-color: #DCD200; color: rgba(220, 210, 0, 1); } 



.red { color: #CC0000; color: rgba(204, 0, 0, 1); }
.back-red { background-color: #CC0000; background-color: rgba(204, 0, 0, 1); }

.dark-red { color: #990000; background-color: rgba(153, 0, 0, 1); }
.back-dark-red { background-color: #990000; background-color: rgba(153, 0, 0, 1); }



.white-light { color: #FCFBF7; color: rgba(252, 251, 247, 1); }
.back-white-light{ background-color: #FCFBF7; background-color: rgba(252, 251, 247, 1); }


.white { color: #F5F4F0; color: rgba(245, 244, 240, 1); } 
.back-white, .header-container, .navbar { background-color: #F5F4F0; background-color: rgba(245, 244, 240, 1); }


.grey { color: #C2BBA3; color: rgba(194, 187, 163, 1); } 
.back-grey, .infobox { background-color: #C2BBA3; background-color: rgba(194, 187, 163, 0.6); } 

.dark-grey { color: #A39875; color: rgba(163, 152, 117, 1); } 
.back-dark-grey { color: #A39875; color: rgba(163, 152, 117, 1); } 


.black { color: #2E2B1F; color: rgba(46, 43, 31, 0); }
.back-black { background-color: #2E2B1F; background-color: rgba(46, 43, 31, 0); }


/* ==========================================================================
   LINKS
   ========================================================================== */

a, a:hover, a:focus { color: #2E2B1F; vertical-align: baseline; text-decoration: none; outline: 0; padding-bottom: 2px; }

a {  border-bottom: 2px solid #CC0000; } 
a:hover { border-bottom: 2px solid #DCD200; }

.site-title > a, .site-title > a:hover, .nav > li > a, .nav > li > a:hover, .no-link a, .no-link a:hover, .no-link a:focus { border-bottom: 0 none; }

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { line-height: 1.6em; }


/* ==========================================================================
   HEADER // NAVIGATION ALWAYS TOGGLED // bootstrap-navbar-collapsed.css
   ========================================================================== */

.header-container { 
	position: fixed; top: 0; width: 100vw; height: 50px; z-index: 10;
	background-color: rgba(245, 244, 240, 1);
	box-shadow: 2px 0px 5px 0px rgba(194, 187, 163, 1); 
}

.site-branding { padding: 10px 0px 5px 0px; text-align: right; }
.site-title { font-family: 'Lobster Two'; font-style: italic; font-weight: 700; letter-spacing: 0.05em; font-size: 28px; }
@media (max-width: 767px) { .site-title {  font-size: 22px; } }

.site-title a { color: #2E2B1F; }
.site-title .saluti { }
.site-title .puglia { }

.navbar {
	pointer-events: auto;
	position: fixed;
	min-height: inherit;
	margin-top: 10px;
	margin-bottom: 0px;

	box-shadow: 0px 0px 1px 1px #990000;
	
	font-family: 'cooper_hewittsemibold'; 
	font-size: 12px;
	letter-spacing: 0.05em;
	text-transform: uppercase; 

	z-index: 5;
}

.nav > li > a { padding: 10px 35px 10px 10px; }
.nav > li > a:hover, .nav > li > a:focus {
	background-color: inherit; color: #990000;
}

.navbar-toggle { padding: 2px 6px; background-color: inherit; margin-top: 5px; margin-bottom: 5px; }
.navbar-toggle .icon-bar { background-color: #990000; width: 16px; height: 2px; }
.navbar-toggle .icon-bar + .icon-bar { margin-top: 3px; }



/* ==========================================================================
   IMAGE CONTROLS // IMAGE LINKS
   ========================================================================== */

a[rel~="image-link"] { border-bottom: 0 none; text-decoration: none; padding-bottom: 0; }


/* ==========================================================================
   HOMEPAGE HEADER // DRAGGABLE
   ========================================================================== */

.home .postcard .site-branding { pointer-events: none; }
.home .postcard .site-description { 
	font-family: 'cooper_hewittsemibold'; font-size: 1.3em; letter-spacing: 0.08em; line-height: 1em
	text-transform: inherit; text-align: center; margin-top: 0.5em; padding-left: 15px; padding-right: 15px;
	color: #DCD200;
}


.home .postcard .teaser-container { pointer-events: auto !important; margin-bottom: 3em; }
.home .postcard .teaser-container-hg .teaser-image { margin-bottom: 15px; }
.home .postcard .teaser-container-ng .teaser-image, .home .postcard .teaser-container-ed .teaser-image { padding: 5em 6em 2em; }
.home .postcard .teaser-container-ng .teaser-image img { border-radius: 50%; box-shadow: 0px 0px 3px 3px #990000; }
.home .postcard .teaser-container-ed .teaser-image img { border-radius: 50%; box-shadow: 0px 0px 3px 3px #DCD200; }
.home .postcard .teaser-container .spitzmarke { text-align: center; }
.home .postcard .teaser-container-hg .spitzmarke:after { content: "_"; opacity: 0; }
.home .postcard .teaser-container .headline { margin: 0.5em 0 1em; text-align: center; }
.home .postcard .teaser-container .excerpt { padding-left: 2em; padding-right: 2em; }

.home .postcard-story-container { display: none; }
.home .site-title.mobile img { max-width: 70%; text-align: center; margin: 0 auto; }
.home .site-branding { margin-top: 50px; margin-bottom: 50px; }


@media (min-width: 768px) { 

	.home #site-header, .home #site-main, .home #site-footer { 
		position: absolute;
		width: 100vw;
		height: 100vh;
	}

	.home .navbar-container { width: 100%; height: 100%; }

	.home .navbar { 
		position: absolute;
		margin-top: 5%; margin-left: 4%; 
		box-shadow: 0px 0px 1px 1px #990000;
		pointer-events: auto !important;
		min-height: 29px;
	 }

	.home .navbar-toggle { padding: 2px 6px; background-color: inherit; }

}

@media (min-width: 768px) { 

	.home .header-container, .home .postcard-container, .home #site-footer { 	
		box-sizing: border-box;
		position: absolute;
		top: 50%; left: 50%;
		
		-webkit-transform: translateX(-50%) translateY(-50%);
	  	transform: translateX(-50%) translateY(-50%);

	  	width: 96vw; /* aspect ratio  3x2 */
    	height: 64vw;
    	max-height: 96vh; /* aspect ratio  xvh / 2 x 3 */
    	max-width: 144vh;
    }

	.home .header-container, .home #site-footer { 	pointer-events: none; }

}

@media (min-width: 992px) { 
	
	.home .header-container, .home .postcard-container, .home #site-footer { 	
		
		box-sizing: border-box;
		position: absolute;
		top: 50%; left: 50%;
		
		-webkit-transform: translateX(-50%) translateY(-50%);
	  	transform: translateX(-50%) translateY(-50%);

	  	width: 90vw; /* aspect ratio  3x2 */
    	height: 60vw;
    	max-height: 90vh; /* aspect ratio  xvh / 2 x 3 */
    	max-width: 135vh;
    }
}

@media (min-width: 768px) { 

	.home .header-container { 	
		
		background: transparent; 
		box-shadow: 0px 0px 0px 0px rgba(194, 187, 163, 0); 
	}

	.home .postcard-container { 
		
		background-image: url("../../../index.html");
	    background-size: cover;
	    background-repeat: no-repeat;
	 	overflow: hidden;

    	}
	
	.postcard {
		box-sizing: border-box;
		position: absolute;
		top: 3.75%;
		left: 3%;
		right: 3%;
		bottom: 3.75%;
		overflow: hidden;
		border: 10px solid #F5F4F0;
		background-color: #F5F4F0;
	}

	.home .postcard-story-container { display: block; }
	.home .draggable, .home .draggable a { cursor: move; }
	
	.home .postcard .site-branding { position: absolute; top: 20%; left: 30%; width: 40%; z-index: 10; padding: 0; margin: 0; }
	.home .postcard .site-description { 
		font-size: 1.3em;
		text-transform: inherit; text-align: center; margin-top: 0em;
		color: #F0E600; text-shadow: 0px 0px 5px #000;
	}
	
	.home .postcard .postcard-hg-container { position: absolute; height: 50%; }

	.home .postcard .postcard-ng-container { position: absolute; width: 6%; z-index: 10; }
	.home .postcard .postcard-ng-container img { border-radius: 50%; box-shadow: 0px 0px 10px 5px #990000; }

	.home .postcard .postcard-editorial-container { position: absolute; z-index: 11; width: 10%; top: 82%; left: 10%; }
	.home .postcard .postcard-editorial-container img { border-radius: 50%; box-shadow: 0px 0px 10px 10px #DCD200; }

	
	#postcard-hg-0 { top: 0; left: 0; width: 50%; border-right: 10px solid #F5F4F0;  }
	#postcard-hg-1 { top: 0; left: 50%; width: 50%; }

	#postcard-hg-2 { top: 50%; left: 0%; width: 33.3333334%; 
		border-top: 10px solid #F5F4F0; border-right: 10px solid #F5F4F0; }
	#postcard-hg-3 { top: 50%; left: 33.3333334%; width: 33.3333334%; 
		border-top: 10px solid #F5F4F0; }
	#postcard-hg-4 { top: 50%; left: 66.6666667%; width: 33.3333334%;
		border-top: 10px solid #F5F4F0; border-left: 10px solid #F5F4F0; }

	#postcard-ng-0 { top: 13%; left: 15%; }
	#postcard-ng-1 { top: 82%; left: 28%; }
	#postcard-ng-2 { top: 45%; left: 6%; }
	#postcard-ng-3 { top: 60%; left: 68%; }
	#postcard-ng-4 { top: 5%; left: 45%; }
	#postcard-ng-5 { top: 84%; left: 45%; }
	#postcard-ng-6 { top: 23%; left: 65%; }
	#postcard-ng-7 { top: 85%; left: 65%; }


	.postcard-hg-container .hg-image-container {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		overflow: hidden;
	}

	.postcard-hg-container .hg-image-container a img {
		position: absolute;
		top: 50%; left: 50%;
		-webkit-transform: translateX(-50%) translateY(-50%);
		transform: translateX(-50%) translateY(-50%);
		width: 100%; height: auto;
		-webkit-transition: all .2s ease-in-out; 
   		-moz-transition: all .2s ease-in-out; 
		transition: all .2s ease-in-out;

	}

	.postcard-hg-container .hg-image-container a:hover img {
		width: 105%; height: auto;
	}

	
	.home .postcard .teaser-container { 
		position: absolute; top:15px; right: 15px;
		width: 23%;
		font-size: 0.7em; line-height: 1.5em; 
		padding: 10px 10px 20px;	
		display: none; z-index: 99;
		background-color: #F5F4F0;
	}
	
	.home .postcard .teaser-container.visible { display: block; pointer-events: auto !important; }
	.home .postcard .teaser-container .teaser-image { margin-bottom: 5px; }
	.home .postcard .teaser-container-ng .teaser-image,	.home .postcard .teaser-container-ed .teaser-image { padding: 20px 35px 10px; }
	.home .postcard .teaser-container-ng .teaser-image img {  }
	.home .postcard .teaser-container .spitzmarke { text-align: left; margin-bottom: 10px; }
	.home .postcard .teaser-container-hg .spitzmarke:after { content: "_"; opacity: 0; }
	.home .postcard .teaser-container .headline { text-align: left; font-size: 1.4em; line-height: 1.6em; margin-top: 20px; margin-bottom: 20px; }
	.home .postcard .teaser-container .excerpt { text-align: left; padding: 0; }
}
/*
	-webkit-filter: drop-shadow(5px 5px 10px #c8141e) drop-shadow(-5px -5px 10px #c8141e);
	filter:drop-shadow(1px 1px 0 #c8141e) drop-shadow(-1px -1px 0 #c8141e); 
*/	

/* ==========================================================================
   STORYS 
   ========================================================================== */

.main-story, .side-story { position: relative; padding-top: 46px; }

.main-story .story-header {
	position: relative;
	width: 100vw; height: 100vh;
	margin: 0 auto;
	background-color: #ccc;
}

.side-story .story-header { position: relative; padding-left: 0; padding-right: 0;  }


.main-story .story-header .story-video { 
	position: relative; width: 100%; height: 100%; padding: 0; margin: 0; line-height: 0; overflow: hidden;
	background-repeat: no-repeat; background-position: center; background-size: cover; 
}

/* 	iframe cover viewport google: https://www.google.de/search?q=width:+177.77777778vh;
	http://stackoverflow.com/questions/10797632/simulate-background-sizecover-on-video-or-img
	http://stackoverflow.com/questions/33451481/scale-and-reposition-iframe-like-background-size-cover */


.main-story .story-header .story-video iframe {
    box-sizing: border-box;
    position: absolute;
    top: 50%; left: 50%;
	
	width: 177.77777778vh;
    height: 56.25vw;

    min-width: 100%;
    min-height: 100%;

	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}

@media (max-width: 767px) { .main-story .story-header .story-video iframe { display: none; } }

.side-story .story-header .credits { position: absolute; bottom: 0; right: 0; background-color: #FCFBF7; padding: 3px 10px; 
	font-family: 'cooper_hewittbook';font-size: 0.7em; line-height: 1.4em; border-right: 1px solid #990000; opacity: 0.75; max-width: 40%; }

@media (max-width: 767px) {.side-story .story-header .credits { border-right: 0px none #FDFDFC; max-width: 60%; } }

.story-heading { text-align: center; }

.main-story .story-heading { position: absolute; width: 100%; margin-right: auto; margin-left: auto; overflow: hidden; }



.main-story .story-heading.top  { top: 0px; padding: 60px 0px 100px 0px;
 	background: -webkit-linear-gradient(top,rgba(0,0,0,0.2),rgba(0,0,0,0)); /*Safari 5.1-6*/
 	background: -o-linear-gradient(top,rgba(0,0,0,0.2),rgba(0,0,0,0)); /*Opera 11.1-12*/
 	background: -moz-linear-gradient(top,rgba(0,0,0,0.2),rgba(0,0,0,0)); /*Fx 3.6-15*/
 	background: linear-gradient(top,rgba(0,0,0,0.2),rgba(0,0,0,0)); /*Standard*/
 }
.main-story .story-heading.bottom  { bottom: 0px; padding: 100px 0px 60px 0px;
  	background: -webkit-linear-gradient(bottom,rgba(0,0,0,0.2),rgba(0,0,0,0)); /*Safari 5.1-6*/
 	background: -o-linear-gradient(bottom,rgba(0,0,0,0.2),rgba(0,0,0,0)); /*Opera 11.1-12*/
 	background: -moz-linear-gradient(bottom,rgba(0,0,0,0.2),rgba(0,0,0,0)); /*Fx 3.6-15*/
 	background: linear-gradient(bottom,rgba(0,0,0,0.2),rgba(0,0,0,0)); /*Standard*/
 }

.story-heading h1.headline { font-size: 48px; font-weight: 700; line-height: 1.1em; margin: 0.5em 0 0.5em 0; }
@media (min-width: 768px)  { .story-heading h1.headline { font-size: 60px; } }
@media (min-width: 1200px)  { .story-heading h1.headline { font-size: 72px; } }

.main-story .story-heading, .main-story .story-heading .authors a { color: #F5F4F0; text-shadow: 0px 0px 5px #2E2B1F; padding: 0 3px; }
.side-story .story-heading, .side-story .story-heading .authors a { color: #2E2B1F; text-shadow: 0px 0px 0px #F5F4F0; padding: 0 3px; }

.story-heading .authors a { white-space: nowrap; }
.story-heading .authors span { font-size: 12px; text-transform: uppercase; letter-spacing: 0.06em; }
.story-heading .authors span.komma { margin-left: -0.2em; margin-right: 0.3em; }

.story-heading .teaser {  font-size: 20px; line-height: 1.5em; letter-spacing: 0.03em; padding-bottom: 10px;}
@media (min-width: 768px)  { .story-heading .teaser {  font-size: 22px; line-height: 1.6em; } }

@media  (max-height: 600px) {
	.main-story .story-heading .spitzmarke h4 { font-size: 20px; }
	.main-story .story-heading h1.headline  { font-size: 32px; }
	.main-story .story-heading .teaser { font-size: 16px; }
 }

.story-container { padding-top: 50px; }

@media (min-width: 768px)  {  
	.story-container { 
		background-color: #FCFCFA;
		border: 1px solid #dc1e28; 
		border-radius:  4px; 
		margin-top: -4px; 
	}
}

.side-story-header-image { padding-left: 0px; padding-right: 0px; border: 0 none; }

.chapter-thumbnail { display: inline-block; }
.chapter-description { font-size: 0.75em; line-height: 1.5em;  }

.ini-letter p:first-child:first-letter, .meta-content .content-container p:first-child:first-letter { 
	#font-family: 'Lobster Two'; 
	#font-weight: 700; 
	#letter-spacing: 0.05em; 
	#font-size: 430%; 
	#padding: 0.25em 0.1em 0.2em 0.2em; 
	#margin-left: -0.2em; 
	#float: left; color: #DCD200; 
	#text-shadow: 0px 0px 3px #C2BBA3; 
    
    font-family: 'Lobster Two';
	font-weight: 700;
    letter-spacing: 0.05em;
    font-size: 600%;
    padding: 0;
    margin-left: -7px;
    float: left;
    color: #DCD200;
    line-height: 90%;
    margin-top: -11px;
    margin-right: 10px;
}

.story-content .image-container {
	margin-bottom: 10px;
}

@media (min-width: 768px)  {  
	.story-content .image-container {
		width: 75%;
		float: left;
		margin-left: -44%;
		margin-right: 30px;
	}
}



.story-content .image-container img { margin-bottom: 5px; margin-top: 5px; }
.story-content .image-container .captions { 
	font-family: 'cooper_hewittbook'; font-size: 0.7em; line-height: 1.4em; 
	margin-left: 10px; max-width: 80%;
}


blockquote {
		font-family: 'cooper_hewittbold';
		font-size: 22px;
		line-height: 1.5em;
		letter-spacing: 0.01em;
		margin-top: 20px;
		margin-bottom: 20px;
		margin-left: 30px;
		margin-right: 30px;
}

@media (min-width: 768px)  {

	blockquote {
		font-size: 28px;
		line-height: 1.5em;
		letter-spacing: 0.01em;
		text-align: right;
		float: left;
		width: 60%;
		margin-top: 30px;
		margin-left: -20%;

	}
}


@media (min-width: 1200px) { blockquote { width: 50%; } }



blockquote .blockquote-author { font-family: 'cooper_hewittlight_italic'; font-size: 14px; white-space: nowrap;  }
blockquote .blockquote-author:before { content:'\2014 \00A0'; padding-left: 1em; }

.story-content .video-container { margin-top: 35px; margin-bottom: 35px; }
.story-content .gallery-container { margin-top: 35px; margin-bottom: 35px; }

@media screen and (min-width: 768px)  {
	.story-content .video-container {margin-top: 50px; margin-bottom: 50px; }
	.story-content .gallery-container { margin-top: 50px; margin-bottom: 50px; }
	.story-content .sub-headline-container { margin-top: 10px; margin-bottom: 10px; } 
}

.story-content .row + .row { margin-top: 25px; }

.story-content  .infobox {
	font-family: 'cooper_hewittbook';
	font-size: 0.75em; line-height: 1.5em;
	margin-top: 25px; 
	margin-bottom: 25px; 
	padding: 15px;

}

.story-content ul { margin: 0; padding-left: 1em;   }
.story-content ul li { list-style: none; margin-bottom: 0.5em;  }
.story-content li:before { content: "• "; color: #DCD200; font-size: 0.75em; margin-right: 0.5em;}

@media screen and (min-width: 768px)  {

	.story-content  .infobox {
		float: right;
		margin-top: 5px;
		margin-right: -30%;
		margin-left: 30px;
		margin-bottom: 10px; 
	}
}

.story-content  .infobox .video-container { margin-top: 0px; margin-bottom: 0px; }
.story-content  .infobox a { padding-bottom: 0px; border-bottom: 1px solid #CC0000; }

.story-container .chapters { margin-bottom: 50px; }
.story-container .chapter { margin-bottom: 50px; }

@media screen and (max-width: 767px)  { .story-container .chapters h5 { margin: 0.5em 0 0.5em 0; } }

@media screen and (max-width: 767px)  { .story-footer-authors-header h5, .making-of h5 { margin: 0em 0 0.75em 0; } }
@media screen and (min-width: 768px)  { .story-footer-authors-header h5, .making-of h5{ text-align: right; } }
.story-footer-author img { border-radius: 10px; }



/* ==========================================================================
   AUTHORS, SINGLE AUTHOR 
   ========================================================================== */

.author-content { position: relative; padding-top: 46px; }

.author-content .single-author { 
	font-family: 'cooper_hewittsemibold';
	font-weight: normal;
	font-size: 16px;
	line-height: 1.8em;
	letter-spacing: 0.02em;
	margin-bottom: 50px; 
}

.die-autoren .single-author img { margin-bottom: 10px;  }

.author-content .single-author a { #padding-bottom: 3px; }

@media (min-width: 768px) and (max-width: 991px) { 
.die-autoren .single-author {
	    margin-left: 4.16666667%; /* offset-1 */
	}

	.die-autoren .single-author:nth-child(3n+1) {
	    margin-left: 8.33333333%; /* offset-2 */
		clear: left;
	}	
}

@media (min-width: 992px) { 
	.die-autoren .single-author {
	    margin-left: 4.16666667%; /* offset-1 */
	}

	.die-autoren .single-author:nth-child(4n+1) {
	    margin-left: 8.33333333%; /* offset-2 */
		clear: left;
	}
	
}

/* SINGLE AUTHOR */

.author-container { 
	background-color: #FCFCFA;
	border: 1px solid #dc1e28; 
	border-radius:  4px; 
	margin-top: -4px; 
	padding-top: 50px;
}

@media (max-width: 767px) {	.author-container {  border: 0px none #FDFDFC; } } 

.author-heading h1.headline { font-size: 48px; font-weight: 700; line-height: 1.1em; margin: 0 0 0.3em 0; text-align: center; margin-top: 0;  }
@media (min-width: 768px)  { .author-heading h1.headline { font-size: 60px; } }
@media (min-width: 1200px)  { .author-heading h1.headline { font-size: 72px; } }

.single-autoren  .author-heading h1.headline { opacity: 0.15; } 

.author-heading .author { text-align: center; font-family: 'cooper_hewittsemibold'; font-weight: normal; }

.author-content .author-data { font-family: 'cooper_hewittbook'; font-weight: normal; font-size: 0.9em; }

.author-content .author-data a {  border-bottom: 1px solid #CC0000; } 
.author-content .author-data a:hover { border-bottom: 1px solid #DCD200; }


.author-content .author-data strong { font-family: 'cooper_hewittsemibold'; font-weight: normal; padding-right: 5px; }
.author-content .author-stories h4 {
	font-family: 'cooper_hewittsemibold';
	font-weight: normal; letter-spacing: 0.07em;
	margin: 0.5em 0 2em; 
}

.author-content .author-stories h2 { margin: 0.5em 0 1em; }


/* ==========================================================================
   OLD TRIPS 
   ========================================================================== */


.old-trips-content { position: relative; padding-top: 46px; }

.old-trips-container { 
	background-color: #FCFCFA;
	border: 1px solid #dc1e28; 
	border-radius:  4px; 
	margin-top: -4px; 
	padding-top: 50px;
}

@media (max-width: 767px) {	.old-trips-container {  border: 0px none #FDFDFC; } } 

.old-trips-heading h1.headline { font-size: 48px; font-weight: 700; line-height: 1.1em; margin: 0 0 0.3em 0; text-align: center; margin-top: 0;  }
@media (min-width: 768px)  { .old-trips-heading h1.headline { font-size: 60px; } }
@media (min-width: 1200px)  { .old-trips-heading h1.headline { font-size: 72px; } }

.old-trips-content .single-old-trip h3 { 
	font-family: 'cooper_hewittsemibold';
	font-weight: normal;
	font-size: 18px;
	margin-bottom: 30px;  
}

.all-old-trips .single-old-trip img {
	margin-bottom: 30px;
	box-shadow: 0px 0px  1px 1px #C2C2A3
}

@media (min-width: 768px) { 
	.all-old-trips .single-old-trip:nth-child(3n+1) {
		margin-left: 25%; /* offset-6 */
		margin-left: 16.66666667%; /* offset-5 */
		margin-left: 12.5%; /* offset-4 */
		clear: left;
	}
}


/* ==========================================================================
   META SITE TEMPLATE
   ========================================================================== */
 

 .meta-content { position: relative; padding-top: 46px; }

 .meta-content  .meta-header { position: relative; padding-left: 0; padding-right: 0; }

/* SINGLE AUTHOR */

.meta-container { 
	background-color: #FCFCFA;
	border: 1px solid #dc1e28; 
	border-radius:  4px; 
	margin-top: -4px; 

	padding-top: 50px;
}

@media (max-width: 767px) {	.meta-container {  border: 0px none #FDFDFC; } } 

.meta-heading h1.headline { font-size: 48px; font-weight: 700; line-height: 1.1em; margin: 0 0 0.3em 0; text-align: center; margin-top: 0;  }
@media (min-width: 768px)  { .meta-heading h1.headline { font-size: 60px; } }
@media (min-width: 1200px)  { .meta-heading h1.headline { font-size: 72px; } }


/* ==========================================================================
   OVERVIEW STORIES TEMPLATE
   ========================================================================== */
 

.overview-stories-content { position: relative; padding-top: 46px; }

.overview-stories-content  .overview-stories-header { position: relative; padding-left: 0; padding-right: 0; }

.overview-stories-container { 
	background-color: #FCFCFA;
	border: 1px solid #dc1e28;
	border-radius:  4px; 
	margin-top: -4px; 
	padding-top: 50px;
}


@media (max-width: 767px) {	.overview-stories-container {  border: 0px none #FDFDFC; } } 

.story-type { margin-top: 25px; margin-bottom: 50px; }
.story-type h4, .story-type h5  {	font-family: 'cooper_hewittsemibold_italic'; }
@media (max-width: 767px) {	.story-type h4, .story-type h5 { text-align: center; } } 


@media (min-width: 768px) and (max-width: 991px) { 
	.overview-stories-container .overview-story-container-hg:nth-child(2n+1) {
		/* margin-left: 25%;  offset-5 */
		/* margin-left: 16.66666667%;  offset-4 */
		margin-left: 12.5%; /* offset-3 */
		clear: left;
	}
	.overview-stories-container .overview-story-container-ng:nth-child(3n+1) {
	    margin-left: 8.33333333%; /* offset-2 */
		clear: left;
	}

	.overview-stories-container .overview-story-container-ed {
	    margin-left: 8.33333333%; /* offset-2 */
		margin-left: 12.5%; /* offset-3 */
		clear: left;
	}
}

@media (min-width: 992px) { 
	.overview-stories-container .overview-story-container-hg:nth-child(3n+1) {
		margin-left: 25%; /* offset-5 */
		margin-left: 16.66666667%; /* offset-4 */
		margin-left: 12.5%; /* offset-3 */
		clear: left;
	}
	.overview-stories-container .overview-story-container-ng:nth-child(4n+1) {
	    margin-left: 8.33333333%; /* offset-2 */
		clear: left;
	}

	.overview-stories-container .overview-story-container-ed {
	    margin-left: 8.33333333%; /* offset-2 */
		margin-left: 12.5%; /* offset-3 */
		clear: left;
	}
}

.overview-stories-heading h1.headline { font-size: 48px; font-weight: 700; line-height: 1.1em; margin: 0 0 0.3em 0; text-align: center; margin-top: 0;  }
@media (min-width: 768px)  { .overview-stories-heading h1.headline { font-size: 60px; } }
@media (min-width: 1200px)  { .overview-stories-heading h1.headline { font-size: 72px; } }

.overview-story-container { margin-bottom: 75px;}
.overview-story-container .overview-story-image { margin-bottom: 15px; }

@media (max-width: 767px) { 
	.overview-story-container-ed .overview-story-image, .overview-story-container-ng .overview-story-image { padding: 2em 6em 2em; } 
}

@media (min-width: 768px) { 
	.overview-story-container-ed .overview-story-image { padding: 20px 20px 0px 0px;}
	.overview-story-container-ng .overview-story-image { padding: 20px 30px 20px 20px; }
}

.overview-story-container-ng .overview-story-image img { border-radius: 50%; box-shadow: 0px 0px 3px 3px #990000; }
.overview-story-container-ed .overview-story-image img { border-radius: 50%; box-shadow: 0px 0px 3px 3px #DCD200; }


.overview-story-container .headline { margin: 0.3em 0 0.5em; }
.overview-story-container .headline a { padding-bottom: 2px; }
.overview-story-container .spitzmarke { font-size: 16px; }
.overview-story-container-hg .spitzmarke:after { content: "_"; opacity: 0; }
.overview-story-container-ng .excerpt { font-size: 0.8em; line-height: 1.4em; }


/* ==========================================================================
  IMAGE RATIOS ???
   ========================================================================== */

.sixteen-nine {
  position: relative;
}
.sixteen-nine:before {
  display: block;
  content: "";
  width: 100%;
  padding-top: 56.25%;
}
.sixteen-nine > .image-container-v-center {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
}

.image-container-v-center img {
	position: absolute;
	top: 50%; left: 50%;
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}

/* ==========================================================================
   FOOTER 
   ========================================================================== */

.site-footer { padding-bottom: 50px; }
#site-footer .sponsoren { margin: 2.5em 0 0px 0; border-top: 1px solid #990000; }
#site-footer { display: block; }
#site-footer ul {  margin: 0; padding: 0; padding-top: 50px;}
#site-footer li { 
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);

	float: left; 

	list-style-type: none;  
	padding-right: 1em;

}
#site-footer li a {
	pointer-events: auto !important;
	display: inline-block;
}

#site-footer .sponsoren .logo-reportageschule { width: 33%; }
#site-footer .sponsoren .stiftung-robert-bosch { width: 33%; }
#site-footer .sponsoren .stiftung-wiedeking { width: 33%; padding-right: 0em; }
#site-footer .sponsoren .black-white { display: none; }

@media (min-width: 768px) { 
	
	#site-footer .sponsoren { margin: 2.5em 0 50px 0; border-top: 0px none; }

	#site-footer .sponsoren .logo-reportageschule { width: 36%; }
	#site-footer .sponsoren .stiftung-robert-bosch { width: 35%; }
	#site-footer .sponsoren .stiftung-wiedeking { width: 15%; }

	.home #site-footer { 	
		background: transparent; 
		box-shadow: 0px 0px 0px 0px rgba(194, 187, 163, 0); 

	}

	.home #site-footer .sponsoren { position: absolute; bottom: 0px; right: 0; margin: 0em 1em 1.5em 0em;  width: 33%; }
	.home #site-footer .sponsoren ul { display: block; }
	.home #site-footer .sponsoren .black-white { display: block; }
	.home #site-footer .sponsoren .color { display: none; }
	.home #site-footer .sponsoren .logo-reportageschule {  width: 10%; }
	.home #site-footer .sponsoren .stiftung-robert-bosch { width: 50%; }
	.home #site-footer .sponsoren .stiftung-wiedeking { width: 40%; padding-right: 1em; }
}

/* ==========================================================================
   EXCEPTIONS 
   ========================================================================== */

.editorial .story-footer-authors, 
.bosch-in-italien .story-footer-authors { display: none; }

/* ==========================================================================
   Simple Social Buttons Widget 
   ========================================================================== */

.simple-social-icons {
	margin: 0px -15px 0px -20px;
 }
.simple-social-icons .social-twitter a {
	margin-top: 2px; 
}

/* ==========================================================================
   SSBP 
   ========================================================================== */

@font-face {
    font-family: 'ssbp';
    src: url('https://www.reporterreisen.net/wp-content/plugins/simple-share-buttons-plus/sharebuttons/assets/fonts/ssbp.eot?5276i0');
    src: url('https://www.reporterreisen.net/wp-content/plugins/simple-share-buttons-plus/sharebuttons/assets/fonts/ssbp.eot?#iefix5276i0') format('embedded-opentype'), url('https://www.reporterreisen.net/wp-content/plugins/simple-share-buttons-plus/sharebuttons/assets/fonts/ssbp.woff2?5276i0') format('woff2'), url('https://www.reporterreisen.net/wp-content/plugins/simple-share-buttons-plus/sharebuttons/assets/fonts/ssbp.woff?5276i0') format('woff'), url('https://www.reporterreisen.net/wp-content/plugins/simple-share-buttons-plus/sharebuttons/assets/fonts/ssbp.ttf?5276i0') format('truetype'), url('https://www.reporterreisen.net/wp-content/plugins/simple-share-buttons-plus/sharebuttons/assets/fonts/ssbp.svg?5276i0#ssbp') format('svg');
    font-weight: normal;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


.ssbp-wrap.ssbp--fixed-right {
	top: 60px; right: 10px;
}

@media (max-width: 767px) { 
	.ssbp-wrap.ssbp--fixed-right { top: 60px; }
	.ssbp-wrap .ssbp-container, .ssbp-wrap .ssbp-toggle-switch { font-size: 13px; }
	.ssbp-set--one .ssbp-btn { line-height: 2.2em !important; }
}

pre {
  display: block;
  padding: 9.5px;
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.42857143;
  word-break: break-all;
  word-wrap: break-word;
  color: #333333;
  background-color: #f5f5f5;
  border: 1px solid #cccccc;
  border-radius: 4px;
  text-align: left;
  font-family: monospace;
}