@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@200;300;400;500;700;800;900&display=swap');
@font-face {
    font-family: 'Tajawal', sans-serif;
    src: url('../font/Tajawal-Black.ttf') format('truetype');
}

@font-face {
    font-family: 'Tajawal', sans-serif;
    src: url('../font/Tajawal-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Tajawal', sans-serif;
    src: url('../font/Tajawal-ExtraBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Tajawal', sans-serif;
    src: url('../font/Tajawal-ExtraLight.ttf') format('truetype');
}

@font-face {
    font-family: 'Tajawal', sans-serif;
    src: url('../font/Tajawal-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'Tajawal', sans-serif;
    src: url('../font/Tajawal-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'Tajawal', sans-serif;
    src: url('../font/Tajawal-Regular.ttf') format('truetype');
}
.pt-5 {
    padding-top: 5rem!important;
}
* {
    box-sizing: border-box;
}

body {
    padding: 0;
    margin: 0;
    font-family: 'Tajawal', sans-serif;
}

ul,
ol {
    padding-inline-start: 0px;
    padding-left: 0rem;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0;
}

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

a:hover {
    text-decoration: none;
    color: #101010;
}

hr {
    margin: 0;
    border-width: 0;
}

select:focus>option:checked,
input:focus {
    background: #f3f4f5 !important;
    border: 0px;
}

@media (min-width: 1200px){
    .container, .container-lg, .container-md, .container-sm, .container-xl {
        max-width: 1222px;
    }
}

/*start-register*/

.component-register {
    padding-top: 27px;
    padding-bottom: 26px;
}

.img-logo img {
    width: 122px;
    height: 122px;
}

.img-logo h6 {
    font-size: 21px;
    font-weight: bold;
    color: #CA002C;
    line-height: 28px;
}

.img-register {
    display: flex;
    justify-content: center;
    align-items: center;
}

.img-register img {
    width: 100%;
    height: 360px;
}

.p-register {
    color: #101010;
    font-size: 18px;
    font-weight: 500;
    line-height: 40px;
}

.p-register span {
    color: #CA002C;
    font-size: 30px;
    font-weight: 500;
}

.field {
    position: relative;
}

.field img {
    position: absolute;
    top: 35px;
    width: 10px;
    cursor: pointer;
    width: 24px;
    height: 24px;
}


/*start-form*/
.form-conversation{
    background-color: #FFFFFF;
    border-radius: 0px 8px 0px 0px;
    box-shadow: 0px 2px 8px #00000013;
    padding: 5px;
}
.component-form .col-md-6 {
    margin-top: 5px;
}

.component-form label {
    color: #4C6373;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
}

.component-form .form-control,
.form-select,
.input-number,.form-conversation input{
    background-color: #E9E9E9;
    border: 0px;
    border-radius: 4px;
}

.input-number {
    width: 48px;
    height: 48px;
}

.form-select {
    background-image: url(../img/row.png);
}

.form-select option {
    color: #101010;
    font-size: 14px;
}

.link-form {
    font-weight: 400;
    font-size: 14px;
}

.link-form span {
    color: #101010;
}

.link-form a {
    color: #CA002C;
}

.btn-submit {
    background-color: #CA002C;
    border-radius: 4px;
    color: #fff;
    font-size: 16px;
    width: 239px;
    height: 38px;
}

.form-check-input {
    border: 1px solid #CA002C;
}

.form-check-input:checked {
    background-color: #ca002c;
    border-color: #ca002c;
}

.component-img-emphasis img {
    width: 550px;
    height: 455px;
    margin: auto;
}

@media (max-width: 992px) {
    .component-img-emphasis img {
        width: 100%;
    }
}

.text-check {
    color: #101010;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
}

.text-check span {
    color: #CA002C;
}

.text-check a {
    background-color: #CA002C;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    line-height: 21px;
    padding: 10px 50px;
    border-radius: 4px;
}


/*end-form*/

#progressbar {
    overflow: hidden;
    color: #4C6373;
    display: flex;
    justify-content: center;
}

#progressbar .active {
    color: #CA002C;
    font-size: 16px;
    font-weight: 500;
}

#progressbar li {
    text-align: center;
    list-style-type: none;
    font-size: 12px;
    position: relative;
    display: inline-block;
}

#progressbar #account:before {
    font-family: FontAwesome;
    content: "\f00c";
}

#progressbar li.active:before,
#progressbar li.active:after {
    background: #CA002C !important;
    color: #fff;
}

#progressbar li:before {
    width: 50px;
    height: 50px;
    line-height: 45px;
    display: block;
    font-size: 18px;
    color: #4C6373;
    background: #E9E9E9;
    border-radius: 50%;
    margin: 0 auto 10px auto;
    padding: 2px;
}

#progressbar li:not(:last-child):after {
    content: '';
    width: 100%;
    height: 2px;
    background: lightgray;
    position: absolute;
    top: 25px;
    z-index: -1;
    border: 1px dashed #E9E9E9;
}

@media (min-width: 992px) {
    #progressbar li {
        width: 26%;
    }
}
.img-verification{
    width: 360px !important;
    height: 360px;
}

/*end-register*/


/*nav*/

.navbar-expand-xl .navbar-nav {
    align-items: center;
}

.navbar {
    height: 85px;
    z-index: 100;
}

.navber-tow {
    box-shadow: 0 3px 6px #00000021;
    padding: 0px;
    background-color: #fff;
}

.navbar-brand .img-brand {
    width: 65px;
    height: 65px;
}

.navbar-light .navbar-nav .nav-link {
    color: #4C6373;
    font-size: 14px;
    font-weight: 500;
    line-height: 19px;
}

.navbar-light .navbar-nav .nav-link:hover {
    color: #ca002c;
}

.navbar-index .navbar-nav .nav-link {
    color: #fff;
}

