:root {
    --bs-blue: #0d6efd;
    --bs-green: #25789a;
    /* --bs-green: #1697bf; */
    --bs-white: #ffffff;
    --bs-light: #f8f9fa;
    --bs-dark: #15212a;
    --bs-gray: #414142;
    --bs-farfash: #a5215e;
    --bs-font-tajwal: "Tajawal";
}
@font-face {
    font-family: "Tajawal";
    src: url("./../fonts/Tajawal/Tajawal-Regular.ttf") format("truetype");
    font-weight: 400;
}
@font-face {
    font-family: "Qomra";
    src: url("./../fonts/Qomra/itfQomraArabic-Regular.ttf") format("truetype");
    font-weight: 400;
}


.font-color-gray{
    color: var(--bs-gray) !important;
}
body {
    font-family: "Qomra", sans-serif;
}
body.font-tajwal {
    font-family: "Tajawal", sans-serif;
}

body.font-qomra {
    font-family: "Qomra", sans-serif;
}

body {
    font-family: "Qomra", sans-serif;
}

body.font-tajwal {
    font-family: "Tajawal", sans-serif;
}

body.font-qomrah {
    font-family: "Qomrah", sans-serif;
}

.bg-logo-green {
    background-color: var(--bs-green) !important;
}
.bg-farfash {
    background-color: var(--bs-farfash) !important;
}
.color-gray {
    /* color: var(--bs-gray) !important; */
}
.color-blue {
    color: var(--bs-blue) !important;
}
.color-search {
    color: rgb(238, 85, 134) !important;
}
.color-farfash {
    color: var(--bs-farfash) !important;
}
.c-logo-green {
    color: var(--bs-green) !important;
}
.text-white {
    color: var(--bs-white) !important;
}
[data-background="light"] .infonews .news,
[data-background="light"] .tick-label {
    background-color: var(--bs-dark);
}
[data-color="green"] .golink {
    /* color: var(--bs-green) !important; */
}
[data-background="light"] .infonews .news,
[data-background="light"] .tick-label {
    color: var(--bs-white);
}
[data-background="light"] .box-container .nav-menu .main-menu a,
[data-background="light"] .infonews .news,
[data-background="light"] .tick-label {
    /* color: var(--bs-white); */
}
[data-background="light"] .box-container .menu-wrap.fixed {
    top: 2rem;
    position: fixed;
    /* background: var(--bs-green) !important; */
}
[data-color="green"] .inner {
    /* background-color: var(--bs-green) !important; */
}
[data-color="green"] .megamenu .service-list .service .media-body a:hover {
    /* color: var(--bs-green) !important; */
}
.btn {
    /* color: var(--bs-dark) !important; */
}
.btn-white-fill {
    background-color: var(--bs-white) !important;
    color: var(--bs-dark) !important;
    border: none;
}
.btn:hover {
    /* color: var(--bs-green) !important; */
}
.btn.bg-logo-green:hover {
    color: var(--bs-white) !important;
}

