/***************** PSEUDO & GENERAl CLASSES ***************/

body{  -webkit-font-smoothing: antialiased; color: #8d1913; }
input{ -webkit-appearance: none; }

a, a:visited {
	color: #8d1913;
}
a:hover, a:focus {
	color: #333;
}

#loader{ 
	opacity: 1; 
	position: absolute; 
	width: 100%; 
	height: 100%; 
	background-color: #fff; 
	z-index: 2000;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	transition: all .5s ease;
}
#progress-bar {
	height: 10px;
	background-color: #1d1d1b;
	-webkit-transition: width .5s ease;
	-moz-transition: width .5s ease;
	transition: width .5s ease;
	position: relative;
	top: 400px;
	width: 0px;
}
.hide-loader{ opacity: 0 !important; z-index: -1 !important; }

/** SPACING **/

.pad-large{
	padding-top: 88px;
	padding-bottom: 88px;
}

.pad-small{
	padding-top: 44px;
	padding-bottom: 44px;
}

.pad-bottom{
	margin-bottom: 88px;
}

/** TYPO **/

.text-white{
	color: #fff;
}

h1, h2, h3, h4, h5, h6{
	letter-spacing: 10px;
	text-transform: uppercase;
	margin-right: -10px;
}

/** ELEMENTS **/

.hr {
	background-color: #8d1913;
	height: 1px;
	margin: 0px auto;
}

.thick-hr{
	background-color: #8d1913;
	height: 6px;
	margin: 0px auto;
}

.btn {
	border: 1px solid #8d1913;
	border-right: 3px solid;
	border-bottom: 3px solid;
	padding: 15px;
	display: inline-block;
	cursor: pointer;
	position: relative;
}

.btn:hover{
	border-right: 1px solid #333;
	border-bottom: 1px solid #333;
	color: #333;
	top: 2px;
	left: 2px;

}

#quote-divider .btn:hover{
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	color: #fff;
}

.btn-wrapper{
	display: inline-block;
}

/* Pulsazione logo */
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.15); }
    100% { transform: scale(1); }
}

.pulse-logo {
    animation: pulse 1.8s infinite;
    width: 28%;
}

.page-header .box-heading {
	font-family: 'Petrona';
	font-size: 14px;
	padding: 10px;
	margin-bottom: 22px;
	display: inline-block;
}

.page-header .hr{
	margin-top: 22px;
}

#quote-divider{
	background: url('../img/location.jpg');
	background-size: cover;
	background-attachment: fixed;
	position: relative;
    background-position:center;
}

#quote-divider:before{
	content:'';
	width: 100%;
	height: 100%;
	background-color:rgba(0,0,0,0.3);
	position: absolute;
}

#quote-divider .large-8{
	padding-top: 88px;
	padding-bottom: 88px;
}

#quote-divider .thick-hr{
	margin: 0px;
	margin-top: 22px;
	margin-bottom: 32px;
	background-color: #fff;
}

#quote-divider .btn-wrapper{
	margin-right: 11px;
}

#quote-divider .btn{
	border-color: #fff;
	color: #fff;
	letter-spacing: 3px;
	font-size: 12px;
}

#quote-divider .btn i{
	margin-right: 5px;
}

#clients{
	background: url('../img/sez-img-bg.jpg');
	background-size: cover;
	background-attachment: fixed;
	position: relative;
}

#clients:before{
	content:'';
	width: 100%;
	height: 100%;
	background-color:rgba(0,0,0,0.3);
	position: absolute;
}

#clients .large-12{
	margin-top: 88px;
	margin-bottom: 44px;
}

#clients .large-12 .hr{
	background-color: #fff;
	margin-top: 22px;
}

.client{
	margin-bottom: 88px;
}

.client img{
	width: 80%;
}

.client .pad{
	position: relative;
	bottom: 20px;
}





/***************** NAVIGATION ***************/

.mobile-nav{
	display: none;
}

