/* Alerts
/* ---------------------------------------------------------- */

.gh-box {
    position: relative;
    padding: 12px 10px 14px 40px;
    border: 1px solid transparent;
    border-left-width: 5px;
    color: var(--midgrey);
    line-height: 1.55em;
    letter-spacing: 0.2px;
    background: #fff;
    border-radius: 5px;
    border-color: var(--whitegrey);
    box-shadow: 0 6px 10px -8px rgba(0,0,0,.15)
}

.gh-box a {
    color: var(--middarkgrey);
    text-decoration: underline;
}

.gh-box svg:first-of-type {
    position: absolute;
    left: 12px;
    width: auto;
}

.gh-box-tip {
    border-left-color: var(--blue);
}

.gh-box-tip svg:first-of-type {
    top: 12px;
    height: 2rem;
    fill: var(--blue);
}

.gh-box-alert {
    border-left-color: color-mod(var(--yellow) l(-8%) s(+10%));
}

.gh-box-alert svg:first-of-type {
    top: 14px;
    height: 1.8rem;
    fill: color-mod(var(--yellow) l(-8%) s(+10%));
}

.gh-box-error {
    border-left-color: var(--red);
}

.gh-box-error svg:first-of-type {
    top: 14px;
    height: 1.8rem;
    fill: var(--red);
}

.gh-box-error-border {
    border-left: 5px solid var(--red);
}

.gh-content-bg-whitegrey {
    background: var(--whitegrey-l1);
}

.gh-content-box {
    border: 1px solid var(--whitegrey);
    border-radius: 4px;
    background: var(--white);
}

.gh-content-box.pa { padding: 24px; }
.gh-content-box.pt { padding-top: 24px; }
.gh-content-box.pr { padding-right: 24px; }
.gh-content-box.pb { padding-bottom: 24px; }
.gh-content-box.pl { padding-left: 24px; }

.gh-content-box.grey {
    border: none;
    background: var(--main-color-content-greybg);
}

.gh-content-box.darkgrey {
    border: none;
    background: color-mod(var(--black) l(+6%) s(+2%));
    color: var(--white);
}

.gh-content-box.black {
    border: none;
    background: var(--black);
    color: var(--white);
}

.gh-content-box.vertical {
    background: none;
    border-left: none;
    border-right: none;
    border-top: 1px solid var(--list-color-divider);
    border-bottom: 1px solid var(--list-color-divider);
    border-radius: 0;
}