/*================================================

Template name: Asrw
Version: 1.0.0
Author: SITLBD      
Author url: https://www.sitlbd.com/ 
Developer: Najmul Huda Eimon  


[Table of Content]

1: Extra large device
2: Large device 
3: Medium device 
4: Small device 
5: Extra small device

================================================*/


/*===================================================
 1: Extra large device
====================================================*/
@media (min-width:1200px) and (max-width:1719px){
    /* banner */
    .banner .banner-img {
        right: 0%;
        width: 175%;
    }
    /* about */
    .about .image-part {
        margin-left: 0px;
    }
    /* client */
    .client .button-prev {
        left: 0px;
    }
    .client .button-next {
        right: 0px;
    }
}

/*===================================================
 2: Large device 
=====================================================*/
@media (min-width:992px) and (max-width:1199px){
    /* general css */
    h1 {
        font-size: 48px;
        line-height: 64px;
    }
    /* menu */
    span.submenu-button:before {
        right: 0px;
    }
    /* banner */
    .banner .banner-img {
        right: 0%;
        width: 180%;
    }
    .banner .banner-text {
        padding-top: 200px;
        padding-bottom: 150px;
    }
    /* about */
    .about .image-part {
        margin-left: 0;
    }
    /* project */
    .project .item .overlay h3 {
        font-size: 24px;
    }
    /* team */
    .team .item {
        width: 290px;
        height: 295px;
    }
    .team .item img {
        width: 91%;
    }
    /* client */
    .client .button-prev {
        left: 0px;
    }
    .client .button-next {
        right: 0px;
    }
    /* blog */
    .blog .item .blog-inner {
        padding: 30px 15px;
    }
    /* footer-top */
    .footer-top .f-title h4 {
        font-size: 23px;
    }

    /*========== Home 2 ===========*/
    /* count */
    .count .item h4 {
        font-size: 22px;
    }
    /*========== About page ===========*/
    /* banner */
    .about-page .banner{
        background-position: 93% 0 !important;
    }
    /*========== Contact page ===========*/
    /* address */
    .address .item {
        padding: 25px;
    }
    /*========== 404 page ===========*/
    .page p {
        width: 80%;
    }

}

/*===================================================
    3: Medium device 
======================================================*/
@media (min-width:768px) and (max-width:991px){
    /* general css */
    h1 {
        font-size: 50px;
        line-height: 70px;
    }
    .section-title {
        padding-bottom: 40px;
    }
    .p-120{
        padding: 100px 0;
    }
    .pt-120{
        padding-top: 100px;
    }
    .pb-120{
        padding-bottom: 100px;
    }
    .mt-md-30{
        margin-top: 30px;
    }
    
    /* menubar */
    .home2 .menubar .menu > li:last-child a{
        color: var(--dark);
    }
    .menubar .header-menu{
        margin: auto !important;
    }
    .header-menu > ul > li {
        display: inline-block;
        padding-left: 0;
        padding-right: 0;
    }
    /* banner */
    .banner .banner-img {
        display: none;
    }
    .banner .banner-text {
        padding-top: 240px;
        padding-bottom: 200px;
    }
    /* about */
    .about .image-part {
        margin-left: 0px;
    }
    /* team */
    .team .item {
        width: 340px;
        height: 345px;
    }
    .team .item img {
        width: 92%;
    }

    /* client */
    .client{
        padding-bottom: 85px;
    }
    .client .button-prev {
        left: 0px;
    }
    .client .button-next {
        right: 0px;
    }

    /*========== Home 2 ===========*/
    /* about */
    .home2.about .image-part {
        text-align: center;
        margin-bottom: 30px;
    }
    /* book table */
    .book-table .image {
        display: none;
    }
    /* client */
    .client.home2 .btns .button-prev {
        left: 42%;
    }
    .client.home2 .btns .button-next {
        right: 42%;
    }
    /*========== About page ===========*/
    /* menubar */
    .about-page .header-menu ul > li a {
        color: var(--dark);
    }
    .about-page span.submenu-button:before{
        border-top-color: var(--dark);
    }
    /* banner */
    .about-page .banner{
        background-position: 93% 0 !important;
    }
    /*========== Blog page ===========*/
    
    .blog-page .blog-inner{
        margin-top: 50px;
    }
    /*========== Contact page ===========*/
    /* address */
    .address .item {
        padding: 25px;
    }
    /*========== 404 page ===========*/
    .page p {
        width: 100%;
        font-size: 23px;
    }
}

