@import '../bootstrap/css/bootstrap.min.css';
@import 'fontes.css';
@import 'padroes.css';
@import 'animacao.css';

@font-face {
    font-family: 'Poppins-Bold';  
    src: url('../fonts/Poppins/Poppins-Bold.ttf') format('truetype');
    font-display: swap;
}
@font-face {
    font-family: 'Poppins-Light';  
    src: url('../font/Poppins/Poppins-Light.ttf') format('truetype');
    font-display: swap;
}
@font-face {
    font-family: 'Poppins-Regular';  
    src: url('../fonts/Poppins/Poppins-Regular.ttf') format('truetype');
    font-display: swap;
  }
body{
    font-family: 'Poppins-Regular';
}
.logo {
    position: absolute;
    margin-top: 25px;  
    z-index:2;  
    width: 50px;
}
.menu {
    list-style: none;
    margin:0;
    padding: 0;
    overflow: hidden;
}
.menu li {
    float: left;
    padding: 0.3rem 1.5rem;
}
.menu li a {
    font-size: 0.875rem;
    color: #FFFFFF; 
    font-family: 'Poppins-Bold'; 
    text-decoration: none;
    opacity: 0.5;
    transition: all 0.33s;
}
.menu li a:hover {
    opacity: 1;
    transition: all 0.33s;
}
.menu li.active a {
    opacity: 1;
}
.menu li.emphasis a{
    background: #364B84;
    border-radius: 4px;
    padding: 0.3rem 1.5rem;
    color: #FFFFFF;
    opacity: 1;
    transition: all 0.33s;
}
.menu li.emphasis:hover a {
    color: #FFFFFF;
    box-shadow: 0px 0px 10px #FFFFFF;
    transition: all 0.33s;
}

.banner {
    /*height: 30vh;*/	
    background-image: url('../imgs/banner.jpg');
    background-repeat: no-repeat;
    background-size: cover;

}
.banner .info {
    width: 100%;
    color: #FFFFFF;    
    animation-name: aparecer;
    animation-duration: 2s;    
}
.banner .info p:first-of-type {
    font-size: 1.5rem;
    font-family: 'Poppins-Bold';  
}
.banner .info p {
    font-size: 1.0rem;
}
.banner img{
    /*width: 100%;*/
    height: 100%;
}
.btn-link {
    background: #FFB22B;
    border: 1px solid #FFB22B;
    color: #FFFFFF;
    text-transform: uppercase;
    font-family: 'Poppins-Bold'; 
    font-size: 1rem;
    border-radius: 4px;
    text-decoration: none;
    padding: 1rem 1.8rem;
    display: inline-block;
    cursor: pointer;      
    
    position: relative;
    z-index: 1;
    overflow: hidden;
	right: -80%;		
}
.btn-link:hover {    
    color: #FFB22B;
    border: 1px solid #FFB22B;
}
.btn-link::after {
    content: "";
    background: #ecf0f1;
    position: absolute;
    z-index: -1;
    padding: 0.85em 0.75em;
    display: block;
    transition: all 0.35s;
}
.btn-link.slide_left::after {
    top: 0;
    bottom: 0;
    left: -100%;
    right: 100%;
}
.btn-link.slide_left:hover::after {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    transition: all 0.35s;
}
.cards-home { 
    margin-top: 0px;
}
.box-round  {
    border-radius: 30px;
    box-shadow: 0px 3px 20px #0000001A;
    transition: all 0.35s;
}
.box-round.ativo {
    cursor: pointer;
    border:1px solid #FFFFFF;
}
.box-round.ativo:hover {
    box-shadow: 0px 3px 20px #00000000;
    border:1px solid #c1e0fb;
    transition: all 0.35s;
}
.cards-home .box-round p:first-of-type {
    font-size: 1.125rem;
    color: #181C32; 
}
.cards-home .box-round p {
    font-size: 0.875rem;
    color: #99ABB4;
}
.border-card {
    border-top:2px solid #c3c3c3;
}
.icon-in-input {
    float: right;
    margin-top: -36px;
    padding-right: 15px;    
}
.label-circle{
    width: 30px;
    height: 30px;
    display: inline-block;
    border-radius: 50%;
    padding: 1px;
    text-align: center;    
}
.passos.ativo .label-circle{
    background: #1D89E4;
    color: #FFFFFF;
}
.passos.inativo .label-circle{
    background: none;    
    border:1px solid #ABABAB;
}
.passos.inativo {
    color: #ABABAB;
}
.passos.concluido .label-circle{
    border: 1px solid #1D89E4;   
    background-image: url('../imgs/done_24dp.svg');
    background-position: center;
    text-indent: -9999px;
}


.show-password-1 {
    cursor: pointer;
}
.tela-inativa {
    display: none;
}
.tela-ativa {
    display: flex;
}
@media  (min-width:576px)
{
    .logo {
        width: 72px;
    }

    .banner .info {
        /*position: absolute;
        z-index:1;*/
        width: 100%;
        color: #FFFFFF;
        /*margin-top: 12%;*/
    }    
    .banner .info p:first-of-type {
        font-size: 1.5rem;
        font-family: 'Poppins-Bold';  
    }
    .banner .info p {
        font-size: 1.313rem;    
    }    

}
@media  (min-width:768px)
{
    .cards-home { 
        margin-top: -67px;        
    }
    .banner {
        height: 400px;
        /*height: 69vh;*/
        overflow: hidden;
    }
    .banner img {
        width: 100%;
        height: 100%;
    }    

    .cards-home{
        animation-name: baixoCima;
        animation-duration: 1s; 
    }
    .cards-home .box-round p:first-of-type {
        font-size: 1.0rem;        
    }
    .cards-home .box-round p {
        font-size: 0.8rem;        
    }   
    .border-card {
        border-top:0px;
        border-left:2px solid #c3c3c3;
    } 
}

@media  (min-width:992px)
{
    .banner {
        /*height: auto;*/
        /*height: 69vh;*/
        overflow: hidden;
    }    
    .banner .info p:first-of-type {
        font-size: 1.5rem;
        font-family: 'Poppins-Bold';  
    }
    .banner .info p {
        font-size: 1.313rem;    
    }
}

@media  (min-width:1200px)
{
    .banner {
        height: 430px;
    }
    .banner .info {
        margin-top: 7%;
    }
    .banner .info p:first-of-type {
        font-size: 2.5rem;        
    }
    .banner .info p {
        font-size: 1.313rem;
    }
}

@media  (min-width:1400px)
{
    .banner {
        height: 900px;
        overflow: hidden;
    }    
}