/* montserrat-regular - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/montserrat-v15-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('../fonts/montserrat-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/montserrat-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('../fonts/montserrat-v15-latin-regular.woff') format('woff'), /* Modern Browsers */ url('../fonts/montserrat-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('../fonts/montserrat-v15-latin-regular.svg#Montserrat') format('svg'); /* Legacy iOS */
}

#header_owl a img {
    width: 100%;
    height: 390px;
    object-fit: cover;
}

.box-before-donate {
    position: relative;
    border-top: 3px solid #FFC907;
    border-left: 3px solid #FFC907;
    border-right: 3px solid #FFC907;
    border-bottom: 0 solid #FFC907;
    border-radius: 8px 8px 0 0;
}

.position-absolute-donate {
    position: inherit;
    margin: auto;
    top: 0;
    right: 0;
}

.mt-donate {
    margin-top: 50px;
}

/*news*/
.news_scroll {
    overflow: auto;
    border-top: 1px solid grey;
    margin-bottom: 13px;

}

.news_scroll::-webkit-scrollbar {
    height: 5px;
}

.news_scroll::-webkit-scrollbar-track {
    background: #eaeaea; /* color of the tracking area */
    border-radius: 20px;
}

.news_scroll::-webkit-scrollbar-thumb {
    background-color: #FFA307; /* color of the scroll thumb */
    border-radius: 20px; /* roundness of the scroll thumb */
    border: transparent; /* creates padding around scroll thumb */

}

.news_padding_box {
    padding: 20px 20px 20px 20px;
}


.news_box_black_header h1 {
    font-size: 14px;
    color: white;
}

.news_box_black_header h2 {
    font-size: 12px;
    color: white;
}

.news_text_category li a {
    font-size: 12px;
}

.news_text_md {
    font-size: 12px;
}

.news_text_lg {
    font-size: 13px;
}


.news_box_black_header {
    background-color: black;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;

}

.news_box_black_header h1 {
    font-size: 20px;
    color: white;
}

.carousel-control-next {
    width: 100px;
    z-index: 9999999999 !important;
}

.carousel-control-prev {
    width: 100px;
    z-index: 9999999999 !important;
}

.news_box_black_header h2 {
    font-size: 16px;
    color: white;
}

.news_input_search::placeholder {
    color: black;
}

.news_input_search {
    outline: none !important;
    border: none !important;
    width: 100%;
    box-shadow: none !important;
    font-size: 14px;
    color: black;
}

.news_input_search:focus {
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
}

.news_input_border_search {
    border-bottom: 1px solid black;
}

.news_border_left {
    width: 2px;
    height: 25px;
    background-color: #FFC907;
    border-radius: 5px;
}

.news_border_left1 {
    width: 3px;
    height: 20px;
    background-color: #FFC907;
    border-radius: 5px;
}

.border-Link {
    text-decoration: underline;
}

.news_title {
    position: relative;
    width: 100%;
    border-bottom: 1px solid black;
}

.news_title a {
    background-color: white;
    padding: 5px 0px 5px 15px;
    position: absolute;
    right: 0;
    top: -20px;
}

.news_title p {
    position: absolute;
    left: 0;
    top: -30px;
    background-color: white;
    padding: 5px 15px 5px 0;
}

.news_title p span {
    font-size: 25px;
}

.news_cover_video {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: rgba(255, 255, 255, 0.4);
    z-index: 11;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/*end-news*/

.size-auto-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.drop-news {
    top: 0;
    height: 300px;
    overflow: auto;
    padding: 10px;
    background-color: #fbfbfb;
}

.size-logo {
    width: 150px;
}

.position-absolute-news {
    position: absolute;
    z-index: 1;
    bottom: 0;
    width: 100%;
    height: 100%;
    left: 0;
    display: block;
    padding: 0 10px 0 22px;
}

.position-absolute-news label {
    position: absolute;
    top: 20px;
    left: 10px;
    display: block;
}

.position-absolute-news h2 {
    position: absolute;
    bottom: 10px;
    left: 0;
    padding-left: 15px;

}

.position-absolute-news h5 {
    position: absolute;
    bottom: 20px;
    left: 10px;
}

.select2-container--default .select2-selection--single {
    border: 2px solid rgba(224, 224, 224, 0.57) !important;
}

.drop-news::-webkit-scrollbar {
    width: 6px; /* width of the entire scrollbar */
}

.img-news {
    height: auto;
}

.drop-news::-webkit-scrollbar-track {
    background: lightgray; /* color of the tracking area */
    border-radius: 20px;
}

.drop-news::-webkit-scrollbar-thumb {
    background-color: #ffbb07; /* color of the scroll thumb */
    border-radius: 20px; /* roundness of the scroll thumb */
    border: transparent; /* creates padding around scroll thumb */
}

.mt-education {
    margin-top: 70px;
}

.height-body-employees {
    height: 130px;
}

.img-prayroom {
    border-radius: 8px 8px 0 0 !important;
}

.height-title-employees {
    height: 50px;
}

.height-title-employees2 {
    height: 65px;
}

.select2-container--default .select2-results > .select2-results__options {
    min-height: 300px !important;
}

.select2-container--default {
    font-size: 13px !important;
}

.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar {
    width: 6px; /* width of the entire scrollbar */
}

.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar-track {
    background: lightgray; /* color of the tracking area */
    border-radius: 20px;
}

.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar-thumb {
    background-color: #ffbb07; /* color of the scroll thumb */
    border-radius: 20px; /* roundness of the scroll thumb */
    border: transparent; /* creates padding around scroll thumb */
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

#news .slick-slide {
    margin-right: 10px;
    margin-left: 10px;
}

.mt-coming {
    margin-top: 70px;
}

.border-sm-what:before {
    content: "";
    border-left: 3px solid #FFC907;
    width: 3px;
    height: 100%;
    position: absolute;
    z-index: -1;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
}

.img-team {
    max-width: 150px;
    max-height: 150px;
    border-radius: 50%;
    margin: auto;
}

.img-employee {
    width: 225px;
    height: 225px;
    border-radius: 50%;
}

.bg-employee:before {
    content: '';
    position: absolute;
    right: 0;
    left: 0;
    background-color: #ffbb07;
    top: 100px;
    height: 200px;
    width: 100%;
    z-index: -1;
}

.bg-employee1:before {
    content: '';
    position: absolute;
    right: 0;
    left: 0;
    background-color: #ffbb07;
    top: 70px;
    height: 140px;
    width: 100%;
    z-index: -1;
}

.text-red-team {
    color: #db545a;
}

.mt-about {
    margin-top: 80px;
}

.mt-mission {
    margin-top: 70px;
}

.mt-Vision-about {
    margin-top: 70px;
}

.spacing-number {
    letter-spacing: .06rem;
}

.mt-our-store {
    margin-top: 50px;
}

.mt-who-we-are {
    margin-top: 80px;
}

.mt-who {
    margin-top: 80px;
}

.mt-How-Can-You-Help {
    margin-top: 80px;
}

.mt-running {
    margin-top: 80px;
}

.mt-where-operate {
    margin-top: 80px;
}

.mt-community {
    margin-top: 80px;
}

.mt-news {
    margin-top: 80px;
}

.mt-testimonies {
    margin-top: 50px;
}

.mt-title-news {
    margin-top: 50px;
}

.slide.slick-slide {
    pointer-events: none !important;
}

.slide.slick-slide.slick-center {
    pointer-events: inherit !important;
}

* {
    font-family: Montserrat;
}

.opacity {
    opacity: .5;
}

a {
    text-decoration: none;
    color: black;
}

.text-white-commiunity {
    color: black;
}

.cursor {
    cursor: pointer;
}


.position-absolute-news label {
    border: 1px solid #ffbb07;
    border-radius: 8px;
    padding: 5px 8px;
    color: #ffbb07;
}

.position-sticky-news {
    position: inherit;
}

.category-sm {
    background-color: #f4f4f4;
    border-radius: 8px;
    height: 200px;
    overflow: auto;
    margin: 20px 0;
}

.category-sm::-webkit-scrollbar {
    width: 6px; /* width of the entire scrollbar */
}

.category-sm::-webkit-scrollbar-track {
    background: lightgray; /* color of the tracking area */
    border-radius: 20px;
}

.category-sm::-webkit-scrollbar-thumb {
    background-color: #ffbb07; /* color of the scroll thumb */
    border-radius: 20px; /* roundness of the scroll thumb */
    border: transparent; /* creates padding around scroll thumb */
}

.position-absolute-news h1 {
    font-size: 15px;
    color: white;
}

.bold-news {
    font-size: 15px;
    color: #ffbb07;
    font-weight: bolder;
}

.img-size-new {
    width: 100%;
}

#collapseSort ul li .active {
    font-weight: bolder;
}

.nextArrowBtn {
    position: absolute;
    z-index: 1000;
    bottom: -50px;
    right: 45%;
    color: #000;
    font-size: 20px;
    cursor: pointer;
}

.prevArrowBtn {
    position: absolute;
    z-index: 1000;
    bottom: -50px;
    left: 45%;
    color: #000;
    font-size: 20px;
    cursor: pointer;

}

.hidden-overflow {
    overflow: hidden;
}

.file {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.file > input[type='file'] {
    display: none
}

.file > label {
    font-size: 13px;
    font-weight: 300;
    cursor: pointer;
    outline: 0;
    user-select: none;
    border-color: rgb(216, 216, 216) rgb(209, 209, 209) rgb(186, 186, 186);
    border-style: solid;
    border-radius: 8px;
    border-width: 1px;
    background-color: hsl(0, 0%, 100%);
    color: hsl(0, 0%, 29%);
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 8px;
    padding-bottom: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 !important;
    transition: all .3s;
}

.file > label:hover {
    color: white;
    background-color: #1b1e21;
    transition: all .3s;

}

.file > label:hover .upload-icon {
    width: 14px;
    height: 14px;
    background: url("../img/white-upload.svg") no-repeat center;
    background-size: 100% 100%;

}

.upload-icon {
    width: 14px;
    height: 14px;
    background: url("../img/upload.svg") no-repeat center;
    background-size: 100% 100%;
}

.img-pray {
    border-radius: 8px 8px 0 0;
    width: 300px !important;
}

.img-pray1 {
    border-radius: 8px 8px 0 0;
}

.form-comment {
    background-color: #E8E8E8;
    width: 100%;
    border-radius: 8px;
}

#volunteerStore input, select {
    height: 38px !important;
}

.form-comment-input {
    background-color: #E8E8E8;
    width: 100%;
    height: 100%;
    padding: 10px 0;
}

