/* parallax */ 



.parallax {

  /* Full height */
  height: 430px; 

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* Turn off parallax scrolling for tablets and phones. Increase the pixels if needed */
@media only screen and (max-device-width: 1366px) {
  .parallax {
    background-attachment: scroll;
  }
}




/* Change Selection Text Color When Highlighting */ 
::-moz-selection { background-color: #476f30; 
color: #fff; } 
::selection { background-color: #476f30; 
color: #fff; }/* ================================
   
 
 



/* Change Selection Text Color When Highlighting */ 
::-moz-selection { background-color: #476f30; 
color: #fff; } 
::selection { background-color: #476f30; 
color: #fff; }/* ================================
   
 
 
 
 search fiksno
   ================================
*/
input[type=search] {
  width: 25px;
  margin-top:10px;
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  font-size: 16px;
  background-color: white;
  background-image: url('searchicon.png');
  background-position: 5px 5px; 
  background-repeat: no-repeat;
  padding: 2px 2px 5px 30px;
  -webkit-transition: width 0.4s ease-in-out;
  transition: width 0.4s ease-in-out;
}

input[type=search]:focus {
  width: 180px;
}


/* ================================
   
 sliki zoom  10px fiksno
   ================================
*/
* {
  margin: 0;
  padding: 0;
}


.containerZ {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  padding: 0 0px;
}
.containerZ .thumbexZ {
  margin: 10px 10px 10px;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 70px;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  outline: 0px solid white;
  outline-offset: -15px;
  background-color: transparent;
  box-shadow: 5px 10px 40px 5px rgba(0, 0, 0, 0.5);
  border-radius: 3%;
}
.containerZ .thumbexZ .thumbnailZ {
  overflow: hidden;
  min-width: 100%;
  height: 10px;
  position: relative;
  opacity: 0.98;
  backface-visibility: hidden;
  transition: all 0.4s ease-out;
}
.containerZ .thumbexZ .thumbnailZ img {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  height: 115%;
  width: auto;
  transform: translate(-50%, -50%);
  backface-visibility: hidden;
}
.containerZ .thumbexZ .thumbnailZ span {
  position: absolute;
  z-index: 2;
  top: calc(150px - 20px);
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  padding: 10px 10px;
  margin: 0 45px;
  text-align: center;
  font-size: 24px;
  color: white;
  font-weight: 300;
  font-family: "Tahoma", sans-serif;
  letter-spacing: 0.2px;
  transition: all 0.3s ease-out;
}
.containerZ .thumbexZ .thumbnailZ:hover {
  backface-visibility: hidden;
  transform: scale(1.15, 1.15);
  opacity: 1;
}
.containerZ .thumbexZ .thumbnailZ:hover span {
  opacity: 0;
}



/* ================================
   
 sliki zoom  400px fiksno
   ================================
*/
* {
  margin: 0;
  padding: 0;
}


.container4 {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  padding: 0 0px;
}
.container4 .thumbex4 {
  margin: 10px 10px 10px;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 400px;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  outline: 0px solid white;
  outline-offset: -15px;
  background-color: transparent;
  box-shadow: 5px 10px 40px 5px rgba(0, 0, 0, 0.5);
  border-radius: 3%;
}
.container4 .thumbex4 .thumbnail4 {
  overflow: hidden;
  min-width: 100%;
  height: 400px;
  position: relative;
  opacity: 0.98;
  backface-visibility: hidden;
  transition: all 0.4s ease-out;
}
.container4 .thumbex4 .thumbnail4 img {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  height: 115%;
  width: auto;
  transform: translate(-50%, -50%);
  backface-visibility: hidden;
}
.container4 .thumbex4 .thumbnail4 span {
  position: absolute;
  z-index: 2;
  top: calc(150px - 20px);
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  padding: 10px 10px;
  margin: 0 45px;
  text-align: center;
  font-size: 24px;
  color: white;
  font-weight: 300;
  font-family: "Tahoma", sans-serif;
  letter-spacing: 0.2px;
  transition: all 0.3s ease-out;
}
.container4 .thumbex4 .thumbnail4:hover {
  backface-visibility: hidden;
  transform: scale(1.15, 1.15);
  opacity: 1;
}
.container4 .thumbex4 .thumbnail4:hover span {
  opacity: 0;
}


/* ================================
   
 sliki zoom  300px fiksno
   ================================
*/
* {
  margin: 0;
  padding: 0;
}


.container {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  padding: 0 0px;
}
.container .thumbex {
  margin: 10px 10px 10px;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 300px;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  outline: 0px solid white;
  outline-offset: -15px;
  background-color: transparent;
  box-shadow: 5px 10px 40px 5px rgba(0, 0, 0, 0.5);
  border-radius: 3%;
}
.container .thumbex .thumbnail {
  overflow: hidden;
  min-width: 100%;
  height: 300px;
  position: relative;
  opacity: 0.98;
  backface-visibility: hidden;
  transition: all 0.4s ease-out;
}
.container .thumbex .thumbnail img {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  height: 115%;
  width: auto;
  transform: translate(-50%, -50%);
  backface-visibility: hidden;
}
.container .thumbex .thumbnail span {
  position: absolute;
  z-index: 2;
  top: calc(150px - 20px);
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  padding: 10px 10px;
  margin: 0 45px;
  text-align: center;
  font-size: 24px;
  color: white;
  font-weight: 300;
  font-family: "Tahoma", sans-serif;
  letter-spacing: 0.2px;
  transition: all 0.3s ease-out;
}
.container .thumbex .thumbnail:hover {
  backface-visibility: hidden;
  transform: scale(1.15, 1.15);
  opacity: 1;
}
.container .thumbex .thumbnail:hover span {
  opacity: 0;
}

/* ================================
   
 sliki zoom  100px fiksno
   ================================
*/
* {
  margin: 0;
  padding: 0;
}


.container1 {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  padding: 0 0px;
}
.container1 .thumbex1 {
  margin: 10px 10px 10px;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 100px;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  outline: 0px solid white;
  outline-offset: -15px;
  background-color: transparent;
  box-shadow: 5px 10px 40px 5px rgba(0, 0, 0, 0.5);
  border-radius: 3%;
}
.container1 .thumbex1 .thumbnail1 {
  overflow: hidden;
  min-width: 100%;
  height: 100px;
  position: relative;
  opacity: 0.98;
  backface-visibility: hidden;
  transition: all 0.4s ease-out;
}
.container1 .thumbex1 .thumbnail1 img {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  height: 115%;
  width: auto;
  transform: translate(-50%, -50%);
  backface-visibility: hidden;
}
.container1 .thumbex1 .thumbnail1 span {
  position: absolute;
  z-index: 2;
  top: calc(150px - 20px);
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  padding: 10px 10px;
  margin: 0 45px;
  text-align: center;
  font-size: 24px;
  color: white;
  font-weight: 300;
  font-family: "Tahoma", sans-serif;
  letter-spacing: 0.2px;
  transition: all 0.3s ease-out;
}
.container1 .thumbex1 .thumbnail1:hover {
  backface-visibility: hidden;
  transform: scale(1.15, 1.15);
  opacity: 1;
}
.container1 .thumbex1 .thumbnail1:hover span {
  opacity: 0;
}


/* ================================
   
 sliki zoom  200px fiksno
   ================================
*/
* {
  margin: 0;
  padding: 0;
}


.container2 {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  padding: 0 0px;
}
.container2 .thumbex2 {
  margin: 10px 10px 10px;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 215px;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  outline: 0px solid white;
  outline-offset: -15px;
  background-color: transparent;
  box-shadow: 5px 10px 40px 5px rgba(0, 0, 0, 0.5);
  border-radius: 3%;
}
.container2 .thumbex2 .thumbnail2 {
  overflow: hidden;
  min-width: 100%;
  height: 215px;
  position: relative;
  opacity: 0.98;
  backface-visibility: hidden;
  transition: all 0.4s ease-out;
}
.container2 .thumbex2 .thumbnail2 img {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  height: 115%;
  width: auto;
  transform: translate(-50%, -50%);
  backface-visibility: hidden;
}
.container2 .thumbex2 .thumbnail2 span {
  position: absolute;
  z-index: 2;
  top: calc(150px - 20px);
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  padding: 10px 10px;
  margin: 0 45px;
  text-align: center;
  font-size: 24px;
  color: white;
  font-weight: 300;
  font-family: "Tahoma", sans-serif;
  letter-spacing: 0.2px;
  transition: all 0.3s ease-out;
}
.container2 .thumbex2 .thumbnail2:hover {
  backface-visibility: hidden;
  transform: scale(1.15, 1.15);
  opacity: 1;
}
.container2 .thumbex2 .thumbnail2:hover span {
  opacity: 0;
}


/* ================================
   
 sliki zoom  500px fiksno
   ================================
*/
* {
  margin: 0;
  padding: 0;
}


.container5 {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  padding: 0 0px;
}
.container5 .thumbex5 {
  margin: 10px 10px 10px;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 497px;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  outline: 0px solid white;
  outline-offset: -15px;
  background-color: white;
  box-shadow: 5px 10px 40px 5px rgba(0, 0, 0, 0.5);

}
.container5 .thumbex5 .thumbnail5 {
  overflow: hidden;
  min-width: 100%;
  height: 497px;
  position: relative;
  opacity: 0.98;
  backface-visibility: hidden;
  transition: all 0.4s ease-out;
}
.container5 .thumbex5 .thumbnail5 img {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  height: 115%;
  width: auto;
  transform: translate(-50%, -50%);
  backface-visibility: hidden;
}
.container5 .thumbex5 .thumbnail5 span {
  position: absolute;
  z-index: 2;
  top: calc(150px - 20px);
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  padding: 10px 10px;
  margin: 0 45px;
  text-align: center;
  font-size: 24px;
  color: white;
  font-weight: 300;
  font-family: "Tahoma", sans-serif;
  letter-spacing: 0.2px;
  transition: all 0.3s ease-out;
}
.container5 .thumbex5 .thumbnail5:hover {
  backface-visibility: hidden;
  transform: scale(1.15, 1.15);
  opacity: 1;
}
.container5 .thumbex5 .thumbnail5:hover span {
  opacity: 0;
}



/* ================================
   
 sliki zoom  600px fiksno
   ================================
*/
* {
  margin: 0;
  padding: 0;
}


.container6 {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  padding: 0 0px;
}
.container6 .thumbex6 {
  margin: 10px 10px 10px;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 620px;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  outline: 0px solid white;
  outline-offset: -15px;
  background-color: white;
  box-shadow: 5px 10px 40px 5px rgba(0, 0, 0, 0.5);
}
.container6 .thumbex6 .thumbnail6 {
  overflow: hidden;
  min-width: 100%;
  height: 620px;
  position: relative;
  opacity: 0.98;
  backface-visibility: hidden;
  transition: all 0.4s ease-out;
}
.container6 .thumbex6 .thumbnail6 img {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  height: 115%;
  width: auto;
  transform: translate(-50%, -50%);
  backface-visibility: hidden;
}
.container6 .thumbex6 .thumbnail6 span {
  position: absolute;
  z-index: 2;
  top: calc(150px - 20px);
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  padding: 10px 10px;
  margin: 0 45px;
  text-align: center;
  font-size: 24px;
  color: white;
  font-weight: 300;
  font-family: "Tahoma", sans-serif;
  letter-spacing: 0.2px;
  transition: all 0.3s ease-out;
}
.container6 .thumbex6 .thumbnail6:hover {
  backface-visibility: hidden;
  transform: scale(1.15, 1.15);
  opacity: 1;
}
.container6 .thumbex6 .thumbnail6:hover span {
  opacity: 0;
}

/* ================================
   
 facebook
   ================================
*/   


.fa {
  padding: 5px;
  font-size: 20px;
  width: 20px;
  text-align: center;
  text-decoration: none;
  margin: 2px 2px;
  border-radius: 50%;
}

.fa:hover {
    opacity: 0.7;
    color:white;
}

.fa-facebook {
  background: #3B5998;
  color: white;
}

.fa-twitter {
  background: #55ACEE;
  color: white;
}

.fa-google {
  background: #dd4b39;
  color: white;
}

.fa-linkedin {
  background: #007bb5;
  color: white;
}

.fa-youtube {
  background: #bb0000;
  color: white;
}


/* ================================
   
    dole odi meni
   ================================
*/   
#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  width:30px;
  height:30px;
  bottom: 10px; /* Place the button at the bottom of the page */
  right: 50%; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: black; /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 1px; /* Some padding */
  border-radius: 50%; /* Rounded corners */
  font-size: 25px; /* Increase font size */
}

#myBtn:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}




/* ================================
   
    on mause over popup tekst
   ================================
*/   

.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 0px dotted black;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 100px;
  height: 30px;
  background-color: black;
  color: #fff;
  font-size:xx-small;
  font-family:Tahoma;
  text-align: center;
  border-radius: 6px;
  padding: 3px 0;
  position: absolute;
  z-index: 1;
  bottom: 150%;
  left: 50%;
  margin-left: -60px;
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}




/* ================================
   
    zoom  na slika slika 
   ================================
*/   

* {
  box-sizing: border-box;
}

imgR {
  transition: transform .2s;
}

imgR:hover {
  -ms-transform: scale(1.03); /* IE 9 */
  -webkit-transform: scale(1.03); /* Safari 3-8 */
  transform: scale(1.03);
    box-shadow: 4px 4px 8px 4px rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.2);
 
}




/* slika se vrti 360 stepeni */

.flip-box {
  background-color: transparent;
  width: 100%;
  height: 200px;
  perspective: 1000px;
}

.flip-box-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

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

.flip-box-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}

.flip-box-front {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}

.flip-box-front {
  color: black;
}

.flip-box-back {
	background-color: #FFFFCC;
	color: #FFFFCC;
	transform: rotateY(180deg);
}

/* kade se popolnuva kako da izgleda */

select {
  padding: 2px 20px;
  margin: 1px 5;
  display: inline-block;
  border-top: 1px solid red;
  border-radius: 14px;
  box-sizing: border-box;
}

input[type=text] {
  padding: 2px 20px;
  margin: 1px 5;
  display: inline-block;
  border-top: 1px solid red;
  border-radius: 14px;
  box-sizing: border-box;
}

input[type=submit] {
  background-color: orange;
  color: white;
  padding: 4px 5px;
  margin: 1px 0;
  border-top: 1px solid red;
  border-radius: 4px;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: green;
}



select {
  padding: 2px 2px;
  margin: 1px 5;
  display: inline-block;
  border-top: 1px solid red;
  box-sizing: border-box;
  font-size: 14px;
}










body {font-family: Tahoma, Tahoma, Helvetica, sans-serif;}

/* LOGIN */
input[type=password] {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border-top: 1px solid #ccc;
  box-sizing: border-box;
}

input[type=text] {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border-top: 1px solid #ccc;
  box-sizing: border-box;
}

/* Set a style for all buttons */
button {
  background-color: #7F191C;
  color: white;
    border-radius: 5px 5px 5px 5px;

  padding: 5px;
  margin: 6px 0;
  border: none;
  cursor: pointer;
  width: 50%;
}

button:hover {
  opacity: 0.9;
}

/* Extra styles for the cancel button */
.cancelbtn {
  width: auto;
  padding: 10px 18px;
  background-color: #f44336;
}

/* Center the image and position the close button */
.imgcontainer {
  text-align: center;
  margin: 24px 0 12px 0;
  position: relative;
}

img.avatar {
  width: 40%;
  border-radius: 50%;
}

.container {
  padding: 6px;
}

span.psw {
  float: right;
  padding-top: 16px;
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 400; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  padding-top: 60px;
}

/* Modal Content/Box */
.modal-content {
  background-color: #fefefe;
  margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
  border-top: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button (x) */
.close {
  position: absolute;
  right: 25px;
  top: 0;
  color: #000;
  font-size: 35px;
  font-weight: bold;
}

.close:focus {
  color: red;
  cursor: pointer;
}

.close:hover {
  color: red;
  cursor: pointer;
}

/* Add Zoom Animation */
.animate {
  -webkit-animation: animatezoom 0.6s;
  animation: animatezoom 0.6s
}

@-webkit-keyframes animatezoom {
  from {-webkit-transform: scale(0)} 
  to {-webkit-transform: scale(1)}
}
  
@keyframes animatezoom {
  from {transform: scale(0)} 
  to {transform: scale(1)}
}

/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 300px) {
  span.psw {
     display: block;
     float: none;
  }
  .cancelbtn {
     width: 100%;
  }
}


/* PAGE BACKGROUND */
/* od  strana gore dolu ikonata  */



.icon-bar {
  position: fixed;
  top: 82%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.icon-bar a {
  display: block;
  text-align: center;
  padding: 1px;
  transition: all 0.3s ease;
  color: white;
  font-size: 11px;
      border-radius: 50%;
}

.icon-bar a:hover {
  background-color: dodgerblue;
}

.gore {
  background: #3B5998;
  color: white;
}

.facebook {
  background: #3B5998;
  color: white;
}

.twitter {
  background: #55ACEE;
  color: white;
}

.google {
  background: #dd4b39;
  color: white;
}

.linkedin {
  background: #007bb5;
  color: white;
}

.youtube {
  background: #bb0000;
  color: white;
}

/* PAGE BACKGROUND */
/* zaokruzuvanje na slikite  */

img {
  border-radius: 10;
}



/* na slika se pojavuva tekst so zeleno prva strana  */

.container2 {
  position: relative;
}


.image {
  opacity: 1;
  display: block;
  width: 100%;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;

}

.middle {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, 250%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.container2:hover .image {
  opacity: 0.3;
}

.container2:hover .middle {
  opacity: 1;
}

.text {
  background-color: #4CAF50;
  color: white;
  font-size: 14px;
  padding: 16px 16px;
}


/* PAGE BACKGROUND */
/* zaopkruzuvanje na tabelite  */

#rcorners1 {
  border: 1px solid silver;
  border-radius: 20px 20px 20px 20px;

}

#rcorners2 { 
  border: 1px solid silver;
  box-shadow: 3px 3px 6px 3px rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.2);
}


