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

    .arch-container {
        padding: 0 10rem;
    }

    .acheiv h1 {
        font-size: 1.7rem;
    }

    .acheiv h1 {
        font-size: 1.7rem;
    }
    
    .acheiv p {
        margin-top: 1.2rem;
        margin-bottom: 0.02rem;
    }
    
    .acheiv-card {
        font-size: 1.2rem;
        margin-top: 1rem;
        line-height: 2rem;
    }
    
    .acheiv-card {
        display: grid;
        margin-bottom: 2.5rem;
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
        padding: 0.9rem;
        border-radius: 0.3rem;
        cursor: default;
        transition: box-shadow 400ms, border-radius 250ms ease;
    }
    
    .acheiv-card:hover {
        box-shadow: 0 -6px 30px rgba(118, 166, 254, 0.300);
        border-radius: 0;
    }
    
    .a-card_hd {
        font-family: 'Montserrat', sans-serif;
        background: #00a6ff;
        font-size: 1.1rem;
        padding: 0.2rem 0.2rem 0.2rem 1rem;
        color: #FFF;
        border-radius: 0.2rem;
        margin-bottom: 0.6rem;
    }
    
    .a-card_dt {
        font-size: 0.98rem;
        font-weight: 600;
        color: #BA1C24;
    }

    .a-card_bd, .a-card_dt {
        padding-left: 0.67em;
    } 
    
    /* blog page */

    .blog-cont {
        align-items: center;
        justify-content: center;
        display: block;
        padding: 0 2em;
    }

    .blog_ {
        margin-bottom: 1rem;
        padding: 0;
    }

    .blog_ h1 {
        margin-bottom: 0.7rem;
    }

    .blog_ p {
        margin-top: 0.2rem;
    }

    .blogs h2 {
        font-size: 1.5rem;
        color: #00a6ff;
    }

    span {
        padding-right: 0.4rem;
    }

    .blog {
        padding: 0.9rem 1.3rem;
        background: #00a6ff3e;
        margin: 1.6rem 0;
        border-radius: 0.4rem;
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.056);
    }

    .blog-hd {
        font-family: 'Montserrat', sans-serif;
        font-weight: 600;
    }

    .blog-bd {
        font-size: 1.1rem;
    }
}

@media only screen and (min-device-width : 1024px) {

    .arch-container {
        padding: 0 6rem;
    }

    .acheiv-cards {
        margin-top: -2rem;
    }

    .blog-cont {
        align-items: center;
        justify-content: center;
        display: block;
        padding: 0 6em;
    }
}

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

    .arch-container {
        padding: 0 0.8em;
    }

    .acheiv-card {
        margin-bottom: 1.7rem;
    }

    .blog-cont {
        align-items: center;
        justify-content: center;
        display: block;
        padding: 0 0.8em;
    }

}