/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 22-05-2023, 14:39:24
    Author     : 204797692
*/


.row{
      margin: 0px;
      padding: 0px;
}

.sombra{
    filter: drop-shadow(2px 2px 1px #00000060);
    
}
.trapecio-top {
    margin:auto;
    width: 100%;
    height: 10vh;
    
    
    
}
.grad-barra{
    background-image: linear-gradient(90deg, #764001 0%, #ff7300 45%, #ff7300 55%, #764001 100%);
}

.grad-barra-azul{
    background-image: linear-gradient(90deg,#01428c 0% , #01428c 50% , #01428c 100%);
}
.footer-db {
    
    min-height:15vh;
    background-color: #13223A; 
    border-top: 2px solid #ff7300
}
    .footer-info{
        
        width: max-content;
        margin:auto auto auto 3% !important
    }
    
    .escudos{
        
        width: max-content !important; 
        margin: auto 0 auto 0 !important;
        padding: 0 !important;
    }
    .escudos img{

        height: 100%;
        padding: 10px;
    }
    .direbien{
        padding: 0 !important;
        width:max-content !important;
        margin: auto 0 auto 0 !important; 
    }
    .direbien div{
        color:#ffffff;
    }
    .sblogo-mini{
        margin: auto !important
    }
    
    .ico-fono {
       vertical-align: middle;
    }
    .wsp-contact{
        padding:0px !important;
        background-color: rgb(19 187 53) ;
        width: 100px  !important; 
        height: 80px !important;
        position : fixed;
        bottom: 30px;
        right: 0%;

        border-radius: 50px 0% 0% 50px;
        z-index: 1;

    }
    .wsp-contact:before{
        border-radius: 50px 0% 0% 50px;
        content:'';
        background:linear-gradient(160deg,  rgba(13,233,57,1) 0%, rgba(11,149,41,1) 100%);
        /*background-image: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(253,29,29,1) 50%, rgba(252,176,69,1) 100%);;*/
        position: absolute;
        content: '';
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        opacity: 0;
        transition: opacity .4s;
    }
    .wsp-contact:hover:before{
        opacity:1;
    }
@media (max-width:480px){
    .trapecio-top {
        --altura: 30%;
        --altura2: 100%;
        --ancho : 55%;
        --angulo: 13%;
        
        clip-path: polygon( 0% 0%, 
                            100% 0%,
                            100% var(--altura), 
                            calc( calc( 100% - calc( calc(100% - var(--ancho))/2 )) + var(--angulo) ) var(--altura), 
                            calc( 100% - calc( calc(100% - var(--ancho))/2 )) var(--altura2) , 
                            calc( calc(100% - var(--ancho))/2 ) var(--altura2),
                            calc(calc( calc(100% - var(--ancho))/2 ) - var(--angulo))var(--altura), 
                            0% var(--altura) );

    }

    .logosb{
        margin:auto;
        height: 100% !important;
        max-height:80px; 
        padding:20px;
    }
     .escudos{
        height:50px ;
    }
    .txtsize{
        font-size:10px
    }
    .sblogo-mini{
        display:none
    }
    .ico-fono{
        width:11px;
        
    }
    .wsp-contact{
        display: none;
    }
}

@media only screen and (min-width:481px) and (max-width:800px){
    .trapecio-top {
       
        --altura: 30%;
        --altura2: 100%;
        --ancho : 55%;
        --angulo: 10%;
        clip-path: polygon( 0% 0%, 
                            100% 0%,
                            100% var(--altura), 
                            calc( calc( 100% - calc( calc(100% - var(--ancho))/2 )) + var(--angulo) ) var(--altura), 
                            calc( 100% - calc( calc(100% - var(--ancho))/2 )) var(--altura2) , 
                            calc( calc(100% - var(--ancho))/2 ) var(--altura2),
                            calc(calc( calc(100% - var(--ancho))/2 ) - var(--angulo))var(--altura), 
                            0% var(--altura) );

    }

    .logosb{
        margin:auto;
        height: 100% !important;
        padding:15px;
    }
    .escudos{
        height:60px ;
    }
    .txtsize{
        font-size:12px
    }
    .sblogo-mini{
        display:none
    }
    .ico-fono{
        width:13px
    }
    .wsp-contact{
        display: none;
    }
}
@media only screen and (min-width:801px) and (max-width:1200px){
    .trapecio-top {
        
        --altura: 30%;
        --altura2: 100%;
        --ancho : 42%;
        --angulo: 10%;
        clip-path: polygon( 0% 0%, 
                            100% 0%,
                            100% var(--altura), 
                            calc( calc( 100% - calc( calc(100% - var(--ancho))/2 )) + var(--angulo) ) var(--altura), 
                            calc( 100% - calc( calc(100% - var(--ancho))/2 )) var(--altura2) , 
                            calc( calc(100% - var(--ancho))/2 ) var(--altura2),
                            calc(calc( calc(100% - var(--ancho))/2 ) - var(--angulo))var(--altura), 
                            0% var(--altura) );

    

    }

    .logosb{
        margin:auto;
        height: 100% !important;
        padding:10px;
        max-height: 100px;
    }
    .escudos{
        height:80px ;
    }
    .txtsize{
        font-size:15px
    }
    .ico-fono{
        width:15px
    }

}

@media (min-width: 1201px){
    .trapecio-top {
       
        --altura: 30%;
        --altura2: 100%;
        --ancho : 30%;
        --angulo: 5%;
        clip-path: polygon( 0% 0%, 
                            100% 0%,
                            100% var(--altura), 
                            calc( calc( 100% - calc( calc(100% - var(--ancho))/2 )) + var(--angulo) ) var(--altura), 
                            calc( 100% - calc( calc(100% - var(--ancho))/2 )) var(--altura2) , 
                            calc( calc(100% - var(--ancho))/2 ) var(--altura2),
                            calc(calc( calc(100% - var(--ancho))/2 ) - var(--angulo))var(--altura), 
                            0% var(--altura) );

    

    }

    .logosb{
        margin:auto;
        height: 100% !important;
        padding:10px;
    }
    .escudos{
        height:80px ;
    }
    .txtsize{
        font-size:15px
    }
    .ico-fono{
        width:15px
    }
}
