/*
Theme Name: Poliamulatorio Bonamed
Theme URI: https://generatepress.com
Template: generatepress
Author: FC
Author URI: 
Description: Child theme for poliambulatoriobonamed based on the GeneratePress theme
Tags: two-columns,three-columns,one-column,right-sidebar,left-sidebar,footer-widgets,blog,e-commerce,flexible-header,full-width-template,buddypress,custom-header,custom-background,custom-menu,custom-colors,sticky-post,threaded-comments,translation-ready,rtl-language-support,featured-images,theme-options
Version: 1.0.1
Updated: 2024-06-19 13:50:28
http://poliambulatoriobonamed.it
*/

/* Now Regular*/
@font-face {
    font-display: swap;
    font-family: 'Now';
    font-style: normal;
    font-weight: 400;
    src: url('http://poliambulatoriobenacus.local/wp-content/uploads/2024/03/Now-Regular.otf') format('oft');/
}

/* Now Bold*/
@font-face {
    font-display: swap;
    font-family: 'Now';
    font-style: bold;
    font-weight: 700;
    src: url('http://poliambulatoriobenacus.local/wp-content/uploads/2024/03/Now-Bold.otf') format('oft');/
}

/* Now Light*/
@font-face {
    font-display: swap;
    font-family: 'Now';
    font-style: light;
    font-weight: 300;
    src: url('http://poliambulatoriobenacus.local/wp-content/uploads/2024/03/Now-Light.otf') format('oft');/
}

/* Now Medium*/
@font-face {
    font-display: swap;
    font-family: 'Now';
    font-style: medium;
    font-weight: 500;
    src: url('http://poliambulatoriobenacus.local/wp-content/uploads/2024/03/Now-Medium.otf') format('oft');/
}


/* Contact Icons */
.mobile-icons {
    display: none;
}

.contact-icon {
    font-family: 'Now', sans-serif;
    font-weight: normal;
    text-transform: uppercase;
    color: var(--global-color-6);
    text-align: center;


}


.floating-icons {
    position: fixed;
    bottom: 0;
    right: 0;
    margin: 30px;
    display: flex;
    flex-direction: row;
    gap: 20px;
    z-index: 9999;
}

.floating-icons a {
    text-decoration: none;
}

.floating-icon {

    background-color: var(--accent);
    width: 75px;
    height: 75px;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-sizing: content-box;
    padding: 10px;
    transition: all 0.3s ease;
    border: 0px;

}

.floating-icon:hover {
    transform: scale(1.1);
    transition: all 0.3s ease;
    text-decoration: underline;
}

.floating-icon svg {
    width: 24px;
    height: 24px;
}

.floating-icon span {
    font-size: 12px;
    margin-top: 10px;

}

@media (max-width: 1024px) {
    .floating-icons {
        display: none;
    }

    .mobile-icons {
        z-index: 9999;
        position: fixed;
        margin: 0;
        bottom: 0;
        width: 100%;
        height: 75px;
        background-color: var(--contrast-3);
        display: flex;
        flex-direction: row;
        justify-content: space-evenly;

        padding: 10px;
    }

    .mobile-icons a {
        text-decoration: none;
    }

    .mobile-icon {
        display: flex;
        flex-direction: column;
        color: var(--global-color-6);
        justify-content: space-around;
        align-items: center;
        height: 100%;
        width: 90px
    }

    .mobile-icon svg {
        width: 24px;
        height: 24px;
    }

    .mobile-icon span {
        font-size: 12px;
    }
}

/* END - Contact Icons */

/* Footer */
.inside-site-info {
    justify-content: flex-start;
}

.footer-details {
    text-align: left;

}
.footer-details, .footer-details *{
    color: var(--global-color-6);
}

.footer-details ul li a,
.footer-details p {
    color: var(--global-color-6);
    text-transform: uppercase;
    text-decoration: none;
    font-size: 14px;

}

.footer-details ul li a {

    display: flex;
    flex-direction: row;
    align-items: center;

    justify-content: flex-start;
    padding: 5px 0;
}

.footer-details ul li a:hover {
    text-decoration: underline;
}

.footer-details ul li a svg {
    width: 24px;
    height: 24px;
    margin-right: 10px;
}

.footer-details p {
    margin-top: 10px;
}

.copyright-bar {
    display: none;
}

/* END - Footer */

