/* ==========================================================================
   Author's custom styles
   ========================================================================== */

	html {
		position: relative;
		min-height: 100%;
	}

	body {
		font-family: 'Quattrocento Sans', Verdana, sans-serif;
		background-color: #000;
		font-size: 12px;
		margin: 0 0 0 0;
		height: 100%;
	}

/* Background Pics */

	#bgpic-unu {
		background: url(../img/1-Unu-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-cosmos {
		background: url(../img/2-Cosmos-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-chronos {
		background: url(../img/3-Chronos-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-logos {
		background: url(../img/4-Logos-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-maia {
		background: url(../img/5-Maia-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-luna {
		background: url(../img/6-Luna-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-sol {
		background: url(../img/8-Sol-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-doom {
		background: url(../img/9-Doom-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-antes {
		background: url(../img/10-Antes-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-fatale {
		background: url(../img/13-Fatale-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-klarion {
		background: url(../img/11-Klarion-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-destux {
		background: url(../img/12-Destux-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-serene {
		background: url(../img/14-Serene-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-umbra {
		background: url(../img/15-Umbra-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

	#bgpic-gnomon {
		background: url(../img/16-Gnomon-1280x960.jpg) no-repeat center center fixed;
		-webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
  		background-size: cover;
  		background-color: #000;
  		max-width: 100%;
	}

/* End Background Pics */


/* Index Page */
	#splash-bg {
		position: fixed;
		top: 50%;
		left: 50%;
		margin-top: -310px;
		margin-left: -500px;
		background-position: center;
		background-size: cover;
		max-width: 100%;
	}

/* Header */
	#header {
		position: relative;
		background-color: rgba(00,00,00, 0.6);
		max-width: 100%;
		margin-top: 0;
		height: auto;
		padding: 10px 0 0 0;
		margin-bottom: 20px;
		margin-left: 0;
		margin-right: 0;
	}

#header .col-sm-2 {
		background-color: rgb(00,00,00);
		margin-left: -10px;
		margin-top: -10px;
		padding: 5px 0 5px 20px;
	}

	#header .col-sm-2 img {
		margin-left: auto;
		margin-right: auto;
		display: block;
		margin-top: 2px;
	} 

	#header h1 {
		font-family: 'Quattrocento', serif;
		font-size: 45px;
		color: #fff;
		padding-top: 0;
		margin-top: 0;
		padding-left: 10px;
		margin-bottom: 0px;
	}

	#header ul {
		margin-bottom: 5px;
		margin-top: 10px;
		padding: 0;
		padding-left: 10px;
		list-style-type: none;
	}

	#header .col-sm-10 ul li {
		font-family: 'Quattrocento Sans', sans-serif;
		display: inline-block;
		list-style-type: none;
		margin-left: 0;
		margin-right: 15px;
		padding: 0;
		font-size: 11px;
		color: #fff;
		-webkit-text-stroke: 0.35px;
		-webkit-font-smoothing: antialiased;
		font-smoothing: antialiased;
	}

	#header .col-sm-10 li a.topnav {
		color: #808080;
		text-decoration: none;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#header .col-sm-10 li a.topnav:hover {
		color: #f26522;
		text-decoration: none;	
	}



	#header .col-sm-10 li a.get-book {
		color: #f26522;
		text-decoration: none;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#header .col-sm-10 li a.get-book:hover {
		color: #fff;
		text-decoration: none;
	}


	

	.author {
		color: #808080;
		display: inline-block;
	}

/* Main */

	#main {
		margin: 0 0 25px 0;
		padding: 0 5px 50px 5px;
	}

	#main ul {
		list-style-type: none;
		margin-left: 0;
		margin-bottom: 0;
		padding: 0;
		margin-left: 0;
	}

	#main .col-sm-2 ul li {
		font-family: 'Quattrocento Sans', sans-serif;
		list-style-type: none;
		margin-left: 0;
		margin-bottom: 15px;
		padding: 2px 10px 1px 0;
		margin-left: 0;
		margin-right: 0;
		text-align: right;
		color: #fff;
		background-color: rgba(95,95,95, 1);
		font-size: 11px;
		opacity: 0.4;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#main .col-sm-2 ul li:hover {
		opacity: 1;

	}

	#main .col-sm-2 li a.mythnav {
		color: #fff;
		background-color: rgba(95,95,95, 1);
		font-size: 11px;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#main .col-sm-2 li a.mythnav:hover {
		opacity: 1;
		background-color: rgba(95,95,95, 1);
		
	}

	#main .col-sm-3 {
		padding: 0 15px 0 15px;
		line-height: 20px;
	}

	#main .col-sm-3 a {
		color: #f26522;
		text-decoration: none;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#main .col-sm-3 a:hover {
		color: #808080;
		text-decoration: none;	
	}

	#main h2 {
		font-family: 'Quattrocento', serif;
		font-size: 20px;
		margin-top: 0px;
		color: #c2c2c2;
	}

	#main h3 {
		font-family: 'Quattrocento', serif;
		font-size: 14px;
		margin-top: 0px;
		margin-bottom: 5px;
		margin-top: 15px;
		color: #f26522;
	}

	#main p {
		color: #c2c2c2;
	}

	#main img {
		max-width: 100%;
	}

	#main .col-sm-7 {
		margin-bottom: 50px;
	}

	#main .col-sm-3 p.50black {
		color: #808080;
	}

/* Myth Pages */


	#myth {
		margin: 0 0 25px 0;
		padding: 0 5px 50px 5px;
	}

	#myth ul {
		list-style-type: none;
		margin-left: 0;
		margin-bottom: 0;
		padding: 0;
		margin-left: 0;
		margin-bottom: 25px;
	}

	#myth ul a {
		text-decoration: none;
	}

	#myth .col-sm-2 ul li {
		font-family: 'Quattrocento Sans', sans-serif;
		list-style-type: none;
		margin-left: 0;
		margin-bottom: 15px;
		padding: 2px 10px 1px 0;
		margin-left: 0;
		margin-right: 0;
		text-align: right;
		background-color: rgba(95,95,95, 1);
		opacity: 0.4;
		color: #fff;
		font-size: 11px;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#myth .col-sm-2 ul li:hover {
		opacity: 1;
		
	}

	#myth .col-sm-2 li a.mythnav {
		color: #fff;
		background-color: rgba(95,95,95, 1);
		font-size: 11px;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#myth .col-sm-2 li a.mythnav:hover {
		opacity: 1;
		background-color: rgba(95,95,95, 1);
		
	}

	#myth .col-sm-2 li.mythnav-active {
		color: #fff;
		background: #808080;
		opacity: 1;
	}

	#myth .col-sm-3 {
		padding: 15px 15px 35px 15px;
		line-height: 15px;
		background-color: rgba(51,51,51, 0.8);
		margin-bottom: 50px;
		color: #fff;
	}

	#myth .col-sm-3 img {
		margin: 0 0 10px -3px;
	}

	#myth .col-sm-3 a {
		color: #acacac;
		text-decoration: none;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#myth .col-sm-3 a:hover {
		color: #f26522;
		text-decoration: none;
		
	}

	#myth h2 {
		font-family: 'Quattrocento', serif;
		font-size: 24px;
		margin-top: 0px;
		color: #fff;
	}

	#myth h3 {
		font-family: 'Quattrocento Sans', sans-serif;
		font-size: 14px;
		margin-top: 0px;
		color: #fff;
	}

	#myth p {
		color: #fff;
	}

	#myth #previous img {
		float: left;
		margin-top: 5px;
		opacity: 0.6;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#myth #previous img:hover {
		opacity: 1;
		
	}

	#myth #next img {
		float: right;
		margin-top: 5px;
		opacity: 0.6;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#myth #next img:hover {
		opacity: 1;
		
	}

	.indent {
		margin-left: 30px;
	}

