:root {
    --primary-color: #0a58ca;
    --secondary-color: #007aff;
    --success-color: #007aff;
    --danger-color: #dc3545;
    --warning-color: #ffc107;
    --info-color: #effafe;
    --light-color: #f8f9fa;
    --dark-color: #343a40;
    --text-color: #0059c8;
    --bg-secondary: #effafe;
    --text-primary: #0a58ca;
    --text-secondary: #0085FF;
}

body{
    background: #fdfcfb;
    font-family: 'Trebuchet MS', sans-serif;
    font-family: 'Trebuchet MS', Roboto, Ubuntu, sans-serif;
}
:root {
    --toastify-toast-width: 320px!important;
    --toastify-toast-min-height: 40px!important;
    --toastify-toast-max-height: 60px!important;
}

/*TopMenu*/
.profilemenuOpen{
    width: 300px;
    height: 500px;
    background: white;
    position: fixed;
    right: 20px;
    top:68px;
    border-radius: 10px;
    padding: 20px;
    z-index: 5;
    border: 1px solid #eaeaea;
}
.profileLayoutOpen{
    position: fixed;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: transparent;
    z-index: 2;
}
.profileLayoutClose{
    display: none;
}
.profilemenuOpen .headp{
    height: 80px;
    width: 100%;
    border-bottom: 1px solid #e7e4e4;
}
.profilemenuOpen .headp h3{
    font-size: 20px;
    color: #2f2d2d;
}
.profilemenuOpen .headp p{
    background: #f6f5f5;
    padding: 5px;
    border-radius: 5px;
    font-size: 12px;
    width: 40%;
}
.profilemenuOpen ul{
    padding: 0;
    padding-top: 20px;
}
.profilemenuOpen ul li{
    list-style: none;
    width: 100%;
    height: 40px;
    cursor: pointer;
}
.profilemenuOpen ul li a{
    width: 100%;
    height: 100%;
    //border-bottom: 1px solid black;
    display: inline-block;
    text-decoration: none;
    color: #151515;
    font-size: 16px!important;
    padding: 10px 0px;
}
.profilemenuClose{
    display: none;
}
.TopMenu{
    width: 100%;
    height: 65px;
    background: white;
    position: fixed;
    border-bottom: 1px solid #fafafa;
    z-index: 8;
}
.menuExtra{
    width: 100%;
    height: 65px;
}
.TopMenu .logo{
    width: 14%;
    /*background: #0a53be;*/
    height: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    float: left;
}
.TopMenu .logo img{
    height: 100%;
    width: auto;
    margin-left: 50px;
}
.TopMenu .rightMenu{
    float: right;
    height: 100%;
    width: 86%;
}
.TopMenu .rightMenu .middlemenu{
    list-style: none;
    width: 55%;
    height: 100%;
    padding: 0px;
    float: left;
    overflow: hidden;
}
.TopMenu .rightMenu .middlemenu li{
    float: left;
    height: 100%;
    width: auto;
    padding-left: 15px;
    padding-right: 10px;
    cursor: pointer;
    padding-top: 20px;
    color: black;
}
.TopMenu .rightMenu .middlemenu li:hover{
    color: #124378;
}
.TopMenu .rightMenu .middlemenu li a{
    text-decoration: none;
    color: black;
}

.TopMenu .rightMenu .middlemenu li a:hover{
    color: #124378!important;
}

.TopMenu .rightMenu .lastmenu{
    list-style: none;
    width: 45%;
    height: 100%;
    padding: 0px;
    float: right;
    //background: #f18989;
    padding-right: 50px;
    overflow: hidden;
}
.TopMenu .rightMenu .lastmenu li{
    float: right;
    height: 100%;
    width: auto;
    padding-left: 15px;
    //margin-left: 10px;
    cursor: pointer;
    padding-top: 18px;
    color: #505F98;
    list-style: none;
}
.TopMenu .rightMenu .lastmenu li a{
    text-decoration: none;
    color: black;
    padding-right: 10px;
}
.TopMenu .topsearch{
    border: 1px solid #1d1c1c;
}
.TopMenu .topsearch:hover{
    border:1px solid #242626;
}

