/*@font-face {
    font-family: 'Avenir Regular';
    src: url('../fonts/Avenir-Regular/alfontcomAlFontcomAvenir-Regular.eot');
    src: url('../fonts/Avenir-Regular/alfontcomAlFontcomAvenir-Regular.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Avenir-Regular/alfontcomAlFontcomAvenir-Regular.woff2') format('woff2'),
    url('../fonts/Avenir-Regular/alfontcomAlFontcomAvenir-Regular.woff') format('woff'),
    url('../fonts/Avenir-Regular/alfontcomAlFontcomAvenir-Regular.svg#Avenir Regular') format('svg');
}

@font-face {
    font-family: 'Avenir Heavy';
    src: url('../fonts/Avenir-Heavy/alfontcomAlFontcomAvenir-Heavy.eot');
    src: url('../fonts/Avenir-Heavy/alfontcomAlFontcomAvenir-Heavy.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Avenir-Heavy/alfontcomAlFontcomAvenir-Heavy.woff2') format('woff2'),
    url('../fonts/Avenir-Heavy/alfontcomAlFontcomAvenir-Heavy.woff') format('woff'),
    url('../fonts/Avenir-Heavy/alfontcomAlFontcomAvenir-Heavy.svg#Avenir Heavy') format('svg');
}

@font-face {
    font-family: 'Avenir Black';
    src: url('../fonts/Avenir-Black/alfontcomAlFontcomAvenir-Black.eot');
    src: url('../fonts/Avenir-Black/alfontcomAlFontcomAvenir-Black.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Avenir-Black/alfontcomAlFontcomAvenir-Black.woff2') format('woff2'),
    url('../fonts/Avenir-Black/alfontcomAlFontcomAvenir-Black.woff') format('woff'),
    url('../fonts/Avenir-Black/alfontcomAlFontcomAvenir-Black.svg#Avenir Black') format('svg');
}
*/

/*
@font-face {
    font-family: 'Avenir Heavy';
    src: url('../fonts/Avenir-Heavy/AvenirArabic-Heavy.eot');
    src: url('../fonts/Avenir-Heavy/AvenirArabic-Heavy.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Avenir-Heavy/AvenirArabic-Heavy.woff2') format('woff2'),
    url('../fonts/Avenir-Heavy/AvenirArabic-Heavy.woff') format('woff'),
    url('../fonts/Avenir-Heavy/AvenirArabic-Heavy.ttf') format('truetype'),
    url('../fonts/Avenir-Heavy/AvenirArabic-Heavy.svg#AvenirArabic-Heavy') format('svg');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Avenir Light1';
    src: url('../fonts/Avenir-Light1/AvenirArabic-Light.eot');
    src: url('../fonts/Avenir-Light1/AvenirArabic-Light.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Avenir-Light1/AvenirArabic-Light.woff2') format('woff2'),
    url('../fonts/Avenir-Light1/AvenirArabic-Light.woff') format('woff'),
    url('../fonts/Avenir-Light1/AvenirArabic-Light.ttf') format('truetype'),
    url('../fonts/Avenir-Light1/AvenirArabic-Light.svg#AvenirArabic-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
*/



@font-face{
    font-family:Cairo;
    src:url("../fonts/hejaz/300/font.b9fc16bb.woff2") format("woff2"),url("../fonts/hejaz/300/font.92c61a8c.woff") format("woff");
    font-style:normal;
    font-weight:300
}

@font-face{
    font-family:Cairo;
    src:url("../fonts/hejaz/400/font.f5a0cd3f.woff2") format("woff2"),url("../fonts/hejaz/400/font.3e606430.woff") format("woff");
    font-style:normal;
    font-weight:400
}

@font-face{
    font-family:Cairo;
    src:url("../fonts/hejaz/500/font.4cbc4d02.woff2") format("woff2"),url("../fonts/hejaz/500/font.9244bec1.woff") format("woff");
    font-style:normal;
    font-weight:500
}


@font-face{
    font-family:Cairo;
    src:url("../fonts/hejaz/600/font.6856f51a.woff2") format("woff2"),url("../fonts/hejaz/600/font.75610dfc.woff") format("woff");
    font-style:normal;
    font-weight:600
}

@font-face{
font-family:Cairo;
src:url("../fonts/hejaz/700/font.d9bdf23e.woff2") format("woff2"),url("../fonts/hejaz/700/font.cf2f887c.woff") format("woff");
font-style:normal;
font-weight:700
}


