/*
Theme Name:  Welfare Charity
Theme URI:   https://rarathemes.com/wordpress-themes/welfare-charity/
Author:      Rara Theme
Author URI:  https://rarathemes.com/
Template:    benevolent
Description: Welfare Charity is a free WordPress theme for non-profit organizations like charities, INGOs, NGOs, trusts, foundations, etc. This theme works seamlessly with the Give plugin, allowing you to collect donations quickly and effortlessly for charitable causes. Featuring multiple section on its homepage like a banner, introduction, causes section, donation link and call to action button, this theme offers an attractive landing page where you can showcase your charitable organization. It is also SEO-friendly with optimized codes, which make it easy for your site to rank on search engines. Goodwill Charity is optimized to load fast, is translation-ready, mobile-friendly and schema ready. Check the demo at https://rarathemes.com/previews/?theme=welfare-charity/, documentation at https://docs.rarathemes.com/docs/benevolent/ and get support at https://rarathemes.com/support-ticket/.
Version: 1.0.0
Requires PHP: 5.6
Tested up to: 6.2
Requires at least: 4.7
License:     GNU General Public License v3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags:        Blog, two-columns, right-sidebar, footer-widgets, education, custom-background, custom-menu, featured-image-header, featured-images, post-formats, threaded-comments, translation-ready, full-width-template, theme-options
Text Domain: welfare-charity
*/

:root {
    --primary-font:  'Roboto Flex', sans-serif;
    --primary-color-rgb: 0, 113, 93;
    --primary-color: #00715D;
    --secondary-color: #fdd65b;
    --secondary-color-rgb: 253, 214, 91;
}

body {
    font-family: var(--primary-font);
    font-size: 18px;
}

.home.has-slider .site-header.header-two .header-bottom,
.site-header.header-two .header-bottom {
    background: #fffdf6;
}

.site-header.header-two .header-bottom .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.site-header.header-two .right-panel {
    flex-wrap: nowrap;
}

.site-header.header-two .site-branding .site-title {
    line-height: 1.1;
}

.site-header.header-two .header-bottom .container::after {
    content: none;
}

.site-header.header-two .site-branding {
    margin: 0;
}

.site-header.header-two .site-branding.logo-text {
    display: flex;
    grid-gap: 16px;
    align-items: center;
    justify-content: center;
}

.site-header.header-two .site-branding.logo-text .site-title-wrap {
    padding-left: 0;
}

.site-header.header-two .site-branding .site-title a {
    color: #000;
}

.site-header.header-two .site-branding .site-description {
    color: #777;
}

.site-header.header-two .main-navigation a {
    color: #2b2b2b;
}

@media only screen and (max-width: 1199px) {
    .site-header.header-two .btn-donate {
        width: 184px;
    }
}

.site-header.header-two .main-navigation a:hover,
.site-header.header-two .main-navigation a:focus,
.site-header.header-two .main-navigation ul li:hover>a,
.site-header.header-two .main-navigation ul li.current-menu-item>a,
.site-header.header-two .main-navigation ul li.current_page_item>a,
.site-header.header-two .main-navigation ul li.current-menu-ancestor>a,
.site-header.header-two .main-navigation ul li.current_page_ancestor>a {
    color: var(--primary-color);
}

.site-header.header-two #mobile-header a {
    background: url(images/btn-menu-black.png) no-repeat;
}

.site-header.header-two .main-navigation ul li .btn-donate:hover,
.site-header.header-two .main-navigation ul li .btn-donate:focus {
    color: #2b2b2b;
}

a {
    color: var(--primary-color);
}

a:hover {
    color: var(--primary-color);
}

.main-navigation a:hover,
.main-navigation ul li:hover>a {
    color: var(--primary-color);
}

.site-header .btn-donate {
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
}

.site-header .btn-donate:hover {
    background: var(--primary-color);
}

.banner .text .btn-learn {
    background: var(--primary-color);
    border: 1px solid var(--primary-color);
}

.banner .text .btn-learn:hover {
    color: var(--primary-color);
}

.intro .columns-3 .text-holder .btn {
    color: var(--primary-color);

}

.our-community .header {
    background: var(--secondary-color);
}

.our-community .community-holder .hover-state .title {

    color: var(--primary-color);
}

.our-community .community-holder .hover-state .text-content {
    border-top: 1px solid var(--primary-color);

}

.donation-box .columns-4 .social-networks li a:hover {
    color: var(--primary-color);
}

.donation-box .columns-8 .tabset ul .ui-tabs-active a {
    background: var(--secondary-color);
}

.donation-box .columns-8 .tab-content .btn-continue {

    background: var(--secondary-color);

}

