@charset "UTF-8";

.rex-js-widget-preview {
    position: relative;
    padding-left: 3.5em;
}

.rex-js-widget-preview.rex-js-widget-medialist {
    padding-left: 40%;
}

.rex-js-widget-preview .rex-js-media-preview {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    height: auto !important;
    width: 3.25em;
    z-index: 1;
    display: flex !important;
    justify-content: center;
    align-items: center;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="220" height="385"><text font-size="500" y="360">?</text></svg>') no-repeat center rgba(0,0,0,0.1);
    background-size: auto 50%;
    box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.1) inset;
}

.rex-js-widget-preview.rex-js-widget-medialist .rex-js-media-preview {
    width: 40%;
}

.rex-js-widget-preview .rex-js-media-preview img {
    /*max-width: 100%;
    max-height: 100%;*/
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

body:not(.rex-theme-light) .iconpicker-dropdown ul {
    background-color: #1a3332;
}

.yform .formfieldset {
    padding: 15px;
    margin: 15px 0;
    background-color: rgba(255, 255, 255, 0.5);
    box-shadow: 0 0 0 1px #fff;
}

.yform .formfieldset>legend {
    border: none;
    margin: 0;
    padding: 0;
}

@media (prefers-color-scheme: dark) {
    body:not(.rex-theme-light) .yform .formfieldset {
        background-color: rgba(27, 35, 44, 0.2);
        box-shadow: 0 0 0 1px rgba(21, 28, 34, 0.8);
    }

    body.rex-theme-dark .yform legend, body.rex-theme-dark .yform .form-legend {
        color: #fff;
    }

    body:not(.rex-theme-light) .yform legend, body:not(.rex-theme-light) .yform .form-legend {
        color: #fff;
    }
}

fieldset[data-key-value-pair] .yform-be-relation-inline-form .yform {
    display: grid;
    gap: 1em;
    align-items: flex-end;
    grid-template-columns: repeat(auto-fit, minmax(10em, 1fr));
}

.bootstrap-select.btn-group .dropdown-menu li,
.bootstrap-select.btn-group .dropdown-menu li a {
    outline: none;
}

.rex-main-sidebar legend {
    margin-bottom: 15px;
    padding-top: 1em;
    border-bottom-color: #dfe3e9;
    font-size: 16px;
}

.rex-main-sidebar fieldset + fieldset {
    margin-top: 20px;
}

.rex-slice-output h1,
.rex-slice-output h2,
.rex-slice-output h3,
.rex-slice-output h4,
.rex-slice-output h5,
.rex-slice-output h6 {
    position: relative;
}
.rex-slice-output h1::before,
.rex-slice-output h2::before,
.rex-slice-output h3::before,
.rex-slice-output h4::before,
.rex-slice-output h5::before,
.rex-slice-output h6::before {
    content: 'h1';
    position: absolute;
    top: -22px;
    left: -5px;
    display: inline-block;
    padding: .25em 1em;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    text-shadow: 0 0 1px #000, 0 1px #000, 0 1px 0 #000;
}
.rex-slice-output h2::before {
    content: 'h2';
}
.rex-slice-output h3::before {
    content: 'h3';
}
.rex-slice-output h4::before {
    content: 'h4';
}
.rex-slice-output h5::before {
    content: 'h5';
}
.rex-slice-output h6::before {
    content: 'h6';
}
.rex-slice-output h1::after,
.rex-slice-output h2::after,
.rex-slice-output h3::after,
.rex-slice-output h4::after,
.rex-slice-output h5::after,
.rex-slice-output h6::after {
    content: '';
    position: absolute;
    top: -22px;
    bottom: 0;
    left: -5px;
    width: 3px;
}

.rex-slice-output h1::after,.rex-slice-output h1::before{background-color: #4E79A7;}
.rex-slice-output h2::after,.rex-slice-output h2::before{background-color: #59A14F;}
.rex-slice-output h3::after,.rex-slice-output h3::before{background-color: #F28E2B;}
.rex-slice-output h4::after,.rex-slice-output h4::before{background-color: #E15759;}
.rex-slice-output h5::after,.rex-slice-output h5::before{background-color: #B07AA1;}
.rex-slice-output h6::after,.rex-slice-output h6::before{background-color: #EDC948;}

.rex-slice .panel-body .btn {
    border: 1px solid #202b35;
    box-shadow: 0 0 0 1px #fff;
}
.rex-slice .panel-body .btn svg,.rex-slice .panel-body .button svg {
    display: none;
}

.columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem 1.5rem;
    margin: 0;
    padding: 0;

    @media (max-width: 500px) {
        display: block;
    }
}

.columns.three {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1.5rem;
}

.columns li {
    list-style: none;
}

.contact {
    img {
        max-height: 200px;
    }
}