@charset "UTF-8";

/* css for book pages */

body {
	font-family: Lato, Helvetica, Arial, sans-serif;
	font-weight: 300;
	color: #99F;
	background: #000 url(https://albereo.com/img/double-star-albereo-bkgr-trimmed.jpg) no-repeat;
	background-position: top center;
	margin: 0 auto;
	padding: 0;
	width: 100%;
	text-align: center;
}

.content {
	margin: 0 auto;
	padding: 3em 0 0 0;
	width: 90%;
}

a:link, a:visited
  	 { color: #888; text-decoration: none }
a:hover, a:active, a:focus 
 	 { color: #d8d8d8; text-decoration: none; font-variant:inherit; font-family: inherit;}
	 	 
.header-link a:link { color: #666666;}
.header-link a:visited { color: #666666;}
.header-link a:hover, a:active, a:focus { color: #d8d8d8; }
.header-link {  float: right; padding-top: 8px; font-size: 14px; font-family: Lato, Helvetica, Arial, sans-serif; font-variant:small-caps;  font-weight: 500; letter-spacing: .08em; }	 

.footer a:link, .footer a:visited
  	 { color: #888; text-decoration: none; padding: 0 .8em 0 .8em; }
.footer a:hover, .footer a:active, .footer a:focus 
 	 { color: #d8d8d8;}
	 
.trilogy-link {
	margin: 0 auto;
	padding: 2em 0 6em 0;
}
.trilogy-link ul {
	margin: 0;
	padding: 0;
}
.trilogy-link ul li {
	display: inline;
	padding: 0 1em 0 1em;
}
.trilogy-link a:link, .trilogy-link a:visited { 
	color: #6699cc;
	font-size: 1em;
	font-weight: 400;
	line-height: 170%;
	font-variant: small-caps;
	letter-spacing: .08em;
	text-decoration: none;
	padding-bottom: .22em;
	border-bottom: 1px #444 solid;
	transition: 1s ease;
}
.trilogy-link a:hover, .trilogy-link a:active, .trilogy-link a:focus { 
	color: #444444;
	border-bottom: 1px #222222 solid;
	position: relative;
	transition: 1s ease;
}
.trilogy-link p { text-align: center; color: #888; padding-right: 16px;}
.trilogy-title { text-align: center; color: #888; font-size: 1em; font-family: Lato, Helvetica, Arial, sans-serif;; font-variant:small-caps;  font-weight: 500; letter-spacing: .08em; padding-bottom: 4px;}


#solarpunk .blocktext a:link, .blocktext a:visited { 
	color: #fff;
	font-size: 1em;
	font-weight: 400;
	text-decoration: none;
	padding-bottom: .22em;
	border-bottom: 1px #253DF6 solid;
	transition: 1s ease;
}
#solarpunk .blocktext a:hover, #solarpunk .blocktext a:active, #solarpunk .blocktext a:focus { 
	color: #ccc;
	border-bottom: 1px #99f solid;
	transition: 1s ease;
}

h5 a:link, h5 a:visited { 
	font-family: 'Lato', Helvetica, Verdana, Arial, sans-serif; 
	font-size: 18px; 
	font-weight: 400;
	letter-spacing: .08em; 
	text-align:left; 
	line-height: 0%;
	color: #888; 
	text-decoration: none;
	border-bottom: #444 1px solid;
	padding: 0 0 .25em 0;
	font-variant: none;
	transition: 1s ease;
}
h5 a:hover, a:active, a:focus { 
	color: #d8d8d8;
	border-bottom: #111 1px solid;
	transition: 1s ease;
}
	
	
.sm-text a:link, .sm-text a:visited { 
	font-size: .94em; line-height: 200%; letter-spacing:.1em;  color: #888; text-decoration: none; padding: 0 0 .17em; border-bottom: 1px #444 solid;
	transition: 1s ease; }
.sm-text a:hover, a:active, a:focus 
 	 { font-size: .94em; line-height: 200%; letter-spacing:.1em;  color: #d8d8d8; 
	border-bottom: #111 1px solid; transition: 1s ease;  }
.sm-text { font-size: .92em; line-height: 200%; letter-spacing:.1em; }

p { 
	margin: 0 auto;
	color: #888;
	font-family: Lato, Helvetica, Arial, sans-serif; 
	font-size: 1em; 
	letter-spacing: .05em;
	font-weight: 400;
	line-height: 170%;
  text-align: center;
}
	
h1 { /* home page title */
	color: #A4A2A2;
	font-family: 'Gruppo', Helvetica, Arial, sans-serif; 
	font-size: 3em; 
	font-weight: 400;
	letter-spacing: .08em;
	line-height: 120%;
	text-align:center; 
	margin-bottom: .25em;
}

.secondary-h1 { font-size: 44px;  float: right; padding-right: 40%;}

h2 { /* secondary page titles */
	font-family: 'Lato', Helvetica, Arial, sans-serif; 
	font-size: 30px; 
	font-weight: 400;
	letter-spacing: .08em; 
	line-height: 120%;
	text-align:center; 
	color: #c655f8;
	font-variant: small-caps;
	margin: 36px 0 12px 0;
}

h3 { /* 24 px flush left */
	font-family: 'Lato', Helvetica, Arial, sans-serif; 
	font-size: 24px; 
	font-weight: 400;
	letter-spacing: .08em; 
	text-align:left; 
	color: #4787f8;
	font-variant: small-caps;
}

h4 { 
	font-size: 1.7em; 
	font-weight: 400;
	letter-spacing: .08em; 
	text-align:center; 
	color: #F9F9FB;
	font-variant: small-caps;
}
h5 { /* 18 px left */
	font-family: 'Lato', Helvetica, Arial, sans-serif; 
	font-size: 18px; 
	font-weight: 400;
	letter-spacing: .08em; 
	text-align:left; 
	color: #4787f8;
	line-height: 0%;
	font-variant: small-caps;
}

h6 { /* Alb and the Phenom text */
	margin: 0 auto;
	color: #888; 
	font-family: Lato, Helvetica, Arial, sans-serif; 
	font-size: 1.0em; 
	letter-spacing: .05em;
	font-weight: 400;
	line-height: 150%;
	width: 50% }
	
.small-caps {
	font-variant: small-caps;
}
.violet {
	color: #c398e8;
	font-size: 15px; 
	letter-spacing: .0em;
	text-align: left;
	font-weight: normal;
}

.text { /* Publisher of... text */
	width: 68%;
	line-height:140%;
	color: #777;
	text-align: center;
}
.title-lin {
	color: #c655f8;
	font-size: 1.5em;
	font-variant: small-caps;
}
.title-cri {
	color: #4787f8;
	font-size: 1.5em;
	font-variant: small-caps;
}

p .sm-dark-text { font-size: .9em; line-height: 200%; letter-spacing:.1em; color: #444; text-align: center;}
.center-lg { text-align: center; font-size: 22px; font-weight: 400; font-family: 'Gruppo', Helvetica, Verdana, Arial, sans-serif; letter-spacing: .08em; color: #ff9900; }

.book-img {
	border-color: #666666;
	margin: 10px;
}
.backcover-600w {
	display: none;
}
.backcover-820w {
	display: block;
	text-align: center;
	width: 90%;
	max-width: 520px;
	border: #666666 .11em solid;
	margin: 1.5em 0 1em 0;
}

.front-cover {
	width: 80%;
	max-width: 880px;
	margin: 0 auto;
	margin-top: 2em;
	padding: 1em 0 4em 0;
}
.front-cover-cri {
	width: 50%;
	max-width: 880px;
	margin: 0 auto;
	margin-top: 2em;
	padding: 1em 0 4em 0;
}
.front-cover.book-3 {
	margin: 0 auto;
	margin-top: 2em;
	width: 60%;
}
.front-cover.book-3 .front-cover-img {
	width: 80%;
	max-width: 300px;
  padding: 0;
	border: 1px #444 solid;
	float: left;
}
.front-cover-img { 
	width: 80%;
	max-width: 300px;
  padding: 0;
	border: 1px #444 solid;
	float: left;
}

.book-details {
	margin-top: 3em;
	float: left;
	padding-left: 1.5em;
}
.get-the-book {
	color: #c655f8; margin-top: 5em
}
#back-cover {
	margin-top: 48px;
}
.back-cover {
	text-align: center;
	width: 100%;
	max-width: 820px;
	border: #666666 .11em solid;
	margin: 1.5em 0 1em 0;
}

.book-img:hover {
	transform: scale(3.3);
-ms-transform: scale(3.3);
-webkit-transform: scale(3.3);
-moz-transform: scale(3.3);
-o-transform: scale(3.3);
}

#about-albereo.blocktext-bkgr { 
	background: #000;
	border-top: #ccc 1px solid; 
	border-bottom: #fff 1px solid; 
	width: 100%;
	padding: 4em 0 4em 0;
}
#about-albereo .blocktext p { 
	margin: 0 auto;
	width: 68%;
	max-width: 740px;
	float: none;
	text-align: justify;
	font-weight: 400;
	color: #A1A2A4;
	font-size: 1em;
}
#solarpunk.blocktext-bkgr { 
	background: #317DC8;
	border-top: #ccc 1px solid; 
	border-bottom: #fff 1px solid; 
	width: 100%;
	padding: 4em 0 6em 0;
}
#solarpunk .blocktext p { 
	margin: 0 auto;
	padding: 0 0 1em 0;
	width: 68%;
	max-width: 740px;
	float: none;
	text-align: justify;
	font-weight: 400;
	color: #FFF;
	font-size: 1.11em;
}
blockquote {
	margin: 0 0 0 5%;
}
.chronicles {
	float: none;
	width: 90%;
	alignment-adjust: middle;
}
.chronicles:after {
	clear: both;
}

.book1 {
	float: left;
	width: 50%;
	padding-bottom: 10px;
}
.book2 {
	float: right;
	width: 50%;
	padding-bottom: 10px;

}

.nofloat {
	float: none;
	clear: both;
}


.footer {
	margin: 0 auto;
	padding: 36px 0;
	background: #222222;
	border-top: #555 2px solid;
	float: none;
	clear: both; 
	font-family: Helvetica, Arial, Geneva; 
	font-size: .88em; 
	color: #666666;
	line-height: 120%;
	text-align: center; 
	padding-bottom: 10px;
}
.footer p.footer-title {
	font-size: 1.3em;
	font-weight: 700;
}
.footer h3 {
	font-family: Lato, Helvetica, sans-serif;
	margin: 1em 0 2em 0;
	color: #ccc;
	font-size: 1.1em;
	text-align: center;
	font-variant: none;
}
.footer-trilogy-link {
	display: block;
}
.footer-trilogy-link-mobile {
	display: none;
}
.footer-trilogy-link p { text-align: center; padding-right: 12px; font-size: .8em; line-height: 200%; letter-spacing:.1em; color: #888;}	
.footer-trilogy-link a { text-align: center; padding-right: 12px; font-size: .92em; line-height: 200%; letter-spacing:.1em; color: #888; text-decoration: none;}	
.footer-trilogy-link a:link, .footer-trilogy-link a:visited { 
	text-align: center; 
	font-size: .9em; 
	line-height: 200%; 
	font-weight: normal;
	letter-spacing:.1em; 
	color: #e8b9fb; 
	text-decoration: none;
	transition: 1s ease;
}	
.footer-trilogy-link a:hover, a:active, a:focus { 
	color: #888;
}		
.copyright { font-size: .9em; font-weight: normal
}

.fltrt {  
	float: right;
	margin-left: 8px;
}
.fltlft { 
	float: left;
	margin-right: 8px;
}
.clearfloat { 
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}
.left p {
	text-align: left;
}
.flex-container {
  padding: 0;
  margin: 2em 0 0 0;
  width: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  justify-content: space-around;
  flex-wrap: nowrap;
}
#top.flex-container {
  margin: 1em 5% 0 0;
	padding: 0 0 2em 0;
	width: 80%;
}
.flex-item {
  margin: 0 auto;
  padding: 0 8% 0 8%;
  text-align: center;
  vertical-align: middle;
}
#top .flex-item {
  padding: 0 8% 0 8%;
}
.books {
	display: none;
}
.books-5-books .flex-item {
  margin: 0 auto;
  padding: 0 4% 0 4%;
  width: 20%;
  text-align: center;
  vertical-align: middle;
}
.books .flex-item img, .books-5-books .flex-item img {
	width: 100%;
	border: 1px #555 solid;
}
.books .flex-item p {
	color: #cc99ff;
	font-size: .9em;
	font-weight: 300;
	line-height: 130%;
	letter-spacing: .03em;
	margin: 0 0 3em 0;
}
.books-5-books .flex-item p {
	color: #cc99ff;
	font-size: .8em;
	font-weight: 300;
	line-height: 140%;
	letter-spacing: .03em;
	margin: 0 0 3em 0;
}
.books a:link, .books a:visited, .books-5-books a:link, .books-5-books a:visited {
	color: #6699cc;
	font-size: .8em;
	font-weight: 400;
	line-height: 170%;
	/*! font-variant: small-caps; */
	letter-spacing: .08em;
	text-decoration: none;
	padding-bottom: .11em;
	transition: 1s ease;
}
.books a:hover, .books a:active, .books a:focus, .books-5-books a:hover, .books-5-books a:active, .books-5-books a:focus {
	color: #666666;
	position: relative;
	transition: 1s ease;
}
.books img a:link, .books img a:visited, .books-5-books a:link, .books-5-books a:visited {
	opacity: 1;
	border-bottom: none;
	transition: 1s ease;
}
.books img a:hover, .books img a:active, .books img a:focus, .books-5-books a:hover, .books-5-books a:active, .books-5-books a:focus {
	opacity: .606;
	border-bottom: none;
	transition: 1s ease;
}

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

.front-cover {
	width: 88%;
	/*! max-width: 880px; */
	margin: 0 auto;
	margin-top: 2em;
}
}


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

h6 { 
	width: 70% }
h5 {
	font-size: 16px;
}	
#top.flex-container {
	width: 92%;
}
.flex-item {
  padding: 0 4% 0 4%;
}
.front-cover{
	/*! max-width: 800px; */
	margin: 0 auto;
	margin-top: 2em;
}
.front-cover-cri {
	width: 68%;
	max-width: 880px;
	margin: 0 auto;
	margin-top: 2em;
	padding: 1em 0 4em 0;
}
	.front-cover-cri .front-cover-img {
		width: 40%;
		margin-bottom: 8em;
		margin-right: 2em;
	}
	.front-cover-cri .book-details {
		width: 38%;
	}
.front-cover-img, { 
	width: 40%;
	margin-bottom: 8em;
}
.book-details {
	margin-top: 1em;
	width: 50%;
}
.front-cover.book-3 {
	width: 70%;
	margin: 0 auto;
	margin-top: 2em;
}
.front-cover.book-3 .book-details {
	width: 30%;
}
}

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

#top.flex-container {
	padding: 0 0 4em 0;
}
#top .flex-item {
  padding: 0 4% 2em 4%;
}
.flex-container {
  margin: 2em 0 0 0;
  -webkit-flex-flow: column wrap;
  justify-content: space-around;
  flex-wrap: nowrap;
   -webkit-flex-direction: column;
   flex-direction: column;
}
.flex-item {
	margin: 0 auto;
	padding: 0;
  width: 80%;
  text-align: center;
  vertical-align: middle;
}
.book-details {
	margin-top: 1em;
	width: 40%;
}
.get-the-book {
	margin-top: 3em;
	font-size: .9em;
}
.books-5-books {
		display: none;
	}
