
* {
  box-sizing: border-box;
} 

div {display: block; fill:none;} 

img {
max-width:100%;
height:auto;
}

div {margin:0;padding:0;}

html {
font-size: 100%;
margin: 0 0;
padding: 0 0;
}

body {
overflow-x:hidden;
background-image: url("images/zentaoBG2014_s.png");
background-repeat: repeat-x;
background-color: #000;
background-attachment: fixed;
width: 100%;
height: 100%;
margin: 0 0;
padding: 0 0;
font-family: Arial,Tahoma,sans-serif;
color: #c9a86d; /* #c78f29; #CEA424;  #bf7b2d;*/
word-break: normal;
overflow-wrap: break-word;
line-height: 170%;
font-weight: 100;
text-align:justify;
}

/* -------------------------------------------------------------------------------------------------------------- */

/* TEXT */

.fas-external-link {
color:#fff;
content: '\f011';
}
.fas-fa-bars {
color:#fff;
content: '\f0c9';
}

p {
font-size: 1.1rem;
text-align: justify;
}

ol {
font-size: 1.1rem;
text-align: justify;
}

ul {
font-size: 1.1rem;
text-align: justify;
}

blockquote {
font-size: 1.1rem;
text-align: justify;
}


p.light, ol.dark, ul.dark, blockquote.dark {
font-size: 1.1rem;
color: #ccc;
text-align: justify;
}

p.dark ol.dark, ul.dark, blockquote.dark {
font-size: 1.1rem;
color: #000;
text-align: justify;
}

p.little ol.little, ul.little, blockquote.little {
font-size: .8rem;
text-align: justify;
}

p.smlight ol.smlight, ul.smlight, blockquote.smlight {
font-size: .8rem;
color: #a9b0b1;
text-align: justify;
}

p.smdark, ol.smdark, ul.smdark, blockquote.smdark {
font-size: .8rem;
color: #566365;
}

li {
padding-bottom: 1.2rem;
line-height: 160%;
}

h1 {
color: #c9a86d;
font-stretch: 50%;
font-weight:400;
} 

h2, h3, h4, h5, h6 {
color: #c9a86d;
font-stretch: 80%;
font-weight:400;
} 

h1 {font-size:2.4rem;font-weight:100;line-height:2.8rem;}
h2 {font-size:2rem;font-weight:100;line-height:2.4rem;}
h3 {font-size:1.8rem;font-weight:100;line-height:2.2rem;}
h4 {font-size:1.6rem;font-weight:bold;line-height:2rem;}
h5 {font-size:1.4rem;font-weight:bold;line-height:1.8rem;}
h6 {font-size:1.2rem;font-weight:bold;line-height:1.6rem;}

.noscript li {
display: inline;
float: right;
margin: 1rem 2rem 0 2rem;
}


/* -------------------------------------------------------------------------------------------------------------- */

/* LINKS */

a {color:#CEA424;}
a:visited {color:#CEA424;}

a.dark {color:#1e7481;} /*85bcad 0e5f4e  1e7481*/  /* for light bgs */
a.dark:active {color:#666;}
a.darkt:hover {color:#000;}
a.name {padding-top: 150px;}*/

/* -------------------------------------------------------------------------------------------------------------- */

/* LAYOUT DIVS */

/* pageContainer1 */

@media screen and (min-width: 901px) {

#pageContainer1 {
margin: 0 auto 0 auto;
padding: 100px 0;
width: 67%;
max-width:1240px;
/*background-color: transparent;*/
background-color: rgb (0, 0, 0);
background-color: rgba(0, 0, 0, 0.6);
}
}

@media screen and (max-width: 900px) {
#pageContainer1 {
margin: 0 auto;
padding: 1% 2%;
width: 94%;
max-width:94%;
/*background-color: transparent;*/
background-color: rgb (0, 0, 0);
background-color: rgba(0, 0, 0, 0.6);

}
}

/* ------------ */

.slider-wrapper {z-index:-1!important;}

#header {
z-index:5;
box-sizing: border-box;
display:inline-block;
position:fixed;
top:0;
/* position: -webkit-sticky; */ /* Safari */
/* position:sticky; */
top:0;
width:100%;
margin:0 0 0 0;
padding: 0 1rem;
background-color: #000;
}

#logo {
margin:0 0 0 0;
padding:0 0 0 0;
width: 100%;
/*background-color: rgba(0, 0, 0, 0.6);*/
}

#topslider {
background-color:#000;
width:100%;
max-width:1240px;
height:auto;
margin: 0 auto;
padding: 0 0;
}

