/*****************************************/
/* English Font */
/*****************************************/
@font-face {
    font-family: 'Roboto Condensed';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Condensed'), local('RobotoCondensed-Regular'), url("ieVl2ZhZI2eCN5jzbjEETS9weq8-19-7DRs5.woff2") format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Roboto Condensed';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Condensed'), local('RobotoCondensed-Regular'), url("ieVl2ZhZI2eCN5jzbjEETS9weq8-19a7DRs5.woff2") format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
    font-family: 'Roboto Condensed';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Condensed'), local('RobotoCondensed-Regular'), url("ieVl2ZhZI2eCN5jzbjEETS9weq8-1967DRs5.woff2") format('woff2');
    unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
    font-family: 'Roboto Condensed';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Condensed'), local('RobotoCondensed-Regular'), url("ieVl2ZhZI2eCN5jzbjEETS9weq8-19G7DRs5.woff2") format('woff2');
    unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
    font-family: 'Roboto Condensed';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Condensed'), local('RobotoCondensed-Regular'), url("ieVl2ZhZI2eCN5jzbjEETS9weq8-1927DRs5.woff2") format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Roboto Condensed';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Condensed'), local('RobotoCondensed-Regular'), url("ieVl2ZhZI2eCN5jzbjEETS9weq8-19y7DRs5.woff2") format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Roboto Condensed';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Condensed'), local('RobotoCondensed-Regular'), url("ieVl2ZhZI2eCN5jzbjEETS9weq8-19K7DQ.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

html, * {
    scroll-behavior: smooth;
    /*font-family: 'Roboto Condensed';*/
    font-family: "Fira Sans", sans-serif;
}

.grecaptcha-badge {
    visibility: hidden;
    display: none;
}

#accordion .card-header button {
    width: 100%;
    height: 62px;
    line-height: 62px;
}

    #accordion .card-header button::after {
        content: '';
        display: block;
        background: url("") no-repeat;
        width: 24px;
        height: 24px;
        margin-top: 13px;
        float: right;
    }

    #accordion .card-header button.collapsed::after {
        background: url("") no-repeat;
    }

.small, small {
    font-size: 10px;
}

/*****************************************/
/* English Font End */
/*****************************************/

/*****************************************/
/* Arabic Font */
/*****************************************/
@font-face {
    font-family: 'Noto Kufi Arabic';
    font-style: normal;
    font-weight: 400;
    src: url("");
    src: url("NotoKufiArabic-Regular.eot") format('embedded-opentype'),url("NotoKufiArabic-Regular.woff2") format('woff2'),url("NotoKufiArabic-Regular.woff") format('woff'),url("NotoKufiArabic-Regular.ttf") format('truetype');
}

@font-face {
    font-family: 'Diab Orient 012';
    src: url("");
    src: url("") format('embedded-opentype'), url("") format('woff2'), url("") format('woff'), url("") format('truetype');
}

@font-face {
    font-family: 'CoconNextArabic';
    font-style: normal;
    font-weight: 700;
    src: url("");
    src: url("") format('embedded-opentype'),url("") format('woff2'),url("") format('woff'),url("");
}
/*****************************************/
/* Arabic Font End */
/*****************************************/

/*****************************************/
/* Font Styles */
/*****************************************/
.display-5 {
    font-size: calc(20px + 2.1vw);
    font-weight: 500;
    line-height: 1.2;
}

.display-4 {
    font-size: calc(16px + 5.1vw);
    font-weight: 500;
    line-height: 1.2;
}

@media (min-width: 1200px) {
    .font-60-md {
        font-size: 60px;
    }

    .display-5 {
        font-size: 40px;
    }

    .display-4 {
        font-size: 50px;
    }
}

h1, .h1, .QC_h1, h2, .h2, .QC_h2, h3, .h3, .QC_h3, h4, .h4, .QC_h4, h5, .h5, .QC_h5, h6 .h6, .QC_h6 {
    font-family: inherit;
    /*    font-weight: 600;
*/ line-height: 1.2;
    color: inherit;
}

h1, .h1, .QC_h1, h2, .h2, .QC_h2, h3, .h3, .QC_h3 {
    font-weight: 800;
    margin-top: 20px;
    margin-bottom: 10px;
}

h4, .h4, .QC_h4, h5, .h5, .QC_h5, h6, .h6, .QC_h6 {
    margin-top: 10px;
    margin-bottom: 10px;
}

h1, .h1, .QC_h1 {
    font-size: 34px !important;
}

h2, .h2, .QC_h2 {
    font-size: 30px !important;
}

h3, .h3, .QC_h3 {
    font-size: 24px !important;
}

h4, .h4, .QC_h4 {
    font-size: 18px !important;
}

h5, .h5, .QC_h5 {
    font-size: 16px !important;
}

h6, .h6, .QC_h6 {
    font-size: 14px !important;
}

.english-font {
    font-family: "Fira Sans", sans-serif;
}

.bold, .fw-bold {
    font-weight: bold;
}

.lighter {
    font-weight: lighter;
}

@media (max-width: 575.98px) {
    .fw-bold-xs {
        font-weight: bold;
    }

    .QC_relative-position-xs, .relative-xs, .position-relative-xs {
        position: relative !important;
    }

    .QC_absolute-position-xs, .absolute-xs, .position-absolute-xs {
        position: absolute !important;
    }

    .QC_fixed-position-xs, .fixed-xs, .position-fixed-xs {
        position: fixed !important;
    }

    .QC_static-position-xs, .static-xs, .position-static-xs {
        position: static !important;
    }
}

@media (max-width: 767.98px) {
    h1, .h1, .QC_h1 {
        font-size: 24px !important;
    }

    h2, .h2, .QC_h2 {
        font-size: 20px !important;
    }

    h3, .h3, .QC_h3 {
        font-size: 16px !important;
    }

    h4, .h4, .QC_h4 {
        font-size: 14px !important;
    }

    h5, .h5, .QC_h5 {
        font-size: 12px !important;
    }

    h6, .h6, .QC_h6 {
        font-size: 10px !important;
    }

    .fw-bold-sm {
        font-weight: bold;
    }
}

@media (max-width: 991.98px) {
    .fw-bold-md {
        font-weight: bold;
    }
}

/*****************************************/
/* Font Styles End */
/*****************************************/

/*****************************************/
/* Icon Font */
/*****************************************/
@font-face {
    font-family: 'linecons';
    src: url("linecons.eot");
    src: url("linecons.eot") format('embedded-opentype'), url("linecons.woff") format('woff'), url("linecons.ttf") format('truetype'), url("linecons.svg") format('svg');
    font-weight: normal;
    font-style: normal;
}

.icon {
    font-family: 'linecons';
}

    .icon:before {
        font-family: 'linecons';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        display: inline-block;
        margin-right: 0.6em;
        -webkit-font-smoothing: antialiased;
    }
/*****************************************/
/* Icon Font End */
/*****************************************/

/*****************************************/
/* Links */
/*****************************************/
.stretched-link::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    content: "";
}
/*****************************************/
/* Links End */
/*****************************************/

.bg-size-50 {
    background-size: 50%;
    transform: scale(0.6);
}

@media (max-width: 767px) {
    .bg-size-50-xs {
        background-size: 50%;
        transform: scale(0.6);
    }
}

/*****************************************/
/* WIDTH */
/*****************************************/
.w-50 {
    width: 50%;
}

.w-100 {
    width: 100%;
}

.w-auto {
    width: auto;
}

@media (min-width: 768px) {
    .w-md-50 {
        width: 50%;
    }

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

    .w-md-auto {
        width: auto;
    }
}

@media (min-width: 992px) {
    .w-lg-50 {
        width: 50%;
    }

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

    .w-lg-auto {
        width: auto;
    }
}
/*****************************************/
/* WIDTH End */
/*****************************************/

/*****************************************/
/* Styling for Input type=["range"] */
/*****************************************/
input[type="range"].amount-slider-bar {
    direction: ltr;
    border: solid 0px #00b300;
    height: 4px;
    outline: none;
    transition: background 200ms ease-in;
    -webkit-appearance: none;
    background: #f3f3f3;
    border-radius: 0 !important;
    background-image: linear-gradient(#e00570, #e00570);
    background-size: 0% 100%;
    background-repeat: no-repeat;
}

    /* Input Thumb */
    input[type="range"].amount-slider-bar::-webkit-slider-thumb {
        background-color: #e00570;
        background-image: url("checkmark.svg");
        background-size: 55%;
        background-repeat: no-repeat;
        background-position: center;
        border: solid 2px #fff;
        box-shadow: 0 0 10px 2px #ddd;
        height: 25px;
        width: 25px;
        padding: 5px;
        border-radius: 50%;
        -webkit-appearance: none;
    }

    input[type="range"].amount-slider-bar:-moz-range-thumb {
        background-color: #e00570;
        background-image: url("checkmark.svg");
        background-size: 55%;
        background-repeat: no-repeat;
        background-position: center;
        border: solid 2px #fff;
        height: 25px;
        width: 25px;
        padding: 5px;
        border-radius: 50%;
        -webkit-appearance: none;
    }

    input[type="range"].amount-slider-bar::-ms-thumb {
        background-color: #e00570;
        background-image: url("checkmark.svg");
        background-size: 55%;
        background-repeat: no-repeat;
        background-position: center;
        border: solid 2px #fff;
        height: 25px;
        width: 25px;
        padding: 5px;
        border-radius: 50%;
        -webkit-appearance: none;
    }

/* Input Track */
input[type=range].amount-slider-bar::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    box-shadow: none;
    border: none;
    background: transparent;
}

input[type=range].amount-slider-bar:-moz-range-track {
    -webkit-appearance: none;
    box-shadow: none;
    border: none;
    background: transparent;
}

input[type="range"].amount-slider-bar::-ms-track {
    -webkit-appearance: none;
    box-shadow: none;
    border: none;
    background: transparent;
}

.range-donate-value > span {
    position: absolute;
    top: -26.5px;
    left: 50%;
    width: 2px;
    height: 18px;
    background-color: #e4e4e4;
}

.range-container > p {
    width: 40px;
}
/*****************************************/
/* Styling for Input type=["range"] END */
/*****************************************/
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
    outline: none;
    outline-offset: unset;
}

.blend-mode {
    background-blend-mode: multiply;
}
/*****************************************/
/* Styling for Input type=["range"] for fanzone */
/*****************************************/
.fan-zone-slider input[type="range"].amount-slider-bar {
    border: solid 0px #00b300;
    height: 12px;
    outline: none;
    border-radius: 16px !important;
    background: transparent linear-gradient(90deg, #D9D9D9 0%, #D9D9D9 14%, #EB1515 14%, #E8CB2B 52%, #66E20C 100%) 0% 0% no-repeat padding-box;
}

    /* Input Thumb */
    .fan-zone-slider input[type="range"].amount-slider-bar::-webkit-slider-thumb {
        position: relative;
        background: url("");
        background-position: center;
        border: solid 2px #fff;
        box-shadow: 0 0 10px 2px #ddd;
        height: 32px;
        width: 32px;
        border-radius: 50%;
        -webkit-appearance: none;
        z-index: 100;
    }

    .fan-zone-slider input[type="range"].amount-slider-bar:-moz-range-thumb {
        position: relative;
        background: url("");
        background-position: center;
        border: solid 2px #fff;
        box-shadow: 0 0 10px 2px #ddd;
        height: 32px;
        width: 32px;
        border-radius: 50%;
        -webkit-appearance: none;
        z-index: 5;
    }

    .fan-zone-slider input[type="range"].amount-slider-bar::-ms-thumb {
        position: relative;
        background: url("");
        background-position: center;
        border: solid 2px #fff;
        box-shadow: 0 0 10px 2px #ddd;
        height: 32px;
        width: 32px;
        border-radius: 50%;
        -webkit-appearance: none;
        z-index: 5;
    }

/* Input Track */
.fan-zone-slider input[type=range].amount-slider-bar::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    box-shadow: none;
    border: none;
    background: transparent;
}

.fan-zone-slider input[type=range].amount-slider-bar:-moz-range-track {
    -webkit-appearance: none;
    box-shadow: none;
    border: none;
    background: transparent;
}

.fan-zone-slider input[type="range"].amount-slider-bar::-ms-track {
    -webkit-appearance: none;
    box-shadow: none;
    border: none;
    background: transparent;
}

.fan-zone-slider .range-donate-value > span {
    position: absolute;
    top: -26.5px;
    left: 50%;
    width: 2px;
    height: 14px;
    background-color: white;
    z-index: 0;
}

.fan-zone-slider .range-container > p {
    width: 40px;
}

.fan-zone-slider .text-top {
    top: 50%;
}
/*****************************************/
/* Styling for Input type=["range"] END */
/*****************************************/
@media(min-width: 768px) {
    .wave-bg {
        background-image: linear-gradient(to bottom, #FFF, #DAE0F5);
        padding-bottom: 0 !important;
    }

        .wave-bg:after {
            content: '';
            background: url("") center no-repeat;
            background-size: cover;
            display: block;
            height: 300px;
            margin-top: -180px;
        }
}

.highlight-pink {
    background-color: #F16474;
}

@media (max-width: 575px) {
    .highlight-pink-xs {
        background-color: #F16474;
    }
}

@media (max-width: 991px) {
    .highlight-pink-sm {
        background-color: #F16474;
    }
}

.astrisk:before {
    content: '*';
    display: block;
    position: absolute;
    left: 0;
    left: 0;
    font-size: 18px;
    color: #d62446;
}

input[type=text], input[type=number], input[type=tel], input[type=date], input[type=email], input[type=datetime], input[type=password], select, textarea {
    font-size: 15px !important;
}

#tempModal.in {
    flex-flow: column;
    justify-content: center;
}

#tempBtnMobile {
    background: url("") no-repeat;
    width: 64px;
    height: 168px;
    top: 50%;
    z-index: 999;
}

@media (min-width: 992px) {
    #tempBtnMobile {
        top: 70px;
    }
}

#tempBtnMobileTxt {
    line-height: 180px;
}

#mySpinner.spinner {
    position: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100vw;
    height: 100vh;
    margin-top: 0;
    margin-left: 0;
    top: 0;
    left: 0;
    /*    transform: translate(-50%, -50%);
*/
}

    #mySpinner.spinner:before {
        top: auto;
        left: auto;
    }

    #mySpinner.spinner::after {
        content: '';
        position: absolute;
        background-color: rgba(0,0,0,.5);
        width: 100vw;
        height: 100vh;
    }

/*****************************************/
/* Sponsorship Report */
/*****************************************/
.sponsorshipReport-banner {
    background: url("") no-repeat center top;
}

@media (max-width: 767px) {
    .sponsorshipReport-banner {
        background-size: cover;
    }
}

.margin-minus-160-300 {
    margin-top: -300px;
}

@media (max-width: 767px) {
    .margin-minus-160-300 {
        margin-top: -160px;
    }
}
/*****************************************/
/* Sponsorship Report End */
/*****************************************/

/****************************************
    ************* FaceBox ***************
    *************************************/
#facebox {
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 100vh;
    max-height: 100vh;
    border-radius: 10px;
    z-index: 10001;
    -webkit-box-shadow: 0 0 18px rgba(0,0,0,0.4);
    -moz-box-shadow: 0 0 18px rgba(0,0,0,0.4);
    box-shadow: 0 0 18px rgba(0,0,0,0.4);
}

    #facebox .popupf {
        display: flex;
        justify-content: center;
        max-width: 500px;
        padding: 30px 20px 15px 20px;
        box-shadow: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
    }

@media only screen and (min-width : 576px) {
    #facebox {
        top: 170px;
        width: auto;
        height: auto;
    }

        #facebox .popupf {
            margin-top: 0;
            box-shadow: 0 0 18px rgba(0,0,0,0.4);
            -webkit-box-shadow: 0 0 18px rgba(0,0,0,0.4);
            -moz-box-shadow: 0 0 18px rgba(0,0,0,.4);
        }
}

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

#facebox .close {
    right: 0;
    margin: 0;
    padding: 1px;
    top: 10px;
    left: auto;
    right: 10px;
}

    #facebox .close img {
        opacity: 1;
        padding: 0;
        margin: 0;
    }

/****************************************
    ************* Modal ***************
    *************************************/
.close {
    width: 45px;
    height: 45px;
    padding-bottom: 3px;
    align-self: flex-end;
    margin: 10px 15px;
    background-color: #3C3C3C !important;
    color: #FFF;
    border-radius: 50%;
    line-height: 38px;
    font-size: 21px; /***** It changed from "25px" for this page https://localhost:3114/en/qa/campaign?CampaignId=377 Custom Amount PopUp *****/
    font-weight: 200;
    opacity: 1;
}

    .close:hover, .close:focus {
        opacity: 1;
        color: #FFF;
        background-color: #E00570 !important;
    }

@media (max-width: 575px) {
    .close {
        width: 30px;
        height: 30px;
        line-height: 26px;
    }
}

.modal-header > .close {
    align-self: flex-start;
    margin: 0;
}

@media (min-width: 576px) {
    .close {
        top: 5px;
        margin: 30px;
    }
}

.modal-open {
    overflow: hidden;
}

    .modal-open .modal {
        overflow-x: hidden;
        overflow-y: auto;
    }

.modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1050;
    display: none;
    width: 100%;
    height: 100%;
    overflow: hidden;
    outline: 0;
}

.modal-open .modal.modal-bottom-transition {
    overflow-y: hidden;
}

.modal.fade.modal-bottom-transition .modal-dialog {
    -webkit-transition: all 0.5s cubic-bezier(.93,.01,.1,1.25);
    -moz-transition: all 0.5s cubic-bezier(.93,.01,.1,1.25);
    -o-transition: all 0.5s cubic-bezier(.93,.01,.1,1.25);
    transition: all 0.5s cubic-bezier(.93,.01,.1,1.25);
    will-change: top;
    -webkit-transform: translate(0,25%);
    -ms-transform: translate(0,25%);
    -o-transform: translate(0,25%);
    transform: translate(0,25%);
    overflow-y: hidden;
}

.modal.in.modal-bottom-transition .modal-dialog {
    -webkit-transition: all 0.5s cubic-bezier(.93,.01,.1,1.25);
    -moz-transition: all 0.5s cubic-bezier(.93,.01,.1,1.25);
    -o-transition: all 0.5s cubic-bezier(.93,.01,.1,1.25);
    transition: all 0.5s cubic-bezier(.93,.01,.1,1.25);
    will-change: bottom;
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    -o-transform: translate(0,0);
    transform: translate(0,0);
}

.modal-dialog {
    position: relative;
    width: auto;
    margin: 0.5rem;
    pointer-events: none;
}

.modal.fade .modal-dialog {
    transition: transform 0.3s ease-out;
    /*transform: translate(0, -50px);*/
}

@media (prefers-reduced-motion: reduce) {
    .modal.fade .modal-dialog {
        transition: none;
    }
}

.modal.show .modal-dialog {
    transform: none;
}

.modal.modal-static .modal-dialog {
    transform: scale(1.02);
}

.modal-dialog-scrollable {
    height: calc(100% - 1rem);
}

    .modal-dialog-scrollable .modal-content {
        max-height: 100%;
        overflow: hidden;
    }

    .modal-dialog-scrollable .modal-body {
        overflow-y: auto;
    }

.modal-dialog-centered {
    display: flex;
    /*Custom*/
    flex-direction: column;
    justify-content: center;
    /*Custom*/
    align-items: center;
    min-height: calc(100% - 1rem);
}

.modal-content {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1.3px solid rgba(0, 0, 0, 0.2);
    border-radius: 0.75rem;
    outline: 0;
}

.modal-header {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: flex-end;
    padding: 15px;
    border-bottom: 1.3px solid #dadce0;
    border-top-left-radius: calc(0.75rem - 1.3px);
    border-top-right-radius: calc(0.75rem - 1.3px);
}

    .modal-header .btn-close {
        padding: 0.5rem 0.5rem;
        margin: -0.5rem -0.5rem -0.5rem auto;
    }

.modal-title {
    margin-bottom: 0;
    line-height: 1.5;
}

.modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: 1rem;
}

.modal-footer {
    display: flex;
    flex-wrap: wrap;
    flex-shrink: 0;
    align-items: center;
    justify-content: flex-end;
    padding: 0.75rem;
    border-top: 1.3px solid #dadce0;
    border-bottom-right-radius: calc(0.75rem - 1.3px);
    border-bottom-left-radius: calc(0.75rem - 1.3px);
}

    .modal-footer > * {
        margin: 0.25rem;
    }

.modal-scrollbar-measure {
    position: absolute;
    top: -9999px;
    width: 50px;
    height: 50px;
    overflow: scroll;
}

@media (min-width: 576px) {
    .modal-dialog {
        max-width: 500px;
        margin: 1.75rem auto;
    }

    .modal-dialog-scrollable {
        height: calc(100% - 3.5rem);
    }

    .modal-dialog-centered {
        min-height: calc(100% - 3.5rem);
    }

    .modal-sm {
        max-width: 300px;
    }
}

@media (min-width: 992px) {
    .modal-lg,
    .modal-xl {
        max-width: 800px;
    }
}

@media (min-width: 1200px) {
    .modal-xl {
        max-width: 1140px;
    }
}

.modal-fullscreen {
    width: 100vw;
    max-width: none;
    height: 100%;
    margin: 0;
}

    .modal-fullscreen .modal-content {
        height: 100%;
        border: 0;
        border-radius: 0;
    }

    .modal-fullscreen .modal-header {
        border-radius: 0;
    }

    .modal-fullscreen .modal-body {
        overflow-y: auto;
    }

    .modal-fullscreen .modal-footer {
        border-radius: 0;
    }

@media (max-width: 575.98px) {
    .modal-fullscreen-sm-down {
        width: 100vw;
        max-width: none;
        height: 100%;
        margin: 0;
    }

        .modal-fullscreen-sm-down .modal-content {
            height: 100%;
            border: 0;
            border-radius: 0;
        }

        .modal-fullscreen-sm-down .modal-header {
            border-radius: 0;
        }

        .modal-fullscreen-sm-down .modal-body {
            overflow-y: auto;
        }

        .modal-fullscreen-sm-down .modal-footer {
            border-radius: 0;
        }
}

@media (max-width: 767.98px) {
    .modal-fullscreen-md-down {
        width: 100vw;
        max-width: none;
        height: 100%;
        margin: 0;
    }

        .modal-fullscreen-md-down .modal-content {
            height: 100%;
            border: 0;
            border-radius: 0;
        }

        .modal-fullscreen-md-down .modal-header {
            border-radius: 0;
        }

        .modal-fullscreen-md-down .modal-body {
            overflow-y: auto;
        }

        .modal-fullscreen-md-down .modal-footer {
            border-radius: 0;
        }
}

@media (max-width: 991.98px) {
    .modal-fullscreen-lg-down {
        width: 100vw;
        max-width: none;
        height: 100%;
        margin: 0;
    }

        .modal-fullscreen-lg-down .modal-content {
            height: 100%;
            border: 0;
            border-radius: 0;
        }

        .modal-fullscreen-lg-down .modal-header {
            border-radius: 0;
        }

        .modal-fullscreen-lg-down .modal-body {
            overflow-y: auto;
        }

        .modal-fullscreen-lg-down .modal-footer {
            border-radius: 0;
        }
}

@media (max-width: 1199.98px) {
    .modal-fullscreen-xl-down {
        width: 100vw;
        max-width: none;
        height: 100%;
        margin: 0;
    }

        .modal-fullscreen-xl-down .modal-content {
            height: 100%;
            border: 0;
            border-radius: 0;
        }

        .modal-fullscreen-xl-down .modal-header {
            border-radius: 0;
        }

        .modal-fullscreen-xl-down .modal-body {
            overflow-y: auto;
        }

        .modal-fullscreen-xl-down .modal-footer {
            border-radius: 0;
        }
}

@media (max-width: 1399.98px) {
    .modal-fullscreen-xxl-down {
        width: 100vw;
        max-width: none;
        height: 100%;
        margin: 0;
    }

        .modal-fullscreen-xxl-down .modal-content {
            height: 100%;
            border: 0;
            border-radius: 0;
        }

        .modal-fullscreen-xxl-down .modal-header {
            border-radius: 0;
        }

        .modal-fullscreen-xxl-down .modal-body {
            overflow-y: auto;
        }

        .modal-fullscreen-xxl-down .modal-footer {
            border-radius: 0;
        }
}

.project-details-img {
    height: 100vh;
    max-height: 330px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #000;
}

@media (min-width: 992px) {
    .project-details-img {
        max-height: 585px;
    }
}

/*****************************************/
/* Project Report */
/*****************************************/
.projectReport-banner {
    background: #E8EEF3;
}

/*@media (max-width: 767px) {
    .projectReport-banner {
        background-size: cover;
    }*/

/*****************************************/
/* Project Report End */
/*****************************************/


/*****************************************/
/* Annual Report */
/*****************************************/
.annual-total-bg {
    background: rgb(67,106,179);
    background: linear-gradient(330deg, rgba(67,106,179,1) 0%, rgba(50,188,173,1) 50%, rgba(88,194,157,1) 70%, rgba(132,201,139,1) 100%);
    background-size: cover;
    display: block;
    background-repeat: no-repeat;
    background-size: 100%;
}

.annual-purple-bg {
    background: transparent linear-gradient(180deg, #533A6D 0%, #524FA1 50%, #8B60A8 100%) 0% 0% no-repeat padding-box;
    background-size: cover;
    display: block;
    background-repeat: no-repeat;
    background-size: 100%;
}

.annual-total-img {
    background-image: url("");
    background-position: center;
    height: 507px;
}

    .annual-total-img > p {
        font-size: 38px;
        margin-top: 170px;
    }

.annual-zakat-bg {
    background: url("") no-repeat;
    height: 240px;
}

.annual-zakat-img {
    background-image: url("");
    background-position: right;
    height: 212px;
    margin-top: 40px;
}

.annual-qc-bg {
    background-image: url("");
    height: 206px;
}

.annual-qc-img {
    background-image: url("");
    background-position: center;
    height: 200px;
    margin-top: 6px;
}


@media (max-width: 991px) {
    .annual-total-bg {
        height: 750px;
    }

    .annual-total-img {
        background-image: url("");
        height: 290px;
    }

        .annual-total-img > p {
            font-size: 30px;
            margin-top: 98px;
        }

    .annual-qc-img {
        background-size: 275px;
        height: 200px;
        background-position-y: bottom;
    }
}

@media (max-width: 767px) {
    .annual-total-bg {
        height: 930px;
    }

    .annual-zakat-bg {
        background: url("") no-repeat;
        background-size: cover;
        height: 490px;
    }

    .annual-zakat-img {
        height: 120px;
        background-size: 145px 120px;
        background-position-x: left;
        margin-top: 30px;
    }

    .annual-qc-bg {
        background-image: url("");
        background-size: cover;
        height: 500px;
    }

    .annual-qc-img {
        height: 200px;
        background-size: 280px;
    }
}

/*****************************************/
/* Annual Report End */
/*****************************************/
section.QC_dal-card-banner {
    background: #117C9B;
}

.QC_dal-card-banner > .container {
    background: url("dal-home-card.jpg") no-repeat;
    background-position-x: right;
    background-size: contain;
}

/*****************************************/
/* DS Calendar */
/*****************************************/
.calendar.QC_calendar thead.event-days td {
    background: #E6E6E6;
    background-color: #E6E6E6;
    border-radius: 0;
    border: none;
    height: 68px;
    line-height: 66px;
    font-size: 14px;
    text-align: center;
    margin-bottom: 10px;
}

    .calendar.QC_calendar thead.event-days td:first-child {
        border-radius: 8px 0 0 8px;
    }

    .calendar.QC_calendar thead.event-days td:last-child {
        border-radius: 0 8px 8px 0;
    }

.calendar.QC_calendar td {
    background: #F7F9FA;
    background-color: #F7F9FA;
    border: 2px solid rgba(255, 255, 255, 1);
    border-radius: 8px;
    display: inline-block;
    height: 78px;
    line-height: 110px;
    text-align: right;
    width: 14.2%;
    font-size: 20px;
    margin: 0;
    padding: 5px 10px;
}

.calendar.QC_calendar tbody td:hover {
    border: 2px solid rgba(224, 5, 112, 0.9);
}

.calendar.QC_calendar tbody td.event {
    background: #E8EEF3;
    background-color: #E8EEF3;
}

    .calendar.QC_calendar tbody td.current-day, .calendar.QC_calendar tbody td.current-day.event, .calendar.QC_calendar tbody td.event.active {
        background: #9F0B56;
        background-color: #9F0B56;
        border: 1px solid rgba(255, 255, 255, 1);
        color: #FFF;
    }

.event:before {
    /*border-radius: 50%;*/
    top: 5px;
    display: block;
    content: '';
    width: 22px;
    height: 22px;
    right: 5px;
    /*margin: -4px 0 0 -4px;*/
    position: absolute;
}

.event.DeductionSuccess:before {
    background: url("") no-repeat;
}

.event.DeductionFailed:before {
    background: url("") no-repeat;
}

.event.DeductionInProgress:before {
    background: url("") no-repeat;
}

.event:after {
    display: none;
    visibility: hidden;
    content: none;
    background: none;
}

.red-light {
    color: #e00570 !important;
}

.padding-2-right-xs {
    padding-right: 2px;
    padding-left: 0px;
}

/*Edit Button in Main Account Details custom top*/

.editButtonDonationDetails {
    top: 60px;
}

@media (min-width: 575px) and (max-width: 992px) {
    .editButtonDonationDetails {
        top: 120px;
    }
}


@media (min-width: 992px) and (max-width: 1198px) {
    .editButtonDonationDetails {
        top: 20px;
    }
}

/*End Edit Button in Main Account Details custom top*/

/*Gift Index custom height start*/
.gift-height {
    height: 351px;
}

@media only screen and (max-width: 575px) {
    .gift-height {
        height: 370px;
    }
}

@media (min-width: 575px) and (max-width: 992px) {
    .gift-height {
        height: 300px;
    }
}

@media (min-width: 992px) and (max-width: 1198px) {
    .gift-height {
        height: 400px;
    }
}
/*End Gift Index custom height*/

@media (min-width: 991px) {
    .padding-none-md {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    .box-none-md {
        background: none;
        -webkit-box-shadow: none !important;
        -moz-box-shadow: none !important;
        box-shadow: none !important;
    }
}

@media only screen and (max-width: 575px) {
    .calendar.QC_calendar thead.event-days td {
        height: 48px;
        line-height: 44px;
        font-size: 11px;
    }

    .calendar.QC_calendar td {
        height: 46px;
        line-height: 52px;
        font-size: 11px;
    }

    .event:before {
        background-size: 14px !important;
        width: 14px;
        height: 14px;
    }
}
/*****************************************/
/* DS Calendar END */
/*****************************************/
/*****************************************/
/* SWITCH BUTTON */
/*****************************************/
.label-success {
    background-color: #43C0B9;
}

.material-switch > input[type="checkbox"] {
    display: none;
}

.material-switch > label {
    cursor: pointer;
    height: 0px;
    position: relative;
    width: 40px;
}

    .material-switch > label::before {
        background: rgb(0, 0, 0);
        box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.5);
        border-radius: 8px;
        content: '';
        height: 16px;
        margin-top: -8px;
        position: absolute;
        opacity: 0.3;
        transition: all 0.4s ease-in-out;
        width: 40px;
    }

    .material-switch > label::after {
        background: rgb(255, 255, 255);
        border-radius: 16px;
        box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
        content: '';
        height: 24px;
        left: -4px;
        margin-top: -8px;
        position: absolute;
        top: -4px;
        transition: all 0.3s ease-in-out;
        width: 24px;
    }

.material-switch > input[type="checkbox"]:checked + label::before {
    background: inherit;
    opacity: 0.5;
}

.material-switch > input[type="checkbox"]:checked + label::after {
    background: inherit;
    left: 20px;
}
/*****************************************/
/* SWITCH BUTTON END */
/*****************************************/

.winterLebanon-section {
    /*background: rgb(255,255,255);*/
    background-blend-mode: multiply;
    background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(216,234,255,1) 100%), url("");
    background-repeat: no-repeat;
    padding-top: 234px;
    padding-bottom: 50px;
}

@media (min-width: 768px) {
    .winterLebanon-section {
        background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(216,234,255,1) 100%), url("");
        background-repeat: no-repeat;
        padding-top: 434px;
        padding-bottom: 100px;
    }
}

.vh-100-menu {
    height: calc(100vh - 62px)
}

@media (max-width: 767.98px) {
    .vh-100-menu {
        height: calc(100vh - 56px)
    }
}

.vh-100 {
    height: 100vh;
}

.vh-95 {
    height: 95vh;
}

.vh-90 {
    height: 90vh;
}

@media (max-width: 575px) {
    .vh-65-xs {
        height: 65vh;
        /*margin-top: 60px;*/
    }
}

.QC_campaign
.tooltip .tooltip-inner {
    background-color: #fff;
    color: inherit;
    border-radius: 8px;
    box-shadow: 0px 8px 8px -5px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0px 8px 8px -5px rgba(0, 0, 0, 0.3);
    border: 1px solid #F5F5F5;
    width: 290px;
    max-width: 290px;
    text-align: left;
    font-size: 12px;
    line-height: 22px;
    padding: 12px 10px;
}

.tooltip.top .tooltip-arrow {
    border-top-color: #fff;
    box-shadow: 0px 8px 8px -5px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0px 8px 8px -5px rgba(0, 0, 0, 0.3);
    width: 3px;
    height: 4px;
}

@media only screen and (orientation: portrait) {
    .wootric-visible {
        border-radius: 0 !important;
    }
}
/*For phases only*/
.organizationformcheckbox {
    float: left;
    margin-right: 10px !important;
}
/*End*/

.reportboxcustomheight {
    height: 500px;
}

.col-sm-2-edit {
    width: 14%;
}

.QC_cover-bg {
    background-size: cover !important;
}

.text-justify.QC_text-justify:after {
    content: "";
    display: inline-block;
    width: 100%;
}

.Mobile-apps-inner-back {
    background-image: url("");
    background-size: inherit;
    background-repeat: no-repeat;
    min-height: 462px;
    background-attachment: fixed;
    background-position: top center;
}

.influencer-profile-photo {
    width: 166px;
    height: 166px;
    border: 3px solid #F3F3F3;
}

.influencer-dalTooltip-mobile {
    margin-top: -55px;
    left: calc(70px - 30px);
    top: calc(120px - 30px)
}

@media (max-width: 767px) {

    .influencer-section {
        padding: 20px 0;
        height: 720px !important;
    }

    .influencer-profile-photo {
        width: 110px;
        height: 110px;
    }
}

.slider-track-detail {
    position: relative;
    background: #bfbaba;
    width: 100%;
}

.slider-track-detail {
    position: relative;
    background: #bfbaba;
    width: 100%;
}

.slider-selection-detail {
    position: absolute;
    left: 0%;
    height: 100%;
    top: 0;
    bottom: 0;
    background: #9F0B56;
}

.slider-handle-detail {
    height: 10px;
    opacity: 1;
    filter: opacity(100);
}

.QC_banner-video {
    width: 80px;
    height: 80px;
    padding: 0 !important;
    position: absolute;
    left: calc(50% - 40px);
    top: calc(35% - 40px);
    cursor: pointer;
    display: none;
    font-size: 111px;
    color: rgba(255, 255, 255, 0.85);
}

@media(min-width: 576px) {
    .QC_banner-video {
        left: calc(50% - 40px);
        top: calc(50% - 40px);
    }
}

.navbar-toggle {
    margin-top: 10px;
}

.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    background-color: transparent;
}

.mp-menu {
    z-index: 1100;
}

    .mp-menu ul li > a {
        padding: 0 15px;
        line-height: 50px;
    }

.change-language {
    font-family: 'Noto Kufi Arabic' !important;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover {
    background-color: transparent;
}

.QC_profile-image, .QC_profile-image > img {
    width: 24px;
    height: 24px;
}

.QC_profile-image-40, .QC_profile-image-40 > img {
    width: 40px;
    height: 40px;
}

.mp-menu ul.list-circle {
    margin: 0;
    padding: 0 0 0 30px;
    list-style: initial;
    color: #ccc;
}

.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
    width: 35% !important;
}

.circle-text {
    background-color: #00447A;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    position: absolute;
    top: calc( 100% - 50px );
    line-height: 50px !important;
    color: #fff;
    font-weight: bold;
    display: block;
    left: calc( 50% - 25px );
}

.mobile-app-icons-66 {
    width: 66px !important;
    height: 66px !important;
}

/**********************************/
.our-vision, .our-mission {
    min-height: 262px;
    height: 700px;
    background-size: 55%;
    padding: 10% 0 0 0;
}

.our-vision {
    background-image: url("");
    background-position: right;
}

.our-mission {
    background-image: url("");
    background-position: left;
}

.QC-sticky {
    position: fixed;
    top: 96px;
    width: 100%;
    z-index: 45;
}

.QC_text-shadow {
    /*-webkit-text-shadow: 0 0 18px rgba(0,0,0,0.4);
    -moz-text-shadow: 0 0 18px rgba(0,0,0,0.4);*/
    text-shadow: 0 0 18px rgba(0,0,0,0.4);
}

.QC_margin-62-top-of-body {
    margin-top: 62px;
}

.treand {
    background-color: #fff;
    top: 56px;
    /*box-shadow: 0 -4px 14px 0px;*/
    position: fixed;
    z-index: 40;
    right: 0;
    left: 0;
    /*padding-top: 2px;*/
}

.treand-img {
    border-right: 1px solid #ccc;
    display: inline !important;
    padding: 0 5px !important;
}

@media only screen and (min-width : 768px) {
    .QC_margin-62-top-of-body {
        margin-top: 64px;
    }

    .treand {
        top: 62px;
    }
}

@media only screen and (min-width : 1200px) {
    .QC_margin-62-top-of-body {
        margin-top: 98px;
    }

    .treand {
        top: 94px;
    }
}

.new_feature-label {
    transform: translateX(31px) translateY(34px) rotate( 45deg );
}

.new_feature-text {
    transform: translateX(67px) translateY(12px) rotate( 45deg );
}

.RamadanCampaign-SliderItems {
    background-blend-mode: multiply;
    height: 350px;
}

@media only screen and (min-width : 992px) {
    .RamadanCampaign-SliderItems {
        height: 380px;
    }
}
/*************************New search*****************************/
#SuggestionSearchDataDiv {
    width: 560px;
    z-index: 998;
}

#SearchVerticalDivMenu.newsearch {
    /*width: 100%;*/
    height: auto;
    z-index: 998;
    top: 60px;
    padding: 10px;
    left: 0;
    background: none;
    position: fixed;
    display: none;
}

#SearchVerticalDivMenu .select-newsearch {
    border: 1px solid #fff;
    margin-left: auto;
    margin-right: auto;
    color: #fff;
    height: 40px;
    margin: 8px 0px;
    padding: 0 5px;
    width: 100%;
    background-color: transparent;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
    text-indent: 0.01px;
    text-overflow: '';
    background-image: url("") !important;
    background-position: 10px;
    background-repeat: no-repeat;
    background-size: 10px;
}

    #SearchVerticalDivMenu .select-newsearch option {
        background-color: #00447A;
        border: none;
        margin: 10px 0px;
    }

#SearchVerticalDivMenu #SuggestionSearchDataDiv {
    background: #FFF;
}

button.accordion {
    background-color: #00447A;
    cursor: pointer;
    border: none;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
    padding: 10px 15px;
    color: #fff;
}

.txtSearchWordVertical {
    border: 1px solid #fff;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    color: #fff;
    font-size: 9px;
    height: 35px;
    margin: 16px 0px;
    width: 100% !important;
    font-size: 11px;
    background-color: transparent;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
}

.arrowUpOpenSearchVerticalForm {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #00447A !important;
    position: fixed;
    z-index: 50000;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
    top: 32px;
    margin-left: 56px;
    background: none;
    background-color: transparent;
}

.SelectedMenuItemSub {
    background-color: #00447A !important;
    color: #fff !important;
}

.ramadan-image-118-85 {
    width: 118px;
    height: 118px;
}

.arow-img-step-right {
    position: absolute;
    right: 0;
}

.arow-img-step-left {
    position: absolute;
    left: 0;
}

.width-32 {
    width: 32px !important;
}

.width-80 {
    width: 80px;
}

.width-260 {
    width: 260px;
}

.line-middel {
    position: absolute;
    width: 100%;
    top: 324px;
}

.line-above {
    height: 30px;
    width: 1px;
    background-color: #ccc;
    display: block;
    margin-right: 10px;
    margin-top: -40px;
    margin-right: 131px;
    position: absolute;
}

.line-down {
    height: 30px;
    width: 1px;
    background-color: #ccc;
    display: block;
    margin-right: 10px;
    margin-top: 195px;
    margin-right: 131px;
    position: absolute;
}

.line-year {
    height: 30px;
    width: 3px;
    background-color: #666;
    display: block;
    margin-right: 10px;
}

.top-0 {
    top: 0;
}

.top-175 {
    position: absolute;
    top: 175px;
}

.top-190 {
    position: absolute;
    top: 190px;
}

.modal-video {
    background-color: rgba(0,0,0,0.5);
}

.margin-left-mines-50 {
    margin-left: -50px;
    margin-right: auto;
}

.time-line-heigh {
    max-height: 610px;
    overflow: hidden
}

.modal-video-close-btn-circle {
    position: absolute;
    z-index: 2;
    top: 10px;
    right: 10px;
    left: auto;
    display: inline-block;
    width: 38px;
    height: 38px;
    overflow: hidden;
    border: 1px solid #fff;
    background: transparent;
    border-radius: 100%;
}

    .modal-video-close-btn-circle:before, .modal-video-close-btn-circle:after {
        content: '';
        position: absolute;
        height: 4px;
        width: 44%;
        right: 10px;
        left: auto;
        background: #fff;
        border-radius: 5px;
        top: 16px;
    }

    .modal-video-close-btn-circle:before {
        transform: rotate(45deg);
    }

    .modal-video-close-btn-circle:after {
        transform: rotate(-45deg);
    }

.close-btn-circle-gray {
    background: #E6E6E6;
}

    .close-btn-circle-gray:before, .close-btn-circle-gray:after {
        height: 2px;
        background: #000;
    }

.Project-type-width-pic {
    width: 90px !important;
}

.card-donation-box {
    width: 80%;
    height: 90%;
    position: absolute;
    z-index: 1001;
    top: auto;
    bottom: -100%;
    visibility: hidden;
    z-index: 10001;
    border-radius: 16px 16px 0 0;
    /*display: none;*/
    -webkit-transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
    -moz-transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
    -o-transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
    transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
}

    .card-donation-box.open {
        /*width: 375px;
        height: 100vh;
        left: auto;
        all 0.5s 0s ease*/
        visibility: visible;
        bottom: 0%;
        /*display: block;*/
        -webkit-transition: all 0.7s cubic-bezier(0.6,-0.28,0.74,0.05);
        -moz-transition: all 0.7s cubic-bezier(0.6,-0.28,0.74,0.05);
        -o-transition: all 0.7s cubic-bezier(0.6,-0.28,0.74,0.05);
        transition: all 0.7s cubic-bezier(0.6,-0.28,0.74,0.05);
    }

.today-project-btn, .help-btn {
    background-color: #fff;
    -webkit-box-shadow: 0 3px 6px 0 rgba(0,0,0,.3);
    -moz-box-shadow: 0 3px 6px 0 rgba(0,0,0,.3);
    box-shadow: 0 3px 6px 0 rgba(0,0,0,.3);
    -webkit-border-top-left-radius: 50px;
    -webkit-border-bottom-left-radius: 50px;
    -moz-border-radius-topleft: 50px;
    -moz-border-radius-bottomleft: 50px;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    height: 83px;
    width: 235px;
    z-index: 999;
    right: -35px;
    line-height: 15px;
    position: fixed;
    top: 180px;
    -webkit-transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
    -moz-transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
    -o-transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
    transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
    /*transition: all 0.5s cubic-bezier(.93,.01,.1,1.25);*/
}

    .today-project-btn.open, .help-btn.open {
        right: -250px;
        -webkit-transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
        -moz-transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
        -o-transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
        transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
    }

.today-project-box, .help-box {
    width: 375px;
    /*margin-left: 40px;*/
    position: fixed;
    z-index: 1001;
    right: -400px;
    left: auto;
    top: 0;
    bottom: auto;
    visibility: hidden;
    z-index: 10001;
    /*display: none;*/
    -webkit-transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
    -moz-transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
    -o-transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
    transition: all 0.5s cubic-bezier(0.6,0,0.74,0.05);
}

.help-box {
    height: 100vh;
}

.today-project-box {
    margin-top: 40px;
    height: auto;
}

    .today-project-box.open, .help-box.open {
        /*width: 375px;*/
        height: 100vh;
        left: auto;
        /*all 0.5s 0s ease*/
        /*display: block;*/
        right: 0;
        visibility: visible;
        -webkit-transition: all 0.7s cubic-bezier(0.6,-0.28,0.74,0.05);
        -moz-transition: all 0.7s cubic-bezier(0.6,-0.28,0.74,0.05);
        -o-transition: all 0.7s cubic-bezier(0.6,-0.28,0.74,0.05);
        transition: all 0.7s cubic-bezier(0.6,-0.28,0.74,0.05);
    }

    .today-project-box.open {
        margin-top: 40px;
        height: auto;
    }

.help-box.open {
    right: 0;
    left: auto;
}

@media only screen and (max-width : 575px) {
    /*    .help-box {
        width: 100%;
        right: 0;
        height: fit-content;
    }*/

    /*        .help-box.open {
            width: 100%;
            right: 0;
            height: fit-content;
        }
*/
    .today-project-box, .help-box {
        width: 100%;
        right: 0;
        /*height: fit-content;*/
        height: 75vh;
        top: auto;
        bottom: calc( -10% - 100vh ); /*100% - height*/
        will-change: top;
        border-radius: 24px 24px 0 0;
        /*height: 90vh;*/
        /*right: calc(50% - 187.5px);*/
        /*position: absolute;*/
        /*left: auto;*/
        /*bottom: 0;*/
        /*-webkit-transition: all .005s ease;
        -moz-transition: all .005s ease;
        -o-transition: all .005s ease;
        transition: all .005s ease;*/
        /*-webkit-transition: all 0.4s cubic-bezier(.93,.01,.1,1.25);
        -moz-transition: all 0.4s cubic-bezier(.93,.01,.1,1.25);
        -o-transition: all 0.4s cubic-bezier(.93,.01,.1,1.25);
        transition: all 0.4s cubic-bezier(.93,.01,.1,1.25);*/
    }

        .today-project-box.open, .help-box.open {
            width: 100%;
            right: 0;
            /*height: fit-content;*/
            height: 75vh;
            top: auto;
            bottom: 0;
            will-change: bottom;
            /*right: calc(50% - 187.5px);*/
            /*top: auto;*/
            /*left: auto;*/
            /*-webkit-transition: all 0.5s cubic-bezier(.93,.01,.1,1.25);
            -moz-transition: all 1s cubic-bezier(.93,.01,.1,1.25);
            -o-transition: all 1s cubic-bezier(.93,.01,.1,1.25);
            transition: all 1s cubic-bezier(.93,.01,.1,1.25);*/
        }

    .help-box-open.open {
        width: 100%;
        right: 0;
        /*height: fit-content;*/
        height: 75vh;
    }

    .today-project-inner-box {
        height: calc(100vh - 460px) !important;
    }
}

.today-project-btn span {
    line-height: 20px
}

.img-project-today {
    height: 62px;
    width: 62px;
    border: 1px solid #9F0B56;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    padding: 2px;
    background-size: cover;
}

.img-project-mobile {
    height: 40px;
    width: 40px;
    border: 1px solid #9F0B56;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    padding: 2px;
    background-size: cover;
    margin-top: 3px;
}

.responsive-image-project {
    height: 368px;
}

.today-project-circle-m {
    width: 64px;
    height: 64px;
    display: block;
    margin: 3px;
    border-radius: 16px;
}

.today-project-inner-box {
    height: 165px;
}


/****************Gift********************/

.circle-Gift {
    width: 70px;
    height: 70px;
    background-color: #EEE;
    display: inline-block;
    -webkit-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.08);
    -moz-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.08);
    box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.08);
    line-height: 75px;
}

.circle-projects {
    width: 58px;
    height: 58px;
    background-color: #F2CA50;
    display: inline-block;
    -webkit-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.08);
    -moz-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.08);
    box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.08);
    line-height: 52px;
    border-radius: 50%;
}

.box-gift-bg {
    background-image: url("") !important;
    background-position: 0 -24px !important;
    background-repeat: no-repeat !important;
    background-size: 100% !important;
}
/*****************tap****************/
.today-img-trand {
    border: 1px solid rgba(189,51,129,1);
    margin-left: 13px !important;
}

/*.bults-track::before {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    left: 50%;
    height: 5px;*/
    /*background-color: #43C0B9;*/
    /*top: 9px;
    border-radius: 24px;*/
    /*z-index: 0;*/
/*}*/

/*.bults-track:first-child::before {
    border-radius: 24px 0 0 24px;
    width: 50%;
    left: 50%;
}*/

.bults-track:last-child::before {
    width: 50%;
}

.project-done {
    border-left: 4px solid #43C0B9
}

    .project-done:last-child {
        border-left: 4px solid rgba(255,255,255,0);
    }

.project-progress {
    border-left: 4px solid #9F0B56;
}

    .project-progress:last-child {
        border-left: 4px solid rgba(255,255,255,0);
    }

.project-Next-steps {
    border-left: 2px solid #91908F;
    margin-left: 1px;
}

.project-track-tab-shadow {
    position: relative;
    z-index: 666;
    -webkit-box-shadow: 0px 8px 20px 0px rgba(0,0,0,0.07);
    -moz-box-shadow: 0px 8px 20px 0px rgba(0,0,0,0.07);
    box-shadow: 0px 8px 20px 0px rgba(0,0,0,0.07);
}

.project-track-tap:active, .project-track-tap::before, .project-track-tap::before, .project-track-tap:hover, .project-track-tap:active a {
    background-color: #00447A !important;
    border: 1px solid #00447A !important;
    color: #fff !important;
}

.project-track-tap {
    border: 1px solid #00447A !important;
}

.ui-tabs .ui-tabs-nav a.ui-tabs-anchor, .nav-tabs > li > a > .project-track-tap {
    color: #00447A;
}

.right-shadow {
    box-shadow: 8px 0 12px -12px;
}

#msc {
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    height: 40px;
    line-height: 28px;
    overflow: hidden;
    position: relative;
    font-size: 12px;
    text-transform: uppercase;
}

#hdtb-sc {
    -webkit-user-select: none;
    display: block;
    overflow-y: hidden;
    padding: 8px 20px;
    position: relative;
    -webkit-overflow-scrolling: touch;
    overflow-x: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE 10+ */
}

    #hdtb-sc::-webkit-scrollbar {
        width: 0px;
        background: transparent; /* make scrollbar transparent */
    }

#hdtb-msb {
    display: -webkit-inline-box;
    white-space: nowrap;
    overflow: hidden;
    position: relative;
}

    #hdtb-more, #hdtb-msb .hdtb-imb, #hdtb-msb .hdtb-imb.hdtb-msel, #hdtb-tls,
    #hdtb-more > p, #hdtb-msb .hdtb-imb > p, #hdtb-msb .hdtb-imb.hdtb-msel > p, #hdtb-tls > p {
        display: flex;
        align-items: center;
        align-content: center;
        justify-content: center;
        /*height: 60px;*/
        margin: 0;
        text-align: center;
        cursor: pointer;
    }

.tab-container {
    border-bottom: 1px solid rgba(82, 82, 82, 0.65);
    height: 44px;
    margin: 0 15px;
}

.h-tabs {
    min-width: 120px;
    height: 43px !important;
}

.msc {
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    height: 40px;
    line-height: 28px;
    overflow: hidden;
    position: relative;
    font-size: 12px;
    text-transform: uppercase;
}

.hdtb-sc {
    -webkit-user-select: none;
    display: block;
    overflow-y: hidden;
    padding: 2px 0 5px;
    position: relative;
    -webkit-overflow-scrolling: touch;
    overflow-x: scroll;
}

.hdtb-msb {
    display: -webkit-inline-box;
    white-space: nowrap;
    overflow: hidden;
    position: relative;
}

    .hdtb-more, .hdtb-msb .hdtb-imb, .hdtb-msb .hdtb-imb.hdtb-msel, .hdtb-tls,
    .hdtb-more > p, .hdtb-msb .hdtb-imb > p, .hdtb-msb .hdtb-imb.hdtb-msel > p, .hdtb-tls > p {
        display: flex;
        align-items: center;
        align-content: center;
        justify-content: center;
        height: 60px;
        margin: 0;
        text-align: center;
        cursor: pointer;
    }

        .hdtb-more::selection, .hdtb-msb::selection .hdtb-imb::selection, .hdtb-msb::selection .hdtb-imb::selection.hdtb-msel::selection, .hdtb-tls::selection {
            border-bottom: 2px solid #9F0B56;
            line-height: 40px;
            height: 50px;
        }

.msd {
    visibility: inherit !important;
    overflow: hidden;
    height: 55px;
}

    .msd.mobile-top-menu-msd {
        height: 80px;
    }
/*#hdtb-more:active, #hdtb-msb:active .hdtb-imb:active, #hdtb-msb:active .hdtb-imb:active.hdtb-msel:active, #hdtb-tls:active {
    border-bottom: 5px solid #e00570;
    line-height: 40px;
    height: 50px;
}*/

#hdtb-more::selection, #hdtb-msb::selection .hdtb-imb::selection, #hdtb-msb::selection .hdtb-imb::selection.hdtb-msel::selection, #hdtb-tls::selection {
    border-bottom: 2px solid #9F0B56;
    line-height: 40px;
    height: 50px;
}

#msd {
    visibility: inherit !important;
    overflow: hidden;
    /*height: 55px;*/
    /* Hide scrollbar for IE, Edge and Firefox */
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}
/* Hide scrollbar for Chrome, Safari and Opera */
msd::-webkit-scrollbar {
    display: none;
}

#msd.mobile-top-menu-msd {
    height: 130px;
}

.z-index-1 {
    z-index: 1;
}

.zindex44 {
    z-index: 44;
}

.zindex22 {
    z-index: 22;
}

.zindex11 {
    z-index: 11;
}

.show-button {
    display: block !important;
}

#tawkchat-container {
    z-index: 991 !important;
}

element.style {
    display: block;
    opacity: 0.7;
}

#menu_overlay {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 0.7;
}

.menu_overlayBG {
    background-color: #000;
    z-index: 998;
}

/*.hdtb-mitem.active {
    border-bottom: 4px solid #9F0B56;*/
/*background-color: #e00570 !important;*/
/*color: #9F0B56 !important;
}*/

.hdtb-mitem > a {
    font-size: 12px;
    padding: 8px 12px;
    border-radius: 8px;
}

.hdtb-mitem.active > a {
    background-color: #E6EDF3;
}

.tab-pills_gray-bg {
    color: #333;
}

    .tab-pills_gray-bg:active, .tab-pills_gray-bg:hover, .tab-pills_gray-bg:focus, .tab-pills_gray-bg:visited, .tab-pills_gray-bg.active {
        background-color: #D9D9D9;
        border-radius: 20px;
    }

.padding-15-v-xs-sm-md-40-lg {
    padding-top: 15px;
    padding-bottom: 15px;
}

.fixedSearchTabsList {
    height: 44px;
    padding: 15px 0;
}

.filter-button {
    /*position: absolute;
    top: 0;
    right: 0;*/
    display: flex;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    padding: 0;
    float: inline-end;
    /* border-width: 1px 0 1px 0;
    border-style: solid;
    border-color: #D9D9D9;
    box-shadow: -7px 0px 14px 0px rgba(0,0,0,0.15);
    -webkit-box-shadow: -7px 0px 14px 0px rgba(0,0,0,0.15);
    -moz-box-shadow: -7px 0px 14px 0px rgba(0,0,0,0.15);*/
}

.horizontal-scroll-tabs {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
    /* Hide scrollbar for IE, Edge and Firefox */
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}
    /* Hide scrollbar for Chrome, Safari and Opera */
    .horizontal-scroll-tabs::-webkit-scrollbar {
        display: none;
    }

    .horizontal-scroll-tabs * {
        white-space: normal;
    }

@media (min-width: 992px) {
    #exTab3.border-top-gray-laight {
        border-top: none;
    }

    .padding-15-v-xs-sm-md-40-lg {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .fixedSearchTabsList {
        height: 64px;
        padding: 0;
    }
    /*
    .filter-button {
        width: 60px;
        height: 60px;
        top: 50%;
        right: 15px;
        background-color: #fff;
        border-width: 1px;
        border-radius: 8px;
        transform: translate(0px, -50%);
        box-shadow: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
    }*/
}

.h-tabs.active > a {
    color: #9F0B56 !important;
}

.h-tabs > a {
    width: 100%;
    text-align: center;
    display: block;
}

.padding-v-4 {
    padding-top: 4px;
    padding-bottom: 4px;
}

.image-stroke {
    border: 1px solid rgba(189,51,129,1);
    width: 44px;
    height: 44px;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.font-12-a {
    font-size: 14px;
}

.no-repeat {
    background-repeat: no-repeat !important;
}

.cover-bg, .cover-bg > img {
    background-size: cover !important;
    overflow: hidden;
}

.QC_Section-titel {
    font-size: 36px;
    font-weight: bold;
}

.QC_object-cover {
    object-fit: cover !important;
}

.postion-fixed {
    overflow: hidden;
    height: 100vh;
}

.bottom-0 {
    bottom: 0 !important;
}

.top-0 {
    top: 0 !important;
}

hr {
    margin-bottom: 15px;
    margin-top: 15px;
    border-top: 1px solid #e0e0e0;
}

.QC_hr-dark {
    border-top-color: #707070;
}

.hr_black {
    border-top-color: #000;
}

.fa-4x {
    font-size: 4em;
}

.centered-container {
    background-color: #FFFFFF;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 4rem;
    border-radius: .125rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.04);
}

.trand-shadow {
    background: rgba(255,255,255,0);
    background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, rgba(255,255,255,1)));
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    background: -o-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    width: 60px;
    margin-top: 0;
    z-index: 994;
    height: 54px;
    left: auto;
    right: 0;
}

.link {
    color: #2175FF;
    cursor: pointer;
    font-weight: 400;
    text-decoration: none;
}

.link-arrowed {
    display: inline-block;
    /*height: 3rem;
    line-height: 1rem;*/
}

    .link-arrowed .arrow-icon {
        position: relative;
        top: 0;
        -webkit-transition: -webkit-transform 0.3s ease;
        transition: -webkit-transform 0.3s ease;
        transition: transform 0.3s ease;
        transition: transform 0.3s ease, -webkit-transform 0.3s ease;
        vertical-align: middle;
    }

    .link-arrowed .arrow-icon-circle {
        -webkit-transition: stroke-dashoffset .3s ease;
        transition: stroke-dashoffset .3s ease;
        stroke-dasharray: 95;
        stroke-dashoffset: 95;
    }

    /*.link-arrowed:hover .arrow-icon {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0);
    }*/

    .link-arrowed:hover .arrow-icon-circle {
        stroke-dashoffset: 0;
    }

    .link-arrowed.white-hover svg:hover g {
        stroke: #FFF;
    }

.QC_shadow-none {
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}

.QC_shadow-red {
    -webkit-box-shadow: 0px 10px 20px 0px rgba(224,7,112,0.4) !important;
    box-shadow: 0px 10px 20px 0px rgba(224,7,112,0.4) !important;
}

#bg-wight {
    background-color: #fff !important;
    border: 1px solid rgba(0,0,0,.3);
}

/************************* SOCIAL FLOAT MENU *************************/
a.QC_float-social-button {
    /*position: fixed;  If we need it in the corner*/
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 16px;
    left: 20px;
    background-color: #004c84 !important;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    -webkit-box-shadow: 0 3px 8px 0 rgba(0,0,0,.3);
    -moz-box-shadow: 0 3px 8px 0 rgba(0,0,0,.3);
    box-shadow: 0 3px 8px 0 rgba(0,0,0,.3);
    z-index: 9999999999;
    animation: bot-to-top 2s ease-out;
    transition: all ease-in-out 0.5s;
}

    a.QC_float-social-button:hover {
        color: #FFF;
    }

    a.QC_float-social-button i:before {
        content: "\f067";
        font-weight: bold;
    }

    a.QC_float-social-button:hover i:before {
        content: "\f00d";
        font-weight: bold;
    }

    a.QC_float-social-button .fa {
        margin-right: 0;
        margin-left: 0;
    }

.QC_bg-none, .QC_transparent-bg {
    background-color: transparent !important;
}

ul.float-icons-menu {
    /*position: fixed;  If we need it in the corner*/
    padding-right: 0;
    position: fixed;
    z-index: 100;
}

    ul.float-icons-menu li {
        list-style: none;
        margin-bottom: 10px;
    }

        ul.float-icons-menu li a {
            background-color: #FFF;
            border-radius: 50px;
            text-align: center;
            -webkit-box-shadow: 0 3px 8px 0 rgba(0,0,0,.3);
            -moz-box-shadow: 0 3px 8px 0 rgba(0,0,0,.3);
            box-shadow: 0 3px 8px 0 rgba(0,0,0,.3);
            width: 50px;
            height: 50px;
            display: block;
        }

    ul.float-icons-menu:hover {
        visibility: visible !important;
        opacity: 1 !important;
    }

    ul.float-icons-menu .fa {
        margin-right: 0;
        margin-top: 14px;
        margin-left: 0;
    }

ul.float-icons-menu, .float-social-button {
    font-size: 24px;
    margin-top: 18px;
}

.float-social-icons {
    left: 24px;
    padding-bottom: 20px;
    bottom: 40px;
    transition: all ease-in-out 0.5s;
}

.float-tech-support-icon {
    right: 80px;
    padding-right: 30px !important;
    padding-bottom: 0;
    bottom: 40px;
    margin-bottom: 0;
}

a#social-menu + ul.float-icons-menu, a#social-menu + ul.float-icons-menu + ul.float-icons-menu {
    visibility: hidden;
}

a#social-menu:hover + ul.float-icons-menu, a#social-menu:hover + ul.float-icons-menu + ul.float-icons-menu {
    visibility: visible;
    animation: scale-in 0.5s;
}

#tawkchat-container {
    animation: scale-in 0.5s;
    transition: all ease-in-out 0.5s;
}

@media print {
    #tawkchat-container {
        display: none !important;
    }
}

.opacityfull {
    right: 63px !important;
    animation: scale-in 0.5s;
    transition: all ease-in-out 0.5s;
}

a#social-menu:hover #home-main-wrapper #tawkchat-container {
    opacity: 1 !important;
    animation: scale-in 0.5s;
}

a#social-menu i {
    animation: rotate-in 0.5s;
}

a#social-menu:hover > i {
    animation: rotate-out 0.5s;
}

a#menu-facebook {
    color: #4267B2;
}

    a#menu-facebook:hover {
        background: #4267B2;
        color: #FFF;
    }

a#menu-youtube {
    color: rgb(255, 0, 0);
}

    a#menu-youtube:hover {
        background: rgb(255, 0, 0);
        color: #FFF;
    }

a#menu-twitter {
    color: #1DA1F2;
}

    a#menu-twitter:hover {
        background: #1DA1F2;
        color: #FFF;
    }

a#menu-google-plus {
    color: #DC4A38;
}

    a#menu-google-plus:hover {
        background: #DC4A38;
        color: #FFF;
    }

a#menu-instagram {
    color: rgba(189,51,129,1);
}

    a#menu-instagram:hover {
        background: rgba(189,51,129,1);
        background: -moz-radial-gradient(-45deg, rgba(236,85,67,1) 0%, rgba(189,51,129,1) 100%);
        background: -webkit-radial-gradient(left top, right bottom, color-stop(0%, rgba(236,85,67,1)), color-stop(100%, rgba(189,51,129,1)));
        background: -webkit-radial-gradient(-45deg, rgba(236,85,67,1) 0%, rgba(189,51,129,1) 100%);
        background: -o-linear-gradient(-45deg, rgba(236,85,67,1) 0%, rgba(189,51,129,1) 100%);
        background: radial-gradient(135deg, rgba(236,85,67,1) 0%, rgba(189,51,129,1) 100%);
        color: #FFF;
    }

a#menu-tech-support {
    color: #9F0B56;
}

    a#menu-tech-support:hover {
        background: #9F0B56;
        color: #FFF;
    }

@keyframes bot-to-top {
    0% {
        bottom: -40px;
    }

    50% {
        bottom: 40px;
    }
}

@keyframes scale-in {
    from {
        transform: scale(0);
        opacity: 0;
    }

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

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

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

@keyframes rotate-out {
    from {
        transform: rotate(360deg);
    }

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


/*************************Login*******************************/
/*.intl-tel-input.allow-dropdown .flag-container {
    width: 86px;
}*/

/*.intl-tel-input.allow-dropdown.separate-dial-code.iti-sdc-4 .selected-flag {
    width: 100%;
}

.intl-tel-input.allow-dropdown.separate-dial-code.iti-sdc-4 .selected-flag {
    padding: 0 15px 0 5px;
    margin: 0 1px;
}*/

.iti-mobile .intl-tel-input.iti-container {
    position: absolute;
    max-height: 300px;
    z-index: 999;
}

.iti-mobile .intl-tel-input .country-list {
    left: -10px;
}

.intl-tel-input .country-list {
    width: 335px;
    max-height: 300px;
    margin: 0;
    font-size: 12px;
    box-shadow: 0px 0px 25px 5px rgba(0,0,0,0.35);
    -webkit-box-shadow: 0px 0px 25px 5px rgba(0,0,0,0.35);
    -moz-box-shadow: 0px 0px 25px 5px rgba(0,0,0,0.35);
}

    .intl-tel-input .country-list .country {
        padding: 10px 5px;
    }

        .intl-tel-input .country-list .country[data-dial-code="387"] .country-name, .intl-tel-input .country-list .country[data-dial-code="236"] .country-name,
        .intl-tel-input .country-list .country[data-dial-code="971"] .country-name, .intl-tel-input .country-list .country[data-dial-code="243"] .country-name {
            font-size: 11px;
        }

        .intl-tel-input .country-list .country[data-dial-code="508"] .country-name {
            font-size: 10px;
        }

/************************* SOCIAL FLOAT MENU END *************************/

a:focus, a:hover {
    text-decoration: none !important;
}

.white-color a:focus, .white-color a:hover, a.white-color:focus, a.white-color:hover {
    text-decoration: none;
    color: #fff;
}
/************************* DONATION CAUSES LIST *************************/
.box-wrapper {
    margin-bottom: 30px;
    border: 1px solid #eeeded;
    border-radius: 15px;
}

.box {
    background: #FFF;
    -webkit-box-shadow: 0 0px 12px 0px rgba(0,0,0,.1);
    -moz-box-shadow: 0 0px 12px 0px rgba(0,0,0,.1);
    box-shadow: 0 2px 7px 2px rgba(0,0,0,.1);
}

.media:first-child {
    margin-top: 0;
}

.pichieght {
    width: 100%;
}

.media .overlay-wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    display: none;
    z-index: 1030;
}

.media .overlay {
    display: table;
    width: 100%;
    height: 100%;
    padding: 15px;
    color: #ffffff;
}

.overlay-content {
    display: block;
    position: absolute;
    bottom: 0px;
    top: 54%;
    width: 100%;
    border-radius: 0px 0px 5px 4px;
}

.media .overlay-content {
    display: table-cell;
    vertical-align: middle;
    background-color: rgba(0, 172, 193, 0.7);
    text-align: center;
}

.content-hidden {
    display: none;
}

.overlay-content p {
    color: #fff;
    font-size: 100%;
    text-align: center;
    line-height: 24px;
    padding: 0px 10px;
}

.colm-all-point {
    margin-bottom: 30px;
    max-height: 660px;
    overflow-y: scroll;
    overflow-x: hidden;
}

.description-cuses {
    font-size: 13px;
    color: #fff;
    display: block;
    padding: 10px 15px;
    line-height: 25px;
}

.sponser-cuses {
    color: #666;
    line-height: 20px;
}

.text-right-left {
    text-align: left;
}

.font-size-13 {
    font-size: 13px;
    line-height: 1.6em;
}

.font-size-17 {
    font-size: 17px;
}

.latest-box {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

    .latest-box .content-wrapper {
        max-width: 100%;
        display: table;
        width: 100%;
    }

    /*.urgent-box .meta, .latest-box .content {
    margin-bottom: 30px;
}*/

    .latest-box .content {
        vertical-align: middle;
        display: table-cell;
    }

.content {
    position: relative;
    padding: 0 !important;
}

/*.country-share {
    height: 25px;
    border-radius: 4px;
}*/

.slider-meta {
    color: #9a9a9a;
    margin-bottom: 0;
}

.latest-box .slider-meta {
    color: #404143;
    font-size: 13px;
    padding: 15px;
}

.total-amount {
    font-size: 14px;
    text-align: center;
}

    .total-amount span {
        color: #9F0B56;
        font-family: arial;
    }

.padding-5 {
    padding: 0 5px;
}

.padding-5-xs {
    padding: 5px;
}

.padding-5-h-xs {
    padding: 0 5px;
}

.padding-5-v-xs {
    padding: 5px 0;
}

@media (min-width: 576px) {
    .padding-5-xs {
        padding: 0;
    }

    .padding-5-h-xs {
        padding: 0;
    }

    .padding-5-v-xs {
        padding: 0;
    }
}

.donationValues li button {
    border: 1px solid rgba(0, 76, 132, 0.9);
    background-color: #fff;
    color: rgba(0, 76, 132, 0.9);
    border-radius: 10px
}

    .donationValues li button:hover, .donationValues li button:active, .donationValues li button:focus {
        border: 1px solid rgba(0, 76, 132, 0.9);
        background-color: rgba(0, 76, 132, 0.9);
        color: #fff;
    }

.donationValues li h2 {
    line-height: 38px;
}

.more-svg-icon {
    width: 15px;
    height: 15px;
    display: -webkit-inline-box;
    padding-top: 7px;
}

/************************* DONATION CAUSES LIST END *************************/


/******Slider******/
.ls-wp-fullwidth-container, .ls-wp-fullwidth-helper, .ls-container, .ls-container * {
    box-sizing: inherit !important;
    -moz-box-sizing: inherit !important;
    -webkit-box-sizing: inherit !important;
}



.slider {
    position: relative;
    max-width: 100%;
    max-height: 100%;
    margin: 0 auto;
}

    .slider:hover .slider__radiobox-label--prev,
    .slider:hover .slider__radiobox-label--next {
        opacity: 1;
    }

    .slider:hover .slider__radiobox-label--prev {
        left: 6%;
    }

    .slider:hover .slider__radiobox-label--next {
        right: 6%;
    }

.slider--full {
    width: 100vw;
    height: 300px;
}

.slider--fixed {
    width: 600px;
    height: 400px;
}

.slider--proportional {
    width: 960px;
    height: auto;
}

.slider__inner {
    position: relative;
    margin: 0 auto;
    overflow: hidden;
    background: #ddd;
}

.slider--full .slider__inner {
    width: 100%;
    height: 100%;
}

.slider--fixed .slider__inner {
    width: 100%;
    height: 100%;
}

.slider--proportional .slider__inner {
    width: 100%;
    height: 0;
}

.slider--proportional--4x3 .slider__inner {
    padding-top: 75%;
}

.slider--proportional--5x4 .slider__inner {
    padding-top: 80%;
}

.slider--proportional--16x9 .slider__inner {
    padding-top: 56.25%;
}

.slider__slides {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    width: 400%;
    height: 100%;
    overflow-y: hidden;
    -webkit-transition: margin-left 0.4s;
    transition: margin-left 0.4s;
}

.slider__slide {
    display: block;
    float: left;
    position: relative;
    width: 25%;
    height: 100%;
    /** background-image method */
    background: no-repeat 50% 50%;
    background-size: cover;
    /** inline image method */
}

.slider__slide__more-btn {
    position: absolute;
    bottom: 6%;
    right: 10%;
    margin-bottom: 0;
}

.slider__radiobox-label {
    display: block;
    position: absolute;
    z-index: 2;
    cursor: pointer;
}

.slider__radiobox-label--item {
    height: 12px;
    bottom: 6%;
    left: 20%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    padding: 6px;
    border-radius: 50%;
    background: black;
    opacity: 0.3;
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s;
}

    .slider__radiobox-label--item:hover {
        opacity: 0.5;
    }

.slider__radiobox-label--item--1 {
    margin-left: -36px;
}

.slider__radiobox-label--item--2 {
    margin-left: -12px;
}

.slider__radiobox-label--item--3 {
    margin-left: 12px;
}

.slider__radiobox-label--item--4 {
    margin-left: 36px;
}

.slider__radiobox-label--prev, .slider__radiobox-label--next {
    display: none;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 0;
    border: 10px solid black;
    border-top-color: transparent;
    border-bottom-color: transparent;
    opacity: 0;
    -webkit-transition: left 0.2s, right 0.2s, opacity 0.2s;
    transition: left 0.2s, right 0.2s, opacity 0.2s;
}

.slider__radiobox-label--prev {
    left: -6%;
    border-left: 0;
    border-right-width: 17px;
}

.slider__radiobox-label--next {
    right: -6%;
    border-right: 0;
    border-left-width: 17px;
}

.slider__radiobox {
    display: none;
}

.slider__radiobox--1:checked ~ .slider__slides {
    margin-left: 0;
}

.slider__radiobox--2:checked ~ .slider__slides {
    margin-left: -100%;
}

.slider__radiobox--3:checked ~ .slider__slides {
    margin-left: -200%;
}

.slider__radiobox--4:checked ~ .slider__slides {
    margin-left: -300%;
}

.slider__radiobox--1:checked + .slider__radiobox-label--item--1, .slider__radiobox--2:checked + .slider__radiobox-label--item--2, .slider__radiobox--3:checked + .slider__radiobox-label--item--3, .slider__radiobox--4:checked + .slider__radiobox-label--item--4 {
    opacity: 1;
}

.slider__radiobox--1:checked ~ .slider__radiobox-label--prev--4, .slider__radiobox--1:checked ~ .slider__radiobox-label--next--2, .slider__radiobox--2:checked ~ .slider__radiobox-label--prev--1, .slider__radiobox--2:checked ~ .slider__radiobox-label--next--3, .slider__radiobox--3:checked ~ .slider__radiobox-label--prev--2, .slider__radiobox--3:checked ~ .slider__radiobox-label--next--4, .slider__radiobox--4:checked ~ .slider__radiobox-label--prev--3, .slider__radiobox--4:checked ~ .slider__radiobox-label--next--1 {
    display: block;
}
/******Slider End******/

.QC_hidden-en {
    visibility: hidden;
    display: none;
}

.QC_hidden-ar {
    visibility: visible;
    display: block;
}

.Project-taype-border {
    border: 1px solid #D9D9D9
}

.play-v {
    margin-top: -50px;
    left: 40%;
    right: auto;
    top: 50%;
    color: rgba(255, 255, 255, 0.77);
    position: absolute;
    font-size: 70px !important;
}
/****************** UPDATED IN 06-FEB *** USE IN NEW LAYOUT ************************/
.QC_extra-title {
    font-size: 44px !important;
    line-height: 1.2;
    margin-bottom: 22px;
}
/****************** UPDATED IN 06-FEB *** USE IN NEW LAYOUT ************************/

/***********popup Campgin*************/

.QC_verticle-middle {
    vertical-align: middle;
    vertical-align: middle;
}

.QC_verticle-sub {
    vertical-align: sub;
}

.QC_verticle-super {
    vertical-align: super;
}

.QC_ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block !important;
}

.QC_line-clamp {
    margin: 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.line-clamp-1 {
    -webkit-line-clamp: 1;
}

.line-clamp-2 {
    -webkit-line-clamp: 2;
}

.line-clamp-3 {
    -webkit-line-clamp: 3;
}

.line-clamp-4 {
    -webkit-line-clamp: 4;
}

.line-clamp-5 {
    -webkit-line-clamp: 5;
}

.line-clamp-6 {
    -webkit-line-clamp: 6;
}

.line-clamp-7 {
    -webkit-line-clamp: 7;
}

.line-clamp-8 {
    -webkit-line-clamp: 8;
}

.line-clamp-9 {
    -webkit-line-clamp: 9;
}

.line-clamp-10 {
    -webkit-line-clamp: 10;
}

/*.newnavbar.qc_navbar .navbar-nav>li:hover{
    background-color: transparent;
    border-bottom: 3px solid #20598e!important;
}*/

.navbar-right .dropdown-menu {
    left: 0;
    right: auto;
}


.left-minus-110 {
    left: -110px !important;
    right: auto;
}

.left-minus-120 {
    left: -120px !important;
    right: auto;
}

.left-minus-150 {
    left: -150px !important;
    right: auto;
}

.left-minus-250 {
    left: -250px !important;
    right: auto;
}
/********LOGIN WITH MOBILE************/
.loginBtn-update {
    color: #fff !important;
    background-color: #00447A !important;
    border: solid 1px #00447A !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    float: left !important;
    height: 40px;
}

.QC-image-Card {
    height: 220px;
    object-fit: cover;
}

.QC-image-Card-assistance {
    min-width: 100%;
    height: 312px;
    object-fit: cover;
    filter: brightness(80%);
}

.QC-image-countries {
    height: 157px;
    object-fit: cover;
    filter: brightness(80%);
}

.mune-Assistance, .mune-Assistance-gray {
    top: 10px;
    right: 10px;
    border: 0 !important;
    background-color: transparent !important;
}

.mune-Assistance-gray {
    right: -15px;
}

.mune-Assistance .dropdown-menu {
    left: auto;
    right: -3px;
    border: 0;
    top: -3px;
}


.mune-camp {
    top: 0px;
    right: 0px;
    border: 0 !important;
    background-color: transparent !important;
}

    .mune-camp .dropdown-menu {
        left: auto;
        right: -3px;
        border: 0;
        top: -3px;
    }

.phone-notifaction {
    font-size: 12px;
    max-width: 500px;
}

    .phone-notifaction span {
        padding: 5px;
        margin-bottom: 10px;
        display: block;
    }

.grid-color3 {
    background-color: #004c84;
    color: #fff;
    border-bottom: 3px solid #fff;
}

.detalesbtn {
    background-color: transparent;
    border: 1px solid rgb(220, 220, 220);
    height: 35px;
    color: rgb(98, 98, 98);
    text-align: center;
    width: 100%;
    line-height: 35px;
}

.nots {
    padding: 10px;
    border-top: 1px solid #b4b4b4;
    font-size: 11px;
    margin-top: 10px;
    color: #666;
    margin: 10px;
    text-align: center;
}

.color-blue {
    color: rgba(0, 76, 132, 0.9);
}

.color-white {
    color: #fff !important;
}

.color-gray {
    color: #b4b4b4 !important;
}

.color-green-light {
    color: #004c84 !important;
}

.color-Puerto {
    color: #54BFA1 !important;
}

.color-Valencia {
    color: #D95448 !important;
}

.color-Kournikova {
    color: #F2CA50 !important;
}

.color-blue-light, .QC_blue-light-color {
    color: #38A4C3;
}

.second-green-color {
    color: #54BFA1;
}

.red-color {
    color: #FF345B;
}

.green-color {
    color: #20598e !important;
}

.QC_primary-color {
    color: #9F0B56 !important;
}

.QC_secondary-color {
    color: #00447A !important;
}

.QC_green-color {
    color: #43C0B9 !important;
}

.QC_defult-text, .color-gray-dark {
    color: rgb(51, 51, 51) !important;
}

.QC_primary-bg {
    background: #9F0B56;
    background-color: #9F0B56;
}

.QC_secondary-bg {
    background: #00447A;
    background-color: #00447A;
}

.QC_secondary-light-bg {
    background: #E6EDF3;
    background-color: #E6EDF3;
}

.search-horizontal {
    background-color: transparent;
}

.search-horizontal-max input {
    width: 100% !important;
}

/***********popup Campgin End*************/


/************************* END PROTOTYPE **********************************/


/************************* TAGS **********************************/

/************************* END TAGS **********************************/


/************************* PADDING **********************************/

/************************* END PADDING **********************************/

/************************* MARGIN **********************************/
/************************* END MARGIN **********************************/


/****************************************************************************************************/
/************************* RADIO $ CHECKBOX BUTTONS *************************/
/****************************************************************************************************/

.radio {
    padding-left: 10px;
}

    .radio label {
        display: inline-block;
        /*position: relative;*/
        padding-left: 5px;
    }

        .radio label::before {
            content: "";
            display: inline-block;
            position: absolute;
            width: 18px;
            height: 18px;
            left: -10px;
            top: 1px;
            /*margin-left: -20px;*/
            border: 1px solid #b4b4b4;
            border-radius: 50%;
            background-color: #fff;
            -webkit-transition: border 0.15s ease-in-out;
            -o-transition: border 0.15s ease-in-out;
            transition: border 0.15s ease-in-out;
        }

        .radio label::after {
            display: inline-block;
            position: absolute;
            content: " ";
            width: 10px;
            height: 10px;
            left: -6px;
            top: 5px;
            /*margin-left: -20px;*/
            border-radius: 50%;
            background-color: #555555;
            -webkit-transform: scale(0, 0);
            -ms-transform: scale(0, 0);
            -o-transform: scale(0, 0);
            transform: scale(0, 0);
            -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
            -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
            -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
            transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
        }

    .radio input[type="radio"] {
        opacity: 0;
        z-index: 1002;
        cursor: pointer;
    }

        .radio input[type="radio"]:focus + label::before {
            outline: thin dotted;
            outline: 5px auto -webkit-focus-ring-color;
            outline-offset: -2px;
        }

        .radio input[type="radio"]:checked + label::after {
            -webkit-transform: scale(1, 1);
            -ms-transform: scale(1, 1);
            -o-transform: scale(1, 1);
            transform: scale(1, 1);
        }

        .radio input[type="radio"]:disabled + label {
            opacity: 0.65;
        }

            .radio input[type="radio"]:disabled + label::before {
                cursor: not-allowed;
            }

    .radio.radio-inline {
        margin-top: 0;
    }

.QC_primary-radio input[type="radio"] + label::after,
.QC_primary-radio input[type="radio"]:checked + label::after {
    background-color: #9F0B56;
}

.QC_primary-radio input[type="radio"]:checked + label::before {
    border-color: #9F0B56;
}

.QC_secondary-radio input[type="radio"] + label::after,
.QC_secondary-radio input[type="radio"]:checked + label::after {
    background-color: #00447A;
}

.QC_secondary-radio input[type="radio"]:checked + label::before {
    border-color: #00447A;
}

.form-inline {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.form-check {
    position: relative;
    display: block;
    padding-left: 1.25rem;
}

    .form-check:first-child {
        padding-left: 0;
    }

input[type=checkbox].QC_checkbox,
input[type=radio].QC_radio {
    box-sizing: border-box;
    padding: 0;
}

[type=checkbox].QC_checkbox,
[type=radio].QC_radio {
    position: absolute;
    left: -9999px;
    visibility: hidden;
}

    [type=checkbox].QC_checkbox + label,
    [type=radio].QC_radio + label {
        position: relative;
        padding-left: 30px;
        cursor: pointer;
        display: inline-table;
        height: 20px;
        font-size: 14px;
        margin-bottom: 0;
    }

    [type=checkbox].QC_checkbox.checkbox-large + label,
    [type=radio].QC_radio.radio-large + label {
        padding-left: 28px;
        height: 20px;
        line-height: 20px;
        font-size: 14px;
    }

    [type=checkbox].QC_checkbox + label:before,
    [type=radio].QC_radio + label:before,
    [type=radio].QC_radio + label:after {
        content: "";
        position: absolute;
        left: 0;
        top: calc(50% - 10px);
        margin: 0;
        width: 20px;
        height: 20px;
        z-index: 0;
        -webkit-transition: .28s ease;
        transition: .28s ease;
    }

    [type=checkbox].QC_checkbox + label:before {
        border-radius: 1.5px;
        border-width: 1.5px;
    }

    [type=radio].QC_radio + label:before, [type=radio].QC_radio + label:after {
        border-radius: 50%;
    }

    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color + label:before,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color + label:before {
        width: 0;
        height: 0;
        border-style: solid;
        border-color: transparent;
        left: 6px;
        top: calc(50% - 10px);
        -webkit-transform: rotateZ(37deg);
        -ms-transform: rotate(37deg);
        transform: rotateZ(37deg);
        -webkit-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
        transform-origin: 100% 100%;
        z-index: 1;
    }

    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color + label:after,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color + label:after {
        border-radius: 4px;
        height: 22px;
        width: 22px;
        background-color: transparent;
        border-color: #707070;
        top: 0;
        z-index: 0;
        content: "";
        left: 0;
        position: absolute;
        -webkit-transition: border .25s,background-color .25s,width .2s .1s,height .2s .1s,top .2s .1s,left .2s .1s;
        transition: border .25s,background-color .25s,width .2s .1s,height .2s .1s,top .2s .1s,left .2s .1s;
        z-index: 1;
        border-style: solid;
        border-width: 2px;
    }

    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color + label:before,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color + label:before,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color + label:after,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color + label:after {
        border-width: 2px;
        -webkit-transition: border .25s,background-color .25s,width .2s .1s,height .2s .1s,top .2s .1s,left .2s .1s;
        transition: border .25s,background-color .25s,width .2s .1s,height .2s .1s,top .2s .1s,left .2s .1s;
    }
    /* CHECKED */
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color:checked + label:before,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color:checked + label:before {
        top: 3px;
        left: 2.5px;
        width: 7px;
        height: 13px;
        border-color: transparent #FFF #FFF transparent;
    }

    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color:checked + label:after {
        border-color: #9F0B56;
        background-color: #9F0B56;
        z-index: 0;
    }

    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color:checked + label:after {
        border-color: #00447A;
        background-color: #00447A;
        z-index: 0;
    }

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

    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color + label:before,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color + label:before,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color:checked + label:before,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color:checked + label:before {
        top: 2px;
    }

    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color + label:after,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color + label:after,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color:checked + label:after,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color:checked + label:after {
        top: 0;
    }
}*/


    /* CHECKED */

    /*[type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color.checkbox-large + label:after,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color.checkbox-large + label:after {
        height: 20px;
        width: 20px;
        top: calc(50% - 10px);
    }
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color.exception-checkbox + label:after, [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color.exception-checkbox + label:after {
        top: 12px;
    }*/


    /*[type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color.exception-checkbox + label:before, 
        [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color.exception-checkbox + label:before {
        top: 12px;
    }*/

    /*[type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color.exception-checkbox:checked + label:after {
        top: 5px;
    }*/

    /*[type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color.exception-checkbox:checked + label:after {
        top: 12px;
    }*/

    /*[type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color.checkbox-large:checked + label:before,
    [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color.checkbox-large:checked + label:before {
        top: calc(50% - 7px);
        left: 3px;
    }*/

    /*[type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-primary-color.exception-checkbox:checked + label:before, [type=checkbox].QC_checkbox.QC_checkbox-filled-in.QC_checkbox-secondary-color.exception-checkbox:checked + label:before {
        top: 9px;
    }*/

    [type=checkbox].QC_checkbox:checked + label:before {
        top: calc(50% - 6px);
        left: -3px;
        width: 10px;
        height: 18px;
        border-style: solid;
        border-width: 2px;
        -webkit-transform: rotate(40deg);
        -ms-transform: rotate(40deg);
        transform: rotate(40deg);
        -webkit-backface-visibility: hidden;
        -webkit-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
        transform-origin: 100% 100%;
    }

    [type=checkbox].QC_checkbox.QC_checkbox-primary-color:checked + label:before {
        border-color: transparent #9F0B56 #9F0B56 transparent;
    }

    [type=checkbox].QC_checkbox.QC_checkbox-secondary-color:checked + label:before {
        border-color: transparent #00447A;
    }

    [type=radio].QC_radio:checked + label:after {
        z-index: 0;
        -webkit-transform: scale(1.02);
        -ms-transform: scale(1.02);
        transform: scale(1.02);
    }

    [type=radio].QC_radio.QC_radio-with-gap-primary-color + label:before,
    [type=radio].QC_radio.QC_radio-with-gap-primary-color:checked + label:before {
        border: 2px solid #9F0B56;
    }

    [type=radio].QC_radio.QC_radio-with-gap-primary-color:checked + label:after {
        border-color: #9F0B56;
        background-color: #9F0B56;
    }

    [type=radio].QC_radio.QC_radio-with-gap-secondary-color + label:before,
    [type=radio].QC_radio.QC_radio-with-gap-secondary-color:checked + label:before {
        border: 2px solid #00447A;
    }

    [type=radio].QC_radio.QC_radio-with-gap-secondary-color:checked + label:after {
        border-color: #00447A;
        background-color: #00447A;
    }

    [type=radio].QC_radio.QC_radio-with-gap-primary-color:checked + label:after, [type=radio].QC_radio.QC_radio-with-gap-secondary-color:checked + label:after {
        -webkit-transform: scale(.5);
        -ms-transform: scale(.5);
        transform: scale(.5);
    }

input[type=radio], input[type=checkbox] {
    margin: 3px 5px 0 0;
    margin-bottom: 0 !important;
    height: 12px;
}

/****************************************************************************************************/
/************************* RADIO $ CHECKBOX BUTTONS *************************/
/****************************************************************************************************/

/*Base*/

.QC_white-color {
    color: #fff !important;
}

.QC_white-bg {
    background: #FFF !important;
    background-color: #FFF !important;
}

.QC_border {
    border: 1px solid;
}

.QC_gray-light-extra-border {
    border-color: #F7F9FA;
}

.QC_gray-light-border {
    border-color: #E6E6E6;
}

.QC_gray-light-color {
    color: #b4b4b4 !important;
}

.QC_gray-color {
    color: #91908F !important;
}

.QC_gray-dark-color {
    color: #3C3C3C !important;
}

    .QC_gray-dark-color:hover {
        color: #3C3C3C !important;
    }

.QC_wihte-below {
    background: #F0F6FA !important;
    background-color: #F0F6FA !important;
}

.QC_gray-bg-light-extra {
    background: #F7F9FA;
    background-color: #F7F9FA;
}

.QC_gray-bg-light {
    background: #E6E6E6;
    background-color: #E6E6E6;
}


.QC_gray-bg-extra-plus {
    background: #E8EEF3;
    background-color: #E8EEF3;
}

.QC_gray-bg-dark {
    background: #888;
    background-color: #888;
}

.QC_gray-bg-dark-extra {
    background: #343434;
    background-color: #343434;
}

.QC_gray-bg-projectbar {
    background-color: #E8EEF3;
    background: #E8EEF3;
}

.QC_Purple-bg {
    background-image: linear-gradient(to bottom, #533a6d, #553d76, #56417f, #564589, #554993, #594c98, #5e509e, #6253a3, #6d56a4, #7859a6, #825da7, #8b60a8);
}

.QC_share-battern {
    background-image: url("");
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: 100%;
}
/*.newnavbar.navbar-static-top .container .navbar-header, .newnavbar.navbar-static-top .container-fluid .navbar-header {
    margin-left: -15px;
    margin-right: -15px;
}*/
.qpayPopup {
    width: 600px;
    height: 600px;
    overflow: hidden;
    margin-right: auto;
    margin-left: auto;
}

.lblKey {
    font-size: 50px;
}

.alert-danger {
    color: #a94442;
    background-color: #fdffd6;
    border-color: #ebccd1;
}

.at-share-btn-elements {
    z-index: 100;
}
/*.newnavbar.navbar-fixed-top:not(.nav-up), .newnavbar.navbar-fixed-bottom*/
.newnavbar.navbar-fixed-top, .newnavbar.navbar-fixed-bottom {
    background-color: #fff !important;
    border-color: #D9D9D9 !important;
    position: fixed !important;
    /*top: 34px;*/
    z-index: 998;
    /*color: #525252 !important;*/
    border-bottom: 1px solid #D9D9D9;
    font-weight: bold;
}

    .newnavbar.navbar-fixed-top, .newnavbar.navbar-fixed-bottom a {
        color: #2D2D2D !important;
    }

.mainMenuLogo {
    background-image: url("");
    background-repeat: no-repeat;
    background-size: contain;
    width: 160px;
    height: 52px;
    margin: 12px 0 0 0;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

.mainMenuLogoSmall {
    background-image: url("QC-Logo-New.png");
    background-repeat: no-repeat;
    background-size: contain;
    width: 134px;
    height: 42px;
    margin-top: 6px;
    padding: 0;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

.donat-special-css {
    width: 110px;
    margin-top: 6px;
    padding-top: 0;
    background-color: #9F0B56 !important;
    color: #FFF;
}

.yellow-color-button {
    background-color: #F2CA50;
    color: #FFF !important;
    height: 48px;
    /*Override Bootstrap*/
    display: inline-flex;
    padding: 0 12px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 42px !important;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 10px !important;
    /*Override Bootstrap END*/
}

.yellow-color-button, .btn-default.yellow-color-button, .btn-default[disabled].yellow-color-button, .btn.yellow-color-button {
    background-color: transparent;
    color: #F2CA50 !important;
    /*Override Bootstrap*/
    border: 1px solid #e00570;
    /*Override Bootstrap END*/
}

    .yellow-color-button:hover, .yellow-color-button:active, .yellow-color-button:focus, .btn.yellow-color-button:hover, .btn.yellow-color-button:active, .btn.yellow-color-button:focus {
        background-color: #ffca26 !important;
        color: #FFF !important;
    }

.green-color-button {
    background-color: #43C0B9;
    color: #FFF !important;
    height: 48px;
    /*Override Bootstrap*/
    display: inline-flex;
    padding: 0 12px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 42px !important;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 10px !important;
    /*Override Bootstrap END*/
}

.green-color-button, .btn-default.green-color-button, .btn-default[disabled].green-color-button, .btn.green-color-button {
    background-color: transparent;
    color: #43C0B9 !important;
    /*Override Bootstrap*/
    border: 1px solid #e00570;
    /*Override Bootstrap END*/
}

    .green-color-button:hover, .green-color-button:active, .green-color-button:focus, .btn.green-color-button:hover, .btn.green-color-button:active, .btn.green-color-button:focus {
        background-color: #36A989 !important;
        color: #FFF !important;
    }

.donat-special-css,
.QC_primary-btn, .btn-default.QC_primary-btn, .btn-default[disabled].QC_primary-btn, .btn.QC_primary-btn,
.QC_primary-border-btn, .btn-default.QC_primary-border-btn, .btn-default[disabled].QC_primary-border-btn, .btn.QC_primary-border-btn,
.black-border-btn, .btn-default.black-border-btn, .btn-default[disabled].black-border-btn, .btn.black-border-btn,
.QC_black-border-btn, .btn-default.QC_black-border-btn, .btn-default[disabled].QC_black-border-btn, .btn.QC_black-border-btn {
    background-color: #9F0B56;
    color: #FFF !important;
    height: 48px;
    /*Override Bootstrap*/
    display: inline-block;
    padding: 0 16px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 48px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 12px;
    /*Override Bootstrap END*/
}

.QC_third-border-btn, .btn-default.QC_third-border-btn, .btn-default[disabled].QC_third-border-btn, .btn.QC_third-border-btn {
    background-color: #D95448;
    color: #FFF !important;
    height: 48px;
    /*Override Bootstrap*/
    display: inline-block;
    padding: 0 16px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 42px !important;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 12px;
    /*Override Bootstrap END*/
}

.black-border-btn, .btn-default.black-border-btn, .btn-default[disabled].black-border-btn, .btn.black-border-btn,
.QC_black-border-btn, .btn-default.QC_black-border-btn, .btn-default[disabled].QC_black-border-btn, .btn.QC_black-border-btn {
    background-color: transparent;
    color: #060606 !important;
    /*Override Bootstrap*/
    border: 1px solid #060606;
    /*Override Bootstrap END*/
}


    .black-border-btn:hover, .black-border-btn:active, .black-border-btn:focus, .btn.black-border-btn:hover, .btn.black-border-btn:active, .btn.black-border-btn:focus,
    .QC_black-border-btn:hover, .QC_black-border-btn:active, .QC_black-border-btn:focus, .btn.QC_black-border-btn:hover, .btn.QC_black-border-btn:active, .btn.QC_black-border-btn:focus {
        background-color: #060606 !important;
        color: #FFF !important;
    }

.QC_primary-border-btn, .btn-default.QC_primary-border-btn, .btn-default[disabled].QC_primary-border-btn, .btn.QC_primary-border-btn {
    background-color: transparent;
    color: #9F0B56 !important;
    /*Override Bootstrap*/
    border: 1px solid #9F0B56;
    /*Override Bootstrap END*/
}

    .donat-special-css:hover, .donat-special-css:active, .donat-special-css:focus,
    .QC_primary-btn:hover, .QC_primary-btn:active, .QC_primary-btn:focus, .btn.QC_primary-btn:hover, .btn.QC_primary-btn:active, .btn.QC_primary-btn:focus,
    .QC_primary-border-btn:hover, .QC_primary-border-btn:active, .QC_primary-border-btn:focus, .btn.QC_primary-border-btn:hover, .btn.QC_primary-border-btn:active, .btn.QC_primary-border-btn:focus {
        background-color: #590630 !important;
        color: #FFF !important;
    }

.QC_secondary-btn, .btn-default.QC_secondary-btn, .btn-default[disabled].QC_secondary-btn, .btn.QC_secondary-btn,
.QC_secondary-border-btn, .btn-default.QC_secondary-border-btn, .btn-default[disabled].QC_secondary-border-btn, .btn.QC_secondary-border-btn, .QC_white-border-btn,
.QC_fixed-amount-btn,
.QC_add-to-cart {
    background-color: #00447A;
    color: #FFF;
    height: 48px;
    /*Override Bootstrap*/
    display: inline-block;
    padding: 0 16px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 500;
    line-height: 48px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 12px;
    /*Override Bootstrap END*/
}

    .QC_secondary-btn:hover, .QC_secondary-btn:focus, .QC_secondary-btn:active, .btn.QC_secondary-btn:hover, .btn.QC_secondary-btn:focus, .btn.QC_secondary-btn:active,
    .QC_secondary-border-btn:hover, .QC_secondary-border-btn:focus, .QC_secondary-border-btn:active, .btn.QC_secondary-border-btn:hover, .btn.QC_secondary-border-btn:focus, .btn.QC_secondary-border-btn:active,
    .QC_fixed-amount-btn:hover, .QC_fixed-amount-btn:active, .QC_fixed-amount-btn:focus,
    .QC_add-to-cart:hover, .QC_add-to-cart:focus, .QC_add-to-cart:active {
        background-color: #00355F;
        color: #FFF;
    }

.QC_green-light-btn:hover, .QC_green-light-btn:active, .QC_green-light-btn:focus, .btn.QC_green-light-btn:hover, .btn.QC_green-light-btn:active, .btn.QC_green-light-btn:focus {
    background-color: #36A989;
    color: #FFF;
}

.QC_secondary-border-btn, .btn-default.QC_secondary-border-btn, .btn-default[disabled].QC_secondary-border-btn, .btn.QC_secondary-border-btn,
.QC_fixed-amount-btn {
    background-color: transparent;
    color: #00447A;
    /*Override Bootstrap*/
    border: 1px solid #00447A;
    /*Override Bootstrap END*/
}

.QC_fixed-amount-btn {
    background-color: #FFF;
    width: 45px;
    height: 44px;
    margin-right: 5px;
    display: inline-block;
    padding: 0;
    font-family: 'Roboto Condensed', sans-serif;
}

    .QC_fixed-amount-btn.fixed-amount-lg {
        width: 70px;
        height: 60px;
        font-size: 17px
    }

@media only screen and (max-width: 767px) {
    .QC_fixed-amount-btn {
        margin-right: 2px;
    }
}

.QC_green-light-btn, .btn-default.QC_green-light-btn, .btn-default[disabled].QC_green-light-btn, .btn.QC_green-light-btn {
    background-color: #54BFA1;
    color: #FFF;
    height: 40px;
    /*Override Bootstrap*/
    display: inline-block;
    padding: 0 16px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 40px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 12px;
    /*Override Bootstrap END*/
}

.QC_blue-btn {
    background-color: #127abe;
    color: #FFF;
    height: 40px;
    /*Override Bootstrap*/
    display: inline-block;
    padding: 0 16px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 40px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 12px;
    /*Override Bootstrap END*/
}

    .QC_blue-btn:hover, .QC_blue-btn:active, .QC_blue-btn:focus, .btn.QC_blue-btn:hover, .btn.QC_blue-btn:active, .btn.QC_blue-btn:focus,
    .QC_blue-border-btn:hover, .QC_blue-border-btn:active, .QC_blue-border-btn:focus, .btn.QC_blue-border-btn:hover, .btn.QC_blue-border-btn:active, .btn.QC_blue-border-btn:focus {
        background-color: #0e6aa7;
        color: #FFF;
    }

.QC_blue-border-btn, .btn-default.QC_blue-border-btn, .btn-default[disabled].QC_blue-border-btn, .btn.QC_blue-border-btn {
    background-color: transparent;
    color: #127abe;
    /*Override Bootstrap*/
    border: 1px solid #127abe;
    /*Override Bootstrap END*/
}

.QC_blue-light-btn {
    background-color: #38A4C3;
    color: #FFF;
    height: 40px;
    /*Override Bootstrap*/
    display: inline-block;
    padding: 0 16px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 40px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 12px;
    /*Override Bootstrap END*/
}

    .QC_blue-light-btn:hover, .QC_blue-light-btn:active, .QC_blue-light-btn:focus, .btn.QC_blue-light-btn:hover, .btn.QC_blue-light-btn:active, .btn.QC_blue-light-btn:focus,
    .QC_blue-light-border-btn:hover, .QC_blue-light-border-btn:active, .QC_blue-light-border-btn:focus, .btn.QC_blue-light-border-btn:hover, .btn.QC_blue-light-border-btn:active, .btn.QC_blue-light-border-btn:focus {
        background-color: #128AAC;
        color: #FFF;
    }

.QC_blue-light-border-btn, .btn-default.QC_blue-light-border-btn, .btn-default[disabled].QC_blue-light-border-btn, .btn.QC_blue-light-border-btn {
    background-color: transparent;
    color: #38A4C3;
    /*Override Bootstrap*/
    border: 1px solid #38A4C3;
    /*Override Bootstrap END*/
}

.QC_orange-btn, .btn-default.QC_orange-btn, .btn-default[disabled].QC_orange-btn, .btn.QC_orange-btn,
.QC_orange-border-btn, .btn-default.QC_orange-border-btn, .btn-default[disabled].QC_orange-border-btn, .btn.QC_orange-border-btn {
    background-color: #F2CA50 !important;
    color: #FFF;
    height: 40px;
    /*Override Bootstrap*/
    display: inline-block;
    padding: 0 16px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 40px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 12px;
    /*Override Bootstrap END*/
}

    .QC_orange-btn:hover, .QC_orange-btn:active, .QC_orange-btn:focus,
    .btn.QC_orange-btn:hover, .btn.QC_orange-btn:active, .btn.QC_primary-btn:focus,
    .QC_orange-border-btn:hover, .QC_orange-border-btn:active, .QC_orange-border-btn:focus,
    .btn.QC_orange-border-btn:hover, .btn.QC_orange-border-btn:active, .btn.QC_orange-border-btn:focus {
        background-color: #CBA225;
        color: #FFF !important;
    }

.QC_orange-border-btn, .btn-default.QC_orange-border-btn, .btn-default[disabled].QC_orange-border-btn, .btn.QC_orange-border-btn {
    background-color: transparent;
    color: #F2CA50;
    /*Override Bootstrap*/
    border: 1px solid #F2CA50;
    /*Override Bootstrap END*/
}

.QC_orange-bg {
    background: #F2CA50;
    background-color: #F2CA50;
}

.QC_white-btn {
    background-color: #fff !important;
    color: #00447A !important;
    height: 40px;
    /*Override Bootstrap*/
    display: inline-block;
    padding: 0 16px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 40px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 12px;
}

.QC_white-btn-primary-text {
    background-color: #fff !important;
    color: #9F0B56 !important;
    height: 40px;
    /*Override Bootstrap*/
    display: inline-block;
    padding: 0 16px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: bold;
    line-height: 40px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 12px;
}

.QC_white-btn[disabled], .QC_white-border-btn[disabled] {
    background-color: #f7f9fa !important;
    color: #9f9f9f !important;
    border: 1px solid #d9d9d9;
}

/*.QC_white-border-btn {
    color: #333 !important;
    border: 1px solid #aeaeae !important;
    background-color: transparent !important;
}*/

.QC_white-border-btn {
    color: #fff !important;
    border: #fff 1px solid !important;
    background-color: transparent !important;
}

.QC_orang-yalow-btn {
    background-image: linear-gradient(to right top, #ed1651, #fa4d42, #ff7435, #ff982e, #fdb933) !important;
    color: #fff !important;
    height: 40px;
    /*Override Bootstrap*/
    display: inline-block;
    padding: 0 16px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 40px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 12px;
    -webkit-box-shadow: 1px 2px 4px 0px rgba(0,0,0,0.4);
    -moz-box-shadow: 1px 2px 4px 0px rgba(0,0,0,0.4);
    box-shadow: 1px 2px 4px 0px rgba(0,0,0,0.4);
}

.QC_add-to-cart {
    background-color: #0D0D0D;
    background-image: url("AddToCart.svg");
    background-repeat: no-repeat;
    background-position: center;
    padding-left: 15px;
    padding-right: 15px;
    text-align: left;
}

    .QC_add-to-cart.icon-only {
        background-image: none;
    }

        .QC_add-to-cart.icon-only::after {
            content: '';
            display: inline-block;
            position: relative;
            width: 28px;
            height: 29px;
            background-image: url("");
            left: calc(50% - 14px) !important;
            top: calc(50% - 15px) !important;
        }

.orange-color {
    color: #F2CA50;
}

.lightgreen-color {
    color: #00afa6;
}

.yellow-color {
    color: #F2ca50 !important;
}

.yellow-bg, .btn.yellow-bg {
    background-color: #F2ca50;
}

    button.yellow-bg:hover, .btn.yellow-bg:hover, button.yellow-bg:focus, .btn.yellow-bg:focus {
        background-color: #E2B221 !important;
    }

.search-btn-filter {
    margin: 8px 0;
    color: #00447A;
}

.QC-searsh-btn {
    margin-left: 0;
    height: 40px;
    border-radius: 16px 0 0 16px;
}

.widget-btn {
    background-color: #54bfa1;
    background-image: url("");
    background-repeat: no-repeat;
    background-position: center center;
    width: 44px;
    height: 44px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    border: 0px;
    -webkit-box-shadow: 0 3px 8px 0 rgba(0,0,0,.3);
    -moz-box-shadow: 0 3px 8px 0 rgba(0,0,0,.3);
    box-shadow: 0 3px 8px 0 rgba(0,0,0,.3);
    /*margin-top: -10px;*/
    float: right;
    display: none;
}

.QC_rounded-btn {
    border-radius: 20px !important;
}

.QC_small-btn {
    height: 30px;
    /*Override Bootstrap*/
    line-height: 28px !important;
}

.QC_primary-bottom-shadow {
    -webkit-box-shadow: 0px 10px 20px 0px rgba(224,17,112,.3);
    -moz-box-shadow: 0px 10px 20px 0px rgba(224,17,112,.3);
    box-shadow: 0px 10px 20px 0px rgba(224,17,112,.3);
}

.box-donation {
    /*background-color: #F3F3F3;*/
    /*padding-top: 15px;*/
    overflow: hidden;
}

/*.btn-group-lg > .btn,*/ .btn-lg, .input-lg {
    /*padding: 10px 16px !important;*/
    font-size: 16px !important;
    height: 56px !important; /*Custom*/
    line-height: 56px !important;
    border-radius: 16px;
}

.padding-40-top {
    padding-top: 40px;
}

.QC_box-shadow {
    -webkit-box-shadow: 1px 1px 4px 1px rgba(1,1,1,0.13) !important;
    -moz-box-shadow: 1px 1px 4px 1px rgba(1,1,1,0.13) !important;
    box-shadow: 1px 1px 4px 1px rgba(1,1,1,0.13);
}

.QC_box-shadow-4 {
    -webkit-box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.08);
    -moz-box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.08);
    box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.08);
}

.QC_large-box-shadow {
    -webkit-box-shadow: 0 0 50px rgba(0,0,0,0.15) !important;
    -moz-box-shadow: 0 0 50px rgba(0,0,0,0.15) !important;
    box-shadow: 0 0 50px rgba(0,0,0,0.15) !important;
    overflow: hidden;
}

.QC-Cart-images {
    object-fit: cover;
    width: 70px;
    height: 70px;
}

.QC_fit-content {
    height: fit-content !important;
}

.tabe-address-black {
    background-color: rgba(0,0,0,.78);
    height: 50px;
    -webkit-transition: height .3s ease;
    -moz-transition: height .3s ease;
    transition: height .3s ease;
    line-height: 52px;
    font-size: 12px;
    color: #fff;
    bottom: 0;
    position: absolute;
    display: block;
    width: 100%;
    margin-bottom: 0;
}

.tabe-address-black-new {
    height: 56px;
    width: 50px;
    -webkit-transition: height .3s ease;
    -moz-transition: height .3s ease;
    transition: height .3s ease;
    line-height: 52px;
    font-size: 12px;
    color: #fff;
    bottom: 0;
    position: absolute;
    display: block;
    margin-bottom: 0;
    right: 0;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    direction: ltr !important;
    text-align: left;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #444;
    line-height: 38px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #888 transparent transparent transparent;
    border-style: solid;
    border-width: 5px 4px 0 4px;
    height: 0;
    left: 3% !important;
    margin-left: -4px;
    margin-top: -2px;
    position: absolute;
    top: 50%;
    width: 0;
    text-align: center;
}

.select2-container--default .select2-selection--single {
    background-color: #fff;
    border: 1px solid #aaa !important;
    border-radius: 4px !important;
    height: 40px !important;
    padding: 6px 15px !important;
}
/*.tabe-address-black:hover {
        height: 100%;
        -webkit-transition: height 0.3s ease;
        -moz-transition: height 0.3s ease;
        transition: height 0.3s ease;
    }*/
.tabe-address-black-sponser {
    background-color: #fbfbfb;
    height: 50px;
    line-height: 50px;
    -webkit-transition: height .3s ease;
    -moz-transition: height .3s ease;
    transition: height .3s ease;
    color: #7d7e7f;
    text-align: center;
    border-bottom: 1px solid #d6d6d6;
    margin-bottom: 10px;
}

.tabe-address-green > p {
    background-color: rgba(35, 172, 180,.70);
    height: 60px;
    -webkit-transition: height .3s ease;
    -moz-transition: height .3s ease;
    transition: height .3s ease;
    font-size: 14px;
    color: #fff;
    bottom: 0;
    position: absolute;
    display: block;
    width: 100%;
    padding: 0 10px;
    text-align: center;
}

.tabe-address-green.transparent > p {
    background-color: transparent;
}

.tabe-address-green.transparent.padding-50-top > p {
    height: 160px;
    padding-top: 10px;
    overflow: hidden;
}

.tabe-address-green.transparent.padding-50-top.height-130 > p {
    height: 130px;
    padding-top: 50px;
    overflow: hidden;
}


.tabe-address-green:hover > p {
    background-color: rgba(51, 112, 157, 0.90);
    height: 100%;
    -webkit-transition: height 0.3s ease;
    -moz-transition: height 0.3s ease;
    transition: height 0.3s ease;
    text-align: center !important;
}

.tabe-address-green.transparent.padding-50-top:hover > p {
    height: 100%;
    text-align: center !important;
}

.latest-box .media {
    position: relative;
    height: 170px;
    /*margin-bottom: 10px;*/
    background-color: #f3f3f3;
    border-bottom: 1px solid #a4a4a4;
    border-radius: 15px 15px 0 0;
}

    .latest-box .media .overlay-content ul li {
        margin: 0px 1px;
    }

        .latest-box .media .overlay-content ul li a {
            color: #ffffff;
            font-size: 28px;
        }

    .latest-box .media .overlay-content p {
        margin-bottom: 5px;
        line-height: 15px;
    }





/* 16.PROGRESS BARS *********************/

.slider {
    display: inline-block;
    vertical-align: middle;
    position: relative;
}

    .slider input {
        display: none;
    }

    .slider.slider-horizontal {
        height: 10px;
    }

        .slider.slider-horizontal.slider-disabled .slider-track {
            height: 8px;
            cursor: default;
        }

        .slider.slider-horizontal.slider-track {
            height: 1px;
            width: 100%;
            margin-top: 7px;
            top: 50%;
            left: 0;
        }

        .slider.slider-horizontal .slider-selection {
            height: 100%;
            top: 0;
            bottom: 0;
            background: #ed1651;
            background: -moz-linear-gradient(45deg, #fdb933 1%, #ed1651 100%);
            background: -webkit-linear-gradient(45deg, #fdb933 1%,#ed1651 100%);
            background: linear-gradient(45deg, #fdb933 1%,#ed1651 100%);
        }

        .slider.slider-horizontal.slider-handle {
            margin-left: 0;
            margin-top: -5px;
            cursor: e-resize;
        }

    .slider.slider-disabled.slider.tooltip-inner {
        white-space: nowrap;
        background: #ffffff;
        color: #4b4b4b;
        border-radius: 5px;
    }

    .slider.slider-horizontal .slider-selection-green {
        height: 100%;
        top: 0;
        bottom: 0;
        background-image: linear-gradient(to left, #4abcb3, #0aa5b2, #008cac, #0073a1, #20598e);
        border-radius: 5px
    }

.slidernew {
    vertical-align: middle;
    position: relative;
}

.slider-track {
    background: #bfbaba;
    border-radius: 5px;
}

.slider-selection {
    background: #00447A;
    left: 0%;
    border-radius: 5px;
}

.slider-content {
    margin: 26px 0 0 0;
}

/**********************************Card-gift***************************************/


.belu-card {
    box-shadow: -30px 8px 20px rgba(0,0,0,.2);
    background-image: linear-gradient(to right top, #436ab3, #127dbe, #008dc2, #009dc0, #00abbb, #13b3b6, #2ebaae, #48c0a5, #58c39e, #67c598, #75c791, #84c98b);
}

.green-gradient-color {
    background-image: linear-gradient(to bottom, #84c98b, #75c791, #67c598, #58c39e, #48c0a5, #2ebaae, #13b3b6, #00abbb, #009dc0, #008dc2, #127dbe, #436ab3);
}

.belu-card-horizontel {
    box-shadow: -30px 8px 20px rgba(0,0,0,.2);
    padding: 0 20px !important;
    background-image: linear-gradient(to bottom, #4abcb3, #0aa5b2, #008cac, #0073a1, #20598e);
}

.yallow-card {
    box-shadow: -30px 8px 20px rgba(0,0,0,.2);
    background-image: linear-gradient(to right top, #ed1651, #ea244e, #e82e4b, #e53649, #e23d47, #e64a43, #e95640, #ec623d, #f47838, #f98d33, #fca331, #fdb933);
}

.dark-card {
    box-shadow: -30px 8px 20px rgba(0,0,0,.2);
    background-image: linear-gradient(to right top, #092845, #092a48, #0a2b4b, #0a2d4e, #0b2f51, #0b2f50, #0a2e4f, #0a2e4e, #082b49, #072744, #052440, #04213b);
}

.red-card {
    box-shadow: -30px 8px 20px rgba(0,0,0,.2);
    background-image: linear-gradient(to right bottom, #7b2666, #89246b, #972270, #a61e74, #b51777, #bf137a, #c80d7d, #d2057f, #d80482, #df0386, #e50189, #ec008c);
}

.move-card {
    box-shadow: -30px 8px 20px rgba(0,0,0,.2);
    background-image: linear-gradient(to right bottom, #533a6d, #553d76, #56417f, #564589, #554993, #594c98, #5e509e, #6253a3, #6d56a4, #7859a6, #825da7, #8b60a8);
}


.white-card {
    box-shadow: -30px 8px 20px rgba(0,0,0,.2);
    background-image: linear-gradient(to right top, #ffffff, #fafafa, #f6f6f6, #f1f1f1, #ededed);
}

.green-card {
    box-shadow: -30px 8px 20px rgba(0,0,0,.2);
    background-image: linear-gradient(to right bottom, #84c98b, #71c693, #5dc39c, #48c0a5, #32bcad);
}

.rotate-17edg {
    -ms-transform: rotate(-17deg) !important;
    -webkit-transform: rotate(-17deg) !important;
    transform: rotate(-17deg) !important;
}


ls-popup-overlay {
    background-color: rgba(0, 0, 0, 0.70);
}

.popup-slider-gift {
    top: calc(50% - 200px) !important;
}

/* slider single */
.titleDivOnMobile {
    width: 100% !important;
}

.border-trand {
    border: 1px solid #00447A;
    border-radius: 19px;
    padding: 5px 10px;
    margin-left: 15px;
}

.ramadan-fixed-logo {
    background-repeat: no-repeat;
    position: fixed;
    margin: 0 75px;
}

.QC_case-card {
    height: 452px;
    max-height: 452px;
    background-color: #fff;
    border-radius: 15px;
}

.QC_Trash {
    background: url("") no-repeat;
    width: 34px;
    height: 34px;
}

.ui-widget-content {
    background: none;
    border: none;
}

.ui-tabs {
    padding: 0;
}

    .ui-tabs .ui-tabs-nav, .nav-tabs {
        background: none;
        border: none;
        /*border-bottom: 2px solid #20598e;*/
        padding: 0 !important;
        border-radius: 0;
    }

        .ui-tabs .ui-tabs-nav li, .nav-tabs > li {
            background: none;
            color: #9d9d9d;
            text-decoration: none;
            border: 0px;
            outline: none;
            margin: 0;
            margin-bottom: 1px;
            height: 40px;
            border-radius: 0;
        }

            .ui-tabs .ui-tabs-nav a.ui-tabs-anchor, .nav-tabs > li > a {
                background-color: #00447A;
                color: #FFF;
                border-radius: 0;
                border: 1px solid #EEE;
                height: 100% !important;
                line-height: 38px;
                padding: 0 15px;
                margin-top: 5px;
                text-align: center;
                outline: none;
                font-weight: bold;
                -webkit-transition: all 0.3s ease-in-out;
                -moz-transition: all 0.3s ease-in-out;
                -o-transition: all 0.3s ease-in-out;
                transition: all 0.3s ease-in-out;
            }

            .ui-tabs .ui-tabs-nav li:last-child a {
                border-color: transparent;
            }

            .ui-tabs .ui-tabs-nav a.ui-tabs-anchor:hover, .ui-tabs .ui-tabs-nav a.ui-tabs-anchor:focus,
            .ui-state-active a.ui-tabs-anchor,
            .ui-widget-content .ui-state-active a.ui-tabs-anchor, .ui-widget-header .ui-state-active a.ui-tabs-anchor,
            a.ui-button:hover, a.ui-button:focus, .ui-button:hover, .ui-button:focus,
            .ui-button.ui-state-active:hover, .ui-button.ui-state-active:focus,
            .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus,
            .nav-tabs > li > a:hover, .nav-tabs > li > a:focus {
                border-color: transparent;
                background: #FFF;
                color: #454545;
                outline: none;
                margin-top: 0px;
                -webkit-transition: all 0.3s ease-in-out;
                -moz-transition: all 0.3s ease-in-out;
                -o-transition: all 0.3s ease-in-out;
                transition: all 0.3s ease-in-out;
                cursor: pointer !important;
            }

            .ui-tabs .ui-tabs-nav li.ui-tabs-active {
                margin-bottom: 0 !important;
                padding-bottom: 0 !important;
            }
/*.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor, 
                .ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor, 
                .ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor{
                    cursor: pointer;
                }*/

.newnavbar .nav > li > a {
    padding: 0;
}

.float-none {
    float: none !important;
}

.tab-panel-bottom-border > .nav-tabs {
    border-bottom: 1px solid #D9D9D9;
}

    .tab-panel-bottom-border > .nav-tabs > li {
        background: none;
        /*margin-bottom: -1px;
        border-bottom: 1px solid #525252;*/
    }

        .tab-panel-bottom-border > .nav-tabs > li > a {
            border: 1px solid transparent;
            border-bottom: 5px hidden;
            background: none;
            margin-left: 0;
            margin-right: 0;
            color: #525252;
            padding: 0 40px;
            overflow: hidden;
        }

            .tab-panel-bottom-border > .nav-tabs > li.active > a, .tab-panel-bottom-border > .nav-tabs > li.active > a:focus, .tab-panel-bottom-border > .nav-tabs > li.active > a:hover, .tab-panel-bottom-border > .nav-tabs > li > a:hover {
                border: 1px solid transparent;
                border-bottom: 3px solid #9F0B56;
                background: none;
                color: #525252;
            }

.tab-panel-scrollable > .nav-tabs {
    overflow: auto;
    white-space: nowrap;
}

    .tab-panel-scrollable > .nav-tabs > li {
        float: none;
        display: inline-block;
    }


.tab-panel-bottom-border > .nav-tabs > li.active > a.red-hover, .tab-panel-bottom-border > .nav-tabs > li.active > a.red-hover:focus, .tab-panel-bottom-border > .nav-tabs > li.active > a.red-hover:hover, .tab-panel-bottom-border > .nav-tabs > li > a.red-hover:hover {
    border: 1px solid transparent;
    border-bottom: 3px solid #9F0B56;
    background: none;
    color: #9F0B56;
}

    .tab-panel-bottom-border > .nav-tabs > li.active > a.red-hover > svg, .tab-panel-bottom-border > .nav-tabs > li.active > a.red-hover:focus > svg, .tab-panel-bottom-border > .nav-tabs > li.active > a.red-hover:hover > svg, .tab-panel-bottom-border > .nav-tabs > li > a.red-hover:hover > svg {
        fill: #9F0B56;
    }

svg {
    vertical-align: middle;
    fill: inherit;
}

.tab-panel-bottom-arrow, .tab-panel-top-arrow {
    z-index: 60;
    position: relative !important;
}

    .tab-panel-bottom-arrow > .nav-tabs, .tab-panel-top-arrow > .nav-tabs {
        border-bottom: none;
    }

        .tab-panel-bottom-arrow > .nav-tabs > li, .tab-panel-top-arrow > .nav-tabs > li {
            height: auto;
            background: none;
        }

            .tab-panel-bottom-arrow > .nav-tabs > li > a, .tab-panel-top-arrow > .nav-tabs > li > a {
                border: 1px solid transparent;
                border-bottom: none;
                background: none;
                margin-left: 0;
                margin-right: 0;
                color: #525252;
                padding: 0 40px;
            }

                .tab-panel-bottom-arrow > .nav-tabs > li.active > a, .tab-panel-bottom-arrow > .nav-tabs > li.active > a:focus, .tab-panel-bottom-arrow > .nav-tabs > li.active > a:hover, .tab-panel-bottom-arrow > .nav-tabs > li > a:hover,
                .tab-panel-top-arrow > .nav-tabs > li.active > a, .tab-panel-top-arrow > .nav-tabs > li.active > a:focus, .tab-panel-top-arrow > .nav-tabs > li.active > a:hover, .tab-panel-top-arrow > .nav-tabs > li > a:hover {
                    border: 1px solid transparent;
                    background: none;
                    color: #525252;
                }

                    .tab-panel-bottom-arrow > .nav-tabs > li.active > a::after, .tab-panel-bottom-arrow > .nav-tabs > li.active > a:focus::after,
                    .tab-panel-bottom-arrow > .nav-tabs > li.active > a:hover::after, .tab-panel-bottom-arrow > .nav-tabs > li > a:hover::after {
                        top: 100%;
                        left: 50%;
                        border: solid transparent;
                        content: " ";
                        height: 0;
                        width: 0;
                        position: absolute;
                        pointer-events: none;
                        border-color: rgba(247, 249, 250, 0);
                        border-top-color: #F5F5F5;
                        border-width: 14px;
                        margin-left: -14px;
                        z-index: 999;
                    }

                    .tab-panel-top-arrow > .nav-tabs > li.active > a::after, .tab-panel-top-arrow > .nav-tabs > li.active > a:focus::after,
                    .tab-panel-top-arrow > .nav-tabs > li.active > a:hover::after, .tab-panel-top-arrow > .nav-tabs > li > a:hover::after {
                        top: 143%;
                        left: 50%;
                        border: solid transparent;
                        content: " ";
                        height: 0;
                        width: 0;
                        position: absolute;
                        pointer-events: none;
                        border-color: rgba(247, 249, 250, 0);
                        border-bottom-color: #FFF;
                        border-width: 14px;
                        margin-left: -14px;
                        z-index: 999;
                    }


.QC_tab-panel-vertical-separate > .nav-tabs > li {
    border-right: 1px solid #D9D9D9 !important;
}

    .QC_tab-panel-vertical-separate > .nav-tabs > li:last-child {
        border-right: 1px solid transparent !important;
    }

.QC_secondary-nav > .nav-tabs > li.active > a, .QC_secondary-nav > .nav-tabs > li.active > a:focus, .QC_secondary-nav > .nav-tabs > li.active > a:hover, .QC_secondary-nav > .nav-tabs > li > a:hover {
    color: #00447A;
}

.reporting-Box {
    border: 1px dashed #00447A;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
}
/************** SCROLLBAR **************/
/*.tab-content>.active::-webkit-scrollbar-thumb 

{
    border-radius: 0;
    background-color: rgba(255,255,255,.15);
}

.tab-content>.active::-webkit-scrollbar-track {
    border-radius: 0;
    background-color: rgba(255,255,255,.15);
}

.tab-panel-scrollable>.nav-tabs::-webkit-scrollbar-thumb {
    border-radius: 0;
    background-color: rgba(255,255,255,.15);
}


.tab-panel-scrollable>.nav-tabs-ms-scrollbar-thumb{

       border-radius: 0;
    background-color: rgba(255,255,255,.15);

}
.tab-panel-scrollable>.nav-tabs::-webkit-scrollbar-track {
    border-radius: 0;
    background-color: rgba(255,255,255,.15);
}*/

/*.My_App::-webkit-scrollbar {
        width: 10px;
    }

    .My_App::-webkit-scrollbar-thumb {
        border-radius: 0;
        background-color: rgba(0, 76, 132, 0.9);
    }

    .My_App::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 0 rgba(0,0,0,.3);
        border-radius: 0;
        background-color: #f9f7f7;
        width: 5px;
    }*/



::-webkit-scrollbar {
    width: 5px;
}

::-webkit-scrollbar-thumb {
    border-radius: 0;
    background-color: #00447A !important;
}


::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0 rgba(0,0,0,.3);
    border-radius: 0;
    background-color: #f9f7f7;
    width: 4px;
}

.table-content {
    overflow-y: scroll;
    margin: 5px 0;
}

    .table-content::-webkit-scrollbar {
        width: 4px;
        height: 50%;
    }

.high-last-donation::-webkit-scrollbar-thumb {
    border-radius: 0px;
    background-color: rgba(0, 76, 132, 0.9);
}

/* Handle */
.table-content::-webkit-scrollbar-thumb {
    -webkit-border-radius: 15px;
    border-radius: 15px;
    background: #c0c0c0;
}

    .table-content::-webkit-scrollbar-thumb:window-inactive {
        background: #c0c0c0;
    }


/* Track */
.table-content::-webkit-scrollbar-track {
    -webkit-border-radius: 15px;
    border-radius: 15px;
}

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

.min-width-1000 {
    min-width: 1000px;
}

.min-width-60 {
    min-width: 60px;
}

.overflow-auto {
    overflow: auto;
}

/***************** Somalia-Statistics *****************/
.QC_somalia-statistics {
    background-image: url("");
    background-position: top center !important;
    background-size: cover;
}
/***************** Somalia-Statistics END *****************/


/***************** Volunteer-Card *****************/
.QC-volunteer {
    background-image: url("");
    background-position: top center !important;
    background-attachment: fixed;
    background-size: cover;
}

.QC_volunteer h4 {
    font-size: 4.5rem !important;
}

/***************** Volunteer-Card END *****************/
/**********************calculateZakat*****************/
.QC-calculateZakat {
}

.QC-calculateZakat-img {
    background-image: url("");
    background-position: top center !important;
    background-attachment: fixed;
    background-size: cover;
}

.QC-program-img {
    background-image: url("");
    background-position: top center !important;
    background-attachment: fixed;
    background-size: cover;
}
/***********************************/ /*/
/*****************Sponsorship***********/
.QC-Sponsorship {
    background-position: top center !important;
    padding-bottom: 40% !important;
    background-size: cover;
    position: relative;
}

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

    .QC-Sponsorship {
        background-image: none !important;
    }
}

.informtion-pic {
    background-color: rgba(0, 0, 0, 0.50);
    padding: 10px;
    position: absolute;
    z-index: 10;
    right: 50px;
    color: #fff;
    text-decoration: underline;
    bottom: 50px;
    display: block;
}

    .informtion-pic a {
        color: #fff;
        text-decoration: none;
    }

.QC-project {
    background: rgba(254,254,254,1);
    background: -moz-linear-gradient(top, rgba(254,254,254,1) 0%, rgba(242,242,242,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(254,254,254,1)), color-stop(100%, rgba(242,242,242,1)));
    background: -webkit-linear-gradient(top, rgba(254,254,254,1) 0%, rgba(242,242,242,1) 100%);
    background: -o-linear-gradient(top, rgba(254,254,254,1) 0%, rgba(242,242,242,1) 100%);
    background: linear-gradient(to bottom, rgba(254,254,254,1) 0%, rgba(242,242,242,1) 100%);
}
/***************** INFOGRAPH-CARD *****************/
#owl-demo .item {
    background: #42bdc2;
    padding: 30px 0px;
    margin: 5px;
    color: #FFF;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-align: center;
}
/***************** INFOGRAPH-CARD END *****************/

.QC_partner-landing-header {
    height: 400px;
}

.QC_country-infograph {
    min-height: 700px;
}

.QC_country-infograph, .QC_partner-landing-header {
    background: #436ab3;
    background: -moz-linear-gradient(top, #436ab3 1%, #32bcad 50%, #84c98b 100%);
    background: -webkit-linear-gradient(top, #436ab3 1%,#32bcad 50%,#84c98b 100%);
    background: linear-gradient(to bottom, #436ab3 1%,#32bcad 50%,#84c98b 100%);
    color: #fff !important;
}

.QC_country-infograph-numbers {
    color: transparent;
    background-clip: text;
    background: -moz-linear-gradient(180deg, rgba(150,18,118,1) 0%, rgba(243,98,101,1) 50%, rgba(243,98,101,1) 100%);
    background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(150,18,118,1)), color-stop(100%, rgba(243,98,101,1)));
    background: -webkit-linear-gradient(180deg, rgba(150,18,118,1) 0%, rgba(243,98,101,1) 100%);
    background: -o-linear-gradient(180deg, rgba(150,18,118,1) 0%, rgba(243,98,101,1) 100%);
    background: linear-gradient(180deg, rgba(150,18,118,1) 0%, rgba(243,98,101,1) 60%, rgba(243,98,101,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.QC_our-apps-section {
    background-image: url("");
    min-height: 670px;
}
/***************** SUCCESS-STORY  *****************/
.QC_SuccessStory {
    color: #fff;
    background: #436ab3;
    background: -moz-linear-gradient(170deg, #436AB3 10%,#32BCAD 50%,#84C98B 90%);
    background: -webkit-linear-gradient(170deg, #436AB3 10%,#32BCAD 50%,#84C98B 90%);
    background: linear-gradient(170deg, #436AB3 10%,#32BCAD 50%,#84C98B 90%);
}

.QC_relative-position, .relative, .position-relative {
    position: relative !important;
}

.QC_absolute-position, .absolute, .position-absolute {
    position: absolute !important;
}

.QC_fixed-position, .fixed, .position-fixed {
    position: fixed !important;
}

.QC_static-position, .static, .position-static {
    position: static !important;
}

.clearboth {
    clear: both;
}

.SuccessStory-pic {
    margin-top: 25px;
    margin-left: 35px;
    padding: 40%;
    position: absolute;
}

.QC_SuccessStory_imag {
    height: 365px;
    width: 365px;
    object-fit: cover;
}

.col-item {
    border: 1px solid #E1E1E1;
    border-radius: 5px;
    background: #FFF;
}

    .col-item .photo img {
        margin: 0 auto;
        width: 100%;
    }

    .col-item .info {
        padding: 10px;
        border-radius: 0 0 5px 5px;
        margin-top: 1px;
    }

    .col-item:hover .info {
        background-color: #F5F5DC;
    }

    .col-item .price {
        /*width: 50%;*/
        float: left;
        margin-top: 5px;
    }

        .col-item .price h5 {
            line-height: 20px;
            margin: 0;
        }

.price-text-color {
    color: #219FD1;
}

.col-item .info .rating {
    color: #777;
}

.col-item .rating {
    /*width: 50%;*/
    float: left;
    font-size: 17px;
    text-align: right;
    line-height: 52px;
    margin-bottom: 10px;
    height: 52px;
}

.col-item .separator {
    border-top: 1px solid #E1E1E1;
}

.clear-left {
    clear: left;
}

.col-item .separator p {
    line-height: 20px;
    margin-bottom: 0;
    margin-top: 10px;
    text-align: center;
}

    .col-item .separator p i {
        margin-right: 5px;
    }

.col-item .btn-add {
    width: 50%;
    float: left;
}

.col-item .btn-add {
    border-right: 1px solid #E1E1E1;
}

.col-item .btn-details {
    width: 50%;
    float: left;
    padding-left: 10px;
}

.controls {
    margin-top: 20px;
}

[data-slide="prev"] {
    margin-right: 10px;
}

.QC-border-white-left-dashed {
    border-left: 1px dotted #fff;
}

.QC-border-white-right-dashed {
    border-right: 1px dotted #fff;
}

.QC-border-gray-left-dashed {
    border-left: 1px dotted #91908F;
}

.QC-border-gray-right-dashed {
    border-right: 1px dotted #91908F;
}

.QC-border-dashed-btn {
    border-bottom: 1px dotted #fff;
}

.QC-border-dashed-btn-gray {
    border-bottom: 2px dotted #91908F;
}

.QC-border-dashed-btn-gray-light {
    border-top: 2px dotted #d9d9d9;
}

.QC_primary-border-dashed {
    border: 1px dashed #9F0B56 !important;
}

.QC_secondary-border-dashed {
    border: 1px dashed #00447A !important;
}

.QC_secondary-border {
    border: 1px solid #00447A !important;
}

.menu-font {
    font-size: 14px;
}

.btn-success {
    color: #fff;
    background-color: transparent;
    border-color: #fff;
    padding: 15px !important;
    font-size: 10px !important;
}

    .btn-success:hover, .btn-success:active, .btn-success:focus {
        color: #00355F;
        background-color: #fff;
        border-color: #fff;
    }

        .btn-success.active.focus, .btn-success.active:focus, .btn-success.active:hover, .btn-success:active.focus, .btn-success:active:focus, .btn-success:active:hover, .open > .dropdown-toggle.btn-success.focus, .open > .dropdown-toggle.btn-success:focus, .open > .dropdown-toggle.btn-success:hover {
            color: #00355F;
            background-color: #fff;
            border-color: #fff;
        }
/***************** SUCCESS-STORY END  *****************/
.navbar-collapse.in {
    overflow-y: auto !important;
}
/***************** NEWS  *****************/

.QC-News-img {
    width: 130px;
    height: 130px;
    object-fit: cover;
}

.btn-News {
    color: #b4b4b4;
    background-color: #fff;
    border-color: #b4b4b4;
    padding: 15px !important;
    font-size: 10px !important;
}

    .btn-News:hover, .btn-News:focus {
        color: #004c84 !important;
        background-color: #fff;
        border-color: #004c84 !important;
    }

    .btn-News.active.focus, .btn-News.active:focus, .btn-News.active:hover, .btn-News:active.focus, .btn-News:active:focus, .btn-News:active:hover, .open > .dropdown-toggle.btn-News.focus, .open > .dropdown-toggle.btn-success:focus, .open > .dropdown-toggle.btn-News:hover {
        color: #004c84 !important;
        background-color: #fff;
        border-color: #004c84 !important;
    }

.ellipsis {
    text-overflow: ellipsis;
}
/***************** News END *****************/

.h-100 {
    height: 100%;
}

.height-100 {
    min-height: 100px;
    overflow: hidden;
}

.height-150 {
    min-height: 150px;
    overflow: hidden;
}

.height-175 {
    min-height: 175px;
    overflow: hidden;
}

.height-200 {
    min-height: 200px;
    overflow: hidden;
}

.height-250 {
    min-height: 250px;
    overflow: hidden;
}

.height-300 {
    min-height: 300px;
    overflow: hidden;
}

.height-350 {
    min-height: 350px;
    overflow: hidden;
}

.height-32 {
    min-height: 350px;
    overflow: hidden;
}
/***************** MAX-HEIGHT *****************/
.max-height-25 {
    max-height: 25px;
    overflow: hidden;
    min-height: 25px;
}

.max-height-32 {
    min-height: 32px;
    overflow: hidden;
}

@media (max-width: 767px) {
    .max-height-32-xs {
        min-height: 32px;
        overflow: hidden;
    }
}

.max-height-35 {
    height: 35px;
    max-height: 35px;
    overflow: hidden;
}

.max-height-40 {
    max-height: 40px;
    overflow: hidden;
}

.max-height-50 {
    max-height: 50px;
    overflow: hidden;
}

.max-height-55 {
    max-height: 55px;
    overflow: hidden;
}


.max-height-60 {
    max-height: 60px;
    overflow: hidden;
    height: 60px;
}



.max-height-65 {
    max-height: 65px;
    overflow: hidden;
}

.max-height-70 {
    max-height: 70px;
    overflow: hidden;
    height: 70px;
}

.max-height-80 {
    max-height: 80px;
    overflow: hidden;
}

.max-height-90 {
    max-height: 90px;
    overflow: hidden;
}

.max-height-100 {
    height: 100px;
    max-height: 100px;
    overflow: hidden;
}

.max-height-110 {
    height: 110px;
    max-height: 110px;
    overflow: hidden;
}

.max-height-115 {
    height: 115px;
    max-height: 115px;
    overflow: hidden;
}

.max-height-120 {
    height: 120px;
    max-height: 120px;
    overflow: hidden;
}

.max-height-130 {
    height: 130px;
    max-height: 130px;
    overflow: hidden;
}

.max-height-140 {
    height: 140px;
    max-height: 140px;
    overflow: hidden;
}

.max-height-150 {
    max-height: 150px;
    overflow: hidden;
}

.max-height-200 {
    max-height: 200px;
    overflow: hidden;
}

.max-height-250 {
    max-height: 250px;
    overflow: hidden;
}

.max-height-350 {
    max-height: 350px;
    overflow: hidden;
}


.max-height-375 {
    max-height: 375px;
    overflow: hidden;
}


.max-height-400 {
    max-height: 400px;
    overflow: hidden;
}


.max-height-425 {
    max-height: 425px;
    overflow: hidden;
}


.max-height-450 {
    max-height: 450px;
    overflow: hidden;
}


.max-height-475 {
    max-height: 475px;
    overflow: hidden;
}

.height-50 {
    height: 50px !important;
}

.height-47 {
    height: 47px !important;
}

.height-Ramadan-video-500 {
    height: 500px;
    background-size: cover;
}
/***************** MAX-HEIGHT END *****************/

.QC_donation-package-private-tag {
    width: 76px;
    height: 28px;
    background-image: url("");
    background-repeat: no-repeat;
}

.QC_donation-package-contributions-tag {
    width: 102px;
    height: 28px;
    background-image: url("");
    background-repeat: no-repeat;
}

.QC_donation-package-contributions-tag {
    background-color: #fff;
}
/************************* DONATION SUCCESS RECEIPT **********************************/
/************************* DONATION SUCCESS RECEIPT END **********************************/
/************************* CALENDAR **********************************/
.ui-datepicker {
    width: 20em;
    padding: 0.2em 0.2em 0;
}

#ui-datepicker-div {
    background-color: #fff !important;
    border-radius: 8px !important;
    margin-top: 3px !important;
}

.ui-datepicker-month {
    color: #004c84 !important;
}

.ui-datepicker-year {
    color: #004c84 !important;
}

table.ui-datepicker-calendar {
    width: 100%;
    background-color: #f7f9fa;
    border: 1px solid #f7f9fa;
}

.ui-datepicker .ui-icon {
    display: block;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat;
}

.ui-datepicker .ui-datepicker-header {
    position: relative;
    padding: .2em 0;
}

.ui-datepicker .ui-datepicker-next {
    right: 2px;
}

.ui-datepicker .ui-datepicker-prev {
    left: 2px;
}

    .ui-datepicker .ui-datepicker-prev span {
        display: block;
        position: absolute;
        right: 30%;
        margin-right: -8px;
        top: 30%;
        margin-top: -8px;
    }

.ui-datepicker .ui-datepicker-next span {
    display: block;
    position: absolute;
    left: 30%;
    margin-left: -8px;
    top: 30%;
    margin-top: -8px;
}

.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
    position: absolute;
    top: 2px;
    width: 1.8em;
    height: 1.8em;
}


    .ui-datepicker .ui-datepicker-next span {
        right: auto;
        margin: 4px;
    }

    .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-prev span {
        left: 0;
    }

.ui-datepicker .ui-datepicker-title select {
    font-size: 1em;
    margin: 3px !important;
}

.ui-datepicker .ui-datepicker-next, .ui-datepicker .ui-datepicker-next-hover, .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-prev-hover {
    top: 5px;
    background: #00447A;
    border: none;
    position: absolute;
}

table.ui-datepicker-calendar td a.ui-state-default, .ui-datepicker .ui-datepicker-header {
    background-color: #fff;
    text-align: center;
    font-family: Arial;
    color: #004c84;
    border: 1px solid #fff;
    width: 100%;
}

    table.ui-datepicker-calendar td a.ui-state-default.ui-state-highlight, .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
        background-color: #FF2F57;
        color: #FFF;
        width: 100%;
    }


.ui-datepicker .ui-datepicker-title {
    margin: 0 1em;
    font-family: Arial;
}

    .ui-datepicker .ui-datepicker-title select {
        margin: 0 1px;
    }

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    border: 1px solid #c5c5c5;
    background: #f6f6f6;
    font-weight: normal;
    color: #454545;
}

.ui-datepicker td span, .ui-datepicker td a {
    display: block;
    padding: .2em;
    text-align: right;
    text-decoration: none;
}

table.ui-datepicker-calendar td a.ui-state-default, .ui-datepicker .ui-datepicker-header {
    background-color: #fff;
    text-align: center;
    font-family: Arial;
    color: #004c84;
    border: 1px solid #fff;
    width: 100%;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    border: 1px solid #c5c5c5;
    background: #f6f6f6;
    font-weight: normal;
    color: #454545;
}

.ui-datepicker td span, .ui-datepicker td a {
    display: block;
    padding: .2em;
    text-align: right;
    text-decoration: none;
}

.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
    background-repeat: no-repeat;
    background-color: transparent;
    width: 10px;
    height: 14px;
    background-position: 0 0;
    cursor: pointer;
    margin-top: 0;
}

.ui-datepicker .ui-datepicker-prev span {
    background-image: url("") !important;
}

.ui-datepicker .ui-datepicker-next span {
    background-image: url("") !important;
}

.ui-datepicker-prev-hover, .ui-datepicker-next-hover {
    background: transparent;
    border: none;
}

.ui-datepicker th span {
    color: #00447A;
    font-family: Arial;
}

/************************* END CALENDAR **********************************/

.news-pic img {
    object-fit: cover;
    height: 320px;
    width: 100%;
}

.profile-thawab {
    background-image: url("");
    width: 17px;
    height: 23px;
    margin: 10px 6px 0 0;
}

.QC_object-fit-cover {
    object-fit: cover;
    width: 100%;
}

.object-cover {
    object-fit: cover;
}

.object-fit-700 {
    height: 700px !important;
    object-fit: cover;
}

.QC_campaign-donation-circle {
    width: 120px;
    height: 120px;
    z-index: 999;
    top: calc(1080px - 60px);
    left: calc(50% - 60px);
}

.QC_inner-banner, .inner-back, .QC_omniaty-section-banner, .QC_awen-section-banner, .QC_thawab-section-banner {
    min-height: 650px;
    /*background-size: cover !important;*/ /*Temporary*/
    background-repeat: no-repeat;
    background-position-x: center; /*Temporary*/
    /*background-attachment: fixed;*/
    /*position: relative;*/
}

    .QC_inner-banner.futureWriters-landing-banner {
        /*background-size: cover;*/
        background: linear-gradient(90deg,#9f103e,#9f103e);
    }

    .QC_inner-banner.tamkeen-landing-banner {
        background: linear-gradient(90deg,#005490,#005490);
    }

        .QC_inner-banner.futureWriters-landing-banner:after, .QC_inner-banner.tamkeen-landing-banner:after, .QC_inner-banner.behaviorGuidance-landing-banner:after {
            content: '';
            display: block;
            /*width: 1920px;*/
            margin: auto;
            background-size: contain;
            height: 210px;
        }

    .QC_inner-banner.futureWriters-landing-banner:after {
        background: url("") no-repeat center;
    }

    .QC_inner-banner.tamkeen-landing-banner:after {
        background: url("") no-repeat center;
    }

    .QC_inner-banner.behaviorGuidance-landing-banner:after {
        background: url("") no-repeat center;
        height: 384px;
    }

@media (min-width: 768px) {
    /*    .QC_inner-banner.futureWriters-landing-banner {
            background: url('/Content/images/Backgrounds/FutureWriters/future-writers-2024.jpg') no-repeat center;
        background-size: contain;
        height: 350px;
    }*/
    .QC_inner-banner.behaviorGuidance-landing-banner:after {
        background: url("") no-repeat center;
    }

    .QC_inner-banner.futureWriters-landing-banner:after, .QC_inner-banner.tamkeen-landing-banner:after, .QC_inner-banner.behaviorGuidance-landing-banner:after {
        height: 950px;
    }
}

.QC_inner-banner.daily-cahrity-banner {
    background-image: url("");
    min-height: 700px;
}

.QC_program-banner {
    min-height: 800px;
    background-size: cover !important;
}

@media (min-width: 768px) and (max-width: 991px) {
    .daily-cahrity-banner {
        background-size: 150%;
    }
}

.ProjectsNeeds-landing-banner {
    background-image: url("");
    height: 870px;
}

#section-faq {
    padding-bottom: 70px;
    padding-top: 70px;
}

.progress, .progress-bar {
    -webkit-box-shadow: none;
    box-shadow: none;
}

    .progress.progress-dashed {
        background-color: transparent;
    }

.QC_green-bg {
    background-color: #43C0B9 !important;
}

.QC_green-bg-light {
    background-color: rgba(67, 192, 185, 0.5) !important;
}

.zakat-bnner-section {
    background-image: url("");
    min-height: 1065px;
}

.QC_contain-bg {
    background-size: contain !important;
    background-repeat: no-repeat;
    background-position: top center;
}

.warmCaravans-banner {
    /*background-image: url(/content/images/Convoys/warmCaravans.jpg);*/
    /*background-image: url(/content/images/Convoys/Ramadan2020.jpg);*/
    background: url("") #70edff no-repeat center bottom;
    background-size: cover;
}

.warmCaravans-banner-2 {
    background-image: url("");
    background-size: cover;
    background-position: center;
}

.warmCaravans-banner-3 {
    background-image: url("");
    background-size: cover !important;
    height: 115vh;
}

@media only screen and (max-width : 767px) {
    .warmCaravans-banner-3 {
        background-position: center top;
        height: auto;
    }
}

@media only screen and (max-width : 1024px) {
    .warmCaravans-banner-2 {
        background-position: center top;
        background-image: url("");
    }
}

.competitions-banner {
    background-image: url("");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

    .competitions-banner.labeh-banner {
        background-image: url("");
    }

@media only screen and (max-width : 1199px) {
    .competitions-banner {
        background-size: unset;
        background-position: center top;
        background-image: url("");
    }

        .competitions-banner.labeh-banner {
            background-image: url("");
        }
}

.QC_banner-card {
    height: 150px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position-x: center !important;
}

@media only screen and (min-width : 767px) {
    .QC_banner-card {
        height: 350px;
    }
}

.QC_inner-banner.QC_StandingOrder-section-banner {
    /*background-image: url(/content/images/StandingOrder/StandingOrder1.jpg);*/
    background-image: url("");
    min-height: 950px;
}

.QC_inner-banner.QC_StandingOrder-section-banner1 {
    background-image: url("");
    background-size: cover;
    height: 900px;
}

@media (max-width : 991px) {
    .QC_inner-banner.QC_StandingOrder-section-banner {
        background-color: #590012;
        background-image: url("");
        background-size: contain;
        background-position: bottom;
        min-height: 940px;
    }

    .QC_inner-banner.QC_StandingOrder-section-banner1 {
        background-color: #c29877;
        background-position: bottom;
        background-image: url("");
        background-size: 100%;
        height: 400px;
    }
}

.QC_inner-banner.QC_banner-project {
    background-image: url("");
    min-height: 800px;
    background-size: cover;
}

.QC_inner-banner.Donation-landing-banner {
    background-image: url("");
    min-height: 700px;
    background-size: cover;
}

.QC_inner-banner.AdhaTenByTen-landing-banner {
    background-image: url("");
    min-height: 320px;
}

    .QC_inner-banner.AdhaTenByTen-landing-banner > .banner-title {
        top: 360px;
        left: 0;
        right: 0;
    }

.QC_inner-banner.omniaty-banner {
    background-image: url("");
    min-height: 550px;
}

.QC_inner-banner.dal-menu {
    background-image: url("");
    min-height: 626px;
    background-size: cover;
}

.QC_inner-banner.dal-banner {
    background-image: url("");
    min-height: 980px;
}

.QC_inner-banner.dal-pepol {
    background-image: url("");
    min-height: 1382px;
}

.inner-back.generaldonation-banner {
    background-image: url("");
    height: 928px;
}

.QC_inner-banner.assistance-banner {
    background-image: url("");
}

.QC_inner-banner.eyes-banner {
    background-image: url("");
}

.khair-message-bg {
    height: 600px;
    align-items: flex-end;
    justify-content: flex-end;
}

/*    .khair-message-bg > img {
        right: -170px;
    }*/

@media only screen and (max-width : 991px) {
    .khair-message-bg {
        height: auto;
    }

        .khair-message-bg > img {
            right: 0;
        }
}

.eyes-food {
    /* background-image: url(https://www.qcharity.org/Exportpath/henger.jpg); */
    background-image: linear-gradient(to bottom,#122157,#004d86,#007aa9,#00a8bb,#20d5c1);
}
/* Corona banner */

.coronacampaign.carousel-indicators li {
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid #00447A;
}

.coronacampaign.carousel-indicators .active {
    background-color: #00447A
}

.inner-back.corona-banner {
    background-image: url("");
}

.corona-banner2 {
    background-image: url("");
    background-repeat: no-repeat;
    min-width: 300px;
    background-attachment: fixed;
    background-position-x: center !important;
    min-height: 480px;
    background-position-y: 100px;
}


.inner-back.relief-banner {
    background-image: url("");
    background-size: contain;
}

.QC_inner-banner.sa3d-banner {
    background-image: url("");
    height: 600px;
}

.QC_inner-banner.learn-banner {
    background-image: url("");
    min-height: 600px;
}

@media only screen and (max-width : 767px) {
    .QC_inner-banner.sa3d-banner {
        background-image: url("");
    }

    .QC_inner-banner.learn-banner {
        background-image: url("");
        background-size: contain;
        min-height: 400px;
    }
}

.QC_inner-banner.BookResearch-banner {
    background-image: url("");
    min-height: 520px;
}

.QC_donation-banner-card {
    padding-top: 320px;
    filter: opacity(.95);
}

.QC_inner-banner.involved-landing-banner {
    background-image: url("");
    height: 620px;
}

/*.percPosition {
    margin-right: @percPosition%;
}*/

/*////////////////////////////////////////////////////////////////////////////////////*/
.QC_inner-banner.ramadan-landing-banner, .QC_inner-banner.adha-landing-banner-2021 {
    background-image: url("");
    /*margin-top: 80px;*/
    background-size: cover;
    padding-bottom: 50PX;
}

.QC_inner-banner.ramadan-landing-banner, .QC_inner-banner.adha-landing-banner {
    /*margin-top: 60px;*/
    background-size: cover;
    padding-bottom: 50PX;
    background-blend-mode: multiply;
}

/*.QC_inner-banner.ramadan-landing-banner:before,*/
.QC_inner-banner.adha-landing-banner-2021:before {
    content: '';
    display: block;
    position: absolute;
    background-color: rgba(0,0,0,.4);
    height: 100%;
    width: 100%;
}

.ramadan-2023-mainBanner {
    width: 100%
}

.ramadan_impact-btn {
    display: inline-flex !important;
    height: 56px !important;
    /*max-width: 375px;*/
}

.ramadan_impact-img {
    width: 24px;
    margin: 0 16px;
}

@media (min-width: 768px) {
    .ramadan-2023-mainBanner {
        max-width: 1620px;
        float: right;
    }

    .ramadan_impact-btn {
        height: 92px !important;
    }

    .ramadan_impact-img {
        width: 34px;
    }
}

@media (min-width: 2000px) {
    .ramadan-2023-mainBanner {
        max-width: 1920px;
    }
}

/*@media (min-width: 2120px) {
    .ramadan-2023-mainBanner {
        max-width: 2000px;
        float: right;
    }
}*/

/*@media screen and (min-width: 991px) {
    .QC_inner-banner.ramadan-landing-banner, .QC_inner-banner.adha-landing-banner-2021 {
        margin-top: 30px;
    }
}

@media screen and (min-width: 1200px) {
    .QC_inner-banner.ramadan-landing-banner, .QC_inner-banner.adha-landing-banner-2021 {
        margin-top: 62px;
    }
}*/

/*.QC_inner-banner.ramadan-landing-banner-old {
    background-image: url(/content/images/Ramadan/Ramadan-2022-banner.jpg);*/
/*background-image: linear-gradient(to bottom, #122157, #004d86, #007aa9, #00a8bb, #20d5c1);*/
/*height: 1050px;
    -webkit-animation: QC_gradient-background-animation 10s ease infinite;
    -moz-animation: QC_gradient-background-animation 10s ease infinite;
    animation: QC_gradient-background-animation 10s ease infinite;
    background-size: 200% 200% !important;
    background-size: cover;
}*/

@media only screen and (max-width : 992px) {
    .QC_inner-banner.ramadan-landing-banner-old {
        height: 750px;
        /*background-image: linear-gradient(to bottom, #421767, #6b1878, #961484, #c10a8a, #ec008c);*/
        background-image: linear-gradient(to bottom, #122157, #004d86, #007aa9, #00a8bb, #20d5c1);
        /*padding-bottom: 30px;*/
        -webkit-animation: QC_gradient-background-animation 10s ease infinite;
        -moz-animation: QC_gradient-background-animation 10s ease infinite;
        animation: QC_gradient-background-animation 10s ease infinite;
        background-size: 200% 200% !important;
    }
}

.QC_inner-banner.ramadan-landing-banner-2020 {
    /*background-image: url(/content/images/Ramadan/Ramadan-2019-banner.jpg);*/
    background-image: url("");
    background-size: cover;
}

.QC_inner-banner.adha-landing-banner-2022 {
    background-image: url("");
}

.QC_inner-banner.ramadan-landing-banner {
    /*background-image: url('/Content/images/Ramadan/Ramadan-2022-banner.png');
    background-image: url('/Content/images/Ramadan/Ramadan-2023-banner.jpg');*/
    background-image: url("");
}

.QC_inner-banner.adha-landing-banner {
    background-image: url("");
}

.QC_inner-banner.ramadan-landing-banner-2025 {
    background-image: url(""), url("");
    background-position: right, left top;
    margin-right: 4%;
}


/*.QC_inner-banner.ramadan-landing-banner:before, .QC_inner-banner.adha-landing-banner:before {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;*/
/*background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 100%, rgba(255,255,255,0) 0%), url('/Content/images/Ramadan/Ramadan-Pattern.svg');*/
/*background: url('/Content/images/Ramadan/Ramadan-Pattern.svg');
        opacity: 0.05;
    }*/

/*    .QC_inner-banner.ramadan-landing-banner .ramadan_banner-container:before {
        content: url('/Content/images/Ramadan/Ramadan-2023-bg-object.png');
        display: block;
        position: absolute;
    }*/

@media (max-width : 767px) {
    .QC_inner-banner.ramadan-landing-banner {
        background-image: url("");
    }
}

/********************************************/
/********************************************/

.ramadan-projects-2021 {
    max-width: 240px;
    /*    transition: transform 400ms;
    transform: scale(.92);
    transform-origin: center center;*/
}

@media (max-width: 1199px) {
    .ramadan-projects-2021 {
        max-width: 220px;
    }
}
/*.splide__list{
    justify-content: center;
}*/
/*.splide__slide.is-active .ramadan-projects-2021 {*/
/*transform: scale(1);*/
/*}*/

/*.ramadan-projects-2021 > div {
        max-width: 192px;
    }*/
.ramadan-projects-header-2021 {
    background-image: url("");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 100%;
    padding: 12px 8px 0 8px;
    /*max-width: 192px;*/
}

.main-projects-photo, .ramadan-projects-photo-2021 {
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transition: all 2s ease;
    transition: all 0.5s ease;
}

.main-projects-photo {
    background-size: cover;
    height: 180px;
}

.ramadan-projects-photo-2021 {
    background-size: 100%;
    height: 100px;
    /*max-width: 176px;*/
}

.ramadan-projects-2021:hover .ramadan-projects-photo-2021 {
    background-size: 102% !important;
    transition: ease-in;
    -webkit-transition: all 2s ease;
    transition: all 0.5s ease;
}
/*a.projects:before {
            content: url('../../../Content/images/Ramadan/fasting-breakfast-2021.png');
            background: url('../../../Content/images/Ramadan/ramadan-projects-bg-2021.svg') no-repeat;
            display: block;
            position: absolute;
            bottom: 95%;
            width: 240px;
            padding: 8px;
        }*/
.projects2021 .QC_primary-btn {
    margin-bottom: -24px;
    height: 40px;
}

@media screen and (min-width: 420px) {
    .ramadan-projects-photo-2021 {
        height: 155px;
    }

    .projects2021 .QC_primary-btn {
        margin-bottom: -24px;
        height: 48px;
        line-height: 48px !important;
    }

    .sadaqa_gate-cards:before {
        display: none;
    }

    .ramadan-cards-primary:before {
        display: none;
    }

    .ramadan-cards-secondary:before {
        display: none;
    }
}

.ramadan-cards-primary {
    background: #BAA675;
    position: relative;
    cursor: pointer;
}

.ramadan-cards-secondary {
    background: #EAE4D6;
    position: relative;
    cursor: pointer;
}

.ramadan-cards-primary:before {
    content: '';
    display: block;
    background: url("") no-repeat;
    width: 190px;
    height: 60px;
    position: absolute;
    right: 0;
    top: 0;
    transform: scale(-1);
}

.ramadan-cards-secondary:before {
    content: '';
    display: block;
    background: url("") no-repeat;
    width: 190px;
    height: 60px;
    position: absolute;
    right: 0;
    top: 0;
    transform: scale(-1);
}

.sadaqa_gate-cards {
    background: #ECF9F8;
    overflow: hidden;
}

    .sadaqa_gate-cards:before {
        content: '';
        display: block;
        background: url("sadakaPatternCard.svg") no-repeat;
        width: 60px;
        height: 60px;
        position: absolute;
        right: 0;
        transform: scale(-1);
    }

.projects2021.owl-carousel {
    width: auto;
    margin: auto;
}

    .projects2021.owl-carousel .owl-stage-outer {
        height: auto;
    }

    .projects2021.owl-carousel .owl-item {
        margin-top: 50px;
    }

@media screen and (min-width: 576px) {
    /*    .projects2021.owl-carousel .owl-stage-outer {
        height: 400px;
    }
*/
    .projects2021.owl-carousel .owl-item {
        width: 225px !important;
    }

    .main-projects-photo {
        height: 150px;
    }

    .ramadan-projects-photo-2021 {
        height: 192px;
    }
}

@media screen and (min-width: 768px) {
    .projects2021.owl-carousel {
        width: 100%;
    }

        .projects2021.owl-carousel .owl-item {
            margin-top: 50px;
        }
}

@media screen and (min-width: 1200px) {
    /*    .projects2021.owl-carousel .owl-stage-outer {
        height: 450px;
    }
*/
    .projects2021.owl-carousel .owl-item {
        width: 265px !important;
    }

    .main-projects-photo {
        height: 190px;
    }

    .ramadan-projects-photo-2021 {
        height: 220px;
        background-position: center;
    }
}
/*////////////////////////////////////////////////////////////////////////////////////*/

.QC_inner-banner.orbis-landing-banner {
    background-image: url("");
    background-size: cover;
    padding-bottom: 50PX;
    height: 1084px;
}

.QC_inner-banner.streetcup-landing-banner {
    background-image: url("");
    background-size: cover;
    padding-bottom: 50PX;
    height: 950px;
}

.streetcup-overlay-layer {
    background-color: rgba(0, 0, 0, 0.7);
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}

@media only screen and (max-width : 767px) {
    .streetcup-overlay-layer {
        height: 18%;
    }
}

.streetcup .flip-clock__piece {
    display: inline-block;
    width: 80px;
    margin: 0 12px;
}

.streetcup .flip-clock__slot {
    font-size: 12px;
}

@media (max-width: 991px) {
    .streetcup .flip-clock__piece {
        width: 23%;
        margin: 0 1%;
    }
}

.QC_inner-banner.orbis-mid-banner {
    background-image: url("");
    background-size: cover;
    padding-bottom: 50PX;
    height: 1084px;
}

.QC_inner-banner.orbis-mid-banner {
    background-image: url("");
    background-size: cover;
    padding-bottom: 50PX;
    height: 1084px;
}

.QC_inner-banner.orbis-last-banner {
    background-image: url("");
    background-size: cover;
    padding-bottom: 50PX;
    height: 1084px;
}

.margin-520-top {
    margin-top: 520px;
}

.margin-245-top {
    margin-top: 245px;
}

.padding-150-h {
    padding-left: 150px;
    padding-right: 150px;
}

.margin-top-n10p {
    margin-top: -10%;
}

.orbis-blue-color {
    color: #0040C0;
}

.orbis-blue-bg {
    background-color: #0040C0;
}

.orbis-purple-bg {
    background-color: #B10C5F;
}

.orbis-purple-color {
    color: #B10C5F;
}

.btn-white-bg {
    background-color: #FFF;
}

.padding-25-h {
    padding-left: 25px;
    padding-right: 25px;
}

.orbis-bottom-right {
    position: absolute;
    bottom: 70px;
    right: 16px;
}

.orbis-bottom-blue-box {
    margin-top: 900px;
    height: 1000px;
}

.orbis-bottom-purple-box {
    margin-top: 900px;
}

.orbis-margin-top-n {
    margin-top: -65%;
}

.black-btn {
    background-color: #000;
    color: #FFF !important;
    height: 48px;
    /*Override Bootstrap*/
    display: inline-block;
    padding: 0 16px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 42px !important;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 12px;
    /*Override Bootstrap END*/
}

.box-goal {
    position: absolute;
    background: #E91915;
    bottom: 24%;
    opacity: 0.3;
}

.team-shirt {
    max-height: 265px;
    max-width: 223px;
    width: 100%;
    height: 200px;
    background-image: url("");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    margin: auto;
}

.team-flag {
    left: 0;
    top: 0;
    right: 0;
    bottom: 20%;
    display: block;
    margin: auto
}

.team-name-board {
    max-width: 615px;
    width: 100%;
    height: 80px;
    background-image: url("");
    background-size: cover;
    background-repeat: no-repeat;
    margin: auto;
}

.team-heart-bg {
    max-width: 600px;
    width: 100%;
    height: 485px;
    background-image: url("");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.border-title {
    border-left: 1px solid #5F233D;
    border-top: 1px solid #5F233D;
    border-bottom: 1px solid #5F233D;
}

.border-icon {
    border: 1px solid #5F233D;
}

.border-details {
    border-left: 1px solid #5F233D;
    border-right: 1px solid #5F233D;
    border-bottom: 1px solid #5F233D;
}

.team-center-line {
    background: linear-gradient(#FFF, #FFF) no-repeat center 35px/1px 40%;
}

.team-yellow-button {
    background-color: #F2CA50;
    color: #000;
    height: 50px;
    width: 80%;
    max-width: 180px;
    display: inline-block;
    padding: 0 0px;
    margin-bottom: 0;
    line-height: 50px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 4px;
}

.team-blue-button {
    background-color: #43C0B9;
    color: #000;
    height: 50px;
    width: 80%;
    max-width: 180px;
    display: inline-block;
    padding: 0 0px;
    margin-bottom: 0;
    line-height: 50px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 4px;
}

.team-heading {
    font-size: 64px;
    margin-top: 210px;
}

.team-description-fontsize {
    font-size: 24px;
}

.QC_inner-banner.about-international {
    background-image: url("");
    background-size: cover;
    height: 1420px;
}

.QC_inner-banner.fan-zone {
    background-image: url("");
    background-size: cover;
    height: 110vh;
}

.QC_inner-banner.team-support {
    background-image: url("");
    background-size: cover;
    height: 130vh;
}

.modal-bg-image {
    background-image: url("");
    background-size: cover;
    height: 250px;
    background-repeat: no-repeat;
    background-position-x: center !important;
}

.modal-bg-try-image {
    background-image: url("");
    background-size: cover;
    height: 250px;
    background-repeat: no-repeat;
    background-position-x: center !important;
}

.btn-try-again-disabled {
    background-color: #91908F;
}


.thank-you-bg-image {
    background-image: linear-gradient(270deg, #000000 0%, #54545400 100%), url("");
    background-size: cover;
    height: 350px;
    background-repeat: no-repeat;
    background-position-x: center !important;
}

.thank-you-bg-image-not {
    background-image: linear-gradient(270deg, #000000 0%, #54545400 100%), url("");
    background-size: cover;
    height: 350px;
    background-repeat: no-repeat;
    background-position-x: center !important;
}

.team-name-board .padding-top {
    padding-top: 50px;
    padding-bottom: 15px;
}

.team-project-margin {
    margin-left: 13%;
    margin-right: 13%;
}

.team-margin-hr {
    margin-left: 20px;
}


.arrow-bg {
    height: 285px;
    background-image: url("");
    background-position-y: center;
    background-position-x: center;
    background-size: contain;
    background-repeat: no-repeat;
    top: -30%;
    left: 50%;
    z-index: 1;
}

.score-bg {
    height: 285px;
    background-image: url("");
    background-position-y: center;
    background-position-x: center;
    background-size: contain;
    background-repeat: no-repeat;
    top: 56%;
    z-index: 1;
}

.score-big-bg {
    height: 285px;
    background-image: url("");
    background-position-y: center;
    background-position-x: center;
    background-size: contain;
    background-repeat: no-repeat;
    top: 56%;
    z-index: 1;
}

@media screen and (min-device-width: 960px) and (max-device-width: 1055px) {
    .team-heading {
        font-size: 45px;
    }

    .team-description-fontsize {
        font-size: 18px;
    }
}

@media screen and (min-device-width: 690px) and (max-device-width: 890px) {
    .QC_inner-banner.fan-zone {
        height: 780px;
        background-position-x: 100% !important;
    }

    .team-heading {
        font-size: 40px;
        margin-top: 50px;
    }

    .team-margin-hr {
        margin-left: 0px;
        margin-top: 60px;
    }

    .team-description-fontsize {
        font-size: 20px;
    }
}


@media only screen and (max-width: 768px) {
    .QC_inner-banner.about-international {
        background-image: url("");
        height: 1300px;
    }

    .QC_inner-banner.fan-zone {
        background-image: url("");
        background-size: cover;
        height: 620px;
    }

    .team-heading {
        font-size: 32px;
        margin-top: 380px;
    }

    .team-description-fontsize {
        font-size: 18px;
    }

    /*   .team-name-board {
            height: 47px;
            margin-top: 30px;
        }
*/
    .team-name-board .padding-top {
        padding-top: 25px;
        padding-bottom: 5px;
    }

    .team-project-margin {
        margin-left: 0px;
        margin-right: 0px;
    }

    .team-margin-hr {
        margin-left: 0px;
        margin-top: 60px;
    }

    .team-pitch-bg {
        top: 89%;
        z-index: 1;
        left: 0%;
    }

    .team-shirt {
        height: 170px;
    }
}

.QC_inner-banner.OurMission {
    background-image: url("");
    background-size: cover;
    height: 1080px;
}

@media only screen and (max-width: 768px) {
    .QC_inner-banner.OurMission {
        background-image: url("");
        height: 2000px;
    }
}

.QC_inner-banner.adahy-landing-banner {
    /*background-image: linear-gradient(to top, #0F498A, #011C4F);*/
    background: url("");
    /*height: 980px;*/
    padding: 100px 0;
    background-size: cover;
}

.QC_inner-banner.about-landing-banner {
    background-image: url("");
}

.QC_inner-banner.Media-landing-banner {
    background-image: url("");
    height: 650px;
}

.QC_inner-banner.gift-landing-banner {
    background-image: url("");
    height: 830px;
    background-size: cover;
}

@media only screen and (max-width : 767px) {
    .QC_inner-banner.gift-landing-banner {
        height: 700px;
    }

    .QC_inner-banner.streetcup-landing-banner {
        height: 450px;
    }
}

@media only screen and (max-width: 991px) {
    .blockMid {
        display: block;
    }
}

.QC_inner-banner.meterKhair-landing-banner {
    background: url("") no-repeat center;
    height: 680px;
}

.QC_inner-banner.hurryUp-banner, .QC_inner-banner.urgent-banner {
    max-height: 380px !important;
    min-height: 300px !important;
}

.QC_inner-banner.hurryUp-banner {
    background: url("") no-repeat;
}

.QC_inner-banner.urgent-banner {
    background: url("") no-repeat;
}

.hurryUp-icon {
    background: url("") no-repeat;
    display: block;
    min-height: 106px;
    max-width: 205px;
    margin-left: auto;
    margin-right: auto;
}

.QC_inner-banner.projects-landing-banner {
    background-image: url("");
    height: 650px;
}

@media only screen and (max-width : 991px) {
    .QC_inner-banner.projects-landing-banner {
        background-image: none;
        background-color: #20264a;
        min-height: 500px;
        height: auto;
    }
}

.QC_inner-banner.whay-projects-banner {
    background-image: url("");
    height: 1000px;
}

.QC_inner-banner.localDevelopment-landing-banner {
    background-image: url("");
    height: 679px;
}

.QC_inner-banner.rescuemission-banner {
    background-image: url("");
    background-size: auto !important;
    /*height: 1332px;*/
}

.QC_inner-banner.rescuemission-banner-shame {
    background-image: url("");
    background-size: 100% !important;
    background-color: #000;
    background-repeat: no-repeat;
}

@media only screen and (max-width : 767px) {
    .QC_inner-banner.rescuemission-banner-shame {
        background-image: url("");
    }
}

.QC_inner-banner.rescuemission-charts-banner {
    background-image: url("");
    background-size: auto !important;
    height: 1300px;
}

.QC_inner-banner.rescuemission-charts-banner-red {
    background-image: linear-gradient(to bottom, #982c32, #80242a, #681c22, #52151a, #3c0e11);
}

.QC_inner-banner.zakat-landing-banner {
    background-image: url("");
    height: 650px;
}

.QC_inner-banner.sponsorship-inner-banner {
    background-image: url("");
    height: 679px;
    background-size: cover !important;
}

.QC_ramadan-video-card {
    background: url("") repeat;
    background-color: rgb(247, 249, 250);
}

.QC_inner-banner.countries-banner {
    height: 700px;
    min-height: 700px;
    max-height: 700px;
    position: relative;
}

.QC_inner-banner.refugee-banner {
    height: 980px;
    min-height: 980px;
    max-height: 980px;
    position: relative;
}

.country-info {
    background-color: rgba(0, 0, 0, 0.60);
    color: #FFF;
    position: absolute;
    bottom: 0;
    padding: 30px 0;
}

.text-initial {
    white-space: initial !important;
}

.font-italic {
    font-style: italic !important;
}

.ramadan-inner-back {
    background-image: url("");
}

.QC_inner-banner.case-card-image {
    height: 170px;
    min-height: 170px;
    width: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    background-size: cover !important;
    background-position: top center;
}

.mgales-request-form {
    margin-top: -22%;
}

.QC_omniaty-section-banner, .QC_awen-section-banner, .QC_thawab-section-banner {
    min-height: 420px;
    max-height: 420px;
    background-position: center;
    overflow: auto;
}

.QC_btn-icon {
    fill: #00447A;
}

.QC_inner-banner.QC_brand {
    background-image: url("");
    height: 590px;
    background-size: cover;
}

button:hover > p > svg > .QC_btn-icon, button:active > p > svg > .QC_btn-icon, button:focus > p > svg > .QC_btn-icon, .QC_btn-icon:hover, .QC_btn-icon:active, .QC_btn-icon:focus {
    fill: #FFF;
}

.career-banner {
    background-image: url("");
    min-height: 235px;
}

/*.QC_omniaty-section-banner {
    background-image: url(/content/images/Donation/Omniaty-section-banner.jpg);
}

.QC_awen-section-banner {
    background-image: url(/content/images/Donation/Omniaty-section-banner.jpg);
}

.QC_thawab-section-banner {
    background-image: url(/content/images/Donation/Omniaty-section-banner.jpg);
}
    .QC_omniaty-section-bg {
    background: #D95448;
    background-color: #D95448;
}

.QC_awen-section-bg {
    background: #00A79D;
    background-color: #00A79D;
}

.QC_thawab-section-bg {
    background: #ED216C;
    background-color: #ED216C;
}*/

.QC_intiatves-section {
    min-height: 450px;
    overflow: hidden;
}

/*.main-widht-menu {
    max-width: 350px;
}*/

.red-color-bold {
    color: #FF345B !important;
    font-weight: bold !important;
}

.bg-white {
    background-color: #fff !important;
    background: #FFF !important;
}

@media screen and (max-width: 768px) {
    .basic-color-xs {
        color: #333 !important;
    }

    .bg-white-xs {
        background-color: #fff !important;
        background: #FFF !important;
    }
}

@media screen and (max-width: 992px) {
    .basic-color-sm {
        color: #333 !important;
    }
}

.bg-primary {
    background-color: #9F0B56 !important;
    background: #9F0B56 !important;
}

.bg-secondary {
    background-color: #00447A !important;
    background: #00447A !important;
}

.bg-logo-brand {
    background-color: #BF2862 !important;
    background: #BF2862 !important;
}

.bg-gray {
    background-color: #F5F5F5 !important;
    background: #F5F5F5 !important;
}

.bg-gray-2 {
    background-color: #eee !important;
    background: #eee !important;
}

.bg-gray-dark {
    background-color: #525252 !important;
    background: #525252 !important;
}

.bg-black {
    background-color: #000;
    background: #000;
}

.QC_opacity-50 {
    opacity: 0.5;
}

.QC_backsham {
    background-image: url("");
    background-size: cover;
    height: 100vh;
}

.bg-grident-moission {
    background-image: linear-gradient(to bottom, #982c32, #80242a, #681c22, #52151a, #3c0e11);
    height: 350px;
}

.bg-grident-thanks {
    background-image: linear-gradient(to left bottom, #533a6d, #553d76, #56417f, #564589, #554993, #594c98, #5e509e, #6253a3, #6d56a4, #7859a6, #825da7, #8b60a8);
}

.QC_white-bg-opacity-15 {
    background-color: rgba(255, 255, 255, 0.15);
}

.QC_black-bg-opacity-15 {
    background-color: rgba(0, 0, 0, 0.15);
}

.bg-white-transparent, .white-transparent-bg {
    background-color: rgba(255, 255, 255, 0.8);
}

.bg-black-transparent {
    background-color: rgba(0, 0, 0, 0.5);
}

.QC_black-bg {
    background: #000;
    background-color: #000;
}

.QC_gray-bg-transparent {
    background-color: rgba(45,45,45,0.7);
}

.QC_white-bg-transparent {
    background-color: rgba(255,255,255,0.7);
}

.thanks-bg {
    background-image: url("");
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: 100%;
}

ul, ol {
    margin-bottom: 15px;
}

textarea {
    background-color: #FFF;
    margin-bottom: 15px;
    border: 1px solid #D9D9D9;
    border-radius: 8px;
    padding: 0 10px;
    color: #777;
}

input, .input, select, .select, input.form-control, .input.form-control, button.form-control, select.form-control, .select.form-control .form-control {
    background-color: #FFF;
    margin-bottom: 15px;
    height: 48px;
    line-height: 38px;
    border: 1px solid #aeaeae;
    border-radius: 12px;
    padding: 0 10px;
    color: #333;
}

    select, .select, select.form-control, .select.form-control, .white-select, select.white-select, .select.white-select {
        appearance: none;
        -moz-appearance: none;
        -webkit-appearance: none;
        background-position-x: calc( 100% - 10px);
        background-position-y: center;
        background-repeat: no-repeat;
        cursor: pointer;
        text-overflow: ''; /* this is important! */
        font-size: 13px;
        outline: none;
    }

        .select.form-control-white, select.form-control-white {
            background-image: url("");
            border: 1px solid #fff;
            background-color: transparent;
            color: #fff;
        }

            .select.form-control-white option, select.form-control-white option {
                background-color: #00447A;
                border: none;
                margin: 10px 0;
                color: #fff;
            }

    .input.form-control-white, input.form-control-white {
        border: 1px solid #fff;
        background-color: transparent !important;
        color: #fff;
        font-family: inherit;
    }


    .input.fa, input.fa,
    .select.fa, select.fa {
        line-height: 40px !important;
    }

    .input.form-control-white::-moz-placeholder {
        color: #fff;
    }

    input.form-control-white::-moz-placeholder {
        color: #fff;
    }

    .input.form-control-white:-ms-input-placeholder {
        color: #fff;
    }

    input.form-control-white:-ms-input-placeholder {
        color: #fff;
    }

    .input.form-control-white::-webkit-input-placeholder {
        color: #fff;
    }

    input.form-control-white::-webkit-input-placeholder {
        color: #fff;
    }

html input[disabled], html select[disabled], html input[readonly],
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
    cursor: not-allowed;
    background-color: #f7f9fa;
    border: 1px solid #d9d9d9;
    color: #9f9f9f;
}

button.QC_primary-btn[disabled], .QC_primary-btn[disabled] {
    background-color: #9D9D9D;
    color: #fff;
}

html button[disabled], html button.QC_primary-border-btn[disabled], html button.QC_secondary-border-btn[disabled], html .QC_secondary-border-btn[disabled] {
    cursor: not-allowed;
    background-color: #9D9D9D;
    border: 1px solid #d8d8d8;
    color: #FFF !important;
}

select, .select, select.form-control, .select.form-control {
    background-image: url("arrow-input-small.png");
}

    select.white-select, .white-select, .select.white-color {
        background-color: transparent;
        background-image: url("arrow-input-small.png");
    }

        select::-ms-expand, select.form-control::-ms-expand, .white-select::-ms-expand, select.white-select::-ms-expand { /* this is for IE! */
            display: none;
        }

.form-control.input-number, input.input-number {
    height: 32px;
    text-align: center;
}

::-moz-placeholder {
    color: #999;
    opacity: 1;
}

:-ms-input-placeholder {
    color: #999;
}

::-webkit-input-placeholder {
    color: #999;
}

i {
    font-style: normal;
}

.disaster-search-icon {
    color: #FFF;
    font-size: 18px !important;
    font-weight: normal;
    line-height: 40px !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 4px;
    position: absolute;
    z-index: 10;
    pointer-events: none;
    right: 20px !important;
    left: auto !important;
    /*top: 38% !important;*/
}

.numberCircleBorder {
    border-radius: 50%;
    border: 2px solid #FFF;
    padding: 5px;
    background-color: transparent;
    width: 145px;
    height: 145px;
    margin-right: auto;
    margin-left: auto;
}

    .numberCircleBorder.dark-gray {
        border-color: #3C3C3C;
    }

.dark-gray-color {
    color: #3C3C3C !important;
}

.gray-color-light {
    color: rgba(82, 82, 82, 0.5);
}

.numberCircleBorder.primary {
    border-color: #9F0B56;
}

.numberCircleBorder.secondary {
    border-color: #00447A;
}

.numberCircleBorder.light-gray {
    border-color: #B7BDC4;
    color: #B7BDC4;
}

.light-gray-color {
    color: #B7BDC4;
}

.numberCircle {
    border-radius: 50%;
    /*behavior: url(PIE.htc);*/ /* remove if you don't care about IE8 */
    width: 130px;
    height: 130px;
    line-height: 60px;
    padding: 8px;
    background: #fff;
    color: #00447A;
    text-align: center;
    font: 40px;
    line-height: 60px;
    margin-right: auto;
    margin-left: auto;
}

.about-icon {
    width: 40px;
    height: 40px;
    text-align: center;
    padding-top: 11px;
    padding-left: 9px;
}

/*Base END*/

.search-menu {
    background-color: transparent;
    border: 1px solid #2D2D2D;
    margin: 6px 15px 0 20px;
    border-radius: 8px;
    color: #525252 !important;
    font-family: 'Noto Kufi Arabic';
    font-weight: 100;
    width: 44px;
    text-align: center;
    height: 48px;
}

#datediv .date-dropdowns {
    display: flex;
    justify-content: space-between;
}

#datediv .year, #datediv .month, #datediv .day {
    margin: 10px 6px;
    padding: 0 25px;
}

/*.filterdonation-section input::-webkit-input-placeholder {
    color: #FFF;
}*/

.col-center-block {
    float: none;
    display: block;
    margin: 0 auto;
    /* margin-left: auto; margin-right: auto; */
}

.tabs-project {
    border: 1px solid #707070;
    color: #2D2D2D
}

    .tabs-project:hover {
        border: 1px solid #9F0B56;
        color: #fff;
        background-color: #9F0B56 !important;
    }

.checkActive .hdtb-mitem {
    height: 44px;
    padding-top: 10px;
    padding-bottom: 10px;
}

    .checkActive .hdtb-mitem.active {
        border: 1px solid #00447A !important;
        color: #fff !important;
        background-color: #00447A !important;
    }

@media (min-width: 768px) {
    .checkActive .hdtb-mitem {
        height: 64px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        /*        padding-top: 20px;
        padding-bottom: 20px;
*/
    }
}

.nav-pills-xs {
    width: 341px !important;
    border: 2px;
    margin: 0 auto;
}

.col-centerd {
    display: inline-flex !important;
    width: auto !important;
}

.nav-pills > li.col-centerd {
    float: inherit;
    padding: 0 !important;
    margin: 0 !important;
}


.nav-pills > li.active > a {
    color: #fff;
    background-color: #337ab7;
}

    .nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover {
        color: #fff;
        background-color: #337ab7;
    }


/*@media only screen and (max-width : 767px) {
    .fixed-psition-project {
        position: fixed !important;
        z-index: 65;
        top: 56px;
        left: 0;
        width: 100%;
        -webkit-box-shadow: 0px 25px 30px -14px rgba(0,0,0,.4);
        -moz-box-shadow: 0px 25px 30px -14px rgba(0,0,0,.4);
        box-shadow: 0px 25px 30px -14px rgba(0,0,0,.4);
    }

    .fixed-projects-cards-padding {
        padding-top: 130px;
    }
}*/

.donor-merge {
    height: 112px;
}

    .donor-merge > input {
        width: 20px;
        height: 20px;
        margin-top: 26px !important;
    }

    .donor-merge .profile-photo {
        width: 72px;
        height: 72px;
        padding: 23px 25px;
    }

    .donor-merge .separate {
        width: 1px;
        height: 72px;
    }

.profile-athar-icon {
    background-image: url("");
    background-size: contain;
    height: 18px;
    margin: 9px 10px 0 0;
    background-repeat: no-repeat;
}

@media only screen and (max-width : 767px) {
    .nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover {
        color: #337ab7;
        background-color: #fff;
        border-bottom: 2px solid #337ab7;
        border-radius: 0px;
    }

    .float-left-xs {
        float: left !important;
    }

    .tabs-project {
        border: 0px solid #707070;
        color: #2D2D2D;
        background-color: transparent !important;
        margin: 0;
        float: right
    }

    .QC_gray-bg-light-xs {
        background: #F3F3F3;
        background-color: #F3F3F3;
    }

    .nav-pills-xs {
        border: 0px !important;
        width: 100% !important;
        background-color: #fff !important;
    }

    .donor-merge {
        height: 181px;
    }

        .donor-merge > input {
            margin-top: 19px !important;
        }

        .donor-merge .profile-photo {
            width: 58px;
            height: 58px;
            padding: 17px 19px;
        }

        .donor-merge .separate {
            width: 1px;
            height: 43px;
        }

        .donor-merge .line-height-50 {
            line-height: 40px !important;
        }
}

.filterdonation-section select {
    /*width: 100%;
    border: 1px solid #d9d9d9;
    color: #2D2D2D;
    height: 40px;
    margin: 8px 0px;*/
    background-color: #fff;
    text-indent: 0.01px;
    background-image: url("");
    background-size: 10PX;
    padding-left: 10px;
}

    .filterdonation-section select option {
        background-color: #fff;
        border: none;
        margin: 10px 0px;
    }

    .filterdonation-section select[disabled] {
        background-color: #CCC;
        color: #333;
        cursor: not-allowed;
    }

.Search-input-filter {
    border: 1px solid #FFF;
    color: #FFF;
    text-align: left;
    background-color: transparent;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
    padding: 0 20px;
}

    .Search-input-filter::placeholder {
        color: white;
        /*opacity: 1;*/ /* Firefox */
    }

    .Search-input-filter:-ms-input-placeholder { /* Internet Explorer 10-11 */
        color: white;
    }

    .Search-input-filter:-ms-input-placeholder { /* Microsoft Edge */
        color: white;
    }

#horizontalSearchBar .input-icon {
    color: #FFF !important;
}

.input-icon {
    font-size: 16px;
    font-weight: normal;
    line-height: 1;
    color: #9C9C9C;
    background-color: transparent;
    border: none;
    border-radius: 4px;
    position: absolute;
    z-index: 10;
    pointer-events: none;
    left: 20px;
    top: 26%;
    margin: 0 8px;
}

.input-group-addon.input-icon {
    right: 5px;
    left: auto;
    top: 10px;
}

/*.bar-amount > .total-amount > .border-top-label > label, .bar-amount > .total-amount > .border-top-label > label > input {
    height: 30px;
    line-height: 30px;
}*/

.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
    font-family: inherit;
}

.white-color {
    color: #FFF;
}

/******************GlyphIcon********************/
.gi-2x {
    font-size: 2em;
}

.gi-3x {
    font-size: 3em;
}

.gi-4x {
    font-size: 4em;
}

.gi-5x {
    font-size: 5em;
}
/******************GlyphIcon END********************/

/******************OTHERS********************/
.divider-vertical {
    display: inline-block;
    background-color: #525252;
    padding: 0;
    width: 1px;
    margin: 0 10px;
    height: 20px
}

    .divider-vertical.divider-vertical-white {
        background-color: #FFF !important;
    }
/***Top Menu***/
.menuBasket {
    max-width: 266px;
}

.newloginnavbar {
    height: 34px;
    margin-left: 5px;
    padding: 0;
    border-bottom: 1px solid #91908F;
}

    .newloginnavbar .loginMenuLi {
        list-style: none;
        height: 34px;
        float: right;
        padding: 0px 4px;
        margin-top: 0px;
    }

    .newloginnavbar .LoginMenuA {
        padding: 0px 10px 0px 10px;
        line-height: 34px;
        color: #b4b4b4;
        font-size: 12px;
        /*max-width: 80px;*/
        overflow: hidden;
        height: 28px;
    }

        .newloginnavbar .LoginMenuA:hover {
            color: #fff;
        }

select.currency-list {
    height: 30px;
    border: none;
    width: 160px;
    font-size: 15px;
}

    select.currency-list option {
        border: none;
        text-align: left;
    }

.newloginnavbar .divider-vertical1 {
    background-color: #FFF;
    height: 18px;
    padding: 0;
    width: 1px;
    margin: 8px 10px;
}

.none-underline {
    text-decoration: none !important;
}

/***Top Menu END***/
/****************NetPromqater*****************/
#wootric-modal .wootric-beacon-parent {
    -moz-box-shadow: 0 0 28px rgba(0,0,0,.1);
    background-color: #ffffff;
    border-color: rgba(0,0,0,.16) !important;
    box-shadow: 0 0 28px rgba(0,0,0,.1);
    color: #fff;
    text-shadow: 0 0 0 transparent, 0 1px 1px white;
}

div#wootric-fullscore {
    direction: ltr !important;
}

#wootric-modal ul {
    display: inline-block;
    font-size: 0;
    margin: 0px 0rem;
    padding: 0;
}

#wootric-modal li {
    border: 0 solid rgba(0,0,0,.2);
    color: #f9f9f9;
    background-color: #004c84 !important;
    font-family: arial;
    font-size: 18px;
    font-weight: bold;
    margin: 0 4px;
    height: 45px;
    width: 45px;
    line-height: 46px;
}

#wootric-modal li {
    background: #525252;
    color: rgba(255,255,255,0.75) !important;
}

    #wootric-modal li:focus, #wootric-modal li:hover, #wootric-modal li.selected, #wootric-modal li.selected:hover {
        background-color: #9F0B56 !important;
        color: white;
        text-shadow: 0 0 0 transparent, 0 -1px 1px rgba(0,0,0,0.5);
    }

    #wootric-modal li:last-child {
        border: 0 solid rgba(0,0,0,.2);
        color: #f9f9f9;
        background-color: #004c84 !important;
        font-family: arial;
        font-size: 18px;
        font-weight: bold;
        margin: 0 4px;
        height: 45px;
        width: 45px;
        line-height: 46px;
    }

#wootric-modal .wootric-beacon-parent #wootric-question p {
    color: #666;
    max-width: none;
}

#wootric-modal label {
    color: #666;
}
/************Ramadan campaing*******************/

.mega-campaing {
    /*bottom: 25px;*/
    position: absolute;
    color: #fff;
}

.mega-layer-black {
    background-color: rgba(0, 0, 0, 0.11);
    width: 100%;
    height: 100%;
    position: absolute;
}

.video-titel-Ramadana {
    top: 66%;
}
/********OWL-CAROUSEL************/
.owl-wrapper {
    float: left;
}

.owl-carousel .owl-wrapper-outer.autoHeight {
    height: auto !important;
    margin-bottom: 30px;
}

#CauseListMainDiv.buttonslidercarsol .owl-wrapper-outer {
    display: inline-block;
    max-height: inherit;
    min-height: 425px;
}

    #CauseListMainDiv.buttonslidercarsol .owl-wrapper-outer.latest-box .media {
        max-width: 100%;
        position: relative;
        max-height: inherit;
        margin-bottom: 10px;
        height: auto;
        background-color: #eee;
        object-fit: cover;
    }

/* 
 * 	Core Owl Carousel CSS File
 *	v1.3.2
 */


/* Ramadan */
.projects2021.owl-carousel.owl-theme .owl-item {
    margin-right: -90px;
}

@media (max-width: 1199px) {
    .projects2021.owl-carousel.owl-theme .owl-item {
        margin-right: -90px;
    }
}
/*OWN STYLE END*/
/********OWL-CAROUSEL END************/
@media (max-width: 575px) {
    .ramadan-logo-2022 {
        max-width: 100%;
    }
}
/********FAST DONATION************/
.side-action {
    width: 154px;
    position: absolute;
    top: 15px;
    left: 100%;
}

.side-btn-arrow {
    background-image: url("side-btn-arrow-en.png");
    background-repeat: no-repeat;
    background-position: 64% 50%;
    display: block;
    height: 80px;
    background-color: #9F0B56;
    border-radius: 0 4px 4px 0;
    border: none;
    float: right;
    position: absolute;
    margin-left: 90px;
    font-size: 10px;
    -webkit-box-shadow: -3px 0px 5px 0px rgba(0,0,0,0.52);
    -moz-box-shadow: -3px 0px 5px 0px rgba(0,0,0,0.52);
    box-shadow: -3px 0px 5px 0px rgba(0,0,0,0.52);
    /*left: 30px;
    right: auto;*/
}

.navbar-fixed-bottom, .navbar-fixed-top {
    z-index: 99;
}

.side-btn {
    height: 80px;
    background-image: url("fast-donation-side-btn.png");
    background-position: 50% 20%;
    background-repeat: no-repeat;
    background-color: #9F0B56;
    color: #FFF;
    border: none;
    line-height: 14px;
    float: left;
    padding-top: 36px;
    padding-left: 0;
    padding-right: 0;
    -webkit-box-shadow: 0px 3px 6px 0 rgba(0,0,0,.3);
    -moz-box-shadow: 0px 3px 6px 0 rgba(0,0,0,.3);
    box-shadow: 0px 3px 6px 0 rgba(0,0,0,.3);
}

.side-btn-floated {
    z-index: 75;
    position: fixed;
    bottom: 20px;
    left: 20px;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    padding-top: 32px;
    line-height: 15px;
    background-color: #9F0B56;
    font-size: 12px;
    -webkit-box-shadow: 0px 3px 6px 0 rgba(0,0,0,.3);
    -moz-box-shadow: 0px 3px 6px 0 rgba(0,0,0,.3);
    box-shadow: 0px 3px 6px 0 rgba(0,0,0,.3);
    transition: all ease-in-out 0.5s;
    animation: bot-to-top .25s ease-out;
}

.side-btn-hover {
    height: 80px;
    background-image: none;
    background-position: 50% 20%;
    background-repeat: no-repeat;
    background-color: #fff;
    color: #590630;
    border: none;
    line-height: 14px;
    float: left;
    padding-left: 0;
    padding-right: 0;
    -webkit-box-shadow: 0px 3px 6px 0 rgba(0,0,0,.3);
    -moz-box-shadow: 0px 3px 6px 0 rgba(0,0,0,.3);
    box-shadow: 0px 3px 6px 0 rgba(0,0,0,.3);
}


.side-btn-floated-hover {
    z-index: 10000;
    position: fixed;
    bottom: 20px;
    left: 20px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding-top: 30px;
    line-height: 15px;
    font-size: 12px;
    -webkit-box-shadow: 0px 3px 6px 0 rgba(0,0,0,.3);
    -moz-box-shadow: 0px 3px 6px 0 rgba(0,0,0,.3);
    box-shadow: 0px 3px 6px 0 rgba(0,0,0,.3);
    transition: all ease-in-out 0.5s;
    animation: bot-to-top .25s ease-out;
}

.fast-donation {
    float: left;
    list-style: outside none none;
    max-width: 330px;
    z-index: 999;
    position: fixed;
    top: calc(50% - 235px);
    -webkit-box-shadow: 0px 0px 39px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 39px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 39px 0px rgba(0,0,0,0.5);
}

#FastDonationTab .btn-default, #FastDonationTabss .btn-default, #fast-donation-style .btn-default {
    font-weight: 500;
    color: #FFF;
    background-color: #00447A;
    border-color: transparent;
}

#FastDonationTab .btn-default, .radio-inline + .radio-inline, .checkbox-inline + .checkbox-inline, label, #FastDonationTabss .btn-default, .radio-inline + .radio-inline, .checkbox-inline + .checkbox-inline, label, #fast-donation-style .btn-default, .radio-inline + .radio-inline, .checkbox-inline + .checkbox-inline, label {
    display: inline-flex;
    margin-left: 0;
    margin: 0 0 10px 0;
}

#FastDonationTab .radio-inline, .checkbox-inline, #fastDonationTabss .radio-inline, .checkbox-inline, #fast-donation-style .radio-inline, .checkbox-inline {
    padding-left: 30px;
}

#FastDonationTab .tab-content, #FastDonationTabss .tab-content {
    margin-bottom: 15px;
    margin-top: 0;
    background: #fff;
}

#FastDonationTab .form-control, #FastDonationTabss .form-control, #fast-donation-style .form-control {
    display: block;
    height: 48px;
    padding: 7px;
    font-size: 11px;
    line-height: 30px;
    color: #555;
    background-color: #f6f6f6;
    border: 1px solid #D2D2D2;
    -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0);
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0);
}

#FastDonationTab a p, #FastDonationTabss a p {
    color: #888;
    text-decoration: underline;
}

/********Campaign Donation Packages********/
.tab.curved-tab {
    padding: 0 4px;
    position: static;
}

    .tab.curved-tab:first-child {
        padding-left: 0;
    }

    .tab.curved-tab:last-child {
        padding-right: 0;
    }

    .tab.curved-tab [type="radio"]:checked ~ label:before, .tab.curved-tab [type="radio"]:checked ~ label:after {
        content: '';
        width: 15.28px;
        height: 23.37px;
        position: absolute;
        bottom: 4px;
    }

    .tab.curved-tab [type="radio"]:checked ~ label:before {
        background-image: url("");
        left: -15px;
    }

    .tab.curved-tab [type="radio"]:checked ~ label:after {
        background-image: url("");
        right: -15px;
    }

    .tab.curved-tab:first-child [type="radio"]:checked ~ label:before {
        content: none;
    }

    .tab.curved-tab:last-child [type="radio"]:checked ~ label:after {
        content: none;
    }

@media(min-width: 991px) {
    .tab.curved-tab {
        padding: 0 15px;
        position: relative;
    }
}
/********Campaign Donation Packages End********/
/********END FAST DONATION************/
.circle {
    border-radius: 50%;
    margin: 6px 10%;
}

.btn-number.gray-number, .btn-number-disabled.gray-number {
    width: 100%;
    height: 32px;
    line-height: 32px;
    color: #fff;
    padding: 0 10px;
    /*Override Bootstrap*/
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.btn-number.gray-number {
    background-color: #B4B4B4;
}

.btn-number-disabled.gray-number {
    background-color: #EEE;
    color: #B4B4B4;
}

.projects-types-max-height p {
    height: 60px;
    overflow: hidden;
}

.day-10X10 {
    background-image: url("");
    width: 92px;
    height: 102px;
    margin-left: auto;
    margin-right: auto;
}

.Ramadan-day {
    color: #00447A;
    font-size: 30px;
    height: 72px;
    padding: 15px 0;
    font-family: Arial;
    font-weight: bold;
}

.Ramadan-10X10 {
    height: 30px;
    color: white;
    text-align: center;
    padding: 5px;
}

.dall-social-share {
    background-image: url("");
    height: 42px;
    width: 42px;
    background-repeat: no-repeat;
    position: absolute;
    z-index: 20;
}

.share-campaign-posation {
    right: 36px;
    top: 180px;
}

.ramadan-menu > li > a {
    height: 42px;
    line-height: 40px;
    border-bottom: 1px solid #EEE;
    padding: 0 10px;
    border-radius: 0;
}

.donation-package-description {
    line-height: normal;
    /*height: 45px;
    max-height: 44px;*/
    overflow: hidden;
    text-overflow: ellipsis;
}

.ramadan-card-scroll {
    height: 220px;
    max-height: 220px;
    overflow-y: scroll;
    overflow-x: hidden;
    margin-top: 5px;
    font-size: 12px;
}

.campaignFastDonation {
    background-color: #FFF;
    min-width: 320PX !important;
    max-width: 360PX !important;
    width: auto !important;
}
/*Social Share*/
.colm-mypoint {
    border-bottom: 1px solid #eee;
    line-height: 50px;
    list-style: none;
    font-size: 12px;
}

    .colm-mypoint:hover {
        background-color: #590630;
        color: #fff;
    }

.colm-mypoint-active {
    background-color: #590630;
    color: #fff;
}

    .colm-mypoint-active:active {
        color: #fff !important;
    }

    .colm-mypoint-active:after {
        color: #fff !important;
    }

.electronic-books-img {
    object-fit: cover;
    height: 150px;
    width: 100%;
}
/******************************************* NEWS **************************************/
.titleDiv {
    padding: 0 30px;
    margin: 0px;
    height: 55px;
    line-height: 60px;
    right: auto;
    bottom: auto;
    word-wrap: break-word;
    color: white;
    -webkit-transform: translateZ(0px);
    width: 100% !important;
    position: relative !important;
    background-color: rgba(0, 0, 0, 0.7) !important;
    top: 70% !important;
}

.sloganDiv {
    padding: 0 30px;
    margin: 0px;
    height: 100px !important;
    right: auto;
    bottom: auto;
    word-wrap: break-word;
    color: white;
    -webkit-transform: translateZ(0px);
    width: 100% !important;
    position: relative !important;
    background-color: rgba(0, 0, 0, 0.7) !important;
    top: 70% !important;
}
/******************************************* NEWS END **************************************/
/*Social Share*/
.qcg-menu .badge {
    background-color: #fdb933 !important;
    top: -7px;
    left: 10px;
    color: black;
}

.badge {
    background: rgb(255, 51, 90);
    position: relative;
    top: -33px;
    left: 7px;
    padding: 4px 3px 3px 2px;
    border-radius: 100%;
    font-size: 9px;
    font-weight: normal;
    width: 16px;
    height: 16px;
    overflow: hidden;
    float: right;
    text-align: center;
}

    .badge.badge-mobile {
        top: -8px !important;
        left: -8px !important;
    }

.checkbox-inline + .checkbox-inline, .radio-inline + .radio-inline {
    margin-top: 0;
    margin-left: 0;
}

.bar-amount {
    border-top: 1px solid #e4e4e4;
    background-color: #fff;
    margin-top: 10px;
    height: 110px;
}

.bar-amount-2 {
    border-top: none !important;
    margin-top: 0 !important;
    height: 60px !important;
}


.bar-amount-3 {
    border-top: 0px solid #b4b4b4;
    background-color: #fff;
    margin-top: 20px;
    height: 157px;
}

.sponsorships-details-height {
    height: 85px;
    overflow: hidden;
}

.paymentIcon {
    background-color: #00447A;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 10px;
    cursor: pointer;
}

    .paymentIcon label {
        height: 70px;
        cursor: pointer;
    }

.search-icon {
    line-height: 36px;
    padding: 0 9px;
    font-size: 18px;
    color: #fff;
}

.radius-30-left {
    border-radius: 30px 0 0 30px;
}

.radius-30-right {
    border-radius: 0 30px 30px 0;
}
/****************************Thwap**************************************/
.completed-donation {
    background-color: #54bfa1;
    padding: 0;
}
/************************* RAMADAN-SCROLL-ICONS ****************************/
.ramadan-scroll-icons {
    list-style: outside none none;
    position: fixed;
    top: 20%;
    left: 50px;
    z-index: 995;
}

    .ramadan-scroll-icons ul li {
        list-style: none;
    }

        .ramadan-scroll-icons ul li a {
            width: 56px;
            height: 56px;
            line-height: 34px;
            text-align: center;
            margin: 5px;
            padding: 10px 15px;
            transition: all 450ms cubic-bezier(0.75, 0.75, 0.75, 0.75) 0s;
        }

            .ramadan-scroll-icons ul li a:hover {
                transition: all 450ms cubic-bezier(0.75, 0.75, 0.75, 0.75) 0s;
                -ms-transform: scale(1.2, 1.2);
                -webkit-transform: scale(1.2, 1.2);
                transform: scale(1.2, 1.2);
            }

            .ramadan-scroll-icons ul li a.active {
                background-color: #9F0B56 !important;
                background: #9F0B56 !important;
            }

                .ramadan-scroll-icons ul li a.active svg path {
                    stroke: #fff;
                    fill: #fff;
                }

.program-scroll-icons {
    right: auto;
    left: 25px;
    top: 25%;
    z-index: 995;
    list-style: outside none none;
    position: fixed;
}


    .program-scroll-icons ul li {
        list-style: none;
    }

        .program-scroll-icons ul li a {
            width: 56px;
            height: 56px;
            line-height: 34px;
            text-align: center;
            margin: 5px;
            padding: 10px 15px;
            transition: all 450ms cubic-bezier(0.75, 0.75, 0.75, 0.75) 0s;
        }

            .program-scroll-icons ul li a:hover {
                transition: all 450ms cubic-bezier(0.75, 0.75, 0.75, 0.75) 0s;
                -ms-transform: scale(1.2, 1.2);
                -webkit-transform: scale(1.2, 1.2);
                transform: scale(1.2, 1.2);
            }

            .program-scroll-icons ul li a.active {
                background-color: #9F0B56 !important;
                background: #9F0B56 !important;
            }

                .program-scroll-icons ul li a.active svg path {
                    stroke: #fff;
                    fill: #fff;
                }

.drop-shadow-red {
    -webkit-box-shadow: 0px 4px 20px 4px rgba(227,3,111,0.19);
    -moz-box-shadow: 0px 4px 20px 4px rgba(227,3,111,0.19);
    box-shadow: 0px 4px 20px 4px rgba(227,3,111,0.19);
}
/************************* RAMADAN-SCROLL-ICONS END ****************************/
/*.btn-group > .btn:first-child:not(:last-child), .btn-group > .dropdown-toggle:not(:last-child) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.btn-group > .btn:last-child:not(:first-child):not(.dropdown-toggle) {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    margin-right: 1px;
}*/
/*************************standingorder-fast****************************/
.standingorderFastDonation {
    min-width: 330PX;
    max-width: 330PX;
}
/*.fastStandingorder {
    position: absolute;
    top: 15%;
    left: 15%;
}*/
/*.ghaith-banner{
    height: 840px;
}*/
.gold-font {
    color: #d4dab4;
}

.all-video {
    background-color: #fff;
    padding: 10px;
    height: 270px !important;
    overflow-y: scroll;
}

.ghaith-inner-banner > img {
    width: 100%;
    height: 800px;
    object-fit: cover;
}

.ghaith-fast-donation {
    position: absolute;
    top: 15%;
    left: 5%;
    z-index: 10;
}

.bar-below-ghaith {
    background-color: rgba(35, 35, 35, 0.63);
    position: absolute;
    padding: 20px;
    overflow: hidden;
    border-top: 0px #fff solid;
    top: 600px;
}
/*.annual-report-statics-height {
    height: 520px;
    max-height: 520px;
    overflow: hidden;
}*/
.monthely-once {
    height: 22px;
    overflow: hidden;
}

    .monthely-once > label, .monthely-once > label > input {
        height: 20px;
        line-height: 24px;
    }

.countryImg {
    width: 24px !important;
    height: 18px !important;
    border-radius: 4px;
}

.Visa_Block, .Mobile_Block {
    border-radius: 8px;
    color: #fff;
    text-align: center;
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,.27);
    cursor: pointer;
    width: 110px;
    height: 122px;
    overflow: hidden;
    padding: 30px 10px 20px 10px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}

.share-icon-2 {
    background-image: url("");
    height: 35px;
    width: 186px;
    z-index: 10;
    -webkit-border-bottom-left-radius: 8px;
    -moz-border-radius-bottomleft: 8px;
    border-bottom-left-radius: 8px;
    -webkit-border-bottom-right-radius: 8px;
    -moz-border-radius-bottomright: 8px;
    border-bottom-right-radius: 8px;
}
/*************************standingorder-fast END****************************/
.img-brightness-80 {
    filter: brightness(80%);
}

.event-img {
    object-fit: cover;
    width: 100%;
    min-height: 140px;
    max-height: 140px;
}

.Mobile-apps-details-inner-back {
    background-image: url("");
    background-size: inherit;
    background-repeat: no-repeat;
    width: 100%;
    min-height: 610px;
    background-attachment: fixed;
    background-position: top center;
}

.bg-gradient {
    background-image: url("");
    background-size: inherit;
    background-repeat: no-repeat;
    /*background-attachment: fixed;*/
    background-position: top center;
}

.full-width {
    width: 100%;
}

#Success stories .success-back {
    background: rgba(17,213,226,1);
    background: -moz-linear-gradient(top, rgba(17,213,226,1) 0%, rgba(51,147,208,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(17,213,226,1)), color-stop(100%, rgba(51,147,208,1)));
    background: -webkit-linear-gradient(top, rgba(17,213,226,1) 0%, rgba(51,147,208,1) 100%);
    background: -o-linear-gradient(top, rgba(17,213,226,1) 0%, rgba(51,147,208,1) 100%);
    background: linear-gradient(to bottom, rgba(17,213,226,1) 0%, rgba(51,147,208,1) 100%);
}

#tf-testimonials .overlay {
    background: -moz-linear-gradient(top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.73) 17%, rgba(0,0,0,0.66) 35%, rgba(0,0,0,0.55) 62%, rgba(0,0,0,0.4) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.8)), color-stop(17%,rgba(0,0,0,0.73)), color-stop(35%,rgba(0,0,0,0.66)), color-stop(62%,rgba(0,0,0,0.55)), color-stop(100%,rgba(0,0,0,0.4))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Opera 11.10+ */
    background: linear-gradient(to bottom, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* W3C */
    padding: 80px 0;
    background-attachment: fixed;
}

#testimonial {
    padding: 30px 0;
}

    #testimonial .item {
        display: block;
        width: 100%;
        height: auto;
    }

        #testimonial .item p {
            font-weight: 400;
            margin: 30px 0;
            color: #d1d1d1;
        }

.copyright {
    background-color: #000;
    color: #fff;
    padding: 50px 20px;
    overflow: auto;
    display: block;
}

.min-width-240 {
    min-width: 265px;
}
/******************LTR********************/
.QC_ltr-common {
    direction: ltr;
}

.QC_rtl-common {
    direction: rtl;
}

.QC_ltr {
    direction: ltr;
}

.QC_rtl {
    direction: rtl;
}

.float-left, .float-left-common {
    float: left !important;
}

.float-right, .float-right-common {
    float: right !important;
}

.left-0 {
    left: 0;
}

.right-0 {
    right: 0;
}

.left-right-0 {
    left: 0;
    right: 0;
}

.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

.text-center {
    text-align: center !important;
}

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

.overflow-scroll-x {
    overflow-x: scroll !important;
    overflow-y: hidden !important;
}

.overflow-scroll-y {
    overflow-y: scroll !important;
    overflow-x: hidden !important;
}

@media (max-width: 767px) {
    .left-0-sm {
        left: 0;
    }
}

@media (max-width: 575px) {
    .left-0-xs {
        left: 0;
    }
}
/******************LTR END********************/
btn, .btn, .btn-default {
    height: 40px;
    line-height: 40px;
    padding: 0 10px;
    text-align: center;
    font-size: 12px;
}
/**********************************************************/
.plus-icon {
    text-align: center;
    width: 20px;
    height: 20px;
    line-height: 20px;
    color: #FFF;
    font-weight: bold;
    font-size: 14px;
    border-radius: 50%;
    background-color: #00447A;
}

/******************Fonts********************/
.font-80-120 {
    font-size: 120px;
}

@media (max-width: 767px) {
    .font-80-120 {
        font-size: 80px;
    }
}
/******************Fonts END********************/

/******************Margin********************/
.ml-n70 {
    margin-left: -70px;
}

@media(max-width: 575px) {
    .ml-xs-n15 {
        margin-left: -15px;
    }

    .ml-xs-n25 {
        margin-left: -25px;
    }
}

@media (min-width: 1920px) {
    .ml-xl-n70 {
        margin-left: -70px;
    }
}

.margin-none {
    margin-left: 0 !important;
    margin-top: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    margin: 0 !important;
}

.margin-0-h {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.margin-0-right {
    margin-right: 0px !important;
}

.margin-0-left {
    margin-left: 0px !important;
}

.margin-0-v {
    margin-bottom: 0 !important;
    margin-top: 0 !important;
}

.margin-5-v {
    margin-bottom: 5px !important;
    margin-top: 5px !important;
}

.margin-8-v {
    margin-bottom: 8px !important;
    margin-top: 8px !important;
}

.margin-9-v {
    margin-top: 9px;
    margin-bottom: 9px;
}

.margin-10-v {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

.margin-15-v {
    margin-top: 15px;
    margin-bottom: 15px;
}

.margin-20-v {
    margin-top: 20px;
    margin-bottom: 20px;
}

.margin-25-v {
    margin-top: 25px;
    margin-bottom: 25px;
}

.margin-30-v {
    margin-top: 30px;
    margin-bottom: 30px;
}

.margin-50-v {
    margin-top: 50px;
    margin-bottom: 50px;
}

.margin-60-v {
    margin-top: 60px;
    margin-bottom: 60px;
}

.margin-70-v {
    margin-top: 70px;
    margin-bottom: 70px;
}

.margin-80-v {
    margin-top: 80px;
    margin-bottom: 80px;
}

.margin-90-bottom {
    margin-bottom: 90px;
}

.margin-90-v {
    margin-top: 90px;
    margin-bottom: 90px;
}

.margin-100-v {
    margin-top: 100px;
    margin-bottom: 100px;
}

.margin-5-h {
    margin-left: 5px !important;
    margin-right: 5px !important;
}

.margin-10-h {
    margin-left: 10px !important;
    margin-right: 10px !important;
}

.margin-15-h {
    margin-left: 15px !important;
    margin-right: 15px !important;
}

.margin-20-h {
    margin-left: 20px !important;
    margin-right: 20px !important;
}

.margin-30-h {
    margin-left: 30px !important;
    margin-right: 30px !important;
}

.margin-40-h {
    margin-left: 40px !important;
    margin-right: 40px !important;
}

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

.margin-70-bottom {
    margin-bottom: 70px;
}

.margin-2-right {
    margin-right: 2px !important;
}

.margin-2-left {
    margin-left: 2px !important;
}

.margin-10-right {
    margin-right: 10px !important;
}

.margin-10-left {
    margin-left: 10px !important;
}

.margin-20-left {
    margin-left: 20px !important;
}

.margin-5-right {
    margin-right: 5px !important;
}

.margin-5-left {
    margin-left: 5px !important;
}

.margin-15-right {
    margin-right: 15px !important;
}

.margin-15-left {
    margin-left: 15px !important;
}

.margin-20-right {
    margin-right: 20px !important;
}

.margin-20-left {
    margin-left: 20px !important;
}

.margin-20-right {
    margin-right: 30px !important;
}

.margin-30-left {
    margin-left: 30px !important;
}

.margin-0-top {
    margin-top: 0 !important;
}

.margin-5-top {
    margin-top: 5px !important;
}

.margin-10-top {
    margin-top: 10px !important;
}

.margin-15-top {
    margin-top: 15px !important;
}

.margin-20-top {
    margin-top: 20px;
}

.margin-24-top {
    margin-top: 24px;
}

.margin-25-top {
    margin-top: 25px;
}

.margin-30-top {
    margin-top: 30px;
}

.margin-40-top {
    margin-top: 40px;
}

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

.margin-60-top {
    margin-top: 60px;
}

.margin-350-minus-top {
    margin-top: -350px;
}

.margin-450-minus-top {
    margin-top: -450px;
}

.margin-500-minus-top {
    margin-top: -500px;
}

.margin-650-minus-top {
    margin-top: -650px;
}

.margin-100-mines-top {
    margin-top: -100px;
}

.margin-150-mines-top {
    margin-top: -150px;
}

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

.margin-180-top {
    margin-top: 180px;
}

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

.margin-5-bottom {
    margin-bottom: 5px !important;
}

.margin-10-bottom {
    margin-bottom: 10px !important;
}

.margin-15-bottom {
    margin-bottom: 15px !important;
}

.margin-20-bottom {
    margin-bottom: 20px;
}

.margin-30-bottom {
    margin-bottom: 30px !important;
}

.margin-40-bottom {
    margin-bottom: 40px !important;
}

.margin-50-bottom {
    margin-bottom: 50px;
}

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

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

.margin-100-bottom {
    margin-bottom: 100px;
}

.margin-140-bottom {
    margin-bottom: 140px;
}

.margin-150-bottom {
    margin-bottom: 150px;
}

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

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

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

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

.margin-264-top {
    margin-top: 264px;
}

.margin-160-bottom {
    margin-bottom: 160px;
}

.margin-160-top {
    margin-top: 160px;
}

.margin-160-v {
    margin-bottom: 160px;
    margin-top: 160px;
}

.margin-25-left {
    margin-left: -25px;
}

.margin-250-top {
    margin-top: 250px;
}

.margin-auto {
    margin-left: auto !important;
    margin-right: auto !important;
}

margin-0-top-xs {
    margin-top: 0px;
}

.margin-96-top-xs {
    margin-top: 96px;
}

.margin-70-top-xs {
    margin-top: 70px;
}

.margin-116-top-xs {
    margin-top: 116px;
}

.margin-80-mines {
    margin-top: -80px;
}

.margin-42-mines {
    margin-top: -42px;
}

.margin-75-top {
    margin-top: 75px;
}

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

.margin-125-top {
    margin-top: 125px;
}

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

.margain-5v-30h {
    margin: 5px 30px;
}

.margin-top-mines-10 {
    margin-top: -10px;
}

.margin-top-mines-15 {
    margin-top: -15px;
}

.margin-top-mines-20 {
    margin-top: -20px;
}

.margin-top-mines-30 {
    margin-top: -30px;
}

.margin-top-mines-40 {
    margin-top: -40px;
}

.margin-top-mines-50 {
    margin-top: -50px;
}

.margin-top-mines-60 {
    margin-top: -60px;
}

.margin-top-mines-70 {
    margin-top: -70px;
}

.margin-top-mines-80 {
    margin-top: -80px;
}

.margin-top-mines-90 {
    margin-top: -90px;
}

.margin-top-mines-100 {
    margin-top: -100px;
}

.margin-top-mines-120 {
    margin-top: -120px;
}

.margin-top-mines-130 {
    margin-top: -130px;
}

.margin-top-mines-150 {
    margin-top: -150px;
}

.margin-top-mines-170 {
    margin-top: -170px;
}

.margin-top-mines-190 {
    margin-top: -190px;
}

.margin-top-mines-200 {
    margin-top: -200px;
}

.margin-top-mines-220 {
    margin-top: -220px;
}

.margin-top-mines-240 {
    margin-top: -240px;
}

.margin-top-mines-260 {
    margin-top: -260px;
}

.margin-130-bottom {
    margin-bottom: 130px;
}

@media (max-width: 767px) {
    .margin-10-right-xs {
        margin-right: 10px !important;
    }
}
/******************Margin END********************/
/******************Padding********************/
.QC_padding-section {
    padding: 40px 0;
}

@media only screen and (min-width : 992px) {
    .QC_padding-section {
        padding: 70px 0;
    }
}

.gap-5 {
    gap: 5px;
}

.gap-10 {
    gap: 10px;
}

.gap-15 {
    gap: 15px;
}

.gap-20 {
    gap: 20px;
}

.padding-none {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.padding-0-v {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.padding-0-bottom {
    padding-bottom: 0 !important;
}

.padding-0-top {
    padding-top: 0 !important;
}

.padding-5-v {
    padding-bottom: 5px;
    padding-top: 5px;
}

.padding-10-v {
    padding-bottom: 10px;
    padding-top: 10px;
}

.padding-15-v {
    padding-bottom: 15px !important;
    padding-top: 15px !important;
}

.padding-20-v {
    padding-bottom: 20px;
    padding-top: 20px;
}

.padding-30-v {
    padding-bottom: 30px;
    padding-top: 30px;
}

.padding-40-v {
    padding-bottom: 40px;
    padding-top: 40px;
}

.padding-50-v {
    padding-bottom: 50px;
    padding-top: 50px;
}

.padding-60-v {
    padding-bottom: 60px;
    padding-top: 60px;
}

.padding-45-v {
    padding-bottom: 45px;
    padding-top: 45px;
}

.padding-90-v {
    padding-top: 90px;
    padding-bottom: 90px;
}

.padding-120-v {
    padding-top: 120px;
    padding-bottom: 120px;
}

.padding-10-h {
    padding-left: 10px;
    padding-right: 10px;
}

.padding-12-h {
    padding-left: 12px;
    padding-right: 12px;
}

.padding-15-h {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

.padding-20-h {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.padding-30-h {
    padding-left: 30px !important;
    padding-right: 30px !important;
}

.padding-40-h {
    padding-left: 40px !important;
    padding-right: 40px !important;
}

.padding-50-h {
    padding-left: 50px !important;
    padding-right: 50px !important;
}

.padding-60-h {
    padding-left: 60px !important;
    padding-right: 60px !important;
}

.padding-70-h {
    padding-left: 70px !important;
    padding-right: 70px !important;
}

.padding-80-h {
    padding-left: 80px !important;
    padding-right: 80px !important;
}

.padding-90-h {
    padding-left: 90px !important;
    padding-right: 90px !important;
}

.padding-100-h {
    padding-left: 100px !important;
    padding-right: 100px !important;
}

.padding-120-h {
    padding-left: 120px;
    padding-right: 120px;
}

.padding-70-v {
    padding-bottom: 70px !important;
    padding-top: 70px !important;
}

.padding-h {
    padding-left: 15%;
    padding-right: 15%;
}

.padding-5-top {
    padding-top: 5px;
}

.padding-10-top {
    padding-top: 10px;
}

.padding-15-top {
    padding-top: 15px !important;
}

.padding-20-top {
    padding-top: 20px !important;
}

.padding-30-top {
    padding-top: 30px;
}

.padding-40-top {
    padding-top: 40px;
}

.padding-50-top {
    padding-top: 50px !important;
}

.padding-60-top {
    padding-top: 60px;
}

.padding-70-top {
    padding-top: 70px;
}

.padding-80-top {
    padding-top: 80px !important;
}

.padding-90-top {
    padding-top: 90px;
}

.padding-100-top {
    padding-top: 100px;
}

.padding-120-top {
    padding-top: 120px;
}

.padding-5-bottom {
    padding-bottom: 5px !important;
}

.padding-10-bottom {
    padding-bottom: 10px !important;
}

.padding-15-bottom {
    padding-bottom: 15px;
}

.padding-20-bottom {
    padding-bottom: 20px !important;
}

.padding-30-bottom {
    padding-bottom: 30px;
}

.padding-40-bottom {
    padding-bottom: 40px !important;
}

.padding-50-bottom {
    padding-bottom: 50px;
}

.padding-60-bottom {
    padding-bottom: 60px !important;
}

.padding-70-bottom {
    padding-bottom: 70px;
}

.padding-100-bottom {
    padding-bottom: 100px;
}

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

.padding-150-bottom {
    padding-bottom: 150px;
}

.padding-left-none {
    padding-left: 0;
}

.padding-right-none {
    padding-right: 0;
}

.padding-none-left {
    padding-left: 0 !important;
}

.padding-none-right {
    padding-right: 0 !important;
}

.padding-less-right {
    padding-right: 5px;
}

.padding-less-left {
    padding-left: 5px !important;
}

.padding-10-left {
    padding-left: 10px !important;
}

.padding-less {
    padding-left: 5px !important;
    padding-right: 5px !important;
}

.padding-50-left {
    padding-left: 50px !important;
    padding-right: 0px !important;
}


.padding-30-left {
    padding-left: 30px !important;
    padding-right: 0px !important;
}

.padding-50-right {
    padding-left: 0px;
    padding-right: 50px;
}
/****************Padding End*************************/
/*****************Become-apartner***********/
.Become-apartner {
    background: #533a6d; /* Old browsers */
    background: -moz-linear-gradient(-45deg, #533a6d 1%, #524fa1 50%, #8b60a8 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, #533a6d 1%,#524fa1 50%,#8b60a8 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, #533a6d 1%,#524fa1 50%,#8b60a8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
/**********************************/
/**************** BORDER ******************/
.border-transparent {
    border-color: transparent !important;
}

.border-white-left {
    border-left: 1px solid #fff;
}

.border-white-right {
    border-right: 1px solid #fff;
}

.border-white {
    border-color: white;
}

.QC_border-right-gray {
    border-right: 1px solid #eee;
}

.QC_border-top-gray {
    border-top: 1px solid #eee;
}

.border-5 {
    border-width: 5px;
}

.border-10 {
    border-width: 10px;
}

.border-solid {
    border-style: solid;
}

.border-none {
    border-width: 0 !important;
}

.border-none-left {
    border-left-width: 0 !important;
}

.border-none-right {
    border-right-width: 0 !important;
}

.border-none-h {
    border-left-width: 0 !important;
    border-right-width: 0 !important;
}

.border-none-v {
    border-bottom-width: 0 !important;
    border-top-width: 0 !important;
}

.border-none-bottom {
    border-bottom-width: 0 !important;
}

.border-none-top {
    border-top-width: 0 !important;
}

.border-bottom {
    border-bottom: 1px solid #eee;
}

.border-top {
    border-top: 1px solid #eee;
}

.border-top-white {
    border-top: 1px solid #fff;
}

.border-left {
    border-left: 1px solid #eee;
}

.border-gray_light-v {
    border-top: 1px solid #DADADA;
    border-bottom: 1px solid #DADADA;
}

.border-gray_light-top {
    border-top: 1px solid #DADADA;
    border-bottom: none;
}

.border-gray_light-bottom {
    border-top: none;
    border-bottom: 1px solid #DADADA;
}

@media (min-width: 768px) {
    .border-right {
        border-right: 1px solid #eee;
    }
}

.border-1-white {
    border: 1px solid #fff;
}

.border-1-white-transperant {
    border: 1px solid rgba(193, 193, 193, 0.55);
}

.border-3-white {
    border: 3px solid #fff;
}

.border-5-white {
    border: 5px solid #fff;
}

.border-box {
    background: #FFF;
    border: 1px solid #D7DADF;
}

.border-box-dark {
    border: 1px solid #D9D9D9;
}

.border-box-black {
    border: 1px solid #000000;
}

.border-bottom-Ramadan {
    border-bottom: 1px solid #f1f1f1;
}

.border-bottem-Puerto {
    border-bottom: 5px solid #54BFA1;
}

.border-bottem-Valencia {
    border-bottom: 5px solid #D95448;
}

.border-bottem-Kournikova {
    border-bottom: 5px solid #F2CA50;
}

.border-green-bottem-light {
    border-bottom: 5px solid #004c84 !important;
}

.border-bottom-gray-laight {
    border-bottom: 1px solid #D9D9D9
}

.border-top-gray-laight {
    border-top: 1px solid #D9D9D9
}

.border-gray-laight {
    border: 1px solid #D9D9D9
}

.border-primary-color {
    border-color: #9F0B56;
}

.border-secondary-color {
    border-color: #00447A;
}

.border-white-color {
    border-color: white;
}

.border-gray-color {
    border-color: #D9D9D9;
}

.underline {
    text-decoration: underline !important;
}
/**************** BORDER END ******************/
/******************Border-radius********************/

.rounded {
    border-radius: 4px !important;
}

.rounded-12-left-0 {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
}

.rounded-12-right-0 {
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.rounded-top {
    border-top-left-radius: .5rem !important;
    border-top-right-radius: .5rem !important;
    border-bottom-right-radius: 0rem !important;
    border-bottom-left-radius: 0rem !important;
}

.rounded-bottom {
    border-bottom-right-radius: .5rem !important;
    border-bottom-left-radius: .5rem !important;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

.rounded-right {
    border-top-right-radius: .5rem !important;
    border-bottom-right-radius: .5rem !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.rounded-left {
    border-top-left-radius: .5rem !important;
    border-bottom-left-radius: .5rem !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

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

.rounded-4 {
    border-radius: 4px !important;
}

.rounded-8 {
    border-radius: 8px !important;
}

.rounded-left-8 {
    border-bottom-left-radius: 8px !important;
    border-top-left-radius: 8px !important;
    border-bottom-right-radius: 0px !important;
    border-top-right-radius: 0px !important;
}

.rounded-left-8-common {
    border-bottom-left-radius: 8px !important;
    border-top-left-radius: 8px !important;
    border-bottom-right-radius: 0px !important;
    border-top-right-radius: 0px !important;
}

.rounded-right-8 {
    border-bottom-left-radius: 0px !important;
    border-top-left-radius: 0px !important;
    border-bottom-right-radius: 8px !important;
    border-top-right-radius: 8px !important;
}

.rounded-top-8 {
    border-top-left-radius: 8px !important;
    border-top-right-radius: 8px !important;
    border-bottom-right-radius: 0rem !important;
    border-bottom-left-radius: 0rem !important;
}

.rounded-bottom-8 {
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 8px !important;
    border-bottom-left-radius: 8px !important;
}

.rounded-12 {
    border-radius: 12px !important;
}

.rounded-left-12 {
    border-bottom-left-radius: 12px !important;
    border-top-left-radius: 12px !important;
    border-bottom-right-radius: 0px !important;
    border-top-right-radius: 0px !important;
}

.rounded-right-12 {
    border-bottom-left-radius: 0px !important;
    border-top-left-radius: 0px !important;
    border-bottom-right-radius: 12px !important;
    border-top-right-radius: 12px !important;
}

.rounded-top-12 {
    border-bottom-left-radius: 0rem !important;
    border-bottom-right-radius: 0rem !important;
    border-top-left-radius: 12px !important;
    border-top-right-radius: 12px !important;
}

.rounded-bottom-12 {
    border-bottom-left-radius: 12px !important;
    border-bottom-right-radius: 12px !important;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
}

.rounded-14 {
    border-radius: 14px !important;
}

.rounded-left-14 {
    border-bottom-left-radius: 14px !important;
    border-top-left-radius: 14px !important;
    border-bottom-right-radius: 0px !important;
    border-top-right-radius: 0px !important;
}

.rounded-right-14 {
    border-bottom-left-radius: 0px !important;
    border-top-left-radius: 0px !important;
    border-bottom-right-radius: 14px !important;
    border-top-right-radius: 14px !important;
}

.rounded-top-14 {
    border-bottom-left-radius: 0rem !important;
    border-bottom-right-radius: 0rem !important;
    border-top-left-radius: 14px !important;
    border-top-right-radius: 14px !important;
}

.rounded-bottom-14 {
    border-bottom-left-radius: 14px !important;
    border-bottom-right-radius: 14px !important;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
}

.rounded-16 {
    border-radius: 16px !important;
}

.rounded-left-16 {
    border-bottom-left-radius: 16px !important;
    border-top-left-radius: 16px !important;
    border-bottom-right-radius: 0px !important;
    border-top-right-radius: 0px !important;
}

.rounded-right-16 {
    border-bottom-left-radius: 0px !important;
    border-top-left-radius: 0px !important;
    border-bottom-right-radius: 16px !important;
    border-top-right-radius: 16px !important;
}

.rounded-top-16 {
    border-bottom-left-radius: 0rem !important;
    border-bottom-right-radius: 0rem !important;
    border-top-left-radius: 16px !important;
    border-top-right-radius: 16px !important;
}

.rounded-bottom-16 {
    border-bottom-left-radius: 16px !important;
    border-bottom-right-radius: 16px !important;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
}

.rounded-20 {
    border-radius: 20px !important;
}

.rounded-top-20 {
    border-top-left-radius: 20px !important;
    border-top-right-radius: 20px !important;
    border-bottom-right-radius: 0rem !important;
    border-bottom-left-radius: 0rem !important;
}

.rounded-bottom-20 {
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 20px !important;
    border-bottom-left-radius: 20px !important;
}

.rounded-right-20 {
    border-top-right-radius: 20px !important;
    border-bottom-right-radius: 20px !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.rounded-left-20 {
    border-top-left-radius: 20px !important;
    border-bottom-left-radius: 20px !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.rounded-24 {
    border-radius: 24px !important;
}

.rounded-top-24 {
    border-top-left-radius: 24px !important;
    border-top-right-radius: 24px !important;
    border-bottom-right-radius: 0rem !important;
    border-bottom-left-radius: 0rem !important;
}

.rounded-bottom-24 {
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 24px !important;
    border-bottom-left-radius: 24px !important;
}

.rounded-right-24 {
    border-top-right-radius: 24px !important;
    border-bottom-right-radius: 24px !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.rounded-left-24 {
    border-top-left-radius: 24px !important;
    border-bottom-left-radius: 24px !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.rounded-28 {
    border-radius: 28px !important;
}

.rounded-top-28 {
    border-top-left-radius: 28px !important;
    border-top-right-radius: 28px !important;
    border-bottom-right-radius: 0rem !important;
    border-bottom-left-radius: 0rem !important;
}

.rounded-bottom-28 {
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 28px !important;
    border-bottom-left-radius: 28px !important;
}

.rounded-right-28 {
    border-top-right-radius: 28px !important;
    border-bottom-right-radius: 28px !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.rounded-left-28 {
    border-top-left-radius: 28px !important;
    border-bottom-left-radius: 28px !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.rounded-32 {
    border-radius: 32px !important;
}

.rounded-top-32 {
    border-top-left-radius: 32px !important;
    border-top-right-radius: 32px !important;
    border-bottom-right-radius: 0rem !important;
    border-bottom-left-radius: 0rem !important;
}

.rounded-bottom-32 {
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 32px !important;
    border-bottom-left-radius: 32px !important;
}

.rounded-right-32 {
    border-top-right-radius: 32px !important;
    border-bottom-right-radius: 32px !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.rounded-left-32 {
    border-top-left-radius: 32px !important;
    border-bottom-left-radius: 32px !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.rounded-64 {
    border-radius: 64px !important;
}

.rounded-top-64 {
    border-top-left-radius: 64px !important;
    border-top-right-radius: 64px !important;
    border-bottom-right-radius: 0rem !important;
    border-bottom-left-radius: 0rem !important;
}

.rounded-bottom-64 {
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 64px !important;
    border-bottom-left-radius: 64px !important;
}

.rounded-circle {
    border-radius: 50% !important;
}

    .rounded-circle.convoys {
        width: 22px;
        height: 22px;
        position: absolute;
        right: -8px;
        bottom: -8px;
        border: 3px solid #000;
    }

.rounded-0 {
    border-radius: 0 !important;
}

.border-left-rudies-0 {
    -webkit-border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-topright: 5px;
    -moz-border-radius-bottomright: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.border-radius-none {
    border-radius: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

@media (max-width: 575.98px) {
    .rounded-xs-8 {
        border-radius: 8px !important;
    }

    .rounded-xs-left-8 {
        border-bottom-left-radius: 8px !important;
        border-top-left-radius: 8px !important;
        border-bottom-right-radius: 0px !important;
        border-top-right-radius: 0px !important;
    }

    .rounded-xs-left-8-common {
        border-bottom-left-radius: 8px !important;
        border-top-left-radius: 8px !important;
        border-bottom-right-radius: 0px !important;
        border-top-right-radius: 0px !important;
    }

    .rounded-xs-right-8 {
        border-bottom-left-radius: 0px !important;
        border-top-left-radius: 0px !important;
        border-bottom-right-radius: 8px !important;
        border-top-right-radius: 8px !important;
    }

    .rounded-xs-top-8 {
        border-top-left-radius: 8px !important;
        border-top-right-radius: 8px !important;
        border-bottom-right-radius: 0rem !important;
        border-bottom-left-radius: 0rem !important;
    }

    .rounded-xs-bottom-8 {
        border-top-left-radius: 0px !important;
        border-top-right-radius: 0px !important;
        border-bottom-right-radius: 8px !important;
        border-bottom-left-radius: 8px !important;
    }

    .rounded-xs-12 {
        border-radius: 12px !important;
    }

    .rounded-xs-left-12 {
        border-bottom-left-radius: 12px !important;
        border-top-left-radius: 12px !important;
        border-bottom-right-radius: 0px !important;
        border-top-right-radius: 0px !important;
    }

    .rounded-xs-right-12 {
        border-bottom-left-radius: 0px !important;
        border-top-left-radius: 0px !important;
        border-bottom-right-radius: 12px !important;
        border-top-right-radius: 12px !important;
    }

    .rounded-xs-top-12 {
        border-bottom-left-radius: 0rem !important;
        border-bottom-right-radius: 0rem !important;
        border-top-left-radius: 12px !important;
        border-top-right-radius: 12px !important;
    }

    .rounded-xs-bottom-12 {
        border-bottom-left-radius: 12px !important;
        border-bottom-right-radius: 12px !important;
        border-top-left-radius: 0px !important;
        border-top-right-radius: 0px !important;
    }

    .rounded-xs-14 {
        border-radius: 14px !important;
    }

    .rounded-xs-left-14 {
        border-bottom-left-radius: 14px !important;
        border-top-left-radius: 14px !important;
        border-bottom-right-radius: 0px !important;
        border-top-right-radius: 0px !important;
    }

    .rounded-xs-right-14 {
        border-bottom-left-radius: 0px !important;
        border-top-left-radius: 0px !important;
        border-bottom-right-radius: 14px !important;
        border-top-right-radius: 14px !important;
    }

    .rounded-xs-top-14 {
        border-bottom-left-radius: 0rem !important;
        border-bottom-right-radius: 0rem !important;
        border-top-left-radius: 14px !important;
        border-top-right-radius: 14px !important;
    }

    .rounded-xs-bottom-14 {
        border-bottom-left-radius: 14px !important;
        border-bottom-right-radius: 14px !important;
        border-top-left-radius: 0px !important;
        border-top-right-radius: 0px !important;
    }

    .rounded-xs-16 {
        border-radius: 16px !important;
    }

    .rounded-xs-left-16 {
        border-bottom-left-radius: 16px !important;
        border-top-left-radius: 16px !important;
        border-bottom-right-radius: 0px !important;
        border-top-right-radius: 0px !important;
    }

    .rounded-xs-right-16 {
        border-bottom-left-radius: 0px !important;
        border-top-left-radius: 0px !important;
        border-bottom-right-radius: 16px !important;
        border-top-right-radius: 16px !important;
    }

    .rounded-xs-top-16 {
        border-bottom-left-radius: 0rem !important;
        border-bottom-right-radius: 0rem !important;
        border-top-left-radius: 16px !important;
        border-top-right-radius: 16px !important;
    }

    .rounded-xs-bottom-16 {
        border-bottom-left-radius: 16px !important;
        border-bottom-right-radius: 16px !important;
        border-top-left-radius: 0px !important;
        border-top-right-radius: 0px !important;
    }

    .rounded-xs-20 {
        border-radius: 20px !important;
    }

    .rounded-xs-top-20 {
        border-top-left-radius: 20px !important;
        border-top-right-radius: 20px !important;
        border-bottom-right-radius: 0rem !important;
        border-bottom-left-radius: 0rem !important;
    }

    .rounded-xs-bottom-20 {
        border-top-left-radius: 0px !important;
        border-top-right-radius: 0px !important;
        border-bottom-right-radius: 20px !important;
        border-bottom-left-radius: 20px !important;
    }

    .rounded-xs-right-20 {
        border-top-right-radius: 20px !important;
        border-bottom-right-radius: 20px !important;
        border-top-left-radius: 0 !important;
        border-bottom-left-radius: 0 !important;
    }

    .rounded-xs-left-20 {
        border-top-left-radius: 20px !important;
        border-bottom-left-radius: 20px !important;
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }

    .rounded-xs-24 {
        border-radius: 24px !important;
    }

    .rounded-xs-top-24 {
        border-top-left-radius: 24px !important;
        border-top-right-radius: 24px !important;
        border-bottom-right-radius: 0rem !important;
        border-bottom-left-radius: 0rem !important;
    }

    .rounded-xs-bottom-24 {
        border-top-left-radius: 0px !important;
        border-top-right-radius: 0px !important;
        border-bottom-right-radius: 24px !important;
        border-bottom-left-radius: 24px !important;
    }

    .rounded-xs-right-24 {
        border-top-right-radius: 24px !important;
        border-bottom-right-radius: 24px !important;
        border-top-left-radius: 0 !important;
        border-bottom-left-radius: 0 !important;
    }

    .rounded-xs-left-24 {
        border-top-left-radius: 24px !important;
        border-bottom-left-radius: 24px !important;
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }

    .rounded-xs-28 {
        border-radius: 28px !important;
    }

    .rounded-xs-top-28 {
        border-top-left-radius: 28px !important;
        border-top-right-radius: 28px !important;
        border-bottom-right-radius: 0rem !important;
        border-bottom-left-radius: 0rem !important;
    }

    .rounded-xs-bottom-28 {
        border-top-left-radius: 0px !important;
        border-top-right-radius: 0px !important;
        border-bottom-right-radius: 28px !important;
        border-bottom-left-radius: 28px !important;
    }

    .rounded-xs-right-28 {
        border-top-right-radius: 28px !important;
        border-bottom-right-radius: 28px !important;
        border-top-left-radius: 0 !important;
        border-bottom-left-radius: 0 !important;
    }

    .rounded-xs-left-28 {
        border-top-left-radius: 28px !important;
        border-bottom-left-radius: 28px !important;
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }

    .rounded-xs-32 {
        border-radius: 32px !important;
    }

    .rounded-xs-top-32 {
        border-top-left-radius: 32px !important;
        border-top-right-radius: 32px !important;
        border-bottom-right-radius: 0rem !important;
        border-bottom-left-radius: 0rem !important;
    }

    .rounded-xs-bottom-32 {
        border-top-left-radius: 0px !important;
        border-top-right-radius: 0px !important;
        border-bottom-right-radius: 32px !important;
        border-bottom-left-radius: 32px !important;
    }

    .rounded-xs-right-32 {
        border-top-right-radius: 32px !important;
        border-bottom-right-radius: 32px !important;
        border-top-left-radius: 0 !important;
        border-bottom-left-radius: 0 !important;
    }

    .rounded-xs-left-32 {
        border-top-left-radius: 32px !important;
        border-bottom-left-radius: 32px !important;
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }

    .rounded-xs-64 {
        border-radius: 64px !important;
    }

    .rounded-xs-top-64 {
        border-top-left-radius: 64px !important;
        border-top-right-radius: 64px !important;
        border-bottom-right-radius: 0rem !important;
        border-bottom-left-radius: 0rem !important;
    }

    .rounded-xs-bottom-64 {
        border-top-left-radius: 0px !important;
        border-top-right-radius: 0px !important;
        border-bottom-right-radius: 64px !important;
        border-bottom-left-radius: 64px !important;
    }

    .rounded-xs-circle {
        border-radius: 50% !important;
    }

        .rounded-xs-circle.convoys {
            width: 22px;
            height: 22px;
            position: absolute;
            right: -8px;
            bottom: -8px;
            border: 3px solid #000;
        }

    .rounded-xs-0 {
        border-radius: 0 !important;
    }

    .border-xs-left-rudies-0 {
        -webkit-border-top-right-radius: 5px;
        -webkit-border-bottom-right-radius: 5px;
        -moz-border-radius-topright: 5px;
        -moz-border-radius-bottomright: 5px;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .border-xs-radius-none {
        border-radius: 0;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }
}
/******************Border-radius END********************/
/*********Height*********/
.height-40 {
    height: 40px !important;
}

.height-44 {
    height: 44px !important;
}

.height-48 {
    height: 48px !important;
}

.height-60 {
    height: 60px !important;
}

.height-time-line-60 {
    height: 60px;
    overflow-y: scroll;
}

.height-80 {
    height: 80px !important;
    line-height: 80px;
}

.height-100 {
    height: 100px !important;
    line-height: 100px;
}

.height-120 {
    height: 120px !important;
    line-height: 120px;
}

.height-100-v {
    height: 100px !important;
}

.height-50-v {
    height: 50px !important;
}

.height-262 {
    height: 262px;
}

.height-130 {
    height: 120px !important;
}

.line-height-20 {
    line-height: 20px;
}

.line-height-20 {
    line-height: 20px;
}

.line-height-25 {
    line-height: 2rem;
}

.line-height-36 {
    line-height: 36px;
}

.line-height-30 {
    line-height: 30px;
}

.line-height-32 {
    line-height: 32px;
}

.line-height-35 {
    line-height: 35px;
}

.line-height-40 {
    line-height: 40px;
}

.line-height-42 {
    line-height: 42px;
}

.line-height-44 {
    line-height: 44px;
}

.line-height-46 {
    line-height: 46px !important;
}

.line-height-50 {
    line-height: 50px !important;
}

@media (min-width : 768px) {
    .line-height-50-md {
        line-height: 50px !important;
    }
}

.line-height-55 {
    line-height: 5.5rem;
}
/*********Height END*********/

/*****************************************/
/*iframe {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border: 0;
    background: #fff;
}
*/
iframe ::-webkit-scrollbar-thumb {
    background-color: rgb(255, 255, 255) !important;
}

.scroller-content {
    max-height: 803px;
    overflow: scroll;
    overflow-x: hidden;
}

.circle {
    border-radius: 50%;
    margin: 0.48em 2em 0.35em 1em;
    font-size: 1em;
}

.circle-image {
    border-radius: 50%;
    border: 5px solid #fff;
    width: 170px;
}

.circle-text {
    background-color: #00447A;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    position: absolute;
    top: calc(100% - 50px);
    line-height: 50px !important;
    color: #fff;
    font-weight: bold;
    display: block;
    left: calc(50% - 25px);
}

#mylinks .header-icons-content li a.edit {
    background-image: url("");
    height: 19px;
    display: block;
    background-repeat: no-repeat;
}

#mylinks .header-icons-content li a.edit-colored {
    background-image: url("");
    height: 22px;
    width: 23px;
    margin-right: auto;
    margin-left: auto;
    display: block;
    background-repeat: no-repeat;
    margin-top: 15px;
}

#mylinks .header-icons-content a.visits {
    background-image: url("");
    height: 19px;
    display: block;
    background-repeat: no-repeat;
}

#mylinks .header-icons-content a.my-points {
    background-image: url("");
    height: 19px;
    display: block;
    background-repeat: no-repeat;
}

#mylinks .header-icons-content a.details {
    background-image: url("");
    height: 19px;
    display: block;
    background-repeat: no-repeat;
}

#mylinks .header-icons-content a.more-icon {
    background-image: url("");
    height: 46px;
    width: 46px;
    display: block;
    background-repeat: no-repeat;
    margin-top: 4px;
}

#mylinks .header-icons-content-popup {
    width: 676px;
}

#mylinks a.facebook-icon {
    background-image: url("");
    height: 32px;
    width: 32px;
    margin-left: 10px;
    margin-bottom: 5px;
    display: block;
    background-repeat: no-repeat;
    margin-top: 4px;
}

#mylinks a.google-icon {
    background-image: url("");
    height: 32px;
    width: 32px;
    margin-left: 10px;
    margin-bottom: 5px;
    display: block;
    background-repeat: no-repeat;
    margin-top: 4px;
}

#mylinks a.twitter-icon {
    background-image: url("");
    height: 32px;
    width: 32px;
    margin-left: 10px;
    margin-bottom: 5px;
    display: block;
    background-repeat: no-repeat;
    margin-top: 4px;
}

#mylinks a.embed {
    background-image: url("");
    height: 32px;
    width: 32px;
    margin-left: 10px;
    margin-bottom: 5px;
    display: block;
    background-repeat: no-repeat;
    margin-top: 4px;
}

#mylinks a.telegram {
    background-image: url("");
    height: 32px;
    width: 32px;
    display: block;
    background-repeat: no-repeat;
    margin-top: 4px;
}

#mylinks a.send-icon {
    background-image: url("");
    height: 32px;
    width: 32px;
    display: block;
    background-repeat: no-repeat;
    margin-top: 4px;
}

#mylinks a.linkedin-icon {
    background-image: url("");
    height: 32px;
    width: 32px;
    display: block;
    background-repeat: no-repeat;
    margin-top: 4px;
}

#mylinks a.whatsapp-icon {
    background-image: url("");
    height: 32px;
    width: 32px;
    display: block;
    background-repeat: no-repeat;
    margin-top: 4px;
}

#mylinks .circle-image img {
    width: 95px;
    height: 95px;
    /*border-radius:50%;*/
    display: block;
    background-position-y: 25%;
}
/***************Font-Size****************/
.font-10 {
    font-size: 10px;
}

.font-11 {
    font-size: 11px;
}

.font-12 {
    font-size: 12px;
}

.font-14 {
    font-size: 14px;
}

.font-16 {
    font-size: 16px;
}

.font-18 {
    font-size: 18px;
}

.font-20 {
    font-size: 20px;
}

.font-22 {
    font-size: 22px;
}

.font-24 {
    font-size: 24px;
}

.font-26 {
    font-size: 26px;
}

.font-30 {
    font-size: 30px;
}

.font-32 {
    font-size: 32px;
}

.font-40 {
    font-size: 40px !important;
}

.font-50 {
    font-size: 50px;
}

.font-70 {
    font-size: 70px;
}

.footerpic {
    height: 350px;
}

#scrollDown {
    position: absolute;
    bottom: 5%;
    font-size: 30px;
    z-index: 500;
    left: 47.5%;
    background: url("") no-repeat center;
    cursor: pointer;
    background-size: 35px;
}
/****************************Share**********************************/
.share-icon-sponser, .share-icon-omniaty, .share-icon-defult, .share-icon-project, .share-icon-project-inner, .share-icon-program, .share-icon-campaign, .share-icon-campaign-smile, .share-icon-campaign-sponsor {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000;
    height: 48px;
    width: 48px;
    position: fixed;
    /*z-index: 20;*/
    cursor: pointer;
    border-radius: 50%;
}

    .share-icon-sponser::after, .share-icon-omniaty::after, .share-icon-defult::after, .share-icon-project:after, .share-icon-project-inner::after, .share-icon-program::after, .share-icon-campaign::after, .share-icon-campaign-smile::after, .share-icon-campaign-sponsor::after {
        content: url("");
        width: 24px;
        height: 24px;
        /*content: image('/Content/icons/ShareBTN.svg');*/
    }

.share-icon-omniaty {
    left: auto;
    right: 10px;
}

.share-icon-sponser {
    right: 10px;
    top: -35px;
}

.share-icon-defult {
    top: 0px;
}

.share-icon-project-inner {
    bottom: 40px;
}

.share-icon-program {
    right: 20px;
}

.share-icon-campaign {
    position: fixed;
    top: 20%; /*If we increase this value, It will reflect in campaign page -- https://localhost:3114/en/qa/campaign?CampaignId=377 */
    right: 2%;
    z-index: 999; /*If we increase this value, It will reflect in campaign page -- https://localhost:3114/en/qa/campaign?CampaignId=377 */
}

.share-icon-campaign-sponsor {
    position: absolute;
    top: 3%;
    right: 2%;
    z-index: 999;
}

.share-icon-campaign-smile {
    position: absolute;
    top: 5%;
    left: 2%;
    z-index: 999;
    height: 40px;
    border: 0px;
    width: 40px;
}

.share-icon-campaign-interactiv {
    top: 90%;
    right: auto;
    left: 5%;
    cursor: pointer;
}

.share-icon2 {
    background-image: url("");
    height: 42px;
    width: 42px;
    background-repeat: no-repeat;
    position: absolute;
    z-index: 20;
    right: 10px;
    top: -10px;
    cursor: pointer;
}

.share-icon-interactiv {
    background-image: url("");
    height: 42px;
    width: 42px;
    background-repeat: no-repeat;
    position: absolute;
    z-index: 9998;
}
/******************* SVG ARROWS *******************/
.mouse {
    position: absolute;
    top: 89vh;
    left: calc(50% - 15px);
    z-index: 4994;
    box-shadow: 0 0 5px 0px #fff;
    border-radius: 15px;
}

.mouse-icon {
    width: 25px;
    height: 45px;
    border: 2px solid white;
    border-radius: 15px;
    cursor: pointer;
    position: relative;
    text-align: center;
}

.mouse-wheel {
    height: 6px;
    margin: 2px auto 0;
    display: block;
    width: 3px;
    background-color: white;
    border-radius: 50%;
    -webkit-animation: 1.6s ease infinite wheel-up-down;
    -moz-animation: 1.6s ease infinite wheel-up-down;
    animation: 1.6s ease infinite wheel-up-down;
}

@-webkit-keyframes wheel-up-down {
    0% {
        margin-top: 2px;
        opacity: 0;
    }

    30% {
        opacity: 1;
    }

    100% {
        margin-top: 20px;
        opacity: 0;
    }
}

@-moz-keyframes wheel-up-down {
    0% {
        margin-top: 2px;
        opacity: 0;
    }

    30% {
        opacity: 1;
    }

    100% {
        margin-top: 20px;
        opacity: 0;
    }
}

@keyframes wheel-up-down {
    0% {
        margin-top: 2px;
        opacity: 0;
    }

    30% {
        opacity: 1;
    }

    100% {
        margin-top: 20px;
        opacity: 0;
    }
}

.arrow-share {
    fill: #525252;
}

.arrow-hover-to-right:hover span svg {
    -webkit-animation: 1.6s ease infinite arrow-left-right;
    -moz-animation: 1.6s ease infinite arrow-left-right;
    animation: 1.6s ease infinite arrow-left-right;
}

.btn-package-details img {
    width: auto !important;
}

.svg-rtl {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}

@-webkit-keyframes arrow-left-right {
    0% {
        margin-left: 0px;
        opacity: 0;
    }

    30% {
        opacity: 1;
    }

    100% {
        margin-left: 20px;
        opacity: 0;
    }
}

@-moz-keyframes arrow-left-right {
    0% {
        margin-left: 0px;
        opacity: 0;
    }

    30% {
        opacity: 1;
    }

    100% {
        margin-left: 20px;
        opacity: 0;
    }
}

@keyframes arrow-left-right {
    0% {
        margin-left: 0px;
        opacity: 0;
    }

    30% {
        opacity: 1;
    }

    100% {
        margin-left: 20px;
        opacity: 0;
    }
}

@-webkit-keyframes arrow-right-left {
    0% {
        margin-right: 0px;
        opacity: 0;
    }

    30% {
        opacity: 1;
    }

    100% {
        margin-right: 20px;
        opacity: 0;
    }
}

@-moz-keyframes arrow-right-left {
    0% {
        margin-right: 0px;
        opacity: 0;
    }

    30% {
        opacity: 1;
    }

    100% {
        margin-right: 20px;
        opacity: 0;
    }
}

@keyframes arrow-right-left {
    0% {
        margin-right: 0px;
        opacity: 0;
    }

    30% {
        opacity: 1;
    }

    100% {
        margin-right: 20px;
        opacity: 0;
    }
}


@-webkit-keyframes QC_gradient-background-animation {
    0% {
        background-position: 50% 0%
    }

    50% {
        background-position: 50% 100%
    }

    100% {
        background-position: 50% 0%
    }
}

@-moz-keyframes QC_gradient-background-animation {
    0% {
        background-position: 50% 0%
    }

    50% {
        background-position: 50% 100%
    }

    100% {
        background-position: 50% 0%
    }
}

@keyframes QC_gradient-background-animation {
    0% {
        background-position: 50% 0%
    }

    50% {
        background-position: 50% 100%
    }

    100% {
        background-position: 50% 0%
    }
}



.hide-to-left {
    left: -100px !important;
    transition: all ease-in-out 0.5s;
}

.hide-to-right {
    right: -100px !important;
    transition: all ease-in-out 0.5s;
}
/* Abstract END *** Please don't write anything after that ********************************************************************************************************************************************************/
.pull-left-xs {
    float: right;
}
/********************************* BANNER DOWN ARROW *********************************/
.arrows {
    width: 60px;
    height: 72px;
    position: absolute;
    left: 50%;
    margin-left: -30px;
    bottom: 20px;
}

    .arrows path {
        stroke: #2994D1;
        fill: transparent;
        stroke-width: 1px;
        animation: arrow 2s infinite;
        -webkit-animation: arrow 2s infinite;
    }

@keyframes arrow {
    0% {
        opacity: 0;
    }

    40% {
        opacity: 1;
    }

    80% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@-webkit-keyframes arrow /*Safari and Chrome*/
{
    0% {
        opacity: 0;
    }

    40% {
        opacity: 1;
    }

    80% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

.arrows path.a1 {
    animation-delay: -1s;
    -webkit-animation-delay: -1s; /* Safari Chrome */
}

.arrows path.a2 {
    animation-delay: -0.5s;
    -webkit-animation-delay: -0.5s; /* Safari Chrome */
}

.arrows path.a3 {
    animation-delay: 0s;
    -webkit-animation-delay: 0s; /* Safari Chrome */
}
/********************************* BANNER DOWN ARROW END *********************************/
/********************************* OPTION - 1 *********************************/
.mouse {
    width: 70px;
    height: 70px;
    position: absolute;
    top: 89vh;
    left: calc(50% - 15px);
    z-index: 4994;
    box-shadow: none;
    border-radius: 0;
}

    .mouse svg {
        width: 1.2rem;
        height: auto;
        /*margin: 0 1rem;*/
        cursor: pointer;
        overflow: visible;
    }

        .mouse svg path {
            box-shadow: 0 0 5px 0px #000;
            /*transition: all 0.5s cubic-bezier(0.2, 1, 0.3, 1);*/
            fill: transparent;
            stroke: #FFF;
            stroke-width: 5px;
            transition: all 1s cubic-bezier(0.2, 1, 0.3, 1);
        }

        .mouse svg .arrow {
            animation: arrow-anim 1s cubic-bezier(0.2, 1, 0.3, 1) infinite;
        }

        .mouse svg .arrow-fixed {
            animation: arrow-fixed-anim 1s cubic-bezier(0.2, 1, 0.3, 1) infinite;
        }

@keyframes arrow-anim {
    0% {
        opacity: 1;
        transform: translateY(0);
    }

    5% {
        transform: translateY(-0.1rem);
    }

    100% {
        transform: translateY(2rem);
        opacity: 0.1;
    }
}

@keyframes arrow-fixed-anim {
    5% {
        opacity: 0;
    }

    20% {
        opacity: 0.4;
    }

    100% {
        opacity: 1;
    }
}
/********************************* OPTION - 1 END *********************************/
/********************************* OPTION - 2 *********************************/
.QC_banner-arrow {
    width: 60px;
    height: 72px;
    position: absolute;
    left: calc( 50% - 30px );
    bottom: 140px;
    z-index: 991;
    cursor: pointer;
}

    .QC_banner-arrow path {
        stroke: #FFF;
        fill: transparent;
        stroke-width: 2px;
        animation: arrow 2s infinite;
        -webkit-animation: arrow 2s infinite;
    }

.player-posation {
    position: absolute;
    top: 15%;
    font-size: 100px !important;
    right: calc(50% - 60px);
    cursor: pointer;
}


@keyframes arrow {
    0% {
        opacity: 0;
    }

    40% {
        opacity: 1;
    }

    80% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@-webkit-keyframes arrow /*Safari and Chrome*/
{
    0% {
        opacity: 0;
    }

    40% {
        opacity: 1;
    }

    80% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

.QC_banner-arrow path.arrow1 {
    animation-delay: -1s;
    -webkit-animation-delay: -1s; /* Safari Chrome */
}

.QC_banner-arrow path.arrow2 {
    animation-delay: -0.5s;
    -webkit-animation-delay: -0.5s; /* Safari Chrome */
}
/*.QC_banner-arrow path.a3 {
    animation-delay: 0s;
    -webkit-animation-delay: 0s; 
}
*/
/********************************* OPTION - 2 END *********************************/
/************************************************************************************************************************* SVG ARROWS END ***********/
.timeline-wrap {
    min-height: 500px;
}

.items-report .active {
    cursor: grabbing;
}

#timeline {
    width: 100%;
    position: absolute !important;
    right: 0;
    top: 250px;
    height: 540px;
    transform: translateY(-50%);
    cursor: url(""),w-resize;
}



    #timeline .line {
        height: 1px;
        background: #e2e2e2;
        position: absolute;
        top: 50%;
        margin-top: -4px;
        right: -5px;
        min-width: 100%;
        z-index: 5;
    }

    #timeline .month {
        position: absolute;
        z-index: 5;
        top: 40%;
        margin-top: 5px;
        font-size: 13px;
    }
    /*#timeline .month > span {
            letter-spacing: .1em;
        }*/
    #timeline .event.down {
        top: 240px;
        bottom: auto;
    }

    #timeline .event {
        display: block;
        min-width: 45px;
        height: 60px;
        overflow: visible;
        position: absolute;
        bottom: 240px;
        z-index: 6;
    }

        #timeline .event.down a.event {
            bottom: 0;
            top: auto;
        }

a {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

#timeline .event.down span.stalk {
    bottom: 0;
    top: 26px;
}

#timeline .event span.stalk {
    display: block;
    width: 1px;
    background: #e2e2e2;
    position: absolute;
    bottom: 32px;
    left: 22px;
    height: 30px;
}

#timeline .month span.stalk {
    display: block;
    width: 4px;
    background: #525252;
    position: absolute;
    top: 36px;
    left: 48%;
    height: 20px;
}

#timeline span.stalk:before {
    content: '';
    width: 12px;
    height: 12px;
    display: block;
    position: absolute;
    left: -5px;
    top: -5px;
}

#timeline .event .content.with_content.with_image {
    text-align: left;
}

#timeline .event .content.with_content {
    width: 260px !important;
    margin-left: -104px !important;
    padding: 0 !important;
    box-shadow: 5px 0 40px rgba(0,0,0,0.08);
    text-align: center;
}

#timeline .event .content.with_image {
    padding: 10px;
    width: auto;
    margin-left: -53px;
}

#timeline .event.down .content {
    bottom: auto;
    top: 75px;
}

#timeline .event .content {
    display: none;
    background: #fff;
    color: #666;
    width: 260px;
    margin-left: -134px;
    font-size: 13px;
    position: absolute;
    bottom: 95px;
    z-index: 5;
}

    #timeline .event .content span.image {
        width: 260px;
        height: 100px;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
    }

    #timeline .event .content span {
        display: block;
    }

#timeline .title-contain {
    display: block;
    width: 100%;
    height: 73px;
    padding: 0 15px;
    text-align: center;
}

.data-timeline {
    overflow: hidden;
    height: 50px;
    line-height: 24px;
    font-size: 12px;
}
/*#timeline .title-contain:before {
            content: '';
            display: inline-block;
            height: 100%;
            vertical-align: middle;
            margin-right: -.25em;
        }*/
#timeline .title-contain span.title {
    display: inline-block;
    vertical-align: middle;
    color: #444;
}

.page-container {
    opacity: 0;
    animation-name: fadeIn;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-delay: .2s;
}

.arrowUp {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #F5F5F5;
    position: fixed;
    z-index: 50000;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
    top: 30px !important;
    margin-left: 15px;
}

.basketNotification {
    max-width: 376px;
    z-index: 19999;
    width: 100%;
    direction: ltr;
    height: auto;
    position: fixed;
    background-color: #F5F5F5;
    border-top: 3px solid rgba(0, 76, 132, 0.9);
    border-left: 1px solid #b4b4b4;
    border-right: 1px solid #b4b4b4;
    border-bottom: 1px solid #b4b4b4;
    /*top: 35px;
    left: 0 !important;*/
    padding: 10px;
    /*margin-right: 12px;*/
    margin-top: -5px;
}
/***************** FOOTER *****************/
.footer-back {
    /*background-image: url(/Content/images/footer-lg.jpg);
    background-position: top center !important;
    background-size: cover;
    filter: brightness(100%);
    background-image: linear-gradient(to bottom, #000000, #23161e, #36273e, #3c3e66, #20598e);*/
    background: #191919;
}

    .footer-back ul li a:hover {
        color: rgba(17,213,226,1);
        transition: ease-in;
        cursor: pointer;
    }
/*.QC_footer_pic {
    width: 80px;
    height: 80px;
    object-fit: cover;
}*/
.white-color, .white-color a {
    color: #fff;
}

a.QC_primary-color:hover {
    color: #590630;
}

a.QC_secondary-color:hover {
    color: #004c84;
}

.height-53 {
    height: 53px !important;
}

.col-center {
    margin: auto;
    float: none;
    display: table-cell;
}

.organizationformbutton {
    float: right !important
}
/***************** FOOTER END *****************/
/*==================================================
=            Bootstrap 3 Media Queries             =
==================================================*/
/*====================  Mobile First Method  ====================*/
/* Small devices (landscape phones, 576px and up) */
@media only screen and (min-width : 576px) {
    .color-white-lg {
        color: #fff;
    }

    .margin-50-top-lg {
        margin-top: 50px;
    }
}
/* Medium devices (tablets, 768px and up) */
@media only screen and (min-width : 768px) {

    .loginMenuLiCheck {
        cursor: pointer;
        height: 34px;
        float: right;
    }

    .margin-10-bottom-sm {
        margin-bottom: 10px;
    }

    .text-center-sm {
        text-align: center !important;
    }

    .text-left-sm {
        text-align: left !important;
    }

    .text-right-sm {
        text-align: right !important;
    }

    .steps-timeline {
        border-top: 1px solid #707070;
        padding-top: 20px;
        margin-top: 40px;
        margin-left: 16.65%;
        margin-right: 16.65%;
    }

    #OpenSearchVerticalForm.newsearch {
        width: 260px;
    }

    .tabs-bordered .hdtb-mitem {
        border: 1px solid #00447A;
        margin: auto 2px 0 0;
        border-bottom: 0px;
        color: #00447A;
    }

    #hdtb-msb.tabs-bordered {
        border-bottom: 3px solid #00447A;
    }

    .tabs-bordered .hdtb-mitem.active {
        border-bottom: 1px solid #00355F;
        background-color: #00355F !important;
        color: #FFF !important;
    }
}
/* Large devices (desktops, 992px and up) */
@media only screen and (min-width : 992px) {

    .loginMenuLiCheck {
        cursor: pointer;
        height: 34px;
        float: right;
    }

    .QC_col-md-12-en-md-6-ar {
        width: 100%;
    }

    .QC_col-md-6-en-md-12-ar {
        width: 50%;
    }

    /*.newloginnavbar {
        height: 116px !important;
    }*/

    .padding-100-top-lg {
        padding-top: 100px;
    }

    .text-center-sm {
        text-align: left !important;
    }
}
/* Extra large devices (large desktops, 1200px and up) */

/*.newnavbar.qc_navbar, .newnavbar.navbar-fixed-top:not(.nav-up), .newnavbar.navbar-fixed-bottom {
    padding-top: 0;
}*/
@media only screen and (min-width : 1200px) {
    .newnavbar.qc_navbar, .newnavbar.navbar-fixed-top:not(.nav-up), .newnavbar.navbar-fixed-bottom {
        top: 34px !important;
    }
}
/*====================  Mobile First Method END  ====================*/
.QC_right-15 {
    left: auto;
    right: 15px;
}

#section-ramadan-video-image > a {
    height: 500px;
    background: center no-repeat;
}

.grab {
    cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}
    /* (Optional) Apply a "closed-hand" cursor during drag operation. */
    .grab:active {
        cursor: grabbing;
        cursor: -moz-grabbing;
        cursor: -webkit-grabbing;
    }


.pointer {
    cursor: pointer;
}
/*====================  Non-Mobile First Method  ====================*/
/* Extra small devices (portrait phones, less than 576px) */
@media only screen and (max-width : 575px) {
    .padding-120-bottom-xs {
        padding-bottom: 120px;
    }

    .padding-150-bottom-xs {
        padding-bottom: 150px;
    }

    .fixed-bar {
        position: fixed;
        bottom: 0;
        margin-left: -15px;
        padding-bottom: 30px;
        z-index: 72;
    }

    .popup-slider-gift {
        top: calc(60% - 200px) !important;
    }

    .cc-window.cc-floating {
        bottom: 0 !important;
        z-index: 99999999;
        border-radius: 0 !important;
    }

    .QC_intiatves-section {
        height: 175px;
        min-height: 175px;
        max-height: 175px;
        overflow: hidden;
    }

    .pull-left-xs {
        float: left;
    }

    .ramadan-image-118-85 {
        width: 85px;
        height: 85px;
    }

    #section-ramadan-video-image > a {
        height: 200px;
    }

    .margin-none-xs {
        margin: 0 !important;
    }

    .border-box-dark-xs {
        border: 1px solid #B4B4B4;
    }

    .padding-0-top-xs {
        padding-top: 0px !important;
    }

    .box-none-xs {
        background: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .zakat-bnner-section {
        min-height: 500px;
    }

    .QC_inner-banner.adahy-landing-banner {
        height: 750px;
        /*background-image: linear-gradient(to bottom, #421767, #6b1878, #961484, #c10a8a, #ec008c);*/
        background-image: linear-gradient(to bottom, #0F498A, #011C4F);
        /*padding-bottom: 30px;*/
        /**/
        -webkit-animation: QC_gradient-background-animation 10s ease infinite;
        -moz-animation: QC_gradient-background-animation 10s ease infinite;
        animation: QC_gradient-background-animation 10s ease infinite;
        background-size: 200% 200%;
    }

    /*.QC_ramadan-banner-card {
        padding-top: 50px;
    }*/

    .padding-none-xs {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .padding-none-v-xs {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }



    .padding-none-v-20-xs {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }


    .pull-none-xs {
        float: none !important;
    }

    .padding-30-h-xs {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }

    .padding-20-v-xs {
        padding-bottom: 20px !important;
        padding-top: 20px !important;
    }

    .margin-20-v-xs {
        margin-bottom: 20px !important;
        margin-top: 20px !important;
    }

    .margin-25-v-xs {
        margin-top: 25px !important;
        margin-bottom: 25px !important;
    }

    .padding-30-v-xs {
        padding-bottom: 30px !important;
        padding-top: 30px !important;
    }

    .margin-60-top-xs {
        margin-top: 60px;
    }

    .margin-20-top-xs {
        margin-top: 20px !important;
    }

    .margin-15-top-xs {
        margin-top: 15px !important;
    }

    .bg-grident-moission {
        background-image: linear-gradient(to bottom, #982c32, #80242a, #681c22, #52151a, #3c0e11);
        height: auto;
    }

    .font-20-xs {
        font-size: 20px !important
    }
}

@media only screen and (max-width :768px) {
    .padding-120-bottom-sm {
        padding-bottom: 120px;
    }

    .padding-150-bottom-sm {
        padding-bottom: 150px;
    }

    .padding-none-xs {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .padding-none-v-xs {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
}
/* Small devices (landscape phones, less than 768px) */
@media only screen and (max-width : 767px) {
    .QC_padding-section {
        padding: 40px 0;
    }

    .top-0-sm {
        top: 0;
    }

    .reportboxcustomheight {
        height: auto;
    }

    .QC_program-banner {
        min-height: 160px !important;
        background-size: cover !important;
    }

    .QC_inner-banner.daily-cahrity-banner {
        background-image: url("");
        min-height: 490px;
        padding-top: 280px;
    }

    #section-faq {
        padding-bottom: 20px;
        padding-top: 20px;
    }

    .fa fa-bell-o {
        line-height: 1;
    }

    .loginMenuLiCheck {
        cursor: pointer;
        height: 34px;
        float: right;
    }

    .ProjectsNeeds-landing-banner {
        background-image: none;
        height: auto;
        background-color: #fff;
    }

    .color-black-xs {
        color: #000 !important;
    }

    .sponsorship-inner-banner-cases {
        height: 430px !important;
    }

    .QC_inner-banner.sponsorship-inner-banner {
        height: 580px !important;
    }

    .padding-15-h-sm {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .padding-30-h-sm {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }

    .modal-dialog {
        width: 100%;
        height: 100%;
        padding: 0;
        margin: 0;
    }

    .modal-content {
        height: 100%;
        border-radius: 0;
    }

    .box-none-sm {
        background: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .rounded-0-xs {
        border-radius: 0px !important;
    }

    .col-center {
        float: left;
        display: table-cell;
    }

    .QC_inner-banner, .inner-back, .QC_omniaty-section-banner, .QC_awen-section-banner, .QC_thawab-section-banner, .QC_inner-banner.omniaty-banner {
        min-height: 150px;
    }

        .QC_inner-banner.rescuemission-banner {
            background-image: url("");
            background-size: contain !important;
        }

        .QC_inner-banner.rescuemission-charts-banner {
            background-image: none;
        }

    .steps-timeline {
        border-left: 1px solid #3498DB;
        margin-left: 25px;
    }

    .xs-fast-donation {
        z-index: 900;
        margin-top: -220px;
    }

    .steps-img {
        float: left;
        margin-right: 20px;
    }

    .margin-top-40-xs {
        margin-top: 40px !important;
    }

    .margin-25-left-xs {
        margin-left: -25px;
    }

    .margin-140-mines-top-xs {
        margin-top: -140px;
    }

    .margin-0-bottom-xs {
        margin-bottom: 0px !important;
    }

    .margin-0-h-xs {
        margin-right: 0px !important;
        margin-left: 0px !important;
    }

    .margin-10-top-xs {
        margin-top: 10px !important;
    }

    .margin-20-top-xs {
        margin-top: 20px !important;
    }

    .margin-30-top-xs {
        margin-top: 30px !important;
    }

    .margin-40-top-xs {
        margin-top: 40px !important;
    }

    .margin-50-top-xs {
        margin-top: 50px !important;
    }

    .margin-10-bottom-xs {
        margin-bottom: 10px !important;
    }

    .margin-20-bottom-xs {
        margin-bottom: 20px !important;
    }

    .margin-30-bottom-xs {
        margin-bottom: 30px !important;
    }

    .margin-15-h-xs {
        margin-right: 15px !important;
        margin-left: 15px !important;
    }

    .margin-10-left-xs {
        margin-left: 10px !important;
    }

    .margin-40-bottom-xs {
        margin-bottom: 40px !important;
    }

    .margin-50-bottom-xs {
        margin-bottom: 50px !important;
    }

    .padding-0-top-xs {
        padding-top: 0px !important;
    }

    .padding-5-bottom-xs {
        padding-bottom: 5px !important
    }

    .padding-10-bottom-xs {
        padding-bottom: 10px !important
    }

    .padding-20-bottom-xs {
        padding-bottom: 20px !important
    }

    .padding-30-bottom-xs {
        padding-bottom: 30px !important
    }

    .padding-40-bottom-xs {
        padding-bottom: 40px !important
    }

    .padding-50-bottom-xs {
        padding-bottom: 50px !important
    }

    .padding-0-bottom-xs {
        padding-bottom: 0px !important
    }

    .border-none-xs {
        border-bottom: 0px !important;
        border-top: 0px !important;
        border-right: 0px !important;
        border-left: 0px !important;
    }

    .padding-10-h-xs {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .padding-15-h-xs {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .padding-30-h-xs {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }

    .padding-15-v-xs {
        padding-bottom: 15px;
        padding-top: 15px;
    }

    .padding-0-h-xs {
        padding-left: 0px;
        padding-right: 0px;
    }

    .padding-0-v-xs {
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .Project-taype-border-xs {
        border: 1px solid #D9D9D9
    }

    .QC_Section-titel {
        font-size: 24px;
        font-weight: bold;
    }

    .text-center-xs {
        text-align: center !important;
    }

    .text-left-xs {
        text-align: left !important;
    }

    .text-right-xs {
        text-align: right !important;
    }

    .font-10-xs {
        font-size: 10px !important;
    }

    .font-12-xs {
        font-size: 12px !important;
    }

    .font-14-xs {
        font-size: 14px !important;
    }

    .font-16-xs {
        font-size: 16px !important;
    }

    .font-18-xs {
        font-size: 18px !important;
    }

    .font-28-xs {
        font-size: 28px !important;
    }

    .font-26-xs {
        font-size: 26px !important;
    }

    .font-20-sm {
        font-size: 20px !important;
    }


    .font-22-xs {
        font-size: 22px !important;
    }


    .font-24-xs {
        font-size: 24px !important;
    }

    .font-30-xs {
        font-size: 30px !important;
    }

    .font-32-xs {
        font-size: 32px !important;
    }

    .font-36-xs {
        font-size: 36px !important;
    }

    .font-40-xs {
        font-size: 40px !important;
    }

    .Search-input-filter {
        padding: 0 5px;
        font-size: 12px;
    }

    .bg-light-mobile {
        top: 132px;
        z-index: 99;
    }

    .bg-below-mobile {
        background-color: #003e6b;
        background: #003e6b;
    }

    .QC_white_btn_xs {
        background-color: #fff;
        color: #00447A;
    }

    .padding-less-xs {
        padding-right: 5px !important;
        padding-left: 5px !important;
    }

    .pay-div {
        position: fixed;
        bottom: 0;
        width: 100%;
        padding: 0;
        margin: 0;
        left: 0;
        z-index: 9;
        box-shadow: 0 0 13px 0 rgba(0, 0, 0, 0.2);
        border-radius: 0px !important;
    }

    .text-center-xs {
        text-align: center !important;
    }

    .share-reckeu {
        position: absolute;
        left: 58px;
        right: auto;
        top: 151px;
    }

    .min-width-240 {
        min-width: 100%;
    }

    .margin-top-mines-90-xs {
        margin-top: -90px;
    }

    .margin-top-mines-50-xs {
        margin-top: -50px;
    }

    .margin-top-mines-40-xs {
        margin-top: -40px;
    }

    .border-box-xs {
        border: 0px;
    }

    .margin-top-mines-100-xs {
        margin-top: -100px;
    }

    .margin-130-bottom-xs {
        margin-bottom: 130px;
    }

    .QC_inner-banner.QC_brand {
        background-image: url("");
        height: auto;
        background-size: cover;
    }

    a.QC_float-social-button {
        left: auto;
        right: 20px;
    }

    .margin-10-bottom-sm {
        margin-bottom: 10px;
    }

    .float-social-icons {
        left: auto;
        right: 24px;
    }

    .QC_intiatves-section {
        height: 220px;
        min-height: 220px;
        max-height: 220px;
        overflow: hidden;
    }

    .padding-0-top-sm {
        padding-top: 0px;
    }

    .back-white-sm {
        background: white;
    }

    .max-width-400-sm {
        max-width: 400px;
    }

    .tabs-bordered {
        -webkit-box-shadow: 1px 1px 4px 1px rgba(1,1,1,0.13) !important;
        -moz-box-shadow: 1px 1px 4px 1px rgba(1,1,1,0.13) !important;
        box-shadow: 1px 1px 4px 1px rgba(1,1,1,0.13);
    }

        .tabs-bordered .hdtb-mitem {
            margin: auto 2px 0 0;
            color: #00447A;
        }

    .height-Ramadan-video-500 {
        height: 200px;
    }

    /*        .standingorderFastDonation {
            min-width: 100%;
            max-width: 100%;
        }*/

    .padding-20-v-sm {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .QC_inner-banner.whay-projects-banner {
        background-image: none !important;
        background-color: #00111D;
        height: auto;
    }

    /*    .annual-report-statics-height {
        height: 1440px;
        max-height: 1500px;
        overflow: hidden;
    }*/

    .Visa_Block, .Mobile_Block {
        /*min-height: 165px;*/
    }

    .height-auto-xs {
        height: auto;
    }

    .QC-News-img {
        width: 85px;
        height: 77px;
    }

    .QC_SuccessStory_imag {
        height: 200px;
        width: 100%;
    }

    .QC_inner-banner.Donation-landing-banner {
        background-image: url("");
        min-height: 570px;
        max-height: 580px;
    }

    .QC_donation-banner-card {
        padding-top: 120px;
    }

    .text-center-sm {
        text-align: center !important;
    }

    .pull-none-sm {
        float: none !important;
    }

    .padding-30-h-sm {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }

    .padding-30-v-sm {
        padding-bottom: 30px !important;
        padding-top: 30px !important;
    }

    .margin-10-top-sm {
        margin-top: 10px;
    }

    .margin-20-top-sm {
        margin-top: 20px;
    }

    /*.country-info {
        padding: 50px 0;
    }*/

    .QC_inner-banner.refugee-banner {
        /*padding-top: 60px;*/
        height: 900px;
        min-height: 760px;
        max-height: 800px;
    }

    .border-bottom-xs {
        border-bottom: 1px solid #ccc !important;
        border-top: 0px !important;
        border-left: 0px !important;
        border-right: 0px !important;
    }

    .colm-all-point {
        overflow-y: auto;
        max-height: none;
    }

    /*    .warm-canvas-content-box {
        background-color: #a4d09b;
        padding: 100px 15px;
    }*/
}
/* Medium devices (tablets, less than 992px) */
@media only screen and (max-width : 991px) {

    .warmCaravans-banner {
        background-size: contain;
    }

    .newloginnavbar .loginMenuLi {
        height: 34px;
        float: left;
        padding: 0px 4px;
    }

    .mainMenuLogoSmall {
        width: 90px;
        margin-top: 10px;
    }

    .margin-90-top {
        margin-top: 90px;
    }

    .time-line-heigh {
        max-height: 40vh;
        overflow: scroll;
    }

    .height-time-line-60 {
        height: auto;
        overflow-y: visible;
    }

    .box-none-sm {
        background: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .float-sm-none {
        float: none !important;
    }

    .margin-sm-auto {
        margin-left: auto;
        margin-right: auto
    }

    .border-none-sm {
        border-bottom: 0px !important;
        border-top: 0px !important;
        border-right: 0px !important;
        border-left: 0px !important;
    }

    .margin-0-top-xs {
        margin-top: 0px !important;
    }

    .padding-none-sm {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .margin-130-top-xs {
        margin-top: 130px !important;
    }

    .margin-0-xs {
        margin-top: 0px !important;
        margin-bottom: 0px !important;
    }


    .margin-top-40-xs {
        margin-top: 40px !important;
    }

    .margin-140-mines-top-xs {
        margin-top: -140px;
    }

    .margin-0-bottom-xs {
        margin-bottom: 0px !important;
    }

    .margin-0-h-xs {
        margin-right: 0px !important;
        margin-left: 0px !important;
    }

    .margin-10-top-xs {
        margin-top: 10px !important;
    }

    .margin-20-top-xs {
        margin-top: 20px !important;
    }

    .margin-30-top-xs {
        margin-top: 30px !important;
    }

    .margin-40-top-xs {
        margin-top: 40px !important;
    }

    .margin-50-top-xs {
        margin-top: 50px !important;
    }

    .margin-10-bottom-xs {
        margin-bottom: 10px !important;
    }

    .margin-20-bottom-xs {
        margin-bottom: 20px !important;
    }

    .margin-30-bottom-xs {
        margin-bottom: 30px !important;
    }

    .margin-40-bottom-xs {
        margin-top: 40px !important;
    }

    .margin-50-bottom-xs {
        margin-bottom: 50px !important;
    }

    .max-height-82-sm {
        height: auto;
        max-height: 82px;
        overflow: hidden;
    }
    /******************************************/
    .padding-10-bottom-xs {
        padding-bottom: 10px !important
    }

    .padding-20-bottom-xs {
        padding-bottom: 20px !important
    }

    .padding-30-bottom-xs {
        padding-bottom: 30px !important
    }

    .padding-40-bottom-xs {
        padding-bottom: 40px !important
    }

    .padding-50-bottom-xs {
        padding-bottom: 50px !important
    }


    .padding-5-top-xs {
        padding-top: 5px !important
    }

    .padding-10-top-xs {
        padding-top: 10px !important
    }

    .padding-20-top-xs {
        padding-top: 20px !important
    }

    .padding-30-top-xs {
        padding-top: 30px !important
    }

    .padding-40-top-xs {
        padding-top: 40px !important
    }

    .padding-50-top-xs {
        padding-top: 50px !important
    }

    .bar-below-ghaith {
        position: static;
        top: 0;
    }

    .Financial-inner-back {
        background-size: cover;
        background-repeat: no-repeat;
        width: 100%;
        min-height: 200px;
        background-position: top center;
        background-attachment: inherit;
    }

    .QC_partner-landing-header {
        height: auto;
    }

    .QC_margin-auto-sm {
        margin-left: auto;
        margin-right: auto;
    }

    .QC-image-Card {
        height: auto;
        object-fit: cover;
    }

    .QC-image-Card-assistance {
        min-width: 100%;
        height: 200px;
        object-fit: cover;
    }

    .QC-image-countries {
        min-width: 100%;
        height: 200px;
        object-fit: cover;
    }


    .qpayPopup {
        width: 375px;
        height: 700px;
        overflow: hidden;
        -webkit-transform: scale(1,0.8);
        -moz-transform: scale(1,0.8);
        transform: scale(1,0.8);
    }
}
/* Large devices (desktops, less than 1200px) */
@media only screen and (max-width : 1199px) {
    /*.newloginnavbar {
        display: none !important;
    }*/

    .responsive-image-project {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden;
        /*height: auto !important;*/
    }

    .main-widht-menu {
        max-width: 100%;
    }

    #SearchVerticalDivMenu.newsearch {
        width: 100%;
    }

    #SuggestionSearchDataDiv {
        width: 82%;
    }

    .QC-sticky {
        top: 62px;
        position: fixed;
    }

    .our-vision, .our-mission {
        height: 550px;
        min-height: 262px;
        max-height: 700px;
        max-height: 700px;
        background-size: 100%;
        background-position: top center;
        position: relative;
    }

        .our-vision .our-vision-subject, .our-mission .our-mission-subject {
            position: initial;
            top: 80px;
            left: 0;
            right: 0;
        }

            .our-vision .our-vision-subject p, .our-mission .our-mission-subject p {
                padding: 5px;
            }

    .donat-special-css {
        margin-top: 0 !important;
        padding-top: 0 !important;
        border-radius: 0px;
        text-align: center;
        width: 100%;
    }

    .mune-Assistance .navbar-collapse, .mune-Assistance .collapse {
        display: block !important;
        border: 0px !important;
    }

    .mune-Assistance .navbar-nav .open .dropdown-menu {
        position: absolute;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: #fff;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: 0 0 13px 0 rgba(0, 0, 0, .2);
    }

    .mune-camp .navbar-collapse, .mune-camp .collapse {
        display: block !important;
        border: 0px !important;
    }

    .mune-camp .navbar-nav .open .dropdown-menu {
        position: absolute;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: #fff;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: 0 0 13px 0 rgba(0, 0, 0, .2);
    }

    .mgales-request-form {
        margin-top: 0;
    }

    /*.ghaith-fast-donation {
        top: 10%;
        left: 10%;
    }*/
    .QC_inner-back.Donation-landing-banner {
        max-height: 570px;
    }
}
/*====================  Not Standard  ====================*/
@media only screen and (max-width : 1920px) {
    .QC_inner-banner.meterKhair-landing-banner {
        background: url("") no-repeat;
    }

    .QC_inner-banner.hurryUp-banner {
        background: url("") no-repeat #F3F3F3;
    }

    .QC_inner-banner.urgent-banner {
        background: url("") no-repeat #F3F3F3;
    }
}
/*====================  Not Standard End  ====================*/
/*====================  Non-Mobile First Method END  ====================*/
/*====================  Specified  ====================*/
/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575px) {

    .top-0-xs {
        top: 0;
    }

    .organizationformbutton {
        float: none !important
    }

    .Project-type-width-pic {
        width: 70px !important;
    }
}

#QCMapBranchDiv {
    height: 680px;
    min-width: 310px;
    /*max-width: 800px;*/
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767px) {
}
/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .collapse.dont-collapse-sm {
        display: block;
        height: auto !important;
        visibility: visible;
    }

    .text-center-md {
        text-align: center !important;
    }
}
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) {
}
/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
}
/*====================  Specified END  ====================*/
p.projects-types-max-height {
    height: 130px;
    padding: 10px 0;
}
/**************************TimeLine**********************/
.steps-timeline:after {
    content: "";
    display: table;
    clear: both;
}

.steps-one,
.steps-two,
.steps-three {
    outline: 1px dashed rgba(0, 128, 0, 0);
}

.steps-description {
    overflow: hidden;
}



.steps-img {
    display: block;
    margin: auto;
    width: 20px;
    height: 20px;
    border-radius: 50%;
}



.steps-name,
.steps-description {
    margin: 0;
}

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


    .steps-one,
    .steps-two {
        padding-bottom: 40px;
    }

    .steps-one,
    .steps-two,
    .steps-three {
        margin-left: -11px;
    }

    .steps-three {
        margin-bottom: -100%;
    }

    .steps-img {
        float: left;
        margin-right: 20px;
    }
}


@media screen and (min-width: 500px) {
    .steps-one,
    .steps-two,
    .steps-three {
        float: left;
        width: 33%;
        margin-top: -32px;
    }

    .steps-one {
        margin-left: -16.65%;
        margin-right: 16.65%;
    }

    .steps-three {
        margin-left: 16.65%;
        margin-right: -16.65%;
    }

    .steps-name {
        text-align: center;
    }

    .steps-description {
        text-align: center;
    }
}
/*==================================================
=            Bootstrap 3 Media Queries End         =
==================================================*/
@media print {
    .bg-gray {
        background-color: #F5F5F5 !important;
        background: #F5F5F5 !important;
    }

    .padding-none-print {
        padding: 0 !important;
    }

    .white-color, .white-color a {
        color: #fff;
    }

    .text-center-sm {
        text-align: center !important;
    }

    .text-left-sm {
        text-align: left !important;
    }

    .text-right-sm {
        text-align: right !important;
    }

    .QC_secondary-color {
        color: #00447A !important;
    }


    .QC_gray-bg-light {
        background: #F3F3F3 !important;
        background-color: #F3F3F3 !important;
    }


    .QC_box-shadow {
        -webkit-box-shadow: 1px 1px 4px 1px rgba(1,1,1,0.13) !important;
        -moz-box-shadow: 0px 0px 9px 5px rgba(0,0,0,0.16) !important;
        box-shadow: 0px 0px 2px 0px rgba(1,1,1,0.13);
        overflow: hidden;
    }

    .QC_primary-color {
        color: #FF335A !important;
    }

    h1 {
        color: #000;
        background: none;
    }

    nav, aside {
        display: none;
    }

    body, article {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    @page {
        margin: .3cm;
    }

    .bgcol {
        background-color: #999 !important;
    }

    th {
        background-color: #ac0054 !important;
        color: #FFF !important;
    }

    .donat-special-css, .QC_primary-btn, .btn-default.QC_primary-btn,
    .btn-default[disabled].QC_primary-btn, .btn.QC_primary-btn, .QC_primary-border-btn, .btn-default.QC_primary-border-btn,
    .btn-default[disabled].QC_primary-border-btn, .btn.QC_primary-border-btn {
        background-color: #FF335A !important;
        color: #FFF !important;
        height: 48px;
        display: inline-block;
        padding: 0 16px;
        margin-bottom: 0;
        font-size: 12px;
        font-weight: 400;
        line-height: 40px !important;
        text-align: center;
        white-space: nowrap;
        vertical-align: middle;
        -ms-touch-action: manipulation;
        touch-action: manipulation;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background-image: none;
        border: none;
        border-radius: 12px;
    }

    .bg-white {
        background-color: #fff !important;
        background: #FFF !important;
    }

    .bg-primary {
        background-color: #9F0B56 !important;
        background: #9F0B56 !important;
    }

    .bg-secondary {
        background-color: #00447A !important;
        background: #00447A !important;
    }

    .margin-print {
        margin: 20px !important;
    }

    * {
        color: #555 !important;
    }
}

.height-53 {
    height: 53px !important;
}

div#SuggestionSearchDataDiv a {
    border-bottom: 1px solid rgba(0, 76, 132, 0.07);
}


.required:before {
    display: table-cell;
    color: #d00;
    content: "*";
    position: absolute;
    margin-left: -20px;
    margin-top: 13px;
    font-size: 16px;
}

.QC_table {
    display: table;
}

.QC_height-40 {
    height: 40px;
}
/***************************************************/
.time-count p {
    font-size: 42px;
    line-height: 46px
}

.time-count span {
    font-size: 13px;
}

#event {
    background: url("");
    background-size: cover;
    position: relative;
}

    #event .tab-block {
        text-align: center;
        border-right: 1px dotted #777;
    }

        #event .tab-block i {
            font-size: 40px;
            color: #ffffff;
        }

    #event .content-text {
        text-align: center;
        padding: 6px 60px;
    }

        #event .content-text h3 {
            font-size: 30px;
            color: #fff;
            font-weight: 400;
            letter-spacing: 1px;
            margin-bottom: 22px;
        }

        #event .content-text p {
            color: #adadad;
            font-size: 18px;
            line-height: 28px;
        }

.thawab-note {
    color: white;
    background-color: #43C0B9;
}

.border-thawab {
    border-top: 1px solid #e4e4e4;
    border-bottom: 1px solid #e4e4e4;
    padding: 15px;
}

.note {
    display: inline-block;
    min-width: 10px;
    padding: 10px 16px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    color: #86220F;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    background-color: #FBEEEB;
    border-radius: 8px;
}

.badge-note, .badge-note-2 {
    display: inline-block;
    min-width: 10px;
    padding: 5px 16px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    background-color: #e00671;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 16px;
}

.badge-note {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 12px;
}

.badge-note-2 {
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 0;
}

.LNO-label {
    color: #fff;
    position: absolute;
    top: 1px;
    right: 15px;
    background: rgba(0, 0, 0, 0.57);
    padding: 2px 10px 5px 10px;
    font-size: 11px !important;
}

@media only screen and (max-width : 375px) {
    .col-xs-extra-6 {
        width: 50% !important;
    }

    .col-xs-extra-12 {
        width: 100% !important;
    }
}

.QC_search-close > i {
    display: block !important;
    font-family: 'FontAwesome';
    color: #999999;
    position: absolute;
    right: 15px;
    top: 11px;
    font-size: 18px;
    cursor: pointer;
}

.ls-container .ls-layers > .ls-hide-on-phone, .ls-container .ls-background-videos .ls-hide-on-phone video, .ls-container .ls-background-videos .ls-hide-on-phone audio, .ls-container .ls-background-videos .ls-hide-on-phone iframe {
    display: block !important;
}
/*********highcharts************/
#containerRescue .highcharts-background {
    background-color: transparent;
    fill-opacity: 0 !important;
}

#containerRescue .highcharts-axis-labels text, #containerRescue .highcharts-yaxis-labels text {
    color: #ffffff !important;
    cursor: default !important;
    font-size: 11px !important;
    fill: #ffffff !important;
}

#containerRescue .highcharts-credits {
    color: #681c22 !important;
    cursor: default !important;
    font-size: 11px !important;
    fill: #681c22 !important;
}

#containerRescue .highcharts-point {
    background-repeat: no-repeat !important;
    width: 5px !important;
    background-color: #ffffff !important;
    border-radius: 100%;
    color: transparent !important;
    fill: #ffffff;
}

.highcharts-point {
    fill: #ed1651 !important;
    background-image: linear-gradient(to bottom, #ed1651, #fa4d42, #ff7435, #ff982e, #fdb933) !important;
}

#containerRescue .highcharts-title {
    color: #ffffff !important;
    color: #ffffff;
    font-size: 30px !important;
    fill: #ffffff !important;
    margin-bottom: 40px;
}

@media only screen and (max-width : 678px) {
    #containerRescue .highcharts-title {
        font-size: 18px !important;
    }
}

#containerRescue path[Attributes] {
    background-image: url("") !important;
    background-repeat: no-repeat !important;
    width: 16px !important;
    height: 25px !important;
    color: transparent !important;
}

.SliderNewDiv .event {
    border: 2px solid #59f !important;
    background: aliceblue;
    color: #000;
    font-size: 13px;
}

.default-back-color {
    background-color: #aebac3 !important;
}

.side {
    background-color: #ffffff;
    position: fixed !important;
    bottom: 0;
    width: 60%;
    z-index: 300;
    -webkit-box-shadow: 0px -5px 20px -10px rgba(0, 0, 0, 0.26);
    -moz-box-shadow: -0px -5px 20px -10px rgba(0, 0, 0, 0.26);
    box-shadow: 0px -5px 20px -10px rgba(0, 0, 0, 0.26);
    left: calc(50% - 30%);
    padding-top: 20px;
    padding-bottom: 20px;
    border: 1px solid #ccc;
    -webkit-border-radius: 12px 12px 0px 0px;
    -moz-border-radius: 12px 12px 0px 0px;
    border-radius: 12px 12px 0px 0px;
}

@media only screen and (max-width : 1270px) {
    .side {
        width: 90%;
        left: calc(50% - 45%);
    }
}

@media only screen and (max-width : 678px) {
    .side {
        width: 100%;
        left: 0;
    }
}

span.multiselect-native-select {
    position: relative;
}

    span.multiselect-native-select select {
        border: 0 !important;
        clip: rect(0 0 0 0) !important;
        height: 1px !important;
        margin: -1px -1px -1px -3px !important;
        overflow: hidden !important;
        padding: 0 !important;
        position: absolute !important;
        width: 1px !important;
        left: 50%;
        top: 30px;
    }

.multiselect.dropdown-toggle:after {
    display: none;
}

.multiselect-container {
    position: absolute;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

    .multiselect-container .multiselect-reset .input-group {
        width: 93%;
    }

    .multiselect-container .multiselect-filter > .fa-search {
        z-index: 1;
        padding-left: 0.75rem;
    }

    .multiselect-container .multiselect-filter > input.multiselect-search {
        border: none;
        border-bottom: 1px solid lightgrey;
        padding-left: 2rem;
        margin-left: -1.625rem;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
    }

        .multiselect-container .multiselect-filter > input.multiselect-search:focus {
            border-bottom-right-radius: 0.25rem;
            border-bottom-left-radius: 0.25rem;
        }

    .multiselect-container .multiselect-filter > .multiselect-moz-clear-filter {
        margin-left: -1.5rem;
        display: none;
    }

    .multiselect-container .multiselect-option.multiselect-group-option-indented {
        padding-left: 1.75rem;
    }

    .multiselect-container .multiselect-option,
    .multiselect-container .multiselect-group,
    .multiselect-container .multiselect-all {
        padding: 0.25rem 0.25rem 0.25rem 0.75rem;
    }

        .multiselect-container .multiselect-option.dropdown-item,
        .multiselect-container .multiselect-group.dropdown-item,
        .multiselect-container .multiselect-all.dropdown-item,
        .multiselect-container .multiselect-option.dropdown-toggle,
        .multiselect-container .multiselect-group.dropdown-toggle,
        .multiselect-container .multiselect-all.dropdown-toggle {
            cursor: pointer;
        }

        .multiselect-container .multiselect-option .form-check-label,
        .multiselect-container .multiselect-group .form-check-label,
        .multiselect-container .multiselect-all .form-check-label {
            cursor: pointer;
        }

        .multiselect-container .multiselect-option.active:not(.multiselect-active-item-fallback),
        .multiselect-container .multiselect-group.active:not(.multiselect-active-item-fallback),
        .multiselect-container .multiselect-all.active:not(.multiselect-active-item-fallback),
        .multiselect-container .multiselect-option:not(.multiselect-active-item-fallback):active,
        .multiselect-container .multiselect-group:not(.multiselect-active-item-fallback):active,
        .multiselect-container .multiselect-all:not(.multiselect-active-item-fallback):active {
            background-color: lightgrey;
            color: black;
        }

        .multiselect-container .multiselect-option .form-check,
        .multiselect-container .multiselect-group .form-check,
        .multiselect-container .multiselect-all .form-check {
            padding: 0 5px 0 20px;
        }

        .multiselect-container .multiselect-option:focus,
        .multiselect-container .multiselect-group:focus,
        .multiselect-container .multiselect-all:focus {
            outline: none;
        }

.form-inline .multiselect-container span.form-check {
    padding: 3px 20px 3px 40px;
}

.input-group.input-group-sm > .multiselect-native-select .multiselect {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
    padding-right: 1.75rem;
    height: calc(1.5em + 0.5rem + 2px);
}

.input-group > .multiselect-native-select {
    flex: 1 1 auto;
    width: 1%;
}

    .input-group > .multiselect-native-select > div.btn-group {
        width: 100%;
    }

    .input-group > .multiselect-native-select:not(:first-child) .multiselect {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    .input-group > .multiselect-native-select:not(:last-child) .multiselect {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }


.btn-smile {
    text-align: center !important;
    border: 1px solid #00447A !important;
    border-radius: 16px !important;
    line-height: 10px;
    overflow: auto;
    display: block;
    color: #00447A;
    cursor: pointer
}

    .btn-smile.selected {
        display: block;
        background-color: #00355F;
        color: #ffffff !important;
        height: inherit;
        cursor: pointer
    }

.fa-thumbs-o-up {
    opacity: 0;
    width: 30px;
    height: 30px;
    position: absolute;
}

.emoji0 {
    animation-name: emoji0;
    animation-duration: 1.3s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
}

.emoji1 {
    animation-name: emoji1;
    animation-duration: 1.3s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
}

.emoji2 {
    animation-name: emoji2;
    animation-duration: 1.3s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
}

.emoji3 {
    animation-name: emoji3;
    animation-duration: 1.3s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
}

.emoji4 {
    animation-name: emoji4;
    animation-duration: 1.3s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
}

.emoji5 {
    animation-name: emoji5;
    animation-duration: 1.3s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
}

.fa-thumbs-o-up0 {
    left: calc(50% - 10px);
    top: 10px;
}

@keyframes emoji0 {
    0% {
        opacity: 1;
        left: calc(50% - 10px);
        top: 10px;
    }

    100% {
        opacity: 0;
        left: calc(50% - 10px);
        top: -220px;
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
    }
}

.fa-thumbs-o-up1 {
    left: calc(50% - 10px);
    top: 10px;
}

@keyframes emoji1 {
    0% {
        opacity: 1;
        left: calc(50% - 10px);
        top: 90px;
    }

    100% {
        opacity: 0;
        left: calc(50% - 10px);
        top: -200px;
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
    }
}

.fa-thumbs-o-up2 {
    left: calc(50% + 20px);
    top: 10px;
}

@keyframes emoji2 {
    0% {
        opacity: 1;
        left: calc(50% + 20px);
        top: 90px;
    }

    100% {
        opacity: 0;
        left: calc(50% + 20px);
        top: -240px;
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
    }
}

.fa-thumbs-o-up3 {
    left: calc(50% - 20px);
    top: 10px;
}

@keyframes emoji3 {
    0% {
        opacity: 1;
        left: calc(50% - 20px);
        top: 70px;
    }

    100% {
        opacity: 0;
        left: calc(50% - 20px);
        top: -240px;
        transform: rotate(-360deg);
        -webkit-transform: rotate(-360deg);
        -moz-transform: rotate(-360deg);
    }
}

.fa-thumbs-o-up4 {
    left: calc(50% + 40px);
    top: 30px;
}

@keyframes emoji4 {
    0% {
        opacity: 1;
        left: calc(50% + 40px);
        top: 30px;
    }

    100% {
        opacity: 0;
        left: calc(50% + 40px);
        top: -240px;
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
    }
}

.fa-thumbs-o-up5 {
    left: calc(50% - 50px);
    top: 50px;
}

@keyframes emoji5 {
    0% {
        opacity: 1;
        left: calc(50% - 50px);
        top: 50px;
    }

    100% {
        opacity: 0;
        left: calc(50% - 50px);
        top: -240px;
        transform: rotate(-360deg);
        -webkit-transform: rotate(-360deg);
        -moz-transform: rotate(-360deg);
    }
}

/********************************************/
/********************************************/
@media (min-width: 992px) {
    .mt-lg-n15 {
        margin-top: -160px !important;
    }
}

.facebox_overlayBG {
    background-color: #000;
    z-index: 998;
}
/* Test Sponsorship style start*/
.buttonprint {
    background-image: url("");
    width: 64px !important;
    height: 38px;
    font-family: Tahoma;
    font-size: 12px;
    color: #666666;
    text-align: right;
}

.img-profile {
    border: 5px solid #fff !important;
    width: 150px;
    height: 150px;
    background-color: #fff !important;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

    .img-profile img {
        width: 100%;
        min-height: 150px;
    }

.border-gray-b {
    border-bottom: 1px solid #e7e7e7 !important;
    border-bottom-width: 1px !important;
    border-bottom-style: solid !important;
    border-bottom-color: rgb(231, 231, 231) !important;
}

.line-h-10 {
    line-height: 44px;
}

.timeline {
    list-style: none;
    position: relative;
}

    .timeline:before {
        top: 0;
        bottom: 0;
    }

    .timeline > li {
        position: relative;
        float: right;
        width: 86px;
        margin: 0 4px;
    }

        .timeline > li a {
            max-height: 100px;
            overflow: hidden;
            text-align: center;
        }

        .timeline > li p {
            width: 100%;
            max-height: 85px;
            overflow: hidden;
            text-align: center;
            border-radius: 50%;
            border: 1px solid #9F0B56;
        }

            .timeline > li p img {
                border-radius: 50%;
                border: 2px solid #fff;
                max-height: 85px;
                min-height: 85px;
            }

        .timeline > li:before, .timeline > li:after {
            content: " ";
            display: table;
        }

        .timeline > li:after {
            clear: both;
        }

        .timeline > li:before, .timeline > li:after {
            content: " ";
            display: table;
        }

        .timeline > li:after {
            clear: both;
        }

        .timeline > li > .timeline-panel {
            padding: 10px;
            position: relative;
        }


        .timeline > li > .timeline-badge {
            color: #fff;
            width: 10px;
            height: 10px;
            line-height: 50px;
            font-size: 1.1em;
            text-align: center;
            position: absolute;
            top: 16px;
            left: 51.5%;
            margin-left: -8px;
            background-color: #00447A;
            z-index: 100;
            border-radius: 50%
        }

        .timeline > li.timeline-inverted > .timeline-panel {
            float: right;
            max-height: 150px;
            overflow: hidden
        }

            .timeline > li.timeline-inverted > .timeline-panel:before {
                border-left-width: 0;
                border-right-width: 15px;
                left: -15px;
                right: auto;
            }

            .timeline > li.timeline-inverted > .timeline-panel:after {
                border-left-width: 0;
                border-right-width: 14px;
                left: -14px;
                right: auto;
            }

.timeline-panel a img {
    width: 100%;
}

.timeline-badge.primary {
    background-color: #2e6da4 !important;
}

.timeline-badge.success {
    background-color: #3f903f !important;
}

.timeline-badge.warning {
    background-color: #f0ad4e !important;
}

.timeline-badge.danger {
    background-color: #d9534f !important;
}

.timeline-badge.info {
    background-color: #5bc0de !important;
}

.timeline-title {
    font-size: 14px;
}

.timeline-body > p, .timeline-body > ul {
    margin-bottom: 0;
}

    .timeline-body > p + p {
        margin-top: 5px;
    }
/*.reportTextContainer {
    width: 550px;
    height: 2px;
    position: relative;
    left: 45px;
    top: -55px;
}

.reportText {
    float: left;
    width: 10px;
    height: 10px;
    position: relative;
    top: -4px;
    margin-right: 100px;
}

.reportCircle {
    float: left;
    width: 10px;
    height: 10px;
    background: black;
    border-radius: 50%;
    position: relative;
    top: -4px;
    margin-right: 100px;
}

.reportCircle.active{
    background: green;
}

.reportCircle.current{
    background: red;
}

.reportCircle.pending{
    background: blue;
}

.reportCircleRow {
    width: 730px;
    height: 2px;
    position: relative;
    top: 5px;
}

.reportCircleContainer {
    margin: 50px;
    width: 630px;
    height: 25px;
    overflow: hidden;
}

.reportLine {
    position: absolute;
    width: 110px;
    border-top: 2px solid gray;
}*/
.reportLine.active {
    border-top: 2px solid green;
}

.border-gray {
    border: 1px solid #eee;
}

.gallerythumbinner {
    margin-bottom: 0px;
    display: block;
    max-height: 130px;
    border-radius: 8px;
    overflow: hidden;
    margin: 20px auto;
}

.margin-8-left {
    margin-left: 8px;
}

.right-1-percent {
    right: 1%;
}

.right-5-percent-En_only {
    right: 5%;
}

.right-5-percent {
    right: 5%;
}

.right-15-percent {
    right: 15%;
}

.padding-line-projectphases {
    padding-left: 8px;
}

.green-first-element-line {
    background: #43C0B9;
    width: 5px;
    height: 25px;
    margin-right: 100%;
}

.pink-mid-element-line {
    background: #E00570;
    width: 5px;
    height: 25px;
    margin-right: 100%;
}

.grey-last-element-line {
    background: #888;
    width: 5px;
    height: 25px;
    margin-right: 100%;
}

.projectphases-firstelement {
    background: #43C0B9;
    height: 5px;
    margin-top: 5px;
    width: 51%;
}

.projectphases-lastelement {
    background: #43C0B9;
    height: 5px;
    margin-top: 5px;
    width: 50%;
}

.projectphases-element {
    background: #43C0B9;
    height: 5px;
    margin-top: 5px;
    width: 102%;
}

.right-15 {
    right: 15px;
}

@media (min-width:575px) {

    .right-5-percent-xs {
        right: 5%;
    }

    .projectphases-firstelement {
        background: #43C0B9;
        height: 5px;
        margin-top: 5px;
        width: 51%;
        margin-left: 50%;
    }

    .projectphases-lastelement {
        background: #43C0B9;
        height: 5px;
        margin-top: 5px;
        width: 50%;
    }

    .projectphases-element {
        background: #43C0B9;
        height: 5px;
        margin-top: 5px;
        width: 102%;
    }
}
/* Test Sponsorship style end */
.green-download-button {
    border-radius: 50%;
    background-color: #43C0B9;
    width: 40px;
    height: 40px;
    position: absolute;
    right: -10px;
    top: 10px;
}

.padding-botton-85 {
    padding-bottom: 85px;
}

.padding-db-error {
    padding-top: 100px;
}

@media (min-width:575px) {
    .padding-db-error {
        padding-top: 240px;
    }
}

.lb-style-custom .lb-like, .lb-style-custom .lb-dislike {
    background-color: #fafafa;
    border: 1px solid #c6c6c6;
    color: #555;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 4px;
    border-radius: 10px;
    padding: 0 20px;
    width: 22.5%;
    margin: 0 1%;
    height: 78px !important;
}

.lb-style-custom .lb-count {
    border-left: 0;
    color: #000;
    height: auto;
    top: 0;
    font-family: Arial,sans-serif;
    padding-left: 2px;
    padding-right: 6px;
    display: block !important;
    margin-top: -26px;
    font-size: 12px !important;
}

.lb-style-custom .lb-like-icon, .lb-style-custom .lb-dislike-icon {
    height: auto;
    width: auto;
    vertical-align: middle;
    font-size: 14px;
    float: right;
}

.lb-style-custom .lb-like-label, .lb-style-custom .lb-dislike-label {
    color: #555;
    font-family: 'Noto Kufi Arabic' !important;
}

@media (max-width:768px) {
    .lb-style-custom .lb-like, .lb-style-custom .lb-dislike {
        width: 50%;
        padding: 0
    }
}

.dalNavActive .active {
    border: 1px solid #9F0B56;
}

.popup {
    position: relative;
    display: inline-block;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    /* The actual popup */
    .popup .popuptext {
        visibility: hidden;
        position: relative;
        width: 300px;
        background-color: #555;
        text-align: center;
        border-radius: 6px;
        padding: 8px 0;
        position: absolute;
        z-index: 1;
        bottom: 125%;
        left: -150%;
        margin-left: -80px;
        z-index: 100;
    }

        /* Popup arrow */
        .popup .popuptext::after {
            content: "";
            position: absolute;
            top: 100%;
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: #555 transparent transparent transparent;
        }

.popupname.popup .popuptext {
    height: 325px;
    bottom: 0%;
    top: 0%;
    left: 0%;
    margin-left: 110%;
}

.notespopup.popup .popuptext {
    height: 400px;
    bottom: 87%;
}



/* Toggle this class - hide and show the popup */
.popup .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s;
}

.notesIcon {
    right: 35px;
    bottom: 20px;
}
/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.height-450-report .tabs {
    height: 450px
}

.white-border {
    border: 1px solid #ffffff;
    box-shadow: 0px 4px 8px #A8177533;
    border: 1px solid #FFFFFF;
    border-radius: 12px;
    opacity: 1;
}

.annual-report-icon-width {
    width: 220px;
}

.annual-year-text {
    top: 38%;
    left: 49%;
    transform: translate(-50%, -50%);
    z-index: 2;
}


.annualreport-element {
    background: #FFF;
    height: 5px;
    margin-top: 5px;
    width: 100%;
}

.gold-color-report {
    color: #8D430B;
}

.plat-color-report {
    color: #4A6464;
}

.annual-h3 {
    font-size: 24px;
}

.annual-h4 {
    font-size: 18px;
}

.text-md-center {
    text-align: center;
}

.bg-pink-light {
    background-color: #F7E5EF;
}

.bg-blue-light {
    background-color: #ECF9F8;
}


.margin-left-5-percent {
    margin-left: 5%;
}

.font-40-report {
    font-size: 40px !important;
}

.blue-play:hover .icon-color-change-blue {
    filter: invert(0) sepia(0) saturate(0) hue-rotate(0deg) brightness(5);
}

.pink-play:hover .icon-color-change-pink {
    filter: invert(0) sepia(0) saturate(0) hue-rotate(0deg) brightness(5);
}

/* Responsive layout - makes a one column layout instead of a two-column layout */
@media (max-width: 767px) {
    .margin-left-5-percent {
        margin-left: 0px;
    }

    .font-40-report {
        font-size: 30px !important;
    }

    .float-none-xs {
        float: none !important;
    }

    .annual-h3 {
        font-size: 14px;
    }

    .annual-h4 {
        font-size: 11px;
    }

    .annual-year-text {
        top: 38%;
        left: 42%;
        transform: translate(-50%, -50%);
        z-index: 2;
    }

    .text-md-center {
        text-align: unset;
    }

    .annual-report-icon-width {
        width: 100%;
        max-width: 450px;
    }

    .annual-rate-icon {
        width: 64px;
        height: 64px;
        margin-left: -10px;
        z-index: 1;
        position: relative;
    }

    .popup .popuptext {
        visibility: hidden;
        width: 300px;
        background-color: #555;
        text-align: center;
        border-radius: 6px;
        padding: 8px 0;
        position: absolute;
        z-index: 1;
        bottom: 125%;
        left: -460%;
    }
        /* Popup arrow */
        .popup .popuptext::after {
            visibility: hidden;
        }

    /* Toggle this class - hide and show the popup */
    .popup .show {
        visibility: visible;
        -webkit-animation: fadeIn 1s;
        animation: fadeIn 1s;
    }


    .annualreport-element {
        position: absolute;
        background: #FFF;
        top: -30%;
        left: 45%;
        height: 100px;
        width: 5%;
    }
}


/* Form css in financial page, will edit*/

#multi-step-form-container {
    margin-top: 5rem;
}


.mx-auto {
    margin-left: auto;
    margin-right: auto;
}

.pl-0 {
    padding-left: 0;
}


.submit-btn {
    border: 1px solid #0e9594;
    background-color: #0e9594;
}

.mt-3 {
    margin-top: 2rem;
}

.d-none {
    display: none;
}

.form-step {
}

.font-normal {
    font-weight: normal;
}

ul.form-stepper {
    counter-reset: section;
    margin-bottom: 3rem;
}

    ul.form-stepper .form-stepper-circle {
        position: relative;
    }

        ul.form-stepper .form-stepper-circle span {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translateY(-50%) translateX(-50%);
        }

.form-stepper-horizontal {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-width: 580px;
}

ul.form-stepper > li:not(:last-of-type) {
    margin-bottom: 0.625rem;
    -webkit-transition: margin-bottom 0.4s;
    -o-transition: margin-bottom 0.4s;
    transition: margin-bottom 0.4s;
}

.form-stepper-horizontal > li:not(:last-of-type) {
    margin-bottom: 0 !important;
}

.form-stepper-horizontal li {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

    .form-stepper-horizontal li:not(:last-child):after {
        position: relative;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        height: 5px;
        content: "";
        top: 32%;
    }

    .form-stepper-horizontal li:after {
        background-color: #dee2e6;
    }

    .form-stepper-horizontal li.form-stepper-completed:after {
        background-color: #4da3ff;
    }

    .form-stepper-horizontal li:last-child {
        flex: unset;
    }

ul.form-stepper li a .form-stepper-circle {
    display: inline-block;
    width: 40px;
    height: 40px;
    margin-right: 0;
    line-height: 1.7rem;
    text-align: center;
    background: rgba(0, 0, 0, 0.38);
    border-radius: 50%;
}

.form-stepper .form-stepper-active .form-stepper-circle {
    background-color: #D1E6FF !important;
    color: #000;
    border: 1px solid #A2CCF6;
}

.form-stepper .form-stepper-active .label {
    color: #D1E6FF !important;
}

.form-stepper .form-stepper-active .form-stepper-circle:hover {
    background-color: #D1E6FF !important;
    color: #000 !important;
    border: 1px solid #A2CCF6;
}

.form-stepper .form-stepper-unfinished .form-stepper-circle {
    background-color: #FFFFFF;
}

.form-stepper .form-stepper-completed .form-stepper-circle {
    background-color: #9F0B56 !important;
    color: #fff;
}

.form-stepper .form-stepper-completed .label {
    color: #9F0B56 !important;
}

.form-stepper .form-stepper-completed .form-stepper-circle:hover {
    background-color: #590630 !important;
    color: #fff !important;
}

.form-stepper .form-stepper-active span.text-muted {
    color: #000 !important;
}

.form-stepper .form-stepper-completed span.text-muted {
    color: #fff !important;
}

.form-stepper .label {
    font-size: 1rem;
    margin-top: 0.5rem;
}

.form-stepper a {
    cursor: default;
}

.office_radio [type=radio].QC_radio + label:before, [type=radio].QC_radio + label:after {
    border-color: #B10C5F !important;
    border-width: 3px;
}

.carousel-control-prev {
    position: absolute;
    top: 70px;
    right: 215px;
    z-index: 5;
    display: inline-block;
    font-size: 34px;
    color: #fff;
    text-align: center;
    opacity: 0.5;
}

.carousel-control-next {
    position: absolute;
    top: 70px;
    right: 140px;
    z-index: 5;
    display: inline-block;
    font-size: 34px;
    color: #fff;
    text-align: center;
    opacity: 0.5;
}

.leftLst {
    position: absolute;
    top: 35px;
    right: 175px;
    z-index: 5;
    display: inline-block;
    font-size: 34px;
    color: #fff;
    text-align: center;
    opacity: 0.5;
}

.rightLst {
    position: absolute;
    top: 35px;
    right: 110px;
    z-index: 5;
    display: inline-block;
    font-size: 34px;
    color: #fff;
    text-align: center;
    opacity: 0.5;
}

.leftKaramaButton {
    position: absolute;
    top: 517px;
    left: 0;
    z-index: 5;
    display: inline-block;
    font-size: 34px;
    color: #fff;
    text-align: center;
    opacity: 0.5;
}

.rightKaramaButton {
    position: absolute;
    top: 517px;
    left: 75%;
    z-index: 5;
    display: inline-block;
    font-size: 34px;
    color: #fff;
    text-align: center;
    opacity: 0.5;
}

.leftKGallery {
    position: absolute;
    top: 484px;
    left: 0;
    z-index: 5;
    display: inline-block;
    font-size: 34px;
    color: #fff;
    text-align: center;
    opacity: 0.5;
}

.rightKGallery {
    position: absolute;
    top: 484px;
    left: 75%;
    z-index: 5;
    display: inline-block;
    font-size: 34px;
    color: #fff;
    text-align: center;
    opacity: 0.5;
}


.MultiCarousel {
    float: left;
    padding: 15px;
    width: 100%;
    position: relative;
}

    .MultiCarousel .MultiCarousel-inner {
        transition: 1s ease all;
        float: left;
    }

        .MultiCarousel .MultiCarousel-inner .item {
            float: left;
        }

.statsgallery #msd {
    height: auto;
}

.statsgallery ::-webkit-scrollbar {
    width: 0;
    height: 0;
    background: transparent;
}

.font-stats-64 {
    font-size: 64px;
}

.font-stats-56-md {
    font-size: 24px;
}

.map-height-stats {
    height: 220px;
}

.project-share {
    position: fixed;
    right: 15px;
    bottom: 160px;
    /*margin-top: -60px;*/
}

@media (min-width: 992px) {
    .project-share {
        right: 25%;
    }
}

@media (min-width: 768px) {

    .border-right-md-gray {
        border-left: 1px solid #D7DADF;
        border-right: none;
    }

    .project-share {
        /*margin-top: -180px;*/
        left: 70%;
    }

    .map-height-stats {
        height: 900px;
    }

    .font-stats-64-md {
        font-size: 64px;
    }

    .font-stats-56-md {
        font-size: 56px;
    }

    .carousel-control-next {
        right: 110px;
        top: -10px;
    }

    .carousel-control-prev {
        top: -10px;
        right: 175px;
    }
}

.stats-banner-bg-mobile {
    width: 100%;
    height: 420px;
    background-image: url("");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.stats-banner-bg {
    width: 100%;
    height: 900px;
    background-image: url("");
    background-position: center right;
    background-size: contain;
    background-repeat: no-repeat;
}

.humanitarian .card {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: 0.25rem;
}

.humanitarian .rounded-xl {
    border-radius: 0.78rem;
}

.humanitarian .shadow {
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}

.humanitarian .card-body {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-height: 1px;
    padding: 1.25rem;
}

.humanitarian .rounded-xl {
    border-radius: 0.78rem;
}

.humanitarian .d-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
}

.humanitarian .text-secondary {
    color: #5196A5 !important;
}

.humanitarian .material-icons {
    font-family: 'Material Icons';
    font-weight: 400;
    font-style: normal;
    font-size: 24px;
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
}


/* Bootstrap Override */
.humanitarian strong.h2 {
    font-weight: bold;
}
/* Navbar White Background */

.humanitarian .hj-home-banner, .hj-inner-banner {
    padding-top: 0;
    padding-bottom: 0;
    background-repeat: no-repeat;
    background-size: cover;
}

    .humanitarian .hj-home-banner h1 {
        font-size: 3.2rem;
    }

    .humanitarian .hj-home-banner p.disc {
        font-size: 1.2rem;
    }

.humanitarian .fas.fa-chevron-left.dark {
}

.humanitarian .text-primary {
    color: #F25041 !important;
}

.humanitarian .grayscale-img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

.humanitarian .partners > a > img {
    vertical-align: top;
    max-width: 53px;
    max-height: 53px;
}

.humanitarian section, .section, section.section {
    padding: 100px 0;
}

.humanitarian .border-2 {
    border-width: 2px !important;
}

.humanitarian .shadow {
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}

.humanitarian .item {
    text-align: center;
}

.humanitarian .shapeSubtraction {
    background-image: url("");
    background-repeat: no-repeat;
    height: 73px;
    background-size: cover;
    background-position: center;
    margin-bottom: -4px;
}

.humanitarian .curveSubtraction {
    background-image: url("");
    background-repeat: no-repeat;
    height: 73px;
    background-size: cover;
    background-position: center;
    margin-bottom: -1px;
}

.humanitarian .curveSubtractionUp {
    background-image: url("");
    background-repeat: no-repeat;
    height: 167px;
    background-size: cover;
    background-position: center;
    margin-bottom: -1px;
}

.humanitarian .curveSubtractionBottom {
    background-image: url("");
    background-repeat: no-repeat;
    height: 73px;
    background-size: cover;
    background-position: center;
    margin-bottom: -1px;
}

.humanitarian .curveSubtractionTop {
    background-image: url("");
    background-repeat: no-repeat;
    height: 73px;
    background-size: cover;
    background-position: center;
    margin-bottom: -1px;
}

@media (min-width: 1200px) {
    .humanitarian .shapeSubtraction {
        background-image: url("");
    }
}

@media (min-width: 1200px) {
    .humanitarian .shapeSubtractionUp {
        background-image: url("");
    }
}

@media (min-width: 1200px) {
    .humanitarian .curveSubtractionTop {
        background-image: url("");
        margin-bottom: 1px;
    }
}

@media (min-width: 1200px) {
    .humanitarian .curveSubtractionBottom {
        background-image: url("");
        margin-bottom: 1px;
    }
}

@media (min-width: 1200px) {
    .humanitarian .curveSubtraction {
        background-image: url("");
        margin-bottom: 1px;
    }
}

@media (min-width: 1200px) {
    .humanitarian .curveSubtractionUp {
        background-image: url("");
        margin-bottom: 1px;
    }
}

.humanitarian .faq {
    background-color: #FAF9F7;
    overflow: hidden;
}

.humanitarian .rounded-left-0 {
    border-radius: .78rem;
}

.humanitarian .border-primary {
    border-color: #F25041 !important;
}

.humanitarian .border-secondary {
    border-color: #5196A5 !important;
}

.humanitarian .mb-10, .my-10 {
    margin-bottom: 10px;
}

.humanitarian .mb-15, .my-15 {
    margin-bottom: 15px;
}

.humanitarian .mb-20, .my-20 {
    margin-bottom: 20px;
}

.humanitarian .mb-30, .my-30 {
    margin-bottom: 30px;
}

.humanitarian .mb-40, .my-40 {
    margin-bottom: 40px;
}

.humanitarian .mb-50, .my-50 {
    margin-bottom: 50px;
}

.humanitarian .mb-100, .my-100 {
    margin-bottom: 100px;
}

.humanitarian .mt-10, .my-10 {
    margin-top: 10px;
}

.humanitarian .mt-20, .my-20 {
    margin-top: 20px;
}

.humanitarian .mt-15, .my-15 {
    margin-top: 15px;
}

.humanitarian .mt-20, .my-20 {
    margin-top: 20px;
}

.humanitarian .mt-30, .my-30 {
    margin-top: 30px;
}

.humanitarian .mt-40, .my-40 {
    margin-top: 40px;
}

.humanitarian .mt-50, .my-50 {
    margin-top: 50px;
}

.humanitarian .mt-100, .my-100 {
    margin-top: 100px;
}

.humanitarian .mt-n100, .my-n100 {
    margin-top: -100px;
}

.humanitarian .ml-10, .mx-10 {
    margin-left: 10px;
}

.humanitarian .ml-5, .mx-5 {
    margin-left: 5px;
}

.humanitarian .ml-15, .mx-15 {
    margin-left: 15px;
}

.humanitarian .ml-20, .mx-20 {
    margin-left: 20px;
}

.humanitarian .ml-30, .mx-30 {
    margin-left: 30px;
}

.humanitarian .ml-40, .mx-40 {
    margin-left: 40px;
}

.humanitarian .ml-50, .mx-50 {
    margin-left: 50px;
}

.humanitarian .mr-10, .mx-10 {
    margin-right: 10px;
}

.humanitarian .mr-5, .mx-5 {
    margin-right: 5px;
}

.humanitarian .mr-15, .mx-15 {
    margin-right: 15px;
}

.humanitarian .mr-20, .mx-20 {
    margin-right: 20px;
}

.humanitarian .mr-30, .mx-30 {
    margin-right: 30px;
}

.humanitarian .mr-40, .mx-40 {
    margin-right: 40px;
}

.humanitarian .ml-50, .mx-50 {
    margin-right: 50px;
}

.humanitarian .pb-10, .py-10 {
    padding-bottom: 10px;
}

.humanitarian .pb-15, .py-15 {
    padding-bottom: 15px;
}

.humanitarian .pb-20, .py-20 {
    padding-bottom: 20px;
}

.humanitarian .pb-30, .py-30 {
    padding-bottom: 30px;
}

.humanitarian .pb-40, .py-40 {
    padding-bottom: 40px;
}

.humanitarian .pb-50, .py-50 {
    padding-bottom: 50px;
}

.humanitarian .pt-10, .py-10 {
    padding-top: 10px;
}

.humanitarian .pt-15, .py-15 {
    padding-top: 15px;
}

.humanitarian .pt-20, .py-20 {
    padding-top: 20px;
}

.humanitarian .pt-30, .py-30 {
    padding-top: 30px;
}

.humanitarian.pt-40, .py-40 {
    padding-top: 40px;
}

.humanitarian .pt-50, .py-50 {
    padding-top: 50px;
}

.humanitarian .pl-10, .px-10 {
    padding-left: 10px;
}

.humanitarian .pl-15, .px-15 {
    padding-left: 15px;
}

.humanitarian .pl-20, .px-20 {
    padding-left: 20px;
}

.humanitarian .pl-30, .px-30 {
    padding-left: 30px;
}

.humanitarian .pl-40, .px-40 {
    padding-left: 40px;
}

.humanitarian .pl-50, .px-50 {
    padding-left: 50px;
}

.humanitarian .pr-10, .px-10 {
    padding-right: 10px;
}

.humanitarian .pr-15, .px-15 {
    padding-right: 15px;
}

.humanitarian .pr-20, .px-20 {
    padding-right: 20px;
}

.humanitarian .pr-30, .px-30 {
    padding-right: 30px;
}

.humanitarian .pr-40, .px-40 {
    padding-right: 40px;
}

.humanitarian .pr-50, .px-50 {
    padding-right: 50px;
}

.humanitarian .text-secondary {
    color: #5196A5 !important;
}

.humanitarian.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #F25041 !important;
    font-weight: 700;
    background-color: #fff;
    border-bottom: 5px solid #F25041 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
}

.humanitarian .nav-tabs .nav-link {
    /*border: 5px solid transparent;*/
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
}

.humanitarian .rounded-xl {
    border-radius: .78rem;
}

.humanitarian .rounded-xl-left {
    border-top-left-radius: .78rem !important;
    border-bottom-left-radius: .78rem !important;
}

.humanitarian .rounded-xl-right {
    border-top-right-radius: .78rem !important;
    border-bottom-right-radius: .78rem !important;
}

.humanitarian .primary-gradiant {
    background: linear-gradient(356deg, rgba(242,80,65,1) 35%, rgba(213,142,102,1));
}

.humanitarian .carousel-control-prev-icon.border.rounded-circle {
    width: 44px;
    height: 44px;
    line-height: 40px;
    box-shadow: .0rem .2rem .6rem rgba(242,80,65,.20) !important;
    text-align: center;
}

.humanitarian .carousel-control-next-icon.border.rounded-circle {
    width: 44px;
    height: 44px;
    line-height: 40px;
    box-shadow: .0rem .2rem .6rem rgba(242,80,65,.20) !important;
    text-align: center;
}

.humanitarian .hr-white {
    border-top: 1px solid rgba(233,233,233,.4);
}

.humanitarian b, strong {
    font-weight: bold;
}

.humanitarian .form-control {
    height: calc(1.5em + .75rem + 2px);
    padding: .375rem .75rem;
    font-weight: 400;
    line-height: 1.5;
    color: #AAA;
    background-clip: padding-box;
    border: 1px solid #AAA;
    border-radius: 1.3rem;
}

@media (min-width: 1200px) {
    .align-items-xl-center {
        -ms-flex-align: center !important;
        align-items: center !important;
    }

    .d-xl-flex {
        display: -ms-flexbox !important;
        display: flex !important;
    }
}

.humanitarian .btn-primary-humanitarian {
    background-color: #F25041;
    border-color: #F25041;
    color: #fff;
}

.humanitarian .btn {
    border-radius: 1.5rem !important;
    font-size: 14px;
    height: 44px;
}

.humanitarian .rounded-pill {
    border-radius: 50rem !important;
}

.humanitarian .bg-light {
    background-color: #f8f9fa !important;
}

.humanitarian .btn-outline-primary:hover {
    color: #FFF;
    background-color: #E66950;
    border-color: #E66950;
}

.humanitarian .btn-outline-primary {
    color: #E66950;
    border-color: #E66950;
    background-color: #fff;
}

.humanitarian .ml-3, .mx-3 {
    margin-left: 1rem !important;
}

.humanitarian .mt-1, .my-1 {
    margin-top: 0.25rem !important;
}

.humanitarian .mb-0, .my-0 {
    margin-bottom: 0 !important;
}

.humanitarian .mt-0 {
    margin-top: 0 !important;
}

.humanitarian .text-body {
    color: #212529 !important;
}

.humanitarian .small, small {
    font-size: 80%;
    font-weight: 400;
}

.humanitarian .card-header:first-child {
    border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0;
}

.humanitarian .card-header {
    margin-bottom: 0;
    background-color: rgba(0,0,0,.03);
}

.humanitarian .card-body {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-height: 1px;
    padding: 1.25rem;
}

.humanitarian .mr-3, .mx-3 {
    margin-right: 1rem !important;
}

@media (min-width: 768px) {
    .humanitarian .navbar-expand-md {
        -ms-flex-flow: row nowrap;
        flex-flow: row nowrap;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

        .humanitarian.navbar-expand-md > .container, .navbar-expand-md > .container-fluid, .navbar-expand-md > .container-lg, .navbar-expand-md > .container-md, .navbar-expand-md > .container-sm, .navbar-expand-md > .container-xl {
            -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
        }
}

.humanitarian .navbar {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: normal;
    padding: 0.5rem 1rem;
}

.humanitarian .pl-2, .px-2 {
    padding-left: 0.5rem !important;
}

.humanitarian .pr-2, .px-2 {
    padding-right: 0.5rem !important;
}

.humanitarian .ml-4, .mx-4 {
    margin-left: 1.5rem !important;
}

.humanitarian .mr-4, .mx-4 {
    margin-right: 1.5rem !important;
}

.humanitarian .navbar-brand {
    display: inline-block;
    padding-top: 0.3125rem;
    padding-bottom: 0.3125rem;
    margin-right: 1rem;
    font-size: 1.25rem;
    line-height: inherit;
    white-space: nowrap;
}

.humanitarian .navbar-nav {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}

.humanitarian .mr-auto, .mx-auto {
    margin-right: auto !important;
}

.humanitarian .footer-basic {
    padding: 60px 0 20px 0;
    color: #fff;
    background: linear-gradient(356deg, rgba(81,133,165,1) 35%, rgba(81,150,165,1));
}

    .humanitarian .footer-basic .copyrightHumanitarian {
        margin-top: 6px;
        text-align: center;
        color: #fff;
        margin-bottom: 0;
    }

@media (min-width: 300px) {
    .humanitarian .footer-basic .copyrightHumanitarian {
        text-align: left;
    }
}

@media (min-width: 768px) {
    .text-md-center {
        text-align: center !important;
    }

    .humanitarian .navbar {
        position: relative;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: 0.5rem 1rem;
    }
}

.humanitarian .mb-4, .my-4 {
    margin-bottom: 1.5rem !important;
}

.humanitarian .navbar-light .navbar-toggler-icon {
    background-image: url("")
}

.bg-pink-light-with-border {
    background-color: #F7E5EF;
    border: 1px solid #e00570;
}

.hero-video {
    height: 1080px;
}

    .hero-video > video {
        pointer-events: none;
        max-height: 1080px;
        z-index: -1;
        top: 36px;
    }

.overlay {
    position: absolute;
    top: 36px;
    left: 0;
    width: 100%;
    /*z-index: 1;*/
}

    .overlay:after {
        content: '';
        background: linear-gradient(to bottom, rgba(255, 255, 255, 0%), rgba(255, 255, 255, 100%));
        height: 1080px;
        width: 100%;
        position: absolute;
    }

.warmHearts_mainBG {
    margin-top: 125px;
}

.second-video-container:before {
    position: absolute;
    bottom: -50px;
    width: 1147px;
    height: 322px;
    background: transparent linear-gradient(0deg, #533A6D 0%, #524FA1 50%, #8B60A8 100%) 0% 0% no-repeat padding-box;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.15;
    filter: blur(100px);
}

.second-video {
    max-width: 724px;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.warmth_convoys_truck-container:after {
    position: absolute;
    top: 45%;
    left: -40%;
    width: 1147px;
    height: 250px;
    background: transparent url("") 0% 0% no-repeat padding-box;
    opacity: 1;
    filter: blur(20px);
}

.warmth_convoys_house-container:after {
    position: absolute;
    top: 41%;
    right: -38%;
    width: 972px;
    height: 255px;
    /* UI Properties */
    background: transparent linear-gradient(0deg, #ED1651 0%, #FDB933 100%) 0% 0% no-repeat padding-box;
    opacity: 0.12;
    filter: blur(50px);
}

.warmth_convoys_footerBG {
    padding-bottom: 300px;
}

    .warmth_convoys_footerBG:before {
        position: absolute;
        bottom: 0;
        left: calc(50% - 50vw);
        width: 100vw;
        height: 561px;
        background: transparent url("") 0% 0% no-repeat padding-box;
        opacity: 1;
        background-size: cover;
    }

.wh-heading-fs {
    font-size: 56px;
    line-height: 1.5;
}

@media (max-width: 767px) {
    .hero-video {
        height: 396px;
    }

        .hero-video > video {
            top: 62px;
            left: calc(50% - 430px);
            width: 860px;
        }

    .overlay {
        top: 62px;
    }

        .overlay:after {
            height: 396px;
        }

    .warmHearts_mainBG {
        margin-top: 0;
        margin-bottom: -50px;
        width: 100%;
    }

    .warmth_convoys_truck-container:after,
    .warmth_convoys_house-container:after {
        top: 15%;
    }

    .wh-heading-fs {
        font-size: 36px;
    }

    .warmth_convoys_footerBG {
        padding-bottom: 160px;
    }
}

.cxco-c-action__icon {
    height: calc(100% + 10px) !important;
    width: calc(100% + 10px) !important;
    border: 10px solid red;
}

style#default .cxco-c-action__icon {
    height: calc(100% + 10px) !important;
    width: calc(100% + 10px) !important;
    border: 10px solid red;
}

.number, .number-large {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin-right: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.7);
    font-size: 30px;
    font-weight: bold;
    background-color: #333;
    color: #e7e7e7;
}

.number {
    width: 37px;
    height: 44px;
    border-radius: 10px;
}

.number-large {
    width: 58px;
    height: 71px;
    border-radius: 12px;
}

@media (max-width: 767.98px) {
    .number, .number-large {
        font-size: 20px;
    }

    .number-large {
        width: 48px;
        height: 58px;
    }
}

.number-comma {
    display: inline-block;
    margin-right: 10px;
    line-height: 37px;
    font-size: 30px;
    font-weight: bold;
    color: #000;
}

@media (max-width: 650px) {
    .ramadan-counter .flip-clock__piece {
        width: 20% !important;
    }
}

.stats-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    /*z-index: 1;*/
}

    .stats-overlay:after {
        content: '';
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0%), rgba(0, 0, 0, 100%));
        height: 950px;
        width: 100%;
        position: absolute;
    }

.stats-map-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1;
    display: flex;
}

    .stats-map-overlay:after {
        content: '';
        background: #431730;
        height: 950px;
        width: 30%;
        position: absolute;
    }



/*.black-border-btn {
    background-color: #43C0B9;
    color: #FFF !important;
    height: 42px;*/
/*Override Bootstrap*/
/*display: inline-block;
    padding: 0 12px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 42px !important;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: none;
    border-radius: 10px !important;*/
/*Override Bootstrap END*/
/*}

.black-border-btn, .btn-default.black-border-btn, .btn-default[disabled].black-border-btn, .btn.black-border-btn {
    background-color: transparent;
    color: #000 !important;*/
/*Override Bootstrap*/
/*border: 1px solid #000;*/
/*Override Bootstrap END*/
/*}


    .black-border-btn:hover, .black-border-btn:active, .black-border-btn:focus, .btn.black-border-btn:hover, .btn.black-border-btn:active, .btn.black-border-btn:focus {
        background-color: #000 !important;
        color: #FFF !important;
    }*/



.stats-custom-atts {
    bottom: 23%;
    left: 5%;
}

.stats-custom-atts2 {
    z-index: 2;
    left: 3%
}

cxco-root .cxco .cxco-o-chat[data-layout=floating], .cxco-o-chat[data-layout=overlay], .cxco-o-chat[data-layout=floating][data-state~=open], .cxco-o-chat[data-layout=overlay][data-state~=open] {
    /*--cxco-z-index: 1000 !important;*/
    z-index: 1000 !important;
}
/*{*/
/*z-index: calc(var(--cxco-z-index) + 1100) !important;*/
/*height: 70vh;
}*/

.padding_button_custom {
    padding-left: 10px;
    padding-right: 10px;
}

/* Owl-Carousel-New */
/*.owl-carousel .owl-stage.owl-padding-left-none, .owl-carousel .owl-stage.owl-padding-left-none {
    padding-left: 0 !important;
}*/

.owl-carousel .owl-item img, .owl-carousel .owl-item img {
    display: inline !important;
}

.owl-theme .owl-nav [class*='owl-'] {
    background: white;
    border-radius: 50%;
    margin: 0;
}

.owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next {
    width: 56px;
    height: 56px;
    position: absolute;
    top: calc(50% - 28px);
    display: block !important;
    border: 1px solid #2D2D2D !important;
    background: white !important;
}

.owl-prev {
    left: 0;
}

.owl-next {
    right: 0;
}

@media (min-width: 1360px) {
    .owl-prev {
        left: -80px;
    }

    .owl-next {
        right: -80px;
    }
}

.owl-carousel.owl-main-projects .owl-nav .owl-prev {
    left: 20px;
}

.owl-carousel.owl-main-projects .owl-nav .owl-next {
    right: 500px;
}

.owl-carousel.owl-ramadan-banner .owl-nav .owl-prev {
    left: -80px;
}

.owl-carousel.owl-ramadan-banner .owl-nav .owl-next {
    right: 500px;
}

@media (min-width: 1320px) {
    .owl-carousel.owl-main-projects .owl-nav .owl-next {
        right: 450px;
    }

    .owl-carousel.owl-ramadan-banner .owl-nav .owl-next {
        right: 450px;
    }
}

@media (min-width: 1380px) {
    .owl-carousel.owl-main-projects .owl-nav .owl-next {
        right: 420px;
    }

    .owl-carousel.owl-ramadan-banner .owl-nav .owl-next {
        right: 420px;
    }
}

@media (min-width: 1420px) {
    .owl-carousel.owl-main-projects .owl-nav .owl-next {
        right: 380px;
    }

    .owl-carousel.owl-ramadan-banner .owl-nav .owl-next {
        right: 380px;
    }
}

@media (min-width: 1500px) {
    .owl-carousel.owl-main-projects .owl-nav .owl-next {
        right: 320px;
    }

    .owl-carousel.owl-ramadan-banner .owl-nav .owl-next {
        right: 320px;
    }
}

@media (min-width: 1600px) {
    .owl-carousel.owl-main-projects .owl-nav .owl-next {
        right: 280px;
    }

    .owl-carousel.owl-ramadan-banner .owl-nav .owl-next {
        right: 280px;
    }
}

@media (min-width: 2000px) {
    .owl-carousel.owl-main-projects .owl-nav .owl-next {
        right: 30px;
    }

    .owl-carousel.owl-ramadan-banner .owl-nav .owl-next {
        right: 100px;
    }
}

.owl-prev i, .owl-next i,
.owl-prev span, .owl-next span {
    transform: scale(2);
    color: #2D2D2D;
    margin-right: 0;
    margin-left: 0;
}
/* End Owl-Carousel-New */

.background-yellow {
    background-color: #FDB933;
}

.campaign-section {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

    .campaign-section:before {
        display: block;
        content: '';
        background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, .1) 60%);
        height: 100%;
        width: 100%;
        /*position: fixed;*/
        top: 0;
    }

.QC_orange-bg-light {
    background: #f9e6ab;
    background-color: #f9e6ab;
}

.accordion-button {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    border: 0;
    background-color: transparent;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid rgba(0,0,0,.125);
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,border-radius .15s ease;
}

    .accordion-button:not(.collapsed)::after {
        background-image: url("");
        transform: rotate(-180deg);
    }

    .accordion-button::after {
        flex-shrink: 0;
        width: 2.25rem;
        height: 2.25rem;
        content: "";
        background-image: url("");
        background-repeat: no-repeat;
        background-size: 2.25rem;
        transition: transform .2s ease-in-out;
    }

label {
    display: inline-flex;
}

.sponsor-palestin {
    background: url("") no-repeat fixed bottom right;
    background-size: contain;
}

    .sponsor-palestin:after {
        content: '';
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        background: transparent linear-gradient(90deg, rgba(255,255,255, 100%) 0%, rgba(255,255,255, 0) 75%);
    }

.underline-vector {
    display: inline-block;
    position: relative;
}

    .underline-vector:after {
        content: '';
        background: url("");
        width: 210px;
        height: 14px;
        display: block;
        position: absolute;
        bottom: 0;
    }

@media (max-width: 767.98px) {
    .underline-vector:after {
        width: 140px;
        height: 9px;
    }
}

.font-48 {
    font-size: 48px;
}

.divider-gradient {
    background: transparent linear-gradient(270deg, #2D2D2D00 0%, #2D2D2D 50%, #72727200 100%) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(270deg, #2D2D2D00 0%, #2D2D2D 50%, #72727200 100%) 0% 0% no-repeat padding-box;
    opacity: 1;
}

.home-donation-cards {
    border-radius: 24px;
    padding: 10px;
}

.home-donation-cards_img {
    border-radius: 16px;
    height: 160px;
}

@media (max-width: 991px) {
    .home-donation-cards {
        border-radius: 16px;
        padding: 10px 10px 0 10px;
    }

    .home-donation-cards_img {
        border-radius: 12px;
        height: 140px;
    }
}

/*****************************************/
/* Flex Box And Others */
/*****************************************/
@media (max-width: 767px) {
    .justify-content-xs-center {
        justify-content: center;
    }

    .align-items-xs-center {
        align-items: center;
    }
}

.d-flow {
    display: flow-root;
}

.d-none {
    display: none;
}

.d-block, .block {
    display: block;
}

d-inline-block, .inline-block {
    display: inline-block;
}

.d-grid, .grid {
    display: grid;
}

.d-inline-grid, .inline-grid {
    display: inline-grid;
}

.d-contents {
    display: contents;
}

.d-inline-block {
    display: inline-block;
}

.d-inline-table {
    display: inline-table;
}

.d-flex {
    display: flex;
}

.d-inline-flex {
    display: inline-flex;
}

.flex-column {
    flex-direction: column;
}

.flex-column-reverse {
    flex-direction: column-reverse;
}

.flex-row {
    flex-direction: row;
}

.flex-row-reverse {
    flex-direction: row-reverse;
}

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

.justify-content-start {
    justify-content: flex-start;
}

.justify-content-end {
    justify-content: flex-end !important;
}

.justify-content-between {
    justify-content: space-between;
}

.justify-content-center {
    justify-content: center;
}

.justify-content-around {
    justify-content: space-around;
}

.justify-content-evenly {
    justify-content: space-evenly;
}

.justify-self-start {
    justify-self: flex-start;
}

.justify-self-end {
    justify-self: flex-end !important;
}

.justify-self-center {
    justify-self: center;
}

.align-items-center {
    align-items: center;
}

.align-items-start {
    align-items: start;
}

.align-items-end {
    align-items: end;
}

.align-items-baseline {
    align-items: baseline;
}

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

.align-content-start {
    align-content: start;
}

.align-content-end {
    align-content: end;
}

.align-content-baseline {
    align-content: baseline;
}

.align-self-start {
    align-self: start;
    align-self: self-start;
    align-self: flex-start;
}

.align-self-center {
    align-self: center;
}

.align-self-end {
    align-self: end;
    align-self: self-end;
    align-self: flex-end;
}

@media (min-width: 768px) {
    .padding-50-md-h {
        padding-left: 50px !important;
        padding-right: 50px !important;
    }

    .d-md-flex {
        display: flex;
    }

    .d-md-inline-flex {
        display: inline-flex;
    }

    .flex-md-column {
        flex-direction: column;
    }

    .flex-md-column-reverse {
        flex-direction: column-reverse;
    }

    .flex-md-row {
        flex-direction: row;
    }

    .flex-md-row-reverse {
        flex-direction: row-reverse;
    }

    .flex-md-nowrap {
        flex-wrap: nowrap !important;
    }

    .align-items-md-start {
        align-items: start;
    }

    .align-items-md-end {
        align-items: end;
    }

    .justify-content-md-start {
        justify-content: flex-start;
    }

    .justify-content-md-end {
        justify-content: flex-end;
    }

    .justify-content-md-between {
        justify-content: space-between;
    }

    .justify-content-md-center {
        justify-content: center;
    }

    .justify-content-md-around {
        justify-content: space-around;
    }

    .justify-content-md-evenly {
        justify-content: space-evenly;
    }
}

@media (min-width: 992px) {
    .d-lg-flex {
        display: flex;
    }

    .d-lg-inline-flex {
        display: inline-flex;
    }

    .flex-lg-column {
        flex-direction: column;
    }


    .flex-lg-column-reverse {
        flex-direction: column-reverse;
    }

    .flex-lg-row {
        flex-direction: row;
    }

    .flex-lg-row-reverse {
        flex-direction: row-reverse;
    }

    .justify-content-lg-start {
        justify-content: flex-start;
    }

    .justify-content-lg-end {
        justify-content: flex-end;
    }

    .justify-content-lg-between {
        justify-content: space-between;
    }

    .justify-content-lg-center {
        justify-content: center;
    }

    .justify-content-lg-around {
        justify-content: space-around;
    }

    .justify-content-lg-evenly {
        justify-content: space-evenly;
    }
}
/*****************************************/
/* Flex Box And Others End */
/*****************************************/

/****************************************/
/* Changes 24_OCT */
/****************************************/

@media (min-width: 992px) {
    /*@media (min-width: 992px) and (max-width:1199px) {*/
    .margin-50-top-md {
        margin-top: 50px;
    }

    .padding-30-h-md {
        padding-left: 30px;
        padding-right: 30px;
    }

    .padding-70-md-h {
        padding-left: 70px !important;
        padding-right: 70px !important;
    }

    .padding-0-bottom-md {
        padding-bottom: 0;
    }

    .padding-20-bottom-md {
        padding-bottom: 20px;
    }

    .padding-30-bottom-md {
        padding-bottom: 30px;
    }

    .text-center-md {
        text-align: center !important;
    }
}

@media (min-width: 1200px) {

    .text-center-lg {
        text-align: center !important;
    }

    .padding-none-lg {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .margin-0-top-lg {
        margin-top: 0;
    }

    .position-lg-fixed {
        position: fixed !important;
    }

    .position-lg-absolute {
        position: absolute !important;
    }

    .rounded-0-lg {
        border-radius: 0 !important;
    }
}

.fixed-donation-btn {
    position: relative;
}

@media(max-width: 575.999px) {
    .fixed-donation-btn {
        z-index: 50;
        width: 100%;
        position: fixed;
        bottom: 0;
    }

    .height-responsive {
        height: 300px;
    }
}

.height-responsive {
    height: 380px;
}

.cls-1 {
    fill: #000;
}

.cls-2, .cls-4 {
    fill: none;
}

.cls-2 {
    stroke: #000;
}

.cls-3 {
    stroke: none;
}

.share-icon2 {
    background-image: url("");
    height: 42px;
    width: 42px;
    background-repeat: no-repeat;
    position: absolute;
    z-index: 20;
    left: 10px;
    top: -45px;
}

/*    .share-icon2 {
        background-image: url(/Content/images/dall-logo-share.png);
        height: 35px;
        width: 186px;
        position: inherit;
        position: absolute;
        z-index: 10;
        -webkit-border-bottom-left-radius: 8px;
        -moz-border-radius-bottomleft: 8px;
        border-bottom-left-radius: 8px;
        -webkit-border-bottom-right-radius: 8px;
        -moz-border-radius-bottomright: 8px;
        border-bottom-right-radius: 8px;
        margin-top: -11px;
    }*/


.rq2 {
    background-color: #fff;
    height: 40px;
    border: 1px solid #eee;
    color: #777;
    font-size: 11px;
    margin-top: 10px;
    text-align: center;
}

/*@media(min-width: 992px) {
    .AmountChoiceInput {
        max-width: 150px;
    }
}*/

.ui-widget-content {
    border: 0px solid #ddd;
    background: none !important;
    background-color: transparent !important;
    color: #333;
}
/*Styles added by Fazlur*/
.margin-start-16 {
    margin-left: 0px !important;
    margin-right: 16px !important;
}

.QC_padding-top-section {
    padding: 40px 0 0 0;
}

@media(min-width:768px) {
    .QC_padding-top-section {
        padding: 40px 0 40px 0;
    }
}

@media(min-width:992px) {
    .col-offset-campaign-countries {
        margin-left: 39px;
        margin-right: 0;
    }
}

    @media(min-width:1200px) {
        .col-offset-campaign-countries {
            margin-left: 85px;
            margin-right: 0;
        }
    }