/* General Demo Style */
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);

@font-face {
	font-family: 'codropsicons';
	src:url('../fonts/codropsicons/codropsicons.eot');
	src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
		url('../fonts/codropsicons/codropsicons.woff') format('woff'),
		url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
		url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
	font-weight: normal;
	font-style: normal;
}

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body, html { font-size: 15px; padding: 0; margin: 0;}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

body {
	font-family: 'Lato', Calibri, Arial, sans-serif;
	color: #89867e;
	
}

a {
	color: #333;
	text-decoration: none;
}

a:hover {
	color: #fff;
}

.main,
.container > header {
	width: 100%;
	margin: 0 auto;
	padding: 2em;
}

.main {
	max-width: 82.667em;
	min-height: 40em;
}

.container > header {
	text-align: center;
	font-size: 16px;
	padding: 4em 2em 3em;
	background: rgba(0,0,0,0.01);
}

.container > header h1 {
	font-size: 2.625em;
	line-height: 1.3;
	margin: 0;
	font-weight: 300;
}

.container > header span {
	display: block;
	font-size: 60%;
	color: #ceccc6;
	padding: 0 0 0.6em 0.1em;
}

/* Header Style */
.codrops-top {
	background: #fff;
	background: rgba(255, 255, 255, 0.4);
	text-transform: uppercase;
	position: relative;
	width: 100%;
	font-size: 0.7em;
	line-height: 2.2;
}

.codrops-top a {
	padding: 0 1em;
	letter-spacing: 0.1em;
	color: #888;
	display: inline-block;
}

.codrops-top a:hover {
	background: rgba(255,255,255,0.9);
}

.codrops-top span.right {
	float: right;
}

.codrops-top span.right a {
	float: left;
	display: block;
}

.codrops-icon:before {
	font-family: 'codropsicons';
	margin: 0 4px;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
}
.codrops-icon-drop:before {
	content: "\e001";
}
.codrops-icon-prev:before {
	content: "\e004";
}
.codrops-icon-archive:before {
	content: "\e002";
}
.codrops-icon-next:before {
	content: "\e000";
}
.codrops-icon-about:before {
	content: "\e003";
}

