@charset "UTF-8";
@import url(../../dist/fonts/font-roboto/font-roboto.css);

html,
body {
  /* background-image:url('../images/bg.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-attachment: fixed; */
  background-color: rgb(237,242,249);
  font-family: "Roboto",sans-serif;

}
.robo{
  font-family: 'Roboto',sans-serif !important;
}
h1,.h1,h3,.h3{
  font-family: 'Roboto-5',sans-serif;
}
.nav-item{
  font-family: 'Roboto',sans-serif;
}

.flex-basis-0{
  flex-basis: 0;
}
.card-horizontal {
  display: flex;
  flex: 1 1 auto;
}
.f-7{
  font-size: .7rem;
}
.f-8{
  font-size: .8rem;
}
.f-9{
  font-size: .9rem;
}
.f1{
  font-size: 1rem;
}

.tr-5{
  top: 5px;
  right: 5px;
}
.tr-10{
  top: 10px;
  right: 10px;
}
.branner-mobile{
  display: none;
}
.bars{
  justify-content: flex-end;
  align-items: center;
  flex: auto;
  display: none;
  outline: 0;
  box-shadow: initial;
}
.bars:hover,
.bars:focus,
.bars:active{
  outline: 0;
  box-shadow: initial;
}
.branner{
  width: 135px;
}
.img-15{
  width: 15px;
  height: 15px;
}
.img-20{
  width:20px;
  height: 20px;
}
.img-25{
  width:25px;
  height: 25px;
}
.img-30{
  width: 30px;
  height: 30px;
  border-radius: 50px;
}
.img-35{
  width: 35px;
  height: 35px;
  border-radius: 50px;
}
.img-40{
  width: 40px;
  height: 40px;
  border-radius: 50px;
}
.img-50{
  width: 50px;
  height: 50px;
}
.img-60{
  width: 60px;
  height: 60px;
}
.img-50{
  width: 60px;

  height: 60px;
}
.w-90-px{
  width: 90px;
}
.w-95-px{
  width: 95px;
}
.w-100-px{
  width: 100px;
}
/* a.nav-link.active:after {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  content: "\f060 ";
  
} */

[data-highchart="hide"]{
  display: none;
}
[data-original-title="Claim"]{
  cursor:pointer;
}
#serch_token,
#serch_token + div.input-group-append ,
#btnWhale{
  height: 30px !important;
}
#btnWhale{
  border-radius: 20px;
  object-fit: cover;
}
#box-bscfarm{
  display: block;
}
#wallet h4{
  text-align: center;
}

.navbar-light{
  background-color: #fff;
  -webkit-box-shadow: 0 25px 45px rgba(79,86,101,0.08);
  box-shadow: 0 25px 45px rgba(79,86,101,0.08);
  -webkit-transition: -webkit-box-shadow 0.4s ease;
  transition: -webkit-box-shadow 0.4s ease;
  -o-transition: box-shadow 0.4s ease;
  transition: box-shadow 0.4s ease;
  transition: box-shadow 0.4s ease, -webkit-box-shadow 0.4s ease;
}
.nav-link[data-toggle].collapsed:after {
  content: " ▾";
}
.nav-link[data-toggle]:not(.collapsed):after {
  content: " ▴";
}
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6,
.text-very-dark{
  color: #242F51;
}
.text-gray{
  color: #bbb;
}
.text-pink{
  color: #fa15fd;
}
.text-green{
  color: #259a57;
}
.pill-green{
  background: rgb(9,183,14,0.3);
  color: #0e5d13;
  border-radius: 5px;
}
.pill-orange{
  background: rgb(255,170,0,0.4);
  border-radius: 5px;
  color: #775102;
}
.cg-danger{
  color: #ff6675;
}
.cg-green{
  color: #33c481;
}
.cg-warning{
  color: #ffc107;
}
.bg-light-blue{
  background-color: #e6f2ff;
}
.bg-info-light{
  background-color: rgb(23,162,184, 0.45)!important;
}
.bg-pink-light{
  /* background-color: rgba(251, 11, 255, .15)!important; */
  background: rgb(2,0,36);
  background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(242,142,222,1) 0%, rgba(255,255,255,0.6054796918767507) 100%) !important;
}
.bg-green-light{
  background-color: rgba(25,206,69,0.1) !important;
  border: 1px solid #19ce45;
  border-radius: 10px;
}
.bg-green-gradien{
  background: linear-gradient(
    90deg
    , rgba(2,0,36,1) 0%, rgb(96,234,128) 0%, rgba(108,235,139,0.25) 100%) !important;
}
.bg-blue-gradien{
  background: linear-gradient( 
90deg
 , rgba(2,0,36,1) 0%, rgb(140,207,218) 0%, rgba(108,235,139,0.25) 100%) !important;
}
.rounded{
  border-radius: 1rem !important;
}
ul.nav{
  width: 100%;
}
.nav-item{
  /* text-align: center; */
  font-size: 1.3rem;
}
.nav-item a{
  /* color:#ab8000; */
  color: #b1b1b1;
  text-shadow: 2px 2px 1px #fff;
}
.nav-item a.active,
.nav-item a:hover{
  color: #2dc880;
}

