/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/

h1, h2, h3, h4, p, span, a, div {
    font-family: 'Raleway', sans-serif !important;
}

.sc-color{
	color:#3DCD58 !important;
}

.el-color{
	color:#FD8204 !important;
}

.bl-color{
	color:#1A90C4 !important;
}

.h-100{
	height:100% !important;
}

.text-shadow-custom {
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6); /* X-offset, Y-offset, blur-radius, color */
}

.height-slider-custom{
	max-height: 550px !important;
}

.feature-box, .heading-block {
	opacity: 0;
	transform: translateY(50px); /* Spostamento iniziale verso il basso */
	transition: opacity 0.6s ease-out, transform 0.6s ease-out; /* Tempo dell'animazione */
}

.green-section {
	opacity: 0;
	transform: translateY(50px); /* Spostamento iniziale verso il basso */
	transition: opacity 0.6s ease-out, transform 0.6s ease-out; /* Tempo dell'animazione */
}

.heading-block.show {
	opacity: 1;
	transform: translateY(0); /* Ripristina la posizione */
}

.feature-box.show {
	opacity: 1;
	transform: translateY(0); /* Ripristina la posizione */
}

.green-section.show {
	opacity: 1;
	transform: translateY(0); /* Ripristina la posizione */
}

.sust-left, .eff-right{
	opacity: 0;
	transform: translateY(500px); /* Spostamento iniziale verso il basso */
	transition: opacity 0.6s ease-out, transform 0.6s ease-out; /* Tempo dell'animazione */
}

.sust-left.show {
	opacity: 1;
	transform: translateY(0); /* Ripristina la posizione */
}

.eff-right.show {
	opacity: 1;
	transform: translateY(0); /* Ripristina la posizione */
}

.dig-center{
	transform: translatey(-95px) !important;
}

table thead tr th{
	font-size:23px !important;
}

.table-responsive {
    width: 100%;
    overflow-x: auto; /* Abilita lo scroll orizzontale */
}

@media (max-width: 768px) {
    .table-responsive {
        /* Assicurati che la tabella abbia uno scroll orizzontale sui dispositivi mobili */
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch; /* Per un'esperienza di scrolling fluida su iOS */
    }
    
    table.table {
        width: 100%; /* Assicura che la tabella occupi il 100% dello spazio */
        min-width: 400px; /* Definisci una larghezza minima per far attivare lo scroll */
    }
}

@media screen and (max-width:1023px) {
	.prodotto-slider{
		position: relative; 
		top: 0px;
	}
	.title-top{
		font-size:45px !important;
	}
	.dig-center{
		transform: translatey(0px) !important;
	}
	.ew-mobile{
		display: block !important;
	}
}

@media screen and (min-width: 1023px) {
	.prodotto-slider{
		position: relative; 
		top: -200px;
	}
	.title-top{
		font-size:60px !important;
	}
	.ew-mobile{
		display: none !important;
	}
}

@media screen and (max-width:500px){
	.sust-left{
		transform: translate3d(0px, -40px, 0px) !important;
	}
	.eff-right{
		transform: translate3d(-80px, -40px, 0px) !important;
	}
}

@media screen and (min-width:501px) and (max-width:991px){
	.sust-left{
		transform: translate3d(40px, -70px, 0px) !important;
	}
	.eff-right{
		transform: translate3d(-100px, -70px, 0px) !important;
	}
}

@media screen and (min-width:992px) and (max-width:1299px){
	.sust-left{
		transform: translate3d(-20px, -50px, 0px) !important;
	}
	.eff-right{
		transform: translate3d(-80px, -50px, 0px) !important;
	}
}

@media screen and (min-width:1300px){
	.sust-left{
		transform: translate3d(30px, -70px, 0px) !important;
	}
	.eff-right{
		transform: translate3d(-100px, -70px, 0px) !important;
	}
}