/*	Common CSS code	*/	
									
@import url('https://fonts.googleapis.com/css?family=Noto Sans');
@import url('https://fonts.googleapis.com/css?family=Noto Serif');
@import url('https://fonts.googleapis.com/css?family=Roboto Condensed');
@import url('https://fonts.googleapis.com/css?family=Cookie');

/*--------  Fonts ------------- */
/* @font-face { */
	/* font-family: Noto Sans; */
    /* src: url(fonts/NotoSans-Regular.ttf) format('ttf'); */
	/* font-style: normal; */
	/* font-weight: normal; */
/* } */
/* @font-face { */
	/* font-family: Noto Sans Condensed; */
    /* src: url(fonts/NotoSans_Condensed-Regular.ttf) format('ttf'); */
	/* font-style: normal; */
	/* font-weight: normal; */
/* } */
/* @font-face { */
	/* font-family: Noto Serif; */
    /* src: url(fonts/NotoSerif-Regular.ttf) format('ttf'); */
	/* font-style: normal; */
	/* font-weight: normal; */
/* } */
/* @font-face { */
	/* font-family: Noto Serif Condensed; */
    /* src: url(fonts/NotoSerif_Condensed-Regular.ttf) format('ttf'); */
	/* font-style: normal; */
	/* font-weight: normal; */
/* } */
/* @font-face { */
	/* font-family: Roboto Condensed; */
    /* src: url(fonts/RobotoCondensed-Regular.ttf) format('ttf'); */
	/* font-style: normal; */
	/* font-weight: normal; */
/* } */

/* --------  Top info -------------*/

* {box-sizing: border-box;}										
[class*="col-"] {float: left;padding: 15px;}								
html, body {
	text-align: justify;
	font-size: 1.1rem;	
	font-family: Noto Sans, sans-serif;
	margin-top:0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding:0px;
	background: #FFFFFF;
	width: 100%;
	height: fit-content;
}


/* --------  Main info -------------*/


