*{
	margin: 0;
	padding: 0;	
	box-sizing: border-box;
	}
body{
	background-color: #0F1F2C;
	height: 100%;
}
.preload {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #0F1F2C;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    transition: opacity 1s ease, transform 1s ease;
  }
.preload.loaded {
    opacity: 0;
    transform: translateX(-100vw);
    pointer-events: none;
  }
.spinner {
    width: 50px;
    height: 50px;
    border: 5px solid transparent;
    border-top: 5px solid #EEC06B;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin-right: 15px;
  }
@keyframes spin {
    to {
      transform: rotate(360deg);
    }
  }
  .logo {
    width: 230px;
    height: auto;
  }
section{
	padding: 100px 75px;
}
h1, .titoli span{
	color: #FFFFFF;
	font-size: 76px;
	font-family: 'Kumbh Sans',  Helvetica, Arial, "sans-serif";
	font-weight: 600;
	line-height: 150%;
	letter-spacing: -2,3px;
}
.titoli span, .testoAbout h3, .testoAbout h4, .ad-about span{
	color: #EEC06B;
}
h2{
	color: #EEC06B;
	font-size: 48px;
	font-family: 'Kumbh Sans',  Helvetica, Arial, "sans-serif";
	font-weight: 600;
	line-height: 150%;
	letter-spacing: -2,3;
}
h3{
	color: #FFFFFF;
	font-size: 32px;
	font-family: 'Kumbh Sans',  Helvetica, Arial, "sans-serif";
	font-weight: 600;
	line-height: 48px;
}
h4{
	color: #FFFFFF;
	font-size: 24px;
	font-family: 'Comfortaa',  Helvetica, Arial, "sans-serif";
	font-weight: 400;
	line-height: 120%;
}
h6{
	color: #B5B5B5;
	font-size: 18px;
	font-family: 'Comfortaa',  Helvetica, Arial, "sans-serif";
	font-weight: 400;
	line-height: 120%;
}
p, .catalogTesto ul li, .catalogTesto2 ul li{
	color: #FFFFFF;
	font-size: 16px;
	font-family: 'Comfortaa',  Helvetica, Arial, "sans-serif";
	font-weight: 400;
	line-height: 150%;
}
span{
	color: #EEC06B; 
}
.sito-navbar{
	width: 100%;
	height: 120px;
	background: linear-gradient(to bottom, #0F1F2C, transparent);
	border-bottom: 1px #FFFFFF solid;
}
.navbar-centrato{
	width: 70%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.sito-navbar .nav-link{
	position: relative;
	color: white;
    margin: 0 20px;
    font-size: 22px;
	font-family: 'Kumbh Sans',  Helvetica, Arial, "sans-serif";
	font-weight: 600;
}
.sito-navbar .nav-link:hover{
	color: #EEC06B;
}
.navbar-brand{
	margin: 0 20px;
}
.menu-icon {
    display: none;
    flex-direction: column;
    cursor: pointer;
    gap: 12px;
	z-index: 999;
	opacity: 1 !important;
    visibility: visible !important;
}
.menu-icon div {
    width: 60px;
    height: 2px;
    background-color: #FFFFFF;
    transition: transform 0.3s;
}
.menu-icon.open .line1 {
    transform: rotate(45deg) translate(5px, 5px);
}
.menu-icon.open .line2 {
    transform: rotate(-45deg) translate(5px, -5px);
}
.offcanvas-menu {
    display: flex;
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
	padding: 10px;
    background-color: #0F1F2C;
    z-index: 998;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
	transition: all 0.5s ease-out;
}
.offcanvas-menu.active{
	right: 0;
    }
.offcanvas-menu .nav-link{
    color: white;
    margin: 0 20px;
    font-size: 48px;
	font-family: 'Kumbh Sans',  Helvetica, Arial, "sans-serif";
	font-weight: 600;
    }
.offcanvas-menu .nav-link:hover{
	color: #EEC06B;
}
.menu-centrato{
	position: relative;
}
#homepage{
	background-image: url("../img/home-1.webp");
	background-size: cover;
	background-position: center;
	height: 100vh;
	margin-top: -120px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.titoli{
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	flex-wrap: nowrap;
}
.titoli h1{
	margin: 0px;
}
.titoli span{
	margin-left: 10px;
}
.subtitle-button{
	margin-top: 16px;
}
.subtitle-button h3{
	margin: 0px 0px 24px;
}
.button{
	color: #EEC06B;
	width: 200px;
	height: 62px;
	font-size: 22px;
	font-family: 'Kumbh Sans',  Helvetica, Arial, "sans-serif";
	font-weight: 600;
	margin: 0px;
	padding: 18px 27px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 2px solid #EEC06B;
	text-decoration: none;
	border-radius: 20px;
}
.button:hover{
	color: #0F1F2C;
	background-color: #EEC06B;
	transition: all .3s ease;
}
.down-lines{
	position: absolute;
	bottom: 2%;
	left: 50%;
	transform: translate(-50%, -2%);
	cursor: pointer;
}
#home-about{
	width: 100%;
	height: 100%;
}
.text-area{
	position: relative;
	margin-right: 40px;
}
.text-area p{
	padding: 32px 0px;
}
.titolo-h2, .button-container{
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
}
.titolo-h2::before{
	display: none;
	content: '';
    flex-grow: 1;
    height: 2px;
    background-color: #EEC06B;
    margin-right: 56px;
}	
.titolo-h2::after, .button-container::after{
	content: '';
    flex-grow: 1;
    height: 2px;
    background-color: #EEC06B;
    margin-left: 56px;
}
.image-area, .text-area{
	max-width: 592px;
	height: auto;
	overflow: hidden;
}
#catalog-home{
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
}
.h2-area, .button-area{
	width: 100%;
	height: 72px;
	padding: 0px 150px;
	position: relative;
}
.h2-area::before, .button-area::before{
	content: '';
    flex-grow: 1;
    height: 2px;
    background-color: #EEC06B;
    margin-right: 56px;
}
.h2-area::after, .button-area::after{
	content: '';
    flex-grow: 1;
    height: 2px;
    background-color: #EEC06B;
    margin-left: 56px;
}
.catolog-image-container{
	margin-top: 56px;
	height: 700px;
}
.image-wrapper, .image-wrapper-center{
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}
.image-wrapper-center{
	margin: 0 45px;
}
.image-wrapper img, .image-wrapper-center img{
	opacity: 0.5;
	transition: opacity 0.3s ease;
	object-fit: cover;
}
.image-wrapper:hover img, .image-wrapper-center:hover img{
    opacity: 1;
}
.image-wrapper a, .image-wrapper-center a{
	position: absolute;
	top: 75%;
	left: 50%;
	transform: translateX(-50%);
	z-index: 5;
}
#swiper-projects{
	width: 100%;
	height: 100%;
	margin: 100px 0px;
	padding: 0;
}
#swiper-projects .button-area{
	margin-top: 64px;
}
.swiper{
    width: 100%;
    height: 500px;
	margin-top: 64px;
	position: relative;
}
.swiper-slide{
	position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}
.swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.swiper .swiper-button-next, .swiper .swiper-button-prev{
	color: #EEC06B;
	position: absolute;
	top: 50%;
	z-index: 5;
}
.overlay-gradient {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 25%;
    background: linear-gradient(to top, #0F1F2C, transparent);
    z-index: 1;
  }
 .details-box {
    position: absolute;
	font-size: 20px;
	font-family: 'Comfortaa',  Helvetica, Arial, "sans-serif";
	font-weight: 400;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #0F1F2C;
    padding: 15px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
	height: 80px;  
    width: 85%; /* Regolabile */
    z-index: 2;
  }
.details-box p {
    margin: 0 16px 0px 0px;
    flex-grow: 1;
  }
.details-button, .row2 .details-button2{
	width: 110px;
	height: 56px;
	font-size: 18px;
	cursor: pointer;
	border-radius: 14px;
    transition: all 0.3s ease;
}
.details-button:hover {
    background-color: #EEC06B;
  }
.full-box-details{
		display: none;
	}
#ad-catalog{
	margin-top: 100px;
	background-image: url("../img/home-6.webp");
	background-size: cover;
	background-position: center;
	width: 100%;
	height: 550px;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}
footer{
	padding: 100px 0px 0px;
	margin: 0;
}
footer .row{
	display: flex;
	justify-content: center;
	align-items: center;
	border-top: 2px #EEC06B solid;
	border-bottom: 2px #EEC06B solid;
	padding: 0px 150px;
}

footer ul, footer img{
	margin: 80px 0px;
	text-align: start;
}
footer ul li{
	margin: 16px 0px;
}
footer a{
    color: #ffffff;
    text-decoration: none;
	font-family: 'Kumbh Sans',  Helvetica, Arial, "sans-serif";
	font-size: 35px;
	font-weight: 600;
	line-height: 48px; 
}
footer a:hover,.social-icons i:hover, .row2 .serviceTesto a, .info-container h3, #details1-home span{
    color: #EEC06B;
}
.social-icons{
	margin-top: 30px;
}
.social-icons i {
    font-size: 32px;
    margin-right: 10px;
    color: #ffffff;
	text-align: left;
}
.footer-bottom{
	padding: 90px 200px 0px;
	width: 100%;
	height: 100px;
}
.footer-bottom span{
	margin: 0 auto;
}

/*Inizio pagina Projects*/
#projects-home{
	background-image: url("../img/projects-main.webp");
	background-size: cover;
	background-position: center;
	height: 100vh;
	margin-top: -120px;
}
.box{
	width: 100%;
	height: 650px;
	padding: 0;
	margin-top: 56px;
	position: relative;
}
#projects-main, #about-main{
	padding: 0;
}
#projects-main .h2-area, #about-main .h2-area{
	padding: 0 120px;
	margin: 80px 0px 50px;
}
#projects-main .details-box{
	max-width: 1180px;
	height: 100px;
	padding: 20px;
	border-radius: 24px;
}
#projects-main .row{
	width: 70%;
	padding: 0 20px;
}
#projects-home h1, #services-home h1, #about-home h1{
	text-align: left;
	padding-left: 20%;
	}