.donation-box .columns-8 .tab-content .btn-continue:hover {
    background: var(--secondary-color);
}

.blog-section .blog-holder .post .entry-title a:hover {
    color: var(--primary-color);
}

.blog-section .blog-holder .post .entry-meta a {
    color: var(--primary-color);
}

.blog-section .blog-holder .post .entry-meta svg {
    color: var(--primary-color);
}

.blog-section .blog-holder .post .readmore:hover {
    color: var(--primary-color);
}

#primary .post .entry-header .entry-title a:hover,
#primary .page .entry-header .entry-title a:hover {
    color: var(--primary-color);
}

#primary .post .entry-meta {
    color: var(--secondary-color);
}

#primary .post .entry-meta a {
    color: var(--primary-color);
}

#primary .post .entry-meta a:hover {
    color: var(--primary-color);
}

#primary .post .entry-footer .readmore {

    color: var(--primary-color);
}

#primary .post .entry-footer .readmore:hover {
    color: var(--primary-color);
}

.comment-list .comment-metadata a:hover {
    color: var(--primary-color);
}

.comment-list .reply a:hover {
    color: var(--primary-color);
}

.comment-form input[type="submit"]:hover {
    background: var(--secondary-color);
}

.error404 .error-holder h1 {

    color: var(--primary-color);

}

.error404 .error-holder h2 {
    color: var(--primary-color);
}

#secondary .widget ul li a:hover {
    color: var(--primary-color);
}

#secondary .widget.widget_text .text-holder .readmore:hover,
.widget.widget_benevolent_featured_post .readmore:hover {
    color: var(--primary-color);
}

.widget.widget_benevolent_recent_post .entry-header .entry-title a:hover,
.widget.widget_benevolent_popular_post .entry-header .entry-title a:hover {
    color: var(--primary-color);
}

.widget.widget_benevolent_recent_post .entry-header .entry-meta a,
.widget.widget_benevolent_popular_post .entry-header .entry-meta a {
    color: var(--secondary-color);
}

.widget.widget_benevolent_recent_post .entry-header .entry-meta a:hover,
.widget.widget_benevolent_popular_post .entry-header .entry-meta a:hover {
    color: var(--primary-color);
}

.widget.widget_tag_cloud .tagcloud a:hover {
    background: var(--primary-color);
}

.widget.widget_calendar .calendar_wrap caption {

    background: var(--primary-color);
}

.widget.widget_calendar tbody td a {

    background: var(--primary-color);

}

.site-footer .promotional-block .btn-donate:hover {
    background: var(--primary-color);

}

.site-footer .columns-4 ul li a:hover,
.site-footer .columns-6 ul li a:hover,
.site-footer .widget ul li a:hover {
    color: var(--primary-color);
}

.site-footer .footer-b .columns-4 .social-networks li a:hover {
    color: var(--primary-color);
}

.site-info a:hover {
    color: var(--primary-color);
    text-decoration: none;
}

.site-footer .widget.widget_benevolent_recent_post .entry-header .entry-title a:hover,
.site-footer .widget.widget_benevolent_recent_post .entry-header .entry-title a:focus,
.site-footer .widget.widget_benevolent_popular_post .entry-header .entry-title a:hover,
.site-footer .widget.widget_benevolent_popular_post .entry-header .entry-title a:focus {
    color: var(--primary-color);
}

@media only screen and (max-width: 1199px) {
    .mobile-header .btn-donate a {

        color: var(--primary-color);
        border: 1px solid var(--primary-color);

    }

    .mobile-header .btn-donate a:hover,
    .mobile-header .btn-donate a:focus {

        background: var(--primary-color);
    }

    .mobile-header .mobile-menu .primary-menu ul li a:hover,
    .mobile-header .mobile-menu .secondary-menu ul li a:hover,
    .mobile-header .mobile-menu .primary-menu ul li a:focus,
    .mobile-header .mobile-menu .secondary-menu ul li a:focus,
    .mobile-header .mobile-menu .primary-menu ul li:hover>a,
    .mobile-header .mobile-menu .primary-menu ul li:focus>a,
    .mobile-header .mobile-menu .secondary-menu ul li:hover>a,
    .mobile-header .mobile-menu .secondary-menu ul li:focus>a,
    .mobile-header .mobile-menu .primary-menu ul .current-menu-item>a,
    .mobile-header .mobile-menu .primary-menu ul .current-menu-ancestor>a,
    .mobile-header .mobile-menu .primary-menu ul .current_page_item>a,
    .mobile-header .mobile-menu .primary-menu ul .current_page_ancestor>a,
    .mobile-header .mobile-menu .secondary-menu ul .current-menu-item>a,
    .mobile-header .mobile-menu .secondary-menu ul .current-menu-ancestor>a,
    .mobile-header .mobile-menu .secondary-menu ul .current_page_item>a,
    .mobile-header .mobile-menu .secondary-menu ul .current_page_ancestor>a {
        color: var(--primary-color);
    }

    .mobile-menu .social-networks li a:hover,
    .mobile-menu .social-networks li a:focus {

        background: var(--primary-color);
        border-color: var(--primary-color);
    }
}

