.button{
    width:30px;
    height:30px;
    position:fixed;
    z-index:20;
    top:25px;
    right:35px;
    border:unset;
    cursor: pointer;
    background-color: transparent; 
    display: none;
    }
    .button:after{
    content: "";
    width: 100%;
    height: 100%;
    background-color: #000000;
    position: absolute;
    top:0;
    left:0;
   
    
    clip-path: polygon(0%0%,50%0%,100%0%,100%20%,50%20%,0%20%,0%0%,0%40%,50%40%,100%40%,100%60%,50%60%,0%60%,0%40%,0%80%,50%80%,100%80%,100%100%,50%100%,0%100%,0%80%);
    transition: 0.3s ease-in;
    }
    .icon:after{
   
    clip-path: polygon(0%20%,50%0%,100%20%,100%40%,50%20%,0%40%,0%20%,0%50%,50%30%,100%50%,100%70%,50%50%,0%70%,0%50%,0%80%,50%60%,100%80%,100%100%,50%80%,0%100%,0%80%);
    /* background-color: rgb(255, 255, 255); */
    transition: 0.3s ease-in;
    
    }
    @media only screen and (max-width: 1050px){
        
           
     
        .button{
            display: block;
           
        }
    }
    .bg--menu,
    .bg--menu .bloque--uno,
    .bg--menu .bloque--uno a {
        display:flex;
        align-items:center;
        flex-direction:column;
        }

        .bg--menu .bloque--uno{
        width:100%;
       gap: 20px;
        }
        
        .bg--menu .bloque--uno a{
            padding: 10px;
            text-align: start;
        text-decoration:none;
        justify-content:center;
        color:black;
       font-weight: 600;  
        /* font-size:13px; */
        letter-spacing:2px;
      
       
     
        }
       
        
        
        .bg--menu{
      
        position:fixed;
        width:100%;
        height:100vh;
        justify-content:
        center;
        background-color: white;
        top:-100%;
        opacity: 0;
        transition:0.5s ease-in-out;
        z-index: 15;
        }
        
        

        .headerOn{  
        top:0;
        opacity: 1;
        transition:0.5s ease-in-out;
        }
     
        .logos{
            color: hotpink;
            font-size: 50px;
        }

        .redes--bg{
            width: auto;
            position: absolute;
            left: 25px;
            top: 25px;
        
            display: flex;
            justify-content: center;
            flex-direction: column;
            gap: 30px;
            
        }