body { background-color:#FFFFFF;border:0px;margin:0px;font-family:Verdana,Sans-Serif;font-size:13px;line-height:1.125}

p { text-align: justify; text-justify: auto }

h1, h2, h3, h4, h5, h6 { font-family:Verdana,Sans-Serif;color:#006622;background-color:transparent;white-space:nowrap;}

#breadcrumb { font-family:Verdana,Sans-Serif;font-size:.95em;border-bottom:1px solid green;border-top:1px solid green;padding:10px 0px 10px 50px;background-color:#FFCC33;color:#2F4F4F;white-space:nowrap;}
#breadcrumb a { color:#CC0033;text-decoration:none;}
#breadcrumb a:hover { text-decoration:underline;}

blockquote { display: block; margin-top: 1em; margin-bottom: 1em; margin-left: 25px; margin-right: 25px; }

.newspaper {columns: 300px 1;}
.newspaper2 {columns: 200px 2;}
.newspaper3 {columns: 150px 3;}

#page { margin:5px; text-align: justify; text-justify: inter-word; }

#input[type=text], select, textarea { width: 35%; padding: 12px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box;  margin-top: 6px; margin-bottom: 16px; resize: vertical; }

#input[type=submit] { background-color: #04AA6D; color: white; padding: 12px 20px; border: none; border-radius: 4px; cursor: pointer; }

#input[type=submit]:hover { background-color: #45a049; }

.button { background-color: #357a38; border: none; color: white; padding: 6px 12px; text-align: center; text-decoration: none; display: inline-block; font-size: 12px; margin: 4px 2px; cursor: pointer; }

.card { width: 30%; display: flex; flex-direction: column; border: 1px blue solid; }

.header { height: 30%; background: green; color: white; text-align: center; }

.container { padding: 2px 16px; }

#menu{position:absolute;width:175px;top:150px;text-align:left;font-size:.99em;font-weight:500;color:White}
#menu a{text-decoration:none;background-color:#006622;display:block;padding:5px;width:120px;margin-bottom:5px;border:1px solid #8FBC8F;color:#FFF}
#menu a:hover{background-color:#006622;color:#ffbf00;border-top:1px solid #8FBC8F;border-left:1px solid #8FBC8F;border-right:1px solid #8FBC8F;border-bottom:1px solid #2F4F4F} 

#options a { background-color:#6B8E23;color:White;border-top:1px solid #8FBC8F;border-left:1px solid #8FBC8F;border-right:1px solid #8FBC8F;border-bottom:1px solid #2F4F4F;}

#content { position:absolute;border-left:1px solid green;padding-left:15px;left:150px;top:120px;right:15px;}
#content1 { position:absolute;border-left:1px solid green;padding-left:15px;left:170px;top:140px;right:15px;}
#content p { padding-left:12px;padding-right:12px;text-align:justify;font-size:13px;}

#footer { text-align:center;border:1px dotted black;color:#000000;background-color:#FFCC33;margin-top:20px;margin-bottom:20px;margin-right:20px;font-size:0.85em;}
a { color:#CC0033;text-decoration:none;}
a hover { text-decoration:underline;}

table { font-family: Verdana, sans-serif; border-collapse: collapse; }
td, th { border: none; text-align: left; padding: 8px; }
tr:nth-child(even) { background-color: #DAF7A6;}

span.floatleft { float:left;margin:3px 8px 3px;font-weight:bold;font-size:0.75em;text-align:center;}
span.floatright { float:right;margin:3px 0 3px 8px;font-weight:bold;font-size:0.750em;text-align:center;}
span.imgcentered { margin:3px auto;display:block;font-weight:bold;font-size:0.750em;text-align:center;}
span.imgcentered1 { margin:3px auto;display:block;font-weight:bold;font-size:1em;text-align:center;}
span.imgcentered2 { margin:3px auto;display:block;font-weight:bold;font-size:1.250em;text-align:center;}

div.columns2 { -moz-column-count:2;/* Firefox */ -webkit-column-count:2;/* Safari, Chrome and Opera */ column-count:2;}
div.columns3 { -moz-column-count:3;/* Firefox */ -webkit-column-count:3;/* Safari, Chrome and Opera */ column-count:3;}
div.columns4 { -moz-column-count:3;/* Firefox */ -webkit-column-count:3;/* Safari, Chrome and Opera */ column-count:3;}
div.columns5 { -moz-column-count:4;/* Firefox */ -webkit-column-count:4;/* Safari, Chrome and Opera */ column-count:4;}

div.center {text-align:center;}

nav {text-align:center;font-weight:normal;}

nav1 {text-align:left;font-weight:normal;padding:16px}

.floating-box {
  display: inline-block;
  width: 150px;
  height: 40px;
  margin: 8px;
	padding: 3px;
  border: 1px solid #73AD21; 
}

.dropbtn { background-color: #457512; color: white; padding: 12px 24px; font-size: 12px; border: none; cursor: pointer; }
.dropdown { position: relative; display: inline-block; }
.dropdown-content { display: none; position: absolute; background-color: #f9f9f9; min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1; }

.dropdown-content a { color: red; padding: 8px 10px; text-decoration: none; display: block; }
.dropdown-content a:hover {background-color: #f1f1f1; }
.dropdown:hover .dropdown-content { display: block; }
.dropdown:hover .dropbtn { background-color: #3e8e41; }

#pdf { width:50%;height:500px;margin:2em auto;border:10px solid #6699FF;}
div.scroll { overflow:scroll;height:550px;}



.accordion {   cursor: pointer;   padding: 12px;   width: 100%;   border: none;   text-align: left;   outline: none;   font-size: 15px;   transition: 0.4s; }

.active, .accordion:hover {   background-color: #9dfc03;  }

.panel {   padding: 0 12px;   display: none;   background-color: white;   overflow: hidden; }


/* Popup container - can be anything you want */
.popup {
  position: relative;
  display: inline-block;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* The actual popup */
.popup .popuptext {
  visibility: hidden;
  width: 400px;
  background-color: green;
  color: #fff;
  text-align: left;
  border-radius: 6px;
  padding: 8px 0;
  position: absolute;
  z-index: 1;
  bottom: 25%;
  left: 100%;
  margin-left: -80px;
}

/* Popup arrow */
.popup .popuptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

/* Toggle this class - hide and show the popup */
.popup .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.sidenav {
 height: 100%;
 width: 0;
 position: fixed;
 z-index: 1;
 top: 0;
 left: 0;
 background-color: #111;
 overflow-x: hidden;
 transition: 0.5s;
 padding-top: 60px;
}

.sidenav a {
 padding: 8px 8px 8px 32px;
 text-decoration: none;
 font-size: 25px;
 color: #818181;
 display: block;
 transition: 0.3s;
}

.sidenav a:hover {
 color: #f1f1f1;
}

.sidenav .closebtn {
 position: absolute;
 top: 0;
 right: 25px;
 font-size: 36px;
 margin-left: 50px;
}

#main {
 transition: margin-left .5s;
 padding: 16px;
}

@media screen and (max-height: 450px) {
 .sidenav {padding-top: 15px;}
 .sidenav a {font-size: 18px;}
}


.collapsiblea {
  background-color: white;
  color: green;
  cursor: pointer;
  padding: 6px;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
}

.active, .collapsiblea:hover {
  background-color: white;
}

.collapsiblea:after {
  content: '\002B';
  color: white;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2212";
}

.contenta {
  padding: 0 18px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  background-color: #f1f1f1;
}

.flip-card {
  background-color: transparent;
  width: 300px;
  height: 300px;
  perspective: 1000px;
}

.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.6s;
  transform-style: preserve-3d;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}

.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-card-front {
  background-color: #bbb;
  color: black;
}

.flip-card-back {
  background-color: #2980b9;
  color: white;
  transform: rotateY(180deg);
}