.carousal {
display:block;
margin: 0 auto;
padding: 0 0;
width:100%;
height:auto;
max-width:1240px;
max-height:300px;
}

/* pageContainer2 BEGINS ------ */

@media screen and (min-width: 901px) {
#pageContainer2 {
background-color: rgba(0, 0, 0, 0.6);
margin: 0 auto 0 auto !important; /* margin: -10px auto 0 auto; */
padding: 0 0;
width: 100%;
max-width:1240px;
}
}

@media screen and (max-width: 900px) {
#pageContainer2 {
background-color: rgba(0, 0, 0, 0.6);
margin: 0 auto 0 auto !important; /* margin: -10px auto 0 auto; */
padding: 1% 2%;
width: 100%;
max-width:100%;
}
}

@media screen and (max-width: 1920px) {
#main {
background-color: rgba(0, 0, 0, .8);
width:75%;
margin: 1% auto 6% auto;
padding: 4% 5%;
border: none;
}
}

@media screen and (max-width: 1280px) {
#main {
background-color: rgba(0, 0, 0, .8);
width:75%;
margin:  1% auto 6% auto;
padding: 3% 5%;
border: none;
}
}

@media screen and (max-width: 900px) {
#main {
background-color: rgba(0, 0, 0, .8);
width:100%;
margin:  1% auto 6% auto;
padding: 2% 3%;
border: none;
}
}



#page-title {
width:100%;
background-color: #f3f5f5; /*#c8dad4;*/
margin: 0 auto !important;
padding: 1%;
text-align:center;
width:100%;
border-top: 1px solid #dbe4e5;
border-bottom: 1px solid #dbe4e5;
}

#page-title h1 {font-weight: lighter;line-height:2.4rem;}

/*#main {
display:inline-block;
width:98%;
margin: 1% 1%;
padding: 1% 1%;
border: 1px solid #ccc;
}*/

#footer {
background-color: rgba(0, 0, 0, 0.9);
position:sticky;
bottom:0px;
/* left:0px; */
width:100%;
margin: 0 0 !important;
padding: 0.2% 1% 0.2% 1%;
border-top: 1px solid #333;
}

#subfooter {
/*display:inline-block;*/
width:100%;
margin: 0 0 0 0 !important;
padding: 1% 1%;
background-color: rgba(0, 0, 0, 0.6);
}

#sidebar {
float:right;
/*display:inline-block;*/
width:400px;
margin: 0 0;
padding: 1% 1%;
}


.slider {
margin: 0 auto;
width: 100%;
max-width: 333px;
height: auto;
max-height: 500px;
}

@media screen and (min-width: 901px) {
.article1 {
  column-count: 2;
  column-gap: 2rem;
}
}


@media screen and (min-width: 901px) {
.section1 {
display:inline-block;
margin:0 0;
padding:1rem 1rem;
width: 100%;
}
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 900px) {
.section1 {
width: 100%;
margin:0 0;
padding:1rem 1rem;
}
}


@media screen and (min-width: 901px) {
.section2 {
display:inline-block;
margin:0 0;
padding:1rem 1rem;
width: 100%;
}
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 900px) {
.section2 {
width: 100%;
margin:0 0;
padding:1rem 1rem;
}
}



@media screen and (max-width: 900px) {
.article1 {
  column-count: 1;
}
}

@media screen and (min-width: 901px) {
#article {
display:inline-block;
float:left;
margin:0 0;
padding:1rem 1rem;
width: 50%;
}
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 900px) {
#article {
/*background-color:red;*/
width: 100%;
margin:0 0;
padding:1rem 1rem;
  }
}

