.page-template-page-simulador-de-planos-de-saude #wrapper{overflow: hidden; display: flex;}
#formulario-cotacao-com-passos{max-width: 450px; margin: 0 auto 0; padding: 35px 10px 30px 10px; display: flex; align-items: center;}
#formulario-cotacao-com-passos *{font-family: 'Barlow',sans-serif;}
#formulario-cotacao-com-passos form input::-webkit-input-placeholder{color: #bbb; font-weight: 400; font-size: 18px;}
#formulario-cotacao-com-passos form input:-moz-placeholder{color: #bbb; font-weight: 400; font-size: 18px;}
#formulario-cotacao-com-passos form input::-moz-placeholder{color: #bbb; font-weight: 400; font-size: 18px;}
#formulario-cotacao-com-passos form input:-ms-input-placeholder{color: #bbb; font-weight: 400; font-size: 18px;}
#formulario-cotacao-com-passos .passos h2{margin: 0 0 5px 0; font-size: 30px; font-weight: 500; line-height: 34px; color: #404040; text-align: left;}
#formulario-cotacao-com-passos .passos h3{margin: 0 0 70px 0; font-size: 28px; font-weight: 500; line-height: 32px; color: #777; text-align: left;}
#formulario-cotacao-com-passos label{font-size: 18px; font-weight: 400; line-height: 20px; color: #404040; margin: 0 0 5px 0; display: inline-block;}
#formulario-cotacao-com-passos input[type="text"], #formulario-cotacao-com-passos input[type="email"], #formulario-cotacao-com-passos input[type="tel"]{width: 100%; height: 50px; border: 2px solid #ccc; border-radius: 10px; outline: none; padding: 0 0 2px 15px; font-weight: 600; color: #2f5ac9; font-size: 20px; margin: 0 0 40px 0;}
#formulario-cotacao-com-passos .operadora{font-size: 18px; font-weight: 400; line-height: 20px; color: #404040; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; margin: 0 0 40px 0; padding: 10px;}
#formulario-cotacao-com-passos .operadora img{width: auto; height: 50px;}
#formulario-cotacao-com-passos input.erro{border: 2px solid red;}
#formulario-cotacao-com-passos i{width: 100%; height: 60px; background-color: #2f5ac9; border-radius: 60px; display: flex; align-items: center; justify-content: center; cursor: pointer; color: #fff; font-style: normal; font-weight: 600; font-size: 20px; -webkit-user-select: none; -ms-user-select: none; user-select: none;}
#formulario-cotacao-com-passos i:hover{background-color: #4caf50;}
#formulario-cotacao-com-passos .voltar{color: #777; font-weight: 600; margin: 35px auto 0; display: table; cursor: pointer; font-size: 16px; border-bottom: 1px solid #777;}
#formulario-cotacao-com-passos .voltar:hover{color: #4caf50; border-bottom: 1px solid #4caf50;}
.progresso{width: 20%; height: 10px; background-color: #2f5ac9; position: absolute; left: 0; bottom: -10px; -webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}


/* PASSO 2 */
#formulario-cotacao-com-passos .passo-2 h2{margin: 0 0 25px 0;}
#formulario-cotacao-com-passos .passo-2 h3{border-bottom: 1px solid #ddd; padding: 0 0 35px 0; margin: 0 0 40px 0;}
#formulario-cotacao-com-passos .passo-2 label{max-width: 250px; width: 100%; height: 60px; box-shadow: 0 2px 10px 0 rgba(0,0,0,0.2); display: flex; align-items: center; justify-content: center; border-radius: 10px; font-size: 18px; font-weight: 400; color: #666; margin: 0 auto 20px; cursor: pointer; position: relative; overflow: hidden; -webkit-user-select: none; -ms-user-select: none; user-select: none;}
#formulario-cotacao-com-passos .passo-2 label:before{width: 30px; height: 30px; content: ""; background-position: center; background-repeat: no-repeat; background-size: 30px; margin: 0 10px 0 0;}
#formulario-cotacao-com-passos .passo-2 label.whatsapp:hover{box-shadow: 0 2px 10px 0 rgba(0,0,0,0.2), 0 0 0 3px #1cc92d;}
#formulario-cotacao-com-passos .passo-2 label.email:hover{box-shadow: 0 2px 10px 0 rgba(0,0,0,0.2), 0 0 0 3px #3bbef8;}
#formulario-cotacao-com-passos .passo-2 label.whatsapp:before{background-image: url(icone-whatsapp.svg);}
#formulario-cotacao-com-passos .passo-2 label.email:before{background-image: url(icone-email.svg);}
#formulario-cotacao-com-passos .passo-2 label input{position: absolute; left: 0; top: 0; opacity: 0;}
/**/


/* PASSO 3 */
#formulario-cotacao-com-passos .passo-3 h3{border-bottom: 1px solid #ddd; padding: 0 0 35px 0; margin: 0 0 40px 0;}
#formulario-cotacao-com-passos .passo-3 span{position: relative;}
#formulario-cotacao-com-passos .passo-3 span em{position: absolute; left: 0; bottom: -17px; color: red; font-size: 14px; font-style: normal; font-weight: 600;}
/**/


/* PASSO 4 */
#formulario-cotacao-com-passos .passo-4 h2{border-bottom: 1px solid #ddd; padding: 0 0 35px 0; margin: 0 0 40px 0; color: #777;}
#formulario-cotacao-com-passos .passo-4 label{max-width: 250px; width: 100%; height: 60px; box-shadow: 0 2px 10px 0 rgba(0,0,0,0.2); display: flex; align-items: center; padding: 0 0 0 55px; border-radius: 10px; font-size: 18px; font-weight: 400; color: #666; margin: 0 auto 20px; cursor: pointer; position: relative; overflow: hidden; -webkit-user-select: none; -ms-user-select: none; user-select: none;}
#formulario-cotacao-com-passos .passo-4 label:before{width: 40px; height: 40px; content: ""; background-position: center; background-repeat: no-repeat; background-size: 40px; margin: 0 10px 0 0;}
#formulario-cotacao-com-passos .passo-4 label:hover{box-shadow: 0 2px 10px 0 rgba(0,0,0,0.2), 0 0 0 3px #1cc92d;}
#formulario-cotacao-com-passos .passo-4 label.individual:before{background-image: url(icone-individual.svg); background-size: 32px;}
#formulario-cotacao-com-passos .passo-4 label.familiar:before{background-image: url(icone-familiar.svg);}
#formulario-cotacao-com-passos .passo-4 label.empresarial:before{background-image: url(icone-empresarial.svg); background-size: 36px;}
#formulario-cotacao-com-passos .passo-4 label input{position: absolute; left: 0; top: 0; opacity: 0;}
/**/

/* PASSO 4 - EMPRESARIAL */
#formulario-cotacao-com-passos .passo-4-empresarial h2{color: #777;}
#formulario-cotacao-com-passos .passo-4-empresarial em{color: #404040; border-bottom: 1px solid #ddd; padding: 0 0 30px 0; margin: 25px 0 27px 0; display: block; font-style: normal; font-size: 18px;}
#formulario-cotacao-com-passos .passo-4-empresarial em b{font-weight: 600;}
/**/


/* REVISAO */
#formulario-cotacao-com-passos .passo-5 h2{margin: 0 0 25px 0;}
#formulario-cotacao-com-passos .passo-5 h3{margin: 0 0 40px 0;}
.revisao{border-top: 1px solid #ddd; margin: 0 0 30px 0;}
.revisao span{color: #404040; border-bottom: 1px solid #ddd; padding: 15px 0 16px 0; margin: 0; display: block; font-style: normal; font-size: 18px;}
.revisao span b{font-weight: 600; color: #404040;}
.revisao .operadora-lead{display: flex; align-items: center; justify-content: space-between; padding: 2px 0 4px 0;}
.revisao .operadora-lead img{width: auto; height: 50px;}
#formulario-cotacao-com-passos input[type="submit"]{width: 100%; height: 60px; border: none; background-color: #30c944; border-radius: 100px; outline: none; padding: 0 0 0 15px; font-weight: 600; color: #fff; font-size: 20px; margin: 15px 0 0 0; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
#formulario-cotacao-com-passos input[type="submit"]:hover{background-color: #2196f3;}
/**/


/* PASSO 6 */
#formulario-cotacao-com-passos .passo-6 h2{margin: 0 0 25px 0;}
#formulario-cotacao-com-passos .passo-6 h3{margin: 0 0 25px 0;}
#formulario-cotacao-com-passos .passo-6 h4{color: #404040; margin: 0 0 30px 0; font-style: normal; font-size: 18px;}

#formulario-cotacao-com-passos .passo-6 a{width: 100%; height: 60px; font-weight: 600; border-radius: 60px; background-color: #30c944; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 20px; text-decoration: none;}
#formulario-cotacao-com-passos .passo-6 a:hover{background-color: #4caf50;}
#formulario-cotacao-com-passos .passo-6 a:before{width: 30px; height: 30px; content: ""; background-image: url(icone-whatsapp-branco.svg); background-position: center; background-repeat: no-repeat; background-size: 30px; margin: 0 10px 0 0;}
/**/

/**/
.sucesso{width: 100%; height: 100%; display: none; position: fixed; left: 0; top: 0; z-index: 100;}
.sucesso i{width: 100px; height: 100px; border-radius: 100%; background-color: #4caf50; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; -ms-transition: all 1s ease-in-out; transition: all 1s ease-in-out;}
.sucesso:after{width: 150px; height: 150px; border-radius: 100%; background-color: #4caf50; background-image: url(sucesso.svg); background-position: center; background-repeat: no-repeat; background-size: 150px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); content: "";}
/**/

@media(max-width:767px){
    #formulario-cotacao-com-passos{padding: 80px 10px 30px 10px;}
    #formulario-cotacao-com-passos .passos h2{margin: 0 0 5px 0 !important; font-size: 28px !important; line-height: 30px; font-weight: 600;}
    #formulario-cotacao-com-passos .passos h3{margin: 0 0 25px 0 !important; font-size: 24px !important; line-height: 28px; font-weight: 600;}
    #formulario-cotacao-com-passos label{font-size: 16px; font-weight: 500;}
    #formulario-cotacao-com-passos input[type=text], #formulario-cotacao-com-passos input[type=email], #formulario-cotacao-com-passos input[type=tel]{margin: 0 0 20px 0;}
    #formulario-cotacao-com-passos .operadora{margin: 0 0 30px 0;}
    #formulario-cotacao-com-passos .passo-2 h3{margin: 10px 0 30px 0 !important; padding: 0 0 26px 0;}
    #formulario-cotacao-com-passos .passo-3 h3{margin: 10px 0 30px 0 !important; padding: 0 0 26px 0;}
    #formulario-cotacao-com-passos .passo-4 h2{margin: 0 0 30px 0 !important; padding: 0 0 26px 0;}
    #formulario-cotacao-com-passos .passo-4-empresarial em{padding: 0 0 15px 0; margin: 25px 0 15px 0;}

    #formulario-cotacao-com-passos .passo-5 h2{margin: 0 0 10px 0 !important;}
    .progresso{height: 5px; bottom: -5px;}
}

@media(max-width:500px){
    #formulario-cotacao-com-passos{width: 100%;}
    #formulario-cotacao-com-passos form{width: 100%;}
}


.fadeInRightBig{-webkit-animation:0.5s linear 1 fadeInRightBig; -moz-animation:0.5s linear 1 fadeInRightBig; -o-animation:0.5s linear 1 fadeInRightBig; animation:0.5s linear 1 fadeInRightBig;}
@-webkit-keyframes fadeInRightBig{0%{opacity: 0; -webkit-transform: translateX(2000px);} 100%{opacity: 1; -webkit-transform: translateX(0);}}
@-moz-keyframes fadeInRightBig{0%{opacity: 0; -moz-transform: translateX(2000px);} 100%{opacity: 1; -moz-transform: translateX(0);}}
@-o-keyframes fadeInRightBig{0% {opacity: 0; -o-transform: translateX(2000px);} 100% {opacity: 1; -o-transform: translateX(0);}}
@keyframes fadeInRightBig{0% {opacity: 0; transform: translateX(2000px);} 100% {opacity: 1; transform: translateX(0);}}



.fadeInLeftBig{-webkit-animation:0.5s linear 1 fadeInLeftBig; -moz-animation:0.5s linear 1 fadeInLeftBig; -o-animation:0.5s linear 1 fadeInLeftBig; animation:0.5s linear 1 fadeInLeftBig;}
@-webkit-keyframes fadeInLeftBig{0%{opacity: 0; -webkit-transform: translateX(-2000px);} 100%{opacity: 1; -webkit-transform: translateX(0);}}
@-moz-keyframes fadeInLeftBig{0%{opacity: 0; -moz-transform: translateX(-2000px);} 100%{opacity: 1; -moz-transform: translateX(0);}}
@-o-keyframes fadeInLeftBig{0%{opacity: 0; -o-transform: translateX(-2000px);} 100%{opacity: 1; -o-transform: translateX(0);}}
@keyframes fadeInLeftBig{0%{opacity: 0; transform: translateX(-2000px);} 100%{opacity: 1; transform: translateX(0);}}
