/* homepage.css */ @font-face { font-family: testFont; src: url("CoveredByYourGrace-Regular.ttf"); } /* Color */ body { /* background-color: #97a5bd */ /* background-color: #E3E3EC; */ background-color: #f8f3f1; } .top-bar { display: flex; justify-content: center; } .top-bar > img { position: relative; align-self: center; padding-left: 2.5%; padding-right: 2.5%; width: 7.5%; height: 7.5%; } .top-bar > h1 { position: relative; text-align: center; /* color: #e4c3d2; */ /* color: rgb(145, 124, 175); */ color: #516754; font-size: 6rem; font-family: testFont, sans-serif; } .body-container { display: flex; max-height: 100%; } .center-display { display: flex; flex-direction: row; justify-content: center; align-items: center; } .search-bar { display: flex; justify-content: center; font-family: "Century Gothic", sans-serif; font-weight: bold; color: #516754; } #sort { margin-right: 1em; } .search-bar > form { float: right; padding: 6px 10px; /* margin-top: 8px; margin-right: 16px; */ background: rgb(239 183 183); font-size: 17px; border: none; border-radius: 12px; } #search-btn { position: relative; align-self: center; width: 30px; height: 30px; } #recent-reviews-text { text-align: center; font-size: 4rem; color: #516754; font-family: testFont, sans-serif; } img#create-btn { position: relative; align-self: center; padding-left: 2.5%; padding-right: 2.5%; cursor: pointer; width: 10%; height: 10%; } img#create-btn-invis { opacity: 0; padding-left: 2.5%; padding-right: 2.5%; width: 10%; height: 10%; } .review-container { display: flex; position: relative; flex-wrap: wrap; justify-content: center; } .review-container > div { background-color: #f1f1f1; text-align: center; } footer { display: flex; justify-content: center; }