#projects-main h3, .box-details h3, .box-details2 h3{
	font-size: 22px;
}
#projects-main p, .box-details p, .box-details2 p{
	margin-bottom: 6px;
	font-size: 14px;
}
#projects-main .details-button, .services-pack .details-button, .row2 .details-button2, .form-container .details-button, .price .details-button{
	width: 200px;
	height: 64px;
	border-radius: 24px;
}
.details .col-md-4{
	width: 31.3%;
}
.details .col-md-2{
	width: 18.7%;
}
/*inizio pagina Catalogo*/
#catalog-living-home{
	background-image: url("../img/catalog-main-1.webp");
	background-size: cover;
	background-position: center;
	height: 100vh;
	margin-top: -120px;
	padding: 120px 40px;
}
#catalog-living-home .row, #catalog-kitchen-home .row, #catalog-specif-home .row{
	padding-left: 15%;
}
#catalog-kitchen-home{
	background-image: url("../img/catalog-kit-main.webp");
	background-size: cover;
	background-position: center;
	height: 100vh;
	margin-top: -120px;
	padding: 120px 40px;
}
#catalog-specif-home{
	background-image: url("../img/catalog-spec-main.webp");
	background-size: cover;
	background-position: center;
	height: 100vh;
	margin-top: -120px;
	padding: 120px 40px;
}
#catalog-product{
	padding: 50px 100px;
}
#catalog-product .button-area .button{
	width: 250px;
}
.btn-page2{
	display: none;
}
.description{
	margin: 80px 0px;
}
.description2{
	margin: 150px 0 40px;
}
.btn-page{
	position: absolute;
    bottom: 80px;
    right: 48px;
    display: flex;
}
.btn a{
	cursor: pointer;
}
.btn img{
	width: 160px;
	height: 64px;
}
.catalogTesto{
	position: relative;
	height: 90%;
	padding: 32px;
	padding-right: 28px;
	background-color: #4B6382;
	border-bottom-right-radius: 24px;
	border-top-right-radius: 24px;
	gap: 10px;
}
.catalogTesto2{
	position: relative;
	height: 90%;
	padding: 32px;
	padding-right: 28px;
	background-color: #4B6382;
	border-bottom-left-radius: 24px;
	border-top-left-radius: 24px;
}
.price-box{
	position: absolute;
    width: 220px;
    height: 150px;
    background-color: #EEC06B;
    bottom: -110px;
    right: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 24px;
}
.price{
	gap: 8px;
}
.price h3, .price p{
	color: #0F1F2C;
}
.button-price{
	width: 190px;
	height: 60px;
	border: 2px solid #0F1F2C;
	color: #0F1F2C;
	transition: all .3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 24px;
	text-decoration: none;
	font-family: 'Kumbh Sans',  Helvetica, Arial, "sans-serif";
	font-size: 22px;
	font-weight: 600px;
}
.button-price:hover{
	color: #EEC06B;
	background-color: #0F1F2C;
}
.catalog-grid{
	margin: 80px 0px;
}
.catalog-grid .col-lg-4{
	position: sticky;
	top: 0;
}
.gallery-wrapper{
	gap: 20px;
}
.catalog-item{
	/*width: 350px;*/
	width: calc(33.33% - 20px);
	max-width: calc(33.33% - 20px);
    max-height: 470px;
    border-radius: 24px;
    overflow: hidden;
}
.catalog-item img{
	width: 100%;
    height: 100%;
    object-fit: cover;
}
.description-box{
	width: 100%;
    height: auto; /* Height of two columns */
	max-height: 100%;
    background-color: #4B6382;
    border-radius: 24px;
}
.description-box img{
    width: 100%;
	height: 350px;
    object-fit: cover;
	border-top-left-radius: 24px;
	border-top-right-radius: 24px;
}
.catalog-item.active {
    border: 5px solid #EEC06B;
  }
