body{
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
  height: 100vh;
}

.dark{
  background-color: #282c34;
  width: 100%;
  -webkit-box-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  justify-content: space-around;
  -webkit-box-align: start;
          align-items: flex-start;
}
.black{
  background-color: #16171d;
  width: 100%;
  -webkit-box-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  justify-content: space-around;
  -webkit-box-align: end;
          align-items: flex-end;
}
.middle{
  background-color: #454952;
  height: 75px;
  width: 100%;
  -webkit-box-align: center;
          align-items: center;
}
.block{
  padding: 0 75px;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  justify-content: space-around;
}
.circle{
  height: 250px;
  position: relative;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
  justify-content: space-around;
  -webkit-box-align: center;
          align-items: center;
}

.c{
  font-weight: bold;
}

.t{
  padding: 10px;
}

.pink   { background-color: #ff6188; }
.green  { background-color: #a9dc76; }
.yellow { background-color: #ffd866; }
.orange { background-color: #fc9867; }
.violet { background-color: #ab9df2; }
.blue   { background-color: #78dce8; }

.pink-text   { color: #ff6188; }
.green-text  { color: #a9dc76; }
.yellow-text { color: #ffd866; }
.orange-text { color: #fc9867; }
.violet-text { color: #ab9df2; }
.blue-text   { color: #78dce8; }

.t1 {
  color: #282c34;
}
.t2 {
  color: #454952;
}
.t3 {
  color: #16171d;
}

/*
*   boring standards
*/

html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}