/*Contact etablissement formulaire envoyé*/
.etab-contact-sent-bg {
    position: absolute;
    z-index: -1;
    bottom: -100px;
    right: 0px;
    width: 100%;
}

.main-img-end {
    max-width: 250px;
    width: 60%;
}

/*Etablissement Stats*/
.stats-container .stats-box {
    height: 350px;
}

.stats-container .main-select {
    max-width: 250px;
}

.stats-container .stats-box.details-stats {
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: bottom center;
    position: relative;
}

.stats-container .stats-box.details-stats .progress-bar-container {
    border-radius: 5px;
    background-color: #E1E6E8;
    margin-left: auto;
    margin-right: auto;
    width: 150px;
    height: 6px;
    position: relative;
}

.stats-container .stats-box.details-stats .progress-bar-container .progress-bar {
    position: absolute;
    height: 100%;
    border-radius: 5px;
    background-color: #19CF89;
    left: 0px;
    top: 0px;
}

.stats-container .stats-box.details-stats.first {
    background-image: url(../images/details_stats_bg1.png);
}

.stats-container .stats-box.details-stats.second {
    background-image: url(../images/details_stats_bg2.png);
}

.stats-container .stats-box.details-stats.third {
    background-image: url(../images/details_stats_bg3.png);
}

.stats-container .stats-box.details-stats.fourth {
    background-image: url(../images/details_stats_bg4.png);
}

.stats-container .stats-box.details-stats .boite-deroulante-container {
    max-width: 250px;
}

.stats-container .stats-box.details-stats .boite-deroulante-container select {
    padding: 5px 7px;
}