/* Header */
.entry-title, .title-underlined {
    color: var(--contrast-3);
    position: relative;
    display: inline-block !important;
    margin: 0;
    border: 0;
    width: fit-content
}

.entry-title::after, .title-underlined::after{
    content: "";
    position: absolute;
    left: 3px;
    /* Start the border from the quarter of the element, so it will end up being half the width */
    bottom: -10px;
    display: block;
    /* width: 150px; */
    width: 50%;
    border-bottom: 5px solid var(--accent);
}


/* END - Header */

/* Accordion */

/* Core styles/functionality */

.faq_tab input {
    position: absolute;
    opacity: 0;
    z-index: -1;
}

.tab__content {
    max-height: 0;
    overflow: hidden;
    transition: all 0.35s;
    color: var(--contrast);
}
.tab__content ul li{
    font-weight: 300;
}
.faq_tab input:checked~.tab__content {
    min-height: 5rem;
    max-height: 300rem;
}

/* Visual styles */
.faq-accordion {
    color: var(--contrast-3);
    border-radius: 0.5rem;
    border: 2px solid var(--contrast-3);
    overflow: hidden;
    margin: 20px 0;
    height: auto;
}

.tab__label,
.tab__close {
    display: flex;
    color: var(--);

    cursor: pointer;
}

.tab__label {
    justify-content: space-between;
    padding: 20px;
    font-weight: 500;
    font-size: 1.25rem;
    text-transform: uppercase;
}

.tab__label::after {
    content: "\276F";
    width: 1em;
    height: 1em;
    text-align: center;
    transform: rotate(90deg);
    transition: all 0.35s;
}

.faq_tab input:checked+.tab__label::after {
    transform: rotate(270deg);
}

.tab__content p {
    margin: 0;
    padding: 10px 20px;
    color: var(--contrast);
    font-weight: 300;
}

.tab__close {
    justify-content: flex-end;
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
}

.accordion--radio {
    --theme: var(--secondary);
}

/* Arrow animation */
.faq_tab input:not(:checked)+.tab__label:hover::after {
    -webkit-animation: bounce .5s infinite;
    animation: bounce .5s infinite;
}

@-webkit-keyframes bounce {
    25% {
        transform: rotate(90deg) translate(.25rem);
    }

    75% {
        transform: rotate(90deg) translate(-.25rem);
    }
}

@keyframes bounce {
    25% {
        transform: rotate(90deg) translate(.25rem);
    }

    75% {
        transform: rotate(90deg) translate(-.25rem);
    }
}

/* END - Accordion */
.cta-container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin:0;

}
.booking-button {
    margin-left: auto;
    margin-right: auto;
    display: inline-block;
    width: 140px;
    text-decoration: none;

    background-color: var(--accent);
    padding: 10px 20px;
    border-radius: 5px;
    border: 2px solid var(--accent);
}

.booking-button:hover,
.booking-button:active, .booking-button:focus {
    background-color: var(--global-color-6);
    transition: all 0.3s ease;

}

.booking-button a {
    color: var(--global-color-6);
    text-transform: uppercase;
    text-decoration: none;
    font-size: 18px;
}

.booking-button:hover a,
.booking-button:active a {
    color: var(--accent);
}
.wpcf7-submit, #responsive-form input[type="submit"]{
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: 140px;
    background-color: var(--accent);
    padding: 10px 20px;
    border-radius: 5px;
    border: 2px solid var(--accent);
    color: var(--global-color-6);
    text-transform: uppercase;
    text-decoration: none;
    font-size: 18px;
}
#responsive-form input[type="submit"]:hover, #responsive-form input[type="submit"]:active, #responsive-form input[type="submit"]:focus{
    background-color: var(--global-color-6);
    color: var(--accent);
    transition: all 0.3s ease;
}
.elenco-servizi {
    list-style: none;
    margin: 30px 0 0 0;
}

.elenco-servizi li {
    background-color: #c4d5ee;
    border-radius: 15px;
    font-size: 20px;
    padding: 12px 14px;
    transition: 0.3s all ease-in-out;
    margin: 10px 0;
    text-decoration: none !important;
}

.elenco-servizi li:hover {
    background-color: #4d82cb;
    transition: 0.3s all ease-in-out;
}

