/* @font-face {
font-family: 'Axiforma';
font-weight: 800;
src: url('../Fonts/axiforma/Axiforma-Bold.ttf');
src: url('../Fonts/axiforma/Axiforma-Bold.woff');
} */

@font-face {
    font-family: 'Axiforma';
    font-weight: 800;
    src: url('../Fonts/axiforma/FontsFree-Net-Axiforma3woff2.ttf');
}

@font-face {
    font-family: 'Axiforma';
    font-weight: 400;
    src: url('../Fonts/axiforma/Axiforma-Regular.ttf');
}

@font-face {
    font-family: 'Axiforma';
    font-weight: 300;
    src: url('../Fonts/axiforma/Axiforma-Light.ttf');
}

@font-face {
    font-family: 'Creato Display';
    font-weight: 400;
    src: url('../Fonts/CreatoDisplay/CreatoDisplay-Regular.eot');
    src: url('../Fonts/CreatoDisplay/CreatoDisplay-Regular.ttf');
    src: url('../Fonts/CreatoDisplay/CreatoDisplay-Regular.woff');
    src: url('../Fonts/CreatoDisplay/CreatoDisplay-Regular.woff2');
}

@font-face {
    font-family: 'Creato Display';
    src: url('../Fonts/CreatoDisplay/CreatoDisplay-Light.eot');
    src: url('../Fonts/CreatoDisplay/CreatoDisplay-Light.eot?#iefix') format('embedded-opentype'), url('../Fonts/CreatoDisplay/CreatoDisplay-Light.woff2') format('woff2'), url('../Fonts/CreatoDisplay/CreatoDisplay-Light.woff') format('woff'), url('../Fonts/CreatoDisplay/CreatoDisplay-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Creato Display';
    src: url('../Fonts/CreatoDisplay/CreatoDisplay-Regular.eot');
    src: url('../Fonts/CreatoDisplay/CreatoDisplay-Regular.eot?#iefix') format('embedded-opentype'), url('../Fonts/CreatoDisplay/CreatoDisplay-Regular.woff2') format('woff2'), url('../Fonts/CreatoDisplay/CreatoDisplay-Regular.woff') format('woff'), url('../Fonts/CreatoDisplay/CreatoDisplay-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Creato Display';
    src: url('../Fonts/CreatoDisplay/CreatoDisplay-Bold.eot');
    src: url('../Fonts/CreatoDisplay/CreatoDisplay-Bold.eot?#iefix') format('embedded-opentype'), url('../Fonts/CreatoDisplay/CreatoDisplay-Bold.woff2') format('woff2'), url('../Fonts/CreatoDisplay/CreatoDisplay-Bold.woff') format('woff'), url('../Fonts/CreatoDisplay/CreatoDisplay-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/*---------------------------------
# start common css 
---------------------------------*/

body {
    overflow-x: hidden !important;
}

body.index-2 {
    position: relative;
}

* {
    box-sizing: border-box;
}

.main-wrapper {
    overflow: hidden !important;
}

.creato-fonts {
    font-family: 'Creato Display';
}

.container {
    max-width: 1420px;
}

ul {
    margin: 0;
    padding-left: 0;
    list-style-type: none;
}

img {
    width: 100%;
    display: block;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Axiforma';
    margin: 0;
    line-height: normal;
    font-weight: 800 !important;
    color: #000000;
}

a,
a:hover {
    text-decoration: none;
    line-height: normal;
    color: #526f67;
}

h2.title {
    font-size: 60px;
}

input:focus {
    outline: 0;
}

p {
    font-size: 16px;
    color: #7F7F7F;
    line-height: 26px;
    margin: 0;
    font-weight: 400;
    font-family: 'Creato Display';
}

.half-width-p {
    max-width: 700px;
}

.btn {
    font-size: 16px;
    font-family: 'Axiforma';
    font-weight: 400;
    border-radius: 0;
    padding: 10px 30px;
    border-radius: 30px;
    line-height: normal;
    display: flex;
    width: fit-content;
    align-items: center;
}

.big-btn {
    font-size: 20px;
    padding: 13px 32px;
}

.btn:focus {
    outline: none;
    box-shadow: none;
}

.btn-primary {
    background-color: #CFFF8D;
    color: #000;
    border: 1px solid #CFFF8D;
}

.btn-primary:hover {
    background-color: #425F57;
    color: #fff !important;
    border: 1px solid #425F57;
    line-height: normal;
}

.btn-primary:active,
.btn-primary:focus {
    background-color: transparent;
    border-color: #CFFF8D;
    color: #000;
}

.btn-outline-primary:active:focus,
.btn-outline-primary:active {
    box-shadow: none;
    background-color: transparent;
}

.btn-primary:active:focus {
    box-shadow: none;
}

h2.wc-sub-title {
    font-size: 50px;
    line-height: 60px;
    margin-bottom: 15px;
}

.spacing-margin {
    margin-bottom: 60px;
}

.social-info {
    display: flex;
    gap: 15px;
}

.social-info a {
    width: 34px;
    height: 34px;
    background-color: #425F57;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
}

.social-info a:hover {
    background-color: #CFFF8D;
}

.social-info a:hover svg path {
    fill: #000;
}

/*---------------------------------
# End common css 
---------------------------------*/





/* <!-- <============ Header_menu ===============> --> */

body.transperent header#header {
    position: fixed;
}
.screen-loader{
    background-color: #425f57;
    padding: 485px 0;
    position: relative;
    display: none;
}

.screen-loader .loader-logo{
    max-width: 300px;
    width: 100%;
    margin: 0 auto;
}
.screen-loader .loader-hero-left{
    position: absolute;
    left: 0;
    top: 0;
}
.screen-loader .loader-hero-right{
    position: absolute;
    right: 0;
    bottom: 0;
}

header#header.header-three {
    height: auto;
    padding-bottom: 15px;
}

#header .transperent {
    background: transparent;
}

#header .logo img {
    max-height: 70px;
    width: auto;
}

#header .container {
    max-width: 1420px;
}

#header {
    height: 100px;
    position: sticky;
    left: 0;
    top: 0;
    right: 0;
    z-index: 997;
    background-color: transparent;
    transition: all .4s;
}

#header.header-scrolled,
#header.header-inner {
    height: 85px;
    box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px;
    top: 0;
    background-color: #fff;
}

body.transperent #header.header-scrolled,
body.transperent #header.header-inner {
    background-color: #425f57ed;
}

.page {
    z-index: 2;
    position: relative;
    background-color: white;
}

/*--------------------------------------------------------------
# Dekstop-navigationbar
--------------------------------------------------------------*/

.navbar {
    padding: 0;
    justify-content: space-between;
    position: relative;
    align-items: center;
}

.navbar ul {
    margin: 0;
    padding: 0;
    display: flex;
    list-style: none;
    align-items: center;
    padding-right: 20px;
}

.navbar li {
    position: relative;
    margin-right: 35px;
}

.navbar a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0;
    font-size: 16px;
    font-weight: 400;
    color: #000;
    white-space: nowrap;
    transition: 0.3s;
    text-decoration: none;
    font-family: 'Creato Display';
}

.navbar a i {
    font-size: 14px;
    line-height: normal;
    font-weight: 600;
    font-family: 'Font Awesome 5 Pro';
    margin-left: 6px;
}

.transperent header#header .navbar a {
    color: #DFFFFF;
    font-weight: 300;
}

.transperent header#header .navbar a:hover {
    color: #CFFF8D;
}

.navbar a:hover,
.navbar .active,
.navbar .active:focus,
.navbar li:hover>a {
    color: #CFFF8D;
}

.navbar .wc-btn .btn {
    padding: 10px 30px 6px;
    font-family: 'Axiforma';
    font-weight: 400 !important;
}

.navbar .wc-btn .btn-primary {
    color: #000 !important;
}

.transperent .navbar .wc-btn .btn-primary:hover {
    color: #fff !important;
    border: 2px solid #CFFF8D;
}

.navbar .wc-btn .btn-primary:hover {
    color: #000 !important;
    border: 2px solid #000000;
    background-color: transparent !important;
}

.navbar .wc-btn .btn-primary:active,
.navbar .wc-btn .btn-primary:focus {
    background-color: transparent;
    border-color: #000000;
}

.navbar ul li a:hover {
    color: #006662;
    transition: all .4s;
}

@media (max-width:1199px) {

    .navbar a,
    .navbar a:focus {
        font-size: 13px;
    }
}

/*<------- dropdown ------> */
.navbar .dropdown ul {
    display: block;
    position: absolute;
    left: 0;
    top: calc(100% + 15px);
    margin: 0;
    padding: 10px 0;
    z-index: 99;
    opacity: 0;
    visibility: hidden;
    background: #ffffff;
    box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
    transition: 0.3s;
    border-radius: 9px;
    min-width: 160px;
}

.navbar .dropdown ul a {
    padding: 0;
    font-size: 14px;
    color: #153243 !important;
    font-family: 'Axiforma';
    font-weight: 500 !IMPORTANT;
    position: relative;
    display: inline-block;
}

.navbar .dropdown ul li:hover a {
    color: #d4a899 !important;
}

.navbar .dropdown .dropdown ul {
    top: 0;
    left: calc(100% - 30px);
    visibility: hidden;
}

.navbar .dropdown .dropdown:hover>ul {
    opacity: 1;
    top: 0;
    left: 100%;
    visibility: visible;
}

.navbar .dropdown:hover>ul {
    opacity: 1;
    visibility: visible;
}

.navbar ul li.dropdown svg {
    font-size: 13px;
    margin-left: 5px;
}

.navbar ul li.dropdown:hover a svg {
    transform: rotate(180deg);
    transition: all .9s;
}

.navbar li.dropdown ul li {
    margin-right: 0;
    padding: 8px 20px;
    border-left: 3px solid white;
}

.navbar li.dropdown ul li:hover {
    background: #cfff8d;
    border-left: 3px solid #425F57;
}

.navbar li.dropdown ul li:hover a {
    color: #000 !important;
}

/*======= # Mobile-navigationbar ====== */

.mobile-nav-toggle {
    color: #557571;
    font-size: 28px;
    cursor: pointer;
    display: none;
    transition: 0.5s;
}

.mobile-nav-toggle i {
    font-weight: 300;
    font-family: 'Font Awesome 5 Pro';
    color: #fff;
}

i.fa.fa-bars:focus {
    color: #557571;
    box-shadow: none !important;
}

@media (max-width: 991px) {
    .mobile-nav-toggle {
        display: block;
        margin: 0 0 0 auto;
    }

    .navbar-mobile ul {
        display: block !important;
    }

    .navbar ul {
        display: none;
    }
}

.transperent .navbar-mobile a {
    color: black;
}

.navbar-mobile a:hover,
.navbar-mobile .active,
.navbar-mobile li:hover>a {
    color: #003366;
}

.logo.no-caret-5 {
    display: none;
}

.no-caret-2 {
    display: none;
}

.navbar .menu-svg-2 {
    display: none;
}

/* <====== Start-hero-section =====> */

.hero-section {
    position: relative;
}

.wc-one-page-hero {
    width: 100%;
    background: #425F57;
    padding: 220px 0 50px;
    height: 1080px;
}

#hero .wc-hero {
    text-align: center;
    padding-bottom: 80px;
}

.hero-section h1 {
    font-size: 60px;
    padding-bottom: 40px;
    color: #DFFFFF;
}

.hero-section .wc-btn {
    display: flex;
}

.hero-section.wc-one-page-hero .wc-btn {
    justify-content: center;
}

.hero-section .wc-btn .btn {
    padding: 10px 25px 6px;
    margin-right: 30px;
}

.hero-section .wc-btn .btn-primary {
    color: #000;
    border: 1px solid #cfff8d;
}

.hero-section .wc-btn .btn-outline-primary {
    border: 1px solid #CFFF8D;
    color: #FFFFFF;
}

.hero-section .wc-btn .btn-outline-primary:hover {
    border: 1px solid #CFFF8D;
    background-color: #CFFF8D;
    color: #000;
}

.hero-section .wc-btn .btn-primary:active,
.hero-section .wc-btn .btn-primary:focus {
    color: #fff;
}

.hero-section .hero-main {
    position: absolute;
    display: block;
    top: 50px;
    left: -7%;
    pointer-events: none;
}

.Hero_svg_ {
    width: 500px;
    height: 500px;
}

.Hero_svg_ path {
    -webkit-animation: Hero_scale__-l05L 3s infinite;
    animation: Hero_scale__-l05L 3s infinite;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-transform-origin: center;
    transform-origin: center;
}

.Hero_svg_ path#Extended_image\ wrap_1 {
    -webkit-animation-delay: calc(.25s * 1);
    animation-delay: calc(.25s * 1);
}

.Hero_svg_ path#Extended_image\ wrap_2 {
    -webkit-animation-delay: calc(.25s * 2);
    animation-delay: calc(.25s * 2);
}

.Hero_svg_ path#Extended_image\ wrap_3 {
    -webkit-animation-delay: calc(.25s * 3);
    animation-delay: calc(.25s * 3);
}

.Hero_svg_ path#Extended_image\ wrap_4 {
    -webkit-animation-delay: calc(.25s * 4);
    animation-delay: calc(.25s * 4);
}

.Hero_svg_ path#Extended_image\ wrap_5 {
    -webkit-animation-delay: calc(.25s * 5);
    animation-delay: calc(.25s * 5);
}

.Hero_svg_ path#Extended_image\ wrap_6 {
    -webkit-animation-delay: calc(.25s * 6);
    animation-delay: calc(.25s * 6);
}

.Hero_svg_ path#Extended_image\ wrap_7 {
    -webkit-animation-delay: calc(.25s * 7);
    animation-delay: calc(.25s * 7);
}

.Hero_svg_ path#Extended_image\ wrap_8 {
    -webkit-animation-delay: calc(.25s * 8);
    animation-delay: calc(.25s * 8);
}

.Hero_svg_ path#Extended_image\ wrap_9 {
    -webkit-animation-delay: calc(.25s * 9);
    animation-delay: calc(.25s * 9);
}

.Hero_svg_ path#Extended_image\ wrap_10 {
    -webkit-animation-delay: calc(.25s * 10);
    animation-delay: calc(.25s * 10);
}

@-webkit-keyframes Hero_scale__-l05L {
    0% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    50% {
        opacity: .2;
        -webkit-transform: scale(.7);
        transform: scale(.7)
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

button.lets-play {
    background: none;
    border: none;
}

#video-wrap:not(.active) {
    opacity: 0;
    visibility: hidden;
}

#video-wrap .video-overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

#video-wrap .video-container {
    width: 95%;
    transition: all 0.3s ease-in-out;
    transform: scale(0.9);
}

#video-wrap .close-video {
    background-color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 15%;
    top: 5%;
    width: 35px;
    height: 35px;
    border-radius: 100%;
    border: solid 2px #000;
    padding: 0;
    transition: all 0.3s ease-in-out;
    z-index: 150;
}

#video-wrap .close-video:before,
#video-wrap .close-video:after {
    content: "";
    width: 54%;
    height: 2px;
    background-color: #000;
    position: absolute;
    transition: all 0.3s ease-in-out;
}

#video-wrap .close-video:before {
    transform: rotate(42deg);
}

#video-wrap .close-video:after {
    transform: rotate(-42deg);
}

#video-wrap .close-video:focus {
    outline: none;
}

#video-wrap .close-video:hover {
    background-color: #cfff8d;
}

#video-wrap .close-video:hover:before,
#video-wrap .close-video:hover:after {
    background-color: #000;
}

#video-wrap video,
#video-wrap iframe {
    position: relative;
    z-index: 10;
    border-radius: 12px;
    box-shadow: 0 0 19px rgba(0, 0, 0, 0.16);
    width: 100%;
    height: 100vh;
    max-height: 85vh;
    background-color: #000;
}

#video-wrap video {
    object-fit: cover;
}

#video-wrap.active {
    opacity: 1;
    visibility: visible;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    padding: 12px;
    height: 100vh;
    display: flex;
    transition: all 0.3s ease-in-out;
    z-index: 9991;
    align-items: center;
    justify-content: center;
}

#video-wrap.active .video-container {
    transform: scale(1);
}

.hero-section .wc-img {
    position: relative;
    text-align: center;
    z-index: 1;
}

.mouse-scroll {
    color: #000;
    font-size: 25px;
    display: inline-block;
    position: absolute;
}

#hero .wc-img .mouse-scroll {
    left: 47%;
    bottom: -50px;
}

.mouse-scroll .mouse {
    background: #CFFF8D;
    width: 98px;
    height: 98px;
    border-radius: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.mouse-scroll .mouse svg {
    animation: zoom-in-zoom-out 2s ease-out infinite;
}

@keyframes zoom-in-zoom-out {
    0% {
        transform: scale(1, 1);
    }

    50% {
        transform: scale(1.5, 1.5);
    }

    100% {
        transform: scale(1, 1);
    }
}

.mouse-scroll .mouse:hover svg {
    color: #425F57;
}

@media (max-width: 1659px) and (min-width: 1330px) {
    #video-wrap .video-container {
        max-width: 978px;
    }
}

@media (min-width: 1660px) {
    #video-wrap .video-container {
        max-width: 1130px;
    }
}

/* <====== End-hero-section =====> */
/* <====== Start-about-us-section =====> */

.about-us {
    padding: 163px 0 239px;
    margin-bottom: 120px;
    position: relative;
}

.about-us .container {
    max-width: 1080px;
}

.about-us h2.title {
    font-size: 30px;
    line-height: 40px;
    padding-bottom: 66px;
    text-align: center;
    margin-top: 70px;
}

.about-us .about-content p {
    padding-bottom: 15px;
    max-width: 86.5%;
}

.about-us .about-btn {
    padding-top: 44px;
}

.about-us .about-btn .btn {
    padding: 10px 41px 6px;
}

.about-us .about-btn .btn.btn-primary:active,
.about-us .about-btn .btn.btn-primary:focus {
    border-color: #425F57;
    background-color: #425F57;
}

.about-svg2 {
    position: absolute;
    display: block;
    top: 52%;
    right: 18%;
}

.about-svg {
    width: 377px;
    height: 377px;
}

.about-svg path {
    -webkit-animation: Hero_scale__-l05L 3s infinite;
    animation: Hero_scale__-l05L 3s infinite;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-transform-origin: center;
    transform-origin: center;
}

.about-svg path#Extended_image\ wrap_1 {
    -webkit-animation-delay: calc(.25s * 1);
    animation-delay: calc(.25s * 1);
}

.about-svg path#Extended_image\ wrap_2 {
    -webkit-animation-delay: calc(.25s * 2);
    animation-delay: calc(.25s * 2);
}

.about-svg path#Extended_image\ wrap_3 {
    -webkit-animation-delay: calc(.25s * 3);
    animation-delay: calc(.25s * 3);
}

.about-svg path#Extended_image\ wrap_4 {
    -webkit-animation-delay: calc(.25s * 4);
    animation-delay: calc(.25s * 4);
}

.about-svg path#Extended_image\ wrap_5 {
    -webkit-animation-delay: calc(.25s * 5);
    animation-delay: calc(.25s * 5);
}

.about-svg path#Extended_image\ wrap_6 {
    -webkit-animation-delay: calc(.25s * 6);
    animation-delay: calc(.25s * 6);
}

.about-svg path#Extended_image\ wrap_7 {
    -webkit-animation-delay: calc(.25s * 7);
    animation-delay: calc(.25s * 7);
}

.about-svg path#Extended_image\ wrap_8 {
    -webkit-animation-delay: calc(.25s * 8);
    animation-delay: calc(.25s * 8);
}

.about-svg path#Extended_image\ wrap_9 {
    -webkit-animation-delay: calc(.25s * 9);
    animation-delay: calc(.25s * 9);
}

.about-svg path#Extended_image\ wrap_10 {
    -webkit-animation-delay: calc(.25s * 10);
    animation-delay: calc(.25s * 10);
}

@-webkit-keyframes Hero_scale__-l05L {
    0% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    50% {
        opacity: .2;
        -webkit-transform: scale(.7);
        transform: scale(.7)
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

/* <====== End-about-us-section =====> */
/* <====== Start-wc-help-section =====> */

.wc-help {
    padding-bottom: 136px;
}

.wc-help .wc-help-title {
    text-align: center;
    padding-bottom: 46px;
}

.wc-help .wc-help-title h2 {
    font-size: 60px;
}

.wc-help .wc-help-title p {
    max-width: 46%;
    margin: auto;
}

.wc-help .wc-help-img {
    position: relative;
}

.wc-story {
    position: absolute;
    display: block;
    right: 0px;
    bottom: 0px;
}

.wc-story p {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 24px;
    color: #000;
    font-weight: 800;
    font-family: 'Axiforma';
    line-height: 34px;
    z-index: 2;
}

.wc-story p::before {
    content: '';
    display: block;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    width: 210px;
    height: 200px;
    background-image: url(../images/star.png);
    z-index: -1;
    animation: rotation 20s linear infinite;
}

.wc-story.story-2 {
    left: -70%;
}

@keyframes rotation {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(300deg);
    }
}

.wc-help .wc-help-img img {
    margin: auto;
}

.wc-help .wc-help-content p {
    max-width: 79%;
    padding-bottom: 15px;
}

.wc-help .wc-help-content span,
.donate-section .donate-text p span {
    color: #425F57;
    font-weight: 700;
}

.wc-help .wc-help-content {
    padding-top: 36px;
    margin-left: 30px;
}

.wc-help .help-event {
    padding-bottom: 120px;
}

/* <====== End-wc-help-section =====> */
/*  <!======Start-sponser-section=====> */

.wc-sponser {
    padding-bottom: 130px;
}

.wc-sponser .sponser-title {
    text-align: center;
    padding-bottom: 80px;
}

.wc-sponser .sponser-title h2 {
    font-size: 60px;
}

.wc-sponser .sponser-title p {
    max-width: 50%;
    margin: auto;
}

.wc-sponser .sponser-img {
    display: flex;
    flex-wrap: wrap;
    grid-row-gap: 67px;
    grid-column-gap: 102px;
    max-width: 1220px;
    margin: auto;
}

.wc-sponser .sponser-img img {
    opacity: 0.3;
    filter: invert(110%) sepia(70%) saturate(7%) hue-rotate(339deg) brightness(60%) contrast(49%);
}

.wc-sponser .sponser-img img:hover {
    filter: none;
    opacity: unset;
}

/*  <!======End-sponser-section=======>  */
/* <!-- <=== Start-latest-section ===> --> */

.wc-latest {
    background-color: #FFF8F8;
    padding: 80px 0;
    margin-bottom: 120px;
}

.wc-latest .container {
    max-width: 1440px;
}

.wc-latest .latest-title {
    padding-bottom: 70px;
}

.wc-latest .latest-title h2 {
    font-size: 50px;
}

.wc-latest .latest-title p {
    max-width: 52%;
}

.wc-latest .latest-image-content img {
    padding-bottom: 38px;
    padding-top: 8px;
}

.wc-latest .latest-image-content h2 {
    font-size: 20px;
    max-width: 90%;
}

.wc-latest .latest-image-content h2 a,
.wc-latest .single-cause-item h2 a {
    color: #000;
}

.wc-latest .latest-image-content h2 a:hover {
    color: #557571;
}

.wc-latest .latest-image-content p.date {
    color: #425F57;
    padding-bottom: 10px;
}

.wc-latest .single-cause-item {
    border-left: 1px solid rgba(0, 0, 0, 0.3);
    padding-left: 60px;
    margin-left: 60px;
    padding-top: 40px;
}

.wc-latest .single-cause-item .cause-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 16px;
}

.wc-latest .single-cause-item .cause-content {
    max-width: 486px;
    padding-bottom: 50px;
}

.wc-latest .single-cause-item .cause-content:last-child {
    padding-bottom: 7px;
}

.wc-latest .single-cause-item h2 {
    font-size: 20px;
}

.wc-latest .single-cause-item .cause-meta p {
    color: #425F57;
}

