#hero-main .main-heading {
     margin-bottom: 0;
     padding: 80px 10px;
 }

 #about {
     margin-bottom: 0;
 }

 #story-wrap {
     margin-top: 120px;
     margin-bottom: 180px;
 }

 #story-wrap .description {
     font-weight: 300;
     font-size: 20px;
     line-height: 30px;
     margin-bottom: 25px;
     text-align: center;
 }

 #hero-main img {
     position: absolute;
     left: 40vw;
     top: 0;
     width: 500px;
     z-index: 0;
 }

 #connect .inner-wrap {
     max-width: 1050px;
 }

 #connect {
     margin-top: 120px;
     background-image: url(./img/connect-card-left.svg), url(./img/connect-card-right.svg);
     background-size: auto;
     background-position: left top, right bottom;
     background-repeat: no-repeat, no-repeat;
 }

 #connect .section-heading {
     font-weight: 400;
     font-size: 50px;
     line-height: 75px;
     text-align: center;
 }

 #connect .main-description {
     font-weight: 300;
     font-size: 20px;
     line-height: 30px;
     text-align: center;
     margin: 0 auto;
 }

 #connect .heading {
     font-weight: 700;
     font-size: 30px;
     line-height: 45px;
     margin-top: 10px;
 }

 #connect .description {
     font-weight: 500;
     font-size: 25px;
     line-height: 38px;
     text-align: left;
 }

 #connect img {
     width: 47px;
 }

 #connect .one {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     grid-column-gap: 50px;
     margin-bottom: 50px;
 }

 #connect .details-card {
     height: max-content;
     padding: 30px 70px;
     background: #FFFFFF;
     border: 2px solid #C4C4C4;
     border-radius: 5px;
     transition: all .3s;
     cursor: pointer;
 }


 #connect .details-card:hover {
     background: #FFD600;
 }

 #connect .details-wrap {
     margin-top: 70px;
 }

 @media only screen and (max-width:1200px) {
     #hero-main img {
         width: 230px;
         top: 60px;
     }

     #connect .inner-wrap {
         max-width: 890px;
     }

     #connect .one {
         display: grid;
         grid-template-columns: 1fr;
         grid-column-gap: 0;
         grid-row-gap: 50px;
         margin-bottom: 50px;
     }
 }

 @media only screen and (max-width:991px) {
     #connect .inner-wrap {
         max-width: 680px;
     }

     #connect {
         background-position: left 360px, right bottom;
     }

     #contact {
         margin-top: 180px;
     }

     #footer .quote-wrap p {
         font-size: 33px;
         line-height: 47px;
         width: 100%;
     }

     #connect .heading {
         font-size: 26px;
         line-height: 35px;
     }

     #connect .description {
         font-size: 22px;
         line-height: 30px;
     }

     #connect .details-wrap {
         max-width: 500px;
         margin-left: auto;
         margin-right: auto;
     }
 }

 @media only screen and (max-width:767px) {
     #hero-main img {
         width: 160px;
         top: 20px;
         left: 230px;
     }

     #hero-main .main-heading {
         font-size: 60px;
         line-height: 70px;
     }

     #connect .inner-wrap {
         max-width: 360px;
     }

     #connect .one {
         grid-template-columns: 100%;
     }

     #connect .details-card {
         height: max-content;
         padding: 30px;
     }

     #connect .description {
         font-size: 18px;
         line-height: 25px;
     }

     #connect .heading {
         font-size: 23px;
         line-height: 28px;
     }

     #connect img {
         width: 37px;
     }

     #connect .section-heading {
         font-size: 42px;
         line-height: 50px;
     }

     #connect .one {
         grid-template-columns: 100%;
     }

     #contact {
         margin-top: 100px;
     }
 }

 @media only screen and (max-width:409px) {
     #hero-main img {
         left: 220px;
     }

     #connect .inner-wrap {
         max-width: 320px;
     }

     #connect .one {
         grid-column-gap: 0;
         grid-row-gap: 30px;
         margin-bottom: 30px;
     }
 }