.books {
		display: block;
	}
.books .flex-container#lin {
  padding: 0;
  margin: 0 auto;
  width: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  justify-content: space-around;
  flex-wrap: nowrap;
	flex-direction: row;
}
.books .flex-container#cri {
  padding: 2em 0 0 0;
  margin: 0 auto;
  width: 68%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  justify-content: space-around;
  flex-wrap: nowrap;
	flex-direction: row;
}
.books .flex-item#lin1, .books .flex-item#lin2 ,.books .flex-item#lin3 {
  margin: 0 auto;
  padding: 0 8% 0 8%;
	max-width: 8em;
  text-align: center;
  vertical-align: middle;
}
.books .flex-item#cri1, .books .flex-item#cri2 {
  margin: 0 auto;
  padding: 0 8% 0 8%;
	max-width: 8em;
  text-align: center;
  vertical-align: middle;
}
.books .flex-item img, .books-5-books .flex-item img {
	width: 8em;
	border: 1px #555 solid;
}
h4 { /* 22 px centered dark*/
	font-size: 1.5em; 
	padding: 0 1em 0 1em;
}
.backcover-600w {
	display: block;
	text-align: center;
	width: 90%;
	max-width: 600px;
	border: #666666 .11em solid;
	margin: 1.5em 0 1em 0;
}
.backcover-820w {
	display: none;
}
}