.wc-latest .single-cause-item .cause-meta svg {
    font-size: 20px;
}

.wc-latest .single-cause-item .cause-content:hover a {
    color: #425F57;
}

.wc-latest .single-cause-item .cause-content .cause-meta svg {
    color: #000;
    animation: slide1 1s ease-in-out infinite;
    margin-left: 9px;
}

.wc-latest .single-cause-item .cause-content .cause-meta a:hover svg {
    color: #425F57;
}

@keyframes slide1 {

    0%,
    100% {
        transform: translate(0, 0);
    }

    50% {
        transform: translate(10px, 0);
    }
}

/* <!-- <!=== End-latest-section =====> --> */
/* <!-- <!=== start-chariti-page-wrapper-section =====> --> */

.wc-chariti {
    padding-bottom: 140px;
}

.wc-chariti .charities-img {
    position: relative;
    display: block;
    overflow: hidden;
}

.wc-chariti .project-img {
    display: flex;
    flex-wrap: wrap;
}

.wc-chariti .charities-img::before {
    position: absolute;
    content: '';
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: 0px;
    background-color: #4b655e78;
    visibility: hidden;
    opacity: 0;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: perspective(370px) rotateY(90deg) translate(0px, 50px);
    transform: perspective(370px) rotateY(90deg) translate(0px, 50px);
    transition: all 900ms ease;
    -moz-transition: all 900ms ease;
    -webkit-transition: all 900ms ease;
    -ms-transition: all 900ms ease;
    -o-transition: all 900ms ease;
    z-index: 1;
}

.wc-chariti .charities-img:hover::before {
    visibility: visible;
    opacity: 1;
    -webkit-transform: perspective(370px) rotateY(0deg) translate(0px, 0px);
    transform: perspective(370px) rotateY(0deg) translate(0px, 0px);
    height: 100%;
}

.wc-chariti .charities-img img {
    width: 100%;
    transition: transform 500ms ease, opacity 500ms ease, -webkit-transform 500ms ease;
    transform: scale(1.01);
}

.wc-chariti .charities-img:hover img {
    transform: scale(1.05);
}

.wc-chariti .charities-img .icon {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    -webkit-transform: translateY(50px);
    -ms-transform: translateY(50px);
    transform: translateY(50px);
    z-index: 2;
}

.wc-chariti .charities-img:hover .icon {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
    transition: all 500ms ease 500ms;
    -webkit-transition: all 500ms ease 500ms;
    -ms-transition: all 500ms ease 500ms;
    -o-transition: all 500ms ease 500ms;
}

.wc-chariti .charities-img .icon a {
    color: #ffffff;
    font-size: 40px;
    -webkit-transition: all 500ms ease;
    transition: all 500ms ease;
}

.wc-chariti .charities-img:hover .icon a {
    opacity: 1;
    transform: scale(1);
}

/* <!-- <!=== End-chariti-page-wrapper-section =====> --> */
/*<========= our-latest-news-section =====>*/

.our-latest-news-section {
    padding-bottom: 120px;
}

.latest-news-slider {
    position: relative;
    background: #425F57;
    border-radius: 197px;
    max-width: 932px;
    margin: auto;
    padding: 97px 0 50px;
}

.latest-news-slider:before {
    content: "";
    display: block;
    position: absolute;
    left: 45%;
    top: -35px;
    background-image: url(../images/quetation.png);
    background-repeat: no-repeat;
    width: 100px;
    height: 66px;
}

.latest-news-box {
    position: relative;
}

.latest-news-content {
    text-align: center;
    padding-bottom: 50px;
}

.latest-news-content p {
    font-size: 18px;
    line-height: 28px;
    color: #DFFFFFCC;
    max-width: 67%;
    margin: auto;
    text-align: center;
    padding-bottom: 26px;
}

.latest-news-content h3 {
    font-size: 18px;
    color: #DFFFFFCC;
    text-decoration: underline;
    font-family: 'Axiforma';
}

.slider-arrow {
    display: flex;
    justify-content: center;
    grid-gap: 12px;
}

.latest-news-slider .slider-arrow svg {
    color: #425F57;
    font-size: 19px;
}

.slider-arrow .swiper-button-prev,
.slider-arrow .swiper-button-next {
    background-color: #CFFF8D;
    width: 32px;
    height: 32px;
    border-radius: 50px;
    border: 1px solid #CFFF8D;
}

.slider-arrow.dark .swiper-button-prev,
.slider-arrow.dark .swiper-button-next {
    background-color: #425F57;
    color: #fff;
    border-color: #425F57;
}

.slider-arrow .swiper-button-prev:hover,
.slider-arrow .swiper-button-next:hover {
    background-color: transparent;
    color: #CFFF8D;
}

.slider-arrow.dark .swiper-button-prev:hover,
.slider-arrow.dark .swiper-button-next:hover {
    color: #425F57;
}

.slider-arrow .swiper-button-prev:hover svg,
.slider-arrow .swiper-button-next:hover svg {
    color: #CFFF8D;
}

.slider-arrow.dark .swiper-button-prev:hover svg,
.slider-arrow.dark .swiper-button-next:hover svg {
    color: #425F57;
}

.our-latest-news-section.blog-section .swiper-button-lock {
    display: block;
}

.swiper-button-next:after,
.swiper-button-prev:after {
    content: '';
}

.swiper-button-prev,
.swiper-button-next {
    position: unset;
    width: auto;
    height: auto;
    margin: 0;
    top: 0;
}

/*<========= End-our-latest-news-section ======>*/
/*<========= start-timeline-section ======>*/

.wc-timeline {
    background-color: #425F57;
    padding: 80px 0;
    margin-bottom: 120px;
}

.wc-timeline .timeline-title {
    padding-bottom: 70px;
}

.wc-timeline .timeline-title h2 {
    font-size: 50px;
    padding-bottom: 10px;
    color: #DFFFFF;
}

.wc-timeline .timeline-title p,
.upcoming-events .events-title p {
    color: #DFFFFFCC;
    max-width: 51%;
}

.main-timeline {
    overflow: hidden;
    position: relative
}

.main-timeline:before {
    position: absolute;
    top: 9%;
    left: 31%;
    width: 100%;
    height: 100%;
    content: '';
    background: url(../images/donatin-line.png);
    display: block;
    background-repeat: no-repeat;
}

.main-timeline .timeline {
    width: 50%;
    float: left;
    position: relative;
    z-index: 1
}

.main-timeline .timeline:after,
.main-timeline .timeline:before {
    display: none;
}

.main-timeline .timeline-content {
    width: 534px;
    background: #526F67;
    float: left;
    padding: 30px;
    display: flex;
    align-items: center;
}

.main-timeline .content-inner {
    position: relative
}

.main-timeline .content-inner:after {
    border-top: none;
    border-bottom: 10px solid transparent;
    top: auto;
    bottom: -10px
}

.main-timeline .title {
    font-size: 18px;
    color: #DFFFFF;
    padding-bottom: 20px;
}

.main-timeline .timeline-content img {
    padding-right: 27px;
}

.main-timeline .content-inner .btn {
    padding: 6px 32px 3px;
}

.main-timeline .content-inner .btn.btn-primary:active,
.main-timeline .content-inner .btn.btn-primary:focus {
    color: #fff;
}

.main-timeline .timeline:nth-child(2n):after {
    width: 2px;
    height: 42%;
    left: -109%;
}

.main-timeline .timeline:nth-child(2n) .timeline-content:after,
.main-timeline .timeline:nth-child(2n) .timeline-content:before {
    left: auto;
    right: 30%;
    margin-right: -25px;
}

.main-timeline .timeline:nth-child(2n) .timeline-content:after {
    right: 30%;
    margin-right: -25px
}

.main-timeline .timeline:nth-child(2n) .content-inner {
    padding-top: 15px;
}

.main-timeline .timeline:nth-child(2n) .content-inner:after {
    border-top: none;
    border-bottom: 10px solid transparent
}

.main-timeline .timeline:nth-child(2) {
    margin-top: 200px;
    float: right;
    width: 26%;
}

.main-timeline .timeline:nth-child(2) .timeline-content {
    width: 352px;
    display: block;
}

.main-timeline .timeline:nth-child(3n) {
    margin-top: 239px;
}

.main-timeline .timeline:nth-child(3n):after {
    height: 205%;
    right: 0;
}

.main-timeline .timeline:nth-child(4n) {
    margin-top: 195px;
    float: right;
    width: auto;
}

.main-timeline .timeline:nth-child(4n):before {
    width: 38%;
    top: 53%;
}

.main-timeline .timeline:nth-child(4n):after {
    display: none;
}

.main-timeline .timeline:first-child,
.main-timeline .timeline:last-child:nth-child(even) {
    margin-left: 120px;
}

.main-timeline .timeline:nth-child(5n) {
    margin-top: 155px;
    margin-left: 100px;
}

.main-timeline .timeline:nth-child(5n) .timeline-content {
    max-width: 352px;
    display: block;
}

.main-timeline .timeline:nth-child(5n) .content-inner {
    padding-top: 15px;
}

.main-timeline .timeline:nth-child(5n):after {
    display: none;
}

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

    .main-timeline .timeline,
    .main-timeline .timeline:nth-child(2) {
        width: 100%;
        margin: 15px 0 !important
    }

    .main-timeline .timeline:nth-child(2) .timeline-content,
    .main-timeline .timeline:nth-child(5n) .timeline-content {
        display: flex;
    }

    .main-timeline .timeline:nth-child(5n) .timeline-content {
        max-width: unset;
    }

    .main-timeline .timeline .timeline-content:after,
    .main-timeline .timeline .timeline-content:before,
    .main-timeline .timeline:after,
    .main-timeline .timeline:before {
        display: none
    }

    .main-timeline .timeline-content,
    .main-timeline .timeline:nth-child(2n) .timeline-content {
        width: 100%;
        float: none;
        padding: 15px;
        margin: 0
    }

    .main-timeline .timeline-content img {
        padding-right: 18px;
    }

    .main-timeline .title {
        font-weight: 400 !important;
        font-size: 14px;
        padding-bottom: 15px;
    }
}

/*<========= End-timeline-section ======>*/
/*<========= start-contact-section ======>*/

.wc-contact {
    background-color: #FFF8F8;
    padding: 83px 0;
    max-width: 1420px;
    margin: auto auto;
}

.wc-contactus {
    padding-bottom: 120px;
}

.wc-contact .contact-title {
    text-align: center;
    padding-bottom: 50px;
}

.wc-contact .contact-title h2 {
    font-size: 50px;
    padding-bottom: 10px;
}

.wc-contact .contact-title p {
    max-width: 33%;
    margin: auto;
}

.contact-form {
    max-width: 836px;
    margin: 0 auto;
}

.contact-form .nema-and-number,
.contact-form .email-and-submit {
    display: flex;
    grid-gap: 22px;
    margin-bottom: 24px;
}

.contact-form .form-control {
    min-height: 50px;
    border-radius: 50px;
    background-image: none;
    font-size: 16px;
    color: #7F7F7F;
    font-family: 'Creato Display';
    background-color: transparent;
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.5);
    padding: 10px 31px;
}

.form-control:focus {
    background-color: transparent;
    box-shadow: none;
    border: 1px solid #000;
}

.contact-form textarea.form-control {
    min-height: 142px;
    border-radius: 39px;
    margin-bottom: 25px;
}

.contact-form .contact-form-button {
    text-align: center;
}

.contact-form .contact-form-button .btn {
    font-size: 22px;
    padding: 13px 77px 10px;
}

.contact-form .contact-form-button .btn.btn-primary:active,
.contact-form .contact-form-button .btn.btn-primary:focus {
    border-color: #425f57;
    background: #425f57;
    color: #fff;
}

/*<========= End-contact-section ======>*/
/*<========= start-portfolio-section ======>*/

.portfolio-page {
    margin-bottom: 0 !important;
}

.wc-portfolio {
    padding: 70px 0 120px;
}

.wc-portfolio .portfolio-title {
    padding-bottom: 60px;
}

.wc-portfolio .portfolio-title h2 {
    font-size: 60px;
}

.wc-portfolio .portfolio-title p {
    max-width: 44%;
}

.wc-portfolio .portfolio-grid {
    display: flex;
    flex-wrap: wrap;
    grid-column-gap: 25px;
    grid-row-gap: 25px;
    margin-bottom: 80px;
}

.wc-portfolio .portfolio-grid .portfolio-content {
    transition: 0.3s;
    position: relative;
    overflow: hidden;
    z-index: 1;
    background: rgba(255, 255, 255, 0.6);
}

.wc-portfolio .portfolio-grid .portfolio-content:before {
    content: "";
    background: #0000008C;
    position: absolute;
    transition: all ease-in-out 0.3s;
    z-index: 2;
    opacity: 0;
    cursor: pointer;
}

.wc-portfolio .portfolio-grid .portfolio-content:hover::before {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 1;
}

.wc-portfolio .portfolio-grid .portfolio-content .potfolio-img {
    display: block;
    margin: auto;
    width: 100%;
}

.wc-portfolio .portfolio-info {
    opacity: 0;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 3;
    transition: all ease-in-out 0.3s;
    padding: 0 40px 40px;
}

.wc-portfolio .portfolio-grid .portfolio-content:hover .portfolio-info {
    opacity: 1;
}

.wc-portfolio .portfolio-info h2 {
    font-size: 30px;
}

.wc-portfolio .portfolio-info h2 a {
    color: #fff;
}

.wc-portfolio .portfolio-info h2 a:hover {
    color: #CFFF8D;
}

.wc-portfolio .wc-btn {
    text-align: center;
}

.wc-portfolio .wc-btn .btn {
    font-size: 22px;
    padding: 20px 45px 18px;
    border-radius: 50px;
    margin: 0 auto;
}

.wc-portfolio .wc-btn .btn.btn-primary:active,
.wc-portfolio .wc-btn .btn.btn-primary:focus,
.wc-news .wc-btn .btn.btn-primary:active,
.wc-news .wc-btn .btn.btn-primary:focus {
    background-color: #425f57;
    border-color: #425f57;
    color: #fff;
}

/*<========= End-portfolio-section ======>*/
/*<========= Start-donation-section ======>*/

.wc-donation {
    padding: 100px 0 120px;
}

.wc-donation .wc-donation-content {
    display: flex;
    padding-bottom: 10px;
    justify-content: space-between;
}

.wc-donation .wc-donation-content .donation-content-p p {
    padding-bottom: 15px;
    max-width: 93%;
}

.wc-donation .wc-donation-content .donation-content-p {
    max-width: 889px;
}

.wc-donation .wc-donation-content .donation-child-img {
    max-width: 484px;
    width: 100%;
}

.wc-donation .main-donation-wrapper h2 {
    font-size: 20px;
    font-family: 'Creato Display';
    line-height: 30px;
    max-width: 78%;
    padding-bottom: 26px;
}

.wc-donation .main-donation-wrapper p {
    max-width: 95%;
    padding-bottom: 15px;
}

.wc-donation .donation-inner-box {
    background-color: #526F67;
    padding: 80px;
    margin-bottom: 40px;
}

.wc-donation .donation-inner-box h2 {
    font-size: 24px;
    color: #DFFFFF;
    padding-bottom: 30px;
}

.wc-donation .donation-inner {
    display: flex;
    justify-content: space-between;
    padding-bottom: 26px;
}

.wc-donation .donation-st-inner {
    padding-left: 45px;
    padding-top: 33px;
}

.wc-donation .donation-st-inner p {
    color: #fff;
    max-width: 74%;
    padding-bottom: 36px;
}

.wc-donation .donation-st-inner h3 {
    font-size: 16px;
    color: #fff;
    padding-bottom: 10px;
}

.wc-donation .donation-st-inner .button {
    display: inline-flex;
    align-items: center;
    padding: 5px;
    background: #fff;
    border-radius: 50px;
    width: 124px;
    margin-bottom: 36px;
}

.wc-donation .donation-st-inner .button input {
    padding: 0;
    font-size: 18px;
    color: #000;
    width: 100%;
    font-family: 'Creato Display';
    border: 1px solid #ffffff;
}

.wc-donation .donation-st-inner .button input::placeholder {
    color: #000;
}

.wc-donation .donation-st-inner .button span {
    background-color: #CFFF8D;
    width: 50px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    font-weight: 600;
    font-size: 17px;
    margin-right: 12px;
}

.wc-donation .donation-st-inner h4 {
    font-size: 16px;
    color: #fff;
    padding-bottom: 20px;
}

.wc-donation .donation-st-inner label {
    position: relative;
    cursor: pointer;
    padding-bottom: 15px;
    display: block;
}

.wc-donation .donation-st-inner .radio_btn input[type=radio] {
    position: relative;
    visibility: hidden;
}

.wc-donation .donation-st-inner .radio_btn span.list-item-label {
    margin-left: 10px;
    font-size: 16px;
    font-weight: 500;
    color: #FFFFFF;
    font-family: 'Creato Display';
}

.wc-donation .donation-st-inner .radio_btn input[type=radio]+span:before {
    display: block;
    position: absolute;
    content: '';
    border-radius: 100%;
    height: 10px;
    width: 10px;
    top: 8px;
    border: 1px solid #fff;
}

.wc-donation .donation-st-inner .radio_btn input[type=radio]:checked+span:before {
    background: transparent;
    border: 1px solid #CFFF8D;
}

.wc-donation .donation-st-inner .radio_btn input[type=radio]+span:after {
    display: block;
    position: absolute;
    content: '';
    border-radius: 100%;
    height: 4px;
    width: 4px;
    top: 11px;
    left: 3px;
}

.wc-donation .donation-st-inner .radio_btn input[type=radio]:checked+span:after {
    background: #CFFF8D;
    visibility: visible;
}

.wc-donation .personal-info h4 {
    color: #fff;
    font-size: 16px;
    padding-bottom: 17px;
}

.wc-donation .personal-info .nema-and-number {
    display: flex;
    grid-gap: 32px;
}

.wc-donation .personal-info .form-control {
    min-height: 45px;
    border-radius: 50px;
    background-image: none;
    font-size: 16px;
    color: #fff;
    font-family: 'Creato Display';
    background-color: transparent;
    width: 100%;
    border: 1px solid #CFFF8D;
    padding: 10px 24px;
    max-width: 365px;
    margin-bottom: 15px;
}

.wc-donation .personal-info .form-control:focus {
    border: 1px solid #000;
}

.wc-donation .personal-info .form-control::placeholder {
    color: #fff;
}

.wc-donation .personal-info .btn-text {
    background: #fff;
    padding: 11px 23px;
    font-size: 16px;
    font-family: 'Creato Display';
    font-weight: 400;
    border-radius: 50px;
    display: inline-block;
    margin-bottom: 15px;
}

.wc-donation .personal-info .wc-btn .btn {
    padding: 9px 30px 8px;
}

.wc-donation .personal-info .wc-btn .btn-primary:active,
.wc-donation .personal-info .wc-btn .btn-primary:focus {
    background-color: #425F57;
    border-color: #425F57;
    color: #fff !important;
}

/*<========= End-Donation-section ======>*/
/*<========= Start-error-section ======>*/

body.transperent.main-error header#header .navbar a {
    color: #000;
    font-weight: 400;
}

body.transperent.main-error #header.header-scrolled {
    background-color: #fff;
}

.error {
    background-color: #FFF8F8;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 100vh;
    overflow: hidden;
    padding: 140px 0 0;
    position: relative;
}

.error .error-inner {
    position: relative;
    z-index: 1;
}

.error .heart {
    width: 289px;
    height: 289px;
    background: #CFFF8D;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: -4px -3px 20px rgba(207, 255, 141, 0.3), 8px 6px 19px rgba(207, 255, 141, 0.3);
}

.error .heart img {
    -webkit-animation: heart-pulse 0.8s ease-out alternate;
    animation: heart-pulse 0.5s ease-out alternate;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    transition: all .20s;
}

@keyframes heart-pulse {
    0% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.error_svg {
    position: absolute;
    display: block;
    top: 0;
    left: -70px;
}

.error .error-inner .error-title {
    display: flex;
    justify-content: center;
}

.error .error-inner .error-title h2 {
    font-size: 360px;
    line-height: 360px;
}

.error .error-inner p {
    font-size: 24px;
    padding-bottom: 41px;
    color: #000;
}

.error-svg {
    width: 377px;
    height: 377px;
}

.error-svg path {
    -webkit-animation: Hero_scale__-l05L 3s infinite;
    animation: Hero_scale__-l05L 3s infinite;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-transform-origin: center;
    transform-origin: center;
}

.error-svg path#Extended_image\ wrap_1 {
    -webkit-animation-delay: calc(.25s * 1);
    animation-delay: calc(.25s * 1);
}

.error-svg path#Extended_image\ wrap_2 {
    -webkit-animation-delay: calc(.25s * 2);
    animation-delay: calc(.25s * 2);
}

.error-svg path#Extended_image\ wrap_3 {
    -webkit-animation-delay: calc(.25s * 3);
    animation-delay: calc(.25s * 3);
}

.error-svg path#Extended_image\ wrap_4 {
    -webkit-animation-delay: calc(.25s * 4);
    animation-delay: calc(.25s * 4);
}

.error-svg path#Extended_image\ wrap_5 {
    -webkit-animation-delay: calc(.25s * 5);
    animation-delay: calc(.25s * 5);
}

.error-svg path#Extended_image\ wrap_6 {
    -webkit-animation-delay: calc(.25s * 6);
    animation-delay: calc(.25s * 6);
}

.error-svg path#Extended_image\ wrap_7 {
    -webkit-animation-delay: calc(.25s * 7);
    animation-delay: calc(.25s * 7);
}

.error-svg path#Extended_image\ wrap_8 {
    -webkit-animation-delay: calc(.25s * 8);
    animation-delay: calc(.25s * 8);
}

.error-svg path#Extended_image\ wrap_9 {
    -webkit-animation-delay: calc(.25s * 9);
    animation-delay: calc(.25s * 9);
}

.error-svg path#Extended_image\ wrap_10 {
    -webkit-animation-delay: calc(.25s * 10);
    animation-delay: calc(.25s * 10);
}

@-webkit-keyframes Hero_scale__-l05L {
    0% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    50% {
        opacity: .2;
        -webkit-transform: scale(.7);
        transform: scale(.7)
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

/* second */

.error_svg_2 {
    position: absolute;
    bottom: -15%;
    right: 20%;
    z-index: -1;
}

.error-svg-2 {
    width: 419px;
    height: 415px;
}

.error-svg-2 path {
    -webkit-animation: Hero_scale__-l05L 3s infinite;
    animation: Hero_scale__-l05L 3s infinite;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-transform-origin: center;
    transform-origin: center;
}

.error-svg-2 path#Extended_image\ wrap_1 {
    -webkit-animation-delay: calc(.25s * 1);
    animation-delay: calc(.25s * 1);
}

.error-svg-2 path#Extended_image\ wrap_2 {
    -webkit-animation-delay: calc(.25s * 2);
    animation-delay: calc(.25s * 2);
}

.error-svg-2 path#Extended_image\ wrap_3 {
    -webkit-animation-delay: calc(.25s * 3);
    animation-delay: calc(.25s * 3);
}

.error-svg-2 path#Extended_image\ wrap_4 {
    -webkit-animation-delay: calc(.25s * 4);
    animation-delay: calc(.25s * 4);
}

.error-svg-2 path#Extended_image\ wrap_5 {
    -webkit-animation-delay: calc(.25s * 5);
    animation-delay: calc(.25s * 5);
}

.error-svg-2 path#Extended_image\ wrap_6 {
    -webkit-animation-delay: calc(.25s * 6);
    animation-delay: calc(.25s * 6);
}

.error-svg-2 path#Extended_image\ wrap_7 {
    -webkit-animation-delay: calc(.25s * 7);
    animation-delay: calc(.25s * 7);
}

.error-svg-2 path#Extended_image\ wrap_8 {
    -webkit-animation-delay: calc(.25s * 8);
    animation-delay: calc(.25s * 8);
}

