body{
	background-color: black;
}

.gif-media {
  display: none;
}

@media screen and (max-width: 768px) {
  .gif-media {
    display: block;
  }
}

.gif-media-2 {
	display: block;
  }
  
  @media screen and (max-width: 768px) {
	.gif-media-2 {
	  display: none;
	}
  }


.testo-about-1{
	margin-top: -1100px;
}
.testo-about-size{	
	font-size: 10rem;
}

@media screen and (max-width: 768px) {
	.testo-about-1{
		margin-top: 0px;
	}
	.testo-about-2{
		margin-bottom: 0px;
	}
	.testo-about-size{
		font-size: calc(1.625rem + 4.5vw);
	}
	.img-about{
		width: 100%;
		height: auto;
	}
}

h1{
	font-family: "mobley-sans", sans-serif;
	font-weight: 400;
	font-style: normal;
}
h2{
	font-family: "mobley-sans", sans-serif;
	font-weight: 200;
	font-style: normal;
}
h3{
	font-family: "space-grotesk-variable", sans-serif;
	font-variation-settings: "wght" 500;
}
h5{
	font-family: "space-grotesk-variable", sans-serif;
	font-variation-settings: "wght" 600;
}
.testo-home{
	margin-left: 82%;
	margin-top: 15.5%;
}
p{
	font-family: "space-grotesk-variable", sans-serif;
	font-variation-settings: "wght" 400;
}

img .img-carosello{
	height: 242px !important;
}
a{
	text-decoration: none;
	color: white;
}
.table{
	--bs-table-border-color: var(--bs-gray-200);
}

.bg-b{
	background-image: url('../img/form-bg.png');
	background-size: cover;
}

.list-group {
  --bs-list-group-bg: none;
  --bs-list-group-border-color: none;
}

/* Loader con GIF */
.loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    transition: opacity 0.5s;
}

.loader-wrapper.fade-out {
    opacity: 0;
    pointer-events: none;
}

.static {
	position:absolute;
  }
  
  .static:hover {
	opacity:0;
  }

  #loader-wrapper {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1000;
	background-color: #ffffff;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all 0.8s ease-in-out;  /* Aumentato da 0.5s a 0.8s per una transizione più lenta */
}

#loader-wrapper.fade-out {
	opacity: 0;
	visibility: hidden;
	transform: scale(1.1);
	transition: all 0.8s ease-in-out;  /* Aumentato da 0.5s a 0.8s */
}

/* Nascondi inizialmente il contenuto principale */
.content-wrapper {
	opacity: 0;
	transition: opacity 2s ease-in-out;
}

/* Mostra il contenuto principale dopo il caricamento */
.content-wrapper.visible {
	opacity: 1;
}

/* Animazione per l'immagine */
@keyframes slideInRotate {
	0% {
		transform: translateX(100%) rotate(0deg);
		opacity: 1;
	}
	100% {
		transform: translateX(0) rotate(-5deg);
		opacity: 1;
	}
}

.mx-5.mt-5 {
    position: fixed;
    top: 0;
    right: 0;
}

.menu-checkbox {
    position: absolute;
    top: 0;
    right: 0;
    width: 60px;    /* Aumentato da 40px */
    height: 60px;   /* Aumentato da 40px */
    opacity: 0;
    cursor: pointer;
    z-index: 3;
}

