@charset "utf-8";
/* CSS Document */

body{
	margin:0;
	font-family: 'Montserrat', sans-serif;
	overflow-x:hidden;
	font-size: 1.4vw;
	background-color: #f0ebe5;
	color: #1b4144;
}
.row{
	position:relative;
	float:left;
	width:100%;
}
a{
	text-decoration:none;
	color: inherit;	
}
.linha{
	position:relative;
	float:left;
	width:100%;	
}
.center{
	text-align:center;
}
.div33{
	position:relative;
	float:left;
	width:33.33%;	
}
.div46{
	position:relative;
	float:left;
	width:46%;
	margin: 0 2%;
}

.div60{
	position:relative;
	float:left;
	width:60%;
	margin: auto 20%;
}
.div50{
	position:relative;
	float:left;
	width:50%;
}
.centro{
	text-align:center;	
}
.div90{
	position:relative;
	float:left;
	width:90%;	
}
.div80{
	position:relative;
	float:left;
	width:80%;	
}
.div70{
	position:relative;
	float:left;
	width:70%;	
}
.div36{
	position:relative;
	float:left;
	width:36%;
	margin: auto 1%;	
}
.div25{
	position:relative;
	float:left;
	width:25%;	
}
.div20{
	position:relative;
	float:left;
	width:20%;
	margin: auto 2.5%;	
}
.div18{
	position:relative;
	float:left;
	width:16%;
	margin: auto 1%;	
}
.div46{
	position:relative;
	float:left;
	width:30%;
	margin-left:12%;
	margin-right: 4%;	
}
.top10{
	margin-top:10px;	
}
.top20{
	margin-top:20px;	
}
.top50{
	margin-top:50px;	
}
.margem5{
	margin:5%;	
}
.resultado{
	font-size: 3em;
}
.sorteio{
	font-size: 0.4em;
}
.leftTriangle{
	position:fixed;
	left: -15vw;
	top:-20%;
}
.rightTriangle{
	position:fixed;
	right: -45vw;
	top:-20%;
}
.triangle img{
	height: 120vh;
}
.centerBox{
	position: fixed;
    width: 25vw;
    height: 25vw;
    border: 20px solid #aa9450;
    left: 38vw;
    margin-left: -30px;
    top: 20vh;
    border-radius: 30px;
	text-align: center;
	font-size: 2em;
	display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.downText{
	position: fixed;
    width: 100vw;
    bottom: 50px;
    font-size: 1.8em;
    color: #FFF;
    text-align: center;
}
.timeBar{
	position: fixed;
	width: 100vw;
	height: 5px;
	top: 0;
	background-color: #aa9450;
}
#confetti{
	display: none;
}
#novamente{
	display: none;
}
.logo{
	position: fixed;
    width: 400px;
    top: 28px;
    left: 50%;
    margin-left: -200px;
}
.logo img{
    width:100%;
}
.registrationLogo{
	margin-top: 40px;
	margin-bottom: 20px;
}
.registrationTitle{

}
.button {
    font-family: inherit;
    font-size: 1.2em;
    padding: 8px 15px;
    background-color: #ac934c;
    color: #FFF;
    border: 2px solid #85733e;
    border-radius: 5px;
}
.btDisabled{
	background-color: #969696;;
    border: 2px solid #575757;
}
.form{
	position:relative;
	float:left;
	width: 80%;
	margin: 30px 10%;
}
.registrationInput, select{
	width: 90%;
    font-size: 1.4em;
    padding: 10px 5%;
    background-color: #1b4144;
    border: 2px solid #c7d303;
    border-radius: 6px;
    color: #bbb;
}
select{
	width: 101%;
}
.passBox{
	position: fixed;
	width:100%;
	height: 100%;
	background-color: #444;
	color:#FFF;
	z-index: 20;
	display: none;
}
.keyBox{
    position: fixed;
    bottom: 193px;
    text-align: center;
    font-size: 1.4em;
    width: 100%;
}
.rowPassLegend{
    text-align: center;
	margin-top: 8vh;
}
.passIndexLegend{
	font-size: 1em;
}
.pass{
	width: 200px;
    position: fixed;
    top: 20vh;
    height: 70px;
    padding: 20px 0;
    left: 50%;
    margin-left: -103px;
    font-size: 3em;
    text-align: center;
    background-color: #000;
    color: #FFF;
    border: 3px solid #85733e;
	border-radius: 10px;
}
.enterPass{
	width: 300px;
    position: fixed;
    top: 30vh;
    height: 80px;
    padding: 20px 0;
    left: 50%;
    margin-left: -153px;
    font-size: 3em;
    text-align: center;
    background-color: #000;
    color: #FFF;
    border: 3px solid #85733e;
	border-radius: 10px;
}