#nav{
	max-height: 90px;
	min-height: 90px;
	overflow: hidden;
	background-color: #fff;
	position: fixed;
	top: 0px;
	z-index: 200;
	width: 100%;
	text-align: center;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	transition: all .5s ease;
}

.open-nav{
	max-height: 300px !important;
}

.open-menu{
	display: none !important;
}

.navigation{
	overflow: hidden;
	list-style: none;
	padding-top: 37px;
	display: inline-block;
	margin-bottom: 0px;
}

.navigation li{
	float: left;
	margin-right: 44px;
	font-size: 0.7em;
	text-transform: uppercase;
	letter-spacing: 4px;
	font-family: 'Cormorant Garamond', serif;
}

.navigation li:last-child{
	margin-right: 0px;
}

	.navigation li a {
		color: #8d1913;
	}

p {
	font-family: 'Cormorant Garamond', serif;
	color: #8d1913;
}

#logo {
	display: flex;
	align-items: center;
	height: 90px;
	padding-top: 0;
}

#home{
	overflow: hidden;
}

#home-slider{
	position: relative;
	overflow: hidden;
	margin-top: 90px;
}

#home-slider .slides li{
	padding-top: 150px;
	padding-bottom: 150px;
	background-size: cover !important;
	background-position: center;
}

#home-slider .flex-direction-nav .flex-prev {
	left: -44px;
	opacity: 0.7;
	top: 48%;
}

#home-slider .flex-direction-nav .flex-next {
	right: -44px;
	opacity: 0.7;
	top: 48%;
}

#home-slider:hover .flex-direction-nav .flex-prev {
	left: 44px;
}

#home-slider:hover .flex-direction-nav .flex-next {
	right: 44px;
}

.slider-bg{
	position: absolute;
	top: 0px;
	left: 0px;
	min-width: 100%;
	min-height: 100%;
	z-index: -1;
}


#home-slider1 {
	position: relative;
	overflow: hidden;
	margin-top: 30px;
	margin-bottom: 90px;
}

	#home-slider1 .slides li {
		padding-top: 300px;
		padding-bottom: 200px;
		background-size: cover !important;
		background-position: center;
	}


.slider-bg1 {
	position: absolute;
	top: 0px;
	left: 0px;
	min-width: 100%;
	min-height: 100%;
	z-index: -1;
}

.tile-wrapper{
	border: 1px solid rgba(255,255,255,0.8);
	padding: 10px;
	width: 350px;
	height: 350px;
	margin: 0px auto;
}

.tile-wrapper-noborder{
	border: 0px solid rgba(255,255,255,0.8);
	padding: 10px;
	width: 350px;
	height: 350px;
	margin: 0px auto;
}

.slider-tile{
	width: 100%;
	background-color: rgba(255,255,255,0.8);
	margin: 0px auto;
	text-align: center;
	padding-top: 20px;
	height: 330px;
}

.slider-tile i{
	font-size: 2.5em;
}

.slider-tile h5{
	margin-top: 11px;
	margin-bottom: 22px;
}

.slider-tile .hr{
	margin-bottom: 44px;
}

.slider-tile .biline{
	width: 60%;
	font-weight: 300;
	margin: 0px auto;
	font-family: 'Petrona';
}

/***************** ABOUT ***************/

#about-text{
	columns: 2;
	-webkit-columns: 2; /* Safari and Chrome */
	-moz-columns: 2; /* Firefox */
	-webkit-column-count: 2;
	-moz-column-count: 2;
	column-count: 2;
	column-width: 420px;
	-webkit-column-width: 420px;
	-moz-column-width: 420px;
	column-gap: 60px;
	-webkit-column-gap: 60px;
	-moz-column-gap: 60px;
	-webkit-column-fill: balance;
	-moz-column-fill: balance;
	column-fill: balance;
	font-weight: 300;
	margin-bottom: 66px;
	text-align: justify;
}

.team-member{
	opacity: 0.7;
	text-align: center;
	padding: 10px;
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	transition: all .2s ease;
	cursor: pointer;
}

