/*Sección Banner Empieza*/
.bannerHeading{
    margin-top: 4.5rem;
    min-height: 30vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 100%;
    width: 100%;
    cursor: default;
    background: #f1f1f1;
}

.bannerHeading .container{
    width: 100%;
    height: 100%;
    background: linear-gradient(0, #000, #333333);
    border-radius: 15px;
    padding: 1rem;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.bannerHeading .container h1{
    font-size: clamp(.7rem, 2vw, .9rem);
    font-weight: 400;
    color: #fff;
}

.bannerHeading .container h2{
    font-family: var(--QuickSand);
    font-size: clamp(2rem, 3vw, 3rem);
    color: rgb(255, 187, 0);
    font-weight: bold;
}

.bannerHeading .container h3{
    color: #ffffff;
    font-weight: 400;
    font-size: clamp(.7rem, 2vw, 1rem);
}


.bannerHeading .container .glovoLink{
    color: #e2ff5e;
    font-weight: 400;
    margin-bottom: 1rem;
    font-size: clamp(1rem, 3vw, 1.1rem);
    width: max-content;
    display: flex;
    align-items: center;
    gap: .5rem;
}

.bannerHeading .container .glovoLink i{
    font-size: clamp(1.7rem, 3vw, 1.9rem);
}

.bannerHeading .container .rrsslinks{
    display: flex;
    align-items: center;
    width: 100%;
    gap: .5rem;
    margin-block: .2rem;
}
.bannerHeading .container .rrsslinks a{
    font-size: clamp(1.5rem, 3vw, 2rem);
    color: #fff;
}

.bannerHeading .container .rrsslinks a:hover{
    color: transparent;
    background: linear-gradient(45deg, yellowgreen, yellow);
    background-clip: text;
}

.bannerHeading .container .call{
    margin-top: auto;
    width: max-content;
    padding: .5rem 2rem;
    background:#d0ff00 ;
    border-radius: 25rem;
    color: #000;
    font-weight: 900;
    letter-spacing: 1px;
}



.bannerHeading .linksBanner{
    width: 100%;
    margin-block: .5rem;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(5rem, 1fr));
    gap: .5rem;
}


@media(max-width:1200px){
    
    .bannerHeading .linksBanner{
        justify-content: center;
    }
    
}

.bannerHeading .linksBanner a{
    background: #f1f1f1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: .6rem;
    border-radius: 15px;
    padding:.5rem;
    color: #777;
    box-shadow: 0 5px 12px rgba(0,0,0, .250);
    font-weight: 800;
    gap: .3rem;
    border-top: 2px solid #fff;
    border-bottom: 2px solid #f0f0f0;
    border-left: 2px solid #fff;
    
}
.bannerHeading .linksBanner a:hover{
    background: #333333;
    color: #eee;
    border-top: 2px solid #727272;
    border-left: 2px solid #727272;
    border-bottom: 2px solid #424242;
    box-shadow: 0 8px 15px rgba(0,0,0, .5);
}

/*Sección Banner Termina*/