@layer responsive {
  @media screen and (min-width: 480px) {
    /***************
    Two Column Layout
    ****************/

    #primary {
      width: 50%;
      float: left;
    }

    #secondary {
      width: 40%;
      float: right;
    }
    /***************
    3 * 5 = 15
    100%-15% = 85%
    85 / 3 = 28.33333333333%
    ****************/

    /***************
    PAGE : PORTFOLIO
    ****************/

    #gallery li {
      width: 28,3333%;
      align-content: right;
    }

    #gallery li:nth-child(3n) {
      clear: left;
    }
  }

  @media screen and (min-width: 660px) {

    /***************
    HEADER
    ****************/

    nav {
      background: none;
      text-align: center;
      font-size: 1.125em;
    }

    h1 {
      font-size: 2em;
    }
    h2 {
      font-size: 0.825em
      margin-botton:20px;
    }
    header {
      border-bottom: 7.5px solid #74A2BE;
      margin-bottom: 60px;
    }
  }
}