/* ============ Global ============ */
/* colors */
body, .main__intro, .main, .menu__data, .inner, .loader {
    background-color: #020203;
}

.main__intro {
    /*background-color: #111223;*/
    background: linear-gradient(to bottom, rgba(17, 18, 35, 0), rgba(17, 18, 35, 1), rgba(17, 18, 35, 0));
}

.header.smaller {
    background-color: transparent;
}


@supports not ((-webkit-backdrop-filter: blur(20px)) or (backdrop-filter: blur(20px))) {
    .popup__content {
        background-color: #020203;
    }
}

/* end colors */

.inner__blocks {
    padding: 1rem 0;
}

.inner__container {
    margin-bottom: 2rem;
}

.section__text {
    text-align: justify;
    text-justify: inter-word;
}


/* ============ Header ============ */
/* header shadow on desktop view */
@media only screen and (min-width: 1200px) {
    .desktop-shadow {
        width: -moz-calc(100% - 5px);
        width: calc(100% - 5px);
        height: 100px;
    }
}

@media only screen and (min-width: 1400px) {
    .desktop-shadow {
        height: 120px;
    }
}

/* */
@media only screen and (min-width: 768px) {
    .header {
        padding: 3rem 0;
    }
}

@media only screen and (min-width: 1200px) {
    .header.smaller {
        padding: 4rem 0;
    }
}

.header__logo img {
    width: 25rem;
}

.socials-mobile {
    padding: 2rem 0;
}

