/* CSS Document */
* {
  box-sizing: border-box;
}

.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}	

[class*="col-"] 
{
  float: left;
  padding: 15px;
  font: 14px arial;	
  align-content: center;
  border: #B3C9B8;
	
 }

.fundocol {
  background:#ffffff ;
  border-color: #7F6109;
  padding: 5px;
  box-shadow: 0 15px 20px #c3c3c3;	
}

#botao-link {
  padding: 6px;
  width: 80%;
  height: auto;
  background:red ;
  border-radius: 25px;
  border-color: brown;
  margin: 2px;
  font: 14px arial;
  color: #ffffff;	
  
}

#botao-compra {
  padding: 6px;
  width: 100%;
  height: auto;
  background:#296224;
  border-radius: 25px;
  border-color: brown;
  margin: 2px;
  font: 14px arial;
  color: #ffffff;	
  
}

#botao-link-small {
  padding: 3px;
  width: 166px;
  height: 20px;
  background: #322B2B   ;
  border-radius: 25px;
  border-color: #322B2B   ;
  margin: 2px;
  font: 12px arial;
  color: #ffffff;	
  
}


#botao-menu {
  padding: 6px;
  width: 100%;
  height: auto;
  background:#725707 ;
  margin:  0px;
  font: 14px arial;
  color: #EBEFE1;	
  
}

#botao-ler {
  text-align: center;
  padding: 5px;
  width: 100px;
  height: auto;
  background:#12120D ;
  margin:  0px;
  font: 14px arial;
  color: #ffffff;	
  
}

@media only screen and (max-width: 768px) {
  /* For mobile phones: */
  [class*="col-"] {
    width: 100%;
  }
}	

.row::after {
  content: "";
  clear: both;
  display: table;
}
	

body {
	margin:0px;
	padding:0px;	
	background-color:#FFFFFF;
}
.topline {
	height: 20px;
	width: 100%;
	background-color: #E1E3E3;
	border-top-width: thin;
	border-top-style: solid;
	border-top-color: #666;
	float: left;
	font: 11px arial;
	text-decoration: none;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 5px;
	padding-left: 30px;
}

.header0 {
	width:1000px;
	height: 140px;
	float: none;
	margin-top: 2px;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;

	
	
}
.header0 img {
	float: center;
	margin-top: 0px;
	margin-left: 5px;
	margin-right: auto;
	padding-top: 0px;
	
    }



.topleft {
		with:18%;
		font: 16px arial;
		height: 110px;
		float: left;
		margin-left: 10px;
		background-color:#FFFFFF;
	}
.topcenter1 {
		with:28%;
		height:110px;
		float:left;
		margin-left: 90px;
		background-color:#FFFFFF;
	}
.topcenter2 {
		with:28%;
		height:110px;
		float:left;
		font-size: 28px;
		font-style: italic;
		line-height: normal;
		background-color:#FFFFFF;
		margin-left: 10px;
		padding-top: 15px;
	}


.topright {
	    with:18%;
		font: 16px arial;
		height: 110px;
		float: left;
		margin-left: 5px;
		margin-right: 200px;
		background-color:#FFFFFF;
	}
	
.tituloheader {
	font-size: 32px;
	font-style: italic;
	line-height: normal;
	margin-left: 200px;
	margin-right: 100px;
	margin-top: 1px;
	padding-top: 0px;
    }
.wrapper{
	width: 100%;
	height:auto;
	float: none;
	margin-top: 1px;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	border-top-width: thin;
	border-top-style: solid;
	border-top-color: #096;
	background-color: #FFFFFF;
    background-position: 100% 100%;
    background-repeat: no-repeat;	

	}
.col1 {
	width: 31%;
	height: auto;
	font: 14px arial;
	padding: 3px;
	float: left;
	margin: 2px;
	color: #000;
	background-color:#FC9;
}
.divideemtres{
	width: 31%;
	height: auto;
	font: 14px arial;
	padding: 3px;
	float: left;
	margin: 5px;
	color: #000;
	background-color: #FFFFFF;
	text-align: center;
	}
.divideemtres img {
	max-width: 100%;
	height: auto;
	float:center;
	margin-top: 2px;
	padding-top: 2px;
	    }
.divideemdois{
		height: auto;
		width: 65%;
	    font: 14px arial;
		float: left;		
	} 
.divideemum{
	    text-align: left; 
	    font: 14px arial;
		height: auto;
		width: 100%;
		float: left;
		background-color: #FFFFFF;
	}


.collarge {
	width: 64%;
	font: 14px arial;
	padding: 3px;
	height: auto;
	
	float: left;
	margin: 2px;
	color: #000;
	background-color: #CCCCCC;
}
.esquerda{
		float: left;
	    width: 50%;
	    margin-left: "30px";
		padding-left: 10%;
		/*background-color:#E86062;*/
	    
	}
.direita{
		float: right;
	    width: 50%;
		margin-right: "30px";
	    padding-right: 5%;
	   /* background-color: #237020;*/
	}


