.slimheader {
    background-color: #707070 !important;
}

#main::before {
    /* content: " ";
    position: absolute;
    width: 105vw;
    height: 100vh;
    margin: 0 -52%;
    z-index: -1; */

    /* background-image: url(images/mes_head.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center right; */
}

#main {
    overflow: hidden;
}

.mes_main0 {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100vw;
    padding: 0 10%;
    margin: auto;
    /* color:#fff; */
    min-height: 100vh;
    /* background: url('images/mes_head.png');
    background-size: cover;
    background-position: left;
    background-repeat: no-repeat; */
    color: #fff;
    overflow: visible;
    background: transparent linear-gradient(243deg, #707070 0%, #383838 100%) 0% 0%;
}

.mes_main0 h1 {
    text-shadow: 1px 1px 1px #444;
}

.mes_head {
    text-align: left;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100vw;
}

.head_pic {
    background-image: url('images/kid1.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center right;
    width: 50%;
    height: 70%;
}

.mes_title {
    width: 35vw;
}

.mes_title>p {
    width: 25vw;
}

.mes_btn>p {
    font-size: 0.7em;
}

/* .mes_head>.head_pic>img {
    width: 30vw;
} */

.mes_head>.head_pic {
    margin: auto;
}

.mes_main1,
.mes_main2,
.mes_main3,
.mes_main4,
.mes_main5,
.mes_main6 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 5vh 0;
}

.mes_main1,
.mes_main4,
.mes_main5 {
    padding-top: 2vh;
    padding-bottom: 10vh;
}

.mes_main3,
.mes_main6 {
    padding-top: 3vh;
    padding-bottom: 7vh;
}

.mes_main1 *,
.mes_main2 *,
.mes_main3 *,
.mes_main4 *,
.mes_main5 *,
.mes_main6 * {
    max-width: 1200px;
}

.mes_main1>p,
.mes_main2>p,
.mes_main2>ol,
.mes_main3>p,
.mes_main3>ol,
.mes_main4>p,
.mes_main4>ul,
.mes_main5>p,
.mes_main6>p {
    text-align: left;
}

.mes_main1>p,
.mes_main2>p,
.mes_main3>p,
.mes_main4>p,
.mes_main5>p,
.mes_main6>p {
    margin: auto;
}

.mes_main1>h2,
.mes_main2>h2,
.mes_main3>h2,
.mes_main4>h2,
.mes_main5>h2,
.mes_main6>h2 {
    /* padding: 0px 20px; */
}

.mes_main2>ol>li,
.mes_main3>ol>li,
.mes_main4>ul>li {
    margin: 2vh 0;
}

.mes_main2 {
    background: #37A6281A;
}

.main2_btn {
    font-size: 0.7em;
    margin: 40px 0px;
}

.mes_main3 {
    background: #FFB430;
    color: #fff;
}

.mes_main5 {
    background: #22C0D726;
}

.mes_main6 {
    background: #22C0D7;
    color: #fff;
}

#foot_menu {
    width: 100%;
}

/* RESPONSIVE */

@media screen and (max-width:480px) {
    .mes_main0 {
        padding: 0 8%;
    }

    .mes_title {
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: auto;
    }

    .head_pic {
        display: none;
    }
}

@media screen and (min-width:481px) and (max-width:768px) {
    .mes_title {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        width: 100vw;
    }

    .head_pic {
        display: none;
    }
}

@media screen and (max-width: 810px) {
    #main::before {
        background-image: none;
    }

    .mes_head {
        margin-top: 100px;
        margin-bottom: 50px;
    }

    .mes_main0 {
        /* background: #707070; */
        height: unset;
    }

    .mes_title h1,
    .mes_title p {
        width: 80vw;
    }

    .mes_main1 p,
    .mes_main2 p,
    .mes_main3 p,
    .mes_main4 p,
    .mes_main5 p,
    .mes_main6 p {
        width: 90%;
        margin: auto;
    }

    .mes_main1>p,
    .mes_main2>p,
    .mes_main2>ol,
    .mes_main3>p,
    .mes_main3>ol,
    .mes_main4>p,
    .mes_main4>ul,
    .mes_main5>p,
    .mes_main6>p {
        width: 80vw;
        margin: auto;
    }
}

@media screen and (min-width:811px) and (max-width:1200px) {
    .mes_head {
        margin-top: 100px;
        margin-bottom: 50px;
    }

    .mes_title {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        width: 100vw;
    }

    .mes_main0 {
        /* background: #707070; */
        height: unset;
    }

    .head_pic {
        display: none;
    }

    .mes_main1 p,
    .mes_main2 p,
    .mes_main2 ol,
    .mes_main3 p,
    .mes_main4 p,
    .mes_main4 ul,
    .mes_main5 p,
    .mes_main6 p {
        width: 90%;
    }

    .mes_title {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .mes_title h1 {
        width: 80vw;
        padding: 0px;
        margin-bottom: 10px;
    }

    .mes_title p {
        width: 80vw;
    }
}

@media screen and (min-width:1200px) and (max-width:1366px) {
    .mes_main0 {
        background-size: cover;
    }

    .mes_head .head_pic {
        width: 50%;
        margin-left: 10%;
    }

    .mes_title h1 {
        width: 45vw;
        padding: 0px;
        margin-bottom: 10px;
    }

    .mes_title p {
        width: 35vw;
    }
}