/*=================================================== 
    4: Small device 
=====================================================*/
@media (min-width:576px) and (max-width:767px){
    /* general css */
    h1 {
        font-size: 46px;
        line-height: 62px;
    }
    h2 {
        font-size: 40px;
        line-height: 55px;
    }
    .section-title {
        padding-bottom: 40px;
    }
    .p-120{
        padding: 80px 0;
    }
    .pt-120{
        padding-top: 80px;
    }
    .pb-120{
        padding-bottom: 80px;
    }
    .mt-sm-20{
        margin-top: 20px;
    }
    .mt-md-30,
    .mt-sm-30{
        margin-top: 30px;
    }
    .ts-left{
        text-align: left !important;
    }
    .ts-center{
        text-align: center;
    }
    
    /* menubar */
    .home2 .menubar .menu > li:last-child a{
        color: var(--dark);
    }
    .menubar .header-menu{
        margin: auto !important;
    }
    .header-menu > ul > li {
        display: inline-block;
        padding-left: 0;
        padding-right: 0;
    }
    /* banner */
    .banner .banner-img {
        display: none;
    }
    .banner .banner-text {
        padding-top: 180px;
        padding-bottom: 140px;
    }
    /* about */
    .about .image-part {
        margin-left: 0px;
    }
    .about .section-title {
        padding-top: 30px;
    }
    /* family */
    .family .ts-left a{
        margin-top: 30px;
    }

    /* food-menu */
    .food-menu .tab-pane {
        margin-top: 0;
    }
    .food-menu .nav-item{
        margin-bottom: 20px;
    }

    /* team */
    .team .item {
        margin: auto;
    }

    /* client */
    .client{
        padding-bottom: 65px;
    }
    .client .button-prev {
        left: 0px;
    }
    .client .button-next {
        right: 0px;
    }

    /* footer-bottom */
    .footer-bottom .f-menu ul{
        justify-content: center !important;
        padding-top: 30px;
    }

    /*========== Home 2 ===========*/

    /* book table */
    .book-table .image {
        display: none;
    }
    /* client */
    .client.home2 .btns .button-prev {
        left: 40%;
    }
    .client.home2 .btns .button-next {
        right: 40%;
    }

    /*========== About page ===========*/
    /* menubar */
    .about-page .header-menu ul > li a {
        color: var(--dark);
    }
    .about-page span.submenu-button:before{
        border-top-color: var(--dark);
    }
    /* banner */
    .about-page .banner{
        background-position: 93% 0 !important;
    }

    /*========== Blog page ===========*/
    
    .blog-page .blog-inner{
        margin-top: 50px;
    }
    /*========== contact page ===========*/
    /* message */
    .message .bg {
        padding: 40px 50px 50px 50px;
    }
    /*========== 404 page ===========*/
    .page p {
        width: 100%;
        font-size: 17px;
        line-height: 36px;
    }
}

