/* CUSTOM */

body {
  font-family: "Lato", sans-serif;
}
h1,
h2,
h3 {
  font-weight: 900;
}
h1,
h1 > div > span {
  font-size: 2.5rem;
  line-height: 2.6rem;
}

@media only screen and (min-width: 320px) {
  h1 {
    font-size: 2.5rem;
    line-height: 2.3rem;
  }
}

@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
  h1 {
    font-size: 2.5rem;
    line-height: 2.3rem;
  }
}

/* 1792x828px at 326ppi */
@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) {
  h1 {
    font-size: 2.5rem;
    line-height: 2.3rem;
  }
}

h2 {
  font-size: 3rem;
}
h4 {
  font-weight: 900;
}
.corsivo {
  font-family: "Mogra", cursive;
  font-size: 2rem;
}
.text-right {
  text-align: right;
}
.uppercase {
  text-transform: uppercase;
}
a:hover {
  color: #993366;
}

.servizi > li {
  font-size: 1.3rem;
  font-weight: 900;
  line-height: 3rem;
}
small.uppercase {
  color: #ff5757;
}
/* COLORS */
.text-white {
  color: #ffffff;
}
.text-magenta {
  color: #be5693;
}
.text-dark-magenta {
  color: #993366;
}
.text-pink {
  color: #ff9e9c;
}
.text-coral {
  color: #ff5757;
}
.text-light-blue {
  color: #66ccff;
}
.text-purple {
  color: #804ce4;
}
.text-violet {
  color: #d3c8ec;
}
.text-dark-purple {
  color: #574580;
}

.bg-white {
  background-color: #ffffff;
}
.bg-magenta {
  background-color: #be5693;
}
.bg-dark-magenta {
  background-color: #993366;
}
.bg-pink {
  background-color: #ff9e9c;
}
.bg-coral {
  background-color: #ff5757;
}
.bg-light-blue {
  background-color: #66ccff;
}
.bg-purple {
  background-color: #804ce4;
}
.bg-violet {
  background-color: #d3c8ec;
}
.bg-dark-purple {
  background-color: rgb(87, 69, 128);
}
.card {
  -webkit-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
}
.card:hover {
  border: solid 10px #d3c8ec;

  /*-webkit-transform: scale(1.05, 1.05);
  transform: scale(1.05, 1.05);
  z-index: 100;*/
}

.card > img {
  border-bottom: solid 1px #cccccc;
}
/* ANIMAZIONE Freccia */

.chevron {
  display: block;
  -webkit-animation: pulse 2s infinite;
  animation: pulse 2s infinite;
  color: #ff5757;
  font-size: 3rem;
}
h1 > i {
  font-size: 2rem;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  50% {
    -webkit-transform: translate(0, 10px);
    transform: translate(0, 10px);
  }
  100% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  50% {
    -webkit-transform: translate(0, 10px);
    transform: translate(0, 10px);
  }
  100% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

/* ANIMAZIONE TESTO H1 */

.animated {
  display: inline;
  text-indent: 8px;
}

.animated span {
  animation: topToBottom 16s ease-out infinite 0s;
  -ms-animation: topToBottom 16s ease-out infinite 0s;
  -webkit-animation: topToBottom 16s ease-out infinite 0s;
  opacity: 0;
  overflow: hidden;
  position: absolute;
}

.animated span:nth-child(2) {
  animation-delay: 4s;
  -ms-animation-delay: 4s;
  -webkit-animation-delay: 4s;
}

.animated span:nth-child(3) {
  animation-delay: 8s;
  -ms-animation-delay: 8s;
  -webkit-animation-delay: 8s;
}

.animated span:nth-child(4) {
  animation-delay: 12s;
  -ms-animation-delay: 12s;
  -webkit-animation-delay: 12s;
}
/*
.animated span:nth-child(5) {
  animation-delay: 8s;
  -ms-animation-delay: 8s;
  -webkit-animation-delay: 8s;
}*/

@keyframes topToBottom {
  0% {
    opacity: 0;
  }
  5% {
    opacity: 0;
    transform: translateY(-50px);
  }
  10% {
    opacity: 1;
    transform: translateY(0px);
  }
  25% {
    opacity: 1;
    transform: translateY(0px);
  }
  30% {
    opacity: 0;
    transform: translateY(50px);
  }
  80% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes topToBottom {
  0% {
    opacity: 0;
  }
  5% {
    opacity: 0;
    -moz-transform: translateY(-50px);
  }
  10% {
    opacity: 1;
    -moz-transform: translateY(0px);
  }
  25% {
    opacity: 1;
    -moz-transform: translateY(0px);
  }
  30% {
    opacity: 0;
    -moz-transform: translateY(50px);
  }
  80% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes topToBottom {
  0% {
    opacity: 0;
  }
  5% {
    opacity: 0;
    -webkit-transform: translateY(-50px);
  }
  10% {
    opacity: 1;
    -webkit-transform: translateY(0px);
  }
  25% {
    opacity: 1;
    -webkit-transform: translateY(0px);
  }
  30% {
    opacity: 0;
    -webkit-transform: translateY(50px);
  }
  80% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@-ms-keyframes topToBottom {
  0% {
    opacity: 0;
  }
  5% {
    opacity: 0;
    -ms-transform: translateY(-50px);
  }
  10% {
    opacity: 1;
    -ms-transform: translateY(0px);
  }
  25% {
    opacity: 1;
    -ms-transform: translateY(0px);
  }
  30% {
    opacity: 0;
    -ms-transform: translateY(50px);
  }
  80% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}