*{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}
body{
    font-family: "Cairo", sans-serif;
    background-color: #fffffff3;
}

:root {
    --golden: #204476 !important;
    --light: #E2E699;
}

/* header start  */

/* Initial style for the navbar */
.navbar {
    transition: background-color 0.3s, box-shadow 0.3s;

}

/* Style when scrolled */
.navbar.scrolled {
    background-color: #ffffff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    padding: 0px;
}

.navbar.scrolled img {
    height: 80px;
}

@media (min-width: 576px) {
    nav .dropdown:hover>.dropdown-menu {
      display: block;
      margin-top: 0;
    }
  }

  @keyframes up-down {
    0% {
      transform: translateY(5px)
    }

    100% {
      transform: translateY(-5px)
    }
  }

  nav .nav-link {
    font-family: p, sans-serif;
    font-weight: bold;
    font-size: 12px;
    color: rgb(59, 59, 59);
    transition: 0.2s;
  }

  nav .nav-link:hover {
    color: rgb(91, 130, 134);
    cursor: text;
  }

  nav .nav-link i {
    position: relative;
    color: var(--golden);
    transition: 0.4s;
    font-size: 22px;
    top: 4px;
  }

  nav .dropdown .dropdown-menu .dropdown-item {
    font-family: p, sans-serif;
    font-weight: bold;
    font-size: 12px;
    line-height: 25px;
  }

  nav .dropdown .dropdown-item:hover {
    color: rgb(91, 130, 134);
    background: none;
  }

  nav .nav-link:hover i {
    transform: rotate(180deg);
    color: rgb(91, 130, 134) !important;
  }

  nav .contact-us {
    /* font-family: cairo; */
    color: #5f797c;
    font-size: 18px;
  }

  nav .contact-us:hover {
    color: rgb(0, 140, 255);
  }

  button.loginbtn {
    border: none;
    color: #5f797c;
    background-color: rgb(244, 246, 253);
    transition: 0.2s;
  }

  button.loginbtn:hover {
    background-color: var(--golden) !important;
    color: white;
  }

  nav .registerbtn {
    border: none;
    color: white;
    background-color: var(--golden) !important;
    transition: 0.2s;
  }

  nav .registerbtn:hover {
    background: none;
    outline: 1px solid #E2E699;
    color: #E2E699;
  }


/* carsoul strat  */

.view_mobile_banner {
    display: none
}

.view_web_banner {
    display: block
}

.carousel {
    position: relative
}

.carousel.pointer-event {
    -ms-touch-action: pan-y;
    touch-action: pan-y
}

.carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden
}

.carousel-inner:after {
    display: block;
    clear: both;
    content: ""
}

.carousel-item {
    position: relative;
    display: none;
    float: left;
    width: 100%;
    margin-right: -100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: -webkit-transform .6s ease-in-out;
    transition: -webkit-transform .6s ease-in-out;
    transition: transform .6s ease-in-out;
    transition: transform .6s ease-in-out,-webkit-transform .6s ease-in-out
}

@media (prefers-reduced-motion:reduce) {
    .carousel-item {
        -webkit-transition: none;
        transition: none
    }
}

.carousel-item-next,.carousel-item-prev,.carousel-item.active {
    display: block
}

.active.carousel-item-end,.carousel-item-next:not(.carousel-item-start) {
    -webkit-transform: translateX(100%);
    transform: translate(100%)
}

.active.carousel-item-start,.carousel-item-prev:not(.carousel-item-end) {
    -webkit-transform: translateX(-100%);
    transform: translate(-100%)
}

.carousel-fade .carousel-item {
    opacity: 0;
    -webkit-transition-property: opacity;
    transition-property: opacity;
    -webkit-transform: none;
    transform: none
}

.carousel-fade .carousel-item-next.carousel-item-start,.carousel-fade .carousel-item-prev.carousel-item-end,.carousel-fade .carousel-item.active {
    z-index: 1;
    opacity: 1
}

.carousel-fade .active.carousel-item-end,.carousel-fade .active.carousel-item-start {
    z-index: 0;
    opacity: 0;
    -webkit-transition: opacity 0s .6s;
    transition: opacity 0s .6s
}

@media (prefers-reduced-motion:reduce) {
    .carousel-fade .active.carousel-item-end,.carousel-fade .active.carousel-item-start {
        -webkit-transition: none;
        transition: none
    }
}

.carousel-control-next,.carousel-control-prev {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 15%;
    padding: 0;
    color: #fff;
    text-align: center;
    background: 0 0;
    border: 0;
    opacity: .5;
    -webkit-transition: opacity .15s ease;
    transition: opacity .15s ease
}

@media (prefers-reduced-motion:reduce) {
    .carousel-control-next,.carousel-control-prev {
        -webkit-transition: none;
        transition: none
    }
}