.height-footer {
    height: 700px;
}

.height-footer-help {
    height: 800px;
}

.evenDiv div:first-child img {
    max-width: 100%;
    height: 298px;
}

.evenDiv div:last-child img {
    max-width: 100%;
    height: 157px;
}

.oddDive div:first-child img {
    max-width: 100%;
    height: 157px;
    margin-top: 40px;
}

.oddDive div:last-child img {
    max-width: 100%;
    height: 298px;
}

#circle_chevron-left {
    border: 1px solid #BDBDBD;
    border-radius: 50%;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background-color: white;

}

#circle_chevron-right {
    border: 1px solid #BDBDBD;
    border-radius: 50%;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background-color: white;


}

#circle_chevron-left:hover {
    color: #ffbb07;
    border: 1px solid #ffbb07;

}

#circle_chevron-right:hover {
    color: #ffbb07;
    border: 1px solid #ffbb07;

}

.bg-nav {
    background-color: transparent;
    transition: all 0.5s;
    padding-top: 5px !important;
    padding-bottom: 5px !important;

}

.nav-logo {
    background: url("../img/black-logo.png") no-repeat center;
    background-size: 100%;
    width: 80px;
    height: 37px;
}

.white-nav-logo {
    background-size: 100% 100%;
    background-image: url("../img/white-logo.png") !important;
    background-position: center;
    background-repeat: no-repeat;
    width: 80px;
    height: 37px;
}

.navbar-nav .nav-item .nav-link {
    color: #ffffff;
}

.color-nav {
    color: white !important;
}

.fix-navbar {
    transition: all 0.5s;
    position: fixed;
    width: 100%;
    z-index: 1000;
    top: 0;
    left: 0;
    right: 0;
    background-color: #000 !important;

}

.circle-li {
    width: 8px;
    height: 8px;
    border-radius: 50px;
    animation: opacity 1s infinite;

}

textarea {
    resize: none;
}

textarea:focus {
    box-shadow: none !important;
    outline: none !important;
    border: 1px solid #CFCFCF !important;

}

.circle-li1 {
    width: 8px;
    height: 8px;
    border-radius: 50px;
    animation: opacity1 1s infinite;

}

@keyframes opacity1 {
    0% {
        transform: scale(1);
        opacity: 0;
        background-color: #000;
    }
    50% {
        opacity: 1;
        transform: scale(1.4);
        background-color: #000;

    }
}

@keyframes opacity {
    0% {
        transform: scale(1);
        opacity: 0;
        background-color: #ffbb07;
    }
    50% {
        opacity: 1;
        transform: scale(1.4);
        background-color: #ffbb07;

    }
}

.navbar-brand img {
    width: 80px;
}

ul li {
    list-style-type: none;
}

a:hover {
    text-decoration: none;
    color: black;
}

.other-amount {
    border-radius: 8px;
    border: 1px solid #CFCFCF;
    padding: 8px 5px;
    background-color: #E9EAE4;
    width: 100%;
}

.btn-yellow:hover {
    background-color: #ff9c07;
}

.btn-yellow {
    background-color: #ffbb07;
    color: black;

}

.btn:focus {
    box-shadow: none !important;
}

.other-amount::placeholder {
    color: black;
    text-align: center;
}

.img-header {
    background: url("../img/small_header.jpg");
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    height: 480px !important;
    position: relative;
}


.navbar-nav li {
    position: relative;
}

.navbar-nav .active::after,
.navbar-nav li:hover::after {
    border-bottom: 3px solid #FFC907;
    content: "";
    border-radius: 20px;
    height: 3px;
    position: absolute;
    width: 30px;
    left: 9px;
}

.border-radius {
    border-radius: 20px;
}

.mt-header {
    margin-top: 135px;
}

.mt-vision {
    margin-top: 50px;
}

.mt-header-video {
    margin-top: 40px;
}

.mt-title {
    margin-top: 170px;
}

.mt-title-head {
    margin-top: 10px;
}

.mt-show-news {
    margin-top: 70px;
}

.mt-gallery {
    margin-top: 100px;
}

.InputGroup {
    display: flex;
    flex-wrap: wrap;
}

input[type="radio"] {
    visibility: hidden;
    height: 0;
    width: 0;
}

textarea {
    border-radius: 8px;
    border: 2px solid #eeeeee !important;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.border-radius-sm {
    border-radius: 8px;
}

.InputGroup label span {
    font-weight: 500;
}

label:last-of-type {
    margin-right: 0;
}

.InputGroup input[type="radio"]:checked + label {
    border: 1px solid #CFCFCF;
    border-radius: 8px;
    color: #E9EAE4;
    background-color: black;
}

.InputGroup input[type="radio"]:hover:not(:checked) + label {
    border: 1px solid #CFCFCF;
    border-radius: 8px;
    color: #E9EAE4;
    background-color: black;
}

.img-video {
    position: relative;

}

.img-video img {
    border-radius: 15px;
    width: 153px;
    height: 104px;
}

.img-video-listen {
    position: relative;

}

.w-100-run {
    width: 100%;
}

.img-testimonies {
    border-radius: 15px;
    width: 100%;
    height: 100%;
    object-fit: cover;

}

.cover-news
.cover-listen {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.39);
    z-index: 11;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.img-video-listen-news {
    position: relative;
}

.img-video-listen-news img {
    border-radius: 15px;
    width: 84px;
    height: 79px;
}

.cover-news img {
    width: 20px !important;
}

.cover-news {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.39);
    z-index: 11;
    width: 100%;
    height: 79px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cover-news-head {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.39);
    z-index: 1;
    width: 100%;
    height: 100%;
    border-radius: 8px;
}

.cover-news img {
    width: 25px;
}

.cover {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.39);
    z-index: 11;
    width: 100%;
    height: 104px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}


.shadow {
    box-shadow: 0 .5rem 1rem rgba(142, 142, 142, 0.18) !important
}

.cover img {
    width: 45px;
}

.cover-listen img {
    width: 45px !important;
}

.img-video-listen:hover .cover-listen img {
    animation: animat-plays 1s infinite;
}

.img-video-listen-news:hover .cover-news img {
    animation: animat-plays 1s infinite;
}

.slide a:hover .play-icon img {
    animation: animat-plays 1s infinite;

}

@keyframes animat-plays {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.2);
    }
}

.img-video:hover .cover img {
    animation: animat-play 1s infinite;
}

.animate-iconPlay:hover .cover-video img {
    animation: animat-play 1s infinite;

}

@keyframes animat-play {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.2);
    }
}


.img-down-icon {
    animation: icon 1s infinite;
}

@keyframes icon {
    0% {
        transform: translateY(1px);
    }
    50% {
        transform: translateY(9px);
    }
}

.img-size-galleries {
    display: flex;
    justify-content: center;
}

.img-size-galleries img {
    width: 174px;
    height: 298px;
    cursor: pointer;
}

.img-scale {
    width: 552px;
    height: 371px;
    border-radius: 8px;
}

.img-size-galleries-sm img {
    width: 174px;
    height: 157px;
    cursor: pointer;
}

.height-galleries {
    height: 600px;
}

.position-absolute-title {
    position: absolute;
    top: -10px;
    left: 30px;
    background-color: transparent;
}

.position-relative-title {
    border-top: 3px solid #FFC907;
    position: relative;
    height: 3px;
    border-radius: 10px;
    width: 30px;
    z-index: 1;
}

.position-absolute-title-event {
    /*position: absolute;*/
    top: -19px;
    left: 100px;
    background-color: transparent;
}


.img-abut-us:before {
    content: "";
    position: absolute;
    border: 3px solid #FFC907;
    width: 80%;
    height: 60%;
    top: -30px;
    right: -20px;
    border-radius: 8px;
    z-index: -1;
    display: none;
}

.img-abut-us img {
    z-index: 1;
}

.img-help-us:before {
    content: "";
    position: absolute;
    border: 3px solid #FFC907;
    width: 75%;
    height: 90%;
    top: -30px;
    left: -20px;
    border-radius: 8px;
    z-index: -1;
    display: none;
}

.img-help-us img {
    z-index: 1;
}

.border-box-who {
    border: 2px solid #E6E6E6;
    border-radius: 8px;
    background-color: white;
    transition: all 0.3s;

}

.border-box-who1 {
    background-color: #FFC907;
    cursor: pointer;
    transition: all 0.3s;
    border-radius: 8px;
    border: 2px solid #FFC907;
    box-shadow: 0 .125rem .5rem rgba(255, 201, 7, 0.58) !important

}