.error-svg-2 path#Extended_image\ wrap_9 {
    -webkit-animation-delay: calc(.25s * 9);
    animation-delay: calc(.25s * 9);
}

.error-svg-2 path#Extended_image\ wrap_10 {
    -webkit-animation-delay: calc(.25s * 10);
    animation-delay: calc(.25s * 10);
}

@-webkit-keyframes Hero_scale__-l05L {
    0% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    50% {
        opacity: .2;
        -webkit-transform: scale(.7);
        transform: scale(.7)
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

/*<========= End-error-section ======>*/
/*<========= start-Donation-sucess-section ======>*/

.wc-donation-success {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 120px 0 220px;
}

.wc-donation-success .inner-success {
    background: #FFF8F8;
    border-radius: 66px;
    max-width: 776px;
    margin: auto;
    padding: 80px 150px;
}

.wc-donation-success .inner-success h2 {
    font-size: 34px;
    padding-bottom: 58px;
    text-align: center;
}

.wc-donation-success .inner-success h3.title {
    font-size: 18px;
    font-family: 'Creato Display';
    padding-bottom: 15px;
    padding-left: 10px;
}

.wc-donation-success .inner-success .details-table {
    margin-bottom: 30px;
}

.wc-donation-success .inner-success p {
    padding-bottom: 30px;
    padding-left: 10px;
}

.wc-donation-success .inner-success table {
    font-family: arial, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

.wc-donation-success .inner-success .details-table td,
.wc-donation-success .inner-success .details-table th {
    border-bottom: 1px solid #dddddd;
    text-align: left;
    padding: 16px 0 10px;
    font-weight: 500;
}

.wc-donation-success .inner-success .details-table td:nth-child(even) {
    width: 32%;
    color: #7F7F7F;
}

.wc-donation-success .inner-success .details-table {
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 22.5px;
    padding: 30px 43px 30px 35px;
}

.wc-donation-success .inner-success .payment-tabel h3 {
    font-size: 18px;
    padding-bottom: 15px;
    text-align: left;
    font-weight: 600 !important;
    font-family: 'Creato Display';
}

.wc-donation-success .inner-success .payment-tabel .payment-tabel-success {
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 22.5px;
    padding: 19px 28px 22px;
}

.wc-donation-success .payment-tabel .payment-tabel-success table th {
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    padding-bottom: 12px;
    font-family: 'Creato Display';
    font-weight: 600;
}

.wc-donation-success .payment-tabel .payment-tabel-success table td {
    padding-top: 16px;
    color: #7F7F7F;
    font-family: 'Creato Display';
    font-size: 16px;
}

/*<========= End-Donation-sucess-section ======>*/
/*<========= start-Donation-form-section ======>*/

.wc-donation-form {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 120px 0 220px;
}

.wc-donation-form .inner-success {
    background: #FFF8F8;
    border-radius: 66px;
    max-width: 776px;
    margin: auto;
    padding: 78px 132px;
}

.wc-donation-form .inner-success h2 {
    font-size: 34px;
    padding-bottom: 58px;
    text-align: center;
}

.wc-donation-form .inner-success .inner-input .form-control {
    min-height: 45px;
    background-image: none;
    font-size: 16px;
    color: #7F7F7F;
    font-family: 'Creato Display';
    background-color: transparent;
    width: 100%;
    padding: 10px 20px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 22.5px;
    margin-bottom: 30px;
    max-width: 476px;
}

.wc-donation-form .inner-success .inner-input label {
    font-family: 'Creato Display';
    font-weight: 600;
    padding-bottom: 10px;
    padding-left: 10px;
    font-size: 18px;
}

.wc-donation-form .inner-success .wc-amount {
    padding-bottom: 30px;
}

.wc-donation-form .inner-success .wc-amount p {
    color: #000;
    font-weight: 600;
    font-size: 18px;
    padding-bottom: 10px;
}

.wc-donation-form .inner-success .wc-amount a {
    display: inline-flex;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 22.5px;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 3px 15px;
    margin-right: 8px;
}

.wc-donation-form .inner-success .wc-amount a:hover {
    background: #CFFF8D;
    border: 1px solid #CFFF8D;
}

.wc-donation-form .inner-success .wc-amount a:hover p {
    color: #000;
}

.wc-donation-form .inner-success .wc-amount a p {
    color: #00000080;
    font-size: 18px;
    padding: 0;
    font-weight: 500;
}

.wc-donation-form .inner-success .donation-information h3 {
    font-size: 18px;
    font-family: 'Creato Display';
    padding-bottom: 20px;
    padding-left: 10px;
}

.wc-donation-form .inner-success .donation-information .form-control {
    min-height: 45px;
    background-image: none;
    font-size: 16px;
    color: #00000080;
    font-family: 'Creato Display';
    background-color: transparent;
    width: 100%;
    padding: 10px 31px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 22.5px;
    margin-bottom: 15px;
    max-width: 476px;
}

.wc-donation-form .inner-success .donation-information .contact-form-button .btn {
    padding: 10px 30px 8px;
}

.wc-donation-form .inner-success .donation-information .contact-form-button .btn:active,
.wc-donation-form .inner-success .donation-information .contact-form-button .btn.btn-primary:focus {
    background-color: #425F57;
    border-color: #425F57;
    color: #fff;
}

.wc-donation-form .inner-success .donation-Occurence {
    padding-left: 10px;
    padding-bottom: 30px;
}

.wc-donation-form .inner-success .donation-Occurence h3 {
    font-family: 'Creato Display';
    font-weight: 500;
    font-size: 18px;
    padding-bottom: 15px;
}

.wc-donation-form .inner-success .donation-Occurence label {
    position: relative;
    cursor: pointer;
    margin-right: 36px;
}

.wc-donation-form .inner-success .donation-Occurence .radio_btn input[type=radio] {
    position: relative;
    overflow: hidden;
    appearance: none;
}

.wc-donation-form .inner-success .donation-Occurence .radio_btn span.list-item-label {
    margin-left: 15px;
    font-size: 16px;
    font-weight: 500;
    color: #00000080;
    font-family: 'Creato Display';
}

.wc-donation-form .inner-success .donation-Occurence .radio_btn input[type=radio]+span:before {
    display: block;
    position: absolute;
    content: '';
    border-radius: 100%;
    height: 10px;
    width: 10px;
    top: 8px;
    border: 1px solid #00000080;
}

.donation-Occurence .radio_btn input[type=radio]:checked+span:before {
    background: transparent;
    border: 1px solid #000;
}

.donation-Occurence .radio_btn input[type=radio]:checked+span {
    color: #000;
}

.donation-Occurence .radio_btn input[type=radio]+span:after {
    display: block;
    position: absolute;
    content: '';
    border-radius: 100%;
    height: 4px;
    width: 4px;
    top: 11px;
    left: 3px;
}

.donation-Occurence .radio_btn input[type=radio]:checked+span:after {
    background: #000;
    visibility: visible;
}

.donation-information .select-box {
    display: inline-flex;
    align-items: center;
    grid-gap: 9px;
    margin-bottom: 30px;
}

.donation-information .custom-select {
    border-radius: 0;
    display: block;
    padding: 0;
    position: relative;
    color: rgba(0, 0, 0, 0.7);
    width: 151px;
    transition: all 0.2s ease;
}

.donation-information .custom-select select {
    appearance: none;
    box-sizing: border-box;
    margin: 0;
    outline: none;
    transition: all 0.2s ease;
    min-height: 45px;
    background-image: none;
    font-size: 16px;
    color: #00000080;
    font-family: 'Creato Display';
    background-color: transparent;
    width: 100%;
    padding: 10px 25px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 22.5px;
}

.donation-information .custom-select:after {
    content: "\f078";
    pointer-events: none;
    position: absolute;
    right: 25px;
    top: 36%;
    z-index: 2;
    font-size: 14px;
    line-height: normal;
    font-family: 'Font Awesome 5 Pro';
    color: #00000080;
    font-weight: 100;
}

.wc-donation-form .inner-success .donation-information .select-box input.form-control {
    max-width: 151px;
    color: #00000080;
    text-align: center;
    margin: 0;
    padding: 10px 10px;
}

.donation-information .custom-select.google {
    width: 187px;
    margin-bottom: 30px;
}

/*<========= End-Donation-form-section ======>*/
/*<========= Start-about-us-bg-section ======>*/

.wc-about-us {
    margin-bottom: 120px;
}

.wc-about-us .wc-about-bg {
    background-repeat: no-repeat;
    height: 100%;
    width: 100%;
    min-height: 700px;
    padding: 83px;
    background-size: cover;
}

.wc-about-us .wc-about-bg h2 {
    font-size: 60px;
    left: 52%;
    position: relative;
    max-width: 53%;
    line-height: 70px;
}

.about-us-inner {
    padding: 80px 0 239px;
    margin-bottom: 80px;
    position: relative;
}

.about-us-inner .about-svg2 {
    top: 47%;
    right: 18%;
}

/* what-we-d0 */

.main-wc-what {
    margin-bottom: 120px;
}

.main-wc-what .container {
    max-width: 1200px;
}

.what-we .wc-what-we {
    text-align: center;
    padding-bottom: 32px;
}

.what-we .wc-what-we h2 {
    font-size: 60px;
    padding-bottom: 47px;
}

.what-we .wc-what-we p {
    max-width: 38%;
    margin: auto;
    padding-bottom: 15px;
    text-align: left;
}

.main-wc-what .wc-what-inner {
    display: flex;
}

.main-wc-what .wc-what-inner .what-we-p {
    padding-left: 48px;
    padding-top: 29px;
}

.main-wc-what .wc-what-inner .what-we-p p {
    padding-bottom: 15px;
    max-width: 65%;
}

/*<========= End-about-us-bg-section ======>*/
/*<========= Start-help-me-section ======>*/

.wc-help-me {
    padding: 80px 0 120px;
}

.wc-help-me .container {
    max-width: 1250px;
}

.wc-help-me .main-help-content h2.title {
    text-align: center;
    padding-bottom: 50px;
}

.wc-help-me .main-help-content {
    padding-bottom: 45px;
}

.help-me-wrapper {
    display: inline-flex;
    justify-content: space-between;
    padding-bottom: 50px;
    align-items: center;
}

.help-me-wrapper .help-me-image {
    max-width: 470px;
    width: 100%;
}

.help-me-wrapper .help-me-p {
    padding-left: 94px;
    padding-top: 37px;
    max-width: 680px;
}

.help-me-wrapper .help-me-p p {
    padding-bottom: 15px;
}

.main-help-content p {
    padding-bottom: 15px;
}

.wc-story-info h2 {
    font-size: 50px;
    padding-bottom: 60px;
}

.wc-story-info .story-wrapper {
    display: flex;
    padding-bottom: 30px;
}

.story-content {
    padding-left: 50px;
    max-width: 567px;
}

.story-content p {
    padding-bottom: 15px;
    max-width: 94%;
}

.story-content p span {
    color: #425F57;
    font-weight: 700;
}

.wc-story-info h3 {
    font-size: 20px;
    padding-bottom: 15px;
}

.wc-story-info p.last {
    padding-bottom: 15px;
    max-width: 97%;
}

.wc-story-info p.last:last-child {
    padding-bottom: 30px;
}

.bredcum {
    background-color: #FFF8F8;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 45px 160px 46px 54px;
}

.bredcum .bredcum-content h2 {
    font-size: 22px;
    padding-bottom: 10px;
}

.bredcum .bredcum-content p {
    max-width: 74%;
}

.bredcum .btn {
    padding: 14px 63px 10px;
    font-size: 22px;
}

.bredcum .btn.btn-primary:active {
    border: 2px solid #000;
}

/*<========= End-help-me-section ======>*/
/*<========= start-as-donation-section ======>*/

.as-donation {
    padding-bottom: 120px;
}

.as-donation h2 {
    font-size: 60px;
    padding-bottom: 50px;
}

.as-donation .donation-content .donation-p p {
    font-family: 'Axiforma';
    font-weight: 400;
    font-size: 15px;
    max-width: 74%;
    padding-bottom: 20px;
}

.as-donation .donation-content {
    display: flex;
    max-width: 1290px
}

.as-donation .donation-p {
    padding-left: 65px;
}

.faq_wrapper {
    margin-top: 35px;
    width: 160%;
}

.faq_wrapper .faq_area {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto 45px auto;
    border-radius: 5px;
    cursor: pointer;
}

.faq_wrapper .faq_item {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto 25px auto;
    cursor: pointer;
    background: #FFF8F8;
    padding: 15px 25px;
}

.faq_wrapper .faq_title {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: auto;
    padding: 0;
    margin: 0;
    font-size: 20px;
    font-weight: 800;
    cursor: pointer;
    color: #000;
    font-family: 'Axiforma';
}

.faq_title.active,
.faq_wrapper .faq_title:hover {
    color: #425f57;
}

.faq_wrapper .faq_title.active:after {
    font-family: Fontawesome;
    content: '\f078';
}

.faq_wrapper .faq_title:after {
    font-family: Fontawesome;
    content: '\f077';
    float: right;
    font-size: 17px;
    font-weight: 300;
}

.faq_wrapper .faq_details .accordion-content {
    display: flex;
    align-items: baseline;
    padding: 10px 0px 0;
}

.faq_wrapper .faq_details {
    display: none;
}

.faq_wrapper .faq_item:first-child .faq_details {
    display: block;
}

/*<========= End-as-donation-section ======>*/
/*<========= Start-news-section ======>*/

.wc-news {
    padding: 78px 0 120px;
}

.wc-news .container {
    max-width: 1064px;
}

.wc-news .news-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 144px;
    grid-row-gap: 50px;
    margin-bottom: 70px;
}

.wc-news .news-title {
    padding-bottom: 50px;
    text-align: center;
}

.wc-news .news-title h2 {
    font-size: 60px;
    padding-bottom: 20px;
}

.wc-news .news-title p {
    max-width: 70%;
    margin: auto;
}

.wc-news .news-wrapper .news-content img {
    width: 100%;
}

.wc-news .news-content .date {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 10px;
    padding-top: 20px;
}

.wc-news .news-content .date p {
    color: #425F57;
}

.wc-news .news-content h2 {
    font-size: 20px;
}

.wc-news .news-content h2 a,
.wc-news .news-content .date svg {
    color: #000;
}

.wc-news .news-content h2 a:hover,
.wc-news .news-content .date svg:hover {
    color: #425F57;
}

.wc-news .wc-btn {
    text-align: center;
}

.wc-news .wc-btn .btn {
    padding: 20px 45px;
    font-size: 22px;
    border-radius: 50px;
}

/*<========= End-news-section ======>*/
/*<========= start-news-details-section ======>*/

.wc-news-details {
    padding: 120px 0;
}

.wc-news-details .container {
    max-width: 1190px;
}

.wc-news-details h2 {
    font-size: 40px;
    padding-bottom: 17px;
    line-height: 50px;
}

.wc-news-details p.date {
    font-size: 18px;
    color: #425F57;
    padding-bottom: 25px;
}

.wc-news-details .news-details-wrapper {
    display: inline-flex;
    justify-content: space-between;
    padding-bottom: 35px;
}

.wc-news-details .news-details-wrapper .news-details-p {
    padding-top: 23px;
    padding-left: 57px;
}

.wc-news-details .news-details-wrapper .news-details-p p {
    padding-bottom: 15px;
    max-width: 95.5%;
}

.wc-news-details .news-details-content p.last-p {
    padding-bottom: 15px;
    max-width: 95%;
}

.wc-news-details .bredcrum {
    padding: 30px 0 35px;
}

.wc-news-details .bredcrum .bredcrum-content {
    display: flex;
    align-items: flex-start;
}

.wc-news-details .bredcrum .bredcrum-content img {
    width: 36px;
    height: 26px;
}

.wc-news-details .bredcrum .bredcrum-content h3 {
    font-size: 20px;
    line-height: 30px;
    max-width: 85%;
    padding-left: 18px;
    padding-bottom: 15px;
}

.wc-news-details .bredcrum p {
    color: #7F7F7F;
    font-family: 'inter';
    padding-left: 55px;
}

.wc-news-details .news-details-thumbnails {
    display: flex;
    grid-gap: 31px;
    padding-bottom: 35px;
}

.wc-news-details .social-icon {
    padding-top: 10px;
}

.wc-news-details .social-icon a {
    background: #425F57;
    border-radius: 6px;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #CFFF8D;
    font-size: 18px;
    margin-right: 19px;
    border: 1px solid #425F57;
}

.wc-news-details .social-icon a:hover {
    color: #425F57;
    border: 2px solid #425F57;
    background: #fff;
}

/*<========= End-news-details-section ======>*/
/*<========= Start-portfolio-details-section ======>*/

.portfolio-details-page {
    margin-bottom: 0 !important;
}

.portfolio-details {
    padding: 150px 0 120px;
}

.portfolio-details .container {
    max-width: 1180px;
}

.portfolio-details .portfolio-content img {
    padding-bottom: 60px;
}

.portfolio-details .portfolio-content h2 {
    font-size: 30px;
    padding-bottom: 15px;
}

.portfolio-details .portfolio-content p {
    padding-bottom: 15px;
    max-width: 95.4%;
}

.portfolio-details .portfolio-thumbnails {
    padding-top: 25px;
    padding-bottom: 35px;
    grid-gap: 20px;
    display: flex;
}

.portfolio-details .portfolio-thumbnails img {
    padding: 0;
}

.portfolio-details .portfolio-content h3 {
    font-size: 22px;
    max-width: 95%;
    padding-bottom: 14px;
}

.portfolio-details ul.potfolio-ul li {
    font-size: 20px;
    padding-bottom: 10px;
    font-family: 'Creato Display';
    font-weight: 600;
    display: flex;
    align-items: center;
}

.portfolio-details ul.potfolio-ul li svg {
    font-size: 10px;
    color: #000000;
    padding-right: 12px;
}

.potfolio-ul .faq_wrapper {
    max-width: 100%;
    margin: 0;
    padding-bottom: 5px;
}

.potfolio-ul .faq_wrapper .faq_title {
    font-size: 20px;
    font-family: 'Creato Display';
    font-weight: 600;
    display: inline-block;
    align-items: center;
}

.potfolio-ul .faq_wrapper .faq_title:after {
    font-family: Fontawesome;
    content: '\f067';
    float: left;
    font-weight: 300;
    font-size: 10px;
    color: #000000;
    padding-right: 12px;
    line-height: 30px;
}

.potfolio-ul .faq_wrapper .faq_title.active:after {
    font-family: Fontawesome;
    content: '\f068';
}

.potfolio-ul .faq_wrapper .faq_item {
    background: transparent;
    padding: 0;
}

.potfolio-ul .faq_wrapper .faq_item {
    margin: 0 auto 10px auto;
}

.faq_wrapper .faq_details .accordion-content p {
    max-width: 65%;
    color: #000;
    /* padding-left: 20px; */
    padding-bottom: 5px;
}

/*<========= End-portfolio-details-section ======>*/
/*<========= Start-contact-section ======>*/

.contact-page {
    margin-bottom: 0 !important;
}

.wc-contact-us {
    padding: 120px 0;
}

.wc-contact-us .container {
    max-width: 1248px;
}

.wc-contact-us .wc-contact-wrapper {
    display: flex;
    margin-bottom: 40px;
}

.wc-contact-us .wc-contact-form {
    background-color: #FFF8F8;
    width: 720px;
    padding: 104px 138px;
}

.wc-contact-us .wc-contact-form h2 {
    font-size: 40px;
    padding-bottom: 32px;
}

.wc-contact-us .wc-contact-form .form-control {
    min-height: 45px;
    border-radius: 50px;
    background-image: none;
    font-size: 16px;
    color: #7F7F7F;
    font-family: 'Creato Display';
    background-color: transparent;
    width: 100%;
    border: 1px solid #0000004D;
    padding: 10px 31px;
    margin-bottom: 15px;
}

.wc-contact-us .wc-address-form {
    background-color: #425F57;
    width: 528px;
    padding: 158px 102px;
}

.wc-contact-us .wc-address-form .address {
    background: #FFF8F8;
    border-radius: 43.5px;
    padding: 19px 30px;
    margin-bottom: 20px;
    display: inline-block;
}

.wc-contact-us .wc-address-form .address p {
    font-size: 18px;
    font-weight: 600;
    line-height: 28px;
    color: #425F57;
}

.wc-contact-us .wc-address-form .address p a {
    color: #425F57;
}

.wc-contact-us .wc-address-form .address p a:hover {
    color: #000;
}

.wc-contact-us .contact-form-button .btn {
    padding: 9px 42px 7px;
}

.wc-contact-us svg.Password-toggle {
    position: relative;
    float: right;
    margin-top: -44px;
    right: 28px;
    font-size: 12px;
    color: #7F7F7F;
    cursor: pointer;
}

.wc-contact-us .map-box {
    height: 600px;
}

.wc-contact-us .map-box iframe {
    width: 100%;
    height: 100%;
}

/*<========= End-contact-section ======>*/
/*<========= start-footer-section ======>*/

footer {
    background-color: #425F57;
    padding: 75px 0;
    /* position: fixed; */
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 0;
}

.footer a.logo {
    max-width: 280px;
    width: 100%;
    display: block;
    margin: auto;
}

.footer .footer-content {
    text-align: center;
}

.footer .footer-content img {
    padding-bottom: 40px;
    max-width: 280px;
    margin: 0 auto;
}

.footer .footer-content p {
    color: #DFFFFFCC;
    max-width: 26%;
    margin: auto;
    padding-bottom: 30px;
}

.footer .footer-copyright {
    color: #fff;
    padding-bottom: 30px;
}

.footer .social-icon a {
    background: rgba(207, 255, 141, 0.2);
    border-radius: 6px;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #CFFF8D;
    font-size: 18px;
    margin-right: 18px;
}

.footer .social-icon a:hover {
    background-color: #CFFF8D;
    color: #000;
}

.footer .footer-copyright a {
    font-size: 16px;
    color: #fff;
    font-weight: 400;
    font-family: 'Creato Display';
}

.footer .footer-copyright a:hover {
    color: #CFFF8D;
}

a.mobile-nav-toggle .svg-inline--fa.fa-xmark {
    display: none;
}

/*<========= End-footer-section ======>*/

/*=================================================================
                        start index-2 css
=================================================================*/

/*---------------------------------
# start header css
---------------------------------*/

#header .wc-search-icon {
    background-color: #CFFF8D;
    border: 1px solid #CFFF8D;
    border-radius: 30px;
    padding: 9px;
}

#header .wc-search-icon:hover {
    background-color: transparent;
}

#header .wc-search-icon:hover svg path {
    stroke: #CFFF8D;
}

.wc_search_bar {
    width: 100%;
    height: 100vh;
    background-color: #FFF8F8;
    position: absolute;
    top: -100vh;
    left: 0;
    transition: 1s all ease;
}

.wc_search_bar.search_open {
    top: 0;
}

.wc_search_bar form {
    max-width: 460px;
    width: 100%;
}

.wc_search_bar .wc_search_bar_inner {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    position: relative;
}

.wc_search_bar .input_cover {
    min-height: 50px;
    border-radius: 50px;
    border: 1px solid rgba(0, 0, 0, 0.5);
    padding: 6px 6px 6px 25px;
    display: flex;
    align-items: center;
}

.wc_search_bar .input_cover input {
    background-image: none;
    font-size: 16px;
    color: #000;
    font-family: 'Creato Display';
    background-color: transparent;
    width: 100%;
    border: 0;
}

.wc_search_bar .wc-close-icon {
    position: absolute;
    top: 15px;
    right: 25px;
    font-size: 25px;
}

.wc_search_bar .wc-close-icon:hover {
    color: #CFFF8D;
}

/*---------------------------------
# End header css
---------------------------------*/
/*---------------------------------
# start second hero css
---------------------------------*/

.wc-two-page-hero {
    background-color: #425F57;
    padding: 100px 0 0 0;
}

.wc-two-page-hero .mouse-scroll {
    top: 50%;
    left: -55px;
    transform: translateY(-50%) !important;
}