.bg-light{
  background-color: #f9fafd!important;
}
.profile_state li {
    border-right: 1px solid #eee;
    text-align: center;
}
.card .body {
  font-size: 14px;
  color: #424242;
  padding: 20px;
  font-weight: 400;
}
.border-pink{
  border: 1px solid #fa15fd;
}
tr.border-0 th,
tr.border-0 td{
  border: 0 !important;
}
.rotate-0{
  transform: rotate(0deg) !important;
}
.rotate-180{
  transform: rotate(180deg);
}
.fa-caret-down, 
.fa-caret-up {
  transition: .3s;
}
/* page earn*/
.child-tr{
  display: none;
}
.focus-tr{
  color: #212529;
  background-color: rgba(0,0,0,0.075);
}
.reward{
  border: 1px solid #ffb140;
  border-radius: 10px;
  padding: 3px 8px;
  box-shadow: 2px 2px 2px #cecece;
}
.badge-radius-green-small{
  border: 1px solid #2ccb6f;
  padding: 2px 10px;
  border-radius: 10px;
  font-size: .9rem;
  background: #26ad60;
  font-weight: 400;
  color: #ffffff;
}
.reward i{
  color: #d1884f;
}
[data-toggle="collapse"] i {
  transform: rotate(180deg);
}



/*custom background color */
body{
    /* Blue */
    /* background: rgb(162,207,255);
    background: radial-gradient(circle, rgb(162 207 255) 0%, rgba(255,255,255,1) 80%); */
    background: url(../images/bg-blue.png);
    background-size: 100%;
    background-position: top;
}
.btn-claim{
  background-image: linear-gradient(to bottom right, #28a745, yellow);
  border: 0;
  color: #132713;
  padding-top: 2px;
  padding-bottom: 2px;
}
.card{
  background-color: rgba(255,255,255,.6);
}
.navbar-light{
  background-color: rgba(255,255,255,.3) !important;
} 

.bg-light {
    background-color: rgba(249,250,253,.3)!important;
}
.badge-radius-green{
  background: #28a745;
  padding: 5px 10px;
  border-radius: 30px;
  color: #fff;
  font-size: .9rem;
}
#bsc-price:before{
  content: '$';
}
#bsc-price:after{
  content: ' USD';
}
.box-logo-farm{
  background: rgba(0,0,0,0.2);
  padding: 6px 18px;
  border-radius: 10px;
  /* margin-bottom: 4px; */
  box-sizing: border-box;
  cursor: pointer;
}
.box-logo-farm.active{
  box-shadow: inset 0 0 21px #14f94c;
}
.box-logo-farm:hover{
  background: rgba(147,150,153,0.72);
}
.asset_deposit{
  /* font-weight: bold; */
  /* color: #007bff; */
  color: #242f51;
}
.asset_reward{
  /* font-weight: bold; */
  /* color: #28a745; */
  color: #242f51;
}
.asset_deposit_usd,.asset_reward_usd{
  /* font-weight: bold; */
  color: #28a745;
}
.img-pool1{
  z-index: 1;
}
.img-pool2{
  margin-left: -5px;
}
.asset_img{
  display: flex;
  align-self: center;
}
.asset_name_style{
  display: block;
  color: #fff !important;
  padding: 4px 10px;
  border-radius: 10px;
  margin-top: 3px;
  white-space: nowrap;
  font-size: 1rem;
}
.asset_value{
  margin-bottom: 0;
}
.asset_name_style{
  background: rgba(23,162,184,0.7);
}
.asset_value_dollar{
  letter-spacing: 1px;
}
#box-bscfarm .body{
  height: auto;
}
.expect{
  background: red;
  width: 120px;
  padding: 2px 12px;
  transform: rotate(45deg);
  color: #fff;
  position: absolute;
  top: 25px;
  right: -25px;
  font-size: 1rem;
  text-align: center;
}
.input-group.rounded input{
  background-color: transparent;
  border-radius: 25px 0 0 25px !important;
  opacity: .7;
}
.input-group.rounded button{
  border-radius: 0 25px 25px 0 !important;
  opacity: .7;
}
.btn-sos{
  cursor: pointer;
}
.btn-sos:hover{
  box-shadow: 0px 0px 10px 2px #ff7d7d;
  border-radius: 50%;

}