.indexPassBox{
	display: block;
}
.indexPass{
	text-transform: uppercase;
}
.divqr{
	width:100%;
	position: fixed;
	top: 40vh;
}
.divqr img{
	width: 200px;
}
.rowPassLegend{
	margin-top: 8vh;
}
#participar{
	width: 300px;
	position: fixed;
	top: 60vh;
	height: 70px;
	padding: 20px 0;
	left: 50%;
	margin-left: -145px;
	text-align: center;
	border-radius: 10px;
	font-family: inherit;
    font-size: 1.2em;
    padding: 8px 15px 10px;
    background-color: #c7d303;
    color: #000;
    border: 2px solid #98a004;
    border-radius: 5px;
	text-transform: uppercase;
}
#autorizacao, #cooperado{
	all: unset;
    border: 2px solid #85733e;
    width: 16px;
    height: 16px;
    display: inline-block;
    background: #000;
}
#autorizacao:checked, #cooperado:checked {
	background-color: rgb(0, 189, 9);
	width: 19px;
	height: 19px;
  }
#novamente{
	position: fixed;
    top: 29px;
    right: 2%;
    /* margin-left: -52px; */
    z-index: 50;
	background-color: #0e4d26;
    border: 2px solid #64c732;
}
#btnler{
	position: fixed;
    width: 300px;
    font-size: 1em;
    /* height: 40px; */
    left: 50%;
    margin-left: -165px;
    top: 43vh;
}

#qqr{
	position: fixed;
    top: 55vh;
    left: 50%;
    margin-left: -160px;
}




.col{
	position:relative;
	float:left;
	width: 100%;
	height: 1600px;
	
}
.centro{
    position: absolute;
    width: 500px;
    height: 500px;
    left: 50%;
    margin-left: -255px;
    top: 100px;
    overflow: hidden;
    border: 10px solid #aa9450;
    border-radius: 10px;
    box-shadow: 0px 0px 20px #000;
    background-color: #000;
	z-index: 10;
}
.bgcentro{
	position:absolute;
	width:100%;
	height: 100%;
		background: linear-gradient(0deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 15%, rgba(0,0,0,0) 85%, rgba(0,0,0,0.9) 100%);
	z-index: 10;
}
.quadro{
	position:relative;
	width: 98%;
	margin: 0 1%;
	height:500px;
}
/*.q1{ background-color: #FDBEBF; }
.q2{ background-color: #DC1115; }
.q3{ background-color: #211FC5; }
.q4{ background-color: #1BBB2D; }
.q5{ background-color: #B9A203; }*/
.quadros{
	display: none;
}
.alavanca{
    position: absolute;
    top: 140px;
    left: 50%;
    margin-left: 265px;
}
.alavanca img{
	width: 180px;
}
.gs{
    filter: grayscale(1);
}
.frenteCentro{
	position:absolute;
	width:100%;
	height:100%;
	z-index: 100;
}
.frente1{
	position: absolute;
	top:0;
	width: 100%;
	height: 50%;
	background-color: #CCC;
	border-bottom: 2px solid #d3bf80;
	background: linear-gradient(180deg, #aa9450, #d3bf80);
}
.frente2{
	position: absolute;
	bottom:0;
	width: 100%;
	height: 50%;
	background-color: #CCC;
	border-top: 2px solid #d3bf80;
	background: linear-gradient(0deg, #aa9450, #d3bf80);
}
.participe{
	z-index: 30;
    position: absolute;
    color: #3b3b3b;
    width: 100%;
    font-size: 2.6em;
    font-weight: 800;
    top: 100px;
	text-shadow: 2px 2px 2px #eddba0;
}



@media only screen and (max-width: 600px) {
   body{
	font-size: 18px;

   }  
   .centerBox{
	position: fixed;
    width: 70vw;
    height: 70vw;
    border: 4px solid #aa9450;
    left: 15vw;
    margin-left: -2px;
    top: 20vh;
    border-radius: 10px;
    text-align: center;
    font-size: 1.3em;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
   } 
   .rowPassLegend{
	margin-top: 5vh;
	font-size: 1em;
   } 
   .passIndexLegend, .downText{
	font-size: 1.3em;
   }
   .downText{
	bottom: 30vh;
   }
   .pass{
		top: 16vh;
   }
   #btnler{
	top:38vh;
   }
   #qqr {
		top: 50vh;
	}
}

@media only screen and (min-width: 1400px) {
	.enterPass{
		font-size:2.2em;
	}
	.downText{
		bottom: 10vh;
	   }
}