.sottocosto {
    background-color: #ffffff;
    padding: 15px;
    margin-top: 15px;
}
.sottocosto:hover {
    box-shadow: #333333 1px 5px 10px 0px;
}
.bar {
     width: 290px;
     height: 12px;
     position: relative;
     background: linear-gradient( 
       270deg,
       #eee 80%,
       transparent 50%);
     background-color: #f44336;
     border-radius: 25px;
      overflow: hidden;
      transition: transform 1s ease-out;
 
 }
.bar:hover {
   transform: scale(1);
}
 .bar:before {
     content: '';
     right: 0;
     position: absolute;
     height: 100%;
     width: 100%;
     background: linear-gradient(
       -45deg,
       transparent 25%,
       rgba(240, 240, 240, 0.5) 25%,
       rgba(240, 240, 240, 0.5) 30%,
       transparent 30%,
       transparent 35%,
       rgba(240, 240, 240, 0.5) 35%,
       rgba(240, 240, 240, 0.5) 70%,
       transparent 70%
     );
     background-size: 75px 100%;
     animation: move 2s linear infinite;
     transform: scale(-1);
   box-shadow:inset 0 0 20px rgba(0,0,0,.2);
 }
.red {
  background: linear-gradient( 
    270deg,
    #eee 65%,
    transparent 75%
  );
  background-color:#f00;
  margin-bottom:2.5vh;
}
@media (max-width: 768px) {.bar{margin: 0 auto}}


@keyframes move {
     to {
         background-position: 75px 100%;
     }
 }

@media screen and (max-width: 490px) {
#section-1 h3, #section-4 h3{font-size: 20px}
}

.ocean { 
  height: 200px;
  width:100%;
	overflow: hidden;
	position: relative;
	bottom: 0;
	left: 0;
	z-index: 2
}

.ocean.v01 .wave {
	background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/85486/wave.svg) repeat-x; 
}

.ocean.v01 {
	transform: rotate(180deg);
	position: absolute;
	top: 0;
	left: 0;
}

.wave {
  background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/85486/wave.svg) repeat-x; 
  position: absolute;
  bottom: -25px;
  width: 6400px;
  height: 100%;
  animation: wave 7s cubic-bezier( 0.36, 0.45, 0.63, 0.53) infinite;
  transform: translate3d(0, 0, 0);
}

.wave:nth-of-type(2) {
  bottom: -25px;
  animation: wave 7s cubic-bezier( 0.36, 0.45, 0.63, 0.53) -.125s infinite, swell 7s ease -1.25s infinite;
  opacity: 1;
}

@keyframes wave {
  0% {
    margin-left: 0;
  }
  100% {
    margin-left: -1600px;
  }
}

@keyframes swell {
  0%, 100% {
    transform: translateY(-25px);
  }
  50% {
    transform: translateY(5px);
  }
}

#team_widget_div_team_form_tdj9mv45g_0{width: initial!important}

/*Barra obliqua su prezzo precedente*/


.strikethrough {
  position: relative;
}
.strikethrough:before {
  position: absolute;
  content: "";
  left: -5px;
  top: 77%;
  right: 0;
  height:4px;
  width:0;
  background:red;
  -webkit-transform:rotate(-20deg);
  -moz-transform:rotate(-20deg);
  -ms-transform:rotate(-20deg);
  -o-transform:rotate(-20deg);
  transform:rotate(-20deg);
  transform-origin:left;
  animation:grow 2s linear forwards infinite;
}
@keyframes grow{
  to {width:95px;}
}


.progress-bar {
  align-items: flex-end;
  padding: 0 10px 0 0;
  overflow: hidden;
  position: relative;
  width: 100%;
  color: #000000;
  text-align: left;
  background-color: #dedbdc;
  margin: 0 0 5px 0;
}

.progress-bar:before {
  -webkit-animation-delay: 0.15s;
          animation-delay: 0.15s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
          animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  border-radius: 0.4rem;
  content: "";
  height: 100%;
  margin-right: 3.2rem;
  left: 0;
  position: absolute;
  top: 0;
  transform-origin: left top;
  width: calc(100% - 3.2rem);
  will-change: transform;
}
.bar-1:before {
  -webkit-animation-name: progress1;
          animation-name: progress1;
  background-color: #f9c900;
}
@-webkit-keyframes progress1 {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(0.87);
  }
}
@keyframes progress1 {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(0.87);
  }
}
.bar-2:before {
  -webkit-animation-name: progress2;
          animation-name: progress2;
  background-color: #f9c900;
}
@-webkit-keyframes progress2 {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(0.10);
  }
}
@keyframes progress2 {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(0.10);
  }
}
.bar-3:before {
  -webkit-animation-name: progress3;
          animation-name: progress3;
  background-color: #f9c900;
}
@-webkit-keyframes progress3 {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(0.03);
  }
}
@keyframes progress3 {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(0.03);
  }
}
.bar-4:before {
  -webkit-animation-name: progress4;
          animation-name: progress4;
  background-color: #f9c900;
}
@-webkit-keyframes progress4 {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(0);
  }
}
@keyframes progress4 {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(0);
  }
}
.bar-5:before {
  -webkit-animation-name: progress5;
          animation-name: progress5;
  background-color: #f9c900;
}
@-webkit-keyframes progress5 {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(0);
  }
}
@keyframes progress5 {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(0);
  }
}