@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
*, ::after, ::before {
    box-sizing: border-box;
}
/* --- chrome scrool bar --- */
::-webkit-scrollbar {
    width: 8px !important;
}
::-webkit-scrollbar-thumb {
    background: #9e9e9e;
    border-radius: 2px;
    height: 50px;
}
html{scroll-behavior: smooth;scroll-padding-top: 150px;}
body {
    font-family: "Roboto", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    margin: 0;
    padding: 0;
    overflow-x: hidden;    
}

/* customs css */
:root {
    --color-primary: #279800;
    --dark: #000;
    --white: #fff;
    --text-color: #4a4a4a;
}
a:hover {
    text-decoration: none;
    transition: all 0.5s ease;
}
a:focus,.button:focus,button:focus {
    text-decoration: none;
    outline: none;
}
a:focus {
    text-decoration: none;
}
a:focus,a:hover,.portfolio-cat a:hover,.footer -menu li a:hover {
    text-decoration: none;
}

.btn-box .green-btn {color: var(--white);background-color: var(--color-primary);font-size: 16px;border-radius: 50px;padding: 8px 30px;}
.btn-box .green-btn:hover {background-color: #34b806;}
.light-font{font-weight: 300;}
.bold{font-weight: 600;}
.mt-5{margin-top: 50px;}
.mt-8{margin-top: 80px;}
.mb-3{margin-bottom: 30px;}
.mt-0{margin-top: 0px!important;}
.font-18{font-size: 18px;}
.w-100{width: 100%;}
.w-70{width: 70%;max-width: 500px; }
.m-auto{margin: 0 auto;}
.center-vistorsblock {
    display: flex;
    justify-content: center; /* Center horizontally */
    /*min-height: 100vh;  Full viewport height */
    width: 100%; /* Full viewport width */
    margin-top: 20px; /* Remove default margins */
    padding: 20px; /* Optional: Add padding for small screens */
    box-sizing: border-box; /* Include padding in width/height */
}

/* fonts */
h1, h2, h3, h4, h5, h6 {margin-top: 0;}
p {
    font-size: 16px;
    margin-bottom: 1rem;
    font-weight: 400;
    color: var(--text-color);
}
ul {list-style: none;}
.green-para {color: var(--color-primary);font-weight: 500;}
.light-txt {font-weight: 300;}
.section-title .title {font-weight: 700;font-size: 42px;margin-bottom: 20px;}
.text-center {text-align: center;}
/* gaps */
.pt-5  {padding-top: 5rem;}
.pb-5 {padding-bottom: 5rem;}
.ms-3 {
    margin-left: 16px;
}
/* flex */
.d-flex {
    display: flex;
}
.flex-shrink-0 {
    flex-shrink: 0;
}
.flex-grow-1 {
    flex-grow: 1;
}

/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {
    display: flex !important;
    align-items: center;
    justify-content: center;
    background-color: var(--color-primary);
    padding: 7px;
    border-radius: 4px;
    position: fixed;
    bottom: 15px;
    right: 15px;
    transition: background-color 0.3s, opacity 0.5s, visibility 0.5s;
    opacity: 0;
    visibility: hidden;
    z-index: 1000;transition: all 0.5s ease;
    text-decoration: none;
    width: 36px;
    height: 36px;
}
.back-to-top::after {
    content: "";
    background-image: url(../../images/frontendimage/bottom.png);
    background-repeat: no-repeat;
    width: 18px;
    height: 11px;
}
.back-to-top:hover {
    cursor: pointer;    
    background-color: #333;
}
.back-to-top:active {
    background-color: #555;
}
.back-to-top.show {
    opacity: 0.5;
    visibility: visible;
}

/* header */
.main_header .navbar {background-color: #eefae8 !important;padding:10px 15px!important;}
.main_header .navbar-default {background-color: transparent;border: 0;padding: 1rem 0;margin: 0;}
.main_header .navbar-brand {height: auto;line-height: normal;padding: 0;}
.main_header #navbar {margin-top: 14px;}
.main_header .navbar-nav {margin-left: 4rem;margin-right: 0px;}
.main_header .navbar-nav li {margin-left: 2rem;}
.main_header .navbar-nav li a {font-size: 16px;color: var(--text-color) !important;padding: 15px 2px 2px 2px;}
.main_header .navbar-default .navbar-nav>.active>a, .main_header .navbar-default .navbar-nav>.active>a:focus, .main_header .navbar-default .navbar-nav>.active>a:hover,
.main_header .navbar-nav li a:hover {background-color: transparent;border-bottom: 2px solid var(--color-primary);}
.main_header .rightside-menu li {position: relative;}
.main_header .rightside-menu li:nth-child(2):before {
    position: absolute;
    content: '';
    height: 18px;
    width: 2px;
    background-color: var(--text-color);
    left: -10px;
    bottom: 4px;
}
.main_header .rightside-menu li a {font-weight: 700;}
.main_header .rightside-menu li a:hover {border: 0;color: #000 !important;}
.main_header .rightside-menu li a.select-language {background-color: var(--color-primary);color: var(--white) !important;border-radius: 50px;padding: 6px 24px;margin-top: 9px;}


/* banner */
.main_banner {background-image: url(../../images/frontendimage/main-banner.webp);background-repeat: no-repeat;background-size: cover;background-position: bottom;padding: 330px 0;background-color: #EEFAE8;min-height: 600px;display: flex;align-items: center;}
.main_banner .content {text-align: center;position: relative;z-index: 9;}
.main_banner .content h1 {font-size: 42px;font-weight: 700;color: var(--text-color);margin: 0;text-transform: uppercase;}
.main_banner .content h2 {font-size: 42px;font-weight: 300;color: var(--text-color);margin-top: 10px;}
.main_banner .content .banner-box {display: flex;gap: 1rem;justify-content: center;margin: 4rem 10rem;text-align: center;flex-wrap: wrap;}
.main_banner .content .banner-box .inner-box {background-color: var(--white);padding: 20px;border-radius: 10px;box-shadow: 1px 1.732px 5px 0px rgba(0, 0, 0, 0.078);flex: 1 0 0;transition: all 0.5s ease;}
.main_banner .content .banner-box .inner-box:hover {transform: translate(0, -2rem);}
.main_banner .content .banner-box .inner-box img {margin: 0 auto;}
.main_banner .content .banner-box .inner-box h3 {font-size: 18px;margin-bottom: 0;margin-top: 1rem;}
.section-title .green-para {margin-top: 20px;}
.section-title .green-para .link{color: var(--color-primary);border-bottom: 1px solid var(--color-primary);}

/* home about */
.about_home .left-side h3 {color: var(--color-primary);font-size: 30px;font-weight: 700;}
.about_home .left-side h4 {color: var(--text-color);font-size: 30px;font-weight: 700;}
.about_home .left-side .d-flex + .d-flex {margin-top: 30px;}
.about_home .img-box {display: flex;align-items: center;gap: 10px;}
.about_home .img-box .download-app img {margin: 0 auto;}
.about_home .img-box .download-app p {text-align: center;font-weight: 600;}

/* how to work */
.how_work .work-data ul {position: relative;}
.how_work .work-data ul::before {position: absolute;content: '';border-left: 1px solid #b7b8be;width: 1px;left: 12px;height: 98%;top: -20px;}
.how_work .work-data h3 {font-size: 30px;font-weight: 700;margin-bottom: 30px;}
.how_work .work-data ul li {background-color: #eefae9;padding: 14px 15px;border-radius: 10px;margin: 10px 0 10px 15px;display: flex;align-items: center;justify-content: space-between;gap: 10px;position: relative;}
.how_work .work-data ul li::before {position: absolute;content: '';background-image: url(../../images/frontendimage/arrow.png);background-repeat: no-repeat;width: 29px;height: 10px;left: -42px;bottom: 0;transform: translate(0,-23px);}
.how_work .work-data ul li .text {font-size: 18px;font-weight: 600;}
.how_work .inner-box {margin: 16px 30px 16px 0;}
.how_work .inner-box .img-box {margin: 30px 0;}
.modal-backdrop {z-index: 8;}
/* statment */
.statment .inner-box {margin: 16px 0;background-color: var(--white);border: 1px solid rgb(183, 184, 190);border-radius: 10px;box-shadow: 1.5px 2.598px 8px 0px rgb(0 0 0 / 18%);padding: 16px;height: calc(100% - 30px);transition: all 0.5s ease;}
.statment .inner-box:hover {background-color: #eefae9;cursor: pointer;}
.statment .inner-box h3 {margin: 10px 0;}

/* arabic */
.arabic-box .inner-box {margin: 20px 0;text-align: right;}
.arabic-box .inner-box h3 {margin: 14px 0;}
.arabic-box .inner-box .img-box {background-color: #27ad4c;border-radius: 100%;padding: 25px;display: inline-block;}

/* footer */
.main_footer {background-color: #eefae9;padding: 40px 0;margin-top: 30px;}
.main_footer .inner-box, .main_footer .social-icon {display: flex;align-items: center;justify-content: space-between;gap: 10px;flex-wrap: wrap;}
.main_footer .left-side ul {padding-left: 0;display: flex;gap: 10px;align-items: center;flex-wrap: wrap;}
.main_footer .left-side ul li {position: relative;padding: 0 8px;}
.main_footer .left-side ul li::after {position: absolute;content: '';width: 1px;height: 20px;background-color: var(--dark);right: -6px;}
.main_footer .left-side ul li:last-child::after {display: none;}
.main_footer .left-side ul li .link {color: var(--dark);font-size: 16px;}
.main_footer .right-side p {color: var(--dark);margin: 0;}

.ban-flex{display: flex;align-items: center;flex-wrap: wrap; justify-content: space-between;margin-top: 20px;padding: 0 5px;}
.ban-flex .title{font-size: 24px;font-weight: bold;}
.ban-flex .time{font-size: 17px;font-weight: bold;}
.justify-content-center{display: flex; justify-content: center!important;}
.img-fluid {max-width: 100%;height: auto;}

.pop-youtube .modal-content{background-color: transparent;box-shadow: none;border: none;}
.pop-youtube .modal-header{padding: 0;border: none;}
.pop-youtube .modal-body{position: relative;display: flex;flex: 1 1 auto;padding: 0;}
.pop-youtube .modal-header .close{color: #fff;opacity: 1;font-size: 36px;}
.pop-youtube .modal-dialog{max-width: fit-content;margin: 0 auto;text-align: center;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%) !important;width: 60%!important;}
.pop-youtube .modal-body iframe{width: 1200px;height: 450px;}
.pop-youtube .modal.fade.show{padding-right: 0px !important;}

.yellow-bg{background-color: #eefae8;}
.all-content{}
.all-content img{cursor: pointer;}
.app-section{display: flex;align-items: center; justify-content: center;width: 30%;margin: 50px auto;}
.app-section div{margin-right: 5px;}
.pointer{cursor: pointer;}

.option-flex{display: flex;flex-wrap: wrap; align-items: center;align-content: center;justify-content: space-between;margin-top: 20px;}
.option-flex .option-box{background-color: #fff;border-radius: 12px;border: 1px solid #ccc;padding: 5px 15px;margin: 0px 5px 10px 0px;}
.text-lowercase{text-transform: capitalize!important;}
.faq-section{margin-top: -280px;}
.option-flex a{color: inherit!important;}

.accordion-box{margin-bottom:20px;}
.accordion{position: relative;background-color:#fff;font-weight: bold; border-radius: 15px;border: 1px solid #ccc; color:#333;cursor:pointer;padding:15px 50px 15px 50px;text-indent: -30px;border: 1px solid #D2D2D2;width:100%;text-align:left;outline:0;font-size:18px;transition:all .2s ease}
.accordion::after{position: absolute; content:"\002B";color:#000;font-weight:400;font-size: 26px; float:right;top: 8px;right: 0px;}
.accordion.active,.accordion:hover{background-color:#289800;color:#fff;transition:0.2s all ease-in-out;}
.accordion.active{border:none;}
.accordion:hover::after{color:#fff}
.accordion.active::after{content:"\2212";color:#fff;}
.accordion-box .panel{border-radius: 0px 0px 15px 15px;margin-top: -16px; padding:0px 20px 0 20px;background-color:#289800;max-height:0;overflow:hidden;transition:max-height .2s ease-out}
.accordion-box .panel p{color:#fff!important;font-size: 16px;}
.accordion-box .panel p:first-child{padding-top:20px}

.cust-hidden1{min-height: 550px!important;}

/* .accordion::after{left: 0px;right: auto;}
.accordion{text-align: right;} */

.main_banner.cust-hidden1,.main_banner.cust-hidden2{min-height: 900px;}

.indent{text-indent: -45px;padding-left: 45px;margin-bottom: 20px;}
.indent img{margin-right: 20px;}
.banner-img{margin-top: -350px;}
.about-img{margin-top: -350px;}

.login-box{background-color: #fff;border: 1px solid #DADADA;box-shadow: 0 5px 5px 0 rgba(0, 0, 0, .2);border-radius: 20px;padding: 20px 40px 50px 40px;text-align: left;margin-top: 30px;}
.login-box h3{text-align: center;font-weight: 400;margin: 30px 0;font-size: 32px;}
.login-box h3 a{font-weight: bold;color: #259c02;text-decoration: underline;}
.login-box label,.login-box input{width: 100%;font-weight: 500;}
.login-box input{padding: 10px;border: 1px solid #ccc;}
.login-box input:focus{outline-color:#259c02;}
.login-box p{text-align: right;font-size: 14px;color: #000;margin-bottom: 10px;}
.login-box p span{color: #ee8702;}
.register label{width: 100%;font-weight: 500;}
.register input[type=radio]{width: auto;}
.all-btn{background-color: #259c02;padding: 8px 60px !important;border-radius: 30px;color: #fff;font-weight: 600;font-size: 22px;transition: 0.4s all ease-in-out;}
.all-btn:hover{background-color: #E57D00;transition: 0.4s all ease-in-out;color: #fff;}
.all-btn.w-100{width: 100%;padding: 8px 150px;}
.bot-button-area{display: flex;align-items: center;justify-content: space-between;margin-top: 30px;}
.bot-button-area .forgot{text-decoration: underline;}

.pb-1{padding-bottom: 5px;}
.mt-2{margin-top: 20px;}
.green-div{color: #279800;font-weight: 600;font-size: 24px;text-align: center;margin-bottom: 30px;}
.green-div1{color: #075308;font-weight: 600;font-size: 24px;text-align: center;margin-bottom: 30px;}
.dash-brd{border: 1px solid #279800;text-align: center;width: 200px;margin: 0 auto 20px auto;}
.topimg-box{background-color: #fff;border: 1px solid #ccc;padding: 20px;border-radius: 20px;margin-bottom: 0px;margin-top: 100px; text-align: right;min-height: 210px;}
.topimg-box .topimg-box-head{font-size: 18px;}
.broker-img{margin-top: -100px;margin-right: -10px;margin-bottom: 15px;}
.broker-img .img-preview{height: 160px; width: 160px; border:1px solid #ddd; display: block; border-radius: 20px; text-align: center; vertical-align: middle; line-height: 160px;}

/* ========================= 
    Responsive
========================== */
@media (max-width: 3200px) {.main_banner.register,.main_banner.login,.main_banner.broker{background-size: contain!important;background-position: top!important;}}
@media (max-width: 2100px) {.main_banner.cust-hidden1 {min-height: 400px;}.login{padding: 160px 0 60px 0;}}
@media (max-width: 1920px) {.main_banner {padding: 150px 0;margin-top: 40px;}.main_banner.cust-hidden2{min-height: 700px!important;display: block;}.login{padding: 80px 0 60px 0;}.faq-section{margin-top: -110px;}.about-img{margin-top: -450px;}}
@media (max-width: 1366px) {.main_banner {padding: 50px 0;margin-top: 80px;}.main_banner.cust-hidden2{min-height: 585px!important;}.login{padding: 40px 0 60px 0;background-size: contain;background-position: center;}.all-btn.w-100{width: 100%;padding: 8px 100px;}.main_banner.register{padding-top: 50px;}}
@media (min-width: 1200px) {
    .row {display: flex;flex-wrap: wrap;}
    .container {width: 1200px;}
    .main_header .row {margin: 0;}
}
@media (min-width: 768px) {
    .block {display: block;}
}
@media only screen and (min-width: 1200px) and (max-width: 1499px) {
    .main_banner {min-height: 540px;}    
}
@media (max-width: 1199px) and (min-width: 992px){.ban-flex{justify-content: center;}}
@media (max-width: 1199px) {
    .main_header .navbar-brand>img {max-width: 60px;}
    .cust-hidden {width: 100%;float: left;overflow: hidden;}    
}
@media (max-width: 991px) {
    .main_header .navbar-brand>img {max-width: 50px;}
    .modal-dialog{width: 90%;}
    .pop-youtube .modal-body iframe{width: 700px;height: 300px;}
    .mmb-20{margin-bottom: 20px;}
    .main_banner {margin-top: 70px;background-size: contain;}
    .bot-button-area{flex-wrap: wrap;justify-content: center;}
    .bot-button-area .forgot{display: block;width: 100%;text-align: center;padding-top: 20px;}
    .topimg-box{min-height: auto;}
    .main_banner.cust-hidden1{margin-top: 0px;}
}
@media (max-width: 767px) {
    .cust-hidden {width: 100%;float: left;overflow: hidden;}
    .block {display: inline-block;}
    .pt-5  {padding-top: 2rem;}
    .pb-5 {padding-bottom: 2rem;}
    .main_banner {padding-bottom: 2rem;min-height: 100%;}
    .main_banner .content h1, .main_banner .content h2, .section-title .title {font-size: 28px;}
    .main_header .navbar-nav, .main_header .navbar-nav li {margin-left: 0;}
    .main_header .navbar-default .navbar-toggle {background-color: var(--color-primary);margin-right: 0;}
    .main_header .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {background-color: var(--color-primary);}
    .main_header .navbar-default .navbar-toggle .icon-bar {background-color: var(--white);}
    .main_header #navbar {box-shadow: 0 0 8px 2px rgb(0 0 0 / 9%);}
    .main_header .rightside-menu li a.select-language {display: inline-flex;}
    .main_header .rightside-menu li:nth-child(2):before {display: none;}
    .main_header .navbar-brand>img {max-width: 50px;}
    .main_header .navbar-nav li a {display: inline-flex;}
    .mt-8 {margin-top: 50px;}    
    .app-section{flex-wrap: wrap;justify-content: center;}
    .app-section div{margin-right: 0px;display: inline-block;width: 100%;text-align: center;margin-bottom: 10px;}
    .ban-flex .title,.all-content h3{font-size: 20px;}
    .w-70{width: 100%;}
    .pop-youtube .modal-dialog{width: 90%!important;}
    .option-flex{justify-content: center;}
    .option-flex .option-box{margin: 5px;}
    .banner-img {margin-top: -400px;}
    .main_banner.cust-hidden2{min-height: 414px !important;}
    .login-box h3{font-size: 26px;}
    .login-box{padding: 0px 20px 30px 20px;}
    .about-img{margin-top: -300px;}
    
}
@media (max-width: 640px) {
    .main_footer .inner-box, .main_footer .social-icon {justify-content: center;}
    .main_banner .content .banner-box {margin: 4rem 2rem;}    
}
@media (max-width: 575px) {
    .main_banner.cust-hidden2{background-position: center!important;}
    .faq-section {margin-top: -90px;}
}
@media (max-width: 515px) {
    .ban-flex{justify-content: center;}
    .all-btn.w-100{padding: 8px 35px;}
}

/* Live Chat */
.chat .thumb img {
    width: 27px;
    height: 27px;
    border-radius: 50%
}

.chat .status {
    float: left;
    margin: 16px 0 0 -16px;
    font-size: 14px;
    font-weight: bold;
    width: 12px;
    height: 12px;
    display: block;
    border: 2px solid #FFF;
    z-index: 12312;
    border-radius: 50%
}

.chat .status.online {
    background: #1ABB9C
}

.chat .status.away {
    background: #F39C12
}

.chat .status.offline {
    background: #ccc
}

.chat .media-body {
    padding-top: 5px
}
.chaticon {
    position: fixed;
    bottom: 30px;
    right: 100px;
    height: 80px;
    background: url(../../images/chat_icon6.png) no-repeat;
    width: 80px;
    background-size: 100%;
    z-index: 9900;
    cursor: pointer;   
}
.error-element {
    border: 1px solid #F00 !important;
    outline-color: #F00 !important;
}

label.error,
p.error { 
    color: #F00 !important;
    text-align: left;
    display: block;
}

/*Alerts*/
.alert{
	position: absolute;
    z-index: 9999;
    width: 99%;
    right: 0;
    top: 10px;
    left: 0;
    margin: auto;
    margin-bottom: 0;
}

.alert .title-text{
	margin-bottom: 0;
}

/* Custom Radio Button style */
.radio {margin-right: 0px;margin-bottom: 5px !important;margin-top: 0px !important;}
.radio label {display: inline-block;vertical-align: middle;position: relative;padding-left: 25px;
outline:none;}
.radio + .radio, .checkbox + .checkbox {
    margin-top: 0px !important;
}
.radio label::before {
    content: "";
    display: inline-block;
    position: absolute;
    width: 20px;
    height: 21px;
    left: 0;
    border-radius: 50%;
    border: 2px solid #bbb;
    background-color: transparent;
    outline:none;
}
.radio label::after {
    display: inline-block;
    position: absolute;
    content: " ";
    width: 20px;
    height: 21px;
    left: 0px;
    top: 0px;
    border-radius: 50%;
    border: 2px solid #bbb;
    background-color: transparent;
    outline:none;
}
.radio input[type="radio"] {opacity: 0;z-index: 1;}
.radio input[type="radio"]:focus + label::before {outline: thin dotted;outline: 5px auto -webkit-focus-ring-color;outline-offset: -2px;}
.radio input[type="radio"]:checked + label::after {color: #f1c40f;padding-left: 2px;font-family: "FontAwesome";content: "\f00c";outline: none;font-size: 13px;}
.radio input[type="radio"]:disabled + label {opacity: 0.65;}
.radio input[type="radio"]:disabled + label::before {cursor: not-allowed;}
.radio.inline-block{display:inline-block;}
.required{color: #F00;padding: 0px 5px 0 0;font-weight: bolder;font-size: 12px;}
.spacer-btm-5{margin-bottom: 5px !important;}

/* Ticker Styles */
@keyframes ticker {
    0% { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(-100%, 0, 0); }
}
.tcontainer{
    position: fixed;
    bottom: 0;
    left: 0;
    font-size: 40px;
    color: #101010;
    line-height: 48px;
    height: 40px;
    width: 100%;
    overflow: hidden;
    vertical-align: middle;
    font-weight: 500;
}
.ticker-wrap {
    width: 100%;
    margin-left: 100%;

}
.ticker-move {
    display: inline-block;
    background-color: white;
    white-space: nowrap;
    padding-right: 100%;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-name: ticker;
    /*   animation:ticker 30s linear 0s infinite ; */
    animation-duration: 30s;

}
.ticker-move:hover{
    animation-play-state: paused;
    cursor: pointer;
}
.ticker-item{
    overflow: hidden;
    padding: 0 2rem;
}

/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {
.tcontainer {
        font-size: 20px;
 	}
}

/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {
.tcontainer {
        font-size: 20px;
 	}
}