body{background-color: #333 !important;font-family: 'Crimson Text', serif !important;color:white;font-size:14px}

header{width:100vw;height:350px;background:url('img-header.jpg') 100%;background-position: center;margin-bottom: 70px;display: flex;} 
header img{width:100vw;}
.cont-logo{text-align: center;}
.logo{width:250px;padding:10px}

.row{margin-top:30px !important}

.cont-header{width:100vw;background-color: black;height:70px;align-self: end;--bs-gutter-x: 0rem !important;}
.titulo{width: 1200px;margin: auto !important;margin-top:7px !important}
.titulo h1{color:white;}
.menu{text-align: right;}
.menu a{display: inline-block;padding:20px;color:#fff;text-decoration: none;}
.menu a:hover{color:#fff;}
.menu a h2{font-size: 21px;display: block;position: relative;padding:3px}

.menu a h2::before{
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #fff;
    transition: 0.5s transform ease;
    transform: scale3d(0,1,1);
    transform-origin: 0 50%;
  }
  .menu a h2:hover::before{
    transform: scale3d(1,1,1);
  }

  .menu a h2::before{
    background: #fff;
    transform-origin: 50% 50%;
  }

section .container .row{display: flex;  justify-content: space-around;margin:80px auto}

    
.cont-zona:nth-of-type(1) .col1{background:url('imgs/alfombras-persia.jpg');background-size: 100%}
.cont-zona:nth-of-type(2) .col1{background:url('imgs/alfombras-caucaso.jpg'); background-size: 100%}
.cont-zona:nth-of-type(3) .col1{background:url('imgs/alfombras-turkmenistan.jpg'); background-size: 100%}

.zona .cont-zona{height:30vw;width:30vw;margin:2vw;max-width:300px;max-height:300px;overflow:hidden;padding:0}

.zona .col1{height:100%;width:100%;max-width:300px;max-height:300px;display: flex;padding:0;opacity: 0.8;
    text-decoration: none;transition: 0.5s linear;background-position: center;box-sizing: unset;}

.cont-zona:hover .col1{scale: 105%;opacity: 1}

.zona .col1 h2{background-color: black;padding:10px;width: 100%;color:white;align-self: center;text-decoration: none;
    letter-spacing: 2px;border-top:solid white 3px;border-bottom:solid white 3px;font-size:36px;margin-top:80px}

    .alfombras:hover{transition: width 0.5s;width:97%;margin:auto}

    .subtitulo{color:#fff;text-align: center;margin:40px auto;letter-spacing: 3px;}

    .subtitulo2{color:#fff;text-align: center;margin-top:-20px;letter-spacing: 3px;}

    h4{color:white !important;font-size: 24px !important;}

    #contenido{margin:40px auto 100px}

    #contenido h2{margin:0 0 20px;color:white;font-size:22px}

.texto{margin:0 auto;flex: 0 0 575px !important;}

#contenido p{color:white;font-size:18px;}

#contenido b{text-transform: uppercase;letter-spacing: 1px;font-size:16px;color:antiquewhite}

.tituloform{text-align: center;font-size: 21px;}

form{width:575px;border: #999 solid 1px;padding:30px 40px;margin:40px 0 30px}

form input{width:100%;margin-bottom:30px;letter-spacing: 1px;color:#fff;border:none;background:none;border-bottom: solid 1px;height:30px}

form input:active, form input:focus{outline: none; }

#numero{color:white;margin-bottom:20px}

#comentarios{width:100%;height:120px;margin-bottom:10px;background:none; border-radius: 3px;letter-spacing: 1px;color:#fff;padding:5px 7px;border-bottom: white solid 1px}

#comentarios:active, #comentarios:focus{outline: none; }

#enviar{cursor:pointer;color:#666;padding:5px 10px;font-size:14px;width:auto;font-weight:700;margin-top:10px;background-color: white;letter-spacing: 1px;border:none;margin-bottom:0px;
-webkit-transition: all 1s ease-in-out;  -moz-transition: all 1s ease-in-out;  -o-transition: all 1s ease-in-out; -ms-transition: all 1s ease-in-out;  transition: all 1s ease-in-out; }

#enviar:hover{letter-spacing: 4px;color:#999  }

#enviado{float:left;font-size:14px;padding:10px;  color: burlywood;;margin-left: 140px;margin-top: -35px;}

#apellido{display: none;}

.shikli{width:100%;margin-top:100px !important;text-align: center;}
.shikli img{width:100%;max-width:1600px}

.linea{margin-top: 65px;color:white;height: 2px !important;}

.sold{color:orange !important;font-weight:600;}

.link{color: #ccc;;bottom:15px;float:right;position: relative;right:15px;text-decoration: none;}
.link:hover{color: #fff;}




@media only screen and (max-width: 990px) {
    .texto{margin:0 auto;}

    #contenido h2{margin-top:0}

    .alfombras{height:auto;width: 100%;}

    }


@media only screen and (max-width: 768px) {

    .container {max-width: 750px !important;}
    .titulo{padding:0px 20px;width: 100% !important;}
    .cont-header{height:140px;}

    .col {flex: 1 0 100% !important;}
    .titulo .col{flex: 1 0 50% !important;}

    .menu{text-align: center;}

    .zona .cont-zona{width:150px;height:150px;margin:15px}
    .cont-zona .col1 h2{font-size:18px;margin-top:60px}

.texto{padding:20px !important;}
#contenido h2{margin-top:20px}
form{width:100%;}
.alfombras{height:auto;width: 100%;}

.linea{margin: 0px;}


}


@media only screen and (min-width: 768px) and (max-width: 1200px) {
    .titulo{width: 100% !important;}

    .zona .cont-zona{height:20vw;width:20vw;margin:2vw;max-width:300px;max-height:300px;}
    .cont-zona .col1 h2{font-size:20px;margin-top:80px}
    
    .texto{margin:0 auto;flex: 0 0 575px !important;}

    form{width:500px;}
}    


@media only screen and (max-width: 650px) {
.titulo{height:120px;}
    .titulo .col{flex: 1 0 100% !important;text-align: center;}
    .menu, .titulo h1{text-align: center;}
.menu a h2{font-size:18px}
.menu a{padding: 0px 10px;}
.zona .cont-zona{width:100%;height:300px;margin:35px}
    .cont-zona .col1 h2{font-size:28px;margin-top:50px}
}


@media (min-width: 992px) {
    .container, .container-lg, .container-md, .container-sm {
      max-width: 1060px !important}
      .col{width:50% !important;max-width:50% !important}

  }
  
@media only screen and (min-width: 1200px) {
.container, .container-lg, .container-md, .container-sm, .container-xl {
    max-width: 1240px !important;}
}


@media only screen and (min-width:1600px)  {
    .container{max-width: 1500px !important;}
    .titulo{width: 1400px !important;}
}

@media only screen and (min-width:500px)  {
    #enviado{margin-top: 45px;margin-left:0}
}