@media screen and (min-width: 901px) {
#section {
display:inline-block;
float:left;
margin:0 0;
padding:1rem 1rem;
width: 50%;
}
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 900px) {
#section {
width: 100%;
margin:0 0;
padding:1rem 1rem;
}
}


#aside {
display:inline-block;
float:left;
margin:0 0;
padding:1rem 1rem;
width: 25%;
}


/* -------------------------------------------------------------------------------------------------------------- */

/* TOPNAV RESPONSIVE */

/*.topnav {
  display: inline;
  overflow: hidden;
  background-color: #fff;
}*/



@media screen and (min-width: 901px) {
.topnav {
float:left;
overflow: hidden;
background-color: transparent;
width: 100%;
margin:0 0 0 0; /* margin-top: 0; */
text-align: right;
}
}

@media screen and (max-width: 900px) {
.topnav {
float:left;
overflow: hidden;
background-color: transparent;
width: 100%;
margin:0 0; /* margin-top: 0; */
text-align: right;
}
}

.topnav a {
float: left;
display: inline-block;
color: #CEA424;
text-align: right;
padding: 2rem 1rem 1rem 1rem;
text-decoration: none;
font-size: 1.2rem;
}

/* .topnav a:hover {
  color: #99210c;
}

.active {
  color: #ccc;
}
*/

.topnav .icon {
  display: none;
}

@media screen and (max-width: 900px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 900px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}


@media screen and (min-width: 901px) {
.site-info {
float:left;
width: 50%;
padding:0;
margin:0;
}
}

@media screen and (max-width: 900px) {
.site-info {
float:none;
width: 100%;
padding:0;
margin:0;
}
}

/* -------------------------------------------------------------------------------------------------------------- */

/* FOOTNAV RESPONSIVE */

/*.topnav {
  display: inline;
  overflow: hidden;
  background-color: #fff;
}*/

@media screen and (max-width: 900px) {
.footnav {
float:right;
overflow: hidden;
background-color: transparent;
width: 100%;
padding-bottom: 0;
margin-bottom: 0;
margin-top: 1rem;
text-align: right;
}
}
@media screen and (min-width: 901px) {
.footnav {
float:right;
overflow: hidden;
background-color: transparent;
width: 50%;
padding-bottom: 0;
margin-top: 1rem;
margin-bottom: 0;
text-align: right;
}
}
.footnav a {
  float: right;
  display: inline-block;
  color: #1e73be;
  text-align: center;
margin:0;
  padding: 0 1.1rem 0 1.1rem;
  text-decoration: none;
  font-size: .8rem;
}

.footnav a:hover {
  color: #fff;
}

.active {
  color: #fff;
}

.footnav .icon {
  display: none;
}

@media screen and (max-width: 900px) {
  .footnav a:not(:first-child) {display: none;}
  .footnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 900px) {
  .footnav.responsive {position: relative;}
  .footnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .footnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}

/* -------------------------------------------------------------------------------------------------------------- */

.logo {min-width:100px;height:auto;} /* width:235px;height:100px;max-width:235px;max-height:100px; */

.site-title {font-variant:small-caps;font-size:3rem;padding-top:2rem;}
}


.row {
display:grid;}

.video-container {
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;
}

.video-container iframe, .video-container object, .video-container embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

/* -------------------------------------------------------------------------------------------------------------- */

/* AUTOMATED SLIDESHOW */

.mySlides {display: none;}
img.sldshw {vertical-align: middle;}

/* Slideshow container */
.slideshow-container {
  max-width: 1200px;
  position: relative;
  margin: auto;
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .text {font-size: 11px}
}


/* ACCORDIAN -------------------------------------------------------------------------------------------------------------- */

.accordion {
  background-color: #111;
  color: #ccc;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: justify;
  outline: none;
  font-size: 1.1rem;
  transition: 0.4s;
}

.active, .accordion:hover {
  background-color: #333;
}

.panel {
  padding: 0 18px;
  background-color: #000;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.accordion:after {
  content: '\02795'; /* Unicode character for "plus" sign (+) */
  font-size: 13px;
  color: #777;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2796"; /* Unicode character for "minus" sign (-) */
}

/* ZOOM ------------------------------------------------------------------------------------------------- */

