@charset "UTF-8";
/**
*
* Prefix everything
* Name descriptively
* Structure radically
*
* CSS Structure
*	css/
*	├─ admin/
*	│  ├─ base.scss
*	│  ├─ layout.scss
*	│  ├─ modules/
*	│  │  ├─ modal.scss
*	│  │  ├─ button.scss
*	│  │  ├─ modal.scss
*	│  │  ├─ notices.scss
*	│  │  ├─ tips-and-tricks.scss
*	│  │  ├─ etc.....
*	│  ├─ states.scss
*	│  ├─ theme.scss
*	├─ admin.scss
*	├─ admin.min.css
*	├─ admin.css
*	├─ variables.scss
*
*/
:root {
    --rsp-spacing-xxs: 5px;
    --rsp-spacing-xs: 10px;
    --rsp-spacing-s: 15px;
    --rsp-spacing-m: 20px;
    --rsp-spacing-l: 25px;
    --rsp-spacing-xl: 30px;
    --rsp-grid-margin: var(--rsp-spacing-s);
    --rsp-grid-gap: var(--rsp-spacing-m);
    --rsp-border-radius: 12px;
    --rsp-border-radius-s: 8px;
    --rsp-border: 1px solid var(--rsp-border-color);
    --rsp-box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
    --rsp-box-shadow-dark: rgba(0, 0, 0, 0.2) 0px 4px 6px -1px, rgba(0, 0, 0, 0.12) 1px 0px 4px 1px;
    --rsp-border-color: #dfdfdf;
    --rsp-black: #333;
    --rsp-white: #fff;
    --rsp-yellow: #f4bf3e;
    --rsp-blue: #29b6f6;
    --rsp-dark-blue: #1E73BE;
    --rsp-green: #2e8a37;
    --rsp-red: #D7263D;
    --rsp-pink: #E35899;
    --rsp-wp-blue: #007cba;
    --rsp-yellow-faded: #f2e6c9;
    --rsp-blue-faded: #ecf8fe;
    --rsp-dark-blue-faded: #ebf2f9;
    --rsp-green-faded: #ecf4ed;
    --rsp-red-faded: #fbebed;
    --rsp-pink-faded: #fceff5;
    --rsp-wp-blue-faded: #c6e0ef;
    --rsp-background-block-color: var(--rsp-white);
    --rsp-background-color: #f0f0f1;
    --rsp-input-background-color: #fff;
    --rsp-input-text-color: var(--rsp-text-color);
    --rsp-input-border-color: var(--rsp-grey-400);
    --rsp-text-color: rgba(26, 26, 26, 0.95);
    --rsp-text-color-invert: rgba(255, 255, 255, 0.95);
    --rsp-text-color-white: rgba(255, 255, 255, 0.95);
    --rsp-text-color-light: rgba(69, 69, 82, 0.95);
    --rsp-grey-100: #fafafa;
    --rsp-grey-200: #f9f9f9;
    --rsp-grey-300: #ededed;
    --rsp-grey-400: #c6c6c6;
    --rsp-grey-500: #737373;
    --rsp-grey-600: #696969;
    --rsp-color-success: var(--rsp-green);
    --rsp-color-error: var(--rsp-red);
    --rsp-color-warning: var(--rsp-yellow);
    --rsp-color-open: var(--rsp-yellow);
    --rsp-color-disabled: var(--rsp-grey-300);
    --rsp-fs-100: 0.6875rem;
    --rsp-fs-200: 0.8rem;
    --rsp-fs-300: 0.8125rem;
    --rsp-fs-400: 0.875rem;
    --rsp-fs-500: 1rem;
    --rsp-fs-600: 1.125rem;
    --rsp-fs-700: 1.25rem;
    --rsp-fs-800: 1.5rem;
    --rsp-fs-900: 3.5rem;
}

@keyframes fade-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.rsssl {
    margin: 0;
    margin-left: -20px;
    font-size: var(--rsp-fs-300);
    box-sizing: border-box;
    color: var(--rsp-text-color);
    background-color: var(--rsp-background-color);
    font-weight: 400;
    line-height: 1.5;
}

@media only screen and (max-width: 782px) {
    .rsssl {
        margin-left: -9px;
    }
}

.rsssl *, .rsssl *:before, .rsssl *:after {
    box-sizing: inherit;
}

.rsssl body, .rsssl h1, .rsssl h2, .rsssl h3, .rsssl h4, .rsssl h5, .rsssl h6, .rsssl p, .rsssl ol, .rsssl ul {
    margin: 0;
    padding: 0;
}

.rsssl img {
    max-width: 100%;
    height: auto;
}

.rsssl h1, .rsssl h2, .rsssl h3, .rsssl h4, .rsssl h5, .rsssl h6 {
    color: var(--rsp-text-color);
    line-height: 1.5;
}

.rsssl .rsssl-h0 {
    font-size: var(--rsp-fs-900);
    font-weight: 700;
}

.rsssl h1, .rsssl .rsssl-h1 {
    font-size: var(--rsp-fs-800);
    line-height: 1.5;
    font-weight: 500;
}

.rsssl h2, .rsssl .rsssl-h2 {
    font-size: var(--rsp-fs-700);
    font-weight: 700;
}

.rsssl h3, .rsssl .rsssl-h3 {
    font-size: var(--rsp-fs-600);
    font-weight: 600;
}

.rsssl h4, .rsssl .rsssl-h4 {
    font-size: var(--rsp-fs-600);
    font-weight: 600;
}

.rsssl h5, .rsssl .rsssl-h5 {
    font-size: var(--rsp-fs-400);
    font-weight: 400;
}

.rsssl h6, .rsssl .rsssl-h6 {
    font-size: var(--rsp-fs-300);
}

.rsssl p {
    color: var(--rsp-text-color);
    font-weight: 400;
    font-size: var(--rsp-fs-300);
    line-height: 1.5;
}

.rsssl .rsssl-small-text {
    font-size: var(--rsp-fs-200);
    line-height: 1.5;
    color: var(--rsp-text-color-light);
}

.rsssl a, .rsssl .rsssl-link {
    color: var(--rsp-text-color);
}

.rsssl .rsssl-notice-hook-element {
    display: none !important;
}

.rsssl .error:not(.really-simple-plugins), .rsssl .notice:not(.really-simple-plugins), .rsssl .update-nag:not(.really-simple-plugins), .rsssl .notice-info:not(.really-simple-plugins) {
    display: none !important;
}

/* Grid */
.rsssl .rsssl-header, .rsssl .rsssl-content-area {
    max-width: clamp(300px, 100% - var(--rsp-grid-gap) * 2, 1600px);
    margin: 0 auto;
}

@media (max-width: 1599px) {
    .rsssl .rsssl-header, .rsssl .rsssl-content-area {
        --rsp-grid-gap: var(--rsp-spacing-m);
    }
}

@media (max-width: 1440px) {
    .rsssl .rsssl-header, .rsssl .rsssl-content-area {
        --rsp-grid-gap: var(--rsp-spacing-s);
    }
}

@media (max-width: 1366px) {
    .rsssl .rsssl-header, .rsssl .rsssl-content-area {
        --rsp-grid-gap: var(--rsp-spacing-xs);
    }
}

.rsssl .rsssl-header-container .rsssl-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    height: 70px;
    box-sizing: border-box;
    background-color: var(--rsp-background-block-color);
}

@media (max-width: 1080px) {
    .rsssl .rsssl-header-container .rsssl-header {
        height: 100%;
    }
}

@media (max-width: 576px) {
    .rsssl .rsssl-logo {
        display: none;
    }
}

.rsssl .rsssl-header-left {
    display: flex;
    font-size: var(--rsp-fs-400);
}

@media (max-width: 1080px) {
    .rsssl .rsssl-header-left {
        justify-content: center;
        margin: var(--rsp-spacing-xs) 0;
        order: 3;
        width: 100%;
        background-color: var(--rsp-background-block-color);
    }
}

.rsssl .rsssl-header-left .rsssl-header-menu {
    margin: auto 15px;
}

.rsssl .rsssl-header-left .rsssl-header-menu ul {
    display: flex;
}

.rsssl .rsssl-header-left .rsssl-header-menu li {
    margin-bottom: 0;
}

.rsssl .rsssl-header-left .rsssl-header-menu a {
    padding: 23px 15px;
    text-decoration: none;
    color: var(--rsp-text-color);
    height: 100%;
    border-bottom: 4px solid transparent;
    transition: border 0.3s ease-out;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

@media (max-width: 1080px) {
    .rsssl .rsssl-header-left .rsssl-header-menu a {
        padding: 10px 15px;
    }
}

.rsssl .rsssl-header-left .rsssl-header-menu a.active {
    border-bottom: 4px solid var(--rsp-brand-primary);
}

.rsssl .rsssl-header-left .rsssl-header-menu a:hover {
    color: var(--rsp-brand-primary);
}

.rsssl .rsssl-header-right {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-left: auto;
    gap: var(--rsp-spacing-s);
    min-height: 52px;
}

.rsssl .rsssl-header-right select {
    max-width: 60ch;
}

@media (max-width: 576px) {
    .rsssl .rsssl-header-right {
        display: none;
    }
}

@media (max-width: 782px) {
    .rsssl .rsssl-header-right .button {
        display: none;
    }
}

.rsssl .rsssl-content-area {
    margin-top: var(--rsp-grid-gap);
}

.rsssl .rsssl-header-container {
    background: var(--rsp-background-block-color);
}

.rsssl .rsssl-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: max-content;
    gap: var(--rsp-grid-gap);
    min-height: calc(100vh - 32px - 80px - 20px - var(--rsp-grid-gap));
}