.team-member:hover{
	opacity: 1;

}

.team-member span{
	font-size: 14px;
}

.team-member .hr{
	margin-top: 11px;
	margin-bottom: 11px;
}

.team-social{
	list-style: none;
	overflow: hidden;
	margin: 0px auto;
	margin-bottom: 0px;
	display: inline-block;
}

.team-social li{
	float: left;
	margin-right: 5px;
}

.team-social a{
	color: #8d1913;
}

.team-social i{
	font-size: 36px;
}

.team-social li:last-child{
	margin-right: 0px;
}

.team-img-wrapper{
	margin: 0px auto;
	margin-bottom: 11px;
}

.team-img-holder img{
	width: 80%;
}


.team-member h6{
	letter-spacing: 7px;
	margin-right: -7px;
	margin-bottom: 5px;
}

/***************** SERVICES ***************/

.services-row{
	margin-bottom: 22px;
}

.services-row:last-child{
	margin-bottom: 0px;
}

.service {
	padding: 15px;
	border: 1px solid #8d1913;
	border-right: 3px solid #8d1913;
	border-bottom: 3px solid #8d1913;
	max-height: 132px;
	overflow: hidden;
	cursor: pointer;
	position: relative;
}

.service:hover{
	border-right: 1px solid #8d1913;
	border-bottom: 1px solid #8d1913;
	top: 2px;
	left: 2px;
	
}

.open-service {
	max-height: 2000px !important;
	border-right: 3px solid #8d1913;
	border-bottom: 3px solid #8d1913;
}

.open-service .hr{
	opacity: 1 !important;
}

.open-service p{
	opacity: 1 !important;
}

.service i{
	font-size: 24px;
}

.service h5{
	margin-top: 22px;
	letter-spacing: 7px;
	margin-right: -7px;
}

.service .hr{
	margin-top: 22px;
	margin-bottom: 22px;
	opacity: 0;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
}

.service p{
	opacity: 0;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	margin-bottom: 7px;
}



/***************** WORK ***************/
.work-row{
	margin-bottom: 30px;
}

.work-img-holder{
	width: 100%;
	height: 300px;
	overflow: hidden;
	position: relative;
}

.work-img-holder img{
	width: 100%;
}

.work-overlay{
	width: 100%;
	height: 100%;
	left: 0%;
	top: 0%;
	background-color: rgba(255,255,255,0.8);
	padding: 180px 15px 15px 15px;
	position: absolute;
	font-weight: 300;
	opacity: 0;
	cursor: pointer;
	-webkit-transition: all .2s;
	-moz-transition: all .2s;
	transition: all .2s;
}

.work-overlay h6{
	letter-spacing: 7px;
	margin-right: -7px;
}	

.work-overlay .hr{
	margin: 0px;
	margin-top: 11px;
	margin-bottom: 11px;
}

.work-img-holder:hover .work-overlay{
	opacity: 1;
	width: 94%;
	height: 94%;
	top: 3%;
	left: 3%;
}

.project{
	max-height: 0px;
	overflow: hidden;
	-webkit-transition: all .8s;
	-moz-transition: all .8s;
	transition: all .8s;
}

.open-project{
	max-height: 1000px !important;
}

.close-project{
	margin-top: 88px;
	margin-bottom: 44px;
	cursor: pointer;
}

.close-project i{
	font-size: 62px;
}

.work-slider{
	position: relative;
}

.project-img-holder{
	/**width: 630px;**/
	max-width:100%;
	height: 630px;
	overflow: hidden;
	margin: 0px auto;
}

.work-slider .flex-direction-nav a{
	top: 46%;
}

.work-slider .flex-direction-nav a:before {
	color: #222;
}

.project-details{
	margin-bottom: 44px;
}

.project-details .hr{
	margin-top: 22px;
	margin-bottom: 22px;
}

.project-details p{
	width: 50%;
	display:block;
	margin: 0px auto;
}	