.onoffswitch {
  position: relative; width: 95px;
  -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.onoffswitch-label {
  display: block; overflow: hidden; cursor: pointer;
  border: 2px solid #999999; border-radius: 20px;
}
.onoffswitch-inner {
  display: block; width: 200%; margin-left: -100%;
  transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
  display: block; float: left; width: 50%; height: 20px; padding: 0; line-height: 20px;
  font-size: 10px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
  box-sizing: border-box;
}
.onoffswitch-inner:before {
  content: attr(data-after);
  padding-left: 10px;
  background-color: #3DA31D; color: #FFFFFF;
  text-align: left;
}
.onoffswitch-inner:after {
  content: attr(data-before);
  padding-right: 10px;
  background-color: #EEEEEE; color: #999999;
  text-align: right;
}
.onoffswitch-switch {
  display: block; width: 28px; margin: -3px;
  background: #FFFFFF;
  position: absolute; top: 0; bottom: 0;
  right: 70px;
  border: 2px solid #999999; border-radius: 20px;
  transition: all 0.3s ease-in 0s; 
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
  margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
  right: 0px; 
}
.alert{
  background: rgba(0,0,0,0.5);
  position: fixed;
  bottom: 0;
  left: 50%;
  width: 100%;
  color: #fff;
  padding-top: 10px;
  padding-bottom: 5px;
  transform: translate(-50%,0);
  z-index: 1;
  display: none;
}
.alert hr{
  margin: 0;
}
.alert p{
  margin-bottom: 5px !important;
}
.alert button{
  font-size: .8rem;
}
.alert .close{
  position: absolute;
  top: 0;
  right: 20px;
  color: #fff;
  font-size: 2rem;
}
a.social{
  color: #6c757d;
  font-size: 1rem;
  margin-top: 5px;
}
.switch-day button:hover,
.switch-day button:active,
.switch-day button:focus {
  outline: 0;
  box-shadow: initial !important;
}
.btnModal button{
  margin-right: 5px;
}
.sugg1{
  display: none !important;
}


/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.cover-loader{
    content: ' ';
    background-image: url(../icons/braner.png);
    background-repeat: no-repeat;
    background-size: 90%;
    background-position: center;
    width: 100px;
    height: 100px;
    opacity: .6;
}
.add-token{
  /* background: #ffc107;
  color: #fff;
  display: flex;
  align-self: center;
  padding: 9px;
  border-radius: 50%;
  margin-left: 10px;
  box-shadow: 1px 3px 5px #a5a5a5;
  position: absolute;
  right: 20px;
  top: 13px;
  cursor: pointer; */
  background: #ffc107;
  color: #2e2e1e;
  font-weight:bold;
  padding: 3px 9px;
  margin-left: 10px;
  box-shadow: 1px 3px 5px #a5a5a5;
  position: absolute;
  right: 20px;
  top: 13px;
  cursor: pointer;
  border-radius: 50px;
  font-size: .725rem;
}
.add-token-cls{
  width: 34px;
  height: 34px;
  margin-left: 10px;
  background: #ffc107;
  color: #fff;
  display: flex;
  align-self: center;
  padding: 9px;
  border-radius: 50%;
  box-shadow: 1px 3px 5px #a5a5a5;
  cursor: pointer;
}
.table.list-wallet tr th{
  padding-top: .5rem!important;
  padding-bottom: .5rem!important;
  background: rgba(97,230,153,0.2);
  color: #3cb595;
}
.table.list-farm tr th{
  padding-top: .5rem!important;
  padding-bottom: .5rem!important;
  background: rgba(149,165,166,0.12);
  color: #8b93a7;
}

.table.list-wallet tr td,
.table.list-farm tr td,
.unit-pool {
  color: #797192;
}
.table-hover tbody tr:hover {
  color: #212529;
  background-color: rgba(0,0,0,.035) !important;
}
.showAccount{
  height: 31px;
}
.pro,.new, .lock-new {
  position: relative;
  cursor: pointer;
  
}
.pro:after{
  background-image: url(../icons/pro.png);
  display: inline-block;
  width: 35px;
  height: 20px;
  content: "";
  content: "";
  position: absolute;
  top: -5px;
  right: 10px;
}
.new:after{
  background-image: url(../icons/new.png);
  display: inline-block;
  width: 35px;
  height: 20px;
  content: "";
  position: absolute;
  top: 10px;
  right: 10px;
}
.lock-new:after{
  background-image: url(../icons/lock-new.png);
  display: inline-block;
  width: 47px;
  height: 20px;
  content: "";
  position: absolute;
  top: 10px;
  right: 10px;
}
.n1:after{
  top: 12px;
}
.ps0:after{
  top: 0;
}
.ps1:after{
  top: -17px;
  right: -10px;
}
.ps2:after{
  top: -14px;
  right: -8px;
}
.ps3:after{
  top: -14px;
  right: -1px;
}
.ps4:after{
  top: 10px;
}
.ps5:after{
  top: -10px;
  right: -5px;
}
.btn-outline-warning:hover{
  color: #fff !important;
}
.dashboard-worth{
  /* background-image: linear-gradient(to right, rgb(213,245,235), rgba(255,0,0,0)); */

  /** use true*/
  background-image: linear-gradient(to right, #d5f5eb, rgba(255,255,255,0));
  /* border: 0 !important; */
}
.dashboard-worth .card-body{
  color: #33c481;
}
#connectsmc .modal-content{
  background-color: #141e38;
}
#connectsmc .card-body button{
  width: 100%;
  background: #141e38;
  border-radius: 20px;
  padding: 15px 10px;
}
#connectsmc .card-body button:hover {
  background: rgb(20,30,56,0.55);
}
#connectsmc .card-body{
  background-color: #263048;
}
#connectsmc .close{
  color: #fff;
}
.minus-button{
  margin-top: 2px !important;
  color: #adb5bd !important;
  border-color: #adb5bd !important;
}
.plus-metamask{
  color: #ff616f;
  background: #fff0;
  padding: 0;
  border-radius: 50px;
  border: 2px solid #ff616f;
  width: 20px;
  height: 20px;
  font-size: 0.7rem;
  margin-left: 5px;
  cursor: pointer;
}
.plus-metamask:hover{
  color: #f70016 !important;
  border-color: #f70016 !important;
}
.pill-left{
  border-radius: 50px 0 0 50px;
  /* background: linear-gradient(#e4acd2, #f1ff13);
  color: #ffffff;
  border-color: #fff; */
}
.pill-right{
  border-radius: 0 50px 50px 0;
}
.pill-right.active,
.pill-left.active {
  background: #ffc107;
  color: #fff !important;
}
#box-bscfarm{
  display: none;
}
.protocol:after{
  content: attr(data-id);
  background: rgba(44,203,111,0.27);
  position: absolute;
  top: 5px;
  left: 14px;
  padding: 3px 5px;
  border-radius: 50px;
  width: 25px;
  height: 25px;
  font-size: .8rem;
  color: #199e52;
  display: flex;
  justify-content: center;
}

