@media screen and (max-width:767px) {
    .offcanvas-body{
        background-color: #000;
    }
    .offcanvas-header {
        padding: 5px 10px;
    }
    .offcanvas-backdrop{
        background-color: transparent;
    }
    .portfolio_banner{
        height: 45%;
    }
    .offcanvas{
        background-color: #000;
    }
    .header_nav .navbar-nav .nav-link.active, .header_nav .navbar-nav .show>.nav-link {
        padding: 0 0.5rem;
        border-radius: 6px;
        height: 50px;
    }
    .btn-close {
        background: transparent url(../../assets/images/close.svg) center/1em auto no-repeat;
    }
    .about_index .about_info h2{
        margin-bottom: 1rem;
    }
    .about_index .about_info_img .exp h2 {
        font-size: 25px;
    }
    .about_index {
        padding: 20px 0px;
    }
    .header_nav .navbar-brand img {
        width: 150px;
    }
    .award_slider .award_info .award_text {
        padding: 0.5rem 0.5rem;
    }
    .award_slider .award_info .award_text h2 {
        font-size: 14px;
    }
    .award_slider .award_info .award_text h4 {
        font-size: 18px;
    }
    .hover-border {
        font-size: 12px;
        margin-top: 1rem;
    }
    .blog_slider {
        padding: 20px 0px;
    }
    .blog_title h4 {
        font-size: 14px;
    }
    .blog_title h2 {
        font-size: 20px;
    }
    .social_media .social_media_title h2{
        font-size: 20px;
    }
    .social_media_title h2:after {
        left: auto;
        right: auto;
        top: auto;
        bottom: -6px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
    }
    .social_media_title h2:before {
        right: auto;
        left: auto;
        top: -6px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
    }
    .socialmedia_info p{
        font-size: 14px;
    }
    .media_images ul li:nth-child(1) {
        top: 29%;
    }
    .media_images ul li:nth-child(1) a img {
        width: 34px;
    }
    .media_images ul li:nth-child(2) {
        top: 29%;
    }
    .media_images ul li:nth-child(2) a img {
        width: 52px;
    }
    .media_images ul li:nth-child(3) a img{
        width: 57px;
    }
    .media_images ul li:nth-child(4) {
        bottom: 18%;
        left: 29.5%;
    }
    .media_images ul li:nth-child(4) a img{
        width: 34px;
    }
}