.elenco-servizi li a {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    color: #000;
    text-decoration: none !important;

}
.elenco-servizi li a span{
    text-decoration: none !important;
}
.elenco-servizi li a:hover {

    transition: 0.3s all ease-in-out;
}

.elenco-servizi li a:hover .arrow {
    transform: translateX(5px);
    transition: 0.3s all ease-in-out;
}

.arrow {
    display: block;
    transition: 0.3s all ease-in-out;
    width: auto;
    height: 18px;
    content: url('assets/right-arrow-svgrepo-com.svg');
}


.commento-servizi {
    font-size: 20px;
    font-weight: 300;
    margin-top: 28px;
    margin-bottom: 0;
}

/* .immagine-servizio deve essere 100% dell orizzontale e responsive facendo in modo che abbia lo stesso comportamento di img-fluid in bootstrap, con altezza massima 200px, l'immagine non deve deformarsi */
.immagine-servizio {
    width: 100%;
    max-height: 300px;
    object-fit: cover;
    object-position: top center;
}

/* display flex in row with max 4 element for each row .elenco-specialisti

ul = .elenco-specialisti 
 */
.elenco-specialisti {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
    
    margin: 0 auto;
    padding: 0;
}

.elenco-specialisti li {
    width: 100%;
    flex: 1 0 22%;
    max-width: 260px;
    min-height: 380px;
    margin: 20px auto;
    padding: 0 30px;
    display: flex;
    flex-direction: column;
    
}

.elenco-specialisti li h3 {
    font-size: 24px;
    font-weight: 500;
   
    margin: 25px 0 0 0;
    text-transform: uppercase;
    color: var(--contrast-3);
    text-decoration: none !important;

}

.elenco-specialisti li p {
    font-size: 16px;
    font-weight: 300;
    margin: 0 0 10px 0;
    text-transform: uppercase;
    color: var(--contrast);
    text-decoration: none !important;
    text-align: left;
}

.elenco-specialisti li .img-specialista {
    width: 200px; 
    height: 200px; 
    border-radius: 50%; 
    overflow: hidden;
    margin-bottom: 12px;
    margin: 0 auto;
}
.elenco-specialisti .img-specialista img {
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
}


/* Inizio first level menu */
.first-level-menu {
    padding: 20px 30px;
    max-height: 75px; /* Use max-height for animation */
    overflow: hidden; /* Hide overflowing content */
    background-color: #c4d5ee;
    transition: max-height 0.5s ease-in-out; /* Animate max-height */
    border-radius: 15px;
    color: var(--contrast);
    display: flex;
    flex-direction: column;
    justify-content: center; /* Center text vertically */
}

.first-level-menu:hover {
    cursor: pointer;
}

.first-level-menu div {
    margin-top: 20px;
    max-height: 0; /* Hide the div content initially */
    overflow: hidden;
    transition: max-height 0.5s ease-in-out; /* Animate max-height */
}

.first-level-menu h3 {
    margin: 0;
    text-transform: uppercase;
}

.first-level-menu div a {
    display: inline-block;
    text-decoration: none;
    color: var(--contrast);
    text-transform: uppercase;
    font-size: 18px;
    padding: 10px 20px;
    border: 2px solid var(--contrast);
    border-radius: 25px;
    text-align: center;
}

.first-level-menu div a:hover {
    background-color: var(--contrast);
    color: var(--global-color-6);
    transition: 0.3s all ease-in-out;
}

/* Media query per dispositivi mobili */
@media only screen and (max-width: 768px) {
    .first-level-menu {
        max-height: 150px; /* Collapsed height for mobile to show title */
        overflow: hidden; /* Hide overflowing content */
        transition: max-height 0.5s ease-in-out; /* Animate max-height */
    }

    .first-level-menu.active {
        max-height: 350px; /* Expanded height for mobile */
    }

    .first-level-menu div {
        max-height: 0; /* Hide the div content initially */
        overflow: hidden; /* Hide overflowing content */
        transition: max-height 0.5s ease-in-out; /* Animate max-height */
    }

    .first-level-menu.active div {
        max-height: 290px; /* Expanded height for the inner div */
    }
}




/** CSS per contact form —**/
#responsive-form {
    margin: 30px auto 0 auto;
    width: 100%;
}

.form-row {
    width: 100%;
}

.column-half,
.column-full {
    float: left;
    position: relative;
    padding: 0.65rem;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.clearfix:after {
    content: "";
    display: table;
    clear: both;
}

#responsive-form input,
#responsive-form textarea {
    border-radius: 10px;
    border: 1px solid #777777;
    width: 100%;
    margin: 0;
}