/***************** CONTACT ***************/

#contact{
	position: relative;
	z-index: 1;
}

#contact-holder{
	
	padding-bottom: 88px;
	overflow: hidden;
	background-color: rgba(255,255,255,0.6);
	position: relative;
	z-index: 2;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s;
	opacity: 1;
}

.contact-fade{
	opacity: 0 !important;
	z-index: -1 !important;
}



#map-toggle{
	position: absolute;
	z-index: 3;
	top: 44px;
	right: 44px;
	letter-spacing: 3px;
	font-size: 12px;
}

#contact iframe{
	border: none;
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 0;
	top: 0px;
}

#contact-details{
	overflow: hidden;
	list-style: none;
}

#contact-details li{
	margin-right: 0;
	padding: 10px 10px 13px 10px;
	background-color: #fff;
	color: #8d1913;
	margin-bottom: 11px;
}

#contact-details li:last-child{
	margin-right: 0;
}

#contact-details li{
	margin: 0;
	padding: 16px 24px;
	background-color: transparent;
	color: #8d1913;
	font-weight: 400;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 170px;
}

#contact-details li + li{
	border-left: 1px solid rgba(0,0,0,0.12);
}

#contact-details li a{
	color: #8d1913;
}

#contact-details{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	padding: 0;
	margin: 24px auto 0;
	max-width: 900px;
	list-style: none;
}

/* NUOVO: Questo comando dice a tutta la riga dello schermo di allineare al centro il suo contenuto */
.super-centratore-footer {
    display: flex !important;
    justify-content: center !important; /* Centra in orizzontale */
    align-items: center !important;     /* Centra in verticale se serve */
    width: 100% !important;
    clear: both !important;
    float: none !important;
    background: none !important;
}

/* MODIFICATO: Abbiamo alleggerito questo blocco lasciando fare il lavoro al centratore sopra */
#custom-footer-section {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 500px !important;
    margin: 0 auto 40px !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: none !important;
    float: none !important;
}

/* (Il resto del CSS per l'immagine e l'overlay rimane uguale a prima) */
#custom-footer-section img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: scale(1.1) !important;
    transition: transform 350ms ease !important;
}

#custom-footer-section .custom-footer-overlay {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 100%;
    text-align: center !important;
    z-index: 10 !important;
}
#custom-footer-section .custom-footer-overlay h1 { color: #ffffff !important; margin-bottom: 15px; }
#custom-footer-section .custom-hr { width: 80px; height: 2px; background-color: #ffffff; margin: 0 auto 25px; }

#contact .row > .large-12.columns {
	display: flex;
	justify-content: center;
}

.contact-footer-image {
    position: relative;
    display: block;
    width: 100%;
    max-width: 800px;
    margin: 0 auto 40px;
    height: 500px;
    overflow: hidden;
    border-radius: 0;
    background-color: #a3a3a3; /* Il grigio di fallback */
}

/* 1. Forza l'immagine a fare da sfondo totale e fisso al contenitore */
.contact-footer-image img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    z-index: 1;
    
    /* Il tuo effetto zoom */
    transform: scale(1.03);
    transform-origin: center center;
    transition: transform 350ms ease;
}



.contact-footer-button{
	position: relative;
	z-index: 2;
	background: #fff;
	color: #8d1913 !important;
	border: 2px solid #fff;
	padding: 14px 40px;
	text-decoration: none;
	font-weight: 700;
	border-radius: 0;
	transition: all 0.3s ease;
	box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}

.contact-footer-button:hover {
	background: #8d1913;
	color: #fff !important;
	border-color: #8d1913;
}

.footer-overlay {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center; /* Centra verticalmente */
    align-items: center; /* Centra orizzontalmente */
    text-align: center; /* Assicura che il testo sia centrato */
    z-index: 2; /* Assicura che sia sopra l'immagine */
    background-color: rgba(0,0,0,0.3); /* Overlay leggero per leggibilità */
}