@media screen and (min-width: 901px) {
img.zoom {
background: #fff;
margin: 0 auto;
padding:1rem 1rem;
border:1px solid #ccc;
transition: transform .2s; /* Animation */
}
}

@media screen and (max-width: 900px) {
img.zoom {
background: #fff;
text-align: center;
margin: 0 auto;
padding:1rem 1rem;
border:1px solid #ccc;
transition: transform .2s; /* Animation */
}
}

@media screen and (min-width: 901px) {
img.zoom:hover {
background: #fff;
  -ms-transform: scale(2); /* IE 9 */
  -webkit-transform: scale(2); /* Safari */
  transform: scale(2);
margin-left: 3rem;
margin-right: 3rem;
}
}

@media screen and (max-width: 900px) {
img.zoom:hover {
background: #fff;
text-align: center;
margin: 0 auto;
  -ms-transform: scale(1); /* IE 9 */
  -webkit-transform: scale(1); /* Safari */
  transform: scale(1);
}
}

/* -------------------------------------------------------------------------------------------------------------- */

/* CLASSES ONE-HALF, ONE-THIRD, ONE-FOURTH, ONE-FIFTH, TWO-THIRDS, THREE-FOURTHS, TWO-FIFTHS, THREE-FIFTHS, FOUR-FIFTHS */

/* ONE-HALF */

@media screen and (min-width: 901px) {
.one-half {
display:inline-block;
fill:none;
background-color:transparent;
float:left;
margin:0 0;
padding:1rem 3rem;
width: 50%;
}
}

@media screen and (max-width: 900px) {
.one-half {
width: 100%;
margin:0 0;
padding:1rem 3rem;
  }
}

/* ONE-THIRD */

@media screen and (min-width: 901px) {
.one-third {
display:inline-block;
float:left;
margin:0 0;
padding:1rem 3rem;
width: 33.33%;
}
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 900px) {
.one-third {
/*background-color:red;*/
width: 100%;
margin:0 0;
padding:1rem 3rem;
  }
}

/* ONE-FOURTH */

@media screen and (min-width: 901px) {
.one-fourth {
display:inline-block;
float:left;
margin:0 0;
padding:1rem 3rem;
width: 25%;
}
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 900px) {
.one-fourth {
/*background-color:red;*/
width: 100%;
margin:0 0;
padding:1rem 3rem;
  }
}

/* ONE-FIFTH */

@media screen and (min-width: 901px) {
.one-fifth {
display:inline-block;
float:left;
margin:0 0;
padding:1rem 3rem;
width: 20%;
}
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 900px) {
.one-fifth {
/*background-color:red;*/
width: 100%;
margin:0 0;
padding:1rem 3rem;
  }
}

/* TWO-THIRDS */

@media screen and (min-width: 901px) {
.two-thirds {
display:inline-block;
float:left;
margin:0 0;
padding:1rem 3rem;
width: 66.67%;
}
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 900px) {
.two-thirds {
/*background-color:red;*/
width: 100%;
margin:0 0;
padding:1rem 3rem;
  }
}

/* THREE-FOURTHS */

@media screen and (min-width: 901px) {
.three-fourths {
display:inline-block;
float:left;
margin:0 0;
padding:1rem 3rem;
width: 75%;
}
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 900px) {
.three-fourths {
/*background-color:red;*/
width: 100%;
margin:0 0;
padding:1rem 3rem;
  }
}

/* TWO-FIFTHS */

@media screen and (min-width: 901px) {
.two-fifths {
display:inline-block;
float:left;
margin:0 0;
padding:1rem 3rem;
width: 40%;
}
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 900px) {
.two-fifths {
/*background-color:red;*/
width: 100%;
margin:0 0;
padding:1rem 3rem;
  }
}

/* THREE-FIFTHS */

@media screen and (min-width: 901px) {
.three-fifths {
display:inline-block;
float:left;
margin:0 0;
padding:1rem 3rem;
width: 60%;
}
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 900px) {
.three-fifths {
/*background-color:red;*/
width: 100%;
margin:0 0;
padding:1rem 3rem;
  }
}

/* FOUR-FIFTHS */

