* {
    --transition-btn: 0.3s ease-in-out;
}

.atelier_cover {
    animation: loadIn 1.2s;
    transition-timing-function: cubic-bezier(0.35, 0.51, 0.51, 0.88);
}

.index {
    animation: loadIn 1.2s;
    transition-timing-function: cubic-bezier(0.35, 0.51, 0.51, 0.88);
}

.realisation-detail {
    animation: loadIn 1.2s;
    transition-timing-function: cubic-bezier(0.35, 0.51, 0.51, 0.88);
}

.realisation {
    animation: loadIn 1.2s;
    transition-timing-function: cubic-bezier(0.35, 0.51, 0.51, 0.88);
}

.common-cover {
    animation: loadIn 1.2s;
    transition-timing-function: cubic-bezier(0.35, 0.51, 0.51, 0.88);
}

.anim_rebound {
    margin: 2em auto;
    animation: rebound 1.5s;
    animation-delay: 0s;
    animation-direction: alternate-reverse;
    animation-iteration-count: infinite;
    transition-timing-function: ease-in-out;
}

@keyframes loadIn {
    0% {
        transform: translateY(-2vh);
        opacity: 0;
    }
}

@keyframes rebound {
    0% {
        transform: translateY(1vh);
    }
}

.nos-services_cover_nav-services_BTN-1 {
    transition: var(--transition-btn, 0.3s ease-in-out);
}

.nos-services_cover_nav-services_BTN-1:hover {
    transform: scale(1.025);
}


/* .nos-services_cover_nav-services_BTN-2 {
    transition: var(--transition-btn, 0.3s ease-in-out);
}

.nos-services_cover_nav-services_BTN-2:hover {
    transform: scale(1.025);
} */

.nos-services_cover_nav-services_BTN-2 {
    transition: 0.3s ease-in-out;
}

.nos-services_cover_nav-services_BTN-2:hover {
    transform: scale(1.02);
}

.nos-services_cover_nav-services_img {
    transition: 0.3s ease-in-out;
}

.nos-services_cover_nav-services_img:hover {
    transform: scale(1.02);
}

.nos-services_cover_nav-services_BTN-contact {
    transition: var(--transition-btn, 0.3s ease-in-out);
}

.nos-services_cover_nav-services_BTN-contact:hover {
    transform: scale(1.025);
}

.nos-service_map_btn-atelier {
    transition: var(--transition-btn, 0.3s ease-in-out);
}

.nos-service_map_btn-atelier:hover {
    transform: scale(1.025);
}

.atelier_pres_BTN {
    transition: var(--transition-btn, 0.3s ease-in-out);
}

.atelier_pres_BTN:hover {
    transform: scale(1.025);
}

.list-service_surveillance-btn {
    transition: 0.6s cubic-bezier(0.49, -0.16, 0.56, 1.08);
}

.list-service_surveillance-btn img {
    opacity: 0;
    transition: 1.5s ease-in-out;
}

.list-service_surveillance-btn-active img {
    opacity: 1;
}

.common_rebound_btn {
    transition: var(--transition-btn, 0.3s ease-in-out);
}

.common_rebound_btn:hover {
    transform: scale(1.05);
}

.list-service_surveillance-btn:hover {
    transform: scale(1.05);
}

.list-service_btn_more {
    transition: var(--transition-btn, 0.3s ease-in-out);
}

.list-service_btn_more:hover {
    transform: scale(1.2);
}

.logistique_btn-contact {
    transition: var(--transition-btn, 0.3s ease-in-out);
}

.logistique_btn-contact:hover {
    transform: scale(1.1);
}

.chantier-naval-model_contact_section_btn-contact {
    transition: 0.3s;
}

.chantier-naval-model_contact_section_btn-contact:hover {
    transform: scale(1.025);
}

.contact_fomulaire_formulaire:hover div {
    transform: scale(1.025);
}

.chantier-naval_grid section {
    transition: 0.5s ease-in-out;
}

.chantier-naval_grid section:hover {
    transform: scale(1.1);
}

@media screen and (min-width: 768px) {
    .hr-selector {
        transition: 0.5s;
        height: 3px;
        border: none;
        background: white;
        width: 1%;
        float: right;
        opacity: 0;
    }
    #atelier:hover .hr-selector {
        width: 100%;
        opacity: 1;
        float: left;
        overflow: 1;
    }
    #index:hover .hr-selector {
        width: 100%;
        opacity: 1;
        float: left;
        overflow: 1;
    }
    #realisation:hover .hr-selector {
        width: 100%;
        opacity: 1;
        float: left;
        overflow: 1;
    }
    #chantier-naval:hover .hr-selector {
        width: 100%;
        opacity: 1;
        float: left;
        overflow: 1;
    }
    #contact:hover .hr-selector {
        width: 100%;
        opacity: 1;
        float: left;
        overflow: 1;
    }
    .hr-select {
        height: 3px;
        border: none;
        background: white;
        width: 100%;
        float: right;
        opacity: 1;
    }
    .nav-bar_menu-text_sub a {
        transition: 0.5s ease-in-out;
    }
    .nav-bar_menu-text_sub li:hover {
        background: var(--main-accent-color-selector, 078db9);
    }
    .nav-bar_menu-text_sub {
        transition: 0.5s ease-in-out;
        opacity: 0;
        pointer-events: none;
    }
    #service ul {
        height: 0px;
    }
    #service:hover ul {
        opacity: 1;
        pointer-events: all;
        height: auto;
    }
}

.mail-notif_container div {
    animation: open-notif 1s;
    transition: cubic-bezier(0.49, -0.38, 0.54, 1.24);
}

@keyframes open-notif {
    0% {
        transform: scale(0.8);
        opacity: 0;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}


/* FORMULAIRE */

.contact_formulaire_form button {
    transition: var(--transition-btn, 0.3s ease-in-out);
}

.contact_formulaire_form button:hover {
    transform: scale(1.08);
}

#label-file {
    transition: var(--transition-btn, 0.3s ease-in-out);
}

#label-file:hover {
    transform: scale(1.05);
}

.contact_formulaire_form_option label {
    transition: var(--transition-btn, 0.3s ease-in-out);
}

.contact_formulaire_form_option label:hover {
    background: var(--main-accent-color-responsive);
}

.option-bateaux label:hover {
    background: var(--bateau-info-btn-color);
    color: black;
}

.option-bateaux label:hover {
    background: var(--bateau-info-btn-color);
    color: black;
}

.contact_formulaire_form input:checked+label {
    background: var(--main-accent-color-responsive);
}

.option-bateaux input:checked+label {
    background: var(--bateau-info-btn-color-select);
    color: black;
}