@charset "UTF-8";@font-face {src: url("https://www.pocketmortys.net/templates/g5_hydrogen/custom/fonts/ubuntu-medium/Ubuntu-Medium.eot"); src: url("https://www.pocketmortys.net/templates/g5_hydrogen/custom/fonts/ubuntu-medium/Ubuntu-Medium.eot?iefix") format("eot"), url("https://www.pocketmortys.net/templates/g5_hydrogen/custom/fonts/ubuntu-medium/Ubuntu-Medium.woff") format("woff"), url("https://www.pocketmortys.net/templates/g5_hydrogen/custom/fonts/ubuntu-medium/Ubuntu-Medium.woff2") format("woff2"), url("https://www.pocketmortys.net/templates/g5_hydrogen/custom/fonts/ubuntu-medium/Ubuntu-Medium.ttf") format("truetype"); font-family: "Ubuntu"; font-weight: 500; font-style: normal; font-display: swap}

.icon-arrow-up-3,
.icon-arrow-down-3 {
    margin: 0 5px;
}

.dimension-name {
    height: 40px;
    font-family: "Ubuntu";
    display: flex;
    align-items: center;
    color: #000;
    position: relative;
    cursor: pointer;
    user-select: none;
}

.dimension-name::after {
    position: absolute;
    width: 25px;
    left: -25px;
    font-size: 12px;
    padding-left: 7px;
    content: "\f067";
    font-weight: bold;
    font-family: "Font Awesome 5 Free";
}

.dimension-name.open::after {
    position: absolute;
    width: 25px;
    left: -25px;
    font-size: 12px;
    padding-left: 7px;
    content: "\f068";
    font-weight: bold;
    font-family: "Font Awesome 5 Free";
}

.dimension-name span {
    position: relative;
    display: flex;
    align-items: center;
    z-index: 2;
    width: calc(100% - 35px);
    height: 100%;
    top: 0;
    left: 0;
    padding-left: 13px;
    font-size: 15px;
    font-weight: 500;
    white-space: nowrap;
    padding-right: 20px;
}

/** Mortyland */

.dimension-name-1 span {
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_1_left.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

.dimension-name-1 span::before {
    content: "";
    width: calc(100% - 17px);
    height: 100%;
    position: absolute;
    top: 0;
    left: 17px;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_1_tile.png);
    background-repeat: repeat-x;
    background-size: auto 40px;
    z-index: -1;
}