/* Hamburger icon container */
.hamburger {
    position: absolute;
    top: 0;
    right: 0;
    width: 60px;    /* Aumentato da 40px */
    height: 60px;   /* Aumentato da 40px */
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Styling for your custom icons */
.hamburger img {
    width: 100%;
    height: 100%;
    transition: opacity 0.3s;
    object-fit: contain;
}

.hamburger .icon-menu,
.hamburger .icon-close {
    position: absolute;
    width: 60px;    /* Aumentato da 40px */
    height: 60px;   /* Aumentato da 40px */
}

/* Show/hide icons based on menu state */
.menu-checkbox:checked ~ .hamburger .icon-menu {
	opacity: 0;
}

.menu-checkbox:checked ~ .hamburger .icon-close {
	opacity: 1;
}

.menu-checkbox:not(:checked) ~ .hamburger .icon-menu {
	opacity: 1;
}

.menu-checkbox:not(:checked) ~ .hamburger .icon-close {
	opacity: 0;
}

.menu {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	visibility: hidden;
	opacity: 0;
	background-color: rgba(0, 0, 0, 0.95);
	transition: all 0.4s;
	display: flex;
	align-items: center;
	justify-content: center;
}

.menu-checkbox:checked ~ .menu {
	visibility: visible;
	opacity: 1;
}

.menu-items {
	text-align: center;
	list-style: none;
}

.menu-items li {
	margin-bottom: 2rem;
}

.menu-items a {
	color: #fff;
	font-size: 2.5rem;
	text-decoration: none;
	font-family: Arial, sans-serif;
	transition: color 0.3s;
}

.menu-items a:hover {
	color: #ccc;
}

.welcome-section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    padding: 20px;
}

.welcome-text {
    max-width: 800px;
    text-align: center;
}

.welcome-text h1 {
    margin-bottom: 2rem;
}

.welcome-text p {
    font-size: 1.2rem;
    line-height: 1.6;
}

.nav-pills {
    --bs-nav-pills-border-radius: var(--bs-border-radius);
    --bs-nav-pills-link-active-color: #000000;
    --bs-nav-pills-link-active-bg: #ffffff;
}

.nav-link {
    color: white;
}	

:root {
	--color-primary: #621ef5;
	--color-secondary: #ffffff;
	--color-tertiary: #aaaaaa;
	--color-quaternary: #000000;
	--color-quinary: #ee6352;
  }

.text-shadows {
	text-shadow: 3px 3px 0 var(--color-secondary), 6px 6px 0 var(--color-tertiary),
	  9px 9px var(--color-quaternary), 12px 12px 0 var(--color-quinary);
	font-size: calc(2rem + 5vw);
	text-align: center;
	margin: 0;
	color: var(--color-primary);
	animation: shadows 1.2s ease-in infinite;
	letter-spacing: 0.4rem;
	z-index: 0000;
  }

  
  @keyframes shadows {
	0% {
	  text-shadow: none;
	}
	10% {
	  transform: translate(-3px, -3px);
	  text-shadow: 3px 3px 0 var(--color-secondary);
	}
	20% {
	  transform: translate(-6px, -6px);
	  text-shadow: 3px 3px 0 var(--color-secondary),
		6px 6px 0 var(--color-tertiary);
	}
	30% {
	  transform: translate(-9px, -9px);
	  text-shadow: 3px 3px 0 var(--color-secondary),
		6px 6px 0 var(--color-tertiary), 9px 9px var(--color-quaternary);
	}
	40% {
	  transform: translate(-12px, -12px);
	  text-shadow: 3px 3px 0 var(--color-secondary),
		6px 6px 0 var(--color-tertiary), 9px 9px var(--color-quaternary),
		12px 12px 0 var(--color-quinary);
	}
	50% {
	  transform: translate(-12px, -12px);
	  text-shadow: 3px 3px 0 var(--color-secondary),
		6px 6px 0 var(--color-tertiary), 9px 9px var(--color-quaternary),
		12px 12px 0 var(--color-quinary);
	}
	60% {
	  text-shadow: 3px 3px 0 var(--color-secondary),
		6px 6px 0 var(--color-tertiary), 9px 9px var(--color-quaternary),
		12px 12px 0 var(--color-quinary);
	}
	70% {
	  text-shadow: 3px 3px 0 var(--color-secondary),
		6px 6px 0 var(--color-tertiary), 9px 9px var(--color-quaternary);
	}
	80% {
	  text-shadow: 3px 3px 0 var(--color-secondary),
		6px 6px 0 var(--color-tertiary);
	}
	90% {
	  text-shadow: 3px 3px 0 var(--color-secondary);
	}
	100% {
	  text-shadow: none;
	}
  }