/* ============ Loader ============ */
.loader__circle {
    background: #311aa1;
    background: -webkit-gradient(linear, left top, right top, from(#111223), to(#311aa1));
    background: -moz-linear-gradient(left, #111223 0%, #311aa1 100%);
    background: -o-linear-gradient(left, #111223 0%, #311aa1 100%);
    background: linear-gradient(to right, #111223 0%, #311aa1 100%);
}

.loader__circle img {
    width: 25rem;
}

/* ============ Menu ============ */

.navigation {
    /*padding: 6rem 0 1rem 0;*/
    padding: 1rem 0;
}

.navigation-col2 {
    padding: 1rem 0 6rem 0;
}

.navigation li {
    white-space: nowrap;
    margin-bottom: 1rem;
}

.menu .navigation li a {
    /*padding-bottom: 1rem;*/
    font: normal 600 3rem/1.5 "Poppins", sans-serif;
    /*padding-bottom: 0;*/
}

.menudata__controls {
    padding-bottom: 1rem;
}

.menu-trigger {
    background-color: transparent;
    /*color: whitesmoke;*/
    border: none;
}

.menu-trigger .menu-objects::before {
    max-width: 10px;
    background-color: whitesmoke;
}

.menu-trigger .menu-objects::after {
    content: "";
    background-color: whitesmoke;
    height: 1px;
}

/* ============ Main ============ */
#main {
    scroll-behavior: smooth;
    padding-top: 0;
}

/*reset to permit scrolling*/
@media only screen and (min-width: 1200px) {
    .main {
        overflow: auto;
    }
}

#headline {
    position: absolute;
    top: auto;
    bottom: 5rem;
}

.half_blue {
    background: linear-gradient(to top, #311aa1 50%, transparent 50%);
}


/****** sections *****/
.espace p {
    overflow: hidden;
    transition: max-height 0.5s ease;
}

.electric {
    background-color: #311aa1;
}

.voir-plus {
    display: block;
    width: 80%;
    text-align: end;
    color: whitesmoke;
    text-decoration: initial underline;
}

@media only screen and (max-width: 768px) {
    .voir-plus {
        width: 95%;
    }
}


/*titre*/
.section__subtitle {
    font-size: 3.1rem;
    margin-bottom: 3rem;
    color: whitesmoke;
    text-transform: uppercase;
}

.section__subtitle::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 40px;
    width: 75%;
    /*max-width: 40rem;*/
    height: 60%;
    background-color: #311aa1;
    z-index: -10;
    -webkit-transition: all .1s linear;
    -moz-transition: all .1s linear;
    transition: all .1s linear;
}


@media only screen and (max-width: 768px) {
    .section__subtitle {
        margin-bottom: 1.5rem;
    }

    .section__subtitle:after {
        width: 90%;
    }

}

.section__subtitle:before {
    background-color: whitesmoke;
    background: -webkit-gradient(linear, left top, right top, from(#977ec7), to(whitesmoke));
    background: -moz-linear-gradient(left, #977ec7 0%, whitesmoke 100%);
    background: -o-linear-gradient(left, #977ec7 0%, whitesmoke 100%);
    background: linear-gradient(to right, #977ec7 0%, whitesmoke 100%);
}

/*contenu texte*/
/* reduce font size & img */
@media only screen and (max-width: 768px) {
    .section__text, .section__text__ul {
        font: normal 300 1.8rem/1.3 "Poppins", sans-serif;
        margin-top: 0.2rem;
    }

}

/*list style*/
.section__text__ul {
    list-style: disc;
    padding-left: 5rem;
    color: #b3bbc3;
}

/* section's img */
/* ombre flou */
.img-light {
    -webkit-box-shadow: 0 6px 38px -9px rgba(105, 29, 255, 0.34);
    -moz-box-shadow: 0 6px 38px -9px rgba(105, 29, 255, 0.34);
    box-shadow: 0 6px 38px -9px rgba(105, 29, 255, 0.34);
}

/*size*/
.content-block img {
    width: -moz-calc(100% - 15px);
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}

@media only screen and (min-width: 768px) {
    .content-block img {
        /*width: 50%;*/
    }
}

/* ============ images Start ============ */
.main-image {
    background-image: url("../img/backgrounds/main-mobile.jpg");
    background-size: cover;
    background-position: top;
    -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(17, 18, 35, 1)), to(rgba(0, 0, 0, 0)));
}


@media only screen and (min-width: 455px) {
    .main-image {
        background-image: url("../img/backgrounds/main-desktop.jpg");
        margin-top: 80px;
    }
}

.media-image-contact {
    background-image: url("../img/backgrounds/main-mobile.jpg");
    background-size: cover;
    background-position: top;
}

.media-image-presse {
    background-image: url("../img/backgrounds/xavier-3.jpg");
    background-size: cover;
    background-position: top;
}

.menu-image-1 {
    background-image: url("../img/backgrounds/xavier-2.jpg");
}

.media-image-about {
    background-image: url("../img/backgrounds/xavier-4.jpg");
    background-size: cover;
    background-position: top;
}

/* ============ images End ============ */

/* ============ Contact ============ */
.contact .inner__container {
    margin-bottom: 1rem;
}

.contact input {
    margin-bottom: 1rem;
}

/* ============ to-top ============ */
.to-top {
    display: inline-block;
    width: 32px;
    height: 46px;
    padding: 1rem 0;
    -moz-border-radius: 15px;
    border-radius: 15px;
    position: fixed;
    right: 20px;
    bottom: 20px;
    background-color: transparent;
    border: 2px solid #ffffff;
    overflow: hidden;
    z-index: 3;
    text-align: center;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s;
    -o-transition: opacity 0.3s 0s, visibility 0s 0.3s;
    -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s;
    transition: opacity 0.3s 0s, visibility 0s 0.3s;
}

.to-top svg {
    display: block;
    width: 20px;
    height: auto;
    margin: 0 auto;
    fill: #ffffff;
    -webkit-transition: fill 0.5s;
    -o-transition: fill 0.5s;
    -moz-transition: fill 0.5s;
    transition: fill 0.5s;
}

.to-top.is-visible, .to-top.fade-out {
    -webkit-transition: opacity 0.3s 0s, visibility 0s 0s;
    -o-transition: opacity 0.3s 0s, visibility 0s 0s;
    -moz-transition: opacity 0.3s 0s, visibility 0s 0s;
    transition: opacity 0.3s 0s, visibility 0s 0s;
}

.no-touch .to-top:hover {
    -webkit-transition: opacity 0.3s 0s, visibility 0s 0s, background-color 0.5s 0s, -webkit-filter 0.5s 0s;
    transition: opacity 0.3s 0s, visibility 0s 0s, background-color 0.5s 0s, -webkit-filter 0.5s 0s;
    -o-transition: opacity 0.3s 0s, visibility 0s 0s, filter 0.5s 0s, background-color 0.5s 0s;
    -moz-transition: opacity 0.3s 0s, visibility 0s 0s, filter 0.5s 0s, background-color 0.5s 0s;
    transition: opacity 0.3s 0s, visibility 0s 0s, filter 0.5s 0s, background-color 0.5s 0s;
    transition: opacity 0.3s 0s, visibility 0s 0s, filter 0.5s 0s, background-color 0.5s 0s, -webkit-filter 0.5s 0s;
    background-color: #ffffff;
    opacity: 1;
    -webkit-filter: drop-shadow(0 0 1px #6a47af) brightness(1.1) drop-shadow(0 3px 10px #6a47af);
    filter: drop-shadow(0 0 1px #6a47af) brightness(1.1) drop-shadow(0 3px 10px #6a47af);
}

.no-touch .to-top:hover svg {
    fill: #000000;
}

.to-top.is-visible {
    visibility: visible;
    opacity: 1;
}

.to-top.fade-out {
    opacity: 1;
}

@media only screen and (min-width: 768px) {
    .to-top {
        position: fixed;
        right: 20px;
        bottom: 20px;
    }
}

@media only screen and (min-width: 1200px) {
    .to-top {
        position: fixed;
        right: 29px;
        bottom: 40px;
    }
}

@media only screen and (min-width: 1400px) {
    .to-top {
        position: fixed;
        right: 44px;
        bottom: 40px;
    }
}

/* ============ to-top End ============ */


/* ============ Mentions Légales Modal Start ============ */
.micromodal-slide.is-open {
    /*position: fixed;
    display: block;
    z-index: 9999999;*/
}

.modal__container {
    /*background-color: #4e3e3e;
    max-width: 90%;
    width: 85%;*/
    border-radius: 4px;
}

.modal__header {
    /*position: relative;*/
    /*display: block;*/
    /*height: 30px;*/
    /*margin-bottom: 0px;*/
    /*padding: 30px;*/
    /*border-top-left-radius: 4px;*/
    /*border-top-right-radius: 4px;*/
    background: #b3bbc3;
}

.modal-content-content {
    background: #07051c;
}

@media only screen and (min-width: 1200px) {
    .mention-legales-mobile {
        display: none;
    }
}

@media only screen and (max-width: 1200px) {
    .mention-legales-desktop {
        display: none;
    }
}

.modal__title {
    color: rgb(17, 18, 35);
    font-size: 2.5rem;
}

.modal__content {
    color: #ffffff;
}

.modal__content h1 {
    font: normal 600 3.2rem/1.1 "Poppins", sans-serif;
    margin-top: 2.5rem;
    margin-bottom: 1.5rem;
    text-decoration: underline;
}

.modal__content ul {
    color: rgb(179, 187, 195);
    margin: 1rem 1.5rem;
    text-align: justify;
}

.modal__content li {
    list-style-position: outside;
    /*list-style: disc outside none;*/
    display: list-item;
    margin-left: 1em;
}

.modal__content ul.disc {
    list-style: disc;
}

.modal__content ul.circle {
    list-style: circle;
}

.modal__content ul.square {
    list-style: square;
}

.modal__content p {
    text-align: justify;
    margin: 1rem 1.5rem;
}

.modal__content p span, ul span {
    font-weight: 800 !important;
    color: aliceblue;
}

.modal__content p.note {
    text-align: right !important;
    margin-right: 4rem;
    font-style: italic;
    font-size: 1.2rem;
}

.modal-section {
    margin-top: 10rem;
}

.modal-section .modal-section-title {
    font: normal 600 5rem/1.5 "Poppins", sans-serif;
    margin-top: 2.5rem;
    margin-bottom: 1.5rem;
    text-align: center;
    text-decoration: underline;
}

/* ============ Mentions Légales Modal End ============ */