.TopMenu .rightMenu .lastmenu li .fas{
    font-size: 25px;
    //color: #007AFF;
    color: #3b3838;
}
.TopMenu .rightMenu .lastmenu li .far{
    font-size: 22px;
    //color: #007AFF;
    color: #3b3838;
}
.TopMenu .rightMenu .lastmenu li .btnsignin{
    background: #03162D;
    color: white;
    padding: 5px 20px;
    padding-bottom: 10px;
    text-decoration: none;
    border-radius: 25px;
    height: 45px!important;
    width: auto;
    font-size: 14px;
}

.sideBarOpen{
    width: 450px;
    height: 100%;
    background: white;
    position: fixed;
    float: right;
    z-index: 10;
    top: 0;
    right: 0;
    padding: 50px;
    overflow-y: scroll;
}
.sideBarClose{
    display: none;
    width: 0;
    height: 0;
}
.sideLayoutClose{
    display: none;
    height: 0;
    width: 0;
}
.sideLayoutOpen{
    position: fixed;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 2;
    cursor: pointer;
}

.sideBarOpen .fa-times{
    background: #0F498F;
    font-size: 20px;
    color: white;
    padding: 10px 13px;
    border-radius: 50%;
    cursor: pointer;
    float: right;
    margin-bottom: 50px;
}
.sideBarOpen .signupbtn{
    background: #0F498F;
    color: white;
    height: 45px;
    width: 100%;
    border: none;
    outline: none;
    text-decoration: none;
    text-align: center;
    padding-top: 10px;
}
.sideBarOpen .loginbtn{
    background: transparent;
    color: #0F498F;
    border: 1px solid #0F498F;
    height: 45px;
    width: 100%;
    outline: none;
    text-decoration: none;
    text-align: center;
    padding-top: 10px;
}
.sideBarOpen ul{
    width: 100%;
    height: 320px;
    overflow-y: auto;
    list-style: none;
    padding-top: 30px;
    padding-left: 5px;
    //background: blue;
    display: none;
}
.sideBarOpen ul li{
    color: black;
    font-size: 20px;
    font-weight: bold;
    height: 40px;
    width: 100%;
    //padding: 5px;
    border-bottom: 1px solid white;
    cursor: pointer;
}
.sideBarOpen ul li a{
    text-decoration: none;
    color: black;
    font-weight: bold;
    height: 40px;
    width: 100%;
}
.sideBarOpen p{
    width: 75%;
    padding-left: 0px;
    color: #0F498F;
    font-weight: bold;
    padding-bottom: 15px;
}
.sideBarOpen p a{
    color: #0F498F;
}


/*TopMenu End*/

/*Register*/
.register{
    width: 100%;
    height: 100%;
    background: white;
    padding-top: 50px;
    padding-bottom: 80px;
}

.register  h3{
    color: #232020;
    margin-bottom: 20px;
    font-size: 25px;
    font-weight: bold;
    font-family: 'Trebuchet MS', Roboto, Ubuntu, sans-serif;
}
.register  input{
    width: 100%;
    height: 48px;
    outline: none;
    margin-top: 10px;
    margin-bottom: 30px;
    color: black!important;
    border: 1px solid black;
    padding-left: 20px;
    border-radius: 10px;
}
.register  p{
    width: 100%;
    height: auto;
    text-align: left;
}
.register  p .checkbox{
    width: 15px;
    float: left;
    margin: 0;
    padding: 0;
}
.register  p a{
    float: left;
    padding-left: 10px;
    text-decoration: none;
    padding-top: 10px;
    color: black;
}
.register  input::placeholder {
    color: black;
    opacity: 1; /* Firefox */
}
.register  button{
    background: black;
    color: white;
    border: none;
    float: right;
    height: 45px;
    width: 100%;
    padding: 10px 25px;
    margin-top: 20px;
    border-radius: 10px;
    margin-bottom: 10px;
}
.alreadyhave{
    padding-top: 150px;
    padding-left: 30px!important;
    width: 100%;
}

/*Register end*/

/*Blog*/
.blog{
    width: 100%;
    height: 100%;
    background: white;
    padding: 60px 80px;
    padding-bottom: 100px;
}
.blog h3{
    margin-bottom: 50px;
}
.blog a{
    text-decoration: none;
    color: black;
}
.card-img-top{
    height: 250px;
}
.blogsingle{
    width: 100%;
    height: 100%;
    background: white;
    padding: 50px 200px;
    padding-bottom: 100px;
}
.blogsingle p{
    margin-bottom: 40px;
}
.blogsingle img{
    margin-bottom: 20px;
    width: 100%;
    height: auto;
    min-height: 300px;
    max-height: 500px;
}
.reactquilldes p{
    margin-bottom: 3px;
}

