@charset "utf-8";
/* CSS Document */

/*START FONTS*/

@import url('https://fonts.googleapis.com/css?family=Amaranth|Michroma|Philosopher|Raleway|Ruluko|Syncopate&display=swap');

@import url('https://fonts.googleapis.com/css?family=Montaga&display=swap');

@import url('https://fonts.googleapis.com/css?family=Playfair+Display|ZCOOL+XiaoWei&display=swap');

@import url('https://fonts.googleapis.com/css?family=Poppins&display=swap');

@import url('https://fonts.googleapis.com/css?family=Hind&display=swap');

@import url('https://fonts.googleapis.com/css?family=Mukta&display=swap');

@import url('https://fonts.googleapis.com/css?family=Questrial&display=swap');

@import url('https://fonts.googleapis.com/css?family=Catamaran:200&display=swap');


/*
font-family: 'Catamaran', sans-serif;
font-family: 'Questrial', sans-serif;
font-family: 'Mukta', sans-serif;
font-family: 'Hind', sans-serif;
font-family: 'Poppins', sans-serif;
font-family: 'Raleway', sans-serif;
font-family: 'Philosopher', sans-serif;
font-family: 'Amaranth', sans-serif;
font-family: 'Michroma', sans-serif;
font-family: 'Syncopate', sans-serif;
font-family: 'Ruluko', sans-serif;
font-family: 'Montaga', serif;
font-family: 'Playfair Display SC', serif;
*/
/*END FONTS*/

/*--------------------------------------------------------------------------------------*/

* {-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding:0; margin:0;}

a:link {text-decoration: none!important;}

/*END UNIVERSAL ATTRIBUTES*/

/*-----------------------------------------------------------------------------------*/

/*START HTML AND BODY ATTRIBUTES*/

html {
  	text-rendering: optimizeLegibility;
	-webkit-font-kerning: normal;
	font-kerning: normal;
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%;}

body {padding:0px 0px; background-color:#120406;}

/*END HTML AND BODY ATTIBUTES*/

/*----------------------------------------------------------------------------------*/

/*START APROPOS/PRELUDE HEADER*/

.header {
		background-image:url("../img/book-cover/Snail01.jpg");
		background-size:cover;
		margin:0px;
		position:relative;
		display:flex;
		width:100%;
		height:240px; padding:0px;
		border-bottom:2px solid #000;
		z-index:1;
		background-position: 50% 40%;}

.header > p, .header > a {
		color:rgba(207,3,3,1.00); text-shadow: -1px 1px 4px #fff; z-index:10; animation: standard-fadeandscale 1s; animation-fill-mode: forwards; animation-delay: 1s; visibility: hidden;
		width:100%;		
		margin: 0;
		padding:0px 20px 0px 50px;
		font-size: 4em;
		align-self: center;
		left:30%;
		text-decoration: none;}

@keyframes standard-fadeandscale { from { opacity: 0; transform: scale3d(.85, .85, 1); color:rgba(207,3,3,1.00)} to { visibility: visible; opacity: 1; transform: scale3d(1, 1, 1); color:rgba(182,122,0,1.00)}}

.home-link:hover {color:rgba(207,3,3,1.00); text-shadow:1px 1px 1px #000; transition: .5s;}

.fill5 {width:100%; height:5px; background-color: #fff;}
.fill10 { width: 100%; height: 10px; background-color: #fff; }
.fill5-black {width:100%; height:5px; background-color: #000;}
.fill50-black { width: 100%; height: 50px; background-color: #000; }


/*END APROPOS/PRELUDE HEADER*/

/*-------------------------------------------------------------------------------------*/

/*START BOOK PROMO*/

.rtsi-promo-container {display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: center; position:relative; height:400px; width:100%; background-color:#999;}

.book-border {border: 2px solid #000; width:94%; height:85%; padding:20px; display:flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: center;}

.book-left-fill {width: 150px;}

.rtsi-book-cover {width:200px; height:300px;}

.book {width:200px; height:100%; padding-left:0px; box-shadow: 3px 3px 10px rgba(0,0,0,.6);}

.book:hover {transform: scale(.98);transition: .2s; box-shadow: 0px 0px 40px #fff;}

.promo-text {padding:0px 50px; font-size: 1.2em;}

.amazon {text-decoration: none; color:#fff;}

.amazon:hover {color:rgba(207,3,3,1.00); text-transform: uppercase; transition: .1s;}

@media screen and (max-width:1300px) { .promo-text {padding: 0px 30px; font-size: 1.1em;}}

@media screen and (max-width:1000px) { .book-left-fill {width:100px;} .promo-text {padding: 0px 10px 0px 30px;font-size:1.0em;}}

@media screen and (max-width:800px) { .promo-text {padding: 0px 10px 0px 30px;font-size:.9em;}}

@media screen and (max-width:730px) {.book-left-fill {width:50px;} .rtsi-book-cover { width:150px; height:225px;} .book {width:150px; height:225px;} .promo-text {font-size:.8em;}}

@media screen and (max-width:600px) { .rtsi-promo-container {height:auto;} .book-border {flex-direction:column; height: auto; margin: 20px 0px;} .rtsi-book-cover {margin-bottom:20px;} .promo-text {padding:0px 10px;}}

@media screen and (max-width:450px) {.promo-text {padding:0;}}

/*END BOOK PROMO*/

/*-----------------------------------------------------------------------------------*/

/*START STANDARD FOOTER*/

.footer {position:relative; height:300px; background-color:#404040; display:flex; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: center; text-decoration: none!important;}

.spiritual-iron-title {font-size:4em; color:rgba(207,3,3,1.00); text-shadow: -3px 3px 10px #000;}

.email {font-size:2em; padding-bottom:60px; margin-top:10px; text-decoration: none!important; color:#fff;}

.email-address {text-decoration: none!important;}

.email-adddress:hover {color:rgba(207,3,3,1.00) !important; text-shadow: 2px 2px 5px #000;}

@media screen and (max-width:500px) {.spiritual-iron-title {font-size:3em;} .email {font-size:1.2em;}}

@media screen and (max-width:400px) {.email{font-size:1.0em;} .spiritual-iron-title { font-size: 2em;}}

/*END STANDARD FOOTER*/

/*-------------------------------------------------------------------------------------*/