*{
    margin: 0;
    border: 0;
    padding: 0;
    box-sizing: border-box;
}

details > summary {
    list-style: none;
  }
  details > summary::-webkit-details-marker {
    display: none;
  }

.mapBox{
position:relative;
width: 500px;
height: 500px;
margin-top: 20px;
margin-left: auto;
margin-right: auto;

margin-bottom: 20px;

}

@media(min-width: 200px) and (max-width: 720px){
    .mapBox{
    margin-top: 15px; 
    margin-bottom: 15px;   
    width: 250px;
    height: 250px;
    margin-left: auto;
    margin-right: auto;
    }
}

.mapBox iframe{
    width: 500px;
    height: 500px;
    
  
}

@media(min-width: 200px) and (max-width: 720px){
    .mapBox iframe{
        width: 250px;
        height: 250px;
       
        
    }
}
html{
    font-size: 62.5%;
    scroll-behavior: smooth;
}
header{
    
    position:absolute;
    margin: 0;
    width: 100%;
    top: 0;
    background-color: rgba(248,242,242,255);

   


   }
@media(min-width: 200px) and (max-width: 720px){
    header{
        padding-top: 5%;
        
        text-align: center;
        
    }
}

body{
    background-color:white;
    margin: 0;
    padding: 0;
    
}




.container{
    
    
    width: 95%;
    box-shadow: 2px 2px 20px rgb(225, 166, 236);
    margin: 0 auto;
    max-width: 90%;
    max-height: 90%;
    min-width: 0;
    min-height: 0;
    margin-top: 40px;
}



footer{
    font-family: helvetica;
    background-color: rgba(248,242,242,255);
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    
}



p{
    font-family: helvetica;
    text-align: justify;
    padding: 10px;
    font-size: 1.6rem;
    color: rgb(32, 50, 204);

}
.nomeintro{
    font-family: helvetica;
    
    text-align: center;
    margin-top: 3%;
    font-size: 2.5rem;
    color: white;
}

.texto-footer{
    text-align: center;
    font-family: helvetica;
    font-size: 1.6rem;
    padding-bottom: 10px;
    padding-top: 10px;
    color: rgb(12, 123, 197);

}
.sobre-info{
    text-align: center;
    color: rgb(249, 248, 249);


}

.sobre-info2{
    text-align: center;
    color: rgb(108, 60, 127);


}



.opcoes{
    text-align: right;
    color: grey;
    margin-top: 6%;
    font-family: helvetica;
    font-weight: bold;
    font-family: arial;
    font-size: 1.5rem;
    margin-right: 2%;
    word-spacing: 15px;
    display:inline;
    
}

@media(min-width: 200px) and (max-width: 720px){
    .opcoes{
        text-align: right;
        color: grey;
        margin-top: 25%;
        font-family: helvetica;
        font-weight: bold;
        font-family: arial;
        font-size: 1.1rem;
        margin-right: 5%;
        word-spacing: 10px;
        
        
        
    }
}



#headid img{
    float: left;
    width: 10%;
    background: #555;
    

}

@media(min-width: 200px) and (max-width: 720px){
    #headid img{
        float: left;
        width: 30%;
        background: #555;
        
        
        
    }
}






nav{
    float: right;
    text-align: right;
    color: grey;
    margin-top: 2%;
    font-weight: bold;
    font-family: helvetica;
    font-size: 1.5rem;
    margin-right: 2%;
    word-spacing: 15px;
    margin-bottom: 1%;
    
}
@media(min-width: 200px) and (max-width: 720px){
    nav{
        text-align: right;
        color: grey;
        margin-top: 2%;
        font-weight: bold;
        font-family: helvetica;
        font-size: 1.5rem;
        margin-right: 2%;
        word-spacing: 15px;
        
    }
}

.sobre4{
    text-align: center;
    font-size: 1.2rem;
    color: rgb(37, 33, 37);
}

.hoverzinhos{
    display: none;
    
}
.hoverzinhos:target{
    display: block;
    
}
a {
    text-decoration: none;
    color:rgb(61, 60, 60);
    transition: all 300ms ease-in-out;
    
}
a:hover{
    color: rgb(230, 162, 240);
}
.sobre3:hover{
    color: rgb(61, 56, 61);
}

.quadradinhos{
    margin: auto;
    background-color: rgb(174, 145, 212);
    width: 20rem;
    height: 7rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    margin-top: 1%;
    text-align: center;
    color: white;
    font-size: 1.8rem;
    font-family: helvetica;
}