/*Blog end*/

/*Referral*/
.referral{
    width: 100%;
    height: 100%;
}
.referral .topBanar{
    width: 100%;
    min-height: 500px;
    max-height: auto;
    background: #114278;
}
.referral .topBanar img{
    height: 430px;
    width: 100%;
    margin-top: 50px;
}
.referral .topBanar h1{
    margin-top: 160px;
}
.referral .topBanar p{
    color: white;
    margin-top: 30px;
}
.referralBottom{
    width: 100%;
    height: 100%;
    padding: 60px;
    background: white;
    padding-top: 30px;
    padding-bottom: 50px;
}
.referralBottom h3{
    color: black;
    margin-bottom: 20px;
    font-size: 22px;
}
.reflinkarea{
    width: 100%;
    min-height: 330px;
    max-height: auto;
    background:#114278 ;
    padding: 10px 50px;
    overflow: hidden;
}
.reflinkarea .refcode{
    width: 100%;
    height: 60px;
    background: transparent;
    color: white;
    border: 1px solid white;
    border-radius: 50px;
    margin-top: 30px;
    padding: 15px 30px;
    font-size: 20px;
}
.reflinkarea button{
    height: 60px;
    width: 100%;
    background: white;
    color: black;
    border: none;
    outline: none;
    border-radius: 50px;
    margin-top: 30px;
    font-size: 20px;
    font-weight: bold;
}
.referralhistory{
    padding: 10px 60px;
    background: white;
}
.referralhistory h3{
    color: #05A5FF;
    padding-top: 10px!important;
    font-size: 22px;
    margin-bottom: 20px;
}
.referralhistory .history{
    width: 100%;
    height: 500px;
    background: #DEF3FF;
    padding: 50px ;
    overflow-y: auto;
}

.referralhistory .history h5{
    padding-left: 20px;
    color: #707070;
    padding-bottom: 10px;
}
.referralhistory .history th{
    color: #707070;
    font-weight: normal;
}
/*Referral end*/