* , body {
    color: #2b204d;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    text-shadow: rgba(0,0,0,.01) 0 0 1px;
    font-family: "Cairo", sans-serif;
}


h1, h2, h3, h4, h5, h6, h7 {
    font-weight: 500;
}

h1 {
    line-height: 140%;
}

.font-regular {
    font-family: "Cairo", sans-serif;
    font-weight: 300;
}

.font-heavy {
    font-family: "Cairo", sans-serif;
    font-weight: 500;
}

.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
outline: none;
box-shadow: none;
/*border: 1px solid #fff;*/
}


.bg1 {
    background: #FDFDFD;
}

.bg-white-200 {
    background: #FDFDFD;
}

.bg-joker-500 {
    background: #FFD04B;
}

.bg-primary-50 {
    background: #EDE9EE;
}

.bg-green-50 {
    background: #EDF8ED;
}

.bg-alpha-50 {
    background: #F4F2F5;
}

.bg-alpha-500 {
    background: #94809C;
}

.bg-white-100 {
    background: #FDFEFE;
}

.bg-secondary-50 {
    background: #EFECF8;
}

.bg-beta-50 {
    background: #F7F3F3;
}

.bg-dark-500 {
    background: #20052E;
}


.p3 {
    font-size: 16px;
}

.p4 {
    font-size: 14px;
}

.p5 {
    font-size: 12px;
    line-height: 20px;
}

.p6 {
    font-size: 10px;
}

.primary-500 {
    color: #462757;
}

.alpha-500 {
    color: #94809C;
}

.alpha-800 {
    color: #514656;
}

.alpha-900 {
    color: #3E3642;
}

.green-500 {
    color: #4BB94D;
}

.secondary-500 {
    color: #6342BC;
}

.secondary-900 {
    color: #2A1C4F;
}

.beta-500 {
    color: #AB8982 !important;
}

.beta-900 {
    color: #483A37 !important;
}

.primary-300 {
    color: #836E8E;
}

.primary-500 {
    color: #462757;
}

.dark-300 {
    color: #6A5873;
}

.dark-500 {
    color: #20052E;
}

.dark-400 {
    color: #4D3758;
}

.btn {
    font-family: "Cairo", sans-serif;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 10px 11px;
}

.btn-custom-primary, .btn-custom-primary:active {
    background: #462757 !important;
    border: 1px solid #462757;
    color: #EDE9EE !important;
}

.btn-custom-primary:hover {
    background: #1D1025 !important;
    color: #EDE9EE !important;
}


.btn-custom-secondary, .btn-custom-secondary:active {
    background: #6342BC !important;
    border: 1px solid #6342BC;
    color: #EDE9EE !important;
}

.btn-custom-secondary:hover {
    background: #3b2673 !important;
    color: #EDE9EE !important;
}


.btn-custom-light, .btn-custom-light:active {
    background: #FDFEFE !important;
    border: 1px solid #FDFEFE;
    color: #2A1C4F !important;
}

.btn-custom-light:hover {
    background: #eeefef !important;
    color: #2A1C4F !important;
}


.btn-custom-outline {
    color: #462757;
}

.btn-custom-outline:hover {
    color: #6342BC;
}


.btn-custom-outline-border {
    color: #462757;
    border: 1px solid #6342BC;
}

.btn-custom-outline-border:hover, .btn-custom-outline-border:active {
    color: #6342BC;
    border: 1px solid #462757;
}


#header-nav a:hover, #header-nav .nav-link.active {
    background: #F4F2F5 !important;
}

#header-nav .nav-link {
    color: #20052E;
    font-family: "Cairo", sans-serif;
    font-weight: 600 !important;
}




/*
.navbar-collapse.collapse.show .nav-item {
    text-align: right;
}

.navbar-collapse.collapse.show .nav-link {
    display: inline-block;
    margin: 3px 2px;
}*/



.navbar-custom-btn {
    color: #20052E !important;
    border: none !important;
    font-weight: bold;
    font-size: 26px;
}


#main-show {
    background: linear-gradient(180deg, rgba(253, 253, 253, 0.15) 0%, rgba(90, 60, 171, 0.15) 46.5%, rgba(64, 35, 79, 0.15) 100%);
}


