body * {
  font-family: 'Nunito', sans-serif;
  box-sizing: border-box;
}
body {
  cursor: cell;
  background-color: #142F4C;
  background-color: #0B2333;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400' viewBox='0 0 800 800'%3E%3Cg fill='none' stroke='%231B3C44' stroke-width='1'%3E%3Cpath d='M769 229L1037 260.9M927 880L731 737 520 660 309 538 40 599 295 764 126.5 879.5 40 599-197 493 102 382-31 229 126.5 79.5-69-63'/%3E%3Cpath d='M-31 229L237 261 390 382 603 493 308.5 537.5 101.5 381.5M370 905L295 764'/%3E%3Cpath d='M520 660L578 842 731 737 840 599 603 493 520 660 295 764 309 538 390 382 539 269 769 229 577.5 41.5 370 105 295 -36 126.5 79.5 237 261 102 382 40 599 -69 737 127 880'/%3E%3Cpath d='M520-140L578.5 42.5 731-63M603 493L539 269 237 261 370 105M902 382L539 269M390 382L102 382'/%3E%3Cpath d='M-222 42L126.5 79.5 370 105 539 269 577.5 41.5 927 80 769 229 902 382 603 493 731 737M295-36L577.5 41.5M578 842L295 764M40-201L127 80M102 382L-261 269'/%3E%3C/g%3E%3Cg fill='%231C4B55'%3E%3Ccircle cx='769' cy='229' r='5'/%3E%3Ccircle cx='539' cy='269' r='5'/%3E%3Ccircle cx='603' cy='493' r='5'/%3E%3Ccircle cx='731' cy='737' r='5'/%3E%3Ccircle cx='520' cy='660' r='5'/%3E%3Ccircle cx='309' cy='538' r='5'/%3E%3Ccircle cx='295' cy='764' r='5'/%3E%3Ccircle cx='40' cy='599' r='5'/%3E%3Ccircle cx='102' cy='382' r='5'/%3E%3Ccircle cx='127' cy='80' r='5'/%3E%3Ccircle cx='370' cy='105' r='5'/%3E%3Ccircle cx='578' cy='42' r='5'/%3E%3Ccircle cx='237' cy='261' r='5'/%3E%3Ccircle cx='390' cy='382' r='5'/%3E%3C/g%3E%3C/svg%3E");
  background-attachment: fixed;
}
#countdown-wrap {
  width: 100%;
  height: 300px;
  padding: 20px;
  max-width: 650px;
  margin: 150px auto 300px;
}
#goal {
  font-size: 48px;
  text-align: center;
  color: #FFF;
}
@media only screen and (max-width: 640px) {
  #goal {
    text-align: center;
  }
}
#glass {
  width: 100%;
  height: 20px;
  background: #46a1de;
  border-radius: 10px;
  float: left;
  overflow: hidden;
}
#progress {
  float: left;
  width: 0%;
  height: 20px;
  background-color: red;
  background-image: linear-gradient(orange, #f06d06);
  z-index: 333;
}
.goal-stat {
  width: 25%;
  padding: 10px;
  float: left;
  margin: 0;
  color: #FFF;
}
@media only screen and (max-width: 640px) {
  .goal-stat {
    width: 50%;
    text-align: center;
  }
}
.user-stat {
  width: 100%;
  padding: 1px;
  margin: 0;
  float: left;
  color: #AAA;
}
.goal-number,
.goal-label {
  display: block;
}
.goal-number {
  font-weight: bold;
}
.kyccontainer {
  position: relative;
  width: 125px;
  margin: auto;
  width: 50%;
  padding: 10px;
  border: 1px solid black;
  max-width: 155px;
}
.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 155px;
  width: 155px;
  opacity: 0;
  transition: 0.8s ease;
}
.kyccontainer:hover .overlay {
  opacity: 0.8;
}
* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}
body {
  color: #50555a;
  padding: 100px 20px;
}
nav {
  z-index: 9;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  color: white;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  padding: 20px 0;
  text-align: center;
}
h3 {
  text-align: left;
}
.bg-color {
  background-color: #46a1de;
  transition-duration: 0.5s;
}
.text-color {
  color: #46a1de;
  transition-duration: 0.5s;
}
footer {
  padding: 40px 0;
  text-align: center;
  opacity: 0.33;
  color: white;
}
.wrapper {
  min-width: 600px;
  max-width: 900px;
  margin: 0 auto;
}
@media only screen and (max-width: 480px) {
  .wrapper {
    width: 50%;
    text-align: center;
  }
}
.tabs {
  display: table;
  table-layout: fixed;
  width: 100%;
  -webkit-transform: translateY(5px);
  transform: translateY(5px);
}
.tabs > li {
  transition-duration: 0.25s;
  display: table-cell;
  list-style: none;
  text-align: center;
  padding: 20px 20px 25px 20px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  color: white;
}
.tabs > li:before {
  z-index: -1;
  position: absolute;
  content: "";
  width: 100%;
  height: 120%;
  top: 0;
  left: 0;
  background-color: rgba(255, 255, 255, 0.3);
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
  transition-duration: 0.25s;
  border-radius: 5px 5px 0 0;
}
.tabs > li:hover:before {
  -webkit-transform: translateY(70%);
  transform: translateY(70%);
}
.tabs > li.active {
  color: #50555a;
}
.tabs > li.active:before {
  transition-duration: 0.5s;
  background-color: white;
  -webkit-transform: translateY(0);
  transform: translateY(0);
}
.tab__content {
  background-color: white;
  position: relative;
  width: 100%;
  border-radius: 5px;
}
.tab__content > li {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: none;
  list-style: none;
}
.tab__content > li .content__wrapper {
  text-align: center;
  border-radius: 5px;
  width: 100%;
  padding: 45px 40px 40px 40px;
  background-color: white;
}
.content__wrapper h2 {
  width: 100%;
  text-align: center;
  padding-bottom: 20px;
  font-weight: 300;
}
.content__wrapper img {
  width: 100%;
  height: auto;
  border-radius: 5px;
}
.colors {
  text-align: center;
  padding-top: 20px;
}
.colors > li {
  list-style: none;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border-bottom: 5px solid rgba(0, 0, 0, 0.1);
  display: inline-block;
  margin: 0 10px;
  cursor: pointer;
  transition-duration: 0.2s;
  box-shadow: 0 2px 1px rgba(0, 0, 0, 0.2);
}
.colors > li:hover {
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
  border-bottom: 10px solid rgba(0, 0, 0, 0.15);
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
}
.colors > li.active-color {
  -webkit-transform: scale(1.2) translateY(-10px);
  transform: scale(1.2) translateY(-10px);
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
  border-bottom: 20px solid rgba(0, 0, 0, 0.15);
}
.colors > li:nth-child(1) {
  background-color: #2ecc71;
}
.colors > li:nth-child(2) {
  background-color: #D64A4B;
}
.colors > li:nth-child(3) {
  background-color: #8e44ad;
}
.colors > li:nth-child(4) {
  background-color: #46a1de;
}
.colors > li:nth-child(5) {
  background-color: #bdc3c7;
}
.test {
  z-index: 9;
}
div.redTable {
  border: 2px solid #446DA4;
  background-color: #E1E7EE;
  width: 100%;
  font-family: "Lucida Console", Courier, monospace;
  text-align: center;
  border-collapse: collapse;
}
.divTable.redTable .divTableCell,
.divTable.redTable .divTableHead {
  padding: 3px 2px;
}
.divTable.redTable .divTableBody .divTableCell {
  font-size: 13px;
}
.divTable.redTable .divTableRow:nth-child(even) {
  background: #DBF4F5;
}
.divTable.redTable .divTableHeading {
  background: #446DA4;
}
.divTable.redTable .divTableHeading .divTableHead {
  font-size: 19px;
  font-weight: bold;
  color: #FFFFFF;
  text-align: center;
}
.redTable .tableFootStyle {
  font-size: 13px;
  font-weight: bold;
  color: #FFFFFF;
  background: #446DA4;
}
.redTable .tableFootStyle {
  font-size: 13px;
}
.redTable .tableFootStyle .links {
  text-align: right;
}
.redTable .tableFootStyle .links a {
  display: inline-block;
  background: #FFFFFF;
  color: #446DA4;
  padding: 2px 8px;
  border-radius: 5px;
}
.redTable.outerTableFooter {
  border-top: none;
}
.redTable.outerTableFooter .tableFootStyle {
  padding: 3px 5px;
}
/* DivTable.com */
.divTable {
  display: table;
}
.divTableRow {
  display: table-row;
}
.divTableHeading {
  display: table-header-group;
}
.divTableCell,
.divTableHead {
  display: table-cell;
}
.divTableHeading {
  display: table-header-group;
}
.divTableFoot {
  display: table-footer-group;
}
.divTableBody {
  display: table-row-group;
}
.divTableRow:hover {
  color: blue;
  font-weight: bold;
}