a:hover {
    /* color: var(--bs-green); */
}
[data-color="green"] .bg-purple,
[data-color="green"] .btn-default-purple-fill {
    background-color: var(--bs-green) !important;
}
.infonews {
    top: 0;
    width: 100%;
    z-index: 9999;
    position: fixed;
}
[data-header="fixed"] .box-container .menu-wrap.fixed {
    position: fixed;
    top: 39px;
}
[data-background="light"] .box-container .menu-wrap {
    background-color: #1697bf00;
    padding: 15px 0;
}
[data-background="light"] .nav-menu .main-menu > .menu-item:hover {
    background-color: transparent !important;
}
[data-radius="defaultradius"] .nav-menu .main-menu > .menu-item {
    border: none !important;
}
.nav-menu .main-menu > .menu-item {
    padding: 8px 21px !important;
    float: left;
    list-style-type: none;
}
.main-container.slider .silder-container .slider-content h1 {
    position: relative;
    margin-bottom: 20px;
    color: var(--bs-white);
    display: inline-block;
    font-weight: 700;
    line-height: 78px;
    font-size: 72px;
    letter-spacing: 0 !important;
}
nav .tech-box {
    margin: 0 15px;
    cursor: pointer;
    display: inline-block;
    width: 37px;
}
.menu-wrap.mobile a {
    font-weight: 200 !important;
}
.menu-wrap.mobile,
active {
    font-weight: 300 !important;
    /* color: var(--bs-green) !important; */
}
.menu-wrap.mobile a:hover {
    font-weight: 300 !important;
    /* color: var(--bs-green) !important; */
}
.dropdown-menu hr {
    color: var(--bs-green);
}
[data-background="light"]
    .box-container
    .menu-wrap.mobile
    .nav-menu
    .main-menu
    > .menu-item:hover
    > a {
    /* color: var(--bs-green) !important; */
    /* color: #edebe0 !important; */
}
.inner-content i {
    float: right !important;
    line-height: 2 !important;
}
/* home----------------------------------------------------------------------------- */
[data-color="green"] .pricing .wrapper .title {
    /* color: var(--bs-green) !important; */
}
.golink-dark {
    color: var(--bs-dark) !important;
}
[data-color="green"] .c-logo-green,
[data-color="green"] .golink-dark {
    color: var(--bs-green) !important;
}
.pricing .list-info {
    padding: 30px 15px 40px 15px;
}
.pricing.special .list-info li span {
    top: 8px;
    position: relative;
}
.pricing.special .list-info li span a {
    color: var(--bs-white) !important;
}

