:root { --light-blue: #6A9CFF; --dark-blue: #000099; --light-pink: #FF4F88; --dark-pink: #7E5E69; --white: #FFFFFF; --black: #000000; } body { } .app-headings { font-size: 24px; } .background { background-color: none; } .container-fluid { min-height: 92vh; } i.fas, i.fab { display: inline-block; margin-right: 0.3rem; } /* Categories */ .category-tile { cursor: pointer; } .category-tile:hover { color: var(--white); background-color: var(--light-blue); border-radius: 5px; } /* Cards */ .app-category { background-color: var(--light-blue); color: var(--white); } .card-description { width: 95%; padding: 0em; margin: auto; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .card.filter { margin-bottom: 0.8rem; } .footer { background-color: none; border: none; padding: 0.1em 0.75em; text-align: center; width: 85%; margin: 0 auto; height: 10%; } .card-img-top { width: 100%; height: 16vw; object-fit: cover; } .smaller-card { border: 1px solid var(--dark-pink); border-radius: 20px; overflow: hidden; } .recommended-card { } .title-container { text-align: center; } .title { color: var(--dark-blue); } /* Search bar*/ .search-bar-container { margin: 2em; display: flex; flex-flow: row wrap; align-items: center; } .search-bar-input, .search-dropdown { margin: 0.5em; height: calc(1.5em + .75rem + 2px); background-color: var(--white); border: 1px solid var(--dark-pink); border-radius: .5rem; } .search-bar-input { width: 30rem; } .search-dropdown { width: 10rem; } /* Navbar */ .navbar-text { color: var(--dark-blue); text-align: center; } .navbar { margin: auto; background-color: var(--light-pink); } @media (min-width: 768px) { .card-body p { height: 2.5rem; } } @media (max-width: 768px) { .card-body p { } }