
.wrap3 {
    margin: 20px auto;
    text-align: center;
}




body {
  margin: 0;
}



  /***************************************seccion de imagenes con el stylo de bottones*******************************************************/



.wrap {
    margin: 20px auto;
    align-items: ;
}







/* Aqui empieza el codigo del boton circular. */
.boton-slide-circular {
    /*position: relative;
    display: inline-block;
    width: 250px;
    height: 50px;
    background: #fdfdfd;
    line-height: 50px;
    padding: 0;
    border-radius: 50px;
    border: 2px solid #63B1D0;
    margin-top: 10px;
    -webkit-transition: .5s;
    transition: .5s*/
    position: relative;
    font-family: "Inter", sans-serif;
    display: inline-block;
    width: 185px;
    height: 44px;
    background: #001970;
    line-height: 44px;
    padding: 0;
    border-radius: 19px;
    border: 4px solid #001970;
    top: -7px;
    transition: .5s;
}



.boton-slide-circular .slide-texto {
    position: absolute;
    left: 16%;
    color: #fff;
    font-size: 20px;
    text-align: center;
    margin: 0 auto;
    -webkit-transition: .5s;
    -moz--transition: .5s;
    -o-transition: .5s;
    transition: .5s;
}

.boton-slide-circular:hover {
    background-color: #000;
    border-color: #000;
}

.boton-slide-circular:hover .slide-icono {
    left: 100%;
    background-color: #fdfdfd;
    color: #00944A;
    margin-left: -45px;
}

.boton-slide-circular:hover .slide-texto {
    left: 16%;
    color: #fff;
}

/*******************************imagens***************************************/

 .h1sec {
    font-family: "Inter", sans-serif;
    font-size: 41px;
    font-weight: 600;
    width: 332px;
    margin-left: -2vh;
  }
   .h1sec2 {
   font-family: "Inter", sans-serif;
    font-size: 22px;
    margin-left: 31px;
    text-align: left;
  }

  .body {
    background-image: url(./../../assets/3productos/seccion3/1tubo-depresible-aluminio.jpg);
  background-color: #fff0;
  display: flex;
  justify-content: 12px;
  align-items: center;
  height: 100vh;
  margin: 0;
  background-size: cover;

 font-family: "Inter", sans-serif;
}
 .body2 {
    background-image: url(./../../assets/3productos/seccion3/tubo-laminado-PBL-ABL-productos-baja.jpg);
  background-color: #fff0;
  display: flex;
  justify-content: 12px;
  align-items: center;
  height: 110vh;
  margin: 0;
  background-size: cover;

 font-family: "Inter", sans-serif;
}
.body3 {
    background-image: url(./../../assets/3productos/seccion3/3impresion_pelicula.jpg);
  background-color: #fff0;
  display: flex;
  justify-content: 12px;
  align-items: center;
  height: 100vh;
  margin: 0;
  background-size: cover;

 font-family: "Inter", sans-serif;
}
 .body4 {
    background-image: url(./../../assets/3productos/seccion3/4impresion_papel.jpg);
  background-color: #fff0;
  display: flex;
  justify-content: 12px;
  align-items: center;
  height: 100vh;
  margin: 0;
  background-size: cover;

 font-family: "Inter", sans-serif;
}

.body5 {
    background-image: url(./../../assets/3productos/seccion3/5etiquetas.jpg);
  background-color: #fff0;
  display: flex;
  justify-content: 12px;
  align-items: center;
  height: 100vh;
  margin: 0;
  background-size: cover;

 font-family: "Inter", sans-serif;
}
.card {
           background-color: #00000069;
    border-radius: 45px;
    padding: 5px 70px 5px 26px;
    width: 498px;
    height: 630px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 93px;
    color: #fff;
}


.card2 {
    background-color: #00000069;
    border-radius: 45px;
    padding: 5px 70px 5px 26px;
    width: 498px;
    height: 690px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 93px;
    color: #fff;
    margin-left: 58%;
}




.card3 {
    background-color: #00000069;
    border-radius: 45px;
    padding: 5px 70px 5px 26px;
    width: 498px;
    height: 690px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 93px;
    color: #fff;
    margin-left: 58%;
}

.card4 {
           background-color: #00000069;
    border-radius: 45px;
    padding: 5px 70px 5px 26px;
    width: 458px;
    height: 450px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 93px;
    color: #fff;
    margin-top: -18px;
}


#particles-js {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -1;
}


/*****************************************inio de seccion uno tubo principal*********************************************************/


 .banner0 {
  /*
background: rgb(255,255,255);
background: linear-gradient(72deg, rgba(255,255,255,1) 0%, rgba(249,249,249,1) 100%);
  height: 100vh;
  background-size: cover;
  background-position: center;*/
    background: rgb(255, 255, 255);
    background-image: url(./../../assets/3productos/seccion1/tubo_depre.jpg);
    /* background: linear-gradient(72deg, rgba(255, 255, 255, 1) 0%, rgb(197 190 190 / 35%) 100%); */
    height: 80vh;
    width: 93%;
    background-size: 100%;
    background-position: center;
    margin-top: 96px;
    margin-left: 4%;
    border-radius: 30px;
    background-repeat: no-repeat;
    /*filter: grayscale(100%);*/

 box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.35);
}


