*{
    margin: 0;
    padding: 0;
    font-family: 'Montserrat', sans-serif;
}

header{
    width:100%;
    display: flex;
    background-color: black;

}

.logotipo img{
    max-width: 100px;
    margin: 5px 15px;
}

header .login{
    margin: 5px 15px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}
header .login a{
    text-decoration: none;
    color: #fff;
    font-size: 32px;
}


nav{
    margin: 0px auto;

}

nav ul{
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
    text-align: center;
}

nav ul li{
    display: inline-block;
    background-color: black;
}

nav a{
    display: block;
    padding: 0px 20px;
    color: #fff;
    font-size: 16px;
    line-height: 60px;
    text-decoration: none;
}

nav a:hover{
    background-color: #000;
}

nav ul ul{
    display:none;
    position:absolute;
    top:60px;
    z-index: 999;
}

/* nav ul li > ul:hover{
    display:block;
} */

nav ul li:hover > ul{
    display:block;
}
nav ul li:hover .down{
    transform: rotate(0deg);
}

nav ul ul li{
    width: 180px;
    float: none;
    display: list-item;
    position: relative;
    left: 0;
}

nav ul ul li:hover{
    background-color: red;
}
.down{
    transform: rotate(-90deg);
}

#header{
    width:100%;
    background-color: white;
    text-align: center;
    color: black;
    height: 60vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.container{
    width: 100wh;
    height: 100%;
    display: flex;
    justify-content: space-around;
    padding: 20px 100px;
    margin-top: 0px;
}
main {
    text-align: center;
    min-height: 600px;
    flex: auto;
    padding: 25px;
}


footer{
    background-color: #222121;
    color: #fff;
    padding: 35px 0px 0px 0px;
    /* position: absolute; */
    bottom: 0;
}

.footer{
    margin: 0px auto;
    max-width: 50%;
    text-align: center;
}

.footer h2{
    font-size: 42px;
    margin-bottom: 20px;
}

.social{
    margin: 40px auto;
    max-width: 50%;
    text-align: center;
    display: flex;
    justify-content: space-around;
}
.social a{
    color: #fff;
    text-decoration: none;
    font-size: 42px;
}

footer .footer-bottom{
    background-color: #000;
    padding: 20px;
    margin-top: 10px;
}


.form-contact{
    display: flex;
    flex-direction: column;
    width: 60%;
    margin:20px auto;
}

.form-contact label,
.form-contact input{
    margin:5px 0px;
}
.form-contact input{
    border-radius: 5px;
    padding: 10px 5px;
}

.form-contact textarea{
    border-radius: 5px;
    padding: 10px 5px;
    margin:5px 0px;
}

.btn{
    padding: 15px 20px;
    border-radius: 10px;
    width: auto;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
}

.mt-5{
    margin-top: 30px;
}

.map{
    margin-top: 80px;
    margin-right: 10px;
    box-shadow: 0px 3px 20px 3px #162433;
}

.p-5{
    padding: 20px 30px;
}

.btn-primary{
    background-color: #162433;
    color: #fff;
    border:none
}

.alert{
    margin: 20px 0px;
    padding: 15px 10px;
    border-radius: 15px;
    border:0.5px solid #ccc;
}

.alert-danger{
    background-color: red;
    color: #fff;
}

#login{
    width: 300px;
    min-height: 300px;
    margin: 50px auto;
    border-radius:10px;
    border:1px solid #000;
    box-shadow: 5px 5px 10px rgba(0,0,0, 0.75);
    padding: 20px 30px;
}

#login form{
    margin: 10px auto;
    text-align: center;
}

#login form label{
    display: block;
    margin-top:20px;
    margin-bottom: 10px;
}

#login form input{
    border-radius: 5px;
    padding: 5px 10px;
    margin-bottom: 20px;
    width: 80%;
}

#login button{
    margin-bottom: 15px;
}

.text-center{
    text-align: center;
}

a{
    text-decoration: none;
    color:#162433;
    font-weight: bold;
}