@media screen and (min-width: 901px) {
.four-fifths {
display:inline-block;
float:left;
margin:0 0;
padding:1rem 3rem;
width: 80%;
}
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 900px) {
.four-fifths {
/*background-color:red;*/
width: 100%;
margin:0 0;
padding:1rem 3rem;
  }
}


/* -------------------------------------------------------------------------------------------------------------- */

/* MAXBUTTON */

.maxbutton-2.maxbutton.maxbutton-gathering-purchase-button {
    position: relative !important;
    text-decoration: none !important;
    display: inline-block !important;
    vertical-align: middle !important;
    border-color: #000 !important;
    width: 260px !important;
    height: 30px !important;
    border-top-left-radius: 4px !important;
    border-top-right-radius: 4px !important;
    border-bottom-left-radius: 4px !important;
    border-bottom-right-radius: 4px !important;
    border-style: solid !important;
    border-width: 2px !important;
    background: rgba(30, 115, 190, 1) !important;
    -pie-background: linear-gradient(rgba(30, 115, 190, 1) 45%, rgba(122, 159, 191, 1)) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(45%, rgba(30, 115, 190, 1)), color-stop(1, rgba(122, 159, 191, 1))) !important;
    background: -moz-linear-gradient(rgba(30, 115, 190, 1) 45%, rgba(122, 159, 191, 1)) !important;
    background: -o-linear-gradient(rgba(30, 115, 190, 1) 45%, rgba(122, 159, 191, 1)) !important;
    background: linear-gradient(rgba(30, 115, 190, 1) 45%, rgba(122, 159, 191, 1)) !important;
    -webkit-box-shadow: 0px 0px 2px 0px #fff !important;
    -moz-box-shadow: 0px 0px 2px 0px #fff !important;
    box-shadow: 0px 0px 2px 0px #fff !important;
}


.maxbutton-2.maxbutton.maxbutton-gathering-purchase-button:hover {
    border-color: #0a0a0a !important;
    background: rgba(255, 255, 255, 1) !important;
    -pie-background: linear-gradient(rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1)) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(45%, rgba(255, 255, 255, 1)), color-stop(1, rgba(255, 255, 255, 1))) !important;
    background: -moz-linear-gradient(rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1)) !important;
    background: -o-linear-gradient(rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1)) !important;
    background: linear-gradient(rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1)) !important;
    -webkit-box-shadow: 0px 0px 2px 0px #fff !important;
    -moz-box-shadow: 0px 0px 2px 0px #fff !important;
    box-shadow: 0px 0px 2px 0px #fff !important;
}

.maxbutton-2.maxbutton.maxbutton-gathering-purchase-button:hover .mb-text {
    color: #1e73be !important;
}

.maxbutton-2.maxbutton.maxbutton-gathering-purchase-button .mb-text {
    color: #fff !important;
    font-family: Tahoma !important;
    font-size: 15px !important;
    text-align: center !important;
    font-style: normal !important;
    font-weight: normal !important;
    padding-top: 8px !important;
    padding-right: 0px !important;
    padding-bottom: 0px !important;
    padding-left: 0px !important;
    line-height: 1em !important;
    box-sizing: border-box !important;
    display: block !important;
    background-color: unset !important;
}

.maxbutton-1.maxbutton.maxbutton-buy-button {
    /*position: relative !important;*/
    text-decoration: none !important;
    display: inline-block !important;
    vertical-align: middle !important;
    border-color: #4c1900 !important;
    width: 80px !important;
    height: 38px !important;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
    border-style: solid !important;
    border-width: 1px !important;
    background: rgba(201, 94, 40, 1) !important;
    -pie-background: linear-gradient(rgba(201, 94, 40, 1) 45%, rgba(10, 10, 10, 1)) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(45%, rgba(201, 94, 40, 1)), color-stop(1, rgba(10, 10, 10, 1))) !important;
    background: -moz-linear-gradient(rgba(201, 94, 40, 1) 45%, rgba(10, 10, 10, 1)) !important;
    background: -o-linear-gradient(rgba(201, 94, 40, 1) 45%, rgba(10, 10, 10, 1)) !important;
    background: linear-gradient(rgba(201, 94, 40, 1) 45%, rgba(10, 10, 10, 1)) !important;
    -webkit-box-shadow: 0px 0px 2px 0px #333 !important;
    -moz-box-shadow: 0px 0px 2px 0px #333 !important;
    box-shadow: 0px 0px 2px 0px #333 !important;
}

