/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
    div.grid{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 20px 30px;
    }

    div.ebook-text{
        max-width: 380px;
        width: 100%;
        margin-left: 35px;
    }

    .social{
        text-align: right;
        margin-top: -37px;
    }

    .smart{
        display: none;
    }

    header ul{
        margin-top: 50px;}
/* 
    header li a.active:before{
        content: '';
        position:absolute;
        height: 4px;
        width: 117px;
        top: 310px;
        background-color: #d9bfb0;
    } */

    img#data2{
        display: none;
    }

    
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px){ 
    div.grid{
        display: grid;
        grid-template-columns: 1fr 1fr ;
        gap: 20px 30px;
    }

    div.ebook-text{
        max-width: 380px;
        width: 100%;
        margin-left: 35px;
    }

    .social{
        text-align: right;
        margin-top: -37px;
    }

    .smart{
        display: none;
    }

    header ul{
        margin-top: 50px;
    }

    img#data2{
        display: none;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px){ 
    div.grid{
        display: grid;
        grid-template-columns: 1fr 1fr ;
        gap: 20px 30px;
    }

    div.ebook-text{
        max-width: 420px;
        width: 100%;
        margin-left: 35px;
    }

    img.ebook{
        max-width: 460px;
        width: 100%;
    }

    .social{
        text-align: center;
        margin-top: 10px;
    }

    .smart{
        display: none;
    }

    header ul{
        margin-top: 50px;
    }

    img#data1{
        display: none;
    }

}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767px){ 
    div.grid{
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px 30px;
    }

    div.ebook-text{
        width: 100%;
        margin-left: 35px;
    }

    .social{
        text-align: center;
    }

    .pc{
        display: none;
    }
    div.ebook-text-2{
        margin-left: 0px;
    }

    img#data1{
        display: none;
    }

}

@media  (max-width: 575px){ 
    .social{
        text-align: center;
    }

    .pc{
        display: none;
    }
    div.ebook-text-2{
        margin-left: 0px;
    }

    img#data1{
        display: none;
    }
}