.card-content { display: flex; justify-content: center; align-items: center; } .actions { margin-left: auto; } .more-horiz { font-size: 28px; color: #aaaaaa; } .more-icon :hover { color: #00b29f; } .menu-item { width: 248px; } .dmp-info { display: flex; flex-direction: column; // margin: 2em 2em; padding: 1em 1em; } .card-subtitle { font-size: 14px; font-weight: 700; color: black; text-transform: uppercase; margin-top: 0; margin-bottom: 1rem; } .gray-container { letter-spacing: 5px; color: #aaaaaa; } .grant-item, .researchers { display: flex; flex-direction: column; border: 2px solid #f2f2f2; margin-right: 2em; margin-top: 2em; padding: 0.5em; } .researchers-title { width: 120px; color: #089dbb; background-color: white; padding: 0px 10px; margin-top: -16px; cursor: default; text-transform: uppercase; } .container-header { display: flex; align-items: baseline; margin-top: 0px; text-transform: uppercase; cursor: pointer; } .container-header p { letter-spacing: 5px; color: #aaaaaa; padding-top: 10px; margin-bottom: 0px; } .container-header :hover { color: #00b29f; } .dataset-card { display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; border-radius: 6px; color: #333333; background: #fff; width: 100%; min-height: 90%; max-height: 90%; margin-top: 1em; margin-bottom: 1em; cursor: pointer; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.14); } .dataset-card h4 { padding-left: 1em; margin: 1em 1.5em; } .show-more { background-color: #ffffff00; color: #00b29f; font-weight: 700; justify-self: center; } .visit-website { background-color: #00b29f; color: #ffffff; } .draft-bookmark { color: #e7e6e6; display: inline; position: absolute; margin-top: 0.5em; margin-left: 0.5em; } .finalized-bookmark { color: #08bd63; // color: #92d050; display: inline; position: absolute; margin-top: 0.5em; margin-left: 0.5em; } h4 span { color: #089dbb; font-weight: 600; text-transform: uppercase; } .chip { padding: 0.1em 1em; margin-top: auto; margin-bottom: 1em; margin-left: 2.5em; margin-right: 2.5em; border-radius: 10em; background-color: #0d7489; // background-color: rgba(0, 112, 192, 1); // background-color: rgb(70, 135, 230); color: #fff; text-transform: uppercase; font-weight: 500; max-width: 160px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .avatar { padding: 0.1em 1em; margin: 0.5em; border-radius: 10em; background-color: #eeeeee; color: black; max-width: 160px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .datasets-counter { display: flex; cursor: pointer; } .datasets-counter :hover { color: #00b29f !important; } .total-info { text-transform: uppercase; } .desc { position: relative; overflow: hidden; height: 80px; font-size: 14px; padding-top: 15px; margin-bottom: 30px; cursor: default; } .desc:after { content: ""; text-align: right; position: absolute; bottom: 0; right: 0; width: 70%; height: 1.4em; background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 50%); }