.maxbutton-2.maxbutton.maxbutton-series-buy-button {
    /*position: relative !important;*/
    text-decoration: none !important;
    display: inline-block !important;
    vertical-align: middle !important;
    border-color: #4c1900 !important;
    width: 120px !important;
    height: 50px !important;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
    border-style: solid !important;
    border-width: 1px !important;
    background: rgba(201, 94, 40, 1) !important;
    -pie-background: linear-gradient(rgba(201, 94, 40, 1) 45%, rgba(10, 10, 10, 1)) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(45%, rgba(201, 94, 40, 1)), color-stop(1, rgba(10, 10, 10, 1))) !important;
    background: -moz-linear-gradient(rgba(201, 94, 40, 1) 45%, rgba(10, 10, 10, 1)) !important;
    background: -o-linear-gradient(rgba(201, 94, 40, 1) 45%, rgba(10, 10, 10, 1)) !important;
    background: linear-gradient(rgba(201, 94, 40, 1) 45%, rgba(10, 10, 10, 1)) !important;
    -webkit-box-shadow: 0px 0px 2px 0px #333 !important;
    -moz-box-shadow: 0px 0px 2px 0px #333 !important;
    box-shadow: 0px 0px 2px 0px #333 !important;
}

.maxbutton-1.maxbutton.maxbutton-buy-button .mb-text {
    color: #e2e2e2 !important;
    font-family: Tahoma !important;
    font-size: 15px !important;
    text-align: center !important;
    font-style: normal !important;
    font-weight: bold !important;
    padding-top: 12px !important;
    padding-right: 0px !important;
    padding-bottom: 0px !important;
    padding-left: 0px !important;
    line-height: 1em !important;
    box-sizing: border-box !important;
    display: block !important;
    background-color: unset !important;
}


.maxbutton-2.maxbutton.maxbutton-series-buy-button .mb-text {
    color: #e2e2e2 !important;
    font-family: Tahoma !important;
    font-size: 15px !important;
    text-align: center !important;
    font-style: normal !important;
    font-weight: bold !important;
    padding-top: 11px !important;
    padding-right: 0px !important;
    padding-bottom: 0px !important;
    padding-left: 0px !important;
    line-height: 1em !important;
    box-sizing: border-box !important;
    display: block !important;
    background-color: unset !important;
}

.maxbutton-1.maxbutton.maxbutton-buy-button:hover {
    border-color: #6b1100 !important;
    background: rgba(201, 67, 0, 1) !important;
    -pie-background: linear-gradient(rgba(201, 67, 0, 1) 45%, rgba(33, 33, 33, 1)) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(45%, rgba(201, 67, 0, 1)), color-stop(1, rgba(33, 33, 33, 1))) !important;
    background: -moz-linear-gradient(rgba(201, 67, 0, 1) 45%, rgba(33, 33, 33, 1)) !important;
    background: -o-linear-gradient(rgba(201, 67, 0, 1) 45%, rgba(33, 33, 33, 1)) !important;
    background: linear-gradient(rgba(201, 67, 0, 1) 45%, rgba(33, 33, 33, 1)) !important;
    -webkit-box-shadow: 0px 0px 2px 0px #333 !important;
    -moz-box-shadow: 0px 0px 2px 0px #333 !important;
    box-shadow: 0px 0px 2px 0px #333 !important;
}

.maxbutton-1.maxbutton.maxbutton-buy-button:hover .mb-text {
    color: #fff !important;
}

