.center {
  margin-left: auto;
  margin-right: auto;
}

.mainBg {
  background-image: linear-gradient(to right, #000, #505050, #000) !important;
  color: #fff;
  height: 100%
}

.textAbout {
  width: 100%;
}

.heading {
  font-weight: 500 !important;
  font-family: Georgia, serif !important;
  background: -webkit-linear-gradient(#fff1b1, #fff1b1, #ffd028, #fff9c3, #ffffff) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

.content {
  font-weight: 500;
  color: #fff;
  font-family: sans-serif !important;
}

tbody tr:hover {
  box-shadow: 0px 2px 18px 0px rgba(128, 128, 128, 0.5);
  cursor: pointer;
}

.img-responsive {
  height: auto;
  width: auto;
  max-height: 90px;
  max-width: 90px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.mainTop td {
  width: 20%;
  font-size: 20px;
  background-color: rgb(218, 218, 218);
  table-layout: fixed;
  color: #c0c0c0;
  border-bottom: 1px solid rgb(156, 156, 25);
  font-weight: 500 !important;
  font-family: sans-serif !important;
}

.mainTop th {
  background: -webkit-linear-gradient(#ddb53f, #c99a46) !important;
  color: #000000 !important;
  font-weight: 500 !important;
  font-family: sans-serif !important;
}

.marquee {
  background: -webkit-linear-gradient(#ddb53f, #c99a46) !important;
  color: #000000 !important;
  font-weight: 500 !important;
  font-family: sans-serif !important;
}



.market th:nth-child(1) {
  width: 60%;
  text-align: left;
  font-weight: 300;
  float: center;
  padding: 0px;
  padding-left: 15px;
  font-size: 20px;
  background: -webkit-linear-gradient(#ddb53f, #c99a46) !important;
  color: #000000 !important;
  font-weight: 500 !important;
  font-family: sans-serif !important;
}

.market th:nth-child(2) {
  width: 20%;
  padding: 0;
  text-align: center;
  font-weight: 300;
  float: center;
  font-size: 20px;
  background: -webkit-linear-gradient(#ddb53f, #c99a46) !important;
  color: #000000 !important;
  font-weight: 500 !important;
  font-family: sans-serif !important;
}

.market th:nth-child(3) {
  width: 20%;
  padding: 0;
  text-align: center;
  font-weight: 300;
  float: center;
  font-size: 20px;
  background: -webkit-linear-gradient(#ddb53f, #c99a46) !important;
  color: #000000 !important;
  font-weight: 500 !important;
  font-family: sans-serif !important;
}

.market td:nth-child(1) {
  width: 60%;
  text-align: left;
  background-image: linear-gradient(#000, #505050, #000);
  font-weight: bold;
  padding-top: 10px;
  padding-bottom: 10px;
  float: center;
  line-height: 40px;
  font-size: 20px;
  font-weight: 500 !important;
  font-family: sans-serif !important;
}

.market td:nth-child(2) {
  width: 20%;
  padding: 0;
  text-align: center;
  background-image: linear-gradient(#000, #505050, #000);
  font-weight: bold;
  padding-top: 10px;
  padding-bottom: 10px;
  float: center;
  line-height: 40px;
  font-size: 20px;
  font-weight: 500 !important;
  font-family: sans-serif !important;
}

.market td:nth-child(3) {
  width: 20%;
  padding: 0;
  text-align: center;
  background-image: linear-gradient(#000, #505050, #000);
  font-weight: bold;
  padding-top: 10px;
  padding-bottom: 10px;
  float: center;
  line-height: 40px;
  font-size: 20px;
  font-weight: 500 !important;
  font-family: sans-serif !important;
}

.topSpotName {
  width: 100%;
  padding: 15px 10px;
  text-align: center;
  font-weight: bold;
  float: center;
  line-height: 15px;
  font-size: 16px;
  font-weight: 500 !important;
  font-family: sans-serif !important;
}

.navbar {
  background: -webkit-linear-gradient(#ddb53f, #c99a46) !important;
  /* background-image: linear-gradient(to right, #000, #505050, #000); */
}

.mainSpot {
  background-image: linear-gradient(to right, #000, #505050, #000);
}

.spotbg {
  background: -webkit-linear-gradient(#fff7db, #ffffff, #ffd028, #fff9c3, #ffffff) !important;
  /* background: -webkit-linear-gradient(#ddb53f, #c99a46) !important; */
  border: 0px solid #eff4b8;
  border-radius: 100px;
}


.navbar .active a {
  color: rgb(0, 0, 0) !important;
}

.navbar .notactive a {
  color: rgb(96, 96, 96) !important;
}


.navbar .notactive a:hover {
  /* background: -webkit-linear-gradient(#ddb53f, #c99a46) !important; */
  color: rgb(0, 0, 0) !important;
}

.active {
  background: -webkit-linear-gradient(#ddb53f, #c99a46) !important;
  color: #000 !important;
  font-weight: 500;
  padding-left: 10px;
  padding-right: 10px;
  font-weight: bold;
}

.notactive {
  padding-left: 10px;
  padding-right: 10px;
  color: #ffffff !important;
  font-weight: bold;
}


.borderTop {
  border: 1px solid #eff4b8;
  background-repeat: repeat;
  border-radius: 10px;
  margin-top: 4px;
}


.custom-gutter>[class*='col-'] {
  background: -webkit-linear-gradient(#ddb53f, #c99a46) !important;
  padding-right: 2px;
  padding-left: 2px;
}

.custom-gutter>[class*="col-"]:first-child {
  padding-left: 15px;
}

.custom-gutter>[class*="col-"]:last-child {
  padding-right: 15px;
}


.topName {
  padding: 5px;
  width: 100%;
  background: -webkit-linear-gradient(#ddb53f, #c99a46) !important;
  color: #000000 !important;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
}

.topBidAsk {
  padding: 5px;
  width: 100%;
  /* color: #ffffff; */
  text-align: center;
  font-size: 16px;
  font-weight: bold;
}

.topBidAskGreen {
  padding-top: 3px;
  padding-bottom: 3px;
  border-radius: 10px;
  font-weight: bold;
  color: #ffffff;
  font-weight: bold;
  background-color: green;
}

.topBidAskRed {
  padding-top: 3px;
  padding-bottom: 3px;
  border-radius: 10px;
  font-weight: bold;
  color: #ffffff;
  font-weight: bold;
  background-color: red;
}

.topBidAskNothing {
  padding-top: 3px;
  padding-bottom: 3px;
  border-radius: 10px;
  font-weight: bold;
  /* color: #000000; */
  /* background-image: linear-gradient(180deg, rgb(255, 255, 255), rgb(167, 167, 167)); */
}




.tablePriceRed {
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 15px;
  padding-right: 15px;
  border-radius: 3px;
  background-color: red;
}

.tablePriceGreen {
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 15px;
  padding-right: 15px;
  border-radius: 3px;
  background-color: green;
}

/* .tablePriceNormal {
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 10px;
  padding-right: 10px;
  font-weight: bold;
  color: #ffffff;
  text-transform: capitalize;
 } */


.mainBgBottom {
  width: 100%;
  padding-top: 3px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 3px;
  border-radius: 10px;
  border: 1px solid #214759;
  font-weight: bold;
  background-image: linear-gradient(#000, #505050, #000);
}

.footer {
  width: 100%;
  padding-top: 3px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 3px;
  border: 1px solid #000;
  font-weight: bold;
  font-size: 16px !important;
  color: #000 !important;
  background-image: linear-gradient(to right, #000, #505050, #000);
}

.footer * {
  color: #fff !important;
  font-size: 20px !important;
}


.footer .heading {
  font-size: 28px !important;
  color: #fff !important;
}

.footer .subheading {
  font-size: 28px !important;
  color: #fff !important;
}

.findUs .heading {
  font-size: 28px !important;
  color: #fff !important;
}

.findUs .content {
  font-size: 20px !important;
  color: #fff !important;
}



.footer2 {
  padding-top: 30px;
  padding-bottom: 30px;
  width: 100%;
  font-weight: normal;
  font-size: 12px;
  color: #000 !important;
  background-color: rgb(0, 0, 0);
  font-weight: 500 !important;
  font-family: sans-serif !important;
  background: -webkit-linear-gradient(#ddb53f, #c99a46) !important;
}


@media only screen and (max-width: 540px),
(min-device-width: 327px) and (max-device-width: 540px) {

  .mainTop td,
  th {
    font-size: 3.5vw;
  }

  .market th:nth-child(1) {
    font-size: 4vw;
  }

  .market th:nth-child(2) {
    font-size: 4vw;
  }

  .market th:nth-child(3) {
    font-size: 4vw;
  }

  /* row */
  .market td:nth-child(1) {
    font-size: 4vw;
  }

  .market td:nth-child(2) {
    font-size: 4vw;
  }

  .market td:nth-child(3) {
    font-size: 4vw;
  }


  .topName {
    font-size: 4vw;
  }

  .topBidAsk {
    font-size: 4vw;
  }

  .topHigh {
    font-size: 2vw;
  }

  .topLow {
    font-size: 2vw;
  }

}


@media only screen and (max-width: 327px),
(min-device-width: 200px) and (max-device-width: 327px) {

  .mainTop td,
  th {
    font-size: 3.0vw;
  }

  .market th:nth-child(1) {
    font-size: 4.5vw;
  }

  .market th:nth-child(2) {
    font-size: 4.5vw;
  }

  .market th:nth-child(3) {
    font-size: 4.5vw;
  }

  /* row */
  .market td:nth-child(1) {
    font-size: 4.5vw;
  }

  .market td:nth-child(2) {
    font-size: 4.5vw;
  }

  .market td:nth-child(3) {
    font-size: 4.5vw;
  }

  .topName {
    font-size: 4vw;
  }

  .topBidAsk {
    font-size: 4vw;
  }

  .topHigh {
    font-size: 2vw;
  }

  .topLow {
    font-size: 2vw;
  }
}