@import url('https://fonts.googleapis.com/css2?family=Lato:wght@700&family=Roboto&display=swap');

.anima, .btn, .show, .hide, .card-plan{-moz-transition:all 300ms ease; -webkit-transition:all 300ms ease; -o-transition:all 300ms ease; transition:all 300ms ease}
body{font-family: 'Roboto', sans-serif; text-align:center; min-height: 100vh; background: url(../img/bg-site.jpg) bottom center no-repeat #37B47D; background-size: cover; margin: 0; padding: 20px;}
h1, h2{font-family: 'Lato', sans-serif; font-weight: 700}
h1{font-size: 1.8em; text-align: center; line-height: 1.2em; margin: 0 0 10px; padding: 0;}

p{line-height: 1.4em; padding-bottom: 8px;}
.logo{width: 300px; padding: 30px; margin: 0 auto; text-align: center;}

input, select{border-radius: 20px; border: 1px solid #ccc; margin: 5px 0; font-size: inherit; background: #f3f3f3; padding: 10px 15px; width: 100%}
select{background: url(../img/select-icon.png) right center no-repeat #f3f3f3;}
label{display:block; margin-top: 8px; float: left; text-align: left; padding: 0 10px;}
.btn, .btn-2, .btn-3{background: #007D57; display: inline-block; margin-top: 25px; text-decoration: none; color: #FFF; border-radius: 25px; border: 0; padding: 13px 35px; width: auto;}
.btn:hover, .btn-2:hover, .btn-3:hover{background: #00c287; color: #fff; text-decoration: none; cursor: pointer;}
.btn-2{background: #c2c2c2; float: left; }
.btn-2:hover{background: #c6c6c6;}
.btn-3{background: none; border: 1px solid #FFF;}
.width50{width: 55%; float: left;}
.width40{margin-left:10px; width: calc(45% - 10px); float: left;}

.card-style{ background:#FFF; padding: 40px 30px; border-radius: 30px; max-width: 550px; min-height: 300px; margin: 0 auto;}
.card-style div:first-child{display: inline-block; width: 100%;}

.card-01, .card-01 h1, .card-01 p {text-align: center; width: 100%;}
.card-02, .card-03, .card-04, .card-05{display: none;}
.card-02 .btn, .card-03 .btn, .card-04 .btn, .card-05 .btn{float: right;}

.card-plan{width: 31%; margin: 1%; float: left; background: #c2c2c2; text-align: center; border-radius: 30px; padding: 15px;}
.card-plan:hover{background: #777; cursor: pointer;}
.card-plan img{width: 70%; padding-top: 10px;}
.card-plan h2{line-height: 1em; padding: 10px 0;}
.card-plan p{font-size: .7em; padding-top: 5px; border-top: 1px solid rgba(0,0,0,.5);}
.active{background: #007D57 !important; color: #FFF;}

.send-mail{color: #fff;}

/* de menos de 1280px*/
@media only screen and (max-width: 1279px) {
}

/* de menos de 1024px*/
@media only screen and (max-width: 1023px) {
}

/* de menos de 768px (480)*/
@media only screen and (max-width: 767px) {
    .card-plan{margin: 13px auto;  float: inherit;  width: 87%;}
    .card-plan img{width: 35%;}
}

/* de menos de 480px, minimo 320px (320)*/
@media only screen and (max-width: 479px) {
}

.error-field {
    border: 1px solid #842029;
}

.error-alert {
    color: #842029;
    float: right;
    margin-top:  8px;
}

.error-result {
    display: none;
    color: #842029;
    margin-top: 30px;
    min-height: auto;
}