.nav-item .active {
    border-bottom: 1px solid #CA002C;
    color: #CA002C !important;
}

.navbar-index .navbar-nav .nav-link.active {
    color: #fff;
}

@media (min-width: 1200px) {
    .navbar-expand-xl .navbar-nav .nav-item:not(:last-child) {
        padding-right: .5rem;
        padding-left: .5rem;
    }
}

.nav-register {
    background-color: #CA002C;
    color: #fff !important;
    border-radius: 8px;
    border: 1px solid #CA002C;
}

.navbar-light .navbar-nav .nav-boder {
    border: 1px solid #4C6373;
    border-radius: 8px;
    color: #4C6373 !important;
}

@media (max-width: 1025px) {
    .navbar-collapse {
        background-color: #fff;
        padding-top: 5px;
    }
    .navbar-index .navbar-collapse .nav-link,
    .navbar-index .navbar-collapse .nav-item .active {
        color: #4C6373 !important;
    }
    .nav-boder {
        margin-top: 10px;
    }
    .img-index {
        display: none;
    }
}

.chang {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
    background-color: #fff;
    box-shadow: 0 3px 6px #00000030;
}

.img-2 {
    display: none;
}
/*start-footer*/
.component-footer{
    background-color: #FEF8F9;
    font-size: 14px;
    line-height: 19px;
    font-weight: 500;
    color: #4C6373;
   
}
@media (max-width: 992px) {
    .component-footer{
        text-align: center;
    }
    .component-link-footer{
        flex-direction: column !important;
    }
}
.component-imf-footer img{
    width: 83px;
    height: 83px;
}
.component-link-footer{
    flex-direction: row;
}
.list-group-iteme{
    
    margin: 12px;
    
}
/*end-footer*/

/*start-conditions*/

.component-text {
    border: 1px solid #C8CFD4;
    border-radius: 16px;
    padding: 20px;
}

@media (min-width: 992px) {
    .component-text {
        margin-left: 84px;
        margin-right: 63px;
    }
}

.title {
    color: #101010;
    font-size: 30px;
    font-weight: 500;
}

.title-p {
    color: #4C6373;
    font-size: 16px;
    line-height: 50px;
    font-weight: 500;
}


/*end-conditions*/


/*start-index*/

@media (min-width: 992px) {
    .component-header {
        height: 100vh;
    }
    .component-header-img {
        position: absolute;
        top: 0;
    }
    .row-header {
        position: absolute;
    }
}

.component-header-img {
    right: 0;
    bottom: 0;
    left: 0;
}

.img-index {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
}

#overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    background: url(../img/background-over.png);
    z-index: 2;
    object-fit: cover;
    object-position: 50% 50%;
    background-repeat: no-repeat;
}

.row-header {
    top: 85px;
    z-index: 3;
    bottom: 0;
    width: 100%;
}

@media (min-width: 992px) {
    .row-header {
        position: absolute;
    }
}

.row-header .row {
    margin-left: 0px;
    align-items: center;
}

.Content-definition {
    background-color: #fff;
    border-radius: 4px;
}

@media (max-width: 1025px) {
    .Content-definition {
        text-align: center;
    }
}

.Content-definition .card-img {
    width: 75px;
    height: 75px;
}

.Content-definition .card-title {
    color: #CA002C;
    font-size: 21px;
    font-weight: bold;
    line-height: 28px;
}

.Content-definition .card {
    border: 0px;
    box-shadow: 0px 3px 6px #00000024;
    border-radius: 4px;
}

.card-p p {
    font-size: 14px;
    font-weight: 500;
    color: #101010;
    line-height: 19px;
}

.definition-p {
    color: #FFFFFF;
    font-size: 15px;
    line-height: 20px;
    font-weight: 500;
}

.heading-h{
    background-color: #fff;
    width: fit-content;
    padding: 10px;
    ‏ -moz-transform: skew(30deg);
    -o-transform: skew(30deg);
    transform: skew(30deg);
   
}
[dir="rtl"] .heading-h{
    margin-left: 17px;
}
[dir="ltr"] .heading-h{
    margin-right: 17px;
}
.Definition-h {
    color: #CA002C;
    transform: skew(-27deg);
    font-weight: bold;
    font-size: 25px;
   padding: 10px;
  

}   


@media (max-width: 992px) {
    .definition-p {
        color: #4C6373 !important;
    }
    #overlay {
        display: none;
    }
}

.link-index {
    color: #fff;
    background-color: #CA002C;
    padding: 5px 10px;
    border-radius: 8px;
}

.title-hading {
    color: #CA002C;
    font-size: 30px;
    line-height: 30px;
    font-weight: 500;
}

.title-hading-index::after {
    width: 60px;
    height: 2px;
    content: "";
    background-color: #CA002C;
    display: inline-block;
}
.component-title{
    margin-right: 0px;
    margin-left: 0px;
}
.card-products {
    border: 0px;
    border-radius: 4px;
    cursor: pointer;
    box-shadow: 0px 3px 6px #0000001f;
    position: relative;
    grid-template-rows: max-content 1fr;
  
}

.card-products img {
    width: 100%;
    height: 215px;
    object-fit: cover;
    object-position: 50% 50%;
    border-radius: 4px
}

.card-products .card-body{
    padding: 2px 4px;
    display: grid;
  
    grid-template-rows: 1fr;
    grid-gap: 2px;
    
}

.card-products .card-title {
    color: #101010;
    font-size: 18px;
    font-weight: bold;
    line-height: 28px;
    padding-right: 0px;
    padding-left: 0px;
}
.btn-bdf{
  background-color: #CA002C;
  border-radius: 4px; 
  height: 36px; 
  width: 95px;
  display: flex;
    align-items: center;
    color: #fff;
    font-size: 14px;
    line-height: 21px;
    font-weight: 500;
}
.btn-bdf img{
width: 15px;
height: 20px;
margin-left: 2px;
}