img {max-width: 100%;height: auto;object-fit: scale-down;}									
div#preload {display: none;}												
h1 {font-size:30px;color:#000000;font-weight: 600;margin-top: 3rem;margin-bottom: 3rem;} /* Used for page titles */
h2 {font-size:1.3rem;color:#000000;font-weight: 600;margin-top: 2rem;margin-bottom: 2rem;} /* Used for excerpts */
h3 {display: text;font-size:1.1 rem;color:#000000;font-weight: normal;margin-top: 3 rem;margin-bottom: 3 rem;} /* Not used??? */
h4 {font-size:1.3rem;color:#000000;font-weight: 600;margin-top: 2rem;margin-bottom: 1rem;} /* Used in contact.html--where to find me/my other pen names */
h5 {font-size:1.3rem;color:#000000;font-weight: 600;margin-top: 1rem;margin-bottom: .5rem;} /* Used on books page */
h6 {font-size:1.3rem;color:#000000;font-weight: 600;margin-top: .5rem;margin-bottom: 1rem;text-decoration: underline;}
p { display: block;text-align: justify;font-size: 1 rem;color:#000000;padding: 0 0 1rem 0;}
img.thatimage{ max-width: 100%;height: auto;}

/* Never eat soggy waffles (NESW--North East South West:  top right bottom left */
.ex1 { font-feature-settings: "smcp" on; }
/* --------  Site info -------------*/

.author_title {font-size:2rem;text-decoration: underline;font-weight: 600;margin: 0;color: #BF0000;text-align: left;padding: 30px 0px 0px 20px;}
.author_block{height: 600px;border: 2px solid #000000;border-radius: 25px;padding: 30px;}
.author_block_text{padding: 30px;border: 0px solid #000000;}
.big_underline {font-size:1.3rem;color:#000088;text-decoration: underline;font-weight: 600;padding: 1rem 0rem 1rem 0rem;}
.book_count {text-indent: 50px;font-size:1.5rem;font-weight: 600;margin: 0;color: #8400BC;text-align: left;padding: 0px 0px 0px 0px;}
.book_heading {font-size:1.3rem;text-decoration: underline;color:#000000;text-align: center;font-weight: 600;margin: 0px 0px 0px 0px;padding: 30px 0px 40px 0px;}
.border_line{display: block;margin: 1em auto 1em auto;border-style: double;border-radius: 25px;border-width: 4px;border-color: #000000;width: 80%;text-align: center;}
.border_line_short{display: block; margin-top: 20px; margin-bottom: 20px;border-style: solid;border-radius: 25px;border-width: 2px;border-color: #D60000;width: 20%;text-align: center;}
.bottombar {width: 100%;height:15px;background: #000000;margin: 0px 0px 0px 0px;padding: 0px 0px 0px 0px;}
.buy_indent {text-indent: 50px;}
.divider {background: #021735;width: 100%;height: 5px;padding: 0px 0px 0px 0px;box-shadow: 4px 4px 3px 1px #9E9E9E;}
.font2rem{font-size: 2rem;color: #000000;}
.footer {background-color: transparent;  color: #000000;  text-align: center;  font-size: 1rem;  font-weight: bold;  margin: auto;  width: 96%; font-family: Roboto condensed;}
.footer_line {display: block;margin: auto;border-style: outset;border-radius: 25px;border-width: 4px;border-color: #D9BC79;width: 50%;}
.flex-container {display: flex;  flex-direction: row;  flex-wrap: nowrap; justify-content: space-around; align-items:center; width: 99%;border: 0px solid #000000;}
.index_block1 {text-align: center;background: transparent;padding: 0;margin:0;width: 99%;font-size: 1.1rem;}
.index_block2 {text-align: center;background: transparent;padding: 0;margin:0;width: 99%;font-size: 1.1rem;}
.index_block3 {background: #FFFFcc;padding: 0;margin:0;width: 99%;}
.line_dividers {background: #021735; width: 40%;height: 5px; padding: 0px;margin: 20px 0px 20px 0px;box-shadow: 4px 4px 3px 1px #9E9E9E;}
.main_body {margin-right: auto;margin-left: auto;padding: 0px 20px 0px 20px;display: block;width: 96%; font-weight: normal;color: #000000;text-align: justify;font-family: Noto Sans, sans-serif;}
.p_8 {font-size: 2px;color:#000000;} /* Used to include a smaller <br> */
.p_author {color:#000000;padding: 0 1rem 0.8rem 1rem;text-align: left;font-size: 1rem;}
.p_author_smaller {color:#000000;padding: 0 ;text-align: left;font-size: 14px;}
.p_author_small {color:#000000;padding: 0 ;text-align: left;font-size: 16px;}
.move_special {width: 20%;border: 0px solid #000000;text-align: center;}
.move_special5 {width: 5%;border: 0px solid #000000;text-align: center;}
.move_contain {width: auto;border: 0px solid #000000;text-align: center; margin-bottom: 1%;}
.move_contain1 {width: 100%;border: 0px solid #000000;text-align: center; margin-bottom: 1%;}
.move_contain2 {width: 49%;border: 0px solid #000000;text-align: center; margin-bottom: 1%;}
.move_contain3 {width: 33%;border: 0px solid #000000;text-align: center; margin-bottom: 1%;}
.move_contain4 {width: 25%;border: 0px solid #000000;text-align: center; margin-bottom: 1%;}
.move_contain5 {width: 19%;border: 0px solid #000000;text-align: center; margin-bottom: 1%;}
.half_move_contain5 {width: 10%;border: 0px solid #000000;text-align: center; margin-bottom: 1%;}
.small_font_size{font-size: 2pt;color: #000000;}
.special_font{font-size: 1.8rem;color: #000000;}
.special_font1{font-size: 1rem;color: #000000;}
.special_font2{font-size: 1.5rem;color: #000000;}
.special_font3{font-size: 2.5rem;color: #000000;}
.special_font4{font-size: 2.8rem;color: #000000;}
.special_font5{font-size: 3.5rem;color: #000000;}
.special_font_read{font-size: 1.3rem;color: #000000;}
.titler{font-size: 1.5rem;font-weight: bold;color: #000000;text-decoration: underline;}
.titler2{font-size: 2.5rem;font-weight: bold;color: #000000;}
.topbar {width: 100%;height: 50px;vertical-align: top;background: #000000;margin: 0px;padding: 0px 0px 10px 0px;text-align: center;color:#ffffff;}
.toplinks {font-family: Roboto Condensed;color:#ffffff;margin-left: auto;margin-right: auto;padding: 20px 5px 20px 5px;text-align: center;border: 0px solid #000000;width: 100%;font-size: 1rem;font-weight: normal;}
.varwidx2 {width: 60%; padding: 1rem; margin: 0px 50px 0px 50px; text-align: center;} /*use for 2 items in a container*/
.varwidx3 {width: 80%; padding: 1rem; margin: 0px 25px 0px 25px;text-align: center;} /*use for 3 items in a container*/
.varwidx4 {width: 100%; padding: 1rem; margin: 0px 25px 0px 25px;text-align: center;} /*use for 4 items in a container*/
.varwidx5 {width: 100%; padding: 0rem; margin: 0px 0px 0px 0px;text-align: center;} /*use for 5 items in a container*/


.button_jump {border: 1px solid #000000; text-align: center; font-family: Roboto Condensed;font-size: 20px;margin: 2px 2px;display: inline-block;padding: 10px 10px 10px 10px;background: #FFF9C4; color: #000000;}

/* ------------------  Shadows ----------------- */
#book_outline { /* outline around book */padding: 0px;border: 1px solid #000000;/*width: 150px;height: 225px;*/text-align: center;}
#book_outline_none { /* no outline around book */padding: 0px;border: 0px solid #000000;text-align: center;}
#gray_shadow { /* used in various sites for all books and featured */  padding: 10px;box-shadow: 7px 7px 3px 1px #9E9E9E;}
.book_shadow {box-shadow: 7px 7px 3px 1px #9E9E9E;}
.book_shadow_gold {box-shadow: 7px 7px 6px 1px #827655;}
.book_shadow_green {box-shadow: 6px 6px 5px 1px #779B5B;}
.book_shadow_pink {box-shadow: 7px 7px 6px 1px #825C57;/* horizontal offset, vertical offset, blur, spread, color:  https://www.w3schools.com/cssref/css3_pr_box-shadow.asp */}

.text_outliner{
	text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; /*creates border around letters*/
}

.text_shadower{
	text-shadow: 2px 2px 3px #E0E0E0;  /*creates text shadow--horizontal, vertical offset, blur*/
}

/* ------------------  Tablets and Phones  ----------------- */
@media only screen and (max-width: 1150px) {			
[class*="col-"] {width: 100%;font-size: 1rem;}		
img {max-width: 90%;  height: auto;object-fit: scale-down;}
	body {font-size: 1rem;}									
	h1 {font-size:1.2rem;margin-top: 2.5rem;margin-bottom: 2.5rem;} /* Used for page titles */
	h2 {font-size:1.2rem;margin-top: 1.5rem;margin-bottom: 1.5rem;} /* Used for excerpts */
	h3 {font-size:1 rem;margin-top: 2.5 rem;margin-bottom: 2.5 rem;} /* Not used??? */
	h4 {font-size:1.2rem;margin-top: 1.5rem;margin-bottom: 0.5rem;} /* Used in contact.html--where to find me/my other pen names */
	h5 {font-size:1.2rem;margin-top: 0.5rem;margin-bottom: .5rem;} /* Used on books page */
	h6 {font-size:1.2rem;margin-top: .5rem;margin-bottom: 0.5rem;}
	p {font-size: .9 rem;padding: 0 0 1rem 0; /* Never Eat Soggy Waffles--North East South West */}
	img.thatimage{ max-width: 80%;height: auto;}
	img.thatimage2{ max-width: 70%; height: auto;}

	.author_block{height: 500px;border: 2px solid #000000;border-radius: 25px;padding: 30px;}
	.author_title {font-size:1.8rem;padding: 30px 0px 10px 20px;}
	.book_count {text-indent: 45px;font-size:1.4rem;}
	.book_heading {font-size:1rem;padding: 10px 0px 10px 0px;}
	.border_line{margin: 1em auto 1em auto;border-width: 3.5px;}
	.border_line_short{margin-top: 10px; margin-bottom: 10px;}
	.bottombar {height:15px;}
	.button_jump {font-size: 18px;margin: 1px 1px;padding: 8px;}
	.buy_indent {text-indent: 45px;}
	.divider {height: 5px;}
	.font2rem{font-size: 1.7rem;color: #000000;}
	.footer {font-size: 1rem;padding: 20px;}
	.footer_line {border-width: 4px;}
	.index_block1 {padding: 0 10px 0 10px;font-size: 1rem;}
	.index_block2 {padding: 0 10px 0 10px;font-size: 1rem;}
	.line_dividers {width: 40%;height: 5px; padding: 0px;margin: 20px 0px 20px 0px;}
	.main_body {font-size: 1rem;padding: 0px 20px 0px 20px;}
	.move_special {width: 20%;border: 0px solid #000000;text-align: center;}
	.move_special5 {width: 0%;border: 0px solid #000000;text-align: center;}
	.p_author {padding: 0 .5rem 0.5rem .5rem;font-size: .8rem;}
	.p_author_small{font-size: 14pt;}
	.special_font{font-size: 1.6rem;}
	.special_font1{font-size: 1rem}
	.special_font2{font-size: 1.5rem;}
	.special_font3{font-size: 2.2rem;}
	.special_font4{font-size: 2.4rem;}
	.special_font5{font-size: 2.5rem;}
	.special_font_read{font-size: 1.1rem;}
	.titler{font-size: 1rem;}
	.titler2{font-size: 2rem;}
	.topbar {height: 50px;padding: 0px 0px 10px 0px;}
	.toplinks {padding: 20px 5px 20px 5px;font-size: 1rem;}
	.varwidx2 {width: 100%; padding: 10px; margin: 0px;text-align: center;} 
	.varwidx3 {width: 100%; padding: 10px; margin: 0px;text-align: center;} 
	.varwidx4 {width: 100%; padding: 10px; margin: 0px;text-align: center;} 
}
@media only screen and (max-width: 1000px) {
[class*="col-"] {width: 100%;font-size: .9rem;}		
img {max-width: 80%;  height: auto;object-fit: scale-down;}
	img.thatimage{ max-width: 70%;height: auto;}
	img.thatimage2{ max-width: 60%; height: auto;}
	.varwidx2 {width: 90%; padding: 0rem; margin: 0px;text-align: center;} 
	.varwidx3 {width: 100%; padding: 0rem; margin: 0px;text-align: center;} 
	.button_jump {font-size: 16px;margin: 1px 1px;padding: 6px;}
}

@media only screen and (max-width: 900px) {
[class*="col-"] {width: 100%;font-size: .9rem;}		
img {max-width: 70%;  height: auto;object-fit: scale-down;}
	img.thatimage{ max-width: 60%;height: auto;}
	img.thatimage2{ max-width: 50%; height: auto;}
	.varwidx2 {width: 90%; padding: 0rem; margin: 0px;text-align: center;} 
	.varwidx3 {width: 100%; padding: 0rem; margin: 0px;text-align: center;} 
}


@media only screen and (max-width: 768px) {
[class*="col-"] {width: 100%;font-size: .9rem;}		
img {max-width: 65%;  height: auto;object-fit: scale-down;}
	body {font-size: .9rem;}									
	h1 {font-size:1rem;margin-top: 2rem;margin-bottom: 2rem;} /* Used for page titles */
	h2 {font-size:1rem;margin-top: 1rem;margin-bottom: 1rem;} /* Used for excerpts */
	h3 {font-size:.9 rem;margin-top: 2 rem;margin-bottom: 2 rem;} /* Not used??? */
	h4 {font-size:1rem;margin-top: 1rem;margin-bottom: 0.5rem;} /* Used in contact.html--where to find me/my other pen names */
	h5 {font-size:1rem;margin-top: 0.5rem;margin-bottom: .5rem;} /* Used on books page */
	h6 {font-size:3rem;margin-top: .5rem;margin-bottom: 0.5rem;}
	p {font-size: .9 rem;padding: 0 0 .9rem 0; /* Never Eat Soggy Waffles--North East South West */}
	img.thatimage{ max-width: 60%;height: auto;}
	img.thatimage2{ max-width: 40%; height: auto;}

	.author_title {font-size:1.2rem;padding: 20px 0px 10px 20px;}
	.author_block{height: 500px;padding: 10px;}
	.book_count {text-indent: 35px;font-size:1rem;}
	.book_heading {font-size:.9rem;padding: 5px 0px 5px 0px;}
	.border_line{margin: 1em auto 1em auto;border-width: 3px;}
	.border_line_short{margin-top: 5px; margin-bottom: 8px;}
	.bottombar {height:15px;}
	.button_jump {font-size: 16px;margin: 1px 1px;padding: 5px;}
	.buy_indent {text-indent: 35px;}
	.divider {height: 5px;}
	.font2rem{font-size: 1.5rem;color: #000000;}
	.footer {font-size: .9rem;padding: 20px;}
	.footer_line {border-width: 4px;}
	.index_block1 {padding: 0 10px 0 10px;font-size: 1rem;}
	.index_block2 {padding: 0 10px 0 10px;font-size: 1rem;}
	.line_dividers {width: 40%;height: 5px; padding: 0px;margin: 20px 0px 20px 0px;}
	.main_body {font-size: .9rem;padding: 0px 20px 0px 20px;}
	.move_special {width: 10%;border: 0px solid #000000;text-align: center;}
	.p_author {font-size: .8rem;}
	.p_author_small{font-size: 12pt;}
	.special_font{font-size: 1.2rem;}
	.special_font1{font-size: 1rem}
	.special_font2{font-size: 1rem;}
	.special_font3{font-size: 1.8rem;}
	.special_font4{font-size: 2rem;}
	.special_font5{font-size: 2.2rem;}
	.special_font_read{font-size: 1rem;}
	.titler{font-size: .9rem;}
	.titler2{font-size: 1.6rem;}
	.topbar {height: 45px;padding: 0px 0px 10px 0px;}
	.toplinks {padding: 20px 5px 20px 5px;font-size: .8rem;}
	.varwidx2 {width: 90%; padding: 0rem; margin: 0px;text-align: center;} /*use for 2 items in a container*/
	.varwidx3 {width: 100%; padding: 0rem; margin: 0px;text-align: center;} /*use for 3 items in a container*/
}

@media only screen and (max-width: 700px) {
[class*="col-"] {width: 100%;font-size: .9rem;}		
img {max-width: 63%;  height: auto;object-fit: scale-down;}
	img.thatimage{ max-width: 55%;height: auto;}
	img.thatimage2{ max-width: auto; height: auto;}
}

@media only screen and (max-width: 600px) {
[class*="col-"] {width: 100%;font-size: .9rem;}		
img {max-width: 60%;  height: auto;object-fit: scale-down;}
	img.thatimage{ max-width: 50%;height: auto;}
	.p_author_small{font-size: 12pt;}
}

@media only screen and (max-width: 560px) {
[class*="col-"] {width: 100%;font-size: .9rem;}		
img {max-width: 60%;  height: auto;object-fit: scale-down;}
	.varwidx2 {width: 100%; padding: 0rem; margin: 0px;text-align: center;} 
	.varwidx3 {width: 100%; padding: 0rem; margin: 0px;text-align: center;} 
	.button_jump {font-size: 12px;margin: 1px 1px;padding: 3px;}
}

@media only screen and (max-width: 500px) {
[class*="col-"] {width: 100%;font-size: .9rem;}		
img {max-width:60%;  height: auto;object-fit: scale-down;}
	body {font-size: .9rem;}									
	h1 {font-size:.8rem;margin-top: 1rem;margin-bottom: 1rem;} /* Used for page titles */
	h2 {font-size:.9rem;margin-top: .5rem;margin-bottom: .5rem;} /* Used for excerpts */
	h3 {font-size:.8 rem;margin-top: 1 rem;margin-bottom: 1 rem;} /* Not used??? */
	h4 {font-size:.9rem;margin-top: 1rem;margin-bottom: 0.5rem;} /* Used in contact.html--where to find me/my other pen names */
	h5 {font-size:.9rem;margin-top: 0.5rem;margin-bottom: .5rem;} /* Used on books page */
	h6 {font-size: 2.6rem;margin-top: .5rem;margin-bottom: 0.5rem;}
	p {font-size: .8 rem;padding: 0 0 .8rem 0; /* Never Eat Soggy Waffles--North East South West */}

	.author_block{height: 500px;padding: 10px;}
	.author_title {font-size:1rem;padding: 20px 0px 10px 20px;}
	.book_count {text-indent: 30px;font-size:1rem;}
	.book_heading {font-size:.9rem;padding: 5px 0px 5px 0px;}
	.border_line{margin: .9em auto .9em auto;border-width: 3px;}
	.border_line_short{margin-top: 2px; margin-bottom: 5px;}
	.bottombar {height:15px;}
	.buy_indent {text-indent: 30px;}
	.button_jump {font-size: 10px;margin: 1px 1px;padding: 3px;}
	.divider {height: 5px;}
	.font2rem{font-size: 1rem;color: #000000;}
	.footer {font-size: .8rem;padding: 20px;}
	.footer_line {border-width: 4px;}
	.index_block1 {padding: 0 10px 0 10px;font-size: 1rem;}
	.index_block2 {padding: 0 10px 0 10px;font-size: 1rem;}
	.line_dividers {width: 40%;height: 5px; padding: 0px;margin: 20px 0px 20px 0px;}
	.main_body {font-size: .9rem;padding: 0px 20px 0px 20px;}
	.move_special {width: 5%;border: 0px solid #000000;text-align: center;}
	.p_author {font-size: .8rem;}
	.p_author_smaller {font-size: .6rem;}
	.special_font{font-size: 1rem;}
	.special_font2{font-size: .8rem;}
	.special_font3{font-size: 1.5rem;}
	.special_font4{font-size: 1.8rem;}
	.special_font5{font-size: 2rem;}
	.special_font_read{font-size: 1rem;}
	.titler{font-size: .9rem;}
	.titler2{font-size: 1.2rem;}
	.topbar {height: 45px;padding: 0px 0px 10px 0px;}
	.toplinks {padding: 20px 0px 20px 0px;font-size: .7rem;}
	.varwidx2 {width: 100%; padding: 0rem; margin: 0px;text-align: center;} 
	.varwidx3 {width: 100%; padding: 0rem; margin: 0px;text-align: center;} 
}

@media only screen and (max-width: 460px) {
[class*="col-"] {width: 100%;font-size: .9rem;}		
img {max-width:60%;  height: auto;object-fit: scale-down;}
	img.thatimage{ max-width: 50%;height: auto;}
	.varwidx2 {width: 100%; padding: 0rem; text-align: center;} 
	.varwidx3 {width: 100%; padding: 0rem; text-align: center;} 
	.p_author_small{font-size: 10pt;}
}
@media only screen and (max-width: 450px) {
[class*="col-"] {width: 100%;font-size: .8rem;}		
img {max-width: 60%;  height: auto;object-fit: scale-down;}
	img.thatimage{ max-width: 40%;height: auto;}
	body {font-size: .8rem;}									
	h1 {font-size:.8rem;margin-top: 1rem;margin-bottom: 1rem;} /* Used for page titles */
	h2 {font-size:.9rem;margin-top: .5rem;margin-bottom: .5rem;} /* Used for excerpts */
	h3 {font-size:.8 rem;margin-top: 1 rem;margin-bottom: 1 rem;} /* Not used??? */
	h4 {font-size:.9rem;margin-top: 1rem;margin-bottom: 0.5rem;} /* Used in contact.html--where to find me/my other pen names */
	h5 {font-size:.9rem;margin-top: 0.5rem;margin-bottom: .5rem;} /* Used on books page */
	h6 {font-size:2.3rem;margin-top: .5rem;margin-bottom: 0.5rem;}
	p {font-size: .8 rem;padding: 0 0 .8rem 0; /* Never Eat Soggy Waffles--North East South West */}

	.author_block{height: 400px;padding: 10px;}
	.author_title {font-size:1rem;padding: 15px 0px 10px 20px;}
	.book_count {text-indent: 30px;font-size:1rem;}
	.book_heading {font-size:.8rem;padding: 0px 0px 0px 0px;}
	.border_line{margin: .9em auto .9em auto;border-width: 3px;}
	.bottombar {height:15px;}
	.buy_indent {text-indent: 30px;}
	.button_jump {font-size: 8px;margin: 1px 1px;padding: 2px;}
	.divider {height: 5px;}
	.font2rem{font-size: .8rem;color: #000000;}
	.footer {font-size: .8rem;padding: 20px;}
	.footer_line {border-width: 4px;}
	.index_block1 {padding: 0 10px 0 10px;font-size: .9rem;}
	.index_block2 {padding: 0 10px 0 10px;font-size: .9rem;}
	.line_dividers {width: 40%;height: 5px; padding: 0px;margin: 20px 0px 20px 0px;}
	.main_body {font-size: .8rem;padding: 0px 20px 0px 20px;}
	.p_author {font-size: .7rem;}
	.special_font{font-size: .9rem;}
	.special_font1{font-size: .9rem}
	.special_font2{font-size: .7rem;}
	.special_font3{font-size: .9rem;}
	.special_font4{font-size: 1.1rem;}
	.special_font5{font-size: 1.2rem;}
	.special_font_read{font-size: .8rem;}
	.topbar {height: 45px;padding: 0px 0px 10px 0px;}
	.toplinks {padding: 20px 0px 20px 0px;font-size: .6rem;}
}


@media only screen and (max-width: 400px) {
[class*="col-"] {width: 100%;font-size: .8rem;}		
img {max-width: 60%;  height: auto;object-fit: scale-down;}
	.p_author {font-size: .6rem;}
	.p_author_smaller {font-size: .5rem;}
	.titler{font-size: .8rem;}
	.titler2{font-size: 1rem;}
	.toplinks {padding: 20px 0px 20px 0px;font-size: .5rem;}
	.button_jump {font-size: 6px;margin: 1px 1px;padding: 1px;}
}

@media only screen and (max-width: 350px) {
[class*="col-"] {width: 100%;font-size: .8rem;}		
img {max-width: 60%;  height: auto;object-fit: scale-down;}
	img.thatimage{ max-width: 30%;height: auto;}
	.toplinks {padding: 20px 0px 20px 0px;font-size: .4rem;}
}

@media only screen and (max-width: 300px) {
[class*="col-"] {width: 100%;font-size: .8rem;}		
img {max-width: 60%;  height: auto;object-fit: scale-down;}
	img.thatimage{ max-width: 30%;height: auto;}
	.toplinks {padding: 20px 0px 20px 0px;font-size: .4rem;}
	.special_font3{font-size: .8rem;}
	.special_font4{font-size: .9rem;}
	.special_font5{font-size: 1rem;}
}
@media only screen and (max-width: 280px) {
[class*="col-"] {width: 100%;font-size: .8rem;}		
img {max-width: 50%;  height: auto;object-fit: scale-down;}
	img.thatimage{ max-width: 30%;height: auto;}
	.toplinks {padding: 20px 0px 20px 0px;font-size: .4rem;}
	.top_title_name{font-size: 18pt;}
}


/* ------------------  Row and Grid settings ----------------- */
.row::after {content: "";clear: both;display: block;padding: 0 1rem 0 1rem;}

/* columns */
.col-per {}		
/* For desktop: */		
.col-1per {width: 1%;}		
.col-2per {width: 2%;}		
.col-3per {width: 3%;}		
.col-4per {width: 4%;}		
.col-5per {width: 5%;}		
.col-6per {width: 6%;}		
.col-7per {width: 7%;}		
.col-8per {width: 8%;}		
.col-9per {width: 9%;}		
.col-10per {width: 10%;}		
.col-11per {width: 11%;}		
.col-12per {width: 12%;}		
.col-13per {width: 13%;}		
.col-14per {width: 14%;}		
.col-15per {width: 15%;}		
.col-16per {width: 16%;}		
.col-17per {width: 17%;}		
.col-18per {width: 18%;}		
.col-19per {width: 19%;}		
.col-20per {width: 20%;}		
.col-21per {width: 21%;}		
.col-22per {width: 22%;}		
.col-23per {width: 23%;}		
.col-24per {width: 24%;}		
.col-25per {width: 25%;}		
.col-26per {width: 26%;}		
.col-27per {width: 27%;}		
.col-28per {width: 28%;}		
.col-29per {width: 29%;}		
.col-30per {width: 30%;}		
.col-31per {width: 31%;}		
.col-32per {width: 32%;}		
.col-33per {width: 33%;}		
.col-34per {width: 34%;}		
.col-35per {width: 35%;}		
.col-36per {width: 36%;}		
.col-37per {width: 37%;}		
.col-38per {width: 38%;}		
.col-39per {width: 39%;}		
.col-40per {width: 40%;}		
.col-41per {width: 41%;}		
.col-42per {width: 42%;}		
.col-43per {width: 43%;}		
.col-44per {width: 44%;}		
.col-45per {width: 45%;}		
.col-46per {width: 46%;}		
.col-47per {width: 47%;}		
.col-48per {width: 48%;}		
.col-49per {width: 49%;}		
.col-50per {width: 50%;}		
.col-55per {width: 55%;}		
.col-60per {width: 60%;}		
.col-61per {width: 61%;}		
.col-62per {width: 62%;}		
.col-63per {width: 63%;}		
.col-64per {width: 64%;}		
.col-65per {width: 65%;}		
.col-66per {width: 66%;}		
.col-67per {width: 67%;}		
.col-68per {width: 68%;}		
.col-69per {width: 69%;}		
.col-70per {width: 70%;}		
.col-71per {width: 71%;}		
.col-72per {width: 72%;}		
.col-73per {width: 73%;}		
.col-75per {width: 75%;}		
.col-79per {width: 79%;}		
.col-80per {width: 80%;}		
.col-83per {width: 83%;}		
.col-84per {width: 84%;}		
.col-85per {width: 85%;}		
.col-86per {width: 86%;}		
.col-88per {width: 88%;}		
.col-89per {width: 89%;}		
.col-90per {width: 90%;}		
.col-95per {width: 95%;}		
.col-98per {width: 98%;}		
.col-99per {width: 99%;}		
.col-100per {width: 100%;}		


/* ------------------  for Accessiblity/Disability ----------------- */
.bypass a {/* position: absolute; */font-size:1.3rem; /* left: -1000px; */color:#000000; /* top: -1000px; */font-weight: 600; /* width: 1px; */margin-top: .5rem; /* height: 1px; */margin-bottom: 1rem; text-align: left;text-decoration: underline; overflow: hidden;}
.bypass a:focus {position: static; width: auto; height: auto;}


/* ------------------  Links ----------------- */
						
a:link, a:visited, a:active {color: #000000; text-decoration: none }						
a:hover {color: #000000; bgColor: #ffffff; text-decoration: none}						
						
a.email:link, a.email:visited, a.email:active {color: #000000; text-decoration: none}						
a.email:hover {color: #ffffff; background: #000000; text-decoration: none}						
						
a.emailu:link, a.emailu:visited, a.emailu:active {color: #000000; text-decoration: underline}						
a.emailu:hover {color: #ffffff; background: #000000; text-decoration: none}						
						
a.email2:link, a.email2:visited, a.email2:active {color: #ffffff; text-decoration: none}						
a.email2:hover {color: #000000; background: #ffffff; text-decoration: none}						
						
a.email2u:link, a.email2u:visited, a.email2u:active {color: #ffffff; text-decoration: underline}						
a.email2u:hover {color: #000000; background: #ffffff; text-decoration: none}						

a.black_and_u:link, a.black_and_u:visited, a.black_and_u:active {color: #89390B; text-decoration: underline;font-style: italic;}
a.black_and_u:hover {color: #000000; background: #ffffff; text-decoration: none;}

a.black_and:link, a.black_and:visited, a.black_and:active {color: #000000; text-decoration: none;}
a.black_and:hover {color: #89390B; background: #ffffff; text-decoration: underline;}

a.bright_red:link, a.bright_red:visited, a.bright_red:active {color: #BF0000; text-decoration: none}						
a.bright_red:hover {color: #ffffff; background: #BF0000; text-decoration: none}						
						
a.bright_redu:link, a.bright_redu:visited, a.bright_redu:active {color: #BF0000; text-decoration: underline}						
a.bright_redu:hover {color: #ffffff; background: #BF0000; text-decoration: underline}						

a.display_redu:link, a.display_redu:visited, a.display_redu:active {color: #FF0000; text-decoration: underline}						
a.display_redu:hover {color: #FFFFFF; background: #FF0000; text-decoration: underline}