/* Charitify Theme Responsive Design */

@media (max-width: 1024px) {

   
}

/* ---- Start of max-width 992px CSS ---- */
@media (max-width: 992px) {
    ul.nav > li > a {
        font-size: 10px;
        padding: 0 5px;
    }
    
    .bottom-header .default-btn{
        display: none;
    }

    #mainmenu li{
        padding-left: 15px;
    }


}
/* ---- End of max-width 992px CSS ---- */
@media(max-width: 992px ) and  (min-width: 768px){
    .bottom-header{
        top: 50px ;
    }
    .banner {
        margin-top: 50px;
    }
}

/* ---- Start of max-width 767px CSS ---- */
@media(max-width:992px) and (min-width: 576px){
    .slicknav_nav{
        margin: 0 -33px !important;
    }
    .slicknav_btn{
        margin-top: 35px !important;
    }
}

@media all and (max-width: 992px) {
    .header-section.navbar-fixed-top .bottom-header{
        position: fixed;
    }
    .header-section.navbar-fixed-top .top-header{
        display: none;
    }

    .slicknav_nav .slicknav_arrow {
            position: absolute;
            left: 0;
            width: 45%;
            text-align: right;
        }
    body, p{
        font-size: 12px;
        line-height: 22px;
    }
    h1{
        font-size: 30px;
    }
    h2{
        font-size: 20px;
    }
    h3{
        font-size: 16px;
    }
    p br{
        display: none;
    }
    
    .navbar-header {
        padding: 23px 20px;
    }

    .navbar-header .brand {
        display: block;
        padding: 13px 25px;
    }

    .js #mainmenu {
        display:none;
    }

    .js .slicknav_menu {
        display:block;
        margin-right: 0px;
    }

    .hero-slides-content {
        background:transparent;
        left: 0;
        width:100%;
        padding: 20px;    
    }

    .owl-nav div{
        left: 0;
    }
    .owl-nav div.owl-next{
        right: 0;
    }

    .hero-section{
        height: 400px;
    }

    .hero-slides-content h1{
        font-size: 30px!important;
    }
    .site-branding img{
        padding: 5px 0;
        max-width: 200px;
    }
    .slicknav_btn {

        border-radius: 0;
        background-color: #d5a1a1 ;
        color: black ;
        /*width: auto;*/
        margin-top: 25px;

    }
    #scroll-to-top {
        width: 35px;
        height: 35px;
        font-size: 10px;
        line-height: 35px;
        bottom: 20px;
        right: 20px;
    }

    .footer-last-social-link {
        margin-bottom: 10px;
    }

    .designer-company{
        text-align: center;
    }

    .designer-company a {
        float: none;
    }

    .ft-fixed-area {
        margin-top:0px; 
    }

    div#big-img {
        display: none;
    }

    .inner-page-about-title h3 {
        font-size: 30px;
    }


    /*new css*/


    .pt-pb-70-35 {
        padding-top: 70px;
    }

    footer .footer-background .footer-about-bottom p {
        max-width: 100%;
    }

    .offer-body{
        height: auto;
    }

    .feature-box {
        margin-top: 0;
        margin-bottom: 10px; 
    } 

    .get-btn {
        display: none;
    }

    .social-link{
        display: none;
    } 

    .top-header{
        /*display: none;*/
    } 

    .bottom-header {
        background-color: #fff;
    }

    .story {
        padding: 15px;
        transform:none;
    }

    .story__shape {
        width: 35%;
        height: 20%;
        shape-outside: circle(50% at 50% 50%);
        -webkit-shape-outside: circle(50% at 50% 50%);
        clip-path: circle(50% at 60% 50%);
        -webkit-clip-path: circle(50% at 60% 50%);
        transform: none;
    }
    .story__text {
        transform: none;
    }

    .bottom-header {
        position: relative;
        background-color: #fff;
    }

    .team-img img {
        width: 100%;
    }

    .blog--head-img.blog--head-img-front img {
        width: 100%;
    }

    .blog--head-img.blog--head-img-front{
        margin-bottom: 10px;
    }

    /*new new csss*/

    .section-main-title p,
    .testimonial-title p  {
        padding: 0;
    }

    .section-title h3::after {
        margin-right: -160.5px;
        width: 130px;
    }

    .section-title h3::before {
        margin-left: -159.5px;
        width: 130px;
    }

    .section-title h3 {
        font-size: 23px;
    }

    .about-section .section-title:after {
        margin-left: -21px;
    }

    .banner{
        height: 350px;
    }

    .single-item{
        height: 350px;
    }

    .caption{
        top: 15%;
    }

    .bannertext h1{
        font-size: 25px;
        line-height: 30px;
    }

    .bannertext p{
        font-size: 14px;
        line-height: 22px;
    }

    a.contactus{
        padding: 10px 20px;
    }

    .slicknav_nav {
        top: 15px;
    }

    .contact-us .contact .single-contact{
        border-right: none;
    }

    .col-md-6.pl-0 {
        padding-right: 0;
    }
    .col-md-6.pr-0.pl {
        padding-left: 0;
    }

    .logo-text {
        top: 25px;
    }

    .logo-text a {
        font-size: 20px;
    }
    .left-info li span,
    .left-info li  {
        color: black !important;
    }


}
/* ---- End of max-width 767px CSS ---- */

