/*!
 * Theme Name: 		   oceanwp-child
 * Text Domain: 	   oceanwp-child
 * Version:            0.1.0
 * Author:             catherine wallez
 * Author URI:         https://catherinewallez.com
 * Description:        oceanwp update css if necessary
 * Template:           oceanwp
 */

/**
fonts
 */
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

h1 {
    font-family: "Caveat", sans-serif;
    font-weight: 500;
    font-size: 50px !important
}

h2 {
    font-family: "Caveat", sans-serif;
    font-weight: 600;
    font-size: 42px !important
}

p {
    font-family: "Open Sans", serif;
    font-weight: 500;
    font-size: 16px !important;
}

/**
LOGO
 */

.elementor-kit-219 a:focus {
    outline: unset !important;
}

    /**
    MENU
     */
#site-navigation-wrap .dropdown-menu>li>a .nav-arrow {
    vertical-align: middle;
}

.menu-link:focus {
    outline: unset !important
}
.current_page_item .text-wrap {
    color: #273C75;
    text-decoration: underline;
}

.menu-item-499 .text-wrap:last-child {
    background-color: #E84118;
    color: white !important;
    padding: 5px 15px;
    border-radius: 3px;
    line-height: 1;
    transition: all .3s;
}

.menu-item-499 .text-wrap:last-child:hover {
    background-color: #C23616;
}

/**
ACCUEIL
 */
.conteneur-icones {
    position: relative;
    z-index: 5;
}
.encadrement {
    position: absolute;

}
.a-propos {
    position: relative;
}

/**
MUSIQUE ADAPTEE
 */



    /**
    FORMULAIRE DE CONTACT
     */
.nf-form-content label {
    font-family: "Caveat", sans-serif;
    font-size: 24px !important;
}
.nf-form-fields-required {
    font-family: "Caveat", sans-serif;
    font-size: 20px;
}

.contact-form .label-above {
    margin-bottom: 3px !important;
}

.nf-form-content .label-above .nf-field-label,
.nf-form-content .label-below .nf-field-label,
.nf-form-content .label-hidden .nf-field-label,
.label-above .nf-field-label {
margin-bottom: 3px !important;
}

.nf-form-content button,
.nf-form-content input[type=button],
.nf-form-content input[type=submit]
{
    background-color: #E84118 !important;
    font-family: 'Caveat', sans-serif;
    font-size: 24px !important;
    border-radius: 4px !important;
    text-transform: capitalize !important;
}
.nf-form-content button:hover,
.nf-form-content input[type=button]:hover,
.nf-form-content input[type=submit]:hover {
    color: white !important;
    background-color: #C23616 !important;
}


[aria-label],
[aria-label] p span,
[aria-label] p {
    font-family: "Caveat", sans-serif !important;
    font-size: 24px !important;
}

/**
FOOTER
 */
#footer-bottom #copyright {
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 1;

    letter-spacing: 1px; }
#footer-bottom #copyright a {
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 1px;
}

.container-icons {
    height: unset !important;
}

.icons {
    margin: unset !important;
}

/**
RESPONSIVE
 */


/* Écran large: 2400px et plus */
@media (min-width: 2400px) {
    /* Styles pour écrans larges */
    .container-icons {
        height: unset !important;
    }

    .icons {
        margin: unset !important;
    }
    .elementor-368,
    .elementor-element.elementor-element-2504c19 {
        --overlay-opacity: 0 !important;
    }

}

/* Ordinateur de bureau: entre 1367px et 2399px */
@media (min-width: 1367px) and (max-width: 2399px) {
    /* Styles pour ordinateurs de bureau */
    .container-icons {
        height: unset !important;
    }

    .icons {
        margin: unset !important;
    }
    .elementor-368,
    .elementor-element.elementor-element-2504c19 {
        --overlay-opacity: 0 !important;
    }


}

/* PC portable: entre 1201px et 1366px */
@media (min-width: 1024px) and (max-width: 1366px) {
    #site-navigation-wrap .dropdown-menu>li>a:first-child {
        padding-left: 0px !important;
    }

    #site-logo #site-logo-inner a img {
        max-width: 160px !important;
    }

    /* Styles pour PC portable */
    .container-icons {
        height: unset !important;
    }

    .icons {
        margin: unset !important;
    }
    .elementor-368,
    .elementor-element.elementor-element-2504c19 {
        --overlay-opacity: 0 !important;
    }

}

/* Tablette en mode portrait: entre 881px et 1024px */
@media (min-width: 768px) and (max-width: 1023px) {
    #site-navigation-wrap .dropdown-menu>li>a:first-child {
        padding-left: 0px !important;
    }

    #site-logo #site-logo-inner a img {
        max-width: 120px !important;
    }

    .services h2, .propos h2, .geolocalisation h2 {
        font-size: 30px !important;
    }

    .elementor-widget-container p {
        font-size: 14px !important;
    }

    .contact-form h2 {
        font-size: 30px !important;
    }

    .nf-form-content button,
    .nf-form-content input[type=button],
    .nf-form-content input[type=submit] {
        font-size: 14px !important;
    }

    .container-icons {
        height: unset !important;
    }

    .icons {
        margin: unset !important;
    }

    .elementor-368,
    .elementor-element.elementor-element-2504c19 {
        --overlay-opacity: 0 !important;
    }



}

/* Mobile en mode portrait: 767px et inférieur */
@media (max-width: 767px) {
    h1 {
        font-size: 42px !important;
    }

    h2 {
        font-size: 30px !important;
    }

   .elementor-widget-container p {
        font-size: 14px !important;
   }

    .elementor-button-text {
        font-size: 14px;
    }

    .contact-form h2 {
        font-size: 30px !important;

    }

    .nf-form-content button,
    .nf-form-content input[type=button],
    .nf-form-content input[type=submit]
    {
        font-size: 14px !important;
    }

    .container-icons {
        height: 55px !important;
    }

    .icons {
        margin: -75px !important;
    }

    .footer-text {
        color: white !important;
    }

    /*.services h2, .propos h2, .geolocalisation h2 {
        font-size: 30px !important;
    }*/
    /*.services p, .propos p, .geolocalisation p {
        font-size: 14px !important;
    }*/
}



/**
ALIGNEMENTS
 */

/*para desktop*/
/*@media (min-width: 1025px) {

    :root {
        --columns: 12;
        --width: 1140px;
        --offset: 0px;
        --gutter: 20px;
        --color: #f90fba14;
    }
}

/*para tablet*/
/*@media (min-width: 768px) and (max-width: 1024px) {
    :root {
        --columns: 6;
        --width: 1024px;
        --offset: 48px;
        --gutter: 16px;
        --color: #f90fba14;
    }
}

/*para mobile*/
/*@media (max-width: 767px) {
    :root {
        --columns: 4;
        --width: 767px;
        --offset: 20px;
        --gutter: 8px;
        --color: #f90fba14;
    }
}

/*não mexa em nada daqui pra baixo*/
/*body::after {
    content: "";
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin-right: auto;
    margin-left: auto;
    pointer-events: none;
    z-index: 1000;
    min-height: 100vh;
    width: calc(100% - (2 * var(--offset)));
    max-width: var(--width);
    background-size: calc(100% + var(--gutter)) 100%;
    background-image: repeating-linear-gradient(to right, var(--color), var(--color) calc((100% / var(--columns)) - var(--gutter)), transparent calc((100% / var(--columns)) - var(--gutter)), transparent calc(100% / var(--columns)));
}