.mainpage-header { padding-top: 37.3px; padding-right: 39px; padding-left: 21px } .mainpage-body { padding-top: 20px } .homeH1 { font-size: 52px; font-weight: 300; text-align: center; color: #2d3640; margin-top: 128px } .homeH1 span { font-weight: 500 } .header-info { font-size: 22px; font-weight: 300; line-height: 1.33; text-align: center; color: #8b95a1; margin-top: 30px; margin-bottom: 45px } .get-started-body { transition: .5s; margin: auto; border-radius: 2px; background-color: #fff; display: flex; justify-content: center; align-items: center; position: relative } @media screen and (max-width: 1600px) { .get-started-body { width:825px; height: 97.5px } .get-started-input { width: 467.25px; height: 52.5px } .get-started-button { width: 250px; height: 52.5px } .get-started-right { top: 48.75px } } @media screen and (min-width: 1600px) { .get-started-body { width:945px; height: 130px } .get-started-input { width: 623px; height: 70px } .get-started-button { width: 233px; height: 70px } .get-started-right { top: 65px } } .get-started-input { border-radius: 2px; background-color: #fff; border: 1px solid #bfc8d2; font-size: 18px; text-align: left; margin: 0 30px; color: #a1a9a9; padding: 0; padding-left: 22px } .get-started-right { position: absolute; display: flex; right: -220px; align-items: center } .get-started-button { border-radius: 2px; background-image: linear-gradient(45deg,#e63262,#fd4056); font-size: 20px; font-weight: 500; text-align: center; color: #fff; margin: 0 30px 0 0 } .get-started-button:hover { background-image: linear-gradient(45deg,#e63262,#e63262) } .mainpage-illustration { padding-bottom: 80px; padding-top: 30px } .mainpage-illustration h1 { font-size: 42px; font-weight: 300; text-align: center; color: #2d3640; padding-bottom: 11px } .illustration-body { display: flex; flex-direction: row; justify-content: center } .illustration-inner { display: flex; flex-direction: column; justify-content: center; align-items: center } .illustration-main-paragraph { font-size: 24px; font-weight: 600; text-align: center; color: #2d3640; margin-top: 22px } .illustration-paragraph { font-size: 18px; font-weight: 300; line-height: 1.44; text-align: center; color: #8b95a1; word-break: break-word; width: 370px; height: 152px; margin-top: 21px } .mainpage-learnmore-div,.mainpage-learnmore-div:hover { width: 220px; height: 50px; border-radius: 2px; border: 1px solid rgba(75,79,82,.2); margin: auto } .mainpage-learnmore-div a { font-size: 16px; font-weight: 500; color: #2d3640; display: flex; justify-content: center; align-items: center; height: 50px; text-decoration: none } .mainpage-marketplace-body { background-color: #f4f5f7; padding-top: 52px; padding-bottom: 60px } .mainpage-marketplace-body h1 { font-size: 42px; font-weight: 300; text-align: center; color: #2d3640; padding-bottom: 20px } .marketplace-gigs-container { margin: 0 auto; width: 1170px; text-align: center } .marketplace-bottom-div { text-align: center } .mainpage-bottom { background-image: linear-gradient(79deg,rgba(230,50,98,.9),rgba(253,64,86,.9)); overflow: hidden; position: relative; height: 158px; padding-top: 119px; padding-bottom: 119px } .mainpage-bottom h1 { font-size: 42px; font-weight: 300; color: #fff; padding-bottom: 30px; margin: auto; text-align: center } .mainpage-bottom-button-div { margin: auto; position: relative; width: 270px; height: 70px } .mainpage-bottom-button { width: 270px; height: 70px; border-radius: 2px; background-color: #fff; font-size: 20px; font-weight: 500; color: #2d3640; border: none } .mainpage-bottom-button:hover { background-color: #f6f6f6!important } .bottom-right { position: absolute; display: flex; align-items: center; top: 30px; right: -215px } .app-logo { width: 120px; height: 29px } .morenmore { border-radius: 2px; border: 1px solid rgba(75,79,82,.2); font-size: 16px; font-weight: 500; color: #2d3640; width: 220px; height: 50px } .morenmore:hover { border-radius: 2px; border: 1px solid rgba(75,79,82,.2)!important; font-size: 16px; font-weight: 500; color: #2d3640!important; width: 220px; height: 50px; background: #fff!important }