@media screen and (max-width: 25em) { 
	.codrops-icon span {
		display: none;
	}
	.container > header {
		font-size: 75%;
	}
}



									
			
			.navbar2 {
			  overflow: hidden;
			  background-color: #333;
			  position: fixed;
			  bottom: 0px;
			  width: 100%;
			  font-size: 2vh;
			  z-index:9998;
			  
			  
			}

			.navbar2 a {
			  float: left;
			  display: block;
			  color: #f2f2f2;
			  text-align: center;
			  padding: 30px 10px;
			  text-decoration: none;
			  
			}
			
			.navbar2 a:hover {
			  background: #4CAF50;
			  color: black;
			}
			
			.navbar2 a.active {
			  background-color: #4CAF50;
			  color: white;
			}
			
			
			  .container2 { 
			  z-index:-1;
			   position:fixed;
			    display: grid;  
    			grid-template-columns: 1fr  ;  
				font-size: 1.vw;
				color:#000;
				top:10%;
                width: 100%;
				height: 80%;
				
				
				
				
				
				}
				.FixedHeightContainer2
				{   
					height: 90vh;   
					padding:3px; 
					overflow: auto;
				}
				
				.responsive {
  	            float:left;
				
				
				}
				
				.borda{
					-webkit-box-shadow:0px 0px 5px 0px #96adc3 ;
					-moz-box-shadow:0px 0px 5px 0px #96adc3 ;
					box-shadow:0px 0px 5px 0px #96adc3 ;
					padding:1vh;
					height: 36vh;
					background-color: rgba(255, 255, 255, 0.64);
					
					 display: flex;
					 flex-direction: row;
					 flex-wrap: wrap;
					 justify-content: center; 
					
					
					}
					
					.borda_compra{
					-webkit-box-shadow:0px 0px 13px 0px #071958 ;
					-moz-box-shadow:0px 0px 13px 0px #071958 ;
					box-shadow:0px 0px 13px 0px #071958 ;
					height: 15vh;
					
					}
				
				.grid-1 {
				  display: grid;
				  
				  width: 100%;
				  max-width: 90%;
				  margin: 0 auto;
				  color:#000;
				  
				  grid-template-columns: repeat(2, 1fr);
				  
				  grid-gap: 20px;
				  
				}
				
				/* items */
				
				.grid-1 div {
				 
				  font-size: 1.vw;
				  
					display: flex;
					align-items: center;
					justify-content: center;
					padding: 20px;
				  }
				  
				  
				  .grid-2 {
				  display: grid;
				  
				  width: 100%;
				  max-width: 90%;
				  margin: 0 auto;
				  
				  grid-template-columns: repeat(1, 1fr);
				  grid-gap: 20px;
				  
					}
				  .grid-2 div {
				 
				  
				  padding: 20px;
				  } 
				  
				  .myButton {
					box-shadow:inset 0px 1px 0px 0px #ffffff;
					background:linear-gradient(to bottom, #ededed 5%, #dfdfdf 100%);
					background-color:#ededed;
					border-radius:6px;
					border:1px solid #dcdcdc;
					display:inline-block;
					cursor:pointer;
					color:#777777;
					font-family:Arial;
					width: 22vh;
            	    height: 10vh;
					font-size: 3vh;
					
  					justify-content: center;
					
					text-decoration:none;
					text-shadow:0px 1px 0px #ffffff;
				}
				.myButton:hover {
					background:linear-gradient(to bottom, #dfdfdf 5%, #ededed 100%);
					background-color:#dfdfdf;
				}
				.myButton:active {
					position:relative;
					top:1px;
				}
				
				
			
			
			
		.barrastyleGrupo {
		
			overflow-y:hidden;
			overflow-x: hidden;
			
								
			
			}

		.barrastyleGrupo::-webkit-scrollbar-track {
			background: #FFFFFF;
		
		}
		.barrastyleGrupo::-webkit-scrollbar {
			
			height: 0.4vh;
			
			
		}
		.barrastyleGrupo::-webkit-scrollbar-thumb {
			background: #999999;
			border-radius:10px;
		}
		.barrastyleGrupo::-webkit-scrollbar-button {
			background: #FFFFFF;
		}	
			
				
				
		
		
		.barrastyle {
		
			overflow-y:scroll;
			overflow-x: hidden;
		}

		.barrastyle::-webkit-scrollbar-track {
		
		}
		.barrastyle::-webkit-scrollbar {
			
			width: 3px;
			background: #FFFFFF;
		}
		.barrastyle::-webkit-scrollbar-thumb {
			background: #FFFFFF;
		}
		.barrastyle::-webkit-scrollbar-button {
			background: #666666;
		}
				 
				
				
				#load{
				margin:0;
				padding:0;
				position:fixed;
				top:0;
				left:0;
				z-index:99999999999;
				background-color: rgba(255, 255, 255, 0.94);
				width:100%;
				height:100%;
				display:none;
				filter: alpha(opacity=65);
			}
			
			
			
				#close{
				margin:0;
				padding:0;
				position:absolute;
				top:0;
				left:0;
				z-index:11;
				
				width:100%;
				height:100%;
				display:none;
				filter: alpha(opacity=65);
			}
			
			#finalizo{
				margin:0;
				padding:0;
				position:absolute;
				top:0;
				left:0;
				z-index:11;
				background-color: #FFFFFF;
				width:100%;
				height:100%;
				z-index:1;
				display:none;
				
				filter: alpha(opacity=65);
			}
			.btimg {						
	
												width:18vh;
                              					  height:5vh;
												 border-radius:10px;
												font-size:2vh;
												
											
												 -webkit-box-shadow:0px 0px 5px 0px #96adc3 ;
													-moz-box-shadow:0px 0px 5px 0px #96adc3 ;
													box-shadow:0px 0px 5px 0px #96adc3 ;
													
												 
												 
														
						}
						
						.btimg:hover {
												 width:18vh;
                              					 height:5vh;
												 border-radius:10px;
												
												
												 -webkit-box-shadow:0px 0px 5px 0px #96adc3 ;
													-moz-box-shadow:0px 0px 5px 0px #96adc3 ;
													box-shadow:0px 0px 5px 0px #96adc3 ;
												 
												 
						
						}
						
							
							
							
							
							.opcoesmenu{
								text-align:center;
					       
                                 height:24vh;
								 width:70vh;
                                 
								 margin:2vh;
								 margin-right:2vh;
								  
								   border-radius:1vh;
									 background:#FFF;
									 font-family:Arial;
									 color:#999;
									 font-size:2vh;
									 font-weight:600;
									 padding:2vh;
									 cursor:pointer;
									  flex-direction: column;
 								 justify-content: flex-end;
								  margin-bottom: auto; 
									 
									  align-items: center;
     	  display: table-row;
           display: table;
		    -webkit-box-shadow:0px 0px 5px 0px #96adc3 ;
													-moz-box-shadow:0px 0px 5px 0px #96adc3 ;
													box-shadow:0px 0px 5px 0px #96adc3 ;
									
																		 
									 
									 
				}.opcoesmenu:hover {
						background:#FFF;
						 height:24vh;
						 width:70vh;
						border-radius:1vh;
						text-decoration: underline;
						flex-direction: column;
 						justify-content: flex-end;
						margin-bottom: auto;
				}
					
					
					
				.statcontainer {
    			display: table;
				}
				
				.stat-header {
					display: table-row;
					font-weight: bold;
					text-align: center;
				}
				
				.stat-content {
					display: table-row;
				}
				
				.stat-value {
					display: table-cell;
					border: solid;
					border-width: thin;
					padding-left: 5px;
					padding-right: 5px;
				}
						
						
				.close_div{
					z-index:99999999;
					
					position:absolute;
                             padding:0.5vh;
                             margin-top:1vh;
                             text-align:left; 
                             font-size:3vh;
                             font-weight:600;
                             color:#F00;
                             cursor:pointer;
                             margin-left:1vh; 
							 margin-top:0.5vh;
                             
                             font-family:'Arial Black', Gadget, sans-serif;
							
					}	
					
				.base_divaviso{
					 			border-radius: 10px 10px 10px 10px;
                                -moz-border-radius: 10px 10px 10px 10px;
                                -webkit-border-radius: 10px 10px 10px 10px;
                                border: 0px solid #000000;
                           
                               	 	
  								-webkit-box-shadow: 10px 10px 18px 0px rgba(3,0,3,1);
                                -moz-box-shadow: 10px 10px 18px 0px rgba(3,0,3,1);
                                box-shadow: 10px 10px 18px 0px rgba(3,0,3,1);
                                                                   
                                background:RGBA(255,255,255,100);
								
					}
					
					.base_mae{
						 z-index:99999;
						 position:absolute;
						 
						 align-items: center;
						 display: flex;
						 flex-direction: row;
						 flex-wrap: wrap;
						 justify-content: center;
						 
						 width: 100%;
						visibility:hidden; 
						 height:100%;
						 
						 top:0px;
						
						 
										}	
										
										
					.divtxtavisos{
					 margin-top:5vh;
                                         
                                        color:#666666;
                                        font-family:Arial;
                                        font-size:2vh;
                                        font-weight:bold;
                                     
                                        
                                        text-align:center;
                                        
                                         display: flex;
                                          justify-content: center;
                                          align-items: center;
                                        width:90%;
                                        margin:auto;
                                     
                                        border:groove;
                                        background:RGBA(0,0,0,0.06);	
										
						
					}					
						

				.bordeseparete{
					border-bottom: 1pt solid black; border-color:#CCC
					}
					
					
					.txtcad{
	
							 box-shadow:inset 0px 1px 0px 0px #ffffff;
                                background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
                                background-color:#ffffff;
                                border-radius:28px;
                                border:1px solid #dcdcdc;
                                display:inline-block;
                                cursor:pointer;
                                color:#666666;
                                font-family:Arial;
                                font-size:2vh;
                                font-weight:bold;
                                padding:1vh;
                                text-decoration:none;
                                text-shadow:0px 1px 0px #ffffff;  
                                margin-top:3vh;
                                color:#666;
                                width:50%;
	
	}
	
	
	
	.btgruposs{
		
		
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
	background-color:#ffffff;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:#666666;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff; 
		
		}
		
		
	.bordertop{
					border-radius: 18px 13px 13px 13px;
                    -webkit-border-radius: 18px 13px 13px 13px;
                    -moz-border-radius: 18px 13px 13px 13px;
                    border: 3px solid #2a2221;
                    box-shadow: 11px 13px 5px -9px rgba(0,0,0,0.85);
                    -webkit-box-shadow: 11px 13px 5px -9px rgba(0,0,0,0.85);
                    -moz-box-shadow: 11px 13px 5px -9px rgba(0,0,0,0.85);
		
		
		}