@font-face {
    font-family: Quicksand;
    src: url(Quicksand-Light.ttf);
}

.nav {
    width: 100%;
    height: 40px;
}

.navbar {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.links {
    display: inline;
    float: left;
}

.links2 {
    display: inline;
    float: right;
}

.link {
    color: #7b7d7b;
    text-decoration: none;
}

.links, .translate, .pipe {
    display: inline-block;
    padding: 8px;
    color: #303030;
    font-family: Quicksand; 
    font-size: 1.1rem;
    letter-spacing: .1rem; 
    text-decoration: none;
}

.links:hover, .links2:hover {
    color: rgb(15, 13, 13);
    background-color: rgba(69, 68, 68, 0.1);
}

.translate, .pipe {
    background-color: none;
    background: none;
    border: none;
}

.products,
.checkboxes { width: 213.6px; height: auto; display: inline-block;}

.fotosproductos { width: 100%; }

.relleno {
    width: 100%;
    height: 100px;
}

.relleno2 {
    width: 100%;
    height: 50px;
}

.pe {
    text-transform: uppercase;
    border-radius: 20px;
    border: 1px solid #e4437e;
    padding: 9px 20px;
    margin: 4px 2px;
    color: white;
    background-color: #e4437e;
    font-size: .8em; 
    font-family: Quicksand; 
    letter-spacing: .1rem;
}

.pe:hover {
    color: #e4437e;
    background-color: white;
    transition-property: all;
    -webkit-transition-property: all;
    transition-duration: .3s;
    transition-timing-function: ease-out;
    transition-delay: 0s;
}

.wsp { position: -webkit-sticky; position: sticky; bottom: 0; padding-right: 10px; text-align: right;}
.wsplogo { width: 40px; height: auto; }
.fotoform {width: 75%; height: auto; }
.commentbox {width: 400px; height: 100px; font-family: Quicksand; letter-spacing: .1rem; color: #7b7d7b;}
.lblform { font-size: .8em; font-family: Quicksand; letter-spacing: .1rem; color: #7b7d7b; }
.lblinput { width: fit-content; }
.inputlbl { width: 100%; text-align: left;} 
.inputforms { display: inline-block;}
.forminput { width: 100%;}
.formu {display: block; text-align: center;}

.icon { display: none; }

.navbar { display: block; }

@media screen and (max-device-width: 480px) {
    .wsp { position: -webkit-sticky; position: sticky; bottom: 0; float: right;}
    .wsplogo { width: 30px; height: auto; }
    .fotoform {width: 100%; height: auto; }
    .forminput { width: 98%;}
    .commentbox {width: 90%; height: 200px; font-family: Quicksand; letter-spacing: .1rem; color: #7b7d7b;}
    .lblform { font-size: .8em; font-family: Quicksand; letter-spacing: .1rem; color: #7b7d7b; }
    .cotizar { font-size: .8em; font-family: Quicksand; letter-spacing: .1rem; color: white; }
    .nav { width: 100%; height: 60px; }
    .products,
    .checkboxes { width: 128.15px; height: auto; display: inline-block;}
    .fotosproductos { width: 100%; }

    /* Menú sandwich mobile */
    .nav { overflow: hidden; position: relative; }
    .nav #navbar { display: none; }
    .links, .links2 { float: left; color: #303030; width: 20%;}
    .icon { display: block; position: absolute; left: 10px; top: 10px; color: #303030;}
    .pipe {display: none;}
}