#carrusel-portada {
            width: 100%;
            height: auto; 
            margin-bottom: 15px;
            margin-top: 50px;          
        }

        #carrusel-productos{
            width: 100%;
            height: auto;            
            padding: 4px;
            margin: auto;
            border: 6px solid #9de7ea;
        }

        #carrusel-productos img{
            
/*            border: 2px solid black;*/
        }
       
        #sidebar-izquierdo{
/*          z-index: 1;*/
/*          position: absolute;*/
          width: 250px;
          margin-top: 70px;
          height: 100%;
/*          overflow-y: hidden;*/
          background: #b4e9f7;
/*          opacity: 0.9;*/
          transition: all 0.5s;
          display: flex;         
/*          align-items: center;*/
        }

/**** SIDEBAR DERECHO ****/

  #sidebar-derecho {
    width: 100%;
    height: 100%;
    background-color: white;
    transition: all 0.5s;
    display: flex;
  }

  #sidebar-derecho .offcanvas-header{
    padding: 1rem !important;
    background-color: #fff3f6;
    border-bottom: 1px solid black;
  }

  #sidebar-derecho .offcanvas-body {
    padding: 1px 1px !important;
  }

  #sidebar-derecho .btn-success {
    color: #000;
    background-color: #9de7ea;
    border-color: #9de7ea;
    box-shadow: 2px 2px 3px #999;
/*    margin-top: 10px;*/
    letter-spacing: 1px;
  }
/**** FIN SIDEBAR DERECHO ****/

/**** SIDEBAR PRODUCTOS ****/
  #sidebar-producto {
    width: 100%;
    height: 100%;
    background-color: white;
    transition: all 0.5s;
    display: flex;          
  }

  #sidebar-producto .offcanvas-header{
    padding: 1rem !important;
    background-color: #fff3f6;
    border-bottom: 1px solid black;
  }

  #sidebar-producto .offcanvas-body {
    padding: 1px 1px !important;
  }

  #sidebar-producto .btn-success {
    color: white;
    background-color: #9de7ea;
    border-color: #9de7ea;
    box-shadow: 2px 2px 3px #999;
    margin-top: 10px;
    letter-spacing: 1px;
    border-bottom: 4px solid #00c2cb;
  }

/**** FIN SIDEBAR PRODUCTOS ****/

/**** PRODUCTOS ****/

  .product-list .btn-success {
    color: white;
    background-color: #9de7ea;
    border-color: #9de7ea;
    box-shadow: 2px 2px 3px #999;
    margin-top: 10px;
    letter-spacing: 1px;
    border-bottom: 4px solid #00c2cb;
    width: 90%; 
    font-size: 0.65rem;
/*    text-shadow: 0px 0px 0px #434141, 0px 0px 0px #434141, 0px 0px 0px #434141, 1px 1px 1px #434141;*/
  }

/**** SIDEBAR STYLING ****/
        .sidebar-nav {
          padding: 0;
          list-style: none;
          transition: all 0.5s;
          width: 100%;
          text-align: center;
        }

        .sidebar-nav li {
          line-height: 40px;
          width: 100%;
          transition: all 0.3s;
          padding: 10px;
        }

        .sidebar-nav li a {
          display: block;
          text-decoration: none;
          color: #000;
        }

        .sidebar-nav li:hover {
          background: #ffffff;
        }

        @media only screen and (min-width: 600px) {
          .container-fluid{
            width: 70%;
          }

          .container-fluid .row .btn_id {
            width: 69%;
          }

          .navbar{            
            width: 69%;
            margin: auto;
          } 
          
        }

        @media (max-width: 400px) {
          body{
            font-size: 0.8rem !important;
          }

          .pill-link {
            font-size: 10px !important;            
          }

          small .item-price {
            font-size: 0.8rem !important;
          }

          .product-list .btn-success {
            font-size: 0.45rem !important;
          }

          .btn-success {
            font-size: 0.8rem !important;
          }

          nav h6{
            font-size: 0.8rem !important;
          }   

          .offcanvas-body span {
            font-size: 0.8rem !important;
          }  

          .offcanvas-body h5 {
            font-size: 1rem !important;
          }    

          .accordion-button {
            font-size: 0.9rem !important;
          }

          p {
            font-size: 0.9rem !important;
          }  

          label {
            font-size: 0.9rem !important;
          }
          
        }

        /**** CARRUSEL INFINITO ****/

        @keyframes scroll {
          0% {
            transform: translateX(0);
          }
          100% {
            transform: translateX(calc(-250px * 7));
          }
        }
        .slider {
          background: white;
          box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.125);
          height: 100px;
          margin: auto;
          overflow: hidden;