.carousel-control-next:focus,.carousel-control-next:hover,.carousel-control-prev:focus,.carousel-control-prev:hover {
    color: #fff;
    text-decoration: none;
    outline: 0;
    opacity: .9
}

.carousel-control-prev {
    left: 0
}

.carousel-control-next {
    right: 0
}

.carousel-control-next-icon,.carousel-control-prev-icon {
    display: inline-block;
    width: 2rem;
    height: 2rem;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 100% 100%
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e")
}

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")
}

.carousel-indicators {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0;
    margin-right: 15%;
    margin-bottom: 2rem;
    margin-left: 15%;
    list-style: none
}

.carousel-indicators [data-bs-target] {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    width: 30px;
    height: 3px;
    padding: 0;
    margin-right: 3px;
    margin-left: 3px;
    text-indent: -999px;
    cursor: pointer;
    background-color: #fff;
    background-clip: padding-box;
    border: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    opacity: .5;
    -webkit-transition: opacity .6s ease;
    transition: opacity .6s ease
}

@media (prefers-reduced-motion:reduce) {
    .carousel-indicators [data-bs-target] {
        -webkit-transition: none;
        transition: none
    }
}

.carousel-indicators .active {
    opacity: 1
}

.carousel-caption {
    position: absolute;
    right: 15%;
    bottom: 1.25rem;
    left: 15%;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    color: #fff;
    text-align: center
}

.carousel-dark .carousel-control-next-icon,.carousel-dark .carousel-control-prev-icon {
    -webkit-filter: invert(1) grayscale(100);
    filter: invert(1) grayscale(100)
}

.carousel-dark .carousel-indicators [data-bs-target] {
    background-color: #000
}

.carousel-dark .carousel-caption {
    color: #000
}

.spinner-border,.spinner-grow {
    display: inline-block;
    width: var(--bs-spinner-width);
    height: var(--bs-spinner-height);
    vertical-align: var(--bs-spinner-vertical-align);
    border-radius: 50%;
    -webkit-animation: var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name);
    animation: var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name)
}

