
/* for drop cap for future paragraph view */
.paragraphview:first-child:first-letter {float:left; color:#a23021; font-size:420%; line-height:100%; padding:4px 8px 0 3px;font-family: Georgia;}
.app-theme-white .app-footer .app-footer__inner, .app-theme-white .app-header {
    background-image: linear-gradient(90deg,rgb(197 60 0) 70px,rgb(254 197 48) 20%)!important;
}
.bg-warm {
    background-image: linear-gradient(180deg,#f8641a 0,#fec530 99%,#fad0c4 100%)!important;
}
.adsense2 {
    position: relative;
    width: 50vw;
    max-height: 94px;
    background-color: transparent !important;
    display: table; /* for vertical centering */
    top: 0;
    left: 0;
    text-align: center;
    z-index: 1;
}

p.search_margin {
    margin-left: 50px 
	}

.imageatt {
	width:25px; 
	height: auto; 
	text-align:absbottom;
  
}
.shareright {
    margin: 0px 5px 30px 30px;
	text-align: right;
}
.alignCenter {
	float: right;
    margin-bottom: -20px;
}
/* Style arrow left and right - see fade in and out at script.js line 40*/
.bible-nav-button {
    bottom: 150px; /*150px;*/
}
@media screen and (min-width: 30em){
.pa3-m {
    padding: 1rem;
}
}
.bg-white {
    background-color: #fff;
}
.dim, .dim:focus, .dim:hover {
    transition: opacity .15s ease-in;
}
.dim {
    opacity: 1;
}
.pa2 {
    padding: .5rem;
}
.fixed {
    position: fixed;
}
.justify-center {
    justify-content: center;
}
.items-center {
    align-items: center;
}
.flex {
    display: flex;
}
.right-1 {
    right: 1rem;
}
.left-1 {
    left: 0.5rem; /*2rem;*/
}
.br-100 {
    border-radius: 100%;
}
.b--black-20 {
    border-color: rgba(0,0,0,0.2);
	
}
.ba {
    border-style: solid;
    border-width: 1px;
}
[role="button"], a, button {
    cursor: pointer;
}
a {
    background-color: transparent;
    -webkit-text-decoration-skip: objects;
}
/* WProject header */
a.wplink:link {
background: transparent; /*transparent;*/
	color: #FEFEFC;
font-weight: bold;
	font-size:1.3em;
	line-height: 140%;
	margin: 0.2em 0 0;
	text-shadow: 0px 2px 2px rgba(0,0,0,.5);
	}
a.wplink:visited {
background: transparent; /*transparent;*/
	color: #FEFEFC;
font-weight: bold;
	font-size:1.3em;
	line-height: 140%;
	margin: 0.2em 0 0;
	text-shadow: 0px 2px 2px rgba(0,0,0,.5);
	}
a.wplink:hover {
background: transparent; /*transparent;*/
	color: #FEFEFC;
font-weight: bold;
	font-size:1.3em;
	line-height: 140%;
	margin: 0.2em 0 0;
	text-shadow: 0px 2px 2px rgba(0,0,0,.5);
	}

*, :after, :before {
    box-sizing: border-box;
}
.tc {
    text-align: center;
}

.yv-green {
    color: #6ab750;
}
@media screen and (min-width: 30em) {
.f6-m {
    font-size: .875rem;
}
}
.bg-transparent {
    background-color: transparent;
}



/* Style Dropdown Button */
.dropbtn {
  background-color: transparent;/*#ffffff;*/
  color: #AA2023;
   border: none;
  cursor: pointer;
  font-size: 75%;
	padding-top: 0.5em;
	text-transform: none;
	font-style: normal;
	font-weight: bold;
	float: right;
		}

/* The container <div> - needed to position the dropdown content 
.dropdown {
  position: relativex;
  display: inline-blockx;
  float: rightx;
}*/

/* Dropdown Content (Hidden by Default) */	
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #ffffff;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: #AA2023;
  font-size: 75%;
  padding-top: 0.5em;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  font-style: normal;
	font-weight: bold;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #f1f1f1}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
  display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
  background-color: #FFFFFF;
}
.background2{ /*used in votd spanish*/
	background-color:#F3F1EB;
	padding:1em;
	margin-top:1em;
	margin-bottom:1em;
	border-radius:9px; /*adjust*/}
.w3_whatsapp_btn {
    background-image: url('icon.png');
    border: 1px solid rgba(0, 0, 0, 0.1);
    display: inline-block !important;
    position: relative;
    font-family: Arial,sans-serif;
    letter-spacing: .4px;
    cursor: pointer;
    font-weight: 400;
    text-transform: none;
    color: #fff;
    border-radius: 2px;
    background-color: #5cbe4a;
    background-repeat: no-repeat;
    line-height: 1.2;
    text-decoration: none;
    text-align: left;
}

.w3_whatsapp_btn_small {
    font-size: 12px;
    background-size: 16px;
    background-position: 5px 2px;
    padding: 3px 6px 3px 25px;
}

.w3_whatsapp_btn_medium {
    font-size: 16px;
    background-size: 20px;
    background-position: 4px 2px;
    padding: 4px 6px 4px 30px;
}

.w3_whatsapp_btn_large {
    font-size: 16px;
    background-size: 20px;
    background-position: 5px 5px;
    padding: 8px 6px 8px 30px;
    color: #fff;
}
a.whatsapp { color: #fff;}
/*old starts here*/
 a.special {
    color: #0000FF;
    outline: 0;
font-family: 'Raleway', sans-serif;
font-size: 11px;
text-decoration: underline;
}
.chap { 
	padding-left: 3px;
    padding-right: 3px;
	font-size: 100%;
	font-weight: normal;
	display:inline;
	line-height:200%;
	border-radius: 0.2em; /*new 2019*/
	text-shadow: 0 1px 1px #000;
}
.chap2 { 
	background-color: #F98A3F;
	border-bottom: 1px solid #333333;
	border-right: 1px solid #333333;
	border-left: 1px solid #333333;
	border-top: 1px solid #333333;
	border-color: #737373;
	padding-left: 7px;
	padding-right: 7px;
	font-size: 100%;
	font-weight: normal;
	color: #EEFFFF;
	display:inline;
	line-height:200%;
	border-radius: 0.2em;
    display: inline-block;	/*new 2019*/
}
.grey {
	display: inline-block;
	white-space: nowrap;
	background-color: #A6A6A6; /* [disabled] #AA2023; */
	/* [disabled]border: 1px solid #FEFEFC; */
	-webkit-border-radius: 0.2em;
	-moz-border-radius: 0.2em;
	border-radius: 0.2em;
	color: #FEFEFC !important;
	cursor: pointer;
	font-size:.7em;
	margin: 0.1em;
	overflow: visible; /* removes extra side spacing in IE */
	text-decoration: none !important;
	padding-top: .2em;
	padding-right: 0.5em;
	padding-bottom: 0.3em;
	padding-left: 0.5em;
	line-height: 1.2em;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-webkit-box-shadow: 0px 1px 1px rgba(0,0,0,.2);
	-moz-box-shadow: 0px 1px 1px rgba(0,0,0,.2);
	box-shadow: 0px 1px 1px rgba(0,0,0,.2);
	text-transform: uppercase;
	}
.chapread { 
	background-color: #908d7e;/*#AA2023; /*#737373;*/
	border-bottom: 1px solid #333333;
	border-right: 1px solid #333333;
	border-left: 1px solid #333333;
	border-top: 1px solid #333333;
	padding-left: 7px;
	padding-right: 7px;
	font-size: 100%;
	font-weight: normal;
	color: #EEFFFF;
	display:inline;
	line-height:200%;
	border-radius: 0.2em /*new 2019*/
}

a.chap:hover {
  font-size: 100%; color: red; background-color: #F3F1EB; text-decoration: none
}
/* increase decrease button*/
	
	.button2
	{
	display: inline-block;
	white-space: nowrap;
	    background-color: #8e3414; /* [disabled] #AA2023; */
	/* [disabled]border: 1px solid #FEFEFC; */
	-webkit-border-radius: 0.2em;
	-moz-border-radius: 0.2em;
	border-radius: 0.2em;
	color: #FEFEFC !important;
	cursor: pointer;
	font-size:.7em;
	margin: 0.1em;
	overflow: visible; /* removes extra side spacing in IE */
	text-decoration: none !important;
	padding-top: .2em;
	padding-right: 0.5em;
	padding-bottom: 0.3em;
	padding-left: 0.5em;
	line-height: 1.2em;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-webkit-box-shadow: 0px 1px 1px rgba(0,0,0,.2);
	-moz-box-shadow: 0px 1px 1px rgba(0,0,0,.2);
	box-shadow: 0px 1px 1px rgba(0,0,0,.2);
	text-transform: uppercase;
	}
	
.button2:hover {
  background-color: #AA2023;
}
.button2:active {
  background-color: #AA2023;
}
.button2:visited {
  background-color: #AA2023;
}
.social-slide {
	height: 48px;
	width: 48px;
	margin: 0px 0px 0px 10px;
	float: right;
	-webkit-transition: all ease 0.3s;
	-moz-transition: all ease 0.3s;
	-o-transition: all ease 0.3s;
	-ms-transition: all ease 0.3s;
	transition: all ease 0.3s;
}
.social-slide:hover {
	background-position: 0px -48px;
	box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.8);
}
.twitter-hover {
	background-image: url('../img/twitter-hover.png');
}
.facebook-hover {
	background-image: url('../img/facebook-hover.png');
}
.google-hover {
	background-image: url('../img/google-hover.png');
}
.instagram-hover {
	background-image: url('../img/instagram-hover.png');
}
/*.linkedin-hover {
	background-image: url('../img/linkedin-hover.png');
}*/
.youtube-hover {
	background-image: url('../img/youtube-hover.png');
}
.email-hover {
	background-image: url('../img/email-hover.png');
}
.instagram-hover {
	background-image: url('../img/instagram-hover.png');
}
/*this one in use:*/
.social-slide_2 {
	height: 30px;
	width: 30px;
	margin: 0px 0px 0px 10px;
	float: right;
	-webkit-transition: all ease 0.3s;
	-moz-transition: all ease 0.3s;
	-o-transition: all ease 0.3s;
	-ms-transition: all ease 0.3s;
	transition: all ease 0.3s;
}
.social-slide_2:hover {
	background-position: 0px -30px;
	box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.0); /*change to 0,0,0,0.8 for margin*/
}
.twitter-hover_2 {
	background-image: url('../img/twitter-hover_2.png');
}
.facebook-hover_2 {
	background-image: url('../img/facebook-hover_2.png');
}
.google-hover_2 {
	background-image: url('../img/google-hover_2.png');
}
.linkedin-hover_2 {
	background-image: url('../img/linkedin-hover_2.png');
}
.email-hover_2 {
	background-image: url('../img/email-hover_2.png');
}
.instagram-hover_2 {
	background-image: url('../img/instagram-hover_2.png');
}