/*          position: relative;*/
          width: 100%;
        }
        .slider::before, .slider::after {
          background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%);
          content: "";
          height: 100px;
          position: absolute;
          width: 200px;
          z-index: 2;
        }
        .slider::after {
          right: 0;
          top: 0;
          transform: rotateZ(180deg);
        }
        .slider::before {
          left: 0;
          top: 0;
        }
        .slider .slide-track {
          -webkit-animation: scroll 40s linear infinite;
                  animation: scroll 40s linear infinite;
          display: flex;
          width: calc(250px * 14);
        }
        .slider .slide {
          height: 100px;
          width: 250px;
        }

        /*ICONO WHATSAPP*/
        .float {
          position: fixed;
          width: 50px;
          height: 50px;
          bottom: 20px;
          right: 20px;
          background-color: #25d366;
          color: #fff;
          border-radius: 50px;
          text-align: center;
          font-size: 31px;
          box-shadow: 2px 2px 3px #999;
          z-index: 100;         
        }

        .my-float {         
          font-size: 1.4rem;
          padding: 1px;          
        }

        a .my-float:link {color: white; font-family: arial; text-decoration: none;}
        a .my-float:hover {color: white; font-family: arial; text-decoration: none;}
        a .my-float:active {color: white; font-family: arial; text-decoration: none;}
        a .my-float:visited {color: white; font-family: arial; text-decoration: none;}

        /*CONTENEDOR HORIZONTAL*/

        .horizontal-container {
          overflow-y: hidden;
          overflow-x: scroll!important;
          width: 100%;
          margin: 0px;
        }

        .horizontal-container::-webkit-scrollbar {
          width: 1px!important;
          height: 0!important
        }

        .horizontal-container::-webkit-scrollbar-track {
          background: 0 0!important;
          border-radius: 10px!important
        }

        .horizontal-container::-webkit-scrollbar-thumb {
          border-radius: 1px!important;
        }

        .horizontal-container-item {
          float: none!important;
          display: inline-block
        }

        .horizontal-container ul,.horizontal-products-scroller {
          white-space: nowrap!important;
        }
        
        .p-right-half{
          padding-right: 10px!important;
        }

        .m-left-half{
          margin-left: 10px!important:;
        }
        
        .pill-link {
          background-color: #9de7ea;
          color: black;
/*          box-shadow: 2px 2px 3px #999;*/
          text-transform: uppercase;
        }

        .pill-link:hover,.pill-link:focus {
          opacity: 0.6;
          color: #03484a
        }

        .pills-container ul{
          list-style: none !important;
        }

        .pills-container ul a:link { text-decoration:none; } 
        .pills-container ul a:visited { text-decoration:none; }

        .pill{
          display: inline-block;
          margin: 0 5px 10px 0;                
        }

        .pill-link{
          display: block;
          padding: 15px 20px;
          font-size: 15px;
          border-radius: 50px;
        }

        /*ANIMACION PRODUCTOS*/
        .product-list .product-item{
          transition: all .5s;
        }

/**** CARRITO ****/

  .shopping-cart-items {
    padding: 20px 0px;
  }

  .shopping-cart-header {
    border-bottom: 1px solid #ccc;
  }

  .shopping-cart-image {
    max-width: 80px;
/*    border-radius: 20px;*/
  }
  
  .shopping-cart-quantity-input {
    max-width: 65px;
    border: 1px solid #ccc;
    border-radius: 5px;
    background: #eee;
    padding: 5px;
  }

  .shopping-cart-total {
    min-height: 96px;
    display: flex;
    justify-content: space-between;
  }
/* CSS para posicionar el bade cerca del carrito*/
  .cart {
    position: relative;
  }

  #cart_menu_num {
    position: absolute;
/*    top: 0;*/
    left: 55%;
    /*right: 6px;
    float: right;*/
    background: red;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: none;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 0.8rem;
    padding: 4px;
  }

  #product_menu_num {
    position: absolute;
    /*top: 0;
    left: 55%;*/
    right: 5px;
/*    float: right;*/
    background: red;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    padding: 4px;
  }

/**** RADIO BUTTON PERSONALIZAR PRODUCTO ****/

  .form-check-input {
    width: 1.5em;
    height: 1.5em
  }

  .collapse .accordion-body {
    padding: 0.5rem !important;
  }