.product-details{
	padding: 30px 25px;
}
.description-box h3{
	font-size: 25px;
	line-height: 30px;
	margin-bottom: 20px;
}
#catalog-product .button-area::after, #catalog-product .button-area::before{
	display: none;
}
.product-info{
	display: flex;
    justify-content: space-between;
    margin: 15px 0;
	padding: 20px 18px 16px;
	text-align: left;
}
.button-price-large{
	width: 100%;
	height: 64px;
	color: #EEC06B;
	border: 2px solid #EEC06B;
	transition: all .3s ease;
	border-radius: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	font-family: 'Kumbh Sans',  Helvetica, Arial, "sans-serif";
	font-size: 22px;
	font-weight: 600px;
}
.button-price-large:hover{
	background-color: #EEC06B;
	color: #4B6382;
}
.catalog-description-boxes{
	display: none;
}
.bento-grid{
	margin: 64px 0 0;
	display: grid;
	gap: 20px;
	grid-template-areas: 'a b c'
		                 'a b c'
		                 'd b f'
		                 'd e f';
}
.colonna{
	padding: 10px;
	position: relative;
	overflow: hidden;
}
.colonna span{
	font-family: 'Comfortaa', Helvetica, Arial, "sans-serif";
	font-size: 18px;
	font-weight: 700;
}
.colonna p{
	margin-top: 8px;
}
.colonna img{
	filter: brightness(0.7);
}
.uno{
	grid-area: a;
}
.due{
	grid-area: b;
}
.tre{
	grid-area: c;
}
.quattro{
	grid-area: d;
}
.cinque{
	grid-area: e;
}
.sei{
	grid-area: f;
}
.text-grid1{
	position: absolute;
	top: 60px;
	left: 40px;
	width: 100%;
	max-width: 250px;
}
.text-grid2{
	position: absolute;
	bottom: 60px;
	left: 40px;
	width: 100%;
	max-width: 250px;
}
.text-grid3{
	position: absolute;
	top: 30%;
	left: 40px;
	width: 100%;
	max-width: 250px;
}
.text-grid4{
	position: absolute;
	top: 20%;
	left: 40px;
	width: 100%;
	max-width: 210px;
}
.text-grid5{
	position: absolute;
	bottom: 20px;
	left: 40px;
	width: 100%;
	max-width: 250px;
}
.text-grid6{
	position: absolute;
	top: 30px;
	left: 40px;
	width: 100%;
	max-width: 250px;
}
/*Inizio Pagina Details*/
#details1-home{
	background-image: url("../img/details-1.webp");
	background-size: cover;
	background-position: center;
	height: 100vh;
	margin-top: -120px;
	padding: 120px 40px;
}
#details1-home h1, #details1-home h3, #details2-home h1, #details2-home h3, #details3-home h1, #details3-home h3, #details4-home h1, #details4-home h3{
	margin-left: 20%;
}
#details2-home{
	background-image: url("../img/project-2.webp");
	background-size: cover;
	background-position: center;
	height: 100vh;
	margin-top: -120px;
	padding: 120px 40px;
}
#details3-home{
	background-image: url("../img/project-3.webp");
	background-size: cover;
	background-position: center;
	height: 100vh;
	margin-top: -120px;
	padding: 120px 40px;
}
#details4-home{
	background-image: url("../img/project-5.webp");
	background-size: cover;
	background-position: center;
	height: 100vh;
	margin-top: -120px;
	padding: 120px 40px;
}
.bottom-boxes{
	width: 93%;
	position: absolute;
	bottom: 3%;
	padding: 0 20px;
	z-index: 3;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.box-details{
	background-color: #0F1F2C;
	border-radius: 18px;
	width: 42%;
	height: auto;
	padding: 20px;
}
.details{
	display: flex;
	flex-direction: column;
	text-align: start;
}
.box-details2{
	width: 32%;
	text-align: center;
	background-color: #0F1F2C;
	border-radius: 18px;
	height: auto;
	padding: 20px;
}
.box-details2 .details-button{
	width: auto;
	height: 72px;
}
.project-overview{
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
}
.project-overview .text-area{
	
} 
.full-box-details{
	display: none;
}
#full-screen-area .container-fluid img{
	height: 750px;
}
.full-screen-details{
	padding: 80px 100px 0;
}
.screen-details{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: row-reverse;
}
.full-screen-details img{
	height: 570px;
}
.full-screen-details .text-area{
	margin-left: 40px;
	padding: 24px;
}
/*Inizio Pagina About*/
#about-home{
	background-image: url("../img/about.webp");
	background-size: cover;
	background-position: center;
	height: 100vh;
	margin-top: -120px;
}
.our-team .row{
	margin-bottom: 100px;
}
.testoAbout{
	margin: 0 30px;
	border-bottom: 2px solid #EEC06B;
}
.imageAbout .overflow-hidden{
	border-radius: 24px;
}
.ad-about{
	margin-top: 100px;
	background-image: url("../img/about-6.webp");
	background-size: cover;
	background-position: center;
	width: 100%;
	height: 800px;
	padding: 0;
}
.ad-about span{
	font-size: 76px;
	font-family: 'Kumbh Sans',  Helvetica, Arial, "sans-serif";
	font-weight: 600;
	line-height: 150%;
	letter-spacing: -2,3px;
	margin-bottom: 20px;
}
/*Inizio pagina Services*/
#services-home{
	background-image: url("../img/services.webp");
	background-size: cover;
	background-position: center;
	height: 100vh;
	margin-top: -120px;
}
.services-pack{
	margin-top: 72px;
}
.services-pack .row, .services-pack .row2{
	margin-bottom: 80px;
}
.services-pack .container{
	max-width: 1500px;
}
.serviceImage, .catalogImage{
	height: 100%;
}
.serviceTesto{
	height: 90%;
	padding: 32px;
	padding-right: 28px;
	background-color: #EEC06B;
	border-bottom-right-radius: 24px;
	border-top-right-radius: 24px;
}
.row2 .serviceTesto{
	height: 90%;
	background-color: #4B6382;
	border-bottom-right-radius: 0px;
	border-top-right-radius: 0px;
	border-bottom-left-radius: 24px;
	border-top-left-radius: 24px;
}
.serviceTesto h3, .serviceTesto p, .serviceTesto a, .serviceTesto ul li{
	color: #0F1F2C;
}
.row2 .serviceTesto h3, .row2 .serviceTesto p, .row2 .serviceTesto ul li, .info-container ul li, .catalogTesto ul li{
	color: #FFFFFF;
}
.services-pack .details-button{
	border: 2px solid #0F1F2C;
}
.services-pack .details-button:hover{
	color: #EEC06B;
	background-color: #0F1F2C;
	transition: all .3s ease;
}
.row2 .details-button2{
	border: 2px solid #EEC06B;
}
.row2 .details-button2:hover{
	color: #4B6382;
	background-color: #EEC06B;
	transition: all .3s ease;
}
.serviceTesto ul li, .row2 ul li, .info-container ul li, .form-container input, .form-container textarea, 
.full-screen-details .text-area ul li{
	font-size: 17px;
	font-family: 'Comfortaa',  Helvetica, Arial, "sans-serif";
	font-weight: 400;
}
#form-content{
		padding: 0px;
	}
.form-content h3{
	color: #EEC06B;
	margin-bottom: 56px;
}
.info-container{
	padding: 40px;
}
.info-container .titolo-h2{
	margin: 56px 0;
}
.info-container .text-area{
	max-width: 100%;
	padding: 40px;
	border-bottom: 2px solid #EEC06B;
}
.form-container{
    background-color: #0F1F2C;
    padding: 20px;
}
.form-container input, .form-container textarea{
	background-color: #0F1F2C;
	color: #BEBEBE;
    margin-bottom: 56px;
    border: 2px solid #EEC06B;
    border-radius: 24px;
    padding: 10px;
    width: 100%;
	height: 80px;
  }