.logo { font-size:1.8em;
color:#FFF;
}
.background {
	background-color: #F3F1EB;
	padding: 1em;
	margin-top: 1em;
	margin-bottom: 1em;
}
.background2 {
	background-color: #F1EBF3;
	padding: 1em;
	margin-top: 1em;
	margin-bottom: 1em;
}

.quote {
	font-variant: small-caps;
}

.red {
	color: #AA2023;
}
.word {
	color: #AA2023;
}
.centered {
	text-align:center;
}

.large {
	font-size: 1.6em;
}

.bold {
	font-weight:bold
}

.full-width {
	width: 100%;	
}
.text_ind {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: normal;
	font-style: normal;
	}
.text_ind2 {
	font-size: 115%;
	padding-top: 10.5em;
	font-style: oblique;
	color: #000080;
	font-weight: bold;
	/* [disabled]padding-left: 0.8em; */
}
.toccolours{
	border:1px solid #aaa;
	background-color:#f9f9f9;
	padding:5px;font-size:100%
}
div.thumbinner{
	border:1px solid #cccccc;
	padding:3px !important;
	background-color:White;
	font-size:100%;
	text-align:center;
	overflow:hidden}

.textWarning {
	font-size: 70%;
	line-height: 120%;
	vertical-align: auto;
	font-weight: bold;
	margin-top: 1.4em;
}

