html {
  width: 100vw;
  overflow-x: hidden;
}

.image-top {
  border-radius: 0px 0px 100px 100px;
  height: calc(100vh - 105px);
}

.image-top {
  min-height: 600px;
}

.top-image-container video {
  margin-bottom: -10px;
  height: calc(100vh - 50px);
  width: inherit;
  object-fit: cover;
}

.top-image-container {
  /*background: url("../../assets/img/bg-default.jpeg");*/
  /*background-size: cover;*/
  /*border-radius: 0 0 100px 100px;*/
  background-position: center;
  overflow: hidden;
}

@media (max-width: 991px) {
  #why-section {
    background: none !important;
  }
}

#why-section {
  background: url("../../assets/img/Perchè.svg");
  background-size: 100%;
  background-repeat: no-repeat;
}

#why-section .row {
  border-radius: 50px;
  border-width: 2px !important;
  margin-top: calc(25px + 1%);
}

#why-section .container-fluid {
  padding-left: 5%;
  padding-right: 5%;
}

.procject-col {
  width: 80px;
  /*height: 180px;*/
  /*margin: 2px;*/
  /*display: flex;*/
  /*gap: 50px;*/
  /*padding: 4.5%;*/
  /*padding-top: 32px;*/
  /*padding-bottom: 30px;*/
  text-align: center;
  padding: 21px 20px!important;
}

#project-section .row {
  padding-top: 11px;
  padding-bottom: 11px;
  margin: auto;
}

svg * {
  /*text-fill: black initial;*/
  font-family: 'neue-haas-grotesk-display','Maison Neue', Roboto, Arial, sans-serif;
}

#project-section p {
  max-width: 560px;
  font-size: 1.5rem;
}

#target-section .card-deck, #target-section #target-row {
  max-width: 1200px;
}

#target-section .card-deck .card {
  aspect-ratio: 1/1;
}

#target-section .card-deck .card {
  aspect-ratio: 1/1;
}

#arrow1 * {
  fill: var(--red) !important;
}

#arrow-4 *, #arrow-3 * {
  fill: var(--lightgreen) !important;
}

#arrow-2 *, #arrow-1 * {
  fill: var(--darkblue) !important;
}

#target-row .btn {
  border-radius: 11px;
  aspect-ratio: 1/1;
}

.flipped-top {
  transform: rotate(180deg);
}

.flipped-top {
  transform: rotate(180deg);
}

.flipped-top {
  transform: rotate(180deg);
}

.flipped {
  -webkit-transform: scaley(-1);
  transform: scaley(-1);
}

.card-body {
}

#target-section .card p.hover-show {
  transition: 1s all;
}

#target-section .card:hover p.hover-show {
  display: block !important;
  transition: 1s all;
  color: var(--primary);
}

#target-section .card:hover .hover-show {
  display: flex !important;
}

#target-section .card:hover .hover-hide {
  display: none !important;
}

#target-section .card {
  aspect-ratio: 1/1 !important;
  width: 320px !important;
  transition: background 1s;
  /*height: 320px !important;*/
}

#target-section .card:hover {
  background-color: white !important;
  color: var(--black) !important;
  /*width: 270px !important;*/
}

#target-section .card h4 {
  font-weight: 700;
}

#target-section .card:hover * {
  animation: inAnimation ease 1s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  transition: opacity 1s, transform 2s;
}

#target-section .card * {
  animation: outAnimation ease 1s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

#target-section .card:hover .card-body {
  justify-content: flex-start !important;
}

@keyframes inAnimation {
  0% {
    opacity: 0.8;
    top: 9rem;
  }
  100% {
    opacity: 1;
    top: 0px;
  }
}

@keyframes outAnimation {
  0% {
    /*opacity: 0.8;*/
    bottom: 9rem;
  }
  100% {
    opacity: 1;
    bottom: 0rem;
  }
}

@media (max-width: 1200px) {
  :root {
    font-size: 14px;
  }
}

.bootstrap-select .dropdown-menu {
  border-radius: 2rem;
  border: 2px solid var(--lightgreen);
  padding: 1rem;
  transition: display .5s;
  margin-top: 5px;
  margin-bottom: 5px;
}

.bootstrap-select .dropdown-menu li a {
  border-radius: 0.8em;
}

.bs-ok-default.check-mark {
  color: var(--secondary);
}

.form-control:focus, .bootstrap-select.show {
  border-color: var(--lightgreen) !important;
  box-shadow: 0 0 0 1px var(--lightgreen);
}

#contact-form h5, #contact-form .h5 {
  font-size: 1.125rem;
  font-weight: 800;
}

#contact-form h6, #contact-form .h6 {
  font-size: 1rem;
  font-weight: 300;
}

button {
  /*cursor: url("../../assets/img/Freccia.svg"), url("../../assets/img/Freccia.svg"), url("../../assets/img/Freccia.svg"), auto;*/
  cursor: pointer;
}

hr {
  border-width: 2px;
}

.scroll-menu {
  width: fit-content;
  right: 0px;
  left: auto;
  padding: 10px;
  /*position: sticky;*/
  /*top: 0px;*/
  /*float: right;*/
  top: calc(50vh - 100px);
  height: 250px;
}

#scroll-menu-toggle {
  border-radius: 25%;
}

@media (max-width: 767px) {
  .scroll-menu {
    /*top: 100px;*/
    right: -10px;
    display: none !important;
  }
}

div#message-container .alert {
  position: fixed;
  z-index: 99999;
  top: 0px;
  left: 0px;
  width: 100%;
  font-weight: 700;
  text-align: center;
  border-radius: initial;
  height: 60px;
}