/*Mining*/
.miningpage{
    width: 100%;
    min-height: 800px;
    background-color: #ecf1fc;
    padding-bottom: 50px;
}
.miningpage .bgimg{
    width: 100%;
    height: 390px;
    background: white;
    padding: 50px;
    padding-top: 20px;
    //background-image: linear-gradient(#EDFAFF, #114278);
    margin-top: -2px;
    z-index: 10;
}
.mbtnar{
    padding: 0px 28px!important;
}
.bgimg .bal{
    width: 100%;
    height: 80px;
    background: #114278;
    border-radius: 10px;
    color: #ffffff;
    text-align: center;
    padding: 10px;
    margin: auto;
    margin-top: 20px;
}
.bgimg .bal h1{
    font-size: 18px;
}
.bgimg .bal p{
    font-weight: bold;
}
.bgimg .bal img{
    height: 20px;
    width: 20px;
    margin-right: 5px;
    border-radius: 50%;
}
.miningpage   h4{
    color: #eceaea;
}
.miningpage   h3{
    color: white;
}
.miningpage  img{
    height: 30px;
    width: 30px;
    margin-right: 10px;
}
.miningpage .miningcircle{
    width: 200px;
    height: 200px;
    border: 15px solid #4776b4;
    border-radius: 50%;
    margin: auto;
    padding: 10px;
    border-right: 15px solid #114278;
    border-bottom: 15px solid #114278;
    margin-top: 0px;
}
.miningpage .miningcircle .middiv{
    width: 100%;
    height: 100%;
    background: white;
    border-radius: 50%;
    padding: 20px;
    text-align: center;
    color: #114278;
    font-weight: bold;
    padding-left: 5px;
    padding-right: 5px;
}
.miningpage .miningcircle .middiv p{
    width: 35px;
    height: 28px;
    float: right;
    background: #114278;
    color: white;
    margin-right: 10px;
    padding: 1px;
    padding-top: 3px;
    font-size: 13px;
    border-radius: 5px;
}
.claimarea{
    width: 100%;
    height: 60px;
    background-color: #ecf1fc;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    border-top: 1px solid #ecf1fc;
}
.miningpage .claimbtn{
    background: #114278;
    border: 1px solid #114278;
    color: #ffffff;
    font-weight: normal;
    height: 120px;
    width: 120px;
    border-radius: 50%;
    padding: 50px 0px;
    text-align: center;
    margin: auto;
    cursor: pointer;
    margin-top: -80px;
    margin-bottom: 20px;
    font-weight: bold;
}
.miningpage button{
    color: white;
    background: #114278;
    height: 40px;
    width: 100%;
    margin-bottom: 10px;
    font-weight: bold;
    font-size: 18px;
    border: 1px solid #114278;
    padding: 5px 30px;
    border-radius: 10px;
}
.miningpage .infotext{
    height: auto;
    width: 100%;
    background: #114278;
    color: white;
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 10px;
}
.transfermodal .modal-content {
    border-radius: 10px!important;
    border: 0.1px solid #114278;
}
.transfermodal .modal-header{
    height: 100px;
    border-bottom: 1px solid #f6f5f5;
}
.transfermodal h5{
    color: #114278;
    font-size: 25px;
}
.transfermodal .fa-times{
    border: 3px solid #114278;
    color: #114278;
    padding: 5px 8px;
    border-radius: 50%;
    font-size: 18px;
}
.transfermodal .fromto{
    width: 100%;
    height: 110px;
    background: #114278;
    border-radius: 10px;
    padding: 15px 20px;
    margin-top: 5px;
    margin-bottom: 25px;
}
.transfermodal .fromto p{
    margin-top: 0;
    margin-bottom: 5px;
    color: white;
    width: 100%;
}
.transfermodal .fromto .fab{
    margin-right: 10px;
    width: 5%;
}
.transfermodal .fromto .fas{
    margin-right: 10px;
    width: 5%;
}
.transfermodal .crypto{
    width: 100%;
    height: 55px;
    background: #114278;
    border-radius: 10px;
    color: white;
    padding: 15px;
}
.transfermodal .crypto img{
    height: 20px;
    width: 20px;
    margin-right: 10px;
    border-radius: 50%;
}
.transfermodal .crypto .form-control{
    border: none;
    height: 100%;
    width: 90%;
    color: white;
    background: transparent;
    float: left;
}
.transfermodal button{
    height: 55px;
    width: 100%;
    background: #114278;
    color: white;
    border: none;
    outline: none;
    margin-top: 30px;
    font-weight: bold;
    border-radius: 10px;
    font-size: 20px;
}

/*Mining end*/

/*Terms*/
.terms{
    padding: 80px;
    width: 100%;
    height: 100%;
    background: white;
}


/*Terms end*/

/*Footer*/
.footer{
    width: 100%;
    height: auto;
    background: white;
    padding: 30px 80px;
    border-top: 1px solid #fafafa;
}
.footer h4{
    margin-bottom: 30px;
    margin-top: 20px;
    color: black;
    font-size: 18px;
}
.footer ul{
    padding: 0;
}
.footer ul li{
    color: black;
    font-size: 14px;
    list-style: none;
}
.footer ul li a{
    color: black;
    text-decoration: none;
}


/*Footer end*/


/*Home Page*/

.text-secondary {
    color: var(--text-secondary) !important;
}

#hero-section {
    //background-image: url('/HeroCover.png');
    background-size: cover;
    background-color: #243D96;
}

#hero-section h1{
    font-size: 45px!important;
    margin-bottom: 30px;
    margin-top: -0px;
}

.koco-primary {
    background-color: var(--primary-color);
    color: #fff;
    border-radius: 3px;
    padding: 15px 35px;
    font-weight: bold;
    border: 2px solid var(--primary-color);
}
.popular td {
    padding: 0 !important;
}