.rsssl .rsssl-grid.rsssl-settings, .rsssl .rsssl-grid.rsssl-letsencrypt {
    grid-template-columns: minmax(275px, max-content) 2fr minmax(min-content, 1fr);
}

@media only screen and (max-width: 1080px) {
    .rsssl .rsssl-grid.rsssl-settings, .rsssl .rsssl-grid.rsssl-letsencrypt {
        grid-template-columns: repeat(4, 1fr);
    }

    .rsssl .rsssl-grid.rsssl-settings .rsssl-wizard-menu, .rsssl .rsssl-grid.rsssl-settings .rsssl-wizard-settings, .rsssl .rsssl-grid.rsssl-settings .rsssl-wizard-help, .rsssl .rsssl-grid.rsssl-letsencrypt .rsssl-wizard-menu, .rsssl .rsssl-grid.rsssl-letsencrypt .rsssl-wizard-settings, .rsssl .rsssl-grid.rsssl-letsencrypt .rsssl-wizard-help {
        grid-column: 1/-1;
    }
}

@media only screen and (max-width: 1280px) {
    .rsssl .rsssl-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media only screen and (max-width: 1080px) {
    .rsssl .rsssl-grid {
        max-width: 790px;
        width: calc(100% - var(--rsp-grid-gap) * 2);
    }
}

.rsssl .rsssl-grid-item {
    background: var(--rsp-background-block-color);
    box-shadow: var(--rsp-box-shadow);
    border-radius: var(--rsp-border-radius);
    transition: all 1s ease;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    flex-direction: column;
    flex-basis: 100%;
    grid-column: span 1;
    grid-row: span 1;
}

.rsssl .rsssl-grid-item.rsssl-disabled {
    min-height: 200px;
}

@media (max-width: 1080px) {
    .rsssl .rsssl-grid-item {
        grid-column: span 4;
    }
}

.rsssl .rsssl-grid-item.no-background {
    background: none;
    border: none;
    box-shadow: none;
}

.rsssl .rsssl-grid-item.rsssl-column-2 {
    grid-column: span 2;
}

@media (max-width: 1080px) {
    .rsssl .rsssl-grid-item.rsssl-column-2 {
        grid-column: span 4;
    }
}

.rsssl .rsssl-grid-item.rsssl-row-2 {
    grid-row: span 2;
    min-height: 400px;
}

.rsssl .rsssl-grid-item-header {
    width: 100%;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: calc(30px + var(--rsp-spacing-s) * 2);
    padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
}

@media screen and (max-width: 1280px) {
    .rsssl .rsssl-grid-item-header {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl .rsssl-grid-item-header {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

.rsssl .rsssl-grid-item-header:empty {
    display: none;
}

.rsssl .rsssl-grid-item-title {
    margin: 4px 0 4px 0;
}

.rsssl .rsssl-grid-item-controls {
    font-size: var(--rsp-fs-200);
    display: flex;
    gap: var(--rsp-spacing-s);
}

.rsssl .rsssl-grid-item-content {
    width: 100%;
    box-sizing: border-box;
    padding-inline: var(--rsp-spacing-l);
    flex-grow: 100;
}

@media screen and (max-width: 1280px) {
    .rsssl .rsssl-grid-item-content {
        padding-inline: var(--rsp-spacing-m);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl .rsssl-grid-item-content {
        padding-inline: var(--rsp-spacing-s);
    }
}

.rsssl .rsssl-grid-item-content:empty {
    display: none;
}

.rsssl .rsssl-grid-item-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--rsp-grid-margin);
    width: 100%;
    min-height: calc(30px + var(--rsp-spacing-s) * 2);
    box-sizing: border-box;
    padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
    align-self: flex-end;
}

@media screen and (max-width: 1280px) {
    .rsssl .rsssl-grid-item-footer {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl .rsssl-grid-item-footer {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

.rsssl .rsssl-grid-item-footer .rsssl-legend {
    display: flex;
}

.rsssl .rsssl-grid-item-footer .rsssl-legend span {
    padding-left: 5px;
}

.rsssl .rsssl-grid-item-footer:empty {
    display: none;
}

.rsssl .rsssl-grid-item .rsssl-flex-push-right {
    margin-left: auto;
}

.rsssl .rsssl-grid-item .rsssl-flex-push-left {
    margin-right: auto;
}

.rsssl-modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.6);
    width: 100%;
    height: 100%;
    z-index: 2;
}

.rsssl-modal {
    width: clamp(300px, 75ch, 100vw - 50px);
    height: max-content;
    position: absolute;
    z-index: 9999;
    border-radius: var(--rsp-border-radius);
    background-color: var(--rsp-white);
    top: 25vh;
    left: -20px;
    right: 0;
    bottom: 0;
  /* transform: translate(-50%, -50%); */
    margin: 25px auto;
}

.rsssl-modal .rsssl-modal-header {
    padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: var(--rsp-border-radius);
}

@media screen and (max-width: 1280px) {
    .rsssl-modal .rsssl-modal-header {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl-modal .rsssl-modal-header {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

.rsssl-modal .rsssl-modal-header .modal-title {
    margin: 0;
    background-color: white;
}

.rsssl-modal .rsssl-modal-header .rsssl-modal-close {
    cursor: pointer;
    background: none;
    border: none;
    font-weight: 700;
}

.rsssl-modal .rsssl-modal-header button img {
    height: 16px;
    width: 16px;
}

.rsssl-modal .rsssl-modal-content {
    position: relative;
    font-size: var(--rsp-fs-300);
    line-height: 1.5;
    padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
}

@media screen and (max-width: 1280px) {
    .rsssl-modal .rsssl-modal-content {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl-modal .rsssl-modal-content {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

.rsssl-modal .rsssl-modal-content .rsssl-modal-subtitle {
    font-size: var(--rsp-fs-600);
    font-weight: 600;
    margin-bottom: var(--rsp-spacing-xs);
}

.rsssl-modal .rsssl-modal-content .rsssl-modal-description {
    overflow-wrap: anywhere;
    margin-top: 0;
    font-weight: 400;
    line-height: 1.5;
    margin-bottom: var(--rsp-spacing-s);
}

.rsssl-modal .rsssl-modal-footer {
    display: flex;
    flex-direction: row;
    padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
    gap: 10px;
}

@media screen and (max-width: 1280px) {
    .rsssl-modal .rsssl-modal-footer {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl-modal .rsssl-modal-footer {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

.rsssl-modal .rsssl-modal-footer .button {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    min-width: 105px;
    text-align: center;
    border-radius: 6px;
}

.rsssl-modal .rsssl-modal-footer .rsssl-button-help {
    background-color: #D7263D;
    color: white;
    border-color: #D7263D;
}

.rsssl-modal .rsssl-modal-footer .rsssl-button-help:hover {
    opacity: 0.9;
}

.rsssl-header-container .rsssl-header {
    display: flex;
    justify-content: space-between;
    height: 70px;
    box-sizing: border-box;
}

.rsssl-header-container .rsssl-header img {
    margin: auto 0;
    height: 26px;
}

.rsssl-header-container .rsssl-header .rsssl-header-menu {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 20px;
    box-sizing: border-box;
}

.rsssl-header-container .rsssl-header .rsssl-header-menu .rsssl-header-menu-item {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 20px;
    box-sizing: border-box;
}

.rsssl-header-container .rsssl-header .rsssl-header-menu .rsssl-header-menu-item:first-child {
    margin-left: 0;
}

.rsssl-header-container .rsssl-header .rsssl-header-menu .rsssl-header-menu-item:last-child {
    margin-right: 0;
}

.rsssl-header-container .rsssl-header .rsssl-header-menu .rsssl-header-menu-item.rsssl-header-menu-item-active {
    background-color: #f5f5f5;
}

.rsssl-header-container .rsssl-header .rsssl-header-actions {
    display: flex;
    align-items: center;
    margin-left: auto;
    gap: var(--rsp-spacing-s);
}

.rsssl-header-container .rsssl-header .rsssl-header-actions select {
    max-width: 60ch;
}

.rsssl a.button, .rsssl button.button, .rsssl input.button, .rsssl span.button {
    font-size: var(--rsp-fs-300);
    font-weight: 400;
    transition: all 0.3s ease;
    min-height: 10px;
}

.rsssl a.button.button-secondary, .rsssl a.button.button-default, .rsssl button.button.button-secondary, .rsssl button.button.button-default, .rsssl input.button.button-secondary, .rsssl input.button.button-default, .rsssl span.button.button-secondary, .rsssl span.button.button-default {
    background: transparent;
}

.rsssl a.button.button-black, .rsssl button.button.button-black, .rsssl input.button.button-black, .rsssl span.button.button-black {
    border: 1px solid var(--rsp-black);
    background: var(--rsp-black);
    color: var(--rsp-text-color-white);
}

.rsssl a.button.button-black:hover, .rsssl a.button.button-black:focus, .rsssl a.button.button-black:active, .rsssl button.button.button-black:hover, .rsssl button.button.button-black:focus, .rsssl button.button.button-black:active, .rsssl input.button.button-black:hover, .rsssl input.button.button-black:focus, .rsssl input.button.button-black:active, .rsssl span.button.button-black:hover, .rsssl span.button.button-black:focus, .rsssl span.button.button-black:active {
    box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--rsp-black);
}

.rsssl a.button.button-tertiary, .rsssl a.button.button-red, .rsssl button.button.button-tertiary, .rsssl button.button.button-red, .rsssl input.button.button-tertiary, .rsssl input.button.button-red, .rsssl span.button.button-tertiary, .rsssl span.button.button-red {
    border: 0 solid transparent;
    background: var(--rsp-red);
    color: var(--rsp-text-color-white);
}

.rsssl a.button.button-tertiary:hover, .rsssl a.button.button-tertiary:focus, .rsssl a.button.button-tertiary:active, .rsssl a.button.button-red:hover, .rsssl a.button.button-red:focus, .rsssl a.button.button-red:active, .rsssl button.button.button-tertiary:hover, .rsssl button.button.button-tertiary:focus, .rsssl button.button.button-tertiary:active, .rsssl button.button.button-red:hover, .rsssl button.button.button-red:focus, .rsssl button.button.button-red:active, .rsssl input.button.button-tertiary:hover, .rsssl input.button.button-tertiary:focus, .rsssl input.button.button-tertiary:active, .rsssl input.button.button-red:hover, .rsssl input.button.button-red:focus, .rsssl input.button.button-red:active, .rsssl span.button.button-tertiary:hover, .rsssl span.button.button-tertiary:focus, .rsssl span.button.button-tertiary:active, .rsssl span.button.button-red:hover, .rsssl span.button.button-red:focus, .rsssl span.button.button-red:active {
    box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--rsp-red);
    background: var(--rsp-red);
    color: var(--rsp-text-color-white);
}

.rsssl a.rsssl-button-small, .rsssl button.rsssl-button-small, .rsssl input.rsssl-button-small {
    font-size: var(--rsp-fs-100);
    font-weight: 300;
    min-height: auto;
}

.rsssl .rsssl-button-small + .rsssl-button-small {
    margin-left: 10px;
}

/* Documents overview */
.rsssl-shortcode {
    right: 10000px;
    position: absolute;
    background-color: #fff;
    padding: 0;
    white-space: nowrap;
}

.shortcode {
    cursor: pointer;
}

.rsssl .rsssl-bullet {
    height: 13px;
    width: 13px;
    flex: 0 0 13px;
    border-radius: 50%;
    display: inline-block;
    background-color: var(--rsp-grey-300);
}

.rsssl .rsssl-bullet.rsp-yellow {
    background-color: var(--rsp-yellow);
}

.rsssl .rsssl-bullet.rsp-blue {
    background-color: var(--rsp-blue);
}

.rsssl .rsssl-bullet.rsp-pink {
    background-color: var(--rsp-pink);
}

.rsssl .rsssl-bullet.rsp-red, .rsssl .rsssl-bullet.rsssl-bullet-error {
    background-color: var(--rsp-red);
}

.rsssl .rsssl-bullet.rsp-green, .rsssl .rsssl-bullet.rsssl-bullet-success {
    background-color: var(--rsp-green);
}

.rsssl .rsssl-bullet.rsp-blue-yellow {
    background: var(--rsp-blue);
    background: linear-gradient(77deg, rgb(41, 182, 246) 0%, rgb(41, 182, 246) 30%, rgb(244, 191, 62) 70%, rgb(244, 191, 62) 100%);
    animation: gradient 2s ease infinite;
    background-size: 200% 200%;
}

.rsssl .rsssl-legend {
    display: flex;
    width: max-content;
    color: var(--rsp-text-color-light);
    align-items: center;
    min-width: 0;
    gap: var(--rsp-spacing-xxs);
    text-decoration: none;
}

.rsssl .rsssl-legend:first-of-type {
    margin-left: auto;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

.rsssl-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

.rsssl-icon svg {
    fill: currentColor;
}

.rsssl-modal.rsssl-onboarding {
    width: clamp(300px, 100ch, 100vw);
}

.rsssl-modal.rsssl-onboarding .rsssl-logo {
    height: 26px;
}

.rsssl-modal.rsssl-onboarding .rsssl-modal-content {
    padding-top: var(--rsp-spacing-xs);
    line-height: 2.2;
}

.rsssl-modal.rsssl-onboarding .rsssl-modal-content ul {
    margin-bottom: var(--rsp-spacing-m);
}

.rsssl-modal.rsssl-onboarding .rsssl-modal-content ul li {
    display: flex;
    align-items: flex-start;
    margin-bottom: var(--rsp-spacing-xxs);
}

.rsssl-modal.rsssl-onboarding .rsssl-modal-content ul li .rsssl-icon {
    margin-top: 7px;
    margin-right: 7px;
}

.rsssl-modal.rsssl-onboarding .rsssl-modal-content-step-footer {
    display: flex;
    align-items: center;
    margin-top: var(--rsp-spacing-l);
    gap: var(--rsp-spacing-m);
}

.rsssl-modal.rsssl-onboarding .rsssl-modal-content-step-footer .components-toggle-control {
    margin-top: 8px;
}

.rsssl-modal.rsssl-onboarding .rsssl-modal-content-step-footer .components-toggle-control .components-form-toggle {
    margin-top: 12px;
}

.rsssl-modal-content-step-footer .components-toggle-control {
    margin-top: 8px;
}

.rsssl-ssllabs.rsssl-block-highlight {
    border: 0;
    -o-animation: fadeItBlock 3s ease-in-out;
    animation: fadeItBlock 3s ease-in-out;
}

@-o-keyframes fadeItBlock {
    0% {
        border: 0;
    }

    30% {
        border: 2px solid var(--rsp-green);
    }

    100% {
        border: 0;
    }
}

@keyframes fadeItBlock {
    0% {
        border: 0;
    }

    30% {
        border: 2px solid var(--rsp-green);
    }

    100% {
        border: 0;
    }
}

.rsssl-grid-item.rsssl-progress .rsssl-grid-item-content {
    padding: 0;
}

.rsssl-grid-item.rsssl-progress .rsssl-placeholder {
    padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
}

@media screen and (max-width: 1280px) {
    .rsssl-grid-item.rsssl-progress .rsssl-placeholder {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl-grid-item.rsssl-progress .rsssl-placeholder {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

.rsssl-progress-block .rsssl-progress {
    overflow: hidden;
    height: 20px;
    border-radius: 5px;
    background-color: #f7f7f7;
}

.rsssl-progress-block .rsssl-progress .rsssl-bar {
    height: 100%;
    background-color: var(--rsp-color-success);
}

.rsssl-progress-block .rsssl-progress .rsssl-bar.rsssl-orange {
    background-color: var(--rsp-color-warning);
}

.rsssl-progress-block .rsssl-progress-bar {
    padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
    padding-block: 0;
    border-radius: 5px;
}

@media screen and (max-width: 1280px) {
    .rsssl-progress-block .rsssl-progress-bar {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl-progress-block .rsssl-progress-bar {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

.rsssl-progress-block .rsssl-progress-text {
    display: flex;
    align-items: center;
    padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
    padding-block: var(--rsp-spacing-s);
    justify-content: flex-start;
    gap: var(--rsp-spacing-m);
}

@media screen and (max-width: 1280px) {
    .rsssl-progress-block .rsssl-progress-text {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl-progress-block .rsssl-progress-text {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

.rsssl-progress-block .rsssl-progress-text .rsssl-progress-percentage {
    font-size: var(--rsp-fs-800);
    font-weight: 700;
}

.rsssl-progress-block .rsssl-progress-text .rsssl-progress-text-span {
    font-weight: 500;
    font-size: var(--rsp-fs-600);
}

.rsssl-progress-block .rsssl-progress-text .rsssl-progress-text-span a {
    margin-left: 3px;
}

@media only screen and (max-width: 1366px) and (min-width: 1280px) {
    .rsssl-progress-block .rsssl-progress-text .rsssl-progress-text-span {
        font-size: var(--rsp-fs-500);
    }
}

.rsssl-header-html {
    display: flex;
    color: var(--rsp-text-color-light);
}

.rsssl-header-html .rsssl-toggle-active {
    text-decoration: underline;
}

.rsssl-task-switcher-container {
    display: flex;
    border-radius: var(--rsp-border-radius);
}

.rsssl-task-switcher-container .rsssl-task-switcher:first-of-type {
    border-right: 1px solid var(--rsp-grey-400);
    padding-right: 10px;
}

.rsssl-task-switcher-container .rsssl-task-switcher:last-of-type {
    padding-left: 10px;
}

.rsssl-task-switcher {
    font-size: var(--rsp-fs-200);
    cursor: pointer;
    transition: 0.3s;
}

.rsssl-task-switcher:hover {
    text-decoration: underline;
}

.rsssl-active-filter-remaining .rsssl-remaining-tasks, .rsssl-active-filter-all .rsssl-all-tasks {
    text-decoration: underline;
}

/**
* Task element, list of tasks
 */
.rsssl-task-element {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: var(--rsp-spacing-m);
    padding-bottom: var(--rsp-spacing-s);
}

@media (max-width: 1280px) {
    .rsssl-task-element {
        gap: var(--rsp-spacing-xs);
    }
}

.rsssl-task-element .rsssl-task-message {
    flex: 1;
    font-size: var(--rsp-fs-300);
}

.rsssl-task-element .rsssl-task-form {
    margin-top: var(--rsp-spacing-xxs);
    display: flex;
    gap: var(--rsp-spacing-xs);
}

.rsssl-task-element .rsssl-task-enable {
    cursor: pointer;
    line-height: 1.5;
}

.rsssl-task-element .rsssl-task-dismiss:hover {
    transform: scale(1.1);
}

.rsssl-task-element .rsssl-task-dismiss button {
    all: initial;
    cursor: pointer;
    padding: 4px;
}

.rsssl-task-element .rsssl-task-dismiss svg {
    height: 12px;
    width: 12px;
}

.rsssl-scroll-container {
    padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
    height: 230px;
    overflow-y: auto;
    padding-block: 0;
    padding-top: var(--rsp-spacing-s);
    border-radius: 0;
}

@media screen and (max-width: 1280px) {
    .rsssl-scroll-container {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl-scroll-container {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

.rsssl-scroll-container::-webkit-scrollbar-track {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0);
    background-color: transparent;
}

.rsssl-scroll-container::-webkit-scrollbar {
    width: 8px;
    border-radius: 10px;
    background-color: var(--rsp-grey-300);
}

.rsssl-scroll-container::-webkit-scrollbar-thumb {
    background-color: var(--rsp-grey-400);
    border-radius: 10px;
}

.rsssl-progress-status-container {
    margin-right: 40px;
}

.rsssl-task-status, .rsssl-locked-overlay .rsssl-progress-status {
    display: block;
    min-width: 100px;
    text-align: center;
    border-radius: 15px;
    padding: 4px 8px;
    font-size: var(--rsp-fs-100);
    font-weight: 600;
}

.rsssl-task-status.rsssl-premium, .rsssl-locked-overlay .rsssl-premium.rsssl-progress-status {
    min-width: 100px !important;
}

@media (max-width: 1280px) {
    .rsssl-task-status, .rsssl-locked-overlay .rsssl-progress-status {
        min-width: 80px;
    }
}

.rsssl-task-status.rsssl-completed, .rsssl-locked-overlay .rsssl-completed.rsssl-progress-status, .rsssl-task-status.rsssl-success, .rsssl-locked-overlay .rsssl-success.rsssl-progress-status {
    background-color: var(--rsp-color-success);
    color: var(--rsp-text-color-white);
}

.rsssl-task-status.rsssl-open, .rsssl-locked-overlay .rsssl-open.rsssl-progress-status {
    background-color: var(--rsp-color-open);
}

.rsssl-task-status.rsssl-warning, .rsssl-locked-overlay .rsssl-warning.rsssl-progress-status {
    background-color: var(--rsp-color-error);
    color: var(--rsp-text-color-white);
}

.rsssl-task-status.rsssl-premium, .rsssl-locked-overlay .rsssl-premium.rsssl-progress-status {
    background-color: var(--rsp-blue);
    color: var(--rsp-text-color-white);
}

@media (max-width: 1080px) {
    .rsssl-scroll-container .rsssl-task-status, .rsssl-scroll-container .rsssl-locked-overlay .rsssl-progress-status, .rsssl-locked-overlay .rsssl-scroll-container .rsssl-progress-status {
        aspect-ratio: 1/1;
        min-width: 10px;
        height: 16px;
        border-radius: 100%;
        text-indent: -9999px;
 /* sends the text off-screen */
        white-space: nowrap;
    }
}

.rsssl-plusone {
    min-width: 15px;
    height: 15px;
    font-size: var(--rsp-fs-100);
    line-height: 1.5;
    display: inline-block;
    vertical-align: top;
    box-sizing: border-box;
    margin: 1px 0 -1px 2px;
    padding: 0 5px;
    border-radius: 9px;
    background-color: #d63638;
    color: #fff;
    text-align: center;
}

@media only screen and (max-width: 1366px) {
    .rsssl-footer-left {
        display: none;
    }
}

.rsssl-grid-item.rsssl-ssllabs .rsssl-grid-item-content {
    padding: 0;
}

.rsssl-ssllabs .rsssl-placeholder {
    padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
}

@media screen and (max-width: 1280px) {
    .rsssl-ssllabs .rsssl-placeholder {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl-ssllabs .rsssl-placeholder {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

.rsssl-ssllabs .rsssl-inactive .rsssl-score-snippet {
    color: var(--rsp-color-disabled);
}

.rsssl-ssllabs .rsssl-inactive .rsssl-ssl-test > div {
    background: var(--rsp-grey-300);
}

.rsssl-ssllabs .rsssl-inactive .rsssl-details:last-of-type {
    opacity: 0.2;
}

.rsssl-ssllabs .rsssl-ssl-test-container {
    background: var(--rsp-grey-100);
    padding: 20px 25px;
}

.rsssl-ssllabs .rsssl-ssl-test-container.rsssl-error {
    background: var(--rsp-red-faded);
}

.rsssl-ssllabs .rsssl-ssl-test-container.rsssl-success {
    background: var(--rsp-green-faded);
}

@media only screen and (max-width: 1599px) and (min-width: 1280px) {
    .rsssl-ssllabs .rsssl-ssl-test-container {
        padding: 5px;
    }
}

.rsssl-ssllabs .rsssl-ssl-test {
    display: flex;
    gap: 15px;
}

.rsssl-ssllabs .rsssl-ssl-test > div {
    flex: 1;
    background-color: #fff;
}

@media only screen and (max-width: 1599px) and (min-width: 1280px) {
    .rsssl-ssllabs .rsssl-ssl-test > div {
        background-color: transparent;
    }
}

.rsssl-ssllabs .rsssl-ssl-test-grade {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--rsp-fs-900);
    font-weight: 700;
    border-radius: 8px;
}

.rsssl-ssllabs .rsssl-ssl-test-grade.rsssl-grade-inactive {
    display: flex;
}

.rsssl-ssllabs .rsssl-ssl-test-grade.rsssl-grade-inactive div {
    width: 20px;
    height: 8px;
    margin: auto auto;
    background-color: var(--rsp-black);
    border-radius: 50px;
}

.rsssl-ssllabs .rsssl-ssl-test-information {
    padding: 10px 0;
    max-width: 50%;
    border-radius: var(--rsp-border-radius);
}

.rsssl-ssllabs .rsssl-ssl-test-information .rsssl-score-container {
    display: flex;
}

.rsssl-ssllabs .rsssl-ssl-test-information .rsssl-score-container .rsssl-score-snippet {
    white-space: nowrap;
    padding: 0 8px;
    font-size: var(--rsp-fs-100);
    margin: 5px 10px;
    border-radius: 3px;
    color: var(--rsp-text-color);
}

.rsssl-ssllabs .rsssl-ssl-test-information .rsssl-score-container .rsssl-score-snippet.rsssl-test-inactive {
    background-color: var(--rsp-grey-200);
    color: var(--rsp-color-disabled);
}

.rsssl-ssllabs .rsssl-ssl-test-information .rsssl-score-container .rsssl-score-snippet.rsssl-test-processing {
    background-color: var(--rsp-yellow);
    color: var(--rsp-black);
}

.rsssl-ssllabs .rsssl-ssl-test-information .rsssl-score-container .rsssl-score-snippet.rsssl-test-success {
    background-color: var(--rsp-color-success);
    color: var(--rsp-text-color-white);
}

.rsssl-ssllabs .rsssl-ssl-test-information .rsssl-score-container .rsssl-score-snippet.rsssl-test-error {
    background-color: var(--rsp-brand-primary);
    color: var(--rsp-black);
}

.rsssl-ssllabs .rsssl-details {
    margin: var(--rsp-spacing-m);
    display: flex;
}

.rsssl-ssllabs .rsssl-details .rsssl-detail-icon {
    width: 30px;
}

.rsssl-ssllabs .rsssl-details .rsssl-detail-icon .rsssl-icon {
    margin-top: 2px;
}

.rsssl-ssllabs .rsssl-details .rsssl-status-red {
    color: var(--rsp-red);
}

@media only screen and (max-width: 1599px) and (min-width: 1280px) {
    .rsssl-ssllabs .rsssl-details {
        margin: var(--rsp-spacing-s);
    }
}

.rsssl-ssllabs .rsssl-details + .rsssl-details {
    margin-top: 0;
}

.rsssl-gridblock-progress-container.rsssl-error .rsssl-gridblock-progress {
    background: var(--rsp-color-warning);
}

.rsssl-gridblock-progress-container.rsssl-inactive {
    height: 4px;
    width: 100%;
    display: flex;
    background: var(--rsp-grey-300);
}

.rsssl-gridblock-progress-container.rsssl-inactive .rsssl-gridblock-progress {
    transition: width 1s ease-in-out;
    background: var(--rsp-green);
}

.rsssl-placeholder {
    box-sizing: border-box;
    width: 100%;
    text-align: left;
    margin: 0;
    padding-bottom: 24px;
    color: #1e1e1e;
    -moz-font-smoothing: subpixel-antialiased;
    -webkit-font-smoothing: subpixel-antialiased;
    border-radius: 2px;
    background-color: #fff;
    flex-grow: 100;
}

.rsssl-placeholder .rsssl-placeholder-line {
    float: left;
    width: 100%;
    height: 16px;
    margin-top: 12px;
    border-radius: 7px;
    background-image: linear-gradient(90deg, #ddd 0px, #e8e8e8 40px, #ddd 80px);
    background-size: 600px;
    animation: shine-lines 1.6s infinite linear;
}

.rsssl-placeholder .rsssl-placeholder-line:last-of-type {
    margin-bottom: 24px;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(1) {
    width: 83%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(2) {
    width: 70%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(3) {
    width: 87%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(4) {
    width: 75%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(5) {
    width: 78%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(6) {
    width: 98%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(7) {
    width: 98%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(8) {
    width: 83%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(9) {
    width: 84%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(10) {
    width: 86%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(11) {
    width: 62%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(12) {
    width: 75%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(13) {
    width: 85%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(14) {
    width: 67%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(15) {
    width: 87%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(16) {
    width: 83%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(17) {
    width: 64%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(18) {
    width: 69%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(19) {
    width: 66%;
}

.rsssl-placeholder .rsssl-placeholder-line:nth-of-type(20) {
    width: 84%;
}

.rsssl-placeholder .rsssl-placeholder-line ~ .rsssl-placeholder-line {
    background-color: #ddd;
}

@keyframes shine-lines {
    0% {
        background-position: -400px;
    }

    100% {
        background-position: 220px;
    }
}

.rsssl .rsssl-other-plugins .rsssl-placeholder {
    background-color: transparent;
}

.rsssl .rsssl-other-plugins .rsp-logo img {
    height: 20px;
}

.rsssl .rsssl-other-plugins-container {
    display: flex !important;
    flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: 10px;
    font-size: var(--rsp-fs-300);
    line-height: 1.7;
    gap: var(--rsp-spacing-xxs);
}

@media screen and (max-width: 992px) {
    .rsssl .rsssl-other-plugins-container {
        flex-direction: row;
        overflow: hidden;
    }
}

.rsssl .rsssl-other-plugins-container .rsssl-other-plugins-element {
    width: 100%;
    display: flex;
    align-content: space-between;
    justify-content: space-between;
    gap: 10px;
    --rsp-other-plugins-color: var(---rsp-brand-primary);
}

.rsssl .rsssl-other-plugins-container .rsssl-other-plugins-element.rsssl-zip-recipes {
    --rsp-other-plugins-color: var(--rsp-pink);
}

.rsssl .rsssl-other-plugins-container .rsssl-other-plugins-element.rsssl-burst-statistics {
    --rsp-other-plugins-color: var(--rsp-green);
}

.rsssl .rsssl-other-plugins-container .rsssl-other-plugins-element.rsssl-complianz-gdpr {
    --rsp-other-plugins-color: var(--rsp-blue);
}

.rsssl .rsssl-other-plugins-container .rsssl-other-plugins-element.rsssl-complianz-terms-conditions {
    --rsp-other-plugins-color: var(--rsp-black);
}

.rsssl .rsssl-other-plugins-container .rsssl-other-plugins-element.rsssl-really-simple-ssl {
    --rsp-other-plugins-color: var(--rsp-yellow);
}

.rsssl .rsssl-other-plugins-container .rsssl-other-plugins-element a {
    width: max-content;
    color: var(--rsp-text-color-light);
    transition: color 0.3s ease;
    display: flex;
    align-items: center;
    min-width: 0;
    gap: var(--rsp-spacing-xs);
    text-decoration: none;
}

.rsssl .rsssl-other-plugins-container .rsssl-other-plugins-element a:hover {
    color: var(--rsp-other-plugins-color);
    text-decoration: underline;
}

.rsssl .rsssl-other-plugins-container .rsssl-other-plugins-element a:hover .rsssl-bullet {
    background-color: var(--rsp-other-plugins-color);
}

.rsssl .rsssl-other-plugins-container .rsssl-other-plugins-element a:hover .rsssl-other-plugins-content {
    text-decoration: underline;
}

.rsssl .rsssl-other-plugins-container .rsssl-other-plugins-element .rsssl-bullet {
    transition: background-color 0.3s ease;
    background-color: var(--rsp-other-plugins-color);
}

.rsssl .rsssl-other-plugins-container .rsssl-other-plugins-element .rsssl-other-plugins-content {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rsssl .rsssl-other-plugins-container .rsssl-other-plugins-element .rsssl-other-plugin-status {
    min-width: fit-content;
}

.rsssl-tips_tricks .rsssl-grid-item-header .rsssl-grid-item-controls {
    height: 28px;
}

.rsssl-tips-tricks-container {
    display: flex !important;
    flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: 10px;
    font-size: var(--rsp-fs-300);
    line-height: 1.7;
    gap: var(--rsp-spacing-xxs);
}

@media screen and (max-width: 992px) {
    .rsssl-tips-tricks-container {
        flex-direction: row;
        overflow: hidden;
    }
}

.rsssl-tips-tricks-container .rsssl-tips-tricks-element {
    width: calc(50% - var(--rsp-spacing-xxs));
}

@media (max-width: 782px) {
    .rsssl-tips-tricks-container .rsssl-tips-tricks-element {
        width: 100%;
    }
}

.rsssl-tips-tricks-container .rsssl-tips-tricks-element a {
    color: var(--rsp-text-color-light);
    transition: color 0.3s ease;
    display: flex;
    align-items: center;
    gap: var(--rsp-spacing-xs);
    min-width: 0;
 /* or some value */
    text-decoration: none;
}

.rsssl-tips-tricks-container .rsssl-tips-tricks-element a:hover {
    color: var(--rsp-brand-primary);
    text-decoration: underline;
}

.rsssl-tips-tricks-container .rsssl-tips-tricks-element a:hover svg path {
    fill: var(--rsp-brand-primary);
}

.rsssl-tips-tricks-container .rsssl-tips-tricks-element a:hover .rsssl-tips-tricks-content {
    text-decoration: underline;
}

.rsssl-tips-tricks-container .rsssl-tips-tricks-element .rsssl-bullet {
    transition: background-color 0.3s ease;
    background-color: var(--rsp-grey-300);
}

.rsssl-tips-tricks-container .rsssl-tips-tricks-element .rsssl-tips-tricks-content {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rsssl div[class^=rsssl-wizard-] .rsssl-helplink {
    color: var(--rsp-text-color);
}

.rsssl div[class^=rsssl-wizard-] .rsssl-grid-item {
    position: relative;
    margin-bottom: var(--rsp-grid-gap);
}

@media (max-width: 1080px) {
    .rsssl div[class^=rsssl-wizard-] .rsssl-grid-item {
        grid-column: span 4;
    }
}

.rsssl div[class^=rsssl-wizard-].rsssl-column-2 {
    grid-column: span 2;
}

@media (max-width: 1080px) {
    .rsssl div[class^=rsssl-wizard-].rsssl-column-2 {
        grid-column: span 4;
    }
}

.rsssl div[class^=rsssl-wizard-] .rsssl-locked {
    position: absolute;
    z-index: 10;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(255, 255, 255, 0.8);
    border-radius: var(--rsp-border-radius);
}

.rsssl div[class^=rsssl-wizard-] .rsssl-locked .rsssl-shield-overlay {
    height: 0;
    top: calc(100% - 190px);
    position: relative;
    align-items: center;
    justify-content: center;
    display: flex;
}

.rsssl div[class^=rsssl-wizard-] .rsssl-locked .rsssl-locked-overlay {
    z-index: 1;
    top: calc(100% - 95px);
    position: relative;
    display: flex;
    align-items: center;
    gap: var(--rsp-spacing-s);
    background-color: var(--rsp-white);
    padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
    border-radius: var(--rsp-border-radius-input);
    margin: var(--rsp-spacing-s);
    box-shadow: var(--rsp-box-shadow);
}

@media screen and (max-width: 1280px) {
    .rsssl div[class^=rsssl-wizard-] .rsssl-locked .rsssl-locked-overlay {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl div[class^=rsssl-wizard-] .rsssl-locked .rsssl-locked-overlay {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

.rsssl div[class^=rsssl-wizard-] .rsssl-locked .rsssl-locked-overlay .rsssl-open {
    float: left;
    margin-right: 12px;
}

.rsssl div[class^=rsssl-wizard-] .rsssl-locked .rsssl-locked-overlay .rsssl-progress-status {
    float: left;
    margin-right: 20px;
}

.rsssl div[class^=rsssl-wizard-] .rsssl-grid-item-footer {
    justify-content: flex-end;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--rsp-grid-margin);
    width: 100%;
    min-height: 20px;
    box-sizing: border-box;
    align-self: flex-end;
}

.rsssl div[class^=rsssl-wizard-] .rsssl-grid-item-footer .rsssl-legend {
    display: flex;
}

.rsssl div[class^=rsssl-wizard-] .rsssl-grid-item-footer .rsssl-legend span {
    padding-left: 5px;
}

.rsssl div[class^=rsssl-wizard-] .rsssl-grid-item-footer:empty {
    display: none;
}

.rsssl-wizard-help {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: var(--rsp-spacing-xs);
}

.rsssl-wizard-help details {
    font-size: var(--rsp-fs-200);
}

.rsssl-wizard-help details .rsssl-help-more-info {
    display: flex;
    flex-direction: row;
    margin-top: 12px;
}

.rsssl-wizard-help details summary {
    display: grid;
    grid-template-columns: 1fr auto;
    justify-content: space-between;
    font-size: var(--rsp-fs-300);
    font-weight: 600;
    cursor: pointer;
}

.rsssl-wizard-help details summary::-webkit-details-marker {
    display: none;
}

.rsssl-wizard-help details summary:first-of-type {
    list-style-type: none;
}

.rsssl-wizard-help details summary .rsssl-icon {
    transition: all 0.3s ease-in-out;
    transform: rotate(0deg);
}

.rsssl-wizard-help code {
    white-space: pre-line;
    display: block;
}

.rsssl-wizard-help summary, .rsssl-wizard-help p {
    font-size: var(--rsp-fs-200);
}

.rsssl-wizard-help details[open] {
    padding: var(--rsp-spacing-s) var(--rsp-spacing-m);
}

.rsssl-wizard-help details[open] summary {
    padding: 0;
    padding-bottom: var(--rsp-spacing-xs);
}

.rsssl-wizard-help details[open] summary .rsssl-icon {
    transform: rotate(180deg);
}

.rsssl-wizard-help .rsssl-help-header {
    width: 100%;
    display: flex;
    padding: 10px;
}

.rsssl-wizard-help .rsssl-help-header .rsssl-help-title {
    font-size: 18px;
}

.rsssl-wizard-help .rsssl-help-header .rsssl-help-control {
    margin-left: auto;
    cursor: pointer;
}

.rsssl-wizard-help-notice {
    width: 100%;
    background: var(--rsp-background-block-color);
    box-shadow: var(--rsp-box-shadow);
    border-radius: var(--rsp-border-radius);
    border-radius: var(--rsp-border-radius-s);
    height: fit-content;
    background-color: var(--rsp-dark-blue-faded);
}

.rsssl-wizard-help-notice.rsssl-warning {
    background-color: var(--rsp-yellow-faded);
}

.rsssl-wizard-help-notice summary, .rsssl-wizard-help-notice p {
    padding: var(--rsp-spacing-s) var(--rsp-spacing-m);
}

.rsssl-wizard-menu {
    height: fit-content;
}

.rsssl-wizard-menu .rsssl-grid-item-content {
    padding: 0;
    padding-bottom: var(--rsp-spacing-l);
}

.rsssl-wizard-menu-items .rsssl-menu-item a {
    display: flex;
    align-items: center;
    gap: var(--rsp-spacing-xs);
    text-decoration: none;
    color: var(--rsp-text-color);
    font-size: var(--rsp-fs-400);
    padding-block: var(--rsp-spacing-xs);
    padding-inline: var(--rsp-spacing-l);
    transition: all 0.2s ease-in-out;
    border-left: 4px solid transparent;
}

@media screen and (max-width: 1280px) {
    .rsssl-wizard-menu-items .rsssl-menu-item a {
        padding-inline: var(--rsp-spacing-m);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl-wizard-menu-items .rsssl-menu-item a {
        padding-inline: var(--rsp-spacing-s);
    }
}

.rsssl-wizard-menu-items .rsssl-menu-item.rsssl-active > a {
    color: var(--rsp-dark-blue);
    font-weight: 600;
    border-left: 4px solid var(--rsp-dark-blue);
}

.rsssl-wizard-menu-items .rsssl-menu-item.rsssl-featured a {
    font-weight: 600;
    flex-wrap: wrap;
}

.rsssl-wizard-menu-items .rsssl-menu-item.rsssl-featured a .rsssl-menu-item-featured-pill {
    background: var(--rsp-green);
    color: var(--rsp-text-color-white);
    padding: 2px 9px;
    border-radius: var(--rsp-border-radius);
    font-size: var(--rsp-fs-100);
}

.rsssl-wizard-menu-items .rsssl-menu-item.rsssl-premium a {
    background: var(--rsp-dark-blue-faded);
    flex-wrap: wrap;
}

.rsssl-wizard-menu-items .rsssl-menu-item.rsssl-premium a .rsssl-menu-item-featured-pill {
    background: var(--rsp-dark-blue);
    color: var(--rsp-text-color-white);
    padding: 2px 9px;
    border-radius: var(--rsp-border-radius);
    font-size: var(--rsp-fs-100);
}

.rsssl-wizard-menu-items .rsssl-premium-menu-item {
    background: var(--rsp-dark-blue-faded);
}

.rsssl-wizard-menu-items .rsssl-premium-menu-item div {
    display: flex;
    align-items: center;
    gap: var(--rsp-spacing-xs);
    text-decoration: none;
    color: var(--rsp-text-color);
    font-size: var(--rsp-fs-400);
    padding-block: var(--rsp-spacing-xs);
    padding-inline: var(--rsp-spacing-l);
    transition: all 0.2s ease-in-out;
    border-left: 4px solid transparent;
}

@media screen and (max-width: 1280px) {
    .rsssl-wizard-menu-items .rsssl-premium-menu-item div {
        padding-inline: var(--rsp-spacing-m);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl-wizard-menu-items .rsssl-premium-menu-item div {
        padding-inline: var(--rsp-spacing-s);
    }
}

.rsssl-wizard-menu-items .rsssl-submenu-item a {
    padding-left: calc(var(--rsp-spacing-l) + var(--rsp-spacing-m));
    font-size: var(--rsp-fs-300);
}

.rsssl div[class^=rsssl-wizard-] .components-flex {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.rsssl div[class^=rsssl-wizard-] .components-flex .components-flex-item label {
    margin: 0;
}

.rsssl div[class^=rsssl-wizard-] .components-flex .components-input-control__container {
    max-width: max-content;
}

.rsssl div[class^=rsssl-wizard-] .rsssl-grid-item-content label {
    font-size: var(--rsp-fs-300);
    font-weight: 400;
    line-height: 1.5;
    text-transform: unset;
    box-sizing: border-box;
    display: inherit;
    max-width: 100%;
    z-index: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rsssl div[class^=rsssl-wizard-] .components-base-control__field {
    margin-bottom: 0;
}

.rsssl div[class^=rsssl-wizard-] .components-toggle-control .components-base-control__field, .rsssl div[class^=rsssl-wizard-] .components-toggle-control .components-flex {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
}

.rsssl div[class^=rsssl-wizard-] .components-toggle-control .components-base-control__field .components-form-toggle, .rsssl div[class^=rsssl-wizard-] .components-toggle-control .components-flex .components-form-toggle {
    margin-right: 0;
}

.rsssl div[class^=rsssl-wizard-] .components-form-toggle.is-checked .components-form-toggle__track {
    background-color: var(--rsp-green);
}

.rsssl div[class^=rsssl-wizard-] .rsssl-grid-item .rsssl-grid-item-content {
    padding: var(--rsp-spacing-xs) 0;
}

.rsssl div[class^=rsssl-wizard-] .rsssl-field-wrap .rsssl-comment {
    font-style: italic;
}

.rsssl div[class^=rsssl-wizard-] .rsssl-field-wrap, .rsssl div[class^=rsssl-wizard-] .rsssl-settings-block-intro {
    padding-block: var(--rsp-spacing-s);
    padding-inline: var(--rsp-spacing-l);
    overflow: hidden;
}

@media screen and (max-width: 1280px) {
    .rsssl div[class^=rsssl-wizard-] .rsssl-field-wrap, .rsssl div[class^=rsssl-wizard-] .rsssl-settings-block-intro {
        padding-inline: var(--rsp-spacing-m);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl div[class^=rsssl-wizard-] .rsssl-field-wrap, .rsssl div[class^=rsssl-wizard-] .rsssl-settings-block-intro {
        padding-inline: var(--rsp-spacing-s);
    }
}

.rsssl div[class^=rsssl-wizard-] .rsssl-field-wrap > .rsssl-field-wrap, .rsssl div[class^=rsssl-wizard-] .rsssl-settings-block-intro > .rsssl-field-wrap {
    padding: 0;
}

.rsssl div[class^=rsssl-wizard-] .rsssl-field-button {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.rsssl .rsssl-highlight {
    background-color: transparent;
    border-left: 4px solid var(--rsp-green);
    -o-animation: fadeIt 3s ease-in-out;
    animation: fadeIt 3s ease-in-out;
}

@-o-keyframes fadeIt {
    0% {
        background-color: transparent;
    }

    30% {
        background-color: var(--rsp-green-faded);
    }

    100% {
        border-right: 0;
        background-color: inherit;
    }
}

@keyframes fadeIt {
    0% {
        background-color: transparent;
        border-right: 0;
    }

    30% {
        background-color: var(--rsp-green-faded);
    }

    100% {
        background-color: inherit;
    }
}

.rsssl-license .rsssl-task-element {
    padding-top: var(--rsp-spacing-s);
    padding-bottom: 0;
}

.rsssl-license .rsssl-license-field {
    display: flex;
}

.rsssl .components-snackbar-list.edit-site-notices {
    width: max-content;
    position: fixed;
    bottom: var(--rsp-spacing-m);
    right: var(--rsp-spacing-l);
}

.rsssl .components-snackbar-list.edit-site-notices > div {
    margin-left: auto;
}

.rsssl .components-snackbar-list.edit-site-notices .components-snackbar {
    background: var(--rsp-background-block-color);
    box-shadow: var(--rsp-box-shadow);
    border-radius: var(--rsp-border-radius);
    color: var(--rsp-color-success);
    background-color: #fff;
    font-weight: 700;
    font-size: 14px;
}

.rsssl-mixedcontentscan .rsssl-mixed-content-placeholder {
    height: 250px;
}

.rsssl-mixedcontentscan .rsssl-mixed-content-placeholder div {
    background-color: var(--rsp-grey-200);
    margin: 10px 0;
    height: 20px;
}

.rsssl-mixedcontentscan .rsssl-shield-overlay {
    height: 250px;
    align-items: center;
    justify-content: center;
    display: flex;
}

.rsssl-mixedcontentscan .rsssl-field-wrap .rdt_TableCol, .rsssl-mixedcontentscan .rsssl-field-wrap .rdt_TableCell {
    min-width: 80px;
}

.rsssl-mixedcontentscan .rsssl-progress-container .rsssl-progress-bar {
    border-radius: 5px;
    height: 20px;
    background-color: var(--rsp-green);
}

.rsssl-mixedcontentscan .rsssl-task-status, .rsssl-mixedcontentscan .rsssl-locked-overlay .rsssl-progress-status, .rsssl-locked-overlay .rsssl-mixedcontentscan .rsssl-progress-status {
    min-width: min-content;
}

.rsssl-mixedcontentscan .rsssl-task-status.rsssl-warning, .rsssl-mixedcontentscan .rsssl-locked-overlay .rsssl-warning.rsssl-progress-status, .rsssl-locked-overlay .rsssl-mixedcontentscan .rsssl-warning.rsssl-progress-status {
    background-color: var(--rsp-yellow);
    color: var(--rsp-text-color);
}

.rsssl-mixedcontentscan button.button {
    line-height: 1.5;
    min-height: 10px;
}

.rsssl-mixedcontentscan .rsssl-grid-item-content-footer {
    display: flex;
    gap: var(--rsp-spacing-s);
}

.rsssl-mixedcontentscan .rsssl-current-scan-action, .rsssl-mixedcontentscan .rsssl-mixed-content-description {
    margin: 10px 5px;
    font-size: var(--rsp-fs-300);
}

.rsssl-learningmode-placeholder {
    height: 150px;
}

.rsssl-learningmode-placeholder div {
    background-color: var(--rsp-grey-200);
    margin: 10px 0;
    height: 20px;
}

.rsssl-learning-mode-delete {
    cursor: pointer;
    background: none;
    border: none;
    font-size: 1.5em;
    font-weight: 700;
}

.rsssl-locked-overlay .rsssl-open {
    float: left;
    margin-right: 12px;
}

.rsssl-locked-overlay .rsssl-progress-status.rsssl-learning-mode-completed, .rsssl-locked-overlay .rsssl-progress-status.rsssl-learning-mode-enforced {
    background-color: var(--rsp-color-success);
    color: #fff;
}

.rsssl-locked-overlay .rsssl-progress-status.rsssl-learning-mode {
    background-color: var(--rsp-color-open);
}

.rsssl-locked-overlay .rsssl-progress-status.rsssl-disabled, .rsssl-locked-overlay .rsssl-progress-status.rsssl-learning-mode-disabled {
    background-color: var(--rsp-color-disabled);
}

.rsssl-learning-mode-footer {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: var(--rsp-spacing-s);
}

.rsssl-learning-mode-footer select {
    margin-left: auto;
}

.rsssl-learning-mode-footer label {
    display: flex;
    align-items: center;
}

.rsssl-learning-mode-footer label input {
    margin-top: 0;
}

.rsssl-lets-encrypt-tests {
    margin: var(--rsp-spacing-xs) var(--rsp-spacing-xl);
}

.rsssl-lets-encrypt-tests .rsssl-progress-bar {
    padding-block: 0;
    margin-bottom: var(--rsp-spacing-m);
}

.rsssl-lets-encrypt-tests .rsssl-progress-bar .rsssl-progress {
    overflow: hidden;
    height: var(--rsp-spacing-m);
    border-radius: 5px;
    background-color: var(--rsp-grey-200);
}

.rsssl-lets-encrypt-tests .rsssl-progress-bar .rsssl-progress .rsssl-bar {
    height: 100%;
    background-color: var(--rsp-color-success);
}

.rsssl-lets-encrypt-tests .rsssl-progress-bar .rsssl-progress .rsssl-bar.rsssl-orange {
    background-color: var(--rsp-color-warning);
}

.rsssl-lets-encrypt-tests p {
    margin-bottom: var(--rsp-spacing-m);
}

.rsssl-lets-encrypt-tests .rsssl-progress-text {
    display: flex;
    align-items: center;
    padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
    padding-block: 0;
    padding-top: var(--rsp-spacing-xs);
}

@media screen and (max-width: 1280px) {
    .rsssl-lets-encrypt-tests .rsssl-progress-text {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

@media screen and (max-width: 1080px) {
    .rsssl-lets-encrypt-tests .rsssl-progress-text {
        padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
    }
}

.rsssl-lets-encrypt-tests .rsssl-progress-text .rsssl-progress-percentage {
    font-size: 32px;
    font-weight: 700;
}

.rsssl-lets-encrypt-tests .rsssl-progress-text .rsssl-progress-text-span {
    margin-left: 35px;
    font-size: 18px;
    font-weight: 600;
}

.rsssl-lets-encrypt-tests .rsssl-progress-text .rsssl-progress-text-span a {
    margin-left: 3px;
}

.rsssl-lets-encrypt-tests ul li {
    display: flex;
    margin-bottom: 15px;
  /*Nested li */
}

.rsssl-lets-encrypt-tests ul li .rsssl-icon {
    margin-right: 7px;
}

.rsssl-lets-encrypt-tests ul li ul li:before {
    background-color: var(--rsp-grey-500);
    color: #fff;
    height: 6px;
    width: 6px;
    border-radius: 50%;
    content: "";
    position: absolute;
    margin-top: 7px;
    margin-left: -19px;
}

.rsssl-lets-encrypt-tests .rsssl-test-results ul li {
    display: block;
}

.rsssl-lets-encrypt-tests .rsssl-test-results h4 {
    margin: var(--rsp-spacing-m) 0;
}

.rsssl-lets-encrypt-tests .rsssl-test-results a + button {
    margin-left: var(--rsp-spacing-m);
}

.rsssl-lets-encrypt-tests .rsssl-test-results .rsssl-certificate-data {
    display: none;
}

.rsssl-lets-encrypt-tests .rsssl-test-results .rsssl-dns-text-records div {
    display: flex;
    flex-direction: row;
    margin-right: 20px;
}

.rsssl-lets-encrypt-tests .rsssl-test-results .rsssl-dns-text-records div .rsssl-dns-domain, .rsssl-lets-encrypt-tests .rsssl-test-results .rsssl-dns-text-records div .rsssl-dns-field {
    margin-right: var(--rsp-spacing-m);
    width: 50%;
}

.rsssl-lets-encrypt-tests .rsssl-modal-content-step-footer {
    display: flex;
    align-items: center;
    margin-top: var(--rsp-spacing-l);
    gap: var(--rsp-spacing-m);
}

.rsssl-lets-encrypt-tests .rsssl-modal-content-step-footer .components-toggle-control .components-base-control__field {
    margin: 0;
    flex-direction: initial;
}

.rsssl-lets-encrypt-tests .rsssl-modal-content-step-footer .components-toggle-control .components-base-control__field .components-toggle-control__label {
    margin-right: 12px;
}

.rsssl-lets-encrypt-tests .rsssl-modal-subtitle {
    display: none;
}

.rsssl div[class^=rsssl-wizard-] .rsssl-permissions_policy .rsssl-locked .rsssl-shield-overlay {
    top: calc(100% - 300px);
}

/**
Admin notice
 */
.rsssl-field-wrap .rdt_TableCol, .rsssl-field-wrap .rdt_TableCell {
    min-width: 50px;
}

.rsssl-field-wrap .rdt_TableHeadRow .rdt_TableCol:last-child {
    flex-grow: 0;
    flex-direction: row-reverse;
}

.rsssl-field-wrap .rdt_TableRow {
    padding: var(--rsp-spacing-xs) 0;
}

.rsssl-field-wrap .rdt_TableRow:nth-child(odd) {
    background-color: var(--rsp-grey-200);
}

.rsssl-field-wrap .rdt_TableRow .rdt_TableCell:last-child {
    flex-grow: 0;
}

.rsssl-field-wrap .rdt_TableRow .rsssl-status-allowed, .rsssl-field-wrap .rdt_TableRow .rsssl-status-revoked {
    min-width: 110px;
    margin-right: 20px;
}

.rsssl-field-wrap .rsssl-csp-revoked > div:nth-child(-n+3) {
    opacity: 0.3;
}

.rsssl-content_security_policy .rsssl-field-wrap .rdt_TableHeadRow .rdt_TableCol:last-child {
    flex-grow: 0;
    min-width: initial;
}

.rsssl-content_security_policy .rsssl-field-wrap .rdt_TableRow .rdt_TableCell:last-child {
    flex-grow: 0;
    min-width: initial;
}

.rsssl-content_security_policy .rsssl-field-wrap .rsssl-csp-revoked > div:nth-child(-n+3) {
    opacity: 0.3;
}

nav.rdt_Pagination > div > svg {
    display: none !important;
}

.rsssl-content_security_policy .rsssl-field-wrap > div > div, .rsssl-xml_rpc .rsssl-field-wrap > div > div {
    overflow-x: inherit;
    overflow-y: inherit;
}

.rsssl-permissions_policy .rdt_TableRow .rdt_TableCell:last-child {
    min-width: fit-content;
}

.rsssl-permissions_policy .rdt_TableRow .rdt_TableCell:last-child .components-input-control__container {
    min-width: fit-content;
}

.rsssl-mixed-content-datatable > div > div {
    display: flex;
}

.rsssl .rsssl-new-features-block .rsssl-grid-item-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.rsssl .rsssl-new-features {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--rsp-spacing-xs);
}

@media only screen and (max-width: 1599px) and (min-width: 1280px) {
    .rsssl .rsssl-new-features {
        gap: var(--rsp-spacing-xxs);
    }
}

.rsssl .rsssl-new-feature {
    width: 100%;
    color: var(--rsp-text-color-light);
    display: flex;
    align-items: flex-start;
    min-width: 0;
    gap: var(--rsp-spacing-xs);
    text-decoration: none;
}

.rsssl .rsssl-new-feature .rsssl-icon {
    margin-top: 2px;
}

.rsssl .rsssl-new-feature .rsssl-new-feature-desc p {
    font-size: var(--rsp-fs-300);
}

/* rsssl-rsssl-tooltip for settings page */
/* Base styles for the element that has a rsssl-tooltip */
[data-rsssl-tooltip],
.rsssl-tooltip {
    position: relative;
    cursor: pointer;
}

/* Base styles for the entire tooltip */
[data-rsssl-tooltip]:before,
[data-rsssl-tooltip]:after,
.rsssl-tooltip:before,
.rsssl-tooltip:after {
    position: absolute;
    visibility: hidden;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
    -webkit-transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, -webkit-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
    -moz-transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, -moz-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
    transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    pointer-events: none;
}

/* Show the entire rsssl-tooltip on hover and focus */
[data-rsssl-tooltip]:hover:before,
[data-rsssl-tooltip]:hover:after,
[data-rsssl-tooltip]:focus:before,
[data-rsssl-tooltip]:focus:after,
.rsssl-tooltip:hover:before,
.rsssl-tooltip:hover:after,
.rsssl-tooltip:focus:before,
.rsssl-tooltip:focus:after {
    visibility: visible;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    opacity: 1;
}

/* Base styles for the rsssl-tooltip's directional arrow */
.rsssl-tooltip:before,
[data-rsssl-tooltip]:before {
  z-index: 1001;
  border: 6px solid transparent;
  background: transparent;
  content: "";
}

/* Base styles for the rsssl-tooltip's content area */
.rsssl-tooltip:after,
[data-rsssl-tooltip]:after {
    z-index: 1000;
    padding: 8px;
    width: 220px;
    background-color: #000;
    background-color: hsla(0deg, 0%, 20%, 0.9);
    color: #fff;
    content: attr(data-rsssl-tooltip);
    font-size: 14px;
    line-height: 1.2;
}

/* Directions */
/* Top (default) */
.rsssl-tooltip-right {
    font-weight: normal;
}

[data-rsssl-tooltip]:before,
[data-rsssl-tooltip]:after,
.rsssl-tooltip:before,
.rsssl-tooltip:after,
.rsssl-tooltip-top:before,
.rsssl-tooltip-top:after {
    bottom: 100%;
    left: 50%;
}

[data-rsssl-tooltip]:before,
.rsssl-tooltip:before,
.rsssl-tooltip-top:before {
    margin-left: -6px;
    margin-bottom: -12px;
    border-top-color: #000;
    border-top-color: hsla(0deg, 0%, 20%, 0.9);
}

/* Horizontally align top/bottom rsssl-tooltips */
[data-rsssl-tooltip]:after,
.rsssl-tooltip:after,
.rsssl-tooltip-top:after {
    margin-left: -80px;
}

[data-rsssl-tooltip]:hover:before,
[data-rsssl-tooltip]:hover:after,
[data-rsssl-tooltip]:focus:before,
[data-rsssl-tooltip]:focus:after,
.rsssl-tooltip:hover:before,
.rsssl-tooltip:hover:after,
.rsssl-tooltip:focus:before,
.rsssl-tooltip:focus:after,
.rsssl-tooltip-top:hover:before,
.rsssl-tooltip-top:hover:after,
.rsssl-tooltip-top:focus:before,
.rsssl-tooltip-top:focus:after {
    -webkit-transform: translateY(-12px);
    -moz-transform: translateY(-12px);
    transform: translateY(-12px);
}

/* Left */
.rsssl-tooltip-left:before,
.rsssl-tooltip-left:after {
    right: 100%;
  /*bottom: 50%;*/
    left: auto;
}

.rsssl-tooltip-left:before {
    margin-left: 0;
    margin-right: -12px;
    margin-bottom: 0;
    border-top-color: transparent;
    border-left-color: #000;
    border-left-color: hsla(0deg, 0%, 20%, 0.9);
}

.rsssl-tooltip-left:hover:before,
.rsssl-tooltip-left:hover:after,
.rsssl-tooltip-left:focus:before,
.rsssl-tooltip-left:focus:after {
    -webkit-transform: translateX(-12px);
    -moz-transform: translateX(-12px);
    transform: translateX(-12px);
}

/* Bottom */
.rsssl-tooltip-bottom:before,
.rsssl-tooltip-bottom:after {
    top: 100%;
    bottom: auto;
    left: 50%;
}

.rsssl-tooltip-bottom:before {
    margin-top: -12px;
    margin-bottom: 0;
    border-top-color: transparent;
    border-bottom-color: #000;
    border-bottom-color: hsla(0deg, 0%, 20%, 0.9);
}

.rsssl-tooltip-bottom:hover:before,
.rsssl-tooltip-bottom:hover:after,
.rsssl-tooltip-bottom:focus:before,
.rsssl-tooltip-bottom:focus:after {
    -webkit-transform: translateY(12px);
    -moz-transform: translateY(12px);
    transform: translateY(12px);
}

/* Right */
.rsssl-tooltip-right:before,
.rsssl-tooltip-right:after {
    bottom: 50%;
    left: 100%;
}

.rsssl-tooltip-right:before {
    margin-bottom: 0;
    margin-left: -12px;
    border-top-color: transparent;
    border-right-color: #000;
    border-right-color: hsla(0deg, 0%, 20%, 0.9);
}

.rsssl-tooltip-right:hover:before,
.rsssl-tooltip-right:hover:after,
.rsssl-tooltip-right:focus:before,
.rsssl-tooltip-right:focus:after {
    -webkit-transform: translateX(12px);
    -moz-transform: translateX(12px);
    transform: translateX(12px);
}

/* Move directional arrows down a bit for left/right rsssl-tooltips */
.rsssl-tooltip-left:before,
.rsssl-tooltip-right:before {
    top: 3px;
}

/* Vertically center rsssl-tooltip content for left/right rsssl-tooltips */
.rsssl-tooltip-left:after,
.rsssl-tooltip-right:after {
    margin-left: 0;
    margin-bottom: -25px;
}

.rsssl {
  /*skeleton*/
  /*loader*/
}

.rsssl .rsssl-skeleton:empty {
    margin: auto;
    margin-bottom: 25px;
    width: 100%;
    height: 235px;
 /* change height to see repeat-y behavior */
    background-image: linear-gradient(100deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5) 70%, rgba(255, 255, 255, 0.5) 15%), linear-gradient(#f2f2f2 38px, transparent 0), linear-gradient(#f2f2f2 38px, transparent 0), linear-gradient(#f2f2f2 38px, transparent 0), linear-gradient(#f2f2f2 38px, transparent 0);
    background-repeat: repeat-y;
    background-size: 50px 200px, 100% 117px, 100% 117px, 100% 117px, 100% 117px;
    background-position: 0 0, 1px 1px, 1px 40px, 1px 79px, 1px 118px;
    background-color: #d6d8db;
    border-right: 1px solid #d6d8db;
    animation: shine 2.5s infinite;
}

@keyframes shine {
    to {
        background-position: 100% 0, 1px 1px, 1px 40px, 1px 79px, 1px 118px;
    }
}

.rsssl .rsssl-loader {
    margin: 0;
    width: 50px;
    height: 15px;
    text-align: center;
    font-size: 10px;
}

.rsssl .rsssl-loader > div {
    margin: 1px;
    background-color: #333;
    height: 100%;
    width: 3px;
    display: inline-block;
    -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
    animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.rsssl .rsssl-loader.rsssl-loader-white > div {
    background-color: #fff;
}

.rsssl .rsssl-loader .rect2 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s;
}

.rsssl .rsssl-loader .rect3 {
    -webkit-animation-delay: -1s;
    animation-delay: -1s;
}

.rsssl .rsssl-loader .rect4 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}

.rsssl .rsssl-loader .rect5 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

.rsssl .button-primary .rsssl-loader div {
    background-color: #fff;
}

@-webkit-keyframes sk-stretchdelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4);
    }

    20% {
        -webkit-transform: scaleY(1);
    }
}

@keyframes sk-stretchdelay {
    0%, 40%, 100% {
        transform: scaleY(0.4);
        -webkit-transform: scaleY(0.4);
    }

    20% {
        transform: scaleY(1);
        -webkit-transform: scaleY(1);
    }
}

.rsssl {
    --rsp-brand-primary: var(--rsp-yellow);
    --rsp-brand-secondary: var(--rsp-blue);
    --rsp-brand-primary-faded: var(--rsp-yellow-faded);
}