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

                About

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



/*

    Theme Name: Product

    Theme URI:

    Author: Themes Industry

    Author URI:

    Description: One Page , Multi Parallax Template

    Tags: One page, multi page, multipurpose, parallax, creative, html5



 */



/***************Table of Content**************/

/*  - Fonts

    - General Classes

    - Preloader

    - Scroll bar

    - Header And Navigation

    - Slider

    - About

    - Causes

    - Gallery

    - Blog

    - Contact

    - Footer

    - Stand alone page

    - Media Queries   */







@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400&display=swap');





/*************GENERAL CLASSES***********/

html,body{

    scroll-behavior: smooth;

}

.text-yellow{

    color: #FFC107;

}

.text-black{

    color: #000;

}

.mb-60{

    margin-bottom: 5% !important;

}

a{

    text-decoration: none;

}





/*******************PRELOADER****************/

.loader-area{

    position: fixed;

    left: 0;

    top: 0;

    bottom: 0;

    right: 0;

    background-color:#000;

    z-index: 999999;

}

.spinning-area{

    height: 100vh;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    justify-content: center;

    -webkit-box-align: center;

    -ms-flex-align: center;

    align-items: center;

}

.spinner {

    border: 10px solid rgba(255, 255, 255, 0.2);

    border-top: 10px solid #ffc107;

    border-radius: 50%;

    width: 20px;

    height: 20px;

    margin: 0 auto;

    margin-top: 5%;

    padding: 50px;

    -webkit-box-shadow: 0 0 180px #000;

    box-shadow: 0 0 180px #000;



    -webkit-animation-name: spin;



    animation-name: spin;

    -webkit-animation-duration: 2s;

    animation-duration: 2s;

    -webkit-animation-iteration-count: infinite;

    animation-iteration-count: infinite;

    -webkit-animation-timing-function: ease;

    animation-timing-function: ease;

}



@-webkit-keyframes spin {

    100% {

        -webkit-transform: rotate(360deg);

        transform: rotate(360deg);

    }

}



@keyframes spin {

    100% {

        -webkit-transform: rotate(360deg);

        transform: rotate(360deg);

    }

}



/************SCROLLBAR************/

::-webkit-scrollbar-track {

    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);

    background-color: #000;

}

::-webkit-scrollbar-thumb {

    background-color: #ffc107;

    background-image: -webkit-gradient(linear, 0 0, 0 100%,

    color-stop(.5, #ffc107),

    color-stop(.5, transparent), to(transparent));

}

::-webkit-scrollbar {

    width: 10px;

    background-color: #F5F5F5;

}





/**********NAVBAR AFTER SCROLL*******/

.sticky-bottom {

    position: relative;

    background: #fff;

    padding-top: 15px;

}

.navbar-appear {

    z-index: 11;

    position: fixed;

    top: 0;

    left:0;

    right:0;

    overflow: auto;

    background: #ffffff;

    -webkit-box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.15);

    box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.15);

    -webkit-animation-name: animationFade;

    animation-name: animationFade;

    -webkit-animation-duration: 1s;

    animation-duration: 1s;

    -webkit-animation-fill-mode: both;

    animation-fill-mode: both;



}

.fixed-top{

    background-color: #ffffff;

}



.navbar.fixed-menu {

    z-index: 1111;

    position: fixed;

    top: 0;

    left:0;

    right:0;

    overflow: auto;

    background: #000;

    -webkit-box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.15);

    box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.15);

    -webkit-animation-name: animationFade;

    animation-name: animationFade;

    -webkit-animation-duration: 1s;

    animation-duration: 1s;

    -webkit-animation-fill-mode: both;

    animation-fill-mode: both;



}