.protocol{
  font-family: 'Roboto',sans-serif;
  font-weight: bold;
  /* border:1px solid #f1c40f; */
  cursor: pointer;
  color: #a08102;
  transition: ease 0.2s;
  background-color: rgba(255,255,255,0.7);
}
.protocol:hover{
  margin-top: -5px;
  box-shadow: 1px 1px 7px rgba(62,62,62,0.35);
}
.protocol img{
  border: 2px solid #ede6b7;
  border-radius: 50px;
  padding: 10px;
  margin-right: 2px;
}
.form-coin{
  position: absolute;
  color: #cc9c20;
  top: 5px;
  right: 28px;
}
div.bg-transparent{
  background-color: transparent !important;
}
.input-transparent:focus + .input-group-append button i:before{
  content: "\f00d" !important;
}
.btn-close{
  outline: 0;
  box-shadow: initial !important;
}
.input-transparent,
.btn-transparent {
  background-color: #fff;
  border-color: #b7daff;
}
.input-group-append .btn-transparent{
    border-left: initial;
    color: #8695a5;
    
}
.input-transparent:focus{
    background-color: rgb(255,255,255,0.06);
    box-shadow: 0 0 0 0.2rem rgb(215,234,255);
}
.btnAddress [data-toggle="tooltip"][title="Remove"] {
  top: 38px;
  padding: 1px 6px;
}
.fa-radius{
  background: #d2d2d2;
  border-radius: 50px;
  padding: 7px;
  width: 30px;
  height: 30px;
}
marquee {
  height: 20px;
  width: 100%;
  margin-bottom: -10px;
  background: transparent;
  color: #6c757d;
  font-size: 1rem;
  display: none;
}
marquee a{
  color: #6c757d;
}
.caption{
  font-size: .6rem;
  margin-bottom: -15px;
  color:#a9a9a9;
}
.btn-safebsc{
  background-image: linear-gradient(to right, #92ffc0, #ffc501);
  border: 0;
  color: #342500;
}
nav.nav-float{
  position: fixed;
  background-color: #fff !important;
  z-index: 19;
  top: 0;
  left: 0;
  width: 100%;
  display: none;
} 
.backtotop{
  background: rgba(255,193,7,0.58);
  width: 40px;
  height: 40px;
  font-size: 1.725rem;
  color: #a27d0c;
  text-align: center;
  border-radius: 50px;
  position: fixed;
  bottom: 20px;
  right: 20px;
  cursor: pointer;
  display: none;
}
.backtotop:hover{
  background: rgba(255,193,7,0.8);
}
#sidebar{
  padding-right: 0;
}
#sidebar ul::-webkit-scrollbar {width: 3px;height: 3px;}
#sidebar ul::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 10px rgba(250, 250, 250,.02);cursor: pointer;}
#sidebar ul::-webkit-scrollbar-thumb {background: rgba(255,255,255,.05);outline: 0;border-radius: 26px;}

