body {
  font-family: 'Lora', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  position: relative;
  width: 100%;
  height: 100%;
  color: white;
  background-color: #fff;
  -webkit-overflow-scrolling: touch; 	/* fix for smooth ios rubberband-style scrolling, even with modals */
}

@media (min-width: 992px) {
	body { border: 20px solid #fff; }	
}

html {
  width: 100%;
  height: 100%;
}

h1,h2,h3,h4,h5,h6 {
  font-family: 'Cabin', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: 700;
  margin: 0 0 35px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

h1 { font-size: 200%; font-size: 8.2vw;; } /* vw scales h2 nicer on mobiles */
h2 { font-size: 170%; font-weight: 400; text-transform: inherit;  margin: 0 0 15px 0; letter-spacing: 0px;  color: #a60000}
h4 { font-size: 120%; font-weight: 400; text-transform: inherit;  margin: 40px 0 15px 0; letter-spacing: 0px; }
h5 { font-size: 100%; font-weight: 400; text-transform: inherit;  margin: 30px 0 15px 0; letter-spacing: 0px; }
footer h5 {margin: 0 0 15px 0; }
h6 { text-transform: inherit;  margin: 0 0 15px 0;  letter-spacing: 0px; }

p { font-size: 110%; line-height: 150%; }

.subtitle { color: #999; font-size: 80%; font-weight: 400; padding-left: 20px;}

a {
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  color: #008cee;
}

a:focus, a:hover {
  text-decoration: none;
  color: #fff;
}

a:hover.textlink { color: #000; }

i.fa { margin-right: 5px; }



/****************************************
common content sectors
*****************************************/

.container { outline: 0px solid green; }
.container.imprint p { font-size: 80%; line-height: 120%;  }
.container.imprint ul, .container.imprint li { list-style-type: circle; font-size: 90%; line-height: 120%; margin: 0; padding: 0;  padding-bottom: 10px; }

.row  { outline: 0px solid red; }

.content-section {
	padding-top: 30px;
	padding-bottom: 30px;
}


@media (min-width: 768px) {
	.content-section {
		padding-top: 50px;
		padding-bottom: 50px;
	}
}

@media (min-width: 992px) {
	section {
		outline: 0px solid red;
		border-top: 20px solid #fff;
	}
	footer { border-bottom: 20px solid #fff; }
}

@media (min-width: 768px) {
	.video-container-wrapper {
		max-width: 100%;
		left: 0;
		right:0;
		margin:auto;
		margin-top: 0px;
		margin-bottom: 10px;
		background-color: rgba(255,255,255,1);
		padding: 10px;
		box-shadow: 0px 2px 5px rgba(0,0,0,.3);
	}
}


.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

hr {
	margin-top: 80px;
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));
}


/****************************************
NAV
*****************************************/
#mainNav {
  font-family: 'Cabin', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  margin-bottom: 0;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  background-color: rgba(0, 0, 0, 1);
  border-bottom: 0px solid #000;
}

#mainNav .navbar-toggler {
  font-size: 75%;
  padding: 10px;
  color: #000000;
  border: 1px solid #ccc;
}

#mainNav .navbar-toggler i { padding-left: 5px; }

#mainNav .navbar-brand {
	width: 30px;
	height: 50px;
	padding: 0;
	margin: 0px 0 5px 0;
	outline: 0px solid green;
}

#mainNav .navbar-brand img {
	width: 100%;
	height: 100%;
	border: 0;
	margin: 0;
	outline: 0px solid red;
	padding-top: 7px;
}

#mainNav .fa.fa-bars { color:#fff; }
#mainNav .navbar-toggler { color:#fff; }

#mainNav a { color: #fff; text-align: center;}

.navbar-nav .nav-link { padding-top: 17px; padding-bottom: 17px; }

#mainNav .navbar-nav .nav-item {
  -webkit-transition: background 0.3s ease-in-out;
  -moz-transition: background 0.3s ease-in-out;
  transition: background 0.3s ease-in-out;
}

#mainNav .navbar-nav .nav-item:hover {
  outline: none;
  background-color: transparent;
}

#mainNav .navbar-nav .nav-item:active, #mainNav .navbar-nav .nav-item:focus {
  outline: none;
  background-color: transparent;
}