.pricing.special .list-info li {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.truncate {
    width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.carousel-cell {
    width: 100%;
    height: 100vh;
    margin-right: 0 !important;
}
[data-background="light"] .box-container .bg-seccolorstyle,
[data-background="light"] .box-container .footer,
[data-background="light"] .box-container .sec-bg3.infonews,
[data-background="light"] .casestudy .sec-main {
    /* background-color: var(--bs-dark) !important; */
}
/* [data-background="light"] .box-container{
    /* color: var(--bs-white) !important;
} */
/* home services */

.accordion.faq .panel-title.active .fa-lock {
    display: none;
}
.accordion.faq .panel-title .fa-lock-open {
    display: none;
    /* color: #212122; */
}

.accordion.faq .panel-title.active .fa-lock-open {
    display: inline-block;
}

.help .help-container.ser {
    position: relative;
    height: 75px;
    margin-top: 15px;
    border-radius: 12px;
    /* background-color: #fff !important; */
    box-shadow: 0 5px 15px 0 rgba(110, 110, 110, 0.1);
    width: 100% !important;
}
.help .help-item {
    top: 0;
    right: 0;
    left: 0;
    display: block;
    border: 0;
    font-size: 1rem;
    padding: 0;
    overflow: hidden;
}
.help .help-item .img {
    position: relative;
    width: 25%;
    height: 100%;
    padding: 2.5%;
}
.service-icon-card {
    margin-top: 0.5rem;
    width: 2.3rem;
    /* filter: invert(59%) sepia(30%) saturate(608%) hue-rotate(45deg)
        brightness(95%) contrast(87%); */
}
.service-icon {
    filter: brightness(0) invert(1);
}
.help .help-item .inform {
    width: 65%;
    padding: 0px 2.5%;
}

.popup-gallery img {
    width: 100% !important;
    padding: 0 !important;
    border-radius: 12px !important;
}
.sec-main {
    position: relative !important;
    padding: 1.2em;
}

[data-background="light"] .box-container .seccolor {
    /* color: #fff !important; */
    overflow: hidden;
}
small {
    /* color: var(--bs-white); */
    font-weight: 300 !important;
}
.help .help-item:before {
    content: "";
    top: 23px;
    left: 28%;
    width: 1px;
    height: 50%;
    background: grey;
}

.circle-section .title-round {
    font-size: 15px;
    font-weight: 700;
    margin-top: 75px;
}
.f-w {
    font-weight: 700;
}
.circle-section .section-heading {
    color: var(--bs-green) !important;
}

[data-background="light"] .circle-section {
    color: #808080 !important;
}

.circle-section .circliful:before {
    content: "";
    border: 3px solid #808080;
    display: inline-block;
    border-radius: 100%;
    position: absolute;
    top: 30px;
    right: 30px;
    padding: 59px;
    z-index: 0;
}
/* calculator--------------- */

[data-background="dark"] .box-container .notoppadding,
[data-background="light"] .box-container .notoppadding {
    padding-top: 3% !important;
}
.cd-filter-block input[type="checkbox"]{
/* .cd-filter-block input[type="radio"] { */
    position: relative;
}
/* footer .............  */
.footer .footer-top {
    padding: 98px 0 20px;
}
.footer .soc-icons i:hover {
    color: #1b728c !important;
}
.accordion .panel-title {
    font-size: 15px;
}

.active2,
.btn.question,
.section-heading {
    font-weight: 700 !important;
}

/* centers
 */
[data-background="light"] .box-container .seccolor {
    /* color: #fff !important; */
    /* font-weight: 300; */
    overflow: hidden;
}

ol,
ul {
    padding-right: 1rem !important;
}

ol {
    list-style-type: decimal;
    list-style-position: inside;
    position: relative;
    top: -10px;
}

.img-icon {
    width: 30px !important;
    height: 30px !important;
    margin-left: 10px;
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(0deg)
        brightness(100%) contrast(100%);

    border-radius: 0px !important;
}
[data-color="green"] .blog .sidebar .categories .heading a.active,
[data-color="green"] .blog .sidebar .heading.active,
[data-color="green"] .c-pink,
[data-color="green"] .fullrock .closer,
[data-color="green"] .golink,
[data-color="green"] .golink:hover,
[data-color="green"] .megamenu .service-list .service .media-body a:hover,
[data-color="green"] .megamenu-list .service-list .service .media-body a:hover,
[data-color="green"]
    .nav-menu
    .main-menu
    .menu-item
    .menu-large
    .service-list
    .service
    .media-body
    a:hover,
[data-color="green"]
    .nav-menu
    .main-menu
    > .menu-item
    > .sub-menu
    > .menu-item
    a:hover {
    /* color: var(--bs-green) !important; */
}

.menu.categories hr {
    /* color: green; */
    height: 2px;
}

.circle-section .section-heading {
    color: var(--bs-green) !important;
}
.myshadow {
    /* filter: drop-shadow(0px 10px 15px 0px gray); */
    /* filter: drop-shadow(0px 6px 8px rgba(0, 0, 0, 0.2)); */

    box-shadow: 0px 4px gray !important;
}
[data-background="light"] .circle-section {
    color: #808080 !important;
}

.table > :not(caption) > * > * {
    border-bottom-width: 0px;
}

.offcanvas.offcanvas-box .card svg {
    position: relative;
    right: 10%;
    width: 80%;
    height: 50%;
    border-radius: 0px !important;
    top: 5px;
}

.accordion.faq .panel-title.ser {
    color: var(--bs-gray) !important;
}
/* news ......... */
.blog .sidebar .posts .img {
    height: auto;
    width: 100% !important;
    float: left;
    border-radius: 12px;
    margin: 0 15px 0 0;
}
.blog .service-wrap .service-section .small b,
.blog .wrap-blog .text-blog i,
.h-plans-info .header-wrap .price {
    font-size: 16px;
}
.height_title {
    height: 5em !important;
}
.icon-man:before {
    content: "\e9a8";
    margin-left: 10px;
}
.services .service-wrap .service-section .title {
    font-weight: 700;
    font-size: 22px;
    /* color: var(--bs-green); */
    margin-bottom: 14px;
    /* margin-bottom: 14px;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s; */
    transition: 0.3s;
}
.active,
.active2,
.btn.question,
.section-heading {
    font-weight: 700 !important;
    /* color: var(--bs-green) !important; */
}
.blog.blog .wrap-blog img {
    border-radius: 10px;
    height: auto;
    width: 100%;
}
.accordion.faq .panel-title-dark {
    color: black !important;
}

.run-switch .switch {
    position: relative;
    box-shadow: 0 2px 8px 0 rgba(62, 62, 79, 0.23);
    vertical-align: middle;
    width: 0px in !important;
    height: 30px !important;
    margin-left: 15px;
    margin-right: 15px;
    border-radius: 15px;
    background-color: transparent !important;
    z-index: 3;
}

.included i {
    /* color: #97cb3b !important; */
}
.godown span {
    /* color: #55bde5 !important; */
}

.footer .soc-icons i {
    /* color: #55bde5 !important; */
}

.total-grad-inverse {
    /* background: linear-gradient(240deg, #1697bf 0, #55bde5 100%) !important; */
}

/* .menu-wrap {
    background-color: #15212a !important;
} */
.sec-bg3.infonews {
    background-color: #101920 !important;
}

/* .knowledge a {
    color: #55bde5 !important;
} */

.blog .sidebar .heading.active {
    color: #55bde5 !important;
}

.blog .sidebar .posts .tabs-header li.active {
    color: #55bde5 !important;
    border-bottom-color: #55bde5 !important;
}
/* #sidebar{
    overflow:auto;
    height: 25em;
} */
#sidebar_content {
    position: relative;
    /* top: 2.6rem; */
    /* top: 37px; */
    margin-bottom: 20rem;
}
/* //courses */
[data-color="green"] .tabs.offers-tabs .tabs-header .active {
    border-right: 3px solid #97cb3b !important;
    color: #97cb3b !important;
}
.tabs.offers-tabs .tabs-header li {
    font-size: 18px;
    border-right: 2px solid #4c4a4a;
    padding: 0 26px 0 30px !important;
    cursor: pointer;
    /* color: #181b22; */
    text-align: right;
    -webkit-transition: 0.3s;
    margin-top: 50px;
}

.cd-filter-block input,
.cd-filter-block select {
    width: 100% !important;
    padding: 15px 60px 15px 30px !important;
}

[data-color="green"] .cd-filter-block input:focus,
[data-color="green"] .cd-filter-block select:focus,
[data-color="green"] .fill-input:focus {
    border-color: #55bde5 !important;
}
/* // */
.blog .sidebar .categories .heading span {
    /* color: #4c4a4a !important; */
    font-size: 18px !important;
}
.accordion.faq .panel-title.service a {
    /* padding: 20px 10px 20px 59px!important; */
    color: #4c4a4a !important;
}
.accordion.faq .wrapper-collapse .list li a {
    /* padding: 20px 10px 20px 59px!important; */
    /* color: #4c4a4a !important; */
}
.blog .sidebar .categories .heading .panel-collapse {
    /* border-top: #0d6efd 1px solid; */
    margin-right: 2.4em;
}
.blog .sidebar .categories .heading .panel-collapse a {
    font-size: 0.9em;
}
.accordion.faq .panel-title.service {
    border-bottom: none;
    padding: 0 !important;
}
.accordion.faq .panel-title.service.active {
    border: none !important;
}
.accordion.faq .wrapper-collapse .list li {
    padding: 5px 0 !important;
}
/* @media (min-width: 992px) {
    [data-color=green] .accordion.faq .panel-title.active{
        border: none !important;
        font-weight: 300 !important;
    }
} */
.tabs.offers-tabs .tabs-content p {
    /* color: var(--bs-gray); */
}
.accordion.faq .panel-title.certi {
    /* color: var(--bs-white) !important; */
}
.accordion.faq .wrapper-collapse.certi .list li a {
    color: var(--bs-white) !important;
}
.services .service-wrap .service-section .subtitle {
    line-height: 1.8em !important;
    font-size: 1em !important;
    /* height: 5em; */
    margin-top: 3px;
}

.services .service-wrap .service-section .my_subtitle p {
    font-size: 0.7em !important;
    line-height: 1.5em !important;
}

/* .section{
    border:1px solid #101920;
} */

/* [data-radius="defaultradius"] .cd-filter-block.txtinput input {
    border-radius: 0px !important;
    border-top: 0px !important;
    border-right: 0px !important;
    border-left: 0px !important;
} */

/* #regForm {
    background-color: #ffffff;
    margin: 100px auto;
    font-family: Raleway;
    padding: 40px;
    width: 70%;
    min-width: 300px;
}

h1 {
    text-align: center;
} */

/* input {
    padding: 10px;
    width: 100%;
    font-size: 17px;
    font-family: Raleway;
    border: 1px solid #aaaaaa;
} */

/* Mark input boxes that gets an error on validation: */
/* input.invalid {
    background-color: #ffdddd;
} */

/* Hide all steps by default: */
/* .tab {
    display: none;
}

button {
    background-color: #04aa6d;
    color: #ffffff;
    border: none;
    padding: 10px 20px;
    font-size: 17px;
    font-family: Raleway;
    cursor: pointer;
}

button:hover {
    opacity: 0.8;
}

#prevBtn {
    background-color: #bbbbbb;
} */

/* Make circles that indicate the steps of the form: */
/* .stepper-container {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 40px;
    gap: 10px;
}

.step-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
} */

/* .circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #ccc;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 16px;
} */

/* .label {
    margin-top: 6px;
    font-size: 14px;
    font-weight: 500;
} */

/* .line {
    height: 4px;
    width: 40px;
    background-color: #ccc;
} */

/* .step-item.active .circle {
    background-color: #800080;
.step-item.active + .line {
    background-color: #800080;
} */

.dropbtn {
    background-color: transparent !important;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #fff;
    min-width: 160px;
    box-shadow: 0 8px 8px 0 rgb(62 62 79 / 23%);
    border-radius: 12px 12px 12px 12px !important;
    z-index: 1;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {
    background-color: #ddd;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
    background-color: #3e8e41;
}
.cd-filter-block label i {
    font-size: 20px !important;
    color: grey !important;
    top: 20px !important;

    position: absolute !important;
}
.cd-filter-block .my-contact label i {
    font-size: 20px !important;
    color: grey !important;
    top: 40px !important;
    position: absolute !important;
}

.loginh2 {
    font-size: 2rem;
    line-height: 1.2;
    color: #fff !important;
    font-family: "Open Sans", sans-serif !important;
    margin-top: 0;
    margin-bottom: 0.5rem;
    font-weight: 500;
    line-height: 1.2;
}
.paddingsec {
    padding: 80px !important;
}

.cd-filter-block h4 {
    text-transform: capitalize !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    color: #fff !important;
}

.bg-colorstyle {
    background-color: #15212a !important;
}

.bg-seccolorstyle,
[data-background="dark"] .box-container .footer,
[data-background="dark"] .casestudy .sec-main {
    background-color: #101920 !important;
}

.force-bg1 {
    background-color: #15212a !important;
}
.force-bg2 {
    background-color: #101920 !important;
}

.fullrock .svg.logo-menu {
    position: relative !important;
    width: 165px;
    top: -70px;
}

.history-section .row {
    height: auto;
    display: flex;
    padding-bottom: 15px;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
}

.about_img {
    width: 100%;
    height: 315px;
    object-fit: contain;
    display: block;
}

[data-background="dark"] .box-container .cpupath,
[data-background="light"] .box-container .cpupath {
    background-image: url(../patterns/cpupath.svg) !important;
}

/****************************************************************************************/
.out-bg-dark {
    background-color: #15212a !important;
    color: #fff !important;
}
/* .out-bg-light {
    background-color: #fff !important;
    color: #28282b !important;
} */
.out-bg-id {
    background-color: #002623 !important;
}
/* ******************************************************************************************** */
.in-bg-dark {
    background-color: #101920 !important;
    color: #fff !important;
}
/* .in-bg-light {
    background-color: #ebeff5  !important;
    color: #28282b  !important;
} */
.in-bg-id {
    background-color: #054239 !important;
}
/* ************************************************************************* */
.out-bg-dark .total-grad-pink-blue-intense {
    background: linear-gradient(240deg, #131313 50%, #003d4a 100%);
}
.out-bg-id .total-grad-pink-blue-intense {
    background: linear-gradient(240deg, #1f1f1f 50%, #003a01 100%);
}
/* ******************************************************************** */
.out-header-divs {
    background-color: #101920 !important;
    color: #988561;
}
.out-header-id-divs {
    background-color: #ebeff5 !important;
    color: #28282b;
}
/* **************************************************************************** */
.body-divs-dark {
    background-color: #1697bf  !important;
    color: #988561;
}
/* .body-divs-light {
    background-color: #ebeff5   !important;
    color: #1697bf;
} */
.body-divs-id {
    background-color: #002623 !important;
    color: #988561;
}
/* ************************************************************************************* */
.color-req-serv-dark {
    color: #25789a;
}
.color-req-serv-id {
    color: #988561;
}
/* ******************************************************************************************* */
.body-header-divs {
    background-color: #054239 !important;
    color: #988561;
}
.body-header-divs {
    background-color: #1697bf  !important;
    color: #28282b;
}
/* *************************************************************************************************** */
.in-bg-id-lcolor {
    color: #edebe0;
    font-weight: 100;
}
.in-bg-id-mcolor {
    color: #b9a779;
    font-weight: 400;
}
.in-bg-id-bcolor {
    color: #988561;
    /* font-size: 50px; */
    font-weight: 900;
}
.out-bg-dark .in-bg-id-bcolor .active {
    color: #1697bf;
    font-weight: 900;
}

.out-bg-id .in-bg-id-bcolor .active {
    color: #988561;
    font-weight: 900;
}

/* .in-bg-light-lcolor {
    color: #28282b;
    font-weight: 100;
}
.in-bg-light-mcolor {
    color: #28282b;
    font-weight: 400;
}
.in-bg-light-bcolor {
    color: #28282b;
    font-weight: 900;
}
.in-bg-light-bcolor .active {
    color: #28282b;
    font-weight: 900;
} */
/* ********************************************************************************************************* */
.color-req-serv-dark-bg {
    background-color: #25789a;
}
.color-req-serv-id-bg {
    background-color: #002623;
}
/* *************************************************************************************************************** */
.dark-svg svg #svg-ico {
    fill: #25789a;
}
.dark-svg svg #svg-concept {
    stroke: #25789a;
}
.identity-svg svg #svg-ico {
    fill:   #edebe0
}
.identity-svg svg #svg-concept {
    stroke: #edebe0
}

/* ********************************************************************************************************************* */
.filter-dark {
    filter: invert(69%) sepia(27%) saturate(648%) hue-rotate(161deg)
        brightness(91%) contrast(88%);
}
.filter-id {
    filter: invert(10%) sepia(56%) saturate(1362%) hue-rotate(120deg)
        brightness(92%) contrast(103%);
}
/* ****************************************************************************************************************************** */
.dark-btn {
    background-image: linear-gradient(
        to right,
        #1697bf,
        #55bde5 40%,
        #55bde5 40%,
        #1697bf
    );
    color:#fff !important;
}
.id-btn {
    background-image: linear-gradient(
        to right,
        #002623,
        #054239 40%,
        #054239 40%,
        #002623
    );
    color:#fff;
}
/* *************************************************************************************************************************** */
.text-muted{
    color: #edebe0;
    font-weight: 100;
}