#responsive-form p {
    color: #777777;
    margin: 0;
}

/**—————- Media query —————-**/
@media only screen and (min-width: 48em) {
    .column-half {
        width: 50%;
    }
}

/**—————- Per spostare il bottone invio a destra —————-**/


/**—————- Per cambiare il colore del bottone —————-**/
.wpcf7-submit {
    background: #000
        /*– colore sfondo –*/
    ;
    color: white
        /*– colore testo –*/
    ;
}

/**—————- Colore del bottone con il passaggio del mouse —————-**/
.wpcf7-submit:hover {
    background: #f3f3f3;
    color: #000;
}

/**—————- Per personalizzare il messaggio di successo —————-**/
div.wpcf7-mail-sent-ok {
    text-shadow: none;
    border: none;
    background: #8BC34A;
    color: white;
    font-family: ‘Raleway’;
}
/* Target the checkbox and label within the block */
#privacy-policy-checkbox span.wpcf7-list-item label,
.wpcf7-acceptance span.wpcf7-list-item label {
  display: flex; /* Allow flexbox for styling */
  flex-direction: row;
  align-items: flex-start;
}

/* Style the checkbox */
#privacy-policy-checkbox span.wpcf7-list-item label input,
.wpcf7-acceptance span.wpcf7-list-item label input {
  flex: 0 1 auto; /* Control width and prevent shrinking */
  width: 20px;
  margin: 5px 10px 0 10px;
}

/* Style the label text */
#privacy-policy-checkbox span.wpcf7-list-item label .wpcf-list-item-label,
.wpcf7-acceptance span.wpcf7-list-item label .wpcf-list-item-label {
  flex: 1 1 auto; /* Allow text to grow */
  margin-left: 20px !important; /* Apply margin to the label */
  /* Remove commented white-space: nowrap; to allow wrapping */
}


/* END - Contact Form */

#post-73 h1.entry-title {
    display: none !important;
}
.logo-footer {
    width: 100%;
    border: 0 !important;
    background-color: var(--contrast-3);
    padding: 35px 0;
}
.logo-footer div{
    text-align: center;
}
.logo-footer div img{
    width: 12%;
    max-width: 130px;
    height: auto;
}
.titolo-servizi {
    letter-spacing: 0.5px;
    margin-bottom: 5px;
}

#nostri-servizi {
    border: 2px solid var(--global-color-6);
    border-radius: 15px;
    background-color: transparent;
    padding: 20px;
    border-radius: 15px;
    margin: 20px 0;
    transition: 0.3s all ease-in-out;

}

#nostri-servizi:hover {
    background-color: var(--global-color-6);
    color: var(--contrast-3);
    transition: 0.3s all ease-in-out;
}
#menu-footer-menu{
    margin-bottom: 20px;
}
#menu-footer-menu li a {
    color: var(--global-color-6);
    text-decoration: none;
}

#menu-footer-menu li a:hover {
    text-decoration: underline;
}
.main-navigation ul ul {
box-shadow: none;
}   
#site-navigation .sub-menu{
    border-radius: 20px;
}
#menu-footer-menu .sub-menu {

    font-size: 15px;
}

.chi-siamo.swiper {
    width: 100%;
    height: 500px;

    z-index: 0;
    border-radius: 20px !important;
}

.chi-siamo.swiper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
    border-radius: 20px !important;
}

.breadcrumbs {
    padding: 0px;
    margin: 20px 0;
}

.site-header .sub-menu {
    background-color: white !important;
}

.mobile-menu-control-wrapper,
.mobile-menu-control-wrapper .menu-toggle,
.mobile-menu-control-wrapper .menu-toggle:focus, .mobile-menu-control-wrapper .menu-toggle, .mobile-menu-control-wrapper .menu-toggle:hover {
    background-color: transparent;
}
.menu-toggle:active,
.menu-toggle:focus {
    background-color: transparent !important;
}
#mobile-menu-control-wrapper, #mobile-menu-control-wrapper *{
    background-color: transparent !important;
  }