/*=================================================== 
    5: Extra small device 
=====================================================*/
@media (min-width:320px) and (max-width:575px){
    /* general css */
    h1 {
        font-size: 32px;
        line-height: 48px;
    }
    h2 {
        font-size: 34px;
        line-height: 50px;
    }
    .section-title {
        padding-bottom: 30px;
    }
    .p-120{
        padding: 60px 0;
    }
    .pt-120{
        padding-top: 60px;
    }
    .pb-120{
        padding-bottom: 60px;
    }
    .mt-sm-20{
        margin-top: 20px;
    }
    .mt-md-30,
    .mt-sm-30{
        margin-top: 30px;
    }
    .ts-left{
        text-align: left !important;
    }
    .ts-center{
        text-align: center;
    }

    /* menubar */
    .menubar .right-part{
        display: none;
    }
    .home2 .menubar .menu > li:last-child a{
        color: var(--dark);
    }
    .header-menu > ul > li {
        display: inline-block;
        padding-left: 0;
        padding-right: 0;
    }
    /* banner */
    .banner .banner-img {
        display: none;
    }
    .banner .banner-text {
        padding-top: 150px;
        padding-bottom: 100px;
    }
    .banner p {
        padding-right: 0;
        padding-bottom: 40px;
    }
    /* about */
    .about h2 {
        font-size: 32px;
        line-height: 46px;
    }
    .about .image-part {
        margin-left: 0px;
    }
    .about .section-title {
        padding-top: 30px;
    }
    .about .author {
        display: block !important;
    }
    .about .author .image{
        float: left;
    }
    .about .author .name:before {
        display: none;
    }
    .about .author h5 {
        font-size: 19px;
    }
    .about .author .sign {
        padding-left: 100px;
        padding-top: 30px;
    }
    /* family */
    .family .ts-left a{
        margin-top: 30px;
    }
    .family p {
        padding-right: 0;
    }

    /* food-menu */
    .food-menu .tab-pane {
        margin-top: 0;
    }
    .food-menu .nav-item{
        margin-bottom: 20px;
    }
    .food-menu .tab-pane .item {
        display: block !important;
    }

    .food-menu .tab-pane .item .img {
        margin-right: 0;
        margin-bottom: 30px;
    }
    .food-menu .tab-pane .item .img img{
        width: 100%;
    }
    .food-menu .tab-pane .item p {
        width: 100%;
    }
    /* project */
    .project .all-items {
        display: block;
        padding-bottom: 30px;
        text-align: center;
    }
    .project .all-items li{
        display: inline-block;
    }
    .project .all-items li a {
        display: inline-block;
        margin-bottom: 20px;
    }
    /* team */
    .team .item {
        width: 285px;
        height: 300px;
        margin: auto;
    }

    /* client */
    .client{
        padding-bottom: 45px;
    }
    .client .button-prev {
        left: 0px;
    }
    .client .button-next {
        right: 0px;
    }

    /* footer-bottom */
    .footer-bottom .f-menu ul{
        justify-content: center !important;
        padding-top: 30px;
    }

    /*========== Home 2 ===========*/

    /* banner */
    .home2 .banner .banner-text h1{
        font-size: 29px;
    }
    .home2 .banner p {
        padding-right: 0;
        padding-bottom: 40px;
    }

    /* book table */
    .book-table .image {
        display: none;
    }
    .book-table .table-bg {
        padding: 30px 15px;
    }

    /* client */
    .client.home2 .btns button {
        bottom: -50px;
    }
    .client.home2 .btns .button-prev {
        left: 35%;
    }
    .client.home2 .btns .button-next {
        right: 35%;
    }

    /*========== About page ===========*/
    /* menubar */
    
    .about-page .header-menu ul > li a {
        color: var(--dark);
    }
    .about-page span.submenu-button:before{
        border-top-color: var(--dark);
    }
    .about-page .menubar .right-part{
        display: block;
    }
    /* banner */
    .about-page .banner{
        background-position: 93% 0 !important;
    }
    .about-page .banner h1 {
        font-size: 40px;
    }
    /*========== Blog page ===========*/
    
    .blog-page .blog-inner{
        margin-top: 50px;
    }
    .blog-page .blog-inner .blog-title {
        font-size: 24px;
    }
    .blog-page .blog-inner ul li:first-child {
        padding-right: 10px;
    }
    .blog-page .blog-inner ul li:first-child:after{
        display: none;
    }
    /*========== Blog detail page ===========*/
    .blog-detail .blog-inner .author {
        display: block !important;
    }
    .blog-detail .blog-inner .author li:after{
        display: none;
    }
    .blog-detail .author {
        padding: 5px 15px;
    }
    .blog-detail .blog-inner .share-blog {
        display: block !important;
    }
    .blog-detail .blog-inner .share-blog .right-part{
        padding-top: 20px;
    }
    .blog-detail .blog-inner .comment .all-comment li img {
        position: relative;
        margin-bottom: 20px;
    }
    .blog-detail .blog-inner .comment .all-comment li .comment-body {
        padding-left: 0;
    }
    .blog-detail .blog-inner .comment .all-comment li {
        margin: 20px 0;
    }
    .blog-detail .blog-inner .comment .all-comment li ul li {
        padding: 20px 0;
    }

    .blog-detail .blog-inner .comment .all-comment ul li img {
        margin-top: 0;
    }
    .blog-detail .blog-inner .comment .all-comment li ul {
        margin-left: 40px;
    }
    .blog-detail .blog-inner .comment form {
        margin-top: 20px;
    }
    .blog-detail .blog-inner .comment .all-comment li .reply{
        top: 135px;
    }
    .blog-detail .blog-inner .comment .all-comment li ul li .reply{
        top: 135px;
        margin-top: 25px;
    }

    /*========== Contact page ===========*/
    /* message */
    .message .section-title h2 {
        font-size: 30px;
    }
    .message .bg {
        padding: 40px 15px 50px 15px;
    }

    /*========== 404 page ===========*/
    .page p {
        width: 100%;
        font-size: 17px;
        line-height: 36px;
    }
   
}