body {
	margin: 0px; padding: 0px;  text-align: center; font-family: "Lato", sans-serif; font-size: 1.1em; line-height: 1.6em; 
	background-image: url(images/background.jpg);
	}
html #header { background-color: transparent; }
h1, h2, h3 {
	font-family: "Grenze Gotisch", serif; font-optical-sizing: auto; font-weight: normal;
	margin: 0px; line-height: 1.1em; 
  }
h2.has-extra-large-font-size {font-size: 200%; text-transform: none; line-height: 1.2em;  }
.single-book h2.has-extra-large-font-size { margin-bottom: 3px; }
h5 {margin: 0px; padding: 0px; text-transform: uppercase; letter-spacing: 1px; }
.single-book h5 { margin-bottom: 25px;}
html a {color: #317f9e;}
a { text-decoration: none;  }
html .dropotron a { color: #333; }
p a:hover { text-decoration: underline; color: #333; }
.home-width { max-width: 1200px; margin: 0 auto; }

.page-template-page-books .container { width: 100%; }

main { padding: 50px 4%; }

p strong {color: #111; }
.home .wp-block-buttons { padding: 20px 0 30px; }

.sociallinks, .box { text-align: left; }

h2.page-title { border-top: 2px solid #e5e5e5; border-bottom: 2px solid #e5e5e5; background-color: #FFF; margin: -30px 0 20px; padding: 5px 0; }

/* Home page */
.aboutbook { text-align: left; }
.aboutbook h3 { font-family: 'Arvo'; font-size: 180%; margin-bottom: .25em; }
.aboutbook header {padding-bottom: 1em; }
.aboutbook header p {
	margin-bottom: 2.25em; text-transform: uppercase; font-size: 86%; padding: 0px; 
	background-color: #FFF; color: #666; display: inline-block; letter-spacing: 1.5px;

}
img.rounded-full { border-radius: 50%; border: 6px solid #5e8078;}
.left-float, .right-float { display: inline-block; vertical-align: top; }
.left-float {width: 24%;}
.right-float { width: 54%; text-align: left; padding-top: 1.5em; }
.left-float img {width: 65%; height: auto; }


#billboard {
	background-image: url(images/Home-book.jpg); background-size: 100% auto; text-align: left; padding: 30px 60% 60px 5%;
	background-repeat: no-repeat; 
	height: calc(70em * 0.45);
	  background-color: #ffef9a; 
}

.comingText { padding: 25px 0 20px 0; }
.comingText h3 {font-family: 'Arvo'; font-size: 220%; margin-bottom: 20px; }
.comingText h4 { margin-bottom: 30px; }
.comingText p { margin-bottom: 30px; }
.comingDate { padding: 5px 0; }
.comingDate, .comingDate h5 { color: #317f9e; font-family: 'Arvo'; text-transform: uppercase; 	font-size: 100%; padding-top: 15px; }
.videopocket {text-align: center; }

section#booksbar {  background-color: #dfecf2; padding: 20px 0;  margin-top: 30px; margin-bottom: 0;}
#booksbar h5 { font-family: 'Arvo'; color: #317f9e; text-transform: uppercase; }
.bookshell { overflow: hidden; height: 260px; padding: 30px 0; }
.one-homebook { display: inline-block; vertical-align: top; margin: 0 10px;  }
.one-homebook img { height: 200px; width: auto; margin-bottom: 50px;  }
.one-homebook img:hover { position: relative; top: -7px; box-shadow: 0px 10px 10px #999; }

/* Header 
#logo { display: none; }
.home #logo { display: block; }
.insidepadd .container { position: relative; }
.insidepadd > #header > .container {
  padding: 10em 0 0 0;
}
.insidepadd #nav { width: 70%; left: 30%; text-align: right; }
#logoinside { display: none; }
.insidepadd #logoinside { position: absolute; display: block; }
.insidepadd #main, #main.narrower { padding: 2em 0;}
.single-book .insidepadd #main { padding: 2em 0 0;}*/
#logoinside, .footer-logo {
	font-family: 'Arvo'; font-weight: 700; text-shadow: 0.05em 0.075em 0 rgba(0, 0, 0, 0.1);
	font-size: 2.2em; letter-spacing: 13px; text-transform: uppercase; left: 0px; top: 1.7em; 
}
#logoinside a { color: #317f9e; }
.footer-logo {text-shadow: 0.05em 0.075em 0 rgba(49, 127, 158, 0.9);}

.home > .insidepadd > #header > .container {
  border-bottom: solid 2px #e5e5e5;
  box-shadow: inset 0px -8px 0px 0px #fff, inset 0px -10px 0px 0px #e5e5e5;
}


/* Books Page */
.one-book { width: 200px; display: inline-block; vertical-align: top; margin: 0 2% 40px; line-height: 1.25em; }
.one-book.wider { width: 425px;}
.one-book.podcast { width: 350px; }
.one-book p {text-align: center;}
.one-book img { width: auto; height: 300px;  display: block; margin: 0 auto 12px; border: 3px #fff solid; box-shadow: 0px 0px 10px #AAA;  }
.one-book.wider img { display: inline-block; margin: 0 5px 12px; }
.one-book.podcast img { width: 350px; height: auto; }
.one-book.podcast img { max-width: 350px; }
.one-book img:hover {box-shadow: 0px 0px 10px #666; }

.single-podcast-audio #content {max-width: 1200px; margin: 0 auto; }
.single-podcast-audio h4.wp-block-heading { margin-bottom: 30px; }
.single-podcast-audio a.wp-block-button__link { font-size: 16px; color: #FFF; background-color: #317f9e;}
.single-podcast-audio a.wp-block-button__link:hover { color: #FFF; background-color: #333; }

/* One Book */
.bookCol, .textCol { vertical-align: top; display: inline-block; }
.bookCol { width: 27%; background-color: #317f9e; border-radius: 8px; padding: 30px 2%; text-align: center; color: #FFF; }
.edition { font-size: 76%; text-transform: uppercase; margin: -6px 0 15px; letter-spacing: 1px;}
.textCol { width: 54%; margin: 0 4% 20px 4%; text-align: left; }
.bookCol img { width: 100%; height: auto; }
.theBookFull {width: 100%; margin: 0 auto; max-width: 1300px; padding-bottom: 40px;  }

#purchaseLinks {background-color: #DEDEDE; padding: 30px 0 50px;}
.buy-book { color: #666; text-align: center; letter-spacing: 2px; padding: 5px 10px; }
a.mi {
	background-color: #F9F9F9; color: #222; font-family: "Arvo", serif; padding: 5px 10px; display: inline-block; width: 300px; text-align: center;
	border-radius: 9px; margin: 0 10px 20px; font-size: 90%; 
}
a.mi:hover { background-color: #317f9e; color: #FFF; }

a.excerpt { text-align: left; color: #222; font-family: "Arvo", serif; display: block; margin: 0 0 15px 0; }

a.movielink { text-align: left; color: #FFF; font-family: "Arvo", serif; display: block; margin: 10px 0; }
a.movielink:hover { color: #C5EFFF; }


#banner.videos {
	border-top: solid 0px #e5e5e5;
	border-bottom: solid 0px #e5e5e5;
	box-shadow: none;
	margin: 2px 0 50px; 
}
.one-video { display: inline-block; width: 40%; margin: 0 4% 40px; }
.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%;
}

.reviews { padding: 50px 0; }
.reviews p {
	text-align: left; background-color: #F6F6F6; padding: 20px; border-radius: 10px; margin: 0 0 30px;
	page-break-inside: avoid;           /* Theoretically FF 20+ */
    break-inside: avoid-column;         /* Chrome, Safari, IE 11 */
	}
.two-col { column-count: 2;  column-gap: 30px;}




/* Extras */
.one-extra { margin-bottom: 60px; padding-bottom: 60px; border-bottom: 1px dotted #666; display: flex; }
.extra-img, .extra-text { text-align: left; }
.extra-img { width: 65%; }
.extra-text { width: 35%; }
.extra-img img { width: 94%; height: auto; }
.one-extra h4 { font-size: 150%; margin-bottom: 10px; }
.vidCol .wp-block-column { }

/* Podcasts */
html body h2 { font-family: 'Arvo'; margin-bottom: 20px; letter-spacing: 2px; color: #333; }
.podcastGroup {
	border-radius: 15px; padding: 20px 20px 10px; border: 1px solid #e5e5e5; background-color: #dfe9ee; color: #222;
	margin: 0 0 10px; font-weight: bold; 
}
.podcastGroup p, .podcastGroup .wp-block-audio { margin: 0px;  }

/* Footer*/
footer {
	background-image: url(images/footer-bg.jpg); background-position: center top; background-repeat: no-repeat;
	background-color: #06111d; color: #e1f4ff;
	padding: 0 0 75px; 
}
.small-moon { background-image: url(images/narrow-bar.jpg); background-repeat: repeat-x; background-position: center top;  }
.footer-logo { padding: 0; letter-spacing: 7px; line-height: .85em;  width: auto; }
.footer-logo span {display: block;}
.footer-logo span.indent { padding-left: 25px; }

.socials { padding: 20px 0 0; }
.socials img { display: inline-block; margin: 0 20px 40px; }
.socials img:hover { opacity: .7; }
.copyright { font-size: 80%; }

#footer-nav { padding-top: 40px; }
#footer-nav ul, #footer-nav li { padding: 0px; margin: 0px; list-style-type: none; }
#footer-nav ul { text-align: center; }
#footer-nav li { text-align: left; }
#footer-nav ul li.col { display: inline-block; vertical-align: top; width: auto; padding: 30px 2%; }
#footer-nav ul li.col.first {padding: 30px 4% 30px 0;}
#footer-nav a { color: #CCC; }
#footer-nav .footer-logo a { color: #FFF; }
#footer-nav a span  { color: #FFF; text-transform: uppercase; font-family: "Arvo", serif; }
#footer-nav ul.links { padding-top: 20px; opacity: .8; }
#footer-nav a:hover { background-color: rgba(49, 127, 158, .2); }
#footer-nav .footer-logo a:hover, #footer-nav .sociallinks a:hover { background-color: transparent; }
#footer-nav .sociallinks { padding-top: 15px; }

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

}


/* Dropdowns */
/* dd container */
.dropdown {
  display: inline-block;
  position: relative;
  outline: none;
  border-radius: 4px;
  background-color: #0b6d93;
  color: #FFF;
  cursor: pointer;
  background-image: url(images/arrow.png); background-position: 90% 50%; background-repeat: no-repeat;
  padding-right: 40px;
  width: 86%;
  margin-bottom: 10px; 
}

/* button */
.dropbtn {
  display: inline-block;
  padding: 12px 16px;
  color: #FFF;
  cursor: pointer;
  background-color: #0b6d93;
  transition: 0.35s ease-out;
}
.dropbtn:hover,.dropbtn.c:hover, .dropbtn.r:hover {
  color: #FFF;
}

/* dd content */
.dropdown .dropdown-content {
  position: absolute;
  top: 50%;
  visibility: hidden;
  opacity: 0;
  z-index: 100000;
  background-color: #0a5c82;
  font-size: 16px;
  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
  transition: 0.35s ease-out;
  width: 100%; 
}

/* center & right position menu relative to the button */
.dropdown .dropdown-content.c  {
  left: 0;
}
.dropdown .dropdown-content.r  {
  right: 0;
}

/* style link menu item */
.dropdown-content .mi {
  display: block;
  color: white;
  padding: 6px 12px;
  text-decoration: none;
  position: relative;
}
.dropdown-content .mi:hover { background-color: #083a60; }

/* show dd content */
.dropdown:focus .dropdown-content {
  outline: none;
  visibility: visible;
  opacity: 1;
  transform: translateY(20px);
}

.dropdown:focus .dropbtn::after {
  height: 0;
  border-bottom: 0;
  margin-bottom: 4px;
}


/* Carousels */
.gallery-container { position: relative; width: 100%; overflow: hidden; }
.scrollable-gallery {
  display: flex; overflow-x: auto; 
  white-space: nowrap;  scroll-behavior: smooth; 
  scroll-snap-type: x mandatory; -ms-overflow-style: none; scrollbar-width: none;
  padding: 10px 0px;
  -webkit-overflow-scrolling: touch; /* Improves smooth scrolling on iOS */
  margin: 0 70px; 
}

.scrollable-gallery::-webkit-scrollbar {  display: none; }
.scrollable-gallery img { scroll-snap-align: start; }

.scroll-arrow {
  position: absolute; top: 40%; transform: translateY(-50%); background-color: #317f9e;
  color: white; border: none; cursor: pointer; z-index: 10; /* Ensures arrows are above images */
  border-radius: 50%; height: 40px; width: 40px; font-size: 1.8em; line-height: 1.0em;  
}
.scroll-arrow:hover { background-color: #9b3935;}
.left-arrow { left: 10px;  padding: 0 2px 5px 0;}
.right-arrow { right: 10px; padding: 0 0 5px 2px; }
.rightGrad {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+0,1+100;White+to+Transparent */
background: linear-gradient(to right,  rgba(255,255,255,0) 0%,#dfecf2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
width: 50px; height: 100%;
right: 70px; top: 0px;
position: absolute; 
}
.leftGrad {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+0,1+100;White+to+Transparent */
background: linear-gradient(to right,  #dfecf2 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
width: 50px; height: 100%;
left: 70px; top: 0px;
position: absolute;
}




/* media queries */
@media (max-width:1200px) {
 #footer-nav li.col.first li, #footer-nav ul li.col.first { width: 100%; text-align: center;  }
 #footer-nav ul li.col.first {padding: 0 0 30px;}
 .footer-logo { text-align: center; }
 .footer-logo span {display: inline;  }
 .footer-logo span.indent { padding: 0px 16px 0 0; }
 html #footer { padding: 1.5em 0; }
}
@media (max-width:970px) {
	.comingText { padding-top: 10px;}
	.comingDate { padding-top: 2px;}
	.comingText h4 { margin-bottom: 12px; }
	.comingText p { margin-bottom: 12px; }
}
@media (max-width:900px) {
	.dropdown { width: 76%; }
}
@media (max-width:745px) {
.dropdown .dropdown-content.r,
.dropdown .dropdown-content.c {
  left: 0;
  margin-left: 0;
  }
  .podcastGroup .wp-block-paragraph { text-align: center; }
  html .wp-block-buttons.is-content-justification-right { justify-content: center; }
}
@media (max-width:736px) {
#billboard {
  background-image: url(images/Home-book-mobile.jpg);
  background-size: 100% auto;
  text-align: center;
  padding: 70% 5% 30px 5%;
  background-repeat: no-repeat;
  height: auto;
  background-color: #ffef9a; 
}
.comingText { padding-top: 5px;}
.post p { text-align: center; }
.post p a { display: block;}
.two-col { column-count: 1; }
}
@media (max-width:700px) {
	.headLogo img { width: 80%; margin: 0 auto; display: block; }
	ul#primary-menu-list li a { letter-spacing: 1px; }
	.headerBg { height: auto; padding-bottom: 30px; }
	.bookCol, .textCol { display: block; width: 90%; margin: 0 auto 30px; }
	.bookCol img { width: 60%; height: auto; display: block; margin: 0 auto 20px; }
	.bookCol { text-align: center; }
	.dropdown { text-align: left; }
}
@media (max-width:550px) {
	ul#primary-menu-list li a { padding: 4px 12px;}
	.extra-img, .extra-text { text-align: center; width: 100%; }
	.one-extra { flex-flow: row wrap; }
}
@media (max-width:460px) {
	.footer-logo img { width: 80%; margin: 0 auto; display: block; }
	ul#primary-menu-list li#menu-item-22 { display: none; }
	.one-book { width: auto; }
	.one-book img { height: 200px; }
	.one-book.wider { width: auto; }
}
@media (max-width:310px) {
	ul#primary-menu-list li a { font-size: 5vw; }
}