@-webkit-keyframes animationFade {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, -100%, 0);

        transform: translate3d(0, -100%, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes animationFade {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, -100%, 0);

        transform: translate3d(0, -100%, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

.navbar-light .navbar-nav .nav-link.active:before,.square:hover .navbar-light .navbar-nav .nav-link.active:after{

    width:100%;

}

.rounded-bar.transparent-bar.margin-nav .banner-icons.sticky-icons {

    display: none;

}

.rounded-bar.transparent-bar.navbar.fixed-menu .banner-icons.sticky-icons {

    display: block;

}

.navbar.fixed-menu .nav-link:hover  {

    color: #ffc107 !important;

}

.navbar.fixed-menu .nav-link.active, .navbar.fixed-menu .nav-link.show,.navbar.fixed-menu .show>.nav-link {

    color: #FFC107 !important;

}

.banner-icons.sticky-icons a i{

    background-color: transparent;

    color: #fff;

}

.banner-icons.sticky-icons a i:hover{

    background-color: #fff;

    color: #000;

}



/***********NAVBAR FOR LARGE SCREEN*********/

.navbar-nav .nav-link {

    padding: 10px 0 2px 0  !important;

    position: relative;

    overflow: hidden;

    display: inline-block;

    text-decoration: none;

    font-size: 14px;

    font-family: 'Raleway', sans-serif;

}



.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {

    color: #fff;

}

.navbar-light .navbar-nav .nav-link:hover {

    color: #fff;

}



/****************TRANSPARENT NAVBAR***************/

.bg-trans-color{

    background-color: transparent !important;

}

.bg-trans-color .navbar-nav .nav-link{

    color: #FFFFFF;

    -webkit-transition: 0.8s ease;

    -o-transition: 0.8s ease;

    transition: 0.8s ease;

}

.transparent-bar.navbar.fixed-menu.margin-nav {

    margin-top: 0;

}

.bg-trans-color .navbar-nav .nav-item {

    margin: 12px 14px;

}



.banner-icons a i{

    margin: 0 2px 0 0;

    margin-bottom: 5px;

    font-size: 18px;

    background-color: #fff;

    padding: 7px;

    border-radius: 50%;

    -webkit-transition: 0.8s ease;

    -o-transition: 0.8s ease;

    transition: 0.8s ease;

    color: #000

}

.banner-icons a i:hover{

    background-color: #FFC107;

    color: #000;

}



.rounded-bar.transparent-bar.margin-nav .logo{

    display: none;

}

.rounded-bar.transparent-bar.navbar.fixed-menu .logo {

    display: block;

}

.logo-center{

    margin-left: auto;

    margin-right: auto;

    text-align: center;

}

.margin-nav {

    margin-top: 60px;

}

.rounded-bar {

    z-index: 1;

    position: absolute;

    left: 0;

    right: 0;

    top: 15px;

    padding: 0;

    width: 100%;

}



/*************MODEL WINDOW FOR NAVBAR FOR SMALL SCREEN***********/

.outer-window{

    display : none;

    color: white;

}

.inner-window{

    background-color: #ffc107;

    display: block;

    position: fixed;

    top:0;

    right: 0;

    bottom: 0;

    left: 0;

    z-index: 111111111;

}

.inner-window.start-anm{

    -webkit-animation: 0.8s slideInLeft;

    animation: 0.8s slideInLeft;

}

.inner-window.end-anm{

    -webkit-animation: 0.8s slideOutLeft;

    animation: 0.8s slideOutLeft;

}

.outer-window .navbar{

    position: relative;

    background-color: transparent !important;

}

.outer-window .navbar-nav .nav-item {

    margin: 13px 1.25rem 0 1.25rem;

}

.outer-window .nav-link{

    text-decoration: none;

    color: #fff;

    font-size: 28px;

    font-family: 'Raleway', sans-serif;

    cursor: pointer;

}



.outer-window .nav-item a{

    padding: 15px;

}

.outer-window .navbar-nav{

    margin-top: 10%;

    text-align: center;

}

.outer-window .logo {

    margin-top: 84px;

    text-align: center;

}

.outer-window .close-outerwindow{

    position: absolute;

    right: 6%;

    top:3%;

    z-index: 1111;

    cursor: pointer;

}

.outer-window .close-outerwindow i{

    color: #fff;

    font-size: 45px;

}

.outer-window .close-outerwindow i:hover{

    -webkit-animation: 1s rotateIn;

    animation: 1s rotateIn;

}

.logo_display{

    display: none;

}

.my-tog-btn{

    display: none;

}

.my-tog-btn span{

    background-color: #fff;

    margin-bottom: 5px;

    height: 2px;

    width: 100%;

}





/***********BANNER AND BANNER TEXT***********/

.transparent-banner{

    position: absolute;

    width: 100%;

    z-index: 9;

    margin-top: 30px;

}

.top-banner{

    height: 55px;

}

.top-banner .banner-text {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    margin: 12px 0;

}





/****************REVOLUTION SLIDER***********/

.layer-overlay{

    position: absolute;

    top:0;

    bottom: 0;

    left: 0;

    right: 0;

    background-color: rgba(0, 0, 0, 0.73);

}

.gradient-yellow-btn{

    background-color: #FFC107 ;

    border: 1px solid #FFC107;

    z-index: 2;

    -webkit-transition: 0.8s ease;

    -o-transition: 0.8s ease;

    transition: 0.8s ease;

}

.gradient-yellow-btn:hover{

    background-color: #fff;

    border: 1px solid #fff;

    color: #000 !important;

}



.black-btn{

    background-color: #000;

    border: 2px solid #000;

    -webkit-transition: 0.8s ease;

    -o-transition: 0.8s ease;

    transition: 0.8s ease;

    color: #fff;

}

.trans-btn{

    background-color: transparent;

    color: #fff;

    border: 1px solid #fff;

    -webkit-transition: 0.8s ease;

    -o-transition: 0.8s ease;

    transition: 0.8s ease;

}

.black-btn:hover{

    background-color: #ffc107;

    color: #000;

    border: 2px solid #ffc107;

}

.trans-btn:hover{

    background-color: #ffc107;

    color: #000;

    border: 1px solid #ffc107;

}

.small-btn{

    padding: 8px 15px !important;

    font-weight: 300 !important;

    font-size: 13px !important;

}



.btn-slider {

    padding: 13px 28px;

    cursor: pointer;

    -webkit-box-shadow: none;

    box-shadow: none;

    outline: none;

    font-size: 15px;

    font-family: 'Raleway', sans-serif !important;

    line-height: 17px !important;

    font-weight: bold;

    -webkit-transition: 0.8s ease;

    -o-transition: 0.8s ease;

    transition: 0.8s ease;

}





/******************ABOUT SECTION START************/

.about{

    padding-top: 150px;

}

.main-heading{

    font-family: 'Raleway' , sans-serif;

    font-size: 45px;

}

.sub-heading{

    font-family: 'Roboto' , sans-serif;

    font-size: 15px;

    font-weight: 300;

}



/******************ABOUT SECTION START************/

.causes{

    padding-top: 150px;

}

.causes .causes-detail {

    height: 278px;

}

.causes .causes-detail{

    padding: 10px 25px;

}

.causes-name {

    font-size: 22px;

}



.height-sub-heading{

    line-height: 22px;

    font-size: 13px ;

}

.skill-tab{

    border-bottom: 1px solid #000;

}

.bar-info{

    font-weight: bold;

    font-size: 11px;

    color: #000;

}

.perc {

    position:absolute;

    display:none !important;

    top: 0;

    line-height: 15px;

    right: -45px;

    font-size: 15px;

    color: #000;

    font-weight: bold;

}

.bar1{

    position: relative;

    width: 100%;

    height: 12px;

    background-color: #000;

    border-radius: 2rem;

    margin: 0;

}

.bar1:after {

    position: absolute;

    top:0;

    right: 10px;

    line-height: 30px;

}

.fillmult {

    position: absolute;

    height: 100%;

    width: 0;

    background-color: #FFCA00;

    border-radius: 1rem;

    line-height: 20px;

    text-align: left;

}

.fillmult span {

    padding-left: 10px;

}



/******************DONATOR SECTION START************/



.donator{

    padding-top: 150px;

}

.sub-width{

    width: 800px;

    margin: 0 auto;

}

.social-icons-simple {

    margin-top: -3px;

}



ul.social-icons-simple li{

    display: inline-block;

}



ul.social-icons-simple li a {

    height: 30px;

    line-height: 30px;

    width: 30px;

    font-size: 14px;

    border-radius: 50%;

    margin: 0 1px;

    text-align: center;

    display: block;

    color: #26313c;

    position: relative;

    z-index: 1;

    border: 1px solid #7c7c7c;

}

ul.social-icons-simple li a {

    border: none;

}

ul.social-icons li a::before,

ul.social-icons-simple li a::before {

    content: "";

    position: absolute;

    left: -1px;

    right: -1px;

    bottom: -1px;

    top: -1px;

    opacity: 0;

    visibility: hidden;

    border-radius: inherit;

    z-index: -1;

    -webkit-transform: scale(.5);

    -ms-transform: scale(.5);

    transform: scale(.5);

}



.team-content {

    padding: 2rem 1rem;

    background: #ffc107;

    text-align: center;

    height: 100px;

    position: relative;

    overflow: hidden;

    z-index: 1;

}



.equal-shadow-team .team-content {

    -webkit-box-shadow: 0 1px 10px 0 rgba(0, 0, 0, .1);

    box-shadow: 0 1px 10px 0 rgba(0, 0, 0, .1);

}



.team-content::before {

    opacity: 0;

    visibility: hidden;

    position: absolute;

    left: 0;

    top: 0;

    bottom: 0;

    right: 0;

    z-index: -1;

    -webkit-transform: translateY(100%);

    -ms-transform: translateY(100%);

    transform: translateY(100%);

    background-size: 200% auto;

    background-color: #000;

}



.team-box:hover .team-content * {

    color: #ffc107;

}



.team-box:hover .team-content h4 {

    margin-top: -15px;

}



.team-box:hover .team-content::before {

    opacity: 1;

    visibility: visible;

    -webkit-transform: translateY(0);

    -ms-transform: translateY(0);

    transform: translateY(0);

}



.team-content ul {

    -webkit-transform: translateY(150%);

    -ms-transform: translateY(150%);

    transform: translateY(150%);

}



.team-box:hover .team-content ul {

    -webkit-transform: translateY(0);

    -ms-transform: translateY(0);

    transform: translateY(0);

    margin-top: 5px;

}



.team-box:hover img {

    -webkit-transform: scale(1.2);

    -ms-transform: scale(1.2);

    transform: scale(1.2);

}



.teams-border::before {

    height: 160px;

}

.team-content::before{

    content: "";

}



.image {

    overflow: hidden;

}



a.image,

.image img {

    display: block;

}



.image img {

    width: 100%;

}



section,

.image,

.image img {

    position: relative;

}



.team-box:hover .team-content::before {

    opacity: 1;

    visibility: visible;

    -webkit-transform: translateY(0);

    -ms-transform: translateY(0);

    transform: translateY(0);

}



*::before, *::after, .image img, .team-content h4, .overlay ul, .card-header .card-link:before, .contact-table .icon-cell, .feature-item .icon, .cbp-l-filters .cbp-filter-item span, .testi-box .testimonial-round>img, .feature-item .icon, #services-slider .service-box>span {

    -webkit-transition: all 0.3s ease-in-out;

    -o-transition: all 0.3s ease-in-out;

    transition: all 0.3s ease-in-out;

}



.image img, .card-link:before, .contact-table .icon-cell, .feature-item .icon, .cbp-l-filters .cbp-filter-item span, .testi-box .testimonial-round>img, .feature-item .icon, #services-slider .service-box>span {

    -webkit-transition: all 0.3s ease-in-out;

    -o-transition: all 0.3s ease-in-out;

    transition: all 0.3s ease-in-out;

}