#rcorners3 {
  border: 1px solid silver;
  border-radius: 3%;
  box-shadow: 3px 3px 6px 3px rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.2);

}


#rcorners4 {
border-radius: 20px 20px 0px 0px;
padding-left:10;
padding-right:10;

}

#rcorners5 {
  border-left:1px solid silver;
  border-right:1px solid silver;

}

#rcorners6 {
  border-radius: 20px 20px 20px 20px;
    border: 1px solid silver;
padding-right:10;

}

#rcorners7 {
border-radius: 20px 20px 0px 0px;
padding-left:10;
padding-right:10;
border-top: 1px solid gray;

}


#rcorners8 {
width:95%;
border-radius: 20px 20px 20px 20px;
  box-shadow: 3px 3px 6px 3px rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.2);
  background-color: gray;
padding-left:20;
padding-right:20;
margin-left:10px;


}

#rcorners9 {
width:95%;
border-radius: 20px 20px 20px 20px;
  box-shadow: 3px 3px 6px 3px rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.2);
  background-color: gray;

padding-left:20;
padding-right:20;
transform: skew(-15deg);
margin-left:10px;

}


#rcorners10 {
  border-radius: 250px 0px 0px 0px;
 
}



.vertical-menu   {
  width: 100%;  

}

.vertical-menu a {
background-color: #ffffff;
  display: block;
width: 100%;
border-bottom: 1px solid white; /* Green border */
  float: left;
text-decoration: none;
color: black;
padding: 10px;
font-family:Tahoma;
font-size: 19px; 


 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.vertical-menu a:hover {
  background-color: silver;
font-size: 19px; 
  text-decoration: none;

}

.vertical-menu a.active {
  background-color: #ffffff;
  color: black;
font-family:Tahoma;
font-size: 19px; 
  text-decoration: none;

}



.vertical-menu1   {
  width: 100%;  

}

.vertical-menu1 a {
background-color: white;
  display: block;
width: 100%;
border-bottom: 1px solid #333; /* Green border */
float: left;
text-decoration: none;
color: #333;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
border-bottom: 3px solid transparent;

  }

.vertical-menu1 a:hover {
  background-color: gray;
  font-size: 19px;
  color: white;
  text-decoration: none;
border-bottom: 3px solid red;

}

.vertical-menu1 a.active {
  background-color: #333;
  color: white;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}




.vertical-menu2   {
  width: 100%;  

}

.vertical-menu2 a {
background-color: white;
  display: block;
width: 100%;
float: left;
text-decoration: none;
color: black;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
border-bottom: 3px solid transparent;

}

.vertical-menu2 a:hover {
  background-color:gray;
  font-size: 19px;
  color: white; 
  text-decoration: none;
border-bottom: 3px solid red;
 
}

.vertical-menu2 a.active {
  background-color: white;
  color: black;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}




.vertical-menu3   {
  width: 100%;  

}

.vertical-menu3 a {
background-color: white;
  display: block;
width: 100%;
border-bottom: 1px solid maroon; /* Green border */
float: left;
text-decoration: none;
color: maroon;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
border-bottom: 3px solid transparent;

}

.vertical-menu3 a:hover {
  background-color: red;
font-size: 19px; 
  color: white;
  text-decoration: none;
border-bottom: 3px solid maroon;}

.vertical-menu3 a.active {
  background-color: maroon;
  color: white;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid black;}





.vertical-menu4   {
  width: 100%;  

}

.vertical-menu4 a {
background-color: white;
  display: block;
width: 100%;
border-bottom: 1px solid red; /* Green border */
float: left;
text-decoration: none;
color: red;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
border-bottom: 3px solid transparent;

}

.vertical-menu4 a:hover {
  background-color: maroon;
font-size: 19px; 
  color: white;
  text-decoration: none;
border-bottom: 3px solid green;}

.vertical-menu4 a.active {
  background-color: red;
  color: white;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid green;}


.vertical-menu5   {
  width: 100%;  

}

.vertical-menu5 a {
background-color: white;
  display: block;
width: 100%;
border-bottom: 1px solid #23569C; /* Green border */
float: left;
text-decoration: none;
color: navy;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
border-bottom: 3px solid transparent;

}

.vertical-menu5 a:hover {
  background-color: #23569C;
  font-size: 19px;
  color: white;
   text-decoration: none;
border-bottom: 3px solid red;

}

.vertical-menu5 a.active {
  background-color: #23569C;
  color: white;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}





.vertical-menu6   {
  width: 100%;  

}

.vertical-menu6 a {
background-color: white;
  display: block;
width: 100%;
border-bottom: 1px solid blue; /* Green border */
float: left;
text-decoration: none;
color: blue;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
border-bottom: 3px solid transparent;

}

.vertical-menu6 a:hover {
  background-color: navy;
  font-size: 19px;
  color: white;
  text-decoration: none;
border-bottom: 3px solid red;

}

.vertical-menu6 a.active {
  background-color: blue;
  color: white;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}





.vertical-menu7   {
  width: 100%;  

}

.vertical-menu7 a {
background-color: white;
  display: block;
width: 100%;
border-bottom: 1px solid teal; /* Green border */
float: left;
text-decoration: none;
color: teal;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
border-bottom: 3px solid transparent;

}

.vertical-menu7 a:hover {
  background-color: olive;
  font-size: 19px;
  color: white;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.vertical-menu7 a.active {
  background-color: teal;
  color: white;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}





.vertical-menu8   {
  width: 100%;  

}

.vertical-menu8 a {
background-color: white;
  display: block;
width: 100%;
border-bottom: 1px solid olive; /* Green border */
float: left;
text-decoration: none;
color: olive;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
border-bottom: 3px solid transparent;

}

.vertical-menu8 a:hover {
  background-color: teal;
  font-size: 19px;
  color: white;
  text-decoration: none;
border-bottom: 3px solid red;

}

.vertical-menu8 a.active {
  background-color: olive;
  color: white;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}






.vertical-menu9   {
  width: 100%;  

}

.vertical-menu9 a {
background-color: white;
  display: block;
width: 100%;
border-bottom: 1px solid orange; /* Green border */
float: left;
text-decoration: none;
color: orange;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
border-bottom: 3px solid transparent;

}

.vertical-menu9 a:hover {
  background-color: maroon;
  font-size: 19px;
  color:white; 
  text-decoration: none;
border-bottom: 3px solid red;

}

.vertical-menu9 a.active {
  background-color: orange;
  color: white;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}



.vertical-menu10   {
  width: 100%;  

}

.vertical-menu10 a {
background-color: white;
  display: block;
width: 100%;
border-bottom: 1px solid #FFCC00; /* Green border */
float: left;
text-decoration: none;
color: #FFCC00;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
border-bottom: 3px solid transparent;

}

.vertical-menu10 a:hover {
  background-color: maroon;
  font-size: 19px;
  color:white; 
  text-decoration: none;
border-bottom: 3px solid red;

}

.vertical-menu10 a.active {
  background-color: #FFCC00;
  color: black;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}

.vertical-menu11   {
  width: 100%;  

}

.vertical-menu11 a {
background-color: white;
  display: block;
width: 100%;
border-bottom: 1px solid #990000; /* Green border */
float: left;
text-decoration: none;
color: #990000;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
border-bottom: 3px solid transparent;

}

.vertical-menu11 a:hover {
  background-color: maroon;
  font-size: 19px;
  color: white;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.vertical-menu11 a.active {
  background-color: #990000;
  color: white;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}




.vertical-menu12   {
  width: 100%;  

}

.vertical-menu12 a {
background-color: white;
  display: block;
width: 100%;
border-bottom: 1px solid silver; /* Green border */
float: left;
text-decoration: none;
color: silver;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
border-bottom: 3px solid transparent;

}

.vertical-menu12 a:hover {
  background-color: gray;
  font-size: 19px;
  color: white;
  text-decoration: none;
border-bottom: 3px solid red;

}

.vertical-menu12 a.active {
  background-color: silver;
  color: white;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}




.vertical-menu13   {
  width: 100%;  

}

.vertical-menu13 a {
background-color: white;
  display: block;
width: 100%;
border-bottom: 1px solid gray; /* Green border */
float: left;
text-decoration: none;
color: gray;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
border-bottom: 3px solid transparent;

}

.vertical-menu13 a:hover {
  background-color: silver;
  font-size: 19px;
  color: white;
  text-decoration: none;
border-bottom: 3px solid red;

}

.vertical-menu13 a.active {
  background-color: gray;
  color: white;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}





.vertical-menu14   {
  width: 100%;  

}

.vertical-menu14 a {
background-color: #993333;
  display: block;
width: 100%;
border-bottom: 1px solid white; /* Green border */
float: left;
text-decoration: none;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
text-decoration: none;
border-bottom: 3px solid transparent;

}

.vertical-menu14 a:hover {
  background-color: maroon;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}

.vertical-menu14 a.active {
  background-color: #993333;
  color: white;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}


.vertical-menu15   {
width: 230px;
}

.vertical-menu15 a {
  display: block;
width: 100%;
border-bottom: 1px solid white; /* Green border */
float: left;
text-decoration: none;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 19px; 
text-transform: uppercase;
text-decoration: none;
border-bottom: 3px solid transparent;

}

.vertical-menu15 a:hover {
  background-color: #993333;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}

.vertical-menu15 a.active {
  background-color: #663300;
  color: white;
  font-family: Tahoma;
font-size: 19px; 
  text-decoration: none;
border-bottom: 3px solid red;

}




















body
{ 
background-attachment:fixed;
background-position:top; 

}




.paginacaoCursor{
			margin: 5px;
			padding: 5px 8px;
			color: #fff;
			background: silver;
			cursor: pointer;
		}




.customPagination{
			margin: 5px;
			padding: 5px 8px;
			color: #fff;
			background: silver;
			cursor: pointer;
		}







.sticky {
  position: fixed;
  z-index:1;
  top: 0;
  width: 100%;
}

div.sticky1 {
  position: -webkit-sticky;
  position: sticky;
  top: 43;
}

div.sticky2 {
  position: -webkit-sticky;
  position: sticky;
  top: 80;
}


div.sticky4 {
  position: -webkit-sticky;
  position: sticky;
  top: -1;
  
}

body {
  font-family: Tahoma;
}

.horiz-menu   {
  overflow: auto;

  background-color: #333;

}

.horiz-menu a {
text-align: center;
 
  
float: left;
text-decoration: none;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 14px; 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu a:hover {
  background-color: silver;
  font-size: 14px; 
  text-decoration: none;

}

.horiz-menu a.active {
  background-color: #4CAF50;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;

}



.horiz-menu1   {
  overflow: auto;
  background-color: #333;
}
.horiz-menu1 a {
text-align: center;
 
  
float: left;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu1 a:hover {
  background-color: silver;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid red;
}

.horiz-menu1 a.active {
  background-color: #333;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid red;
}




.horiz-menu2   {
  overflow: auto;
  background-color: white;

}

.horiz-menu2 a {
text-align: center;
 
  
float: left;
color: black;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu2 a:hover {
  background-color: silver;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.horiz-menu2 a.active {
  background-color:white ;
  color: black;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid red;

}




.horiz-menu3   {
  overflow: auto;
  background-color: #AB0A0A;
}
.horiz-menu3 a {
text-align: center;
 
  
float: left;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu3 a:hover {
  background-color: red;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid white;}

.horiz-menu3 a.active {
  background-color: maroon;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid green;}





.horiz-menu4   {
  overflow: auto;
  background-color: red;
}

.horiz-menu4 a {
text-align: center;
 
  
float: left;
text-decoration: none;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu4 a:hover {
  background-color: maroon;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid green;}

.horiz-menu4 a.active {
  background-color: red;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid green;}


.horiz-menu5   {
  overflow: auto;
  background-color: #23569C;
}
.horiz-menu5 a {
text-align: center;
 
  
float: left;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu5 a:hover {
  background-color: #23569C;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.horiz-menu5 a.active {
  background-color: #23569C;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid red;

}





.horiz-menu6   {
  overflow: auto;
  background-color: blue;
}
.horiz-menu6 a {
text-align: center;
 
  
float: left;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu6 a:hover {
  background-color: navy;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.horiz-menu6 a.active {
  background-color: blue;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid red;

}





.horiz-menu7   {
  overflow: auto;
  background-color: teal;
}
.horiz-menu7 a {
text-align: center;
 
  
float: left;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu7 a:hover {
  background-color: olive;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.horiz-menu7 a.active {
  background-color: teal;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid red;

}





.horiz-menu8   {
  overflow: auto;
  background-color: olive;
}
.horiz-menu8 a {
text-align: center;
 
  
float: left;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu8 a:hover {
  background-color: teal;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.horiz-menu8 a.active {
  background-color: olive;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid red;

}






.horiz-menu9   {
  overflow: auto;
  background-color: orange;
}
.horiz-menu9 a {
text-align: center;
 
  
float: left;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu9 a:hover {
  background-color: maroon;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.horiz-menu9 a.active {
  background-color: orange;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid red;

}



.horiz-menu10   {
  overflow: auto;
  background-color: #FFCC00;
}
.horiz-menu10 a {
text-align: center;
 
  
float: left;
text-decoration: none;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu10 a:hover {
  background-color: maroon;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.horiz-menu10 a.active {
  background-color: #FFCC00;
  color: black;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid red;

}

.horiz-menu11   {
  overflow: auto;
  background-color: #990000;
}
.horiz-menu11 a {
text-align: center;
 
  
float: left;
text-decoration: none;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu11 a:hover {
  background-color: maroon;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.horiz-menu11 a.active {
  background-color: #990000;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid red;

}




.horiz-menu12   {
  overflow: auto;
  background-color: silver;
}
.horiz-menu12 a {
text-align: center;
 
  
float: left;
text-decoration: none;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu12 a:hover {
  background-color: gray;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.horiz-menu12 a.active {
  background-color: silver;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid red;

}




.horiz-menu13   {
  overflow: auto;
  background-color: gray;
}
.horiz-menu13 a {
text-align: center;
 
  
float: left;
text-decoration: none;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu13 a:hover {
  background-color: silver;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.horiz-menu13 a.active {
  background-color: gray;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid red;

}





.horiz-menu14   {
  overflow: auto;
  background-color: #993333;
}
.horiz-menu14 a {
text-align: center;
 
  
float: left;
text-decoration: none;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;
 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu14 a:hover {
  background-color: maroon;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.horiz-menu14 a.active {
  background-color: #993333;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid red;

}


.horiz-menu15   {
  overflow: auto;
  background-color: #663300;
}
.horiz-menu15 a {
text-align: center;
 
  
float: left;
color: white;
padding: 10px;
font-family: Tahoma;
font-size: 16px;

 
text-decoration: none;
border-bottom: 3px solid transparent;

}

.horiz-menu15 a:hover {
  background-color: #993333;
  font-size: 16px;
 
  text-decoration: none;
border-bottom: 3px solid red;

}

.horiz-menu15 a.active {
  background-color: #663300;
  color: white;
  font-family: Tahoma;
  font-size: 14px; 
  text-decoration: none;
border-bottom: 3px solid red;

}