@media (min-width: 992px) {
  #mainNav {
    padding-top: 20px;
    padding-bottom: 20px;
    -webkit-transition: background 0.3s ease-in-out, padding-top 0.3s ease-in-out, padding-bottom 0.3s;
    -moz-transition: background 0.3s ease-in-out, padding-top 0.3s ease-in-out, padding-bottom 0.3s;
    transition: background 0.3s ease-in-out, padding-top 0.3s ease-in-out, padding-bottom 0.3s;
    letter-spacing: 1px;
    border-bottom: none;
    background: transparent;
    background: rgba(0,0,0,.0);
  }
  #mainNav a { color: #fff; padding: 5px 10px 5px 10px;}
  #mainNav a.menulinkactive { color: #008cee; }
  #mainNav.navbar-shrink {
    padding-top: 0px;
    padding-bottom: 0px;
    background: rgba(0,0,0,1);
    border-bottom: 0px solid black;
  }
	#mainNav.navbar-shrink ul a { color: #999;}
	#mainNav .nav-link.active {
	outline: none;
	background-color: rgba(255, 255, 255, 0);
	border-radius: 3px;
	color: #008cee;
	}
	#mainNav .nav-link:hover { color: #008cee;}
	#mainNav .navbar-brand { 
		margin: 20px 0 20px 0px;
		width: 40px;
		height: 40px;
	}
	#mainNav .navbar-brand img {
		padding-top: 0;
	}
}

#navbarResponsive a.menulinkactive  { color: #008cee; }


/****************************************
START PAGE
*****************************************/
.masthead.home {
  outline: 0px solid blue;
  display: table;
  width: 100%;
  height: 400px;
  text-align: center;
  color: white;
}

.masthead {
  outline: 0px solid blue;
  display: table;
  width: 100%;
  height: 400px;
  text-align: center;
  color: white;
}

@media (max-width: 480px) {
	.masthead {
	  outline: 0px solid blue;
	  height: 250px;
	}
}

.masthead .intro-body { 
  display: table-cell;
  vertical-align: middle;
  outline: 0px solid green;
  position: relative;
   background: #000;
}

.masthead .intro-body .brand-heading {
 /* font-size: 210%; */
/*  text-shadow:  0px 2px 7px rgba(0,0,0,.7); */
	font-size: 90%; 
	outline: 0px solid red;
	margin: 80px 0 5px 0px;
	text-align: right;
	padding-left: 110px;
}
  
.masthead .intro-body .intro-text { 
	font-size: 100%; 
	font-style: italic;  
	outline: 0px solid red;
	text-align: right;
	color: rgba(255,255,255,.4);
}

@media (min-width: 767px) {
  .masthead.home {
    padding: 0;
    border-bottom: 0px solid #fff;
  }
  .masthead .intro-body {  padding-top: 0px; }
  .masthead .intro-body .row {  margin-right: -30px; }
  .masthead .intro-body .brand-heading {
	font-size: 130%; 
    line-height: 100%;
    padding-left: 200px;
	}
}

@media (min-width: 992px) {
  .masthead.home {
    padding: 0;
    border-bottom: 0px solid #fff;
  }
  .masthead .intro-body {  padding-top: 0px; }
  .masthead .intro-body .brand-heading {
	font-size: 180%; 
    line-height: 100%;
    padding-left: 100px;
  }
}

/**********************************
Pagetitle
**********************************/
.pagetitel {
	outline: 0px solid red;
	position: absolute;
	top: 200px;
	text-align: left;
	margin-left: -5px;
}


.pagetitel h1 {
	color: rgba(255,255,255,.5);
/*
	color: #008cee;
	opacity: 0.6;
    moz-opacity: 0.6;
*/	
	letter-spacing: -2px;
	font-size: 250%;
	padding: 0;
	margin: 0;	
}

.bookspagetitle { top: 176px; width: auto; }
.bookspagetitle h1 { color: rgba(255,255,255,.7); line-height: 80%; }

@media (min-width: 480px) {
	.pagetitel { top: 342px; }
	.pagetitel h1 {	font-size: 380%; }
	.bookspagetitle {  top: 306px; }
}