.koco-outline {
    background-color: transparent;
    color: #fff;
    border-radius: 3px;
    padding: 15px 35px;
    font-weight: bold;
    border: 2px solid white;
    box-sizing: border-box;
}
.bg-secondary {
    background-color: var(--bg-secondary) !important;
}
.text-primary {
    color: var(--text-primary) !important;
}
.coin-logo {
    max-width: 80px;
    height: auto;
    overflow: hidden;
}
.coin-logo img {
    width: 100%;
    height: auto;
}
.chart {
    max-width: 50px;
    overflow: hidden;
}
.chart img {
    max-width: 100%;
}
.border-primary {
    border-color: #0F498F !important;
    border-width: 4px !important;
}
.border-primary td, .border-primary th {
    border-width: 3px !important;
}

.popular thead {
    border-left: 0 !important;
    border-left-color: transparent !important;
    border-right: 0 !important;
    border-right-color: transparent !important;
    border-top: 0 !important;
    border-top-color: transparent !important;
}

.popular .table-head th {
    border: 3px solid #0F498F !important;
    border-top: 0px !important;
    color: black;
}

.popular .table-head th:first-child{
    border-left: 0px !important;
}
.popular .table-head th:last-child{
    border-right: 0px !important;
}
.popular tbody td:first-child{
    border-left: 0px !important;
}
.popular tbody td:last-child{
    border-right: 0px !important;
}
.coin-image {
    min-width: 60px;
}
.coin-image img {
    width: 100%;
    height: auto;
}
#koco-coins-ervices .custom-shadow{
    overflow-y: hidden;
    height: 200px;
    margin-bottom: 10px;
}

.feature_img {
    height: 170px;
    width: 170px;
}
.feature_img img {
    width: 150px;
    height: 150px;
    max-height: 150px;
}

#scecureasset img{
    max-width: 100px;
}

#kococoinimg img{
    max-width: 100%;
}

.logoimgmining img{
    max-width: 30px;
}

#qecodeimg img{
    max-width: 100px;
}

#criptojurnynow img{
    max-width: 200px;
}
#foqimg img{
    max-width: 100%;

}
.text-light {
    color: #3650AE !important;
}
.rounded-10 {
    border-radius: 15px !important;
}
.why-choose-koco{
    background: white;
    margin-bottom: 0;
}
.why-choose-koco .features img {
    max-height: 120px;
}
.feature-round {
    border-top-left-radius: 100px;
    border-top-right-radius: 100px;
}
.middle-item {
    margin-top: 160px;
}
.logos img {
    width: 30px;
}
.download-apps img{
    max-width: 150px;
}
.journey-img {
    max-width: 350px;
}
.journey-img img {
    width: 100%;
}
.our-community .action {
    max-width: 380px;
    margin: auto;
    display: flex;
}
.our-community button {
    width: 30%;
    text-align: center!important;
    padding-left: 5px!important;
    font-size: 13px;
}
.our-community {
    background-image:url('/map.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-color: rgba(255, 255, 255, .5);

}
ul#myTab .nav-item {
    background: white  !important;
    border-radius: 25px;
    margin-right: 18px;
}

ul#myTab .nav-item .nav-link {
    color: var(--primary-color);
    font-weight: bold;
    border-radius: 25px;
}

#myTab .nav-link.active {
    background: var(--primary-color) !important;
    border-radius: 25px;
    color: #fff !important;
}
ul#myTab {
    max-width: fit-content;
    text-align: center;
    margin: auto;
}
td.popular-chart {
    max-width: 120px;
    overflow: hidden;
}

td.popular-chart .graph {
    width: 100%;
    height: 60px;
}

table.table {
    min-width: 660px;
}

.accordion-button {
    color: var(--primary-color);
}

.last-price {
    padding-left: 15px;
}

td.popular-chart .graph img {
    width: 100%;
    height: 100%;
}
.custom-shadow {
    box-shadow: 0 2px 2px #45c8f1bf;
}
ul.slick-dots {
    display: block !important;
}
.slick-dots li button:before {
    font-size: 10px;
}
.slick-dots li.slick-active button:before {
    color: var(--primary-color);
    font-size: 10px;
}
@media screen and (max-width: 640px) {
    .middle-item {
        margin-top: 30px;
        margin-bottom: 30px;
    }
    .reverse {
        flex-direction: row-reverse !important;
    }
}

/*Home end*/

