/*================================ Satrt large screens =========================*/
@media (min-width:1201px ) and (max-width: 1440px)
{
   
}
@media (min-width:1025px) and (max-width:1200px)
{

}
/*============================== Start medium screen of tablet =========================*/
@media (min-width: 993px) and (max-width: 1024px)
{

}
@media (min-width: 769px) and (max-width: 992px)
{

}
@media(max-width:992px)
{

}
/*============================== Start small screen of mobile =========================*/
@media(max-width:768px)
{
    .navbar{
        position: relative;
        z-index: 9;
    }
    .navs-container .sidebar-wrapper .sidebar-inner {
        padding: 50px 15px;
    }
    .navs-container .sidebar-wrapper .sidebar-inner .bg ,
    .navs-container .sidebar-wrapper .sidebar-inner .sm-img ,
    .navs-container .sidebar-wrapper .sidebar-inner::before{
        display: none;
    }
    .header .foot-b ,
    .header .item .text-box{
        flex-direction: column;
    }
    .header .foot-b .circle-butn {
        width: 100px;
        height: 100px;
        font-size: 12px;
    }
    .section {
        height: auto;
    }
    .about-sec .bg {
        top: unset;
        height: 100px;
    }
    .portfolio-sec .swiper-slide {
        width: 90%;
    }
    .portfolio-sec .swiper-button-prev {
        left: 20%;
    }
    .portfolio-sec .swiper-button-next {
        right: 20%;
    }
    .blog-sec .item .bg {
        width: 100%;
        height: 65px;
    }
    .blog-sec .item::before {
        width: 70px;
        height: 170px;
        left: 0;
        top: 55px;
    }
    .contact-sec .form-box {
        margin-top: 190px;
    }
    .contact-sec .bg {
        width: 65%;
        top: 100px;
        right: 0;
        left: unset;
        height: 227px;
    }
    .contact-sec::before {
        display: none;
    }
}

@media (min-width: 577px) and (max-width: 768px)
{

}
@media(max-width:576px)
{
    
}
@media(min-width: 426px) and (max-width: 576px)
{

}
@media (min-width: 376px) and (max-width: 425px)
{

}
@media (min-width: 321px) and (max-width: 375px)
{
   
}
@media (max-width: 320px)
{

}