.textOptions {
	margin-bottom: 0px;
	margin-top: 0px;
}

.textAudio {
	background-color: #FEFEFC;
	/* [disabled]padding-top: 10px; */
}

.textHeader {
	margin-bottom: 15px;
	padding-bottom: 0px;
	line-height: 140%;
	text-align:center;
	/* [disabled]margin-top: 15px; */
}
.textBody p {
	/* [disabled]border-bottom-style: solid; */
	margin-bottom: 0px;
	/* [disabled]padding-bottom: 5px; */
	/* [disabled]border-bottom-color: #E2E2E2; */
	/* [disabled]padding-top: 5px; */
	/* [disabled]border-bottom-width: 1px; */
	line-height: 1.5em !important;
	text-align: justify !important;
}
#redborder {
	color: #ffd99e;
    text-shadow: 0 1px 1px #000;
    text-align: center!important;
    background: rgba(0,0,0,.5);
    border-top: 1px solid #efcf92;
    padding: 5px!important;
    position: relative;
    margin-top: -50px;
    background-image: linear-gradient(to left,#000 0,#ea898c 47%,#000 150%)!important;
    border-bottom: 5px solid rgb(0 0 0);
  
}
#redtop {
  border: 2px;
  border-color:#AA2126;
  padding: 10px;
  border-radius: 25px;
  border-top: 6px solid red;
  background-color: lightgrey;
}
#textBody br {
margin-top: 3px !important;
}

#textBody a {
	color: #000;
}
#textBody a:visited {
	text-decoration: none;
	color: #000;
	background: transparent;
}
#textBody a:hover {
	text-decoration: none;
	color: #000;
	background-color: #F3F1EB;
}
#textBody a:focus {
	text-decoration: none;
	color: #333;
	background: transparent;
}
#textBody a:active {
	text-decoration: none;
	background: transparent;
}
.verse {
	font-weight: bold;
	color: #D2B48C;
	font-size: 80%;
	font-style: italic;
	/* [disabled]vertical-align: super; */
}
.textNav {
	text-align: left;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.textFooter {
	text-align: right;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0px;
	line-height: 200%;
}
.align-right {
	text-align: right;
}

/* font resizer styles */

.fontresize {
margin: 0 0.5em 0 0;
}

.resetFont {
	font-size: 1em;
	line-height:1em;

}
.decreaseFont {
	font-size: 1em;
		line-height:1em;
}

.normalizeFont {
	font-size: 1em;
}

.increaseFont {
	font-size: 1em;
		line-height:1em;
}

#fontResizer {
margin: 0 0 1em 0;
font-size: 100%;
font-weight: bold;	

}

#fontResizer a:link {
	text-decoration: none;
}
#fontResizer a:visited {
	text-decoration: none;
}
#fontResizer a:hover {
	text-decoration: none;
}	

#fontResize, .block-fontResizer {
float: right;
margin: 0;
}
.breadCrumbs {
	font-size: 75%;
	padding-top: 0.5em;
	text-transform: none;
	font-style: normal;
	font-weight: bold;
	/* [disabled]padding-left: 0.8em; */
}

ul.list-bibles {
list-style-image: url('../img/book.png' ); 
/* [disabled nov2017]display: inline; */
padding-left: 2.0em /* [added nov2017]display: inline; */
	}
ul.list-audio {
list-style-image: url('../img/audio-headphones.png' ); 
/* [disabled nov2017]display: inline; */
padding-left: 2.0em /* [added nov2017]display: inline; */

	}
ul.list-verses {
list-style-image: url('../img/openbook.png' );
/* [disabled nov2017]display: inline; */
padding-left: 2.0em /* [added nov2017]display: inline; */
	}
ul.list-multi {
list-style-image: url('../img/multi.png' ); 
/* [disabled nov2017]display: inline; */
padding-left: 2.0em /* [added nov2017]display: inline; */
	}
ul.list-multi-2 {
list-style-image: url('../img/multi-2.png' ); 
/* [disabled nov2017]display: inline; */
padding-left: 2.0em /* [added nov2017]display: inline; */
	}
ul.list-page {
list-style-image: url('../img/page.png' ); 
/* [disabled nov2017]display: inline; */
padding-left: 2.0em /* [added nov2017]display: inline; */
	}
ul.list-download {
list-style-image: url('../img/download.png' ); 
/* [disabled nov2017]display: inline; */
padding-left: 2.0em /* [added nov2017]display: inline; */
	}
ul.list-www {
list-style-image: url('../img/www.png' ); 
/* [disabled nov2017]display: inline; */
padding-left: 2.0em /* [added nov2017]display: inline; */
	}	