/*Wallet */
.wallet{
    width: 100%;
    height: 100%;
}
.wallet .leftmenu{
    width: 18%;
    height: 100%;
    background: white;
    float: left;
    position: fixed;
    border-right: 1px solid #eaeaea;
}
.wallet .leftmenu ul{
    padding: 0;
    margin-top: 25px;
}
.wallet .leftmenu ul li{
    list-style: none;
    width: 100%;
    height: 70px;
    padding: 0;
}
.wallet .leftmenu ul a{
    text-decoration: none;
    width: 100%;
    height: 70px;
    //background: #e7e2e2;
    padding: 20px 55px;
    padding-right: 0;
    border-bottom: 1px solid white;
    margin: 0;
    display: inline-block;
    font-size: 16px;
    color: #363535;
}
.wallet .leftmenu ul a.active{
    background: #114278;
    color: white;
}
.wallet .leftmenu ul a .far{
    padding-right: 10px;
    font-size: 20px;
}
.wallet .rightmenu{
    height: 100%;
    width: 82%;
    float: right;
}
.wallet .rightmenu ul{
    height: 70px;
    width: 100%;
    background: white;
    display: none;
}
.wallet .rightmenu .showdata{
    padding: 15px;
    width: 100%;
    height: auto;
}
.spot .head{
    width: 100%;
    height: 220px;
    background: white;
    border-radius: 5px;
    margin-top: 10px;
    padding: 20px;
    padding-top: 40px;
    color: #323131;
}
.spot .head h3{
    color: #323131;
    font-size: 20px;
}
.spot .head a{
    text-decoration: none;
    height: 40px;
    width: 100px;
    background: white;
    border-radius: 25px;
    margin-left: 10px;
    color: #1d1c1c;
    text-align: center;
    padding: 7px;
    border: 1px solid #114278;
}
.spot .head a:last-child{
    background: #114278;
    color: white;
}
.spot .head .historybtn{
    width: 20px;
    height: 20px;
    background: transparent!important;
    color: black!important;
    border:none;
    display: none;
}
.spot .head p{
    color: #504e4e;
}
.spot .head .fas{
    padding-left: 10px;
    cursor: pointer;
}
.spot .walletlist{
    width: 100%;
    height: auto;
    min-height: 300px;
    max-height: 600px;
    background: white;
    border-radius: 5px;
    margin-top: 30px;
    padding: 15px;
}
.spot .walletlist th{
    font-weight: normal;
    color: black;
    border: none;
    height: 50px;
    border-bottom: 1px solid #dcdada !important;
}
.spot .walletlist td{
    height: 70px;
    padding-top: 18px;
}
.spot .walletlist td img{
    height: 25px;
    width: 25px;
    border-radius: 50%;
    margin-right: 10px;
}
.spot .walletlist td a{
    text-decoration: none;
    color: black;
    padding-left: 20px;
}
.spot .walletlist .search{
    width: 100%;
    height: 40px;
    border: 1px solid #F6F7F8;
    border-radius: 5px;
    cursor: pointer;
    padding: 5px;
    color: #6c6767;
    background: #F6F7F8;
    margin-left: 7px;
}
.spot .walletlist .search:hover{
    color: black;
    background: white;
    border: 1px solid #0085FF;
}
.spot .walletlist .fas{
    padding-right: 10px;
    padding-left: 10px;
    font-weight: normal;
}
.spot .walletlist input{
    border: none;
    outline: none;
    background: transparent;
    color: black;
    height: 100%;
    width: 80%;
}
.spot .walletlist .checkbox{
    height: 15px;
    width: 15px;
}
.spot .walletlist input::placeholder{
    color: #afabab;
}
.spot .walletlist .walletmobile{
    display: none;
}
.walletfooter{
    display: none;
}
.convertb{
    padding-top: 10px;
}
.spot .porfolio{
    width: 100%;
    height: 400px;
    overflow-y: auto;
    background: white;
    margin-top: 20px;
    border-radius: 10px;
    padding: 20px;
}
.spot .porfolio h3{
    font-size: 22px;
    color: #2a2727;
}
.spot .porfolio ul{
    width: 100%;
    height: auto;
    color: black;
    display: block;
    padding-left: 0;
}
.spot .porfolio ul li{
    list-style: none;
    height: 70px;
    width: 100%;
}
.spot .porfolio ul li a{
    text-decoration: none;
    height: 100%;
    width: 100%;
    color: black;
    display: inline-block;
    padding-top: 18px;
    font-size: 18px;
    border-bottom: 1px solid #efeded;
}


