﻿/*menew.css*/
@font-face {
    font-family: "lyon";
    src: url("../fonts/Lyon/LyonArabicText-Regular.eot");
    src: url("../fonts/Lyon/LyonArabicText-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/Lyon/LyonArabicText-Regular.woff") format("woff"), url("../fonts/Lyon/LyonArabicText-Regular.woff2") format("woff2"), url("../fonts/Lyon/LyonArabicText-Regular.svg#SSTArabic-Bold") format("svg");
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "diodrom";
    src: url("../fonts/Diodrom/DiodrumArabic-Medium.eot");
    src: url("../fonts/Diodrom/DiodrumArabic-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/Diodrom/DiodrumArabic-Medium.woff2") format("woff2"), url("../fonts/Diodrom/DiodrumArabic-Medium.woff") format("woff"), url("../fonts/Diodrom/DiodrumArabic-Medium.svg#SSTArabic-Medium") format("svg");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "lyonbold";
    src: url("../fonts/Lyon/LyonArabicText-Bold.eot");
    src: url("../fonts/Lyon/LyonArabicText-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/Lyon/LyonArabicText-Bold.woff2") format("woff2"), url("../fonts/Lyon/LyonArabicText-Bold.woff") format("woff"), url("../fonts/Lyon/LyonArabicText-Bold.svg#SSTArabic-Medium") format("svg");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

body {
    font-family: "diodrom" !important;
    color: #43425D !important;
    background-color: #fff !important;
    min-height: 100vh;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "lyon" !important;
}

.header-menu .menu-nav > .menu-item > .menu-link .menu-text {
    color: #1AD9C7;
    font-weight: bold;
}

.btn.btn-primary.focus, .btn.btn-primary:focus, .btn.btn-primary:hover, .btn.btn-primary.active, .btn.btn-primary:active, .btn.btn-primary.active.focus, .btn.btn-primary.active:focus, .btn.btn-primary.active:hover, .btn.btn-primary:active.focus, .btn.btn-primary:active:focus, .btn.btn-primary:active:hover {
    background-color: #383838 !important;
    border-color: #383838 !important;
    color: #fff !important;
}

    .btn.btn-primary.focus, .btn.btn-primary:focus, .btn.btn-primary:hover, .btn.btn-primary.active, .btn.btn-primary:active, .btn.btn-primary.active.focus, .btn.btn-primary.active:focus, .btn.btn-primary.active:hover, .btn.btn-primary:active.focus, .btn.btn-primary:active:focus, .btn.btn-primary:active:hover {
        background-color: #666767 !important;
        border-color: #666767 !important;
        color: #fff !important;
    }

.btn.btn-primary {
    background-color: #1AD9C7 !important;
    border-color: #1AD9C7 !important;
}

    .btn.btn-primary:hover {
        background-color: #383838 !important;
        border-color: #383838 !important;
    }

.site-header-wrapper.pre-header {
    background-color: #383838 !important;
}

.nav .show > .nav-link, .nav .nav-link:hover:not(.disabled), .nav .nav-link.active {
    color: #1AD9C7 !important;
}

.footer.bg-white {
    background-color: #383838 !important;
    color: #fff;
}

.color-new a, .color-new span, .color-new i {
    color: #1AD9C7 !important;
}

.footer .nav-link, .footer .text-muted {
    color: #fff !important;
}

.btn.btn-primary.focus, .btn.btn-primary:focus, .btn.btn-primary:hover, .btn.btn-primary.active, .btn.btn-primary:active, .btn.btn-primary.active.focus, .btn.btn-primary.active:focus, .btn.btn-primary.active:hover, .btn.btn-primary:active.focus, .btn.btn-primary:active:focus, .btn.btn-primary:active:hover {
    background-color: #383838 !important;
    border-color: #383838 !important;
    color: #fff !important;
}

.rate-star:checked, .rate-star:hover {
    color: #1AD9C7 !important;
}

.radio > input:checked ~ span {
    background-color: #1AD9C7 !important;
}

.menu-text:hover {
    color: #383838 !important;
}
/*start scoller */
::-webkit-scrollbar {
    width: .7em;
}


::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px #383838;
}

::-webkit-scrollbar-thumb {
    background-color: #1AD9C7 !important;
}
/*end scoller */
.title-section:after {
    background: #1AD9C7 !important;
}



.sk-spinner-wave div {
    background-color: #1AD9C7 !important;
}
/*add 21/12/2022 */
.example-compact p {
    font-weight: 600;
}

.star-required {
    font-size: 30px !important;
    top: 14px !important;
}

.btn-primary.w-100 {
    padding-inline: 100px;
}

.btn {
    font-family: "diodrom" !important;
}

/*end 21/12/2022*/
/*menew.css*/



.laodingModal {
    display: block;
    position: fixed;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    z-index: 1050 !important;
    display: none;
    background-color: rgba(225, 225, 225, 0.95) !important;
    opacity: 0.9 !important;
}

.laodingModalLanguage {
    display: block;
    position: fixed;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    z-index: 1050 !important;
    display: none;
    background-color: #e2e2e2 !important;
    opacity: 1 !important;
}

