/* 
      GENERAL
*/
/* .container { max-width: 1320px!important; width: 1320px!important; } */






/* ==========================================================================

   Custom CSS Stylesheet. This is where you should add your own styles!

   ========================================================================== */

/*
* Simple style overrides or custom adds
*/
.bg-orange {
   background-color: #D15B04;
}

.some-css-selector {
   font-size: 13px;
}

.ts-pt-partners__title-alternativo {
   /* width: 22%; */
   float: left;
   font-size: 18px;
   color: #FFFFFF;
   opacity: .6;
   position: relative;
   line-height: 1.2;
}

.partners-flex {
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.prodCantidad {
   display: flex;
}

.prodCantidad-btn {
   border: none;
   border: 1px solid #d8d8d8;
   background: transparent
}

.prodCantidad-btn:hover {
   border-color: #bababa;
}

.datosBancarios {
   color: #fff;
   background: #d15b04;
   border: 0;
   font-weight: 700;
   font-size: 13px;
   height: 40px;
   padding: 0 15px;
   padding: 1rem;
   border-radius: 3px;
   width: 100%;
   text-align: center;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 0.5rem;
}

.datosBancarios:hover {
   background: #000;
   color: #fff !important;
}

.registrasefooter {
   display: flex;
}

/* head fijo de tabla */
.tableFixHead thead th {
   position: sticky;
   top: 0;
   z-index: 1;
   background-color: #FFF;
   border: none;
   box-shadow: inset 0 1px 0 0 #dee2e6, inset 0 -2px 0 0 #dee2e6;
   padding: calc(.75rem + 1.5px) .75rem;
}

.tableFixHead tbody tr:first-child td,
.tableFixHead tbody tr:first-child th {
   border-top: 0;
}

.fotoSliderProducto {
   height: 25rem;
   width: 25rem !important;
   object-fit: contain;
}

.productoSlider {
   display: flex;
   justify-content: space-between;
}


.gap-4{
   gap:4px;
}
.gap-8{
   gap:8px;
}
.gap-12{
   gap:12px;
}
.gap-16{
   gap:16px;
}

.reset{
   padding:0px !important;
   margin:0px !important;
}

/* fin */

/* ==========================================================================
   ** Responsive styles custom rules
   * These rules are ready to be used for either overrides
   * or just your own custom rules.
   ========================================================================== */

@media only screen and (min-width : 1980px) {}

@media only screen and (max-width : 1440px) {}

@media only screen and (min-width : 1200px) and (max-width : 1440px) {}

@media only screen and (min-width : 1200px) {}

@media only screen and (max-width: 1199px) {}

@media only screen and (min-width: 992px) and (max-width: 1199px) {}

@media only screen and (min-width: 992px) {}

@media only screen and (max-width: 991px) {
   .datosBancarios {
      gap: 0.1rem;
   }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {}

@media only screen and (min-width: 768px) {}

@media only screen and (max-width: 767px) {}

@media only screen and (max-width : 480px) {}

@media only screen and (min-width: 600px) and (max-width: 767px) {}

@media only screen and (min-width: 768px) {
   .elm-searchbox__input-text-mobile {
      display: none;
   }
}

@media only screen and (min-width: 370px) and (max-width: 767px) {
   .datosBancarios {
      display: block;
      width: 100%;
      text-align: center;
      margin-top: 4px;
   }

   .registrasefooter input {
      color: purple
   }

   /* .container-Banners {
      display: flex;
   } */
   .container-secciones {
      display: flex;
      justify-content: center;
   }

   .partners-flex {
      flex-direction: column;
   }
}

@media only screen and (min-width: 290px) and (max-width: 767px) {
   .fotoBanner {
      width: 100%;
   }


   .elm-searchbox__input-text {
      display: none;
   }

   .elm-searchbox__input-text-mobile {
      max-width: 600px;
      position: absolute;
      display: block;
      top: 50%;
      left: 0;
      padding-left: 20px;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
      pointer-events: none;
      font-size: 13px;
      line-height: 1.2;
      color: #FFFFFF;
      overflow: hidden;
      white-space: nowrap;
      -webkit-animation: elm-searchbox__inputtext 4s steps(50, end);
      animation: elm-searchbox__inputtext 4s steps(50, end);
   }
}


@media only screen and (min-width: 290px) and (max-width: 600px) {
   .fotoSliderProducto {
      height: 15rem;
      object-fit: contain;
   }

   .productoSlider {
      display: flex;
      flex-direction: row;
      margin-top: -10rem;
   }
   .videoPosicion{
      -webkit-transform:translateX(-50%) translateY(-20%) !important;
   }
}

@media only screen and (max-width : 320px) {}


@media only screen and (min-width:280px) and (max-width : 1920px) and (orientation: landscape) {}




.iconText {
   margin-right: 5px;
}

.mejores-marcas {
   display: table-cell;
   vertical-align: middle;
}




/* .imgProducto {
   max-width: 300px !important;
}

 */

/**************************** CUSTOM ACORDEON SOBRE NOSOTROS **********************************/

.panel-group .panel {
   border-radius: 0;
   box-shadow: none;
   border-color: #eee;
}

.panel-default>.panel-heading {
   padding: 0;
   border-radius: 0;
   color: #fff;
   background-color: #535353;
}

.panel-title {
   font-size: 14px;
}

.panel-title>a {
   display: block;
   padding: 15px;
   text-decoration: none;
   color: #fff;
}

.panel-title>a:hover {
   color: #fff !important;
}

.more-less {
   float: right;
   color: #fff !important;
}

.panel-default>.panel-heading+.panel-collapse>.panel-body {
   border-top-color: #eee;
}

/**************************** END CUSTOM ACORDEON SOBRE NOSOTROS **********************************/


/* Tailwind-like utility classes */
.flex { display: flex !important; }
.flex-col { flex-direction: column !important; }
.flex-row { flex-direction: row !important; }
.items-center { align-items: center !important; }
.justify-center { justify-content: center !important; }
.justify-between { justify-content: space-between !important; }
.justify-end { justify-content: flex-end !important; }
.gap-1 { gap: 0.25rem !important; }
.gap-2 { gap: 0.5rem !important; }
.gap-3 { gap: 0.75rem !important; }
.gap-4 { gap: 1rem !important; }
.p-0 { padding: 0 !important; }
.p-1 { padding: 0.25rem !important; }
.p-2 { padding: 0.5rem !important; }
.p-4 { padding: 1rem !important; }
.m-0 { margin: 0 !important; }
.m-1 { margin: 0.25rem !important; }
.m-2 { margin: 0.5rem !important; }
.m-4 { margin: 1rem !important; }
.w-full { width: 100% !important; }
.h-full { height: 100% !important; }
.rounded { border-radius: 0.25rem !important; }
.rounded-lg { border-radius: 0.5rem !important; }
.bg-white { background-color: #fff !important; }
.bg-black { background-color: #000 !important; }
.text-center { text-align: center !important; }
.text-white { color: #fff !important; }
.font-bold { font-weight: 700 !important; }
.block { display: block !important; }
.inline-flex { display: inline-flex !important; }
.border { border: 1px solid #e5e7eb !important; }
.shadow { box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important; }

.text-naranja-microcom {
   color: #d15b04 !important;
}