.footer-overlay h1 {
    /* Il colore è gestito dalla classe .text-white in index.html */
    margin-bottom: 10px; /* Spazio sotto il titolo */
    font-size: 2.5em; /* Dimensione del font regolabile */
    line-height: 1.2;
}

.white-hr {
    background-color: #fff !important; /* Assicura che la linea sia bianca */
    margin-top: 10px;
    margin-bottom: 20px;
}




@media only screen and (max-width: 767px){
	.contact-footer-image{
		height: 320px;
	}
	.contact-footer-image img{ transform: scale(1.02); }
}

@media only screen and (min-width: 1200px){
    .contact-footer-image img{ transform: scale(1.04); }
}

@media only screen and (max-width: 767px){
	.contact-footer-image{
		height: 320px;
	}

	#contact-details{
		flex-direction: column;
		gap: 8px;
		max-width: 100%;
	}

	#contact-details li + li{
		border-left: none;
		border-top: 1px solid rgba(0,0,0,0.12);
	}
}

/* Aggiunte per prettyPhoto su mobile per evitare lo "spostamento" durante lo zoom */
@media (max-width: 767px) {
    /* Forza il contenitore principale di prettyPhoto ad essere fisso e a schermo intero */
    .pp_pic_holder {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        /* Permette lo scorrimento all'interno della lightbox se il contenuto è più grande del viewport */
        overflow: auto !important;
        -webkit-overflow-scrolling: touch !important; /* Per uno scorrimento fluido su iOS */
        box-sizing: border-box !important; /* Includi padding e bordo nella dimensione totale dell'elemento */
        z-index: 99999 !important; /* Assicurati che sia sopra tutti gli altri elementi */
        transform: none !important; /* Annulla eventuali trasformazioni che potrebbero interferire */
    }

    /* Assicurati che il contenuto all'interno di prettyPhoto occupi tutto lo spazio disponibile */
    .pp_content {
        width: 100% !important;
        height: 100% !important;
        display: flex !important; /* Usa flexbox per centrare il contenuto */
        align-items: center !important; /* Centra verticalmente */
        justify-content: center !important; /* Centra orizzontalmente */
        box-sizing: border-box !important;
        padding: 10px !important; /* Aggiungi un po' di padding per non far toccare i bordi */
    }

    /* Per l'immagine stessa all'interno di prettyPhoto */
    .pp_content img {
        max-width: 100% !important;
        max-height: 100% !important;
        object-fit: contain !important; /* Assicurati che l'immagine si adatti senza essere tagliata */
        display: block !important; /* Rimuovi spazi extra attorno all'immagine */
        margin: auto !important; /* Centra l'immagine se è più piccola del contenitore */
    }

    /* Nascondi elementi di prettyPhoto che potrebbero interferire con l'esperienza mobile */
    .pp_details, .pp_nav {
        display: none !important;
    }

    /* Rendi il pulsante di chiusura più accessibile/visibile su mobile */
    .pp_close {
        position: fixed !important;
        top: 10px !important;
        right: 10px !important;
        z-index: 100000 !important; /* Z-index più alto del pp_pic_holder */
        pointer-events: auto !important;
        text-indent: 0 !important; /* Rende visibile il contenuto testuale */
        /* Stili aggiuntivi per il pulsante di chiusura per renderlo più evidente */
        background-color: rgba(0,0,0,0.7) !important; 
        border-radius: 50% !important; 
        width: 40px !important; 
        height: 40px !important; 
        line-height: 40px !important; 
        text-align: center !important; 
        color: #fff !important; 
        font-size: 24px !important; 
        text-decoration: none !important;
        border: 2px solid #fff !important;
    }

    .pp_close:before {
        content: '×' !important; /* Una X stilizzata */
        display: block;
    }

    /* Nasconde la scritta "clicca per vedere..." e simili all'interno del box ricevimento su mobile */
    .service a[rel^='prettyPhoto'] p,
    .service a[rel^='prettyPhoto'] span {
        display: none !important;
    }
}
#contact-form #name {
	overflow: hidden;
	width: 48%;
	margin-right: 2%;
	float: left;
	border-right: 3px solid #8d1913;
	border-bottom: 3px solid #8d1913;
	border-top: 1px solid #8d1913;
	border-left: 1px solid #8d1913;
	padding: 5px;
	margin-bottom: 11px;
	background-color: rgba(255,255,255,0.5);
}