.dimension-name-1::before {
    content: "";
    width: 35px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_1_right.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

/** Plumbubo Prime 51b */

.dimension-name-2 span {
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_2_left.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

.dimension-name-2 span::before {
    content: "";
    width: calc(100% - 17px);
    height: 100%;
    position: absolute;
    top: 0;
    left: 17px;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_2_tile.png);
    background-repeat: repeat-x;
    background-size: auto 40px;
    z-index: -1;
}

.dimension-name-2::before {
    content: "";
    width: 35px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_2_right.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

/** Mortopia */

.dimension-name-3 span {
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_3_left.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

.dimension-name-3 span::before {
    content: "";
    width: calc(100% - 17px);
    height: 100%;
    position: absolute;
    top: 0;
    left: 17px;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_3_tile.png);
    background-repeat: repeat-x;
    background-size: auto 40px;
    z-index: -1;
}

.dimension-name-3::before {
    content: "";
    width: 35px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_3_right.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

/** GF Mortanic */

.dimension-name-4 span {
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_4_left.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

.dimension-name-4 span::before {
    content: "";
    width: calc(100% - 17px);
    height: 100%;
    position: absolute;
    top: 0;
    left: 17px;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_4_tile.png);
    background-repeat: repeat-x;
    background-size: auto 40px;
    z-index: -1;
}

.dimension-name-4::before {
    content: "";
    width: 35px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_4_right.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

/** Anime, Anatomy Park, Froopyland */

.dimension-name-premium {
    background-image: url(https://www.pocketmortys.net/media/com_pocketmortys/images/ui/dimensions/TitleBox_Premium_left.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

.dimension-name-premium span::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 8px;
    background-image: url(https://www.pocketmortys.net/media/com_pocketmortys/images/ui/dimensions/TitleBox_Premium_tile.png);
    background-repeat: repeat-x;
    background-size: auto 40px;
    z-index: -1;
}

.dimension-name-premium::before {
    content: "";
    width: 40px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url(https://www.pocketmortys.net/media/com_pocketmortys/images/ui/dimensions/TitleBox_Premium_right.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

/** Club Rick */

.dimension-name-5 span {
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_5_left.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

.dimension-name-5 span::before {
    content: "";
    width: calc(100% - 17px);
    height: 100%;
    position: absolute;
    top: 0;
    left: 17px;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_5_tile.png);
    background-repeat: repeat-x;
    background-size: auto 40px;
    z-index: -1;
}

.dimension-name-5::before {
    content: "";
    width: 35px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_5_right.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

/** Raid Reward */

.dimension-name-6 span {
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_6_left.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

.dimension-name-6 span::before {
    content: "";
    width: calc(100% - 17px);
    height: 100%;
    position: absolute;
    top: 0;
    left: 17px;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_6_tile.png);
    background-repeat: repeat-x;
    background-size: auto 40px;
    z-index: -1;
}

.dimension-name-6::before {
    content: "";
    width: 35px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_6_right.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

/** Fight Pit */

.dimension-name-7 span {
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_7_left.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

.dimension-name-7 span::before {
    content: "";
    width: calc(100% - 17px);
    height: 100%;
    position: absolute;
    top: 0;
    left: 17px;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_7_tile.png);
    background-repeat: repeat-x;
    background-size: auto 40px;
    z-index: -1;
}

.dimension-name-7::before {
    content: "";
    width: 35px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_7_right.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

/** Summer's Van */

.dimension-name-8 span {
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_8_left.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

.dimension-name-8 span::before {
    content: "";
    width: calc(100% - 17px);
    height: 100%;
    position: absolute;
    top: 0;
    left: 17px;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_8_tile.png);
    background-repeat: repeat-x;
    background-size: auto 40px;
    z-index: -1;
}

.dimension-name-8::before {
    content: "";
    width: 35px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_8_right.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

/** Moving Mortys */

.dimension-name-9 span {
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_9_left.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

.dimension-name-9 span::before {
    content: "";
    width: calc(100% - 17px);
    height: 100%;
    position: absolute;
    top: 0;
    left: 17px;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_9_tile.png);
    background-repeat: repeat-x;
    background-size: auto 40px;
    z-index: -1;
}

.dimension-name-9::before {
    content: "";
    width: 35px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_9_right.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

/** Unavailable */

.dimension-name-10 span {
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_10_left.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

.dimension-name-10 span::before {
    content: "";
    width: calc(100% - 17px);
    height: 100%;
    position: absolute;
    top: 0;
    left: 17px;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_10_tile.png);
    background-repeat: repeat-x;
    background-size: auto 40px;
    z-index: -1;
}

.dimension-name-10::before {
    content: "";
    width: 35px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url(https://www.pocketmortys.net/images/ui/dimensions/TitleBox_10_right.png);
    background-repeat: no-repeat;
    background-size: auto 40px;
}

.morty {
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    background-color: #f3f3f3;
    border: 1px solid #cfcfcf;
    width: 163px;
    user-select: none;
    position: relative;
    border-radius: 8px;
    margin-bottom: 12px;
}

.morty:not(:only-child):not(:first-child)::after {
    content: "";
    background: #f4f4f4;
    position: absolute;
    width: 12px;
    height: 14px;
    left: -13px;
    top: calc(50% - 5px);
    border-top: 1px solid #cfcfcf;
    border-bottom: 1px solid #cfcfcf;
}

.morty:nth-child(8n + 5) {
    grid-column: 4;
}

.morty:nth-child(8n + 5)::before {
    content: "";
    background: #f4f4f4;
    position: absolute;
    width: 14px;
    height: 12px;
    top: -13px;
    left: calc(50% - 5px);
    border-left: 1px solid #cfcfcf;
    border-right: 1px solid #cfcfcf;
}

.morty:nth-child(8n + 6) {
    grid-column: 3;
}

.morty:nth-child(8n + 7) {
    grid-column: 2;
}

.morty:nth-child(8n + 5):last-child::after,
.morty:nth-child(8n + 6):last-child::after,
.morty:nth-child(8n + 7):last-child::after {
    content: unset;
}

.morty.hide-morty {
    visibility: hidden;
    height: 0;
    margin: 0;
    padding: 0;
    width: 0;
    border: 0 !important;
    order: 999;
}

.morty.hide-morty + .morty::after {
    display: none;
}

.morty.hide-morty ~ .morty {
    grid-column: unset !important;
}

.morty_info {
    display: flex;
    justify-content: space-between;
    flex-grow: 1;
    max-height: 37px;
}

.morty_number,
.morty_name {
    font-size: 11px;
    padding: 0 0 5px;
    font-weight: 600;
}

.morty_number {
    padding-right: 5px;
}

.morty_name {
    flex-grow: 1;
}

.morty_icons {
    display: grid;
    grid-template-columns: 1fr 23px 1fr;
    grid-template-rows: auto auto;
}

.morty_image {
    grid-row: span 2;
    display: flex;
    align-items: center;
}

.morty_rarity,
.morty_type {
    display: flex;
    align-items: center;
    justify-content: center;
}

.morty_rarity > span,
.morty_type > span {
    height: 18px;
    width: 18px;
    padding: 0;
    line-height: 18px;
}

.morty_rarity > span {
    margin-bottom: 5px;
}

.morty_type > span {
    margin-top: 4px;
}

.morty_dimensions {
    font-size: 11px;
    padding-bottom: 5px;
    flex-grow: 1;
}

.morty:not(:only-child) .morty_dimensions:last-child {
    min-height: 43px;
}

.morty_evos {
    display: flex;
    flex-wrap: nowrap;
    cursor: pointer;
}

.morty_evos > span {
    display: block;
    height: 22px;
    flex-grow: 1;
    border: 1px solid #b4b4b4;
    border-left: none;
}

.morty_evos > span.filled {
    background-color: #eebcf8;
    border-color: #d78ce5;
}

.morty_evos > span:first-child {
    border-radius: 4px 0 0 4px;
    border-left: 1px solid #b4b4b4;
}

.morty_evos > span.filled:first-child {
    border-left: 1px solid #d78ce5;
}

.morty_evos > span:last-child {
    border-radius: 0 4px 4px 0;
}

.morty_status {
    grid-row: span 2;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.morty_status span {
    height: 35px;
    width: 35px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

/* 0 - Unseen */

.morty_status .status {
    background-color: #fcfcfc;
    border: 1px solid #b4b4b4;
    margin: 5px 0 5px 5px;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    cursor: pointer;
}

.status0 .status > span {
    background-image: url(https://www.pocketmortys.net/images/ui/morty-chips.png);
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: top 0 center;
}

.status0 .status:hover > span {
    background-image: url(https://www.pocketmortys.net/images/ui/morty-chips.png);
    background-size: 42px;
    background-repeat: no-repeat;
    background-position: top -168px center;
    width: 42px;
    height: 42px;
}

/* 1 - Caught previously, but don't currently have - Blue */

.morty.status1 {
    background-color: #d8eef3;
    border: 1px solid #a2c9d2;
}

.status1 .status > span {
    background-image: url(https://www.pocketmortys.net/images/ui/morty-chips.png);
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: top -35px center;
}

.status1 .status:hover > span {
    background-image: url(https://www.pocketmortys.net/images/ui/morty-chips.png);
    background-size: 42px;
    background-repeat: no-repeat;
    background-position: top -210px center;
    width: 42px;
    height: 42px;
}

.status1 .morty_status .status {
    background-color: #e0f7fc;
    border: 1px solid #9cc3cd;
}

/* 2 - Caught, currently have, combining- Yellow */

.morty.status2 {
    background-color: #f2eed8;
    border: 1px solid #d5cea8;
}

.status2 .status > span {
    background-image: url(https://www.pocketmortys.net/images/ui/morty-chips.png);
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: top -70px center;
}

.status2 .status:hover > span {
    background-image: url(https://www.pocketmortys.net/images/ui/morty-chips.png);
    background-size: 42px;
    background-repeat: no-repeat;
    background-position: top -252px center;
    width: 42px;
    height: 42px;
}

.status2 .morty_status .status {
    background-color: #fcf9e9;
    border: 1px solid #cfc79c;
}

/* 3 - Caught, done combining - Green */

.morty.status3 {
    background-color: #d8f2df;
    border: 1px solid #a2d2af;
}

.status3 .status > span {
    background-image: url(https://www.pocketmortys.net/images/ui/morty-chips.png);
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: top -105px center;
}

.status3 .status:hover > span {
    background-image: url(https://www.pocketmortys.net/images/ui/morty-chips.png);
    background-size: 42px;
    background-repeat: no-repeat;
    background-position: top -294px center;
    width: 42px;
    height: 42px;
}

.morty:last-child.status3 .status:hover > span {
    background-image: url(https://www.pocketmortys.net/images/ui/morty-chips.png);
    background-size: 42px;
    background-repeat: no-repeat;
    background-position: top -336px center;
    width: 42px;
    height: 42px;
}

.status3 .morty_status .status {
    background-color: #eafff0;
    border: 1px solid #9bcda8;
}

.sticky-bar {
    position: sticky;
    top: 50px;
    padding-top: 15px;
    margin-top: -15px;
    width: 100%;
    background: linear-gradient(#eaeaea, #eaeaea), url(https://www.pocketmortys.net/images/ui/gray-mask.png);
    background-size: 1px calc(100% - 15px), 1px 15px;
    background-position: top left, bottom left;
    background-repeat: repeat-x, repeat-x;
    padding-bottom: 15px;
    padding-right: 15px;
    z-index: 1;
}

.anchor {
    display: block;
    position: relative;
    top: -105px;
    visibility: hidden;
}

#suggestions-wrapper {
    position: sticky;
    right: 0;
    top: 50px;
    width: 235px;
    margin-right: -10px;
    padding-top: 15px;
    padding-left: 10px;
    background-color: #eaeaea;
    z-index: 1;
}

#suggestions-wrapper.no-suggestions {
    display: none;
}

.suggestions {
    overflow: auto;
    height: calc(100vh - 85px);
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.suggestions::-webkit-scrollbar {
    display: none;
}

#suggestions-wrapper.no-suggestions {
    z-index: 2;
}

#checklist-wrapper {
    position: relative;
    z-index: 0;
    width: 100%;
}

#suggestion-text,
#filters-text,
#top-text > div {
    font-size: 13px;
    margin-bottom: 6px;
}

#top-text {
    display: flex;
}

#top-text > div:not(:last-child) {
    margin-right: 20px;
}

#filters-text {
    width: 110px;
}

#suggestion-text:hover,
#filters-text:hover {
    color: #000;
}

#marking {
    display: flex;
    height: 55px;
    line-height: 50px;
    z-index: 0;
    position: relative;
}

#marking > div {
    font-weight: 600;
}

#marking .mark-options,
#suggestion-text,
#filters-text {
    cursor: pointer;
    user-select: none;
}

#marking .mark-options {
    margin-top: -12px;
}

#marking .mark-options > span {
    margin-left: 10px;
    display: none;
    font-weight: normal;
}

#marking .mark-options > span:hover {
    color: #000;
    text-decoration: underline;
}

#marking .mark-options:hover > span {
    display: inline-block;
}

.dimension-counts {
    background-color: #eaeaea;
    padding-left: 25px;
    width: 100%;
}

.suggestions {
    position: relative;
}

#suggestion-text {
    display: flex;
    text-align: center;
    margin: 0;
    border-radius: 5px;
    height: 37px;
    position: relative;
    align-items: center;
    justify-content: center;
    border: var(--btn-secondary-border);
    background: var(--breadcrumb);
    width: calc(100% - 25px);
    margin-left: 25px;
    margin-bottom: 10px;
    width: 210px;
}

.dimension-count {
    font-size: 13px;
    padding: 6px 0;
}

#all-entries,
#living-deck {
    color: #686868 !important;
}

#all-entries {
    margin-right: 10px;
}

.breakdown {
    display: none;
    max-height: 220px;
    overflow-y: auto;
    margin-bottom: 10px;
}

.breakdown.open {
    display: flex;
}

.morty-list {
    font-size: 12px;
    line-height: 20px;
}

.morty-list > span {
    display: flex;
    flex-direction: column;
    padding-left: 10px;
}

.filter-category {
    display: inline-flex;
    align-items: center;
    position: relative;
    color: #686868;
    background: linear-gradient(to bottom, #fafafa 0%, #f3f3f3 100%);
    border: 1px solid #cfcfcf;
    text-shadow: 0 0 0 transparent, 1px 1px 1px rgba(255, 255, 255, 0.65);
    cursor: pointer;
    user-select: none;
    font-size: 13px;
}

.filter-category > strong {
    padding: 5px 10px;
    display: inline-flex;
    max-height: 30px;
    align-items: center;
}

.filter-category:hover {
    background: #fafafa;
}

.filter-category:hover .filter-options {
    display: block;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
    z-index: 5;
}

.filter-category:hover > strong {
    z-index: 6;
    position: relative;
    box-shadow: 0 1px 0 #fafafa;
}

.filter-options {
    position: absolute;
    top: 100%;
    left: -1px;
    background-color: #fafafa;
    display: none;
    border: 1px solid #cfcfcf;
    white-space: nowrap;
}

.filter-options.align-right {
    left: unset;
    right: -1px;
}

.filter-category:hover .filter-options.align-right {
    box-shadow: -2px 2px 2px rgba(0, 0, 0, 0.1);
}

.filter-options > div {
    padding: 4px 10px;
    display: flex;
    align-items: center;
}

.filter-options > div > strong,
.filter-options > div > span {
    opacity: 0.65;
    line-height: 18px;
    padding-top: 0 !important;
}

.filter-options > div.selected > strong,
.filter-options > div.selected > span {
    opacity: 1;
    padding-top: 0;
}

.filter-options > div > i {
    line-height: 18px;
}

.filter-options > div > i::before {
    content: "\f0c8";
    font-family: "Font Awesome 5 Free";
    font-size: 14px;
    line-height: 14px;
    padding-right: 10px;
    position: relative;
    font-style: normal;
    top: 1px;
}

.filter-options > div.selected > i::before {
    content: "\f14a";
}

.filter-options > div > strong {
    margin-right: 10px;
}

.filter-options > div > span {
    text-align: right;
    margin-left: auto;
}

.filter-options > div:hover {
    color: #000;
}

.filter-options > div:hover > i {
    color: #084856 !important;
}

/* Responsive */

.mode-select-wrapper {
    display: flex;
    align-items: flex-start;
    width: 100%;
    flex-wrap: wrap;
    row-gap: 10px;
    column-gap: 30px;
    justify-content: space-between;
    margin-bottom: 10px;
}

.mode-select-wrapper > div {
    gap: 5px;
}

.mode-select-wrapper > .mode-select > div {
    margin: 0;
    font-size: 13px;
}

.mode-select-wrapper > .mode-select button {
    background: #545959;
    color: #fff;
    text-shadow: 1px 0px 1px rgba(0, 0, 0, 0.65), 1px 1px 0px rgba(0, 0, 0, 0.85);
    border: 1px solid #4b4b4b;
    font-family: "opensans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
    font-weight: 700;
    font-size: 11px;
    line-height: 19px;
    text-align: center;
    vertical-align: middle;
    padding: 5px 12px;
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    text-transform: uppercase;
    outline: none;
    position: relative;
    margin: 0;
}

.mode-select-wrapper > .mode-select button:hover {
    background: #656b6e;
}

#gamemode {
    grid-area: gamemode;
    order: 0;
    gap: 0;
    margin: 0;
}

#statustoggler {
    grid-area: statustoggler;
    order: 3;
    gap: 0;
    margin: 0;
}

#gamemode > div:last-child:not(.selected),
#statustoggler > div:last-child:not(.selected) {
    border-left: 0;
}

#gamemode > div:first-child:not(.selected),
#statustoggler > div:first-child:not(.selected) {
    border-right: 0;
}

#filters {
    grid-area: filters;
    order: 1;
    margin: 0;
}

#sorts {
    grid-area: sorts;
    order: 2;
    margin: 0;
}

#buttons {
    grid-area: buttons;
    order: 4;
    margin: 0 0 0 auto;
}

.sorted-name .morty {
    order: -1;
    grid-column: unset !important;
}

.no-suggestions ~ .sorted-name #empty-cells {
    display: none;
}

.sorted-name .morty::after {
    display: none;
}

.page-wrapper {
    display: flex;
}

.page-left {
    flex-grow: 1;
}

.page-right {
    flex-grow: 0;
    flex-shrink: 1;
}

@media only all and (max-width: 849px) {
    .page-wrapper {
        display: flex;
        flex-direction: column;
    }

    .page-wrapper .sticky-bar {
        order: 0;
        width: 100%;
        top: -190px;
    }

    .page-wrapper #suggestions-wrapper {
        order: 1;
        width: 100%;
        position: relative;
        top: -5px;
        padding: 0;
        margin: 0;
    }

    .page-wrapper #suggestion-text {
        padding-bottom: 10px;
    }

    .page-wrapper #checklist-wrapper {
        order: 1;
        width: 100%;
    }

    .page-wrapper #sorts {
        display: inline-flex;
    }

    .page-wrapper #sorts > div:not(:last-child) {
        margin-right: 6px;
    }

    .page-wrapper #sorts .filter-category:hover > strong {
        min-width: 100%;
    }

    .page-wrapper #sorts .filter-category:hover .filter-options {
        min-width: calc(100% + 1px);
    }

    .page-wrapper #buttons {
        justify-content: space-evenly;
    }

    .page-wrapper #message-text {
        width: 100%;
    }

    .page-wrapper .dimension-counts {
        padding-left: 35px;
        padding-right: 25px;
        position: relative;
    }

    .morty {
        width: 165px;
        margin-bottom: 10px;
    }

    .morty:not(:only-child):not(:first-child)::after {
        width: 10px;
        left: -11px;
    }

    #top-text {
        flex-direction: column;
    }

    #filters-text {
        order: 3;
    }

    /* 2 Columns */
    .morty_group,
    #checklist-wrapper.sorted-name {
        display: grid;
        grid-template-columns: repeat(2, 165px);
        grid-auto-rows: auto;
        grid-auto-flow: row dense;
        grid-column-gap: 12px;
    }

    .sorted-name #empty-cells {
        display: none;
    }

    .morty_group > div:nth-child(4n + 3) {
        grid-column: 2;
    }

    .morty_group > div:nth-child(4n + 4) {
        grid-column: 1;
    }

    .morty:not(:only-child):nth-child(3)::before,
    .morty:not(:only-child):nth-child(5)::before {
        content: "";
        background: #f4f4f4;
        position: absolute;
        width: 10px;
        height: 10px;
        left: calc(50% - 5px);
        top: -11px;
        border-top: none;
        border-bottom: none;
        border-left: 1px solid #cfcfcf;
        border-right: 1px solid #cfcfcf;
    }

    .morty.hide-morty ~ .morty::before {
        display: none;
    }

    .morty:not(:only-child):nth-child(3):last-child::after,
    .morty:not(:only-child):nth-child(4)::after,
    .morty:not(:only-child):nth-child(5)::after {
        display: none;
    }
}