/*Wallet end*/

/*deposit*/

.deposit{
    height: 100%;
    width: 100%;
    background: white;
    padding: 65px;
}
.deposit .address{
    width: 100%;
    height: auto;
    background: #F8F9FA;
    margin-top: 30px;
    margin-bottom: 50px;
    padding: 20px;
}
.deposit .modal-header{
    height: 80px;
}
.deposit .modal-header h5{
    width: 80%;
}
.deposit .modal-header button{
    color: black;
    width: 50px;
    height: 50px;
    background: transparent;
    padding-top: 25px;
}
.deposit input{
    width: 100%;
    height: 50px;
    background: white;
    border: none;
    outline: none;
    padding-left: 10px;
}
.deposit input::placeholder{
    color: #393737;
}
.deposit button{
    height: 50px;
    width: 100%;
    background: #000000;
    color: white;
    border: none;
    margin-top: 20px;
    margin-bottom: 50px;
}
.selectcoin{
    width: 100%;
    height: 50px;
    background: white;
    cursor: pointer;
    padding: 10px;
}
.selectcoin img{
    height: 30px;
    width: 30px;
    margin-right: 8px;
}
.address .search{
    width: 100%;
    height: 40px;
    border: 1px solid #b3b1b1;
    cursor: pointer;
    border-radius: 5px;
    padding-left: 10px;
}
.address .search:hover{
    border:1px solid #0a53be;
}
.address .search input{
    width: 80%;
    height: 100%;
    border: none;
    outline: none;
    border-radius: 5px;
}
.address .search input::placeholder{
    color: #424040;
}
.address .walletmobile{
    border-bottom: 1px solid #dedede;
    padding-top: 10px;
    cursor: pointer;
}
.bgimgdeposit img{
    height: 500px;
    width: 100%;
    padding: 40px 100px;
}
.bgimgdeposit .withdrewinfo{
    padding-left: 140px;
}
.bgimgdeposit .withdrewinfo p{
    font-size: 14px;
}

/*Deposit end*/

/*Hisory */
.history{
    height: 100%;
    width: 100%;
    padding: 30px 20px;
}
.history .historycard{
    width: 100%;
    height:auto ;
    min-height: 500px;
    background: white;
    margin-top: 30px;
    border-radius: 10px;
}
.history  ul{
    display: block!important;
    width: 100%!important;
    height: 70px;
    border-bottom: 1px solid #eeebeb;
    padding: 0;
    border-top-right-radius: 10px!important;
    border-top-left-radius: 10px!important;
}
.history  li{
    list-style: none;
    color: #504c4c;
    float: left;
    width: 150px;
    height: 70%;
    font-size: 20px;
    padding: 10px 17px;
    cursor: pointer;
    text-align: center;
    font-weight: normal;
}
.history  li.active{
    color: black;
    border-bottom: 2px solid #233C95;
    background-color: #233C95;
    color: white;
    border-radius: 25px;
}
.hdata{
    padding: 15px 10px;
}
.hdata th{
    font-weight: normal;
    border-bottom: 1px solid #f5f3f3 !important;
    height: 50px;
    padding: 15px 0px;
    color: #6d6969;
}
.hdata td{
    border-bottom: 1px solid #fafafa !important;
    height: 60px;
    padding: 18px 0px;
    color: black;
    font-size: 16px;
}
.hdata td img{
    height: 30px;
    margin-right: 5px;
}
.mobilehistory{
    display: none;
}
.payments{
    padding: 20px 50px;
}

/*History end*/

/*Change Password*/

.changepass{
    width: 100%;
    height: 100%;
    background: #fcfcfc;
}
.changepass .formda{
    height: auto;
    min-height: 400px;
    max-height: 600px;
    width: 100%;
    border: 1px solid #e1e3e8;
    border-radius: 5px;
    margin-top: 70px;
    margin-bottom: 70px;
    background: white;
}
.changepass .formda h3{
    height: 80px;
    width: 100%;
    border-bottom: 1px solid #e1e3e8;
    padding: 20px;
}
.changepass .formda label{
    width: 100%;
    margin-bottom: 10px;
    font-size: 18px;
    color: #383535;
}
.changepass .formda input{
    width: 100%;
    border: 1px solid #bdc2d5;
    outline: none;
    height: 45px;
    border-radius: 10px;
    margin-bottom: 20px;
    padding-left: 15px;
}
.changepass .formda button{
    width: 100%;
    height: 55px;
    border: none;
    background: #233C95;
    border-radius: 10px;
    margin-bottom: 70px;
    margin-top: 40px;
    color: white;
    font-weight: bold;
    font-size: 22px;
}
.changepass .formda .inputfiled{
    padding: 20px;
}

