::placeholder { color: #bbb!important; }
.table-condensed td, .table-condensed th { padding: .9rem; }
.table td pre { margin-bottom: 0; }
.text-bold { font-weight: bold; }
.token-staking-form form { padding-top: 2rem; }
.token-staking-form form label { font-size: 1.3rem; font-weight: bold; padding-bottom: .5rem; }
html, body { min-height: 100%; }


th, td, a, a:hover, a:active, a:link, a:visited { color: #000; text-decoration: none!important; }
.token-staking table { font-size: 1.2rem; }
small { font-size: .8rem; position: relative; top:1px; }
.App { padding-top: 0rem; }
button { transition: 0.3s ease-in-out; box-shadow: none!important; border: transparent!important; }

button.right-radius { border-top-right-radius: 6px; border-bottom-right-radius: 6px; }
.left-radius { border-top-left-radius: 6px; border-bottom-left-radius: 6px; }
table small { color: #61DAFB; font-weight: bold; }
.lp-link, .lp-link a { font-size: 1.5rem; transition: 0.3s ease-in-out; color: #61DAFB!important; font-weight: normal!important; }
.lp-link:hover, .lp-link:hover a { color: #61DAFB!important; }



/* MXI Style*/
@import url('https://fonts.googleapis.com/css2?family=Spartan:wght@100;200;300;400;500;600;700;800;900&display=swap');
body { font-family: 'Spartan', sans-serif; font-weight: 500; font-size: 12px; overflow-x: hidden; color: black;}
*, :after, :before { margin: 0; padding: 0; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; text-rendering: optimizeLegibility }
a:active, a:focus, a:hover, a:visited, button, img { border: none; outline: 0!important; text-decoration: none; transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out; }

/* Header */
.header { padding: 40px 0; float: left; width: 100%; background: #fff;}
.container-1600 { max-width: 1600px;}

.unlock-wallet button { background: #4DB8FD; color: #fff; padding: 13px 30px; font-size: 15px; border-radius: 55px !important; float: right; font-weight: 700; }
.menu.navbar .navbar-collapse a { color: #3d404f; font-size: 15px; font-weight: 700; margin: 0 5px; }
.menu.navbar .navbar-collapse a:hover { color: #4DB8FD;}
.sldier { float: left; width: 100%; padding: 10px 0; }
.slider-order-2 { order: 2;}
.sldier h1 { font-size: 32px; color: #3d404f; line-height: 50px; font-weight: 800; max-width: 459px; }
.sldier h1 span { color: #4DB8FD; }

.bullet .list-group-item img { position: absolute; left: 0px; margin-top: 1px; }
.bullet .list-group-item { border: none; padding: 8px 0 8px 30px; font-size: 15px; font-weight: 500; }
.bullet { margin-top: 25px; }
.btn-common { background: #4DB8FD; color: #fff; padding: 15px 30px; font-size: 17px; border-radius: 55px !important; min-width: 300px; font-weight: 700;} 
.verify-contract { color: #4DB8FD !important; clear: both; float: none; display: table; margin-top: 24px; min-width: 300px; text-align: center; font-weight: 600; font-size: 14px; }

.token-section { padding: 10px 0; float: left; width: 100%;}
.bg-blue { background: rgba(77, 184, 253, 0.1); padding: 15px 0; float: left; width: 100%; border-radius: 30px; font-size: 14px; font-weight: 400; min-height: 358px; }
.bg-blue table { margin: 0px;}
.bg-blue td, .bg-blue th { border-top:1px solid rgba(77, 184, 253, 0.35); padding: 19px 30px; font-weight: 500;}
.b-t-0 { border: none !important;font-size: 17px; }

.bold { font-weight: 700 !important; }
.bdr-top-table { border-top: 1px solid rgba(77, 184, 253, 0.35); }
.bg-blue .form-group { padding: 0 35px;margin-top: 35px; margin-bottom: 10px; }
.bg-blue .form-group input { border-radius: 35px; padding: 24px; border: 1px solid #4DB8FD; text-align: center;}
.center-button { margin: 0 auto; display: table; float: none;}
.center-button .btn { min-width: 190px; text-align: center; margin: 25px 5px 8px; padding: 15px 30px; font-size: 17px; font-weight: 700; border-radius: 55px; background: #4DB8FD; }

.transaction { background: #FBFBFC; padding: 60px 0; float: left; width: 100%; }
.section-title { text-align: center; font-size: 32px; font-weight: 700; color: #424242; line-height: 35px; margin: 0; }
.section-title span { color: #4db8fd;}
.transaction-table .table-bordered td, .transaction-table .table-bordered th { padding: 17px 10px; font-size: 16px;}
.transaction-table thead th { background: #4DB8FD; color: #fff; padding: 20px 23px; font-size: 14px; border-top: none; border-left: none; }
.transaction-table .table {  border: none; margin: 0; }
.transaction-table thead th:last-child { border-right: none; padding-right: 25px;}
.transaction-table tbody tr td { border-left: none; border-bottom: none; font-size: 14px !important;}
.transaction-table tbody tr td:last-child { border-right: none;}
.pad-25 { padding-right: 25px !important}
.table-striped tbody tr:nth-of-type(2n+1) { background: #fff; }
.table-striped tbody tr:nth-of-type(2n+2) { background-color: #FAFAFA; }
.transaction-table { border: 1px solid #E6E6E6; border-radius: 30px; overflow: hidden; padding: 0; }

.fund { padding: 60px; background: #fff; float: left; width: 100%;}
.risk { text-align: center; font-size: 19px; margin-top: 8px; color: #424242; font-weight: 500; margin-bottom: 20px;}

.box p { font-size: 15px; margin: 20px 0; }
.box { text-align: center;  padding: 30px 15px; border: 1px solid #ebedf0; margin-top: 30px; border-radius: 5px;}
.box.active { transform: scale(1.1); background: #fff; box-shadow: 0px 0px 15px #E0E0E0; }
.bold.mt-0.fixed-width { max-width: 230px; margin: 0 auto; }
.box .img-fluid { margin-bottom: 20px; }
.hr-class { width: 100%; height: 1px; background: rgba(0, 0, 0, 0.08); margin: 100px 0 65px; }
.referrals { background: rgba(77, 184, 253, 0.1); padding: 45px 0; float: left; width: 100%; border-radius: 30px; font-size: 16px; font-weight: 400; margin-top: 30px;text-align: center;}
.Referral-link { font-size: 15px; text-align: center; font-weight: 600; color: #3d404f; }
.Referral-form { padding: 0 25px; }

.Referral-form input { border-radius: 35px; padding: 24px; border: 1px solid #4DB8FD; text-align: center; }
.Referral-form .center-button .btn { margin-top: 10px; width: 100%; min-width: 280px; }
.referral-links { text-align: center; font-size: 14px; line-height: 24px; font-weight: 600; color: #3d404f; margin-bottom: 0; margin-top: 25px; }
.total-coin { color: rgb(77, 184, 253); font-weight: bold; text-align: center; font-size: 38px; }
.referral-history { text-align: center; margin: 0 auto; display: table; font-weight: 600; text-transform: uppercase; margin-top: 29px; margin-bottom: 0; color: #4DB8FD !important; border-bottom: 2px solid #4DB8FD; line-height: 13px; }
.col-12.additional-earnings { padding: 35px 0; text-align: center; margin-top: 25px; }
.id{max-width: 250px; word-break: break-all;}

.percentage{ font-size: 16px; color: #3d404f; text-transform: uppercase; font-weight: 600; }
.percentage-value { font-size: 15px; color: #3d404f; font-weight: 500; margin-bottom: 5px;}
.percentage-value span { font-weight: 700;}

.investment { padding: 60px 0; background: #F7F8FA; float: left; width: 100%; }
.investment-box {  border-radius: 10px; padding: 20px; float: left; width: 100%; background: #fff; border: 1px solid #ebedf0; margin-top: 30px; }
.defi-box { font-size: 17px; text-align: center; margin: 0 3px 0 0; font-weight: 600; }
.defi-box span { color: #4DB8FD; }

.how-it-work { padding: 60px 0; background: #fff; float: left; width: 100%; }
.progress-line { width: 40px; padding: 0 15px; float: left; background: url(../img/dotted-line.png) center top repeat-y; margin-top: 55px; }
.work-box {  border-radius: 10px; padding: 30px; float: left; width: 100%; background: #F7F8FA; border: 1px solid #ebedf0;}
.progress-box { padding: 0 15px; float: left; width: calc(100% - 40px); }
.step { font-size: 18px; font-weight: 500; margin-bottom: 18px; }
.exchange-title { font-size: 17px; font-weight: 600; margin-bottom: 10px;}
.work-details { font-size: 15px; margin-bottom: 10px; margin-bottom: 2px;}
.step-box { float: left; width: 100%; margin-top: 50px;}

.btn-work { text-align: center; margin: 15px 0px 0px; padding: 15px 30px; font-size: 15px; font-weight: 700; border-radius: 55px; background: #4DB8FD;color: #FFFFFF;}
.work-box .bullet { margin: 0;}
.work-box .bullet ul li{  background: #F7F8FA; padding-bottom: 4px;  } 

.dot-box { width: 18px; height: 18px; background: #4DB8FD; border-radius: 50%; position: absolute; margin-left: -45px; margin-top: 3px; }
footer { padding: 60px 0 30px; float: left; width: 100%; background: #F7F8FA; }
.footer-title { margin-top: 15px; font-size: 17px; font-weight: 700; margin-bottom: 30px; }
.footer-li { margin: 0px; padding: 0px; }
.footer-li li { list-style: none; font-size: 14px; color: #3d404f; margin-bottom: 10px; font-weight: 500; }
.footer-li li a { color: #4DB8FD; font-weight: 500; }

.footer-btn-line { border-top: 1px solid #DEDFE1; margin-top: 20px; padding: 33px 0 0; font-size: 13px; }
.copyright { margin: 0px; }
.footer-btn-line a { font-weight: 600; }

.textcentered {
  text-align: center;
}


@media ( min-width: 992px) {
    .unlock-wallet { order: 3; }
}

@media ( max-width : 991px) {
    .menu.navbar.navbar-expand-lg.navbar-light { background: #F7F8FA; margin-top: 25px; }
    .header, .token-section, .sldier { padding: 20px 0;}
    .transaction, .fund, footer { padding: 30px 0;}
    .slider-order-2 { margin-top: 45px; }
    .bg-blue { margin-bottom: 25px;}
}

@media ( max-width : 767px) { 
    .hr-class { margin: 60px 0 55px;}
    .top-mobile { margin-top: 20px; }
    footer { text-align: center;}
    footer .col-md-3 img { margin: 0 auto; display: table; }
    .footer-title { margin-bottom: 10px; margin-top: 35px; }
    .footer-btn-line .float-left, .footer-btn-line .float-right { text-align: center; width: 100%; margin-top: 5px;}
    .investment-box { margin-top: 15px; }
}

@media ( min-width:991px) and ( max-width:1200px) {
    .menu.navbar .navbar-collapse a { font-size: 13px; margin: 0 0px; }
    
}

@media ( max-width : 575px) { 
    .header  .col-lg-3.col-sm-6 img { margin: 0 auto; display: table; }
    .unlock-wallet button { position: absolute; right: 11px; z-index: 1; margin-top: 28px; font-size: 14px !important; }
    .center-button .btn { min-width:  auto;}
    
}