.btn-upload{
  background: #ececec;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  background-image: url('../../assets/icons/image.png');
  background-repeat: no-repeat;
  background-size: 60%;
  background-position: center;
}
.btn-upload [type="file"]{
  opacity: 0;
  width: 40px;
  height: 40px;
  position: absolute;
  top: 0;
  left: 0;
}
.upload-preview{
  width: 70px;
  height: 70px;
  margin-bottom: 7px;
  background-color: #ececec;
  display: none;
}
.upload-preview i{
  position: absolute;
  top: 0px;
  right: -18px;
  color: #e06d6d;
  font-size: 1.2rem;
  cursor: pointer;
}
.upload-preview img{
  width: 70px;
  height: 70px;
  object-fit: cover;
}
.show-mobile-value,
.show-mobile-table{
  display: none;
}
.box-volumscz a{
  color: #33c481 !important;
  /* color: #26ad60 !important; */
  font-size: .9rem;
  font-family: 'Roboto-5',sans-serif;
}
.box-volumscz a:hover{
  text-decoration: none;
}
.running-pro{
  background: red;
  width: 98px;
  padding: 4px 10px;
  color: #fff;
  position: absolute;
  top: 0;
  right: 0;
  border-radius: 0 10px;
  font-size: .9rem;
}
.custom-control-input:checked~.custom-control-label::before {
  color: #fff;
  border-color: #ffc107;
  background-color: #ffc107;
}


.mycard-footer {
  height: 25px;
  font-size: 15px;
}
.gallery-card:hover{
  border-color: #ffc107 !important;
}
.gallery-card {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: rgba(255,255,255,0.1);
  background-clip: border-box;
  border: 1px solid rgba(0,0,0,.125);
  border-radius: .25rem;
  height: 77px;
  margin-bottom:14px;
}
.gallery-card-body {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  /*padding: 1.25rem;*/
}
/* .gallery-card img {
  height: 100px;
  width: 100%;
} */
label{
  margin-bottom: 0 !important;
}
/*--checkbox--*/

.block-check {
  display: block;
  position: relative;
 
 
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.block-check img{
  margin-bottom: 3px;
}
/* Hide the browser's default checkbox */
.block-check input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: -3px;
  right: -11px;
  height: 25px;
  width: 25px;
  background-color: #eee;
  cursor: pointer;
  border-radius: 50px;
}

/* On mouse-over, add a grey background color */
.block-check:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.block-check input:checked ~ .checkmark {
  background-color: #2196F3;
}
.block-check input:checked ~ .checkmark.warning {
  background-color: #ffc107;
}


/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.block-check input:checked ~ .checkmark:after {
  display: block;
  
}

