@import url('https://fonts.googleapis.com/css2?family=Montserrat+Alternates:wght@300;400;500;600;700;800;900');

body {
    font-family: 'Montserrat Alternates', sans-serif;  
    background: #1B1B1C;
  }
  
  #colourcontainer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    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;
  }

  .paranoia-left{
    background-color: #EA52F8;
  }

  .paranoia-right{
    background-color: #0066FF;
  }

  
  .lime-left{
    background-color: #799F0C;
  }
  
  .lime-right{
    background-color: #FFE000;
  }

  
  .deep-left{
    background-color: #191654;
  }
  
  .deep-right{
    background-color: #43C6AC;
  }
   
  
  .cheek-left{
    background-color: #FF886A;
  }
  
  .cheek-right{
    background-color: #FCF6CF;
  }


  .neon-left{
    background-color: #8C366C;
  }

  
  .neon-right{
    background-color: #6E64E7;
  }


  .diamante-left{
    background-color: #0F3443;
  }

  .diamante-right{
    background-color: #34E89E;
  }


  .pimp-left{
    background-color: #0F0C29;
  }

  .pimp-right{
    background-color: #302B63;
  }
  
  .info {
    background: #36AE7C;
    float: left;
    width: 100%;
    padding: 20px 20px 15px 20px;
  }
  
  .colour-name {
    font-size: 25px;
    font-weight: 700;
    color: #FFFFFF;
    text-transform: uppercase;
    letter-spacing: 4px;
    margin: 0 0 4px 0;
  }
  
  .colour-left {
    font-size: 16px;
    font-weight: 400;
    color: #000000;
    float: left;
    margin: 0 20px 0 0;
  }
  
  .colour-right {
    font-size: 16px;
    font-weight: 400;
    color: #000000;
    float: left;
    margin: 0;
  }