.wc-two-page-hero h1 {
    line-height: 80px;
    padding-bottom: 28px;
}

.wc-two-page-hero .wc-hero {
    padding-right: 50px;
}

.wc-two-page-hero .wc-hero p {
    max-width: 560px;
    color: rgba(223, 255, 255, 0.8);
    margin-bottom: 50px;
}

/*---------------------------------
# End second hero css
---------------------------------*/

/*---------------------------------
# start second about css
---------------------------------*/

.about-section {
    background-color: #FFF8F8;
    padding-top: 140px;
}

.about-section .content-wrap {
    max-width: 1060px;
    margin: 0 auto 115px auto;
}

.about-section .content-wrap p {
    max-width: 755px;
    margin: auto;
}

.about-section h2.title {
    font-size: 30px;
    line-height: 40px;
    text-align: center;
    margin-bottom: 35px;
}

.about-section .about-btn {
    margin-top: 55px;
    display: flex;
    justify-content: center;
}

.about-section .about-img-wrap {
    display: flex;
    gap: 36px;
    margin-bottom: -114px;
}

.about-section .about-img-wrap .image-wrap {
    width: 50%;
}

/*---------------------------------
# End second about css
---------------------------------*/

/*---------------------------------
# start donate section css
---------------------------------*/

.donate-section {
    padding: 200px 0 160px;
}

.donate-section .donate-title p {
    max-width: 665px;
}

.donate-section .donate-text {
    max-width: 600px;
}

.donate-section .donate-text p {
    padding-bottom: 15px;
}

.donate-image-wrap .video-img {
    max-width: 500px;
    margin: 0 0 15px 40px;
    position: relative;
}

.donate-image-wrap .image-column {
    position: relative;
    display: flex;
    align-items: flex-start;
}

.donate-image-wrap .image-column .img-1 {
    max-width: 245px;
    margin-right: 15px;
}

.donate-image-wrap .image-column .img-2 {
    max-width: 350px;
}

.donate-section .wc-story {
    right: 50%;
    bottom: -20px;
}

.donate-section .mouse-scroll .mouse {
    width: 70px;
    height: 70px;
}

.donate-section .mouse-scroll {
    font-size: 16px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) !important;
}

/*---------------------------------
# End donate section css
---------------------------------*/

/*---------------------------------
# start upcoming-events css
---------------------------------*/

.upcoming-events {
    background-color: #425F57;
    padding: 80px 0;
}

.upcoming-events .events-title h2 {
    color: #DFFFFF;
}

.upcoming-events .events-title p {
    color: #DFFFFF;
}

.upcoming-events-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 40px;
}

.events-info {
    background-color: #526F67;
    padding: 35px;
}

.events-info .event-img {
    overflow: hidden;
    display: flex;
}

.events-info .event-img img {
    transition: all 0.4s ease-in-out;
}

.events-info .event-img img:hover {
    transform: scale(1.1);
}

.events-info .events-content {
    padding-top: 30px;
}

.events-info .date {
    font-family: 'Creato Display';
    font-size: 16px;
    line-height: 26px;
    color: #CFFF8D;
    margin-bottom: 12px;
    display: flex;
}

.events-info h4 a {
    font-size: 24px;
    line-height: 34px;
    color: #fff;
    margin-bottom: 26px;
    display: flex;
}

.events-info h4 a:hover {
    color: #CFFF8D;
}

.events-info .btn-primary:hover,
.upcoming-events .view-all-btn .btn-primary:hover {
    background-color: transparent;
    border-color: #CFFF8D;
}

/*---------------------------------
# End upcoming-events css
---------------------------------*/

/*---------------------------------
# start volunteer-section css
---------------------------------*/

.volunteer-section {
    padding: 100px 0;
}

.volunteer-grid-wrapper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 30px;
}

.volunteer-info .volunteer-content {
    background-color: #FFF8F8;
    padding: 30px;
    border-radius: 35px;
    margin: -80px 15px 0;
    z-index: 1;
    position: relative;
}

.volunteer-info .volunteer-content h4 a {
    font-size: 20px;
    line-height: 30px;
    color: #000;
    display: flex;
    width: fit-content;
    margin: 0 auto 6px;
}

.volunteer-info .volunteer-content h4 a:hover {
    color: #425F57;
}

.volunteer-info .volunteer-content p {
    color: #425F57;
    text-align: center;
    margin-bottom: 18px;
}

.volunteer-info .social-info {
    justify-content: center;
}

/*---------------------------------
# End volunteer-section css
---------------------------------*/

/*---------------------------------
# start volunte-section css
---------------------------------*/

.volunte-section .volunte-content h4 {
    font-size: 22px;
    line-height: 32px;
    margin-bottom: 20px;
}

.volunte-section .volunte-content p {
    padding-bottom: 15px;
}

.volunte-section .volunte-content .explore-btn {
    margin-top: 25px;
}

.volunte-section .volunte-image {
    max-width: 92%;
    margin-left: auto;
}

/*---------------------------------
# End volunte-section css
---------------------------------*/

/*---------------------------------
# start latest-blog css
---------------------------------*/

.latest-blog {
    background-color: #FFF8F8;
    padding: 80px 0;
    margin: 100px 0;
}

.blog-info h3 {
    font-size: 20px;
    line-height: 30px;
    padding: 20px 0;
}

.blog-info h3 a {
    color: #000;
}

.blog-info h3 a:hover {
    color: #425F57;
}

.blog-info .date {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 18px;
    border-top: 1px solid rgba(0, 0, 0, 0.3);
}

.blog-info .date p {
    color: #425F57;
}

.blog-info .date a:hover {
    color: #000;
}

.latest-blog .latest-blog-title {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

/*---------------------------------
# End latest-blog css
---------------------------------*/



/*---------------------------------
# start testimonial css
---------------------------------*/

.testimonial-section {
    background-color: #425F57;
    position: relative;
    overflow: hidden;
}

.testimonial-section .vector-1 {
    position: absolute;
    top: -100px;
    left: -100px;
}

.testimonial-section .vector-2 {
    position: absolute;
    bottom: -30px;
    right: -100px;
}

.testimonial-section .testimonial-swiper-wrap {
    padding-top: 132px;
    padding-bottom: 132px;
}

.testimonial-section .testimonial-image {
    max-width: 92px;
    margin: 0 auto;
    margin-bottom: 50px;
}

.testimonial-section .testimonial-para {
    max-width: 940px;
    margin: 0 auto;
}

.testimonial-section .testimonial-para p {
    text-align: center;
    color: #DFFFFFCC;
    font-size: 22px;
    line-height: 34px;
    vertical-align: top;
    font-weight: 500;
}

.testimonial-section .testimonial-slider a {
    display: flex;
    justify-content: center;
    color: #DFFFFFCC;
    margin-top: 40px;
    margin-bottom: 40px;
    text-decoration-line: underline;
    text-underline-offset: 3px;
    font-size: 18px;
}


/*---------------------------------
# end testimonial css
---------------------------------*/


/*---------------------------------
# start contact css
---------------------------------*/

.wc-contactus-sec {
    padding-top: 120px;
}

/*---------------------------------
# end contact css
---------------------------------*/



/*<========= start-footer-section ======>*/

.footer-two {
    background-color: #425F57;
    padding: 75px 0 0;
    /* position: fixed; */
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 0;
}

.footer-two a.logo {
    max-width: 280px;
    width: 100%;
    display: block;
}

.footer-two .footer-content-two {
    text-align: start;
}

.footer-two .footer-content-two img {
    padding-bottom: 40px;
    max-width: 200px;
}

.footer-two .footer-content-two p {
    color: #DFFFFFCC;
    max-width: 322px;
    padding-bottom: 30px;
}

.footer-two .footer-copyright {
    color: #fff;
    padding-bottom: 30px;
}

.footer-two .social-icon a {
    background: rgba(207, 255, 141, 0.2);
    border-radius: 6px;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #CFFF8D;
    font-size: 18px;
    margin-right: 18px;
}

.footer-two .social-icon a:hover {
    background-color: #CFFF8D;
    color: #000;
}

.footer-two .personal-info {
    display: flex;
    align-items: baseline;
    gap: 14px;
}

.footer-two .official-info-two .personal-info {
    color: #CFFF8D;
}

.footer-two .official-info-two h3 {
    color: #DFFFFFCC;
    font-weight: 700;
    line-height: 30px;
    font-size: 20px;
    margin-bottom: 15px;
}

.footer-two .official-info-two .personal-info p {
    color: #DFFFFFCC;
    max-width: 228px;
    margin-bottom: 12px;
}

.footer-two .official-info-two .personal-info-nub {
    color: #DFFFFFCC;
    max-width: 152px;
}

.footer-two .our-link h3 {
    color: #DFFFFFCC;
    font-weight: 700;
    line-height: 30px;
    font-size: 20px;
    margin-bottom: 15px;
}

.footer-two .our-link ul {
    list-style: none;
}

.footer-two .our-link ul li a {
    text-decoration: none;
    color: #DFFFFFCC;
    margin-bottom: 10px;
    display: block;
}

.footer-two .our-link ul li a:hover {
    color: #CFFF8D;
}

.footer-two .subscribe h3 {
    color: #DFFFFFCC;
    font-weight: 700;
    line-height: 30px;
    font-size: 20px;
    margin-bottom: 15px;
}

.footer-two .subscribe-email {
    max-width: 400px;
}

.footer-two .subscribe-email input {
    width: 100%;
    padding: 10px 0 10px 25px;
    background-color: transparent;
    border: 1px solid #CFFF8D;
    border-radius: 28px;
    color: #FFFFFF;
}

.footer-two .subscribe-email input::placeholder {
    color: #FFFFFF;
}

.footer-two .subscribe a {
    background-color: #CFFF8D;
    color: #000;
    padding: 9px 23px;
    display: block;
    margin-top: 18px;
    border-radius: 30px;
    width: fit-content;
}

.footer-two .subscribe a:hover {
    background: rgba(207, 255, 141, 0.2);
    color: #CFFF8D;
}

.footer-two .copy {
    display: flex;
    justify-content: space-between;
    padding-top: 15px;
    padding-bottom: 15px;
    border-top: 1px solid rgba(207, 255, 141, 0.3);
    margin-top: 70px;
}

.footer-two .copy p {
    color: #FFFFFF;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
}

.footer-two .copy a {
    color: #FFFFFF;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
}

.footer-two .copy a:hover {
    color: #CFFF8D;
}

/*<========= End-footer-section ======>*/





/*=================================================================
                        End index-2 css
=================================================================*/





/*=================================================================
                        start index-3 css
=================================================================*/



.header {
    position: fixed;
    z-index: 99;
    width: 100%;
}

.header.active {
    background-color: #425F57;
    padding-bottom: 25px;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
}

.hero-section-three .hero-main {
    position: absolute;
    display: block;
    top: 50px;
    left: -7%;
    pointer-events: none;
}


.hero-section-three {
    position: relative;
    background-image: url(../images/hero-three.jpg);
    background-position: center;
    background-size: cover;
}

.hero-section-three::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(66, 95, 87, 0.40);
}

.official-info-three {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 30px;
    margin-bottom: 30px;
    position: relative;
}

.header-logo-three {
    margin-top: 30px;
    margin-bottom: 30px;
    position: relative;
}

.official-info-three .official-info-wrap {
    display: flex;
    align-items: center;
    gap: 11px;
}


.official-info-three .official-info-wrap svg {
    color: #CFFF8D;
}

.official-info-three .official-info-wrap p {
    color: #DFFFFF;
}

.official-info-three .official-info-wrap p:hover {
    color: #CFFF8D;
}

.social-icon-three {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-top: 30px;
    margin-bottom: 30px;
    position: relative;
}

.social-icon-three a {
    background: rgba(207, 255, 141, 0.2);
    border-radius: 6px;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #CFFF8D;
    font-size: 18px;
    margin-left: 18px;
}

.social-icon-three a:hover {
    background-color: #CFFF8D;
    color: #000;
}

.hero-section-three .hero-details {
    position: relative;
}

.navbar-three {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #FFF8F8;
    border-radius: 50px;
    padding: 14px 20px;
    position: relative;
}

.menu-toggle,
.menu-toggle-three {
    width: 24px;
    height: 24px;
    display: none;
}

.menu-toggle div,
.menu-toggle-three div {
    width: 100%;
    height: 3px;
    background-color: black;
    margin: 4px auto;
    transition: all 0.3s;
    backface-visibility: hidden;
}

.menu-toggle.on .one {
    transform: rotate(45deg) translate(3px, 3px);
}

.menu-toggle.on .two {
    opacity: 0;
}

.menu-toggle.on .three {
    transform: rotate(-45deg) translate(7px, -8px);
}

.navbar-three ul {
    margin: 0;
    padding: 0;
    display: flex;
    list-style: none;
    align-items: center;
    padding-right: 20px;
}

.menu_three_close {
    margin-left: auto;
    width: fit-content;
    color: #FFF;
    font-size: 24px;
    display: none;
}

.navbar-three li {
    position: relative;
    margin-right: 35px;
}

.navbar-three a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 0;
    font-size: 16px;
    font-weight: 400;
    color: #000;
    white-space: nowrap;
    transition: 0.3s;
    text-decoration: none;
    font-family: 'Creato Display';
}

.navbar-three a:hover {
    color: #425F57;
}

.navbar-three .dropdown:hover>ul {
    opacity: 1;
    visibility: visible;
}

.navbar-three .dropdown ul {
    display: block;
    position: absolute;
    left: 0;
    top: calc(100% + 15px);
    margin: 0;
    padding: 10px 0;
    z-index: 99;
    opacity: 0;
    visibility: hidden;
    background: #ffffff;
    box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
    transition: 0.3s;
    border-radius: 9px;
    min-width: 160px;
}

.navbar-three li.dropdown ul li {
    margin-right: 0;
    padding: 8px 20px;
    border-left: 3px solid white;
}

.navbar-three li.dropdown ul li:hover {
    background: #cfff8d;
    border-left: 3px solid #425F57;
}

.navbar-three .donate-btn {
    background-color: #CFFF8D;
    padding: 7px 30px 9px;
    border-radius: 50px;
}

.navbar-three .donate-btn:hover {
    background-color: #425F57;
    color: #ffffff;
}



.hero-section-three {
    text-align: center;
    padding-top: 380px;
    padding-bottom: 356px;
}

.hero-section-three h1 {
    color: #DFFFFF;
    max-width: 988px;
    margin: 0 auto;
    margin-bottom: 22px;
    font-size: 60px;
    line-height: 75px;
    font-weight: 800;
}

.hero-section-three p {
    max-width: 800px;
    margin: 0 auto;
    color: #DFFFFF;
    font-size: 18px;
    line-height: 26px;
    font-weight: 400;
    margin-bottom: 50px;
}

.hero-section-three .wc-btn {
    display: flex;
    justify-content: center;
}

.hero-section-three .wc-btn .btn {
    padding: 10px 25px 6px;
    margin-right: 30px;
}

.hero-section-three .wc-btn .btn-primary {
    color: #000;
    border: 1px solid #cfff8d;
}

.hero-section-three .wc-btn .btn-outline-primary {
    border: 1px solid #CFFF8D;
    color: #FFFFFF;
}

.hero-section-three .wc-btn .btn-outline-primary:hover {
    border: 1px solid #CFFF8D;
    background-color: #CFFF8D;
    color: #000;
}

.hero-section-three .wc-btn .btn-primary:active,
.hero-section-three .wc-btn .btn-primary:focus {
    color: #fff;
}


.donate-three {
    background-color: #FFF8F8;
    padding-top: 114px;
    padding-bottom: 114px;
}
.donate-three .hero-main{
    position: absolute;
}


.donate-three .donate-three-image .donate-image01 {
    max-width: 500px;
    width: 100%;
}

.donate-three .donate-three-image .donate-image02 {
    width: 100%;
}

.donate-three .donate-three-image .donate-video-image {
    position: relative;
    max-width: 450px;
    margin-left: 175px;
    margin-top: -165px;
}

.donate-three .donate-three-image .donate-video-image .lets-play {
    position: absolute;
    bottom: 40%;
    right: 37%;
    z-index: 9;
}

.donate-three .donate-three-text p {
    max-width: 567px;
    margin-bottom: 15px;
    font-size: 16px;
    line-height: 26px;
}

.donate-three .donate-three-text p span {
    color: #425F57;
    font-weight: 700;
}



/*---------------------------------
# start our-donar css
---------------------------------*/

.our-donar {
    padding-top: 100px;
    padding-bottom: 100px;
}

.our-donar .our-donar-head h2 {
    text-align: center;
    font-size: 50px;
    line-height: 60px;
    font-weight: 800;
    margin-bottom: 15px;
}

.our-donar .our-donar-head p {
    max-width: 665px;
    margin: 0 auto;
    text-align: center;
    Font-size: 16px;
    line-height: 26px;
    color: #7F7F7F;
    margin-bottom: 50px;
}

.our-donar .donar-image {
    max-width: 1250px;
    margin: 0 auto;
}

/*---------------------------------
# end our-donar css
---------------------------------*/


/*---------------------------------
# start upcoming-event-three css
---------------------------------*/

.event-three {
    padding-top: 80px;
    padding-bottom: 80px;
    background-color: #FFF8F8;
}

.event-three .event-three-head h2 {
    font-size: 50px;
    line-height: 60px;
    font-weight: 800;
    margin-bottom: 15px;
}

.event-three .event-three-head p {
    max-width: 714px;
    Font-size: 16px;
    line-height: 26px;
    color: #7F7F7F;
    margin-bottom: 50px;
}

.event-three .event-three-info {
    display: flex;
    justify-content: start;
    align-items: center;
    margin-bottom: 40px;
}

.event-three .event-three-info .event-three-image {
    max-width: 300px;
    margin-right: 30px;
}

.event-three .event-three-info .event-three-text p span {
    color: #425F57;
    margin-bottom: 12px;
    display: inline-block;
}

.event-three .event-three-info .event-three-text h6 {
    font-size: 20px;
    line-height: 30px;
    max-width: 365px;
    margin-bottom: 15px;
}

.event-three .event-three-info .event-three-text p {
    font-size: 16px;
    line-height: 26px;
    max-width: 332px;
}

/*---------------------------------
# end upcoming-event-three css
---------------------------------*/



/*---------------------------------
# start volunteer-three css
---------------------------------*/

.volunteer-three {
    padding-top: 120px;
    padding-bottom: 120px;
}

.volunteer-three .volunteer-three-head h2 {
    font-size: 50px;
    line-height: 60px;
    font-weight: 800;
    text-align: center;
}

.volunteer-three .volunteer-three-head p {
    text-align: center;
    max-width: 665px;
    Font-size: 16px;
    line-height: 26px;
    color: #7F7F7F;
    margin: 15px auto 60px;
}

.volunteer-three .volunteer-three-team .volunteer-three-image {
    max-width: 300px;
    margin: 0 auto;
}

.volunteer-three .volunteer-three-content {
    text-align: center;
}

.volunteer-three .volunteer-three-content h4 {
    margin-top: 32px;
    margin-bottom: 5px;
}

.volunteer-three .volunteer-three-content p {
    margin-bottom: 18px;
}

.volunteer-three .volunteer-three-content .social-info {
    justify-content: center;
}

.volunteer-three .view-all-btn-three {
    margin-top: 80px;
}

/*---------------------------------
# end volunteer-three css
---------------------------------*/



/*---------------------------------
# start why-choose css
---------------------------------*/

.why-choose {
    padding-bottom: 115px;
}