span.datum {
	color: rgba(0,0,0,.7);
	font-size: 80%;
}

/****************************************
BackgroundImages with fadeIn onload
*****************************************/
#backgroundimg  { 
	opacity: 0;
	outline: 0px solid red;
	width: 100%;
	height: 400px;
	position: absolute;
	top: 0; left: 0; bottom: 0; right: 0;
	background-position: -250px -230px; 	/* links oben */
	
	-webkit-filter: brightness(.8) blur(0px) ;
	filter: brightness(.8) blur(0px);
	
	-webkit-background-size: auto;
	-moz-background-size: auto;
	-o-background-size: auto;
	background-size: auto;
	
  -webkit-animation-name: fadeIn;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-duration: 1s;
  -webkit-animation-fill-mode:forwards;
  
  animation-name: fadeIn;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
  animation-duration: 1s;
  animation-fill-mode:forwards;
}

#backgroundimg.startbg 			{ background: url("../img/aufmacher-start.jpg") no-repeat scroll; }
#backgroundimg.keynotesbg 		{ background: url("../img/aufmacher-keynotes.jpg") no-repeat scroll; }
#backgroundimg.panelsbg 		{ background: url("../img/aufmacher-panels.jpg") no-repeat scroll; }
#backgroundimg.booksbg 			{ background: url("../img/aufmacher-books.jpg") no-repeat scroll; }
#backgroundimg.publicationsbg 	{ background: url("../img/aufmacher-publications.jpg") no-repeat scroll; }
#backgroundimg.newsbg 			{ background: url("../img/aufmacher-news.jpg") no-repeat scroll; }
#backgroundimg.imprintbg 		{ background: url("../img/aufmacher-imprint.jpg") no-repeat scroll; }

@media (min-width: 220px) {
	#backgroundimg.startbg 			{ height: 400px; background-position: -560px -65px;	background-size: 1800px; }
	#backgroundimg.keynotesbg		{ height: 250px; background-position: center 50px; background-size: cover; }
	#backgroundimg.panelsbg		 	{ height: 250px; background-position: center -40px; background-size: 2000px; }
	#backgroundimg.booksbg 			{ height: 250px; background-position: center 20px; background-size: cover; }	
	#backgroundimg.publicationsbg 	{ height: 250px; background-position: center 30px; background-size: cover; }
	#backgroundimg.newsbg 			{ height: 250px; background-position: -100px 30px; background-size: cover; }
	#backgroundimg.imprintbg 		{ height: 250px; background-position: 0px 0px; background-size: cover; } 
}
	
@media (min-width: 481px) {
	#backgroundimg.keynotesbg 		{ height: 400px; }
	#backgroundimg.panelsbg		 	{ height: 400px; background-position: center -40px; background-size: 2200px; }
	#backgroundimg.booksbg 			{ height: 400px; background-position: center 40px; }
	#backgroundimg.publicationsbg 	{ height: 400px; }		
	#backgroundimg.newsbg 			{ height: 400px; background-position: 0px 0px; } 
	#backgroundimg.imprintbg 		{ height: 400px; background-position: 0px 0px; } 
}

@media (min-width: 769px) {
	#backgroundimg.startbg		 	{ background-position: -700px -180px; background-size: 2500px; }
	#backgroundimg.keynotesbg		{ background-position: center 30px; background-size: 2100px;  }
	#backgroundimg.panelsbg 		{ background-position: center -70px; background-size: 2900px; }
	#backgroundimg.booksbg 			{ background-position: center -70px; background-size: 2000px; }	
	#backgroundimg.publicationsbg  	{ background-position: center 10px; background-size: 2000px; }
} 

@media (min-width: 992px) {
	#backgroundimg.startbg  		{ background-position: center -190px; }
	#backgroundimg.keynotesbg		{ background-position:  center -40px; background-size: 2500px;  }
	#backgroundimg.panelsbg 		{ background-position:  center -100px; }
	#backgroundimg.booksbg 			{ background-position: center -100px; background-size: 2500px; }	
	#backgroundimg.publicationsbg  	{ background-position: center -100px;  background-size: 2500px; }
}