@media only all and (min-width: 850px) and (max-width: 1149px) {
    /* 3 Columns */
    .morty_group,
    #checklist-wrapper.sorted-name {
        display: grid;
        grid-template-columns: repeat(3, 163px);
        grid-auto-rows: auto;
        grid-auto-flow: row dense;
        grid-column-gap: 12px;
    }

    .sorted-name #empty-cells {
        grid-row: 1 / span 2;
        grid-column: 2 / span 2;
    }

    .morty_group > div:nth-child(6n + 4) {
        grid-column: 3;
    }

    .morty_group > div:nth-child(6n + 5) {
        grid-column: 2;
    }

    .morty_group > div:nth-child(6n + 6) {
        grid-column: 1;
    }

    .morty:not(:only-child):nth-child(4)::before {
        content: "";
        background: #f4f4f4;
        position: absolute;
        width: 10px;
        height: 6px;
        left: calc(50% - 5px);
        top: -7px;
        border-top: none;
        border-bottom: none;
        border-left: 1px solid #cfcfcf;
        border-right: 1px solid #cfcfcf;
    }

    .morty.hide-morty ~ .morty::before {
        display: none;
    }

    .morty:not(:only-child):nth-child(6):last-child::after {
        display: none;
    }
}

@media only all and (min-width: 1130px) and (max-width: 1365px) {
    /* 5 Columns */
    .morty_group,
    #checklist-wrapper.sorted-name {
        display: grid;
        grid-template-columns: repeat(4, 163px);
        grid-auto-rows: auto;
        grid-auto-flow: row dense;
        grid-column-gap: 12px;
    }

    .sorted-name #empty-cells {
        grid-row: 1 / span 2;
        grid-column: 3 / span 2;
    }

    .morty_group > div:nth-child(8n + 5) {
        grid-column: 4;
    }

    .morty_group > div:nth-child(8n + 6) {
        grid-column: 3;
    }

    .morty_group > div:nth-child(8n + 7) {
        grid-column: 2;
    }

    .morty_group > div:nth-child(8n + 8) {
        grid-column: 1;
    }

    .morty:not(:only-child):nth-child(5)::before {
        content: "";
        background: #f4f4f4;
        position: absolute;
        width: 10px;
        height: 6px;
        left: calc(50% - 5px);
        top: -7px;
        border-top: none;
        border-bottom: none;
        border-left: 1px solid #cfcfcf;
        border-right: 1px solid #cfcfcf;
    }

    .morty.hide-morty ~ .morty::before {
        display: none;
    }

    .morty:not(:only-child):nth-child(6):last-child::after {
        display: none;
    }
}