.why-choose .donation-content {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.why-choose .donation-content .faq_wrapper h2 {
    font-size: 50px;
    line-height: 60px;
    margin-bottom: 15px;
}

.why-choose .donation-content .faq_wrapper p {
    max-width: 692px;
    margin-bottom: 60px;
    font-size: 16px;
    line-height: 26px;
}

.why-choose .faq_wrapper {
    margin-top: 0px;
    width: 50%;
}

.why-choose .donation-content .why-choose-image {
    width: 50%;
    margin-left: 50px;
}

.why-choose .donation-content .why-choose-image img {
    max-width: 680px;
    width: 100%;
}



/*---------------------------------
# end why-choose css
---------------------------------*/


/*---------------------------------
# start latest-blog css
---------------------------------*/

.latest-blog-three {
    background-color: #FFF8F8;
    padding-top: 80px;
    padding-bottom: 80px;
}

.latest-blog-three .latest-blog-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.latest-blog-three .latest-blog-three-wrap {
    display: flex;
    justify-content: space-between;
}

.latest-blog-three .latest-blog-three-wrap .latest-blog-three-info {
    display: flex;
    align-items: center;
}

.latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .latest-blog-three-image {
    max-width: 400px;
}

.latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .event-three-text {
    background-color: #FFFFFF;
    padding: 30px 28px;
    margin-left: -135px;
}

.latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .event-three-text p span {
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: #425F57;
    margin-bottom: 12px;
}

.latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .event-three-text h6 {
    font-size: 20px;
    line-height: 30px;
    font-weight: 700;
    max-width: 340px;
    margin-bottom: 20px;
    margin-top: 12px;
}

.latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .event-three-text a {
    background-color: #CFFF8D;
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    border-radius: 50px;
    padding: 6px 26px 6px;
}

.latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .event-three-text a:hover {
    background-color: #425F57;
    color: #fff !important;
    border: 1px solid #425F57;
}



/*---------------------------------
# end latest-blog css
---------------------------------*/

/*---------------------------------
# start wc sponser three css
---------------------------------*/

.wc-sponser-three {
    padding: 100px 0;
}

.wc-sponser-three .sponser-img {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    grid-row-gap: 67px;
    grid-column-gap: 102px;
    max-width: 1220px;
    margin: auto;
}

.wc-sponser-three .sponser-img img {
    opacity: 0.3;
    filter: invert(110%) sepia(70%) saturate(7%) hue-rotate(339deg) brightness(60%) contrast(49%);
}

.wc-sponser-three .sponser-img img:hover {
    filter: none;
    opacity: unset;
}

.wc-sponser-three .slider-arrow {
    margin-top: 50px;
}


/*---------------------------------
# end wc sponser three css
---------------------------------*/


/*---------------------------------
# start testimonial three css
---------------------------------*/

.testimonial-three .testimonial-wrap {
    display: flex;
    justify-content: space-between;
    gap: 40px;
    padding: 35px;
}

.testimonial-three .testimonial-wrap .testimonial-left {
    background-color: #425F57;
    border-radius: 40px;
    padding: 0 65px;
    margin-bottom: 65px;
}

.testimonial-three .testimonial-wrap .testimonial-left .testimonial-quotes {
    max-width: 60px;
    margin: 0 auto;
    margin-top: -25px;
}

.testimonial-three .testimonial-wrap .testimonial-left p {
    max-width: 560px;
    margin: 25px auto 34px;
    text-align: center;
    font-size: 18px;
    line-height: 28px;
    color: #DFFFFF;
}

.testimonial-three .testimonial-wrap .testimonial-left a {
    display: flex;
    justify-content: center;
    color: #DFFFFFCC;
    margin-top: 40px;
    margin-bottom: 40px;
    text-decoration-line: underline;
    text-underline-offset: 3px;
    font-size: 18px;
}

.testimonial-three .testimonial-wrap .testimonial-three-image {
    max-width: 60px;
    margin: 0 auto;
    margin-bottom: -30px;
}

.testimonial-three .testimonial-wrap .testimonial-three-image img {
    border: 2px solid #CFFF8D;
    border-radius: 50px;
}


/*---------------------------------
# end testimonial three css
---------------------------------*/

/*---------------------------------
# start footer-three css
---------------------------------*/
.footer-two .latest-news h3 {
    color: #DFFFFFCC;
    font-weight: 700;
    line-height: 30px;
    font-size: 20px;
    margin-bottom: 15px;
}

.footer-two .latest-news .letest-news-info {
    display: flex;
    margin-bottom: 10px;
}

.footer-two .latest-news .letest-news-info .latest-news-image {
    max-width: 74px;
    width: 100%;
    margin-right: 15px;
}

.footer-two .latest-news .letest-news-info .latest-news-image img {
    border-radius: 8px;

}

.footer-two .latest-news .letest-news-info .latest-news-text p {
    max-width: 215px;
    font-size: 16px;
    line-height: 22px;
    color: #DFFFFF;
    font-weight: 500;
}

.footer-two .latest-news .letest-news-info .latest-news-text p span {
    font-size: 12px;
    line-height: 22px;
    color: white;
    margin-top: 6px;
}

.footer-two .copy-three {
    justify-content: center;
}

/*---------------------------------
# end footer-three css
---------------------------------*/



/*---------------------------------
# start event second page css
---------------------------------*/
.event-page {
    margin-bottom: 0 !important;
}

.upcoming-events-second {
    background-color: transparent;
}

.upcoming-events-second .event-title-center {
    text-align: center;
}

.upcoming-events-second .event-title-center p {
    margin: auto;
    color: #7F7F7F;
}

.upcoming-events-second .event-title-center h2 {
    color: black;
}

.loader-01 {
    border: .2em dotted currentcolor;
    border-radius: 50%;
    animation: 1s loader-01 linear infinite;
    height: 22px;
    width: 22px;
    margin-bottom: 5px;
    margin-left: 7px;
}

@keyframes loader-01 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


/*---------------------------------
# end event second page css
---------------------------------*/

/*---------------------------------
# start latest-blog css
---------------------------------*/




.latest-blog .latest-blog-info {
    display: flex;
    justify-content: space-around;
    margin-bottom: 50px;
}

.latest-blog .latest-blog-info .latest-blog-wrap {
    max-width: 460px;
}

.latest-blog .latest-blog-info .latest-blog-wrap .latets-blog-date {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
    margin-bottom: 10px;
}

.latest-blog .latest-blog-info .latest-blog-wrap .latets-blog-date a {
    color: #000;
}

.latest-blog .latest-blog-info .latest-blog-wrap h3 {
    font-size: 20px;
    line-height: 30px;
    color: #000;
    font-weight: 800;
}

.latest-blog .latest-blog-info .latest-blog-wrap h3 a {
    color: #000;
}

.latest-blog .latest-blog-center {
    justify-content: center;
    text-align: center;
}

.latest-blog-second {
    background-color: transparent;
    margin-top: 0;
}

.latest-blog-page {
    margin-bottom: 0 !important;
}


/*---------------------------------
# end latest-blog css
---------------------------------*/

/*---------------------------------
# start blog-grid css
---------------------------------*/
.blog-grid-page {
    margin-bottom: 0 !important;
}

.blog-grid {
    background-color: transparent;
    margin-top: 0;
}

.blog-grid .blog-grid-title {
    text-align: center;
    justify-content: center;
}

.blog-grid .latest-blog-slider {
    display: flex;
    justify-content: center;
    gap: 30px;
    margin-bottom: 50px;
}

/*---------------------------------
# end blog-grid css
---------------------------------*/

/*---------------------------------
# start blog-standard css
---------------------------------*/

.blog-standard {
    background-color: transparent;
}

.blog-standard .blog-standard-center {
    justify-content: center;
    text-align: center;
}

.blog-standard .blog-standard-text {
    background-color: #FFF4F4 !important;
}

.blog-standard .blog-standard-wrap {
    margin-bottom: 50px;
}

.blog-standard .blog-standard-load-btn {
    text-align: center;
    margin-top: 80px;
}

.blog-standard .blog-standard-load-btn a {
    font-size: 18px;
    line-height: 30px;
    font-weight: 300;
    background-color: #CFFF8D;
    padding: 12px 35px;
    text-align: center;
    border-radius: 50px;
}

.blog-standard .blog-standard-load-btn a:hover {
    background-color: #425F57;
    color: #fff !important;
}



.standard-blog-page {
    margin-bottom: 0 !important;
}



/*---------------------------------
# end blog-standard css
---------------------------------*/

/*---------------------------------
# start blog-details css
---------------------------------*/
.blog-details {
    padding-top: 120px;
}

.blog-details .blog-details-title {
    max-width: 1190px;
    margin: 0 auto 25px;
}

.blog-details .blog-details-title h3 {
    font-size: 40px;
    line-height: 50px;
    font-weight: 800;
    margin-bottom: 15px;
}

.blog-details .blog-details-title p {
    font-size: 18px;
    line-height: 28px;
    color: #425F57;
}

.blog-details .blog-detail-section {
    display: flex;
    justify-content: center;
    max-width: 1190px;
    margin: 0 auto;
}

.blog-details .blog-detail-section .blog-details-image {
    max-width: 519px;
    width: 100%;
}

.blog-details .blog-detail-section .blog-details-text {
    max-width: 614px;
    margin-left: 57px;
}

.blog-details .blog-detail-section .blog-details-text p {
    margin-bottom: 15px;
}

.blog-details .second-para {
    max-width: 1190px;
    margin: 35px auto 0;
}

.blog-details .second-para p {
    margin-bottom: 15px;
}

.blog-details .blog-detail-quotes {
    max-width: 1190px;
    margin: 0 auto;
}

.blog-details .blog-detail-quotes .blog-detail-quotes-wrap {
    display: flex;
    margin-top: 47px;
}

.blog-details .blog-detail-quotes .blog-detail-quotes-wrap img {
    width: 36px;
    height: 26px;
}

.blog-details .blog-detail-quotes h4 {
    max-width: 943px;
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 15px;
    margin-left: 18px;
}

.blog-details .blog-detail-quotes p {
    color: #7F7F7F;
    font-size: 16px;
    line-height: 26px;
    position: relative;
    margin-left: 54px;
}

.blog-details .blog-detail-image-wrap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 30px;
    max-width: 1190px;
    margin: 35px auto;
}

.blog-details .blog-detail-grid-para {
    max-width: 1190px;
    margin: 0 auto;
}

.blog-details .blog-detail-grid-para p {
    margin-bottom: 15px;
}

.blog-details .blog-detail-grid-para .social-icon a {
    background-color: #425F57;
    border-radius: 6px;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #CFFF8D;
    font-size: 18px;
    margin-right: 18px;
    margin-top: 15px;
}

.blog-details .blog-detail-grid-para .social-icon a:hover {
    background-color: #CFFF8D;
    color: #000;
}

/*---------------------------------
# end blog-details css
---------------------------------*/

/*---------------------------------
# start volunteers css
---------------------------------*/

.volunteers-page {
    margin-bottom: 0 !important;
}


.volunteers .volunteers-title {
    text-align: center;
    margin-top: 100px;
}

.volunteers .volunteers-title h2 {
    font-size: 50px;
    line-height: 60px;
    margin-bottom: 15px;
}

.volunteers .volunteers-title p {
    color: #7F7F7F;
    max-width: 735px;
    margin: 0 auto 50px;
}

.volunteers .volunteers-image-wrap {
    display: flex;
    gap: 15PX;
}

.volunteers .volunteers-image-text {
    margin-top: 30px;
}

.volunteers .volunteers-image-text p {
    margin-bottom: 15px;
}

.volunteers .volunteers-team-title h2 {
    font-size: 50px;
    line-height: 60px;
    margin-top: 60px;
    margin-bottom: 15px;
}

.volunteers .volunteers-team-title p {
    max-width: 735px;
    margin-bottom: 55px;
}

.volunteers .view-all-btn {
    margin-bottom: 100px;
}

.volunteers .people-says h2 {
    font-size: 50px;
    line-height: 60px;
    margin-top: 90px;
}

.volunteers .people-says p {
    max-width: 735px;
    margin-top: 15px;
}

.volunteers .people {
    display: flex;
    justify-content: center;
    gap: 40px;
    margin-bottom: 50px;
    padding-top: 80px;
}

.volunteers .people-testimonial-box .people-image {
    max-width: 120px;
    width: 100%;
    margin-top: -105px;
}

.volunteers .people-testimonial-box {
    background-color: #425F57;
    border-radius: 40px;
    padding: 45px;
}

.volunteers .people-testimonial {
    display: flex;
    align-items: start;

}

.volunteers .people-testimonial .people-image-grid {
    text-align: center;
}

.volunteers .people-testimonial .people-image-grid .people-image img {
    max-width: 120px;
}

.volunteers .people-testimonial .people-image-grid a {
    color: #DFFFFF;
    margin-top: 25px;
    margin-bottom: 5px;
    display: block;
}

.volunteers .people-testimonial .people-image-grid p {
    color: #FFFFFF;
}

.volunteers .people-quotes {
    text-align: center;
    margin-left: 50px;
    margin-top: -90px;
}

.volunteers .people-quotes .people-quotes-image img {
    max-width: 60px;
    margin: 0 auto 22px;
}

.volunteers .people-quotes p {
    max-width: 400px;
    color: #DFFFFF;
}

.volunteers .people-btn {
    padding-bottom: 100px;
}


/*---------------------------------
# end volunteers css
---------------------------------*/


/*---------------------------------
# start event-detail css
---------------------------------*/
.event-detail-page {
    margin-bottom: 0 !important;
}

.event-detail {
    margin-top: 120px;
    margin-bottom: 120px;
}

.event-detail .event-detail-title {
    max-width: 1190px;
    margin: 0 auto;
}

.event-detail .event-detail-title h2 {
    font-size: 40px;
    line-height: 50px;
    font-weight: 800;
}

.event-detail .event-detail-title p {
    font-size: 18px;
    line-height: 28px;
    margin-bottom: 25px;
    color: #425F57;
}

.event-detail .event-detail-hero {
    max-width: 1190px;
    margin: 0 auto 50px;
}

.event-detail .event-detail-hero .event-detail-image {
    margin-bottom: 40px;
}

.event-detail .event-detail-hero .event-detail-image-para p {
    margin-bottom: 15px;
}

.event-detail .event-progressbar {
    max-width: 1190px;
    margin: 0 auto;
}

/* .event-detail .event-progressbar h6 {
    margin-top: 35px;
    margin-bottom: 15px;
} */

/* .event-detail .event-progressbar .full {
    width: 100%;
    background-color: #425F57;
    height: 10px;
    border-radius: 50px;
}

.event-detail .event-progressbar .progress {
    padding-right: 10px;
    height: 10px;
    color: #fff;
    justify-content: end;
    align-items: center;
} */

/* .event-detail .event-progressbar .progress span {
    vertical-align: -6px;
    color: #000;
} */

/* .event-detail .event-progressbar .lima-puluh {
    width: 65%;
    background-color: #CFFF8D;
    animation: progress 0.8s linear;
    border: 2px solid #425F57;
}

.event-detail .event-progressbar .tiga-puluh {
    width: 49%;
    background-color: #CFFF8D;
    animation: progress 1s linear;
    border: 2px solid #425F57;
}

.event-detail .event-progressbar .enam-puluh {
    width: 80%;
    background-color: #CFFF8D;
    animation: progress 0.7s linear;
    border: 2px solid #425F57;
} */

/* 
@keyframes progress {
    0% {
        transform: translateX(0)
    }

    20% {
        width: 100%
    }
} */



.skill {
    margin-bottom: 35px;
    position: relative;
}

.skill>p {
    font-size: 18px;
    font-weight: 700;
    color: #1a1716;
    margin: 0;
}

.skill:before {
    width: 100%;
    height: 16px;
    content: "";
    display: block;
    position: absolute;
    background: #425F57;
    bottom: 0;
    border-radius: 50px;
}

.skill-bar {
    width: 100%;
    height: 16px;
    background: #CFFF8D;
    display: block;
    position: relative;
    border-radius: 50px;
    border: 2px solid #425F57;
}

.skill-bar span {
    position: absolute;
    top: -50px;
    padding: 4px;
    font-size: 18px;
    font-weight: 500;
    background-color: #425F57;
    border-radius: 4px;
    color: white;
}

.skill-bar span::after {
    border-left: solid transparent 8px;
    border-right: solid transparent 8px;
    border-top: solid #425F57 8px;
    bottom: -7px;
    content: " ";
    height: 0;
    left: 58%;
    margin-left: -13px;
    position: absolute;
    width: 0;
}

.skill-bar {
    position: relative;
}

.skill1 .skill-count1 {
    right: 0;
}

.skill1 {
    width: 65%;
}

.skill2 {
    width: 49%;
}

.skill2 .skill-count2 {
    right: 0;
}

.skill3 {
    width: 80%;
}

.skill3 .skill-count3 {
    right: 0;
}


.event-detail .event-progressbar-para {
    max-width: 1190px;
    margin: 43px auto 40px;
}

.event-detail .support {
    max-width: 1190px;
    margin: 0 auto;
    display: flex;
    gap: 50px;
    justify-content: space-between;
}

.event-detail .support .support-left {
    display: flex;
    align-items: center;
}

.event-detail .support .support-left .support-image {
    max-width: 410px;
    width: 100%;
}

.event-detail .support .support-left .support-image-text {
    background-color: #FFF8F8;
    margin-left: -175px;
    padding: 35px;
}

.event-detail .support .support-left h6 {
    font-size: 22px;
    line-height: 32px;
    margin-bottom: 15px;
}

.event-detail .support .support-left p {
    max-width: 270px;
    font-size: 16px;
    line-height: 26px;
}

.event-detail .support .support-right {
    max-width: 560px;
}

.event-detail .support .support-right h6 {
    font-size: 22px;
    line-height: 32px;
    font-weight: 800;
    margin-bottom: 16px;
}

.event-detail .support .support-right p {
    margin-bottom: 15px;
}

.event-detail .support-para {
    max-width: 1190px;
    margin: 43px auto 0;
}

.event-detail .support-para p {
    margin-bottom: 15px;
}

.event-detail .support-para .social-icon a {
    background-color: #425F57;
    border-radius: 6px;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #CFFF8D;
    font-size: 18px;
    margin-right: 18px;
    margin-top: 15px;

}

.event-detail .support-para .social-icon a:hover {
    background-color: #CFFF8D;
    color: #000;
}



/*---------------------------------
# end event-detail css
---------------------------------*/


/*---------------------------------
# start testimonial css
---------------------------------*/

.testimonial-page {
    margin-bottom: 0 !important;
}

.testimonial {
    background-color: #FFF8F8;
    padding-top: 120px;
    padding-bottom: 120px;
}

.testimonial .testimonial-title {
    text-align: center;
}

.testimonial .testimonial-title h2 {
    font-size: 60px;
    line-height: 60px;
    margin-bottom: 15px;
}

.testimonial .testimonial-title p {
    max-width: 560px;
    margin: 0 auto 82px;
}

.testimonial .testimonial-second-wrap {
    padding: 0px;
    margin-top: 50px;
}

.testimonial .testimonial-second-image {
    border: 0;
    max-width: 88px;
    margin: 0 auto;
    margin-bottom: -40px;
}

.testimonial .load-btn {
    background-color: #CFFF8D;
    font-size: 18px;
    line-height: 30px;
    border-radius: 50px;
    padding: 12px 35px;
    color: #000;
    max-width: 197px;
    text-align: center;
    margin: 30px auto 0;
}


/*---------------------------------
# end testimonial css
---------------------------------*/

/*---------------------------------
# start career-page css
---------------------------------*/

.career-page {
    margin-bottom: 0 !important;
}

.career {
    background-color: #FFF8F8;
}

.career .career-top {
    display: flex;
    justify-content: space-between;
}

.career .career-top .career-head h2 {
    font-size: 60px;
    line-height: 70px;
    padding-top: 180px;
    margin-bottom: 15px;
}

.career .career-top .career-head .career-first-para {
    margin-bottom: 263px;
    max-width: 560px;
}

.career-sec-para {
    max-width: 790px;
    margin-top: 40px;
}

.career .career-image {
    max-width: 469px;
    width: 100%;
    margin-top: 113px;
    margin-bottom: -100px;
    margin-left: auto;
    margin-right: 90px;
    z-index: 1;
    position: relative;
}

.lets-join {
    margin-top: 120px;
    margin-bottom: 120px;
}

.lets-join .lets-head {
    text-align: center;
}

.lets-join .lets-head h2 {
    font-size: 50px;
    line-height: 60px;
    margin-bottom: 15px;
}

.lets-join .lets-head p {
    max-width: 665px;
    margin: 0 auto 60px;
}

.lets-join .lets-wrap {
    background-color: #FFF8F8;
    padding: 50px;
    margin-bottom: 30px;
    transition: .5s all ease;
}

.lets-join .lets-wrap:hover {
    background-color: #425F57;
}

.lets-join .lets-wrap:hover h6 {
    color: white;
}

.lets-join .lets-wrap:hover .lets-wrap-para {
    color: white;
}

.lets-join .lets-wrap:hover .lets-wrap-time {
    color: white;
}

.lets-join .lets-wrap:hover .lets-wrap-nub {
    color: white;
}

.lets-join .lets-wrap h6 {
    font-size: 22px;
    line-height: 32px;
    margin-bottom: 15px;
}

.lets-join .lets-wrap .lets-wrap-para {
    max-width: 354px;
    margin-bottom: 22px;
}

.lets-join .lets-wrap .lets-wrap-time {
    font-weight: 500;
    color: #425F57;
    margin-bottom: 10px;
}

.lets-join .lets-wrap .lets-wrap-nub {
    font-weight: 500;
    color: #425F57;
    margin-bottom: 30px;
}

.lets-join .lets-wrap a {
    background-color: #CFFF8D;
    color: #000;
    border-radius: 50px;
    padding: 9px 29px;
}

.lets-join .load-btn {
    text-align: center;
    margin-top: 60px;
}

.lets-join .load-btn a {
    background-color: #CFFF8D;
    color: #000;
    padding: 12px 35px;
    border-radius: 50px;
    text-align: center;
}

.lets-join .load-btn a:hover {
    background-color: #425F57;
    color: #fff;
    border: 1px solid #425F57;
    line-height: normal;
}

.process {
    padding-top: 80px;
    padding-bottom: 80px;
    background-color: #FFF8F8;
    border-radius: 40px;
}

.process .process-title {
    text-align: center;
}

.process .process-title h2 {
    font-size: 50px;
    line-height: 60px;
    font-weight: 800;
    margin-bottom: 15px;
}

.process .process-title p {
    max-width: 665px;
    margin: 0 auto 50px;
}

.process .process-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 73px;
}

.process .process-grid .process-wrap {
    text-align: center;
    border: 2px dashed #425F57;
    border-radius: 50px;
    padding: 50px 0;
}

.process .process-grid .process-wrap h2 {
    color: #CFFF8D;
    font-size: 50px;
    line-height: 60px;
    margin-bottom: 21px;
    text-shadow: 3px 3px 2px #425F57;
}

.process .process-grid .process-wrap h6 {
    font-size: 20px;
    line-height: 30px;
    font-weight: 700;
    margin-bottom: 15px;
}

.process .process-grid .process-wrap p {
    max-width: 260px;
    margin: 0 auto;
}

.our-benefits {
    margin-top: 100px;
    margin-bottom: 120px;
}

.our-benefits .benefit-image {
    max-width: 620px;
    width: 100%;
}

.our-benefits .benefits-detail h2 {
    font-size: 40px;
    line-height: 50px;
    margin-bottom: 45px;
}

.our-benefits .benefits-name {
    display: flex;
    gap: 22px;
    align-items: center;
    margin-bottom: 45px;
}

.our-benefits .benefits-name-three {
    margin-bottom: 0;
}

.our-benefits .benefits-name .benefits-icon {
    background-color: #425F57;
    height: 80px;
    max-width: 80px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
}

.our-benefits .benefits-name .benefits-icon-para h5 {
    font-size: 22px;
    line-height: 32px;
}

.our-benefits .benefits-name .benefits-icon-para p {
    font-size: 16px;
    line-height: 26px;
    color: #7F7F7F;
}

/*---------------------------------
# end career-page css
---------------------------------*/


/*---------------------------------
# start presentataion css
---------------------------------*/

.presentation-page {
    margin-bottom: 0 !important;
}

.presentation-page .presentation-title {
    max-width: 1190px;
    margin: 0 auto;
}

.presentation-page .presentation-title span {
    color: #CFFF8D;
}