/* Style the checkmark/indicator */
.block-check .checkmark:after {
  left: 10px;
  top: 6px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.cursor-pointer{
  cursor: pointer;
}
.vote{
  cursor: pointer;
}
.ln-15{
  line-height: 15px;
  display: block;
}
.tab-card .nav-link.active,
.tab-card .nav-link:hover {
  border-radius: 10px 10px 0 0;
  background-color: #f5faff;
  border-color: #dee2e6 #dee2e6 #f5faff;
  color: #2dc880;
}
.tab-card .nav-link:after{
  content: '' !important;
}
.nav-tabs .nav-link{
  border: 1px solid #d5dadf;
}
/* .nav-tabs #one-tab.nav-link{
  border-radius: 10px 0px 0 0 !important;
} */
.nav-tabs #two-tab.nav-link{
  border-radius: 0px 10px 0 0 !important;
}
.rounded-top{
  border-radius: 15px 15px 0 0 !important;
}


.countprotocol{
  position: absolute;
  top: 15px;
  right: -8px;
  font-size: .725rem;
  /* background: #8b93a7;
  color: #fff; */
  background: #ffc107;
  color: #212529;
  padding: 8px 12px;
  border-radius: 5px 0 0 5px;
  z-index: 10;
  font-weight: bold;
  cursor: pointer;
}
.countprotocol:after {
  position: absolute;
  top: 29px;
  right: 1px;
  width: 0;
  height: 0;
  /* border-color: transparent transparent transparent #5a5a5a; */
  border-color: transparent transparent transparent #a98109;
  border-style: solid;
  border-width: 0px 0px 6px 6px;
  content: ' ';
  z-index: -1;
}
.filter-gray{
  filter: grayscale(1);
}
.gray{
  background-color: #c1c1c1 !important;
  color: #21251f !important; 
  border: 1px solid #a0a0a0 !important; 
  -moz-box-shadow: inset 0 0 10px #b3b3b3 !important;
  -webkit-box-shadow: inset 0 0 10px #b3b3b3 !important;
  box-shadow: inset 0 0 10px #b3b3b3 !important;
}
/** hide for pro */
/* .hide-mobile .asset_deposit,
.hide-mobile .asset_deposit p,
.hide-mobile .asset_reward,
.hide-mobile .asset_reward_usd{
  position: relative;
  color: transparent;
  text-shadow: 0 0 5px rgba(0,0,0,0.5);
} */

div.scz-pro-active,
div.scz-pro-active p,
div.scz-pro-active .unit-pool,
div.asset_deposit.scz-pro-active .text-success,
span.scz-pro-active {
  position: relative;
  color: transparent !important;
  text-shadow: 0 0 5px rgba(0,0,0,0.5);
}

/*.hide-mobile .asset_deposit p:after,
.hide-mobile .asset_reward:after {
  content: " ";
  background-image: url(../icons/lockpro.png);
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%, 0);
  width: 50px;
  height: 30px;
  background-size: 100%;
  background-repeat: no-repeat;
} */



/*graph*/

.switcher {
display: flex;
align-items: center;
height: 30px;
margin-top: 8px;
color: #2196F3;
position: absolute;
top: 0;
right: 70px;
z-index: 9999;
}

.switcher-item {
cursor: pointer;
text-decoration: none;
display: inline-block;
padding: 6px 8px;
font-size: 14px;
color: #262b3e;
background-color: rgb(204,204,204,0.45);
margin-right: 8px;
border: none;
border-radius: 4px;
outline: none;
}

.switcher-item:hover {
background-color: #f2f3f5;
}

.switcher-active-item {
text-decoration: none;
cursor: default;
color: #262b3e;
}

.switcher-active-item,
.switcher-active-item:hover {
background-color: #e1eff9;
}
.legend {
position: absolute;
left: 12px;
top: 12px;
z-index: 2;
font-size: 12px;
line-height: 18px;
font-weight: 300;
}
.go-to-realtime-button {
width: 27px;
height: 27px;
position: absolute;
padding: 5px;
box-sizing: border-box;
font-size: 10px;
border-radius: 50%;
text-align: center;
z-index: 1000;
color: #B2B5BE;
background: rgba(250, 250, 250, 0.95);
box-shadow: 0 2px 5px 0 rgba(117, 134, 150, 0.45);
}
.owner{
  font-weight: 600;
font-size: 1.1rem;
}
.showdate{
font-size: .9rem;
margin-top: 10px;
}
.owner,.showdate{
  color: #0f6b12;
}