/*Change Password end*/

/*Web3*/
.web3{
    padding: 60px;
    text-align: center;
    background-color: white;
    padding-bottom: 150px;
}
.web3 h3{
    color: #0F498F;
    font-size: 35px;
    margin-bottom: 20px;
    font-weight: bold;
    margin-top: 10px;
}
.web3 h1{
    font-size: 90px;
    margin-bottom: 75px;
    font-weight: bold;
}

.web3 img{
    left: -180px;
    position: absolute;
    top: 380px;
}
.web3 a{
    text-decoration: none;
    background-color: #0a53be;
    color: white;
    margin: 0px 10px;
    border-radius: 10px;
    padding: 15px 40px;
    font-size: 30px;
}

.blockcard{
    border-bottom:1px solid rgb(224, 222, 222);
    padding-bottom: 10px;
    padding-top: 10px;
}
.blockcard h5{
    background-color: rgb(241, 242, 244);
    height: 50px;
    width: 50px;
    text-align: center;
    padding: 14px;
    border-radius: 7px;
    font-size: 16px;
    display: block;
}
.blockcard h6{
    background-color: rgb(241, 242, 244);
    height: 50px;
    width: 50px;
    text-align: center;
    padding: 14px;
    border-radius: 50%;
    font-size: 16px;
    display: block;
}
.blockcard a{
    text-decoration: none;
}
.blockcard p{
    padding-top: 5px;
    margin-bottom: 5px;
    color: rgb(78, 76, 76);
}
.blockcard span{
    color: rgb(131, 126, 126);
}
.ethval{
    float: right;
    background: rgb(241, 242, 244);
    color: rgb(119, 145, 185);
    padding: 7px;
    padding-top: 8px!important;
    border-radius: 3px;
}

/*web3 end*/

/*presale*/
.presale{
    padding: 60px 100px;
    background: #84D2FE;
    width: 100%;
    height: 100%;
}
.presale .presalemain{
    padding: 20px;
    background: white;
    border: 1px solid #ecebeb;
    border-radius: 5px;
    padding-bottom: 50px;
    margin-bottom: 50px;
    margin-top: 0px;
    overflow-x: hidden;
}
.presalemain .inputd{
    height: 55px;
    width: 100%;
    background: transparent;
    border-radius: 5px;
    margin-bottom: 15px;
    border: 1px solid #c1bcbc;
}
.presalemain p{
    margin-bottom: 5px;
}
.presalemain .inputd .left{
    width: 70%;
    height: 100%;
    float: left;
    display: inline-block;
    border-right: 1px solid #c1bcbc;
}
.presalemain .inputd .left input{
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
    padding: 15px;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
}
.presalemain .inputd .right{
    width: 30%;
    height: 100%;
    float: right;
    display: inline-block;
    padding: 10px;
    text-align: center;
    font-size: 18px;
}
.presalemain .inputd .right img{
    height: 30px;
    width: 30px;
    margin-right: 5px;
    border-radius: 50%;
}
.presalemain input{
    color: black;
    font-weight: bold;
}
.presalemain button{
    width: 100%;
    height: 60px;
    background: #0E488E;
    border: none;
    outline: none;
    border-radius: 5px;
    color: white;
    font-weight: bold;
    margin-top: 10px;
}

.presalemain th{
    font-weight: normal;
    border-bottom: 1px solid #eae6e6 !important;
    height: 50px;
    padding: 15px 0px;
    color: #110f0f;
}
.presalemain td{
    border-bottom: 1px solid #fafafa !important;
    height: 60px;
    padding: 18px 0px;
    color: black;
    font-size: 16px;
}
.presalemain td img{
    height: 30px;
    margin-right: 5px;
}

/*presale end*/
/*Conver */
.convert{
    width: 100%;
    height: 100%;
    background: white;
    padding: 60px;
}

/*Convert End*/