#form-name{
	width: 80%;
	float: left;
	margin-bottom: 0px;
	border: none;
	background-color: rgba(0,0,0,0);
}

#contact-form #email {
	overflow: hidden;
	width: 48%;
	float: right;
	border-right: 3px solid #8d1913;
	border-bottom: 3px solid #8d1913;
	border-top: 1px solid #8d1913;
	border-left: 1px solid #8d1913;
	padding: 5px;
	margin-bottom: 11px;
	background-color: rgba(255,255,255,0.5);
}

#contact-form input,
#contact-form textarea,
#rsvp-form input,
#rsvp-form textarea {
	color: #333;
}

#contact-form input::placeholder,
#contact-form textarea::placeholder,
#rsvp-form input::placeholder,
#rsvp-form textarea::placeholder {
	color: #333;
}

#rsvp-form #rsvp-name,
#rsvp-form #rsvp-email,
#rsvp-form #rsvp-phone,
#rsvp-form #rsvp-adults,
#rsvp-form #rsvp-children,
#rsvp-form #rsvp-message,
#rsvp-form #allergies,
#rsvp-form #song {
	border-right: 3px solid #8d1913;
	border-bottom: 3px solid #8d1913;
	border-top: 1px solid #8d1913;
	border-left: 1px solid #8d1913;
	padding: 5px;
	margin-bottom: 8px;
	overflow: hidden;
	background-color: rgba(255,255,255,0.5);
}

#rsvp-form #rsvp-name,
#rsvp-form #rsvp-email,
#rsvp-form #rsvp-phone {
	width: 100%;
	float: none;
	clear: both;
}

#rsvp-form #rsvp-adults,
#rsvp-form #rsvp-children {
	width: 48%;
	float: left;
	margin-right: 2%;
}

#rsvp-form #rsvp-children {
	float: right;
	margin-right: 0;
}

#rsvp-form input,
#rsvp-form textarea {
	border: none;
	background-color: rgba(0,0,0,0);
	width: 80%;
	float: left;
	margin-bottom: 0px;
}

#rsvp-form textarea {
	height: 60px;
	width: 88%;
}

#rsvp-form .btn-wrapper{
	font-size: 12px;
	letter-spacing: 3px;
	float: right;
}

#form-email{
	width: 80%;
	float: left;
	margin-bottom: 0px;
	border: none;
	background-color: rgba(0,0,0,0);
}

.form-icon{
border-right: 2px solid #8d1913;
	float: left;
	margin-right: 11px;
	padding-right: 3px;
}	

.form-icon i{
	font-size: 29px;
}

#email .form-icon i{
	position: relative;
	bottom: 2px;
}

#message {
	border-right: 3px solid #8d1913;
	border-bottom: 3px solid #8d1913;
	border-top: 1px solid #8d1913;
	border-left: 1px solid #8d1913;
	padding: 5px;
	margin-bottom: 11px;
	overflow: hidden;
	background-color: rgba(255,255,255,0.5);
	width: 100%;
	float: none;
	clear: both;
}

#form-message{
	float: left;
	width: 88%;
	height: 100px;
	border: none;
	background-color: rgba(0,0,0,0);
}

#contact-form #adults {
	overflow: hidden;
	width: 48%;
	margin-right: 2%;
	float: left;
	border-right: 3px solid #8d1913;
	border-bottom: 3px solid #8d1913;
	border-top: 1px solid #8d1913;
	border-left: 1px solid #8d1913;
	padding: 5px;
	margin-bottom: 11px;
	background-color: rgba(255,255,255,0.5);
}

