/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Apr 11 2025 | 06:49:36 */
/* Riduce la dimensione del logo solo su dispositivi mobili */
@media (max-width: 768px) {
    .logoKomorebi img {
        max-width: 150px; /* Regola la larghezza */
        height: auto; /* Mantiene le proporzioni */
    }
}

html {
    scroll-behavior: smooth;
}

.vc_btn3-container .vc_general
{
    border-width: 1px;
}

.vc_btn3-container .vc_general:hover
{
	border-width: 1px;
}

/* Contenitore del link */
a.email-icon
{
    display: inline-flex; /* Mantiene l'icona e il testo su una linea */
    align-items: center; /* Centra verticalmente l'icona e il testo */
    position: relative; /* Per posizionare il testo email */
    color: inherit; /* Mantiene il colore originale */
    border-radius: 50%; /* Crea il cerchio */
    width: 50px; /* Dimensioni del cerchio */
    height: 50px;
    justify-content: center;
    border: 1px solid #A53A3A !important;
    background-color: #A53A3A !important;
    text-decoration: none; /* Rimuove la sottolineatura */
    transition: background-color 0.3s ease, border-color 0.3s ease; /* Animazione */
	margin-bottom: -10px;
}

/* Cambia colore del cerchio in hover */
a.email-icon:hover {
    background-color: #A43A3A !important; /* Forza il colore rosso in hover */
    border-color: #A43A3A !important; /* Cambia anche il colore del bordo */
}

/* Icona */
a.email-icon i {
    font-size: 18px; /* Dimensione dell'icona */
    color: white; /* Colore dell'icona */
}

/* Testo email */
a.email-icon:after {
    content: "info@komorebi.house"; /* Recupera l'attributo href come testo */
    display: block;
    position: absolute;
    top: 50%; /* Centra verticalmente */
    left: 100%; /* Inizia fuori dalla vista, a destra */
    transform: translate(-100%, -50%); /* Nasconde il testo inizialmente */
    white-space: nowrap; /* Evita che il testo vada a capo */
    border: 1px solid #A53A3A !important;
    background-color: #A53A3A !important;
    color: white; /* Colore del testo */
    padding: 5px 60px 5px 30px; /* Spaziatura interna del testo */
    font-size: 16px; /* Dimensione del testo */
    border-radius: 30px; /* Arrotonda i bordi del testo */
    opacity: 0; /* Rende il testo invisibile inizialmente */
    pointer-events: none; /* Disabilita interazioni sul testo */
    transition: all 0.3s ease; /* Aggiunge una transizione */
    text-decoration: none; /* Rimuove sottolineature */
}

/* Mostra il testo in hover */
a.email-icon:hover:after {
    opacity: 1; /* Rende il testo visibile */
}

/* Nascondi il testo in hover per mobile */
@media (max-width: 768px) {
	a.email-icon:hover:after {
		opacity: 0; /* Rende il testo visibile */
	}
}

/* Stile per l'icona del telefono */
a.phone-icon {
    display: inline-flex; /* Mantiene l'icona e il testo su una linea */
    align-items: center; /* Centra verticalmente l'icona e il testo */
    position: relative; /* Per posizionare il testo email */
    color: inherit; /* Mantiene il colore originale */
    border-radius: 50%; /* Crea il cerchio */
    width: 50px; /* Dimensioni del cerchio */
    height: 50px;
    justify-content: center;
    text-decoration: none; /* Rimuove la sottolineatura */
    transition: background-color 0.3s ease, border-color 0.3s ease; /* Animazione */
    border: 1px solid #A53A3A !important;
    background-color: #A53A3A !important;
}

/* Cambia colore in hover */
a.phone-icon:hover {
    background-color: #A53A3A !important; /* Forza il colore rosso in hover */
    border-color: #A53A3A !important; /* Cambia anche il colore del bordo */
}

/* Stile per l'icona del telefono */
a.phone-icon i {
    font-size: 18px; /* Dimensione dell'icona */
    color: white; /* Colore dell'icona */
}

/* Mostra il numero in hover */
a.phone-icon:after {
    content: "+39 348 7681433"; /* Numero di telefono */
    display: block;
    position: absolute;
    top: 50%; /* Centra verticalmente */
    left: 100%; /* Inizia fuori dalla vista, a destra */
    transform: translate(-100%, -50%); /* Nasconde il testo inizialmente */
    white-space: nowrap; /* Evita che il testo vada a capo */
    background-color: #A53A3A; /* Sfondo rosso per il testo */
    border: 1px solid #A53A3A; /* Bordo bianco di 1px */
    color: white; /* Colore del testo */
    padding: 5px 60px 5px 30px; /* Spaziatura interna del testo */
    font-size: 16px; /* Dimensione del testo */
    border-radius: 30px; /* Arrotonda i bordi del testo */
    opacity: 0; /* Rende il testo invisibile inizialmente */
    pointer-events: none; /* Disabilita interazioni sul testo */
    transition: all 0.3s ease; /* Aggiunge una transizione */
    text-decoration: none; /* Rimuove sottolineature */
}

/* Rende il numero visibile in hover */
a.phone-icon:hover:after {
    opacity: 1; /* Rende il testo visibile */
}

/* Nascondi il numero in hover per mobile */
@media (max-width: 768px)
{
	a.phone-icon:hover:after
	{
		opacity: 0; /* Rende il testo nascosto */
	}
}