/******************GALLERY SECTION START************/

.gallery{

    padding-top: 150px;

}



/******************PORTFOLIO SECTION START****************/

.col-height-portfolio{

    height: 100%;

}

.height1{

    height: 285px;

}

.height2{

    height: 255px;

}



/********PORTFOLIO HOVER EFFECT*******/

.cbp-item .overlay{

    position: absolute;

    left: 15px;

    right: 15px;

    bottom: 15px;

    top:15px;

    background:-o-linear-gradient(45deg, rgba(0, 0, 0, 0.68) 20%, rgba(0, 0, 0, 0.68) 100%);

    background:linear-gradient(45deg, rgba(0, 0, 0, 0.68) 20%, rgba(0, 0, 0, 0.68) 100%);

    z-index: 111;

    opacity: 0;

    -webkit-transition: .8s ease;

    -o-transition: .8s ease;

    transition: .8s ease;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    justify-content: center;

    -webkit-box-align: center;

    -ms-flex-align: center;

    align-items: center;

}

.cbp-item:hover .overlay{

    opacity: 1;

}

.cbp-item .overlay .plus-gallery{

    height: 60px;

    width: 60px;

    border-radius: 50%;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    justify-content: center;

    -webkit-box-align: center;

    -ms-flex-align: center;

    align-items: center;

    border: solid 2px #ffc107;

    background-color: transparent;

    display: none;

}