blockquote {
    border-left: 4px solid #ccc;
    color: #a5a4a4;
    font-style: italic;
    margin: 30px 0 30px 15px;
    padding-left: 15px;    
}
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides ul {
	margin-top: 10px;
}
.rslides li {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  margin-left: 0px;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: center; /*changed from left*/
  width: 100%;
  border: 0;
  max-width: 800px; /*new*/
  }
 
  .shadegaby{
	list-style-type: none;
	margin: 0;
	padding-top: 5px;
	padding-right: 0;
	padding-bottom: 5px;
	padding-left: 0;
}
 
.shadegaby li{
	padding-top: 0.4em;
	padding-bottom: 0.4em;
	margin-left: 0em;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #EBEBEB;
}
/*Audio*/
.shadegaby2 li{
  border-bottom: 1px dotted #ccc; 
  list-style-image: url('../img/audio-headphones.png' ); 
  font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  /*border-bottom: 3px solid #ccc;*/
}
/*resources*/
.shadegabyR li{
	padding-top: 0.4em;
	padding-bottom: 0.4em;
  border-bottom: 1px dotted #ccc; 
  list-style-image: none; 
  font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  /*border-bottom: 3px solid #ccc;*/
}

.shadegaby3 li{
	border-bottom: 1px dotted #ccc;
 list-style-image: url('../img/openbook.png' ); 
  font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  /*border-bottom: 3px solid #ccc;*/
 }

.shadegaby4 li{
	border-bottom: 1px dotted #ccc;
  list-style-image: url('../img/multi-2.png' ); 
   font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  /*border-bottom: 3px solid #ccc;*/
}

.shadegaby5 li{
	border-bottom: 1px dotted #ccc;
  list-style-image: url('../img/page.png' );
 font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  /*border-bottom: 3px solid #ccc;*/  
}

.shadegaby6 li{
	border-bottom: 1px dotted #ccc;
  list-style-image: url('../img/download.png' );
   font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  /*border-bottom: 3px solid #ccc;*/
}

.shadegaby7 li{
	border-bottom: 1px dotted #ccc;
  list-style-image: url('../img/www.png' );
   font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  /*border-bottom: 3px solid #ccc;*/
}
li:last-child {
  border: none;
}
 
.shadegaby li a{
  text-decoration: none;
  color: #AA2023;
  width: 100px;
}

.shadegaby li a:hover {
  background: #f6f6f6;
}