.card-p-products {
    color: #101010;
    font-size: 16px;
    font-weight: 500;
    line-height: 21px;
}

.card-p-products .prices {
    color: #CA002C !important;
}

.photo-List-img {
    position: relative;
    max-width: 100%;
}


.link-Show-more {
    color: #101010;
    font-size: 14px;
    font-weight: bold;
    line-height: 19px;
    padding: 10px 30px;
    border-radius: 4px;
}

.link-Show-more:hover {
    background-color: #E9E9E9;
}

.carousel-products .carousel-indicators .buton-c{
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin:0px 4px; 
    border: 0px;
}
.carousel-products .carousel-indicators .active {
  background-color: #CA002C;
  border: 0px;
}
.carousel-products .carousel-control-next,.carousel-products .carousel-control-prev {
    width: 22px;
    opacity: 1.5;
    background-color: Transparent;
    border: 0px;
}
.carousel-products .carousel-control-prev-icon {
    background-image: url(../img/prev.png);
}
.carousel-products .carousel-control-prev {
    left: 42px;
}
.carousel-products .carousel-control-next{
    right: 42px;
}
.carousel-products .carousel-control-next-icon{
     background-image: url(../img/next.png); 
   
}
.carousel-products .carousel-control-next-icon,.carousel-products .carousel-control-prev-icon {
    width: 1rem;
    height: 1rem;
}
.carousel-products .carousel-indicators{
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0;
    min-height: 13%;
    background-image: linear-gradient(to bottom, #10101038, #5f5f5f47);
    /* background-color: #101010b3; */
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    transform: scaley(0);
    transition: 0.3s;
    transform-origin:bottom;
    
    border-radius: 4px;
}

.carousel-products:hover .carousel-indicators{
    transform: scale(1);
    cursor: pointer;
}
/*end-index*/


/*start-about*/

.component-about .row {
    margin: 0px;
}

.component-img-about img {
    width: 100%;
    height: 244px;
}

.title-about {
    color: #CA002C;
    line-height: 43px;
    font-weight: bold;
    font-size: 32px;
}

.component-text-about p {
    font-size: 16px;
    color: #101010;
    font-weight: 500;
    line-height: 21px;
}


/*end-about*/


/*start-questions*/
.subscribe input[type="search"] {
    padding: 0 28px;
    width: 300px;
    height: 36px;
    transition: width 600ms ease-out;
    background-color: #E9E9E9;
    border: 0px;
    border-radius: 4px;
    font-size: 0.8rem;
    color: #101010;
    border: 0px;
    outline: none;
    
}
.subscribe button[type="submit"] {
    top: 8px;
    margin-right: 5px;
    position: absolute;
    width: 24px;
    height: 24px;
    background-size: cover;
    background-image: url(../img/baseline-search.png);
    text-align: center;
    background-color: #E9E9E9;
    cursor: pointer;
    border: 0px;
}
.img-questions img {
    width: 90%;
    height: 499px;
}

.component-Questions .accordion-button::after {
    background-image: url(../img/plas.png);
    margin-left: 0px;
}

.component-Questions .accordion-button:not(.collapsed)::after {
    background-image: url(../img/min.png);
}

.component-Questions .accordion-button {
    display: flex;
    justify-content: space-between;
    font-size: 21px;
    line-height: 30px;
    color: #101010;
}

.accordion-button:not(.collapsed) {
    color: #101010;
    background-color: #fff;
}

.component-Questions.accordion-button:focus {
    border-color: #fff;
    box-shadow: 0 0 0 0.25rem rgb(235 236 239 / 25%);
}

.accordion-button {
    border: 0px;
}

 .component-Questions .accordion-button.collapsed,
.component-Questions .accordion-body {
    border-bottom: 1px solid #C8CFD4;
}

.component-Questions .accordion-body {
    color: #4C6373;
    font-size: 16px;
    line-height: 21px;
    font-weight: 500;
}


/*end-questions*/


/*start-explained*/
.bot__video {
    height: 90%;
}
.bot__video iframe {
    width: 100%;
    height: 100%;
}

.row-video .col-xl-4 {
    padding-right: 0px;
    height: 225px;
}


/*end-explained*/


/*start-connect-us*/

.component-text-content-us {
    background-color: #E9E9E9;
}

.component-content-us .row {
    margin-left: 0px;
    margin-right: 0px;
}

.text-content-us p {
    color: #4C6373;
    font-size: 21px;
    line-height: 30px;
    font-weight: 500;
}

.text-content-us ul li {
    flex-direction: row;
}

.ul-content {
    display: grid;
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
}

.span-ul {
    color: #CA002C;
}

.ul-content small {
    color: #4C6373;
    margin: 10px 15px;
}

.contact-us__map iframe {
    width: 100%;
    height: 522px;
}

@media (min-width: 992px) {
    .from-connect {
        width: 70%;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

.social ul {
    justify-content: center;
}
@media (min-width: 768px) {
[dir="rtl"] .social-footer ul{
    justify-content: right;

}
[dir="ltr"] .social-footer ul{
    justify-content: left;

}
}
.icon {
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    border: 1px solid #4C6373;
    width: 30px;
    height: 30px;
  
    border-radius: 50%;
    color: #4C6373;
    margin: 6px;
    font-size: 1.2rem;
}

.icon:hover {
    background-color: #CA002C;
    color: #fff;
    border: 1px solid #CA002C;
}

.social ul li {
    /* margin-right: 10px; */
    margin-left: 10px;
}

.or {
    margin: 0 auto;
    position: relative;
    text-align: center;
}

.or span {
    color: #4C6373;
    font-size: 16px;
}

@media (min-width: 992px) {
    .or span::after,
    .or span::before {
        content: "";
        background-color: #4C6373;
        border: 1px solid #4C6373;
        display: inline-block;
        width: 145px;
        height: 1px;
        margin-left: 10px;
        margin-right: 10px;
    }
}

.check-connect .fas {
    color: #CA002C;
    font-size: 64px;
}

.check-connect p {
    font-size: 21px;
    font-weight: bold;
    line-height: 28px;
}

.modal-content {
    border-radius: 16px;
}

@media (min-width: 576px) {
    .modal-dialog {
        max-width: 409px;
        margin: 11% auto;
    }
}


/*end-connect-us*/


/*stert-control-panel*/

.nav-number-link {
    font-size: 16px !important;
    color: #101010 !important;
    line-height: 21px !important;
    font-weight: 500 !important;
}

.nav-number-link span {
    color: #CA002C;
}

.badge-pill {
    position: absolute;
    padding: 5px 7px;
    top: -1px;
    margin-left: -10px;
    left: 45px;
    color: #fff;
    background-color: #CA002C;
    font-weight: bold;
    text-transform: uppercase;
    min-width: 19px;
    border-radius: 50%;
}

.nav-item-bell {
    position: relative;
}

.nav-item-bell i {
    font-size: 24px;
    color: #000000;
}

.nav-item-bell .dropdown-toggle::after {
    border: 0px;
}

.component-nav-prson {
    width: 36px;
    height: 36px;
}

.nav-prson {
    position: relative;
}

.nav-prson span {
    font-size: 14px;
    color: #101010 !important;
}

[dir="rtl"] .nav-prson .dropdown-menu {
    text-align: right;
}

.nav-prson .dropdown-menu,
.nav-item-bell .dropdown-menu {
    padding: 5px 5px;
    border: 0px;
    box-shadow: 0px 3px 6px #00000016;
    top: 61px;
}

.nav-prson .dropdown-menu a {
    color: #4C6373;
    font-size: 16px;
    font-weight: 400;
    line-height: 21px;
    border-bottom: 1px solid #C8CFD4;
    padding: 10px;
}

.dropdown-menu a:focus {
    background-color: #C8CFD4;
    color: #000;
}

.nav-exit {
    color: #CA002C !important;
    border-bottom: 0px !important;
}

.nav-item-bell li:not(:last-child) {
    padding-bottom: 20px;
    border-bottom: 1px solid #C8CFD4;
}

.nav-item-bell li span {
    color: #4C6373;
    padding-top: 10px;
    display: flex;
}

[dir="rtl"] .nav-item-bell li span {
    justify-content: flex-end;
}

.nav-item-bell p {
    color: #101010;
    font-size: 16px;
    line-height: 21px;
}

.nav-item-bell .dropdown-menu {
    top: 61px;
    min-width: 19rem;
    overflow-x: auto;
    height: 200px;
}
.nav-item-bell .dropdown-menu::-webkit-scrollbar {
    height: 0px;
    } 
[dir="rtl"] .nav-item-bell .dropdown-menu {
    text-align: right;
}

.navbar-control {
    display: flex;
    justify-content: center;
}

.navbar-control ul {
    flex-direction: row;
    overflow: auto;
}

@media (min-width: 576px) {
    
    .component-visions{
        margin-left: 5rem!important;
        margin-right: 5rem!important;

    }
}
.navbar-control ul li {
    margin: 0px 23px
    
}
.navbar-control ul li a {
    display: grid;
    justify-items: center;
    font-size: 18px;
}

.nav-control img {
    width: 48px;
    height: 48px;
}

.col-control img {
    width: 60px;
    height: 60px;
}

.col-control .card {
    border-radius: 16px;
    border: 1px solid #E9E9E9;
}

.col-control .card-title {
    color: #fff;
    font-size: 21px;
    line-height: 18px;
    font-weight: 500
}

.col-control .card-title span {
    display: block;
    line-height: 18px;
    padding: 20px 30px 0px;
}

.col-control .card-body {
    padding: 0.5rem 0.5rem;
}

.col-control-earnings .card {
    background-image: linear-gradient(to right, #2EAAA8, #21817D);
}

.col-control-products .card {
    background-image: linear-gradient(to right, #46BBD7, #1B8AA8);
}

.col-control-requests .card {
    background-image: linear-gradient(to right, #F0735D, #DB3F28);
}

.col-control-outstanding .card {
    background-image: linear-gradient(to right, #9B468A, #6F1A88);
}

.col-control-besket .card {
    background-image: linear-gradient(to right, #CA002C, #940020);
}

.col-control-pending .card {
    background-image: linear-gradient(to right, #fff, #6168C2);
}

.link-panel {
    background-color: #E9E9E9;
}

.navbar-control ul li .active {
    color: #CA002C;
    border-bottom: 0px;
    box-shadow: 0px 2px 8px #00000036;
    border-radius: 8px;
    padding: 0px 16px;
}

.navbar-control ul li>.active img{
    filter:brightness(0.55) sepia(1) hue-rotate(
-70deg
) saturate(5) contrast(425%) opacity(0.8);

  fill: red;
}
/*end-control-panel*/


/*start-team*/

.col-button .btn-primary,
.col-button .btn-secondary {
    border-radius: 4px;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    border: 0px;
}

.col-button .btn-primary {
    background-color: #CA002C;
    color: #FFFFFF;
}

.col-button .btn-secondary {
    background-color: #00AD11;
    color: #fff;
}

.col-teame {
    box-shadow: 0px 3px 8px #0000002e;
    border-radius: 8px;
    padding: 10px;
    display: grid;
    grid-gap: 3px;
}

.row-team {
    display: grid;
    grid-gap: 26px;
}

@media (min-width: 769px) {
    .row-team {
        grid-template-columns: 1fr 1fr;
    }
    .component-my-team {
        margin-left: 5rem!important;
        margin-right: 5rem!important;
    }
    .component-paying{
        margin-right: 20rem!important;
    }
    [dir="rtl"].col-button .btn-primary {
        margin-left: 10px;
    }
    [dir="ltr"].col-button .btn-primary {
        margin-right: 10px;
    }
}

.col-teame .team-card img {
    width: 48px;
    height: 48px;
}

.team-card span {
    font-size: 16px;
    color: #101010;
    font-weight: 500;
    line-height: 21px;
}

.nav-number-link small {
    color: #4C6373;
}

.col-teame>div:nth-child(2) {
    border-bottom: 2px solid #C8CFD4;
}

[dir="rtl"] .teame-definition>div:nth-child(1) {
    border-left: 1px solid #C8CFD4;
}
[dir="ltr"] .teame-definition>div:nth-child(1) {
    border-right: 1px solid #C8CFD4;
}

[dir="rtl"] .teame-definition>div:nth-child(2) {
    text-align: left;
}

[dir="ltr"] .teame-definition>div:nth-child(2) {
    text-align: right;
}

.form-check-label {
    color: #101010;
    font-size: 14px;
    line-height: 7px;
    font-weight: 500;
}

.link-model {
    width: 64px;
    height: 64px;
}


/*end-team*/


/*start-sellers*/

.component-sellers {
    background-image: url('../img/Sellers.png');
    background-size: cover;
    background-size: cover;
    background-position: bottom;
}



.sellers {
    padding-top: 129px;
}

.card-sellers-img {
    width: 168px;
    height: 168px;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0px auto;
}

.card-sellers-img img {
    width: 126px;
    height: 40px;
}

.card-sellers-img:hover {
    box-shadow: 0 15px 19px #00000024;
}

.card-sellers .card-title {
    color: #000000;
    font-size: 18px;
    line-height: 30px;
}

.card-sellers .card-text {
    color: #4C6373;
    font-size: 16px;
    line-height: 30px;
    font-weight: 500;
}


/*end-component-sellers*/


/*start-products*/

.products-img {
    width: 122px;
    height: 122px;
}

.rating-stars ul {
    list-style-type: none;
    padding: 0;
    -moz-user-select: none;
    -webkit-user-select: none;
    margin: 0px;
}

.rating-stars ul>li.star {
    display: inline-block;
    cursor: pointer;
}

.rating-stars ul>li.star.selected>i.far {
    color: #FFC309;
}

.rating-stars ul>li.star>i.far {
    font-size: 1em;
    color: #C8CFD4;
}

.table {
    border-radius: 8px;
}

.table-products thead {
    background-color: #CA002C;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    border-radius: 8px;
}

.table-products thead span {
    display: block;
    font-size: 14px;
    color: #E9E9E9;
}

.table-products tbody td,.prodect-text {
    color: #101010;
    font-size: 16px;
    font-weight:500 ;
    line-height:21px ;
}
.table-products tbody td:nth-child(2) { 
    color: #CA002C;
    
}
.table>:not(caption) {
    border-bottom-width: 0px;
}

.btn-primary-p {
    background-color: #CA002C;
    border-radius: 4px;
    color: #fff;
}

.btn-primary-p img,
.btn-outline-secondary img {
    width: 24px;
    height: 24px;
}

.btn-outline-secondary {
    border: 1px solid #4C6373;
    color: #4C6373;
    font-size: 14px;
}
.Unavailable{
    color: #CA002C !important;
}
.Available{
    color: #00AE11 !important;
}
.page-link {
    color: #CA002C !important;
    border: 1px solid #C8CFD4;
}
.input-group .btn {
    position: absolute;
    
}
.input-group input{
    padding: .375rem 1.85rem;
    color:#4C6373;
    border: 1px solid #4C6373;
    border-radius: 4px;
}
.input-group .btn i{
    color:#4C6373  
}
.form-select-2{
    background-color: #fff !important;
    border: 1px solid #4C6373 !important;
    border-radius: 4px;
}
[data-href] {
    cursor: pointer;
}
/*end-products*/
/*product-DEtails*/

#carousel-product button{
    border: 0px;
}
.title-details h6{
    color: #AFAFB9;
    font-size: 20px;
    line-height: 40px;
    font-weight: 500;
}
.title-details h6 span{
    color:#101010;
}
.prodcut-titles{
    color: #101010;
    font-size: 14px;
    line-height: 19px;
    font-weight: 500;
}
.table-product-one {
    border-radius: 8px;
    box-shadow: 0px 3px 6px #00000016;
    
    padding: 10px;
}
.table>:not(:last-child)>:last-child>* {
    border-bottom-color: none; 
}
#carousel-product .carousel-indicators button {
    box-sizing: content-box;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    width: 122px;
    height: 122px;
    margin-right: 3px;
   
   
    cursor: pointer;
    
    background-clip: padding-box;
    border-top: 10px solid transparent;
    
    opacity: .5;
    transition: opacity .6s ease;
}
#carousel-product .carousel-indicators .active {
    opacity: 1;
}
.thumbnails-tow {
    position: relative;
    margin: 0;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;
}
#carousel-product .carousel-item img{
    height: 536px;
    
}
#carousel-product button img{
    
    width: 122px;
    height: 122px;
    object-fit: cover;
    object-position: 50% 50%;
    border-radius: 4px;
 
    
}
#carousel-product .carousel-control-next,#carousel-product  .carousel-control-prev{
    width: 24px !important;
    height: 24px !important;
    top: 50%;
    background-color:#E9E9E9;
    border-radius: 4px;
}
#carousel-product .carousel-control-prev-icon {
    background-image: url(../img/prev-prodect.png);
}
#carousel-product .carousel-control-next-icon{
    background-image: url(../img/next-prodect.png);  
}
#carousel-product .carousel-control-next-icon,#carousel-product .carousel-control-prev-icon {
   
    width: 11px;
    height: 19px;
}
.table-product{
    width: 80%;
    box-shadow: 0px 3px 6px #00000016;
    border-radius: 8px;
}
.table-product-one>:not(caption)>*>* {
    padding: 1.1rem .5rem;
}
.table-product-one tr th,.table-product-one tr td{
    font-weight: 500;
    font-size: 16px;
  color: #101010;
}
.table-product-one tr th:nth-child(1){
color:#CA002C;
border-bottom-color: #C8CFD4 !important;
}
.table-product-one tr th:nth-child(2),
.table-product-one tr th:nth-child(3),
.table-product-one tr th:nth-child(4)