.dropdown {
 	 position: relative;
  	 display: inline-block;
	 margin-left: auto;
     }
  .dropdown-content {
     display: none;
     position: absolute;
	 right: 0;
     background-color: #f9f9f9;
     min-width: 155px;
     box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
     padding: 8px 12px;
     z-index: 1;
     }
   
    .dropdown:hover .dropdown-content {
      display: block;
      }
    .dropbtn {
     background-color: white;
     color: black;
     padding: 16px;
     font-size: 16px;
     border: none;
     cursor: pointer;
     }
    .dropdown-content a {
     color: black;
     padding: 12px 16px;
     text-decoration: none;
     display: block;
     }
    .dropdown-content a:hover {
    background-color: #f1f1f1
    }
    .dropdown:hover .dropbtn {
     background-color: #00000;
    }




.btn {
  background-color:#FFFFFF;
  border: none;
  color: black;
  padding: 4px 16px;
  font-size: 16px;
  cursor: pointer;
}

/* Darker background on mouse-over */
.btn:hover {
  background-color:#E7E4C0;
}
	.footer {
	width: 100%;	
	height: auto;
	background-color: #E1E3E3;
	border-top-width: thin;
	border-top-style: solid;
	border-top-color: #666;
	float: left;
	font: 11px arial;
	text-decoration: none;
	padding-top: 5px;
	padding-left: 30px;

	}


.container {
	width:800px; 
	height:auto; 
	clear:both; 
	overflow:auto; 
	margin:60px auto;
}


.menubox { 
	width:800; 
	height:50px;
}

.leftbody {
	width:900px;
	float:left;
	height:auto;
	background:#ffffff;
}
.rightbody {
	width:445px;
	float:right;
	height:400px;
	background:#FF2;
}

.formelement {
   width:220px;
   margin:6px auto; 
   height:40px;
}

.holder {
   width:220px;
   margin:1px auto; 
   height:36px;
}
.tfield{
	width:220px; 
	height:35px;
	border:1px solid #666; 
	padding-left:6px; 
	font-family:"Arial Black", Gadget, sans-serif;
	font-size:17px;
}
.button { 
	width:200px; 
	height:35px; 
	border:0px solid; 
	background-color: #FCC; 
	font-family:Verdana, Geneva, sans-serif; 
	font-size:16px
} 

.button:hover {
	background-color:#0F9; 
	font-family:Verdana, Geneva, sans-serif; 
	font-size:16px
}
.buttons { 
	width:150px; 
	height:35px; 
	border:0px solid; 
	background-color:#FF8A8A; 
	font-family:Verdana, Geneva, sans-serif; 
	font-size:16px
} 
.buttons:hover {
	background-color:#0F9; 
	font-family:Verdana, Geneva, sans-serif; 
	font-size:16px
}


.texth1{
    font-family:"Arial Black", Gadget, sans-serif;
	font-size:22px;
}

.texth2{
    font-family:"Arial Black", Gadget, sans-serif;
	font-size:18px;
}



p {
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0.5px;
    color: #484848;
}
a {
    text-decoration:none;
}
/* Accordion */
.accordion, .accordion * {
    box-sizing:border-box;
  /*  -webkit-box-sizing:border-box;*/
  /*  -moz-box-sizing:border-box;*/
}
 
.accordion {
    overflow:hidden;
    box-shadow:0px 1px 3px rgba(0,0,0,0.25);
    border-radius:3px;
    background:#00000;
}
 
/* Section Title */
.section-title {
 
    background:#FC9;
    display:inline-block;
    border-bottom:1px solid #1a1a1a;
    width:100%;
    padding:10px;
    transition:all linear 0.15s;
    color:#000000;
    font-size:14px;
    text-shadow:0px 1px 0px #1b1b1b;
}
 
.section-title.active,
.section-title:hover {
    background:#83D18E;
}
 
.section:last-child .section-title {
    border-bottom:none;
}
 
.section-title:after {
/* Unicode character for "plus" sign (+) */ 
    content: '\02795';
    font-size: 11px;
    color: #FFF;
    float: right;
    margin-left: 5px;
}
 
.section-title.active:after {
/* Unicode character for "minus" sign (-) */
     content: "\2796";

}
 
/* Section Content */
.section-content {
    display:none;
    padding:10px;
}


/* Style the navbar  para o menu dos videos*/
#navbar {
  overflow: hidden;
  background-color: #333;
}

/* Navbar links */
#navbar a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px;
  text-decoration: none;
}

/* Page content */
.content {
  padding: 16px;
}

/* The sticky class is added to the navbar with JS when it reaches its scroll position */
.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}

/* Add some top padding to the page content to prevent sudden quick movement (as the navigation bar gets a new position at the top of the page (position:fixed and top:0) */
.sticky + .content {
  padding-top: 60px;
}


/* Add a black background color to the top navigation */
.topnav {
  background-color: #333;
  overflow: hidden;
}

/* Style the links inside the navigation bar */
.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

/* Add an active class to highlight the current page */
.active {
  background-color: #04AA6D;
  color: white;
}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
  display: none;
}

/* Dropdown container - needed to position the dropdown content */
.dropdown {
  float: left;
  overflow: hidden;
}

/* Style the dropdown button to fit inside the topnav */
.dropdown .dropbtn {
  font-size: 17px;
  border: none;
  outline: none;
  color: white;
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

/* Style the dropdown content (hidden by default) */
.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;
}

/* Style the links inside the dropdown */
.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.responsive {
  width: 100%;
  max-width: 380px;
  height: auto;
}


.video {
  aspect-ratio: 16 / 9;
  width: 100%;
}