@-webkit-keyframes spinner-border {
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes spinner-border {
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

.spinner-border {
    --bs-spinner-width: 2rem;
    --bs-spinner-height: 2rem;
    --bs-spinner-vertical-align: -.125em;
    --bs-spinner-border-width: .25em;
    --bs-spinner-animation-speed: .75s;
    --bs-spinner-animation-name: spinner-border;
    border: var(--bs-spinner-border-width) solid currentcolor;
    border-right-color: transparent
}

.spinner-border-sm {
    --bs-spinner-width: 1rem;
    --bs-spinner-height: 1rem;
    --bs-spinner-border-width: .2em
}

@-webkit-keyframes spinner-grow {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    50% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes spinner-grow {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    50% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.spinner-grow {
    --bs-spinner-width: 2rem;
    --bs-spinner-height: 2rem;
    --bs-spinner-vertical-align: -.125em;
    --bs-spinner-animation-speed: .75s;
    --bs-spinner-animation-name: spinner-grow;
    background-color: currentcolor;
    opacity: 0
}

.spinner-grow-sm {
    --bs-spinner-width: 1rem;
    --bs-spinner-height: 1rem
}

@media (prefers-reduced-motion:reduce) {
    .spinner-border,.spinner-grow {
        --bs-spinner-animation-speed: 1.5s
    }
}

.offcanvas,.offcanvas-lg,.offcanvas-md,.offcanvas-sm,.offcanvas-xl,.offcanvas-xxl {
    --bs-offcanvas-zindex: 1045;
    --bs-offcanvas-width: 400px;
    --bs-offcanvas-height: 30vh;
    --bs-offcanvas-padding-x: 1rem;
    --bs-offcanvas-padding-y: 1rem;
    --bs-offcanvas-bg: #ffffff;
    --bs-offcanvas-border-width: 1px;
    --bs-offcanvas-border-color: var(--bs-border-color-translucent);
    --bs-offcanvas-box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075)
}

@media (max-width: 575.98px) {
    .offcanvas-sm {
        position:fixed;
        bottom: 0;
        z-index: var(--bs-offcanvas-zindex);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        max-width: 100%;
        color: var(--bs-offcanvas-color);
        visibility: hidden;
        background-color: var(--bs-offcanvas-bg);
        background-clip: padding-box;
        outline: 0;
        -webkit-transition: -webkit-transform .3s ease-in-out;
        transition: -webkit-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
        transition: transform .3s ease-in-out,-webkit-transform .3s ease-in-out
    }
}

@media (max-width: 575.98px) and (prefers-reduced-motion:reduce) {
    .offcanvas-sm {
        -webkit-transition:none;
        transition: none
    }
}

@media (max-width: 575.98px) {
    .offcanvas-sm.offcanvas-start {
        top:0;
        left: 0;
        width: var(--bs-offcanvas-width);
        border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateX(-100%);
        transform: translate(-100%)
    }

    .offcanvas-sm.offcanvas-end {
        top: 0;
        right: 0;
        width: var(--bs-offcanvas-width);
        border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateX(100%);
        transform: translate(100%)
    }

    .offcanvas-sm.offcanvas-top {
        top: 0;
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    .offcanvas-sm.offcanvas-bottom {
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }

    .offcanvas-sm.show:not(.hiding),.offcanvas-sm.showing {
        -webkit-transform: none;
        transform: none
    }

    .offcanvas-sm.hiding,.offcanvas-sm.show,.offcanvas-sm.showing {
        visibility: visible
    }
}

@media (min-width: 576px) {
    .offcanvas-sm {
        --bs-offcanvas-height: auto;
        --bs-offcanvas-border-width: 0;
        background-color: transparent!important
    }

    .offcanvas-sm .offcanvas-header {
        display: none
    }

    .offcanvas-sm .offcanvas-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
        background-color: transparent!important
    }
}

@media (max-width: 767.98px) {
    .offcanvas-md {
        position:fixed;
        bottom: 0;
        z-index: var(--bs-offcanvas-zindex);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        max-width: 100%;
        color: var(--bs-offcanvas-color);
        visibility: hidden;
        background-color: var(--bs-offcanvas-bg);
        background-clip: padding-box;
        outline: 0;
        -webkit-transition: -webkit-transform .3s ease-in-out;
        transition: -webkit-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
        transition: transform .3s ease-in-out,-webkit-transform .3s ease-in-out
    }
}

@media (max-width: 767.98px) and (prefers-reduced-motion:reduce) {
    .offcanvas-md {
        -webkit-transition:none;
        transition: none
    }
}

@media (max-width: 767.98px) {
    .offcanvas-md.offcanvas-start {
        top:0;
        left: 0;
        width: var(--bs-offcanvas-width);
        border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateX(-100%);
        transform: translate(-100%)
    }

    .offcanvas-md.offcanvas-end {
        top: 0;
        right: 0;
        width: var(--bs-offcanvas-width);
        border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateX(100%);
        transform: translate(100%)
    }

    .offcanvas-md.offcanvas-top {
        top: 0;
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    .offcanvas-md.offcanvas-bottom {
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }

    .offcanvas-md.show:not(.hiding),.offcanvas-md.showing {
        -webkit-transform: none;
        transform: none
    }

    .offcanvas-md.hiding,.offcanvas-md.show,.offcanvas-md.showing {
        visibility: visible
    }
}

@media (min-width: 768px) {
    .offcanvas-md {
        --bs-offcanvas-height: auto;
        --bs-offcanvas-border-width: 0;
        background-color: transparent!important
    }

    .offcanvas-md .offcanvas-header {
        display: none
    }

    .offcanvas-md .offcanvas-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
        background-color: transparent!important
    }
}

@media (max-width: 991.98px) {
    .offcanvas-lg {
        position:fixed;
        bottom: 0;
        z-index: var(--bs-offcanvas-zindex);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        max-width: 100%;
        color: var(--bs-offcanvas-color);
        visibility: hidden;
        background-color: var(--bs-offcanvas-bg);
        background-clip: padding-box;
        outline: 0;
        -webkit-transition: -webkit-transform .3s ease-in-out;
        transition: -webkit-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
        transition: transform .3s ease-in-out,-webkit-transform .3s ease-in-out
    }
}

@media (max-width: 991.98px) and (prefers-reduced-motion:reduce) {
    .offcanvas-lg {
        -webkit-transition:none;
        transition: none
    }
}

@media (max-width: 991.98px) {
    .offcanvas-lg.offcanvas-start {
        top:0;
        left: 0;
        width: var(--bs-offcanvas-width);
        border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateX(-100%);
        transform: translate(-100%)
    }

    .offcanvas-lg.offcanvas-end {
        top: 0;
        right: 0;
        width: var(--bs-offcanvas-width);
        border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateX(100%);
        transform: translate(100%)
    }

    .offcanvas-lg.offcanvas-top {
        top: 0;
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    .offcanvas-lg.offcanvas-bottom {
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }

    .offcanvas-lg.show:not(.hiding),.offcanvas-lg.showing {
        -webkit-transform: none;
        transform: none
    }

    .offcanvas-lg.hiding,.offcanvas-lg.show,.offcanvas-lg.showing {
        visibility: visible
    }
}

@media (min-width: 992px) {
    .offcanvas-lg {
        --bs-offcanvas-height: auto;
        --bs-offcanvas-border-width: 0;
        background-color: transparent!important
    }

    .offcanvas-lg .offcanvas-header {
        display: none
    }

    .offcanvas-lg .offcanvas-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
        background-color: transparent!important
    }
}

@media (max-width: 1199.98px) {
    .offcanvas-xl {
        position:fixed;
        bottom: 0;
        z-index: var(--bs-offcanvas-zindex);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        max-width: 100%;
        color: var(--bs-offcanvas-color);
        visibility: hidden;
        background-color: var(--bs-offcanvas-bg);
        background-clip: padding-box;
        outline: 0;
        -webkit-transition: -webkit-transform .3s ease-in-out;
        transition: -webkit-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
        transition: transform .3s ease-in-out,-webkit-transform .3s ease-in-out
    }
}

@media (max-width: 1199.98px) and (prefers-reduced-motion:reduce) {
    .offcanvas-xl {
        -webkit-transition:none;
        transition: none
    }
}

@media (max-width: 1199.98px) {
    .offcanvas-xl.offcanvas-start {
        top:0;
        left: 0;
        width: var(--bs-offcanvas-width);
        border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateX(-100%);
        transform: translate(-100%)
    }

    .offcanvas-xl.offcanvas-end {
        top: 0;
        right: 0;
        width: var(--bs-offcanvas-width);
        border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateX(100%);
        transform: translate(100%)
    }

    .offcanvas-xl.offcanvas-top {
        top: 0;
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    .offcanvas-xl.offcanvas-bottom {
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }

    .offcanvas-xl.show:not(.hiding),.offcanvas-xl.showing {
        -webkit-transform: none;
        transform: none
    }

    .offcanvas-xl.hiding,.offcanvas-xl.show,.offcanvas-xl.showing {
        visibility: visible
    }
}

@media (min-width: 1200px) {
    .offcanvas-xl {
        --bs-offcanvas-height: auto;
        --bs-offcanvas-border-width: 0;
        background-color: transparent!important
    }

    .offcanvas-xl .offcanvas-header {
        display: none
    }

    .offcanvas-xl .offcanvas-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
        background-color: transparent!important
    }
}

@media (max-width: 1399.98px) {
    .offcanvas-xxl {
        position:fixed;
        bottom: 0;
        z-index: var(--bs-offcanvas-zindex);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        max-width: 100%;
        color: var(--bs-offcanvas-color);
        visibility: hidden;
        background-color: var(--bs-offcanvas-bg);
        background-clip: padding-box;
        outline: 0;
        -webkit-transition: -webkit-transform .3s ease-in-out;
        transition: -webkit-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
        transition: transform .3s ease-in-out,-webkit-transform .3s ease-in-out
    }
}

@media (max-width: 1399.98px) and (prefers-reduced-motion:reduce) {
    .offcanvas-xxl {
        -webkit-transition:none;
        transition: none
    }
}

@media (max-width: 1399.98px) {
    .offcanvas-xxl.offcanvas-start {
        top:0;
        left: 0;
        width: var(--bs-offcanvas-width);
        border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateX(-100%);
        transform: translate(-100%)
    }

    .offcanvas-xxl.offcanvas-end {
        top: 0;
        right: 0;
        width: var(--bs-offcanvas-width);
        border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateX(100%);
        transform: translate(100%)
    }

    .offcanvas-xxl.offcanvas-top {
        top: 0;
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    .offcanvas-xxl.offcanvas-bottom {
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }

    .offcanvas-xxl.show:not(.hiding),.offcanvas-xxl.showing {
        -webkit-transform: none;
        transform: none
    }

    .offcanvas-xxl.hiding,.offcanvas-xxl.show,.offcanvas-xxl.showing {
        visibility: visible
    }
}

@media (min-width: 1400px) {
    .offcanvas-xxl {
        --bs-offcanvas-height: auto;
        --bs-offcanvas-border-width: 0;
        background-color: transparent!important
    }

    .offcanvas-xxl .offcanvas-header {
        display: none
    }

    .offcanvas-xxl .offcanvas-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
        background-color: transparent!important
    }
}

.offcanvas {
    position: fixed;
    bottom: 0;
    z-index: var(--bs-offcanvas-zindex);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-width: 100%;
    color: var(--bs-offcanvas-color);
    visibility: hidden;
    background-color: var(--bs-offcanvas-bg);
    background-clip: padding-box;
    outline: 0;
    -webkit-transition: -webkit-transform .3s ease-in-out;
    transition: -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out,-webkit-transform .3s ease-in-out
}

@media (prefers-reduced-motion:reduce) {
    .offcanvas {
        -webkit-transition: none;
        transition: none
    }
}

.offcanvas.offcanvas-start {
    top: 0;
    left: 0;
    width: var(--bs-offcanvas-width);
    border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
    -webkit-transform: translateX(-100%);
    transform: translate(-100%)
}

.offcanvas.offcanvas-end {
    top: 0;
    right: 0;
    width: var(--bs-offcanvas-width);
    border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
    -webkit-transform: translateX(100%);
    transform: translate(100%)
}

.offcanvas.offcanvas-top {
    top: 0;
    right: 0;
    left: 0;
    height: var(--bs-offcanvas-height);
    max-height: 100%;
    border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%)
}

.offcanvas.offcanvas-bottom {
    right: 0;
    left: 0;
    height: var(--bs-offcanvas-height);
    max-height: 100%;
    border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
    -webkit-transform: translateY(100%);
    transform: translateY(100%)
}

.offcanvas.show:not(.hiding),.offcanvas.showing {
    -webkit-transform: none;
    transform: none
}

.offcanvas.hiding,.offcanvas.show,.offcanvas.showing {
    visibility: visible
}

.offcanvas-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1040;
    width: 100vw;
    height: 100vh;
    background-color: #000
}

.offcanvas-backdrop.fade {
    opacity: 0
}

.offcanvas-backdrop.show {
    opacity: .5
}

.offcanvas-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x)
}