{
    color:#00AE11;
    border-bottom-color: #C8CFD4 !important;
    
    }
    .table-product .table>:not(caption)>*>* {
        padding: 1rem .5rem;
    }
    .table-product  tr th:nth-child(1){
        background-color: #CA002C;
        color: #fff;
        border-bottom-left-radius: 8px;
        border-top-left-radius: 8px;
        }
        .table-product  tr td:nth-child(4){
color:#CA002C ;
        }
        .details-confrom{
            color:#00AE11 !important;
        }
        .details-sellery input{
            width: 135px;
            border-radius: 2px;
            border: 1px solid #4C6373;
        }
/*end-product-details*/
/*chang-data*/
.component-chang-data{
    
}
@media (min-width:992px) {
.component-arithmetic{
    width: 60%;
    margin: auto;
}
[dir="rtl"] .nav-data li{
    
    margin-left: 31px;
}
[dir="ltr"] .nav-data li{
    
    margin-right: 31px;
}
}
@media (max-width: 768.98px) { 
    .nav-data li{
        font-size: 12px;
    }
   [dir="rtl"] .nav-data li{
    
        margin:5px;
        
    }
    [dir="ltr"] .nav-data li{
    
        margin:5px;
    }
}

.img-data img{
width: 120px;
height: 120px;
border-radius: 50%;
}
.nav-data li {
    display: inline-block;
    
}
.nav-data li a{
    color:#4C6373
}
@media (max-width:552px) {
    .nav-data li {
        margin-right: 5px;
    }
}
.nav-data {
    flex-direction: row;
}
select:disabled {
    opacity: 1!important;
}
.investigation{
    display: none;
}
.cardion-chang .accordion-button{
    color: #CA002C;
    padding: 5px;
    
}
.cardion-chang .accordion-collapse {
border: 0px;
}
.cardion-chang .accordion-button::after{
    background-image: url(../img/chang-2.png);
    background-size: 1.2rem;
    WIDTH: 19PX;
    HEIGHT: 9PX;
}
.cardion-chang .accordion-button:not(.collapsed)::after {
    background-image: url(../img/chang.png);
 
}
.cardion-chang .form-check-input:checked {
    background-color: #00AE11;
    border-color: #00AE11;
}
.cardion-chang .form-check-input {
    border: 1px solid #4C6373;
}
.form-select:disabled {
    color: #6c757d;
    background-color: #E9E9E9;
}
.accordion-button:focus {
    border-color:#FFF !important;
   
    box-shadow: 0 0 0 !important;
}
/*upload-img*/
.avatar-upload {
    position: relative;
 
}
.avatar-upload .avatar-edit {
    position: absolute;
    z-index: 700;
    bottom: 2px;
}
.avatar-upload .avatar-edit input {
    display: none;
}
.avatar-upload .avatar-edit input + label {
    display: inline-block;
    width: 34px;
    height: 34px;
    margin-bottom: 0;
    border-radius: 100%;
    background: #FFFFFF;
    border: 1px solid transparent;
    box-shadow: 0px 2px 4px 0px rgb(0 0 0 / 12%);
    cursor: pointer;
    font-weight: normal;
    transition: all 0.2s ease-in-out;
}
.avatar-upload .avatar-edit input + label:after {
    content: "\f030";
    font-family: 'FontAwesome';
    color: #CA002C;
    position: absolute;
    top: 7px;
    left: 0;
    right: 0;
    text-align: center;
    margin: auto;
}
.avatar-upload .avatar-preview {
    width: 130px;
    height: 130px;
    position: relative;
    border-radius: 100%;

    margin: 0 auto;
    z-index: 20;
    border: 1px solid #b6b8b9;
}
.avatar-upload .avatar-preview > div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
#imagePreview{
    background-image: url(../img/person-data.png);
}
.component-arithmetic .btn{
height: 40px;
}
/*start-support*/
.form-conversation,.conversation  {
    margin-right: 0px;
    margin-left: 0px;
}
.title-support{
    background-color: #F9F9F9;
    border: 1px solid #DFE4EA;
    padding: 10px;
}
.title-support img{
    width: 24px;
    height: 24px;
}