.presentation-page .presentation-title-image {
    border: 25px solid white;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.presentation-page .presentation-play-btn {
    left: 45% !important;
    bottom: 45% !important;
}

.Prebuild {
    padding-top: 373px;
    padding-bottom: 100px;
    background-color: #FFF8F8;
}

.Prebuild .prebuild-head {
    text-align: center;
}

.Prebuild .prebuild-head h2 {
    font-size: 50px;
    line-height: 60px;
    margin-bottom: 15px;
}

.Prebuild .prebuild-head p {
    max-width: 665px;
    margin: 0 auto;
}

.Prebuild .Prebuild-image {
    max-width: 370px;
    width: 100%;
    margin-top: 60px;
    margin-left: auto;
    margin-right: auto;
}

.Prebuild .load-btn {
    margin-top: 65px;
    text-align: center;
}

.Prebuild .load-btn a {
    background-color: #CFFF8D;
    padding: 12px 35px;
    border-radius: 50px;
    color: #000;
    text-align: center;
}

.Prebuild .load-btn a:hover {
    background-color: #425F57;
    color: white;
}

.inner-page {
    padding-top: 100px;
    padding-bottom: 100px;
    background-color: #425F57;
    position: relative;
}

.inner-page .inner-page-main-left {
    position: absolute;
    top: 0;
    left: 0;
}

.inner-page .inner-page-main-right {
    position: absolute;
    bottom: 0;
    right: 0;
}

.inner-page .inner-hero-svg {
    width: 300px;
    height: 300px;
}

.inner-page .inner-head {
    text-align: center;
}

.inner-page .inner-head h2 {
    font-size: 50px;
    line-height: 60px;
    color: #DFFFFF;
}

.inner-page .inner-head h2 span {
    color: #CFFF8D;
}

.inner-page .inner-head p {
    max-width: 665px;
    margin: 15px auto 55px;
    color: #DFFFFF;
}

.inner-page .inner-image-grid {
    background-color: #526F67;
    text-align: center;
    margin-bottom: 35px;
    display: block;
    padding-top: 30px;
}

.inner-page .inner-image-grid h5 {
    color: #DFFFFF;
    font-size: 22px;
    line-height: 30px;
    font-weight: 800;
    padding-top: 25px;
    padding-bottom: 25px;
}

.inner-page .inner-image-grid .page-img {
    max-width: 390px;
    margin: 0 auto;
}

.inner-page .load-btn {
    margin-top: 65px;
    text-align: center;
}

.inner-page .load-btn a {
    background-color: #CFFF8D;
    padding: 12px 35px;
    border-radius: 50px;
    color: #000;
    text-align: center;
}

.inner-page .load-btn a:hover {
    border: 1px solid #CFFF8D;
    background-color: transparent;
    color: white;
}

.view-blog {
    padding-top: 120px;
    padding-bottom: 165px;
}

.view-blog .view-blog-title {
    text-align: center;
}

.view-blog .view-blog-title h2 {
    font-size: 50px;
    line-height: 60px;
    margin-bottom: 15px;
}

.view-blog .view-blog-title p {
    max-width: 665px;
    margin: 0 auto;
}

.view-blog .view-blog-image {
    margin-top: 60px;
}

.function {
    position: relative;
    margin-bottom: 120px;
}

.function .function-form {
    position: relative;
    margin-left: 80px;
}

.function .function-form {
    max-width: 519px;
    width: 100%;
}

.function .function-form img {
    width: 100%;
}

.function .function-form .img-wrap-1 {
    position: absolute;
    top: -80px;
    right: -105px;
    max-width: 220px;

}

.function .function-form .img-wrap-2 {
    position: absolute;
    bottom: -85px;
    left: -35px;
    max-width: 220px;

}


.function .function-text h2 {
    font-size: 40px;
    line-height: 50px;
    margin-bottom: 25px;
}

.function .function-text p {
    max-width: 614px;
    margin-bottom: 15px;
}

.function .map-image {
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
    max-width: 670px;
    width: 100%;
}

.presentation-features {
    background-color: #FFF8F8;
    padding-top: 80px;
    padding-bottom: 100px;
}

.presentation-features .features-title h2 {
    font-size: 40px;
    line-height: 50px;
    font-weight: 800;
    text-align: center;
    margin-bottom: 65px;
}

.presentation-features .features-icon a {
    max-width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
}

.presentation-features .features-icon a img {
    width: auto;
    height: auto;
}

.presentation-features .features-icon h6 {
    margin-bottom: 15px;
    font-size: 20px;
    line-height: 30px;
}

.presentation-features .features-icon p {
    max-width: 290px;
}

.presentation-footer {
    position: relative;
}

.presentation-footer .footer-main {
    position: absolute;
    display: block;
    top: 50px;
    left: -7%;
    pointer-events: none;
}

.presentation-footer .presentation-footer-contant .footer-logo {
    max-width: 100px;
    margin: 0 auto;
    display: block;
    margin-bottom: 45px;
}

.presentation-footer .presentation-footer-contant h2 {
    font-size: 60px;
    line-height: 80px;
    color: #DFFFFF;
    text-align: center;
}

.presentation-footer .presentation-footer-contant p {
    max-width: 630px;
    margin: 0 auto 50px;
    color: #DFFFFF;
    text-align: center;
}

.presentation-footer .presentation-footer-contant .footer-purchase-btn {
    text-align: center;
}

.presentation-footer .presentation-footer-contant .footer-purchase-btn a {
    color: #000;
    background-color: #CFFF8D;
    padding: 14px 38px;
    border-radius: 50px;
}

.presentation-footer .presentation-footer-contant .footer-purchase-btn a:hover {
    border: 1px solid #CFFF8D;
    background-color: transparent;
    color: white;
}


/*---------------------------------
# end presentataion css
---------------------------------*/

/*---------------------------------
# start faq css
---------------------------------*/


.faq .faq-hero-left {
    position: absolute;
    display: block;
    top: 50px;
    left: -7%;
    pointer-events: none;
}

.faq .faq-hero-left .faq-svg {
    width: 400px;
    height: 400px;
}

.faq .faq-hero-right .faq-svg {
    width: 400px;
    height: 400px;
}

.faq .faq-hero-right {
    position: absolute;
    display: block;
    bottom: 0;
    right: 0;
    pointer-events: none;
}

.faq-page {
    margin-bottom: 0 !important;
}

.faq {
    padding-top: 120px;
    padding-bottom: 189px;
    background-color: #FFF8F8;
    position: relative;
}

.faq .faq-title {
    text-align: center;
}

.faq .faq-title h2 {
    font-size: 60px;
    line-height: 70px;
    margin-bottom: 15px;
}

.faq .faq-title p {
    max-width: 560px;
    margin: 0 auto 90px;
}

.faq .faq_wrapper-sec {
    max-width: 950px;
    margin: auto;
    width: 100%;
}

.faq .faq_wrapper-sec .faq_details .accordion-content p {
    padding-left: 0px;
}

.faq .faq_wrapper-sec .faq_item-sec {
    background-color: white;
}

.faq-testimonial {

    margin-bottom: 100px;
}

.faq-testimonial .people {
    display: flex;
    justify-content: center;
    gap: 40px;
    margin-bottom: 50px;
    padding-top: 150px;
}

.faq-testimonial .people-testimonial-box {
    background-color: #425F57;
    border-radius: 40px;
    padding: 45px;
}

.faq-testimonial .people-testimonial-box .people-image {
    max-width: 120px;
    width: 100%;
    margin-top: -105px;
}

.faq-testimonial .people-testimonial {
    display: flex;
    align-items: start;
}

.faq-testimonial .people-testimonial .people-image-grid {
    text-align: center;
}

.faq-testimonial .people-quotes {
    text-align: center;
    margin-left: 50px;
    margin-top: -90px;
}

.faq-testimonial .people-testimonial .people-image-grid a {
    color: #DFFFFF;
    margin-top: 25px;
    margin-bottom: 5px;
    display: block;
}

.faq-testimonial .people-testimonial .people-image-grid p {
    color: #FFFFFF;
}

.faq-testimonial .people-quotes p {
    max-width: 400px;
    color: #DFFFFF;
}

.faq-testimonial .people-quotes .people-quotes-image img {
    max-width: 60px;
    margin: 0 auto 22px;
}

/*---------------------------------
# end faq css
---------------------------------*/

/*---------------------------------
# start become css
---------------------------------*/
.become-volunteer-page {
    margin-bottom: 0 !important;
}

.become .become-volunteer-title {
    max-width: 1190px;
    margin: 0 auto;
    padding-top: 100px;
}

.become .become-volunteer-title h2 {
    font-size: 60px;
    line-height: 70px;
    margin-bottom: 15px;
}

.become .become-volunteer-title p {
    max-width: 745px;
    margin-bottom: 60px;
}

.become .become-volunteer {
    max-width: 1190px;
    margin: 0 auto;
}

.become .become-volunteer .become-volunteer-image {
    margin-bottom: 50px;
}

.become .become-volunteer p {
    margin-bottom: 30px;
}

.become .become-volunteer h5 {
    margin-bottom: 60px;
}

.become .become-contact {
    max-width: 1190px;
    margin: 0 auto 60px;
    display: flex;
}

.become .become-contact .become-contact-info {
    padding: 104px 0;
    width: 60%;
    background-color: #FFF8F8;
}

.become .become-contact .become-contact-info h2 {
    margin-bottom: 32px;
    font-size: 40px;
    line-height: 50px;
    margin-left: 120px;
}

.become .become-contact .contact-info {
    max-width: 443px;
    margin-left: 120px;
}

.become .become-contact .contact-info input {
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 23px;
    padding: 9px 35px;
    margin-bottom: 15px;
}

.become .become-contact .contact-info textarea {
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 23px;
    padding: 9px 35px;
    margin-bottom: 21px;
}

.become .become-contact .contact-info textarea:focus {
    outline: none;
}

.become .become-contact .become-contact-btn a {
    background-color: #CFFF8D;
    padding: 7px 28px 9px;
    border-radius: 23px;
    color: #000;
    margin-left: 120px;
}

.become .become-contact .become-contact-btn a:hover {}

.become .become-contact .become-contact-thought {
    width: 40%;
}

.become .become-contact .become-contact-thought {
    background-color: #425F57;
    padding: 127px 64px;
}

.become .become-contact .become-contact-thought .become-contact-thought-inner {
    background-color: #FFF8F8;
    padding: 32px 0 39px;
    border-radius: 44px;
}

.become .become-contact .become-contact-thought .become-contact-thought-inner h6 {
    font-size: 16px;
    line-height: 26px;
    font-weight: 500 !important;
    color: #425F57;
    max-width: 320px;
    text-align: center;
    margin: 0 auto 18px;
}

.become .become-contact .become-contact-thought .become-contact-thought-inner .contact-image {
    max-width: 60px;
    margin: 0 auto 12px;
}

.become .become-contact .become-contact-thought .become-contact-thought-inner a {
    text-align: center;
    display: block;
    text-decoration: underline;
    margin-bottom: 4px;
}

.become .become-contact .become-contact-thought .become-contact-thought-inner p {
    text-align: center;
}

/*---------------------------------
# end become css
---------------------------------*/



/*---------------------------------
# start career-apply-form css
---------------------------------*/


.wc-donation-form .inner-success .career-apply-employment h3 {
    padding-left: 0px;
}

.career-apply-popup{
    max-width: 626px !important;
    padding: 0px 0 0px;
    margin: 0 auto;
}
.career-apply-form {
    padding: 75px 75px !important;
    border-radius: 30px !important;
}
.wc-donation-form  .mfp-close{
    background: #425F57!important;
    opacity: 1;
    color: white;
    border-radius: 50px;
    display: block;
    margin-right: -15px;
    margin-top: -15px;
}

/*---------------------------------
# end career-apply-form css
---------------------------------*/


















/*======================================================================================================
                                            Media Query 
======================================================================================================*/

@media only screen and (max-width: 1875px) {
    .wc-chariti .charities-img img {
        height: 100%;
        object-fit: cover;
    }

    .wc-chariti .project-img {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }

    .wc-latest {
        padding-right: 15px;
        padding-left: 15px;
    }

    .wc-chariti .project-img .charities-img:nth-child(3) {
        grid-column: span 1;
        grid-row: span 1;
    }
}

@media only screen and (max-width: 1440px) {
    #header .container {
        padding: 0 20px !important;
    }

    .wc-help .help-event {
        padding-right: 20px;
        padding-left: 20px;
    }

    .wc-help .wc-help-content {
        padding-left: 20px;
        padding-top: 0;
    }

    .container.p-0 {
        padding-right: 20px !important;
        padding-left: 20px !important;
    }

    .wc-timeline {
        padding: 60px 15px;
    }

    .wc-portfolio .portfolio-grid .portfolio-content .potfolio-img img {
        width: 100%;
    }

    .wc-portfolio .portfolio-grid {
        display: grid;
        margin-bottom: 60px;
        grid-template-columns: repeat(3, 1fr);
        grid-column-gap: 15px;
        grid-row-gap: 15px;
    }

    .wc-portfolio .portfolio-grid .portfolio-content:nth-child(5),
    .wc-portfolio .portfolio-grid .portfolio-content:nth-child(6) {
        grid-column: span 2;
        grid-row: span 1;
    }

    .wc-portfolio .portfolio-grid .portfolio-content .potfolio-img,
    .wc-portfolio .portfolio-grid .portfolio-content .potfolio-img img {
        height: 100%;
        object-fit: cover;
    }


}

@media only screen and (max-width: 1366px) {
    .wc-help .wc-help-img img {
        width: 100%;
    }

    .wc-help .wc-help-img {
        padding-right: 12px;
    }

    .about-us-inner .about-svg2 {
        right: 0;
    }

    .function .function-form {
        max-width: 350px;
        margin: auto;
    }

    .latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .event-three-text {
        background-color: #FFFFFF;
        padding: 10px;
        margin-left: -273px;
    }





}