.cbp-item .overlay .plus-gallery i{

    color: #ffc107;

    font-size: 30px;

}

.cbp-item:hover .overlay .plus-gallery{

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-animation:1s fadeInUp;

    animation:1s fadeInUp;

}







/**************BLOG SECTION START************/

.blog{

    padding-top: 150px;

}



.blog-text{

    margin-top: 35px;

}



.blog-text .info-blog{

    letter-spacing: 0;

    -webkit-transition: 0.5s ease;

    -o-transition: 0.5s ease;

    transition: 0.5s ease;

}



.blog-text .blog-description{

    line-height: 1.5;

    letter-spacing: 0;

}



.blog-item{

    cursor: pointer;

    padding: 40px 30px;

    margin: 5px;

    -webkit-transition: 0.5s ease;

    -o-transition: 0.5s ease;

    transition: 0.5s ease;

}



.blog-item:hover{

    -webkit-box-shadow: 1px 1px 14px #e1e1e1;

    box-shadow: 1px 1px 14px #e1e1e1;

    -webkit-transform: translateY(-16px);

    -ms-transform: translateY(-16px);

    transform: translateY(-16px);

}



#blog-carousal .owl-dots{

    margin-top: 50px !important;

    text-align: center;

}



#blog-carousal .owl-dots .owl-dot.active span, .owl-testimonial .owl-dots .owl-dot:hover span{

    background: #ffc107;

    border: 2px solid #ffc107;

}



#blog-carousal .owl-dots .owl-dot span{

    background: #000;

    border: 2px solid #000;

    border-radius: 50px;

    font-size: 0;

    padding: 5px;

    margin: 3px;

    text-align: center;

}



.owl-carousel .owl-dots.disabled {

    display: block;

}







/***************CONTACT US SECTION START************/

.contact{

    padding-top: 150px;

}

.mapouter {

    position: relative;

    text-align: right;

    height: 100%;

    width: 100%;

    overflow: hidden;

}

.gmap_canvas {

    overflow:hidden;

    background:none!important;

    height:100%;

    width:100%;

}

.map{

    -webkit-filter: grayscale(100%);

    filter: grayscale(100%);

}

.height-map{

    height: 300px;

}







/****************FOOTER SECTION*******************/

.footer{

    padding-top: 150px;

}

ul.footer_ul{

    list-style: none;

    display: inline-block;



}