.mobile-menu .primary-menu .primary-menu-list .social-networks li a:focus {

    background: var(--primary-color);
    border-color: var(--primary-color);
}

.entry-content a:hover,
.entry-summary a:hover,
.page-content a:hover,
.comment-content a:hover,
.widget .textwidget a:hover {
    color: var(--primary-color);
}
.site-header .site-branding .site-title {
    font-size: 1.5em;
}
.header-two .logo-text .site-logo,
.mobile-header .logo-text .site-logo {
    max-width: 100%;
    width: unset;
}
@media only screen and (min-width: 767px) {
    .banner .banner-text {
        top: 45%;

    }
}
.home.has-slider .site-header.header-two .header-bottom,
.site-header.header-two .header-bottom{
    padding: 20px 0 20px;
}

.site-header.header-two .secondary-navigation ul {
    font-size: 14px;
    line-height: 24px;
    font-weight: 400;
}

.site-header.header-two .secondary-navigation ul li{
    margin-right: 0;
}

.site-header.header-two .secondary-navigation ul li a {
    color: #fff;
    padding: 0 0 12px;
}

.site-header .secondary-navigation ul li a:hover, .site-header .secondary-navigation ul li a:focus, .site-header .secondary-navigation ul li:hover > a {
    color: var(--primary-color);
    text-decoration: none;
}

.site-header.header-two .secondary-navigation ul li + li{
    padding-left: 15px;
    margin-left: 15px;
}

.site-header.header-two .secondary-navigation ul li + li > a::before {
    content: '';
    position: absolute;
    top: 5px;
    left: 0;
    height: 16px;
    width: 1px;
    background-color: #fff;
}

.mobile-header .btn-donate a,
.site-header.header-two .btn-donate {
    border: 2px solid var(--primary-color);
    height: unset;
    width: unset;
    display: flex;
    padding: 12px 52px 12px 20px;
    font-size: 16px;
    line-height: 26px;
}

.mobile-header .btn-donate a,
.site-header.header-two .btn-donate {
    border: 2px solid var(--primary-color);
    height: unset;
    width: unset;
    display: flex;
    padding: 12px 52px 12px 20px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 600;
    position: relative;
}

.mobile-header .btn-donate a::after,
.site-header.header-two .btn-donate::after {
    content: '';
    position: absolute;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12H19' stroke='%2300715D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 5L19 12L12 19' stroke='%2300715D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 24px;
    mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12H19' stroke='%2300715D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 5L19 12L12 19' stroke='%2300715D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    mask-repeat: no-repeat;
    mask-size: 24px;
    width: 24px;
    height: 24px;
    background-color: var(--primary-color);
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.2s ease;
}

.mobile-header .btn-donate:hover a::after,
.site-header.header-two .btn-donate:hover::after {
    background-color: #fff;
}

.site-header.header-two .main-navigation .social-networks li + li {
    margin-left: 44px;
}

.site-header.header-two .header-top{
    padding: 12px 0 0;
}

.site-header.header-two .header-top .social-networks {
    font-size: 15px;
}

.site-header.header-two .header-top .social-networks li{
    margin-right: 0;
}

.site-header.header-two .header-top .social-networks li + li{
    margin-left: 20px;
}

.site-header .header-top .social-networks li a {
    color: #fff;
}

.site-header .header-top .social-networks li a:hover, .site-header .header-top .social-networks li a:focus {
    color: var(--primary-color);
}

.main-navigation ul {
    margin: 11px 44px 0 0;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
}

@media only screen and (max-width: 1024px) {
    .mobile-menu .social-networks li a:hover, .mobile-menu .social-networks li a:focus {
        color: #fff !important;
    }
}


@media screen and (min-width: 37.5em) {
    .main-navigation ul li ul.sub-menu .submenu-toggle {
        top: 50%;
        transform: translateY(-50%) rotate(270deg) ;
    }

    .main-navigation ul .submenu-toggle svg path {
        fill: currentColor
    }
}


.banner #banner-slider li::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    background: linear-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
}

.banner #banner-slider li .banner-text {
    z-index: 1;
}