@media (max-width: 768px) and (min-width:715px ){
    .bottom-header{
        top: 50px;
    }

}
@media (max-width: 714px) and (min-width:575px ){
    .bottom-header{
        top: 70px;
    }
    .banner {
        margin-top: 70px;
    }
    .site-branding img{
        max-width: 120px;
    }
    .slicknav_btn {
        margin-top: 23px !important;
    }
}
@media(max-width: 575px) and (min-width:480px) {
      .col-xs-3{max-width: 25%}
      .col-xs-4{max-width: 33.33%}
      .col-xs-5{max-width:41.66%;}

    .col-xs-6{max-width: 50%}
    .col-xs-12{max-width: 100%}
    .bottom-header{
        top: 84px;
    }
    .right-info{
        text-align: center;
    }
    .top-content-wrap .right-info{
        float: none;
    }
    .banner{
        margin-top: 84px;
    }
}
@media(max-width: 480px){
    .col-all-12{
        max-width: 100%;
    }
    .contactno.col-lg-4.col-md-4.col-sm-4.col-xs-6.\.col-all-6.text-center {
        max-width: 50%;
    }
    .col_6{
        max-width: 50%;
    }
    .banner{
        margin-top: 84px;
    }
    .slicknav_nav{
        top:13px !important;
    }
    .search_form{
        max-width: 370px;
    }
}
/* ---- Start of max-width 698px CSS ---- */
@media all and (max-width: 698px) {

.js .slicknav_menu {
        display:block;
        margin-right: 0;
    }
}

/* ---- Start of max-width 598px CSS ---- */
@media all and (max-width: 598px) {

.js .slicknav_menu {
        display:block;
        margin-right: 0;
        width: 100%;
    }

    .block-wrap {
        padding: 10px 8px 10px 8px;
        float: left;
        margin: 10px 0;
    }

    .block-wrap-list {
        padding: 0;
    }

}


/* ---- Start of max-width 480px CSS ---- */
@media all and (max-width: 480px) {
    
     
    .top-content-wrap ul li{
        margin-right: 18px;
    }

    .block-wrap {
        padding: 5px 0px;
        float: left;
        margin: 6px;
    }
    .bottom-header {
        top:85px;
    }

}
/* ---- End of max-width 480px CSS ---- */


/* ---- Start of max-width 420px CSS ---- */
@media all and (max-width: 420px) {
    
}
/* ---- End of max-width 420px CSS ---- */


/* ---- Start of max-width 380px CSS ---- */
@media all and (max-width: 380px) {
	.bottom-header{
        top: 84px;
    }
     
    .yt-button__text {
        display: none;
    }
}
/* ---- End of max-width 380px CSS ---- */
@media (max-width: 575px){
    .site-branding img {
        padding: 5px 0;
        max-width: 120px;
        position: relative;
        z-index: 999;
    }
    .slicknav_nav {
        top: 0px;
    }
    .responsive_area{
        padding: 0;
        margin: 0;
    }
    .slicknav_arrow {
        width: 45%;
        position: absolute;
        left: 0;
        text-align: right;
    }
}