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


    nav #menu {
        display: none;
    }

    .mmenu {
        display: block;
        margin: 18px;
    }

    #logo {
        display: none;
    }

    #banner-container {
        font-size: 24px;
    }

    #banner-container img {
        width: 100%;
    }

    #banner-container {
        padding: 0px 0px 32px;
        flex-direction: column;
    }

    #banner-container #banner-text {
        max-width: unset;
        margin-left: 0px;
        padding: 32px 16px 0px;
    }

    #banner-container #banner-text h1 {
        margin-top: 0px;
    }

    #banner-container #banner-text button {
        background-color: #9a9a9a;
        font-size: 24px;
    }

    #hilight {
        display: none;
    }

    .pic-pc {
        display: none;
    }

    .pic-mobile {
        display: block;
    }

    #side {
        margin: 0;
    }

    .story {
        flex-direction: column;
        border: none;
    }

    .story:first-child {
        margin-top: 0px;
    }

    .story img {
        width: 100%;
        padding: 16px 16px 32px 16px;
        margin: 0px;
    }

    .story-detail {
        margin: 0 0 32px 0;
    }

    .story-detail h1 {
        color: #4a4a4a;
        padding-left: 32px;
    }

    .story-detail p {
        color: #4a4a4a;
        margin: 8px 0;
        padding-left: 32px;
    }

    .story a {

        text-decoration: none;
        color: rgb(109, 118, 240);
        padding-left: 32px;
    }

    .story:last-child {
        margin-bottom: 32px;
        background-color: white;
    }

    #Start-learning {
        display: none;
    }

    #couse-mobile {
        display: block;
    }

    #couse-mobile h1 {
        text-align: center;
    }

    .couse-mobile-menu {
        width: 90%;
        margin: 8px auto;
        color: #4a4a4a;
        background-color: #cecece91;
        padding: 16px 0 24px 16px;
    }

    .couse-mobile-menu:first-child {
        margin: 16px auto 8px auto;
    }

    .couse-mobile-menu:last-child {
        margin: 8px auto 32px auto;
    }

    #thesis-right {
        display: none;
    }

    #thesis-left {
        width: 100%;
        padding: 16px 0px 24px 0;
    }

    #thesis-left h2 {
        display: none;
    }

    #thesis-left p {
        display: none;

    }

    hr {
        display: none;
    }

    #endcardit2 {
        display: none;
    }

    #endcardit {
        margin-top: 40px 0px 16px 0px;
    }
}