/* Maia */

	#myth-maia {
		margin: 0 0 25px 0;
		padding: 0 5px 50px 5px;
	}

	#myth-maia ul {
		list-style-type: none;
		margin-left: 0;
		margin-bottom: 0;
		padding: 0;
		margin-left: 0;
		margin-bottom: 25px;
	}

	#myth-maia ul a {
		text-decoration: none;
	}

	#myth-maia .col-sm-2 ul li {
		font-family: 'Quattrocento Sans', sans-serif;
		list-style-type: none;
		margin-left: 0;
		margin-bottom: 15px;
		padding: 2px 10px 1px 0;
		margin-left: 0;
		margin-right: 0;
		text-align: right;
		background-color: rgba(95,95,95, 1);
		opacity: 0.8;
		color: #fff;
		font-size: 11px;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#myth-maia .col-sm-2 ul li:hover {
		opacity: 1;
		
	}

	#myth-maia .col-sm-2 li a.mythnav {
		color: #fff;
		background-color: rgba(95,95,95, 1);
		font-size: 11px;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#myth-maia .col-sm-2 li a.mythnav:hover {
		opacity: 1;
		background-color: rgba(95,95,95, 1);
		
	}

	#myth-maia .col-sm-2 li.mythnav-active {
		color: #fff;
		background: #808080;
		opacity: 1;
	}

	#myth-maia .col-sm-3 {
		padding: 15px 15px 35px 15px;
		line-height: 15px;
		background-color: rgba(51,51,51, 0.8);
		margin-bottom: 50px;
		color: #fff;
	}

	#myth-maia .col-sm-3 img {
		margin: 0 0 10px -3px;
	}

	#myth-maia .col-sm-3 a {
		color: #acacac;
		text-decoration: none;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#myth-maia .col-sm-3 a:hover {
		color: #f26522;
		text-decoration: none;
		
	}

	#myth-maia h2 {
		font-family: 'Quattrocento', serif;
		font-size: 24px;
		margin-top: 0px;
		color: #fff;
	}

	#myth-maia h3 {
		font-family: 'Quattrocento Sans', sans-serif;
		font-size: 14px;
		margin-top: 0px;
		color: #fff;
	}

	#myth-maia p {
		color: #fff;
	}

	#myth-maia #previous img {
		float: left;
		margin-top: 5px;
		opacity: 0.6;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#myth-maia #previous img:hover {
		opacity: 1;
		
	}

	#myth-maia #next img {
		float: right;
		margin-top: 5px;
		opacity: 0.6;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#myth-maia #next img:hover {
		opacity: 1;
		
	}

	.indent {
		margin-left: 30px;
	}



	/* End Maia */