.offcanvas-header .btn-close {
    padding: calc(var(--bs-offcanvas-padding-y) * .5) calc(var(--bs-offcanvas-padding-x) * .5);
    margin-top: calc(-.5 * var(--bs-offcanvas-padding-y));
    margin-right: calc(-.5 * var(--bs-offcanvas-padding-x));
    margin-bottom: calc(-.5 * var(--bs-offcanvas-padding-y))
}

.offcanvas-title {
    margin-bottom: 0;
    line-height: 1.5
}

.offcanvas-body {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x);
    overflow-y: auto
}

.placeholder {
    display: inline-block;
    min-height: 1em;
    vertical-align: middle;
    cursor: wait;
    background-color: currentcolor;
    opacity: .5
}

.placeholder.btn:before {
    display: inline-block;
    content: ""
}

.placeholder-xs {
    min-height: .6em
}

.placeholder-sm {
    min-height: .8em
}

.placeholder-lg {
    min-height: 1.2em
}

.placeholder-glow .placeholder {
    -webkit-animation: placeholder-glow 2s ease-in-out infinite;
    animation: placeholder-glow 2s ease-in-out infinite
}

@-webkit-keyframes placeholder-glow {
    50% {
        opacity: .2
    }
}

@keyframes placeholder-glow {
    50% {
        opacity: .2
    }
}