li.footer_list{

    display: inline-block;

    margin-right: 10px;

    font-size: 19px;

    color: #000;

    border: 1px solid #ffc107;

    cursor: pointer;

    width: 50px;

    height: 50px;

    text-align: center;

    background-color: transparent;

    border-radius: 50%;

    padding-top: 12px;

    -webkit-transition: 0.5s ease;

    -o-transition: 0.5s ease;

    transition: 0.5s ease;

}

li.footer_list:hover{

    color: white;

    background-color: #ffc107;

    -webkit-animation: .8s ease;

    animation: .8s ease;

}

.footer_text{

    text-align: center;

    padding-bottom: 60px;

}





/*******************DETAIL BLOG****************/

.header-img{

    background: url(../../img/pb.jpg);

    background-attachment: fixed;

    height: 400px;

    position: relative;

    background-size: cover;

    background-position: bottom;

}

.overlay{

    position: absolute;

    top:0;

    bottom: 0;

    left: 0;

    right: 0;

    background-color: rgba(0, 0, 0, 0.73);

}

.margin-heading{

    padding-top: 17.5%;

    padding-bottom: 8%;

}

.minimal_image .min-post .large_post div {

    background: black;

    height: 24.8vw;

}

.blog_detail-heading{

    color:#000;

    font-size: 26px;

    font-family: 'Open Sans', sans-serif;

}

.text_minimal ul{

    color: #000;

}

.mt-40{

    margin-top: 70px;

}

.mejs__controls:not([style*='display: none']) {

    background: black;

}

.text_dummy {

    color: #333333;

    font-family: 'Open Sans', sans-serif;

    margin-top: 15px;

    letter-spacing: 0.2px;

}

.quote_text .quote{

    color: #FFC107;

    font-size: 24px;

    -webkit-transition: .2s ease;

    -o-transition: .2s ease;

    transition: .2s ease;

    cursor: pointer;

    width: 480px;

    line-height: 1.3;

    margin-left: auto;

    margin-right: auto;

    margin-top: 50px;

    text-align: left;

    font-weight: 700;

    font-family: 'Raleway', sans-serif;

}



.quote_text{

    margin-bottom: 20px;

}

.verticle_lineQ {

    width: 2.3px;

    height: 75px;

    background-color:#ffc107;

    text-align: right;

    margin-top: -87px;

    margin-left: 38.7rem;

}

.blogN_images img{

    height: 100%;

    width: 100%;

}

.pt-6{

    padding-top: 40px;

}

.written_outerbox{

    height: auto;

    width: auto;

    background-color: #f6f6f6;

}

.written_outerbox .written_img {

    width: 20%;

    border-radius: 50%;

    border: 1px solid transparent;

    margin-left: 60px;

    margin-top: 40px;

    margin-bottom: 40px;

}

.written_text {

    margin-top: auto;

    margin-left: 20px;

    margin-bottom: auto;

}

.main_written{

    color:#000;

    font-size: 24px;

    font-family: 'Open Sans' , sans-serif;

}

.comment_text{

    color: #000;

    font-size: 24px;

    text-align: center;

    font-family: 'Open Sans' , sans-serif;

}

.user_icon{

    color: lightgray;

    font-size: 65px;

    background: #f6f6f6;

    width: 100px;

    height: 100px;

    padding-top: 15px;

    padding-bottom: 15px;

    border-radius: 50px;

    padding-left: 21px;

    padding-right: 15px;

}

.icon_text{

    margin-bottom: auto;

    margin-top: auto;

    padding-left: 20px;

}

.height{

    line-height: 25px;

    font-size: 17px;

    padding-top: 10px;

}

.font{

    font-size: 21px;

}

.icon_comment{

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    margin-top: 50px;

}

.margin_days {

    font-size: 18px;

    margin-bottom: 10px;

}

.mt-6{

    margin-top: 70px;

}

/*..............SEARCH...........*/

.pt-lg-10{

    padding-top: 7rem;

}

.btn.focus, .btn:focus {

    outline: 0;

    -webkit-box-shadow: 0 0 0 0.2rem transparent;

    box-shadow: 0 0 0 0.2rem transparent;

}

.search_outerbox{

    background-color: #f6f6f6;

    width: auto;

    height: auto;

}

.input-group{

    padding-top: 30px;

    padding-bottom: 30px;

    padding-left: 35px;

    padding-right: 38px;

}

.form-control:focus {

    color: #000;

    background-color: #fff;

    border-color: #000;

    outline: 0;

    -webkit-box-shadow: 0 0 0 0.2rem transparent;

    box-shadow: 0 0 0 0.2rem transparent;

}

.form-control{

    font-family: 'Raleway', sans-serif;

    border-color: #ffc107;

}

.btn-search {

    background-color: #ffc107;

    border-radius: 0;

    color: #fff;

    border-width: 1px;

    border-style: solid;

    border-color: #ffc107;

    -webkit-animation: 0.8s ease;

    animation: 0.8s ease;

}

.btn-search:link, .btn-search:visited {

    color: #fff;

}

