@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;400;700;900&family=Ubuntu:wght@300;400;700&family=Work+Sans:wght@100;300;400;700&display=swap');
.scroobars {
    --sb-track-color: #354851;
    --sb-thumb-color: #ffb500;
    --sb-size: 5px;

  }
  
  .scroobars::-webkit-scrollbar {
    width: var(--sb-size);
    height: var(--sb-size)
  }
  
  .scroobars::-webkit-scrollbar-track {
    background: var(--sb-track-color);
    border-radius: 3px;
  }
  
  .scroobars::-webkit-scrollbar-thumb {
    background: var(--sb-thumb-color);
    border-radius: 3px;
    
  }
  
  @supports not selector(::-webkit-scrollbar) {
      .scroobars {
      scrollbar-color: var(--sb-thumb-color)
                       var(--sb-track-color);
    }
  }


body,html{ margin:0px;padding: 0;font-family: 'Quicksand', sans-serif; letter-spacing: 0.03rem;    background-color: #263b50!important;

}
body { overflow-x: hidden; height: 100%;}

.text { font-family: 'Quicksand', sans-serif;font-family: 'Poppins', sans-serif; font-size: 16px;
}

a:hover { text-decoration: none !important; color: #efefef;}
a { color: #212529;}

input { border: none; outline: none;}
input:focus { border: none; outline: none;}


.miner-box { width:100px; height:100px; border-radius: 15px; position: relative; background-color: rgba(0, 115, 216, 0.5); margin-right: 20px; display: inline-block;
    border: solid 1px transparent;}
.miner-box.active { border: solid 1px #16ffb7;}



.th-10 { font-size: 85px; line-height: 0.9; letter-spacing: -2px;}
.th-01 { font-size: 10px}
.th-00 { font-size: 12px}
.th-8 { font-size: 50px; line-height: 0.9;}
.th-5 { font-size: 40px; line-height: 0.9;}
.th-6 { font-size: 45px; line-height: 0.95;}
.th-4 { font-size: 30px; line-height:1;}
.th-2 { font-size: 25px; line-height:1.1;}
.th-1 { font-size: 20px; line-height: 1.1;}
.th-0 { font-size: 14px; line-height: 1.1;}
.text-bold { font-weight: bold!important;}

.text-green{ color: rgb(0, 229, 160); }
.text-green-bg{ background: rgb(0,206,214);
background: linear-gradient(128deg, rgba(0,206,214,1) 0%, rgba(0,208,83,1) 74%);
background-clip: text;

-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}.text-blue-bg{ 

    background: linear-gradient(128deg, rgba(120,120,120,1) 0%, rgba(100,100,100,1) 100%);background-clip: text;

-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}


.left-menu i { font-size: 20px; color: rgba(255,255,255,0.5); cursor: pointer;}
.left-menu i:hover { opacity: 0.5;}
.text-blue { color: #04befe;}
    
h4 { font-size:15px; color:#fff; font-weight: 400; margin: 0; font-family: 'Poppins', sans-serif;}
h2 { font-weight: bold; font-size: 28px;  color:#fff; line-height: 30px; margin: 0; padding-top: 5px; font-family: 'Poppins', sans-serif;}    
h3 { font-weight: bold; font-size: 26px;  color:#fff; line-height: 30px; margin: 0; padding-top: 5px; font-family: 'Poppins', sans-serif;}
h4 { font-weight: bold; font-size: 20px;  color:#fff; line-height: 30px; margin: 0; padding-top: 0; font-family: 'Poppins', sans-serif;}
.hourbar { background-color: rgba(175, 226, 255,0.1); margin: 0 1px; border-top-left-radius: 1px; border-top-right-radius: 1px; height: 0.5vh; width: 100%;}
.hourbar.active { background-image: linear-gradient(0deg, rgba(255, 255, 255,0.3) 10%, rgba(255, 255, 255,0.3) 100%);}

.text-light { color: #ccc!important;}
.text-gray { color:#555;}
.text-yellow { color:rgb(255, 205, 79);}
.text-darkgreen {color:#32635b;}
.container { max-width: 1360px;}

.bg-blue { background: linear-gradient(180deg, rgba(0,169,255,1)    0%, rgba(0,108,255,1) 100%);}
.bg-blueplain { background: rgba(0,169,255,1)}
.bg-darkblueg { background: linear-gradient(180deg, rgba(0,169,255,1) 0%, rgba(15,28,91,1) 100%);}
.bg-dark {  background-color: #263b50!important;}

.bg-darkblueg { background: linear-gradient(180deg, rgba(0,169,255,1) 0%, rgba(15,28,91,1) 100%);}
.bg-dark {      background-color: #263b50!important;  }
.bg-darkgrad {background-image: linear-gradient(0deg, #263b50 10%, #0d185d 100%);}
.bg-darkgradi {background-image: linear-gradient(0deg, #0d185d 10%, #263b50 100%);}
.bg-green {background-color: #00cdac;}
.bg-fadewhite {background-color: rgba(255,255,255,0.1); }
.bg-fadeblack {background-color: rgba(0,0,0,0.1); }
.bg-darkblue { background: rgb(15, 28, 91); }

.hover-opacity{ opacity: 1; cursor: pointer; transition: 0.2s;}
.hover-opacity:hover{ opacity: 0.7;}

.p-4 { padding: 35px!important;}
.pt-4 { padding-top: 35x!important;}
.pl-4 { padding-left: 40px!important;}
.pr-4 { padding-right: 40px!important;}



.py-100 {padding-top: 100px; padding-bottom: 100px;}
.pt-100 {padding-top: 100px;}
.pb-100 { padding-bottom: 100px;}


.box-bg-1 {background-image: linear-gradient(-60deg, #ff5858 0%, #f09819 100%); }
.box-bg-2 {background-image: linear-gradient(-60deg, #00cdac 0%, #8ddad5 100%);}
.box-bg-3 {background-image: linear-gradient(-60deg, #4481eb 0%, #04befe 100%);}
.box-bg-4 {background-image: linear-gradient(120deg, #667eea 0%, #764ba2 100%);}

.btn {font-family: 'Poppins', sans-serif; }

.btn-green {background-color: #00cdac;}
.btn-light.active {background-color: #ffcd4f!important;}

.btn-primary {background-color: #04befe; border-color: #04befe;}
.btn-light { border-color: #16ffb7; background-color: #16ffb7; color: rgb(0, 75, 56);}


.border-dashed { border:dashed thin rgba(255,255,255,0.1)}
.payments.active {  border:dashed 1px #16ffb7;}

.paymentsdevice.active {  border:dashed 1px #16ffb7;}
.paymentsdeviceselect.active {  border:dashed 1px #16ffb7;}

input:focus { border:dashed thin #16ffb7;}



.swiper-button-next, .swiper-button-prev { font-size: 25px!important; width: 30px!important; height:25px!important; position: relative!important; display: inline-block!important; margin-top: 0!important;}
.swiper-button-next::after { font-size: 25px!important; }
.swiper-button-prev::after { font-size: 25px!important; }

.swiper-slide { width: 110px;}
.myproducts { margin-top: 0;}
.updates { height: 200px; background-color: rgba(0,0,0,0.1);}
.testnet { height: 200px;}
.discounted { opacity: 0.4; text-decoration:line-through!important;}

.rangeslider__handle { width: 30px!important; height:30px!important;}
.rangeslider--horizontal {height: 10px!important;}
.rangeslider__fill { background: #16ffb7!important;}

.mpl{ padding-left: 100px!important;}

.showm { display: none;}

@media (max-width: 600px) {
    
    .mprf { padding-right: 15px!important;}
    .mplf { padding-left: 15px!important;}
    .mw100{width: 100%!important;}
    .mtextcenter{text-align: center;}

    .flexcolum { flex-direction: column!important; }
    .mpositionabsolute { padding-top:30px; position: relative!important; left: auto!important; right: auto!important; bottom: auto!important;}
    .mmy4 { margin-top: 30px;margin-bottom: 30px;}
    .mb20 { margin-bottom: 20px;}
    .mb40 { margin-bottom: 40px;}

 }


 .box-template-wrap{ width: 400px; display: inline-block; }

@media (max-width: 992px) {
  .hidem{ display: none}

  .box-template-wrap{ width: 100%!important; display: block; }

  .pabs { position: static!important; margin:15px auto 0px auto; display: inline-block; }
  .mtextcenter{text-align: center!important;}
  .scroobars { white-space:wrap!important; overflow-x:hidden!important; overflow-y:visible!important;}

    .mhauto {height: auto!important;}
    .mh80 {height: 80px!important;}
    .mpy3{ padding-top: 30px; padding-bottom:30px;}
    .mw100{width: 100%!important;}
    .mmw100 { max-width: 100%!important;}
    .mo{ margin: 0!important;}
    .mprf { padding-right: 15px!important;}
    .mplf { padding-left: 15px!important;}
    .mprx { padding-right: 30px!important; padding-left: 30px!important;}

    .th-00 { font-size: 10px}

    .swiper-button-next::after { font-size: 20px!important; }
.swiper-button-prev::after { font-size: 20px!important; }
.ptm { padding-left: 0!important;padding-right: 0!important;}
.mpt { margin-top: -70px!important;}
.mpts { margin-top: -160px!important;}


 }


 


@media (max-width: 1350px) {

    .th-00 { font-size: 12px}


    .th-001 { font-size: 10px;}
    .p-4 { padding: 25px!important;}
    .mt20 { margin-top: 20px;}
    .mb20 { margin-bottom: 20px;}
    .showm { display: block;}
    .hidem{ display: none}
    .mpl{ padding-left: 0px!important;}

    .col-xl-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .col-md-9 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .d-xl-block { display: none!important;}
} 