.placeholder-wave {
    -webkit-mask-image: linear-gradient(130deg,#000 55%,rgba(0,0,0,.8) 75%,#000 95%);
    mask-image: linear-gradient(130deg,#000 55%,rgba(0,0,0,.8) 75%,#000 95%);
    -webkit-mask-size: 200% 100%;
    mask-size: 200% 100%;
    -webkit-animation: placeholder-wave 2s linear infinite;
    animation: placeholder-wave 2s linear infinite
}
.carousel-indicators{
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0;
    margin-right: 15%;
    margin-bottom: 2rem;
    margin-left: 15%;
    list-style: none;
}
.carousel-indicators [data-bs-target] {
    width: 10px;
    height: 10px;
    border-radius: 3px;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    border: 0;
    background: #5F797C !important;
    margin: auto 4px;
}
.carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden
}

.carousel-inner:after {
    display: block;
    clear: both;
    content: ""
}
.custom-card-1 {
    background: linear-gradient(45deg,var(--golden),var(--light));
    color: #fff;

}
.btn {
    padding: 8px 20px;
    outline: 0;
    text-decoration: none;
    font-size: 16px;
    letter-spacing: .5px;
    -webkit-transition: all .3s;
    transition: all .3s;
    font-weight: 600;
    border-radius: 6px;
}
.btn-soft-dark {
    background-color: #fff !important;
    border: 1px solid rgba(33, 37, 41, .05) !important;
    color: #2ea094 !important;
    -webkit-box-shadow: 0 3px 5px 0 rgba(33, 37, 41, .1);
    box-shadow: 0 3px 5px #2125291a;
}





.btn-soft-light {
    background-color: #f8f9fa0d!important;
    border: 1px solid rgba(248,249,250,.05)!important;
    color: #f8f9fa!important;
    -webkit-box-shadow: 0 3px 5px 0 rgba(248,249,250,.1);
    box-shadow: 0 3px 5px #f8f9fa1a
}

.btn-soft-light.active,.btn-soft-light.focus,.btn-soft-light:active,.btn-soft-light:focus,.btn-soft-light:hover {
    background-color: #f8f9fa!important;
    border-color: #f8f9fa!important;
    color: #e2fde3!important
}

.btn-link.light {
    padding: 0!important;
    color: #212529;
    position: relative
}

.btn-link.light.active,.btn-link.light.focus,.btn-link.light:active,.btn-link.light:focus,.btn-link.light:hover,.btn-link.light:not(:disabled):not(.disabled):active {
    color: #f8f9fa!important
}

.btn-link.light:after {
    background-color: #f8f9fa!important
}

.btn-soft-dark {
    background-color: #fff!important;
    border: 1px solid rgba(33,37,41,.05)!important;
    color: #2ea094!important;
    -webkit-box-shadow: 0 3px 5px 0 rgba(33,37,41,.1);
    box-shadow: 0 3px 5px #2125291a
}

.btn-soft-dark.active,.btn-soft-dark.focus,.btn-soft-dark:active,.btn-soft-dark:focus,.btn-soft-dark:hover {
    background-color: #212529!important;
    border-color: #212529!important;
    color: #fff!important
}

.btn-link.dark {
    padding: 0!important;
    color: #212529;
    position: relative
}

.btn-link.dark.active,.btn-link.dark.focus,.btn-link.dark:active,.btn-link.dark:focus,.btn-link.dark:hover,.btn-link.dark:not(:disabled):not(.disabled):active {
    color: #212529!important
}

.btn-link.dark:after {
    background-color: #212529!important
}

.btn-soft-footer {
    background-color: #2029420d!important;
    border: 1px solid rgba(32,41,66,.05)!important;
    color: #202942!important;
    -webkit-box-shadow: 0 3px 5px 0 rgba(32,41,66,.1);
    box-shadow: 0 3px 5px #2029421a
}

.btn-soft-footer.active,.btn-soft-footer.focus,.btn-soft-footer:active,.btn-soft-footer:focus,.btn-soft-footer:hover {
    background-color: #202942!important;
    border-color: #202942!important;
    color: #fff!important
}

.btn-link.footer {
    padding: 0!important;
    color: #212529;
    position: relative
}

.btn-link.footer.active,.btn-link.footer.focus,.btn-link.footer:active,.btn-link.footer:focus,.btn-link.footer:hover,.btn-link.footer:not(:disabled):not(.disabled):active {
    color: #202942!important
}

.btn-link.footer:after {
    background-color: #202942!important
}

.btn-soft-muted {
    background-color: #8492a60d!important;
    border: 1px solid rgba(132,146,166,.05)!important;
    color: #8492a6!important;
    -webkit-box-shadow: 0 3px 5px 0 rgba(132,146,166,.1);
    box-shadow: 0 3px 5px #8492a61a
}

.btn-soft-muted.active,.btn-soft-muted.focus,.btn-soft-muted:active,.btn-soft-muted:focus,.btn-soft-muted:hover {
    background-color: #8492a6!important;
    border-color: #8492a6!important;
    color: #fff!important
}

.btn-link.muted {
    padding: 0!important;
    color: #212529;
    position: relative
}

.btn-link.muted.active,.btn-link.muted.focus,.btn-link.muted:active,.btn-link.muted:focus,.btn-link.muted:hover,.btn-link.muted:not(:disabled):not(.disabled):active {
    color: #8492a6!important
}

.btn-link.muted:after {
    background-color: #8492a6!important
}

.btn {
    padding: 8px 20px;
    outline: 0;
    text-decoration: none;
    font-size: 16px;
    letter-spacing: .5px;
    -webkit-transition: all .3s;
    transition: all .3s;
    font-weight: 600;
    border-radius: 6px
}

.btn:focus {
    -webkit-box-shadow: none!important;
    box-shadow: none!important
}

.btn-group-sm>.btn,.btn.btn-sm {
    padding: 7px 16px;
    font-size: 10px
}

.btn-group-lg>.btn,.btn.btn-lg {
    padding: 14px 30px;
    font-size: 16px
}

.btn.searchbtn {
    padding: 6px 20px
}

.btn.btn-pills {
    border-radius: 30px
}

.btn.btn-light {
    border: 1px solid #f2f4f6
}

.btn.btn-outline-light {
    border-color: #e9ecef!important
}

.btn.btn-soft-light {
    color: #fff!important;
    border-color: #fff!important;
    -webkit-box-shadow: 0 3px 5px 0 rgba(33,37,41,.1);
    box-shadow: 0 3px 5px #2125291a
}

.btn.btn-soft-light.active,.btn.btn-soft-light.focus,.btn.btn-soft-light:active,.btn.btn-soft-light:focus,.btn.btn-soft-light:hover {
    color: #2ea094!important;
    border-color: #fff!important
}

.btn.btn-soft-dark.active,.btn.btn-soft-dark.focus,.btn.btn-soft-dark:active,.btn.btn-soft-dark:focus,.btn.btn-soft-dark:hover {
    color: #2ea094!important;
    border-color: #fff!important;
    background-color: #fff!important
}

.btn.btn-dark,.btn.btn-secondary {
    color: #e9ecef
}

.btn.btn-outline-light {
    color: #212529
}

.btn.btn-link {
    font-weight: 400
}

.btn.btn-link:after {
    content: "";
    position: absolute;
    height: 1px;
    width: 0;
    right: 0;
    left: 0;
    bottom: 0;
    -webkit-transition: all .5s ease;
    transition: all .5s ease
}

.btn.btn-link.active:after,.btn.btn-link:hover:after {
    width: 100%;
    right: auto;
    left: 0;
    height: 1px
}

.btn.btn-icon {
    height: 36px;
    width: 36px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0
}

.btn.btn-icon .icons {
    height: 16px;
    width: 16px;
    font-size: 16px
}

.btn-group-lg>.btn.btn-icon,.btn.btn-icon.btn-lg {
    height: 48px;
    width: 48px;
    line-height: 46px
}

.btn-group-lg>.btn.btn-icon .icons,.btn.btn-icon.btn-lg .icons {
    height: 20px;
    width: 20px;
    font-size: 20px
}

.btn-group-sm>.btn.btn-icon,.btn.btn-icon.btn-sm {
    height: 30px;
    width: 30px;
    line-height: 28px
}











/* palte form  */
.uper-text{
    text-align: center;
}
.uper-text h2{
    letter-spacing: .5px;
    color: #000;
    font-weight: 520;
    font-size: 30px !important;
}
.uper-text p{
   font-size: 14px;
   color: #8492a6 !important;
}
.plate-card{
    text-align: center;
    padding: 10px;
}
.plate-img img{
    width: 120px;
}
.plate-card-text h5 a{
    text-decoration: none;
    color: var(--golden);
    --bs-text-opacity: 1;
    font-weight: 549;
    transition: 0.4s ease-in-out;
}
.plate-card-text a:hover{
    color: var(--golden);
}
.plate-card-text h6{
    color: #000 !important;
}



/* tread start  */
.badge {
    letter-spacing: .5px;
    padding: 4px 8px;
    font-weight: 600;
    line-height: 11px;
}



.text-bg-primary {
    color: #fff !important;
    background-color: var(--golden) !important;
}

.title-heading .heading {
    font-size: 45px !important;
    letter-spacing: 1px;
    color: var(--golden);
}

.title-heading .para-desc {
    font-size: 18px;
    color: #000 !important;
    --bs-text-opacity: 1;
}
.text-warning {
    color: var(--golden) !important;
}
/* .text-muted {
    color: var(--golden) !important;
} */


.z-index-m-1 {
    z-index: -1;
}
.bg-primary {
    background-color: var(--golden) !important;
}
.avatar.avatar-small {
    height: 65px !important;
    width: 65px !important;
}
.rounded-md {
    border-radius: 10px !important;
}
.spin-anything {
    -webkit-animation: spinner-animation 5s linear infinite;
    animation: spinner-animation 5s linear infinite;
}
@-webkit-keyframes spinner-animation {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes spinner-animation {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}


.mover {
    -webkit-animation: mover 1s infinite alternate;
    animation: mover 1s infinite alternate;
}
@media (min-width: 768px) {
    .phone_1 {
        width: 80%;
    }

}
@media (max-width: 767px) {
    .phone_1 {
        width: 50%;
    }
}
@media (max-width: 767px) {
    .meta_icon {
        height: 20px;
    }
}

.modern-app-round {
    position: fixed;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    -webkit-filter: blur(200px);
    filter: blur(400px);
    pointer-events: none;
    z-index: -2;
    background-color: #e6fff5;
}

.modern-app-bg-shape:after {
    content: " ";
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    width: 500px;
    height: 500px;
    border-radius: 50%;
    background: var(--golden);
    background: var(--golden);
    -webkit-box-shadow: 0 0 40px rgba(255, 239, 14, 0.507);
    box-shadow: 0 0 40px var(--golden);
    z-index: -1
}

@media (max-width: 768px) {
    .modern-app-bg-shape:after {
        width:300px;
        height: 300px
    }
}

.modern-app-absolute-left,.modern-app-absolute-right {
    position: absolute
}

.modern-app-absolute-right {
    top: 7%;
    right: 1%
}

@media (min-width: 768px) {
    .modern-app-absolute-right {
        top:20%;
        right: -7%
    }
}

@media (min-width: 1024px) {
    .modern-app-absolute-right {
        right:-10%
    }
}

.modern-app-absolute-left {
    bottom: 7%;
    left: 2%
}

@media (min-width: 768px) {
    .modern-app-absolute-left {
        bottom:20%;
        left: -7%
    }
}

@media (min-width: 1024px) {
    .modern-app-absolute-left {
        left:-10%
    }
}

@media (min-width: 768px) {
    .meta_icon {
        height: 30px;
    }
}
.rounded {
    border-radius: 6px !important;
}
.shadow {
    -webkit-box-shadow: 0 0 3px rgba(60, 72, 88, .15) !important;
    box-shadow: 0 0 3px var(--golden) !important;
}
.bg-soft-primary {
    background-color: var(--golden) !important;
    border: 1px solid rgba(47, 85, 212, .1) !important;
    color: #5f797c !important;
    padding: 4px 6px;
}

@-webkit-keyframes mover {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    to {
        -webkit-transform: translateY(5px);
        transform: translateY(5px)
    }
}

@keyframes mover {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    to {
        -webkit-transform: translateY(5px);
        transform: translateY(5px)
    }
}
/* diver start  */
.diver-a a{
    padding: 12px 20px;
    outline: 0;
    text-decoration: none;
    font-size: 16px;
    letter-spacing: .5px;
    -webkit-transition: all .3s;
    transition: all .3s;
    font-weight: 600;
    border-radius: 6px;
    border: 1px solid var(--golden);
    color: var(--golden);

}
.diver-a a:hover{
    background-color: var(--golden);
    color: white;

}
.diver-a{
    padding-top: 23px;
}
.diver-text{
    color: black;
}
.diver-text strong{
    color: var(--golden);
}
.diver-text p{
    color: black;
}
.diver-card .features .image i{
    color: var(--golden);
}

.features.feature-primary .image:before {
    background: linear-gradient(45deg, transparent, rgba(45, 162, 147, .1));
}

.features .image:before {
    content: "";
    position: absolute;
    bottom: 5px;
    left: 5px;
    width: 64px;
    height: 64px;
    border-radius: 6px;
    -webkit-transform: rotate(33.75deg);
    transform: rotate(33.75deg);
}
.text-primary {
    --bs-text-opacity: 1;
    color: var(--golden) !important;
}

/* Trading process section */

.trading-process{
    background: #FBFFFD;
}
.head p{
    color: #5F797C;
}
.trading-process .head h6{
    color: var(--golden);
    font-weight: bold;
}
.trading-process .head h2{
    font-weight: 550;
}
.trading-process .head b{
    color: var(--golden);
    font-weight: bold;
}
.trading-process .detail h5{
    font-weight: bold;
}
.trading-process .detail p{
    color: #000;
}

/* number start  */
#number-cont {
    background-color: var(--golden);
    border-radius: 10px;
}
.num-card{
    text-align: center;
    color: white;
}
.num-card h1{
    font-weight: 700;
}
.num-card p{
    font-weight: 700;
}
.num-i{
    font-size: 40px;
}
.number{
    background-color: #f8f9fa;
}


/* blog start  */
.blog{
    background-color: #f8f9fa;
}
.main-blog-text h6{
    color: var(--golden);
    font-weight: 600;
}
.main-blof-text-1 p{
    color: #5F797C;

}
.main-blof-text-1 p strong{
    color: var(--golden);
}
.blog-icon a{
    text-decoration: none;
    transition: 0.4s ease-in-out;
    color: var(--golden);
    font-weight: bold;
}
.blog-icon a:hover{
     color: var(--golden);
}
.main-blog-ico{
    justify-content: space-between;
}
.blog-read a{
    text-decoration: none;
    color: var(--golden);
    transition: 0.4s ease-in-out;
}
.blog-read a:hover{
    color: var(--golden);
}
.card-text a{
    text-decoration: none;
    transition: 0.4s ease-in-out;
    color: black;
    font-weight: 650;
}
.card-text a:hover{
    color: var(--golden);
}
.card{
    transition: 0.6s ease-in-out;
}
.card:hover{
    transform: translateY(-10px);

}

/* embark start  */
.embark{
    background-color: var(--golden);
    /* position: fixed; */
}
.embark img{
    width: 85%;
    text-align: center;
    position: relative;
    bottom: 150px;
}

.embark-text p{
    color: white;
    text-align: justify;

}
.embark-text  h5{
    color: #2DA293;
}
/* footer start  */
.footer {
    background-color: black;
    position: relative;
    /* bottom: 270px; */
}
.foo-logo img{
    width:200px;
}
.main-foo {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--golden);
}
.foo-a{
    padding-top: 20px;
   text-align: end;
}
.foo-a a{
    text-decoration: none;
    background-color: var(--golden);
    padding: 6px 12px;
    border-radius: 8px;
    color: white;
    transition: 0.4s ease-in-out;
}
.foo-a a:hover{
    background-color: var(--golden);
    color: white;
}
.foot-text p{
    color: rgb(180, 180, 180);
    font-size: 9px;
    text-align: justify;
}
.foot-icon a{
    font-size: 13px;
    text-decoration: none;
    color:var(--golden);
}
.foot-icon {
    gap: 12px;
    display: flex;
}
.footer-a h4{
    color: var(--golden);
}

.footer-a  a{
    text-decoration: none;
    text-align: left;
    color: gray;
    transition: 0.4s ease-in-out;
}
.footer-a  a:hover{
    color: var(--golden);
}
.footer-a img{
    width: 150px;
}
.footer-a p{
    color: gray;

}


li.mt-2 {
    margin-top: 11px !important;
}