.conversation-items{
    display: grid;
    grid-row-gap: 20px;
}
.user--speech {
    justify-self: end;
    justify-content: end;
}
.user-message ,.robot-message {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.15em;
 
    border-radius: 8px;
    padding: 8px;
}
@media (min-width: 1200px) { 
    .user-message ,.robot-message {
        width: calc(20* 1.15em);
    } 
}
.robot-message {
    background-color: #CA002C;
    position: relative;
    color: #fff;
    box-shadow: 0px 3px 6px #0000003b;
    
}
.user-message{
    background-color: #E9E9E9;
    color: #2C2C2C;
    position: relative;
   
}

.conversation-item{
    display: grid;
    grid-template-columns: 0.2fr 6fr;
    grid-gap: 5px;

}
.conversation-item2 {
    display: grid;
    grid-template-columns:  6fr 0.4fr ;  
    grid-gap: 5px;
}

.user-image img,.chat--image-conversation{
    width: 42px;
    height: 42px;
    text-align: center;
    border-radius: 50%;
    justify-content: start;
    flex-direction: start;
}

.send input[type=file] {
    display: none;
}
.choose-btn {
    border-radius: 6px;
    background-color: #E9E9E9;
    padding: 10px;
    text-align: center;
    cursor: pointer;
    font-family: arial;   

}
.send .choose-btn img{
    width: 24px;
    height: 24px;
}
.button-chat{
    background-color: #CA002C;
    border-radius: 6px;
    color: #FFFFFF;
    font-size: 16px;
    border: 0px;
}
.nav-tabs .nav-link.active {
 
     border-color: transparent;
     border: 1px solid #CA002C;
}
.nav-tabs {
     border-bottom:0px
}
/*end-support*/
/*add-request*/
.component-product{
    border-bottom: 2px solid #E9E9E9;
}
.product-request{
    background-color: #E9E9E9;
    margin: 0px;
}
.img-request{
    display: flex;
    justify-content: center;
    align-items: center;

}
.product-request .img-request img{
    width: 100%;
    height: 100px;
    border-radius: 4px;
}
.product-request .card-body{
    padding: 2px;
    margin-right: 0px;
    margin-left: 0px;
    align-items: self-start;
}
.product-request .col-defintion{
    font-size: 16px;
    font-weight: 500;
    line-height: 21px;
    color: #4C6373;
    padding-left: 0px;
    display: grid;
    grid-gap: 9px;

}
.product-request .col-defintion h5{
    color: #101010;
    margin-bottom: 0px;
    
}
.col-defintion span,.x-btn{
    color: #CA002C;
    padding: 0px;
}
.product__Size{
    display: grid;
    grid-template-columns: 0.5fr 1fr;
}
.product__Size .form-select{
    padding: .375rem .75rem .375rem .75rem;
    color: #CA002C;
}
/* [dir="rtl"] .product__Size .form-select {
    background-position: left 4.7rem center;
} */
.component-Total,.data-total .form-check-label{
    color:#101010;
    font-weight: bold;
    font-size: 14px;
}
.data-total .form{

background-color: #FBFBFB;
border-radius: 4px;
border: 1px solid #EBEBEB;
color: #4C6373;
}
.component-Total span{
    color: #CA002C !important;
}
.data-total .form-check{
    padding-left: 0px;
    text-align: left;
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-content: center;
    grid-gap: 5px;
}
/*number-qulity*/
.product__optionc{
    display: grid;
    grid-template-columns: 0.5fr 1fr;
  
}
.product__Total{
    display: grid;
    grid-auto-flow: column;
}
.number-input input[type="number"] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;

  }
  
  
  .number-input input[type=number]::-webkit-inner-spin-button,
  .number-input input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
  }
  
  .number-input button {
    -webkit-appearance: none;
    background-color: transparent;
    border: none;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin: 0;
    position: relative;
  }
  
  .number-input button:before,
  .number-input button:after {
    display: inline-block;
    position: absolute;
    /* content: ''; */
    height: 2px;
    transform: translate(-50%, -50%);
    
  }
  
  .number-input button.plus:after {
    transform: translate(-50%, -50%) rotate(90deg);
  }
  
  .number-input input[type=number] {
    text-align: center;
  }
  
  .number-input.number-input button {
    width:10px;
    height:20px;
    cursor: pointer;
    justify-content: center;
   
      align-items: center;
  }
  
  .plus i ,.minus i{
    font-size: 14px;
  }
  
  .number-input.number-input input[type=number] {
    max-width: 2rem;
   
    border: 0px;
    border-width: 0 1px;
    font-size: 1rem;
    color: #00AE11;
    background: none;
  }
  
  @media not all and (min-resolution:.001dpcm) {
    @supports (-webkit-appearance: none) and (stroke-color:transparent) {
  
      .number-input.def-number-input.safari_only button:before,
      .number-input.def-number-input.safari_only button:after {
        
      }
    }
  }
  /*start-paying*/
  .component-payment-methods{
 border: 1px solid #C8CFD4;
 border-radius: 4px;
 color: #101010;
 font-size: 18px;

 font-weight: 500;
  }
  #Vodafone .component-payment-methods :nth-child(2n){
      border-bottom: 1px solid #C8CFD4;
     
  }
  .tabel-payment button{
      background-color: #CA002C;
      border-radius: 4px;
      color: #fff;
      font-size: 16px;
     margin-bottom: 2px;
  }
  .nav-paying .nav-link img{
      width: 48px;
      height: 36px;
  }
  .nav-paying .nav-link {
      background-color: #fff;
      border-radius: 8px;
      border: 1px solid #C8CFD4;
      
  }
  [dir="rtl"] .nav-paying .nav-link {
      margin-left: 10px;
  }
  [dir="ltr"] .nav-paying .nav-link {
    margin-right: 10px;
}
#Transfer .tabel-payment span{
    color: #CA002C;
}
@media (max-width: 1024px) { 
    .nav-paying {
        display: flex;
        flex-wrap: initial;
    }
    .nav-paying .nav-link img{
        display: none;
    }
}
  /*end-paying*/
  /*start-reports*/
  .title-earnings{
      color: #CA002C;
      border-bottom: 2px solid #CA002C;
      
  }
  .earnings-reports{
    box-shadow: 0px 3px 6px #00000033;
    padding:10px;
    overflow: auto;
  }
  .Product-number-title{
      color: #101010;
      font-size: 30px;
      line-height: 43px;
      font-weight: bold;
  }
  .row-reports-product{
      background-color: #E9E9E9;
      color: #4C6373;
      font-size: 16px;
      line-height: 21px;
      font-weight: 500;
      overflow: hidden;
      margin: 0px;
      width: 1000px;

  }
  .component-amount{
    overflow: hidden;
      margin: 0px;
      width: 1000px;
      border-top: 2px solid #E9E9E9;  
  }
  .img-name-reports img{
      width: 100px;
      height: 100px;
  }
  .img-name-reports span{
      color: #101010;
  }
  .reports-details span{
      color: #CA002C;
  }
  .reports-details-Total{
      color: #CA002C;
      font-weight: bold;
      font-size: 30px;
      position: relative;
      
  }
  .reports-details-Total::before {
    width: 1px;
    height: 60px;
    content: "";
    background-color: #4C6373;
    display: flex;
    position: absolute;
    top: -21px;
}
.reports-details-Total span{
    display: flex;
    justify-content: center;
}
.component-Residual{
    display: grid;
   grid-template-columns: 1fr 1fr;
   grid-gap: 30px;
}
.component-Residual h6,.component-Residual-title h6{
    color: #101010;
    font-size: 18px;
    font-weight: bold;
    line-height: 43px;
}
.component-Residual h6 span,.component-Residual-title h6 span,.reports-details-size small span{
    color: #CA002C;
}
  /*end-reports*/
  /*start-request*/
  .component-reports .row{
      margin: 0;
      align-items: center;
  }
  .component-earnings .navbar-nav{
    
    flex-direction: row;
    align-items: center;
  }
  .component-earnings .navbar-nav li a{
      color:#4C6373;
      font-size:18px;
       font-weight: 500;
       line-height: 21px;
}

  
  [dir="rtl"] .component-earnings .navbar-nav li{
      margin-left: 20px;
  }
  [dir="ltr"] .component-earnings .navbar-nav li{
    margin-right: 20px;
}
.col-select  .form-select {
    padding: 5px; 
}
.btn-data{
    width: 100%;
    background-color: #CA002C;
    border-radius: 4px;
    color: #fff;
    font-size: 16px;
}
.btn-tem{
    width: 100%;
    background-color: #C8CFD4;
    color: #4C6373;
}
.row-reports-requesets{
    font-size: 16px;
    line-height: 21px;
    font-weight: 500;
    overflow: hidden;
    margin: 0px;
    box-shadow: 0px 3px 6px #00001633;

}
.detiles-request{
    
    display: grid;
    align-items: center;
    justify-content: center;
    grid-auto-flow: column;
    grid-gap: 20px;
}
.hanging{
    color: #FFAA00 !important;
}
.Confirmed,.requests-quntinty span{
    color: #00AD11  !important;
}
[dir="rtl"] .reports-details-size{
    margin-right: 5px;
}
[dir="ltr"] .reports-details-size{
    margin-left: 5px;
}
@media (max-width: 1024px) { 
.component-reports-requesets{
    overflow: auto;
}
.row-reports-requesets{
width: 1000px;
}
}
#progressbar-request{
    margin-bottom: 30px;
    overflow: hidden;
    padding-left: 0px;
}

