@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai+Looped:wght@100;200;300;400;500;700&display=swap');
*{
    margin: 0;
    padding: 0;
}

body{
    background: #f6f6f6;
}

@media  only screen and  (max-width: 280px),  only screen and (max-device-width: 916px){
    #container{
        width: 100%;
        height: 140vh;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-content: center;
        align-items: center;
    }
    .image {
        width: 88%;
        height: 21%;
        margin-top: -40%;
        background-image: url(../img/img-Mobile/img-Mobile-1.png);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .texts {
        width: 90%;
        height: 20%;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-content: flex-start;
        align-items: flex-start;
    }
    .first_title {
        font-family: 'IBM Plex Sans Thai Looped', sans-serif;
        font-weight: 700;
        margin-top: -100%;
    }
    .text_about_sneaker {
        width: 90%;
        height: 20%;
        position: absolute;
        margin-top: -60%;
        font-family: 'IBM Plex Sans Thai Looped', sans-serif;
    }
    .sizes_of_sneaker {
        width: 90%;
        height: 7%;
        margin-top: 129%;
        display: inline-block;
    }
    ul, li, a {
        list-style: none;
        text-decoration: none;
        padding: 4px;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: center;
    }
    #buttons {
        width: 100%;
        height: 10%;
        margin-top: 178%;
        margin-left: 0%;
        position: absolute;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: center;
        align-content: center;
    }
    .cart {
        width: 55%;
        display: flex;
        height: 50%;
        padding: 10px;
        margin-bottom: 5%;
        color: #fff;
        background: #000;
        border-color: #000;
        border-style: solid;
        text-align: -webkit-center;
        border-radius: 100px 100px 100px 100px;
        align-items: center;
        align-content: center;
        justify-content: center;
        flex-wrap: nowrap;
    }
    .pet {
        width: 55%;
        display: flex;
        height: 50%;
        padding: 10px;
        color: #000;
        margin-left: 0%;
        border-style: solid;
        text-align: -webkit-center;
        border-radius: 100px 100px 100px 100px;
        align-items: center;
        align-content: center;
        justify-content: center;
        flex-wrap: nowrap;
    }
    .color_sneakers {
        width: 100%;
        height: 11%;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        position: absolute;
        margin-left: 0%;
        margin-top: 226%;
        align-items: center;
        justify-content: center;
    }
}