.maxbutton-2.maxbutton.maxbutton-series-buy-button:hover {
    border-color: #6b1100 !important;
    background: rgba(201, 67, 0, 1) !important;
    -pie-background: linear-gradient(rgba(201, 67, 0, 1) 45%, rgba(33, 33, 33, 1)) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(45%, rgba(201, 67, 0, 1)), color-stop(1, rgba(33, 33, 33, 1))) !important;
    background: -moz-linear-gradient(rgba(201, 67, 0, 1) 45%, rgba(33, 33, 33, 1)) !important;
    background: -o-linear-gradient(rgba(201, 67, 0, 1) 45%, rgba(33, 33, 33, 1)) !important;
    background: linear-gradient(rgba(201, 67, 0, 1) 45%, rgba(33, 33, 33, 1)) !important;
    -webkit-box-shadow: 0px 0px 2px 0px #333 !important;
    -moz-box-shadow: 0px 0px 2px 0px #333 !important;
    box-shadow: 0px 0px 2px 0px #333 !important;
}

.maxbutton-2.maxbutton.maxbutton-series-buy-button:hover .mb-text {
    color: #fff !important;
}



/* ------------------------------------------------------------------------------------------------------------- */

/* TABLE */

table {
    display: table;
    border-collapse: collapse;
    border-spacing: 0;
}



td {
    display: table-cell;
    padding: 5px 20px;
}

tr:nth-child(odd) {
  background-color: rgba(80, 80, 80, 0.3)
}


/* -------------------------------------------------------------------------------------------------------------- */

/* BOOKS BY GENRE SECTION */

.bookrow {
display:inline-block;
margin: 1rem 2rem; /* margin: 8px -16px; */
}

.bookrow {
display:inline-block;
/*  margin: 1rem 2rem; margin: 8px -16px; */
}

/* Add padding BETWEEN each column (if you want) */
.bookrow,
.bookrow > .genre {
display:inline-block;
padding: 1rem; /* 8px; */
}

.bookrow:after {
  content: "";
  display: table;
  clear: both;
}

.authorprofile:after {
  content: "";
  display: table;
  clear: both;
}

.authorbkrow:after {
  content: "";
  display: table;
  clear: both;
}

.genre {
display: none; /* Hide columns by default */
}

.show {
display: inline-block;
}

/* Style the buttons */
.btn {
  border: none;
  outline: none;
  padding: 12px 16px;
  background-color: white;
  cursor: pointer;
}

/* Add a grey background color on mouse-over */
.btn:hover {
  background-color: #ddd;
}

/* Add a dark background color to the active button */
.btn:active {
  background-color: #666;
   color: white;
}

/* -------------------------------------------------------------------------------------------------------------- */

/* MODAL */


/* <style id='modalcss-inline-css' type='text/css'> */

		.modal .modal-backdrop,
		.modal {
          background: rgba(0,0,0,0.5);
        }
        .modal .modal-backdrop.in {
          opacity: 0.99607843202;
        }
        .modal-dialog .modal-content .close {
          color: #ffffff;
		  background: rgba(0,0,0,1);
		  opacity: 1;
		  text-shadow: none;
		  position: absolute;
		  right: -15px;
		  top: -15px;
        }
        .modal-dialog .modal-content .close:hover {
          color: #ffffff;
		  background: rgba(0,0,0,.5);
		  border: none;
		}
		.modal-dialog .modal-title {
			color: rgba(0,0,0,1);
		}
        .modal-dialog .modal-content {
          color: rgba(0,0,0,1);
          background: rgba(255,255,255,1);
		}
		.modal-dialog .modal-header{
			text-align:center;
			position: relative;
		}
        .modal-dialog {
          text-align:left;
        }
        .modal-dialog .modal-footer {
          text-align:center;
		}
		.admin-bar  .modal.in .modal-dialog {
			top: 46px;
		}
		@media screen and (min-width: 783px) {
			.admin-bar  .modal.in .modal-dialog {
				top: 32px;
			}
		}
        
		.modal-dialog .modal-header {
		  border-bottom: none;
        }
        .modal-dialog .modal-footer {
          border-top: none;
        }
        
/* ---toggle-------------------------------------------- */
/* ------------ */
.collapsible {
  background-color: #777;
  color: white;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
}

.active, .collapsible:hover {
  background-color: #555;
}

.content {
  padding: 0 18px;
  display: none;
  overflow: hidden;
  background-color: #f1f1f1;
}

/* ------------ */