#form-adults{
	width: 80%;
	float: left;
	margin-bottom: 0px;
	border: none;
	background-color: rgba(0,0,0,0);
}

#contact-form #children {
	overflow: hidden;
	width: 48%;
	float: right;
	border-right: 3px solid #8d1913;
	border-bottom: 3px solid #8d1913;
	border-top: 1px solid #8d1913;
	border-left: 1px solid #8d1913;
	padding: 5px;
	margin-bottom: 11px;
	background-color: rgba(255,255,255,0.5);
}

#form-children{
	width: 80%;
	float: left;
	margin-bottom: 0px;
	border: none;
	background-color: rgba(0,0,0,0);
}

#allergies {
	border-right: 3px solid #8d1913;
	border-bottom: 3px solid #8d1913;
	border-top: 1px solid #8d1913;
	border-left: 1px solid #8d1913;
	padding: 5px;
	margin-bottom: 11px;
	overflow: hidden;
	background-color: rgba(255,255,255,0.5);
	width: 100%;
	float: none;
	clear: both;
}

#form-allergies{
	float: left;
	width: 88%;
	height: 80px;
	border: none;
	background-color: rgba(0,0,0,0);
}

#song {
	overflow: hidden;
	width: 100%;
	float: none;
	clear: both;
	border-right: 3px solid #8d1913;
	border-bottom: 3px solid #8d1913;
	border-top: 1px solid #8d1913;
	border-left: 1px solid #8d1913;
	padding: 5px;
	margin-bottom: 11px;
	background-color: rgba(255,255,255,0.5);
}

#form-song{
	width: 88%;
	float: left;
	margin-bottom: 0px;
	border: none;
	background-color: rgba(0,0,0,0);
}

#contact-form .btn-wrapper{
	font-size: 12px;
	letter-spacing: 3px;
	float: right;
}

#details-error{
	padding: 10px;
	background-color: #ba2f2f;
	display: inline-block;
	float: left;
	display: none;
}

#form-sent{
	padding: 10px;
	background-color: #2fba53;
	display: inline-block;
	float: left;
	display: none;
}

#footer{
	margin-top: 44px;
}

#footer .hr{
	margin-bottom: 22px;
}

#footer-social{
	overflow: hidden;
	list-style: none;
	margin-bottom: 22px;
	display: inline-block;
}

#footer-social li a{
	color: #222;
}

#footer-social li{
	float: left;
	margin-right: 11px;
}

#footer-social li:last-child{
	margin-right: 0px;
}

#footer-social li i{
	font-size: 40px;
}

#footer span{
	float: none;
	clear: both;
}

.logo-text{
	font-weight: bold;
	letter-spacing: 3px;
	margin-right: -3px;
}

#copy-text{
	opacity: 0.4;
	font-size: 12px;
}

.rsvp-radio-group p {
    font-weight: bold;
    margin-bottom: 10px; /* Aumentato il margine inferiore per migliore separazione */
    font-size: 20px;
    color: #8d1913;
    letter-spacing: 2px;
}

.rsvp-add-guest-button {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 15px !important;
    color: #8d1913 !important;
    cursor: pointer;
    font-weight: normal !important;
    display: flex !important; /* Utilizzo flex per il centraggio verticale */
    align-items: center !important; /* Centra verticalmente icona e testo */
    width: 100%; /* Full width */
    padding: 8px 15px;
    border: 2px solid #8d1913;
    border-radius: 5px;
    background-color: rgba(255,255,255,0.7);
    transition: all 0.2s ease;
    text-align: left;
    margin-bottom: 8px;
    box-sizing: border-box;
}

.rsvp-add-guest-button i {
    font-size: 14px !important; /* Simbolo + più piccolo */
    margin-right: 10px;
}

.rsvp-add-guest-button:hover {
    background-color: rgba(141, 25, 19, 0.1);
}

