@import url("../../css/new_frontend/fonts/font.css");
:root{
	--primary-color:#021859;
	--grey-color:#707070;
    --primary-light-color:#B0C9D9;
    --light-grey-color:#f3f3f3
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {font-family: "Tajawal", sans-serif;line-height: 1;font-size: 16px;font-weight: 400;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}

.position-relative{position: relative !important;}
.top-unset{top: unset !important;}

.whatWeProvide, .shippingCompanies, .Annoucement {
    padding: 0 25px;
}

/*FONTS SIZES----------------------------------------------------------------------------------------------------------------------------------------------------------FONTS SIZES*/

h1,h2,h3,h4,h6 {font-family: "Tajawal", sans-serif;}
h1 {font-size: 50px;}
h2 {font-size: 30px;}
h3 {font-size: 20px;}
h6 {font-size: 16px;}

.p-lg {font-size: 24px;}
.p-xs {font-size: 12px;}
.p-sm {font-size: 14px;}
.p-md {font-size: 20px;}
.p-lg {font-size: 26px;}
.p-xl {font-size: 32px;}

/*FONTS SIZES----------------------------------------------------------------------------------------------------------------------------------------------------------FONTS SIZES*/

/*SHADES----------------------------------------------------------------------------------------------------------------------------------------------------------SHADES*/

.text-primary{color: var(--primary-color) !important;}
.text-light-primary{color: var(--primary-light-color) !important;}
.text-grey{color: var(--grey-color) !important;}
.bg-primary{background-color: var(--primary-color) !important;}
.bg-grey{background-color: var(--light-grey-color) !important;}

/*SHADES----------------------------------------------------------------------------------------------------------------------------------------------------------SHADES*/

.f-height{height: 100vh;}
a{display: inline-block;cursor: pointer;transition: ease-in-out .2s;}
:focus {outline: none !important;box-shadow: none !important;}

/*LOADER CSS----------------------------------------------------------------------------------------------------------------------------------------------------------LOADER CSS*/

.page-loader {display: flex;justify-content: center;align-items: center;position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(255, 255, 255, 0.9);z-index: 9999;}
/* .loader {border: 8px solid #f3f3f3;border-top: 8px solid var(--primary-color);border-radius: 50%;width: 50px;height: 50px;animation: spin 2s linear infinite;} */
/* @keyframes spin {0% { transform: rotate(0deg); }100% { transform: rotate(360deg); }} */
.loader img{height: 150px; width: 150px; object-fit: contain; object-position: center;}

/*LOADER CSS----------------------------------------------------------------------------------------------------------------------------------------------------------LOADER CSS*/

/*SITE INPUT CSS----------------------------------------------------------------------------------------------------------------------------------------------------------SITE INPUT CSS*/

.site-input {width: 100%;border: 1px solid #707070;border-radius: 13px;color: #707070;background:transparent;padding: 12px 17px;appearance: none;font-size: 14px; min-height: 50px;}
.site-input::placeholder {color: #707070;}
.site-label {font-weight: 600;margin-bottom: 5px;font-family: "Tajawal", sans-serif; color: var(--primary-color);}
.pass-icon {position: absolute;top: 50%;transform: translateY(-50%);right: 17px;line-height: 0; color: #666;}

/*SITE INPUT CSS----------------------------------------------------------------------------------------------------------------------------------------------------------SITE INPUT CSS*/

/*BUTTON CSS----------------------------------------------------------------------------------------------------------------------------------------------------------BUTTON CSS*/

.transparent-btn {background: transparent;padding: 0;border: 0;}
.site-btn {background: var(--primary-color);border-radius: 13px;border: 1px solid var(--primary-color);color: white;font-size: 16px;font-weight: 600;padding: 13px 25px;min-width: 160px;transition: ease-in-out 0.2s;text-align: center;border-radius:99px;}
.site-btn:hover {background: transparent;color: var(--primary-color);}
.white-btn {background: #fff;color: var(--primary-color);border: 1px solid transparent;}
.white-btn:hover {color: #fff;background: transparent;border-color: #fff;}

/*BUTTON CSS----------------------------------------------------------------------------------------------------------------------------------------------------------BUTTON CSS*/


/*LANGAUGE DROPDOWN CSS----------------------------------------------------------------------------------------------------------------------------------------------------------LANGAUGE DROPDOWN CSS*/

.langDrop {position: absolute;top: 0.5rem; z-index: 1;}
.langDrop a {background: transparent;border: none;color: var(--grey-color);font-size: 20px;}
.langDrop a:hover {background-color: var(--primary-color);color: #fff;}
.langDrop ul.dropdown-menu.show li a {font-size: 13px;}
.langDrop .dropdown-toggle:focus {background-color: var(--primary-color);box-shadow: none;border: none;}

/*LANGAUGE DROPDOWN CSS----------------------------------------------------------------------------------------------------------------------------------------------------------LANGAUGE DROPDOWN CSS*/

/*HEADER CSS----------------------------------------------------------------------------------------------------------------------------------------------------------HEADER CSS*/

.auth-logo {width: 150px;flex-grow: 1;}

.mainLogo {width: 130px;}

.myNav button.navbar-toggler {padding: 0;border: none;}
.myNav button.navbar-toggler {box-shadow: none;}
.myNav span.navbar-toggler-icon{background-image: url('../../images/new_frontend/metro-lines.png') !important;}

header a {color: #fff !important;text-decoration: none;font-weight: 400;transition: opacity .5s !important;}
header a.nav-link.active {font-weight: 700;}
header a:hover {opacity: .7;}

header .langDrop ul.dropdown-menu.show li a {color: inherit !important;}

header .langDrop ul.dropdown-menu.show li a.active,  header .langDrop ul.dropdown-menu.show li a:hover{  color: #fff !important;}

header .site-btn {padding: 10px 10px;min-width: 120px;font-size: 14px;border-radius: 99px;}
/* header{position: fixed;width: 100%;background: transparent !important;z-index: 100;} */

header {
    position: fixed;
    width: 100%;
    background: transparent !important;
    z-index: 100;
    top: 0px;
    /* min-height: calc(40px - -140px) !important; */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .5s;
}

.secondar-header {
    color: #211af7;
    background: #ffffff;
    font-size: 18px;
    text-align: center;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 50px;
    z-index: 1000000;
    width: 100%;
    font-weight: 700;
    z-index: 1;

}
.secondar-header a {
    color: #211af7 !important;
}

.top-close-btn {
    position: absolute;
    right: 1rem;
    background: transparent;
    color: #000;
    border: 1px solid #000;
    border-radius: 99px;
    font-size: 14px;
    height: 30px;
    width: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .5s;
}

.top-close-btn:hover {
    background: #312afb;
    border-color: #312afb;
    color: #fff;
}
/*HEADER CSS----------------------------------------------------------------------------------------------------------------------------------------------------------HEADER CSS*/

/*FOOTER CSS----------------------------------------------------------------------------------------------------------------------------------------------------------FOOTER CSS*/

img.paymentOpt {height: 35px;object-fit: contain;width: 50px;background: #fff;padding: 0 5px;}
footer {background-color: var(--primary-color);}
.footer-links a{text-decoration: none;font-weight: 300 !important;color: #fff;}
ul.footer-links li:not(:last-child) {margin-bottom: 0.5rem;}
.max-250px{max-width: 250px;}
ul.footer-links {column-count: 2;}
img.social-img-icon {width: 20px;height: 20px;object-fit: contain;}
.footer-links a:hover, ul.socials li a:hover .social-img-icon, footer a:hover {opacity: 0.8;}
img.storesImg.img-fluid {width: 100%;max-width: 100px;height: 30px;object-fit: contain;}

/*FOOTER CSS----------------------------------------------------------------------------------------------------------------------------------------------------------FOOTER CSS*/

section.banner {
    /* min-height: calc(100vh - 200px); */
    display: flex;
    align-items: center;
    /* background-image: url(../../images/new_frontend/banner-shape-new.png); */
    background-repeat: no-repeat;
    background-position: center 61px;
    background-size: 101% 80%;
    overflow: hidden;
    position: relative;
    /* background-color: #f4f4f4; */
    height: 450px;
}

/* curveness css */

/* section.banner {overflow: hidden;position: relative;background-color: #f4f4f4;height: 75vh;}
.cur-col{height: 70vh;display: flex;align-items: center;justify-content: center;flex-direction: column;}
img.shapeBanner{position: absolute;left: 0;right: 0;top: 60px;width: 100%;min-height: 40vh;} */

/* curveness css */

.bannerText, section.banner a{z-index: 12;position: relative;}
img.moving{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 66%;filter: brightness(0.9);animation: moveX 5s ease-in-out infinite;z-index: 1;max-width: 100%;}


@keyframes moveX {
    0% {

        transform: translate(-50%, -50%)

    }
    50% {

        transform: translate(-52%, -50%)
    }
    100% {

        transform: translate(-50%, -50%)
    }
}


section.aboutTwsaa{background-color: #eaeaea85; position: relative; z-index: 1;  padding: 100px 0 !important}
section.aboutTwsaa:before {content: '';background: url(../../images/new_frontend/float.png);height: 10px;  width: 20px;position: absolute;right: -2rem;top: 0;width: 110px;height: 67px;filter: contrast(0.5);  opacity: .3;}

section.aboutTwsaa .owl-nav {display: flex;width: 100%;justify-content: space-between;height: 100%;align-items: center;position: absolute;top: 50%;transform: translateY(-50%);z-index: -1;}
section.aboutTwsaa .owl-carousel .owl-nav button span {width: 32px;height: 32px;background-color: var(--primary-color);border-radius: 50%;display: flex;align-items: center;justify-content: center;color: #fff;font-size: 20px;transition: .5s;}
section.aboutTwsaa .owl-carousel .owl-nav button span:hover {opacity: 0.8;}

section.aboutTwsaa button.owl-prev, button.owl-next{position: relative;}
section.aboutTwsaa button.owl-prev{right:-2.5rem}
section.aboutTwsaa button.owl-next{left:-2.5rem}

img.aboutIcon {height: 50px;width: 50px;object-fit: contain;}

/* .aboutBox {background: linear-gradient(45deg, hsla(0, 0%, 84%, 1) 0%, hsla(0, 0%, 98%, 1) 100%);background: -moz-linear-gradient(45deg, hsla(0, 0%, 84%, 1) 0%, hsla(0, 0%, 98%, 1) 100%);background: -webkit-linear-gradient(45deg, #d6d6d6 0%, hsla(0, 0%, 99%, 1) 100%);border-radius: 60px;padding: 1rem 1rem;position: relative;overflow: visible;min-height: 235px;display: flex;flex-direction: column;align-items: center;justify-content: center;overflow: hidden;max-width: 370px;margin: auto;} */

h3.aboutTrait {font-size: 25px !important;}

h2.aboutHeading {font-size: 40px;}

/* .aboutBox:before, .aboutBox:after {content: "";width: 109px;height: 118px;position: absolute;border-radius: 50px;background-image: url(../../images/new_frontend/curved-box.png);background-size: cover;background-repeat: no-repeat;} */
.aboutBox:before {left: -15px;top: -12px;}
.aboutBox:after {right: -15px;bottom: -12px; transform: rotate(180deg);}

section.whatWeProvide{position: relative;}

section.whatWeProvide p, section.AboutInner p{line-height: 30px;}
section.AboutInner p {max-width: 700px; margin: auto;}

section.whatWeProvide:before {content: '';background: url(../../images/new_frontend/float.png);position: absolute;left: 0rem;top: -1rem;width: 110px;height: 67px;filter: contrast(0.5);
  opacity: .3;transform: scale(1.8);}

img.shipmentCompany {width: 100%; max-width: 150px; object-fit: contain; height: 50px;margin: auto;}

.shippingCompanies .owl-dots {text-align: center;padding-top: 2rem;}
.shippingCompanies button.owl-dot {width: 8px;height: 8px;border-radius: 50%;display: inline-block;background: #221afb85 !important;margin: 0 0.45rem;transition: .5s;}
.shippingCompanies button.owl-dot.active {background: var(--primary-color);zoom: 1.2;}

.icon-one:before, .icon-two:before, .icon-two:after, .icon-three:after, .icon-three:before, .icon-clm:before {content: '';background: url(../../images/new_frontend/float.png);width: 110px;height: 67px;filter: contrast(0.5);opacity: .3;z-index: 11 !important;transform: scale(0.5); position: absolute;}

.icon-one:before {left: 4rem;bottom: 1rem;}
.icon-two:before {left: 4rem;bottom: 1rem;}
.icon-two:after {right: 4rem;bottom: -1rem;}
.icon-clm:before{left: -3rem;top: 50%;transform: translateY(-50%);transform: scale(1);}
.icon-three:before {left: -3rem;top: 50%;transform: translateY(-50%);transform: scale(1);}
.icon-three:after {right: 4rem;bottom: -1rem;}

.loop {filter: contrast(0.5);  opacity: .3; position: absolute;}
.about-one {bottom: 0;left: 0;transform: scale(1.6);}
.about-two {bottom: 0;right: 0;transform: scale(0.6);}
.about-three {left: 0;bottom: 0;}
.about-four {right: 0;bottom: 2rem;transform: scale(0.8);}

section.paymentBanner h1.bannerText {font-size: 35px;}

.helpBox {border-radius: 58px;box-shadow: 5px 13px 7px 0 #d8d8d8;border: solid 1px #e0e0e0;  background-color: #fff;min-height: 200px;display: flex;align-items: center;justify-content: center;  text-align: center;padding: 0 2rem;}

img.iconPayment {box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);width: 35px;height: 35px;border-radius:99px;object-fit: contain;object-position: center center;padding: 4px;}

.paymentCarousel .owl-stage-outer{padding: 50px 0;}

.Offers img {height: 100px;width: 100%;max-width: 150px;object-fit: contain;margin-bottom: 1rem;}

/*TOGGLE PRICE CSS----------------------------------------------------------------------------------------------------------------------------------------------------------TOGGLE PRICE CSS*/

.priceToggle {position: relative;box-sizing: border-box;}
.priceToggle input[type=checkbox] {position: absolute;left: 0;top: 0;z-index: 10;width: 100%;height:100%;cursor:pointer;opacity: 0;}
.priceToggle label {position: relative;display: flex;align-items: center;box-sizing: border-box;}
.priceToggle input[type=checkbox]:checked+label:before {background: #ffffff;}
.priceToggle label:before {content: "";width: 64px; height: 32px;position: relative;display: inline-block;            background: #fff;border-radius: 46px;border: 3px solid #021859;box-sizing: border-box;transition: 0.2s ease-in;}
.priceToggle input[type=checkbox]:checked+label:after {left: 38px;background: #021859;}
.priceToggle label:after {content: "";position: absolute;width: 18px;height: 18px;border-radius: 50%;left:10px;top: 7px;z-index: 2;background: #021859;box-sizing: border-box;transition: 0.2s ease-in;}
.priceToggle {display: flex;align-items: center;justify-content: center;gap: 1rem;}
.priceToggle span {display: block;}

/*TOGGLE PRICE CSS----------------------------------------------------------------------------------------------------------------------------------------------------------TOGGLE PRICE CSS*/

/* #plans .fca-ept-plan-image img {margin-top: 1rem;max-width: 150px !important;width: 100%;height: auto;object-fit: contain;object-position: center;} */
img.home-loop {position: absolute;top: -18px;right: -1rem;transform: scale(1.2);z-index: 2;opacity: 0.3;filter: contrast(0.5);}

/*PACKAGES CSS----------------------------------------------------------------------------------------------------------------------------------------------------------PACKAGES CSS*/

#plans div.fca-ept-layout5 {margin: 0 !important;max-width: unset !important;padding: 0 !important;}
div.fca-ept-layout5 {font-size: 16px;font-family: "Tajawal", sans-serif;;margin: 50px auto;display: flex;padding-right: 10px;line-height: 1.5;}
#plans div.fca-ept-layout5 div.fca-ept-column {flex: 0 0 220px !important;}
#plans div.fca-ept-layout5 div.fca-ept-column {--tw-border-opacity: 1 !important;background-color: transparent !important;border-style: none !important;border-right: 1px solid #eee !important;margin: 8px 0 0 !important;padding-top: 0;z-index: 10;}
div.fca-ept-layout5 div.fca-ept-column {border: 1px solid #e9e9e9;font-family: "Tajawal", sans-serif;;flex-grow: 1;flex-shrink: 1;flex-basis: 0%;z-index: 0;position: relative;display: grid;grid-template-rows: auto auto auto 1fr;padding-top: 10px;}
#plans .fca-ept-layout5 .fca-ept-comparison-div .fca-ept-comparison {background-color: transparent !important;}
div.fca-ept-layout5 div.fca-ept-comparison-div ul {font-family: "Tajawal", sans-serif;;letter-spacing: inherit;text-align: start;margin: 0;padding-left: 0;font-weight: bolder;background-color: #fff;}
#plans .fca-ept-layout5 .fca-ept-comparison-div .fca-ept-comparison li:first-child {border-top-width: 0 !important;}
div.fca-ept-layout5 div.fca-ept-comparison-div .fca-ept-comparison li {border-top: 1px solid #e9e9e9;border-left: 1px solid #e9e9e9;font-family: "Tajawal", sans-serif;;min-height: 60px;box-sizing: border-box;text-align: center;list-style-type: none;padding: 1em;margin: 0;}
#plans div.fca-ept-layout5 div.fca-ept-plan-div {--tw-bg-opacity: 1;background-color: rgb(255 255 255 / var(--tw-bg-opacity));min-height: 150px;position: relative;width: 100%;}
div.fca-ept-layout5 div.fca-ept-plan-div {font-family: "Tajawal", sans-serif;;text-align: center;justify-self: center;}
#plans div.fca-ept-layout5 div.fca-ept-plan-div .fca-ept-plan {--tw-text-opacity: 1 !important;background-color: transparent !important;color: rgb(153 153 153 / var(--tw-text-opacity)) !important;display: block;font-family: "Tajawal", sans-serif;font-size: 0.875rem !important;font-weight: 500;line-height: 20px !important;margin-top: 0;padding-bottom: 0.5rem;padding-top: 0.5rem;}
div.fca-ept-layout5 div.fca-ept-plan-div .fca-ept-plan {display: inline;vertical-align: top;font-weight: 500;}
#plans div.fca-ept-layout5 div.fca-ept-plan-div:after {--tw-bg-opacity: 1;background-color: rgb(248 248 248 / var(--tw-bg-opacity));bottom: 0;content: "";display: block;height: 24.5px;left: 0;position: absolute;right: 0;width: 100%;content: unset;}
#plans div.fca-ept-layout5 div.fca-ept-column:nth-child(2) a.fca-ept-button {--tw-text-opacity: 1 !important;}
#fca-ept-table-ad1a div.fca-ept-column a.fca-ept-button {background-color: #01a3a4;border-bottom: 4px solid rgb(0, 103, 103);}
#plans div.fca-ept-layout5 a.fca-ept-button {--tw-text-opacity: 1 !important;background-color: transparent !important;border-style: none !important;color: rgb(34 34 34 / var(--tw-text-opacity)) !important;font-family: "Tajawal", sans-serif !important;font-size: 1.35rem !important;font-weight: 500;line-height: 32px !important;margin-bottom: 0 !important;    padding-bottom: 0 !important;white-space: nowrap;width: 100% !important;}
div.fca-ept-layout5 a.fca-ept-button {font-family: "Tajawal", sans-serif;;padding: 10px;justify-self: center;margin-bottom: 15px;width: 75%;border-radius: 5px;white-space: normal;text-align: center;font-weight: 500;align-self: self-end;text-decoration: none !important;-webkit-appearance: unset;cursor: pointer;}
/* div.fca-ept-layout5 .fca-ept-button,div.fca-ept-layout5 li,div.fca-ept-layout5 span {word-break: break-all;} */
#plans div.fca-ept-layout5 div.fca-ept-price-div {background-color: transparent !important;border-style: none !important;min-height: unset !important;padding-top: 0 !important;}
#plans div.fca-ept-layout5 div.fca-ept-price-div {min-height: 60px;}
div.fca-ept-layout5 div.fca-ept-price-div {font-family: "Tajawal", sans-serif;;padding: 0.6em;border-top: 1px solid #e9e9e9;text-align: center;}
#plans div.fca-ept-layout5 div.fca-ept-features-div,#plans div.fca-ept-layout5 div.fca-ept-features-div ul {background-color: transparent !important;}
#plans div.fca-ept-layout5 div.fca-ept-features-div,#plans div.fca-ept-layout5 div.fca-ept-features-div ul {background-color: transparent !important;}
#plans div.fca-ept-layout5 div.fca-ept-features-div,#plans div.fca-ept-layout5 div.fca-ept-features-div ul {background-color: transparent !important;}
div.fca-ept-layout5 div.fca-ept-features-div ul {font-family: "Tajawal", sans-serif;;letter-spacing: inherit;text-align: start;margin: 0;padding-left: 0;font-weight: 500;background-color: #fff;}
#plans div.fca-ept-layout5 div.fca-ept-features-div ul li {--tw-text-opacity: 1;align-items: center;color: rgb(68 68 68 / var(--tw-text-opacity));display: flex;font-family: "Tajawal", sans-serif !important;font-weight: 500;justify-content: center;line-height: 45px;min-height: 100px;}
div.fca-ept-layout5 div.fca-ept-features-div .fca-ept-features li {font-family: "Tajawal", sans-serif;;border-top: 1px solid #e9e9e9;text-align: center;min-height: 60px;box-sizing: border-box;    list-style-type: none;padding: 1em;margin: 0;}
#plans div.fca-ept-layout5 div.fca-ept-features-div ul li span {--tw-text-opacity: 1;color: rgb(0 73 86 / var(--tw-text-opacity));}
div.fca-ept-layout5 div.fca-ept-features-div .fca-ept-features li span:not(div.fca-ept-tooltip-div > span.fca-ept-tooltiptext) {font-size: inherit !important;}
div.fca-ept-layout5 span.fca-ept-mobile-comparison {display: none;}
#plans div.fca-ept-layout5 div.fca-ept-features-div ul li span {--tw-text-opacity: 1;color: rgb(0 73 86 / var(--tw-text-opacity));}
div.fca-ept-layout5 div.fca-ept-features-div .fca-ept-features li span:not(div.fca-ept-tooltip-div > span.fca-ept-tooltiptext) {font-size: inherit !important;}
#plans div.fca-ept-layout5 div.fca-ept-column {flex: 0 0 220px !important;}
#plans div.fca-ept-layout5 div.fca-ept-column {--tw-border-opacity: 1 !important;background-color: transparent !important;border-style: none !important;border-right: 1px solid #eee !important;margin: 8px 0 0 !important;padding-top: 0;z-index: 10;}
div.fca-ept-layout5 div.fca-ept-column {border: 1px solid #e9e9e9;font-family: "Tajawal", sans-serif;;flex-grow: 1;flex-shrink: 1;flex-basis: 0%;z-index: 0;position: relative;display: grid;    grid-template-rows: auto auto auto 1fr;padding-top: 10px;}
#plans .fca-ept-plan-image img {margin-top: 1rem;max-width: 110px !important;width: 100%;height: auto;object-fit: contain;object-position: center;}
#plans div.fca-ept-layout5 div.fca-ept-plan-div .fca-ept-plan {--tw-text-opacity: 1 !important;background-color: transparent !important;color: rgb(153 153 153 / var(--tw-text-opacity)) !important;display: block;font-family: "Tajawal", sans-serif;font-size: 0.875rem !important;font-weight: 500;line-height: 20px !important;margin-top: 0;padding-bottom: 0.5rem;padding-top: 0.5rem;}
#plans .fca-ept-layout5 .fca-ept-comparison-div .fca-ept-comparison li:nth-child(2) {border-top: none;}
div.fca-ept-layout5 div.fca-ept-comparison-div {display: flex;flex-grow: 1;flex-shrink: 1;flex-basis: 0%;}

/*css before the revamp ----------------------------------------------------------------------------------------------------------------------------------------------------------css before the revamp */

.policy-banner {position: fixed; width: 100%;bottom: 0;box-sizing: border-box;z-index: 99;}
.eid_banner {display: block;width: 100%;-o-object-fit: contain;object-fit: contain;}
#close_btn {float: right;display: inline-block;padding: 2px 5px;background: #fbba16; cursor: pointer;border: 0;border-radius: 50%;color: white;font-size: 20px;font-weight: 400;
height: 20px;line-height: 1;outline: none;position: absolute;right: 10px;text-align: center;top: 10px;transition: transform 0.2s ease-in-out, background-color 0.2s ease-in-out;
width: 20px;z-index: 1;}
/*css before the revamp ----------------------------------------------------------------------------------------------------------------------------------------------------------css before the revamp */

#plans .fca-ept-layout5 .fca-ept-comparison-div .fca-ept-comparison li strong:before {--tw-bg-opacity: 1;background-color: rgb(0 73 86 / var(--tw-bg-opacity));bottom: 0;content: "";
height: 100%;position: absolute;left: 0;top: 0;width: 0.25rem;}

#plans .fca-ept-layout5 .fca-ept-comparison-div .fca-ept-comparison li strong {--tw-bg-opacity: 1;align-items: center;background-color: rgb(248 248 248 / var(--tw-bg-opacity));
bottom: 0;display: flex;justify-content: flex-start;left: 0;max-width: 1295px !important;padding: 1rem;position: absolute;right: 0;top: 0;width: 100vw;}

#plans .fca-ept-layout5 .fca-ept-comparison-div .fca-ept-comparison li strong:after {border-left: 10px solid transparent;border-right: 10px solid transparent;border-top: 10px solid #004956;content: "";height: 0;position: absolute;left: -4px;transform: rotate(270deg);width: 0;}

#plans .fca-ept-layout5 .fca-ept-comparison-div .fca-ept-comparison li {align-items: center;border-left-width: 0;display: flex;font-weight: 400;min-height: 100px;padding-bottom: 1.6rem;padding-top: 1.6rem;position: relative;text-align: left;word-break: break-word;}

/*REGISTER STEPS FORM CSS----------------------------------------------------------------------------------------------------------------------------------------------------------REGISTER STEPS FORM CSS*/

.steps-wrapper {position: relative; min-height: 390px;padding: 40px;}
.steps {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;font-size: 1rem;min-height: 2rem;}
.steps-wrapper .steps .step-item {font-size: 1.5rem;}
.steps .step-item {margin-top: 0;position: relative;-webkit-box-flex: 1;-ms-flex-positive: 1;flex-grow: 1;-ms-flex-preferred-size: 0;flex-basis: 0;width: 10%;}
.steps-wrapper .steps .step-item.is-active .step-marker {border-color: #021859 !important;color: #021859;}
.steps .step-item.is-active .step-marker {background-color: #ffffff;border-color: #00d1b2;color: #00d1b2;}
.steps .step-item .step-marker {height: 5rem;width: 5rem;position: absolute;left: calc(50% - 2.5rem);}
.steps .step-item .step-marker {-webkit-box-align: center;-ms-flex-align: center;align-items: center;display: -webkit-box;display: -ms-flexbox;display: flex;border-radius: 50%;    font-weight: 700; -webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;background: #b5b5b5;color: #ffffff;border: 0.2em solid #ffffff;z-index: 1;}
.steps .step-item .step-details {margin-top: 6rem;margin-left: 0.5em;margin-right: 0.5em;padding-top: 0.2em;margin-bottom: 2rem;}
.steps .step-item .step-details {text-align: center;}
.steps .step-item .step-details .step-title {font-size: 1.2rem;font-weight: 600;}
.steps-wrapper .step-title {font-size: .9rem !important;text-transform: uppercase;}
.steps-wrapper .steps .step-item:not(:first-child):before {content: " ";display: block;position: absolute;}
.steps-wrapper .steps .step-item:before {background: -webkit-gradient(linear, right top, left top, color-stop(50%, #dbdbdb), color-stop(50%, #021859));background: linear-gradient(to left, #dbdbdb 50%, #021859 50%);background-size: 200% 100%;background-position: right bottom;}
.steps .step-item:not(:first-child)::before {height: 0.2em;width: 100%;bottom: 0;left: -50%;top: 27%;}
.steps .step-item:not(:first-child)::before {content: " ";display: block;position: absolute;top: 27%;}
.steps .step-item::before {background: -webkit-gradient( linear, right top, left top, color-stop(50%, #dbdbdb), color-stop(50%, #00d1b2) );background: linear-gradient(to left, #dbdbdb 50%, #00d1b2 50%);background-size: 200% 100%;background-position: right bottom;}
.steps .step-item:not(:first-child) {-ms-flex-preferred-size: 1em;flex-basis: 1em;-webkit-box-flex: 1;-ms-flex-positive: 1;flex-grow: 1;-ms-flex-negative: 1;flex-shrink: 1;}
.steps .steps-content {-webkit-box-align: stretch;-ms-flex-align: stretch;align-items: stretch;-ms-flex-preferred-size: 100%;flex-basis: 100%;margin: 2rem 0;}
span.domainHelper {position: absolute;right: 1rem;top: 50%;transform: translateY(-50%);}

/*REGISTER STEPS FORM CSS----------------------------------------------------------------------------------------------------------------------------------------------------------REGISTER STEPS FORM CSS*/


/*RTL CSS---------------------------------------------------------------------------------------RTL CSS*/

header#header,
footer,
section.whatWeProvide,
section.PaymentInner,
section.VideoMethod,
section.Offers,
section#plans,
section.AboutInner,
section.faqs,
section.terms,
section.privacyPolicy {direction: rtl;}

.sideNav-ar{flex-direction: row-reverse;justify-content: end !important;}
section.whatWeProvide h2, section.whatWeProvide p, section.whatWeProvide a {text-align: right;display: block;}

/**FOOTER**/
.footer-heading-rtl-1 {text-align: right !important;}
.footer-heading-rtl-2 {text-align: center !important; direction: ltr;}
.column-unset{column-count: unset !important;}
.ar-d-none{display: none;}
.copyrightText{direction: ltr;}
.socials-footer-ar{justify-content: center !important;}
.storesLink{justify-content: center !important;}

/**LOGIN**/
.auth-rtl-one {order: 2;}
.auth-rtl-two {order: 1;}
.auth-rtl-heading{text-align: right;}
.site-label-rtl{text-align: right;}
.steps-content, .form-rtl-ar{direction: rtl;}
.site-label-ar{margin-left:0 !important ; margin-right: 1rem !important;}
.domainHelper-ar{right: auto !important; left: 1rem;}

/**PAYMENT**/
.rtl-payment-cal{text-align: right !important;}


/**LANG**/
.eye-icon-rtl {left: 1rem;right: auto;}
.lang-auth-rtl{right: auto; left: 0;}



/*RTL CSS---------------------------------------------------------------------------------------RTL CSS*/




/*RESPONSIVE CSS----------------------------------------------------------------------------------------------------------------------------------------------------------RESPONSIVE CSS*/

@media screen and (max-width: 1399px) {
    h3 {font-size: 43px !important;}
}

@media (max-width: 1312px) {
    #plans .fca-ept-layout5 .fca-ept-comparison-div .fca-ept-comparison li strong {max-width: 900px;}
}

@media screen and (max-width: 1199px) {
    /* h1,h2 {font-size: 50px !important;} */
    h3 {font-size: 35px !important;}
    h4 {font-size: 30px !important;}
    .p-lg {font-size: 18px;}
    .p-md {font-size: 16px;}
}
@media (max-width: 1023px) {
    #plans .fca-ept-plan-image img { max-width: 50px !important;}
    #plans div.fca-ept-layout5 a.fca-ept-button {font-size: 1.2rem !important;line-height: 30px !important;}
    #plans div.fca-ept-layout5 div.fca-ept-column {flex: 0 0 150px !important;}
}
@media screen and (max-width: 992px){
  .icon-one:before, .icon-two:before, .icon-two:after, .icon-three:after, .icon-three:before, .icon-clm:before{content: none;}
  .loop{display: none;}
  #plans div.fca-ept-layout5 div.fca-ept-plan-div {min-height: 180px;}
  #plans div.fca-ept-layout5 div.fca-ept-plan-div:after {height: 24px;}
  /* img.moving{max-width: 650px;} */
  img.moving{width: 84%;}
  h1.bannerText{font-size: 46px !important;max-width: 550px;margin: auto;}
  h1.bannerText br {
    display: none;
}

}

@media (max-width: 908px) {
    #plans div.fca-ept-layout5 {display: flex !important;font-size: 15px;min-width: 700px;width: calc(100vw - 32px); }
    section#plans{overflow-x: scroll !important;}
}
@media (max-width: 800px) {
    #plans .fca-ept-layout5 .fca-ept-comparison-div .fca-ept-comparison li strong {min-width: 950px; width: calc(100vw - 32px);}
    #plans div.fca-ept-layout5 div.fca-ept-comparison-div {display: flex !important;}
    div.fca-ept-layout5 div.fca-ept-comparison-div {display: none;}
}
@media screen and (max-width: 767px) {
    h1,
    h2 {font-size: 40px !important;}
    h3 {font-size: 35px;}
    h4 {font-size: 26px !important;}
    .whatWeProvideImg {width: 250px;}
    .footer-heading-rtl-1 {text-align: left !important;}
    .footer-heading-rtl-2 {text-align: right !important;}
    .rtl-payment-cal{text-align: right !important;}
    section.whatWeProvide h2, section.whatWeProvide p, section.whatWeProvide a {text-align: center !important;display: block;}
    .socials-footer-ar{justify-content: flex-end !important;}
    img.moving{width: 100%;}
    section.banner {background-size: 101% 75%;height: 420px;}
    h1.bannerText{font-size: 36px !important;}
    .storesLink{justify-content: end !important;}


}
@media screen and (max-width: 575px) {
  h3 {font-size: 25px !important;}
  h1,
  h2 {font-size: 32px !important;}
  h4 {font-size: 23px !important;}
  .p-lg {font-size: 16px;}
  .p-md {font-size: 15px;}
  body {font-size: 14px !important;}
  section.shippingCompanies .border-bottom, section.shippingCompanies .border-end, section.shippingCompanies .border-start, section.shippingCompanies .border-top {border: none !important;}
  section.banner {min-height: 300px;}
  section.paymentBanner h1.bannerText {font-size: 20px !important;max-width: 70%;margin: auto;}
  section.whatWeProvide:before {transform: scale(1.4);}
  img.moving{width: 75%;}

  section.whatWeProvide p,section.whatWeProvide a {font-size: 18px;}
  section.whatWeProvide p br {display: none;}
  section.Annoucement p { font-size: 18px;}
  section.Annoucement p br, .annoucementHeading br {display: none;}

  h1.bannerText {padding-top: 0rem !important;font-size: 24px !important;}
  h1.bannerText{max-width: 300px;}
  .secondar-header {font-size: 14px;padding:0 4rem;}


}
@media screen and (max-width:480px){
    h2.annoucementHeading{font-size: 22px !important;}
    img.moving{width: 90%;}

}

/* affiliate stats */
.brief,
.brief li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-direction: normal;
}
.brief {
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-orient: horizontal;
    -ms-flex-direction: row;
    flex-direction: row;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 70%;
    margin: 1.5em auto 1em;
}
.brief li {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
}
.brief li svg {
    display: block;
    width: 50px;
    height: 50px;
    margin: 0 0 10px;
}
.brief li b {
    display: block;
    border-radius: 50%;
    color: var(--brand);
    font-size: 2.5em;
    line-height: 1;
    margin: 0 0 5px;
}
.brief li h4 {
    font-size: 1em;
    color: #838383;
}
.bg-icon {
    width: 100px;
    height: 100px;
    position: absolute;
    bottom: -25px;
    right: 50%;
    -webkit-transform: rotate(45deg) translateX(50%);
    transform: rotate(45deg) translateX(50%);
    z-index: -1;
}
#intro {
    height: auto;
    position: relative;
    text-align: center;
    padding: 2em 4em;
}
#intro h1 {
    font-size: 1.5625em;
    color: var(--color-primary);
    margin: 0 0 5px;
}
.report,
.report li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-direction: normal;
}
.report {
    -webkit-box-orient: vertical;
    -ms-flex-direction: column;
    flex-direction: column;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 90%;
    margin: 0 auto;
    padding: 2em;
}
#intro h3 {
    color: #b3b3b3;
}
.brief li.usage svg {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.phone-fix{
    direction: ltr;
    text-align: right;
}
.contact-box{
    text-align: center;
    background: blue;
    color: white;
    border-radius: 10px;
    margin: 0px 10%;
}
.contact-logo-img{
    aspect-ratio: 2/1;
    width: 30%;
    object-fit: contain;
}
.contact-img{
    background: white;
    border-radius: 10px;
    width: 50px;
    margin: 10px;
}
.font-x-large {
    font-size: x-large;
}

.owl-item .item:has(iframe) {
    margin-top: 50px;
    filter: blur(5px);
}
.owl-item.active.center:has(iframe){
    z-index: 1;
}
.owl-item.active.center .item:has(iframe) {
    margin-top: 0px;
    filter: none;
}
.owl-item iframe {
    width: 100%;
    pointer-events: none;
    height: 250px; /* Set a maximum height */
}
.owl-item.active.center iframe {
    transform: scale(1.1);
    height: 350px; /* Set a maximum height */
    pointer-events: auto; 
}
.owl-theme .owl-dots, .owl-theme .owl-nav {
    text-align: center;
    -webkit-tap-highlight-color: transparent;
}
.owl-theme .owl-dots .owl-dot {
    display: inline-block;
    zoom: 1;
}
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: #869791;
}
.owl-theme .owl-dots .owl-dot span {
    width: 10px;
    height: 10px;
    margin: 5px 7px;
    background: #D6D6D6;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    border-radius: 30px;
}
.contactCarousel .owl-nav {
    position: relative; /* Ensure parent is positioned relative */
}

.contactCarousel .owl-nav .owl-prev {
    position: absolute;
    right: 15%; /* Align to the left */
    margin-top: -15%;
    transform: translateY(-50%); /* Adjust for true center */
    z-index: 10; /* Ensure it's above other elements */
}
.contactCarousel .owl-nav .owl-next {
    position: absolute;
    left: 15%; /* Align to the left */
    margin-top: -15%;
    transform: translateY(-50%); /* Adjust for true center */
    z-index: 10; /* Ensure it's above other elements */
}

.contactCarousel .owl-nav .owl-prev span {
    font-size: xxx-large;
    color: var(--primary-color);
}
.contactCarousel .owl-nav .owl-next span {
    font-size: xxx-large;
    color: var(--primary-color)
}
.error{
    color: red;
}


.grid-block.addons-list {
    grid-template-columns: repeat(auto-fill, minmax(250px, 4fr));
}
.grid-block--gap-20 {
    grid-gap: 20px;
}
.grid-block {
    display: grid;
}
.panel {
    margin-bottom: 50px;
    -webkit-box-shadow: none;
    /* box-shadow: none; */
    border-color: #eee;
    border-radius: 4px;
    color: #444;
    box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
}
.panel-heading {
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
}
.panel-heading {
    position: relative;
}
.panel-heading {
    padding: 15px 20px;
    border-bottom: 1px solid transparent;
}
.panel-default > a {
    width: -webkit-fill-available;
}
.addon_image {
    width: -webkit-fill-available;
    aspect-ratio: 1;
    object-fit: contain;
    vertical-align: middle;
}
.panel-body {
    position: relative;
    padding: 20px;
    justify-self: center;
}
.panel-title {
    display: inline-block;
    font-size: 17px !important;
    color: #444;
    position: relative;
    margin-top: 0;
}
.rec-price-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
}
.flexbetween {
    display: flex;
    justify-content: space-between;
}
.justify-center {
    justify-content: center;
}
.btn-tiffany {
    color: #fff !important;
    background-color: #021859;
    border-color: #021859;
}
.separator {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 20px 0;
}
/* .separator:not(:empty)::before {
    margin-right: .5em;
} */
.separator::before, .separator::after {
    content: '';
    flex: 1;
    border-bottom: 1px solid #dee2e6;
}
/*RESPONSIVE CSS----------------------------------------------------------------------------------------------------------------------------------------------------------RESPONSIVE CSS*/