@media (max-width: 768px) {
    /*container-left*/

    .wrapper {
        max-width: 100%;
        max-height: 100%;
    }

    #container-top {
        max-width: 90%;
        max-height: 50%;
        position: relativo;
        align-items: center;
    }

    #container-bottom {
        max-width: 100%;
        max-height: 50%;
        position: relativo;
        align-items: center;
    }

    .container-left {
        position-area: center;
        top: 5px;
        left: 130px;
        width: 155%;
        font-size: 26px;
    }

    .container-right {
        margin-top: 30px;
        text-align: center;
        width: 100%;
        height: 50%;
        padding: 0 10px 10px 5px;
    }

    h1 {
        font-size: 300%;
        font-weight: 400;
        margin-left: 30%;
        max-width: 180%;
        line-height: 60px;
    }

    p {
        font-size: 100%;
        font-weight: 400;
        margin-left: 65%;
        max-width: 100%;
        line-height: 25px;

    }

    button {
        margin: 5px 70%;
        display: block;
        cursor: pointer;
        opacity: 0.6;

    }

    button:hover {
        cursor: pointer;
        opacity: 0.6;

    }

    .background {
        width: 100%;
        height: 44%;
        position-area: center;
        top: 58%;
        left: 100%;

    }

    .smart {
        width: 75%;
        height: 35%;
        position-area: center;
        top: 55%;
        left: 100%;
    }

    .link-header {
        font-size: 75%;
        font-weight: 400;
        margin: 10px 0px 0 10px;
        cursor:pointer;
        opacity: 06;
    }

    .link-header:hover {
        cursor:pointer;
        opacity: 06;
    }

}