@-webkit-keyframes fadeIn {
	0% { opacity: 0; }
	100% { opacity: 1; }
}
@keyframes fadeIn {
	0% { opacity: 0; }
	100% { opacity: 1;}
}


/****************************************
Main Content
*****************************************/
#maincontent { 
	background: #eee; 
	color: #000; 
	outline: 0px solid blue;
	border-top: 0;
}


@media (min-width: 767px) {
	#maincontent .container { width: 80%; }
}

@media (min-width: 992px) {
	#maincontent .container { width: 700px; }
}

@media (min-width: 769px) {
	#maincontent p {
		column-count: 2;
		column-gap: 30px;
		column-rule-color: #999;
		column-rule-width: 1px;
		column-rule-style: dotted;

	}
}

@media (min-width: 769px) {
	#maincontent p.onecolumn { column-count: 1; }
}

#maincontent h2 br { display: none; }

@media (min-width: 768px) {
	#maincontent h2 br { display: inherit; }
}



/****************************************
START Page / Bio
*****************************************/

#biographie {
	background: rgba(0,0,0,.02);
	color: #000; 
	outline: 0px solid blue;
}

@media (min-width: 767px) {
	#biographie .container { width: 80%; }
}

@media (min-width: 992px) {
	#biographie .container { width: 700px; }
}

@media (min-width: 769px) {
	#biographie p {
		column-count: 2;
		column-gap: 30px;
		column-rule-color: #999;
		column-rule-width: 1px;
		column-rule-style: dotted;
	}
}


/****************************************
START Page / Books
*****************************************/
#books {
	color: #000;
	position: relative;
	background: #eee; 
}

#books .container {
	outline: 0px solid green;
}
@media (min-width: 992px) {
	#books .container { width: 800px; }
}

#books .container .row div {
	outline: 0px solid red;
}

#books img {
	width: 250px;
	height: auto;
}

#books p {
	font-size: 100%;
	line-height: 120%;
	color: rgba(0,0,0,.4);
}

#books .booktrennlinie {
	border-top: 1px solid rgba(0,0,0,.1);
	margin-top: 50px;
	padding: 40px;
}

@media (min-width: 992px) {
	#books .booktrennlinie {
		border-top: 0px solid rgba(0,0,0,.1);
		margin-top: 0px;
		padding: 0px;
	}
}

#books h4 { margin-top: 10px; }

#books .goto {
	outline: 0px solid red;
	margin-top: 50px;
	text-transform: uppercase;
	font-family: 'Cabin', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 400;
	font-size: 80%;
	letter-spacing: 1px;
}



/****************************************
KEYNOTE + PANELS Page
*****************************************/

#tabellenliste {
	background: rgba(0,0,0,.02);
	color: #000;
	outline: 0px solid red;
}


@media (min-width: 767px) {
	#tabellenliste .container { width: 80%; }
}

@media (min-width: 992px) {
	#tabellenliste .container { width: 700px; }
}

#tabellenliste .datum {
	color: rgba(0,0,0,.7);
	font-size: 80%;
	color: #be7000;
}

#tabellenliste p { outline: 0px solid red; }

#tabellenliste i, p i.author {
	color: rgba(0,0,0,.5);
	font-size: 90%;
	line-height: 130%;
	display: inline-block; /** fix for line-height, otherwise line-height not working **/
}

#tabellenliste a:hover { color: rgba(0,0,0,.6); }


/****************************************
PUBLICATION Page
*****************************************/

p.publicationimg {
	display: table; 
	outline: 0px solid green !important;
	margin-bottom: 50px;	
}

img.book {
	outline: 0px solid blue;
	display: table-cell;
	width: 111px;
	margin-right:15px;   
	-moz-box-shadow:    1px 3px 4px rgba(0,0,0,.3);
  	-webkit-box-shadow: 1px 3px 4px rgba(0,0,0,.3);
	box-shadow:         1px 3px 4px rgba(0,0,0,.3);
}

.bookfloat {
	outline: 0px solid red !important;
	display: table-cell;
	vertical-align: middle;
	line-height: 130%;
}

.bookfloat b {
	display: inline-block;
	line-height: 130%;
}

hr.books { margin: 10px 0 25px 0; }

