@import url('https://fonts.googleapis.com/css?family=Lato');
@import url('https://fonts.googleapis.com/css?family=Lora');
@import url(menu.css);
@import url(footerproductos.css);
@import url(mapa.css);







*{
    margin:0;
    padding: 0;
    box-sizing: border-box;
    
}

body{
   font-family: 'Lato', sans-serif;
}



    h40 img{
    display: none;

}


#headerprincipal{
    width: 100%;
    background: white;
    height: 70px;
    color: #fff;
    position:fixed;
    top: 0px;
    left: 0px;
    z-index: 100;
    }

.contenedor {
    width:  98%;
    margin: auto;  
    }
h1{
    float: left;
  }

header .contenedor{
    display: table;

   }
section{
    max-width:100%;
   }

h1 img{
    padding: 10px;
    width: 200px;
   
  }

    #laboratorio1{
    position: relative;
    z-index: 0;
    top: 200px;
    width: 100%;
    left: 0px;
    padding: 10px;
    color: black;
    }

    #laboratorio1 p{
    font-size: 20px;
    color: black;
        
    }
  #laboratorio{
    position: relative;
    z-index: 0;
    top: 150px;
    background: none;
      color: #39AD27;
    }
    #carton{
    position: relative;
    top: 250px;
    display: inline-block;
    vertical-align: top;
    width: 100%;
    color: #39AD27;

    }
    #carton #carton1{

    display: inline-block;
    vertical-align: top;
    margin-left: 0
    }

    #carton h2{
    margin-bottom: 20px;
    margin-top: 20px;
    }

#ubicacion {
    position: relative;
    top: 300px;
    padding: 10px;
}


@media (min-width: 1024px){
    
    body{
   background-image: url(bkg_productos.jpg);
   background-size: cover;
   background-repeat: no-repeat;
   position:center;
   font-family: 'Lato', sans-serif;
    }
   
   
   


    h1 img{
    width: 200px;
    margin-top: -30px;
  }
    .contenedor{
    width: 85%;
    } 

    #headerprincipal{
    background: none;
    width: 100%;
    height: 240px;
    color: #fff;
    position:absolute;
    }    
    
    header{ 
    width: 100%;
    height: 160px;
    color: #fff;
    position:relative;
    top: 0px;
    left: 0;   
    }
   
    h1{
    margin-top: 40px;  
    width: 200px;
    height: 100px;
    }
    
    #laboratorio{
    position: relative;
    z-index: 500;
    top: 150px;
    background: none;
    }
    
    #laboratorio h2{
    color: #39AD27;
    }
    
    #laboratorio1{
    position: relative;
    z-index: 500;
    top: 200px;
    width: 50%;
    left: 64px;
    color: black;
    }


    #laboratorio1 p{
    position: static;
    font-size: 20px;
    color: black;
        
    }
    

    #laboratorio1 c{
    font-weight: bold;
    color: #39AD27;
    }
    
    #carton{
    position: relative;
    top: 250px;
    display: inline-block;
    vertical-align: top;
    width: 100%;

    }
    
    
    
    #carton img{

    width: 90%;

    }
    #carton h2{
    color: #39AD27;
    margin-bottom: 0px;
    margin-top: 0px;
    }

    
    
    #carton #carton1{
    margin-left: 200px;
    }
    
    #carton #carton2{
    width: 300px;
    display: inline-block;
    vertical-align: top;
    }
    
    #carton #carton3{
    width: 300px;
    display: inline-block;
    vertical-align: top;
    }
#ubicacion {
    position: relative;
    top: 400px;
    padding: 10px;
}

  
#ubicacion h3{
   color: white;     
} 
#ubicacion h5{
    font-size: 20px;
    color: white;
    }
    
#ubicacion h4{
    color: #2c3e50;
    }
    #ubicacion h3{
        color: #2c3e50;
        }

#ubicacion #ubicacionarticulos1{
    display: inline-block;
    vertical-align: top;
    width: 550px; 
    color: #2c3e50;
} 
    
#ubicacion #ubicacionarticulos2{
    display: inline-block;
    vertical-align: top;
    width: 500px;
    margin-top: 250px;
      
}  




} 

@media (min-width:1903px){


#ubicacion {
    position: relative;
    top: 900px;
    padding: 10px;
}
}