@media screen and (max-width: 780px) {
.container {
	background: #000;
	margin: 0 auto; 
}
.content {
	width: 100%;
}
.text {
	width: 68%;
	padding-top: 12px;
}
.book-img:hover {
	transform: scale(2.2);
	-ms-transform: scale(2.2);
	-webkit-transform: scale(2.2);
	-moz-transform: scale(2.2);
	-o-transform: scale(2.2);
}


#solarpunk .blocktext p { 
	width: 80%;
}

#about-albereo .blocktext p { 
	margin: 0 auto;
	padding: 0;
	width: 80%;
	max-width: 740px;
}
}


@media screen and (max-width: 690px) {
	
.books .flex-item#lin1, .books .flex-item#lin2 ,.books .flex-item#lin3, .books .flex-item#cri1, .books .flex-item#cri2 {
  padding: 0 4% 0 4%;
	max-width: 8em;
  text-align: center;
  vertical-align: middle;
}
.books .flex-item img {
	width: 6em;
	border: 1px #555 solid;
}
.book-details {
	margin-top: 0;
}	
.front-cover-cri {
	width: 90%;
	max-width: 480px;
	margin: 0 auto;
	margin-top: 2em;
	padding: 1em 0 4em 0;
}
	.front-cover-cri .front-cover-img {
		width: 45%;
		margin-bottom: 1em;
		margin-right: 0;
	}
	.front-cover-cri .book-details {
		float: right;
		width: 42%;
	}
