@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.3/font/bootstrap-icons.css");
    @import url('https://fonts.googleapis.com/css2?family=Lato:wght@300&family=Playfair+Display:wght@400;500;900&display=swap');
    
    body{
      background-color: #f4f4ed;
      font-family: 'Lato', sans-serif;
    }
    a{text-decoration: none;
    color: black;}
    h1,h2,h3{
      font-family: 'Playfair Display', serif;
    }
    H4{font-family: 'Lato', sans-serif;}
    
    footer{
      background-color: #000;
      padding: 50px;
      color: #d4d4d4;
    }
    hr{
      margin: 50px 0;
    }
    a:hover{
      color: black;
    }
    .portfolio-right{
      background-color: white;
      padding:  100px;
      margin-left: -120px;
      /* margin-top: 130px; */
      border: 1px solid white;
      transition: 0.4s;
    
    }
    .portfolio-right:hover{
      background-color: #f4f4ed;
      border: 1px solid black;
    }
    
    .btn-portfolio{
      background-color: black;
      padding: 30px;
      color: white;
      font-size: 20px;
      margin-top: -50px;
      border: 1px solid black;
      display: flex;
      justify-content: left;
      align-items: center;
      transition: 0.4s;
      flex: 1;
    }
    .btn-portfolio:hover{
      background-color: #f4f4ed;
    
      color: black;
    }
    h1{
      padding-top: 100px;
      margin-bottom: 50px;
      font-size: 36px;
    }
    h2{
      font-size: 36px;
      font-weight: 900;
      margin-bottom: 50px;
      text-transform: uppercase;
    }
    footer h1{
      padding: 0;
      margin: 0;
      margin-top: 10px;
    }
    h4{
      font-size: 14px;
      font-weight: 300;
      text-transform: uppercase;
    }
    h3{
      font-size: 36px;
    }
    .portfolio-left{
      background-color: white;
      padding:  100px;
      margin-right: -120px;
      margin-top: 130px;
    }
    img{
      padding-bottom: 50px;
      transition: 0.2s;
    
    }
    img:hover{
      opacity: 0.8;
    }
    .project-link{
      font-size: 20px;
      text-transform: uppercase;
      font-family: 'Playfair Display', serif;
      padding-right: 20px;
      margin: 0;
    }
    
    @media (max-width: 991.98px) {
    
    
      .portfolio-right{
        margin-top: 0;
        margin-left: 0;
        padding: 80px;
        padding-left: 30px;
        padding-top: 60px;
    
      }
      img{
        padding-bottom: 0;
        margin: auto 0;
    
      }
    }
    #reviews-section {
          background-color: white;
          padding: 80px 50px ;
         
          padding-bottom: 130px;
  
      }
   #reviews-section h2 {
      text-align: center;
      margin-bottom: 50px;
   }
      #reviews-slideshow {
          text-align: center;
          font-size: 18px;
      }
      #review-text{
		font-family: 'Playfair Display', serif;

          font-size: 1.75em;
      }
      #review-author {
          font-style: italic;
          margin-top: 10px;
      }
      #reviews-navigation {
             display: flex;
      text-align: center;
     
      width: 470px;
      justify-items: center;
      align-items: center;
      font-family: 'Playfair Display', serif;
      align-content: center;
      margin: 0 auto;
       margin-top: 20px;
       flex-wrap: wrap;
      }
      #reviews-navigation > button {
      flex: 1;
  }
  
      #reviews-navigation button {
          margin: 0 10px;
          padding: 20px 30px;
          display: inline-block;
      }
       #reviews-progress-bar-1, #reviews-progress-bar-2{
      height: 5px;
      width: 0%;
      margin: 0;
      padding: 0;
      background-color: black;
      transition: width 14s linear;
  }
   #reviews-progress-bar-1 {
      background-color: white;
   }