.rsvp-radio-group.text-left {
    margin-bottom: 15px;
    padding: 5px;
}

.rsvp-radio-group label {
    font-family: 'Cormorant Garamond', serif;
    font-size: 15px !important; /* Dimensione del font leggermente regolata per i pulsanti */
    color: #8d1913 !important;
    cursor: pointer;
    margin-bottom: 5px; /* Mantenuto un po' di margine inferiore */
    font-weight: normal !important;
    display: inline-block; /* Assicura che siano sulla stessa riga */
    padding: 8px 15px; /* Padding per un aspetto da pulsante */
    border: 1px solid #8d1913; /* Bordo del pulsante */
    border-radius: 5px; /* Angoli leggermente arrotondati */
    background-color: rgba(255,255,255,0.7); /* Sfondo chiaro */
    transition: all 0.2s ease; /* Transizione fluida per gli stati hover/checked */
    margin-right: 10px; /* Spazio tra i pulsanti */
}

.rsvp-radio-group input[type="radio"] {
    display: none; /* Nasconde il radio button nativo */
}

.rsvp-radio-group input[type="radio"]:checked + label {
    background-color: #8d1913; /* Sfondo più scuro quando selezionato */
    color: #fff !important; /* Testo bianco quando selezionato */
    border-color: #8d1913; /* Bordo più scuro quando selezionato */
}

.rsvp-radio-group label:hover {
    background-color: rgba(141, 25, 19, 0.1); /* Leggero effetto hover */
}

/* Stili specifici per i pulsanti di selezione del tipo di accompagnatore */
.guest-type-selection label {
    padding: 5px 10px; /* Padding più piccolo per le opzioni degli accompagnatori */
    font-size: 14px !important;
}

.rsvp-attendance-label {
    margin-right: 10px; /* Space between "Sì" and "No" buttons */
    margin-bottom: 5px; /* Ensure they stay on the same line if wrapping */
}

.guest-field {
    border-right: 3px solid #8d1913;
    border-bottom: 3px solid #8d1913;
    border-top: 1px solid #8d1913;
    border-left: 1px solid #8d1913;
    padding: 5px;
    margin-bottom: 8px; /* Reduced margin for compactness */
    overflow: hidden;
    background-color: rgba(255,255,255,0.5);
}

.guest-row {
    border: 1px solid #8d1913;
    padding: 10px;
    margin-bottom: 15px;
    background: rgba(255,255,255,0.2);
    text-align: left;
    position: relative;
}

.guest-row .remove-guest {
    position: absolute;
    top: 5px;
    right: 5px;
    cursor: pointer;
    color: #8d1913;
    font-size: 1.2em;
}

.guest-row h6 {
    margin-bottom: 10px;
    font-size: 11px;
    letter-spacing: 2px;
    color: #8d1913;
}

.guest-row .rsvp-radio-group {
    margin-bottom: 10px;
}

.guest-field input {
    border: none;
    background: transparent;
    width: 80%;
    margin-bottom: 0;
    color: #333;
}

/* Removed .guest-field-last as it's not needed with adjusted margins */
/* .guest-field-last {
    margin-bottom: 0;
    border-top: none;
} */

.rsvp-add-guest-wrapper {
    display: block;
    margin-bottom: 15px;
    text-align: left;
}

.rsvp-submit-button-wrapper {
    display: block;
    text-align: left;
}
.rsvp-submit-button-wrapper .btn-submit-rsvp {
    width: 100%;
}

.btn-submit-rsvp { /* Adjusted to match the template's button style */
    background-color: #8d1913; /* Primary color */
    color: #fff !important;
    border-color: #8d1913;
    border-right-color: #8d1913; /* Rosso più scuro per effetto 3D */
    border-bottom-color: #8d1913; /* Rosso più scuro per effetto 3D */
}

.btn-submit-rsvp:hover {
    background-color: #8d1913; /* Rosso più scuro al passaggio del mouse */
    border-color: #8d1913;
    color: #fff !important;
}