@media only all and (min-width: 1366px) and (max-width: 1535px) {
    /* 5 Columns */
    .morty_group,
    #checklist-wrapper.sorted-name {
        display: grid;
        grid-template-columns: repeat(5, 163px);
        grid-auto-rows: auto;
        grid-auto-flow: row dense;
        grid-column-gap: 12px;
    }

    .sorted-name #empty-cells {
        grid-row: 1 / span 2;
        grid-column: 4 / span 2;
    }

    .morty_group > div:nth-child(10n + 6) {
        grid-column: 5;
    }

    .morty_group > div:nth-child(10n + 7) {
        grid-column: 4;
    }

    .morty_group > div:nth-child(10n + 8) {
        grid-column: 3;
    }

    .morty_group > div:nth-child(10n + 9) {
        grid-column: 2;
    }

    .morty_group > div:nth-child(10n + 10) {
        grid-column: 1;
    }

    .morty:not(:only-child):nth-child(6)::before {
        content: "";
        background: #f4f4f4;
        position: absolute;
        width: 10px;
        height: 6px;
        left: calc(50% - 5px);
        top: -7px;
        border-top: none;
        border-bottom: none;
        border-left: 1px solid #cfcfcf;
        border-right: 1px solid #cfcfcf;
    }

    .morty.hide-morty ~ .morty::before {
        display: none;
    }

    .morty:not(:only-child):nth-child(6):last-child::after {
        display: none;
    }
}

@media only all and (min-width: 1536px) {
    /* 6 Columns */
    .morty_group,
    #checklist-wrapper.sorted-name {
        display: grid;
        grid-template-columns: repeat(auto-fill, 163px);
        grid-auto-rows: auto;
        grid-auto-flow: row dense;
        column-gap: 12px;
    }

    .sorted-name #empty-cells {
        grid-row: 1 / span 2;
        grid-column: 5 / span 2;
    }

    .morty_group > div:nth-child(12n + 7) {
        grid-column: 6;
    }

    .morty_group > div:nth-child(12n + 8) {
        grid-column: 5;
    }

    .morty_group > div:nth-child(12n + 9) {
        grid-column: 4;
    }

    .morty_group > div:nth-child(12n + 10) {
        grid-column: 3;
    }

    .morty_group > div:nth-child(12n + 11) {
        grid-column: 2;
    }

    .morty_group > div:nth-child(12n + 12) {
        grid-column: 1;
    }
}