.sobre{
    font-family: helvetica;
    text-align: center;
    color:rgb(86, 85, 85);

}

.localizacao{
    font-family: helvetica;
    text-align: center;
    color:rgb(86, 85, 85);
    font-size: 3.8rem;

}


@media(min-width: 200px) and (max-width: 720px){
    .localizacao{
        font-family: helvetica;
        text-align: center;
        color:rgb(86, 85, 85);
        font-size: 1.8rem;
        
    }
}

.sobre3{
    font-family: helvetica;
    text-align: center;
    color:rgb(255, 255, 255);
    font-size: 1.5rem;

}


.sobre2{
    text-align: center;
    color:rgb(86, 85, 85);
}

.footinfo{

    text-align: center;
    color:rgb(86, 85, 85);
    font-size: 2.8rem;
}


@media(min-width: 200px) and (max-width: 720px){
    .footinfo{
        text-align: center;
        color:rgb(86, 85, 85);
        font-size: 1.3rem;
        
    }
}

.footinfo2{
    text-align: center;
    color:rgb(86, 85, 85);
    font-size: 2.8rem;
}


@media(min-width: 200px) and (max-width: 720px){
    .footinfo2{
        text-align: center;
    color:rgb(86, 85, 85);
    font-size: 1.3rem;
        
    }
}

.footinfo5{
    text-align: center;
    color:rgb(86, 85, 85);
    font-size: 2.8rem;
    margin-bottom: 5%;
    
}


@media(min-width: 200px) and (max-width: 720px){
    .footinfo5{
        text-align: center;
        color:rgb(86, 85, 85);
        font-size: 1.3rem;
       
        
    }
}


.container3{
    display: block;
    margin: auto;
    width: 100%;
    box-shadow: 0px 1px gray;
    
    max-width: 100%;
    max-height: 90%;
    min-width: 0;
    min-height: 0;
    
}


.container5{
    display: flex;
    box-shadow: 0px 1px gray;
    padding-bottom: 20px;
   
    
}


@media(min-width: 200px) and (max-width: 720px){
    .container5{
        display:flex;
        box-shadow: 0px 1px gray;
        padding-bottom: 12px;
        
    }
}


#eu{
    width: 100%;
    
    border-radius: 0%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
    
    
}

@media(min-width: 200px) and (max-width: 720px){
    #eu{
    width: 100%;
    border-radius: 0%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 25%;
        
        
        
    }
}



#eu2{
    width: 20%;
    border-radius: 50%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
    
    
}


@media(min-width: 200px) and (max-width: 720px){
    #eu2{
        width: 50%;
        border-radius: 50%;
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-top: 15px;
        
    }
}



.logozin{
    width: 3%;
    display:inline-block;
    align-items: center;
    
    
   
}

@media(min-width: 200px) and (max-width: 720px){
    .logozin{
        width: 10%;
        
        align-items: center;
        
        
        
    }
}

.logozap2{
    width: 3%;
    display:inline-block;
    align-items: center;
    
   }

   @media(min-width: 200px) and (max-width: 720px){
    .logozap2{
        width: 10%;
        
        align-items: center;
        
        
        
    }
}







.container2{
    
    color:rgb(61, 60, 60);
    margin: 0 auto; 
    width: 450px;
    grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));
    grid-gap: 5px;
    height: 450px;
    text-align: center;
    box-shadow: 2px 2px 20px rgb(225, 166, 236);
    
}

@media(min-width: 200px) and (max-width: 720px){
    .container2{
        color:rgb(61, 60, 60);
        margin: auto;
        text-align: center;
        width: 45%;
        height: 335px;
        box-shadow: 2px 2px 20px rgb(225, 166, 236);
        
        
    }
}



#apt{
    
    margin: 0 auto; 
    width: 450px;
    grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));
    height: 450px;
}

@media(min-width: 200px) and (max-width: 720px){
    #apt{
        
        width: 45%;
        height: 335px;
        margin: auto;
        
    }
}

@font-face {
    font-family: f1;
    src: url("/SiteVic/Assets/LHANDW.TTF");
  }

@font-face {
    font-family: f2;
    src: url("/SiteVic/Assets/BentonSans\ Light.otf");
}

.copyright{
    font-size: 1.2rem;
    font-family: helvetica;
    color: rgb(127, 60, 127);
    text-align: center;


}
.marcus{
    color: rgb(127, 60, 127);
    font-size: 1.1rem;
    font-family: helvetica;
    text-align: center;
}