.stats-container .stats-box.details-stats .stats-value {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.stats-container .stats-box.details-stats .bottom-btn {
    position: absolute;
    left: calc(50% - 125px);
    bottom: 20px;
}

.stats-container .stats-box.details-stats .bottom-btn.pause {
    background-image: url(../images/icons/ic_pause_blue_rounded.svg);
    background-position: left 10px center;
    background-repeat: no-repeat;
    background-size: 25px 25px;
    padding-right: 20px;
    padding-left: 40px;
}

.stats-container .stats-box.details-stats .bottom-btn.euros {
    background-image: url(../images/icons/ic_euros_circle_green.svg);
    background-position: left 10px center;
    background-repeat: no-repeat;
    background-size: 25px 25px;
    padding-right: 20px;
    padding-left: 40px;
}

.stats-container .stats-box.details-stats .bottom-btn.offres {
    background-image: url(../images/icons/ic_briefcase_purple.svg);
}

.stats-container .avantages-premium {
    overflow: hidden;
}

.stats-container .avantages-premium button.xl {
    max-width: 350px;
    width: 100%;
}

.stats-container .fusee-container {
    height: 160px;
    position: relative;
}

.stats-container .fusee-container .little-rocket {
    position: absolute;
    width: 65px;
    height: 65px;
    top: 45px;
    left: 50%;
    transform: translate(-50%, 0%);
    animation: littleRocket 5s ease-in-out infinite;
}

@media screen and (max-width:900px) {
    .stats-container .fusee-container {
        height: 150px;
    }
}

@media screen and (max-width:450px) {
    .stats-container .stats-box {
        margin: 7px 3px;
    }
}

@keyframes littleRocket {
    0% {
        transform: translate(-50%, 0%);
        opacity: 1;
    }

    5% {
        transform: translateX(-50%) rotate(7deg);
    }

    10% {
        transform: translateX(-50%) rotate(-7deg);
    }

    15% {
        transform: translateX(-50%) rotate(5deg);
    }

    20% {
        transform: translateX(-50%) rotate(35deg);
    }

    30% {
        transform: translate(550%, 0%) rotate(45deg);
        opacity: 1;

    }

    31% {
        opacity: 0;
    }

    45% {
        transform: translate(-650%, 0%) rotate(45deg);
        opacity: 0;
    }

    46% {
        transform: translate(-650%, 0%) rotate(45deg);
        opacity: 1;
    }

    61% {
        transform: translate(-50%, 0%) rotate(45deg);

    }

    70% {
        transform: translate(-50%, 0%) rotate(0deg);

    }

    100% {
        transform: translate(-50%, 0%);
    }

}

/*Pages mot de passe oublié*/
.forgot-password-container {
    position: relative;
    min-height: 100vh;
}

.forgot-password-container .forgot-password-bg-top {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 60%;
    min-width: 400px;
    z-index: -1;
}

.forgot-password-container .forgot-password-bg-bottom {
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 40%;
    min-width: 400px;
    z-index: -1;
}

.forgot-password-container .forgot-password-content {
    padding-top: 150px;
    width: 95%;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 100px;
}

.forgot-password-container .forgot-password-content.reset {
    max-width: 400px;
}

.forgot-password-container .forgot-password-content.sms {
    max-width: 700px;
}

.forgot-password-container .forgot-password-content .illustration {
    display: block;
    max-width: 250px;
}

.forgot-password-container .forgot-password-content .validation input[type="email"] {
    flex: 1;
    min-width: 300px;
}

.forgot-password-container .forgot-password-content .validation button {
    border-radius: 5px;
}

.forgot-password-container .boite-deroulante-container.phone-indicatif {
    flex: 0 0 200px;
    max-width: 200px;
}

@media screen and (max-width:800px) {
    .forgot-password-container .forgot-password-content {
        padding-top: 50px;
    }
}

.forgot-password-container .tel-code-verif-container .code-input-container {
    margin: 0px;
}

/*Page evaluation coach*/
.evaluation-header {
    width: 100%;
    padding-top: 30px;
    padding-bottom: 30px;
}

.evaluation-header.coach {
    background: rgb(12, 162, 239);
    background: -moz-linear-gradient(90deg, rgba(12, 162, 239, 1) 0%, rgba(3, 160, 241, 1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(12, 162, 239, 1) 0%, rgba(3, 160, 241, 1) 100%);
    background: linear-gradient(90deg, rgba(12, 162, 239, 1) 0%, rgba(3, 160, 241, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0ca2ef", endColorstr="#03a0f1", GradientType=1);
}

.evaluation-header.student {
    background: #03A0F1;
    background: -moz-linear-gradient(left, #03A0F1 0%, #19CF89 100%);
    background: -webkit-linear-gradient(left, #03A0F1 0%, #19CF89 100%);
    background: linear-gradient(to right, #03A0F1 0%, #19CF89 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#03A0F1', endColorstr='#19CF89', GradientType=1);

}

.evaluation-header .evaluation-header-content .profil-img {
    width: 180px;
    height: 180px;
    border: solid 3px white;
    border-radius: 50%;
}

.evaluation-container {
    max-width: 700px;
    width: 95%;
    margin-left: auto;
    margin-right: auto;
}

.evaluation-container .evaluation-radio-container .evaluation-radio-content .evaluation-radio-cases {
    border-radius: 8px;
    padding: 30px 40px;
    border: solid 2px;
    transition: all .2s ease;
}

.evaluation-container .evaluation-radio-container .evaluation-radio-content .evaluation-radio-cases:hover {
    transform: scale(1.02);
}

.evaluation-container .evaluation-radio-container .evaluation-radio-content .evaluation-radio-cases.yes {
    border-color: #19CF89;
}

.evaluation-container .evaluation-radio-container .evaluation-radio-content .evaluation-radio-cases.no {
    border-color: #FF5050;
}

.evaluation-container .evaluation-radio-container .evaluation-radio-content input:checked+.evaluation-radio-cases.yes {
    background-color: #19CF89;
    color: white;
    transform: scale(1.02);
}

.evaluation-container .evaluation-radio-container .evaluation-radio-content input:checked+.evaluation-radio-cases.no {
    background-color: #FF5050;
    color: white;
    transform: scale(1.02);
}

.evaluation-container .rating-stars-container {
    width: 170px;
    margin-left: auto;
    margin-right: auto;
    height: 40px;
}

.evaluation-container .rating-stars-container .content {
    float: left;
    padding: 0 10px;
}

.evaluation-container .rating-stars-container .content:not(:checked)>input {
    display: none;
}

.evaluation-container .rating-stars-container .content:not(:checked)>label {
    float: right;
    width: 1em;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
    font-size: 30px;
    color: #ccc;
    width: 30px;
    height: 30px;
    background-image: url(../images/icons/ic_star_blue_empty.svg);
    background-size: 30px 30px;
    background-repeat: no-repeat;
    z-index: -2;
    transition: all .2s ease;
}

.evaluation-container .rating-stars-container .content:not(:checked)>label:before {
    content: ' ';
    width: 30px;
    height: 30px;
    background-image: url(../images/icons/ic_star_blue_empty.svg);
    background-size: 30px 30px;
    background-repeat: no-repeat;
    z-index: -2;
}

.evaluation-container .rating-stars-container .content>input:checked~label {
    width: 30px;
    height: 30px;
    background-image: url(../images/icons/ic_star_blue_full.svg);
    background-size: 30px 30px;
    background-repeat: no-repeat;
    z-index: 5;
}

.evaluation-container .rating-stars-container .content:not(:checked)>label:hover,
.evaluation-container .rating-stars-container .content:not(:checked)>label:hover~label {
    width: 30px;
    height: 30px;
    background-image: url(../images/icons/ic_star_blue_full.svg);
    background-size: 30px 30px;
    background-repeat: no-repeat;
    z-index: 5;
}

.evaluation-container .rating-stars-container .content>input:checked+label:hover,
.evaluation-container .rating-stars-container .content>input:checked+label:hover~label,
.evaluation-container .rating-stars-container .content>input:checked~label:hover,
.evaluation-container .rating-stars-container .content>input:checked~label:hover~label,
.evaluation-container .rating-stars-container .content>label:hover~input:checked~label {
    width: 30px;
    height: 30px;
    background-image: url(../images/icons/ic_star_blue_full.svg);
    background-size: 30px 30px;
    background-repeat: no-repeat;
    z-index: 5;
}

/*Pages recherche intermédiaire*/
.head-mid-search {
    width: 100%;
    padding-top: 120px;
    padding-bottom: 120px;
    background-image: url(../images/head_mid_search_anim.svg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.head-mid-search.etab {
    background-image: url(../images/head_mid_search_etab.svg);
}

.head-mid-search .head-content {
    display: flex;
    flex-wrap: wrap;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    width: 95%;
}

.head-mid-search .head-content .head-title {
    padding-right: 40px;
    flex: 1;
    max-width: 100%;
}

.head-mid-search .head-content .head-title h1 {
    font-size: 2.5rem;
}

.head-mid-search .head-content .head-action {
    flex: 0 0 300px;
    max-width: 300px;
}

.head-mid-search .head-content .head-action .head-search {
    background-color: white;
    background-color: var(--main-bg);
    border-color: #19CF89;
    padding: 10px 15px 10px 15px;
}

.head-mid-search.etab .head-content .head-action .head-search {
    border-color: #FF9100;
}

.head-mid-search .head-content .head-action .search-btn {
    border-radius: 8px;
    width: 100%;
}

@media screen and (max-width:800px) {
    .head-mid-search .head-content {
        justify-content: center;
    }

    .head-mid-search .head-content .head-action {
        flex: 0 0 100%;
        max-width: 100%;
        margin-top: 40px;
    }

    .head-mid-search {
        background-position: center right -230px;
    }
}

.mid-search-container {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    width: 95%;
    padding-top: 50px;
    padding-bottom: 100px;
}

.ccm-container .ccm-head {
    width: 100%;
    padding-top: 100px;
    padding-bottom: 120px;
    background-image: url(../images/head_mid_search_ccm.svg);
    background-position: bottom center;
    background-size: 100%;
    background-repeat: no-repeat;
}

.ccm-container .ccm-head.etab {
    background-image: url(../images/head_mid_search_ccm_etab.svg);
}

.ccm-container .ccm-content {
    display: flex;
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
    flex-wrap: wrap;
    width: 95%;
}

.ccm-container .ccm-content .ccm-img-container,
.ccm-container .ccm-content .ccm-text-container {
    flex: 1;
    max-width: 100%;
    margin: 5px;
}

.ccm-container .ccm-content .ccm-text-container {
    display: flex;
    padding-left: 40px;
    padding-right: 40px;
}

.ccm-container .ccm-content .ccm-img-container img {
    width: 100%;
    max-width: 500px;
}


@media screen and (max-width:1170px) {
    .ccm-container .ccm-head {
        background-size: 1300px;
    }

    .ccm-container .ccm-bottom {
        background-size: 1300px;
    }
}

@media screen and (max-width:800px) {

    .ccm-container .ccm-content .ccm-img-container,
    .ccm-container .ccm-content .ccm-text-container {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .ccm-container .ccm-content .ccm-img-container {
        order: 0;
        margin-top: 30px;
        margin-bottom: 30px;
        margin-left: 0px;
        margin-right: 0px;
    }

    .ccm-container .ccm-content .ccm-text-container {
        order: 2;
        padding-left: 0px;
        padding-right: 0px;
    }
}

.mid-search-container .header-browsing-lessons {
    width: 100%;
    padding-top: 120px;
    padding-bottom: 120px;
    padding-left: 30px;
    padding-right: 30px;
    color: white;
    text-align: center;
    font-weight: 700;
    font-size: 1.7rem;
    border-radius: 8px;
    background-image: url(../images/more_lessons_mid_search.svg);
    background-size: cover;
}

.mid-search-container .header-browsing-lessons.etab {
    background-image: url(../images/more_lessons_mid_search_etab.svg);
}

.mid-search-container .container-browsing-lessons {
    display: flex;
    justify-content: space-between;
    margin-left: -20px;
    margin-right: -20px;
    flex-wrap: wrap;
}

.mid-search-container .container-browsing-lessons .content-browsing-lessons {
    flex: 0 0 auto;
    max-width: 100%;
    margin: 20px;
}

.mid-search-container .container-browsing-lessons .content-browsing-lessons .browsing-list {
    display: flex;
    max-height: 265px;
    flex-wrap: wrap;
    margin-left: -5px;
    margin-right: -5px;
}

.mid-search-container .container-browsing-lessons .content-browsing-lessons .browsing-list .wrapper {
    display: flex;
    flex-direction: column;
    margin: 5px;
}

.mid-search-container .container-browsing-lessons .content-browsing-lessons .lessons-cat-title {
    width: 100%;
    border-bottom: solid 1px #D9D9D9;
    padding-bottom: 5px;
    margin-bottom: 5px;
}

.mid-search-container .container-browsing-lessons .content-browsing-lessons li {
    margin-top: 5px;
    margin-bottom: 5px;
    width: 150px;
}

@media screen and (max-width:900px) {
    .mid-search-container .container-browsing-lessons {
        justify-content: center;
        margin: 0px;
    }

    .mid-search-container .container-browsing-lessons .content-browsing-lessons {
        flex: 0 0 100%;
        max-width: 100%;
        padding-left: 40px;
        padding-right: 40px;
    }

    .mid-search-container .container-browsing-lessons .content-browsing-lessons li {
        width: auto;
    }
}

@media screen and (max-width:425px) {
    .mid-search-container .container-browsing-lessons .content-browsing-lessons .browsing-list {
        max-height: 400px;
    }

    .mid-search-container .container-browsing-lessons .content-browsing-lessons .browsing-list .wrapper {
        margin-top: 0px;
    }
}

.mid-search-txt-container .title {
    position: relative;
}

.mid-search-txt-container .ball {
    position: absolute;
    width: 350px;
    height: 350px;
    z-index: -1;
    right: -50%;
    top: 50%;
}

.mid-search-txt-container .faq-item {
    margin-top: 30px;
}

@media screen and (max-width:800px) {
    .mid-search-txt-container .ball {
        right: -340px;
    }
}

.mid-search-txt-container .title::after {
    content: '';
    width: 120px;
    height: 10px;
    border-radius: 8px;
    background: rgb(255, 166, 120);
    background: -moz-linear-gradient(90deg, rgba(255, 166, 120, 1) 0%, rgba(255, 120, 120, 1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(255, 166, 120, 1) 0%, rgba(255, 120, 120, 1) 100%);
    background: linear-gradient(90deg, rgba(255, 166, 120, 1) 0%, rgba(255, 120, 120, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffa678", endColorstr="#ff7878", GradientType=1);
    position: absolute;
    bottom: -15px;
    left: 0px;
}

.mid-search-txt-container .text-content {
    flex: 0 0 100%;
    max-width: 100%;
    line-height: 24px;
}

.mid-search-txt-container .text-content a {
    color: #03A0F1;
}

.mid-search-txt-container .text-container {
    justify-content: space-between;
}

@media screen and (max-width:800px) {

    .mid-search-txt-container .text-container {
        justify-content: center;
    }
}

/*Pages explications prepeers*/
.head-info {
    width: 100%;
    padding-top: 120px;
    padding-bottom: 120px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
}

.head-info h1 {
    position: relative;
    z-index: 50;
}

.head-info .back {
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 40;
}

.head-info.commissions {
    background-image: url(../images/b2c_info_commission_header.svg);
}

.head-info.securite {
    background-image: url(../images/b2c_info_securite_header.svg);
}

.head-info.mission {
    background-image: url(../images/notremission_header.png);
}

.head-info.rubis img.bg {
    position: absolute;
    bottom: -80px;
    width: 100%;
    left: 0px;
    z-index: 10;
}

.head-info.money-safety {
    background: rgb(140, 117, 235);
    background: -moz-linear-gradient(62deg, rgba(140, 117, 235, 1) 0%, rgba(192, 117, 235, 1) 100%);
    background: -webkit-linear-gradient(62deg, rgba(140, 117, 235, 1) 0%, rgba(192, 117, 235, 1) 100%);
    background: linear-gradient(62deg, rgba(140, 117, 235, 1) 0%, rgba(192, 117, 235, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#8c75eb", endColorstr="#c075eb", GradientType=1);
    position: relative;
}

.head-info.school {
    background: rgb(255, 204, 0);
    background: -moz-linear-gradient(96deg, rgba(255, 204, 0, 1) 0%, rgba(255, 145, 0, 1) 100%);
    background: -webkit-linear-gradient(96deg, rgba(255, 204, 0, 1) 0%, rgba(255, 145, 0, 1) 100%);
    background: linear-gradient(96deg, rgba(255, 204, 0, 1) 0%, rgba(255, 145, 0, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffcc00", endColorstr="#ff9100", GradientType=1);
    position: relative;
}

.head-info.rubis {
    background: rgb(255, 170, 120);
    background: -moz-linear-gradient(56deg, rgba(255, 170, 120, 1) 0%, rgba(246, 109, 109, 1) 100%);
    background: -webkit-linear-gradient(56deg, rgba(255, 170, 120, 1) 0%, rgba(246, 109, 109, 1) 100%);
    background: linear-gradient(56deg, rgba(255, 170, 120, 1) 0%, rgba(246, 109, 109, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffaa78", endColorstr="#f66d6d", GradientType=1);
    position: relative;
}

.head-info.money-safety .shape {
    position: absolute;
    width: 110px;
    left: 0px;
    bottom: 10px;
    z-index: 1;

}

.head-info.money-safety .align-center {
    position: relative;
    z-index: 2;
}

.info-main-title::after {
    content: '';
    width: 120px;
    height: 10px;
    border-radius: 8px;
    background: rgb(255, 120, 120);
    background: -moz-linear-gradient(90deg, rgba(255, 120, 120, 1) 0%, rgba(129, 120, 255, 1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(255, 120, 120, 1) 0%, rgba(129, 120, 255, 1) 100%);
    background: linear-gradient(90deg, rgba(255, 120, 120, 1) 0%, rgba(129, 120, 255, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff7878", endColorstr="#8178ff", GradientType=1);
    position: absolute;
    bottom: -20px;
    left: 0px;
}

.info-main-title.securite::after {
    background: rgb(3, 160, 241);
    background: -moz-linear-gradient(90deg, rgba(3, 160, 241, 1) 0%, rgba(0, 203, 122, 1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(3, 160, 241, 1) 0%, rgba(0, 203, 122, 1) 100%);
    background: linear-gradient(90deg, rgba(3, 160, 241, 1) 0%, rgba(0, 203, 122, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#03a0f1", endColorstr="#00cb7a", GradientType=1);
}

.info-main-title.entreprise::after {
    background: rgb(140, 117, 235);
    background: -moz-linear-gradient(62deg, rgba(140, 117, 235, 1) 0%, rgba(192, 117, 235, 1) 100%);
    background: -webkit-linear-gradient(62deg, rgba(140, 117, 235, 1) 0%, rgba(192, 117, 235, 1) 100%);
    background: linear-gradient(62deg, rgba(140, 117, 235, 1) 0%, rgba(192, 117, 235, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#8c75eb", endColorstr="#c075eb", GradientType=1);
}

.info-main-title.school::after {
    background: rgb(255, 145, 0);
    background: -moz-linear-gradient(90deg, rgba(255, 145, 0, 1) 0%, rgba(255, 204, 0, 1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(255, 145, 0, 1) 0%, rgba(255, 204, 0, 1) 100%);
    background: linear-gradient(90deg, rgba(255, 145, 0, 1) 0%, rgba(255, 204, 0, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff9100", endColorstr="#ffcc00", GradientType=1);
}

.info-main-title.rubis::after {
    background: rgb(255, 170, 120);
    background: -moz-linear-gradient(56deg, rgba(255, 170, 120, 1) 0%, rgba(246, 109, 109, 1) 100%);
    background: -webkit-linear-gradient(56deg, rgba(255, 170, 120, 1) 0%, rgba(246, 109, 109, 1) 100%);
    background: linear-gradient(56deg, rgba(255, 170, 120, 1) 0%, rgba(246, 109, 109, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffaa78", endColorstr="#f66d6d", GradientType=1);
}

p.info-main-txt, li.info-main-txt {
    line-height: 1.6;
}

@media screen and (max-width:1170px) {
    .head-info {
        background-position: right center;
    }

    .head-info.rubis img.bg {
        width: 1500px;
        left: auto;
        right: 0px;
        bottom: -85px;
    }
}

.sitemap-container {
    max-width: 1200px;
    width: 95%;
}

.sitemap-container hr {
    width: 100px;
    border-top: 5px solid rgba(0, 0, 0, .1);
    margin: 1rem 0px 1rem 0px;
}

.sitemap-container ul li {
    padding-right: 15px;
}

@media screen and (max-width:800px) {
    .sitemap-container .maxwidth350 {
        margin-left: auto;
        margin-right: auto;
    }

    .sitemap-container {
        text-align: center;
    }

    .sitemap-container hr {
        margin-left: auto;
        margin-right: auto;
    }

    .sitemap-container ul li {
        padding-right: 0px;
    }
}

/*List des matieres*/
.head-mid-search.list-subject {
    background-image: url(../images/soutien-scolaire_banniere.svg);
}

.head-mid-search.list-school {
    background-image: url(../images/list_school_banniere.svg);
}

.list-subject-container {
    display: flex;
    flex-wrap: wrap;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    width: 95%;
}

.list-subject-container .keywords-container li {
    margin: 10px;
    font-weight: 500;
    font-size: 1.1rem;
    max-height: 37px;
}

.page-main header {
    padding-top: 150px;
    padding-bottom: 150px;
}

.page-main.coach header {
    background: rgb(3, 160, 241);
    background: -moz-linear-gradient(50deg, rgba(3, 160, 241, 1) 0%, rgba(25, 207, 137, 1) 100%);
    background: -webkit-linear-gradient(50deg, rgba(3, 160, 241, 1) 0%, rgba(25, 207, 137, 1) 100%);
    background: linear-gradient(50deg, rgba(3, 160, 241, 1) 0%, rgba(25, 207, 137, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#03a0f1", endColorstr="#19cf89", GradientType=1);
}

.page-main.school header {
    background: rgb(255, 204, 0);
    background: -moz-linear-gradient(270deg, rgba(255, 204, 0, 1) 0%, rgba(255, 145, 0, 1) 100%);
    background: -webkit-linear-gradient(270deg, rgba(255, 204, 0, 1) 0%, rgba(255, 145, 0, 1) 100%);
    background: linear-gradient(270deg, rgba(255, 204, 0, 1) 0%, rgba(255, 145, 0, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffcc00", endColorstr="#ff9100", GradientType=1);
}

.page-main.job header {
    background: rgb(140, 117, 235);
    background: -moz-linear-gradient(87deg, rgba(140, 117, 235, 1) 0%, rgba(172, 154, 255, 1) 100%);
    background: -webkit-linear-gradient(87deg, rgba(140, 117, 235, 1) 0%, rgba(172, 154, 255, 1) 100%);
    background: linear-gradient(87deg, rgba(140, 117, 235, 1) 0%, rgba(172, 154, 255, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#8c75eb", endColorstr="#ac9aff", GradientType=1);
}

.page-main .page-main-cat-container {
    max-width: 1100px;
    width: 95%;
}

.page-main .page-main-cat-container .item {
    border: solid 2px transparent;
    transition: all .2s ease;
    padding: 30px 50px;
}


.page-main.coach .page-main-cat-container .item:hover {
    border-color: #19CF89;
}

.page-main.school .page-main-cat-container .item:hover {
    border-color: #FF9100;
}

.page-main.job .page-main-cat-container .item:hover {
    border-color: #8C75EB;
}

.page-main .page-main-cat-container .item:hover .title-container {
    transition: all .2s ease;
}

.page-main.coach .page-main-cat-container .item:hover .title-container {
    color: #19CF89;
}

.page-main.school .page-main-cat-container .item:hover .title-container {
    color: #FF9100;
}

.page-main.job .page-main-cat-container .item:hover .title-container {
    color: #8C75EB;
}

.page-main .page-main-cat-container .shape {
    position: absolute;
    z-index: -1;
}

.page-main .page-main-cat-container .shape._1 {
    width: 186px;
    height: 234px;
    left: -100px;
    top: -50px;
}

.page-main .page-main-cat-container .shape._2 {
    width: 300px;
    height: 259px;
    right: -100px;
    bottom: -50px;
}

.page-main.school .shape._1 circle {
    fill: url(#linear-gradient2);
}

.page-main.school .shape._2 circle {
    fill: url(#linear-gradient2);
}

.page-main.job .shape._1 circle {
    fill: url(#linear-gradient3);
}

.page-main.job .shape._2 circle {
    fill: url(#linear-gradient3);
}

.page-main .separation {
    width: 150px;
    height: 10px;
    border-radius: 8px;
}

.page-main.coach .separation {
    background: rgb(3, 160, 241);
    background: -moz-linear-gradient(50deg, rgba(3, 160, 241, 1) 0%, rgba(25, 207, 137, 1) 100%);
    background: -webkit-linear-gradient(50deg, rgba(3, 160, 241, 1) 0%, rgba(25, 207, 137, 1) 100%);
    background: linear-gradient(50deg, rgba(3, 160, 241, 1) 0%, rgba(25, 207, 137, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#03a0f1", endColorstr="#19cf89", GradientType=1);
}

.page-main.school .separation {
    background: rgb(255, 204, 0);
    background: -moz-linear-gradient(270deg, rgba(255, 204, 0, 1) 0%, rgba(255, 145, 0, 1) 100%);
    background: -webkit-linear-gradient(270deg, rgba(255, 204, 0, 1) 0%, rgba(255, 145, 0, 1) 100%);
    background: linear-gradient(270deg, rgba(255, 204, 0, 1) 0%, rgba(255, 145, 0, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffcc00", endColorstr="#ff9100", GradientType=1);
}

.page-main.job .separation {
    background: rgb(140, 117, 235);
    background: -moz-linear-gradient(87deg, rgba(140, 117, 235, 1) 0%, rgba(172, 154, 255, 1) 100%);
    background: -webkit-linear-gradient(87deg, rgba(140, 117, 235, 1) 0%, rgba(172, 154, 255, 1) 100%);
    background: linear-gradient(87deg, rgba(140, 117, 235, 1) 0%, rgba(172, 154, 255, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#8c75eb", endColorstr="#ac9aff", GradientType=1);
}

.page-main .type-container .item {
    padding: 35px 20px 20px 20px;
    position: relative;
    border: solid 1px;
    overflow: hidden;
    transition: all .2s ease;
    text-align: center;
}

.page-main .type-container .item:hover {
    transform: scale(1.02);
}

.page-main .type-container a {
    flex: 1;
    max-width: 350px;
}

.page-main.coach .type-container .item {
    border-color: #19CF89;
}

.page-main.school .type-container .item {
    border-color: #FF9100;
}

.page-main.job .type-container .item {
    border-color: #8C75EB;
}

.page-main .type-container .item::after {
    content: '';
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 15px;
}

.page-main.coach .type-container .item::after {
    background-color: #19CF89;
}

.page-main.school .type-container .item::after {
    background-color: #FF9100;
}

.page-main.job .type-container .item::after {
    background-color: #8C75EB;
}

.page-main .section-bg {
    padding-top: 50px;
    padding-bottom: 50px;
    background-repeat: no-repeat;
    position: relative;

}

.page-main.coach .section-bg.coach-3 {
    background-image: url(../images/bus_sub_hp_bg_3.svg);
    background-size: cover;
    background-position: top left;
}

.page-main.school .section-bg.coach-3 {
    background-image: url(../images/bus_sub_hp_bg_school_1.svg);
    background-size: cover;
    background-position: top left;
}

.page-main.job .section-bg.coach-3 {
    background-image: url(../images/bus_sub_hp_bg_bus_1.svg);
    background-size: cover;
    background-position: top left;
}

.page-main.coach .section-default.ccm {
    background-image: url(../images/bus_sub_hp_ccm_bg_coach.svg);
}

.page-main.school .section-default.ccm {
    background-image: url(../images/bus_sub_hp_ccm_bg_school.svg);
}

.page-main.job .section-default.ccm {
    background-image: url(../images/bus_sub_hp_ccm_bg_business.svg);
}

.page-main .section-default.ccm {
    background-position: bottom right;
    background-size: contain;
    background-repeat: no-repeat;
    max-width: 1500px;
    width: 95%;
}

.page-main .section-default {
    padding: 80px 150px;
}

@media screen and (max-width: 800px) {
    .page-main header {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .page-main .section-default {
        padding: 40px 40px;
    }

    .page-main .type-container a {
        max-width: 100%;
        min-width: 100%;
    }

    .page-main .page-main-cat-container .item {
        padding: 15px 20px;

    }

    .page-main.coach .page-main-cat-container .item {
        border-color: #19CF89;
    }

    .page-main.school .page-main-cat-container .item {
        border-color: #FF9100;
    }

    .page-main.job .page-main-cat-container .item {
        border-color: #8C75EB;
    }
}

.page-main .page-main-txt-content .title::after {
    content: '';
    width: 120px;
    height: 10px;
    border-radius: 8px;
    position: absolute;
    bottom: -15px;
    left: 0px;
}

.page-main.coach .page-main-txt-content .title::after {
    background: rgb(3, 160, 241);
    background: -moz-linear-gradient(50deg, rgba(3, 160, 241, 1) 0%, rgba(25, 207, 137, 1) 100%);
    background: -webkit-linear-gradient(50deg, rgba(3, 160, 241, 1) 0%, rgba(25, 207, 137, 1) 100%);
    background: linear-gradient(50deg, rgba(3, 160, 241, 1) 0%, rgba(25, 207, 137, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#03a0f1", endColorstr="#19cf89", GradientType=1);
}

.page-main.school .page-main-txt-content .title::after {
    background: rgb(255, 204, 0);
    background: -moz-linear-gradient(87deg, rgba(255, 204, 0, 1) 0%, rgba(255, 145, 0, 1) 100%);
    background: -webkit-linear-gradient(87deg, rgba(255, 204, 0, 1) 0%, rgba(255, 145, 0, 1) 100%);
    background: linear-gradient(87deg, rgba(255, 204, 0, 1) 0%, rgba(255, 145, 0, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffcc00", endColorstr="#ff9100", GradientType=1);
}

.page-main.job .page-main-txt-content .title::after {
    background: rgb(140, 117, 235);
    background: -moz-linear-gradient(87deg, rgba(140, 117, 235, 1) 0%, rgba(172, 154, 255, 1) 100%);
    background: -webkit-linear-gradient(87deg, rgba(140, 117, 235, 1) 0%, rgba(172, 154, 255, 1) 100%);
    background: linear-gradient(87deg, rgba(140, 117, 235, 1) 0%, rgba(172, 154, 255, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#8c75eb", endColorstr="#ac9aff", GradientType=1);
}

.page-main .faq-container {
    max-width: 1000px;
    width: 95%;
    padding: 40px;
}

.page-main.coach .faq-container {
    background: rgb(3, 160, 241);
    background: -moz-linear-gradient(50deg, rgba(3, 160, 241, 1) 0%, rgba(25, 207, 137, 1) 100%);
    background: -webkit-linear-gradient(50deg, rgba(3, 160, 241, 1) 0%, rgba(25, 207, 137, 1) 100%);
    background: linear-gradient(50deg, rgba(3, 160, 241, 1) 0%, rgba(25, 207, 137, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#03a0f1", endColorstr="#19cf89", GradientType=1);
}

.page-main .faq-container .faq-item {
    width: 100%;
}

@media screen and (max-width: 800px) {
    .page-main .faq-container {
        padding: 20px;
    }
}

.page-main .load-more-type .arrow-bottom {
    vertical-align: 2px;
}

.page-main.coach .load-more-type {
    color: #19CF89;
}

.page-main.school .load-more-type {
    color: #FF9100;
}

.page-main.coach .section-bg .ccm button {
    background-color: #19CF89;
    border-color: #19CF89;
    color: white;
}

.page-main.coach .section-bg .ccm button:hover {
    background-color: #19CF89;
    border-color: #19CF89;
    filter: brightness(1.13);
}

.page-main.school .section-bg .ccm button {
    background-color: #FF9100;
    border-color: #FF9100;
    color: white;
}

.page-main.school .section-bg .ccm button:hover {
    background-color: rgb(253, 207, 89);
    border-color: rgb(253, 207, 89);
    color: white;
}

.page-main.school .load-more-type {
    color: #FF9100;
}

/*Mentions legales*/
.modif-header.legal .modif-header-content {
    max-width: 1300px;
    width: 95%;
}

.modif-header.legal {
    background-image: url(../images/bg_header_legal.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.legal-container {
    max-width: 1300px;
    width: 95%;
}

.premium-success-container {
    background-color: #FFF7C4;
    padding-top: 100px;
    padding-bottom: 200px;
}

.premium-success-container .img-content {
    min-height: 400px;
    width: 95%;
    max-width: 400px;
}

.premium-success-container .img-content img {
    width: 270px;
    position: absolute;
    right: 0px;
    bottom: 0px;
    z-index: 2;
    animation: floating1 4s ease-in-out infinite;
}

.premium-success-container .img-content svg {
    position: absolute;
    z-index: 1;
    left: 0px;
    top: 0px;
    animation: floating2 4s ease-in-out infinite;
}

@keyframes floating1 {
    0% {
        transform: translate(0px, 0px);
    }

    50% {
        transform: translate(0px, 10px);
    }

    100% {
        transform: translate(0px, 0px);
    }
}

@keyframes floating2 {
    0% {
        transform: translate(0px, 0px);
    }

    50% {
        transform: translate(0px, 20px);
    }

    100% {
        transform: translate(0px, 0px);
    }
}

.change-pdp-container.large {
    max-width: 100%;
    width: 100%;
    height: 300px;
    max-height: 300px;
}

@media screen and (max-width:500px) {
    .change-pdp-container.large {
        height: 250px;
        max-height: 250px;
    }
}