/*---------------------------------
  -- INSPIRED BY / Aves UI Kit Color Palette --
  -- https://dribbble.com/shots/1706500-Aves-UI-Kit-Color-Palette --
-----------------------------------*/

body {
  background: #1B1B1C;
}

.container {
  width: 600px;
  margin: 0 auto;
  margin-top: 10%;
}

.colour-box {
  float: left;
  width: 280px;
  margin: 0 20px 20px 0;
  border-radius: 5px;
  overflow: hidden;
}

.color-box.last {
  margin-right: 0;
}

.colour-palette {
  float: left;
  width: 50%;
  height: 100px;
}

.teal-left {
  background: #A0CECB;
}

.teal-right {
  background: #7DB1B1;
}

.straw-left {
  background: #E8CE4D;
}

.straw-right {
  background: #C0C341;
}

.plum-left {
  background: #8067B7;
}

.plum-right {
  background: #6A50A7;
}

.ruby-left {
  background: #D8334A;
}

.ruby-right {
  background: #BF263C;
}

.info {
  background: #3C3B3D;
  float: left;
  width: 100%;
  padding: 20px 20px 15px 20px;
}

.colour-name {
  font-family: Arial;
  font-size: 20px;
  font-weight: 400;
  color: #FFFFFF;
  text-transform: uppercase;
  letter-spacing: 4px;
  margin: 0 0 4px 0;
}

.colour-left {
  font-family: Arial;
  font-size: 16px;
  font-weight: 400;
  color: #808080;
  float: left;
  margin: 0 20px 0 0;
}

.colour-right {
  font-family: Arial;
  font-size: 16px;
  font-weight: 400;
  color: #808080;
  float: left;
  margin: 0;
}