.form-container textarea{
	resize: none;
	height: 250px;
}
.form-container .button-area{
	padding: 0px 20px;
}
@media (min-width:993px) and (max-width:1199px){
	section{
		padding: 80px 100px;
	}
	h1, .titoli span, .ad-about span{
		font-size: 60px;
	}
	h2{
		font-size: 38px;
	}
	h3{
		font-size: 26px;
		line-height: 150%;
	}
	h4{
		font-size: 20px;
	}
	h6{
		font-size: 12px;
	}
	p, .row .serviceTesto ul li, .row2 .serviceTesto ul li, .info-container ul li, .full-screen-details .text-area ul li{
		font-size: 14px;
	}
	.titoli{
		flex-wrap: wrap;
	}
	.titoli span{
		margin-left: 0;
        margin-top: 8px;
	}
	.navbar-brand img{
		width: 93px;
		height: 57px;
	}
	.button{
		width: 170px;
	    height: 54px;
		font-size: 17px;
		border-radius: 16px;
	}
	.down-lines img{
		width: 48px;
		height: 26px;
	}
	.h2-area, .button-area{
		padding: 0px 100px;
	}
	.catolog-image-container{
		height: 450px;
	}
	.swiper{
		height: 320px;
	}
	.details-button{
		width: 90px;
		height: 35px;
	}
	#ad-catalog{
		height: 500px;
	}
	#ad-catalog h1{
		font-size: 48px;
	}
	footer{
		padding: 80px 0px 0px;
	}
	footer .row{
		padding: 0px 100px;
	}
	footer ul, footer img{
		margin: 60px 0px;
	}
	footer img{
		width: 152px;
		height: 64px;
	}
	.social-icons{
		margin-top: 20px;
	}
	.social-icons i{
		font-size: 28px;
	}
	.footer-bottom{
		height: 100px;
		padding: 40px 150px 0px;
	}
	/*inizio Pagina Project*/
    #projects-main .h2-area{
        padding: 0 80px;
        margin: 80px 0px 50px;
    }
    #projects-main .details-box{
        border-radius: 18px;
    }
    #projects-main .row{
        width: 75%;
    }
    #projects-main .details-button{
        border-radius: 18px;
    }
    #projects-main h3{
        font-size: 20px;
    }
    #projects-main p{
        font-size: 12px;
    }
	
	.details-box .col-md-4{
	    width: 31.3%;
    }
/*inizio pagina details1*/
	#full-screen-area .container-fluid img{
		height: 560px;
	}
/*Inizio Catalogo*/
	#catalog-product, #best-sellers{
		padding: 40px 80px
	}
	.price-box{
		bottom: -100px;
		right: 40px;
	}
	.description-box img{
		height: 280px;
	}
	.description-box h3, .product-info h3{
		font-size: 20px;
		margin-bottom: 10px;
	}
	.description-box p{
		margin: 0;
		font-size: 12px;
	}
	.catalog-grid{
		margin: 56px 0;
	}
	.catalog-item{
		width: calc(50% - 20px);
		max-width: calc(50% - 20px);
	}
	.product-details{
		padding: 20px;
		text-align: center;
	}

    .description-row{
		padding: 0;
	}
	.bento-grid{
		gap: 10px;
	}
	.bento-grid span{
		font-size: 17px;
	}
	.text-grid1{
		top: 10%;
		left: 10%;
		max-width: 220px;
	}
	.text-grid2{
		max-width: 220px;
	}
	.text-grid3{
		top: 20%;
		left: 30px;
		max-width: 220px;
	}
	.text-grid5{
		bottom: 2px;
		left: 30px;
		max-width: 220px;
	}
	.text-grid6{
		top: 27px;
		left: 30px;
		max-width: 220px;
	}
 /*inizio pagina services*/
	#form-content .row{
		flex-direction: column;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.info-container img, .info-container .text-area{
		width: 710px;
		height: 500px;
	}
	.form-content{
		width: 100%;
		margin-top: 80px;
	}
	.form-container form .col-6{
		width: 100%;
	}
}

@media (min-width:768px) and (max-width:992px){
	section{
		padding: 70px 80px;
	}
	.sito-navbar{ 
		height: 100px;	
	}
	.sito-navbar .nav-link{
		font-size: 19px;
	}
	.navbar-brand img{
		width: 93px;
		height: 57px;
	}
	h1, .titoli span, .ad-about span{
		font-size: 52px;
	}
	h2{
		font-size: 30px;
	}
	h3, .serviceTesto h3{
		font-size: 21px;
		line-height: 32px;
	}
	h4{
		font-size: 18px;
	}
	p, .row .serviceTesto ul li, .row2 .serviceTesto ul li, .info-container ul li, .full-screen-details .text-area ul li{
		font-size: 14px;
	}
	.h2-area{
		padding: 0;
	}
	.h2-area, .button-area{
		padding: 0px 100px;
	}
	.down-lines img{
		width: 48px;
		height: 26px;
	}
	.text-area p{
		padding: 20px 0px;
		margin: 0;
	}
	.button, .details-button, .row2 .details-button2{
		width: 150px;
	    height: 48px;
		font-size: 14px;
		border-radius: 16px;
	}
	.catolog-image-container{
		margin: 40px 0px 0px;
		height: 350px;
	}
	#swiper-projects{
		margin-top: 70px;
	}
	.swiper{
		height: 300px;
		margin-top: 28px;
	}
	.details-button{
		width: 90px;
		height: 35px;
		border-radius: 12px;
	}
	#swiper-projects .button-area{
		margin-top: 40px;
	}
	#ad-catalog{
		height: 400px;
	}
	#ad-catalog h1{
		font-size: 48px;
	}
	footer .row{
	    padding: 0 64px;
    }
	footer ul, footer img{
		margin: 50px 0px;
	}
	footer img{
		width: 150px;
		height: 72px;
	}
	.footer-bottom{
		padding: 70px;
	}
	.social-icons{
		margin-top: 16px;
	}
	.social-icons i{
		font-size: 22px;
	}
	/*inizio Pagina Project*/
    #projects-main .h2-area{
        padding: 0 60px;
        margin: 70px 0px 20px;
    }
    #projects-main .details-box{
		width: 95%;
        border-radius: 16px;
    }
    .box{
      width: 100%;
      height: 550px;
	}
    #projects-main .row{
        width: 75%;
    }
    #projects-main .details-button{
		width: 170px;
	    height: 60px;
		font-size: 14px;
        border-radius: 16px;
    }
	#projects-home h1{
	padding-left: 15%;
	}
    #projects-main h3{
        font-size: 20px;
    }
    #projects-main p{
        font-size: 14px;
    }
    .details-box .col-md-4{
	    width: 31.3%;
    }
	#projects-main .details-box{
		display: none;
	}
	
	
	/*Inizio pagina About*/
	.imageAbout{
		margin-bottom: 40px;
		width: 500px;
	}
	.imageAbout img{
		object-fit: cover;
	}
	.testoAbout{
		text-align: center;
	}
	.ad-about{
		padding: 0 80px;
	}