.loadingPopup {
    z-index: 1053;
    position: fixed;
    background-color: transparent;
    padding: 20px;
    border-radius: 5px;
    width: 600px;
    left: calc(100% - (300px + 50%));
    top: calc(100% - 50%);
    display: none;
}

    .loadingPopup div {
        padding-top: 5px;
        text-align: center;
        font-size: 14px;
    }

.sk-spinner-wave.sk-spinner {
    margin: 0 auto;
    width: 50px;
    height: 50px;
    text-align: center;
    font-size: 10px;
    z-index: 1060 !important;
}

.sk-spinner-wave div {
    background-color: #0f192c;
    height: 100%;
    width: 6px;
    display: inline-block;
    -webkit-animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
    animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
}

.sk-spinner-wave .sk-rect2 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s;
}

.sk-spinner-wave .sk-rect3 {
    -webkit-animation-delay: -1s;
    animation-delay: -1s;
}

.sk-spinner-wave .sk-rect4 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}

.sk-spinner-wave .sk-rect5 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

@-webkit-keyframes sk-waveStretchDelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4);
        transform: scaleY(0.4);
    }

    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
}

@keyframes sk-waveStretchDelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4);
        transform: scaleY(0.4);
    }

    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
}

.Reqired {
    color: #B94A48;
    margin-top: 2px;
    color: #C10000;
    font-size: 0.9em;
    margin-top: -5px;
    padding: 0;
    font-weight: normal;
}



.radio > input:checked ~ span:after {
    background-color: #ffffff;
    border-color: #ffffff;
}

.radio > input:checked ~ span {
    background-color: #bd9654;
}

.checkbox > input:checked ~ span:after {
    border-color: #ffffff;
}

.checkbox > input:checked ~ span {
    background-color: #bd9654;
}


.card-footer {
    border-top: 0px;
}

.card-header.survey-card {
    height: 200px;
}

.btn.btn-primary.focus,
.btn.btn-primary:focus,
.btn.btn-primary:hover,
.btn.btn-primary.active,
.btn.btn-primary:active,
.btn.btn-primary.active.focus,
.btn.btn-primary.active:focus,
.btn.btn-primary.active:hover,
.btn.btn-primary:active.focus,
.btn.btn-primary:active:focus,
.btn.btn-primary:active:hover {
    background-color: #bb9b65 !important;
    border-color: #bb9b65 !important;
    color: #fff !important;
}

.languaheSelectionPopup {
    z-index: 1051;
    position: fixed;
    background-color: white;
    padding: 20px;
    border-radius: 5px;
    width: 600px;
    left: calc(100% - (300px + 50%));
    top: calc(100% - 75%);
    display: none;
}

    .languaheSelectionPopup div {
        padding-top: 5px;
        text-align: center;
        font-size: 14px;
    }



.rate-star {
    color: #d7dae7;
    display: inline-block;
    font-size: 30px;
}

    .rate-star:before {
        content: '★ ';
    }

    .rate-star:hover {
        color: #bb9b65;
    }

    .rate-star:checked {
        color: #bb9b65;
    }

.star-rate-continer input[type=radio] {
    border: 0px;
    height: .0002px;
}

.title-section:before {
    top: 377px !important;
}

.required-question:before {
    content: " *";
    color: red;
    font-size: 30px;
    position: relative;
    top: 14px;
    margin: 0px 5px;
}

.star-required {
    color: red;
    font-size: 40px;
    position: relative;
    top: 19px
}

.title-section {
    position: relative;
}

    .title-section:after {
        position: absolute;
        content: '';
        height: 4px;
        bottom: -15px;
        margin: 0 auto;
        left: 0px;
        right: 0px;
        width: 80%;
        background: #bb9b65;
    }

.emptyimage {
    background-image: url(../Uploads/empty.png);
    height: 50px;
    width: 50px;
    background-size: contain;
    background-repeat: no-repeat;
    cursor: pointer;
}

.attachimage {
    background-image: url(../Uploads/attach.png);
    height: 50px;
    width: 50px;
    background-size: contain;
    background-repeat: no-repeat;
    cursor: pointer;
}

.formInputValid {
    border-color: red !important;
    margin-bottom: 7px;
}

.align-start {
    text-align: start !important;
}

.text-end {
    text-align: end
}
/*main.css*/
.hidetitle {
    display: none;
}

.showtitle {
    display: block;
}

.login-continer {
    transition: all ease-in-out .5s !important;
}

    .login-continer:hover {
        transform: scale(1.1);
    }

h5.Qname {
    font-size: 14px !important;
    font-weight: 600;
    color: #bd9654;
    padding: 0px;
    padding-top: 20px;
}

.star-rate-continer input[type='checkbox'] {
    -webkit-appearance: none;
}

.ng-hg-datepicker-custom-select {
    max-height: 200px;
    overflow-y: scroll;
}

    .ng-hg-datepicker-custom-select::-webkit-scrollbar {
        width: 0.3rem !important;
    }
/*main.css*/
