.hero {
      background: #111;
      color: #fff;
      text-align: center;
      padding: 4rem 2rem;
    }
    .hero h1 {
      font-size: 2.5rem;
      margin-bottom: 1rem;
      color: gold;
    }

   
    .hero p {
      font-size: 1.2rem;
    }

    .other-services-p {
      color: skyblue;
      font-size: 1.5rem;
      font-weight: 700;
    }
    .section {
      padding: 3rem 2rem;
      max-width: 1100px;
      margin: auto;
    }
    .section h2 {
      margin-bottom: 1rem;
      color: skyblue;
    }
   
hr {
  margin-top: 15px;
  margin-bottom: 15px;
}

 /*CALL TO ACTION*/
    .call-to-action-contact{
      font-size: 2.5rem;
      margin-bottom: 10px;

    }
     .contact-button{
      background-color: #04AA6D; /* Green */
  border: none;
  border-radius: 50%;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
 margin-left: 2%;
     }
 

    /*CALL TO ACTION*/
    .contact{
      font-size: 2rem;
      margin-bottom: 10px;

    }

    .contact-h2{
      color: skyblue;
    }

    .our-work{
          color: skyblue;
    }

     .click-to-watch {
        color: yellow;
        font-size: 1.5rem;
     }

     .contact-button{
      padding: 5px 5px;
      background-color: #04AA6D; /* Green */
  border: none;
  border-radius: 50%;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 2rem;
 margin-left: 2%;
     }

     .contact a {
      color: #fff;
      text-decoration: none;
     }

     .start-project{
      color: yellow;
      font-size: 1.5rem;
     }

     
 footer {
      background: skyblue;
      color: #000;
      text-align: center;
      padding: 1rem;
      margin-top: 3rem;
      border-radius: 20%;
     
    }
    .foot-nav{
      display: inline-block;
      font-size: .8rem;
    }

    footer {
      background: skyblue;
      color: #000;
      text-align: center;
      padding: 1rem;
      margin-top: 3rem;
      border-radius: 20%;
     
    }
    .foot-nav{
      display: inline-block;
      font-size: .8rem;
    }

    @media (max-width: 1000px) {
  .welcome-heading {
    display: none;
  }

 }

 @media (max-width: 850px) {
  
  }

 
/* MOBILE */

    @media (max-width: 766px) {
      header {
        flex-direction: column;
        align-items: stretch;
      }
      .header-top {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
      }
      .header-left {
        flex-direction: row;
        align-items: center;
      }

       .welcome-heading {
        margin-top: 1rem;
        text-align: center;
        font-size: 1rem;
      }
      .menu-toggle {
        display: flex;
      }

      .contact-button{
        font-size: .15rem;
        width: 50%;
      }
    }

    @media (max-width: 1000px) {
  .welcome-heading {
    display: none;
  }

 }

 @media (max-width: 850px) {
  
  }

 
    @media (max-width: 766px) {
      header {
        flex-direction: column;
        align-items: stretch;
      }
      .header-top {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
      }
      .header-left {
        flex-direction: row;
        align-items: center;
      }
       
       .click-to-watch {
        font-size: 1rem;
      
      

    }
       .welcome-heading {
        margin-top: 1rem;
        text-align: center;
        font-size: 1rem;
    
    /*CALL TO ACTION*/
    }
     .contact-button{
      font-size: 1.5rem;
      margin-left: 0%;

     }

    .start-project{
      font-size: 1.2rem;
    }
      
    }

  @media (max-width: 650px) {
    .hero h1{ 
      font-size: 1.5rem;
    }

    .contact-button{
      font-size: 1rem;
    }

    .contact a {
      font-size: 1.5rem;

   }


  }

  @media (max-width: 450px) {
    .hero h1{ 
      font-size: 1.2rem;
  }

  .contact{
    font-size: 1.5rem;
  }
footer { font-size: .8rem;}

      }
 