.content0 h2 {
  font-family: alfa slab one;
  color: #ef0554;
  font-size: 60px;
}

.btn0 a {
  text-decoration: none;
  background: #ef0554;
  padding: 15px 10px;
  display: inline-block;
  color: #fff;
  margin-top: 15px;
  border-radius: 50px;
  width: 130px;
  text-align: center;
}
.wrapper0 {
  width: 1060px;
  margin: auto;
  padding-top: 12%;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .wrapper0 {
    width: 75%;
    padding-top: 26%;
  }
  .content0 {
    text-align: center;
  }
  .content0 h2 {
    font-size: 60px;
  }
  .content0 p {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .banner0 {
    background-position: 60%;
  }
  .wrapper0 {
    width: 75%;
    padding-top: 26%;
  }
  .content0 h2 {
    font-size: 25px;
  }
  .content0 p {
    width: 100%;
  }
  .btn0 a {
    padding: 9px 4px;
    width: 105px;
  }
}

.ascolor0 {
    color: #001970;
}

.textQS0 {
       position: absolute;
    top: 304px;
    left: 257px;
    color: #FFF;
    font-size: 4rem;
    mix-blend-mode: unset;
    font-weight: bold;
    font-family: "Inter", sans-serif;
    font-weight: 600;
    max-width: 750px;


}







/****************************inio de carrucel de imagenes ****************************************/





  .textcarrucel {
  /*padding-top: 139%;
    text-align: center;
    background-color: #ffffff00;
    font-size: 29px;
    cursor: pointer;
    color: #2f3542;
    font-family: "Inter", sans-serif;*/

        padding-top: 146%;
    text-align: center;
    background-color: #ffffff00;
    font-size: 2.3vh;
    cursor: pointer;
    color: #080808;
    font-family: "Inter", sans-serif;
    font-weight: 600;

  }

.img1{
   background-image:url(./../../assets/3productos/seccion2/carrucel/1tubo_depresible.jpg);
}
.img2{
   background-image:url(./../../assets/3productos/seccion2/carrucel/2tubo_laminado.jpg);
}
.img3{
   background-image:url(./../../assets/3productos/seccion2/carrucel/3impresion_pelicula.jpg);
}

.img4{
   background-image:url(./../../assets/3productos/seccion2/carrucel/4impresion_papel.jpg);
}
.img5{
   background-image:url(./../../assets/3productos/seccion2/carrucel/5etiqueta.jpg);
}

  .handles svg path{
    stroke:#001970!important;
  }
  .dots span{
    background:#fff!important;
    opacity:0.5
  }
  .dots span.active{
    opacity:1
  }
    .PostSlide{max-width:1300px;margin:40px auto;}
    .PostSlide{max-width:1300px;margin:10px auto 40px;}
    .PostSlide .innerContainer .slider{display:flex;width:1280px;overflow-x:hidden;margin:auto;}
    .PostSlide .innerContainer .slider .slide{display:block;background-size: cover!important;background-position: center center!important;min-width:364px;height:600px;margin:0 10px;}
    .PostSlide .innerContainer .slider{position:relative;z-index:2;}
    .PostSlide .innerContainer .handles{    display: flex;
    justify-content: space-between;
    position: relative;
    top: -300px;
    width: 101%;
    cursor: pointer;
    margin-right: -15px;
    margin-left: -22px;
    z-index: 4;
    -webkit-tap-highlight-color: transparent;}
    .PostSlide .dots{display:flex;align-items:center;justify-content:center;gap:10px;position:relative;}
    .PostSlide .dots span{border-radius:10px;background:#CBCBCB;width:6px;height:6px;display:inline-block;cursor:pointer;}
    /*.PostSlide .slider *{user-drag:none;-webkit-user-drag:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;}
    .PostSlide .handles > span{transition:opacity 8.50s;}
    .PostSlide .handles .prev{opacity:0;}
    .PostSlide .handles .next{opacity:1;}*/
    .PostSlide .handles *{user-select:none;}
    .PostSlide .innerContainer .slider .slide{display:flex!important;flex-direction:column;justify-content:space-between;}
    @media (min-width: 1280px){
        .PostSlide .innerContainer .slider{width:1200px!important;margin:auto;}
    }
    @media (max-width: 1280px){
        .PostSlide .innerContainer .handles{width:calc(100% + 30px)!important;margin-left:-15px!important;margin-right:-15px!important;}
    }
    @media (min-width: 960px) and (max-width: 1280px){
        .PostSlide .innerContainer .slider{width:960px!important;}
    }
    @media (min-width: 960px) and (max-width: 1280px){
        .PostSlide .innerContainer .slider{width:960px!important;}
    }
    @media (min-width: 640px) and (max-width: 960px){
        .PostSlide .innerContainer .slider{width:640px!important;}
    }
    @media (max-width: 640px){
        .PostSlide .innerContainer .slider{width:300px!important;}
    }
    .PostSlide .innerContainer,.PostSlide .slider,.PostSlide .handles,.PostSlide .dots{direction:ltr;}

    .PostSlide .innerContainer .slider .slide>div{display:block;background-size: cover!important;background-position: center center!important;min-width:100%;height:100%;border-radius:27px}

