/*inizio pagina Details1*/
	.box{
      width: 100%;
      height: 450px;
    }
	.full-box-details{
		display: flex;
	}
	.full-box-details .row{
		padding-left: 8%;
		margin: 40px;
	}
	.details-full{
		margin: 30px;
	}
	.btn-full-details{
		padding: 20px;
	}
	.bottom-boxes{
		display: flex;
		justify-content: center;
		width: 88%;
		bottom: 12%;
	}
	.box-details{
		display: none;
	}
	.box-details2{
		padding: 12px;
	}
	.box-details2 .row{
		flex-direction: column;
	}
	.details{
		display: flex;
		width: 100%;
		text-align: center;
		margin-bottom: 6px;
	}
	.details p{
		margin: 0;
	}
	.project-overview{
		flex-direction: column-reverse;
	}
	.project-overview .text-area{
		margin: 80px 0px;
		padding: 0;
	}
	#full-screen-area .container-fluid img{
		height: 560px;
	}
	.screen-details{
		flex-direction: column;
	}
	.screen-details .text-area{
		margin-bottom: 56px;
		margin-left: 0;
	}
	.screen-details .image-area{
		height: 500px;
	}
	
/*inizio pagina catalogo*/
	#catalog-main{
		padding: 56px 80px;
	}
	#catalog-product{
		padding: 56px 80px;
	}
	#best-sellers{
		padding: 0px 40px;
	}
	.btn-page{
		right: 20px;
	}
	.btn img{
		width: 140px;
	}
	.catalogImage img{
		height: 350px;
		object-fit: cover
	}
	.description{
		margin: 48px 0 150px;
		display: flex;
		align-items: center;
	}
	.description2{
		margin: 0px 0 70px;
		display: flex;
		align-items: center;
	}
	.description .container{
		display: flex;
		align-items: center;
		flex-direction: column;
	}
	.catalog-grid{
		display: none;
	}
	.catalog-description-boxes{
		display: block;
		margin: 40px 0px 0px;
	}
	.description-box{
		margin-bottom: 40px;
	}
	.catalogTesto, .catalogTesto2{
		display: flex;
		gap: 15px;
	}
	.catalogTesto ul, .catalogTesto2 ul{
		margin-bottom: 30px;
	}
	.catalogTesto ul li, .catalogTesto2 ul li{
		font-size: 14px;
	}
	.price-box .price h3{
		font-size: 28px;
	}
	.description-box .product-details{
		padding: 40px;
		text-align: center;
	}
	.description-row{
		padding: 0 40px;
	}
	.image-container img{
		width: 100%;
		height: 350px;
		object-fit: cover;
	}
	.product-size, .product-price{
	    margin: 15px 0;	
	}
	#catalog-product .button-area{
		margin: 20px 0;
	}
	.bento-grid{
		margin-top: 32px;
		margin-bottom: 8px;
		gap: 0;
		grid-template-areas: 'a b'
			                 'c b'
			                 'd e'
			                 'd f'
	}
