* {
     
    box-sizing: border-box;
}

html, body{
    
    width: 100%;
    margin: 0;
    background-color: rgb(248, 248, 248);
    background-color: rgb(236, 236, 236);
    
    
    font-family: 'Spartan', sans-serif;
    
  
}

.botonmenu{
    display: none;
    
}

.header{
    background-color: aquamarine;
    background-color: white;
    display: flex  ;
    flex-wrap: nowrap;
    
    margin:0;
    flex-direction: column;
    margin-right: 20vh;
    margin-left: 20vh;
    margin-top: 10vh;
    margin-bottom: 10vh;
    
}

    .menu{
        background-color: white;
        display:flex;
        flex-wrap: nowrap;
        
        flex: 1 1 auto;
        flex-direction: row;
        height: 180px;
        
        

    }

        .logo {
            background-color: white;
            
            display: flex;
            flex-wrap: nowrap;
            flex: 1 1 auto;
            
            
            font-family: 'Wire One', sans-serif;
            font-family: 'Spartan', sans-serif;
               
            color: bisque;
            display: none;
            
            
        }

       
        .imglogo{
            height: 40px;
            width: 40px;
            
            
            
        }

        .imgiso{
            height: 80px;
            width: 80px;
            margin-top: 0px;
            
            
            margin-bottom: 0px;
        }

        .nav {
            background-color: white;
            
            
            display: flex;
            flex-wrap: nowrap;
            flex: 1 1 auto;
            flex-direction: row;
            align-items: center;
            color: white;
            font-size: 18px;
            justify-content: space-between;
            margin-left: 25vh;
            margin-right: 25vh;
            align-self: center;
            
            
        }

        .nav a {    
            font-size: 14px;
            width: 20%;
            color:  black;
            text-decoration: none;
            font-weight:300;
            margin-top: 30px;
            flex: 1 1 auto;
            font-family: 'Spartan', sans-serif;
            margin-left: 0%;
            background-color:white;
            display: flex;
            justify-content: center;
            text-align: center;
            position: relative;
            padding: 0.2em 0;       

            ;
            
        }

        

        .nav a:hover{
            font-weight: 500;
            

        }

        .activo{
            margin-top: 0px;
            font-weight:500;


        }


        .social {
            background-color: white;
            display: flex;
            flex-wrap: nowrap;
            flex: 1 1 auto;
            flex-direction: row;
            justify-content: right;
            align-self: center;
            
            color: black;
            font-size: 18px;
            display: none;

        }

            .direccion{
                margin-top: -10px;
                text-decoration: none;
            }

            .terms{
                text-decoration: none;
                color: white;
            }

    .cartelera{
        background-color: white;
        background-position: center;
        background-attachment: contain;
        background-size: cover;
        display: flex;
        flex-wrap: nowrap;
        flex-direction: column;
        
        flex: 1 1 auto;
        padding: 0px;
        padding-top: 0px;
        margin-top: 20px;
        margin-left: 0px;
        margin-bottom: 50px;
        color: white;
        
        
        
        
    }

    .contenedor{
        position: relative;
        display: inline-block;
        text-align: center;
        width: 100%;
        height: 20vh;
        color: black;
        
        
    }

    .contenedor:hover{
        background-color: black;
        color: white;
        
    }
    
    
    .centrado{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        
    }
    

    .exposicion {
        
        padding: 0px;
        margin-top: 40px;
        display: flex;
        flex-wrap: nowrap;
        font-size: 40px;
        font-weight: bold;
        color: black;
        justify-content: center;
        
        
    }
    .artista{
        display: flex;
        flex-wrap: nowrap;
        
        font-size: 45px;
        font-weight:300;
        
        justify-content: center;
        text-align: center;
        
    }

    .cartel1{
        
        color: bisque;
        margin: 0px;
        
        margin-top: 0px;
        margin-bottom: 0px;
        font-weight: 400;
        font-family: 'Spartan', sans-serif;
        display: flex;
        flex-wrap: nowrap;
        color: black;
        justify-content: center;
        font-size: 60px;
        
        
    }

    

    .cartel2{
        font-size: 15px;
        color: bisque;
        font-weight: bold;
        width: auto;
        
        margin-left: 25vh;
        margin-top: 10vh;
        margin-right: 25vh;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        color: black;
        justify-content: center;
        
        
        
    }

    .cuadro{
        display: flex;
        flex-wrap: nowrap; 
           
        padding: auto;
        color: black;
        
        justify-content: center;
        
        
        
        
        width: auto;
        background-color:rgb(236, 236, 236);
        background-color: rgb(248, 248, 248);
        background-color: #F3F3F3;
        
    }

    .imgcuadro{

        border-color: black;    
        border-width: 0px;          
        image-rendering: optimizeQuality;
        width: auto;
        border-radius: 2px;
    }

    

    .linea{
       
        background-color: black;
        margin-right: 25vh;
        margin-left: 25vh;
        
        margin-top: 10px;
        height: 0.5px;
        color: white;
    }

    

            .btnsubasta{
                background-color:black;
                border-color:black;
                color: white; 
                font-weight: 300;
                padding: 15px;
                
                font-size: 15px;
            }

            .btnsubasta:hover{
                background-color:rgb(56, 56, 56);
                border-color:rgb(56, 56, 56);
                color: white; 
            }

            #exampleModalToggle{
                font-weight: 300;
            }

            h5{
                font-weight: bolder;
            }

        .logosolo{
            height: 5vh;
            width: 5vh;
            align-self: center;
        }
        .divlogosolo{
            align-self: center;
            padding: 5vh;
        }

        .terms{
            text-decoration: none;
            margin-top: 0px;
            font-size: 14px;
            letter-spacing: 2rem;
            font-weight: bold;
            
            letter-spacing: .01em;
            color: #acacac;
            letter-spacing: .1rem;
    }

    .redes{
            margin-top: -10px;
            font-size: 25px;
            letter-spacing: 2rem;
            font-weight: bold;
            
            
            color: #acacac;
            letter-spacing: .2rem;
    }

    .redes:hover, .terms:hover{

            color: white;
    }

        .whatsapp {
            position:fixed;
            width:40px;
            height:40px;
            bottom:20px;
            right:20px;
            background-color: rgba(0, 0, 0, 0.212);
            color:rgb(255, 245, 245);
            border-radius:50px;
            text-align:center;
            font-size:30px;
            z-index:100;
          }
          
          .whatsapp-icon {
            margin-top:5px;
          }
          .whatsapp-icon:hover{
            color: black;
        }
  

          .orden-nav{
              margin-right: 0vh;
          }

          .margen-nav{
              margin-left: -0%;
          }
          .mapa{
            width: 80vh;
            height: 40vh;
            align-self: center;
        }

        .contacto1{
            text-align: center;
        }
        
            
    