.front-cover {
	width: 80%;
	margin: 0 auto;
	margin-top: 2em;
}
.front-cover-img {
	width: 80%;
	max-width: 220px;
	margin-bottom: 4em;
	}
.front-cover.book-3 {
	width: 80%;
	margin: 0 auto;
	margin-top: 2em;
}
.front-cover.book-3 .front-cover-img {
	max-width: 240px;
}
.front-cover.book-3 .book-details {
	width: 30%;
}
}

@media screen and (max-width: 560px) {
.text {
	width: 80%;
	padding-bottom: 40px;
}
.book-img:hover {
	transform: scale(2.2);
	-ms-transform: scale(2.2);
	-webkit-transform: scale(2.2);
	-moz-transform: scale(2.2);
	-o-transform: scale(2.2);
}
.front-cover, .front-cover.book-3 {
	width: 90%;
	margin: 0 auto;
	margin-top: 2em;
	padding: 1em 0 4em 0;
}
.front-cover-img, .front-cover.book-3 .front-cover-img { 
	width: 80%;
	max-width: 300px;
  padding: 0 0 0 0;
	margin-bottom: 0;
	float: none;
}
.book-details, .front-cover.book-3 .book-details {
	margin: 0 auto;
	margin-top: 2em;
	margin-bottom: 2em;
	width: 58%;
	float: none;
	padding-left: 0;
}
.front-cover-cri {
	width: 80%;
	max-width: 880px;
	margin: 0 auto;
	margin-top: 2em;
	padding: 1em 0 4em 0;
}
	.front-cover-cri .front-cover-img {
		float: none;
		width: 80%;
		margin-bottom: 1em;
		margin-right: 0;
	}
	.front-cover-cri .book-details {
		width: 68%;
	}
.blocktext {
	width: 90%;
	float: none;
	text-align: justify;
}

.chronicles {
	float: none;
	padding-left: 40px;
}
.book1 {
	float: clear;
	width: 100%;
}
.book2 {
	float: clear;
	width: 100%;
}
}

@media screen and (max-width: 480px) {
.container {
	background: #000;
	margin: 0 auto; 
	width: 90%;
}
.text {
	width: 90%;
	padding-bottom: 20px;
}
h2 { 
	font-size: 21px;
	padding-top: 40px;
}
.book-img:hover {
	transform: scale(1.1);
	-ms-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-o-transform: scale(1.1);
}
.book-details, .front-cover.book-3 .book-details {
	width: 68%;
}

.blocktext {
	width: 80%;
	float: none;
	text-align: justify;
}

.fltrt {  
	float: none;
	margin-left: 0px;
}
.fltlft { 
	float: none;
	margin-right: 0px;
}

}