.publications p.onecolumn { outline: 0px solid red; margin-top: 40px; }
.publications p.onecolumn.text-indent { text-indent: -0.45em; margin-top: 0;  } 			 /* indents quotes  */ 

.publications p.author {
	outline: 0px solid red;
	column-count: 1 !important;
	color: rgba(0,0,0,.5);
	font-size: 100%;
	line-height: 120%;
	font-style: italic;
}


/****************************************
buttons
*****************************************/

.btn {
	font-family: 'Cabin', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 400;
	font-size: 90%;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	text-transform: uppercase;
	border-radius: 3px;
	color: #000;
	border: 1px solid rgba(0,0,0,.5);
	background-color: rgba(255,255,255,0);	
}

a.btn:hover {
  outline: none;
  background-color: #fff;	
}

.btn:focus, .btn:active { box-shadow: none; }  /* removes the blue shadow around caused by bootstrap 4 */


/****************************************
footer
*****************************************/
footer {
  padding: 50px 0 50px 0;
  background: rgba(0,0,0,1);
}

footer .row { display: table;  width: 100%; outline: 0px solid green; margin: 0;}
footer .container { width: 95%; outline: 0px solid red; }

footer h6 { line-height: 150%; 	outline: 0px solid red; margin: 0;}

footer .container .col-xs-2 {
	outline: 0px solid red;
	width: 100%;
	padding: 0 0 40px 0px;
}

footer .container .col-xs-2.rechts {
	text-align: left; 
	border-top: 1px dotted rgba(255,255,255,.4);
	outline: 0px solid red;
	padding: 40px 0 0px 0px;
}


@media (min-width: 767px) {
	footer .container .col-xs-2 { 
		display: table-cell;
		width: 50%;
		padding: 0 0 0px 0px;
		}
	footer .container .col-xs-2.rechts {
		display: table-cell;
		vertical-align: middle;
		width: 50%;
		text-align: right;
		border-top: 0;
		padding: 0px 0 0px 0px;
	}	
}



footer p {
	font-size: 14px;
	margin: 0;
	text-align: justify;
	-ms-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;        
}

footer#impressum {
	color: #fff;
	border-top: 0;
	font-size: 14px;
	margin: 0;
	text-align: justify;
	-ms-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto; 
}

footer#datenschutz {
	background: #eee;
	color: #979797;
	border-top: 0;
	font-size: 14px;
	margin: 0;
	text-align: justify;
	-ms-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto; 
}

footer#datenschutz ul,footer#datenschutz ul li,footer#impressum ul,footer#impressum ul li {
	margin-left: 0;
	padding: 0;
	text-align: left;	
}

@media (max-width: 992px) {
	footer#datenschutz ul,footer#datenschutz ul li,footer#impressum ul,footer#impressum ul li  {
	margin-left: 8px;
	}
}


/****************************************
cursor copy
*****************************************/
::-moz-selection {
  background: rgba(0, 0, 0, 0.07);
  text-shadow: none;
}

::selection {
  background: #fcfcfc;
  background: rgba(0, 0, 0, 0.07);
  text-shadow: none;
}


/***  makes cursor copy blind

img::selection {
  background: transparent;
}

img::-moz-selection {
  background: transparent;
}

*******/



/****************************************
RESTE Cards, Modals
****************************************/
#about .row { }

#about .col-xs-6 { padding: 10px; }
#contact .col-xs-6 { padding: 10px; }
.card { width: 18rem; }
.card h6, .card .card-subtitle { font-weight: 400; font-size: 90%; letter-spacing: 0;}
#about .card-text { padding-top: 10px; font-size: 105%; line-height: 1.5; }
a.card-mail { display: block; margin-top: 15px; color:#000;} 
a.card-mail:hover { color:#000; } 
.card button { outline: none; margin-top: -15px;}
 button.btn:hover { background-color: #fff; border-color: #000;}
.orderbuttonsmall { font-size:70%; margin-top: 10px; margin-bottom: 10px; display: inline-block; }
.modal { overflow-y: auto; }  /* prevents scrolling of website behind while modal is open */	
.modal-header { border: 0; }
.close:hover { color: #86ed00; }

@media (min-width: 992px) {
	.modal-body  {padding: 0 50px 25px 50px; }
}