/* Our core Values */
.article{
    background-color: #bacbf0;
  }
  .header h1{
    font-size: 4.5rem;
  }
  .attribution { 
    font-size: 11px; text-align: center; 
  }
  .attribution a { 
    color: hsl(228, 45%, 44%); 
  }
  
  h1:first-of-type {
    font-weight: grey;
    color: rgb(7, 7, 59);
  
  }
  
  h1:last-of-type {
    color: rgb(4, 4, 56);
  }
  
  @media (max-width: 400px) {
    h1 {
        font-size: 1.5rem;
    }
  }
  
  .header {
    text-align: center;
    line-height: 0.8;
    margin-bottom: 50px;
    margin-top: 100px;
  }
  
  .header p {
    margin: 0 auto;
    line-height: 2;
    color: rgb(60, 30, 196);
  }
  
  
  .box p {
    color: rgb(42, 42, 128);
  }
  
  .box {
    border-radius: 5px;
    box-shadow: 0px 30px 40px -20px rgb(13, 61, 75);
    padding: 30px;
    margin: 20px;  
  }
  
  img {
    float: right;
  }
  
  @media (max-width: 450px) {
    .box {
        height: 200px;
    }
  }
  
  @media (max-width: 950px) and (min-width: 450px) {
    .box {
        text-align: center;
        height: 180px;
    }
    .header h1{
      font-size: 2.5rem;
    }
  }
  
  .cyan {
    border-top: 3px solid cyan;
  }
  .red {
    border-top: 3px solid red;
  }
  .blue {
    border-top: 3px solid blue;
  }
  .orange {
    border-top: 3px solid orange;
  }
  
  h2 {
    color: rgb(4, 4, 71);
    font-weight: 500;
  }
  
  
  @media (min-width: 950px) {
    .row1-container {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .row2-container {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .box-down {
        position: relative;
        top: 150px;
    }
    .box {
        width: 20%;
     
    }
    .header p {
        width: 30%;
    }
    
  }