@media only screen and (max-width: 1300px) {
    .wc-latest .latest-image-content img {
        width: 100%;
    }

    .main-timeline .timeline:nth-child(5n):before {
        width: 55%;
    }

    .main-timeline .timeline:nth-child(4n):before {
        width: 0 !important;
    }

    .main-timeline .timeline:nth-child(2n):after {
        left: -83%;
        height: 38%;
        top: 57%;
    }

    .main-timeline .timeline:nth-child(2n):before {
        width: 88%;
        top: 57%;
    }

    .main-timeline .timeline-content {
        width: 485px;
    }

    .main-timeline .timeline:nth-child(2) {
        width: 35%;
    }

    .wc-news-details .news-details-thumbnails img {
        width: 100%;
    }

    .wc-news-details .news-details-thumbnails {
        display: grid;
        grid-gap: 10px;
        padding-bottom: 20px;
        grid-template-columns: repeat(3, 1fr);
    }

    .main-timeline .timeline-content {
        padding: 20px;
    }

    .faq_wrapper .faq_details .accordion-content p {
        max-width: 100%;
        padding-left: 0;
    }

    .wc-story-info p.last {
        max-width: 100%;
    }

    .why-choose .donation-content {
        align-items: center;
    }

    .process .process-grid {
        gap: 25px;
    }

    .career-sec-para {
        max-width: 660px;
        margin-top: 17px;
    }

    .career .career-image {
        margin-right: 30px;
    }

    .inner-page .inner-image-grid {
        padding-top: 30px;
        padding-left: 30px;
        padding-right: 30px;
    }

    .about-us {
        padding: 85px 0 85px;
    }

    section.donate-three {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .our-donar {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .event-three {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .volunteer-three {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .volunteer-three .view-all-btn-three {
        margin-top: 20px;
    }

    .why-choose .donation-content .why-choose-image img {
        max-width: 100%;
    }

    .why-choose {
        padding-bottom: 40px;
    }

    .latest-blog-three {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .wc-sponser-three {
        padding: 30px 0;
    }

    .footer-two {
        padding: 35px 0 0;
    }

    .hero-section-three {
        padding-top: 245px;
        padding-bottom: 135px;
    }

    .wc-chariti {
        padding-bottom: 50px;
    }

    .wc-contactus-sec {
        padding-top: 30px;
    }

    .wc-contactus {
        padding-bottom: 40px;
    }

    .wc-contact {
        padding: 35px 0;
    }
}

@media only screen and (max-width: 1199px) {
    #video-wrap .close-video {
        right: 0%;
        top: 1%;
        width: 30px;
        height: 30px;
    }

    .hero-section .wc-img img {
        width: 100%;
    }

    .hero-section {
        height: auto;
    }

    .wc-help .wc-help-title h2 {
        font-size: 45px;
    }

    .wc-help .wc-help-title p {
        max-width: 60%;
    }

    .footer {
        padding: 40px 10px;
    }

    .footer .footer-content p {
        max-width: 50%;
        padding-bottom: 20px;
    }

    .footer .footer-content img {
        padding-bottom: 20px;
    }

    .wc-contact-us {
        padding: 70px 0;
    }

    .what-we .wc-what-we h2 {
        font-size: 45px;
        padding-bottom: 15px;
    }

    .what-we .wc-what-we p {
        max-width: 50%;
    }

    .what-we .wc-what-we {
        padding-bottom: 10px;
    }

    .main-wc-what .wc-what-inner .what-we-p p {
        max-width: 100%;
    }

    .main-wc-what .wc-what-inner .what-we-p {
        padding-left: 25px;
        padding-top: 10px;
    }

    .main-wc-what {
        margin-bottom: 55px;
    }

    .wc-donation .donation-st-inner p {
        max-width: 100%;
    }

    .portfolio-details .portfolio-thumbnails {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        padding-bottom: 10px;
    }

    .portfolio-details .portfolio-thumbnails img {
        width: 100%;
    }

    .wc-news-details {
        padding: 60px 0;
    }

    .wc-help .wc-help-content p {
        max-width: 100%;
    }

    .wc-help .help-event {
        padding-bottom: 50px;
    }

    .wc-help-me {
        padding: 30px 0 80px;
    }

    .wc-help-me .main-help-content h2.title {
        padding-bottom: 30px;
        font-size: 40px;
    }

    .help-me-wrapper .help-me-p {
        padding-left: 20px;
        padding-top: 0px;
    }

    .bredcum {
        padding: 40px;
    }

    .as-donation h2 {
        font-size: 35px;
        padding-bottom: 25px;
        padding-left: 10px;
    }

    .as-donation .donation-p {
        padding-left: 10px;
    }

    .story-content {
        padding-left: 20px;
    }

    .story-content p {
        max-width: 100%;
    }

    .main-timeline .timeline:nth-child(5n) {
        margin-left: 50px;
    }

    .main-timeline .timeline-content img {
        width: 40%;
    }

    .main-timeline:before {
        top: 6%;
    }

    .donate-image-wrap .video-img {
        margin: auto;
        margin-bottom: 15px;
    }

    .donate-image-wrap .image-column {
        justify-content: center;
    }

    .donate-section .donate-text {
        margin: 85px auto 0;
        text-align: center;
    }

    .donate-section {
        padding: 130px 0 50px;
    }

    .volunteer-grid-wrapper {
        grid-gap: 10px;
    }

    .volunteer-info .volunteer-content h4 a {
        font-size: 18px;
    }

    .volunteer-info .volunteer-content {
        padding: 10px;
    }

    .wc-two-page-hero h1 {
        line-height: 70px;
        padding-bottom: 10px;
    }

    .hero-section .wc-btn {
        margin-bottom: 20px;
    }

    .wc-two-page-hero .mouse-scroll {
        left: 0;
        right: 0;
    }

    .hero-section h1 {
        font-size: 52px;
    }

    .wc-two-page-hero .wc-hero p {
        margin-bottom: 30px;
    }

    .about-section {
        padding-top: 80px;
    }

    .about-section .content-wrap {
        max-width: 1060px;
        margin: 0 auto 80px auto;
    }

    .volunteer-section {
        padding: 80px 0;
    }

    .latest-blog {
        padding: 50px 0;
        margin: 70px 0;
    }

    .testimonial-section .testimonial-swiper-wrap {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .wc-contactus-sec {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .wc-contact {
        background-color: #FFF8F8;
        padding: 60px 0;
        max-width: 1420px;
        margin: auto auto;
    }

    .footer-two .footer-content-two {
        margin-bottom: 50px;
    }



    .footer-two .copy {
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 15px;
    }

    .event-three .event-three-info .event-three-text p span {
        margin-bottom: 0;
    }

    .event-three .event-three-info .event-three-text h6 {
        margin-bottom: 0;
        font-size: 16px;
        line-height: 24px;
    }

    .event-three .event-three-info .event-three-text p {
        font-size: 16px;
        line-height: 22px;
    }

    .blog-details {
        padding-top: 40px;
    }

    .blog-details .blog-detail-section {
        flex-wrap: wrap;
    }

    .blog-details .blog-detail-section .blog-details-text {
        margin-left: 0;
        max-width: 100%;
    }

    .blog-details .blog-detail-image-wrap {
        column-gap: 15px;
    }

    /* .volunteers .people {
        gap: 10px;
    } */

    .process .process-grid {
        gap: 15px;
    }

    .process .process-grid .process-wrap {
        padding: 15px 0;
    }

    .lets-join .lets-wrap {
        padding: 20px;
    }

    .our-benefits .benefits-detail h2 {
        margin-bottom: 15px;
    }

    .our-benefits .benefits-name {
        margin-bottom: 15px;
    }

    .our-benefits .benefits-name .benefits-icon-para h5 {
        font-size: 16px;
        line-height: 15px;
    }

    .our-benefits {
        margin-top: 50px;
        margin-bottom: 60px;
    }

    .career .career-image {
        margin-top: 25px;
    }

    .career-sec-para {
        max-width: 100%;
    }

    .become .become-contact .become-contact-info h2 {
        margin-left: 60px;
    }

    .become .become-contact .contact-info {
        margin-left: 60px;
    }

    .become .become-contact .become-contact-btn a {
        margin-left: 60px;
    }

    .become .become-contact .become-contact-thought {
        padding: 70px 32px;
    }

    .become .become-contact .become-contact-info {
        padding: 50px 0;
    }

    .become .become-contact .become-contact-thought .become-contact-thought-inner h6 {
        font-size: 14px;
        max-width: 250px;
    }

    .donate-three .donate-three-image .donate-image01 {
        max-width: 360px;
    }

    .donate-three .donate-three-image .donate-video-image .lets-play {
        bottom: 32%;
        right: 32%;
    }

    .wc-story {
        right: 255px;
        bottom: 0px;
    }

    .donate-three .donate-three-image .donate-video-image {
        margin-top: -85px;
    }

    .about-us {
        padding: 0px 0 85px;
    }
    .event-detail .support .support-left .support-image-text {
        margin-left: -200px;
        padding: 10px;
    }
}

@media only screen and (max-width: 1100px) {
    .main-timeline .timeline:nth-child(5n) {
        margin-left: 0;
    }

    .main-timeline .timeline-content {
        width: 430px;
    }
}

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

    .main-timeline .timeline:after,
    .main-timeline .timeline:before {
        background-color: transparent;
    }

    .main-timeline .timeline:nth-child(3n) {
        margin-top: 135px;
    }

    .main-timeline:before {
        position: absolute;
        top: 10%;
        left: 30%;
        background-size: 55%;
    }
}

@media only screen and (max-width: 1024px) {
    .wc-portfolio .wc-btn .btn {
        font-size: 18px;
        padding: 11px 30px 9px;
    }

    .portfolio-details {
        padding: 50px 0 70px;
    }

    .portfolio-details .portfolio-content img {
        padding-bottom: 20px;
    }

    .wc-story-info h2 {
        font-size: 40px;
        padding-bottom: 20px;
    }

    .why-choose .donation-content {
        justify-content: center;
        flex-wrap: wrap-reverse;
    }

    .why-choose .donation-content .why-choose-image {
        width: 100%;
        margin-left: 0;
    }


    .why-choose .faq_wrapper {
        width: 100%;
        margin-top: 50px;
    }


    .why-choose .donation-content .faq_wrapper p {
        margin-bottom: 20px;
    }

    .latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .event-three-text {
        padding: 16px;
    }

    .latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .event-three-text h6 {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 13px;
    }

    .latest-blog-three .latest-blog-three-wrap {
        gap: 20px;
    }

    .testimonial-three .testimonial-wrap {
        gap: 20px;
    }

    .testimonial-three .testimonial-wrap .testimonial-left {
        padding: 0px 20px;
    }

    .hero-section-three {
        padding-top: 200px;
        padding-bottom: 50px;
    }


    .hero-section-three h1 {
        font-size: 46px;
    }

    .navbar-three {
        padding: 5px;
    }

    .event-detail .support {
        flex-wrap: wrap;
        justify-content: center;
    }

    .event-detail .support .support-right {
        max-width: 100%;
    }

    .event-detail {
        margin-top: 60px;
        margin-bottom: 60px;
    }

    .function .function-form .img-wrap-1 {
        top: -60px;
        right: -75px;
        max-width: 160px;
    }

    .function .function-form .img-wrap-2 {
        max-width: 1760x;
    }

}

@media (max-width: 991px) {
    #header {
        height: 85px;
    }

    #header .logo img {
        max-height: 38px;
    }

    .mobile-menu_area {
        display: inline-block;
        vertical-align: middle;
    }

    .logo.no-caret a {
        padding: 0;
    }

    .navbar li {
        margin-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    .navbar-mobile a,
    .transperent .navbar-mobile a,
    #header.header-scrolled nav a:hover,
    #header.header-scrolled nav a,
    .navbar-mobile .active,
    .navbar-mobile li:hover>a {
        padding: 5px 8px;
        color: #ffffff !important;
        font-size: 15px;
        font-family: 'Axiforma';
        font-weight: 500;
        height: 50px;
    }

    .navbar.nav-menu-active {
        left: 0;
        transform: translateX(0%);
        overflow: auto;
        overflow-x: hidden;
    }

    .navbar {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        background: #343434;
        z-index: 999;
        left: -100%;
        width: 100%;
        padding: 20px;
        overflow-y: auto;
        display: block;
        transition: .5s all ease;
    }

    .navbar ul {
        padding-right: 0;
        margin-top: 30px;
    }

    .wc-btn.outer-box .btn {
        padding: 10px 30px 6px;
    }

    .mobile-nav-toggle.bi-x::before {
        content: '\f00d';
        font-weight: 300;
        font-family: 'Font Awesome 5 Pro';
        color: #fff;
        font-size: 20px;
    }

    .mobile-nav-toggle.bi-x .fa-bars {
        display: none;
    }

    .mobile-nav-toggle.nav-toggle-active {
        position: absolute;
        right: 15px;
        top: 0px;
    }

    .mobile-nav-toggle.bi-x {
        position: relative;
        z-index: 999;
        color: #fff;
    }

    .no-caret-2 {
        order: 2;
        display: flex;
        align-items: center;
        justify-content: end;
    }

    .outer-box {
        width: auto;
        display: none;
        margin-right: 20px;
    }

    .logo.no-caret-5 {
        display: block;
    }

    nav#navbar .wc-btn {
        display: none;
    }

    .wc-btn.outer-box .btn {
        padding: 8px 20px 5px;
        font-size: 14px;
    }

    body.transperent header#header .mobile-nav-toggle {
        color: #dfffff;
    }

    .wc-one-page-hero {
        padding: 120px 0 15px;
    }

    .hero-section h1 {
        font-size: 55px;
        padding-bottom: 20px;
        line-height: 85px;
    }

    .hero-section .wc-btn .btn {
        margin-right: 5px;
    }

    .wc-one-page-hero .wc-hero {
        padding-bottom: 40px;
    }

    .about-us .about-image {
        text-align: right;
    }

    .about-us .about-content p {
        max-width: 100%;
    }

    .about-us .about-btn {
        padding-top: 20px;
    }

    .wc-sponser .sponser-title h2 {
        font-size: 45px;
    }

    .wc-sponser .sponser-title p {
        max-width: 100%;
    }

    .wc-sponser .sponser-title {
        padding-bottom: 40px;
    }

    .wc-sponser .sponser-img {
        align-items: center;
        grid-row-gap: 40px;
        grid-column-gap: 30px;
    }

    .menu-toggle-three {
        display: block;
        margin-left: 10px;
    }

    .footer .footer-content p {
        max-width: 100%;
    }

    .wc-contact-us .wc-contact-form {
        padding: 40px 40px;
    }

    .wc-contact-us .wc-address-form {
        padding: 70px 20px;
    }

    .wc-contact-us .wc-address-form .address p {
        font-size: 14px;
    }

    .wc-contact-us .wc-address-form .address {
        padding: 10px 20px;
    }

    .wc-contact-us .wc-contact-form .form-control {
        padding: 10px 16px;
        font-size: 14px;
    }

    .wc-portfolio {
        padding: 40px 0 70px;
    }

    .wc-portfolio .portfolio-title h2 {
        font-size: 40px;
    }

    .wc-portfolio .portfolio-title p {
        max-width: 65%;
    }

    .wc-portfolio .portfolio-title {
        padding-bottom: 35px;
    }

    .wc-portfolio .portfolio-grid .portfolio-content .potfolio-img {
        height: 100%;
    }

    .wc-portfolio .portfolio-grid .portfolio-content .potfolio-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        display: block;
    }

    .wc-news {
        padding: 35px 0 40px;
    }

    .wc-news .news-title h2 {
        font-size: 40px;
        padding-bottom: 0px;
    }

    .wc-news .news-title {
        padding-bottom: 30px;
    }

    .wc-news .news-wrapper {
        grid-column-gap: 20px;
        margin-bottom: 50px;
    }

    .what-we .wc-what-we p {
        max-width: 100%;
    }

    .wc-contact {
        padding: 40px 0;
    }

    .wc-contact .contact-title h2 {
        font-size: 40px;
    }

    .wc-contact .contact-title p {
        max-width: 75%;
    }

    .wc-contact {
        margin: auto auto;
    }

    .contact-form .nema-and-number,
    .contact-form .email-and-submit {
        grid-gap: 10px;
        margin-bottom: 15px;
    }

    .contact-form .contact-form-button .btn {
        font-size: 16px;
        padding: 13px 45px 10px;
    }

    .about-us h2.title {
        font-size: 25px;
        line-height: 40px;
        padding-bottom: 20px;
        text-align: left;
        margin-top: 15px;
    }

    .wc-donation .donation-inner-box {
        padding: 40px;
    }

    .wc-donation .donation-inner img {
        width: 100%;
        height: 100%;
    }

    .wc-donation .donation-inner {
        display: block;
    }

    .wc-donation .donation-st-inner {
        padding-left: 0;
        padding-top: 30px;
    }

    .wc-donation {
        padding: 40px 0 60px;
    }

    .wc-donation .wc-donation-content {
        display: block;
    }

    .donation-child-img {
        text-align: center;
        padding-bottom: 10px;
    }

    .wc-donation .main-donation-wrapper h2 {
        font-size: 18px;
        max-width: 100%;
        padding-bottom: 10px;
    }

    .wc-donation .main-donation-wrapper p,
    .wc-donation .wc-donation-content .donation-content-p p {
        max-width: 100%;
    }

    ul.potfolio-ul li {
        font-size: 16px;
    }

    .portfolio-details {
        padding: 35px 0 30px;
    }

    .wc-news-details h2 {
        font-size: 30px;
        padding-bottom: 10px;
        line-height: 40px;
    }

    .wc-news-details .bredcrum {
        padding: 15px 0 15px;
    }

    .wc-news-details .news-details-wrapper {
        display: block;
        padding-bottom: 0px;
    }

    .wc-news-details .news-details-wrapper .news-details-p {
        padding-top: 10px;
        padding-left: 0px;
    }

    .wc-news .wc-btn .btn {
        padding: 12px 30px;
        font-size: 16px;
    }

    .about-us {
        padding: 100px 0 100px;
        margin-bottom: 60px;
    }

    .wc-sponser .sponser-img {
        grid-template-columns: repeat(3, 1fr);
        display: grid;
    }

    .wc-sponser .sponser-img img {
        width: 100% !important;
        object-fit: contain;
    }

    .wc-sponser {
        padding-bottom: 50px;
    }

    .wc-latest {
        padding: 50px 15px;
        margin-bottom: 70px;
    }

    .wc-latest .latest-title h2 {
        font-size: 40px;
    }

    .wc-latest .latest-title p {
        max-width: 90%;
    }

    .wc-latest .latest-title {
        padding-bottom: 25px;
    }

    .wc-latest .single-cause-item {
        padding-left: 30px;
        margin-left: 30px;
        padding-top: 20px;
    }

    .wc-latest .single-cause-item .cause-content {
        padding-bottom: 25px;
    }

    .wc-latest .single-cause-item h2 {
        font-size: 18px;
    }

    .wc-latest .single-cause-item .cause-meta {
        padding-bottom: 10px;
    }

    .wc-latest .single-cause-item .cause-meta svg {
        font-size: 16px;
    }

    .wc-chariti {
        padding-bottom: 30px;
    }

    .wc-help {
        padding-bottom: 55px;
    }

    .wc-help .wc-help-img {
        padding: 10px;
    }

    .wc-help .help-event {
        padding-bottom: 20px;
    }

    .wc-help .wc-help-content {
        padding: 15px;
        margin-left: 0px;
    }

    .wc-story.story-2 {
        left: 5%;
    }

    .wc-help .order-1 {
        order: 2 !important;
    }

    .wc-help .order-2 {
        order: 1 !important;
    }

    .wc-timeline .timeline-title h2 {
        font-size: 33px;
    }

    .wc-timeline .timeline-title p {
        max-width: 100%;
    }

    .wc-timeline .timeline-title {
        padding-bottom: 20px;
    }

    .main-timeline .timeline:nth-child(4n) {
        margin-top: 50px;
    }

    .main-timeline .timeline:nth-child(5n) {
        margin-top: -30px;
    }

    .main-timeline .timeline:nth-child(2) .timeline-content,
    .main-timeline .timeline:nth-child(2) {
        width: auto;
    }

    .about-svg2 {
        top: 50%;
        right: 0;
    }

    .menu-svg {
        width: 377px;
        height: 377px;
    }

    .menu-svg path {
        -webkit-animation: Hero_scale__-l05L 3s infinite;
        animation: Hero_scale__-l05L 3s infinite;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform-origin: center;
        transform-origin: center;
    }

    .menu-svg path#Extended_image\ wrap_1 {
        -webkit-animation-delay: calc(.25s * 1);
        animation-delay: calc(.25s * 1);
    }

    .menu-svg path#Extended_image\ wrap_2 {
        -webkit-animation-delay: calc(.25s * 2);
        animation-delay: calc(.25s * 2);
    }

    .menu-svg path#Extended_image\ wrap_3 {
        -webkit-animation-delay: calc(.25s * 3);
        animation-delay: calc(.25s * 3);
    }

    .menu-svg path#Extended_image\ wrap_4 {
        -webkit-animation-delay: calc(.25s * 4);
        animation-delay: calc(.25s * 4);
    }

    .menu-svg path#Extended_image\ wrap_5 {
        -webkit-animation-delay: calc(.25s * 5);
        animation-delay: calc(.25s * 5);
    }

    .menu-svg path#Extended_image\ wrap_6 {
        -webkit-animation-delay: calc(.25s * 6);
        animation-delay: calc(.25s * 6);
    }

    .menu-svg path#Extended_image\ wrap_7 {
        -webkit-animation-delay: calc(.25s * 7);
        animation-delay: calc(.25s * 7);
    }

    .menu-svg path#Extended_image\ wrap_8 {
        -webkit-animation-delay: calc(.25s * 8);
        animation-delay: calc(.25s * 8);
    }

    .menu-svg path#Extended_image\ wrap_9 {
        -webkit-animation-delay: calc(.25s * 9);
        animation-delay: calc(.25s * 9);
    }

    .menu-svg path#Extended_image\ wrap_10 {
        -webkit-animation-delay: calc(.25s * 10);
        animation-delay: calc(.25s * 10);
    }

    @-webkit-keyframes Hero_scale__-l05L {
        0% {
            opacity: 1;
            -webkit-transform: scale(1);
            transform: scale(1)
        }

        50% {
            opacity: .2;
            -webkit-transform: scale(.7);
            transform: scale(.7)
        }

        to {
            opacity: 1;
            -webkit-transform: scale(1);
            transform: scale(1)
        }
    }

    .menu-svg-2 {
        position: absolute;
        display: block;
        bottom: 0;
        right: -20px;
    }

    body.transperent.main-error header#header .mobile-nav-toggle {
        color: #425F57;
    }

    .navbar .menu-svg-2 {
        display: block;
    }

    .help-me-wrapper .help-me-image {
        text-align: center;
        padding-bottom: 20px;
        margin: 0 auto;
    }

    .help-me-wrapper {
        display: block;
    }

    .help-me-wrapper .help-me-p {
        padding-left: 0;
        max-width: 100%;
    }

    .wc-story-info .story-wrapper {
        display: block;
    }

    .wc-story-info .story-wrapper .story-image {
        text-align: center;
    }

    .story-content {
        padding-left: 0;
        padding-top: 15px;
        max-width: 100%;
    }

    .bredcum .bredcum-content p {
        max-width: 100%;
    }

    .bredcum {
        padding: 25px;
    }

    .bredcum .btn {
        padding: 10px 28px 5px;
        font-size: 18px;
    }

    .as-donation .donation-content .donation-p p {
        max-width: 90%;
    }

    #header .nav-menu-active .logo img,
    body.transperent.main-error #header .nav-menu-active .logo img {
        filter: invert(88%) sepia(25%) saturate(163%) hue-rotate(133deg) brightness(105%) contrast(105%);
    }

    body.transperent #header .nav-menu-active .logo img {
        filter: none;
    }

    .outer-box .btn-primary:active,
    .outer-box .btn-primary:focus {
        background-color: transparent;
        border-color: #000000;
        color: #000 !important;
    }

    .about-us-inner .about-svg2 {
        top: 41%;
        right: -7%;
    }

    .wc-donation .wc-donation-content .donation-child-img img,
    .wc-news-details .bredcrum .bredcrum-content h3 {
        width: 100%;
    }

    .wc-one-page-hero .wc-img .mouse-scroll {
        left: 42%;
    }

    .potfolio-ul .faq_wrapper .faq_title {
        font-size: 16px;
    }

    .main-timeline:before {
        display: none;
    }

    .main-timeline .timeline:nth-child(2) .timeline-content img,
    .main-timeline .timeline:nth-child(4n) .timeline-content img {
        width: 25%;
    }

    .wc-contact-us .wc-address-form .address {
        width: 100%;
    }

    /*<------- dropdown ------> */
    .navbar .dropdown ul {
        background: transparent;
        box-shadow: none;
        min-width: 100%;
        padding: 0px 0;
    }

    .navbar .dropdown ul a {
        font-size: 14px !important;
        color: #fff !important;
        position: relative;
        display: inline;
        padding: 0 !important;
    }

    .navbar .dropdown ul a i {
        font-size: 12px;
    }

    .navbar .dropdown:hover>ul {
        opacity: 1;
        visibility: visible;
    }

    .navbar .dropdown .dropdown ul {
        top: 0;
        left: calc(100% - 30px);
        visibility: hidden;
    }

    .navbar .dropdown .dropdown:hover>ul {
        opacity: 1;
        top: 0;
        left: 100%;
        visibility: visible;
    }

    .navbar ul li.dropdown svg {
        font-size: 13px;
        margin-left: 5px;
    }

    .navbar ul li.dropdown:hover a svg {
        transform: rotate(180deg);
        transition: all .6s;
    }

    .navbar li.dropdown ul li {
        border-left: 3px solid transparent;
    }

    .footer a.logo {
        max-width: 200px;
    }

    .events-info {
        padding: 20px;
    }

    .upcoming-events-wrapper {
        grid-gap: 15px;
    }

    .upcoming-events {
        padding: 60px 0;
    }



    .volunteer-grid-wrapper {
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 30px;
    }

    .volunte-section .volunte-image {
        max-width: 100%;
        margin-top: 20px;
    }

    .footer-two .official-info-two {

        margin-bottom: 30px;
    }

    .navbar-three .menu-toggle {
        display: block;
    }

    .navbar-three .nav-list {
        position: fixed;
        top: 0px;
        right: 0;
        bottom: 0;
        background: #343434;
        z-index: 999;
        width: 100%;
        padding: 20px;
        overflow-y: auto;
        display: none;
        transition: none;
    }

    .navbar-three ul {
        display: block;
        padding-right: 0;
        margin-top: 30px;
    }

    .navbar-three li {
        margin-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    .navbar-three li a {
        padding: 5px 8px;
        color: #ffffff !important;
        font-size: 15px;
        font-weight: 500;
        height: 50px;
    }

    .navbar-three .dropdown li a {
        color: #000 !important;
        height: 10px;
    }

    .navbar-three .dropdown:hover>ul {
        width: 100%;
    }

    .official-info-three .official-info-wrap p {
        display: none;
    }

    .official-info-three .official-info-wrap svg {
        border: 1px solid #CFFF8D;
        border-radius: 50px;
        padding: 10px;
    }

    .wc-story {
        right: 80%;
        bottom: 0px;
    }

    .volunteer-three .volunteer-three-team {
        margin-bottom: 30px;
    }

    .why-choose .donation-content .why-choose-image {
        margin-left: 0;
    }

    .latest-blog-three .latest-blog-three-wrap {
        flex-wrap: wrap;
    }

    .latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .event-three-text {
        padding: 10px;
    }

    .testimonial-three .testimonial-wrap {
        flex-wrap: wrap;
        justify-content: center;
    }

    .blog-grid .latest-blog-slider {
        gap: 20px;
    }

    .blog-grid .blog-info h3 {
        font-size: 16px;
        line-height: 27px;
    }

    .blog-details .blog-detail-image-wrap {
        grid-template-columns: repeat(2, 1fr);
    }

    .blog-details .blog-detail-image-wrap .blog-detail-image-grid {
        margin-top: 15px;
    }

    .blog-details .blog-details-title h3 {
        font-size: 26px;
        line-height: 36px;
    }

    .blog-details .blog-detail-section .blog-details-image {
        max-width: 100%;
    }

    .volunteers .people {
        flex-wrap: wrap;
        justify-content: center;
    }

    .volunteers .people-testimonial {
        flex-wrap: wrap;
        justify-content: center;
    }

    .volunteers .people-quotes {
        margin-left: 0px;
        margin-top: 20px;
    }

    .event-detail .event-detail-title h2 {
        font-size: 32px;
        line-height: 42px;
    }

    .process .process-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .lets-join {
        margin-top: 60px;
        margin-bottom: 60px;
    }

    .our-benefits .benefits-detail h2 {
        margin-top: 15px;
    }

    .career .career-top {
        justify-content: center;
    }

    .career .career-top .career-head .career-first-para {
        text-align: center;
    }

    .career .career-top .career-head h2 {
        text-align: center;
    }

    .career .career-top .career-head h2 {
        padding-top: 40px;
    }

    .career .career-top .career-head .career-first-para {
        margin-bottom: 15px;
    }

    .career .career-image {
        margin: auto;
        margin-bottom: 20px;
    }

    .Prebuild {
        margin-top: 50px;
        margin-bottom: 50px;
    }

    .inner-page {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .view-blog {
        padding-top: 50px;
        padding-bottom: 110px;
    }

    .function {
        margin-bottom: 50px;
    }

    .presentation-features .features-icon a {
        margin-left: auto;
        margin-right: auto;
    }

    .presentation-features .features-icon h6 {
        text-align: center;
    }

    .presentation-features .features-icon p {
        margin: 0 auto 20px;
        text-align: center;
    }

    .presentation-features {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .function .function-text {
        margin-top: 110px;
    }

    .faq-testimonial .people {
        flex-wrap: wrap;
        justify-content: center;
        gap: 90px;
        padding-top: 67px;
    }

    .faq-testimonial .people-says-testimonial {
        margin-bottom: 0px;
    }




    .become .become-contact .become-contact-info {
        width: 100%;
    }

    .become .become-contact .become-contact-thought {
        width: 100%;
    }

    .become .become-contact .contact-info {
        margin-left: 20px;
        margin-right: 20px;
        max-width: 100%;
    }

    .become .become-contact .become-contact-info h2 {
        margin-left: 20px;
    }

    .become .become-contact .become-contact-btn a {
        margin-left: 20px;
    }

    .donate-three .donate-three-image .donate-video-image {
        max-width: 325px;
        margin-left: auto;
        margin-right: 80px;
    }

    .donate-three .donate-three-text p {
        max-width: 100%;
        margin-top: 40px;
    }

    .donate-three .donate-three-image .donate-image01 {
        margin: auto;
    }

    .function .function-text p {
        max-width: 100%;
    }

    .volunteers .people-testimonial-box .people-image {
        margin-left: auto;
        margin-right: auto;
    }

    .menu_three_close {
        display: flex;
    }

    .faq .faq-hero-left .faq-svg {
        width: 300px;
        height: 300px;
    }

    .faq .faq-hero-right .faq-svg {
        width: 300px;
        height: 300px;
    }

    .faq {
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .faq-testimonial {
        margin-bottom: 50px;
        padding-top: 25px;
    }
}

@media only screen and (max-width: 768px) {
    .wc-story p::before {
        width: 150px;
        height: 150px;
    }

    .wc-story p {
        font-size: 18px;
        line-height: 30px;
    }

    .about-us {
        padding: 50px 0 130px;
    }

    .about-us .about-image {
        text-align: center;
        padding-top: 25px;
    }

    .about-svg2 {
        top: 62%;
    }

    .about-us-inner .about-svg2 {
        top: 65%;
        right: -2%;
    }

    .wc-donation-form .inner-success {
        padding: 50px 50px;
    }

    .donation-information .select-box input.form-control {
        margin: 0 !important;
    }

    .donation-information .custom-select,
    .wc-donation-form .inner-success .donation-information .form-control,
    .wc-donation-form .inner-success .inner-input .form-control,
    .wc-donation-form .inner-success .donation-information .select-box input.form-control,
    .donation-information .select-box {
        width: 100%;
        max-width: 100%;
    }

    .wc-donation-form .inner-success .wc-amount a p {
        font-size: 14px;
    }

    .wc-donation-form .inner-success .wc-amount a {
        margin-right: 2px;
        margin-bottom: 5px;
    }

    .wc-donation-form .inner-success h2 {
        font-size: 30px;
        padding-bottom: 10px;
    }

    .wc-donation-success .inner-success {
        padding: 50px 50px;
    }

    .wc-donation-success {
        padding: 50px 0 50px;
    }

    .as-donation .donation-content {
        display: block;
    }

    .faq_wrapper {
        width: 100%;
    }

    .as-donation .donation-content .donation-p p {
        max-width: 100%;
    }

    .wc-help-me {
        padding: 30px 0 30px;
    }

    .as-donation h2 {
        font-size: 25px;
        padding-bottom: 7px;
    }

    .faq_wrapper {
        margin-top: 0px;
    }

    .wc-story-info .story-wrapper .story-image img {
        width: 100%;
    }

    .wc-help-me .main-help-content {
        padding-bottom: 20px;
    }

    .wc-portfolio .portfolio-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .wc-one-page-hero .wc-img .mouse-scroll {
        left: 40%;
    }

    .potfolio-ul .faq_wrapper .faq_title {
        display: flex;
    }

    .potfolio-ul .faq_wrapper .faq_title:after {
        padding-left: 12px;
    }

    .faq_wrapper .faq_details .accordion-content p {
        padding-left: 0;
    }

    .main-timeline .timeline:nth-child(2n) .content-inner,
    .main-timeline .timeline:nth-child(5n) .content-inner {
        padding-top: 0;
    }

    /* .people-says-testimonial {
        margin-bottom: 80px;
    } */
}

@media only screen and (max-width: 767px) {
    .Hero_svg_ {
        width: 300px;
        height: 300px;
    }

    .half-width-p {
        max-width: 100%;
    }

    .no-caret-1 {
        order: 3;
    }

    .latest-news-content p {
        max-width: 90%;
        font-size: 16px;
    }

    .latest-news-content {
        padding-bottom: 25px;
    }

    .our-latest-news-section {
        padding-bottom: 50px;
    }

    .main-wc-what .wc-what-inner {
        display: block;
    }

    .main-wc-what .wc-what-inner img {
        width: 100%;
    }

    .main-wc-what .wc-what-inner .what-we-p {
        padding-left: 0;
    }

    .main-wc-what {
        margin-bottom: 20px;
    }

    .about-us-inner {
        margin-bottom: 50px;
    }

    .about-us h2.title {
        font-size: 20px;
        line-height: 28px;
    }

    .wc-about-us .wc-about-bg {
        background-size: cover;
        min-height: 280px;
        padding: 50px;
    }

    .wc-about-us .wc-about-bg h2 {
        left: auto;
        max-width: 100%;
        font-size: 40px;
        line-height: 50px;
    }

    .wc-donation .donation-inner-box h2 {
        font-size: 20px;
        padding-bottom: 10px;
    }

    .wc-about-us {
        margin-bottom: 20px;
    }

    .wc-donation .donation-st-inner p {
        padding-bottom: 17px;
    }

    .wc-donation .personal-info .nema-and-number {
        display: block;
    }

    .wc-donation .personal-info .form-control {
        max-width: 100%;
    }

    .wc-donation .donation-inner {
        padding-bottom: 10px;
    }

    .wc-donation {
        padding: 35px 0 35px;
    }

    .portfolio-details .portfolio-content p {
        max-width: 100%;
    }

    .portfolio-details .portfolio-content h3 {
        font-size: 18px;
        max-width: 100%;
        padding-bottom: 9px;
    }

    .wc-news-details .news-details-wrapper .news-details-p p {
        max-width: 100%;
    }

    .wc-news .news-title p {
        max-width: 100%;
    }

    .wc-news-details .news-details-content p.last-p {
        max-width: 100%;
    }

    .wc-news-details .news-details-content .news-details-image img.about-btn,
    .portfolio-details .portfolio-content img {
        width: 100%;
    }

    .portfolio-details .portfolio-content h2 {
        font-size: 24px;
        padding-bottom: 10px;
    }

    .wc-sponser .sponser-img {
        grid-column-gap: 0px;
        grid-template-columns: repeat(2, 1fr);
    }

    .wc-latest .single-cause-item {
        border-left: 1px solid transparent;
        padding-left: 0;
        margin-left: 0;
        padding-top: 20px;
    }

    .wc-latest .single-cause-item .cause-content {
        max-width: 100%;
    }

    .wc-latest .latest-image-content h2 {
        font-size: 18px;
        max-width: 100%;
    }

    .wc-chariti .project-img {
        grid-template-columns: repeat(2, 1fr);
    }

    .wc-help .wc-help-title p {
        max-width: 100%;
    }

    .wc-help .wc-help-title h2 {
        font-size: 35px;
    }

    .wc-sponser .sponser-title h2 {
        font-size: 36px;
    }

    .wc-help .help-event {
        padding: 0;
    }

    .wc-help {
        padding-bottom: 20px;
    }

    .wc-story {
        right: 40px;
    }

    .wc-latest .latest-title p {
        max-width: 100%;
    }

    .wc-timeline {
        padding: 40px 10px;
        margin-bottom: 50px;
    }

    .error .error-inner .error-title h2 {
        font-size: 250px;
        line-height: 230px;
    }

    .error .heart {
        width: 200px;
        height: 200px;
    }

    .error .heart img {
        width: 100px;
    }

    .error .error-inner p {
        font-size: 18px;
        padding-bottom: 25px;
    }

    .help-me-wrapper {
        padding-bottom: 15px;
    }

    .faq_wrapper .faq_title {
        font-size: 16px;
    }

    .faq_wrapper .faq_title:after {
        font-size: 14px;
    }

    .as-donation {
        padding-bottom: 30px;
    }

    .wc-two-page-hero .wc-hero {
        padding-right: 0px;
        text-align: center;
    }

    .hero-section h1 {
        font-size: 32px;
        padding-bottom: 20px;
        line-height: 42px;
        max-width: 282px;
        margin: 51px auto 22px;
    }

    .hero-section .wc-btn {
        margin-bottom: 20px;
        justify-content: center;
    }

    .wc-two-page-hero .wc-hero p {
        display: none;
    }

    .about-section .about-img-wrap {
        flex-wrap: wrap;
    }

    .about-section .about-img-wrap .image-wrap {
        width: 100%;
    }

    .donate-image-wrap .image-column {
        flex-wrap: wrap;
    }

    .donate-image-wrap .video-img {
        max-width: 100%;
    }

    .donate-image-wrap .image-column .img-1 {
        max-width: 100%;
        margin-right: 0;
        margin-bottom: 15px;
    }

    .donate-image-wrap .image-column .img-2 {
        max-width: 100%;
    }

    .donate-section .wc-story {
        right: 80%;
    }

    .donate-section .donate-text {
        text-align: start;
    }

    .upcoming-events .events-title p {
        max-width: 100%;
    }

    .upcoming-events-wrapper {
        grid-template-columns: repeat(1, 1fr);
    }


    .volunteer-info .volunteer-content {
        margin: -80px 30px 0;
    }

    .volunteer-info .volunteer-content {
        padding: 35px;
    }

    .volunte-section .volunte-content h4 {
        margin-top: 25px;
    }

    .latest-blog {
        margin: 50px 0;
    }

    h2.wc-sub-title {
        font-size: 30px;
    }

    .latest-blog .latest-blog-title {
        flex-wrap: wrap;
    }

    .slider-arrow {
        margin-top: 20px;
    }

    .testimonial-section .testimonial-para p {
        font-size: 16px;
        line-height: 26px;
    }

    .contact-form .nema-and-number,
    .contact-form .email-and-submit {
        flex-wrap: wrap;
    }

    .footer-two .official-info-two {
        margin-bottom: 30px;
    }

    .social-icon-three a {
        margin-left: 5px;
    }

    .hero-section-three h1 {
        font-size: 32px;
        line-height: 42px;
    }

    .hero-section-three p {
        font-size: 16px;
    }


    .wc-story {
        right: 85%;
    }

    .event-three .event-three-info .event-three-text p span {
        margin-bottom: 0;
    }

    .event-three .event-three-info .event-three-text h6 {
        margin-bottom: 0;
    }

    .volunteer-three .view-all-btn-three {
        margin-top: 20px;
    }

    .volunteer-three {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .latest-blog-three .latest-blog-three-wrap .latest-blog-three-info {
        flex-wrap: wrap;
        justify-content: center;
    }

    .latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .event-three-text {
        margin-left: 0;
    }

    .latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .event-three-text {
        padding: 15px;
        margin-top: -90px;
    }

    .latest-blog-three .latest-blog-title {
        flex-wrap: wrap;
    }

    .latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .event-three-text {
        margin-top: -140px;
        margin-left: 20px;
        margin-right: 20px;
    }

    .testimonial-three .testimonial-wrap .testimonial-left a {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .testimonial-three .testimonial-wrap .testimonial-left p {
        margin: 25px auto 15px;
    }

    .blog-grid .latest-blog-slider {
        flex-wrap: wrap;
    }

    .blog-details .blog-details-title h3 {
        font-size: 20px;
        line-height: 30px;
    }

    .blog-details .blog-detail-section .blog-details-image {
        max-width: 100%;
        margin-bottom: 25px;
    }

    .blog-details .blog-details-title p {
        font-size: 15px;
        line-height: 25px;
    }

    .blog-details .blog-detail-quotes h4 {
        font-size: 18px;
        line-height: 28px;
    }

    .blog-details .blog-detail-image-wrap {
        grid-template-columns: repeat(1, 1fr);
        margin: 30px auto;
    }

    .volunteers .volunteers-title {
        margin-top: 30px;
    }

    .volunteers .volunteers-image-wrap {
        flex-wrap: wrap;
    }

    .volunteers .people-testimonial-box .people-image {
        margin-left: auto;
        margin-right: auto;
    }

    .volunteers .people-quotes {
        margin-top: 15px;
    }



    .event-detail {
        margin-top: 30px;
        margin-bottom: 30px;
    }

    .event-detail .event-detail-title h2 {
        font-size: 22px;
        line-height: 32px;
    }

    .event-detail .event-progressbar h6 {
        margin-top: 22px;
    }

    .event-detail .support .support-left {
        flex-wrap: wrap;
        justify-content: center;
    }

    .event-detail .support .support-left .support-image-text {
        margin-left: 0px;
        margin-top: -110px;
    }

    .process .process-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .inner-page .inner-image-grid .page-img {
        max-width: 100%;
    }

    .Prebuild .prebuild-head h2 {
        font-size: 32px;
        line-height: 42px;
    }

    .Prebuild .Prebuild-image {
        margin: auto;
    }

    .inner-page .inner-head h2 {
        font-size: 32px;
        line-height: 42px;
    }

    .inner-page .load-btn {
        margin-top: 15px;
    }

    .view-blog .view-blog-title h2 {
        font-size: 32px;
        line-height: 42px;
    }

    .function .function-text h2 {
        font-size: 32px;
        line-height: 42px;
        margin-top: 90px;
    }

    .presentation-features .features-title h2 {
        font-size: 32px;
        line-height: 42px;
    }

    .presentation-footer .presentation-footer-contant h2 {
        font-size: 32px;
        line-height: 42px;
    }

    .presentation-footer .presentation-footer-contant .footer-logo {
        margin-bottom: 20px;
    }

    .function .function-form {
        margin-left: auto;
        margin-right: auto;
    }

    .faq-testimonial .people-testimonial-box .people-image {
        margin-left: auto;
        margin-right: auto;
    }

    .faq-testimonial .people-testimonial {
        flex-wrap: wrap;
        justify-content: center;
    }

    .faq-testimonial .people-quotes {
        margin-left: 0px;
        margin-top: 20px;
    }

    .faq-testimonial .people-testimonial .people-image-grid {
        width: 100%;
    }

    .become .become-volunteer-title h2 {
        font-size: 42px;
        line-height: 52px;
    }

    .become .become-volunteer-title {
        padding-top: 50px;
    }

    .donate-three .donate-three-image .donate-video-image {
        margin-right: 0px;
    }

    .volunteers .people-testimonial .people-image-grid {
        margin: auto;
    }

    .volunteers .people-testimonial {
        flex-direction: column;
    }
    
    .become .become-contact {
        flex-wrap: wrap;
    }

}

@media only screen and (max-width: 575px) {
    .Hero_svg_ {
        width: 150px !important;
        height: 150px !important;
    }

    .about-svg2 {
        top: 85%;
    }

    .about-svg {
        width: 150px;
        height: 150px;
    }

    .about-us {
        padding: 50px 0 60px;
    }

    .wc-help .wc-help-content {
        margin-left: 0;
    }

    .wc-story {
        right: 50px;
    }

    .about-us h2.title {
        margin-top: 5px;
    }

    .wc-one-page-hero .wc-img .mouse-scroll {
        left: 43% !important;
        bottom: -18px !important;
        top: 0;
        font-size: 16px;
        padding: 0;
    }

    .mouse-scroll .mouse {
        width: 50px;
        height: 50px;
    }

    .hero-section .wc-hero .wc-btn .btn {
        font-size: 14px;
        padding: 10px 18px 6px;
        margin-right: 10px;
    }

    .wc-contact-us .wc-contact-form h2 {
        font-size: 32px;
        padding-bottom: 10px;
    }

    .wc-contact-us .wc-contact-wrapper {
        display: inline-block;
    }

    .wc-contact-us .wc-address-form,
    .wc-contact-us .wc-contact-form {
        width: 100%;
    }

    .wc-contact-us .wc-address-form {
        padding: 35px 20px;
    }

    .wc-contact-us {
        padding: 30px 0;
    }

    .wc-portfolio .portfolio-grid {
        grid-template-columns: repeat(1, 1fr);
        grid-row-gap: 20px;
    }

    .wc-portfolio .portfolio-grid .portfolio-content .potfolio-img {
        text-align: center;
    }

    .portfolio-grid .portfolio-content:nth-child(4),
    .portfolio-grid .portfolio-content:nth-child(6),
    .portfolio-grid .portfolio-content:nth-child(5) {
        grid-column: auto;
        grid-row: auto;
    }

    .wc-portfolio .portfolio-title p {
        max-width: 100%;
    }

    .wc-chariti {
        padding-bottom: 90px;
    }

    .our-latest-news-section {
        padding-bottom: 50px;
    }

    .latest-news-slider {
        border-radius: 0;
        padding: 60px 0 30px;
    }

    .wc-contact .contact-title p {
        max-width: 100%;
    }

    .wc-contact .contact-title h2 {
        font-size: 25px;
        line-height: 30px;
    }

    .contact-form .nema-and-number,
    .contact-form .email-and-submit {
        display: block;
    }

    .contact-form .nema-and-number input,
    .contact-form .email-and-submit input {
        margin-bottom: 15px;
    }

    .wc-news-details .news-details-thumbnails {
        grid-template-columns: repeat(2, 1fr);
    }

    .wc-news-details .bredcrum .bredcrum-content h3 {
        font-size: 18px;
        line-height: 26px;
        max-width: 100%;
    }

    .wc-news .news-content h2 {
        font-size: 16px;
    }

    .wc-news .news-content .date {
        padding-bottom: 8px;
        padding-top: 13px;
    }

    .wc-news .news-content .date p {
        font-size: 14px;
    }

    .wc-help .help-event {
        padding-right: 0;
    }

    .wc-story.story-2 {
        left: -60%;
    }

    .error .heart {
        width: 130px;
        height: 130px;
    }

    .error .error-inner .error-title h2 {
        font-size: 135px;
        line-height: 150px;
    }

    .error .heart img {
        width: 70px;
    }

    .error_svg_2 {
        display: none;
    }

    .wc-donation-form .inner-success {
        padding: 30px 20px;
    }

    .wc-donation-form {
        padding: 50px 0 50px;
    }

    .wc-donation-success .inner-success .details-table {
        padding: 10px 10px 15px 10px;
    }

    .wc-donation-success .inner-success {
        padding: 30px 15px;
    }

    .wc-donation-success .inner-success h2 {
        font-size: 30px;
        padding-bottom: 15px;
    }

    .wc-donation-success .inner-success .payment-tabel .payment-tabel-success {
        overflow: scroll;
        white-space: nowrap;
        padding: 15px 15px 15px;
    }

    .wc-donation-success .payment-tabel .payment-tabel-success table th,
    .wc-donation-success .payment-tabel .payment-tabel-success table td {
        padding: 10px;
    }

    .help-me-wrapper .help-me-image img {
        width: 100%;
    }

    .wc-help-me .main-help-content h2.title {
        font-size: 32px;
    }

    .bredcum {
        display: block;
    }

    .bredcum .bredcum-content p {
        padding-bottom: 20px
    }

    .bredcum .bredcum-content h2 {
        font-size: 18px;
        padding-bottom: 5px;
    }

    .wc-story-info h2 {
        font-size: 32px;
        padding-bottom: 10px;
    }

    .wc-portfolio .portfolio-grid .portfolio-content:nth-child(5),
    .wc-portfolio .portfolio-grid .portfolio-content:nth-child(6) {
        grid-column: span 1;
    }

    .wc-news-details .news-details-wrapper .news-details-image img {
        width: 100%;
    }

    .main-timeline .timeline-content {
        width: auto;
    }

    .main-timeline .timeline-content img {
        width: 25%;
    }

    .main-timeline .timeline-content {
        padding: 15px;
    }

    .main-timeline .timeline,
    .main-timeline .timeline:nth-child(2) {
        margin: 10px 0 !important;
    }

    .latest-news-slider:before {
        left: 39%;
    }

    .hero-section h1 {
        font-size: 32px !important;
        margin: 10px auto 0px;
    }

    .about-section {
        padding-top: 40px;
    }

    .about-section h2.title {
        font-size: 20px;
        line-height: 30px;
    }

    .about-section .about-btn {
        margin-top: 26px;
    }

    .about-section .content-wrap {
        margin: 0 auto 45px auto;
    }

    .about-section .about-img-wrap {
        gap: 15px;
        margin-bottom: 50px;

    }

    .donate-section {
        padding: 50px 0 50px;
    }

    .donate-section .wc-story {
        right: 65%;
    }

    .spacing-margin {
        margin-bottom: 30px;
    }

    .volunteer-grid-wrapper {
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 30px;
    }

    .upcoming-events {
        padding: 35px 0;
    }

    .events-info h4 a {
        font-size: 18px;
        line-height: 28px;
    }

    .events-info {
        padding: 10px;
    }

    .events-info .events-content {
        padding-top: 10px;
    }

    .big-btn {
        font-size: 16px;
        padding: 9px 20px 7px 20px;
    }

    .loader-01 {
        height: 16px;
        width: 16px;
    }

    .volunteer-section {
        padding: 50px 0;
    }

    .volunteer-info .volunteer-content {
        margin: -80px 40px 0;
        padding: 15px;
    }

    .volunte-section .volunte-image {
        margin-top: 0;
    }

    .testimonial-section .testimonial-swiper-wrap {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .official-info-three .official-info-wrap svg {
        padding: 5px;
    }

    .social-icon-three a {
        width: 24px;
        height: 24px;
        font-size: 12px;
    }

    .hero-section-three .wc-btn .btn {
        padding: 10px 5px 6px;
        margin-right: 5px;

    }



    .our-donar .our-donar-head h2 {
        font-size: 30px;
        line-height: 40px;
    }

    .our-donar .our-donar-head p {
        margin-bottom: 20px;
    }

    .event-three .event-three-head h2 {
        font-size: 30px;
        line-height: 40px;
    }

    .event-three {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .event-three .event-three-info {
        flex-wrap: wrap;
    }

    .event-three .event-three-info .event-three-text h6 {
        font-size: 18px;
        line-height: 28px;
    }

    .event-three .event-three-info .event-three-text p {
        margin: 10px 0;
    }

    .volunteer-three .volunteer-three-head h2 {
        font-size: 30px;
        line-height: 40px;
    }

    .volunteer-three {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .why-choose .donation-content .faq_wrapper h2 {
        font-size: 30px;
        line-height: 40px;
    }

    .faq_wrapper .faq_item {
        padding: 15px 15px;
        margin: 0 auto 10px auto;
    }

    .why-choose {
        padding-bottom: 50px;
    }

    .latest-blog-three {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .volunteers .volunteers-title h2 {
        font-size: 32px;
        line-height: 42px;
    }

    .volunteers .volunteers-title p {
        margin: 0 auto 30px;
    }

    .volunteers .volunteers-team-title h2 {
        font-size: 30px;
        line-height: 40px;
        margin-top: 40px;
    }

    .event-detail .event-detail-title h2 {
        font-size: 20px;
        line-height: 30px;
    }

    .event-detail .event-detail-title p {
        font-size: 15px;
        line-height: 25px;
        margin-bottom: 20px;
    }

    .event-detail .event-detail-hero .event-detail-image {
        margin-bottom: 20px;
    }

    .event-detail .event-detail-hero {
        margin: 0 auto 20px;
    }

    .event-detail .support .support-left h6 {
        font-size: 18px;
        line-height: 28px;
    }

    .event-detail .support .support-left .support-image-text {
        padding: 22px;
        margin-top: -75px;
        margin-left: 20px;
        margin-right: 20px;
    }

    .event-detail .support .support-left p {
        max-width: 316px;
    }

    .event-detail .support .support-right h6 {
        font-size: 18px;
        line-height: 28px;
    }

    .event-detail .support {
        gap: 45px;
    }

    .event-detail .support-para {
        margin: 14px auto 0;
    }

    .testimonial .testimonial-title h2 {
        font-size: 32px;
        line-height: 42px;
    }

    .testimonial {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .testimonial .testimonial-title p {
        margin: 0 auto 42px;
    }

    .testimonial .testimonial-second-wrap {
        margin-top: 20px;
    }

    .testimonial .load-btn {
        margin: 0px auto 0;
    }

    .lets-join .lets-head h2 {
        font-size: 32px;
        line-height: 42px;
    }

    .lets-join {
        margin-top: 40px;
        margin-bottom: 40px;
    }

    .lets-join .lets-head p {
        margin: 0 auto 30px;
    }

    .lets-join .load-btn {
        margin-top: 15px;
    }

    .process .process-title h2 {
        font-size: 32px;
        line-height: 42px;
    }

    .process .process-title p {
        margin: 0 auto 30px;
    }

    .process {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .our-benefits .benefits-detail h2 {
        margin-top: 28px;
        margin-bottom: 28px;
        font-size: 30px;
        line-height: 40px;
    }

    .our-benefits .benefits-name {
        margin-bottom: 30px;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
    }

    .our-benefits .benefits-name .benefits-icon-para h5 {
        margin-bottom: 10px;
    }

    .career .career-top .career-head h2 {
        font-size: 32px;
        line-height: 42px;
    }

    .function .function-form {
        max-width: 160px;
    }

    .function .function-form .img-wrap-2 {
        bottom: -46px;
        max-width: 100px;
    }

    .function .function-form .img-wrap-1 {
        top: -47px;
        right: -52px;
        max-width: 100px;
    }

    .faq {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .faq .faq-title p {
        margin: 0 auto 40px;
    }


    .faq .faq-title h2 {
        font-size: 32px;
        line-height: 42px;
    }

    .become .become-volunteer-title h2 {
        font-size: 28px;
        line-height: 42px;
    }

    .become .become-volunteer-title p {
        max-width: 745px;
        margin-bottom: 35px;
    }

    .become .become-volunteer .become-volunteer-image {
        margin-bottom: 35px;
    }

    .become .become-volunteer h5 {
        margin-bottom: 30px;
        font-size: 18px;
        line-height: 28px;
    }

    .become .become-contact .become-contact-info h2 {
        font-size: 26px;
        line-height: 36px;
    }

    .become .become-contact .contact-info {
        margin-left: 15px;
        margin-right: 15px;
    }


    .career-apply-form {
        padding: 40px 20px !important;
        max-width: 410px !important;
        width: 100%;
    }
    .wc-donation-form .mfp-close {
        margin-right: 0px;
        margin-top: 50px;
    }

    .wc-donation-form .career-apply-form h2 {
        font-size: 24px;
    }

    .donate-three .donate-three-image .donate-video-image .lets-play {
        display: none;
    }

    .donate-three .donate-three-image .donate-image01 {
        max-width: 300px;
    }

    .donate-three .donate-three-image .donate-video-image {
        max-width: 200px;
    }

    .volunteers .people-says h2 {
        font-size: 30px;
        margin-top: 50px;
    }

    .volunteers .people {
        gap: 100px;
    }

    .volunteers .people-testimonial-box .people-image {
        margin-top: -75px;
    }

    .volunteers .people-testimonial-box {
        padding: 10px;
    }

    .event-three .event-three-info .event-three-image {
        max-width: 100%;
        width: 100%;
        margin-right: 0;
    }

    #hero .wc-hero {
        padding-bottom: 30px;
    }

    .footer-two .copy p {
        text-align: center;
        margin-bottom: 8px;
    }

    .footer-two .copy {
        flex-wrap: wrap;
        justify-content: center;
        margin-top: 25px;
    }

    .footer-two {
        padding: 50px 0 0;
    }

    .footer-two .footer-content-two img {
        padding-bottom: 22px;
    }

    .footer-two .footer-content-two p {
        padding-bottom: 22px;
    }

    .latest-blog {
        padding: 10px 0;
    }

    .wc-timeline .timeline-title h2 {
        font-size: 30px;
    }

    .latest-blog-three .latest-blog-three-wrap .latest-blog-three-info .blog-standard-text {
        background-color: #fff !important;
        box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
        margin-top: -90px;
    }

    .wc-portfolio .portfolio-title {
        text-align: center;
    }

    .blog-details .blog-detail-quotes .blog-detail-quotes-wrap {
        display: flex;
        margin-top: 26px;
    }

    .latest-blog .latest-blog-info .latest-blog-wrap h3 {
        font-size: 18px;
        line-height: 28px;
    }

    section.donate-three {
        padding-top: 15px;
        padding-bottom: 15px;
    }
    .btn {
        padding: 8px 20px 6px 20px;
    }
    .lets-join .lets-wrap a {
        padding: 7px 20px;
    }
}

@media only screen and (max-width: 480px) {
    p {
        font-size: 14px;
    }

    .hero-section h1 {
        font-size: 35px;
        line-height: 45px;
    }

    .wc-chariti .project-img {
        grid-template-columns: repeat(1, 1fr);
    }

    .what-we .wc-what-we h2 {
        font-size: 30px;
        padding-bottom: 14px;
        line-height: 35px;
    }

    .wc-about-us .wc-about-bg {
        background-size: cover;
        padding: 38px
    }

    .wc-donation .donation-inner-box {
        padding: 25px 10px;
    }

    .wc-news .news-wrapper {
        grid-template-columns: repeat(1, 1fr);
        grid-row-gap: 30px;
    }

    .wc-sponser .sponser-title h2 {
        font-size: 28px;
        padding-bottom: 10px;
    }

    .wc-latest {
        padding: 30px 15px;
        margin-bottom: 40px;
    }

    .wc-story.story-2 {
        left: -50%;
    }

    .wc-latest .latest-title h2 {
        font-size: 30px;
    }

    .main-timeline .content-inner .btn {
        padding: 3px 20px 3px;
        font-size: 14px;
    }

    .main-timeline .timeline-content img {
        max-width: 100px;
    }

    .main-timeline .timeline-content {
        width: auto;
    }

    .donation-information .select-box {
        display: block;
    }

    .donation-information .custom-select {
        margin-bottom: 10px;
    }

    .donation-information .custom-select.google {
        width: 100%;
    }

    .wc-contact-us .wc-contact-form {
        padding: 25px 25px;
    }

    .wc-donation-form .inner-success .donation-information .select-box input.form-control,
    .donation-information .custom-select select {
        text-align: left;
        padding: 10px 25px;
    }

    .wc-news-details .news-details-thumbnails {
        grid-template-columns: repeat(1, 1fr);
    }

    .latest-news-content h3 {
        font-size: 16px;
    }

    .latest-news-slider .slider-arrow svg {
        font-size: 14px;
    }

    .slider-arrow .swiper-button-prev,
    .slider-arrow .swiper-button-next {
        width: 25px;
        height: 25px;
    }
}

@media only screen and (max-width: 380px) {
    .outer-box {
        display: none !important;
    }

    .mouse-scroll .mouse {
        width: 40px;
        height: 40px;
    }

    .wc-news-details h2 {
        font-size: 22px;
        padding-bottom: 5px;
        line-height: 29px;
    }

    .wc-news-details p.date {
        font-size: 15px;
        padding-bottom: 16px;
    }

    .wc-story p::before {
        width: 135px;
        height: 135px;
    }

    .wc-story p {
        font-size: 16px;
        line-height: 26px;
    }

    .main-timeline .content-inner .btn {
        padding: 3px 12px 3px;
    }

    .wc-timeline .timeline-title h2 {
        font-size: 26px;
        line-height: 40px;
    }

    .bredcum {
        padding: 15px;
    }

    .main-timeline .timeline .timeline-content img,
    .main-timeline .timeline:nth-child(2) .timeline-content img,
    .main-timeline .timeline:nth-child(4n) .timeline-content img {
        width: 60%;
    }

    .latest-news-slider:before {
        left: 35%;
    }

    .about-us .about-image img {
        width: 100%;
    }
}