.nav {
	margin-bottom:0px;margin-left:-.8em;list-style:none
}
	#bib .nav>li>a {
	display:block;
	text-align: center; /* introduced in 2019 cennter bible books */
    background-color: #F5F4F3;
	
}
#bib .nav>li>a:hover{
	background-color: #fc4a1d !important;
    border-color: #ff771e !important;
	box-shadow: 0 0.125rem 0.625rem rgb(254 102 24), 0 0.0625rem 0.125rem rgb(253 106 26) !important;
	color: #fff;
}.nav>.pull-right{float:right}.nav .nav-header{
	display:block;
	padding:3px 15px;
	font-size:11px;
	font-weight:bold;
	line-height:18px;
	color:#333;
	/* [disabled]text-shadow:0 1px 0 rgba(255,255,255,0.5); */
	text-transform:uppercase
}.nav li+.nav-header{margin-top:9px}.nav-list{
	padding-right:15px;
	padding-left:15px;
	margin-bottom:0;
	font-size: 80%;
}.nav-list>li>a,.nav-list .nav-header{
	margin-right:-15px;
	margin-left:-15px;
	/* [disabled]text-shadow:0 1px 0 rgba(255,255,255,0.5); */
}.nav-list>li>a{padding:3px 15px}.nav-list>.active>a,.nav-list>.active>a:hover{
	color:#fff;
	/* [disabled]text-shadow:0 -1px 0 rgba(0,0,0,0.2); */
	background-color:#08c
}.nav-list [class^="icon-"]{margin-right:2px}.nav-list .divider{*width:100%;height:1px;margin:8px 1px;*margin:-5px 0 5px;overflow:hidden;background-color:#e5e5e5;border-bottom:1px solid #fff}.nav-tabs,.nav-pills{*zoom:1}.nav-tabs:before,.nav-pills:before,.nav-tabs:after,.nav-pills:after{display:table;content:""}.nav-tabs:after,.nav-pills:after{clear:both}.nav-tabs>li,.nav-pills>li{float:left}.nav-tabs>li>a,.nav-pills>li>a{
	padding-right:12px;
	padding-left:12px;
	margin-right:2px;
	line-height:14px
}.nav-tabs{border-bottom:1px solid #ddd}.nav-tabs>li{margin-bottom:2px}.nav-tabs>li>a{padding-top:2px;padding-bottom:2px;line-height:18px;border:1px solid transparent;-webkit-border-radius:4px 4px 0 0;-moz-border-radius:4px 4px 0 0;border-radius:4px 4px 0 0}.nav-tabs>li>a:hover{
	border-color: #FEFEFC;
}.nav-tabs>.active>a,.nav-tabs>.active>a:hover{color:#555;cursor:default;background-color:#fff;border:1px solid #ddd;border-bottom-color:transparent}.nav-pills>li>a{padding-top:8px;padding-bottom:8px;margin-top:2px;margin-bottom:2px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}.nav-pills>.active>a,.nav-pills>.active>a:hover{color:#fff;background-color:#08c}
.nav-stacked>li{float:none;margin-top: 10px;}.nav-stacked>li>a{margin-right:0}.nav-tabs.nav-stacked{border-bottom:0}.nav-tabs.nav-stacked>li>a{
	border:2px solid #FEFEFC;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:9px; line-height:140%;
}.nav-tabs.nav-stacked>li>a:hover{
	z-index:2;
	border-color:#FEFEFC
}
.nav-tabs.nav-stacked>li>a {
   box-shadow: 0 0.125rem 0.625rem rgb(121 76 138 / 40%), 0 0.0625rem 0.125rem rgb(121 76 138 / 50%);
    min-width: 190px;
    position: relative;
    transition: color 0.15s, background-color 0.15s, border-color 0.15s, box-shadow 0.15s;
    color: #794c8a;
    border-color: #794c8a;
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-weight: 500;
    display: inline-block;
    text-align: center;
    line-height: 1.5;
    border-radius: .25rem;
}
.nav-tabs.nav-stacked>li>a:hover {
   box-shadow: 0px 5px 15px 2px rgb(121 76 138 / 19%);
   color: #fff;
    background-color: #794c8a;
    border-color: #794c8a;
	text-decoration: none;
}
.shadetabs{
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.shadetabs li{
  font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  border-bottom: 3px solid #ccc;
}
.shadetabsR{
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.shadetabsR li{
	padding-top: 0.4em;
	padding-bottom: 0.4em;
  font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  border-bottom: 1px solid #fff;
}
.shadetabsRS li{
	padding-top: 0.4em;
	padding-bottom: 0.4em;
  font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  border-bottom: 1px solid #fff;
}
.shadetabs2 li{
  font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  border-bottom: 3px solid #ccc;
  list-style-image: url('../img/audio-headphones.png' ); 
}

.shadetabs3 li{
  font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  border-bottom: 1px solid #ccc;
 list-style-image: url('../img/openbook.png' ); 
 }

.shadetabs4 li{
  font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  border-bottom: 1px solid #ccc;
  list-style-image: url('../img/multi-2.png' ); 
}
/*this is for resources:*/
.shadetabs5 li{
  font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  border-bottom: 1px solid #f1f1f1;
  list-style-image: url('../img/page.png' ); 
}

.shadetabs6 li{
  font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  border-bottom: 1px solid #ccc;
  list-style-image: url('../img/download.png' );
}

.shadetabs7 li{
  font: 400 125%/2.0 Helvetica, Arial, Verdana, sans-serif;
  border-bottom: 3px solid #ccc;
  list-style-image: url('../img/www.png' );
}
li:last-child {
  border: none;
}
 
.shadetabs li a{
  text-decoration: none;
  color: #AA2023;
  display: xblock;
  width: 100px;
 
  -webkit-transition: font-size 0.3s ease, background-color 0.3s ease;
  -moz-transition: font-size 0.3s ease, background-color 0.3s ease;
  -o-transition: font-size 0.3s ease, background-color 0.3s ease;
  -ms-transition: font-size 0.3s ease, background-color 0.3s ease;
  transition: font-size 0.3s ease, background-color 0.3s ease;
}
.shadetabs li a:hover {text-decoration:none;background-color:#9D261D;color:#FEFEFC}
.shadetabs2 li a:hover {text-decoration:none;background-color:#9D261D;color:#FEFEFC}
.shadetabs3 li a:hover {text-decoration:none;background-color:#9D261D;color:#FEFEFC}
.shadetabs4 li a:hover {text-decoration:none;background-color:#9D261D;color:#FEFEFC}
.shadetabs5 li a:hover {text-decoration:none;background-color:#9D261D;color:#FEFEFC}
.shadetabs6 li a:hover {text-decoration:none;background-color:#9D261D;color:#FEFEFC}
.shadetabs7 li a:hover {text-decoration:none;background-color:#9D261D;color:#FEFEFC}
/*.shadetabs li a:hover {   
  background: #f6f6f6;
}*/
/*hover{text-decoration:none;background-color:#9D261D;color:#FEFEFC}*/

@media all {

	/**
	* @section CSS-Normalisation Module
	*/

	/* (en) Global reset of paddings and margins for all HTML elements */
	/* (de) Globales Zurücksetzen der Innen- und Außenabstände für alle HTML-Elemente */
	* { margin:0; padding:0; }

	/* (en) Correction:margin/padding reset caused too small select boxes. */
	/* (de) Korrektur:Das Zurücksetzen der Abstände verursacht zu kleine Selectboxen. */
	option { padding-left:0.4em; } /* LTR */
	select { padding:1px; }

	/**
	* (en) Global fix of the Italics bugs in IE 5.x and IE 6
	* (de) Globale Korrektur des Italics Bugs des IE 5.x und IE 6
	*
	* @bugfix
	* @affected   IE 5.x/Win, IE6
	* @css-for    IE 5.x/Win, IE6
	* @valid      yes
	*/

	
	/* (en) avoid visible outlines on DIV containers in Webkit browsers */
	/* (de) Vermeidung sichtbarer Outline-Rahmen in Webkit-Browsern */
	div:target { outline:0 none; }

	/* (en) HTML 5 - adjusting visual formatting model to block level */
	/* (en) HTML 5 - Anpassung des visuellen Formatmodells auf Blockelemente */
	article,aside,details,figcaption,figure,
	footer,header,hgroup,nav,section {
		display:block;
	}

	/* (en) HTML5 - default media element styles */
	/* (de) HTML5 - Standard Eigenschaften für Media-Elemente */
	audio,
	canvas,
	video {
		display: inline-block;
	}

	/* (en) HTML5 - don't show <audio> element if there aren't controls */
	/* (de) HTML5 - <audio> ohne Kontrollelemente sollten nicht angezeigt werden */
	audio:not([controls]) {
		display: none;
	}

	/* (en) HTML5 - add missing styling in IE & old FF for hidden attribute  */
	/* (de) HTML5 - Eigenschaften für das hidden-Attribut in älteren IEs und FF nachrüsten */
	[hidden] {
		display: none;
	}

	/* (en) force consistant appearance of input[type="search"] elements in all browser  */
	/* (de) Einheitliches Erscheinungsbild für input[type="search"] Elemente erzwingen  */
	input[type="search"] {
		-webkit-appearance: textfield;
	}
	input[type="search"]::-webkit-search-decoration {
		-webkit-appearance: none;
	}

	/* (en) Clear borders for <fieldset> and <img> elements */
	/* (de) Rahmen für <fieldset> und <img> Elemente löschen */
	fieldset, img { border:0 solid; }

	/* (en) new standard values for lists, blockquote, cite and tables */
	/* (de) Neue Standardwerte für Listen, Zitate und Tabellen */
	ul, ol, dl { margin:0 0 1em 1em; } /* LTR */
	li {
	line-height:1.5em;
	margin-left:0.8em; /* LTR */
	}

	dt { font-weight:bold; }
	dd { margin:0 0 1em 0.8em; } /* LTR */

	blockquote { margin:0 0 1em 0.8em; } /* LTR */
	q { quotes: none; }

	blockquote:before, blockquote:after,
	q:before, q:after { content: ''; content:none }

	table {
		border-collapse: collapse;
		border-spacing: 0;
	}

 	/**
	* @section Float Handling Module
	*/

	/* (en) clearfix method for clearing floats */
	/* (de) Clearfix-Methode zum Clearen der Float-Umgebungen */
	.clearfix:before {
		content:"";
		display:table;
	}
	.clearfix:after {
		clear:both;
		content:".";
		display:block;
		font-size:0;
		height:0;
		visibility:hidden;
	}

	/* (en) alternative solutions to contain floats */
	/* (de) Alternative Methoden zum Einschließen von Float-Umgebungen */
	.contain-dt { display:table; width: 100%; overflow: visible; }
	.contain-oh { overflow:hidden; width:100%; display:block; }
	.contain-fl { float:left; width:100%; }

	/**
	* @section Accessibility Module
	*
	* (en) skip links and hidden content
	* (de) Skip-Links und versteckte Inhalte
	*/

	/* (en) classes for invisible elements in the base layout */
	/* (de) Klassen für unsichtbare Elemente im Basislayout */
	.skip,
	.hideme,
	.print {
		position:absolute;
		top:-32768px;
		left:-32768px; /* LTR */
	}

	/* (en) make skip links visible when using tab navigation */
	/* (de) Skip-Links für Tab-Navigation sichtbar schalten */
	.skip:focus,
	.skip:active {
		position:static;
		top:0;
		left:0;
	}

	/* skiplinks:technical setup */
	.skiplinks {
		position:absolute;
		top:0px;
		left:-32768px;
		z-index:1000;
		width:100%;
		margin:0;
		padding:0;
		list-style-type:none;
	}

	.skiplinks .skip:focus,
	.skiplinks .skip:active {
		left:32768px;
		outline:0 none;
		position:absolute;
		width:100%;
	}
}

@media screen, projection {

	/**
	* @section Column Module
	*
	* default column config:
	* |-------------------------------|
	* | col1    | col3      | col2    |
	* | 20%     | flexible  | 20%     |
	* |-------------------------------|
	*/

	.column { display:table; width:100%; }

	.col1 { float:left; width:20%; }
	.col2 { float:right; width:20%; }
	.col3 { width:auto; margin:0 20%; }

	.cbox { padding: 0 10px }
	.cbox-left { padding: 0 10px 0 0 }
	.cbox-right { padding: 0 0 0 10px }

	/* (en) IE-Clearing:Only used in Internet Explorer, switched on in iehacks.css */
	/* (de) IE-Clearing:Benötigt nur der Internet Explorer und über iehacks.css zugeschaltet */
	.ie-clearing { display:none; }

	/**
	* @section Grid Module
	*
	*/

	.grid {
		display:table;
		width:100%;
		table-layout:fixed;
		list-style-type: none;
		padding-left:0;
		padding-right:0;
		margin-left:0;
		margin-right:0;
	}
	.wbox.g62 {
		position:absolute;
	}

	.gl { float:left; margin: 0; }
	.gr { float:right; margin: 0 0 0 -5px; }

	.g20 { width:20%; }
	.g40 { width:40%; }
	.g60 { width:60%; }
	.g80 { width:80%; }
	.g25 { width:25%; }
	.g33 { width:33.333%; }
	.g50 { width:100%; }
	.g66 { width:66.666%; }
	.g75 { width:75%; }
	.g38 { width:38.2%; }
	.g62 { width: 100%; }

	.gbox { padding: 0 10px }
	.gbox-left { padding: 0 10px 0 0 }
	.gbox-right { padding: 0 0 0 10px }

	.equalize { overflow:hidden; }

	.equalize > [class*="g"] {
		display:table-cell;
		float:none;
		margin:0;
		vertical-align:top;
	}

	.equalize > [class*="g"] > [class*="gbox"] {
		padding-bottom: 10000px;
		margin-bottom: -10000px
	}
}

@media all {

   /**
	* @section Form Module
	*
	* Vertical-Forms - technical base (standard)
	*
	* |-------------------------------|
	* | form                          |
	* |-------------------------------|
	* |   label                       |
	* |   input / select / textarea   |
	* |-------------------------------|
	* | /form                         |
	* |-------------------------------|
	*
	* (en) Styling of forms where both label and input/select/textarea are styled with display:block;
	* (de) Formulargestaltung, bei der sowohl label als auch input/select/textarea mit display:block; gestaltet werden
	*/

	.form,
	.form fieldset { overflow:hidden; }

	.form div { position:relative; }
	
	.form label,
	.form .message {
		position:relative;
		display:block; /* important for Safari */
	}

	.form .fbox-check label {
		display:inline;
	}

	.form input,
	.form textarea { cursor:text; }

	.form input[type="checkbox"],
	.form input[type="radio"],
	.form select,
	.form label { cursor:pointer; }

	/* small adjustments for Internet Explorer - all versions */
	.form textarea { overflow: auto; }

	/* Hiding of hidden fields (otherwise ugly spaces in Firefox) | Versteckte Felder wirklich verstecken (sonst ggf. häßliche Lücken im Firefox) */
	.form input[type=hidden] { display:none !important; }

	/* styling containing DIV elements | Gestaltung der kapselnden DIV-Elemente */
	.form .fbox-text:before,
	.form .fbox-select:before,
	.form .fbox-check:before,
	.form .fbox-button:before {
		content:"";
		display:table;
	}

	.form .fbox-text:after,
	.form .fbox-select:after,
	.form .fbox-check:after,
	.form .fbox-button:after {
		clear:both;
		content:".";
		display:block;
		font-size:0;
		height:0;
		visibility:hidden;
	}

	/* styling standard form elements with 'almost' equal flexible width | Gestaltung der einzelnen Formularelemente mit annähend gleicher Breite */
	.form select,
	.form input,
	.form textarea {
	display:block;
	position:relative;
	/* [disabled]width:58.5%; */
	}

	.form .fbox-check input {
		display: inline;
		width: auto;
	}

	/* Styling of buttons | Gestaltung von Buttons */
	.form .fbox-button input {
		display: inline;
		overflow:visible;  /* Fixes IE7 auto-padding bug */
		width:auto;
	}

	/* avoid jumping checkboxes & radiobuttons in IE8 */
	.form .fbox-check input:focus,
	.form .fbox-check input:hover,
	.form .fbox-check input:active {
		border:0 none;
	}

	/* Indent Checkbox fields to match label-width | Checkboxen um den gleichen Wert einrücken, wie die Breite der labels */

	.full .fbox-select select,
	.full .fbox-text input,
	.full .fbox-text textarea {
		width:94.2%;
		margin-right: -3px;
	}
	

   /**
	* Columnar forms display - technical base (optional)
	*
	* |-------------------------------------------|
	* | form                                      |
	* |-------------------------------------------|
	* |                                           |
	* |   label   |   input / select / textarea   |
	* |                                           |
	* |-------------------------------------------|
	* | /form                                     |
	* |-------------------------------------------|
	*
	* (en) Styling of forms where label floats left of form-elements
	* (de) Formulargestaltung, bei der die label-Elemente nach links fließen
	*/

	/* Columnar display | Spalten-Darstellung */
	.columnar .fbox-text label,
	.columnar .fbox-select label {
		display:inline;
		float:left;
		width:30%; /* Can be fixed width too | Kann auch eine fixe Angabe sein */
	}
	.columnar .fbox-check {
		position:relative;
	}

	.label { display:block; }
	.columnar .fbox-check .label {
		position:absolute;
		top:0;
	}

	/* Indent Checkbox fields to match label-width | Checkboxen um den gleichen Wert einrücken, wie die Breite der labels */
	.columnar .fbox-check input,
	.columnar .error .message {
		margin-left:30%;
	}

	/* global and local columnar settings for button alignment */
	.columnar fieldset .fbox-button,
	fieldset.columnar .fbox-button {
		padding-left:30%;
	}

	.columnar .fbox-select select,
	.columnar .fbox-text input,
	.columnar .fbox-text textarea {
		float:left;
		width:67.2%;
		margin-right: -3px;
	}

	/**
	* @section Form Construction Kit | Screen Adjustments
	*
	*/

	.fbox-select select { width:60%; }
	.full .fbox-select select { width:94.8%; }
	.columnar .fbox-select select { width:68.8%; }
}

@media print {

	/**
	* @section print adjustments for core modules
	*
	* (en) float clearing for subtemplates. Uses display:table to avoid bugs in FF & IE
	* (de) Float Clearing für die Subtemplates. Verwendet display:table, um Darstellungsprobleme im FF & IE zu vermeiden
	*
	* @bugfix
	* @since     3.0
	* @affected  FF2.0, FF3.0, IE7
	* @css-for   all browsers
	* @valid     yes
	*/

	.grid > .gl,
	.grid > .gr {
		overflow:visible;
		display:table;
	}

	/* (en) make .print class visible */
	/* (de) .print-Klasse sichtbar schalten */
	.print {
		position:static;
		left:0;
	}

	/* (en) generic class to hide elements for print */
	/* (de) Allgemeine CSS Klasse, um beliebige Elemente in der Druckausgabe auszublenden */
	.noprint {
		display:none !important;
	}
}


@media screen {

	.stuck {
	position:fixed;
	top:0;
	max-width: 60em;
	clear: both;
	width: 912px;
  }

	
	/* Layout Module Configuration */
	.wrapper {
	max-width: 100em;
	margin: 0 auto;
	box-shadow: 0 0.66875rem 2.3875rem rgb(4 9 20 / 3%), 0 1.1375rem 1.60625rem rgb(4 9 20 / 3%), 0 0.45rem 0.73125rem rgb(4 9 20 / 5%), 0 0.325rem 0.3875rem rgb(4 9 20 / 3%);
    background-image: linear-gradient(to top,#ffffff 0,#ffffff 100%);
	padding: 10px;
		}

	.wbox {
	padding-top: 0.5em;
	padding-right: 1.5em;
	padding-bottom: 1em;
	padding-left: 0.5em;
	}



	/* Basic Element Styling */
	header {
	background: #908d7e; /*#535151; /*#AA2023; /*#AA2023; - wpbck_red*/
	color: #cccc;
    border-bottom:solid 3px #AA2023;
	border-bottom-right-radius: 3px 3px;
	border-bottom-left-radius: 3px 3px;
	/*border-top:solid 3px #AA2023;
	border-top-right-radius: 5px 20px;
	border-top-left-radius: 5px 20px;*/
	}

	header h1 {
	background: transparent; /*transparent;*/
	color: #FEFEFC; /*#FEFEFC; - wp white*/
	font-weight: normal; /*normal*/
	}
	
	#main .info {
		margin-bottom: 1.5em;
	}

	footer {
	color: #444;
	font-size: 80%;
	background-color: #FFFFFF;/*#F3F1EB;*/
	}

	footer p {
	margin: 0;
	font-size: 70%;
	}

	header .wbox,
	footer .wbox {
	padding-top: 0.8em;
	padding-right: 1.5em;
	padding-bottom: 0.5em;
	padding-left: 1.5em;
	}

	.gbox { padding: 0 1.5em; }
	.gbox-left { padding: 0 1.5em 0 0; }
	.gbox-right { padding: 0 0 0 1.5em; }

	section.box { padding: 0 1.5em 1.5em 1.5em; }

	#main aside .gbox-right {
	/* [disabled]border-left: 1px #ddd solid; */
	background-color: #f4f4f4;
	}

	/* skip links styling */
	.skiplinks a.skip:focus,
	.skiplinks a.skip:active {
		color:#FEFEFC;
		background:#333;
		border-bottom:1px #000 solid;
		padding:10px 0;
		text-align: center;
		text-decoration:none;
	}
}


@media screen and ( max-width: 980px ) {
	.stuck {
	position:fixed;
	top:0;
	left:0;
	max-width: 60em;
	clear: both;
	width: 100%;
  }
	header .wbox {
		padding: 1em 1.5em;
	}
	
	header h1 {
		font-size: 1.4em;
		line-height: .85em;
		margin: 0;
	}
	
	.secondary {
		border-top: 1px #888 solid;
		margin-top: 1.5em !important;
	}

	#main aside .gbox-right {
		border: 0 none;
	}

	/* Linearisation for Grid- and Column-Module, based on CSS class .linearize-level-1 */
	.linearize-level-1,
	.linearize-level-1 > [class*="g"],
	.linearize-level-1 > [class*="col"] {
		display: block;
		float: none;
		padding: 0;
		margin: 0;
		width: 100% !important;
	}

	.linearize-level-1 > [class*="g"] > [class*="gbox"],
	.linearize-level-1 > [class*="col"] > [class*="cbox"] {
		overflow: hidden; /* optional for containing floats */
		padding: 0;
		margin: 0;
	}

	.searchform {
		display:block;
		float: none;
		width: auto;
		padding-right: 10px;
		text-align: right;
	}

	.searchform input[type="search"] {
		width: 10%;
	}
}

@media screen and ( max-width: 550px) {

	header .wbox {
		padding: 1em 10px;
	}

	footer .wbox,
	.wbox,
	.searchform,
	nav .hlist ul {
		padding-left: 10px;
		padding-right: 10px;
	}

	header h1 {
		font-size: 1.4em;
		line-height: .85em;
		margin: 0;
	}

	/* Linearisation for Grid- and Column-Module, based on CSS class .linearize-level-2 */
	.linearize-level-2,
	.linearize-level-2 > [class*="g"],
	.linearize-level-2 > [class*="col"] {
		display: block;
		float: none;
		padding: 0;
		margin: 0;
		width: 100% !important;
	}

	.linearize-level-2 > [class*="g"] > [class*="gbox"],
	.linearize-level-2 > [class*="col"] > [class*="cbox"] {
		overflow: hidden; /* optional for containing floats */
		padding: 0;
		margin: 0;
	}

	.searchform,
	nav .hlist ul,
	nav .hlist li {
		display:block;
		float: none;
		width: auto;
		text-align: left;
	}

	.searchform input[type="search"] {
		width: 71%;
	}
}
h3 {
    color: #A6A6A6;
    text-shadow: 1px 1px 2px #777;
    text-transform: uppercase;
    font-weight: normal;
    font-size: 1.0em;
    line-height: 140%;
    margin-left: 13px;
}
h3, h4, h5, h6, h1 {
    font-size: 1.2em;
    font-weight: bold;
    line-height: 100%;
    text-shadow: 0 1px 2px rgb(0 0 0 / 50%);
    margin: 0.2em 0 0;
    line-height: 140%;
    text-transform: uppercase;
}
h1 {
	color: #c13f20;
}

body {
	width: auto;
  height: 90vh;

  overflow-y: scroll; 
  -webkit-overflow-scrolling: touch;
}

 .grid img {
	height: 50px !important;
    width: auto !important;
    float: left;
	position: absolute;
}
.app-theme-white .app-page-title {
    background-image: url(../../assets/images/cross-banner.jpg) !important;
    background-position: center !important;
    background-size: cover !important;
	margin: 0 !important;
}
.main-card {
    height: auto !important;
    margin-bottom: 10px!important;
    box-shadow: inset 1px 2px 25px 10px rgb(0 0 0 / 75%)!important;
    background-image: url(../../assets/images/shelf/bg.jpg);
    background-size: cover;
	background-attachment: fixed;
}
.card-body {
    background-color: #ffffffd4;
}

  ::-webkit-scrollbar {
    width: 10px;
}
  ::-webkit-scrollbar-track {
    background-color: darkgrey;
}
  ::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}

.adsense2 {
    display: none;
}