.prop-card {
    border-radius: 20px;
    background: #FDFDFD;
    box-shadow: 0px 1px 24px 0px rgba(62, 54, 66, 0.10);
}

.sec-name {
    border: 1px solid #6342BC;
    border-radius: 12px;
    background: #ffffff;
}


.prop-card-2 {
    border-radius: 8px;
    background: #FDFDFD;
    box-shadow: 0px 1px 8px 0px rgba(62, 54, 66, 0.10);
    border: 1px solid #FDFDFD !important;
}


.prop-card-2:hover {
    border: 1px solid rgba(112, 112, 112, 0.4) !important;
    background: #fff;
}


.step-card-green {}

.step-card-green .card-icon {
    height: 47px;
    width: 47px;
    background: #EDF8ED url("../images/icon-hand-1.svg") no-repeat center center;
}

.step-card-green .card-text {
    color: #94809C;
}

.step-card-green:hover {
    background: #EDF8ED;
}


.step-card-green:hover .card-text {
    color: #3E3642;
}

.step-card-green:hover .card-icon {
    background: #4BB94D url("../images/icon-hand-2.svg") no-repeat center center;
}



.step-card-gray {}
.step-card-gray .card-icon {
    height: 47px;
    width: 47px;
    background: #E8E8E8 url("../images/icon-link-1.svg") no-repeat center center;
}
.step-card-gray .card-title {color: #20052E;}
.step-card-gray .card-text {color: #94809C;}
.step-card-gray:hover {background: #E8E8E8;}
.step-card-gray:hover .card-title {color: #20052E;}
.step-card-gray:hover .card-text {color: #3E3642;}
.step-card-gray:hover .card-icon {
    background: #20052E url("../images/icon-link-2.svg") no-repeat center center;
}


.step-card-purple {}
.step-card-purple .card-icon {
    height: 47px;
    width: 47px;
    background: #EDE9EE url("../images/icon-card-1.svg") no-repeat center center;
}
.step-card-purple .card-title {color: #462757;}
.step-card-purple .card-text {color: #94809C;}
.step-card-purple:hover {background: #EDE9EE;}
.step-card-purple:hover .card-title {color: #462757;}
.step-card-purple:hover .card-text {color: #3E3642;}
.step-card-purple:hover .card-icon {
    background: #462757 url("../images/icon-card-2.svg") no-repeat center center;
}



.link-footer {
    color: #AA9CB2 !important;
}

.link-footer-social i {
    color: #ffffff !important;
    font-size: 20px !important;
}


.owl-carousel {

}


.review {
    margin: 10px;
}

.review-inner {
    width: 350px;
    padding: 12px;
    box-shadow: 0px 1px 6px 0px rgba(62, 54, 66, 0.10);
    border-radius: 12px;
    border: 1px solid #F4F2F5;
    background:  #FFF;
}

.review .creator img {
    width: 40px;
    height: 40px;
}

.review .creator img {
    border-radius: 40px;
    background: #D9D9D9;
    width: 40px;
    height: 40px;
}


.review2 {
    margin: 10px;
}


.review2-inner {
    width: 311px;
    padding: 16px;
    box-shadow: 0px 1px 6px 0px rgba(62, 54, 66, 0.10);
    border-radius: 20px;
    border: 1px solid #F4F2F5;
    background:  #FFF;
}


.review2 .creator2  {
    width: 94px;
    height: 94px;
}

.review2 .creator2 img {
    border-radius: 10px;
    width: 94px;
    height: 94px;
}


.review3  {
    margin: 10px 20px;

}

.review3  img {
    width: 94px;
    height: 94px;
    border-radius: 12px;

    box-shadow: 0px 1px 6px 0px rgba(62, 54, 66, 0.10);
}


#plans-pills .nav-link {
    color: #6342BC !important;
    border-radius: 12px;
}

#plans-pills .nav-link.active {
    color: #EFECF8 !important;
    background: #6342BC !important;
}

.plan-card {
    box-shadow: 0px 1px 24px 0px rgba(62, 54, 66, 0.10);
    border-radius: 20px;
    padding: 20px;
}

.price-row .price {
    font-size: 40px;
    font-weight: 500;
}

.plan-properties {
    padding: 0;
}

.plan-properties li {
    padding-top: 3px;
    padding-right: 33px;
    list-style: none;
    margin-bottom: 13px;
    font-size: 14px;
}

.plan-1 {
    background: #FDFEFE;
}

.plan-1 .plan-title {
    color: #6342BC;
}

.plan-1 .plan-desc {
    color: #3E3642;
}

.plan-1 .plan-properties li {
    background: url("../images/icons8_diamond_1.svg") no-repeat right top;
    color: #1D1025;
}

.plan-1 .price-row .price {
    color: #2A1C4F;
}

.plan-1 .price-row .period {
    color: #94809C;
}

.plan-1 .plan-properties-title {
    background: url("../images/frame-43-1.png") no-repeat center center;
    height: 29px;
}


.plan-2 {
    background: #6342BC;
    color: #EFECF8;
}

.plan-2 .plan-desc {
    color: #F4F2F5;
}

.plan-2 .price-row .period {
    color: #F4F2F5;
}

.plan-2 .plan-title,  .plan-2 .price-row .price  {
    color: #EFECF8;
}

.plan-2 .plan-properties-title {
    background: url("../images/frame-43-2.png") no-repeat center center;
    height: 29px;
}

.plan-2 .plan-properties li {
    background: url("../images/icons8_diamond_22.svg") no-repeat right top;
    color: #EDE9EE;
}



.plan-3 {
    background: #462757;
    color: #EFECF8;
}

.plan-3 .plan-desc {
    color: #F4F2F5;
}

.plan-3 .price-row .period {
    color: #F4F2F5;
}

.plan-3 .plan-title, .plan-3 .price-row .price  {
    color: #EDE9EE;
}

.plan-3 .plan-properties-title {
    background: url("../images/frame-43-3.png") no-repeat center center;
    height: 29px;
}

.plan-3 .plan-properties li {
    background: url("../images/icons8_diamond_22.svg") no-repeat right top;
    color: #EDE9EE;
}


.login-card {
    box-shadow: 0px 1px 24px 0px rgba(62, 54, 66, 0.10);
    border: 1px solid rgba(62, 54, 66, 0.09);
}

/*
.login-card .input-group-text {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    background: white !important;
    border-left: 0 !important;
    color: #6A5873;
} */

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    font-weight: 500;
    font-size: 14px;
    -webkit-text-fill-color: #6A5873;
    -webkit-box-shadow: 0 0 0px 1000px rgb(255, 255, 255, 0.1) inset;
    transition: background-color 5000s ease-in-out 0s;
}

*,
*::before,
*::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }

.custom-input-icon {
    float: right;
    display: inline;
    position: absolute;
    color: #6A5873;
    margin-top: 13px;
    margin-right: 19px;
}

.custom-input {
    font-weight: 500 !important;
    font-size: 14px;
    width: 100%;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid #E9E6EA;
    color: #6A5873;
    padding-right: 50px;
}


.custom-input-icon-end {
    float: left;
    display: inline;
    position: relative;
    color: #6A5873;
    margin-top: -34px;
    margin-left: 18px;
}


.or-br {
    border-bottom: 2px solid #E9E6EA;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    color: #4D3758;
}

.or-br span {
    background: #FDFDFD;
    padding: 8px 14px;
    position: relative;
    top: 12px;
}

.btn-img-sep {
    border-left: 2px solid rgba(239, 236, 248, 0.7);
    padding-left: 8px;
    margin-left: 8px
}



::part(button) {
    height: 21px;
    width: 21px;
    padding: 3px;
    border-radius: 22px;
    fill: white;
    background: #462757;
}


::part(currenttime) {
    font-weight: 800;
    font-size: 11px;
    margin: 0 5px 0 3px !important;
    padding: 0 !important;
    display: none;
}

::part(duration) {
    font-weight: 800;
    font-size: 11px;
    margin-left: -9px !important;
    padding: 0 !important;
    color: #65556E;
}

::part(player) {
    /*padding: 6px 4px 2px 0px;
    background: #462757;
    border-radius: 25px;
    border:1px solid #462757;*/
}

::part(slider) {
   position: relative;
   top: 2px;
}


::part(input) {
    display: none !important;
}



.modal-backdrop {
    background: #271557;
    opacity:0.6 !important;
}


.modal-dialog {
    max-width: 95%;
    margin-right: auto !important;
    margin-left: auto !important;
}

.modal-body {
    position:relative;
    padding: 5px;

}
.btn-close {
    position:absolute;
    top:-30px;
    background-color: #fff;
}