.btn-search:active, .btn-search:hover {

    background-color: #000;

    color: #fff;

    border-color: #000;

}

.display{

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

}

/*............TOPIC..............*/

.topic_outerbox{

    height: auto;

    width: auto;

    background-color: #f6f6f6;

    padding-bottom: 12px;

}



.topic_outerbox h2 {

    color:#000;

    font-size: 26px;

    padding-left: 42px;

    padding-top: 30px;

    padding-bottom: 10px;

    font-family: 'Open Sans', sans-serif;

}



.topic_outerbox ul{

    list-style: none;

    padding: 0;

}

.topic_outerbox li{

    text-decoration: none;

    color: #000;

    padding-top: 7px;

    padding-bottom: 7px;

    font-weight: 500;

    overflow:hidden !important;

    font-family: 'Raleway', sans-serif;

}

.topic_outerbox li a{

    text-decoration: none;

    color: #000;

    padding-right: 5px;

}

.topic_outerbox li a:hover{

    color: #ffc107;

}



.dots{

    letter-spacing: 6.5px;

    font-size: 16px;

    font-weight: normal;

}

.inner-box {

    margin-left: 13%;

    margin-right: 13%;

    text-align: center

}

.inner-box1 {

    margin-left: 12%;

    margin-right: 13%;

    text-align: center;

}

.image{

    height: 100%;

    width: 100%;

}

/*.............POPULAR POST..............*/

.outer_popular{

    height: auto;

    width: auto;

    background-color: #f6f6f6;

    padding-bottom: 35px;

}

.outer_popular h2 {

    color:#000;

    font-size: 26px;

    padding-left: 42px;

    padding-top: 30px;

    padding-bottom: 10px;

    font-family: 'Open Sans', sans-serif;

}

.pt-lg-4{

    padding-top: 2rem;

}

.popular_image{

    height: 100%;

    width: 35%;

}

.outer{

    margin-right: 13%;

    margin-left: 13%;

}

.text_post {

    padding-left: 20px;

    margin-top: 5px;

    margin-bottom: auto;

}

.main{

    color: #000;

    font-size: 17px;

    font-weight: 500;

    margin-bottom: 10px;

    cursor: pointer;

    -webkit-transition: .2s ease;

    -o-transition: .2s ease;

    transition: .2s ease;

    line-height: 18px;

    letter-spacing: 0;

    font-family: 'Raleway' , sans-serif;

}

.date{

    color: gray;

    font-size: 14px;

    margin-bottom: 4px;

    font-family: 'Raleway', sans-serif;

}

.text_post span{

    color: #000;

    font-weight: 500;

    font-size: 14px;

    cursor: pointer;

    -webkit-transition: .2s ease;

    -o-transition: .2s ease;

    transition: .2s ease;

    letter-spacing: 0;

    font-family: 'Raleway', sans-serif;

}

.main:hover{

    color: #ffc107;

}

.text_post span:hover{

    color: #ffc107;

}

/*..............TAGS.................*/

.outer_tag {

    height: auto;

    width: auto;

    background-color: #f6f6f6;

    padding-bottom: 30px;

}

.main_tag {

    color: #000;

    font-size: 26px;

    padding-left: 42px;

    padding-top: 30px;

    padding-bottom: 10px;

    font-family: 'Open Sans', sans-serif;

}

span{

    display: unset;

}

.inner_tag {

    margin-left: 13%;

    margin-right: 13%;

}

.tag_text a:hover{

    color: #000;

    background-color: #ffc107;

    border: solid 1px transparent;

}

.tag_text a {

    text-decoration: none;

    font-size:14px ;

    color: #000;

    border: solid 1px #000;

    padding: 5px 12px 5px 12px;

    margin-top: 9px;

    display: inline-block;

    font-family: 'Open Sans', sans-serif;

}

.sale_img{

    width: 100%;

    height: 100%;

}

.img-area img{

    height: 100%;

    width: 100%;

}







/**************MEDIA QUERIES************/

@media (min-width: 1022px) and (max-width: 1199px) {

    .bg-trans-color .navbar-nav .nav-item {

        margin: 12px 8px;

    }

}



@media (min-width: 992px) and (max-width: 1021px) {

    header .nav-link {

        margin-right:0;

        margin-left: 11px;

    }

    .bg-trans-color .navbar-nav .nav-item {

        margin: 12px 3px;

    }

}

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

    header{

        display: -webkit-box;

        position: fixed;

        z-index: 9;

        width: 100%;

        background: #000000bd;

        padding: 16px 0;

    }

    .logo_display{

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;

    }

    #navbar_btn{

        display: block;

    }

    #my-nav1{

        display: none;

    }

    .logo{

        margin-top: 30px;

    }

    .logo {

        text-align: left;

        margin-right: auto;

        margin-top: 0;

    }

    .my-tog-btn{

        display: -ms-inline-grid;

        display: inline-grid;

        width: 35px;

        height: auto;

        /*padding-top: 30px;*/

    }



}