#primary-menu ul li a {
    text-transform: uppercase;
    font-weight: 500;
    color: #4696C7;
}
#primary-menu .sub-menu li a{
    font-weight: 300;
}
.has-inline-mobile-toggle #site-navigation.toggled {
    background-color: transparent;
}
#post-73 .entry-content{
    margin-top: 0;
    margin: 0 !important;
}
.menu-toggle .gp-icon.icon-menu-bars svg{
    width: 24px;
    height: 24px;
}
#page{
    padding: 0;
}
.elementor-73 .elementor-element.elementor-element-2c419fc {
min-height: 56vh;
}
tr, td, tbody, th, thead, tfoot, table{
    border: 0px solid;

}
.no-padding{
    padding-left: 0;
    padding-right: 0;
}
.img-servizio-header {
    position: relative;
    width: 100%;
    height: 200px;
    margin-bottom: 20px;
    border-radius: 20px;
}

.img-servizio-header::before {
    border-radius: 20px;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #3871c1 54%, #ffffff 100%);
    opacity: 0.5; 
}
.desktop-only{
    display: block;
}
.page-id-335 .n2-ss-slider {
    border-radius: 20px; 
    overflow: hidden;
}
.first-level-menu.green{
    background-color: #bde0bb;
}
/* Tablet max 1024px */
@media only screen and (max-width: 1024px) {
   .elenco-specialisti{
         justify-content: space-around;
   }
}
button.iubenda-tp-btn.iubenda-cs-preferences-link[title="Le tue preferenze relative al consenso per le tecnologie di tracciamento"][data-iub-enabled="1"] {
    left: 0 !important;
    right: auto !important;
}
/* mobile max 767px */
@media only screen and (max-width: 767px) {
    
    .desktop-only{
        display: none;
    }
    .footer-widget-2 {
        display: none;
    }
   

   
    #site-navigation.main-navigation.sub-menu-right.toggled{
        margin-top: 5px;
    }
    .sub-menu.toggled-on{
        border: 0px !important;
    }
    .entry-title {
        font-size: clamp(1.5rem, 2vw, 2.5rem);

    }

    .tab__label {
        font-size: 1.125rem;
    }

    .titolo-servizi {
        font-size: 28px;
    }

    .commento-servizi {
        font-size: 18px;
    }

    #privacy-policy-checkbox span label .wpcf7-list-item-label {
        white-space: normal;
    }
    .logo-footer{
        padding-bottom: 0;
    }
    .logo-footer div img{
        width: 25%;
    }
    #primary-menu *{
        font-size: 18px ;
    }
    .footer-widgets-container{
        margin-bottom: 20px;
        padding-top: 5px;
    }
    .elenco-specialisti {
        flex-direction: column;
        flex: 1 0 100%;
    }
    .elenco-specialisti li{
        min-height: auto;
    }
    div.inside-article{
        padding-top: 0 !important;
    }
    .elementor-73 .elementor-element.elementor-element-2c419fc{
        min-height: 0;
    }
    #n2-ss-2 .n2-ss-slide {
        height: 500px !important;
    }
    button.iubenda-tp-btn.iubenda-cs-preferences-link[title="Le tue preferenze relative al consenso per le tecnologie di tracciamento"][data-iub-enabled="1"] {
        right: 0 !important;
        left: auto !important;
        margin-bottom: 90px !important;
    }
    
}
/* FOOTER TUTTO ARANCIONE UNIFORME */
footer,
.site-footer,
.footer-widgets,
.footer-widgets-container,
.footer-top,
.footer-bottom,
.site-info,
#colophon,
.logo-footer {
  background: #f97316 !important;   /* Arancione Bonamed */
  background-image: none !important;
  border-top: none !important;
}

/* Testi e link in bianco nel footer */
footer,
footer * ,
.site-footer,
.site-footer * {
  color: #ffffff !important;
}

#menu-footer-menu li a {
  color: #ffffff !important;
}
#menu-footer-menu li a:hover {
  text-decoration: underline;
  opacity: 0.8;
}
/* Logo sopra al footer: stesso stile del footer */
.logo-footer {
  background-color: #f97316 !important; /* arancione Bonamed */
  text-align: center;
  padding: 35px 0;
}

.logo-footer img {
  width: 12%;
  max-width: 130px;
  height: auto;
}
.logo-footer {
  background-color: #f97316 !important;  /* arancione */
  text-align: center;
  padding: 35px 0;
}

.logo-footer img {
  max-height: 150px;
  height: auto;
  width: auto;
}
