body{
/* background-color: #9fcdff;*/
}
.text-price{
    color: black;
    font-weight: bold;
}

.barra-navegacion{
      background: linear-gradient(to right, rgba(39, 70, 133, 0.8) 0%, rgba(61, 179, 197, 0.8) 100%), url(../images/system/hero-bg.jpg);
  position: fixed;
  width: 100%;
  z-index: 3;
}


#button-carrito-bar{
position: absolute;
text-decoration: none;
right: 65px;
}

#button-wish-bar{
position: absolute;
text-decoration: none;
right: 120px;
}

#button-saldo-bar{
position: absolute;
text-decoration: none;
right: 180px;
}

#button-provincias{
position: absolute;
text-decoration: none;
right: 240px;
}

#button-setting{
position: absolute;
text-decoration: none;
right: 300px;
}

#button-saldo-bar-admin{
position: absolute;
text-decoration: none;
right: 120px;
}

#button-saldo-bar a{
text-decoration: none;
}


.a_categorias{
text-decoration: none;

}

.animated{
  animation: up-down 2s ease-in-out infinite alternate-reverse both;
}

#nav-tabContent{
/*background: rgba(39, 70, 133, 0.1);*/
/* background: linear-gradient(to right, rgba(39, 70, 133, 0.8) 0%, rgba(61, 179, 197, 0.8) 100%), url(../images/system/hero-bg.jpg);*/
}




#imagen-sirena{
    padding-top: 20px;
}

@keyframes up-down {
  0% {
    transform: translateY(10px);
  }

  100% {
    transform: translateY(-10px);
  }
}

#button-account{
padding-right: 0px;
}

.img-round20{
border-radius: 30px;
}

.category a{
/*padding: 5px;*/
text-decoration: none;
}

.category .card{
border-radius: 0px 0px 50px 0px;
}

.card-body{
/*background: linear-gradient(to right, rgba(39, 70, 133, 0.8) 0%, rgba(61, 179, 197, 0.8) 100%), url(../images/system/hero-bg.jpg);*/
}

#myCarousel{
 background: linear-gradient(to right, rgba(39, 70, 133, 0.8) 0%, rgba(61, 179, 197, 0.8) 100%), url(../images/system/hero-bg.jpg);
  /*position: relative;*/    
}
#carouselExampleCaptions{
 background: linear-gradient(to right, rgba(39, 70, 133, 0.8) 0%, rgba(61, 179, 197, 0.8) 100%), url(../images/system/hero-bg.jpg);
  /*position: relative;*/    
}

#carousel1{
/*    background: linear-gradient(rgba(40, 58, 90, 0.1), rgba(40, 58, 90, 0.9)), url("../images/hero-bg.jpg") fixed center center;
    */height: 200px;
/*      background: linear-gradient(to right, rgba(39, 70, 133, 0.8) 0%, rgba(61, 179, 197, 0.8) 100%), url(../images/hero-bg.jpg);
position: relative;
}
#carousel2{
/*    background: linear-gradient(rgba(40, 58, 90, 0.9), rgba(40, 58, 90, 0.9)), url("../breadcrumbs-bg.jpg") fixed center center;
    */height: 200px;
      /*position: relative;*/
}
#carousel3{
/*    background: linear-gradient(rgba(40, 58, 90, 0.9), rgba(40, 58, 90, 0.9)), url("../breadcrumbs-bg.jpg") fixed center center;
*/    height: 200px;
}

@media (min-width: 576px) {
.product{
    padding-top: 30px;
    margin-left: 5px;
    width: 10rem;    
}
.category{
    padding-top: 10px;
    margin-left: 5px;
    width: 11rem;    
}

}


@media (min-width: 1200px) { 
    .product{
    padding-top: 30px;
    margin-left: 5px;
    width: 13rem;    
}
.category{
    padding-top: 10px;
    margin-left: 5px;
    width: 11rem;    
}

}


#search-bar{
/*position: absolute;
right: 135px;*/
padding: 10px;
}



