.navbar-nav .nav-item.dropdown:hover .dropdown-menu {
    display: block;
}

.nav-item .nav-link{
    color: white;
    font-size: 11px;
    font-family: 'oswald', sans-serif;


    text-transform: uppercase;
}

.mega-menu{
    background-color: transparent;

}

.dropdown:hover .dropdown.menu{
    display: block;
}

.dropdown-menu{
    border: none;
}

.dropdown-item{
    padding: 12px 40px 12px 20px;
    font-size: 15px;
    font-family: arial;
    color: white;
    font-weight: lighter;
    transform-origin: center;
    animation: rotate 0.8s ease 1;
    background-color: black;
}

@keyframes rotate{
    0%{transform: perspective(600px) rotatey(90deg); transform-origin: center;}
    100%{transform: perspective(600px) rotatey(0deg); transform-origin: center;}
}

.dropdown-item:nth-of-type(1){
    animation-delay: 0s;
}

.dropdown-item:nth-of-type(2){
    animation-delay: 0.1s;
}

.dropdown-item:nth-of-type(3){
    animation-delay: 0.2s;
}

.dropdown-item:hover{
    background-color: #ffc40c;
    color: white;
}

.navbar-brand{
    text-transform: uppercase;
    font-family: impact;
    font-size: 10px;
    color: white;


}

img{
    margin-right: 2%;
}

svg{
    color: white;
}

.navbar{
    background-color: black;
}


footer{
    background-color: black;
    }

    footer p{
        font-size: 12px;
    }

    footer a{
        font-size: 12px;
    }

footer h5{
    font-family: 'oswald', sans-serif;
}

.image-hover {
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.image-hover:hover {
    box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.3);
    transform: scale(1.03);
}

h4{
    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 40px;
}
h3{
    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 25px;
}

p{
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

h1{
    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 40px;
}
/**.animacion {
        font-size: 48px;
        text-align: center;
        animation: float 3s infinite ease-in-out, color-change 3s infinite ease-in-out;
        }
    
        @keyframes color-change {
        0% {
        color: #007bff; 
        }
        50% {
        color: #ff6347;
        }
        100% {
        color: #007bff; 
        }
        }
    */

.animacion{
    text-decoration: none;
    padding: 12px 48px;
    color: #fff;
    background: linear-gradient(to right,  #007bff, #ff04ee,  #007bff, #ec003f,  #007bff) ;
    background-position: 0;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: move 3s linear alternate infinite;
    font-weight: 700;
    font-size: 48px;
    text-transform: uppercase;
}

@keyframes move {
    0%{
        background-position:0 ;
    }

    60%{
        background-position: 180px;
    }
    100%{
        background-position: 440px;
    }
    
}