/* Footer */

	#footer {
		background-color: rgba(51,51,51, 0.6);
		position: absolute;
    	left: 0;
    	bottom: 0;
    	height: auto;
	    width: 100%;
	    padding: 1% 0 5px 0;
    	margin-top: 50px;
	}

	#footer .col-sm-2 {
		padding: 0 6px 0 25px;
	}

	#footer .col-sm-2 img {
		margin-right: 10px;
		margin-bottom: 10px;
	}

	#footer .col-sm-2 a {
		opacity: 0.3;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#footer .col-sm-2 a:hover {
		opacity: 1;
		
	}

	#footer .col-sm-10 {
		font-size: 8px;
		padding: 0 0 0 20px;
		color: #acacac;
		-webkit-font-smoothing: antialiased;
		font-smoothing: antialiased;
	}

	#footer .col-sm-10 a {
		color: #acacac;
		text-decoration: none;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	#footer .col-sm-10 a:hover {
		color: #fff;
		text-decoration: none;
		
	}

/* Background Slideshow for Terra */

	.cb-slideshow,
	.cb-slideshow:after { 
    	position: fixed;
    	width: 100%;
    	height: 100%;
    	top: 0px;
    	left: 0px;
    	z-index: 0; 
	}

	.cb-slideshow:after { 
    	content: '';
}

	.cb-slideshow, .cb-slideshow:after ul li {
		list-style-type: none;
	}

	.cb-slideshow li span { 
	    width: 100%;
	    height: 100%;
	    position: absolute;
	    top: 0px;
	    left: 0px;
	    color: transparent;
	    -webkit-background-size: cover;
  		-moz-background-size: cover;
  		-o-background-size: cover;
	    background-size: cover;
	    background-position: 50% 50%;
	    background-repeat: none;
	    opacity: 0;
	    z-index: 0;
		-webkit-backface-visibility: hidden;
	    -webkit-animation: imageAnimation 30s linear infinite 0s;
	    -moz-animation: imageAnimation 30s linear infinite 0s;
	    -o-animation: imageAnimation 30s linear infinite 0s;
	    -ms-animation: imageAnimation 30s linear infinite 0s;
	    animation: imageAnimation 30s linear infinite 0s; 
	}

	.cb-slideshow li:nth-child(1) span { 
	    background-image: url(../img/terra-1.jpg) 
	}
	.cb-slideshow li:nth-child(2) span { 
	    background-image: url(../img/terra-2.jpg);
	    -webkit-animation-delay: 6s;
	    -moz-animation-delay: 6s;
	    -o-animation-delay: 6s;
	    -ms-animation-delay: 6s;
	    animation-delay: 6s; 
	}
	.cb-slideshow li:nth-child(3) span { 
	    background-image: url(../img/terra-3.jpg);
	    -webkit-animation-delay: 12s;
	    -moz-animation-delay: 12s;
	    -o-animation-delay: 12s;
	    -ms-animation-delay: 12s;
	    animation-delay: 12s; 
	}
	.cb-slideshow li:nth-child(4) span { 
	    background-image: url(../img/terra-4.jpg);
	    -webkit-animation-delay: 18s;
	    -moz-animation-delay: 18s;
	    -o-animation-delay: 18s;
	    -ms-animation-delay: 18s;
	    animation-delay: 18s; 
	}
	.cb-slideshow li:nth-child(5) span { 
	    background-image: url(../img/terra-5.jpg);
	    -webkit-animation-delay: 24s;
	    -moz-animation-delay: 24s;
	    -o-animation-delay: 24s;
	    -ms-animation-delay: 24s;
	    animation-delay: 24s; 
	}

	/* Animation for the slideshow images */
	@-webkit-keyframes imageAnimation { 
	    0% { opacity: 0;
	    -webkit-animation-timing-function: ease-in; }
	    8% { opacity: 1;
	         -webkit-animation-timing-function: ease-out; }
	    17% { opacity: 1 }
	    25% { opacity: 0 }
	    100% { opacity: 0 }
	}
	@-moz-keyframes imageAnimation { 
	    0% { opacity: 0;
	    -moz-animation-timing-function: ease-in; }
	    8% { opacity: 1;
	         -moz-animation-timing-function: ease-out; }
	    17% { opacity: 1 }
	    25% { opacity: 0 }
	    100% { opacity: 0 }
	}
	@-o-keyframes imageAnimation { 
	    0% { opacity: 0;
	    -o-animation-timing-function: ease-in; }
	    8% { opacity: 1;
	         -o-animation-timing-function: ease-out; }
	    17% { opacity: 1 }
	    25% { opacity: 0 }
	    100% { opacity: 0 }
	}
	@-ms-keyframes imageAnimation { 
	    0% { opacity: 0;
	    -ms-animation-timing-function: ease-in; }
	    8% { opacity: 1;
	         -ms-animation-timing-function: ease-out; }
	    17% { opacity: 1 }
	    25% { opacity: 0 }
	    100% { opacity: 0 }
	}
	@keyframes imageAnimation { 
	    0% { opacity: 0;
	    animation-timing-function: ease-in; }
	    8% { opacity: 1;
	         animation-timing-function: ease-out; }
	    17% { opacity: 1 }
	    25% { opacity: 0 }
	    100% { opacity: 0 }
	}

	/* Show at least something when animations not supported */
	.no-cssanimations .cb-slideshow li span{
	opacity: 1;
	}

/* End Slideshow */

/* Background Image */

	/*	#myth #bg {
		  position: fixed; 
		  top: -50%; 
		  left: -50%; 
		  width: 200%; 
		  height: 200%;
		  z-index: -1;
}

	#myth #bg {
		  position: absolute; 
		  top: 0; 
		  left: 0; 
		  right: 0; 
		  bottom: 0; 
		  margin: auto; 
		  min-width: 50%;
		  min-height: 50%;
		  z-index: -1;
}
*/

/* Font Families

font-family: 'Quattrocento', serif;
font-family: 'Quattrocento Sans', sans-serif;

*/