@media (min-width:769px) and (max-width:991px) {

    .top-banner{

        display: none;

    }

    .logo {

        text-align: left;

        margin-right: auto;

        margin-top: 0;

    }



    .margin_navbar-logo {

        margin-bottom: 15px;

    }



    .my-tog-btn {

        margin-right: 30px;

    }

}



@media screen and (width:768px){

    #navbar1{

        display: none;

    }

    .top-banner{

        display: none;

    }

    .my-tog-btn{

        margin-right: 30px;

    }

    .sub-width{

        width: auto;

        margin: 0 auto;

    }

    .hover-heading{

        font-size: 20px;

    }

    .main-heading{

        font-size: 38px;

    }

    .header{

        display: -webkit-box;

        position: fixed;

        z-index: 9;

        width: 100%;

        background: #000000bd;

        padding: 20px 0;

    }



}



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

    .main-heading{

        font-size: 36px;

    }

    .footer{

        padding-top: 20px;

    }

    .contact{

        padding-top: 80px;

    }

    .blog{

        padding-top: 0;

    }

    .donator{

        padding-top: 80px;

    }

    .causes{

        padding-top: 80px;

    }

    .about{

        padding-top: 70px;

    }

    .gallery{

        padding-top: 80px;

    }

    #blog-carousal .owl-dots {

        margin-top: 30px !important;

    }

    li.footer_list {

        margin-right: 5px;

        width: 45px;

        height: 45px;

    }

    .footer_text{

        font-size: 12px;

    }

    .sub-width{

        width: auto;

        margin: 0 auto;

    }

    .top-banner{

        display: none;

    }

    .my-tog-btn {

        margin-right: 30px;

    }

    .logo {

        text-align: left;

        margin-right: auto;

        margin-top: 0;

    }



    .menu-icon{

        padding-left: 2rem;

    }

    #navbar_btn{

        display: block;

    }

    #my-nav1{

        display: none;

    }

}







/**************STANDALONE PAGE MEDIA QUERIES***********/

@media screen and (min-width:1600px){

    .bg-img .text1{

        margin-left: 20px;

    }

    .bg-img .text {

        position: absolute;

        margin-left: 18px;

    }

}



@media screen and (width:768px) {



    .colored_hover {

        width: 96%;

    }

    .colored_hover-center {

        width: 96%;

    }

    .popular_image {

        height: 100%;

        width: 22%;

    }



}



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

    li.navbar_list {

        padding-top: 0;

        width: 23px;

        height: 23px;

    }



    .padding_blog-img{

        padding-top: 10px;

    }



    .btn-model {

        padding: 9px 35px 9px 35px;

    }

    .bg-img .text1{

        margin-top: 90px;

        text-align: center;

        padding-bottom: 3.3%;

    }

    .modal.show .modal-dialog {

        -webkit-transform: none;

        margin-top: 30px;

    }

    .input-group {

        padding-left: 10%;

        padding-right: 10%;

        text-align: left;

    }

    .inner-box {

        margin-left: 20px;

        margin-right: 5%;

    }

    .box4 .box-content {

        margin-top: 35px;

    }

    .text_post {

        margin-bottom: 15px;

    }

    .mt-10{

        margin-top: 2.5rem;

        margin-bottom: 2.5rem;

    }

    .pr-6{

        padding-right: 30px;

    }

    .box4:hover:before {

        width:470%;

    }

    .box4 .post {

        font-size: 12px;

    }

    .box4 .icon li a{

        font-size:22px;

    }

    .divider {

        border: 0.5px solid #dbdbdb;

    }

    .pt-lg-10 {

        padding-top: 1.5rem;

    }

    .margin_small{

        margin-top: 30px;

    }

    .verticle_lineQ {

        margin-top: -131px;

        margin-left: 0;

    }

    .font {

        font-size: 17px;

    }

    .quote_text .quote {

        font-size: 21px;

        width: 325px;

        margin-right:0;

        margin-top: 60px;

        margin-left: 15px;

    }

    .text1 h1 {

        font-size: 1.2rem;

        margin-left: 0;

        text-align: center;

    }

    .text1 p {

        margin-top: 0;

        margin-bottom: 1rem;

        font-size: 17px;

    }

    .written_text {

        padding-bottom: 22px;

        text-align: center;

        margin-left: 0;

    }

    .written_img {

        width: 40%;

        margin-left: 100px;

    }

    .written_outerbox{

        text-align: center;

    }

    .written_outerbox .written_img {

        width: 40%;

        margin-left: 0;

    }

    .written .display{

        display: inline-block;

    }

    .icon_text {

        margin-top: auto;

        margin-bottom: auto;

    }

    .form-control {

        text-align: left;

    }

    .icon_comment {

        margin-left: 55px;

    }







}



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

    .min-post {

        margin-top: 20px;

    }

}