div#myTabContent #alertpro {
  padding: 5px 10px;
  display: none;
  width: 90%;
  text-align: center;
  color: #db2828;
  border-radius: 20px;
  border: 1px solid;
  margin: 15px auto;
}
.popover {
  background: rgba(0,0,0,.75);
  border-color: rgba(0,0,0,.75);
}
.popover-body{
  color: #fff;
}
.bs-popover-auto[x-placement^=left]>.arrow::after, .bs-popover-left>.arrow::after{
  border-left-color: rgba(0,0,0,.75);
}
.bs-popover-auto[x-placement^=right]>.arrow::after, .bs-popover-right>.arrow::after{
  border-right-color: rgba(0,0,0,.75);
}
.bs-popover-auto[x-placement^=top]>.arrow::after, .bs-popover-top>.arrow::after{
  border-top-color: rgba(0,0,0,.75);
}
.sos{
  background-color: #ffc61b;
  color: #21251f;
  font-size: .5rem;
  font-weight: 700;
  width: 50px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  border: 1px solid #d6a000;
  zoom: 0.;
  -moz-box-shadow: inset 0 0 10px #bf9c35;
  -webkit-box-shadow: inset 0 0 10px #bf9c35;
  box-shadow: inset 0 0 10px #bf9c35;
}
button.btn-primary{
    background-color: #55b1f9;
}
.btn-exit{
  position: absolute;
  top: 12px;
  right: 20px;
}
.livecoinwatch-widget-5{
  margin-top: -15px !important;
  margin-bottom: -15px !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

.dashboard-worth:after {
  content: ' ';
  background-image: url(../icons/mascot.png);
  background-repeat: no-repeat;
  background-size: 70%;
  background-position-x: right;
  width: 300px;
  height: 300px;
  position: absolute;
  top: -64px;  
  right: -53px;
  z-index: 1;
  opacity: .9;
}

.mascot {
  /* background-image: url(../icons/mascot.png);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: top;
  width: 100%;
  height: 415px; */
  background-image: url(../icons/mascot.png);
  background-repeat: no-repeat;
  background-size: 80%;
  background-position: top;
  width: 100%;
  height: 485px;
  margin-top: -70px;
}
.mascot-float{
  position: absolute;
  top: -100px;
  left: 50%;
  opacity: .3;
  transform: translate(-50%, 0);
  width: 90%;
}

.banner-pc{
  width: 100px;
  height: 100px;
  position: absolute;
  top: 0;
  left: 0;
}
.banner-text{
  margin-left: 65px;
}


/** market */

.scz-head-market{
  background: repeating-linear-gradient(to right, rgb(252 159 2), rgb(249 159 4) 40px, rgb(255 205 1) 40px, rgb(255 201 1) 80px);
  padding-bottom: 40px !important;
  padding-top: 40px !important;
  border-radius: 10px 10px 0 0;
  border: 0;
  color: #543500 !important;
  margin: 0;
}
.scz-head-market small{
  font-size: 1.5rem;
  color: #634209;
}
.scz-head-radius{
  background-image: url('../icons/roof-radius.png');
    background-repeat: repeat-x;
    background-size: contain;
    height: 20px;
}
.scz-space-head{
  border: 2px solid #2ccb6f;
}
.market{
  background-repeat: no-repeat;
  background-position: center right;
  background-size: cover;
  height: 120px;
  border-radius: 30px;
  align-items: center;
  display: flex;
  justify-content: center;
  cursor: pointer;
}
.market .market-topic{
  background-color: rgba(255,203,1, .9);
  display: inline-block;
  padding: 5px 20px;
  border-radius: 30px;
}
.market-1{
  color: #597d1c;
  background-color: rgba(255,255,255,.9) !important;
  box-shadow: rgba(14,213,164,.48) 0px 54px 55px, rgba(21,227,189,.66) 0px -12px 30px, rgb(255,255,255) 0px 4px 6px, rgba(23,228,189,.67) 0px 12px 13px, rgba(15,216,166,.68) 0px -3px 5px;
}
.market:hover .market-topic{
  background-color: rgb(255,203,1, 1);
}


.button {
  position: relative;
  -webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
  text-decoration: none;
  overflow: hidden;
  cursor: pointer;
}

.button:after {
  content: "";
  background: #fff;
  display: block;
  position: absolute;
  padding-top: 300%;
  padding-left: 350%;
  margin-left: -20px!important;
  margin-top: -120%;
  opacity: 0;
  transition: all 0.8s
}

.button:active:after {
  padding: 0;
  margin: 0;
  opacity: 1;
  transition: 0s
}
.btn-group label{
  outline: 0;
  box-shadow: initial !important;
  border-radius: 10px !important;
}
.change-token label.active{
  border-left: 8px solid rgba(219,40,40,0.5);
  border-top: 1px solid rgba(219,40,40,0.5);
  border-right: 1px solid rgba(219,40,40,0.5);
  border-bottom: 1px solid rgba(219,40,40,0.5);
  border-radius: 10px !important;
}
.change-token .btn i{
  color: #ffc107;
}
.change-token i.plus-token{
  border-radius: 50px !important;
    background: #ffc107;
    color: #2e2e1e;
    padding: 5px;
    font-size: .8rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #ffc107;
}

@media (max-width: 991.98px) {
  .offcanvas-collapse {
    position: fixed;
    top: 56px; /* Height of navbar */
    bottom: 0;
    left: 100%;
    width: 100%;
    padding-right: 1rem;
    padding-left: 1rem;
    overflow-y: auto;
    visibility: hidden;
    background-color: #343a40;
    transition: visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out, visibility .3s ease-in-out;
    transition: transform .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
  }
  .offcanvas-collapse.open {
    visibility: visible;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

.nav-scroller {
  position: relative;
  z-index: 2;
  height: 56px;
  overflow-y: hidden;
}

.nav-scroller .change-token {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  padding-bottom: 1rem;
  overflow-x: auto;
  color: rgba(255, 255, 255, .75);
  text-align: center;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}

.event-scz .float{
    width: 95%;
    position: absolute;
    top: 10px;
    left: 50%;
    background: rgba(255,255,255,0.97);
    transform: translate(-50%,0);
    border-radius: 50px;
    height: auto;
}
.roadmap ul li{
  position: relative;
  margin-bottom: 10px;
  font-size: 1.1rem;
  padding-bottom: 10px;
  padding-left: 38px;
}
.roadmap ul img{
  width: 35px;
  position: absolute;
  top: 0;
  left: 0;
}
.card-deck .card {
  border-radius: 15px 15px 0 0 !important;
}
.roadmap .card-title img{
  height: 120px;
  margin-bottom: 20px;
}
.img-overlap img {
  width: 70px;
}
.time_circles {
  display: flex;
}
.count-down div:nth-child(2){
  color: #99ccff;
}
.count-down div:nth-child(3){
  color: #bbffbb;
}
.count-down div:nth-child(4){
  color: #ff9999;
}
.btn-opt{
  position: absolute !important;
  top: 1px;
  right: 1px;
  width: 28px;
  height: 28px;
  background: rgba(255,255,255,0.4);
  border-radius: 50px !important;
  z-index: 999;
  border: 1px solid #ffc107;
}
.btn-opt:active,
.btn-opt:focus {
  outline: 0;
  box-shadow: initial !important;
}
.dropdown-toggle::after{
  border: 0 !important;
}
.dropdown-item.active, .dropdown-item:active {
  background-color: #fff;
  color: #2ccb6f;
}
.dropdown-item{
  padding: .25rem 2rem;
}
.dropdown-item.active::after{
  content: "\f058";
    position: absolute;
    top: 20px;
    left: 8px;
    font-family: "Font Awesome 5 Free";
}
.disabled-account{
  display: none;
  padding-right: 35px;
}
.disabled-account:after {
  content: ' ';
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.4);
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 50px;
  z-index: 1;
}
.disabled-account:before {
  content: '\f070';
  width: 28px;
  height: 28px;
  background: rgba(255,255,255,0.4);
  position: absolute;
  top: 0;
  right: 0;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Font Awesome 5 Free';
  z-index: 2;
}
.disabled-account.enabled:before{
  content: "\f06e";
}
.disabled-account.enabled:after{
  background-color: initial;
}
.view-address{
  display: none;
}
.btn-select{
  padding: .375rem 1.75rem .375rem .75rem;
  text-align: center;
  border-radius: 50px;
  height: 31px;
  font-size: .8rem;
  font-weight: bold;
  margin-left: 5px;
  color: #212529;
  outline: 0;
  box-shadow: initial !important;
}
.btn-select:active{
  outline: 0;
  box-shadow: initial !important;
}