.img-icon {
    -moz-background-image: url("../img/eduqation-gray.png");
    background-image: url("../img/eduqation-gray.png");
    -webkit-background-image: url("../img/eduqation-gray.png");
    -o-background-image: url("../img/eduqation-gray.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    width: 40px;
    height: 40px;
    transition: all 0.3s;
}

.border-box-who:hover .img-icon {
    -moz-background-image: url("../img/eduqation-dark.png") !important;
    background-image: url("../img/eduqation-dark.png") !important;
    -webkit-background-image: url("../img/eduqation-dark.png");
    -o-background-image: url("../img/eduqation-dark.png") !important;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    width: 40px;
    height: 40px;
    transition: all 0.3s;
}

.img-icon1 {
    -moz-background-image: url("../img/chicken-thigh-gray.png");
    background-image: url("../img/chicken-thigh-gray.png");
    -webkit-background-image: url("../img/chicken-thigh-gray.png");
    -o-background-image: url("../img/chicken-thigh-gray.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    width: 40px;
    height: 40px;
    transition: all 0.3s;
}

.border-box-who:hover .img-icon1 {
    -moz-background-image: url("../img/chicken-thigh-dark.png") !important;
    -webkit-background-image: url("../img/chicken-thigh-dark.png") !important;
    background-image: url("../img/chicken-thigh-dark.png") !important;
    -o-background-image: url("../img/chicken-thigh-dark.png") !important;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    width: 40px;
    height: 40px;
    transition: all 0.3s;
    z-index: 99;
}

.img-icon2 {
    -moz-background-image: url("../img/care-gray.png");
    background-image: url("../img/care-gray.png");
    -webkit-background-image: url("../img/care-gray.png");
    -o-background-image: url("../img/care-gray.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    width: 40px;
    height: 40px;
    transition: all 0.3s;
}

.border-box-who:hover .img-icon2 {
    -moz-background-image: url("../img/care-dark.png") !important;
    background-image: url("../img/care-dark.png") !important;
    -webkit-background-image: url("../img/care-dark.png") !important;
    -o-background-image: url("../img/care-dark.png") !important;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    width: 40px;
    height: 40px;
    transition: all 0.3s;
    z-index: 99;

}

.img-icon3 {
    -moz-background-image: url("../img/heartbeat-gray.png");
    background-image: url("../img/heartbeat-gray.png");
    -webkit-background-image: url("../img/heartbeat-gray.png");
    -o-background-image: url("../img/heartbeat-gray.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    width: 40px;
    height: 40px;
    transition: all 0.3s;
    z-index: 99;

}

.border-box-who:hover .img-icon3 {
    -moz-background-image: url("../img/heartbeat-dark.png") !important;
    background-image: url("../img/heartbeat-dark.png") !important;
    -webkit-background-image: url("../img/heartbeat-dark.png") !important;
    -o-background-image: url("../img/heartbeat-dark.png") !important;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    width: 40px;
    height: 40px;
    transition: all 0.3s;
    z-index: 99;

}


.height-text {
    height: 90px;
}

.height-text-news {
    height: 60px;
}

.height-text-video {
    height: 95px;
}

.border-box-who:hover .text-box-title {
    color: #000;
    transition: all 0.3s;
}

.text-box-body {
    color: #707070;
    transition: all 0.3s;
}

.border-box-who:hover .text-box-body {
    color: #000;
    transition: all 0.3s;
}

.text-box-title {
    color: #707070;
    transition: all 0.3s;
}

.border-box-who:hover {
    background-color: #FFC907;
    cursor: pointer;
    transition: all 0.3s;
    border: 2px solid #FFC907;
    box-shadow: 0 .125rem .5rem rgba(255, 201, 7, 0.58) !important

}

.shadow-sm-yellow {
    box-shadow: 0 .125rem .5rem rgba(255, 201, 7, 0.5) !important
}

input, select {
    border: 2px solid rgba(224, 224, 224, 0.57) !important;
    border-radius: 5px;
}

input, select:focus {
    box-shadow: none !important;
    outline: none;
    border: 2px solid rgba(224, 224, 224, 0.57) !important;

}

/*circle-progressbar*/


/*===== The CSS =====*/
.progress {
    width: 61px;
    height: 61px;
    background: none;
}

.large-progress {
    width: 61px !important;
    height: 61px !important;
    background: none;
}

.progress .track, .progress .fill {
    fill: rgba(0, 0, 0, 0);
    stroke-width: 8;
    transform: rotate(90deg) translate(0px, -80px);
}

.progress .track {
    stroke: #E9EAE4;
}

.progress .fill {
    stroke: rgb(255, 255, 255);
    stroke-dasharray: 219.99078369140625;
    stroke-dashoffset: -219.99078369140625;
    transition: stroke-dashoffset 1s;
}

.progress.blue .fill {
    stroke: #FFC907;
}

.progress.green .fill {
    stroke: rgb(186, 223, 172);
}

.progress .value, .progress .text {
    fill: rgb(0, 0, 0);
    font-weight: bolder;
    font-size: 17px;
    text-anchor: middle;
}

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: default;
}

/*circle-progressbar*/

.bg-img-event {
    background: none;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: auto;
    position: relative;
}

.text-white-event {
    color: black;
}

.position-absolute-event {
    position: inherit;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1;
}

.height-title-event {
    height: 45px;
}

.height-text-listen {
    height: auto;
}

.spacing {
    white-space: nowrap;
}

.textbox {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    outline: none;

    font: inherit; /* From .input-group */

    border: 1px solid transparent;
    padding-top: calc(0.5em - 1px);
    padding-bottom: calc(0.5em - 1px);
    padding-left: calc(0.5em - 1px);
    padding-right: calc(0.5em - 1px);
    border-radius: 2px; /* Your style */
}

.textbox::placeholder {
    opacity: 0.35; /* Your style */
}

/* ICONS Base Syle
------------------------------------------
** 1. Color
** 2. Size and position (only top)
** 3. Center content
** 4. Transition animation
** 5. Disable mouse clicks
--------------------------------------- */
.icon {
    color: inherit; /* From input-group */
    opacity: 0.35; /* Same as placeholder */
    width: 2.5em;
    height: 2.5em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: opacity .24s ease-in-out;
    /*   background-color: rgba(0,0,200, 0.3);  */
}

/* Optional */
.icon.bg {
    background-color: rgba(0, 0, 0, 0.3);
}

/* INPUT GROUP (input + icons wrapper)
** REMs = textbox size
--------------------------------------- */
.input-group {
    background: transparent;
    border-radius: 8px; /* Your style */
    border: 1px solid #fff;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.input-group:not(:last-of-type) {
    margin-bottom: 1.5rem; /* Optional */
}

/* The textbox takes all the remining space */
.input-group .textbox {
    flex-grow: 1;
    font-size: 14px;
}

.input-group .textbox::placeholder {
    color: white;
}

/* When icon as prefix */
.icon:not(.bg) ~ .textbox {
    padding-left: 0; /* Removes left padding */
}

/* When icon as suffix */
.textbox ~ .icon:not(.bg) {
    margin-left: calc(1px - 0.5em); /* Removes right padding */
}

/* INPUT GROUP FOCUS
** Draws an outline
--------------------------------------- */
.outline {
    /* pointer-events: none; /* Disable click */
    cursor: pointer;
}

/* box around the input-group */
.outline::after {
    content: '';
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: calc(100% - 1px);
    height: calc(100% - 1px);
    border-radius: 2px; /* Your style */
    transition: box-shadow 0.3s ease; /* Your style */
}

.height-text-campain {
    height: 40px;
}

.position-absolute-nav {
    position: absolute;
    top: 47px;
    left: 0;
    right: 0;
    background-color: black;
    z-index: 999;
    padding: 10px;

}

.position-absolute-nav1 {
    position: absolute;
    top: 70px;
    left: 0;
    right: 0;
    background-color: #fff;
    z-index: 999;
    padding: 10px;

}

.box-our-mission {
    border-top: none;
    border-right: none;
    border-bottom: none;
    width: 100%;
    height: 170px;
    position: relative;
    border-radius: 0px 8px 8px 0;
}

.box-our-message {
    border-top: none;
    border-right: none;
    border-bottom: none;
    width: 100%;
    height: auto;
    position: inherit;
    border-radius: 0;
}

.position-absolute-vision {
    width: 100%;
}

.position-absolute-vision:before {
    display: none;
}

.img-our {
    width: 138px;
    height: 140px;
    border-radius: 8px;
}

.img-our1 {
    width: 138px;
    height: 100%;
    border-radius: 8px;
}

.img-our2 {
    width: 267px;
    height: 100%;
    border-radius: 8px;
}

.position-absolute-our-mission {
    position: inherit;
    display: flex;
    align-items: center;
    justify-content: center;
}

.position-absolute-message {
    position: inherit;
    width: 100%;
    height: auto;
}

.position-absolute-our-mission1 {
    position: absolute;
    right: 30px;
    top: 120px;
}

.btn-outline-yellow {
    border: 1px solid #FFC907;
    color: #FFC907;
    background: transparent;
    border-radius: 8px;
    padding: 8px 12px;
}

.btn-outline-yellow:hover {
    border: 1px solid #FFC907;
    color: #fff;
    background: #FFC907;
    border-radius: 8px;
    padding: 8px 12px;
    transition: all .3s;
}

.btn-outline-yellow:hover .img-arrow {
    background: url("../img/arrow-white.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    width: 18px;
    height: 18px;

}

.img-arrow {
    background: url("../img/arow-yellow.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    width: 18px;
    height: 18px;

}

.img-header-help {
    margin-top: 60px;
    background: url("../img/header-help.png");
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    height: 420px;
    padding-top: 50px;
}

.img-header-help1 {
    margin-top: 60px;
    background: url("../img/need-help.png");
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    height: 420px;
    padding-top: 50px;
}

.img-contact {
    margin-top: 60px;
    background: url("../img/contact.png");
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    height: 400px;
    padding-top: 50px;
}

.img-header-video {
    margin-top: 80px;
    background: #f7f7f7;
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    height: 500px;
    padding-top: 50px;
    border-radius: 0 0 90px 90px;
    box-shadow: 2px 2px 5px 2px #e4e4e4;
}

.position-absolute-form-help {
    width: 100%;
    position: absolute;
    top: 250px;
}

.position-absolute-form-contact {
    width: 100%;
    position: absolute;
    top: 230px;
}

.box-what {
    display: none;
}

.img-what {
    position: inherit;
    top: -70px;
    left: 0;
    z-index: 1;
}

.img-what img {
    border-radius: 8px;
    z-index: -2;
}

.img-what1 {
    position: inherit;
    margin-top: 60px;
}

.img-what2 img {
    border-radius: 8px;
    z-index: 1;
}

.img-what2 {
    position: inherit !important;
    margin-top: 80px;
}

.img-what1 img {
    border-radius: 8px;
    z-index: 1;
}

.text-box-what {
    position: inherit;
    margin-top: 100px;

}

.text-box-what-medical {
    position: inherit;
    margin-top: 300px;
}

.text-box-food {
    position: inherit;
    margin-top: 300px;

}

.text-box-HUMANITARIAN {
    position: inherit;
    margin-top: 300px;

}

.position-relative-title-what {
    border-top: 3px solid #FFC907;
    position: relative;
    height: 3px;
    border-radius: 10px;
    width: 40px;
    display: block;
    z-index: 1;
}

.position-absolute-mortarboard img {
    position: absolute;
    top: 600px;
    left: -60px;
    background-color: #fff;
    padding: 10px;
}

.position-absolute-heart img {
    position: absolute;
    top: 900px;
    right: -60px;
    background-color: #fff;
    padding: 10px;
}

.position-absolute-chicken img {
    position: absolute;
    top: 1700px;
    left: -60px;
    background-color: #fff;
    padding: 10px;
}

.position-absolute-care img {
    position: absolute;
    top: 2970px;
    right: -60px;
    background-color: #fff;
    padding: 10px;
}

.img-contact-icon {
    width: 41px;
    height: 41px;
}

.mt-title-2 {
    margin-top: 70px !important;
}

.text-community {
    color: black;
}

.bg-footer {
    background-color: black;
    border-top: 8px solid #FFC907;
    border-radius: 20px 20px 0 0;
    width: 100%;
    min-height: 315px;
    display: flex;
    align-items: center;
    margin-top: 0;
}

.position-relative-login {
    position: relative;
    border-top: 2px solid #DEE2E6;
    width: 100%;
    z-index: 1;
}

.text-login p {
    position: absolute;
    padding: 5px;
    top: -13px;
    left: 20%;
    right: 20%;
    text-align: center;
    background-color: #fff;
}

.img-login img {
    width: 100%;
    height: 100vh !important;
}

#myTab li .active {
    background-color: #FFC907 !important;
    border-radius: 8px;
}

.cover-video {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    border-radius: 8px;
    z-index: 1;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.45);
}

.cover-slider {
    position: absolute;
    border-radius: 8px;
    z-index: 1;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.45);
}

/*slider-video*/

.slider {
    width: 100%;
    margin: 20px auto;
    text-align: center;
    padding: 20px;
}

.mt-slider-video {
    margin-top: 100px;
}

.slider .slide {
    padding: 0;
}

.slider .slide .child-element {
    width: 100%;
    height: 250px;
    margin: 30px 0;
    transition: all .5s;
    border-radius: 8px;
    z-index: 11;
}

.slider .slide.slick-center .child-element {
    margin: 0;
    height: 305px;
    max-width: initial;
}

.position-video {
    position: absolute;
    bottom: 20px;
    left: 20px;
    z-index: 12;
}

/*slider-video*/
.modal .modal-body::-webkit-scrollbar {
    width: 6px; /* width of the entire scrollbar */
}

body::-webkit-scrollbar {
    width: 9px; /* width of the entire scrollbar */
}

.modal .modal-body::-webkit-scrollbar-track {
    background: lightgray; /* color of the tracking area */
    border-radius: 20px;
}

body::-webkit-scrollbar-track {
    background: #e6e6e6; /* color of the tracking area */
    border-radius: 20px;
}

.modal .modal-body::-webkit-scrollbar-thumb {
    background-color: grey; /* color of the scroll thumb */
    border-radius: 20px; /* roundness of the scroll thumb */
    border: transparent; /* creates padding around scroll thumb */
}

body::-webkit-scrollbar-thumb {
    background-color: #ffbb07; /* color of the scroll thumb */
    border-radius: 20px; /* roundness of the scroll thumb */
    border: transparent; /* creates padding around scroll thumb */
}

/*      jQVMap     */
.vmap {
    width: 100%;
    min-height: 265px;
}

.vmap > svg {
    margin: auto;
    display: flex;
}

.vmap > svg > g {
    transition: all ease-in-out .2s;
}

.jqvmap-label, .jqvmap-pin {
    pointer-events: none;
}

.jqvmap-label {
    position: absolute;
    display: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background: #292929;
    color: #ffffff;
    font-size: smaller;
    padding: 3px;
}

.jqvmap-zoomin, .jqvmap-zoomout {
    position: absolute;
    left: 10px;
    border-radius: 13px;
    background: #FFC907;
    padding: 6px 7px;
    color: #ffffff;
    cursor: pointer;
    line-height: 10px;
    text-align: center;
    font-size: 14px;
}

.jqvmap-zoomin {
    top: 15px;
}

.jqvmap-zoomout {
    top: 45px;
}

.jqvmap-region {
    cursor: pointer;
}

.jqvmap-ajax_response {
    width: 100%;
    height: 500px;
}

/*pagination*/
.border-header-title {
    border-bottom: 1px solid #f7d85b;
    position: relative;
}

.title {
    border-radius: 10px;
    position: absolute;
    top: -16px;
    background-color: #fff;

}

.pagination {
    display: flex;
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.pagination:after {
    content: "";
    border-top: 1px solid #FFC907;
    position: absolute;
    top: 15px;
    right: 0;
    width: 100%;
    z-index: -1;
}

.pagination li .page-link {
    margin: 0 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    background-color: white;
    height: 30px;
    border: 1px solid #FFC907;
    border-radius: 100%;
}

.page-link {
    border: none;
    outline: none;
}

.pagination li a {
    color: #FFC907;
    width: 100px;
    background: 100%;
    text-align: center;
}

.page-item:last-child .page-link {
    border-radius: 100%;
    font-weight: bolder;

}

.page-item:first-child .page-link {
    border-radius: 100%;
    font-weight: bolder;

}

.pagination li:hover .page-link {
    background: #FFC907;
    color: #fff;
    border-radius: 100%;
}

.pagination li.active .page-link {
    background: #FFC907;
    color: #fff;
    border-radius: 100%;
    border: 1px solid #FFC907;


}

.page-item.disabled .page-link {
    border-radius: 100%;
    border: 1px solid #FFC907;
}

.pagination li.active a {
    color: #ffffff;
}

.pagination li.disabled {
    pointer-events: none;
}

@media only screen and (min-width: 600px) {
    .title {
        border-radius: 10px;
        position: absolute;
        top: -24px;
        background-color: #fff;

    }
}

/*pagination*/
/*.pagination {*/
/*    margin-top: 20px;*/
/*    background-color: red;*/
/*}*/

/*.pagination .page-item:last-child .page-link {*/
/*    border-radius: 0 8px 8px 0;*/
/*}*/

/*.pagination .page-item:first-child .page-link {*/
/*    border-radius: 8px 0 0 8px;*/
/*}*/

/*.page-item .page-link {*/
/*    margin: 0 5px;*/
/*    background-color: #000000;*/
/*    border: none !important;*/
/*    color: white;*/
/*    border-radius: 8px;*/
/*    font-size: 16px;*/
/*}*/

/*.page-item.active .page-link {*/
/*    background-color: #FFC907 !important;*/
/*}*/

.w-campain {
    width: 100%;
}

.w-campain-50 {
    width: 50%;
}

.w-campain .active {
    background-color: #fff;
}

.w-campain-50:hover {
    text-decoration: underline !important;
    font-weight: 500;
}

.w-campain {
    padding: 1px;
}

.detail-collapse {
    bottom: 50px;
    left: 0;
    position: absolute;
    right: 0;
    margin: auto;
    width: 100% !important;
    background-color: #fff;
    z-index: 999999 !important;
}

.detail-collapse1 {
    top: 389px;
    left: 0;
    right: 0;
    margin: auto;
    width: 95% !important;
    background-color: #fff;
    z-index: 999999 !important;
}

.position-sm {
    position: absolute !important;
    background-color: white;
    width: 100%;
    z-index: 999;
    top: 30px;
}

.mt-mission-body {
    margin-top: 35px;
}

.mt-message {
    margin-top: 70px;
}

.mt-Vision-body {
    margin-top: 220px;
}

.mt-history {
    margin-top: 70px;
}

.mt-history-body {
    margin-top: 190px;
}

.mt-Employees {
    margin-top: 70px;
}

.mt-contact-icon {
    margin-top: 450px;
}

.mt-request {
    margin-top: 800px;
}

.img-pray {
    border-radius: 8px 8px 0 0;
    width: 100% !important;
}

.position-absolute-video {
    width: 100%;
    position: absolute;
    top: 220px;
}

.cover-listen {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.39);
    z-index: 11;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.position-absolute-what {
    position: absolute;
    top: -12px;
    left: 45px;
    background-color: transparent;
}

.height-text {
    height: 105px !important;
}

.height-slider-new {
    height: 200px;
}


/*gallery*/
.main .container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 1rem;
    justify-content: center;
    align-items: center;
}

.main .card {
    color: #252a32;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, 0.24);
}

.main .card-image {
    position: relative;
    display: block;
    width: 100%;
    padding-top: 70%;
    background: #ffffff;
    border-radius: 8px;

}

.main .card-image img {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;

}

@media only screen and (max-width: 600px) {
    .main .container {
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: 1rem;
    }
}

/*end-gallery*/
.input-icon {
    display: flex;
    align-items: center;
    padding: 5px;
    border-radius: 8px;
    border: 2px solid #f4f4f4;
}

.input-icon input {
    background-color: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.input-icon-addon {
    color: #d0d0d0;
    font-size: 24px;
}

.input-icon-addon {
    padding: 0 10px;
    border-right: 2px solid #d0d0d0;
}

.btn.dropdown-toggle.btn-light {
    background-color: white !important;
    border: 2px solid rgba(224, 224, 224, .57);
    font-size: 12px !important;
}

.InputGroup label {
    display: flex;
    width: 120px;
    flex: auto;
    vertical-align: middle;
    align-items: center;
    justify-content: center;
    text-align: center;
    cursor: pointer;
    color: #000;
    padding: 8px 10px;
    margin-left: 7px;
    border-radius: 8px;
    border: 1px solid #CFCFCF;
    background-color: #E9EAE4;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.position-absolute-mortarboard-sm img {
    position: absolute;
    left: 0;
    right: 0;
    top: 140px;
    margin: auto;
    width: 60px;
    background-color: white;
    padding: 10px 0;

}

.position-absolute-chicken-sm img {
    position: absolute;
    left: 0;
    right: 0;
    top: 2300px;
    margin: auto;
    width: 60px;
    background-color: white;
    padding: 10px 0;
}

.position-absolute-care-sm img {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 1150px;
    margin: auto;
    width: 60px;
    background-color: white;
    padding: 10px 0;
}

.position-absolute-heart-sm img {
    position: absolute;
    left: 0;
    right: 0;
    top: 1200px;
    margin: auto;
    width: 60px;
    background-color: white;
    padding: 10px 0;
}

@media screen and (min-width: 375px) {
    .position-absolute-mortarboard-sm img {
        position: absolute;
        left: 0;
        right: 0;
        top: 170px;
        margin: auto;
        width: 60px;
        background-color: white;
        padding: 10px 0;

    }

    .position-absolute-chicken-sm img {
        position: absolute;
        left: 0;
        right: 0;
        top: 2180px;
        margin: auto;
        width: 60px;
        background-color: white;
        padding: 10px 0;
    }

    .position-absolute-care-sm img {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 1120px;
        margin: auto;
        width: 60px;
        background-color: white;
        padding: 10px 0;
    }

    .position-absolute-heart-sm img {
        position: absolute;
        left: 0;
        right: 0;
        top: 1110px;
        margin: auto;
        width: 60px;
        background-color: white;
        padding: 10px 0;
    }
}

@media screen and (min-width: 411px) {
    .position-absolute-mortarboard-sm img {
        position: absolute;
        left: 0;
        right: 0;
        top: 190px;
        margin: auto;
        width: 60px;
        background-color: white;
        padding: 10px 0;

    }

    .position-absolute-chicken-sm img {
        position: absolute;
        left: 0;
        right: 0;
        top: 2160px;
        margin: auto;
        width: 60px;
        background-color: white;
        padding: 10px 0;
    }

    .position-absolute-care-sm img {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 1100px;
        margin: auto;
        width: 60px;
        background-color: white;
        padding: 10px 0;
    }

    .position-absolute-heart-sm img {
        position: absolute;
        left: 0;
        right: 0;
        top: 1110px;
        margin: auto;
        width: 60px;
        background-color: white;
        padding: 10px 0;
    }

    .InputGroup label {
        display: flex;
        width: 100px;
        flex: auto;
        vertical-align: middle;
        align-items: center;
        justify-content: center;
        text-align: center;
        cursor: pointer;
        color: #000;
        padding: 8px 10px;
        margin-left: 7px;
        border-radius: 8px;
        border: 1px solid #CFCFCF;
        background-color: #E9EAE4;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
}

@media screen and (min-width: 540px) {
    .position-absolute-mortarboard-sm img {
        position: absolute;
        left: 0;
        right: 0;
        top: 330px;
        margin: auto;
        width: 60px;
        background-color: white;
        padding: 10px 0;

    }

    .position-absolute-chicken-sm img {
        position: absolute;
        left: 0;
        right: 0;
        top: 2070px;
        margin: auto;
        width: 60px;
        background-color: white;
        padding: 10px 0;
    }

    .position-absolute-care-sm img {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 1160px;
        margin: auto;
        width: 60px;
        background-color: white;
        padding: 10px 0;
    }

    .position-absolute-heart-sm img {
        position: absolute;
        left: 0;
        right: 0;
        top: 1100px;
        margin: auto;
        width: 60px;
        background-color: white;
        padding: 10px 0;
    }

    .InputGroup label {
        display: flex;
        width: 120px;
        flex: auto;
        vertical-align: middle;
        align-items: center;
        justify-content: center;
        text-align: center;
        cursor: pointer;
        color: #000;
        padding: 8px 10px;
        margin-left: 7px;
        border-radius: 8px;
        border: 1px solid #CFCFCF;
        background-color: #E9EAE4;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .img-news {
        height: 100%;
    }
}

@media screen and (min-width: 576px) {
    /*news*/
    .news_padding_box {
        padding: 30px 150px 30px 50px;

    }

    .news_scroll {
        overflow: auto;
        border-top: none;
        margin-bottom: 13px;
    }

    .news_scroll::-webkit-scrollbar {
        height: 5px;

    }

    .news_scroll::-webkit-scrollbar-track {
        background: #eaeaea; /* color of the tracking area */
        border-radius: 20px;
    }

    .news_scroll::-webkit-scrollbar-thumb {
        background-color: #FFA307; /* color of the scroll thumb */
        border-radius: 20px; /* roundness of the scroll thumb */
        border: transparent; /* creates padding around scroll thumb */
    }

    .news_text_category li a {
        font-size: 14px;
    }

    .news_text_md {
        font-size: 14px;
    }

    .news_text_lg {
        font-size: 18px;
    }

    /*news*/
    .img-header-video {
        margin-top: 80px;
        background: url("../img/header-video.png");
        background-size: 100% 100%;
        background-position: center;
        background-repeat: no-repeat;
        height: 500px;
        padding-top: 50px;
        border-radius: 0;
        box-shadow: none;
    }

    .InputGroup label {
        display: flex;
        width: 120px;
        flex: auto;
        vertical-align: middle;
        align-items: center;
        justify-content: center;
        text-align: center;
        cursor: pointer;
        color: #000;
        padding: 8px 10px;
        margin-left: 7px;
        border-radius: 8px;
        border: 1px solid #CFCFCF;
        background-color: #E9EAE4;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .height-body-employees {
        height: 110px;
    }

    .position-absolute-chicken img {
        position: absolute;
        top: 1860px;
        left: -60px;
        background-color: #fff;
        padding: 10px;
    }

    .height-text-listen {
        height: 55px;
    }

    .evenDiv div:first-child img {
        width: 174px;
        height: 298px;
    }

    .evenDiv div:last-child img {
        width: 174px;
        height: 157px;
    }

    .oddDive div:first-child img {
        width: 174px;
        height: 157px;
        margin-top: 40px;

    }

    .oddDive div:last-child img {
        width: 174px;
        height: 298px;
    }

    .height-title-event {
        height: 40px;
    }

    .mt-history {
        margin-top: 100px;
    }

    .border-sm-what:before {
        content: "";
        border-left: none;
    }

    .img-video-listen img {
        border-radius: 15px;
        width: 164px;
        height: 120px;
    }

    .cover-listen {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        background-color: rgba(0, 0, 0, 0.39);
        z-index: 11;
        width: 164px;
        height: 120px;
        border-radius: 15px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .mt-our-store {
        margin-top: 50px;
    }

    .text-white-commiunity {
        color: white;
    }

    .text-login p {
        position: absolute;
        padding: 5px;
        top: -15px;
        left: 30%;
        right: 30%;
        text-align: center;
        background-color: #fff;
    }

    .position-absolute-news h1 {
        font-size: 20px;
        color: white;
    }

    .bold-news {
        font-size: 30px;
        color: #ffbb07;
        font-weight: bolder;
    }

    .text-community {
        color: white;
    }

    .position-absolute-message {
        position: inherit;
        width: 400px;
        margin: auto;
        height: auto;
    }

    .box-our-mission {
        border-top: 1px solid #BDBDBD;
        border-right: 1px solid #BDBDBD;
        border-bottom: 1px solid #BDBDBD;
        width: 100%;
        height: 215px;
        position: relative;
        border-radius: 0px 8px 8px 0;
    }

    .position-absolute-our-mission {
        position: absolute;
        right: -45px;
        top: -80px;
        display: flex;
        align-items: center;
    }

    .img-our {
        width: 85px;
        height: 87px;
        border-radius: 8px;
    }

    .img-our1 {
        width: 128px;
        height: 130px;
        border-radius: 8px;
    }

    .img-our2 {
        width: 200px;
        height: 203px;
        border-radius: 8px;
    }


    .img-header {
        background: url("../img/larg_header.jpg");
        background-size: 100% 100%;
        background-position: center;
        background-repeat: no-repeat;
        min-height: 683px;
        position: relative;
    }

    .position-absolute-title {
        position: absolute;
        top: -15px;
        left: 80px;
        background-color: transparent;
    }

    .position-absolute-what {
        position: absolute;
        top: -15px;
        left: 80px;
        background-color: transparent;
    }

    .left-news {
        left: 30px;
    }

    .position-absolute-title-event {
        position: absolute;
        top: -19px;
        left: 100px;
        background-color: transparent;
    }

    .position-relative-title {
        border-top: 3px solid #FFC907;
        position: relative;
        height: 3px;
        border-radius: 10px;
        width: 80px;
        z-index: -1;
        display: block;
    }

    .position-relative-title-what {
        border-top: 3px solid #FFC907;
        position: relative;
        height: 3px;
        border-radius: 10px;
        width: 80px;
        z-index: 1;
        display: block;
    }

    .position-absolute-event {
        position: absolute;
        top: 150px;
        left: 0;
        right: 0;
        z-index: 1;
    }

    .img-size-campain img {
        width: 100%;
        height: 155px;
    }

    .text-white-event {
        color: white;
    }


    .bg-img-event {
        background: url("../img/our-gathering-redesign-home2.jpg");
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100%;
        width: 100%;
        height: 561px;
        position: relative;
    }

    .height-slider-new {
        height: 300px;
    }

}

.img-small-news {
    height: auto;
}

@media screen and (min-width: 768px) {
    .bg-footer {
        background-color: black;
        border-top: 8px solid #FFC907;
        border-radius: 120px 120px 0 0;
        width: 100%;
        min-height: 315px;
        display: flex;
        align-items: center;
        margin-top: 0;
    }

    .img-small-news {
        height: 100px;
    }

    .mt-about {
        margin-top: 110px;
    }

    .img-prayroom {
        border-radius: 8px 0 0 0 !important;
    }

    .InputGroup label {
        display: flex;
        width: 200px;
        flex: auto;
        vertical-align: middle;
        align-items: center;
        justify-content: center;
        text-align: center;
        cursor: pointer;
        color: #000;
        padding: 8px 10px;
        margin-left: 7px;
        border-radius: 8px;
        border: 1px solid #CFCFCF;
        background-color: #E9EAE4;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .position-absolute-care img {
        position: absolute;
        top: 3100px;
        right: -60px;
        background-color: #fff;
        padding: 10px;
    }

    .mt-testimonies {
        margin-top: 100px;
    }

    .height-text {
        height: 95px !important;
    }

    .height-text {
        height: 45px;
    }

    .height-footer-help {
        height: 400px;
    }

    .mt-coming {
        margin-top: 0px;
    }

    .position-absolute-video {
        width: 100%;
        position: absolute;
        top: 260px;
    }

    .img-header-help1 {
        margin-top: 60px;
        background: url("../img/need-help.png");
        background-size: 100% 100%;
        background-position: center;
        background-repeat: no-repeat;
        height: 514px;
        padding-top: 100px;
    }

    .mt-request {
        margin-top: 550px;
    }

    .img-pray {
        border-radius: 8px 8px 0 0;
        width: 100% !important;
    }

    .mt-contact-icon {
        margin-top: 250px;
    }

    .mt-Vision-body {
        margin-top: 120px;
    }

    .mt-mission-body {
        margin-top: 140px;
    }

    .mt-history-body {
        margin-top: 140px;
    }

    .mt-message {
        margin-top: 80px;
    }

    .mt-Employees {
        margin-top: 80px;
    }

    .category-sm {
        background-color: transparent;
        border-radius: 0;
        height: auto;
        overflow: auto;
        margin: 0;
    }

    .img-video-listen-news img {
        border-radius: 15px;
        width: 100%;
        height: 100px;
    }

    .cover-news img {
        width: 50px !important;
    }

    .cover-news {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        background-color: rgba(0, 0, 0, 0.39);
        z-index: 11;
        width: 100%;
        height: 100%;
        border-radius: 15px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .left-news {
        left: 0;
    }

    .position-sticky-news {
        position: sticky;
        top: 120px;
    }

    .height-title-event {
        height: 50px;
    }

    .mt-slider-video {
        margin-top: 170px;
    }

    .mt-our-store {
        margin-top: 50px;
    }

    .position-absolute-form-help {
        width: 100%;
        position: absolute;
        top: 350px;

    }

    .position-absolute-form-contact {
        width: 100%;
        position: absolute;
        top: 350px;

    }


    .img-contact {
        margin-top: 60px;
        background: url("../img/contact.png");
        background-size: 100% 100%;
        background-position: center;
        background-repeat: no-repeat;
        height: 614px;
        padding-top: 100px;
    }

    .w-campain {
        width: 100%;
    }

    .w-campain-50 {
        width: 50%;
    }

    .img-contact-icon {
        width: 51px;
        height: 51px;
    }

    .img-what img {
        border-radius: 0 8px 0 0;
        z-index: -2;
    }

    .img-what1 img {
        border-radius: 0 0 0 8px;
        z-index: -1;
    }

    .img-pray {
        border-radius: 8px 0 0 0;
    }

    .img-pray1 {
        border-radius: 8px 0px 0px 8px;
    }

    .mt-vision {
        margin-top: 170px;
    }

    .c-0 {
        max-width: 100% !important;
        padding: 0 !important;
    }

    .position-absolute-message {
        position: absolute;
        right: -200px;
        top: 60px;
        width: 297px;
        height: 286px;
    }

    .box-our-message {
        border-top: 1px solid #BDBDBD;
        border-right: 1px solid #BDBDBD;
        border-bottom: 1px solid #BDBDBD;
        width: 100%;
        height: 299px;
        position: relative;
        border-radius: 0px 8px 8px 0;
    }

    .position-absolute-vision:before {
        content: "";
        display: block;
        position: absolute;
        top: 70px;
        z-index: -1;
        border-top: 1px solid #BDBDBD;
        border-left: 1px solid #BDBDBD;
        border-bottom: 1px solid #BDBDBD;
        width: 100%;
        height: 144px;
        border-radius: 8px 0px 0px 8px;
    }

    .position-absolute-our-mission {
        position: absolute;
        right: -45px;
        top: -80px;
        display: flex;
        align-items: center;
    }

    .img-our {
        width: 85px;
        height: 87px;
        border-radius: 8px;
    }

    .img-our1 {
        width: 128px;
        height: 130px;
        border-radius: 8px;
    }

    .img-our2 {
        width: 227px;
        height: 233px;
        border-radius: 8px;
    }


    .img-size-campain img {
        width: 100%;
        height: 220px;
    }

    .img-help-us:before {
        content: "";
        position: absolute;
        border: 3px solid #FFC907;
        width: 75%;
        height: 55%;
        top: -30px;
        left: -20px;
        border-radius: 8px;
        z-index: -1;
        display: block;
    }

    .img-abut-us:before {
        content: "";
        position: absolute;
        border: 3px solid #FFC907;
        width: 80%;
        height: 55%;
        top: -30px;
        right: -20px;
        border-radius: 8px;
        z-index: -1;
        display: block;
    }

    .nav-logo {
        background-size: 100%;
        width: 100px;
        height: 50px;
    }

    .img-what {
        width: 70%;
        position: absolute;
        top: -50px;
        left: 0;
        z-index: 1;
    }

    .img-what1 {
        position: absolute;
        top: 1300px;
        right: 0;
        width: 70%;

    }

    .img-what2 {
        position: absolute;
        top: 2300px;
        left: -110px;
        width: 45% !important;

    }

    .img-what3 {
        position: absolute;
        top: 3620px;
        right: -110px;
        width: 45%;

    }

    .img-what3 img {
        border-radius: 8px;
    }

    .text-box-what {
        position: absolute;
        top: 100px;
        right: 60px;
        z-index: 5 !important;
    }

    .text-box-what-medical {
        position: absolute;
        top: 900px;
        left: 60px;
        z-index: 5 !important;
    }

    .text-box-food {
        position: absolute;
        top: 2000px;
        right: 60px;
        z-index: 5 !important;
    }

    .text-box-HUMANITARIAN {
        position: absolute;
        bottom: 80px;
        left: 60px;
        z-index: 5 !important;
    }

    .box-what {
        width: 491px;
        border: 2px solid #FFC907;
        border-radius: 8px;
        min-height: 3800px;
        margin: auto;
        position: relative;
        z-index: -5;
        display: block;
    }

    .img-icon {
        background-image: url("../img/eduqation-gray.png");
        -moz-background-image: url("../img/eduqation-gray.png") !important;
        -webkit-background-image: url("../img/eduqation-gray.png") !important;
        -o-background-image: url("../img/eduqation-gray.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 100px;
        height: 100px;
        transition: all 0.3s;
    }

    .border-box-who:hover .img-icon {
        -moz-background-image: url("../img/eduqation-dark.png") !important;
        background-image: url("../img/eduqation-dark.png") !important;
        -webkit-background-image: url("../img/eduqation-dark.png") !important;
        -o-background-image: url("../img/eduqation-dark.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 100px;
        height: 100px;
        transition: all 0.3s;
        z-index: 99;
    }

    .img-icon1 {
        -moz-background-image: url("../img/chicken-thigh-gray.png") !important;
        background-image: url("../img/chicken-thigh-gray.png") !important;
        -webkit-background-image: url("../img/chicken-thigh-gray.png") !important;
        -o-background-image: url("../img/chicken-thigh-gray.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 100px;
        height: 100px;
        transition: all 0.3s;
    }

    .border-box-who:hover .img-icon1 {
        -moz-background-image: url("../img/chicken-thigh-dark.png") !important;
        -webkit-background-image: url("../img/chicken-thigh-dark.png") !important;
        background-image: url("../img/chicken-thigh-dark.png") !important;
        -o-background-image: url("../img/chicken-thigh-dark.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 100px;
        height: 100px;
        transition: all 0.3s;
        z-index: 99;
    }

    .img-icon2 {
        -moz-background-image: url("../img/care-gray.png") !important;
        background-image: url("../img/care-gray.png") !important;
        -webkit-background-image: url("../img/care-gray.png") !important;
        -o-background-image: url("../img/care-gray.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 100px;
        height: 100px;
        transition: all 0.3s;
    }

    .border-box-who:hover .img-icon2 {
        -moz-background-image: url("../img/care-dark.png") !important;
        background-image: url("../img/care-dark.png") !important;
        -webkit-background-image: url("../img/care-dark.png") !important;
        -o-background-image: url("../img/care-dark.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 100px;
        height: 100px;
        transition: all 0.3s;
        z-index: 99;

    }

    .img-icon3 {
        -moz-background-image: url("../img/heartbeat-gray.png") !important;
        background-image: url("../img/heartbeat-gray.png") !important;
        -webkit-background-image: url("../img/heartbeat-gray.png") !important;
        -o-background-image: url("../img/heartbeat-gray.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 100px;
        height: 100px;
        transition: all 0.3s;
        z-index: 99;

    }

    .border-box-who:hover .img-icon3 {
        -moz-background-image: url("../img/heartbeat-dark.png") !important;
        background-image: url("../img/heartbeat-dark.png") !important;
        -webkit-background-image: url("../img/heartbeat-dark.png") !important;
        -o-background-image: url("../img/heartbeat-dark.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 100px;
        height: 100px;
        transition: all 0.3s;
        z-index: 99;

    }

    .height-slider-new {
        height: 300px;
    }

    .position-absolute-chicken img {
        position: absolute;
        top: 2050px;
        left: -60px;
        background-color: #fff;
        padding: 10px;
    }

    .mt-title-news {
        margin-top: 0px;
    }

    /*news*/
    .news_padding_box {
        padding: 10px 10px 10px 20px;
    }


    .news_box_black_header h1 {
        font-size: 15px;
        color: white;
    }

    .news_box_black_header h2 {
        font-size: 12px;
        color: white;
    }

    .news_text_category li a {
        font-size: 12px;
    }

    .news_text_md {
        font-size: 12px;
    }

    .news_text_lg {
        font-size: 15px;
    }

    /*end-news*/
}

@media screen and (min-width: 992px) {
    .mt-who {
        margin-top: 80px;
    }

    .bg-footer {
        background-color: black;
        border-top: 8px solid #FFC907;
        border-radius: 150px 150px 0 0;
        width: 100%;
        min-height: 315px;
        display: flex;
        align-items: center;
        margin-top: 0;
    }

    .position-absolute-donate {
        z-index: 99;
        position: absolute;
        top: -80px;
        right: 0;
    }

    .mt-donate {
        margin-top: 150px;
    }

    .img-small-news {
        height: 150px;
    }

    .img-prayroom {
        border-radius: 8px 0 0 8px !important;
    }

    .size-logo {
        width: 180px;
    }

    .InputGroup label {
        display: flex;
        width: 100px;
        flex: auto;
        vertical-align: middle;
        align-items: center;
        justify-content: center;
        text-align: center;
        cursor: pointer;
        color: #000;
        padding: 8px 10px;
        margin-left: 7px;
        border-radius: 8px;
        border: 1px solid #CFCFCF;
        background-color: #E9EAE4;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .big-campaign {
        height: 170px;
    }

    .position-absolute-chicken img {
        position: absolute;
        top: 2030px;
        left: -60px;
        background-color: #fff;
        padding: 10px;
    }

    .position-absolute-care img {
        position: absolute;
        top: 3000px;
        right: -60px;
        background-color: #fff;
        padding: 10px;
    }

    .position-absolute-heart img {
        position: absolute;
        top: 950px;
        right: -60px;
        background-color: #fff;
        padding: 10px;
    }

    .mt-testimonies {
        margin-top: 100px;
    }

    .height-text {
        height: 95px;
    }

    .img-icon {
        background-image: url("../img/eduqation-gray.png");
        -moz-background-image: url("../img/eduqation-gray.png") !important;
        -webkit-background-image: url("../img/eduqation-gray.png") !important;
        -o-background-image: url("../img/eduqation-gray.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 70px;
        height: 70px;
        transition: all 0.3s;
    }

    .border-box-who:hover .img-icon {
        -moz-background-image: url("../img/eduqation-dark.png") !important;
        background-image: url("../img/eduqation-dark.png") !important;
        -webkit-background-image: url("../img/eduqation-dark.png") !important;
        -o-background-image: url("../img/eduqation-dark.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 70px;
        height: 70px;
        transition: all 0.3s;
        z-index: 99;
    }

    .img-icon1 {
        -moz-background-image: url("../img/chicken-thigh-gray.png") !important;
        background-image: url("../img/chicken-thigh-gray.png") !important;
        -webkit-background-image: url("../img/chicken-thigh-gray.png") !important;
        -o-background-image: url("../img/chicken-thigh-gray.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 70px;
        height: 70px;
        transition: all 0.3s;
    }

    .border-box-who:hover .img-icon1 {
        -moz-background-image: url("../img/chicken-thigh-dark.png") !important;
        -webkit-background-image: url("../img/chicken-thigh-dark.png") !important;
        background-image: url("../img/chicken-thigh-dark.png") !important;
        -o-background-image: url("../img/chicken-thigh-dark.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 70px;
        height: 70px;
        transition: all 0.3s;
        z-index: 99;
    }

    .img-icon2 {
        -moz-background-image: url("../img/care-gray.png") !important;
        background-image: url("../img/care-gray.png") !important;
        -webkit-background-image: url("../img/care-gray.png") !important;
        -o-background-image: url("../img/care-gray.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 70px;
        height: 70px;
        transition: all 0.3s;
    }

    .border-box-who:hover .img-icon2 {
        -moz-background-image: url("../img/care-dark.png") !important;
        background-image: url("../img/care-dark.png") !important;
        -webkit-background-image: url("../img/care-dark.png") !important;
        -o-background-image: url("../img/care-dark.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 70px;
        height: 70px;
        transition: all 0.3s;
        z-index: 99;

    }

    .img-icon3 {
        -moz-background-image: url("../img/heartbeat-gray.png") !important;
        background-image: url("../img/heartbeat-gray.png") !important;
        -webkit-background-image: url("../img/heartbeat-gray.png") !important;
        -o-background-image: url("../img/heartbeat-gray.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 70px;
        height: 70px;
        transition: all 0.3s;
        z-index: 99;

    }

    .border-box-who:hover .img-icon3 {
        -moz-background-image: url("../img/heartbeat-dark.png") !important;
        background-image: url("../img/heartbeat-dark.png") !important;
        -webkit-background-image: url("../img/heartbeat-dark.png") !important;
        -o-background-image: url("../img/heartbeat-dark.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 70px;
        height: 70px;
        transition: all 0.3s;
        z-index: 99;

    }

    .img-pray {
        border-radius: 8px 8px 0 0;
        width: 150px !important;
    }


    .mt-request {
        margin-top: 515px;
    }

    .mt-contact-icon {
        margin-top: 300px;
    }

    .mt-Vision-body {
        margin-top: 140px;
    }

    .mt-mission-body {
        margin-top: 140px;
    }

    .mt-history-body {
        margin-top: 140px;
    }

    .mt-Vision-about {
        margin-top: 140px !important;
    }

    .mt-message {
        margin-top: 80px;
    }

    .mt-history {
        margin-top: 100px;
    }

    .cover-news {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        background-color: rgba(0, 0, 0, 0.39);
        z-index: 11;
        width: 100%;
        height: 79px;
        border-radius: 15px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .cover-news img {
        width: 30px !important;
    }

    .img-video-listen-news img {
        border-radius: 15px;
        width: 84px;
        height: 79px;
    }

    .text-box-title {
        color: #707070;
        transition: all 0.3s;
    }

    .left-news {
        left: 80px;
    }

    .mt-our-store {
        margin-top: 80px;
    }

    .img-size-new {
        width: 239px;
    }

    .w-100-run {
        width: auto;
    }

    .position-absolute-news {
        position: absolute;
        z-index: 1;
        bottom: 0;
        width: 100%;
        height: 100%;
        left: 0;
        display: block;
    }

    .position-absolute-news label {
        position: absolute;
        top: 20px;
        left: 15px;
    }

    .position-absolute-news h2 {
        position: absolute;
        bottom: 10px;
        left: 0;
        padding-left: 15px;

    }

    .position-sm {
        position: relative !important;
        background-color: transparent;
        width: 100%;
        z-index: 9999999999999999 !important;
    }

    .collapse.dont-collapse-sm {
        display: block;
        height: auto !important;
        visibility: visible;
    }

    .position-absolute-news h1 {
        font-size: 40px;
        color: white;
    }

    .bold-news {
        font-size: 60px;
        color: #ffbb07;
        font-weight: bolder;
    }

    .w-campain {
        width: auto;
    }

    .w-campain-50 {
        width: auto;
    }

    .box-what {
        width: 691px;
        border: 2px solid #FFC907;
        border-radius: 8px;
        min-height: 3740px;
        margin: auto;
        position: relative;
        z-index: -5;
        display: block;
    }

    .img-what {
        width: 70%;
        position: absolute;
        top: -50px;
        left: 0;
        z-index: 1;
    }

    .img-what1 {
        position: absolute;
        top: 1200px;
        right: 0;
        width: 70%;

    }

    .img-what2 {
        position: absolute;
        top: 2200px;
        left: -150px;
        width: 45% !important;

    }

    .img-what3 {
        position: absolute;
        top: 3460px;
        right: -150px;
        width: 45%;

    }

    .img-what3 img {
        border-radius: 8px;
    }

    .text-box-what {
        position: absolute;
        top: 200px;
        right: 80px;
        z-index: 5 !important;
    }

    .text-box-what-medical {
        position: absolute;
        top: 1050px;
        left: 80px;
        z-index: 5 !important;
    }

    .text-box-food {
        position: absolute;
        top: 1950px;
        right: 80px;
        z-index: 5 !important;
    }

    .text-box-HUMANITARIAN {
        position: absolute;
        bottom: 260px;
        left: 80px;
        z-index: 5 !important;
    }

    .nav-logo {
        background: url("../img/black-logo.png");
        background-size: 100%;
        background-position: center;
        background-repeat: no-repeat;
        width: 65px;
        height: 50px;
    }

    .navbar-nav .nav-item .nav-link {
        color: #000000;
    }

    .position-absolute-vision:before {
        content: "";
        display: block;
        position: absolute;
        top: 70px;
        z-index: -1;
        border-top: 1px solid #BDBDBD;
        border-left: 1px solid #BDBDBD;
        border-bottom: 1px solid #BDBDBD;
        width: 100%;
        height: 244px;
        border-radius: 8px 0px 0px 8px;
    }

    .position-absolute-vision {
        width: 673px;
    }

    .position-absolute-vision img {
        width: 100%;
    }

    .position-absolute-our-mission {
        position: absolute;
        right: -85px;
        top: -80px;
        display: flex;
        align-items: center;
    }

    .img-our {
        width: 115px;
        height: 117px;
        border-radius: 8px;
    }

    .img-our1 {
        width: 168px;
        height: 170px;
        border-radius: 8px;
    }

    .img-our2 {
        width: 267px;
        height: 273px;
        border-radius: 8px;
    }

    .img-header-help {
        margin-top: 80px;
        background: url("../img/header-help.png");
        background-size: 100% 100%;
        background-position: center;
        background-repeat: no-repeat;
        height: 614px;
        padding-top: 100px;
    }

    .img-header-help1 {
        margin-top: 80px;
        background: url("../img/need-help.png");
        background-size: 100% 100%;
        background-position: center;
        background-repeat: no-repeat;
        height: 614px;
        padding-top: 100px;
    }

    .img-contact {
        margin-top: 80px;
        background: url("../img/contact.png");
        background-size: 100% 100%;
        background-position: center;
        background-repeat: no-repeat;
        height: 614px;
        padding-top: 100px;
    }

    .position-absolute-form-help {
        width: 100%;
        position: absolute;
        top: 350px;
    }

    .position-absolute-form-contact {
        width: 100%;
        position: absolute;
        top: 350px;
    }

    .position-absolute-video {
        width: 100%;
        position: absolute;
        top: 260px;
    }

    .border-box-help {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        border: 2px solid #FFC907;
        height: 935px;
        border-radius: 8px;
        z-index: -1;
    }

    .navbar-nav .active::after, .navbar-nav li:hover::after {
        border-bottom: 3px solid #FFC907;
        content: "";
        border-radius: 20px;
        height: 3px;
        position: absolute;
        width: 30px;
        left: 15px;
    }

    .navbar-brand img {
        width: 100px;
    }

    .progress {
        width: 51px;
        height: 51px;
        background: none;
    }

    .img-size-campain img {
        width: 100%;
        height: 195px;
    }

    .position-absolute-nav {
        position: inherit;
        top: 0;
        left: 0;
        right: 0;
        background-color: transparent;
        z-index: 999;

    }

    .position-absolute-nav1 {
        position: inherit;
        top: 0;
        left: 0;
        right: 0;
        background-color: transparent;
        z-index: 999;

    }

    .img-abut-us:before {
        content: "";
        position: absolute;
        border: 3px solid #FFC907;
        width: 85%;
        height: 80%;
        top: -30px;
        right: -20px;
        border-radius: 8px;
        z-index: -1;
    }

    .mt-header-video {
        margin-top: 135px;
    }

    .mt-title {
        margin-top: 100px;
    }

    .mt-title-head {
        margin-top: 100px;
    }

    .mt-show-news {
        margin-top: 100px;
    }

    .mt-gallery {
        margin-top: 100px;
    }

    .mt-mission {
        margin-top: 70px;
    }

    .mt-Vision-about {
        margin-top: 70px;
    }

    .img-help-us:before {
        content: "";
        position: absolute;
        border: 3px solid #FFC907;
        width: 75%;
        height: 80%;
        top: -30px;
        left: -20px;
        border-radius: 8px;
        z-index: -1;
    }

    .img-contact-icon {
        width: 61px;
        height: 61px;
    }

    .height-slider-new {
        height: auto;
    }

    .mt-title-news {
        margin-top: 0px;
    }

    /*news*/
    .news_padding_box {
        padding: 20px 20px 20px 30px;
    }


    .news_box_black_header h1 {
        font-size: 25px;
        color: white;
    }

    .news_box_black_header h2 {
        font-size: 14px;
        color: white;
    }

    .news_text_category li a {
        font-size: 13px;
    }

    .news_text_md {
        font-size: 13px;
    }

    .news_text_lg {
        font-size: 15px;
    }

    /*end-news*/

}

@media screen and (min-width: 1200px) {
    /*news*/
    .news_text_category li a {
        font-size: 14px;
    }

    .news_text_md {
        font-size: 14px;
    }

    .news_text_lg {
        font-size: 18px;
    }

    .news_box_black_header {
        background-color: black;
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .news_padding_box {
        padding: 30px 110px 30px 50px;
    }


    .news_box_black_header h1 {
        font-size: 30px;
        color: white;
    }

    .news_box_black_header h2 {
        font-size: 16px;
        color: white;
    }

    .news_input_search::placeholder {
        color: black;
    }

    .news_input_search {
        outline: none !important;
        border: none !important;
        width: 100%;
        box-shadow: none !important;
        font-size: 14px;
        color: black;
    }

    .news_input_search:focus {
        outline: none !important;
        border: none !important;
        box-shadow: none !important;
    }

    .news_input_border_search {
        border-bottom: 1px solid black;
    }

    .news_border_left {
        width: 2px;
        height: 25px;
        background-color: #FFC907;
        border-radius: 5px;
    }

    .news_border_left1 {
        width: 3px;
        height: 20px;
        background-color: #FFC907;
        border-radius: 5px;
    }

    .border-Link {
        text-decoration: underline;
    }

    .news_title {
        position: relative;
        width: 100%;
        border-bottom: 1px solid black;
    }

    .news_title a {
        background-color: white;
        padding: 5px 0px 5px 15px;
        position: absolute;
        right: 0;
        top: -20px;
    }

    .news_title p {
        position: absolute;
        left: 0;
        top: -30px;
        background-color: white;
        padding: 5px 15px 5px 0;
    }

    .news_title p span {
        font-size: 25px;
    }

    .news_cover_video {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        background-color: rgba(255, 255, 255, 0.4);
        z-index: 11;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /*end-news*/
    .size-auto-img {
        width: 100%;
        height: 139px;
        object-fit: cover;
    }

    .img-testimonies {
        border-radius: 15px;
        width: 100%;
        height: 139px;
        object-fit: cover;
    }

    .img-small-news {
        height: 180px;
    }

    .img-prayroom {
        border-radius: 8px 0 0 8px !important;
    }

    .mt-title-news {
        margin-top: 0px;
    }

    .InputGroup label {
        display: flex;
        width: 100px;
        flex: auto;
        vertical-align: middle;
        align-items: center;
        justify-content: center;
        text-align: center;
        cursor: pointer;
        color: #000;
        padding: 8px 10px;
        margin-left: 7px;
        border-radius: 8px;
        border: 1px solid #CFCFCF;
        background-color: #E9EAE4;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .big-campaign {
        height: 220px;
    }

    .height-slider-new {
        height: auto;
    }

    .position-absolute-chicken img {
        position: absolute;
        top: 1850px;
        left: -60px;
        background-color: #fff;
        padding: 10px;
    }

    .position-absolute-care img {
        position: absolute;
        top: 2800px;
        right: -60px;
        background-color: #fff;
        padding: 10px;
    }

    .img-pray {
        border-radius: 8px 8px 0 0;
        width: 300px !important;
    }

    .mt-request {
        margin-top: 500px;
    }

    .mt-contact-icon {
        margin-top: 300px;
    }

    .mt-our-store {
        margin-top: 80px;
    }

    .mt-Vision-body {
        margin-top: 140px;
    }

    .mt-mission-body {
        margin-top: 160px;
    }

    .mt-history-body {
        margin-top: 160px;
    }

    .mt-Vision-about {
        margin-top: 160px;
    }

    .box-what {
        width: 691px;
        border: 2px solid #FFC907;
        border-radius: 8px;
        min-height: 3445px;
        margin: auto;
        position: relative;
        z-index: -5;
        display: block;
    }

    .img-what {
        width: 860px;
        position: absolute;
        top: -50px;
        left: 0;
        z-index: 1;
    }

    .img-what1 {
        position: absolute;
        top: 1200px;
        right: 0;
        width: 860px;

    }

    .img-what2 {
        position: absolute;
        top: 2050px;
        left: -150px;
        width: 462px;
        border-radius: 8px;

    }

    .img-what3 {
        position: absolute;
        top: 3150px;
        right: -150px;
        width: 322px;

    }

    .img-what3 img {
        border-radius: 8px;
    }

    .text-box-what {
        position: absolute;
        top: 200px;
        right: 80px;
        z-index: 5 !important;
    }

    .text-box-what-medical {
        position: absolute;
        top: 900px;
        left: 80px;
        z-index: 5 !important;
    }

    .text-box-food {
        position: absolute;
        top: 1800px;
        right: 80px;
        z-index: 5 !important;
    }

    .text-box-HUMANITARIAN {
        position: absolute;
        bottom: 180px;
        left: 80px;
        z-index: 5 !important;
    }

    .nav-logo {
        background: url("../img/black-logo.png");
        background-size: 100%;
        background-position: center;
        background-repeat: no-repeat;
        width: 100px;
        height: 50px;
    }


    .img-icon {
        background-image: url("../img/eduqation-gray.png");
        -moz-background-image: url("../img/eduqation-gray.png") !important;
        -webkit-background-image: url("../img/eduqation-gray.png") !important;
        -o-background-image: url("../img/eduqation-gray.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 88px;
        height: 88px;
        transition: all 0.3s;
    }

    .border-box-who:hover .img-icon {
        -moz-background-image: url("../img/eduqation-dark.png") !important;
        background-image: url("../img/eduqation-dark.png") !important;
        -webkit-background-image: url("../img/eduqation-dark.png") !important;
        -o-background-image: url("../img/eduqation-dark.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 88px;
        height: 88px;
        transition: all 0.3s;
        z-index: 99;
    }

    .img-icon1 {
        -moz-background-image: url("../img/chicken-thigh-gray.png") !important;
        background-image: url("../img/chicken-thigh-gray.png") !important;
        -webkit-background-image: url("../img/chicken-thigh-gray.png") !important;
        -o-background-image: url("../img/chicken-thigh-gray.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 88px;
        height: 88px;
        transition: all 0.3s;
    }

    .border-box-who:hover .img-icon1 {
        -moz-background-image: url("../img/chicken-thigh-dark.png") !important;
        -webkit-background-image: url("../img/chicken-thigh-dark.png") !important;
        background-image: url("../img/chicken-thigh-dark.png") !important;
        -o-background-image: url("../img/chicken-thigh-dark.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 88px;
        height: 88px;
        transition: all 0.3s;
        z-index: 99;
    }

    .img-icon2 {
        -moz-background-image: url("../img/care-gray.png") !important;
        background-image: url("../img/care-gray.png") !important;
        -webkit-background-image: url("../img/care-gray.png") !important;
        -o-background-image: url("../img/care-gray.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 88px;
        height: 88px;
        transition: all 0.3s;
    }

    .border-box-who:hover .img-icon2 {
        -moz-background-image: url("../img/care-dark.png") !important;
        background-image: url("../img/care-dark.png") !important;
        -webkit-background-image: url("../img/care-dark.png") !important;
        -o-background-image: url("../img/care-dark.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 88px;
        height: 88px;
        transition: all 0.3s;
        z-index: 99;

    }

    .img-icon3 {
        -moz-background-image: url("../img/heartbeat-gray.png") !important;
        background-image: url("../img/heartbeat-gray.png") !important;
        -webkit-background-image: url("../img/heartbeat-gray.png") !important;
        -o-background-image: url("../img/heartbeat-gray.png") !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 88px;
        height: 88px;
        transition: all 0.3s;
        z-index: 99;

    }

    .border-box-who:hover .img-icon3 {
        -moz-background-image: url("../img/heartbeat-dark.png");
        background-image: url("../img/heartbeat-dark.png");
        -webkit-background-image: url("../img/heartbeat-dark.png");
        -o-background-image: url("../img/heartbeat-dark.png");
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 88px;
        height: 88px;
        transition: all 0.3s;
        z-index: 99;

    }

    .height-text {
        height: 65px;
    }

    .img-size-campain img {
        width: 100%;
        height: 170px;
    }
}

fieldset {
    border: 0;
}

legend {
    clip: rect(1px, 1px, 1px, 1px);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    height: 1px;
    width: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
}

.control {
    display: inline-flex;
    position: relative;
    margin: 5px;
    cursor: pointer;
    border-radius: 99em;
}

.control input {
    position: absolute;
    opacity: 0;
    z-index: -1;
}

.control svg {
    margin-right: 6px;
    border-radius: 50%;
    box-shadow: 3px 3px 16px rgba(0, 0, 0, 0.2);
}

.control__content {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    font-size: 14px;
    line-height: 32px;
    color: rgba(0, 0, 0, 0.54);
    background-color: rgba(0, 0, 0, 0.05);
    border-radius: 99em;
}

.control:hover .control__content {
    background-color: rgba(0, 0, 0, 0.1);
}

.control input:focus ~ .control__content {
    box-shadow: 0 0 0 0.25rem rgba(12, 242, 143, 0.2);
    background-color: rgba(0, 0, 0, 0.1);
}

.control input:checked ~ .control__content {
    background-color: rgba(12, 242, 143, 0.2);
}


.switch {
    display: inline-block;
    position: relative;
    width: 50px;
    height: 25px;
    border-radius: 20px;
    background: #dfd9ea;
    transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    vertical-align: middle;
    cursor: pointer;
}

.switch::before {
    content: '';
    position: absolute;
    top: 1px;
    left: 2px;
    width: 22px;
    height: 22px;
    background: #fafafa;
    border-radius: 50%;
    transition: left 0.28s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.switch:active::before {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(128, 128, 128, 0.1);
}

.file > label:hover {
    color: white;
    background-color: #1b1e21;
    transition: all .3s;

}

.file > label:hover .upload-icon {
    width: 14px;
    height: 14px;
    background: url("../../img/white-upload.svg") no-repeat center;
    background-size: 100% 100%;

}

.upload-icon {
    width: 14px;
    height: 14px;
    background: url("../../img/upload.svg") no-repeat center;
    background-size: 100% 100%;
}

.border-radius-sm {
    border-radius: 8px;
}

input:checked + .switch {
    background: #72da67;
}

input:checked + .switch::before {
    left: 27px;
    background: #fff;
}

input:checked + .switch:active::before {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(0, 150, 136, 0.2);
}

table {
    text-align: center;
}

.pray-user {
    width: 70px;
    height: 70px;
    background-color: #d0d0d0;
    border-radius: 50%;
}

.pray-user img {
    width: 70px;
    height: 70px;
    padding: 10px;

}

.file {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.file > input[type='file'] {
    display: none
}

.file > label {
    font-size: 13px;
    font-weight: 300;
    cursor: pointer;
    outline: 0;
    user-select: none;
    border-color: rgb(216, 216, 216) rgb(209, 209, 209) rgb(186, 186, 186);
    border-style: solid;
    border-radius: 8px;
    border-width: 1px;
    background-color: hsl(0, 0%, 100%);
    color: hsl(0, 0%, 29%);
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 8px;
    padding-bottom: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 !important;
    transition: all .3s;
}

.file > label:hover {
    color: white !important;
    background-color: #1b1e21;
    transition: all .3s;
}

.upload-icon {
    width: 14px;
    height: 14px;
    background: url("../../img/upload.svg") no-repeat center;
    background-size: 100% 100%;
}

.file > label:hover img {
    width: 14px;
    height: 14px;
    background: url("../../img/white-upload.svg") no-repeat center !important;
    background-size: 100% 100%;
}

.pre-line {
    white-space: pre-line;
}