:root{
    --color_one:rgba(76,73,74,1);
    --color_two:rgba(246,246,246,1);
    --color_three:rgba(149,144,146,1);
}

@font-face {
    font-family: 'Brandon Regular';
    src: url(../fonts/Brandon_reg.otf);
}

main{
    height: 100%;
}

.header{
    height: 7.2rem;
    position: relative;
}

.navbar {
    background-color: white;
    padding-top: 2.5rem;
    padding-bottom: 1.5rem;
}

.navbar-toggler{
    display: none;
}

.nav.justify-content-end .nav-item a,
.navbar-light .navbar-nav .nav-link{
    font-family: 'Brandon Regular';
    font-size: 16px;
    text-transform: uppercase;
    color: var(--color_one);
    letter-spacing: 2px;
    opacity: 0.8;
    text-decoration: none;
}

.justify-content-end {
    justify-content: flex-end !important;
    margin-right: 1.5rem;
}

.container.div_nav{
    max-width: 1430px;
}

.nav-link {
    padding: 0.5rem 1.5rem;
}

.proyect{
    position: relative;
}

.proyect a{
    cursor: pointer;
}

.sub_menu{
    display: none;
    position: absolute;
    padding: 0;
    width: 29rem;
    justify-content: space-between;
    left: -7.5rem;
}

.sub_mobile{
    display: none;
}

.sub_mobile li a{
    font-size: 14px; text-decoration: none; color: rgba(76,73,74,1); font-family: 'Brandon Regular'; text-transform: uppercase; opacity: 0.8;
}

.sub_menu ul{
   
}

.sub_menu ul li{
    margin: 0 2rem 0 0rem !important;
    list-style: none !important;
}

.sub_menu ul li a{
    text-decoration: none;
}

.proyect_active{
    display: flex;
}

.proyect_mobile{
    display: block;
}

/*================= FOOTER ====================*/
footer{
    height: 5rem;
    margin-top: 5rem;
    background-color: var(--color_two);
    
}

.footer{
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer P,
.footer a{
    font-family: 'Brandon Regular';
    font-size: 16px;
    color: var(--color_one);
    letter-spacing: 2px;
    text-decoration: none;
}

.footer P{
    margin: 0;
}

/*================= RESPONSIVE ====================*/
@media (max-width: 990px){
    .navbar-light .navbar-toggler {
        color: rgba(0,0,0,0);
        border-color: rgba(0,0,0,0);
    }
    .navbar-toggler{
        display: block;
    }
    button:focus:not(:focus-visible) {
        outline: none;
        text-decoration: none;
    }
    .nav.justify-content-end{
        display: none;
    }
    footer{
        height: 15rem;
    }
    .footer{
        flex-direction: column;
        justify-content: space-around;
    }
    .footer P {
        text-align: center;
        width: 50%;
    }
}

@media (max-width: 500px){
    .navbar-light .navbar-brand {
        color: rgba(0,0,0,.9);
        width: 12rem;
    }
    .navbar-light .navbar-brand img{
        width: 100%;
      }
    .footer P {
        width: 17rem;
    }
}