@media all and (max-width:1035px) {

   

    .header{
        flex-direction: column;
        margin-right: 10vh;
        margin-left: 10vh;
        background-color: rgb(18, 18, 19);
}
        
    .menu{
       
        flex-direction: row;
        align-items: center;
        background-color: white;
        display: flex;
        flex-wrap: nowrap;
        text-align: left;
      
        margin: 15px;
     
    }    


    

    .imglogo{
        display:inline;
        height: 40px;
        width: 40px;
        margin: 0px;
        
        
    }

    .nav {
        align-self:center;
        justify-content: left;
        margin-left: 30px;
        
    }

    .nav a{
        display: none;
    }

    .imgiso{
        display:block;
        width: 40px;
        height: 40px;
        
    }

     
        

    .logo{
            display: inline;
            background-color: WHITE;
            display: flex;
            flex-wrap: nowrap;
            flex: 1 1 auto;
            height: 40px;
            width: 40px;
            margin-left: 5vh;
        }
        
    .botonmenu{
        display: inline;
        margin-right: 30px;
        
    }    

    #offcanvasExample{
        background-color:rgb(18, 18, 19) ;
        color: white;
        font-size: 20px;
    }

    .botonmenu .btn {
        background-color:white ;
        border-color: white;
        color: black;
        
    }

    .botonmenu .btn:hover{
        background-color:black ;
        border-color: black;
        color:white;
    }
    .btn:active{
        background-color:black ;
        border-color: black;
        color:white;
    }
    

    .linkmenu{
        text-decoration: none;
        color: white;
    }

    

    .artista{
        
        
        font-size: 32px;
        
    }
    .cartel1{
        font-size: 40px;
    }

    .cartel2{
        
        
        margin-left: 10vh;
        margin-top: 10vh;
        margin-right: 10vh;
       
        
    }

    
    @media all and (max-width:700px){
        .imgiso{
            width: 40px;
            height: 40px;

    }

    .header{
        
        margin-right: 5vh;
        margin-left: 5vh;
        margin-top: 0%;
        margin-bottom: 0%;
       
        
    }
    
        .menu{
            background-color: white;
            display:flex;
            flex-wrap: nowrap;
            
            flex: 1 1 auto;
            flex-direction: row;
            height: 80px;
            
            
            
    
        }

    .exposicion {
        
        
        font-size: 32px;
        
        
        
    }
    .artista{
        
        
        font-size: 22px;
        
    }
    .obras{
        
        
        margin-top: 20px;
        
        
        }
        
        
    

    .linea{
       
        background-color: black;
        margin-right: 5vh;
        margin-left: 5vh;
        
        margin-top: 10px;
        height: 0.5px;
        color: white;
    }

    .offcanvas-body{
        height: 100vh;
    }
     
    .contacto{
        display: flex;
        align-self: flex-end;
        justify-content: flex-end;
    }


    .descripcion{
        
        
        font-size: 15px;
        

    }

    h3{
        font-weight: 900;
        font-size: 20px;
    }

    }

    
    .cartel2{
        
        
        margin-left: 5vh;
        margin-top: 10vh;
        margin-right: 5vh;
       
        
    }
        
      
    @media all and (max-width:600px){
        
          

        .header{
            margin-left: 0px;
            margin-right: 0px;
            margin-top: 0px;
            
        }

        
            

        .imglogo{
           
            margin-left: 3vh;
            
    }
        

        .logo{
            
            margin-left: 2vh;
        }

        
    
        
        .linea{
       
                   
            margin-top: 0px;
            margin-left: 15px;
            margin-right: 15px;
            
        }

        .nav{
            display: none;
        }
            
        
        .imgcuadro{
           max-width: 100%; 
           height: 100%;
           max-height: 60vh;
           
        }

        .botonmenu{
            display: flex;
            justify-content: right;
            
        }
        .hamburguesa{
            font-size: large;
        }
        
    
        #offcanvasExample{
            background-color:rgb(18, 18, 19) ;
            color: white;
            font-size: 15px;
            max-width: 70%;
            font-weight: 300;
        }
    
        .btn {
            background-color:rgb(18, 18, 19) ;
            border-color: rgb(18, 18, 19);
            padding: 10px;
            
        }
    
        .btn:hover{
            background-color:white ;
            border-color: white;
            color:rgb(18, 18, 19);
        }

        .cuadro{           
            
            height: auto;
                    
        }

        .btnsubasta{
            padding: 0.375rem 0.75rem;
        }

        .descripcion{
        
            padding-left: 0vh;
            padding-right: 3vh;
            font-size: 15px;
            
       } 

    }
    }