.clear-button { margin: 30px auto 0 40px; height: 33px; width: 175px; background-color: white; border-radius: 5px; border: 1px solid darkgrey; } .versions { display: flex; flex-direction: column; width: 25%; } .version-type { margin-top: 20px; margin-left: 40px; margin-right: auto; } .version-scroll { height: 400px; overflow-y: scroll; } .version-type-label { width: 165px; height: 25px; margin-bottom: 0; padding: 2px 5px; cursor: pointer; font-weight: bold; color: white; background-color: black; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .version { height: 25px; padding: 2px 5px; cursor: pointer; width: 152px; margin: 0; font-weight: bold; color: black; background-color: white; border-bottom: 1px solid darkgrey; border-top: 1px solid darkgrey; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .left-flex { display: flex; flex-direction: column; width: 25%; } .filters { margin-top: 30px; margin-right: 25px; margin-left: auto; } .filters select { height: 33px; width: 175px; border-radius: 5px; padding: 0 24px; background-color: #ffffff; background-image: none; border: 1px solid darkgrey; } .categories { margin-top: 30px; padding: 5px; margin-right: 20px; margin-left: auto; } .categories-label { color: white; background-color: black; padding-left: 10px; } .category-badge { display: flex; flex-direction: row; align-items: center; height: 25px; padding: 2px 5px; cursor: pointer; width: 165px; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .category-badge img { height: 23px; } .category-badge p { margin: 0 auto; font-weight: bolder; text-transform: capitalize; } .category-ghost { margin-left: 10px; } .search-main { display: flex; flex-direction: column; width: 50%; } .search-bar { position: -webkit-sticky !important; position: sticky !important; height: 2em; margin-top: 30px; margin-bottom: 15px; top: 80px; width: 100%; } .mod-info { padding-top: 5px !important; display: flex; flex-direction: row; align-items: center; } .mod-info img { height: 12px; padding: 0; } .mod-info p { font-size: 12px; padding: 0 15px 0 5px !important; } .results { width: 100%; margin: 0 auto; } .result { display: flex; height: 100px; margin: 15px auto; padding: 5px; width: 100%; flex-direction: row; align-items: center; background-color: white; } .result-image { object-fit: scale-down; padding: 0 10px 0 5px; } .result-info { display: flex; flex-direction: column; } .result-info * { padding: 0 5px 0 0; margin: 0; } .result-title { display: flex; flex-direction: row; align-items: baseline; text-decoration: none; } .result-name { text-decoration: none; color: #0b75d8; } .result-author { text-decoration: none; color: #2f92d8; } .result-badges { margin: 0 1em 20px auto; align-self: center; height: 75px; display: flex; flex-direction: column; } .result-badge { display: flex; flex-direction: row; align-items: center; height: 25px; margin: 2px 0; padding: 2px 5px; width: 155px; } .result-badge img { height: 23px; } .result-badge p { margin: 0 auto; font-weight: bolder; text-transform: capitalize; } .download-badge { background-color: limegreen; color: white; } .forge-badge { color: #e1a15a; background-color: #1e2d44; } .fabric-badge { color: #585849; background-color: #fffdd0; } .tech-badge { color: white; background-color: red; } .adventure-badge { color: white; background-color: saddlebrown; } .magic-badge { color: white; background-color: rebeccapurple; } .utility-badge { color: white; background-color: orangered; } .decoration-badge { color: white; background-color: #2f92d8; } .world-badge { background-color: yellow; } .library-badge { color: white; background-color: orange; } .cursed-badge { color: white; background-color: palevioletred; } .cursed-badge img { margin-left: 5px; } .misc-badge { color: white; background-color: deepskyblue; } .storage-badge { color: wheat; background-color: #e1a15a; } .food-badge { color: white; background-color: royalblue; } .equipment-badge { color: white; background-color: black; } .forge { padding-top: 5px !important; } .back-to-top { position: fixed; top: 80%; left: 19%; background-color: #0b75d8; text-align: center; padding: 20px; display: none; } .back-to-top img { width: 50px; height: 50px; }