/*********REV SLIDER ARROWS*************/

#rev_slider_2_1 .zeus.tparrows{cursor:pointer; min-width:70px; min-height:70px; position:absolute; display:block; z-index:100; border-radius:50%;   overflow:hidden; background:rgba(0,0,0,0.1)}#rev_slider_2_1 .zeus.tparrows:before{font-family:"revicons"; font-size:20px; color:rgb(255,255,255); display:block; line-height:70px; text-align:center;   z-index:2; position:relative}#rev_slider_2_1 .zeus.tparrows.tp-leftarrow:before{content:"\e824"}#rev_slider_2_1 .zeus.tparrows.tp-rightarrow:before{content:"\e825"}#rev_slider_2_1 .zeus .tp-title-wrap{background:rgba(0,0,0,0.5); width:100%; height:100%; top:0px; left:0px; position:absolute; opacity:0; -ms-transform:scale(0); transform:scale(0); -webkit-transform:scale(0);  -o-transition:all 0.3s;  transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s;  border-radius:50%}#rev_slider_2_1 .zeus .tp-arr-imgholder{width:100%; height:100%; position:absolute; top:0px; left:0px; background-position:center center; background-size:cover; border-radius:50%; -ms-transform:translatex(-100%); transform:translatex(-100%); -webkit-transform:translatex(-100%);  -o-transition:all 0.3s;  transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s}#rev_slider_2_1 .zeus.tp-rightarrow .tp-arr-imgholder{-ms-transform:translatex(100%);transform:translatex(100%); -webkit-transform:translatex(100%)}#rev_slider_2_1 .zeus.tparrows:hover .tp-arr-imgholder{-ms-transform:translatex(0);transform:translatex(0); -webkit-transform:translatex(0); opacity:1}#rev_slider_2_1 .zeus.tparrows:hover .tp-title-wrap{-ms-transform:scale(1);transform:scale(1); -webkit-transform:scale(1); opacity:1}



.numbered .tp-bullet,

.numbered .tp-bullet-number,

.numbered .tp-bullet .tp-count {

    position: relative;

}



.numbered .tp-bullet {

    width: 20px;

    height: 15px;

    background: transparent;

    cursor: pointer;

    color: #18191d;

    -webkit-transition: 3s height;

    -o-transition: 3s height;

    transition: 3s height;

}



.numbered .tp-bullet-number {

    text-align: left;

}



.numbered .tp-bullet-number,

.numbered .tp-bullet .tp-count {

    -webkit-transition: all 1s ease;

    -o-transition: all 1s ease;

    transition: all 1s ease;

}



.numbered .tp-bullet.selected:nth-child(4) {

    padding-bottom: 4px;

    border-bottom: 2px solid;

}



.numbered,

.tp-tabs,

.tp-thumbs {

    top: 47% !important;

}



.numbered .tp-bullet .tp-count {

    font-size: 17px;

    bottom: 5px;

}



.numbered .tp-count:before {

    height: 3px !important;

    width: 40px !important;

    -webkit-transform: scaleX(0);

    -ms-transform: scaleX(0);

    transform: scaleX(0);

    display: block;

    background: #24cdd5;

    top: 100%;

    visibility: hidden;

    opacity: 0;

    -webkit-transition: all 300ms ease;

    -o-transition: all 300ms ease;

    transition: all 300ms ease;

}



.numbered .tp-count:before,

.revicon {

    position: absolute;

}

.numbered .tp-count:before {

    content: "";

}

.numbered .tp-bullet.selected .tp-count {

    color: #24cdd5;

}



.white .numbered .tp-bullet .tp-count,

.white .numbered .tp-count:before,

.white .numbered .tp-bullet.selected .tp-count {

    color: #fff;

}

.tp-bullet.selected, .tp-bullet:hover {

    background: transparent !important;

}

.numbered .tp-bullet.selected .tp-count:before {

    margin-top: 2px;

    -webkit-transform: scaleX(1);

    -ms-transform: scaleX(1);

    transform: scaleX(1);

    visibility: visible;

    opacity: 1;

    -webkit-transition: all 500ms ease;

    -o-transition: all 500ms ease;

    transition: all 500ms ease;

}

.white .numbered .tp-count:before {

    background: #fff;

}



.numbered .tp-bullet.selected .tp-count:before {

    -webkit-transform: scaleX(1);

    -ms-transform: scaleX(1);

    transform: scaleX(1);

    visibility: visible;

    opacity: 1;

    -webkit-transition: all 500ms ease;

    -o-transition: all 500ms ease;

    transition: all 500ms ease;

}



.animate-out {

    -webkit-animation-delay: 0ms;

    animation-delay: 0ms;

}



.revicon {

    top: 50%;

    -webkit-transform: translateY(-50%);

    -ms-transform: translateY(-50%);

    transform: translateY(-50%);

    right: 40px;

    z-index: 11;

}



.revicon li a {

    height: 40px;

}