#progressbar-request .active {
    color: #CA002C
}

#progressbar-request li {
    list-style-type: none;
    font-size: 14px;
    width: 16%;
    float: right;
    position: relative;
    text-align: center;
    color: #4C6373;
}



#progressbar-request #confirm:before {
    font-family: FontAwesome;
    content: "\f00c"
}

#progressbar-request li:before {
    width: 50px;
    height: 50px;
    line-height: 45px;
    display: block;
    font-size: 18px;
    color: #ffffff;
    background: #E9E9E9;
    border-radius: 50%;
    margin:  0px auto 10px;

    padding: 2px;
    text-align: center;

}

#progressbar-request li:after {
    content: '';
    width: 100%;
    height: 2px;
    background: #E9E9E9;
    position: absolute;
    left: 0;
    top: 25px;
    z-index: -1
}
#progressbar-request li:last-child:after {
   
    position: absolute;
    right: -50%
}
#progressbar-request li:nth-child(2):after {
    left: -50%
}

#progressbar-request li:first-child:after {
   
    position: absolute;
    right: 50%
}



#progressbar-request li.active:before,
#progressbar-request li.active:after {
    background: #CA002C;
    
}

  
  /*end-request*/
  /*25/4/2021*/
 [dir="rtl"] .form-control.is-invalid, [dir="rtl"]  .was-validated .form-control:invalid {
  
    background-position: left calc(.375em + .1875rem) center; 
    padding-right: 2px;
  }
  [dir="rtl"] .form-control.is-valid, [dir="rtl"]  .was-validated .form-control:valid {
    background-position: left calc(.375em + .1875rem) center;
    padding-right: 5px !important;
    background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e);!
}
[dir="rtl"] .form-select.is-valid,[dir="rtl"] .was-validated .form-select:valid {
         padding-right: 2px;
         background-position: left .75rem center,center left  1.75rem;
}
[dir="rtl"] .component-form input[type="date"]{
    text-align: right;
}
.form-select{
    padding: .375rem .75rem .375rem .75rem;
}
::placeholder{
    color: rgb(138, 135, 135)

}
.row-header-sellers>div{
    display:flex;
    justify-content: center;

}
.component-control .col-lg-3{
    display:flex;
}
.card-products{
    display:flex;
    justify-content: center;
    width: 100%;
}
[dir="ltr"] .avatar-upload .avatar-edit {
    left: 291px;
}
.col-control .card {
    display: flex;
    height: 90%;
}
.img-hover-zoom {
    display: flex;
    align-items: center;
    overflow:hidden;
}
.img-hover-zoom span{
    line-height: 1.5em;
    width: calc(9* 1em);
}
.card-sellers{
    display: grid;
    grid-template-rows: max-content;
    grid-gap: 2px;
}
.card-sellers .card-body{
    display: grid;
    grid-template-rows: 1fr; 
}
.img-name-reports{
    display: flex;
    align-items: center;
}

input::-ms-clear, input::-ms-reveal {
    display: none;
}