html{overflow-x:hidden;max-width:100vw;}
body{overflow-x:hidden;height:100%;margin:0;padding-right:0!important;padding-left:0!important; background-color: #002F03;}
.container-fluid{padding: 0;}
.navbar-toggler:focus,.navbar-toggler-icon:focus,.form-control:focus,.form-select:focus {outline: none; box-shadow: none;}

/*topo*/
.navbar{background-color: #004412!important; padding-top: 20px; padding-bottom: 20px; font-family: 'Lato Medium'; position: fixed; width: 100%; z-index: 10;}
.navbar-toggler{border: 0}
.navbar-toggler span {display: block;  background-color: #fff;  height: 3px;  width: 32px;  margin-top: 0px;  margin-bottom: 5px;  position: relative;  left: 0;  opacity: 1;  transition: all 0.35s ease-out;  transform-origin: center left;}
.navbar-toggler span:nth-child(1) {  transform: translate(0%, 0%) rotate(0deg);}
.navbar-toggler span:nth-child(2) {  opacity: 1;}
.navbar-toggler span:nth-child(3) {  transform: translate(0%, 0%) rotate(0deg);}
.navbar-toggler span:nth-child(1) {  margin-top: 0.3em;}
.navbar-toggler:not(.collapsed) span:nth-child(1) {  transform: translate(15%, -194%) rotate(45deg);}
.navbar-toggler:not(.collapsed) span:nth-child(2) {  opacity: 0;}
.navbar-toggler:not(.collapsed) span:nth-child(3) {  transform: translate(15%, 33%) rotate(-45deg);}
.navbar li{padding-left: 10px; padding-right: 10px;}
.navbar li a{color: #fff!important; font-size: 15px; font-weight: 500;}
.navbar li a:hover{color: #EABE46!important;}
.navbar .nav-item .active{color: #EABE46!important;}
.navbar p{font-family: 'Lato Medium'; color: #fff; line-height: 10px;}
.navbar p b{font-family: 'Lato Heavy'; color: #F6BF36;}

/*com participar*/
.como-participar{background-color: #104319; padding-top: 50px; padding-bottom: 10px; margin-top:-300px; }
.como-participar .trevo-1{width:15%}
.como-participar .trevo-2{width:15%; margin-right:-50px}
.como-participar .trevo-3{width:30%; margin-left:-150px; margin-top: -65px; position: relative;}
.como-participar .trevo-4{width:15%; margin-right:-50px; margin-bottom: -100px;}
.como-participar h2{font-family: 'Lato Heavy'; color: #fff; text-transform: uppercase; border:2px solid #FFC52D; width:450px; padding: 10px; border-radius: 35px; margin-left: auto; margin-right: auto; margin-bottom:25px}
.como-participar p{font-family: 'Lato Medium'; font-size:18px; color: #fff}
.como-participar h3{font-family: 'Lato Bold'; color: #EABE46; text-transform:uppercase;}
.como-participar ul{list-style-type: none; padding-left: 0px; margin-top: 20px; font-family: 'Lato Medium'; font-size:18px; color: #fff}
.como-participar ul b{font-family: 'Lato Heavy'; color: #EABE46; font-size: 18px}
.como-participar small{font-family: 'Lato Medium'; font-size:16px; color: #fff}
.como-participar .btn-cad{width:50%; transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: pointer;}
.como-participar .btn-cad:hover{transform: scale(1.05); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);}
.como-participar .hover{transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: pointer;}
.como-participar .hover:hover{transform: scale(1.05);}

/*cadastre*/
.cadastre{padding-top: 60px; padding-bottom: 60px;}
.cadastre h2{font-family: 'Lato Medium'; color: #fff; text-transform: uppercase;}
.cadastre h2 b{font-family: 'Lato Heavy'; color: #EABE46;}
.cadastre #btn-enviar{background-color:transparent; border:0}
.cadastre .form-control {width: 600px; margin-left: auto; margin-right: auto; height: 50px; border-radius: 25px; font-family: 'Lato Medium'; font-size: 20px; text-align: center;}
.cadastre p{font-family: 'Lato Medium'; font-size: 16px; color: #fff; margin-top: 10px}
.cadastre p b{color: #EABE46;}
.cadastre p span{display: block;}
.cadastre .btn-cad{width:80%; transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: pointer;}
.cadastre .btn-cad:hover{transform: scale(1.05); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);}
.cadastre .btn-cad2{transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: pointer;}
.cadastre .btn-cad2:hover{transform: scale(1.05); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);}

/*mecanica*/
.mecanica{background-color: #104319; padding-top: 60px; padding-bottom: 60px; background-image: url("../images/trevo-2.png"); background-repeat:no-repeat; background-position: center right 750px; background-size: 7%} 
.mecanica h2{font-family: 'Lato Heavy'; color: #fff; text-transform: uppercase; border:2px solid #FFC52D; width:450px; padding: 10px; border-radius: 35px; margin-left: auto; margin-right: auto; margin-bottom:25px}
.mecanica p{font-family: 'Lato Medium'; font-size: 18px; color: #fff; margin-top: 10px}
.mecanica .trevo-1{width:20%; margin-left:-100px; margin-bottom: -100px;}
.mecanica h3{font-family: 'Lato Heavy'; color: #EABE46;}
.mecanica .space{margin-top: 85px;}
.mecanica .space2{margin-top: 95px;}
.mecanica .space3{margin-top: 75px;}
.mecanica .space4{margin-top: 65px;}
.mecanica .space5{margin-top: 100px;}

/*sorteios*/
.sorteios{padding-top: 60px; padding-bottom: 60px;}
.sorteios h2{font-family: 'Lato Heavy'; color: #fff; padding-bottom:25px}
.sorteios h2 b{color:#EABE46}
.sorteios h2 span{display:block;}
.sorteios p{font-family: 'Lato Medium'; font-size: 18px; color: #fff; margin-top: 10px}
.sorteios .bg-1 {background-color: #EABE46; padding: 15px 28px 15px 28px; border-radius: 50px; font-family: 'Lato Medium'; color: #002f03; font-size: 20px; line-height: 22px; text-align:center; transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: pointer;}
.sorteios .bg-1:hover{transform: scale(1.05); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);}
.sorteios .bg-2 {background-color: #fff; padding: 15px 28px 15px 28px; border-radius: 50px; font-family: 'Lato Medium'; color: #002f03; font-size: 20px; line-height: 22px; text-align:center; transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: pointer;}
.sorteios .bg-2:hover{transform: scale(1.05); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);}
.sorteios .titsort{width:30%}
.sorteios .trevo-1{margin-top: -200px; width: 13%;}

.box-sorteio h3{font-family: 'Lato Bold'; color:#fff; text-transform:uppercase; font-size: 15px; border:2px solid #FFC52D; width:100%; padding: 10px; border-radius: 35px; text-align:center;}
.box-sorteio h4{font-family: 'Lato Bold'; color:#EABE46; text-transform:uppercase; font-size: 12px; text-align:center; padding-bottom: 10px}
.box-sorteio p{font-family: 'Lato Bold'; color:#fff; font-size: 13px;}
.box-sorteio .icon{float:left; margin-right: 8px}
.box-sorteio .bg{background-image: url("../images/btn-bg-sorteio.png"); background-repeat: no-repeat; background-position: center; color: #002F03!important;}

/*faq*/
.faq{background-color: #104319; padding-top: 60px; padding-bottom: 60px;}
.faq h2{font-family: 'Lato Heavy'; color: #fff; text-transform: uppercase; border:2px solid #FFC52D; width:480px; padding: 10px; border-radius: 35px; margin-left: auto; margin-right: auto; margin-bottom:25px}
.faq .accordion-item{background-color: #fff!important; border:1px solid #fff; border-radius: 25px 25px 25px 25px!important; color: #fff; margin-bottom: 5px; padding: 15px 10px 15px 10px;}
.faq .accordion-item a{color: #fff}
.faq .accordion-button{border:0; background-color: #fff!important; margin-bottom: 0px; font-family: 'Lato Heavy'; color: #002F03!important; font-size: 20px; border-radius: 50px 50px 50px 50px!important;}
.faq .accordion-button span{ font-family: 'Lato Heavy'; font-size: 22px; padding-right: 5px; color: #002F03}
.faq .accordion-button:not(.collapsed) {color: #232e34;    background-color: #fff!important; box-shadow:inset 0 -1px 0 rgb(0 0 0 / 0%); border-radius: 50px 50px 0 0!important;}
.faq .accordion-button:focus {    z-index: 3;    border-color: #e2343c;    outline: 0; box-shadow: 0 0 0 0 rgb(226 52 60 / 25%); color: #232e34; }
.faq .accordion-body{font-family: 'Lato Medium'; color: #002F03; font-size: 15px; margin-bottom: 0px;}
.faq .accordion-button::after {background-image: url("../images/more-n.png"); --bs-accordion-btn-icon-width: 2.25rem;}
.faq .accordion-button:not(.collapsed)::after {background-image: url("../images/more-n.png");}
.faq .accordion-body p{font-family: 'Lato Medium'; font-size: 16px; color: #002F03;}
.faq .accordion-body a{color: #0086ff;}
.faq .accordion-body li{font-family: 'Lato Medium'; font-size: 16px;}

.faq h4{font-family: 'Lato Heavy'; color: #fff; padding-bottom: 20px; text-align: center;}
.faq .btn-success{font-family: 'Lato Medium'; font-weight: 600; text-transform: uppercase; border-radius: 25px; padding-right: 85px; padding-left: 85px; padding-top: 10px; padding-bottom: 8px; background-color: #FFC52D; border-color: #FFC52D; font-size: 19px; color:#002F03}
.faq .btn-success:hover{background-color: #002f03; border-color: #002f03; color:#fff }
.faq .form-control{font-family: 'Lato Medium'; padding-bottom: 15px; font-size: 15px; color: #000; border-color: #D7D7D7; padding-top: 20px; color: #002f03;}
.faq .form-control::placeholder{color: #364B46;}
.faq .innerLabel {margin-top: 3px;  position: absolute;  margin-left: 14px;  color: #364B46;  font-size: 12px; z-index: 10; font-family: 'Lato Medium';}

/*regulamento*/
.regulamento{ padding-top: 60px; padding-bottom: 60px;}
.regulamento h2{font-family: 'Lato Heavy'; color: #002F03; text-transform: uppercase; border:2px solid #EABE46; background-color: #EABE46; width:580px; padding: 10px; border-radius: 35px; margin-left: auto; margin-right: auto; margin-bottom:25px}
.regulamento h6{font-family: 'Lato Heavy'; color:#EABE46; font-size: 18px;}
.regulamento p{font-family: 'Lato Medium'; font-size: 16px; color: #fff;}

/*footer*/
footer{background-color: #fff; padding-bottom: 80px; padding-top: 80px;}

/*meus-numeros*/
.meus-numeros{padding-top: 120px; padding-bottom: 60px;}
.meus-numeros h2{font-family: 'Lato Heavy'; color: #fff; text-transform: uppercase; border:2px solid #FFC52D; width:520px; padding: 10px; border-radius: 35px; margin-left: auto; margin-right: auto; margin-bottom:35px; text-align: center;}
.meus-numeros .table{--bs-table-bg:transparent}
.meus-numeros .table th{font-family: 'Lato Bold'; text-transform: uppercase; color: #FFC52D; text-align: center; font-size: 18px;}
.meus-numeros .table td{font-family: 'Lato Medium'; color: #fff; font-size: 16px; text-align: center;}
.meus-numeros h6{font-family: 'Lato Medium'; color: #fff; font-size: 16px; text-align: center;}
.meus-numeros p{font-family: 'Lato Medium'; font-size: 16px; color: #fff;}

/*editar-dados*/
.editar-dados{padding-top: 120px; padding-bottom: 60px;}
.editar-dados h2{font-family: 'Lato Heavy'; color: #fff; text-transform: uppercase; border:2px solid #FFC52D; width:400px; padding: 10px; border-radius: 35px; margin-left: auto; margin-right: auto; margin-bottom:35px; text-align: center;}
.editar-dados .form-control{height: 50px; border-radius: 25px; font-family: 'Lato Medium'; font-size: 20px;}
.editar-dados .form-check-label{color: #fff; font-family: 'Lato Bold'; font-size: 14px; line-height: 16px;}
.editar-dados .form-check-input{background-color: #FFC52D; border: 0;}
.editar-dados .btn-warning{background-color: #FFC52D; border: 0; color: #002F03; font-family: 'Lato Bold'; font-size: 18px; padding: 10px 30px 10px 30px; border-radius: 50px; margin-top: 20px; text-transform: uppercase; transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: pointer;}
.editar-dados .btn-warning:hover{transform: scale(1.05); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);}
.editar-dados .form-control:disabled{background-color: #ccc;}
.editar-dados p{font-family: 'Lato Bold'; font-size: 16px; color: #fff;}

/*modal*/
.modal-backdrop {--bs-backdrop-bg: #002F03; --bs-backdrop-opacity: 0.6; z-index: 11}
.modal-header{border-bottom: 0; padding: 15px;}
.modalcarrega{border-radius: 15px; background-color: transparent; border-color: transparent;}
.modalcarrega h6{font-family: 'Lato Medium'; font-size: 14px; color: #fff}
.modal-bg{background-color: #104319; border: 0;}
.modal-bg h6{font-family: 'Lato Bold'; color: #FFC52D; font-size: 18px; text-align: center; text-transform: uppercase;}
.modal-bg h6 b{font-family: 'Lato Heavy'; color: #fff; font-size: 20px;}

/*error*/
.error{font-family: 'Lato Bold'; color: #FFC52D; font-size: 16px; margin-top: 5px;}
.form-control.is-valid, .was-validated .form-control:valid{background-image: none;}

/*media*/
@media (min-width: 1920px) {
.como-participar{margin-top:-250px}
.mecanica{background-position: center right 550px;} 
}

@media (max-width: 1680px) {
.como-participar{margin-top:-200px}
}

@media (max-width: 1536px) {
.mecanica{background-position: center right 400px; background-size: 10%} 
}

@media (max-width: 1440px) {
.como-participar{margin-top:-180px}
}

@media (max-width: 1400px) {

}

@media (max-width: 1366px) {
.mecanica .space{margin-top: 60px;}
.mecanica .space2{margin-top: 65px;}
.mecanica .space3{margin-top: 35px;}
.mecanica .space4{margin-top: 55px;}
.mecanica .space5{margin-top: 60px;}
.mecanica{background-position: center right 300px; background-size: 10%} 
}

@media (max-width: 1280px) {
.como-participar{margin-top:-150px}
.mecanica{background-position: center right 250px; background-size: 10%} 
}

@media (max-width: 1200px) {

}

@media (max-width: 1024px) {
.navbar li{padding-left: 5px; padding-right: 5px;}
.como-participar{margin-top:-130px}
.como-participar .trevo-4{margin-right:-25px; margin-bottom: -80px;}
.mecanica .space{margin-top: 30px;}
.mecanica .space2{margin-top: 35px;}
.mecanica .space3{margin-top: 20px;}
.mecanica .space4{margin-top: 25px;}
.mecanica .space5{margin-top: 30px;}
.mecanica{background-position: center right 150px; background-size: 10%} 
.como-participar .btn-cad{width:60%}
.cadastre .form-control {width: 500px;}
.sorteios h2 span{display:inline;}
}

@media (max-width: 991px) { 
.navbar li{padding-left: 0px; padding-right: 0px;}
.navbar-collapse{padding-top:20px;}
.navbar li a{font-size: 17px;}
.navbar p{padding-top:20px}
.como-participar .trevo-1{margin-left:-50px}
.como-participar h3{font-size: 20px}
.como-participar .trevo-4{margin-right:-25px; margin-bottom: -60px;}
.mecanica .trevo-1{width:25%; margin-left:-160px; margin-bottom: -100px;}
.mecanica .space{margin-top: 105px;}
.mecanica .space2{margin-top: 110px;}
.mecanica .space3{margin-top: 65px;}
.mecanica .space4{margin-top: 95px;}
.mecanica .space5{margin-top: 110px;}
.mecanica{background-position: center right 20px; background-size: 12%} 
.como-participar .btn-cad{width:85%}
.cadastre .btn-cad{width:85%}
footer .logo{width: 40%;}
}

@media (max-width: 768px) {
.banner{margin-top: 100px;}
.como-participar{margin-top:-90px}
.como-participar .trevo-3{margin-left:-100px;}
.mecanica{background-position: center right -100px; background-size: 12%} 

}

@media (max-width: 767px) {

}

@media (max-width: 480px) {
.como-participar{margin-top:-60px}
.como-participar .trevo-2{width: 20%; margin-right:-15px}
.como-participar .trevo-1{margin-left:-15px}
.como-participar h2{width:260px; padding: 10px; border-radius: 35px; margin-left: auto; margin-right: auto; font-size: 20px;}
.como-participar .trevo-3{display:none}
.como-participar .trevo-4{margin-right:-15px; margin-bottom: -40px;}
.cadastre .form-control {width: auto; font-size: 16px;}
.mecanica h2{width:260px; padding: 10px; border-radius: 35px; margin-left: auto; margin-right: auto; font-size: 20px;}
.mecanica .trevo-1{width:25%; margin-left:-35px; margin-bottom: -60px;}
.mecanica .space{margin-top: 45px;}
.mecanica .space2{margin-top: 70px;}
.mecanica .space3{margin-top: 25px;}
.mecanica .space4{margin-top: 70px;}
.mecanica .space5{margin-top: 100px;}
.mecanica h3{font-size: 18px}
.mecanica p{font-size: 15px}
.cadastre .btn-cad{width:75%}
.sorteios .bg-1{width:80%; margin-left:auto; margin-right:auto}
.sorteios .bg-2{width:80%; margin-left:auto; margin-right:auto}
.sorteios .titsort{width:50%}
.box-sorteio h3{font-size: 11px; padding: 4px;}
.box-sorteio h4{font-size: 11px;}
.box-sorteio p{font-size: 11px;}
.sorteios .trevo-1{display: none;}
.faq h2{width:300px; padding: 10px; border-radius: 35px; margin-left: auto; margin-right: auto; font-size: 20px;}
.faq .accordion-button{ font-size: 18px;}
.faq .accordion-body{font-size: 16px;}
.regulamento h2{width: 100%; font-size: 20px;}
.cadastre p span{display: inline;}
.meus-numeros h2{width: 100%; font-size: 20px;}
.meus-numeros .table th{text-align: left; font-size: 15px;}
.meus-numeros .table td{font-size: 14px; text-align: right;}
footer .logo{width: 55%;}
}

@media (max-width: 390px) {
.como-participar{margin-top:-50px}
.mecanica .space{margin-top: 40px;}
.mecanica .space2{margin-top: 65px;}
.mecanica .space3{margin-top: 25px;}
.mecanica .space4{margin-top: 70px;}
.mecanica .space5{margin-top: 80px;}
.mecanica h3{font-size: 15px}
.mecanica p{font-size: 12px}
}

@media (max-width: 320px) {
.navbar li a{font-size: 14px;}
.navbar p{font-size: 13px;}
.mecanica .trevo-1{width:25%; margin-left:-45px; margin-bottom: -60px;}
.mecanica h3{font-size: 14px}
.mecanica p{font-size: 11px}
.mecanica .space{margin-top: 25px;}
.mecanica .space2{margin-top: 45px;}
.mecanica .space3{margin-top: 25px;}
.mecanica .space4{margin-top: 50px;}
.mecanica .space5{margin-top: 60px;}

}