.product a{
    text-decoration: none;
    
}
.mini-img-product{
    text-decoration: none;
    width: 65px;
    border-radius: 5px;
    border: solid;
    border-color: gray;
    border-width: 1px;
    
}
#img-product-details{
 border-radius: 20px;
    
}
#img-product-details1{
 border-radius: 20px;

}

#price-product-details{
font-size: 24px;
    
}

.btn-add-carrito{
    margin-top: 10px;
    width: 100%;
    
}

#btn-pagar-transfermovil{
width: 100%    
}
#btn-pagar-enzona{
width: 100%;  
}

#button-menu{
    position: absolute;
        
left: 50px;  
}


.menu-list img{
width: 40px;
border-radius: 50px;
/*padding-top: 0px;*/
}

.menu-list li{
list-style: none;
padding: 0px;
margin: 0px;
}



/*.product{
    width: 100px;
}*/


/*#review-form{
width: 400px;
padding: 50px;
}*/
/*.btn-add-cart{
    width: 40px;
}
.btn-add-wish{
    width: 40px;
}*/




/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
#hero {
  width: 100%;
  overflow: hidden;
  position: relative;
/*  background: linear-gradient(0deg, rgb(42, 44, 57) 0%, rgb(51, 54, 74) 100%);*/
/* background: linear-gradient(to right, rgba(39, 70, 133, 0.8) 0%, rgba(61, 179, 197, 0.8) 100%), url(../images/system/fondo3.png);*/
  padding: 0;
}

#hero .carousel-container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-align: center;
  position: relative;
  height: 70vh;
  padding-top: 60px;
}

#hero h2 {
  color: #fff;
  margin-bottom: 30px;
  font-size: 48px;
  font-weight: 700;
}

#hero p {
  width: 80%;
  animation-delay: 0.4s;
  margin: 0 auto 30px auto;
  color: #fff;
}

#hero .carousel-control-prev,
#hero .carousel-control-next {
  width: 10%;
}

#hero .carousel-control-next-icon,
#hero .carousel-control-prev-icon {
  background: none;
  font-size: 48px;
  line-height: 1;
  width: auto;
  height: auto;
}

#hero .btn-get-started {
  font-family: "Raleway", sans-serif;
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 12px 32px;
  border-radius: 50px;
  transition: 0.5s;
  line-height: 1;
  margin: 10px;
  color: #fff;
  animation-delay: 0.8s;
  border: 2px solid #ef6603;
}

#hero .btn-get-started:hover {
  background: #ef6603;
  color: #fff;
  text-decoration: none;
}

@media (min-width: 1024px) {
  #hero p {
    width: 60%;
  }

  #hero .carousel-control-prev,
  #hero .carousel-control-next {
    width: 5%;
  }
}

@media (max-width: 768px) {
  #hero .carousel-container {
    height: 90vh;
  }

  #hero h2 {
    font-size: 28px;
  }
}

.hero-waves {
  display: block;
  width: 100%;
  height: 60px;
  position: relative;
}

.wave1 use {
  animation: move-forever1 10s linear infinite;
  animation-delay: -2s;
}

.wave2 use {
  animation: move-forever2 8s linear infinite;
  animation-delay: -2s;
}

.wave3 use {
  animation: move-forever3 6s linear infinite;
  animation-delay: -2s;
}

@keyframes move-forever1 {
  0% {
    transform: translate(85px, 0%);
  }

  100% {
    transform: translate(-90px, 0%);
  }
}

@keyframes move-forever2 {
  0% {
    transform: translate(-90px, 0%);
  }

  100% {
    transform: translate(85px, 0%);
  }
}

@keyframes move-forever3 {
  0% {
    transform: translate(-90px, 0%);
  }

  100% {
    transform: translate(85px, 0%);
  }
}

#barra-nav{
    position: fixed;
}

#indicator {
/*    position: fixed;
    top: 57px;
    width: 100%*/

}

.footer{
     background: linear-gradient(to right, rgba(39, 70, 133, 0.8) 0%, rgba(61, 179, 197, 0.8) 100%);
}

#text-tienda{
    position: absolute;
    left: 15px;
    top: 50px;
}