/*inizio pagina services*/
	.h2-area{
		padding: 0;
	}
	.services-pack .container{
		display: flex;
		align-items: center;
		flex-direction: column;
	}
	.serviceTesto{
		display: flex;
		align-items: center;
		text-align: center;	
	}
	.serviceTesto ul{
		list-style: none;
		padding: 0;
	}
	.serviceTesto ul li{
		font-weight: 600;
	}
   .serviceTesto, .catalogTesto{
	border-bottom-right-radius: 24px;
	border-top-right-radius: 0px;
	border-bottom-left-radius: 24px;
    }  
   .row2 .serviceTesto, .catalogTesto2{
	border-bottom-right-radius: 24px;
	border-top-right-radius: 0px;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 24px;
    }
	#form-content .row{
		flex-direction: column;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.info-container img, .info-container .text-area{
		width: 710px;
		height: 500px;
	}
	.form-content{
		width: 100%;
		margin-top: 80px;
	}
	.form-container form .col-6{
		width: 100%;
	}
	.info-container img, .info-container .text-area{
		width: 600px;
		height: 415px;
	}
}
@media (max-width:767px){
	section{
		padding: 0px;
	}
	.navbar-centrato{
		width: 90%;
	}
	#homepage{
		background-image: url("../img/home-mobile.webp");
		padding: 0;
	}
	#home-about{
		margin: 64px 0px;
		padding: 0 10px;
	}
	.container{
		width: 100%;
		padding: 0px 10px;
	}
    .sito-navbar .nav-link {
        display: none;
      }
    .menu-icon {
        display: flex;
      }
	.offcanvas-menu .nav-link{
        color: white;
        margin: 0 20px 16px;
        font-size: 48px;
        font-family: 'Kumbh Sans',  Helvetica, Arial, "sans-serif";
        font-weight: 600;
        position: relative;
        text-decoration: none;
        }	
     .offcanvas-menu .nav-link:hover::before, .offcanvas-menu .nav-link:hover::after {
        content: '';
        position: absolute;
        height: 2px;
        background-color: #EEC06B;
        transition: all 0.5s ease;
        }
     .offcanvas-menu .nav-link:hover::before {
        width: 100%;
        top: 50%;
        left: -120%;
        transform: translateY(-50%);
        }
     .offcanvas-menu .nav-link:hover::after {
        width: 100%;
        top: 50%;
        right: -120%;
        transform: translateY(-50%);
        }
	h1, .titoli span, .ad-about span{
		font-size: 43px;
	}
	#homepage h1{
		font-size: 50px;
	}
	h2{
		font-size: 30px;
	}
	h3, .serviceTesto h3{
		font-size: 24px;
	}
	h4{
		font-size: 20px;
	}
	p, .serviceTesto ul li, .full-screen-details .text-area ul li{
		font-size: 15px;
	}
	.titoli{
		flex-wrap: wrap;
		justify-content: center;
	}
	.subtitle-button h3{
		font-size: 19px;
		line-height: 32px;
		padding: 0 40px;
	}
	.down-lines img{
		width: 40px;
		height: 20px;
	}
	.button{
		width: 150px;
	    height: 48px;
		font-size: 16px;
		border-radius: 16px;
		padding: 0;
	}
	#home-about .container{
		display: flex;
		flex-direction: column;
	}
	.titolo-h2::before{
		display: inline;
	}
	.button-container{
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-bottom: 64px;
	}
	.button-container::after{
		display: none;
	}
	.text-area, .h2-area{
		padding: 0 10px;
		margin: 0;
	}
	.h2-area h2, .titolo-h2{
		position: relative;
		text-decoration: none;
	}
    .h2-area::before, .titolo-h2::before, .button-area::before{
        margin-right: 20px;
    }
    .h2-area::after, .titolo-h2::after, .button-area::after{
        margin-left: 20px;
    }
    .text-area p{
		text-align: center;
        padding: 0px;
		margin-top: 32px;
    }
	.text-area a{
		margin-top: 32px;
	}
	.catolog-image-container{
		flex-direction: column;
		margin-top: 30px;
		height: auto;
	}
	.image-wrapper, .image-wrapper-center{
		width: 100%;
		height: 480px;
		margin-bottom: 56px;
	}
	.image-wrapper a, .image-wrapper-center a{
		top: 50%;
		transform: translate(-50%, -50%);
	}
	#swiper-projects{
		margin: 20px 0 50px;
	}
	.details-box{
		width: 85%;
	}
	#swiper-projects .button-area{
		margin-top: 32px;
		padding: 0 50px;
	}
	.swiper{
		margin-top: 32px;
		height: 460px;
	}
	#ad-catalog{
		margin-top: 72px;
		height: 400px;
	}
	#ad-catalog h1{
		font-size: 34px;
	}
	footer{
		padding: 50px 0px 0px
	}
	footer .row{
		padding: 32px 100px;
		flex-direction: column;
	}
	footer ul, footer img{
		margin: 32px 0px;
	}
	footer ul{
		text-align: center;
	}
	footer img{
		width: 144px;
		height: 74px;
	}
	.social-icons i{
		font-size: 28px;
	}
	.footer-bottom a {
		display: none;
	}
    .box-left {
      order: 2; /* Sposta il box sinistro al secondo posto */
    }
    .box-center {
      order: 1; /* Sposta l'immagine centrale al primo posto */
    }
    .box-right {
      order: 3;
    }
	/*Inizio pagina Project*/
	#projects-home h1, #services-home h1{
		text-align: center;
		padding-left: 0;
	}
	#projects-main h3{
		font-size: 20px;
	}
	#projects-main .h2-area{
        padding: 0 20px;
        margin: 70px 0px 20px;
    }
	#projects-main .details-box{
		display: none;
	}
	/*inizio pagina details1*/
	#details1-home .row, #details2-home .row, #details3-home .row, #details4-home .row{
		text-align: center;
	}
	#details1-home h3, #details2-home h3, #details3-home h3, #details4-home h3{
		margin: 0;
	}
	#details1-home h1, #details2-home h1, #details3-home h1, #details4-home h1{
		margin: 0;
	}
    .box{
      width: 100%;
      height: 450px;
    }
	.box-details{
		display: none;
	}
	.box-details2{
		width: 50%;
		padding: 12px;
	}
	.full-box-details{
		margin-top: 56px;
		display: flex;
	}
	.details-full{
		padding: 30px 0 30px;
	}
	.btn-full-details{
		padding: 20px;
	}
	.bottom-boxes{
		display: flex;
		justify-content: center;
		left: 4%;
		bottom: 8%;
	}
	.details2-box{
		display: none;
		padding: 12px;
		width: 30%;
	}
	.details2-box .row{
		flex-direction: column;
	}
	.details{
		display: flex;
		width: 100%;
		text-align: center;
	}
	#details1-main .image-area{
		padding: 40px;
	}
	.details p{
		margin: 0;
	}
	.box-details2 .details-button{
		height: 60px;
	}
	.project-overview{
		display: flex;
		align-items: center;
		flex-direction: column-reverse;
	}
	.project-overview, .full-screen-details{
		margin-top: 56px;
	}
	.project-overview .text-area{
		margin: 80px 0px;
	}
	.full-screen-details{
		padding: 0;
	}
	#full-screen-area .container-fluid img{
		height: 560px;
	}
	.screen-details{
		flex-direction: column;
	}
	.screen-details .text-area{
		margin: 56px 0;
		margin-left: 0;
		padding: 0;
	}
	.screen-details .text-area .titolo-h2{
		padding: 0px 15px;
	}
	.screen-details ul{
		padding: 20px 30px;
	}
	/*inizio pagina catalogo*/
	#catalog-main{
		padding: 56px 20px;
	}
	#catalog-product{
		padding: 0;
	}
	#best-sellers{
		padding: 0px 20px;
		margin-top: 56px;
	}
	#best-sellers .container-fluid{
		padding: 0px;
	}
	#catalog-specif-home h1{
		font-size: 33px;
	}
	#catalog-living-home .row, #catalog-kitchen-home .row, #catalog-specif-home .row{
	    text-align: center;
		padding: 0;
    }
	#catalog-living-home{
		background-image: url("../img/catalog-main-mobile.webp");
	}
	#catalog-spec-home{
		background-image: url("../img/catalog-spec-mobile.webp");
	}
	.btn-page{
		display: none;
	}
	.btn-page2{
		position: absolute;
		width: 100%;
		bottom: 50px;
		right: 0;
		display: flex;
		justify-content: space-between;
	}
	.btn img{
		width: 150px;
	}
	.description{
		margin: 48px 0 80px;
		display: flex;
		align-items: center;
		text-align: center;
	}
	.description2{
		margin: 0px 0 40px;
		display: flex;
		align-items: center;
		text-align: center;
	}
	.description .container, .description2 .container{
		display: flex;
		align-items: center;
		flex-direction: column;
	}
	.catalog-grid{
		display: none;
	}
	.catalog-description-boxes{
		display: block;
		padding: 0 10px;
	}
	.button-area{
		padding: 0;
	}
	.description-box {
		margin: 24px 0;
		
	}
	.image-container img{
		width: 100%;
		height: 320px;
		object-fit: cover;
	}
	.product-details h3{
		font-size: 18px;
	}
	.product-details p{
		font-size: 14px;
	}
	.catalogTesto, .catalogTesto2{
		display: flex;
		gap: 12px;
		border-radius: 0;
		align-items: center;
	}
	.catalogTesto h3, .catalogTesto2 h3{
		line-height: 32px;
	}
	.catalogTesto ul, .catalogTesto2 ul{
		margin-bottom: 30px;
		list-style: none;
		padding: 0;
	}
	.catalogTesto ul li{
		font-size: 15px;
	}
	.description-row{
		padding: 0 15px;
	}
	.price-box{
		position: static;
		width: 180px;
	}
	.price-box .price h3{
		font-size: 28px;
	}
	.button-price{
		width: auto;
		height: 50px;
		padding: 25px;
		border-radius: 16px;
	}
	.description-box .product-details{
		padding: 15px 20px;
		text-align: center;
	}
	.product-size, .product-price{
	    margin: 15px 0;	
	}
	.details-full h3{
		font-size: 25px;
	}
	#catalog-product .button-area{
		margin: 20px 0;
	}
	.bento-grid{
		margin-top: 32px;
		margin-bottom: 8px;
		gap: 0;
		grid-template-areas: 'a'
			                 'b'
			                 'c'
			                 'd'
			                 'e'
			                 'f'
	}
	.bento-grid span{
		font-size: 15px;
	}
	.bento-grid p{
		font-size: 12px;
	}
	.text-grid1{
		top: 8%;
		left: 8%;
		max-width: 210px;
	}
	.text-grid2{
		top: 70%;
		left: 8%;
		max-width: 210px;
	}
	.text-grid3{
		top: 20%;
		left: 8%;
		max-width: 210px;
	}
	.text-grid4{
		top: 18%;
		left: 22px;
		max-width: 210px;
	}
	.text-grid5{
		top: 10px;
		left: 20px;
		max-width: 190px;
	}
	.text-grid6{
		top: 22px;
		left: 20px;
		max-width: 160px;
	}
	/*Inizio pagina About*/
	#about-main .h2-area{
		padding: 0 30px;
	}
	#about-home h1{
		text-align: center;
		padding: 0;
	}
	#about-home{
		background-image: url("../img/about-mobile.webp");
	}
	.imageAbout{
		margin-bottom: 40px;
	}
	.testoAbout{
		text-align: center;
	}
	.info-container{
		padding: 30px 0;
	}
	.info-container .text-area{
		padding: 14px;
	}
	/*inizio services*/
	#services-main .h2-area{
		margin: 80px 0px 0px;
	}
	.services-pack .container{
		max-width: none;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	#form-content{
		padding: 12px;
	}
	.serviceTesto{
	    border-bottom-right-radius: 0px;
	    border-top-right-radius: 0px;
	    border-bottom-left-radius: 0px;
		text-align: center;
		display: flex;
		align-items: center;
    }
	.serviceTesto ul{
		list-style: none;
		padding: 0;
		margin-bottom: 56px;
	}
   .row2 .serviceTesto{
	    border-bottom-right-radius: 0px;
	    border-top-right-radius: 0px;
	    border-top-left-radius: 0px;
	    border-bottom-left-radius: 0px;
	    text-align: center;
    }
	
   }