@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap");

/* ######################################################## */
/* Semantic UI Buttons                                      */
/* ######################################################## */

.ui.button {
    background: #e356b6;
    color: #fff;
    font-weight: 800;
    font-family: Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
    border-radius: 0.5rem; /* Ticket #3493 */
}

.ui.button:hover {
    /* UPDATED  */
    background-color: #3F5ADA;
    color: rgba(255, 255, 255, .8);
    
    /* ADDED  */
    transition: all 200ms;
}

.ui.button:active, .ui.button:focus {
    background-color: #3F5ADA;
    color: rgba(255, 255, 255, 1);
}

.ui.active.button {
    /* UPDATED  */
    background-color: #3F5ADA;
    color: rgba(255, 255, 255, .8);
}

.ui.active.button:hover {
    /* UPDATED  */
    background-color: #3F5ADA;
    color: rgba(255, 255, 255, .8);
}

.ui.teal.button, .ui.teal.buttons .button {
   /* UPDATE */
  background-color: #0076FD;
}

.ui.teal.button:hover, .ui.teal.buttons .button:hover {
    /* UPDATE */
   background-color: #4254DD;
}

.ui.red.button, .ui.red.buttons .button {
   /* UPDATE */
    background-color: #e356b6;;

}

/* ######################################################## */
/* Semantic UI Toggle Checkbox                              */
/* ######################################################## */

.ui.toggle.checkbox label:before,
.ui.toggle.checkbox input ~ .box:before,
.ui.toggle.checkbox input ~ label:before,
.ui.toggle.checkbox input:focus ~ .box:before,
.ui.toggle.checkbox input:focus ~ label:before {
    transition: all 200ms;
    background-color: #3F5ADA !important;
}

.ui.toggle.checkbox input:checked ~ .box:before,
.ui.toggle.checkbox input:checked ~ label:before,
.ui.toggle.checkbox input:focus:checked ~ .box:before,
.ui.toggle.checkbox input:focus:checked ~ label:before {
    background-color: #e356b6 !important;
}

/* Ticket #3338. First, to make sure the labels are displayed in white at all times: */
.ui.toggle.checkbox .box,
.ui.toggle.checkbox label,
.ui.toggle.checkbox input:checked ~ .box,
.ui.toggle.checkbox input:checked ~ label,
.ui.toggle.checkbox input:focus:checked ~ .box,
.ui.toggle.checkbox input:focus:checked ~ label {
    color: #fff !important;
}

/* ######################################################## */
/* Semantic UI Dropdown                                     */
/* ######################################################## */

.ui.input > input,
.ui.dropdown > input {
    border-radius: 0.5rem; /* Ticket #3493 */
}

.ui.search.dropdown.visible > input.search {
    color: rgba(255, 255, 255, .8) !important;
    font-weight: 800;
}
.ui.active.search.dropdown input.search:focus+.text {
    color: rgba(255, 255, 255, .8) !important;
    font-weight: 800;
}

.ui.search.dropdown.visible > input.search {
    color: #fff !important;
    font-weight: 800 !important;
}

.ui.search.dropdown:hover .dropdown {
    background-color: #3F5ADA !important;
    transition: all 200ms;
}

/* Ticket #3338. Now, to make the dropdown menu fit the space without steatching across the screen */
.ui.selection.dropdown {
    max-width: 400px; /* ADD */
    border-radius: 0.5rem; /* Ticket #3493 */
}

.ui.selection.dropdown:hover {
    /* UPDATED  */
    background-color: #3F5ADA !important;
    
    /* ADDED  */
    transition: all 200ms;
}

.ui.selection.visible.dropdown>.text:not(.default) {
    /* UPDATED  */
    font-weight: 800;
    color: #fff;
   
    /* ADDED  */
    min-width: 100px;
}

/* Dropdown menu item hover */
.ui.dropdown .menu > .item:hover {
    background: rgba(40, 100, 200, 0.15);
    color: rgba(0, 0, 0, .95);
    transition: all 200ms;
}

/* Ticket #3339. To make sure the dropdowns are the correct color */
.chart-inputs .ui.dropdown,
.content-main .ui.dropdown {
    background-color: #e356b6 !important;
    color: #fff;
}

/* ######################################################## */
/* Semantic UI Tables                                       */
/* ######################################################## */

.ui.table {
    font-family: Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
    border-bottom: solid 1px #fff;
}

/* Ticket #3488. Updates to existing styles to bring other pages
   into a consistent style. These are updates to existing styles
   used on the site: */
.ui.table {
	color: #fff;
	padding: 20px;
}

.tableHeader_transparency {
	background-color: #172c39!important;
}

.ui.table tr td {
    padding: 10px;
    border: 1px solid #30424D;
}

.ui.table tr:hover {
    background-color: #264253;
    transition: all 200ms;
}

/* ######################################################## */
/* Navbar                                                   */
/* ######################################################## */

.navbar > .navbar-params > .form > .dropdown {
    background-color: #3F5ADA;
    /* background-color: #e356b6; */
    color: #ffffff;
    font-size: 16px;
    font-weight: 800;
    text-transform: uppercase;
}

.navbar > .navbar-params > .form > .dropdown > i.dropdown {
    background-color: #CF309C;
}

/* ######################################################## */
/* Root Wrapper used for Dashboard Applications             */
/* ######################################################## */

.root-outer .bg-primary {
    background-color: rgb(15, 30, 42);
}

/* ######################################################## */
/* Collapsible Side Bar                                     */
/* ######################################################## */

.root-outer > .sidebar {
    background-color: rgb(15, 30, 42);

}

/* Sidebar Website Logo */
.root-outer > .sidebar > .sidebar-inner > .sidebar-header .image {
    max-width: 13.6rem;
}

/* Sidebar Logout Button */
.root-outer > .sidebar > .sidebar-inner > .sidebar-header .signout {
    padding: 0.25rem 0.5rem;
    background-color: #E356B6;
}

.root-outer > .sidebar > .sidebar-inner > .sidebar-header .close {
    margin: 0;
}

/* Segment part */
.root-outer > .sidebar > .sidebar-inner > .sidebar-nav > .plus-menu {
    background-color: rgb(15, 30, 42);
    border-radius: 0;
}

.root-outer > .sidebar > .sidebar-inner > .sidebar-nav > .plus-menu .plus-menu-items {
    background-color: rgb(15, 30, 42);
}

.root-outer > .sidebar > .sidebar-inner > .sidebar-nav > .plus-menu .plus-menu-items .plus-menu-header {
    color: #E356B6;
    background-color: rgb(15, 30, 42);
}

.root-outer > .sidebar > .sidebar-inner > .sidebar-nav > .plus-menu .plus-menu-items .item {
    color: #BABCCE;
    border-radius: 0.5rem;
    transition: all 200ms;
}

.root-outer > .sidebar > .sidebar-inner > .sidebar-nav > .plus-menu .plus-menu-items .item:hover {
    background-color: #e356b6 !important;
    color: #fff;
    font-weight: 800;
}

a.item.subitem > div::before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    background-color: #e356b6;
}


a.item.active.subitem > div::before {
    background-color: #fff;
}

.root-outer > .sidebar > .sidebar-inner > .sidebar-nav > .plus-menu .plus-menu-items .item .icon {
    display: none;
    /* color: #5D5D79; */
}

.root-outer > .sidebar > .sidebar-inner > .sidebar-nav > .plus-menu .plus-menu-items .item.active {
    color: #e0e1f0;
    font-weight: 600;
    background-color: #e356b6;
}

.root-outer > .sidebar > .sidebar-inner > .sidebar-nav > .plus-menu .plus-menu-items .item.active .icon {
    display: none;
    /* color: #344FFE; */
}

a.item.subitem > div::before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    background-color: #e356b6;
}

a.item.subitem div {
    display: inline-block;
    margin-left: 10px;
}

/* ################################################################ */
/* Navbar                                                           */
/* ################################################################ */

/* Colors */
.navbar > .navbar-params > .form { margin: auto 0; height: 1.5rem; }
.navbar > .navbar-params > .form > .input > input { background-color: #e356b6; color: #ffffff; }
.navbar > .navbar-params > .form > .checkbox > label::before { background-color: #e356b6; }
.navbar > .navbar-params > .form > .checkbox > label::after { color: #ffffff; }
.navbar > .navbar-params > .form > .checkbox > label,
.navbar > .navbar-params > .form > .checkbox > input:focus:checked ~ label {
    color: #ffffff !important;
}

.navbar > .navbar-params > .form > .dropdown { background-color: #e356b6; color: #ffffff; }
.navbar > .navbar-params > .form > .dropdown > i.dropdown { background-color: #e356b6; }

/* Hide the home icon */
.navbar .icon.home { display: none !important; } /* ADDED important */

/* ################################################################ */
/* Legacy                                                           */
/* ################################################################ */

.NpTable {
    margin-top: 10px
}

.tableHeader {
    position: sticky;
    top: 0;
    background-color: #172c39
}

.handy-scroll {
    bottom: 0;
    min-height: 17px;
    overflow: auto;
    position: fixed
}

.handy-scroll div {
    height: 1px;
    overflow: hidden;
    pointer-events: none
}

.handy-scroll div:before {
    content: " "
}

.handy-scroll,
.handy-scroll div {
    font-size: 1px;
    line-height: 0;
    margin: 0;
    padding: 0
}

.handy-scroll-hidden {
    bottom: 9999px
}

.handy-scroll-hidden div:before {
    content: "  "
}

.handy-scroll-viewport {
    position: relative
}

.handy-scroll-body {
    overflow: auto
}

.handy-scroll-viewport .handy-scroll {
    left: 0;
    position: absolute
}

.handy-scroll-hoverable .handy-scroll {
    opacity: 0;
    transition: opacity .5s .3s
}

.handy-scroll-hoverable:hover .handy-scroll {
    opacity: 1
}

@media (max-width: 767px) {
    .tableHeader {
        position: relative;
        top: 0
    }
}

.item {
    transition: opacity .2s ease-in-out
}

.item:hover {
    opacity: .8
}

.ui.scrolling.dropdown .menu,
.ui.dropdown .scrolling.menu {
    min-height: 200px !important;
    max-height: 200px !important
}

.NeonPixel-container {
    min-height: 50px !important
}

.Root.NeonPixel {
    padding-left: 0 !important;
    padding-right: 0 !important
}

.Root .main-container .NeonPixel-container .ui.dimmer {
    min-height: 50px !important
}

@media only screen and (max-width: 600px) {
    .NeonPixel-container>.ui.segment {
        padding: 0 !important
    }
}

.Root .main-container .NeonPixel-container .ui.dimmer>.content {
    width: 100% !important;
    min-height: 50px !important
}

.always-visible-scroll::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px
}

.always-visible-scroll::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: #ffffff80;
    box-shadow: 0 0 1px #ffffff80
}

.Home {
    height: 100%;
    margin: auto
}

#Test {
    background-color: red;
    height: 100%
}

.file-uploader .file-uploader-inner {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    height: 100% !important;
    min-height: 7.6rem !important;
    padding: 1rem;
    margin: 0;
    border: 2px dashed #009e96;
    border-radius: 5px;
    cursor: pointer
}

.file-uploader .file-uploader-content {
    text-align: center;
    cursor: pointer
}

/*!
 * https://github.com/arqex/react-datetime
 */
.rdt {
    position: relative
}

.rdtPicker {
    display: none;
    position: absolute;
    min-width: 250px;
    padding: 4px;
    margin-top: 1px;
    z-index: 99999 !important;
    background: #fff;
    box-shadow: 0 1px 3px #0000001a;
    border: 1px solid #f9f9f9
}

.rdtOpen .rdtPicker {
    display: block
}

.rdtStatic .rdtPicker {
    box-shadow: none;
    position: static
}

.rdtPicker .rdtTimeToggle {
    text-align: center
}

.rdtPicker table {
    width: 100%;
    margin: 0
}

.rdtPicker td,
.rdtPicker th {
    text-align: center;
    height: 28px
}

.rdtPicker td {
    cursor: pointer
}

.rdtPicker td.rdtDay:hover,
.rdtPicker td.rdtHour:hover,
.rdtPicker td.rdtMinute:hover,
.rdtPicker td.rdtSecond:hover,
.rdtPicker .rdtTimeToggle:hover {
    background: #eee;
    cursor: pointer
}

.rdtPicker td.rdtOld,
.rdtPicker td.rdtNew {
    color: #999
}

.rdtPicker td.rdtToday {
    position: relative
}

.rdtPicker td.rdtToday:before {
    content: "";
    display: inline-block;
    border-left: 7px solid transparent;
    border-bottom: 7px solid #428bca;
    border-top-color: #0003;
    position: absolute;
    bottom: 4px;
    right: 4px
}

.rdtPicker td.rdtActive,
.rdtPicker td.rdtActive:hover {
    background-color: #428bca;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .25)
}

.rdtPicker td.rdtActive.rdtToday:before {
    border-bottom-color: #fff
}

.rdtPicker td.rdtDisabled,
.rdtPicker td.rdtDisabled:hover {
    background: none;
    color: #999;
    cursor: not-allowed
}

.rdtPicker td span.rdtOld {
    color: #999
}

.rdtPicker td span.rdtDisabled,
.rdtPicker td span.rdtDisabled:hover {
    background: none;
    color: #999;
    cursor: not-allowed
}

.rdtPicker th {
    border-bottom: 1px solid #f9f9f9
}

.rdtPicker .dow {
    width: 14.2857%;
    border-bottom: none;
    cursor: default
}

.rdtPicker th.rdtSwitch {
    width: 100px
}

.rdtPicker th.rdtNext,
.rdtPicker th.rdtPrev {
    font-size: 21px;
    vertical-align: top
}

.rdtPrev span,
.rdtNext span {
    display: block;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.rdtPicker th.rdtDisabled,
.rdtPicker th.rdtDisabled:hover {
    background: none;
    color: #999;
    cursor: not-allowed
}

.rdtPicker thead tr:first-of-type th {
    cursor: pointer
}

.rdtPicker thead tr:first-of-type th:hover {
    background: #eee
}

.rdtPicker tfoot {
    border-top: 1px solid #f9f9f9
}

.rdtPicker button {
    border: none;
    background: none;
    cursor: pointer
}

.rdtPicker button:hover {
    background-color: #eee
}

.rdtPicker thead button {
    width: 100%;
    height: 100%
}

td.rdtMonth,
td.rdtYear {
    height: 50px;
    width: 25%;
    cursor: pointer
}

td.rdtMonth:hover,
td.rdtYear:hover {
    background: #eee
}

.rdtCounters {
    display: inline-block
}

.rdtCounters>div {
    float: left
}

.rdtCounter {
    height: 100px
}

.rdtCounter {
    width: 40px
}

.rdtCounterSeparator {
    line-height: 100px
}

.rdtCounter .rdtBtn {
    height: 40%;
    line-height: 40px;
    cursor: pointer;
    display: block;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.rdtCounter .rdtBtn:hover {
    background: #eee
}

.rdtCounter .rdtCount {
    height: 20%;
    font-size: 1.2em
}

.rdtMilli {
    vertical-align: middle;
    padding-left: 8px;
    width: 48px
}

.rdtMilli input {
    width: 100%;
    font-size: 1.2em;
    margin-top: 37px
}

.rdtTime td {
    cursor: default
}

.file-picker {
    overflow-y: auto !important
}

.file-picker .new-folder-button {
    padding-left: .785rem;
    padding-right: .785rem
}

.file-picker-header {
    padding: .5rem 1rem !important
}

.file-picker-subheader,
.file-picker-header-buttons {
    padding-top: .25rem
}

.file-picker-path {
    display: inline-block;
    padding: .75em;
    margin: 0 .25em 0 0;
    color: #0009;
    background: #e0e1e2 none;
    border-radius: .25rem;
    font-family: Lato, Helvetica Neue, Arial, Helvetica, sans-serif;
    font-size: 1rem;
    line-height: 1em
}

.file-picker-debug {
    display: inline-block;
    font-size: .9rem;
    font-weight: 100;
    line-height: 1rem;
    padding: .5rem !important
}

.file-picker-debug strong {
    font-weight: 700
}

.file-picker-content {
    padding: .5rem 1rem !important;
    min-height: calc(80vh - 10em) !important;
    max-height: calc(90vh - 10em) !important
}

.file-picker-table {
    border-collapse: collapse
}

.file-picker-table th {
    padding: .5em .75em !important
}

.file-picker-tr {
    cursor: pointer;
    border-radius: .125rem;
    transition: all ease-in-out 125ms;
    outline: 2.5px solid transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.file-picker-tr.selected {
    font-weight: 700;
    color: #007bff !important
}

.file-picker-tr:hover {
    outline: 2.5px solid rgb(0, 123, 255) !important
}

.file-picker-tr td {
    padding: .5em .75em !important
}

.file-picker-tr th.right,
.file-picker-tr td.right {
    text-align: right !important
}

.file-picker-actions {
    padding: .75rem 1rem !important
}

.file-picker-footer {
    border: 1px solid grey;
    border-radius: 5px;
    background: #fff;
    white-space: pre-wrap;
    font-weight: 100;
    padding: .5rem .25rem .5rem .5rem !important;
    font-size: 16px;
    text-align: center;
    display: flex;
    justify-content: space-between
}

.file-picker-footer>input {
    width: 85%
}

.file-picker-body {
    overflow-y: scroll
}

.footer-input {
    color: #000;
    outline: none;
    border: none;
    padding: 5px;
    background-color: none
}

.footer-input:disabled {
    background-color: transparent
}

.rdrCalendarWrapper {
    box-sizing: border-box;
    background: #fff;
    display: inline-flex;
    flex-direction: column;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.rdrDateDisplay {
    display: flex;
    justify-content: space-between
}

.rdrDateDisplayItem {
    flex: 1 1;
    width: 0;
    text-align: center;
    color: inherit
}

.rdrDateDisplayItem+.rdrDateDisplayItem {
    margin-left: .833em
}

.rdrDateDisplayItem input {
    text-align: inherit
}

.rdrDateDisplayItem input:disabled {
    cursor: default
}

.rdrMonthAndYearWrapper {
    box-sizing: inherit;
    display: flex;
    justify-content: space-between
}

.rdrMonthAndYearPickers {
    flex: 1 1 auto;
    display: flex;
    justify-content: center;
    align-items: center
}

.rdrNextPrevButton {
    box-sizing: inherit;
    cursor: pointer;
    outline: none
}

.rdrMonths {
    display: flex
}

.rdrMonthsVertical {
    flex-direction: column
}

.rdrMonthsHorizontal>div>div>div {
    display: flex;
    flex-direction: row
}

.rdrMonth {
    width: 27.667em
}

.rdrWeekDays {
    display: flex
}

.rdrWeekDay {
    flex-basis: calc(100% / 7);
    box-sizing: inherit;
    text-align: center
}

.rdrDays {
    display: flex;
    flex-wrap: wrap
}

.rdrInfiniteMonths {
    overflow: auto
}

.rdrDateRangeWrapper {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.rdrDateInput {
    position: relative
}

.rdrDateInput input {
    outline: none
}

.rdrDateInput .rdrWarning {
    position: absolute;
    font-size: 1.6em;
    line-height: 1.6em;
    top: 0;
    right: .25em;
    color: red
}

.rdrDay {
    box-sizing: inherit;
    width: calc(100% / 7);
    position: relative;
    font: inherit;
    cursor: pointer
}

.rdrDayNumber {
    display: block;
    position: relative
}

.rdrDayNumber span {
    color: #1d2429
}

.rdrDayDisabled {
    cursor: not-allowed
}

@supports (-ms-ime-align: auto) {
    .rdrDay {
        flex-basis: 14.285% !important
    }
}

.rdrSelected,
.rdrInRange,
.rdrStartEdge,
.rdrEndEdge,
.rdrDayStartPreview,
.rdrDayInPreview,
.rdrDayEndPreview {
    pointer-events: none
}

.rdrDateRangePickerWrapper {
    display: inline-flex;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.rdrStaticRanges {
    display: flex;
    flex-direction: column
}

.rdrStaticRange {
    font-size: inherit
}

.rdrInputRange {
    display: flex
}

.rdrCalendarWrapper {
    color: #000;
    font-size: 12px
}

.rdrDateDisplayWrapper {
    background-color: #eff2f7
}

.rdrDateDisplay {
    margin: .833em
}

.rdrDateDisplayItem {
    border-radius: 4px;
    background-color: #fff;
    box-shadow: 0 1px 2px #23394236;
    border: 1px solid transparent
}

.rdrDateDisplayItem input {
    cursor: pointer;
    height: 2.5em;
    line-height: 2.5em;
    border: 0px;
    background: transparent;
    width: 100%;
    color: #849095
}

.rdrDateDisplayItemActive {
    border-color: currentColor
}

.rdrDateDisplayItemActive input {
    color: #7d888d
}

.rdrMonthAndYearWrapper {
    align-items: center;
    height: 60px;
    padding-top: 10px
}

.rdrMonthAndYearPickers {
    font-weight: 600
}

.rdrMonthAndYearPickers select {
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    background: transparent;
    padding: 10px 30px 10px 10px;
    border-radius: 4px;
    outline: 0;
    color: #3e484f;
    background: url("data:image/svg+xml;utf8,<svg width='9px' height='6px' viewBox='0 0 9 6' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><g id='Artboard' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' transform='translate(-636.000000, -171.000000)' fill-opacity='0.368716033'><g id='input' transform='translate(172.000000, 37.000000)' fill='%230E242F' fill-rule='nonzero'><g id='Group-9' transform='translate(323.000000, 127.000000)'><path d='M142.280245,7.23952813 C141.987305,6.92353472 141.512432,6.92361662 141.219585,7.23971106 C140.926739,7.5558055 140.926815,8.06821394 141.219755,8.38420735 L145.498801,13 L149.780245,8.38162071 C150.073185,8.0656273 150.073261,7.55321886 149.780415,7.23712442 C149.487568,6.92102998 149.012695,6.92094808 148.719755,7.23694149 L145.498801,10.7113732 L142.280245,7.23952813 Z' id='arrow'></path></g></g></g></svg>") no-repeat;
    background-position: right 8px center;
    cursor: pointer;
    text-align: center
}

.rdrMonthAndYearPickers select:hover {
    background-color: #00000012
}

.rdrMonthPicker,
.rdrYearPicker {
    margin: 0 5px
}

.rdrNextPrevButton {
    display: block;
    width: 24px;
    height: 24px;
    margin: 0 .833em;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: #eff2f7
}

.rdrNextPrevButton:hover {
    background: #e1e7f0
}

.rdrNextPrevButton i {
    display: block;
    width: 0;
    height: 0;
    padding: 0;
    text-align: center;
    border-style: solid;
    margin: auto;
    transform: translate(-3px)
}

.rdrPprevButton i {
    border-width: 4px 6px 4px 4px;
    border-color: transparent rgb(52, 73, 94) transparent transparent;
    transform: translate(-3px)
}

.rdrNextButton i {
    margin: 0 0 0 7px;
    border-width: 4px 4px 4px 6px;
    border-color: transparent transparent transparent rgb(52, 73, 94);
    transform: translate(3px)
}

.rdrWeekDays {
    padding: 0 .833em
}

.rdrMonth {
    padding: 0 .833em 1.666em
}

.rdrMonth .rdrWeekDays {
    padding: 0
}

.rdrMonths.rdrMonthsVertical .rdrMonth:first-child .rdrMonthName {
    display: none
}

.rdrWeekDay {
    font-weight: 400;
    line-height: 2.667em;
    color: #849095
}

.rdrDay {
    background: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 0;
    padding: 0;
    line-height: 3em;
    height: 3em;
    text-align: center;
    color: #1d2429
}

.rdrDay:focus {
    outline: 0
}

.rdrDayNumber {
    outline: 0;
    font-weight: 300;
    position: absolute;
    left: 0;
    right: 0;
    top: 5px;
    bottom: 5px;
    display: flex;
    align-items: center;
    justify-content: center
}

.rdrDayToday .rdrDayNumber span {
    font-weight: 500
}

.rdrDayToday .rdrDayNumber span:after {
    content: "";
    position: absolute;
    bottom: 4px;
    left: 50%;
    transform: translate(-50%);
    width: 18px;
    height: 2px;
    border-radius: 2px;
    background: #3d91ff
}

.rdrDayToday:not(.rdrDayPassive) .rdrInRange~.rdrDayNumber span:after,
.rdrDayToday:not(.rdrDayPassive) .rdrStartEdge~.rdrDayNumber span:after,
.rdrDayToday:not(.rdrDayPassive) .rdrEndEdge~.rdrDayNumber span:after,
.rdrDayToday:not(.rdrDayPassive) .rdrSelected~.rdrDayNumber span:after {
    background: #fff
}

.rdrDay:not(.rdrDayPassive) .rdrInRange~.rdrDayNumber span,
.rdrDay:not(.rdrDayPassive) .rdrStartEdge~.rdrDayNumber span,
.rdrDay:not(.rdrDayPassive) .rdrEndEdge~.rdrDayNumber span,
.rdrDay:not(.rdrDayPassive) .rdrSelected~.rdrDayNumber span {
    color: #ffffffd9
}

.rdrSelected,
.rdrInRange,
.rdrStartEdge,
.rdrEndEdge {
    background: currentColor;
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    bottom: 5px
}

.rdrSelected {
    left: 2px;
    right: 2px
}

.rdrStartEdge {
    border-top-left-radius: 1.042em;
    border-bottom-left-radius: 1.042em;
    left: 2px
}

.rdrEndEdge {
    border-top-right-radius: 1.042em;
    border-bottom-right-radius: 1.042em;
    right: 2px
}

.rdrSelected {
    border-radius: 1.042em
}

.rdrDayStartOfMonth .rdrInRange,
.rdrDayStartOfMonth .rdrEndEdge,
.rdrDayStartOfWeek .rdrInRange,
.rdrDayStartOfWeek .rdrEndEdge {
    border-top-left-radius: 1.042em;
    border-bottom-left-radius: 1.042em;
    left: 2px
}

.rdrDayEndOfMonth .rdrInRange,
.rdrDayEndOfMonth .rdrStartEdge,
.rdrDayEndOfWeek .rdrInRange,
.rdrDayEndOfWeek .rdrStartEdge {
    border-top-right-radius: 1.042em;
    border-bottom-right-radius: 1.042em;
    right: 2px
}

.rdrDayStartOfMonth .rdrDayInPreview,
.rdrDayStartOfMonth .rdrDayEndPreview,
.rdrDayStartOfWeek .rdrDayInPreview,
.rdrDayStartOfWeek .rdrDayEndPreview {
    border-top-left-radius: 1.333em;
    border-bottom-left-radius: 1.333em;
    border-left-width: 1px;
    left: 0
}

.rdrDayEndOfMonth .rdrDayInPreview,
.rdrDayEndOfMonth .rdrDayStartPreview,
.rdrDayEndOfWeek .rdrDayInPreview,
.rdrDayEndOfWeek .rdrDayStartPreview {
    border-top-right-radius: 1.333em;
    border-bottom-right-radius: 1.333em;
    border-right-width: 1px;
    right: 0
}

.rdrDayStartPreview,
.rdrDayInPreview,
.rdrDayEndPreview {
    background: #ffffff17;
    position: absolute;
    top: 3px;
    left: 0;
    right: 0;
    bottom: 3px;
    pointer-events: none;
    border: 0px solid currentColor;
    z-index: 1
}

.rdrDayStartPreview {
    border-top-width: 1px;
    border-left-width: 1px;
    border-bottom-width: 1px;
    border-top-left-radius: 1.333em;
    border-bottom-left-radius: 1.333em;
    left: 0
}

.rdrDayInPreview {
    border-top-width: 1px;
    border-bottom-width: 1px
}

.rdrDayEndPreview {
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-top-right-radius: 1.333em;
    border-bottom-right-radius: 1.333em;
    right: 0
}

.rdrDefinedRangesWrapper {
    font-size: 12px;
    width: 226px;
    border-right: solid 1px #eff2f7;
    background: #fff
}

.rdrDefinedRangesWrapper .rdrStaticRangeSelected {
    color: currentColor;
    font-weight: 600
}

.rdrStaticRange {
    border: 0;
    cursor: pointer;
    display: block;
    outline: 0;
    border-bottom: 1px solid #eff2f7;
    padding: 0;
    background: #fff
}

.rdrStaticRange:hover .rdrStaticRangeLabel,
.rdrStaticRange:focus .rdrStaticRangeLabel {
    background: #eff2f7
}

.rdrStaticRangeLabel {
    display: block;
    outline: 0;
    line-height: 18px;
    padding: 10px 20px;
    text-align: left
}

.rdrInputRanges {
    padding: 10px 0
}

.rdrInputRange {
    align-items: center;
    padding: 5px 20px
}

.rdrInputRangeInput {
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 4px;
    text-align: center;
    border: solid 1px rgb(222, 231, 235);
    margin-right: 10px;
    color: #6c767a
}

.rdrInputRangeInput:focus,
.rdrInputRangeInput:hover {
    border-color: #b4bfc4;
    outline: 0;
    color: #333
}

.rdrCalendarWrapper:not(.rdrDateRangeWrapper) .rdrDayHovered .rdrDayNumber:after {
    content: "";
    border: 1px solid currentColor;
    border-radius: 1.333em;
    position: absolute;
    top: -2px;
    bottom: -2px;
    left: 0;
    right: 0;
    background: transparent
}

.rdrDayPassive {
    pointer-events: none
}

.rdrDayPassive .rdrDayNumber span {
    color: #d5dce0
}

.rdrDayPassive .rdrInRange,
.rdrDayPassive .rdrStartEdge,
.rdrDayPassive .rdrEndEdge,
.rdrDayPassive .rdrSelected,
.rdrDayPassive .rdrDayStartPreview,
.rdrDayPassive .rdrDayInPreview,
.rdrDayPassive .rdrDayEndPreview {
    display: none
}

.rdrDayDisabled {
    background-color: #f8f8f8
}

.rdrDayDisabled .rdrDayNumber span {
    color: #aeb9bf
}

.rdrDayDisabled .rdrInRange,
.rdrDayDisabled .rdrStartEdge,
.rdrDayDisabled .rdrEndEdge,
.rdrDayDisabled .rdrSelected,
.rdrDayDisabled .rdrDayStartPreview,
.rdrDayDisabled .rdrDayInPreview,
.rdrDayDisabled .rdrDayEndPreview {
    filter: grayscale(100%) opacity(60%)
}

.rdrMonthName {
    text-align: left;
    font-weight: 600;
    color: #849095;
    padding: .833em
}

.DateRangeSelector .ui.button {
    background-color: red;
    color: #fff
}

.DateRangeSelector-background {
    position: absolute;
    width: 100%;
    height: 100vh;
    top: -30px;
    left: -10px;
    z-index: 1000 !important;
    display: flex;
    overflow: auto
}

.DateRangeSelector-content {
    margin-top: 35px;
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 115px;
    border: 1px solid grey;
    transform: scale(.9);
    width: 100%;
    overflow-x: auto;
    background-color: transparent;
    border: none
}

.DateRangeSelector-content>.rdrDateRangePickerWrapper {
    margin-top: 45px
}

.DateRangeSelector-close {
    position: absolute;
    right: 75px;
    z-index: 1000
}

.rdrStaticRange,
.rdrInputRange {
    color: #000 !important
}

.rdrDateRangePickerWrapper {
    margin-top: 0 !important
}

@media only screen and (max-width: 800px) {
    .rdrDefinedRangesWrapper {
        display: none
    }
}

.parameter-input {
    width: 100%;
    padding: 0 !important;
    font-size: 12pt !important;
    font-weight: 500
}

.parameter-input>input {
    padding: .4rem .75rem !important
}

.parameter-ace {
    width: 100% !important;
    padding: 0 !important;
    font-size: 12pt !important;
    font-weight: 500
}

.parameter-checkbox {
    width: 100%;
    padding: 0 !important;
    font-size: 12pt !important;
    font-weight: 500;
    margin-left: 30px;
}

.parameter-select {
    width: 100%;
    font-weight: 500
}

.parameter-display-only {
    font-size: 12pt !important;
    font-weight: 700
}

.parameter {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    margin: .5rem
}

.parameter .field>label {
    display: block;
    margin: 0 0 .285rem;
    color: #000000de;
    font-size: .925rem;
    font-weight: 700;
    text-transform: none
}

.parameter .field>input {
    font-family: Lato, Helvetica Neue, Arial, Helvetica, sans-serif;
    margin: 0;
    outline: 0;
    line-height: 1.2rem;
    padding: .675rem 1rem;
    font-size: 1em;
    background: #fff;
    border: 1px solid rgba(34, 36, 38, .15);
    color: #000000de;
    border-radius: .285rem;
    -webkit-box-shadow: 0 0 0 0 transparent inset;
    box-shadow: 0 0 0 0 transparent inset;
    -webkit-transition: color .1s ease, border-color .1s ease;
    transition: color .1s ease, border-color .1s ease
}

.ace-container {
    display: flex;
    flex-direction: column;
    justify-content: stretch
}

.ace_editorZZ {
    margin: 0;
    justify-content: center;
    border: 1px solid rgba(34, 36, 38, .25);
    border-radius: .25rem
}

.btn-container {
    margin-top: 1rem
}

.btn-container .button {
    margin: 0
}

.icon-selector {
    margin: 0 !important;
    padding: 0 !important
}

.icon-selector .icons-list {
    display: flex;
    flex-wrap: wrap;
    margin-right: -10px
}

.icon-selector .icons-list>.icon-item {
    color: #b8b8b8;
    font-size: 25px;
    padding: 5px
}

.icon-selector .icons-list>.icon-item:hover {
    background-color: gray;
    cursor: pointer;
    border-radius: 10px
}

.icon-selector .icons-list>.icon-item.active {
    color: #000
}

.icon-selector .icons-list>.icon-item>i {
    margin-bottom: 10px;
    margin-right: 5px
}

.icon-selector .actions {
    width: 100%;
    margin: 0 !important;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center
}

.appmenu {
    width: 100%;
    height: 100%;
    margin: 0 !important;
    padding: 0 !important;
    background-color: #eee;
}

.appmenu-menu {
    width: 100% !important;
    height: 100% !important;
    background-color: #eee;
}

.appmenu > .appmenu-menu,
.appmenu > .menu-header,
.ui.table,
.ui.AppMenu {
    background-color: #172c39 !important;
    border-radius: 12px;
    border: 1px solid #30424D;
}

/* UPDATE: Added `.ui.menu .item` to affect the same sort of left sidebar listing on Advertiser Management */
.appmenu > .appmenu-menu .item p,
.ui.AppMenu .item p,
.ui.menu .item {
   color: #fff;
}

.appmenu > .appmenu-menu a.item.active {
    background: rgba(255, 255, 255, 0.15) !important;
    color: #fff;
    transition: all 300ms;
}

.appmenu > .appmenu-menu a.item:hover,
.appmenu > .appmenu-menu a.item.active:hover {
    color: #fff;
    background-color: #e356b6 !important;
}

.ui.placeholder.segment {
    background: #172c39!important;
    border: 1px solid #30424D;
    border-radius: 12px;
}

.ui.icon.header {
    color: #fff;
}

.aws-wallet {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column
}

.aws-wallet .profile-view {
    width: 100%;
    height: 100%;
    padding: 1rem;
    margin: 0
}

.aws-wallet .controls {
    width: 100%
}

.aws-wallet .controls .collection-control {
    display: flex;
    font-size: .935rem;
    align-items: stretch !important;
    flex-grow: 1 !important
}

.aws-wallet .controls .collection-control>.label {
    margin: 0 !important;
    vertical-align: middle;
    border-radius: .285rem;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding: .785rem .833rem;
    background-color: #e8e8e8;
    font-size: 1em !important;
    line-height: 1em !important
}

.aws-wallet .controls .collection-control>.selection {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left-color: transparent;
    min-width: 18rem
}

.aws-wallet .controls .collection-buttons {
    flex-grow: .5 !important;
    display: flex;
    justify-content: flex-start;
    align-items: end;
    flex-wrap: wrap;
    margin: 0;
    padding: 0
}

.aws-wallet .controls .collection-buttons .button {
    margin: 0 .35rem 0 0 !important;
    padding: .785rem
}

.aws-wallet .controls .collection-extra {
    flex-grow: .5 !important;
    display: flex;
    font-size: .935rem;
    align-items: stretch !important;
    justify-content: flex-end
}

.plus-menu {
    height: 100%;
    display: flex;
    margin: 0 !important;
    padding: 0 !important;
    flex-direction: column;
    justify-content: space-between
}

.plus-menu.plus,
.plus-menu.dashboard {
    padding: 0 !important
}

.plus-menu.neonpixel {
    padding: 0 !important;
    border: none;
    background: none
}

.plus-menu>.plus-menu-admin {
    width: 100%;
    margin: 0 !important;
    padding: 1rem 0 0 !important;
    display: flex;
    flex-direction: row;
    justify-content: center
}

.plus-menu>.plus-menu-items {
    height: 100%
}

.plus-menu .ui.menu .plus-menu-header {
    padding: 2rem 1.25rem .75rem;
    margin: 0;
    color: #e356b6;
    font-size: 1rem;
    text-align: left;
    text-transform: uppercase
}

.plus-menu .ui.menu .item,
.plus-menu .ui.menu .item.active {
    border-radius: 0 !important
}

.plus-menu .ui.menu .item>i.icon {
    float: left !important;
    margin: 0 .5em 0 0 !important;
    font-size: 1.2rem
}

.plus-menu-settings {
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    display: flex;
    flex-direction: row;
    justify-content: flex-start
}

.plus-menu-settings>.plus-menu-advanced {
    margin: 0 !important;
    padding: 0 !important;
    display: flex;
    flex-direction: column
}

.Menu {
    background-color: #fff;
    border-radius: 25px;
    position: absolute;
    top: 0;
    left: 0;
    color: #333;
    margin: 5px;
    height: calc(100% - 10px);
    min-width: 200px
}

.logoImg {
    object-fit: contain;
    width: 225px;
    display: block;
    margin-left: -15px
}

input[type=range] {
    -webkit-appearance: none;
    height: 7px;
    background: gray;
    border-radius: 5px;
    background-image: linear-gradient(#e8e8e8, #e8e8e8);
    background-repeat: no-repeat;
    accent-color: #222
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    height: .75rem;
    width: .75rem;
    border-radius: 50%;
    background: #1b1c1d;
    cursor: pointer;
    box-shadow: 0 0 2px #555
}

input[type=range]::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    box-shadow: none;
    border: none;
    background: transparent
}

input[type=range]::-webkit-slider-thumb:hover {
    box-shadow: #1678c250 0 0 0 5px
}

input[type=range]::-webkit-slider-thumb:active {
    box-shadow: #1678c250 0 0 0 8px;
    transition: box-shadow .35s cubic-bezier(.4, 0, .2, 1) 0ms, left .35s cubic- bezier(.4, 0, .2, 1) 0ms, bottom .35s cubic-bezier(.4, 0, .2, 1) 0ms
}

.audio-player-bar {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start
}

.player-progress-outer {
    width: 8rem;
    height: 1.5rem;
    background: #e0e1e2 none;
    border-radius: .285rem;
    padding: .3rem;
    margin-left: .25rem
}

.player-progress-outer:hover {
    background-color: #cacbcd
}

.audio-player-bar .player-progress {
    margin: .25rem 0 !important
}

.audio-player-bar .player-progress.tiny {
    font-size: .65rem !important
}

.audio-player-bar .player-progress.small {
    font-size: .75rem !important
}

.audio-player-bar .player-progress.medium {
    font-size: .85rem !important
}

.audio-player-bar .player-progress .bar {
    min-width: .25rem !important
}

.player-volume-outer {
    width: 1.5rem;
    height: 1.5rem;
    background: #e0e1e2 none;
    border-radius: .285rem;
    padding: .1rem;
    margin-left: .25rem
}

.player-volume-outer:hover {
    background-color: #cacbcd
}

.player-volume-slider {
    width: 6rem !important
}

.player-volume-slider>.custom-range {
    width: 5.8rem !important
}

.audio-player-bar .player-buttons {
    width: auto
}

.audio-player-bar .player-buttons>.player-button {
    font-size: .75rem !important;
    padding: .4rem !important
}

.audio-player-bar .header {
    margin: 0
}

.audio-player-bar img {
    object-fit: contain;
    max-width: 100%
}

.navbar {
    width: 100%;
    display: flex;
    justify-content: space-between
}

.navbar>.navbar-main {
    flex-grow: 1;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end
}

.navbar>.navbar-main>.audio-player-bar {
    margin: auto .25rem
}

.navbar>.navbar-user-menu {
    flex-grow: 0
}

.d-none {
    display: none
}

@media only screen and (max-width: 750px) {
    .dm-none {
        display: none !important
    }

    .d-none {
        display: block
    }
}

div.ham {
    width: 30px;
    height: 3px;
    background-color: #000;
    margin: 2px 0;
    padding: 2px
}

.modal-subscription-content-center {
    display: flex;
    justify-content: center
}

.max-height {
    margin-top: 20px;
    max-height: 99vh
}

.minHeight-50 {
    min-height: 50px !important
}

@media only screen and (max-width: 767px) {
    .navbar {
        position: relative
    }

    button {
        cursor: pointer;
        background: #fff;
        border: none;
        font-size: 20px
    }

   .navbar .toggle {
            left: 270px;
            top: 23px;
            background: none;
            color: #fff;
        }

    /* ADD */
        .ui.toggle.checkbox input:checked~.box, .ui.toggle.checkbox input:checked~label {
            color: #fff !important;
        }

    .menu-nav {
        list-style: none;
        position: absolute !important;
        background: #fff;
        left: 0;
        width: 0;
        overflow: hidden;
        padding: 0 !important;
        max-width: 195px;
        z-index: 9;
        font-size: 18px;
        box-shadow: 0 10px 15px -3px #2e293314, 0 4px 6px -2px #473f4f29;
        transform: translate(-100px);
        transition: transform ease-in-out .2s
    }

    .menu-nav.show-menu {
        width: 100% !important;
        padding: 0 !important;
        transform: translate(0)
    }

    .menu-nav li a,
    .menu-nav li span {
        display: block;
        padding: 1rem
    }

    .dm-none {
        display: none
    }

    .ui.menu {
        border-radius: 0 !important
    }

    .menu.transition {
        border-bottom: 1px dashed #ffffff !important
    }
}

.confirmation-wrapper {
    margin: .75rem
}

.confirmation-banner {
    max-width: 960px;
    margin: 0 auto !important
}

.confirmation-banner .left-view {
    padding: .75rem;
    margin-right: 1rem
}

@media only screen and (min-width: 768px) {
    .confirmation-banner .left-view {
        margin-right: 0
    }
}

.confirmation-banner .left-view>svg {
    margin: 1rem
}

.confirmation-banner .form>.fields {
    justify-content: center;
    flex-wrap: wrap;
    margin: 0
}

.confirmation-banner .form>.fields>.field {
    padding: 0 .5rem .5rem 0 !important
}

.confirmation-banner .form>.fields>.field:last-child {
    padding: 0 0 .5rem !important
}

.confirmation-banner .form>.fields>.field>.button {
    padding: .8rem 1.25rem
}

@media only screen and (min-width: 768px) {
    .side-Nav {
        display: block;
        position: static;
        flex-shrink: 0;
        padding: 0;
        width: auto;
        flex-basis: auto;
        max-height: 88vh;
        overflow-y: auto;
        flex: 0 0 230px
    }
}

.log-in {
    color: #777;
    border-top: 1px solid #efecec;
    margin-top: 15px;
    font-size: 15px
}

.logout {
    position: absolute;
    right: 30px;
    top: 40px;
    display: flex;
    gap: 2rem;
    font-size: 20px;
    color: #005bb3
}

/*!
* Quill Editor v1.3.7
* https://quilljs.com/
* Copyright (c) 2014, Jason Chen
* Copyright (c) 2013, salesforce.com
*/
.ql-container {
    box-sizing: border-box;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 13px;
    height: 100%;
    margin: 0;
    position: relative
}

.ql-container.ql-disabled .ql-tooltip {
    visibility: hidden
}

.ql-container.ql-disabled .ql-editor ul[data-checked]>li:before {
    pointer-events: none
}

.ql-clipboard {
    left: -100000px;
    height: 1px;
    overflow-y: hidden;
    position: absolute;
    top: 50%
}

.ql-clipboard p {
    margin: 0;
    padding: 0
}

.ql-editor {
    box-sizing: border-box;
    line-height: 1.42;
    height: 100%;
    outline: none;
    overflow-y: auto;
    padding: 12px 15px;
    tab-size: 4;
    -moz-tab-size: 4;
    text-align: left;
    white-space: pre-wrap;
    word-wrap: break-word
}

.ql-editor>* {
    cursor: text
}

.ql-editor p,
.ql-editor ol,
.ql-editor ul,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
    margin: 0;
    padding: 0;
    counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9
}

.ql-editor ol,
.ql-editor ul {
    padding-left: 1.5em
}

.ql-editor ol>li,
.ql-editor ul>li {
    list-style-type: none
}

.ql-editor ul>li:before {
    content: "•"
}

.ql-editor ul[data-checked=true],
.ql-editor ul[data-checked=false] {
    pointer-events: none
}

.ql-editor ul[data-checked=true]>li *,
.ql-editor ul[data-checked=false]>li * {
    pointer-events: all
}

.ql-editor ul[data-checked=true]>li:before,
.ql-editor ul[data-checked=false]>li:before {
    color: #777;
    cursor: pointer;
    pointer-events: all
}

.ql-editor ul[data-checked=true]>li:before {
    content: "☑"
}

.ql-editor ul[data-checked=false]>li:before {
    content: "☐"
}

.ql-editor li:before {
    display: inline-block;
    white-space: nowrap;
    width: 1.2em
}

.ql-editor li:not(.ql-direction-rtl):before {
    margin-left: -1.5em;
    margin-right: .3em;
    text-align: right
}

.ql-editor li.ql-direction-rtl:before {
    margin-left: .3em;
    margin-right: -1.5em
}

.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
    padding-left: 1.5em
}

.ql-editor ol li.ql-direction-rtl,
.ql-editor ul li.ql-direction-rtl {
    padding-right: 1.5em
}

.ql-editor ol li {
    counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
    counter-increment: list-0
}

.ql-editor ol li:before {
    content: counter(list-0, decimal) ". "
}

.ql-editor ol li.ql-indent-1 {
    counter-increment: list-1
}

.ql-editor ol li.ql-indent-1:before {
    content: counter(list-1, lower-alpha) ". "
}

.ql-editor ol li.ql-indent-1 {
    counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9
}

.ql-editor ol li.ql-indent-2 {
    counter-increment: list-2
}

.ql-editor ol li.ql-indent-2:before {
    content: counter(list-2, lower-roman) ". "
}

.ql-editor ol li.ql-indent-2 {
    counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9
}

.ql-editor ol li.ql-indent-3 {
    counter-increment: list-3
}

.ql-editor ol li.ql-indent-3:before {
    content: counter(list-3, decimal) ". "
}

.ql-editor ol li.ql-indent-3 {
    counter-reset: list-4 list-5 list-6 list-7 list-8 list-9
}

.ql-editor ol li.ql-indent-4 {
    counter-increment: list-4
}

.ql-editor ol li.ql-indent-4:before {
    content: counter(list-4, lower-alpha) ". "
}

.ql-editor ol li.ql-indent-4 {
    counter-reset: list-5 list-6 list-7 list-8 list-9
}

.ql-editor ol li.ql-indent-5 {
    counter-increment: list-5
}

.ql-editor ol li.ql-indent-5:before {
    content: counter(list-5, lower-roman) ". "
}

.ql-editor ol li.ql-indent-5 {
    counter-reset: list-6 list-7 list-8 list-9
}

.ql-editor ol li.ql-indent-6 {
    counter-increment: list-6
}

.ql-editor ol li.ql-indent-6:before {
    content: counter(list-6, decimal) ". "
}

.ql-editor ol li.ql-indent-6 {
    counter-reset: list-7 list-8 list-9
}

.ql-editor ol li.ql-indent-7 {
    counter-increment: list-7
}

.ql-editor ol li.ql-indent-7:before {
    content: counter(list-7, lower-alpha) ". "
}

.ql-editor ol li.ql-indent-7 {
    counter-reset: list-8 list-9
}

.ql-editor ol li.ql-indent-8 {
    counter-increment: list-8
}

.ql-editor ol li.ql-indent-8:before {
    content: counter(list-8, lower-roman) ". "
}

.ql-editor ol li.ql-indent-8 {
    counter-reset: list-9
}

.ql-editor ol li.ql-indent-9 {
    counter-increment: list-9
}

.ql-editor ol li.ql-indent-9:before {
    content: counter(list-9, decimal) ". "
}

.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
    padding-left: 3em
}

.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
    padding-left: 4.5em
}

.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
    padding-right: 3em
}

.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
    padding-right: 4.5em
}

.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
    padding-left: 6em
}

.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
    padding-left: 7.5em
}

.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
    padding-right: 6em
}

.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
    padding-right: 7.5em
}

.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
    padding-left: 9em
}

.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
    padding-left: 10.5em
}

.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
    padding-right: 9em
}

.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
    padding-right: 10.5em
}

.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
    padding-left: 12em
}

.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
    padding-left: 13.5em
}

.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
    padding-right: 12em
}

.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
    padding-right: 13.5em
}

.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
    padding-left: 15em
}

.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
    padding-left: 16.5em
}

.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
    padding-right: 15em
}

.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
    padding-right: 16.5em
}

.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
    padding-left: 18em
}

.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
    padding-left: 19.5em
}

.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
    padding-right: 18em
}

.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
    padding-right: 19.5em
}

.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
    padding-left: 21em
}

.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
    padding-left: 22.5em
}

.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
    padding-right: 21em
}

.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
    padding-right: 22.5em
}

.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
    padding-left: 24em
}

.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
    padding-left: 25.5em
}

.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
    padding-right: 24em
}

.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
    padding-right: 25.5em
}

.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
    padding-left: 27em
}

.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
    padding-left: 28.5em
}

.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
    padding-right: 27em
}

.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
    padding-right: 28.5em
}

.ql-editor .ql-video {
    display: block;
    max-width: 100%
}

.ql-editor .ql-video.ql-align-center {
    margin: 0 auto
}

.ql-editor .ql-video.ql-align-right {
    margin: 0 0 0 auto
}

.ql-editor .ql-bg-black {
    background-color: #000
}

.ql-editor .ql-bg-red {
    background-color: #e60000
}

.ql-editor .ql-bg-orange {
    background-color: #f90
}

.ql-editor .ql-bg-yellow {
    background-color: #ff0
}

.ql-editor .ql-bg-green {
    background-color: #008a00
}

.ql-editor .ql-bg-blue {
    background-color: #06c
}

.ql-editor .ql-bg-purple {
    background-color: #93f
}

.ql-editor .ql-color-white {
    color: #fff
}

.ql-editor .ql-color-red {
    color: #e60000
}

.ql-editor .ql-color-orange {
    color: #f90
}

.ql-editor .ql-color-yellow {
    color: #ff0
}

.ql-editor .ql-color-green {
    color: #008a00
}

.ql-editor .ql-color-blue {
    color: #06c
}

.ql-editor .ql-color-purple {
    color: #93f
}

.ql-editor .ql-font-serif {
    font-family: Georgia, Times New Roman, serif
}

.ql-editor .ql-font-monospace {
    font-family: Monaco, Courier New, monospace
}

.ql-editor .ql-size-small {
    font-size: .75em
}

.ql-editor .ql-size-large {
    font-size: 1.5em
}

.ql-editor .ql-size-huge {
    font-size: 2.5em
}

.ql-editor .ql-direction-rtl {
    direction: rtl;
    text-align: inherit
}

.ql-editor .ql-align-center {
    text-align: center
}

.ql-editor .ql-align-justify {
    text-align: justify
}

.ql-editor .ql-align-right {
    text-align: right
}

.ql-editor.ql-blank:before {
    color: #0009;
    content: attr(data-placeholder);
    font-style: italic;
    left: 15px;
    pointer-events: none;
    position: absolute;
    right: 15px
}

.ql-snow.ql-toolbar:after,
.ql-snow .ql-toolbar:after {
    clear: both;
    content: "";
    display: table
}

.ql-snow.ql-toolbar button,
.ql-snow .ql-toolbar button {
    background: none;
    border: none;
    cursor: pointer;
    display: inline-block;
    float: left;
    height: 24px;
    padding: 3px 5px;
    width: 28px
}

.ql-snow.ql-toolbar button svg,
.ql-snow .ql-toolbar button svg {
    float: left;
    height: 100%
}

.ql-snow.ql-toolbar button:active:hover,
.ql-snow .ql-toolbar button:active:hover {
    outline: none
}

.ql-snow.ql-toolbar input.ql-image[type=file],
.ql-snow .ql-toolbar input.ql-image[type=file] {
    display: none
}

.ql-snow.ql-toolbar button:hover,
.ql-snow .ql-toolbar button:hover,
.ql-snow.ql-toolbar button:focus,
.ql-snow .ql-toolbar button:focus,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
    color: #06c
}

.ql-snow.ql-toolbar button:hover .ql-fill,
.ql-snow .ql-toolbar button:hover .ql-fill,
.ql-snow.ql-toolbar button:focus .ql-fill,
.ql-snow .ql-toolbar button:focus .ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
    fill: #06c
}

.ql-snow.ql-toolbar button:hover .ql-stroke,
.ql-snow .ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button:focus .ql-stroke,
.ql-snow .ql-toolbar button:focus .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
.ql-snow .ql-toolbar button.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow.ql-toolbar button:hover .ql-stroke-miter,
.ql-snow .ql-toolbar button:hover .ql-stroke-miter,
.ql-snow.ql-toolbar button:focus .ql-stroke-miter,
.ql-snow .ql-toolbar button:focus .ql-stroke-miter,
.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
    stroke: #06c
}

@media (pointer: coarse) {

    .ql-snow.ql-toolbar button:hover:not(.ql-active),
    .ql-snow .ql-toolbar button:hover:not(.ql-active) {
        color: #444
    }

    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
        fill: #444
    }

    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
        stroke: #444
    }
}

.ql-snow,
.ql-snow * {
    box-sizing: border-box
}

.ql-snow .ql-hidden {
    display: none
}

.ql-snow .ql-out-bottom,
.ql-snow .ql-out-top {
    visibility: hidden
}

.ql-snow .ql-tooltip {
    position: absolute;
    transform: translateY(10px)
}

.ql-snow .ql-tooltip a {
    cursor: pointer;
    text-decoration: none
}

.ql-snow .ql-tooltip.ql-flip {
    transform: translateY(-10px)
}

.ql-snow .ql-formats {
    display: inline-block;
    vertical-align: middle
}

.ql-snow .ql-formats:after {
    clear: both;
    content: "";
    display: table
}

.ql-snow .ql-stroke {
    fill: none;
    stroke: #444;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2
}

.ql-snow .ql-stroke-miter {
    fill: none;
    stroke: #444;
    stroke-miterlimit: 10;
    stroke-width: 2
}

.ql-snow .ql-fill,
.ql-snow .ql-stroke.ql-fill {
    fill: #444
}

.ql-snow .ql-empty {
    fill: none
}

.ql-snow .ql-even {
    fill-rule: evenodd
}

.ql-snow .ql-thin,
.ql-snow .ql-stroke.ql-thin {
    stroke-width: 1
}

.ql-snow .ql-transparent {
    opacity: .4
}

.ql-snow .ql-direction svg:last-child {
    display: none
}

.ql-snow .ql-direction.ql-active svg:last-child {
    display: inline
}

.ql-snow .ql-direction.ql-active svg:first-child {
    display: none
}

.ql-snow .ql-editor h1 {
    font-size: 2em
}

.ql-snow .ql-editor h2 {
    font-size: 1.5em
}

.ql-snow .ql-editor h3 {
    font-size: 1.17em
}

.ql-snow .ql-editor h4 {
    font-size: 1em
}

.ql-snow .ql-editor h5 {
    font-size: .83em
}

.ql-snow .ql-editor h6 {
    font-size: .67em
}

.ql-snow .ql-editor a {
    text-decoration: underline
}

.ql-snow .ql-editor blockquote {
    border-left: 4px solid #ccc;
    margin-bottom: 5px;
    margin-top: 5px;
    padding-left: 16px
}

.ql-snow .ql-editor code,
.ql-snow .ql-editor pre {
    background-color: #f0f0f0;
    border-radius: 3px
}

.ql-snow .ql-editor pre {
    white-space: pre-wrap;
    margin-bottom: 5px;
    margin-top: 5px;
    padding: 5px 10px
}

.ql-snow .ql-editor code {
    font-size: 85%;
    padding: 2px 4px
}

.ql-snow .ql-editor pre.ql-syntax {
    background-color: #23241f;
    color: #f8f8f2;
    overflow: visible
}

.ql-snow .ql-editor img {
    max-width: 100%
}

.ql-snow .ql-picker {
    color: #444;
    display: inline-block;
    float: left;
    font-size: 14px;
    font-weight: 500;
    height: 24px;
    position: relative;
    vertical-align: middle
}

.ql-snow .ql-picker-label {
    cursor: pointer;
    display: inline-block;
    height: 100%;
    padding-left: 8px;
    padding-right: 2px;
    position: relative;
    width: 100%
}

.ql-snow .ql-picker-label:before {
    display: inline-block;
    line-height: 22px
}

.ql-snow .ql-picker-options {
    background-color: #fff;
    display: none;
    min-width: 100%;
    padding: 4px 8px;
    position: absolute;
    white-space: nowrap
}

.ql-snow .ql-picker-options .ql-picker-item {
    cursor: pointer;
    display: block;
    padding-bottom: 5px;
    padding-top: 5px
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label {
    color: #ccc;
    z-index: 2
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
    fill: #ccc
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
    stroke: #ccc
}

.ql-snow .ql-picker.ql-expanded .ql-picker-options {
    display: block;
    margin-top: -1px;
    top: 100%;
    z-index: 1
}

.ql-snow .ql-color-picker,
.ql-snow .ql-icon-picker {
    width: 28px
}

.ql-snow .ql-color-picker .ql-picker-label,
.ql-snow .ql-icon-picker .ql-picker-label {
    padding: 2px 4px
}

.ql-snow .ql-color-picker .ql-picker-label svg,
.ql-snow .ql-icon-picker .ql-picker-label svg {
    right: 4px
}

.ql-snow .ql-icon-picker .ql-picker-options {
    padding: 4px 0
}

.ql-snow .ql-icon-picker .ql-picker-item {
    height: 24px;
    width: 24px;
    padding: 2px 4px
}

.ql-snow .ql-color-picker .ql-picker-options {
    padding: 3px 5px;
    width: 152px
}

.ql-snow .ql-color-picker .ql-picker-item {
    border: 1px solid transparent;
    float: left;
    height: 16px;
    margin: 2px;
    padding: 0;
    width: 16px
}

.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
    position: absolute;
    margin-top: -9px;
    right: 0;
    top: 50%;
    width: 18px
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=""]):before {
    content: attr(data-label)
}

.ql-snow .ql-picker.ql-header {
    width: 98px
}

.ql-snow .ql-picker.ql-header .ql-picker-label:before,
.ql-snow .ql-picker.ql-header .ql-picker-item:before {
    content: "Normal"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before {
    content: "Heading 1"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before {
    content: "Heading 2"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before {
    content: "Heading 3"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before {
    content: "Heading 4"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before {
    content: "Heading 5"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before {
    content: "Heading 6"
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before {
    font-size: 2em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before {
    font-size: 1.5em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before {
    font-size: 1.17em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before {
    font-size: 1em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before {
    font-size: .83em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before {
    font-size: .67em
}

.ql-snow .ql-picker.ql-font {
    width: 108px
}

.ql-snow .ql-picker.ql-font .ql-picker-label:before,
.ql-snow .ql-picker.ql-font .ql-picker-item:before {
    content: "Sans Serif"
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before {
    content: "Serif"
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before {
    content: "Monospace"
}

.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before {
    font-family: Georgia, Times New Roman, serif
}

.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before {
    font-family: Monaco, Courier New, monospace
}

.ql-snow .ql-picker.ql-size {
    width: 98px
}

.ql-snow .ql-picker.ql-size .ql-picker-label:before,
.ql-snow .ql-picker.ql-size .ql-picker-item:before {
    content: "Normal"
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]:before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before {
    content: "Small"
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]:before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before {
    content: "Large"
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before {
    content: "Huge"
}

.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before {
    font-size: 10px
}

.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before {
    font-size: 18px
}

.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before {
    font-size: 32px
}

.ql-snow .ql-color-picker.ql-background .ql-picker-item {
    background-color: #fff
}

.ql-snow .ql-color-picker.ql-color .ql-picker-item {
    background-color: #000
}

.ql-toolbar.ql-snow {
    border: 1px solid #ccc;
    box-sizing: border-box;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    padding: 8px
}

.ql-toolbar.ql-snow .ql-formats {
    margin-right: 15px
}

.ql-toolbar.ql-snow .ql-picker-label {
    border: 1px solid transparent
}

.ql-toolbar.ql-snow .ql-picker-options {
    border: 1px solid transparent;
    box-shadow: #0003 0 2px 8px
}

.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label,
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
    border-color: #ccc
}

.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {
    border-color: #000
}

.ql-toolbar.ql-snow+.ql-container.ql-snow {
    border-top: 0px
}

.ql-snow .ql-tooltip {
    background-color: #fff;
    border: 1px solid #ccc;
    box-shadow: 0 0 5px #ddd;
    color: #444;
    padding: 5px 12px;
    white-space: nowrap
}

.ql-snow .ql-tooltip:before {
    content: "Visit URL:";
    line-height: 26px;
    margin-right: 8px
}

.ql-snow .ql-tooltip input[type=text] {
    display: none;
    border: 1px solid #ccc;
    font-size: 13px;
    height: 26px;
    margin: 0;
    padding: 3px 5px;
    width: 170px
}

.ql-snow .ql-tooltip a.ql-preview {
    display: inline-block;
    max-width: 200px;
    overflow-x: hidden;
    text-overflow: ellipsis;
    vertical-align: top
}

.ql-snow .ql-tooltip a.ql-action:after {
    border-right: 1px solid #ccc;
    content: "Edit";
    margin-left: 16px;
    padding-right: 8px
}

.ql-snow .ql-tooltip a.ql-remove:before {
    content: "Remove";
    margin-left: 8px
}

.ql-snow .ql-tooltip a {
    line-height: 26px
}

.ql-snow .ql-tooltip.ql-editing a.ql-preview,
.ql-snow .ql-tooltip.ql-editing a.ql-remove {
    display: none
}

.ql-snow .ql-tooltip.ql-editing input[type=text] {
    display: inline-block
}

.ql-snow .ql-tooltip.ql-editing a.ql-action:after {
    border-right: 0px;
    content: "Save";
    padding-right: 0
}

.ql-snow .ql-tooltip[data-mode=link]:before {
    content: "Enter link:"
}

.ql-snow .ql-tooltip[data-mode=formula]:before {
    content: "Enter formula:"
}

.ql-snow .ql-tooltip[data-mode=video]:before {
    content: "Enter video:"
}

.ql-snow a {
    color: #06c
}

.ql-container.ql-snow {
    border: 1px solid #ccc
}

.audio-recorder {
    position: relative;
    background-color: #e0e1e2
}

.audio-recorder>.timer {
    bottom: 0;
    right: 0;
    padding: 2px;
    position: absolute
}

.audio-recorder>.timer>pre {
    display: block;
    margin: 4px;
    padding: 4px;
    min-height: 1em;
    line-height: 1em;
    font-family: monospace;
    font-size: 1.6em
}

.audio-recorder>.transport {
    bottom: 0;
    padding: 2px;
    width: 100%;
    display: flex;
    justify-content: center;
    position: absolute
}

.audio-recorder>.transport>button {
    margin: 4px;
    min-height: 1em;
    line-height: 1em;
    padding: .75em;
    display: inline-block;
    background-color: #67696980;
    border: 1px solid transparent;
    border-radius: .275rem;
    color: #fff
}

.audio-recorder>.transport>button:hover {
    background-color: #46826ecc;
    text-shadow: 0 0 .125em hsl(0 0% 100% / .3), 0 0 .45em #00ffb780;
    box-shadow: inset 0 0 .75em #00ffb780, 0 0 .75em #00ffb780;
    border: 1px solid #00ffb7
}

.audio-recorder>.transport>button.record:hover {
    color: #ff0048;
    background-color: #82465acc;
    text-shadow: 0 0 .125em hsl(0 0% 100% / .3), 0 0 .45em #ff004880;
    box-shadow: inset 0 0 .75em #ff004880, 0 0 .75em #ff004880;
    border: 1px solid #ff0048
}

.audio-recorder>.transport>button.record:disabled {
    color: #ff0048;
    background-color: #a0194699;
    text-shadow: 0 0 .125em hsl(0 0% 100% / .3), 0 0 .75em #ff004880
}

.audio-recorder>.transport>button.stop:hover {
    color: #00ffb7
}

.audio-recorder>.transport>button>.icon {
    margin: 0 !important
}

.react-flow {
    direction: ltr
}

.react-flow__container {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

.react-flow__pane {
    z-index: 1;
    cursor: -webkit-grab;
    cursor: grab
}

.react-flow__pane.selection {
    cursor: pointer
}

.react-flow__pane.dragging {
    cursor: -webkit-grabbing;
    cursor: grabbing
}

.react-flow__viewport {
    transform-origin: 0 0;
    z-index: 2;
    pointer-events: none
}

.react-flow__renderer {
    z-index: 4
}

.react-flow__selection {
    z-index: 6
}

.react-flow__nodesselection-rect:focus,
.react-flow__nodesselection-rect:focus-visible {
    outline: none
}

.react-flow .react-flow__edges {
    pointer-events: none;
    overflow: visible
}

.react-flow__edge-path,
.react-flow__connection-path {
    stroke: #b1b1b7;
    stroke-width: 1;
    fill: none
}

.react-flow__edge {
    pointer-events: visibleStroke;
    cursor: pointer
}

.react-flow__edge.animated path {
    stroke-dasharray: 5;
    -webkit-animation: dashdraw .5s linear infinite;
    animation: dashdraw .5s linear infinite
}

.react-flow__edge.animated path.react-flow__edge-interaction {
    stroke-dasharray: none;
    -webkit-animation: none;
    animation: none
}

.react-flow__edge.inactive {
    pointer-events: none
}

.react-flow__edge.selected,
.react-flow__edge:focus,
.react-flow__edge:focus-visible {
    outline: none
}

.react-flow__edge.selected .react-flow__edge-path,
.react-flow__edge:focus .react-flow__edge-path,
.react-flow__edge:focus-visible .react-flow__edge-path {
    stroke: #555
}

.react-flow__edge-textwrapper {
    pointer-events: all
}

.react-flow__edge-textbg {
    fill: #fff
}

.react-flow__edge .react-flow__edge-text {
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.react-flow__connection {
    pointer-events: none
}

.react-flow__connection .animated {
    stroke-dasharray: 5;
    -webkit-animation: dashdraw .5s linear infinite;
    animation: dashdraw .5s linear infinite
}

.react-flow__connectionline {
    z-index: 1001
}

.react-flow__nodes {
    pointer-events: none;
    transform-origin: 0 0
}

.react-flow__node {
    position: absolute;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    pointer-events: all;
    transform-origin: 0 0;
    box-sizing: border-box;
    cursor: -webkit-grab;
    cursor: grab
}

.react-flow__node.dragging {
    cursor: -webkit-grabbing;
    cursor: grabbing
}

.react-flow__nodesselection {
    z-index: 3;
    transform-origin: left top;
    pointer-events: none
}

.react-flow__nodesselection-rect {
    position: absolute;
    pointer-events: all;
    cursor: -webkit-grab;
    cursor: grab
}

.react-flow__handle {
    position: absolute;
    pointer-events: none;
    min-width: 5px;
    min-height: 5px;
    width: 6px;
    height: 6px;
    background: #1a192b;
    border: 1px solid white;
    border-radius: 100%
}

.react-flow__handle.connectionindicator {
    pointer-events: all;
    cursor: crosshair
}

.react-flow__handle-bottom {
    top: auto;
    left: 50%;
    bottom: -4px;
    transform: translate(-50%)
}

.react-flow__handle-top {
    left: 50%;
    top: -4px;
    transform: translate(-50%)
}

.react-flow__handle-left {
    top: 50%;
    left: -4px;
    transform: translateY(-50%)
}

.react-flow__handle-right {
    right: -4px;
    top: 50%;
    transform: translateY(-50%)
}

.react-flow__edgeupdater {
    cursor: move;
    pointer-events: all
}

.react-flow__panel {
    position: absolute;
    z-index: 5;
    margin: 15px
}

.react-flow__panel.top {
    top: 0
}

.react-flow__panel.bottom {
    bottom: 0
}

.react-flow__panel.left {
    left: 0
}

.react-flow__panel.right {
    right: 0
}

.react-flow__panel.center {
    left: 50%;
    transform: translate(-50%)
}

.react-flow__attribution {
    font-size: 10px;
    background: #ffffff80;
    padding: 2px 3px;
    margin: 0
}

.react-flow__attribution a {
    text-decoration: none;
    color: #999
}

@-webkit-keyframes dashdraw {
    0% {
        stroke-dashoffset: 10
    }
}

@keyframes dashdraw {
    0% {
        stroke-dashoffset: 10
    }
}

.react-flow__edgelabel-renderer {
    position: absolute;
    width: 100%;
    height: 100%;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.react-flow__edge.updating .react-flow__edge-path {
    stroke: #777
}

.react-flow__edge-text {
    font-size: 10px
}

.react-flow__node.selectable:focus,
.react-flow__node.selectable:focus-visible {
    outline: none
}

.react-flow__node-default,
.react-flow__node-input,
.react-flow__node-output,
.react-flow__node-group {
    padding: 10px;
    border-radius: 3px;
    width: 150px;
    font-size: 12px;
    color: #222;
    text-align: center;
    border-width: 1px;
    border-style: solid;
    border-color: #1a192b;
    background-color: #fff
}

.react-flow__node-default.selectable:hover,
.react-flow__node-input.selectable:hover,
.react-flow__node-output.selectable:hover,
.react-flow__node-group.selectable:hover {
    box-shadow: 0 1px 4px 1px #00000014
}

.react-flow__node-default.selectable.selected,
.react-flow__node-default.selectable:focus,
.react-flow__node-default.selectable:focus-visible,
.react-flow__node-input.selectable.selected,
.react-flow__node-input.selectable:focus,
.react-flow__node-input.selectable:focus-visible,
.react-flow__node-output.selectable.selected,
.react-flow__node-output.selectable:focus,
.react-flow__node-output.selectable:focus-visible,
.react-flow__node-group.selectable.selected,
.react-flow__node-group.selectable:focus,
.react-flow__node-group.selectable:focus-visible {
    box-shadow: 0 0 0 .5px #1a192b
}

.react-flow__node-group {
    background-color: #f0f0f040
}

.react-flow__nodesselection-rect,
.react-flow__selection {
    background: #0059dc14;
    border: 1px dotted rgba(0, 89, 220, .8)
}

.react-flow__nodesselection-rect:focus,
.react-flow__nodesselection-rect:focus-visible,
.react-flow__selection:focus,
.react-flow__selection:focus-visible {
    outline: none
}

.react-flow__controls {
    box-shadow: 0 0 2px 1px #00000014
}

.react-flow__controls-button {
    border: none;
    background: #fefefe;
    border-bottom: 1px solid #eee;
    box-sizing: content-box;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 16px;
    height: 16px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    padding: 5px
}

.react-flow__controls-button:hover {
    background: #f4f4f4
}

.react-flow__controls-button svg {
    width: 100%;
    max-width: 12px;
    max-height: 12px
}

.react-flow__controls-button:disabled {
    pointer-events: none
}

.react-flow__controls-button:disabled svg {
    fill-opacity: .4
}

.react-flow__minimap {
    background-color: #fff
}

.react-flow__minimap svg {
    display: block
}

.react-flow__resize-control {
    position: absolute
}

.react-flow__resize-control.left,
.react-flow__resize-control.right {
    cursor: ew-resize
}

.react-flow__resize-control.top,
.react-flow__resize-control.bottom {
    cursor: ns-resize
}

.react-flow__resize-control.top.left,
.react-flow__resize-control.bottom.right {
    cursor: nwse-resize
}

.react-flow__resize-control.bottom.left,
.react-flow__resize-control.top.right {
    cursor: nesw-resize
}

.react-flow__resize-control.handle {
    width: 4px;
    height: 4px;
    border: 1px solid #fff;
    border-radius: 1px;
    background-color: #3367d9;
    transform: translate(-50%, -50%)
}

.react-flow__resize-control.handle.left {
    left: 0;
    top: 50%
}

.react-flow__resize-control.handle.right {
    left: 100%;
    top: 50%
}

.react-flow__resize-control.handle.top {
    left: 50%;
    top: 0
}

.react-flow__resize-control.handle.bottom {
    left: 50%;
    top: 100%
}

.react-flow__resize-control.handle.top.left,
.react-flow__resize-control.handle.bottom.left {
    left: 0
}

.react-flow__resize-control.handle.top.right,
.react-flow__resize-control.handle.bottom.right {
    left: 100%
}

.react-flow__resize-control.line {
    border-color: #3367d9;
    border-width: 0;
    border-style: solid
}

.react-flow__resize-control.line.left,
.react-flow__resize-control.line.right {
    width: 1px;
    transform: translate(-50%);
    top: 0;
    height: 100%
}

.react-flow__resize-control.line.left {
    left: 0;
    border-left-width: 1px
}

.react-flow__resize-control.line.right {
    left: 100%;
    border-right-width: 1px
}

.react-flow__resize-control.line.top,
.react-flow__resize-control.line.bottom {
    height: 1px;
    transform: translateY(-50%);
    left: 0;
    width: 100%
}

.react-flow__resize-control.line.top {
    top: 0;
    border-top-width: 1px
}

.react-flow__resize-control.line.bottom {
    border-bottom-width: 1px;
    top: 100%
}

.plus-script-view {
    width: 100% !important;
    height: 100% !important;
    display: flex;
    flex-direction: column;
    flex-grow: 1
}

.plus-script-view .reactflow-wrapper {
    flex-grow: 1
}

@media screen and (min-width: 768px) {
    .plus-script-view {
        flex-direction: column
    }
}

.plus-script-toolbar {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%
}

.plus-script-toolbar>.btn-tool {
    padding: .75rem 1rem
}

.plus-script-toolbar>.btn-private>.label {
    width: 5rem;
    background-color: #b2b2b2
}

.plus-script-toolbar>.btn-public>.label {
    width: 5rem;
    background-color: #fff
}

.plus-script-divider {
    flex-grow: 1
}

.react-flow__node {
    border: 1px solid #1a192b;
    border-radius: .285rem;
    box-shadow: 0 1px 2px #22242626;
    min-width: 10rem;
    min-height: 2.5rem;
    padding: 0
}

.react-flow__node.selected {
    border-color: #26bfb0;
    box-shadow: 0 0 12px #26bfb0
}

.react-flow__node-scriptInput {
    background: #ecb576
}

.react-flow__node-scriptOutput {
    background: #bcd6ac
}

.react-flow__node-scriptStaticValue {
    background: #acd5d6
}

.react-flow__node-scriptAction {
    background: #ebadc2
}

.react-flow__node-scriptWriter {
    background: #adcbeb
}

.react-flow__node>.node-header {
    padding: .2rem .25rem;
    border-bottom: 1px solid rgba(0, 30, 60, .3);
    background: #001e3c26;
    text-align: center;
    font-size: .8rem;
    line-height: 1rem
}

.react-flow__node>.node-body {
    display: flex;
    flex-direction: column;
    padding: .25rem 0
}

.react-flow__node>.node-body.horizontal {
    flex-direction: row
}

.react-flow__node>.node-body>.node-label {
    text-align: center
}

.react-flow__node>.node-body>.node-input {
    padding: 0 .25rem;
    margin: 0 0 .25rem
}

.react-flow__node>.node-body>.node-sockets {
    width: 50%;
    display: flex;
    flex-direction: column
}

.react-flow__node>.node-body>.node-sockets.w-25 {
    width: 25%
}

.react-flow__node>.node-body>.node-sockets.w-50 {
    width: 50%
}

.react-flow__node>.node-body>.node-sockets.w-100 {
    width: 100%
}

.react-flow__node>.node-body .node-socket {
    position: relative;
    font-size: .6rem;
    line-height: .8rem
}

.react-flow__node>.node-body .node-socket.input {
    text-align: left;
    padding-left: .5rem
}

.react-flow__node>.node-body .node-socket.output {
    text-align: right;
    padding-right: .5rem
}

.node-socket .react-flow__handle {
    width: .8rem;
    height: .8rem;
    background: #1a192b;
    color: #fff;
    overflow: hidden
}

.node-socket .react-flow__handle>span {
    display: block;
    text-align: center;
    line-height: .8rem;
    pointer-events: none
}

.node-socket .react-flow__handle-left {
    left: -.4rem
}

.node-socket .react-flow__handle-right {
    right: -.4rem
}

.node-socket.elevation1 {
    box-shadow: 0 2px 1px -1px #0003, 0 1px 1px #00000024, 0 1px 3px #0000001f;
    border-radius: 4px
}

.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane>svg,
.leaflet-pane>canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
    position: absolute;
    left: 0;
    top: 0
}

.leaflet-container {
    overflow: hidden
}

.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-user-drag: none
}

.leaflet-tile::selection {
    background: transparent
}

.leaflet-safari .leaflet-tile {
    image-rendering: -webkit-optimize-contrast
}

.leaflet-safari .leaflet-tile-container {
    width: 1600px;
    height: 1600px;
    -webkit-transform-origin: 0 0
}

.leaflet-marker-icon,
.leaflet-marker-shadow {
    display: block
}

.leaflet-container .leaflet-overlay-pane svg {
    max-width: none !important;
    max-height: none !important
}

.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer,
.leaflet-container .leaflet-tile {
    max-width: none !important;
    max-height: none !important;
    width: auto;
    padding: 0
}

.leaflet-container img.leaflet-tile {
    mix-blend-mode: plus-lighter
}

.leaflet-container.leaflet-touch-zoom {
    -ms-touch-action: pan-x pan-y;
    touch-action: pan-x pan-y
}

.leaflet-container.leaflet-touch-drag {
    -ms-touch-action: pinch-zoom;
    touch-action: none;
    touch-action: pinch-zoom
}

.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
    -ms-touch-action: none;
    touch-action: none
}

.leaflet-container {
    -webkit-tap-highlight-color: transparent
}

.leaflet-container a {
    -webkit-tap-highlight-color: rgba(51, 181, 229, .4)
}

.leaflet-tile {
    filter: inherit;
    visibility: hidden
}

.leaflet-tile-loaded {
    visibility: inherit
}

.leaflet-zoom-box {
    width: 0;
    height: 0;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 800
}

.leaflet-overlay-pane svg {
    -moz-user-select: none
}

.leaflet-pane {
    z-index: 400
}

.leaflet-tile-pane {
    z-index: 200
}

.leaflet-overlay-pane {
    z-index: 400
}

.leaflet-shadow-pane {
    z-index: 500
}

.leaflet-marker-pane {
    z-index: 600
}

.leaflet-tooltip-pane {
    z-index: 650
}

.leaflet-popup-pane {
    z-index: 700
}

.leaflet-map-pane canvas {
    z-index: 100
}

.leaflet-map-pane svg {
    z-index: 200
}

.leaflet-vml-shape {
    width: 1px;
    height: 1px
}

.lvml {
    behavior: url(#default#VML);
    display: inline-block;
    position: absolute
}

.leaflet-control {
    position: relative;
    z-index: 800;
    pointer-events: visiblePainted;
    pointer-events: auto
}

.leaflet-top,
.leaflet-bottom {
    position: absolute;
    z-index: 1000;
    pointer-events: none
}

.leaflet-top {
    top: 0
}

.leaflet-right {
    right: 0
}

.leaflet-bottom {
    bottom: 0
}

.leaflet-left {
    left: 0
}

.leaflet-control {
    float: left;
    clear: both
}

.leaflet-right .leaflet-control {
    float: right
}

.leaflet-top .leaflet-control {
    margin-top: 10px
}

.leaflet-bottom .leaflet-control {
    margin-bottom: 10px
}

.leaflet-left .leaflet-control {
    margin-left: 10px
}

.leaflet-right .leaflet-control {
    margin-right: 10px
}

.leaflet-fade-anim .leaflet-popup {
    opacity: 0;
    -webkit-transition: opacity .2s linear;
    -moz-transition: opacity .2s linear;
    transition: opacity .2s linear
}

.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
    opacity: 1
}

.leaflet-zoom-animated {
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0
}

svg.leaflet-zoom-animated {
    will-change: transform
}

.leaflet-zoom-anim .leaflet-zoom-animated {
    -webkit-transition: -webkit-transform .25s cubic-bezier(0, 0, .25, 1);
    -moz-transition: -moz-transform .25s cubic-bezier(0, 0, .25, 1);
    transition: transform .25s cubic-bezier(0, 0, .25, 1)
}

.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
    -webkit-transition: none;
    -moz-transition: none;
    transition: none
}

.leaflet-zoom-anim .leaflet-zoom-hide {
    visibility: hidden
}

.leaflet-interactive {
    cursor: pointer
}

.leaflet-grab {
    cursor: -webkit-grab;
    cursor: -moz-grab;
    cursor: grab
}

.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
    cursor: crosshair
}

.leaflet-popup-pane,
.leaflet-control {
    cursor: auto
}

.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
    cursor: move;
    cursor: -webkit-grabbing;
    cursor: -moz-grabbing;
    cursor: grabbing
}

.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane>svg path,
.leaflet-tile-container {
    pointer-events: none
}

.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane>svg path.leaflet-interactive,
svg.leaflet-image-layer.leaflet-interactive path {
    pointer-events: visiblePainted;
    pointer-events: auto
}

.leaflet-container {
    background: #ddd;
    outline-offset: 1px
}

.leaflet-container a {
    color: #0078a8
}

.leaflet-zoom-box {
    border: 2px dotted #38f;
    background: #ffffff80
}

.leaflet-container {
    font-family: Helvetica Neue, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-size: .75rem;
    line-height: 1.5
}

.leaflet-bar {
    box-shadow: 0 1px 5px #000000a6;
    border-radius: 4px
}

.leaflet-bar a {
    background-color: #fff;
    border-bottom: 1px solid #ccc;
    width: 26px;
    height: 26px;
    line-height: 26px;
    display: block;
    text-align: center;
    text-decoration: none;
    color: #000
}

.leaflet-bar a,
.leaflet-control-layers-toggle {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    display: block
}

.leaflet-bar a:hover,
.leaflet-bar a:focus {
    background-color: #f4f4f4
}

.leaflet-bar a:first-child {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px
}

.leaflet-bar a:last-child {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    border-bottom: none
}

.leaflet-bar a.leaflet-disabled {
    cursor: default;
    background-color: #f4f4f4;
    color: #bbb
}

.leaflet-touch .leaflet-bar a {
    width: 30px;
    height: 30px;
    line-height: 30px
}

.leaflet-touch .leaflet-bar a:first-child {
    border-top-left-radius: 2px;
    border-top-right-radius: 2px
}

.leaflet-touch .leaflet-bar a:last-child {
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px
}

.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
    font: 700 18px Lucida Console, Monaco, monospace;
    text-indent: 1px
}

.leaflet-touch .leaflet-control-zoom-in,
.leaflet-touch .leaflet-control-zoom-out {
    font-size: 22px
}

.leaflet-control-layers {
    box-shadow: 0 1px 5px #0006;
    background: #fff;
    border-radius: 5px
}

.leaflet-control-layers-toggle {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAACf0lEQVR4AY1UM3gkARTePdvdoTxXKc+qTl3aU5U6b2Kbkz3Gtq3Zw6ziLGNPzrYx7946Tr6/ee/XeCQ4D3ykPtL5tHno4n0d/h3+xfuWHGLX81cn7r0iTNzjr7LrlxCqPtkbTQEHeqOrTy4Yyt3VCi/IOB0v7rVC7q45Q3Gr5K6jt+3Gl5nCoDD4MtO+j96Wu8atmhGqcNGHObuf8OM/x3AMx38+4Z2sPqzCxRFK2aF2e5Jol56XTLyggAMTL56XOMoS1W4pOyjUcGGQdZxU6qRh7B9Zp+PfpOFlqt0zyDZckPi1ttmIp03jX8gyJ8a/PG2yutpS/Vol7peZIbZcKBAEEheEIAgFbDkz5H6Zrkm2hVWGiXKiF4Ycw0RWKdtC16Q7qe3X4iOMxruonzegJzWaXFrU9utOSsLUmrc0YjeWYjCW4PDMADElpJSSQ0vQvA1Tm6/JlKnqFs1EGyZiFCqnRZTEJJJiKRYzVYzJck2Rm6P4iH+cmSY0YzimYa8l0EtTODFWhcMIMVqdsI2uiTvKmTisIDHJ3od5GILVhBCarCfVRmo4uTjkhrhzkiBV7SsaqS+TzrzM1qpGGUFt28pIySQHR6h7F6KSwGWm97ay+Z+ZqMcEjEWebE7wxCSQwpkhJqoZA5ivCdZDjJepuJ9IQjGGUmuXJdBFUygxVqVsxFsLMbDe8ZbDYVCGKxs+W080max1hFCarCfV+C1KATwcnvE9gRRuMP2prdbWGowm1KB1y+zwMMENkM755cJ2yPDtqhTI6ED1M/82yIDtC/4j4BijjeObflpO9I9MwXTCsSX8jWAFeHr05WoLTJ5G8IQVS/7vwR6ohirYM7f6HzYpogfS3R2OAAAAAElFTkSuQmCC);
    width: 36px;
    height: 36px
}

.leaflet-retina .leaflet-control-layers-toggle {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADQAAAA0CAQAAABvcdNgAAAEsklEQVR4AWL4TydIhpZK1kpWOlg0w3ZXP6D2soBtG42jeI6ZmQTHzAxiTbSJsYLjO9HhP+WOmcuhciVnmHVQcJnp7DFvScowZorad/+V/fVzMdMT2g9Cv9guXGv/7pYOrXh2U+RRR3dSd9JRx6bIFc/ekqHI29JC6pJ5ZEh1yWkhkbcFeSjxgx3L2m1cb1C7bceyxA+CNjT/Ifff+/kDk2u/w/33/IeCMOSaWZ4glosqT3DNnNZQ7Cs58/3Ce5HL78iZH/vKVIaYlqzfdLu8Vi7dnvUbEza5Idt36tquZFldl6N5Z/POLof0XLK61mZCmJSWjVF9tEjUluu74IUXvgttuVIHE7YxSkaYhJZam7yiM9Pv82JYfl9nptxZaxMJE4YSPty+vF0+Y2up9d3wwijfjZbabqm/3bZ9ecKHsiGmRflnn1MW4pjHf9oLufyn2z3y1D6n8g8TZhxyzipLNPnAUpsOiuWimg52psrTZYnOWYNDTMuWBWa0tJb4rgq1UvmutpaYEbZlwU3CLJm/ayYjHW5/h7xWLn9Hh1vepDkyf7dE7MtT5LR4e7yYpHrkhOUpEfssBLq2pPhAqoSWKUkk7EDqkmK6RrCEzqDjhNDWNE+XSMvkJRDWlZTmCW0l0PHQGRZY5t1L83kT0Y3l2SItk5JAWHl2dCOBm+fPu3fo5/3v61RMCO9Jx2EEYYhb0rmNQMX/vm7gqOEJLcXTGw3CAuRNeyaPWwjR8PRqKQ1PDA/dpv+on9Shox52WFnx0KY8onHayrJzm87i5h9xGw/tfkev0jGsQizqezUKjk12hBMKJ4kbCqGPVNXudyyrShovGw5CgxsRICxF6aRmSjlBnHRzg7Gx8fKqEubI2rahQYdR1YgDIRQO7JvQyD52hoIQx0mxa0ODtW2Iozn1le2iIRdzwWewedyZzewidueOGqlsn1MvcnQpuVwLGG3/IR1hIKxCjelIDZ8ldqWz25jWAsnldEnK0Zxro19TGVb2ffIZEsIO89EIEDvKMPrzmBOQcKQ+rroye6NgRRxqR4U8EAkz0CL6uSGOm6KQCdWjvjRiSP1BPalCRS5iQYiEIvxuBMJEWgzSoHADcVMuN7IuqqTeyUPq22qFimFtxDyBBJEwNyt6TM88blFHao/6tWWhuuOM4SAK4EI4QmFHA+SEyWlp4EQoJ13cYGzMu7yszEIBOm2rVmHUNqwAIQabISNMRstmdhNWcFLsSm+0tjJH1MdRxO5Nx0WDMhCtgD6OKgZeljJqJKc9po8juskR9XN0Y1lZ3mWjLR9JCO1jRDMd0fpYC2VnvjBSEFg7wBENc0R9HFlb0xvF1+TBEpF68d+DHR6IOWVv2BECtxo46hOFUBd/APU57WIoEwJhIi2CdpyZX0m93BZicktMj1AS9dClteUFAUNUIEygRZCtik5zSxI9MubTBH1GOiHsiLJ3OCoSZkILa9PxiN0EbvhsAo8tdAf9Seepd36lGWHmtNANTv5Jd0z4QYyeo/UEJqxKRpg5LZx6btLPsOaEmdMyxYdlc8LMaJnikDlhclqmPiQnTEpLUIZEwkRagjYkEibQErwhkTAKCLQEbUgkzJQWc/0PstHHcfEdQ+UAAAAASUVORK5CYII=);
    background-size: 26px 26px
}

.leaflet-touch .leaflet-control-layers-toggle {
    width: 44px;
    height: 44px
}

.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
    display: none
}

.leaflet-control-layers-expanded .leaflet-control-layers-list {
    display: block;
    position: relative
}

.leaflet-control-layers-expanded {
    padding: 6px 10px 6px 6px;
    color: #333;
    background: #fff
}

.leaflet-control-layers-scrollbar {
    overflow-y: scroll;
    overflow-x: hidden;
    padding-right: 5px
}

.leaflet-control-layers-selector {
    margin-top: 2px;
    position: relative;
    top: 1px
}

.leaflet-control-layers label {
    display: block;
    font-size: 13px;
    font-size: 1.08333em
}

.leaflet-control-layers-separator {
    height: 0;
    border-top: 1px solid #ddd;
    margin: 5px -10px 5px -6px
}

.leaflet-default-icon-path {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAApCAYAAADAk4LOAAAFgUlEQVR4Aa1XA5BjWRTN2oW17d3YaZtr2962HUzbDNpjszW24mRt28p47v7zq/bXZtrp/lWnXr337j3nPCe85NcypgSFdugCpW5YoDAMRaIMqRi6aKq5E3YqDQO3qAwjVWrD8Ncq/RBpykd8oZUb/kaJutow8r1aP9II0WmLKLIsJyv1w/kqw9Ch2MYdB++12Onxee/QMwvf4/Dk/Lfp/i4nxTXtOoQ4pW5Aj7wpici1A9erdAN2OH64x8OSP9j3Ft3b7aWkTg/Fm91siTra0f9on5sQr9INejH6CUUUpavjFNq1B+Oadhxmnfa8RfEmN8VNAsQhPqF55xHkMzz3jSmChWU6f7/XZKNH+9+hBLOHYozuKQPxyMPUKkrX/K0uWnfFaJGS1QPRtZsOPtr3NsW0uyh6NNCOkU3Yz+bXbT3I8G3xE5EXLXtCXbbqwCO9zPQYPRTZ5vIDXD7U+w7rFDEoUUf7ibHIR4y6bLVPXrz8JVZEql13trxwue/uDivd3fkWRbS6/IA2bID4uk0UpF1N8qLlbBlXs4Ee7HLTfV1j54APvODnSfOWBqtKVvjgLKzF5YdEk5ewRkGlK0i33Eofffc7HT56jD7/6U+qH3Cx7SBLNntH5YIPvODnyfIXZYRVDPqgHtLs5ABHD3YzLuespb7t79FY34DjMwrVrcTuwlT55YMPvOBnRrJ4VXTdNnYug5ucHLBjEpt30701A3Ts+HEa73u6dT3FNWwflY86eMHPk+Yu+i6pzUpRrW7SNDg5JHR4KapmM5Wv2E8Tfcb1HoqqHMHU+uWDD7zg54mz5/2BSnizi9T1Dg4QQXLToGNCkb6tb1NU+QAlGr1++eADrzhn/u8Q2YZhQVlZ5+CAOtqfbhmaUCS1ezNFVm2imDbPmPng5wmz+gwh+oHDce0eUtQ6OGDIyR0uUhUsoO3vfDmmgOezH0mZN59x7MBi++WDL1g/eEiU3avlidO671bkLfwbw5XV2P8Pzo0ydy4t2/0eu33xYSOMOD8hTf4CrBtGMSoXfPLchX+J0ruSePw3LZeK0juPJbYzrhkH0io7B3k164hiGvawhOKMLkrQLyVpZg8rHFW7E2uHOL888IBPlNZ1FPzstSJM694fWr6RwpvcJK60+0HCILTBzZLFNdtAzJaohze60T8qBzyh5ZuOg5e7uwQppofEmf2++DYvmySqGBuKaicF1blQjhuHdvCIMvp8whTTfZzI7RldpwtSzL+F1+wkdZ2TBOW2gIF88PBTzD/gpeREAMEbxnJcaJHNHrpzji0gQCS6hdkEeYt9DF/2qPcEC8RM28Hwmr3sdNyht00byAut2k3gufWNtgtOEOFGUwcXWNDbdNbpgBGxEvKkOQsxivJx33iow0Vw5S6SVTrpVq11ysA2Rp7gTfPfktc6zhtXBBC+adRLshf6sG2RfHPZ5EAc4sVZ83yCN00Fk/4kggu40ZTvIEm5g24qtU4KjBrx/BTTH8ifVASAG7gKrnWxJDcU7x8X6Ecczhm3o6YicvsLXWfh3Ch1W0k8x0nXF+0fFxgt4phz8QvypiwCCFKMqXCnqXExjq10beH+UUA7+nG6mdG/Pu0f3LgFcGrl2s0kNNjpmoJ9o4B29CMO8dMT4Q5ox8uitF6fqsrJOr8qnwNbRzv6hSnG5wP+64C7h9lp30hKNtKdWjtdkbuPA19nJ7Tz3zR/ibgARbhb4AlhavcBebmTHcFl2fvYEnW0ox9xMxKBS8btJ+KiEbq9zA4RthQXDhPa0T9TEe69gWupwc6uBUphquXgf+/FrIjweHQS4/pduMe5ERUMHUd9xv8ZR98CxkS4F2n3EUrUZ10EYNw7BWm9x1GiPssi3GgiGRDKWRYZfXlON+dfNbM+GgIwYdwAAAAASUVORK5CYII=)
}

.leaflet-container .leaflet-control-attribution {
    background: #fff;
    background: #fffc;
    margin: 0
}

.leaflet-control-attribution,
.leaflet-control-scale-line {
    padding: 0 5px;
    color: #333;
    line-height: 1.4
}

.leaflet-control-attribution a {
    text-decoration: none
}

.leaflet-control-attribution a:hover,
.leaflet-control-attribution a:focus {
    text-decoration: underline
}

.leaflet-attribution-flag {
    display: inline !important;
    vertical-align: baseline !important;
    width: 1em;
    height: .6669em
}

.leaflet-left .leaflet-control-scale {
    margin-left: 5px
}

.leaflet-bottom .leaflet-control-scale {
    margin-bottom: 5px
}

.leaflet-control-scale-line {
    border: 2px solid #777;
    border-top: none;
    line-height: 1.1;
    padding: 2px 5px 1px;
    white-space: nowrap;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background: #fffc;
    text-shadow: 1px 1px #fff
}

.leaflet-control-scale-line:not(:first-child) {
    border-top: 2px solid #777;
    border-bottom: none;
    margin-top: -2px
}

.leaflet-control-scale-line:not(:first-child):not(:last-child) {
    border-bottom: 2px solid #777
}

.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
    box-shadow: none
}

.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
    border: 2px solid rgba(0, 0, 0, .2);
    background-clip: padding-box
}

.leaflet-popup {
    position: absolute;
    text-align: center;
    margin-bottom: 20px
}

.leaflet-popup-content-wrapper {
    padding: 1px;
    text-align: left;
    border-radius: 12px
}

.leaflet-popup-content {
    margin: 13px 24px 13px 20px;
    line-height: 1.3;
    font-size: 13px;
    font-size: 1.08333em;
    min-height: 1px
}

.leaflet-popup-content p {
    margin: 1.3em 0
}

.leaflet-popup-tip-container {
    width: 40px;
    height: 20px;
    position: absolute;
    left: 50%;
    margin-top: -1px;
    margin-left: -20px;
    overflow: hidden;
    pointer-events: none
}

.leaflet-popup-tip {
    width: 17px;
    height: 17px;
    padding: 1px;
    margin: -10px auto 0;
    pointer-events: auto;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
    background: #fff;
    color: #333;
    box-shadow: 0 3px 14px #0006
}

.leaflet-container a.leaflet-popup-close-button {
    position: absolute;
    top: 0;
    right: 0;
    border: none;
    text-align: center;
    width: 24px;
    height: 24px;
    font: 16px/24px Tahoma, Verdana, sans-serif;
    color: #757575;
    text-decoration: none;
    background: transparent
}

.leaflet-container a.leaflet-popup-close-button:hover,
.leaflet-container a.leaflet-popup-close-button:focus {
    color: #585858
}

.leaflet-popup-scrolled {
    overflow: auto
}

.leaflet-oldie .leaflet-popup-content-wrapper {
    -ms-zoom: 1
}

.leaflet-oldie .leaflet-popup-tip {
    width: 24px;
    margin: 0 auto;
    -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
    filter: progid:DXImageTransform.Microsoft.Matrix(M11=.70710678, M12=.70710678, M21=-.70710678, M22=.70710678)
}

.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
    border: 1px solid #999
}

.leaflet-div-icon {
    background: #fff;
    border: 1px solid #666
}

.leaflet-tooltip {
    position: absolute;
    padding: 6px;
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 3px;
    color: #222;
    white-space: nowrap;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none;
    box-shadow: 0 1px 3px #0006
}

.leaflet-tooltip.leaflet-interactive {
    cursor: pointer;
    pointer-events: auto
}

.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
    position: absolute;
    pointer-events: none;
    border: 6px solid transparent;
    background: transparent;
    content: ""
}

.leaflet-tooltip-bottom {
    margin-top: 6px
}

.leaflet-tooltip-top {
    margin-top: -6px
}

.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
    left: 50%;
    margin-left: -6px
}

.leaflet-tooltip-top:before {
    bottom: 0;
    margin-bottom: -12px;
    border-top-color: #fff
}

.leaflet-tooltip-bottom:before {
    top: 0;
    margin-top: -12px;
    margin-left: -6px;
    border-bottom-color: #fff
}

.leaflet-tooltip-left {
    margin-left: -6px
}

.leaflet-tooltip-right {
    margin-left: 6px
}

.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
    top: 50%;
    margin-top: -6px
}

.leaflet-tooltip-left:before {
    right: 0;
    margin-right: -12px;
    border-left-color: #fff
}

.leaflet-tooltip-right:before {
    left: 0;
    margin-left: -12px;
    border-right-color: #fff
}

@media print {
    .leaflet-control {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact
    }
}

@keyframes plyr-progress {
    to {
        background-position: 25px 0;
        background-position: var(--plyr-progress-loading-size, 25px) 0
    }
}

@keyframes plyr-popup {
    0% {
        opacity: .5;
        transform: translateY(10px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

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

    to {
        opacity: 1
    }
}

.plyr {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    align-items: center;
    direction: ltr;
    display: flex;
    flex-direction: column;
    font-family: inherit;
    font-family: var(--plyr-font-family, inherit);
    font-variant-numeric: tabular-nums;
    font-weight: 400;
    font-weight: var(--plyr-font-weight-regular, 400);
    line-height: 1.7;
    line-height: var(--plyr-line-height, 1.7);
    max-width: 100%;
    min-width: 200px;
    position: relative;
    text-shadow: none;
    transition: box-shadow .3s ease;
    z-index: 0
}

.plyr audio,
.plyr iframe,
.plyr video {
    display: block;
    height: 100%;
    width: 100%
}

.plyr button {
    font: inherit;
    line-height: inherit;
    width: auto
}

.plyr:focus {
    outline: 0
}

.plyr--full-ui {
    box-sizing: border-box
}

.plyr--full-ui *,
.plyr--full-ui :after,
.plyr--full-ui :before {
    box-sizing: inherit
}

.plyr--full-ui a,
.plyr--full-ui button,
.plyr--full-ui input,
.plyr--full-ui label {
    touch-action: manipulation
}

.plyr__badge {
    background: #4a5464;
    background: var(--plyr-badge-background, #4a5464);
    border-radius: 2px;
    border-radius: var(--plyr-badge-border-radius, 2px);
    color: #fff;
    color: var(--plyr-badge-text-color, #fff);
    font-size: 9px;
    font-size: var(--plyr-font-size-badge, 9px);
    line-height: 1;
    padding: 3px 4px
}

.plyr--full-ui ::-webkit-media-text-track-container {
    display: none
}

.plyr__captions {
    animation: plyr-fade-in .3s ease;
    bottom: 0;
    display: none;
    font-size: 13px;
    font-size: var(--plyr-font-size-small, 13px);
    left: 0;
    padding: 10px;
    padding: var(--plyr-control-spacing, 10px);
    position: absolute;
    text-align: center;
    transition: transform .4s ease-in-out;
    width: 100%
}

.plyr__captions span:empty {
    display: none
}

@media (min-width:480px) {
    .plyr__captions {
        font-size: 15px;
        font-size: var(--plyr-font-size-base, 15px);
        padding: 20px;
        padding: calc(var(--plyr-control-spacing, 10px)*2)
    }
}

@media (min-width:768px) {
    .plyr__captions {
        font-size: 18px;
        font-size: var(--plyr-font-size-large, 18px)
    }
}

.plyr--captions-active .plyr__captions {
    display: block
}

.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty)~.plyr__captions {
    transform: translateY(-40px);
    transform: translateY(calc(var(--plyr-control-spacing, 10px)*-4))
}

.plyr__caption {
    background: #000c;
    background: var(--plyr-captions-background, #000c);
    border-radius: 2px;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    color: #fff;
    color: var(--plyr-captions-text-color, #fff);
    line-height: 185%;
    padding: .2em .5em;
    white-space: pre-wrap
}

.plyr__caption div {
    display: inline
}

.plyr__control {
    background: #0000;
    border: 0;
    border-radius: 3px;
    border-radius: var(--plyr-control-radius, 3px);
    color: inherit;
    cursor: pointer;
    flex-shrink: 0;
    overflow: visible;
    padding: 7px;
    padding: calc(var(--plyr-control-spacing, 10px)*.7);
    position: relative;
    transition: all .3s ease
}

.plyr__control svg {
    fill: currentColor;
    display: block;
    height: 18px;
    height: var(--plyr-control-icon-size, 18px);
    pointer-events: none;
    width: 18px;
    width: var(--plyr-control-icon-size, 18px)
}

.plyr__control:focus {
    outline: 0
}

.plyr__control:focus-visible {
    outline: 2px dashed #00b2ff;
    outline: 2px dashed var(--plyr-focus-visible-color, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
    outline-offset: 2px
}

a.plyr__control {
    text-decoration: none
}

.plyr__control.plyr__control--pressed .icon--not-pressed,
.plyr__control.plyr__control--pressed .label--not-pressed,
.plyr__control:not(.plyr__control--pressed) .icon--pressed,
.plyr__control:not(.plyr__control--pressed) .label--pressed,
a.plyr__control:after,
a.plyr__control:before {
    display: none
}

.plyr--full-ui ::-webkit-media-controls {
    display: none
}

.plyr__controls {
    align-items: center;
    display: flex;
    justify-content: flex-end;
    text-align: center
}

.plyr__controls .plyr__progress__container {
    flex: 1;
    min-width: 0
}

.plyr__controls .plyr__controls__item {
    margin-left: 2.5px;
    margin-left: calc(var(--plyr-control-spacing, 10px)/4)
}

.plyr__controls .plyr__controls__item:first-child {
    margin-left: 0;
    margin-right: auto
}

.plyr__controls .plyr__controls__item.plyr__progress__container {
    padding-left: 2.5px;
    padding-left: calc(var(--plyr-control-spacing, 10px)/4)
}

.plyr__controls .plyr__controls__item.plyr__time {
    padding: 0 5px;
    padding: 0 calc(var(--plyr-control-spacing, 10px)/2)
}

.plyr__controls .plyr__controls__item.plyr__progress__container:first-child,
.plyr__controls .plyr__controls__item.plyr__time+.plyr__time,
.plyr__controls .plyr__controls__item.plyr__time:first-child {
    padding-left: 0
}

.plyr [data-plyr=airplay],
.plyr [data-plyr=captions],
.plyr [data-plyr=fullscreen],
.plyr [data-plyr=pip],
.plyr__controls:empty {
    display: none
}

.plyr--airplay-supported [data-plyr=airplay],
.plyr--captions-enabled [data-plyr=captions],
.plyr--fullscreen-enabled [data-plyr=fullscreen],
.plyr--pip-supported [data-plyr=pip] {
    display: inline-block
}

.plyr__menu {
    display: flex;
    position: relative
}

.plyr__menu .plyr__control svg {
    transition: transform .3s ease
}

.plyr__menu .plyr__control[aria-expanded=true] svg {
    transform: rotate(90deg)
}

.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip {
    display: none
}

.plyr__menu__container {
    animation: plyr-popup .2s ease;
    background: #ffffffe6;
    background: var(--plyr-menu-background, #ffffffe6);
    border-radius: 4px;
    border-radius: var(--plyr-menu-radius, 4px);
    bottom: 100%;
    box-shadow: 0 1px 2px #00000026;
    box-shadow: var(--plyr-menu-shadow, 0 1px 2px #00000026);
    color: #4a5464;
    color: var(--plyr-menu-color, #4a5464);
    font-size: 15px;
    font-size: var(--plyr-font-size-base, 15px);
    margin-bottom: 10px;
    position: absolute;
    right: -3px;
    text-align: left;
    white-space: nowrap;
    z-index: 3
}

.plyr__menu__container>div {
    overflow: hidden;
    transition: height .35s cubic-bezier(.4, 0, .2, 1), width .35s cubic-bezier(.4, 0, .2, 1)
}

.plyr__menu__container:after {
    border: 4px solid #0000;
    border-top-color: #ffffffe6;
    border: var(--plyr-menu-arrow-size, 4px) solid #0000;
    border-top-color: var(--plyr-menu-background, #ffffffe6);
    content: "";
    height: 0;
    position: absolute;
    right: 14px;
    right: calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7 - var(--plyr-menu-arrow-size, 4px)/2);
    top: 100%;
    width: 0
}

.plyr__menu__container [role=menu] {
    padding: 7px;
    padding: calc(var(--plyr-control-spacing, 10px)*.7)
}

.plyr__menu__container [role=menuitem],
.plyr__menu__container [role=menuitemradio] {
    margin-top: 2px
}

.plyr__menu__container [role=menuitem]:first-child,
.plyr__menu__container [role=menuitemradio]:first-child {
    margin-top: 0
}

.plyr__menu__container .plyr__control {
    align-items: center;
    color: #4a5464;
    color: var(--plyr-menu-color, #4a5464);
    display: flex;
    font-size: 13px;
    font-size: var(--plyr-font-size-menu, var(--plyr-font-size-small, 13px));
    padding: 4.66667px 10.5px;
    padding: calc(var(--plyr-control-spacing, 10px)*.7/1.5) calc(var(--plyr-control-spacing, 10px)*.7*1.5);
    -webkit-user-select: none;
    user-select: none;
    width: 100%
}

.plyr__menu__container .plyr__control>span {
    align-items: inherit;
    display: flex;
    width: 100%
}

.plyr__menu__container .plyr__control:after {
    border: 4px solid #0000;
    border: var(--plyr-menu-item-arrow-size, 4px) solid #0000;
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.plyr__menu__container .plyr__control--forward {
    padding-right: 28px;
    padding-right: calc(var(--plyr-control-spacing, 10px)*.7*4)
}

.plyr__menu__container .plyr__control--forward:after {
    border-left-color: #728197;
    border-left-color: var(--plyr-menu-arrow-color, #728197);
    right: 6.5px;
    right: calc(var(--plyr-control-spacing, 10px)*.7*1.5 - var(--plyr-menu-item-arrow-size, 4px))
}

.plyr__menu__container .plyr__control--forward:focus-visible:after,
.plyr__menu__container .plyr__control--forward:hover:after {
    border-left-color: initial
}

.plyr__menu__container .plyr__control--back {
    font-weight: 400;
    font-weight: var(--plyr-font-weight-regular, 400);
    margin: 7px;
    margin: calc(var(--plyr-control-spacing, 10px)*.7);
    margin-bottom: 3.5px;
    margin-bottom: calc(var(--plyr-control-spacing, 10px)*.7/2);
    padding-left: 28px;
    padding-left: calc(var(--plyr-control-spacing, 10px)*.7*4);
    position: relative;
    width: calc(100% - 14px);
    width: calc(100% - var(--plyr-control-spacing, 10px)*.7*2)
}

.plyr__menu__container .plyr__control--back:after {
    border-right-color: #728197;
    border-right-color: var(--plyr-menu-arrow-color, #728197);
    left: 6.5px;
    left: calc(var(--plyr-control-spacing, 10px)*.7*1.5 - var(--plyr-menu-item-arrow-size, 4px))
}

.plyr__menu__container .plyr__control--back:before {
    background: #dcdfe5;
    background: var(--plyr-menu-back-border-color, #dcdfe5);
    box-shadow: 0 1px #fff;
    box-shadow: 0 1px 0 var(--plyr-menu-back-border-shadow-color, #fff);
    content: "";
    height: 1px;
    left: 0;
    margin-top: 3.5px;
    margin-top: calc(var(--plyr-control-spacing, 10px)*.7/2);
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 100%
}

.plyr__menu__container .plyr__control--back:focus-visible:after,
.plyr__menu__container .plyr__control--back:hover:after {
    border-right-color: initial
}

.plyr__menu__container .plyr__control[role=menuitemradio] {
    padding-left: 7px;
    padding-left: calc(var(--plyr-control-spacing, 10px)*.7)
}

.plyr__menu__container .plyr__control[role=menuitemradio]:after,
.plyr__menu__container .plyr__control[role=menuitemradio]:before {
    border-radius: 100%
}

.plyr__menu__container .plyr__control[role=menuitemradio]:before {
    background: #0000001a;
    content: "";
    display: block;
    flex-shrink: 0;
    height: 16px;
    margin-right: 10px;
    margin-right: var(--plyr-control-spacing, 10px);
    transition: all .3s ease;
    width: 16px
}

.plyr__menu__container .plyr__control[role=menuitemradio]:after {
    background: #fff;
    border: 0;
    height: 6px;
    left: 12px;
    opacity: 0;
    top: 50%;
    transform: translateY(-50%) scale(0);
    transition: transform .3s ease, opacity .3s ease;
    width: 6px
}

.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:before {
    background: #00b2ff;
    background: var(--plyr-control-toggle-checked-background, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)))
}

.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:after {
    opacity: 1;
    transform: translateY(-50%) scale(1)
}

.plyr__menu__container .plyr__control[role=menuitemradio]:focus-visible:before,
.plyr__menu__container .plyr__control[role=menuitemradio]:hover:before {
    background: #23282f1a
}

.plyr__menu__container .plyr__menu__value {
    align-items: center;
    display: flex;
    margin-left: auto;
    margin-right: -5px;
    margin-right: calc(var(--plyr-control-spacing, 10px)*.7*-1 - -2px);
    overflow: hidden;
    padding-left: 24.5px;
    padding-left: calc(var(--plyr-control-spacing, 10px)*.7*3.5);
    pointer-events: none
}

.plyr--full-ui input[type=range] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #0000;
    border: 0;
    border-radius: 26px;
    border-radius: calc(var(--plyr-range-thumb-height, 13px)*2);
    color: #00b2ff;
    color: var(--plyr-range-fill-background, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
    display: block;
    height: 19px;
    height: calc(var(--plyr-range-thumb-active-shadow-width, 3px)*2 + var(--plyr-range-thumb-height, 13px));
    margin: 0;
    min-width: 0;
    padding: 0;
    transition: box-shadow .3s ease;
    width: 100%
}

.plyr--full-ui input[type=range]::-webkit-slider-runnable-track {
    background: #0000;
    background-image: linear-gradient(90deg, currentColor 0, #0000 0);
    background-image: linear-gradient(to right, currentColor var(--value, 0), #0000 var(--value, 0));
    border: 0;
    border-radius: 2.5px;
    border-radius: calc(var(--plyr-range-track-height, 5px)/2);
    height: 5px;
    height: var(--plyr-range-track-height, 5px);
    -webkit-transition: box-shadow .3s ease;
    transition: box-shadow .3s ease;
    -webkit-user-select: none;
    user-select: none
}

.plyr--full-ui input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #fff;
    background: var(--plyr-range-thumb-background, #fff);
    border: 0;
    border-radius: 100%;
    box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33;
    box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33);
    height: 13px;
    height: var(--plyr-range-thumb-height, 13px);
    margin-top: -4px;
    margin-top: calc((var(--plyr-range-thumb-height, 13px) - var(--plyr-range-track-height, 5px))/2*-1);
    position: relative;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
    width: 13px;
    width: var(--plyr-range-thumb-height, 13px)
}

.plyr--full-ui input[type=range]::-moz-range-track {
    background: #0000;
    border: 0;
    border-radius: 2.5px;
    border-radius: calc(var(--plyr-range-track-height, 5px)/2);
    height: 5px;
    height: var(--plyr-range-track-height, 5px);
    -moz-transition: box-shadow .3s ease;
    transition: box-shadow .3s ease;
    -webkit-user-select: none;
    user-select: none
}

.plyr--full-ui input[type=range]::-moz-range-thumb {
    background: #fff;
    background: var(--plyr-range-thumb-background, #fff);
    border: 0;
    border-radius: 100%;
    box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33;
    box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33);
    height: 13px;
    height: var(--plyr-range-thumb-height, 13px);
    position: relative;
    -moz-transition: all .2s ease;
    transition: all .2s ease;
    width: 13px;
    width: var(--plyr-range-thumb-height, 13px)
}

.plyr--full-ui input[type=range]::-moz-range-progress {
    background: currentColor;
    border-radius: 2.5px;
    border-radius: calc(var(--plyr-range-track-height, 5px)/2);
    height: 5px;
    height: var(--plyr-range-track-height, 5px)
}

.plyr--full-ui input[type=range]::-ms-track {
    color: #0000
}

.plyr--full-ui input[type=range]::-ms-fill-upper,
.plyr--full-ui input[type=range]::-ms-track {
    background: #0000;
    border: 0;
    border-radius: 2.5px;
    border-radius: calc(var(--plyr-range-track-height, 5px)/2);
    height: 5px;
    height: var(--plyr-range-track-height, 5px);
    -ms-transition: box-shadow .3s ease;
    transition: box-shadow .3s ease;
    -webkit-user-select: none;
    user-select: none
}

.plyr--full-ui input[type=range]::-ms-fill-lower {
    background: #0000;
    background: currentColor;
    border: 0;
    border-radius: 2.5px;
    border-radius: calc(var(--plyr-range-track-height, 5px)/2);
    height: 5px;
    height: var(--plyr-range-track-height, 5px);
    -ms-transition: box-shadow .3s ease;
    transition: box-shadow .3s ease;
    -webkit-user-select: none;
    user-select: none
}

.plyr--full-ui input[type=range]::-ms-thumb {
    background: #fff;
    background: var(--plyr-range-thumb-background, #fff);
    border: 0;
    border-radius: 100%;
    box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33;
    box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33);
    height: 13px;
    height: var(--plyr-range-thumb-height, 13px);
    margin-top: 0;
    position: relative;
    -ms-transition: all .2s ease;
    transition: all .2s ease;
    width: 13px;
    width: var(--plyr-range-thumb-height, 13px)
}

.plyr--full-ui input[type=range]::-ms-tooltip {
    display: none
}

.plyr--full-ui input[type=range]::-moz-focus-outer {
    border: 0
}

.plyr--full-ui input[type=range]:focus {
    outline: 0
}

.plyr--full-ui input[type=range]:focus-visible::-webkit-slider-runnable-track {
    outline: 2px dashed #00b2ff;
    outline: 2px dashed var(--plyr-focus-visible-color, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
    outline-offset: 2px
}

.plyr--full-ui input[type=range]:focus-visible::-moz-range-track {
    outline: 2px dashed #00b2ff;
    outline: 2px dashed var(--plyr-focus-visible-color, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
    outline-offset: 2px
}

.plyr--full-ui input[type=range]:focus-visible::-ms-track {
    outline: 2px dashed #00b2ff;
    outline: 2px dashed var(--plyr-focus-visible-color, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
    outline-offset: 2px
}

.plyr__poster {
    background-color: #000;
    background-color: var(--plyr-video-background, var(--plyr-video-background, #000));
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: opacity .2s ease;
    width: 100%;
    z-index: 1
}

.plyr--stopped.plyr__poster-enabled .plyr__poster {
    opacity: 1
}

.plyr--youtube.plyr--paused.plyr__poster-enabled:not(.plyr--stopped) .plyr__poster {
    display: none
}

.plyr__time {
    font-size: 13px;
    font-size: var(--plyr-font-size-time, var(--plyr-font-size-small, 13px))
}

.plyr__time+.plyr__time:before {
    content: "⁄";
    margin-right: 10px;
    margin-right: var(--plyr-control-spacing, 10px)
}

@media (max-width:767px) {
    .plyr__time+.plyr__time {
        display: none
    }
}

.plyr__tooltip {
    background: #ffffffe6;
    background: var(--plyr-tooltip-background, #ffffffe6);
    border-radius: 5px;
    border-radius: var(--plyr-tooltip-radius, 5px);
    bottom: 100%;
    box-shadow: 0 1px 2px #00000026;
    box-shadow: var(--plyr-tooltip-shadow, 0 1px 2px #00000026);
    color: #4a5464;
    color: var(--plyr-tooltip-color, #4a5464);
    font-size: 13px;
    font-size: var(--plyr-font-size-small, 13px);
    font-weight: 400;
    font-weight: var(--plyr-font-weight-regular, 400);
    left: 50%;
    line-height: 1.3;
    margin-bottom: 10px;
    margin-bottom: calc(var(--plyr-control-spacing, 10px)/2*2);
    opacity: 0;
    padding: 5px 7.5px;
    padding: calc(var(--plyr-control-spacing, 10px)/2) calc(var(--plyr-control-spacing, 10px)/2*1.5);
    pointer-events: none;
    position: absolute;
    transform: translate(-50%, 10px) scale(.8);
    transform-origin: 50% 100%;
    transition: transform .2s ease .1s, opacity .2s ease .1s;
    white-space: nowrap;
    z-index: 2
}

.plyr__tooltip:before {
    border-left: 4px solid #0000;
    border-left: var(--plyr-tooltip-arrow-size, 4px) solid #0000;
    border-right: 4px solid #0000;
    border-right: var(--plyr-tooltip-arrow-size, 4px) solid #0000;
    border-top: 4px solid #ffffffe6;
    border-top: var(--plyr-tooltip-arrow-size, 4px) solid var(--plyr-tooltip-background, #ffffffe6);
    bottom: -4px;
    bottom: calc(var(--plyr-tooltip-arrow-size, 4px)*-1);
    content: "";
    height: 0;
    left: 50%;
    position: absolute;
    transform: translate(-50%);
    width: 0;
    z-index: 2
}

.plyr .plyr__control:focus-visible .plyr__tooltip,
.plyr .plyr__control:hover .plyr__tooltip,
.plyr__tooltip--visible {
    opacity: 1;
    transform: translate(-50%) scale(1)
}

.plyr .plyr__control:hover .plyr__tooltip {
    z-index: 3
}

.plyr__controls>.plyr__control:first-child .plyr__tooltip,
.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip {
    left: 0;
    transform: translateY(10px) scale(.8);
    transform-origin: 0 100%
}

.plyr__controls>.plyr__control:first-child .plyr__tooltip:before,
.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip:before {
    left: 16px;
    left: calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7)
}

.plyr__controls>.plyr__control:last-child .plyr__tooltip {
    left: auto;
    right: 0;
    transform: translateY(10px) scale(.8);
    transform-origin: 100% 100%
}

.plyr__controls>.plyr__control:last-child .plyr__tooltip:before {
    left: auto;
    right: 16px;
    right: calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7);
    transform: translate(50%)
}

.plyr__controls>.plyr__control:first-child .plyr__tooltip--visible,
.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip--visible,
.plyr__controls>.plyr__control:first-child+.plyr__control:focus-visible .plyr__tooltip,
.plyr__controls>.plyr__control:first-child+.plyr__control:hover .plyr__tooltip,
.plyr__controls>.plyr__control:first-child:focus-visible .plyr__tooltip,
.plyr__controls>.plyr__control:first-child:hover .plyr__tooltip,
.plyr__controls>.plyr__control:last-child .plyr__tooltip--visible,
.plyr__controls>.plyr__control:last-child:focus-visible .plyr__tooltip,
.plyr__controls>.plyr__control:last-child:hover .plyr__tooltip {
    transform: translate(0) scale(1)
}

.plyr__progress {
    left: 6.5px;
    left: calc(var(--plyr-range-thumb-height, 13px)*.5);
    margin-right: 13px;
    margin-right: var(--plyr-range-thumb-height, 13px);
    position: relative
}

.plyr__progress input[type=range],
.plyr__progress__buffer {
    margin-left: -6.5px;
    margin-left: calc(var(--plyr-range-thumb-height, 13px)*-.5);
    margin-right: -6.5px;
    margin-right: calc(var(--plyr-range-thumb-height, 13px)*-.5);
    width: calc(100% + 13px);
    width: calc(100% + var(--plyr-range-thumb-height, 13px))
}

.plyr__progress input[type=range] {
    position: relative;
    z-index: 2
}

.plyr__progress .plyr__tooltip {
    left: 0;
    max-width: 120px;
    overflow-wrap: break-word
}

.plyr__progress__buffer {
    -webkit-appearance: none;
    background: #0000;
    border: 0;
    border-radius: 100px;
    height: 5px;
    height: var(--plyr-range-track-height, 5px);
    left: 0;
    margin-top: -2.5px;
    margin-top: calc((var(--plyr-range-track-height, 5px)/2)*-1);
    padding: 0;
    position: absolute;
    top: 50%
}

.plyr__progress__buffer::-webkit-progress-bar {
    background: #0000
}

.plyr__progress__buffer::-webkit-progress-value {
    background: currentColor;
    border-radius: 100px;
    min-width: 5px;
    min-width: var(--plyr-range-track-height, 5px);
    -webkit-transition: width .2s ease;
    transition: width .2s ease
}

.plyr__progress__buffer::-moz-progress-bar {
    background: currentColor;
    border-radius: 100px;
    min-width: 5px;
    min-width: var(--plyr-range-track-height, 5px);
    -moz-transition: width .2s ease;
    transition: width .2s ease
}

.plyr__progress__buffer::-ms-fill {
    border-radius: 100px;
    -ms-transition: width .2s ease;
    transition: width .2s ease
}

.plyr--loading .plyr__progress__buffer {
    animation: plyr-progress 1s linear infinite;
    background-image: linear-gradient(-45deg, #23282f99 25%, #0000 0, #0000 50%, #23282f99 0, #23282f99 75%, #0000 0, #0000);
    background-image: linear-gradient(-45deg, var(--plyr-progress-loading-background, #23282f99) 25%, #0000 25%, #0000 50%, var(--plyr-progress-loading-background, #23282f99) 50%, var(--plyr-progress-loading-background, #23282f99) 75%, #0000 75%, #0000);
    background-repeat: repeat-x;
    background-size: 25px 25px;
    background-size: var(--plyr-progress-loading-size, 25px) var(--plyr-progress-loading-size, 25px);
    color: #0000
}

.plyr--video.plyr--loading .plyr__progress__buffer {
    background-color: #ffffff40;
    background-color: var(--plyr-video-progress-buffered-background, #ffffff40)
}

.plyr--audio.plyr--loading .plyr__progress__buffer {
    background-color: #c1c8d199;
    background-color: var(--plyr-audio-progress-buffered-background, #c1c8d199)
}

.plyr__progress__marker {
    background-color: #fff;
    background-color: var(--plyr-progress-marker-background, #fff);
    border-radius: 1px;
    height: 5px;
    height: var(--plyr-range-track-height, 5px);
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 3px;
    width: var(--plyr-progress-marker-width, 3px);
    z-index: 3
}

.plyr__volume {
    align-items: center;
    display: flex;
    position: relative
}

.plyr__volume input[type=range] {
    margin-left: 5px;
    margin-left: calc(var(--plyr-control-spacing, 10px)/2);
    margin-right: 5px;
    margin-right: calc(var(--plyr-control-spacing, 10px)/2);
    max-width: 90px;
    min-width: 60px;
    position: relative;
    z-index: 2
}

.plyr--audio {
    display: block
}

.plyr--audio .plyr__controls {
    background: #fff;
    background: var(--plyr-audio-controls-background, #fff);
    border-radius: inherit;
    color: #4a5464;
    color: var(--plyr-audio-control-color, #4a5464);
    padding: 10px;
    padding: var(--plyr-control-spacing, 10px)
}

.plyr--audio .plyr__control:focus-visible,
.plyr--audio .plyr__control:hover,
.plyr--audio .plyr__control[aria-expanded=true] {
    background: #00b2ff;
    background: var(--plyr-audio-control-background-hover, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
    color: #fff;
    color: var(--plyr-audio-control-color-hover, #fff)
}

.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track {
    background-color: #c1c8d199;
    background-color: var(--plyr-audio-range-track-background, var(--plyr-audio-progress-buffered-background, #c1c8d199))
}

.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track {
    background-color: #c1c8d199;
    background-color: var(--plyr-audio-range-track-background, var(--plyr-audio-progress-buffered-background, #c1c8d199))
}

.plyr--full-ui.plyr--audio input[type=range]::-ms-track {
    background-color: #c1c8d199;
    background-color: var(--plyr-audio-range-track-background, var(--plyr-audio-progress-buffered-background, #c1c8d199))
}

.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb {
    box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33, 0 0 0 3px #23282f1a;
    box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33), 0 0 0 var(--plyr-range-thumb-active-shadow-width, 3px) var(--plyr-audio-range-thumb-active-shadow-color, #23282f1a)
}

.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb {
    box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33, 0 0 0 3px #23282f1a;
    box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33), 0 0 0 var(--plyr-range-thumb-active-shadow-width, 3px) var(--plyr-audio-range-thumb-active-shadow-color, #23282f1a)
}

.plyr--full-ui.plyr--audio input[type=range]:active::-ms-thumb {
    box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33, 0 0 0 3px #23282f1a;
    box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33), 0 0 0 var(--plyr-range-thumb-active-shadow-width, 3px) var(--plyr-audio-range-thumb-active-shadow-color, #23282f1a)
}

.plyr--audio .plyr__progress__buffer {
    color: #c1c8d199;
    color: var(--plyr-audio-progress-buffered-background, #c1c8d199)
}

.plyr--video {
    background: #000;
    background: var(--plyr-video-background, var(--plyr-video-background, #000));
    overflow: hidden
}

.plyr--video.plyr--menu-open {
    overflow: visible
}

.plyr__video-wrapper {
    background: #000;
    background: var(--plyr-video-background, var(--plyr-video-background, #000));
    height: 100%;
    margin: auto;
    overflow: hidden;
    position: relative;
    width: 100%
}

.plyr__video-embed,
.plyr__video-wrapper--fixed-ratio {
    aspect-ratio: 16/9
}

@supports not (aspect-ratio:16/9) {

    .plyr__video-embed,
    .plyr__video-wrapper--fixed-ratio {
        height: 0;
        padding-bottom: 56.25%;
        position: relative
    }
}

.plyr__video-embed iframe,
.plyr__video-wrapper--fixed-ratio video {
    border: 0;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container {
    padding-bottom: 240%;
    position: relative;
    transform: translateY(-38.28125%)
}

.plyr--video .plyr__controls {
    background: linear-gradient(#0000, #000000bf);
    background: var(--plyr-video-controls-background, linear-gradient(#0000, #000000bf));
    border-bottom-left-radius: inherit;
    border-bottom-right-radius: inherit;
    bottom: 0;
    color: #fff;
    color: var(--plyr-video-control-color, #fff);
    left: 0;
    padding: 5px;
    padding: calc(var(--plyr-control-spacing, 10px)/2);
    padding-top: 20px;
    padding-top: calc(var(--plyr-control-spacing, 10px)*2);
    position: absolute;
    right: 0;
    transition: opacity .4s ease-in-out, transform .4s ease-in-out;
    z-index: 3
}

@media (min-width:480px) {
    .plyr--video .plyr__controls {
        padding: 10px;
        padding: var(--plyr-control-spacing, 10px);
        padding-top: 35px;
        padding-top: calc(var(--plyr-control-spacing, 10px)*3.5)
    }
}

.plyr--video.plyr--hide-controls .plyr__controls {
    opacity: 0;
    pointer-events: none;
    transform: translateY(100%)
}

.plyr--video .plyr__control:focus-visible,
.plyr--video .plyr__control:hover,
.plyr--video .plyr__control[aria-expanded=true] {
    background: #00b2ff;
    background: var(--plyr-video-control-background-hover, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
    color: #fff;
    color: var(--plyr-video-control-color-hover, #fff)
}

.plyr__control--overlaid {
    background: #00b2ff;
    background: var(--plyr-video-control-background-hover, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
    border: 0;
    border-radius: 100%;
    color: #fff;
    color: var(--plyr-video-control-color, #fff);
    display: none;
    left: 50%;
    opacity: .9;
    padding: 15px;
    padding: calc(var(--plyr-control-spacing, 10px)*1.5);
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: .3s;
    z-index: 2
}

.plyr__control--overlaid svg {
    left: 2px;
    position: relative
}

.plyr__control--overlaid:focus,
.plyr__control--overlaid:hover {
    opacity: 1
}

.plyr--playing .plyr__control--overlaid {
    opacity: 0;
    visibility: hidden
}

.plyr--full-ui.plyr--video .plyr__control--overlaid {
    display: block
}

.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track {
    background-color: #ffffff40;
    background-color: var(--plyr-video-range-track-background, var(--plyr-video-progress-buffered-background, #ffffff40))
}

.plyr--full-ui.plyr--video input[type=range]::-moz-range-track {
    background-color: #ffffff40;
    background-color: var(--plyr-video-range-track-background, var(--plyr-video-progress-buffered-background, #ffffff40))
}

.plyr--full-ui.plyr--video input[type=range]::-ms-track {
    background-color: #ffffff40;
    background-color: var(--plyr-video-range-track-background, var(--plyr-video-progress-buffered-background, #ffffff40))
}

.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb {
    box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33, 0 0 0 3px #ffffff80;
    box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33), 0 0 0 var(--plyr-range-thumb-active-shadow-width, 3px) var(--plyr-audio-range-thumb-active-shadow-color, #ffffff80)
}

.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb {
    box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33, 0 0 0 3px #ffffff80;
    box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33), 0 0 0 var(--plyr-range-thumb-active-shadow-width, 3px) var(--plyr-audio-range-thumb-active-shadow-color, #ffffff80)
}

.plyr--full-ui.plyr--video input[type=range]:active::-ms-thumb {
    box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33, 0 0 0 3px #ffffff80;
    box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33), 0 0 0 var(--plyr-range-thumb-active-shadow-width, 3px) var(--plyr-audio-range-thumb-active-shadow-color, #ffffff80)
}

.plyr--video .plyr__progress__buffer {
    color: #ffffff40;
    color: var(--plyr-video-progress-buffered-background, #ffffff40)
}

.plyr:fullscreen {
    background: #000;
    border-radius: 0 !important;
    height: 100%;
    margin: 0;
    width: 100%
}

.plyr:fullscreen video {
    height: 100%
}

.plyr:fullscreen .plyr__control .icon--exit-fullscreen {
    display: block
}

.plyr:fullscreen .plyr__control .icon--exit-fullscreen+svg {
    display: none
}

.plyr:fullscreen.plyr--hide-controls {
    cursor: none
}

@media (min-width:1024px) {
    .plyr:fullscreen .plyr__captions {
        font-size: 21px;
        font-size: var(--plyr-font-size-xlarge, 21px)
    }
}

.plyr--fullscreen-fallback {
    background: #000;
    border-radius: 0 !important;
    bottom: 0;
    height: 100%;
    left: 0;
    margin: 0;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 10000000
}

.plyr--fullscreen-fallback video {
    height: 100%
}

.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen {
    display: block
}

.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen+svg {
    display: none
}

.plyr--fullscreen-fallback.plyr--hide-controls {
    cursor: none
}

@media (min-width:1024px) {
    .plyr--fullscreen-fallback .plyr__captions {
        font-size: 21px;
        font-size: var(--plyr-font-size-xlarge, 21px)
    }
}

.plyr__ads {
    border-radius: inherit;
    bottom: 0;
    cursor: pointer;
    left: 0;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1
}

.plyr__ads>div,
.plyr__ads>div iframe {
    height: 100%;
    position: absolute;
    width: 100%
}

.plyr__ads:after {
    background: #23282f;
    border-radius: 2px;
    bottom: 10px;
    bottom: var(--plyr-control-spacing, 10px);
    color: #fff;
    content: attr(data-badge-text);
    font-size: 11px;
    padding: 2px 6px;
    pointer-events: none;
    position: absolute;
    right: 10px;
    right: var(--plyr-control-spacing, 10px);
    z-index: 3
}

.plyr__ads:empty:after {
    display: none
}

.plyr__cues {
    background: currentColor;
    display: block;
    height: 5px;
    height: var(--plyr-range-track-height, 5px);
    left: 0;
    opacity: .8;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    z-index: 3
}

.plyr__preview-thumb {
    background-color: #ffffffe6;
    background-color: var(--plyr-tooltip-background, #ffffffe6);
    border-radius: 5px;
    border-radius: var(--plyr-tooltip-radius, 5px);
    bottom: 100%;
    box-shadow: 0 1px 2px #00000026;
    box-shadow: var(--plyr-tooltip-shadow, 0 1px 2px #00000026);
    margin-bottom: 10px;
    margin-bottom: calc(var(--plyr-control-spacing, 10px)/2*2);
    opacity: 0;
    padding: 3px;
    pointer-events: none;
    position: absolute;
    transform: translateY(10px) scale(.8);
    transform-origin: 50% 100%;
    transition: transform .2s ease .1s, opacity .2s ease .1s;
    z-index: 2
}

.plyr__preview-thumb--is-shown {
    opacity: 1;
    transform: translate(0) scale(1)
}

.plyr__preview-thumb:before {
    border-left: 4px solid #0000;
    border-left: var(--plyr-tooltip-arrow-size, 4px) solid #0000;
    border-right: 4px solid #0000;
    border-right: var(--plyr-tooltip-arrow-size, 4px) solid #0000;
    border-top: 4px solid #ffffffe6;
    border-top: var(--plyr-tooltip-arrow-size, 4px) solid var(--plyr-tooltip-background, #ffffffe6);
    bottom: -4px;
    bottom: calc(var(--plyr-tooltip-arrow-size, 4px)*-1);
    content: "";
    height: 0;
    left: calc(50% + var(--preview-arrow-offset));
    position: absolute;
    transform: translate(-50%);
    width: 0;
    z-index: 2
}

.plyr__preview-thumb__image-container {
    background: #c1c8d1;
    border-radius: 4px;
    border-radius: calc(var(--plyr-tooltip-radius, 5px) - 1px);
    overflow: hidden;
    position: relative;
    z-index: 0
}

.plyr__preview-thumb__image-container img,
.plyr__preview-thumb__image-container:after {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.plyr__preview-thumb__image-container:after {
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px #00000026;
    content: "";
    pointer-events: none
}

.plyr__preview-thumb__image-container img {
    max-height: none;
    max-width: none
}

.plyr__preview-thumb__time-container {
    background: linear-gradient(#0000, #000000bf);
    background: var(--plyr-video-controls-background, linear-gradient(#0000, #000000bf));
    border-bottom-left-radius: 4px;
    border-bottom-left-radius: calc(var(--plyr-tooltip-radius, 5px) - 1px);
    border-bottom-right-radius: 4px;
    border-bottom-right-radius: calc(var(--plyr-tooltip-radius, 5px) - 1px);
    bottom: 0;
    left: 0;
    line-height: 1.1;
    padding: 20px 6px 6px;
    position: absolute;
    right: 0;
    z-index: 3
}

.plyr__preview-thumb__time-container span {
    color: #fff;
    font-size: 13px;
    font-size: var(--plyr-font-size-time, var(--plyr-font-size-small, 13px))
}

.plyr__preview-scrubbing {
    bottom: 0;
    filter: blur(1px);
    height: 100%;
    left: 0;
    margin: auto;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    transition: opacity .3s ease;
    width: 100%;
    z-index: 1
}

.plyr__preview-scrubbing--is-shown {
    opacity: 1
}

.plyr__preview-scrubbing img {
    height: 100%;
    left: 0;
    max-height: none;
    max-width: none;
    object-fit: contain;
    position: absolute;
    top: 0;
    width: 100%
}

.plyr--no-transition {
    transition: none !important
}

.plyr__sr-only {
    clip: rect(1px, 1px, 1px, 1px);
    border: 0 !important;
    height: 1px !important;
    overflow: hidden;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important
}

.plyr [hidden] {
    display: none !important
}

.item-renderer {
    width: 100%;
    background: #fff;
    box-shadow: 0 2px 1px -1px #0003, 0 1px 1px #00000024, 0 1px 3px #0000001f;
    border: 1px solid rgba(34, 36, 38, .15);
    border-radius: .285rem
}

.item-renderer>.popup-menu {
    position: absolute;
    top: 0;
    right: 0;
    margin: .5rem;
    padding: .55rem;
    width: 2.25rem;
    height: 2.25rem;
    line-height: 1rem;
    background-color: #ddd;
    border-radius: 1.25rem;
    cursor: pointer
}

.item-renderer>pre {
    height: 100%;
    min-height: 6.5rem;
    padding: 0;
    margin: 0;
    overflow-x: auto !important;
    white-space: pre
}

.item-renderer>table {
    height: 100%;
    min-height: 6.5rem;
    padding: 0 !important;
    margin: 0 !important
}

.display-format-select {
    margin: 0;
    padding: 0;
    text-align: end
}

.display-format-select>p {
    margin: 0;
    padding: 0;
    text-align: end
}

.render-hints>table {
    padding: 0 !important
}

.render-hints>table>thead>th {
    padding: .5rem !important
}

.render-hints>table>tbody>tr>td {
    padding: .5rem !important;
    height: 2.5rem !important
}

.receipt-viewer>table {
    padding: 0 !important
}

.receipt-viewer>table>thead>th {
    padding: .5rem !important
}

.receipt-viewer>table>tbody>tr>td {
    padding: .5rem !important;
    height: 2.5rem !important
}

.stream-viewer {
    width: 100%;
    background-color: #f4f5f6d9 !important;
    border: 1px solid rgba(34, 36, 38, .15);
    border-radius: .285rem;
    padding: .75rem 1rem !important
}

.stream-viewer .object-view {
    width: 100%
}

.stream-viewer .object-view>pre {
    height: 100%;
    min-height: 15rem;
    padding: 0;
    margin: 0;
    overflow-x: auto !important;
    white-space: pre
}

.stream-viewer .viewer-controls {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center !important
}

.stream-viewer .controls .collection-control {
    display: flex;
    align-items: stretch !important
}

.stream-viewer>.label {
    width: 9.2rem
}

.stream-viewer .prefs .prefs-control {
    display: flex;
    align-items: stretch !important;
    min-width: 8rem
}

.stream-viewer .prefs .prefs-control>label {
    min-width: 6.4rem;
    margin: 0 !important;
    vertical-align: middle;
    border-radius: .285rem;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding: .65rem .833rem;
    background-color: #e8e8e8
}

.stream-viewer .prefs .prefs-control>.selection {
    min-height: 2.5rem !important;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left-color: transparent
}

.AppMenu {
    background-color: #eee;
    width: 100% !important;
    min-width: 12.8rem
}

.AppListMenuItem {
    background-color: #eee;
    padding: 10px;
    vertical-align: middle
}

.AppMenu-active {
    border: 5px solid red
}

.AppMenu input:focus {
    border: 2.5px solid lightblue !important
}

.AppMenu .search-input-icon {
    position: absolute;
    right: 25px;
    bottom: 27.5px
}

.AppMenu .search-cancel-icon {
    cursor: pointer
}

.AppMenu .search-input-container {
    position: relative
}

.AppMenu .search-input-icon {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    margin-right: 5px
}

.action-runner {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column
}

.action-runner>.menu {
    margin: 0 !important
}

.action-runner>.menu>.item {
    padding: .785rem .833rem !important;
    font-size: 1em !important;
    line-height: 1em !important
}

.action-runner>.menu>.item.active {
    background-color: #f4f5f6d9 !important
}

.action-runner>.menu>.menu.right {
    flex-grow: 1
}

.action-runner>.action-runner-tabs {
    flex-grow: 1;
    padding: 0;
    overflow: auto;
    background-color: #f4f5f6d9 !important
}

.action-runner .action-runner-main {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: auto
}

.action-runner .action-runner-main .appmenu {
    height: 100%;
    position: -webkit-sticky;
    position: sticky;
    overflow: auto
}

.button--prominent {
    font-size: 1.2rem !important;
    padding: 1rem 1.75rem !important;
    margin: .5rem 0 !important
}

.button--prominent:hover,
.button--prominent:focus,
.button--prominent:active {
    background-color: #0062cc;
    border-color: #0062cc
}

.ui.tabular.menu .item {
    background-color: #f0f0f0;
    color: #333
}

.ui.tabular.menu .active.item {
    background-color: #fff;
    color: #000
}

.snoozed-alert {
    opacity: .5;
    background-color: #f0f0f0
}

.api-gateway-app {
    width: 100%
}

.api-gateway-app>.menu>.item {
    padding: .785rem .833rem !important;
    font-size: 1em !important;
    line-height: 1em !important
}

.api-gateway-app>.menu>.item.active {
    background-color: #f4f5f6d9 !important
}

.api-gateway-app>.menu>.menu.right {
    flex-grow: 1
}

.api-gateway-app .stream-tabs {
    background-color: #f4f5f6d9 !important
}

.api-gateway-app .object-view,
.api-gateway-app .controls {
    width: 100%
}

.api-gateway-app .label-wrapper {
    width: 100%;
    display: flex;
    justify-content: space-between
}

.api-gateway-app .label-wrapper .label-enable {
    display: flex;
    align-items: center;
    width: 7.6rem
}

.api-gateway-app .label-wrapper .label-enable span {
    padding-left: .4rem;
    font-size: 1rem;
    font-weight: 700
}

.api-gateway-app .label-wrapper h3 {
    margin: 0 !important
}

.api-gateway-app .label-wrapper .label-icon {
    display: inline-block !important;
    vertical-align: baseline !important;
    font-size: 1.5rem !important;
    padding-left: .5rem !important
}

.api-gateway-app .label-wrapper .label-right {
    display: flex;
    justify-content: flex-end
}

.api-gateway-app .security-wrapper {
    width: 100% !important;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: space-between;
    align-items: center !important
}

.api-gateway-app .curl-examples {
    margin: 1rem 0 0 !important;
    padding: 0 !important
}

.api-gateway-app .curl-examples>.accordion {
    border: 1px solid rgba(34, 36, 38, .15);
    border-radius: .285rem;
    box-shadow: none
}

.api-gateway-app .curl-examples>.accordion pre {
    padding: 0;
    margin: 0;
    overflow-x: auto !important;
    white-space: pre
}

.AthenaAceEditor {
    max-height: 200px;
    margin: 10px;
    border-color: #aaa;
    border-style: solid;
    border-width: 1px
}

.carousel .control-arrow,
.carousel.carousel-slider .control-arrow {
    -webkit-transition: all .25s ease-in;
    -moz-transition: all .25s ease-in;
    -ms-transition: all .25s ease-in;
    -o-transition: all .25s ease-in;
    transition: all .25s ease-in;
    opacity: .4;
    filter: alpha(opacity=40);
    position: absolute;
    z-index: 2;
    top: 20px;
    background: none;
    border: 0;
    font-size: 32px;
    cursor: pointer
}

.carousel .control-arrow:focus,
.carousel .control-arrow:hover {
    opacity: 1;
    filter: alpha(opacity=100)
}

.carousel .control-arrow:before,
.carousel.carousel-slider .control-arrow:before {
    margin: 0 5px;
    display: inline-block;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    content: ""
}

.carousel .control-disabled.control-arrow {
    opacity: 0;
    filter: alpha(opacity=0);
    cursor: inherit;
    display: none
}

.carousel .control-prev.control-arrow {
    left: 0
}

.carousel .control-prev.control-arrow:before {
    border-right: 8px solid #fff
}

.carousel .control-next.control-arrow {
    right: 0
}

.carousel .control-next.control-arrow:before {
    border-left: 8px solid #fff
}

.carousel-root {
    outline: none
}

.carousel {
    position: relative;
    width: 100%
}

.carousel * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.carousel img {
    width: 100%;
    display: inline-block;
    pointer-events: none
}

.carousel .carousel {
    position: relative
}

.carousel .control-arrow {
    outline: 0;
    border: 0;
    background: none;
    top: 50%;
    margin-top: -13px;
    font-size: 18px
}

.carousel .thumbs-wrapper {
    margin: 20px;
    overflow: hidden
}

.carousel .thumbs {
    -webkit-transition: all .15s ease-in;
    -moz-transition: all .15s ease-in;
    -ms-transition: all .15s ease-in;
    -o-transition: all .15s ease-in;
    transition: all .15s ease-in;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translateZ(0);
    position: relative;
    list-style: none;
    white-space: nowrap
}

.carousel .thumb {
    -webkit-transition: border .15s ease-in;
    -moz-transition: border .15s ease-in;
    -ms-transition: border .15s ease-in;
    -o-transition: border .15s ease-in;
    transition: border .15s ease-in;
    display: inline-block;
    margin-right: 6px;
    white-space: nowrap;
    overflow: hidden;
    border: 3px solid #fff;
    padding: 2px
}

.carousel .thumb:focus {
    border: 3px solid #ccc;
    outline: none
}

.carousel .thumb.selected,
.carousel .thumb:hover {
    border: 3px solid #333
}

.carousel .thumb img {
    vertical-align: top
}

.carousel.carousel-slider {
    position: relative;
    margin: 0;
    overflow: hidden
}

.carousel.carousel-slider .control-arrow {
    top: 0;
    color: #fff;
    font-size: 26px;
    bottom: 0;
    margin-top: 0;
    padding: 5px
}

.carousel.carousel-slider .control-arrow:hover {
    background: #0003
}

.carousel .slider-wrapper {
    overflow: hidden;
    margin: auto;
    width: 100%;
    -webkit-transition: height .15s ease-in;
    -moz-transition: height .15s ease-in;
    -ms-transition: height .15s ease-in;
    -o-transition: height .15s ease-in;
    transition: height .15s ease-in
}

.carousel .slider-wrapper.axis-horizontal .slider {
    -ms-box-orient: horizontal;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -moz-flex;
    display: -webkit-flex;
    display: flex
}

.carousel .slider-wrapper.axis-horizontal .slider .slide {
    flex-direction: column;
    flex-flow: column
}

.carousel .slider-wrapper.axis-vertical {
    -ms-box-orient: horizontal;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -moz-flex;
    display: -webkit-flex;
    display: flex
}

.carousel .slider-wrapper.axis-vertical .slider {
    -webkit-flex-direction: column;
    flex-direction: column
}

.carousel .slider {
    margin: 0;
    padding: 0;
    position: relative;
    list-style: none;
    width: 100%
}

.carousel .slider.animated {
    -webkit-transition: all .35s ease-in-out;
    -moz-transition: all .35s ease-in-out;
    -ms-transition: all .35s ease-in-out;
    -o-transition: all .35s ease-in-out;
    transition: all .35s ease-in-out
}

.carousel .slide {
    min-width: 100%;
    margin: 0;
    position: relative;
    text-align: center
}

.carousel .slide img {
    width: 100%;
    vertical-align: top;
    border: 0
}

.carousel .slide iframe {
    display: inline-block;
    width: calc(100% - 80px);
    margin: 0 40px 40px;
    border: 0
}

.carousel .slide .legend {
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    position: absolute;
    bottom: 40px;
    left: 50%;
    margin-left: -45%;
    width: 90%;
    border-radius: 10px;
    background: #000;
    color: #fff;
    padding: 10px;
    font-size: 12px;
    text-align: center;
    opacity: .25;
    -webkit-transition: opacity .35s ease-in-out;
    -moz-transition: opacity .35s ease-in-out;
    -ms-transition: opacity .35s ease-in-out;
    -o-transition: opacity .35s ease-in-out;
    transition: opacity .35s ease-in-out
}

.carousel .control-dots {
    position: absolute;
    bottom: 0;
    margin: 10px 0;
    padding: 0;
    text-align: center;
    width: 100%;
    z-index: 1
}

@media (min-width: 960px) {
    .carousel .control-dots {
        bottom: 0
    }
}

.carousel .control-dots .dot {
    -webkit-transition: opacity .25s ease-in;
    -moz-transition: opacity .25s ease-in;
    -ms-transition: opacity .25s ease-in;
    -o-transition: opacity .25s ease-in;
    transition: opacity .25s ease-in;
    opacity: .3;
    filter: alpha(opacity=30);
    box-shadow: 1px 1px 2px #000000e6;
    background: #fff;
    border-radius: 50%;
    width: 8px;
    height: 8px;
    cursor: pointer;
    display: inline-block;
    margin: 0 8px
}

.carousel .control-dots .dot.selected,
.carousel .control-dots .dot:hover {
    opacity: 1;
    filter: alpha(opacity=100)
}

.carousel .carousel-status {
    position: absolute;
    top: 0;
    right: 0;
    padding: 5px;
    font-size: 10px;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .9);
    color: #fff
}

.carousel:hover .slide .legend {
    opacity: 1
}

.image-container {
    position: relative;
    display: inline-block
}

.main-image {
    display: block
}

.hotspot {
    position: absolute;
    background-color: #ff000080;
    cursor: pointer
}

.titleSlide_content {
    display: flex;
    align-items: center;
    min-height: 90vh;
    width: 100%
}

.titleSlide_headline {
    width: 100%;
    text-align: center
}

.titleSlide_headline h1 {
    font-size: 3.5rem
}

.titleSlide_headline h2 {
    font-weight: 400;
    color: --main-font
}

table.performance-table th {
    background: #4253dd !important;
    color: #fff
}

table.performance-table th,
table.performance-table td {
    padding: 10px;
    background: #efefef
}

table.performance-table,
table.performance-table th,
table.performance-table td {
    border: 1px solid #d8d9d8;
    border-collapse: collapse
}

table.performance-table td.campaign-name {
    background: #e355b6;
    color: #fff;
    font-weight: 700
}

.tooltip {
    position: fixed;
    background-color: #fff;
    padding: 24px;
    z-index: 5
}

.creative-slide-container {
    min-width: calc(50vw - 40px);
    padding: 50px;
    min-height: calc(100vh - 120px);
    max-height: calc(100vh - 120px);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 150%
}

.creative-slide-content {
    display: flex;
    background-color: #fff
}

.creative-slide-text-container {
    margin: 10px;
    padding: 25px;
    min-height: 50vh;
    min-width: 50vw
}

.table-container {
    max-width: 80vw;
    max-height: 80vh;
    overflow-y: auto
}

.no-data-container {
    display: flex;
    background-color: #fff
}

.no-data-message {
    margin: 10px;
    margin-top: 40vh;
    padding: 25px;
    min-height: 50vh;
    width: 100%;
    text-align: center
}

.no-data-text {
    font-size: 24pt
}

.presentation-builder {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    background-color: #f4f5f6d9 !important
}

.presentation-builder>.grid {
    flex-grow: 1;
    padding: 0;
    overflow: auto
}

.presentation-builder>.grid>.column>.appmenu {
    height: 100%;
    position: -webkit-sticky;
    position: sticky;
    overflow: auto
}

.presentation-builder>.grid>.column>.presentation-toolbar {
    flex-grow: 0;
    padding: .5rem;
    margin-bottom: 1rem !important;
    display: flex;
    align-items: center
}

.presentation-builder>.grid>.column>.presentation-toolbar>.toolbar-left,
.presentation-builder>.grid>.column>.presentation-toolbar>.toolbar-styles,
.presentation-builder>.grid>.column>.presentation-toolbar>.toolbar-right {
    display: flex;
    align-items: center
}

.presentation-builder>.grid>.column>.presentation-toolbar>.toolbar-styles {
    flex-grow: 1
}

.presentation-builder>.grid>.column>.presentation-main {
    flex-grow: 1;
    padding: 1rem;
    margin-top: 0 !important;
    overflow: auto;
    background-color: #e0e1e2d9 !important
}

.presentation-builder .presentation-slide {
    padding: 0
}

.presentation-builder .presentation-slide>.content {
    padding: .5rem
}

.presentation-builder .presentation-slide>.content.extra {
    padding: 0;
    overflow-x: auto
}

.presentation-builder .presentation-slide>.content.extra>table {
    border: none
}

.presentation-builder .presentation-slide>.content.extra>table>thead>tr>th {
    padding: .5rem
}

.presentation-toolbar {
    height: 60px;
    max-height: 60px
}

.presentation-main {
    text-align: center
}

.parameter {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    margin: 0 0 .25rem
}

.parameter .field {
    width: 100%;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.parameter .field>.SurveyQuestionInput {
    padding: 0;
    width: 100%
}

.parameter .field>label {
    display: block;
    margin: 0;
    color: #000000de;
    font-size: .925rem;
    font-weight: 700;
    text-transform: none
}

.parameter .field>.checkbox>label {
    cursor: auto;
    position: relative;
    display: block;
    padding-left: 1.85rem;
    outline: 0;
    color: #000000de;
    font-size: .925rem;
    font-weight: 700;
    text-transform: none
}

.parameter .field>input,
.parameter .field>.SurveyQuestionInput>input {
    font-family: Lato, Helvetica Neue, Arial, Helvetica, sans-serif;
    margin: 0;
    outline: 0;
    -webkit-appearance: none;
    tap-highlight-color: rgba(255, 255, 255, 0);
    line-height: 1.2rem;
    padding: .675rem 1rem;
    font-size: 1em;
    background: #fff;
    border: 1px solid rgba(34, 36, 38, .15);
    color: #000000de;
    border-radius: .285rem;
    -webkit-box-shadow: 0 0 0 0 transparent inset;
    box-shadow: 0 0 0 0 transparent inset;
    -webkit-transition: color .1s ease, border-color .1s ease;
    transition: color .1s ease, border-color .1s ease
}

.audio-file-viewer {
    margin: 0;
    padding: 0;
    min-height: 2.85em
}

.audio-file-viewer.basic {
    border: none;
    margin: 0 !important;
    padding: .5rem !important
}

.audio-file-viewer.elevation1 {
    border: 1px solid rgba(34, 36, 38, .15);
    border-radius: .285rem;
    box-shadow: 0 1px 2px #22242626
}

.audio-file-viewer.elevation2 {
    border: 1px solid rgba(34, 36, 38, .15);
    border-radius: 4px;
    box-shadow: 0 2px 1px -1px #0003, 0 1px 1px #00000024, 0 1px 3px #0000001f
}

.audio-file-viewer .player-progress {
    margin: 0 0 1rem !important
}

.audio-file-viewer .player-progress.tiny {
    font-size: .65rem !important
}

.audio-file-viewer .player-progress.small {
    font-size: .75rem !important
}

.audio-file-viewer .player-progress.medium {
    font-size: .85rem !important
}

.audio-file-viewer .player-progress .bar {
    min-width: .5rem !important
}

.audio-file-viewer .player-buttons {
    width: auto
}

.audio-file-viewer .player-buttons.centered {
    width: auto;
    display: flex;
    justify-content: center
}

.audio-file-viewer .player-buttons>.player-button {
    padding: .785rem
}

.audio-file-viewer .header {
    margin: 0
}

.audio-file-viewer img {
    object-fit: contain;
    max-width: 100%
}

.segment-elevation2 {
    border: 1px solid rgba(34, 36, 38, .15) !important;
    border-radius: 4px !important;
    box-shadow: 0 2px 1px -1px #0003, 0 1px 1px #00000024, 0 1px 3px #0000001f !important
}

.file-viewer {
    width: 100%;
    height: 100%;
    margin: 0 !important;
    padding: 0 !important;
    display: flex;
    justify-content: center
}

.file-viewer .flex-center {
    display: flex;
    align-items: center
}

.draggable-item {
    flex: 1;
    width: 100%;
    cursor: move;
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab
}

.draggable-item:active {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing
}

.chatbot {
    position: fixed;
    z-index: 1000
}

.chatbot>.hide-avatar,
.chatbot>.hide-dialog {
    display: none
}

.chatbot-avatar {
    position: fixed;
    bottom: 0;
    right: 0;
    padding: 10px;
    text-align: right
}

.chatbot-avatar>.avatar-svg {
    width: 50px;
    height: 50px;
    margin: 0;
    padding: 0
}

.chatbot-dialog {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    width: 300px;
    height: 400px;
    box-shadow: 0 3px 10px #0003;
    border-radius: 10px;
    background-color: #fff;
    overflow: hidden;
    transition: height 1.3s ease-in-out
}

.chatbot>.avatar {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 40px;
    height: 40px;
    cursor: pointer;
    z-index: 1001;
    background-color: #673ab7;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all .3s ease-in-out
}

.chatbot .dialog {
    height: 100%;
    display: flex;
    border-radius: 10px;
    flex-direction: column
}

.chatbot .dialog.show-dialog {
    height: 100%
}

.chatbot .dialog>.header {
    position: relative;
    z-index: 1;
    background-color: #8e44ad;
    color: #fff;
    padding: 10px;
    box-sizing: border-box;
    box-shadow: 0 16px 24px 16px #ffffffbf
}

.chatbot .dialog>.header h1 {
    margin: 0;
    font-size: 16px;
    font-weight: 400
}

.chatbot .dialog>.header button {
    position: absolute;
    top: 5px;
    right: 20px;
    border: none;
    background-color: transparent;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    padding-top: 5px;
    padding-right: 5px
}

.chatbot .dialog>.messages {
    position: absolute;
    top: 40px;
    bottom: 60px;
    width: 100%;
    overflow-y: auto;
    padding: 10px
}

.chatbot .dialog>.messages ul {
    margin: 0;
    padding: 0
}

.chatbot .dialog>.messages li {
    list-style: none;
    margin-bottom: 10px;
    padding: 10px;
    border-radius: 5px
}

.chatbot .dialog>.messages .bot-message {
    background-color: #f1f0f0;
    text-align: left
}

.chatbot .dialog>.messages .user-message {
    background-color: #8e44ad;
    color: #fff;
    text-align: right
}

.chatbot .dialog>.input-form {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 60px;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    box-sizing: border-box
}

.chatbot .dialog>.input-form>.input-inner {
    width: 100%;
    height: 40px
}

.chatbot .dialog>.input-form>.input-inner>input {
    border-color: #a180ad
}

.chatbot .dialog>.input-form>.input-inner>input:focus {
    border: 1px solid #8e44ad !important;
    border-right-color: transparent !important;
    box-shadow: inset 0 0 5px #b662ba70
}

.chatbot .dialog>.input-form>.input-inner>button {
    background-color: #8e44ad;
    border: 1px solid #8e44ad;
    color: #fff;
    cursor: pointer
}

.chatbot .show-dialog .avatar {
    display: none
}

.chatbot .show-dialog .dialog {
    display: block
}

.dashboard-stream-chart {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%
}

.dashboard-stream-chart .prefs {
    width: 100%
}

.dashboard-stream-chart .prefs>.fields {
    margin-bottom: .75rem
}

.dashboard-stream-chart .prefs .prefs-control {
    display: flex;
    align-items: stretch !important;
    min-width: 8rem
}

.dashboard-stream-chart .prefs .prefs-control>label {
    min-width: 6.4rem;
    margin: 0 !important;
    vertical-align: middle;
    border-radius: .285rem;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding: .65rem .833rem;
    background-color: #e8e8e8
}

.dashboard-stream-chart .prefs .prefs-control>.selection {
    min-height: 2.5rem !important;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left-color: transparent
}

.react-grid-layout {
    position: relative;
    transition: height .2s ease
}

.react-grid-item {
    transition: all .2s ease;
    transition-property: left, top, width, height
}

.react-grid-item img {
    pointer-events: none;
    -webkit-user-select: none;
    user-select: none
}

.react-grid-item.cssTransforms {
    transition-property: transform, width, height
}

.react-grid-item.resizing {
    transition: none;
    z-index: 1;
    will-change: width, height
}

.react-grid-item.react-draggable-dragging {
    transition: none;
    z-index: 3;
    will-change: transform
}

.react-grid-item.dropping {
    visibility: hidden
}

.react-grid-item.react-grid-placeholder {
    background: red;
    opacity: .2;
    transition-duration: .1s;
    z-index: 2;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none
}

.react-grid-item.react-grid-placeholder.placeholder-resizing {
    transition: none
}

.react-grid-item>.react-resizable-handle {
    position: absolute;
    width: 20px;
    height: 20px
}

.react-grid-item>.react-resizable-handle:after {
    content: "";
    position: absolute;
    right: 3px;
    bottom: 3px;
    width: 5px;
    height: 5px;
    border-right: 2px solid rgba(0, 0, 0, .4);
    border-bottom: 2px solid rgba(0, 0, 0, .4)
}

.react-resizable-hide>.react-resizable-handle {
    display: none
}

.react-grid-item>.react-resizable-handle.react-resizable-handle-sw {
    bottom: 0;
    left: 0;
    cursor: sw-resize;
    transform: rotate(90deg)
}

.react-grid-item>.react-resizable-handle.react-resizable-handle-se {
    bottom: 0;
    right: 0;
    cursor: se-resize
}

.react-grid-item>.react-resizable-handle.react-resizable-handle-nw {
    top: 0;
    left: 0;
    cursor: nw-resize;
    transform: rotate(180deg)
}

.react-grid-item>.react-resizable-handle.react-resizable-handle-ne {
    top: 0;
    right: 0;
    cursor: ne-resize;
    transform: rotate(270deg)
}

.react-grid-item>.react-resizable-handle.react-resizable-handle-w,
.react-grid-item>.react-resizable-handle.react-resizable-handle-e {
    top: 50%;
    margin-top: -10px;
    cursor: ew-resize
}

.react-grid-item>.react-resizable-handle.react-resizable-handle-w {
    left: 0;
    transform: rotate(135deg)
}

.react-grid-item>.react-resizable-handle.react-resizable-handle-e {
    right: 0;
    transform: rotate(315deg)
}

.react-grid-item>.react-resizable-handle.react-resizable-handle-n,
.react-grid-item>.react-resizable-handle.react-resizable-handle-s {
    left: 50%;
    margin-left: -10px;
    cursor: ns-resize
}

.react-grid-item>.react-resizable-handle.react-resizable-handle-n {
    top: 0;
    transform: rotate(225deg)
}

.react-grid-item>.react-resizable-handle.react-resizable-handle-s {
    bottom: 0;
    transform: rotate(45deg)
}

.react-resizable {
    position: relative
}

.react-resizable-handle {
    position: absolute;
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-origin: content-box;
    box-sizing: border-box;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4Ij48ZyBvcGFjaXR5PSIwLjMwMiI+PHBhdGggZD0iTSA2IDYgTCAwIDYgTCAwIDQuMiBMIDQgNC4yIEwgNC4yIDQuMiBMIDQuMiAwIEwgNiAwIEwgNiA2IEwgNiA2IFoiIGZpbGw9IiMwMDAwMDAiLz48L2c+PC9zdmc+);
    background-position: bottom right;
    padding: 0 3px 3px 0
}

.react-resizable-handle-sw {
    bottom: 0;
    left: 0;
    cursor: sw-resize;
    transform: rotate(90deg)
}

.react-resizable-handle-se {
    bottom: 0;
    right: 0;
    cursor: se-resize
}

.react-resizable-handle-nw {
    top: 0;
    left: 0;
    cursor: nw-resize;
    transform: rotate(180deg)
}

.react-resizable-handle-ne {
    top: 0;
    right: 0;
    cursor: ne-resize;
    transform: rotate(270deg)
}

.react-resizable-handle-w,
.react-resizable-handle-e {
    top: 50%;
    margin-top: -10px;
    cursor: ew-resize
}

.react-resizable-handle-w {
    left: 0;
    transform: rotate(135deg)
}

.react-resizable-handle-e {
    right: 0;
    transform: rotate(315deg)
}

.react-resizable-handle-n,
.react-resizable-handle-s {
    left: 50%;
    margin-left: -10px;
    cursor: ns-resize
}

.react-resizable-handle-n {
    top: 0;
    transform: rotate(225deg)
}

.react-resizable-handle-s {
    bottom: 0;
    transform: rotate(45deg)
}

.dashboard-app {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column
}

.dashboard-embedded {
    width: 100%;
    display: flex;
    flex-direction: column
}

.dashboard-error {
    width: 100%;
    height: 100%
}

.dashboard-options-list {
    padding: 0
}

.dashboard-options-list>.item {
    padding: .5rem !important;
    line-height: 2.2rem !important
}

.dashboard-options-list>.item .content {
    vertical-align: middle !important
}

.dashboard-toolbar {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding-right: .5rem
}

.dashboard-toolbar>.button.icon {
    font-size: 1rem;
    padding: .65rem
}

.dashboard-toolbar>.btn-private>.label {
    width: 5rem;
    background-color: #b2b2b2
}

.dashboard-toolbar>.btn-public>.label {
    width: 5rem;
    background-color: #fff
}

.dashboard-toolbar>.theme-button {
    min-width: 6rem;
    max-height: 2.35rem
}

.dashboard-divider {
    flex-grow: 1
}

.dashboard-menu {
    width: 100% !important;
    background-color: transparent
}

.dashboard-menu>.item.active {
    background-color: #2223261a !important
}

.dashboard-settings {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column
}

.dashboard {
    position: relative;
    width: 100%;
    height: auto;
    flex-grow: 1;
    display: block;
    overflow: auto;
    margin: 0;
    padding: 0 10px;
    background-color: #2223261a !important;
    box-shadow: #0000001f 2px 1px 10px;
    border-radius: .285rem;
    border: 1px solid rgba(34, 36, 38, .15) !important
}

.dashboard-widget {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background: #fff;
    border: 1px solid rgba(34, 36, 38, .15);
    border-radius: .285rem;
    box-shadow: 0 1px 2px #22242626;
    min-height: 2.85em
}

.dashboard-widget.elevation1 {
    box-shadow: 0 2px 1px -1px #0003, 0 1px 1px #00000024, 0 1px 3px #0000001f;
    border-radius: 4px
}

.dashboard-widget>.drag-toolbar {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 8px !important;
    min-height: 1.75rem
}

.dashboard-widget>.drag-toolbar>.svg-icon {
    color: gray;
    cursor: pointer;
    fill: currentColor;
    width: 1em;
    height: 1em;
    margin: 0;
    padding: 0;
    display: inline-block;
    font-size: 1.5rem;
    transition: fill .2s cubic-bezier(.4, 0, .2, 1) 0ms;
    flex-shrink: 0;
    -webkit-user-select: none;
    user-select: none
}

.dashboard-widget>.widget-content {
    width: 100%;
    height: 100%;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    display: flex;
    flex-direction: column
}

.dashboard-widget .toolbar-icon {
    width: 2em !important;
    height: 2em !important;
    line-height: 1 !important;
    color: #000000bf;
    text-align: center;
    padding: .5em 0 !important;
    background-color: transparent;
    transition: background-color .25s cubic-bezier(.4, 0, .2, 1) 0ms;
    border-radius: 50%
}

.dashboard-widget .toolbar-icon:hover {
    background-color: #0000001a
}

.dashboard-youtube {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%
}

.dashboard-markdown {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column
}

.dashboard-markdown>.ace-editor {
    width: 100%;
    border: 1px solid rgba(34, 36, 38, .15)
}

.dashboard-markdown>.markdown-view {
    width: 100%;
    height: 100%;
    overflow: auto
}

.dashboard-stream-chart,
.dashboard-file,
.dashboard-chatbot {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%
}

.dashboard-fixed {
    position: fixed;
    bottom: 0;
    right: 0;
    padding: 10px;
    text-align: right
}

.dashboard-param {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center
}

.dashboard-param .field {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%
}

.dashboard-button,
.dashboard-upload {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%
}

.static {
    background: #00f
}

.droppable-element {
    height: 50px;
    width: 250px;
    background: #87ceeb;
    margin: 10px;
    border: 2px dashed;
    display: flex;
    justify-content: center;
    align-items: center
}

.drag-handle {
    width: 100%;
    padding: 0;
    margin: 0
}

.react-resizable-hide .react-resizable-handle {
    display: none !important
}

.dashboard-icon-root {
    flex: 0 0 auto;
    color: #0000008a;
    padding: 12px;
    overflow: visible;
    font-size: 1.5rem;
    text-align: center;
    transition: background-color .15s cubic-bezier(.4, 0, .2, 1) 0ms;
    border-radius: 50%
}

.dashboard-icon-root:hover {
    background-color: #0000000a
}

.dashboard-icon-root.disabled {
    color: #00000042;
    background-color: transparent
}

.dashboard-icon-color-inherit {
    color: inherit
}

.dashboard-icon-color-primary {
    color: #3f51b5
}

.dashboard-icon-color-primary:hover {
    background-color: #3f51b50a
}

.dashboard-icon-color-secondary {
    color: #f50057
}

.dashboard-icon-color-secondary:hover {
    background-color: #f500570a
}

.dashboard-icon-size-small {
    padding: 3px;
    font-size: 1.125rem
}

.dashboard-icon-button-label {
    width: 100%;
    display: flex;
    align-items: inherit;
    justify-content: inherit
}

.draggable-group {
    padding: 0 .25rem;
    margin-top: .5rem !important
}

.draggable-group>.draggable-item {
    padding: 0 .25rem
}

.draggable-group>.draggable-item .draggable-checkbox {
    padding: .125rem .25rem;
    background-color: #3f51b50a;
    border: 1px solid rgba(34, 36, 38, .15);
    border-radius: .285rem;
    position: relative
}

.draggable-group>.draggable-item .draggable-checkbox:after {
    content: "";
    font-family: Icons;
    line-height: 1.65rem;
    position: absolute;
    top: 0;
    right: .5rem
}

.draggable-checkbox label {
    padding-left: .25rem
}

.action-app {
    width: 100%;
    max-height: 100%;
    overflow-y: auto;
    display: flex;
    flex-direction: column
}

.action-app>.action-info,
.action-app>.stream-viewer {
    margin-bottom: 0
}

.course-app {
    width: 100%;
    height: 100%;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column;
    flex-grow: 1
}

.course-app .course-unit-card {
    display: flex;
    margin: .875rem .5rem;
    float: none
}

.course-app>.course-unit {
    margin-top: 1rem
}

.course-app>.course-unit>.unit-info {
    display: flex !important;
    flex-direction: column;
    align-items: center !important;
    padding-right: 0 !important
}

.course-app>.course-unit>.unit-info>.unit-logo {
    width: 100%;
    max-width: 16.5rem
}

.course-app>.course-unit>.unit-info>.dataskeptic {
    display: block
}

.course-app>.course-unit>.unit-contents {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start
}

.course-app>.course-chapter>.course-main>.grid {
    flex-direction: row
}

@media only screen and (max-width: 767px) {
    .course-app>.course-unit>.unit-info>.dataskeptic {
        display: none !important
    }

    .course-app>.course-unit>.unit-contents {
        align-items: center
    }

    .course-app>.course-chapter>.course-main>.grid {
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch
    }
}

.course-app>.course-chapter {
    width: 100%;
    flex-grow: 1;
    display: flex;
    flex-direction: column
}

.course-app>.course-chapter>.course-main {
    width: 100%;
    flex-grow: 1;
    padding: 1rem
}

.course-app>.course-chapter>.course-main>.grid {
    height: 100%
}

.course-app .course-scroll {
    margin: 0 !important;
    padding: 0 1rem .25rem !important;
    position: absolute !important;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0
}

.course-app .course-footer {
    display: flex;
    justify-content: flex-end;
    padding: .5rem !important
}

.course-app .course-admin {
    display: flex;
    flex-direction: row;
    padding: .75rem;
    margin-top: 0
}

.course-app .course-admin>.indicator {
    margin-left: 1rem
}

@media only screen and (max-width: 767px) {
    .course-app {
        margin-right: 20px;
        background-color: red
    }

    .course-app .ui.cards>.card {
        flex: 1 1 100%;
        max-width: 100%
    }
}

.course-season-scroll {
    background: red;
    background-color: red
}

.audio-player {
    margin: 0;
    padding: 0;
    min-height: 2.85em;
    display: flex;
    flex-direction: row;
    align-items: stretch
}

.audio-player.basic {
    border: none;
    margin: 0 !important;
    padding: 0 !important
}

.audio-player.elevation {
    padding: .5rem !important;
    border: 1px solid rgba(34, 36, 38, .15);
    border-radius: .285rem;
    box-shadow: 0 1px 2px #22242626
}

.audio-player .player-buttons {
    width: auto;
    margin: 0 .25rem
}

.audio-player .player-buttons.centered {
    width: auto;
    display: flex;
    justify-content: center
}

.audio-player .player-buttons>.player-button {
    border-radius: 50%;
    background: #f1d401;
    width: 2.5rem;
    height: 2.5rem;
    padding: .685rem;
    margin: 0 .25rem
}

.audio-player .player-panel {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin: 0 .25rem
}

.audio-player .player-progress {
    margin: 0 !important;
    width: 10rem
}

.audio-player .player-progress.tiny {
    font-size: .65rem !important
}

.audio-player .player-progress.small {
    font-size: .7rem !important
}

.audio-player .player-progress.medium {
    font-size: .85rem !important
}

.audio-player .player-progress .bar {
    min-width: .5rem !important
}

.force-graph-outer {
    margin: 0 0 .75rem !important;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    align-items: center
}

.force-graph-error {
    margin: 0 !important;
    padding: 0 2rem !important;
    text-align: center
}

.force-graph-inner {
    margin: 0 !important;
    padding: 0 !important
}

.force-graph-controls {
    margin: 0 !important;
    padding: 1rem !important;
    position: absolute !important;
    bottom: 0;
    right: 0
}

.youtube-iframe iframe {
    width: 100% !important;
    height: 100% !important
}

.markdown-content ul,
.markdown-content ol {
    padding-left: 25px;
    margin-top: 15px;
    margin-bottom: 15px
}

.markdown-content li {
    margin-bottom: 12px;
    line-height: 1.75
}

.markdown-content p {
    margin-top: 15px;
    margin-bottom: 15px
}

.markdown-content h1,
.markdown-content h2,
.markdown-content h3 {
    margin-top: 30px;
    margin-bottom: 15px;
    line-height: 1.3
}

.markdown-content {
    font-family: Inter, sans-serif;
    font-size: 16px;
    color: #333
}

body {
    background-color: #f7f7f7
}

.file-uploader {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%
}

.file-uploader .file-uploader-inner {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    height: 100% !important;
    min-height: 6rem;
    padding: .5rem;
    margin: 0;
    border: 2px dashed #009e96;
    border-radius: 5px;
    cursor: pointer
}

.file-uploader .file-uploader-content {
    width: 100%;
    text-align: center;
    cursor: pointer
}

.file-uploader .progress-items {
    width: 100%
}

.file-uploader .progress-items>.progress {
    width: 100%;
    margin: 0 0 .5rem
}

.file-uploader .progress-items>.progress>.label {
    top: 0 !important;
    font-size: .9rem
}

#container-circles {
    position: absolute;
    left: 50%;
    bottom: 90px
}

#outer-circle {
    left: -37px;
    height: 75px;
    width: 75px;
    background-color: #fff6;
    z-index: 1
}

#inner-circle,
#outer-circle {
    position: absolute;
    border-radius: 50%
}

#inner-circle {
    left: 50%;
    top: 38px;
    height: 44px;
    width: 44px;
    background: #fff;
    margin: -22px 0 0 -22px;
    z-index: 2
}

#inner-circle.is-clicked {
    height: 38px;
    width: 38px;
    margin: -19px 0 0 -19px
}

#white-flash.normal {
    position: absolute;
    height: 100%;
    width: 100%;
    opacity: 1;
    -webkit-transition: opacity .9s ease-out;
    -o-transition: opacity .9s ease-out;
    transition: opacity .9s ease-out
}

#white-flash.do-transition {
    opacity: 0;
    background: #fff
}

#display-error {
    color: #000;
    background-color: #fff
}

.react-html5-camera-photo {
    position: relative;
    text-align: center
}

.react-html5-camera-photo>img,
.react-html5-camera-photo>video {
    width: 768px
}

.react-html5-camera-photo>.display-error {
    width: 768px;
    margin: 0 auto
}

@media (max-width:768px) {

    .react-html5-camera-photo>.display-error,
    .react-html5-camera-photo>img,
    .react-html5-camera-photo>video {
        width: 100%
    }
}

.react-html5-camera-photo-fullscreen>img,
.react-html5-camera-photo-fullscreen>video {
    width: 100vw;
    height: 100vh
}

.react-html5-camera-photo-fullscreen>video {
    -o-object-fit: fill;
    object-fit: fill
}

.react-html5-camera-photo-fullscreen>.display-error {
    width: 100vw;
    height: 100vh
}

.files-app .AppMenu.menu {
    height: calc(100vh - 250px)
}

.opened-file .active.tab {
    height: calc(100vh - 270px);
    overflow: auto
}

.files-app {
    width: 100%
}

.files-app .opened-file {
    width: 100%;
    min-height: 8rem;
    position: relative
}

.name-span {
    margin-right: 10px !important
}

.ace-save-btn {
    margin-bottom: 10px !important
}

.files-btnWrapper {
    display: flex;
    align-items: center
}

.files-btnWrapper>.uploader-btn {
    margin-left: 10px
}

.flex-center {
    display: flex;
    align-items: center
}

.prefix-page {
    width: 100%
}

.prefix-page .uploader-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    width: 100%
}

.prefix-page .uploader-wrapper>.Uploader {
    width: 100% !important;
    margin: 0 auto
}

.uploadSpinner {
    top: 50px !important;
    left: 100% !important
}

.blob-trigger-file-button {
    margin-top: .5rem !important;
    padding: .75rem 1rem !important
}

.blob-trigger-list {
    width: 100%;
    min-height: 3.5rem;
    background-color: #0000000d !important
}

.blob-trigger-list>.blob-trigger-button {
    position: absolute;
    right: .75rem;
    bottom: .75rem;
    width: 2rem;
    height: 2rem;
    padding: .25rem !important
}

.blob-trigger {
    width: 100%;
    margin: 0 0 .75rem !important;
    padding: 0 !important;
    background: #fff;
    border: 1px solid rgba(34, 36, 38, .15);
    border-radius: .285rem;
    box-shadow: 0 1px 2px #22242626
}

.blob-trigger>.header {
    width: 100%;
    padding: .5rem 1rem .25rem !important;
    margin: 0 !important;
    border-bottom: 1px solid rgba(34, 36, 38, .15)
}

.blob-trigger>.header>.controls {
    position: absolute;
    right: 0;
    top: 0
}

.blob-trigger>.content {
    width: 100%;
    margin: 0 !important;
    padding: .5rem .75rem !important
}

.blob-trigger>.footer {
    width: 100%;
    margin: 0 !important;
    padding: 0 .75rem .25rem !important
}

.parameter-builder {
    margin: 0 0 .5rem !important;
    padding: 1rem 1rem 1rem 4rem !important
}

.parameter-builder .optional {
    width: 4rem;
    display: flex;
    flex-direction: column
}

.parameter-builder>.handle {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2.25rem;
    background-color: #2223261a !important
}

.parameter-builder>.handle>.icon {
    position: absolute;
    bottom: .25rem;
    left: .25rem
}

.parameter-builder>.handle:after {
    content: "";
    font-family: Icons;
    line-height: 1.65rem;
    position: absolute;
    top: 0;
    left: .55rem
}

.addOptionInput {
    width: 100%
}

.addOptionInput>input {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border: 2px solid transparent !important;
    border-right: 0px solid transparent !important
}

.addOptionInput>input:focus,
.addOptionButton {
    border: 2px solid rgb(44, 93, 126) !important;
    border-right: 0px solid transparent !important
}

.addOptionButton {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-left: 0px solid transparent !important;
    border-color: transparent !important;
    width: 18% !important
}

.inputContainer {
    display: flex;
    align-items: center
}

.options {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.options-terminate-btn {
    margin-left: 10px !important;
    cursor: pointer
}

.options-terminate-btn:hover {
    opacity: .75
}

.form-page-builder,
.parameter-wrapper {
    display: block
}

.parameter-wrapper.draggable,
.parameter-wrapper.dragged-parameter {
    left: 1rem !important;
    z-index: 100;
    /* opacity: .75 */
}

.form-page-builder>.draggable-group {
    margin-top: .5rem !important;
    padding: 0
}

.form-page-builder>.draggable-group>.draggable-item {
    padding: 0
}

.placeholder {
    margin: 0
}

.mailing-list-app {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: stretch;
    gap: 1rem
}

.mailing-list-app>.mailing-list-panel {
    display: flex;
    flex-direction: row;
    margin-bottom: 0
}

.mailing-list-app>.mailing-list-main {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
    overflow-y: auto
}

.mailing-list-main .mailing-list-tabs {
    flex-grow: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    overflow-y: auto
}

.mailing-list-panel>.mailing-list-dropdown {
    flex-grow: 1;
    margin-right: .5rem
}

.mailing-list-panel>.mailing-list-button {
    background-color: #2185d0;
    color: #fff
}

.mailing-list-panel>.mailing-list-button:last-child {
    margin-right: 0
}

.mailing-list-tab {
    width: 100%;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 20px;
    background-color: #f9f9f9;
    border-radius: 1rem
}

.mailing-list-tab>.mailing-list-controls {
    display: flex;
    flex-direction: column;
    gap: .5rem
}

.mailing-list-tab>.mailing-list-content {
    min-height: 200px;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 5px
}

.mailing-list-tab>.mailing-list-controls>.quill {
    display: flex;
    flex-direction: column;
    min-height: 200px
}

.mailing-list-tab .appmenu {
    height: 100%;
    position: -webkit-sticky;
    position: sticky;
    overflow: auto
}

.mailing-list-input,
.mailing-list-file-picker {
    width: 100%
}

.mailing-list-send-button {
    display: flex;
    margin-top: 15px;
    justify-content: center;
    align-items: center
}

.modal-header {
    font-size: 1.5rem;
    font-weight: 700;
    text-align: center;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e0e1e2
}

.modal-content {
    padding: 1.5rem
}

.modal-content label {
    display: block;
    font-size: 1.2rem;
    margin-bottom: .5rem
}

.modal-content input {
    width: 100%;
    padding: .5rem;
    font-size: 1rem;
    margin-bottom: 1.5rem
}

.modal-actions {
    display: flex;
    justify-content: flex-end;
    padding: 1rem;
    border-top: 1px solid #e0e1e2
}

.modal-actions button {
    margin-left: 1rem
}

.mailing-list-send-button-container {
    display: flex;
    justify-content: flex-start;
    padding: 1rem 0
}

.mailing-list-send-button {
    display: flex;
    align-items: center;
    font-size: 1.1rem;
    font-weight: 700;
    padding: .75rem 1.5rem
}

.mailing-list-send-button .icon {
    margin-right: .5rem
}

.my-account-app {
    height: 100%;
    max-width: 800px
}

.my-account-app>.my-account-tabs {
    width: 100%
}

.my-account-2fa {
    width: 100%
}

.Support {
    background-color: red;
    text-align: left;
    max-width: 450px;
    margin: auto;
    padding: 10px
}

.ChangePassword {
    text-align: left;
    max-width: 450px;
    margin: auto;
    padding: 10px
}

.ChangePasswordRow input {
    width: calc(100% - 10px);
    font-size: 14px;
    line-height: 18pt
}

.ChangePasswordSubmit {
    text-align: center;
    margin-top: 10px
}

.ChangePasswordSubmitButn {
    background-color: #aaa;
    margin: 10px
}

.SubscriptionOption {
    padding: 5px;
    background-color: #eee;
    text-align: center
}

/* ######################################################## */
/* Object Explorer App                                      */
/* ######################################################## */

.explorer-app .ui.vertical.menu .active.item {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    transition: all 300ms;
}

.explorer-main .ui.menu a.item:hover {
    color: #fff;
    background-color: #e356b6 !important;
}

/* ######################################################## */
/* Object Viewer                                            */
/* ######################################################## */

.object-view {
    width: 100%
}

.object-view>.viewer-controls {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center !important
}

.object-view>.viewer {
    width: 100%;
    height: 100%;
    min-height: 15rem;
    padding: .25rem 0;
    margin: 0;
    overflow-x: auto !important
}

.object-view>.viewer>other.pre {
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word
}

.object-view>.viewer>pre {
    height: 100%;
    padding: 0;
    margin: 0;
    white-space: pre
}

.object-editor {
    width: 100% !important;
    min-height: 10rem;
    margin: 0 !important;
    padding: 0 !important
}

.object-explorer,
.object-explorer .object-view,
.object-explorer .controls {
    width: 100%
}

.object-explorer .controls .collection-control {
    display: flex;
    font-size: .935rem;
    align-items: stretch !important;
    flex-grow: 1 !important
}

.object-explorer .controls .collection-control>.label {
    margin: 0 !important;
    vertical-align: middle;
    border-radius: .285rem;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding: .785rem .833rem;
    background-color: #e8e8e8;
    font-size: 1em !important;
    line-height: 1em !important
}

.object-explorer .controls .collection-control>.selection {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left-color: transparent;
    min-width: 18rem
}

.object-explorer .controls .collection-buttons {
    flex-grow: .5 !important;
    display: flex;
    justify-content: flex-start;
    align-items: end;
    flex-wrap: wrap;
    margin: 0;
    padding: 0
}

.object-explorer .controls .collection-buttons .button {
    margin: 0 .35rem 0 0 !important;
    padding: .785rem
}

.object-explorer .controls .collection-extra {
    flex-grow: .5 !important;
    display: flex;
    font-size: .935rem;
    align-items: stretch !important;
    justify-content: flex-end
}

.presentation-traditional {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    margin: 0
}

.presentation-traditional>.main-area {
    width: 100%;
    flex-grow: 1;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow-y: auto
}

.presentation-traditional>.main-area .slide-youtube {
    width: 100%;
    height: 100%;
    max-width: 800px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-bottom: 4rem
}

.presentation-traditional>.main-area .slide-youtube .slide-brief {
    margin-bottom: 1rem
}

.presentation-traditional>.main-area .slide-youtube .youtube-wrapper {
    width: 100%;
    height: 100%;
    display: flex
}

.presentation-traditional>.footer {
    width: 100%;
    height: 4rem;
    position: fixed;
    bottom: 0;
    background-color: #f0f0f0;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 -2px 5px #0000001a;
    opacity: .95
}

.presentation-traditional>.footer .footer-button {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.5rem;
    margin: 0 .75rem;
    color: #007bff;
    display: flex;
    align-items: center
}

.presentation-traditional .footer-button:hover {
    color: #0056b3
}

.presentation-traditional .footer-text {
    font-size: 1.5rem;
    margin: 0 .75rem
}

.podcast {
    width: 100%;
    max-width: 800px;
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

.podcast>.podcast-header {
    width: 100%;
    display: flex;
    align-items: flex-start;
    margin-bottom: 1rem
}

.podcast>.podcast-header>img {
    width: 12.8rem
}

.podcast>.podcast-header>.container {
    padding: 0 1.5rem;
    min-height: 12.8rem
}

.podcast>.podcast-header>.container>h2 {
    font-size: 2rem;
    font-family: Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, Liberation Sans, sans-serif;
    text-align: left
}

.podcast>.podcast-main {
    width: 100%;
    margin: 0 0 1rem
}

.podcast>.podcast-main>.podcast-card {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin-bottom: 1rem;
    background: #fff
}

.podcast>.podcast-main>.podcast-card.elevation1 {
    border: 1px solid rgba(34, 36, 38, .15);
    border-radius: .285rem;
    box-shadow: 0 1px 2px #22242626
}

.podcast>.podcast-main>.podcast-card.elevation2 {
    box-shadow: 0 2px 1px -1px #0003, 0 1px 1px #00000024, 0 1px 3px #0000001f;
    border-radius: 4px
}

.podcast>.podcast-main>.podcast-card>.card-left {
    width: 12.8rem;
    flex-shrink: 0
}

.podcast>.podcast-main>.podcast-card>.card-left>img {
    width: 12.8rem
}

.podcast>.podcast-main>.podcast-card>img {
    width: 12.8rem
}

.podcast>.podcast-main>.podcast-card>.container {
    padding: 0 1.5rem;
    min-height: 12.8rem;
    text-align: left
}

.podcast>.podcast-main>.podcast-card>.container>h5 {
    margin: 0 0 .25rem;
    color: #595959 !important;
    text-transform: uppercase !important;
    font-size: .9rem
}

.podcast>.podcast-main>.podcast-card>.container>h2 {
    margin: 0 0 .5rem;
    font-family: roboto, sans-serif;
    font-weight: 700
}

.podcast-links {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px
}

.podcast-link {
    display: flex;
    padding-left: 40px;
    align-items: center;
    text-decoration: none;
    color: #000;
    flex-shrink: 0
}

.podcast-link img {
    margin-right: 8px
}

.podcast-link span {
    font-size: 16px
}

.podcast-link:hover span {
    text-decoration: underline
}

.blog-post-container {
    display: flex;
    flex-direction: row;
    margin: 0 auto;
    max-width: 1200px
}

.table-of-contents {
    margin-right: 20px;
    flex-basis: 20%
}

.main-content {
    flex-basis: 80%
}

.algebra-textbook {
    display: flex;
    height: 100%
}

.algebra-textbook .content {
    width: 70%;
    margin-left: 30%;
    margin-top: 80px;
    overflow-y: auto;
    height: 100%
}

.algebra-textbook .toc {
    width: 30%;
    position: fixed;
    top: 80px;
    padding-right: 20px
}

.algebra-textbook .toc h2 {
    margin-bottom: 20px
}

.algebra-textbook .toc ul {
    list-style-type: none;
    padding: 0
}

.algebra-textbook .toc li {
    margin-bottom: 10px
}

.algebra-textbook .toc a {
    text-decoration: none;
    color: #666;
    cursor: pointer
}

.algebra-textbook .toc a.active {
    font-weight: 700;
    color: #000
}

.algebra-textbook .chapter {
    margin-bottom: 40px
}

.algebra-textbook .chapter h2 {
    margin-bottom: 20px
}

.scheduler-app {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column
}

.scheduler-app .scheduler-view {
    width: 100%;
    height: 100%;
    padding: 1rem;
    margin: 0
}

.scheduler-app .controls {
    width: 100%
}

.SchedulerTable {
    width: 75% !important;
    margin: 0 auto !important
}

.labelButton {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.modalContainer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.modalValueContainer,
.title-container {
    display: flex;
    align-items: center
}

.modalValueContainer>input {
    border: 1px solid grey;
    border-radius: 10px;
    padding: 10px;
    font-size: 18px;
    margin-bottom: 15px;
    margin-left: 10px
}

.modalValueContainer>input:disabled {
    cursor: not-allowed
}

.title-container>*:first-child {
    margin-right: 10px;
    margin-bottom: -5px;
    font-size: 1.3rem;
    max-width: 175px;
    min-width: 175px;
    font-family: Lato, Helvetica Neue, Arial, Helvetica, sans-serif;
    font-weight: 800;
    background-color: none
}

.title-container input {
    border: none
}

.title-container input::placeholder {
    font-size: 1rem
}

.table-value {
    display: flex;
    align-items: center;
    justify-content: space-between
}

/* ################################################################ */
/* Explorer App                                                     */
/* ################################################################ */

.explorer-app {
	background-color: rgb(14, 30, 42) !important;
}

/* ################################################################ */
/* Streams App                                                      */
/* ################################################################ */

.streams-app {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column
}

.streams-app>.menu {
    margin: 0 !important
}

.streams-app>.menu>.item {
    padding: .785rem .833rem !important;
    font-size: 1em !important;
    line-height: 1em !important
}

.streams-app>.menu>.item.active {
    background-color: #f4f5f6d9 !important
}

.streams-app>.menu>.menu.right {
    flex-grow: 1
}

.streams-app .stream-tabs {
    padding: 0;
    flex-grow: 1;
    background-color: #f4f5f6d9 !important
}

.streams-app .object-view {
    width: 100%
}

.streams-app .object-view>other.pre {
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word
}

.streams-app .object-view>pre {
    height: 100%;
    min-height: 15rem;
    padding: 0;
    margin: 0;
    overflow-x: auto !important;
    white-space: pre
}

.streams-app .controls,
.stream-trigger-modal .prefs {
    width: 100%
}

.streams-app .controls .collection-control,
.stream-trigger-modal .prefs .actions-control {
    display: flex;
    flex-grow: 1 !important;
    align-items: stretch !important;
    padding: 0 0 0 .5rem !important
}

.streams-app .controls .collection-control>.label,
.stream-trigger-modal .prefs .actions-control>.label {
    margin: 0 !important;
    vertical-align: middle;
    border: solid 1px #d4d4d5;
    border-right: none;
    border-radius: .285rem;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding: .785rem .833rem;
    background-color: #e8e8e8;
    font-size: 1em !important;
    line-height: 1em !important
}

.streams-app .controls .collection-control>.selection,
.stream-trigger-modal .prefs .actions-control>.selection {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left-color: transparent
}

.streams-app .controls .collection-buttons {
    width: auto !important;
    flex-grow: 0;
    margin: 0;
    padding: 0 !important
}

.streams-app .controls .collection-buttons .button {
    margin: 0 0 0 .55rem !important;
    padding: .785rem .285rem;
    width: 6.2rem;
    min-width: 6rem
}

.ui.search.dropdown.visible>input.search {
    color: #000 !important
}

.SurveyRouterHeader,
.SurveyRouterFooter {
    padding: 25px;
    text-align: center;
    margin: 10px
}

.SurveyListItem {
    text-align: left;
    background-color: #fdf;
    padding: 10px;
    min-width: 400px;
    margin: 10px
}

.SurveyListPage {
    margin: auto;
    max-width: 950px;
    padding: 25px
}

.SurveyRouter {
    margin: auto
}

div.ui.list>div.item:hover {
    background-color: #d3d3d3
}

.parameters-container {
    display: flex;
    gap: 30px
}

@media screen and (max-width: 1024px) {
    .parameters-container {
        flex-direction: column
    }
}

/* ######################################################## */
/* System Admin App                                         */
/* ######################################################## */

.sys-admin-app {
    width: 100%;
    height: 100%
}

.sys-admin-app>.admin-tabs {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column
}

.sys-admin-app>.admin-tabs>.menu {
    padding: 0;
    margin: 0
}

.sys-admin-app>.admin-tabs>.menu>.item {
    padding: .5rem .75rem
}

.sys-admin-app>.admin-tabs>.tab {
    flex-grow: 1;
    margin: 0;
    padding: 1rem;
    overflow: auto;
    display: flex;
    flex-direction: column
}

.sys-admin-app>.admin-tabs .admin-users {
    flex-grow: 1;
    height: 100%
}

.sys-admin-app>.admin-tabs .admin-users>.users-menu {
    width: 100%;
    height: 100%
}

.sys-admin-app>.admin-tabs .admin-users>.users-menu .menu-users {
    width: 100%;
    height: 100%;
    overflow-y: auto
}

.sys-admin-app>.admin-tabs .admin-users>.users-main {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto
}

.sys-admin-app>.admin-tabs .users-toolbar {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin: 0;
    padding: 0
}

.sys-admin-app>.admin-tabs .users-toolbar>.adminUsers-pane {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 0;
    padding: .5rem;
    gap: .25rem
}

.sys-admin-app>.admin-tabs .users-toolbar>.adminUsers-pane.auth {
    width: 17.6rem
}

.sys-admin-app>.admin-tabs .users-toolbar>.adminUsers-pane.apps {
    width: 8.6rem;
    padding-left: 0
}

.sys-admin-app>.admin-tabs .users-toolbar>.adminUsers-pane.user {
    width: 6.8rem;
    padding-left: 0
}

.sys-admin-app>.admin-tabs .users-toolbar>.adminUsers-pane>.button {
    margin: 0
}

.sys-admin-app>.admin-tabs .users-toolbar>.adminUsers-pane.apps>.button {
    width: 100%
}

.sys-admin-app>.admin-tabs .users-toolbar>.adminUsers-pane.user>.button {
    width: 100%
}

.sys-admin-app>.admin-tabs .user-view {
    width: 100%;
    padding: 1rem;
    display: flex;
    align-items: stretch;
    flex-direction: column;
    flex-grow: 1
}

.sys-admin-app>.admin-tabs .user-view .actions {
    margin: .5rem
}

.sys-admin-app>.admin-tabs .user-view .actions>.content {
    padding: .75rem
}

.sys-admin-app>.admin-tabs .user-view .actions>.content.header {
    display: flex;
    justify-content: flex-start;
    align-items: center
}

.sys-admin-app>.admin-tabs .user-view .actions>.content.header>h4 {
    margin-bottom: 0
}

.sys-admin-app>.admin-tabs .user-view .actions>.content>.list>.item>.content {
    line-height: 2rem
}

.sys-admin-app .adminUsers-btns-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 5px
}

/* Active menu item styles - pink text with matching sidebar background */
.sys-admin-app .admin-users .users-menu .appmenu-menu .item.active {
    color: #E356B6 !important;
    background-color: rgba(227, 86, 182, 0.08) !important;
    border-left: 3px solid #E356B6 !important;
}

/* Hover styles - pink background with white text */
.sys-admin-app .admin-users .users-menu .appmenu-menu .item:hover {
    background-color: #E356B6 !important;
    color: white !important;
}

/* Collections App - Active menu item styles - pink text with matching sidebar background */
.explorer-app .collections .appmenu-menu .item.active {
    color: #E356B6 !important;
    background-color: rgba(227, 86, 182, 0.08) !important;
    border-left: 3px solid #E356B6 !important;
}

/* Collections App - Hover styles - pink background with white text */
.explorer-app .collections .appmenu-menu .item:hover {
    background-color: #E356B6 !important;
    color: white !important;
}

/* Action Runner App - Active menu item styles - pink text with matching sidebar background */
.action-runner .appmenu-menu .item.active {
    color: #E356B6 !important;
    background-color: rgba(227, 86, 182, 0.08) !important;
    border-left: 3px solid #E356B6 !important;
}

/* Action Runner App - Hover styles - pink background with white text */
.action-runner .appmenu-menu .item:hover {
    background-color: #E356B6 !important;
    color: white !important;
}

/* Optimizer App (Neon Pixel only) - Active menu item styles - pink text with matching sidebar background */
.optimizer-pane .optimizer-menu .appmenu .menu .item.active {
    color: #E356B6 !important;
    background-color: rgba(227, 86, 182, 0.08) !important;
    border-left: 3px solid #E356B6 !important;
}

/* Optimizer App (Neon Pixel only) - Hover styles - pink background with white text */
.optimizer-pane .optimizer-menu .appmenu .menu .item:hover {
    background-color: #E356B6 !important;
    color: white !important;
}

/* Optimizer App - Input/Output Parameters Table Hover Styles */
.optimizer-pane .ui.table.selectable tbody tr:hover {
    background-color: #E356B6 !important;
    color: white !important;
    transition: all 200ms;
}

.optimizer-pane .ui.table.selectable tbody tr:hover td {
    color: white !important;
}

.optimizer-pane .ui.table.selectable tbody tr:hover .icon {
    color: white !important;
}

/* Add spacing between button rows in users toolbar */
.users-toolbarzzzz {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem !important;
}

.users-toolbarzzzz .ui.button {
  margin-bottom: 0.25rem !important;
}

.sys-admin-app .admin-applications {
    width: 100%;
    display: flex;
    align-items: stretch;
    flex-direction: column;
    flex-grow: 1
}

.sys-admin-app .admin-applications>.applications-toolbar {
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-start;
    gap: 12px
}

.sys-admin-app .admin-applications>.applications-toolbar>.dropdown {
    flex-grow: 1
}

.sys-admin-app .admin-applications>.applications-view {
    display: flex;
    flex-direction: column;
    background-color: #0000000d
}

.sys-admin-app .subscriptions {
    width: 100%;
    padding: .5rem;
    display: flex;
    align-items: stretch;
    flex-direction: column;
    flex-grow: 1
}

.sys-admin-app .subscriptions .cards>.card {
    width: calc(50% - 1rem) !important;
    margin: .5rem !important
}

.sys-admin-app .subscriptions .cards>.card>.content {
    display: flex;
    align-items: stretch;
    flex-direction: column
}

.sys-admin-app .subscriptions .cards>.card>.content>.header {
    margin-bottom: .5rem
}

.sys-admin-app .subscriptions .cards>.card>.content>.meta {
    flex-grow: 1
}

.sys-admin-app .subscriptions .cards>.card>.content .dropdown {
    font-size: .75rem
}

@media only screen and (min-width: 1280px) {
    .sys-admin-app .subscriptions .four.cards>.card {
        width: calc(25% - 1rem) !important
    }
}

.sys-admin-app .user-groups {
    width: 100%;
    padding: 0;
    display: flex;
    align-items: stretch;
    flex-direction: column;
    flex-grow: 1
}

.sys-admin-app .user-groups>.grid {
    flex-grow: 1
}

.sys-admin-app .user-groups .actions>.content {
    padding: .75rem
}

.sys-admin-app .user-groups .actions>.content.header {
    display: flex;
    justify-content: flex-start;
    align-items: center
}

.sys-admin-app .user-groups .actions>.content.header>h4 {
    margin-bottom: 0
}

.sys-admin-app .User p {
    font-size: medium
}

.sys-admin-app .User h2 {
    font-size: larger
}

@media only screen and (min-width: 768px) {

    .sys-admin-app .wide.column.users-menu,
    .sys-admin-app .wide.column.users-main {
        display: flex !important;
        padding: 1rem 0 1rem 1rem;
        margin: 0
    }

    .sys-admin-app .wide.column.users-main {
        padding-right: 1rem
    }

    .BackAppMenu-btn {
        display: none !important
    }
}

@media only screen and (max-width: 767px) {

    .sys-admin-app .wide.column.users-menu,
    .sys-admin-app .wide.column.users-main {
        width: 100% !important;
        padding: 1rem 0 1rem 1rem;
        margin: 0
    }

    .sys-admin-app .wide.column.users-main {
        padding-right: 1rem
    }

    .sys-admin-app .adminUsers-btns-container span {
        display: none !important
    }

    .BackAppMenu-btn {
        display: block !important
    }
}

.actionListDiv {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.actionSelector {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.actionSelector>*:first-child {
    width: 100%
}

.actionSelector>button {
    margin-left: 10px !important
}

.noActionsLabel,
.actionListDiv {
    margin-top: 10px;
    margin-left: 5px
}

.sys-admin-app .site-config {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: stretch;
    flex-direction: column;
    flex-grow: 1
}

.sys-admin-app .site-config>.menu {
    margin: -.5rem -.5rem .5rem;
    padding: 0
}

.sys-admin-app .site-config>.site-config-main {
    width: 100%;
    padding: .5rem;
    margin: 0
}

.sys-admin-app .site-config .ace_editorZZ {
    margin: 0;
    justify-content: center;
    flex-grow: 1;
    border: 1px solid rgba(34, 36, 38, .25);
    border-radius: .25rem
}

.sys-admin-app .site-config .cards>.card {
    width: calc(50% - 1rem) !important;
    margin: .5rem !important
}

.sys-admin-app .site-config .cards>.site-config-templates {
    width: calc(100% - 1rem) !important;
    margin: .5rem !important
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {

    .sys-admin-app .site-config .cards>.site-config-prefs,
    .sys-admin-app .site-config .cards>.site-config-templates {
        width: calc(100% - 1rem) !important;
        margin: .5rem !important
    }
}

@media only screen and (max-width: 767px) {

    .sys-admin-app .site-config .cards>.site-config-prefs,
    .sys-admin-app .site-config .cards>.site-config-templates {
        width: calc(100% - 1rem) !important;
        margin: .5rem !important
    }
}

.site-config-templates .description {
    flex-grow: 1
}

.site-config-templates .description>.menu>.item {
    padding: .9rem 1rem !important
}

.site-config-templates .description>.menu>.item.active {
    background: #f8f8f8 !important
}

.site-config-templates .description>.segment {
    background: #f8f8f8 !important
}

.my-audio-player {
    padding: 10px
}

.my-audio-player .header {
    margin: 0
}

.my-audio-player img {
    object-fit: contain;
    max-width: 100%
}

.my-audio-player .header.h6 {
    font-size: .8em;
    font-weight: 500;
    margin-bottom: 4px;
    text-align: left
}

.my-audio-player .header.h4 {
    font-size: 1em;
    font-weight: 600;
    margin-bottom: 4px;
    text-align: left
}

.my-audio-player .progress {
    margin-bottom: 4px
}

.my-audio-player .label {
    font-size: .7em;
    background: none;
    border: none;
    padding: 0
}

.my-audio-player .button {
    padding: 6px;
    font-size: .8em
}

.SurveyHeader {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    padding: 10px;
    background-color: #000;
    color: #fff;
    height: 25px
}

.SurveyQuestion .ui.radio.checkbox {
    height: 42px;
    font-size: 12pt;
    line-height: 14pt;
    padding: 4px
}

.SurveyQuestion .ui.checkbox {
    padding: 5px
}

.SurveyQuestion .ui.radio.checkbox label:before {
    width: 25px;
    height: 25px
}

.SurveyQuestion .ui.radio.checkbox label:after {
    width: 25px;
    height: 25px
}

.SurveyQuestion .ui.checkbox label:before {
    width: 25px;
    height: 25px
}

.SurveyQuestion .ui.checkbox label:after {
    width: 25px;
    line-height: 24px;
    height: 5px
}

.SurveyQuestion p {
    font-size: 14pt
}

.FormLabel {
    font-size: 18pt;
    line-height: 24pt;
    margin-top: 5px;
    margin-bottom: 20px;
    display: inline-block
}

.SurveyHeaderName {
    font-size: 12pt;
    font-weight: 700;
    padding-right: 10px
}

.SurveyHeaderShortDesc {
    padding-right: 10px
}

.SurveyFooter {
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
    padding: 10px;
    background-color: #000;
    color: #fff;
    height: 45px
}

.SurveyFooterPageButton {
    min-width: 100px;
    margin-left: 5px;
    margin-right: 5px
}

.SurveyQuestionArea {
    margin-top: 25px;
    width: 100%
}

.SurveyQuestion {
    text-align: left;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 15px;
    border-color: #eee;
    border-width: 1px;
    border-style: solid;
    width: 700px
}

.SurveyQuestionLabel {
    padding: 10px;
    font-size: 12pt
}

.SurveyQuestionInput {
    padding: 10px;
    border-radius: 10px;
    border-color: #220;
    border-width: 1px;
    font-size: 12pt;
    width: calc(100% - 30px)
}

.cbx {
    padding: 10px
}

.cbx input[type=checkbox] {
    display: none
}

.cbx input[type=checkbox]+label {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 20px;
    font: 14px/20px Open Sans, Arial, sans-serif;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none
}

.cbx input[type=checkbox]:hover+label:hover {
    color: #1756e4
}

.cbx input[type=checkbox]:hover+label:before {
    background: #50565a;
    box-shadow: inset 0 0 0 2px #f7f2f2
}

.cbx input[type=checkbox]+label:last-child {
    margin-bottom: 0
}

.cbx input[type=checkbox]+label:before {
    content: "";
    display: block;
    width: 1.4em;
    height: 1.4em;
    border: 1px solid #343a3f;
    border-radius: .2em;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transition: all .2s, background .2s ease-in-out;
    transition: all .2s, background .2s ease-in-out;
    background: #f3f3f3
}

.cbx input[type=checkbox]:checked+label:before {
    width: 1.3em;
    height: 1.3em;
    border-radius: .2em;
    border: 2px solid #fff;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    background: #50565a;
    box-shadow: 0 0 0 1px #000
}

.cbx2 input[type=checkbox] {
    display: none
}

.cbx2 input[type=checkbox]+label {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 20px;
    font: 14px/20px Open Sans, Arial, sans-serif;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none
}

.cbx2 input[type=checkbox]:hover+label:hover {
    color: #1756e4
}

.cbx2 input[type=checkbox]:hover+label:before {
    border: 1px solid #343a3f;
    box-shadow: 2px 1px #343a3f
}

.cbx2 input[type=checkbox]+label:last-child {
    margin-bottom: 0
}

.cbx2 input[type=checkbox]+label:before {
    content: "";
    display: block;
    width: 1.4em;
    height: 1.4em;
    border: 1px solid #343a3f;
    border-radius: .2em;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transition: all .2s, background .2s ease-in-out;
    transition: all .2s, background .2s ease-in-out;
    background: #ffffff08;
    box-shadow: -2px -1px #343a3f;
    background: #f3f3f3
}

.cbx2 input[type=checkbox]:checked+label:before {
    border: 2px solid #fff;
    border-radius: .3em;
    background: #50565a;
    box-shadow: 2px 1px #50565a
}

.checkbox-circle input[type=checkbox] {
    display: none
}

.checkbox-circle input[type=checkbox]+label {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 20px;
    font: 14px/20px Open Sans, Arial, sans-serif;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none
}

.checkbox-circle input[type=checkbox]:hover+label:hover {
    color: #1756e4
}

.checkbox-circle input[type=checkbox]:hover+label:before {
    border: 1px solid #343a3f;
    width: 1.2em;
    height: 1.2em;
    border: 2px solid #fff;
    background: #50565a;
    box-shadow: 0 0 0 1px #000
}

.checkbox-circle input[type=checkbox]+label:last-child {
    margin-bottom: 0
}

.checkbox-circle input[type=checkbox]+label:before {
    content: "";
    display: block;
    width: 1.4em;
    height: 1.4em;
    border: 1px solid #343a3f;
    border-radius: 1em;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transition: all .2s, transform .3s ease-in-out;
    transition: all .2s, transform .3s ease-in-out;
    background: #f3f3f3
}

.checkbox-circle input[type=checkbox]:checked+label:before {
    border-radius: 1em;
    border: 2px solid #fff;
    width: 1.2em;
    height: 1.2em;
    background: #50565a;
    box-shadow: 0 0 0 1px #000;
    -webkit-transform: rotateX(180deg);
    transform: rotateX(180deg)
}

.checkbox-circle2 input[type=checkbox] {
    display: none
}

.checkbox-circle2 input[type=checkbox]+label {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 20px;
    font: 14px/20px Open Sans, Arial, sans-serif;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none
}

.checkbox-circle2 input[type=checkbox]:hover+label:hover {
    color: #1756e4
}

.checkbox-circle2 input[type=checkbox]:hover+label:before {
    border: 1px solid #343a3f;
    box-shadow: 2px 1px #343a3f
}

.checkbox-circle2 input[type=checkbox]+label:last-child {
    margin-bottom: 0
}

.checkbox-circle2 input[type=checkbox]+label:before {
    content: "";
    display: block;
    width: 1.4em;
    height: 1.4em;
    border: 1px solid #343a3f;
    border-radius: 1em;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transition: all .2s, background .2s ease-in-out;
    transition: all .2s, background .2s ease-in-out;
    background: #f3f3f3;
    box-shadow: -2px -1px #343a3f
}

.checkbox-circle2 input[type=checkbox]:checked+label:before {
    border-radius: 1em;
    border: 2px solid #fff;
    width: 1.15em;
    height: 1.15em;
    background: #50565a;
    box-shadow: 2px 1px #50565a
}

.toggle-rect input[type=checkbox] {
    display: none
}

.toggle-rect input[type=checkbox]+label {
    display: block;
    position: relative;
    width: 3em;
    height: 1.6em;
    margin-bottom: 20px;
    border-radius: .2em;
    background: #f3f3f3;
    box-shadow: inset 0 0 3px 1px #0000004d;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none
}

.toggle-rect input[type=checkbox]+label:before {
    content: "";
    display: block;
    width: 1.2em;
    height: 1.2em;
    border-radius: .2em;
    background: #50565a;
    box-shadow: 2px 0 5px #0003;
    position: absolute;
    left: .2em;
    top: .2em;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

.toggle-rect input[type=checkbox]:checked+label {
    background: #fff
}

.toggle-rect input[type=checkbox]:checked+label:before {
    box-shadow: -2px 0 5px #0003;
    left: 1.6em
}

.toggle-rect-bw input[type=checkbox] {
    display: none
}

.toggle-rect-bw input[type=checkbox]+label {
    display: block;
    position: relative;
    width: 3em;
    height: 1.6em;
    margin-bottom: 20px;
    background: #50565a;
    border-radius: .2em;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none
}

.toggle-rect-bw input[type=checkbox]+label:before {
    content: "";
    display: block;
    width: 1.2em;
    height: 1.2em;
    border-radius: .2em;
    background: #f7f2f2;
    position: absolute;
    left: .2em;
    top: .2em;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

.toggle-rect-bw input[type=checkbox]:checked+label {
    background: #40464a
}

.toggle-rect-bw input[type=checkbox]:checked+label:before {
    left: 1.6em
}

.toggle-rect-color input[type=checkbox] {
    display: none
}

.toggle-rect-color input[type=checkbox]+label {
    display: block;
    position: relative;
    width: 3em;
    height: 1.6em;
    margin-bottom: 20px;
    background: #e84d4d;
    border-radius: .2em;
    box-shadow: inset 0 0 5px #0000001a;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none
}

.toggle-rect-color input[type=checkbox]+label:before {
    content: "";
    display: block;
    width: 1.2em;
    height: 1.2em;
    border-radius: .2em;
    background: #50565a;
    box-shadow: 2px 0 5px #0003;
    position: absolute;
    left: .2em;
    top: .2em;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

.toggle-rect-color input[type=checkbox]:checked+label {
    background: #47cf73
}

.toggle-rect-color input[type=checkbox]:checked+label:before {
    box-shadow: -2px 0 5px #0003;
    left: 1.6em
}

.toggle-rect-dark input[type=checkbox] {
    display: none
}

.toggle-rect-dark input[type=checkbox]+label {
    display: block;
    position: relative;
    width: 3em;
    height: 1.6em;
    margin-bottom: 20px;
    background: #303e58;
    border-radius: .2em;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none
}

.toggle-rect-dark input[type=checkbox]+label:before {
    content: "";
    display: block;
    width: 1.2em;
    height: 1.2em;
    border-radius: .2em;
    background: #e84d4d;
    position: absolute;
    left: .2em;
    top: .2em;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

.toggle-rect-dark input[type=checkbox]:checked+label:before {
    background: #47cf73;
    left: 1.6em
}

.toggle-pill input[type=checkbox] {
    display: none
}

.toggle-pill input[type=checkbox]+label {
    display: block;
    position: relative;
    width: 3em;
    height: 1.6em;
    margin-bottom: 20px;
    border-radius: 1em;
    background: #f3f3f3;
    box-shadow: inset 0 0 3px 1px #0000004d;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-transition: background .1s ease-in-out;
    transition: background .1s ease-in-out
}

.toggle-pill input[type=checkbox]+label:before {
    content: "";
    display: block;
    width: 1.2em;
    height: 1.2em;
    border-radius: 1em;
    background: #50565a;
    box-shadow: 2px 0 5px #0003;
    position: absolute;
    left: .2em;
    top: .2em;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

.toggle-pill input[type=checkbox]:checked+label {
    background: #fff
}

.toggle-pill input[type=checkbox]:checked+label:before {
    box-shadow: -2px 0 5px #0003;
    left: 1.6em
}

.toggle-pill-bw input[type=checkbox] {
    display: none
}

.toggle-pill-bw input[type=checkbox]+label {
    display: block;
    position: relative;
    width: 3em;
    height: 1.6em;
    margin-bottom: 20px;
    background: #50565a;
    border-radius: 1em;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-transition: background .1s ease-in-out;
    transition: background .1s ease-in-out
}

.toggle-pill-bw input[type=checkbox]+label:before {
    content: "";
    display: block;
    width: 1.2em;
    height: 1.2em;
    border-radius: 1em;
    background: #f7f2f2;
    position: absolute;
    left: .2em;
    top: .2em;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

.toggle-pill-bw input[type=checkbox]:checked+label {
    background: #40464a
}

.toggle-pill-bw input[type=checkbox]:checked+label:before {
    left: 1.6em;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.toggle-pill-color input[type=checkbox] {
    display: none
}

.toggle-pill-color input[type=checkbox]+label {
    display: block;
    position: relative;
    width: 3em;
    height: 1.6em;
    margin-bottom: 20px;
    border-radius: 1em;
    background: #e84d4d;
    box-shadow: inset 0 0 5px #0000004d;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-transition: background .1s ease-in-out;
    transition: background .1s ease-in-out
}

.toggle-pill-color input[type=checkbox]+label:before {
    content: "";
    display: block;
    width: 1.2em;
    height: 1.2em;
    border-radius: 1em;
    background: #fff;
    box-shadow: 2px 0 5px #0003;
    position: absolute;
    left: .2em;
    top: .2em;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

.toggle-pill-color input[type=checkbox]:checked+label {
    background: #47cf73
}

.toggle-pill-color input[type=checkbox]:checked+label:before {
    box-shadow: -2px 0 5px #0003;
    left: 1.6em
}

.toggle-pill-dark input[type=checkbox] {
    display: none
}

.toggle-pill-dark input[type=checkbox]+label {
    display: block;
    position: relative;
    width: 3em;
    height: 1.6em;
    margin-bottom: 20px;
    border-radius: 1em;
    background: #303e58;
    box-shadow: inset 0 0 5px #0000004d;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-transition: background .1s ease-in-out;
    transition: background .1s ease-in-out
}

.toggle-pill-dark input[type=checkbox]+label:before {
    content: "";
    display: block;
    width: 1.2em;
    height: 1.2em;
    border-radius: 1em;
    background: #e84d4d;
    position: absolute;
    left: .2em;
    top: .2em;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.toggle-pill-dark input[type=checkbox]:checked+label:before {
    background: #47cf73;
    box-shadow: -2px 0 5px #0003;
    left: 1.6em;
    -webkit-transform: rotate(295deg);
    transform: rotate(295deg)
}

.wallet-app {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    background-color: #f4f5f6d9 !important
}

.wallet-app>.grid {
    flex-grow: 1;
    padding: 0;
    overflow: auto
}

.wallet-app>.grid>.column>.appmenu {
    height: 100%;
    position: -webkit-sticky;
    position: sticky;
    overflow: auto
}

.wallet-app>.grid>.column>.profile-toolbar {
    flex-grow: 0;
    padding: .5rem;
    margin-bottom: 1rem !important;
    display: flex;
    align-items: center
}

.wallet-app>.grid>.column>.profile-toolbar>.toolbar-left,
.wallet-app>.grid>.column>.profile-toolbar>.toolbar-styles,
.wallet-app>.grid>.column>.profile-toolbar>.toolbar-right {
    display: flex;
    align-items: center
}

.wallet-app>.grid>.column>.profile-toolbar>.toolbar-styles {
    flex-grow: 1
}

.wallet-app>.grid>.column>.profile-view {
    flex-grow: 1;
    padding: 1rem;
    margin-top: 0 !important;
    overflow: auto;
    background-color: #e0e1e2d9 !important
}

.wallet-app .profile-toolbar {
    width: 100%;
    padding: .5rem
}

.wallet-app .profile-toolbar .button {
    width: 4.6rem;
    min-height: 3.2rem;
    padding: .5rem .75rem;
    line-height: 1.2rem;
    vertical-align: middle;
    text-align: center
}

.wallet-app .controls {
    width: 100%
}

.wallet-app .controls .collection-control {
    display: flex;
    font-size: .935rem;
    align-items: stretch !important;
    flex-grow: 1 !important
}

.wallet-app .controls .collection-control>.label {
    margin: 0 !important;
    vertical-align: middle;
    border-radius: .285rem;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding: .785rem .833rem;
    background-color: #e8e8e8;
    font-size: 1em !important;
    line-height: 1em !important
}

.wallet-app .controls .collection-control>.selection {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left-color: transparent;
    min-width: 18rem
}

.wallet-app .controls .collection-buttons {
    flex-grow: .5 !important;
    display: flex;
    justify-content: flex-start;
    align-items: end;
    flex-wrap: wrap;
    margin: 0;
    padding: 0
}

.wallet-app .controls .collection-buttons .button {
    margin: 0 .35rem 0 0 !important;
    padding: .785rem
}

.wallet-app .controls .collection-extra {
    flex-grow: .5 !important;
    display: flex;
    font-size: .935rem;
    align-items: stretch !important;
    justify-content: flex-end
}

.collection-input>.label {
    width: 9.2rem
}

.ParamsList {
    font-size: 24px;
    list-style-type: decimal
}

.ParamsListItem {
    margin-left: 10px
}

#uploader {
    height: 100%
}

.UploadMeta {
    margin-top: 15px;
    max-width: 508px
}

.UploadMeta>* {
    margin-top: px
}

.UploadPath {
    display: flex;
    justify-content: space-between
}

.UploadContainer {
    margin-top: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.force-graph {
    width: 100%;
    flex-grow: 1;
    position: relative
}

.force-graph>div {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0
}

.force-graph>div>div {
    position: absolute !important;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0
}

.node-label {
    font-size: 12px;
    padding: 1px 4px;
    border-radius: 4px;
    background-color: #00000080;
    -webkit-user-select: none;
    user-select: none
}

.background {
    fill: none;
    pointer-events: all
}

.graticule {
    fill: none;
    stroke: #777;
    stroke-width: .5;
    stroke-opacity: .7
}

#dma-borders {
    fill: none;
    stroke: #000;
    stroke-width: .7;
    stroke-linejoin: round;
    stroke-linecap: round;
    pointer-events: none
}

#textbox {
    position: absolute;
    top: 400px;
    left: 50px;
    width: 275px;
    height: 100px
}

#textbox text p {
    font-family: Arial, Helvetica;
    font-size: .8em;
    margin: 0
}

.tooltip {
    background-color: #fff;
    padding: 24px;
    pointer-events: none
}

._3_ygE {
    display: table;
    border-bottom: #e6e4e4 1px solid;
    border-top: #e6e4e4 1px solid;
    border-left: #e6e4e4 1px solid
}

._1nBOt {
    display: table-row;
    list-style: none
}

._2eZzQ {
    border-right: 1px solid rgb(196, 196, 196);
    opacity: 1;
    margin-left: -2px
}

._WuQ0f {
    display: table-cell;
    vertical-align: -webkit-baseline-middle;
    vertical-align: middle
}

._3ZbQT {
    display: table;
    border-bottom: #e6e4e4 1px solid;
    border-left: #e6e4e4 1px solid
}

._34SS0 {
    display: table-row;
    text-overflow: ellipsis
}

._34SS0:nth-of-type(2n) {
    background-color: #f5f5f5
}

._3lLk3 {
    display: table-cell;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

._nI1Xw {
    display: flex
}

._2QjE6 {
    color: #565656;
    font-size: .6rem;
    padding: .15rem .2rem 0rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer
}

._2TfEi {
    font-size: .6rem;
    padding-left: 1rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

._3T42e {
    background: #fff;
    padding: 12px;
    box-shadow: 0 3px 6px #00000029, 0 3px 6px #0000003b
}

._29NTg {
    font-size: 12px;
    margin-bottom: 6px;
    color: #666
}

._25P-K {
    position: absolute;
    display: flex;
    flex-shrink: 0;
    pointer-events: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

._3gVAq {
    visibility: hidden;
    position: absolute;
    display: flex;
    pointer-events: none
}

._1eT-t {
    overflow: hidden auto;
    width: 1rem;
    flex-shrink: 0;
    scrollbar-width: thin
}

._1eT-t::-webkit-scrollbar {
    width: 1.1rem;
    height: 1.1rem
}

._1eT-t::-webkit-scrollbar-corner {
    background: transparent
}

._1eT-t::-webkit-scrollbar-thumb {
    border: 6px solid transparent;
    background: #0003;
    background: var(--palette-black-alpha-20, rgba(0, 0, 0, .2));
    border-radius: 10px;
    background-clip: padding-box
}

._1eT-t::-webkit-scrollbar-thumb:hover {
    border: 4px solid transparent;
    background: #0000004d;
    background: var(--palette-black-alpha-30, rgba(0, 0, 0, .3));
    background-clip: padding-box
}

._2dZTy {
    fill: #fff
}

._2dZTy:nth-child(2n) {
    fill: #f5f5f5
}

._3rUKi {
    stroke: #ebeff2
}

._RuwuK {
    stroke: #e6e4e4
}

._9w8d5 {
    text-anchor: middle;
    fill: #333;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none
}

._1rLuZ {
    stroke: #e6e4e4
}

._2q1Kt {
    text-anchor: middle;
    fill: #555;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none
}

._35nLX {
    fill: #fff;
    stroke: #e0e0e0;
    stroke-width: 1.4
}

._KxSXS {
    cursor: pointer;
    outline: none
}

._KxSXS:hover ._3w_5u {
    visibility: visible;
    opacity: 1
}

._3w_5u {
    fill: #ddd;
    cursor: ew-resize;
    opacity: 0;
    visibility: hidden
}

._31ERP {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    stroke-width: 0
}

._RRr13 {
    cursor: pointer;
    outline: none
}

._2P2B1 {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

._1KJ6x {
    cursor: pointer;
    outline: none
}

._2RbVy {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    opacity: .6
}

._2pZMF {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

._3zRJQ {
    fill: #fff;
    text-anchor: middle;
    font-weight: lighter;
    dominant-baseline: central;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none
}

._3KcaM {
    fill: #555;
    text-anchor: start;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none
}

._CZjuD {
    overflow: hidden;
    font-size: 0;
    margin: 0;
    padding: 0
}

._2B2zv {
    margin: 0;
    padding: 0;
    overflow: hidden
}

._3eULf {
    display: flex;
    padding: 0;
    margin: 0;
    list-style: none;
    outline: none;
    position: relative
}

._2k9Ys {
    overflow: auto;
    max-width: 100%;
    scrollbar-width: thin;
    height: 1.2rem
}

._2k9Ys::-webkit-scrollbar {
    width: 1.1rem;
    height: 1.1rem
}

._2k9Ys::-webkit-scrollbar-corner {
    background: transparent
}

._2k9Ys::-webkit-scrollbar-thumb {
    border: 6px solid transparent;
    background: #0003;
    background: var(--palette-black-alpha-20, rgba(0, 0, 0, .2));
    border-radius: 10px;
    background-clip: padding-box
}

._2k9Ys::-webkit-scrollbar-thumb:hover {
    border: 4px solid transparent;
    background: #0000004d;
    background: var(--palette-black-alpha-30, rgba(0, 0, 0, .3));
    background-clip: padding-box
}

._19jgW {
    height: 1px
}

.table-container {
    width: fit-content
}

table {
    margin-top: 10px;
    text-align: center;
    border-spacing: 10px;
    border-collapse: separate;
    border-spacing: 15px
}

tr>th {
    font-size: 18px
}

.td-input {
    border: none;
    outline: none;
    padding: 10px;
    border-radius: 5px;
    font-size: 20px;
    margin-top: 5px
}

.td-input:focus {
    border: 2.5px solid lightblue;
    border-radius: 5px
}

.td-disabled>input:disabled {
    color: gray;
    pointer-events: all;
    cursor: not-allowed
}

.submit-btn {
    margin: 0 auto;
    width: 100px
}

.AppMenu {
    height: calc(100vh - 145px);
    max-height: 100vh;
    overflow-x: hidden;
    overflow-y: scroll
}

.ui.modal>.content>.description {
    width: 100%
}

.Homepage {
    padding-top: 50px;
    min-height: 100vh;
    max-width: 500px;
    margin: auto
}

.container {
    max-width: 400px;
    margin: 0 auto;
    padding: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh
}

.segment {
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 4px 6px #0000001a;
    padding: 2rem
}

.header {
    font-size: 2.5rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 1.5rem;
    text-align: center
}

.links {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem
}

.link {
    font-size: 1.1rem;
    color: #fff;
    text-decoration: none;
    display: inline-block;
    text-align: center;
    transition: background-color .3s, color .3s;
    background-color: #4183c4;
    padding: .8rem 1.5rem;
    border-radius: 5px;
    box-shadow: 0 2px 4px #0000001a;
    cursor: pointer;
    line-height: 1
}

.link:hover {
    background-color: #3a75b3
}

.link:focus {
    outline: none;
    box-shadow: 0 0 0 2px #4183c480
}

.footer-text {
    font-size: .9rem;
    text-align: center;
    margin-top: 1.5rem
}

.footer-text a {
    color: #888;
    text-decoration: none;
    transition: color .3s
}

.footer-text a:hover {
    color: #666
}

.nph3 {
    color: #000;
    padding-top: 60px;
    text-decoration: underline;
    margin-left: 25px;
    margin-right: 25px
}

.ApiDocs {
    margin-left: 20px;
    max-width: 800px
}

.ApiDocs pre {
    color: #000;
    padding-bottom: 10px
}

.ApiDocs li {
    color: #000
}

.advertiserViewer {
    margin-left: 20px
}

.advertiserViewer-header {
    display: flex;
    flex-direction: column
}

.advertiserViewer-id {
    margin-top: -10px;
    color: gray
}

.advertiserViewer-key {
    margin-top: -10px;
    color: #c1c1c1
}

.input-field {
    display: flex;
    align-items: center
}

.input-field>p {
    margin-top: 15px
}

.input-field input {
    margin-left: 10px !important
}

.inputFieldLabel {
    min-width: 100px
}

.totals-square {
    z-index: 1000000;
    border: 1.5px solid transparent;
    margin-top: 5px;
    transition: border ease-in-out .35s;
    cursor: pointer;
    overflow-wrap: break-word
}

.totals-square:hover {
    border: 1.5px solid #1890FF99
}

.totals-square-active {
    border-color: #1890ff;
    background: #1890ff1f
}

.totals-square-active:hover {
    border-color: #1890ff
}

.cursor {
    cursor: pointer
}

.arrow {
    transform: rotate(1deg)
}

.Totals-container {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

@container (min-width: 720px) {
    .Totals-container {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }
}

@container (min-width: 1024px) {
    .Totals-container {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }
}

@container (min-width: 1280px) {
    .Totals-container {
        grid-template-columns: repeat(6, minmax(0, 1fr))
    }
}

@media only screen and (max-width: 767px) {
    .Totals-container.ui.grid>.row>.column {
        width: 50% !important;
        padding: 0 3px
    }

    .totals-square .ui.segment {
        font-size: 12px;
        padding: 2px
    }

    .totals-square div.header.ui {
        margin-bottom: -2px
    }

    .totals-square span {
        font-size: 8px !important
    }
}

.report-header {
    display: flex;
    justify-content: space-between
}

.Report .NpChart-container {
    overflow: auto !important
}

.Report .NpChart-container canvas {
    width: 100% !important
}

.Report .DateRangeSelector .DateRangeSelector-background {
    position: fixed;
    top: 0 !important;
    left: 0 !important
}

.Report .DateRangeSelector .DateRangeSelector-content {
    margin-top: 0 !important;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
    max-width: max-content
}

.tableHeader_transparency {
    position: sticky;
    top: 0;
    background-color: #fff
}

.report-section {
    background: #72dcff12;
    border-radius: 1rem
}

.TimeOverTimeReport {
    overflow: scroll
}

.TimeOverTimeReport h3 {
    margin: 0 auto
}

.momTable {
    overflow: scroll;
    min-width: 100% !important;
    scroll-behavior: smooth
}

.ToT-Header {
    padding: 15px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px
}

.ToT-Header>*:last-child {
    margin-right: 25px
}

.campaignObject {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.campaignObject>*:last-child {
    margin-left: 10px;
    max-height: 50px;
    min-width: 60px
}

.modalParam {
    display: flex;
    align-items: center
}

.modalParam>p {
    min-width: 150px;
    margin-top: 10px
}

.ProgressBarLoader-container.ui.active.progress .bar {
    padding: 15px !important
}

.ProgressBarLoader-container.ui.active.progress .bar:after {
    opacity: .2 !important
}

.dropzone {
    height: 100px !important;
    margin: auto;
    min-width: 0 !important
}

.header-details {
    height: 382px;
    background-color: #e356b6
}

.orderform-comments {
    border: 1px solid black;
    margin-top: 35px;
    padding: 25px
}

.orderform-inner {
    max-width: 840px;
    margin: 0 auto;
    padding: 25px
}

.orderform-logo {
    height: 100px
}

.avatar {
    border-radius: 50%;
    height: 50px;
    width: 50px;
    object-fit: cover
}

@font-face {
    font-family: Montserrat;
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url(/_hcms/googlefonts/Montserrat/regular.woff2) format("woff2"), url(/_hcms/googlefonts/Montserrat/regular.woff) format("woff")
}

@font-face {
    font-family: Montserrat;
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url(/_hcms/googlefonts/Montserrat/regular.woff2) format("woff2"), url(/_hcms/googlefonts/Montserrat/regular.woff) format("woff")
}

@font-face {
    font-family: Montserrat;
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: url(/_hcms/googlefonts/Montserrat/700.woff2) format("woff2"), url(/_hcms/googlefonts/Montserrat/700.woff) format("woff")
}

.hs-quotes {
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    padding: 0 14px
}

.hs-quotes h1,
.hs-quotes h2,
.hs-quotes h3,
.hs-quotes h4,
.hs-quotes h5,
.hs-quotes h6 {
    line-height: 2.5rem
}

.hs-quotes .rich-text-body {
    padding-bottom: 16px
}

.hs-quotes .rich-text-body p {
    word-wrap: break-word;
    margin-block-end: 0;
    margin-block-start: 0;
    min-height: 17px
}

.hs-quotes .payment-schedule {
    margin: 32px 0
}

@media print {

    body,
    html {
        height: 297mm;
        overflow: visible !important;
        width: 210mm
    }
}

*,
:after,
:before {
    box-sizing: border-box
}

.sender-company__image {
    border-radius: 50%;
    height: 50px;
    object-fit: contain;
    width: 50px
}

.hs-quotes--modern {
    font-weight: 400;
    line-height: 24px;
    margin: 0;
    padding: 0
}

.hs-quotes--modern,
.hs-quotes--modern h2 {
    font-size: 14px
}

.hs-quotes--modern h1,
.hs-quotes--modern h2,
.hs-quotes--modern h3,
.hs-quotes--modern h4,
.hs-quotes--modern h5,
.hs-quotes--modern h6 {
    font-weight: 600
}

.hs-quotes--modern h2 {
    line-height: 24px
}

.hs-quotes--modern .contacts h2 {
    margin-bottom: 22px
}

.hs-quotes--modern .container {
    margin-left: auto;
    margin-right: auto;
    max-width: 62%;
    padding-left: 15px;
    padding-right: 15px;
    width: 100%
}

.hs-quotes--modern .header {
    align-items: center;
    display: flex;
    min-height: 60px
}

.header .container {
    display: flex;
    justify-content: space-between;
    padding-bottom: 8px;
    padding-top: 8px
}

.header .logo_wrapper {
    align-items: center;
    display: flex
}

.header .logo_wrapper img {
    display: flex
}

.header .logo_wrapper h1 {
    margin-bottom: auto;
    margin-top: auto
}

.hs-quotes--modern .esign #esignature,
.hs-quotes--modern .esign .esignature {
    font-size: 12px;
    line-height: 18px;
    margin-bottom: 28px
}

.hs-quotes--modern .esign .esignature__profile {
    font-size: 14px;
    line-height: 24px
}

.colored-section {
    margin-bottom: 32px;
    padding-bottom: 32px;
    padding-top: 32px
}

.hs-quotes--modern .colored-section h1 {
    font-size: 32px;
    margin-bottom: 24px;
    margin-top: 0
}

.hs-quotes--modern .quote-info b,
.hs-quotes--modern .recipient-info b,
.rc_name__wrapper {
    font-weight: 600
}

.rc_address1__wrapper,
.rc_address2__wrapper,
.rc_city-state-zip__wrapper,
.rc_country__wrapper,
.rc_name__wrapper,
.sender-user_email,
.sender-user_name {
    display: block
}

.rc_address1__wrapper,
.rc_address2__wrapper,
.rc_city-state-zip__wrapper,
.rc_country__wrapper {
    font-weight: 400
}

.colored-section .quote-info_wrapper,
.container.options {
    display: flex
}

.container.options {
    padding-bottom: 48px
}

.container.contacts {
    padding-bottom: 6px;
    padding-top: 20px
}

.container.contacts b {
    font-weight: 400
}

.hs-quotes--modern .container.contacts img:not(.company-logo__image) {
    border-radius: 50%;
    height: 50px;
    max-width: 50px;
    object-fit: cover
}

.container.line-items,
.container.options,
.container.terms {
    padding-top: 18px
}

.container.payment {
    padding-top: 0
}

.container.esign {
    margin-top: 64px
}

.comments-text_wrapper>div {
    border: 1px solid;
    padding: 24px
}

.comments-text_wrapper p,
.hs-quotes--modern .container.terms p {
    margin: 0
}

.container.comments h2 {
    margin-top: 0
}

.hs-quotes .comments-text_wrapper .hs_cos_wrapper_type_rich_text>*,
.hs-quotes .terms .hs_cos_wrapper_type_rich_text>* {
    overflow-wrap: break-word
}

.colored-section .recipient-info {
    width: 55%
}

.colored-section .quote-info {
    text-align: right;
    width: 45%
}

.hs-quotes--modern .line-items h2 {
    font-size: 16px;
    line-height: normal
}

.hs-quotes--modern .line-items__table {
    border: none
}

.hs-quotes--modern .discount-notice,
.hs-quotes--modern .hs-quotes--modern .line-item-future-payment {
    font-weight: 600;
    padding-top: .5em
}

.hs-quotes--modern .totals__row {
    display: flex;
    justify-content: space-between;
    padding-top: 15px
}

.hs-quotes--modern .totals__row.title {
    border-bottom: 1px solid #dfe3eb;
    font-weight: 600;
    padding-bottom: 15px
}

.hs-quotes--modern .totals-row__discount {
    text-align: right
}

.hs-quotes--modern .totals-row__discount,
.hs-quotes--modern .totals__row.bordered {
    border-bottom: 1px solid #dfe3eb;
    padding-bottom: 15px
}

.hs-quotes--modern .total-cost {
    font-size: 16px;
    font-weight: 600;
    justify-content: flex-end
}

.hs-quotes--modern .line-items__total-name {
    background-color: unset;
    min-width: 110px;
    width: auto
}

.hs-quotes--modern .line-items__total-value {
    padding-left: 20px
}

.line-items__table td,
.line-items__table th {
    border-color: #dfe3eb
}

.hs-quotes--modern .esign .signature__container {
    max-width: unset
}

.hs-quotes--modern .esign hr {
    background-color: #dfe3eb;
    border: 0;
    height: 1px;
    margin-bottom: 24px;
    width: 100%
}

.hs-quotes--modern .esignature__profile b {
    font-weight: 600
}

.hs-quotes.hs-quotes--modern .esign h3 {
    font-size: 16px;
    line-height: normal;
    margin: 0
}

.hs-quotes.hs-quotes--modern .signature__box {
    font-weight: 400
}

.hs-quotes.hs-quotes--modern .signature__field:before {
    padding-bottom: 4px
}

.hs-quotes--modern .payment__button--checkout {
    min-width: 300px
}

.hs-quotes--modern .sender-company__image {
    display: none
}

.hs-quotes--modern .hs-download__button,
.hs-quotes--modern .payment__button--checkout,
.hs-quotes--modern .print-button,
.hs-quotes.hs-quotes--modern .esignature__verify-button {
    border: none;
    font-size: 14px;
    font-weight: 500;
    height: auto;
    line-height: 16px;
    min-height: 50px;
    padding-left: 18px;
    padding-right: 18px;
    transition: all .15s ease-out;
    width: auto
}

.hs-quotes--modern .esignature__verify-button:hover,
.hs-quotes--modern .payment__button--checkout:hover {
    cursor: pointer
}

.hs-quotes--modern .esignature__verify-button:active,
.hs-quotes--modern .esignature__verify-button:focus,
.hs-quotes--modern .esignature__verify-button:hover,
.hs-quotes--modern .hs-download__button:active,
.hs-quotes--modern .hs-download__button:focus,
.hs-quotes--modern .hs-download__button:hover,
.hs-quotes--modern .payment__button--checkout:active,
.hs-quotes--modern .payment__button--checkout:focus,
.hs-quotes--modern .payment__button--checkout:hover,
.hs-quotes--modern .print-button:active,
.hs-quotes--modern .print-button:focus,
.hs-quotes--modern .print-button:hover {
    opacity: .9
}

.hs-quotes--modern .payment__button--checkout b {
    font-size: 14px;
    font-weight: 500;
    line-height: 16px
}

.option_wrapper {
    display: flex;
    margin-right: 8px
}

.hs-quotes--modern .options .download__button,
.hs-quotes--modern .options .print-button {
    width: auto
}

.hs-quotes--modern .download__button,
.hs-quotes--modern .print-button {
    display: inline-block;
    padding: 5px 12px;
    transition: all .15s ease-out;
    white-space: nowrap;
    width: auto
}

.hs-quotes--modern .print-button {
    border-radius: 3px;
    margin-left: 5px
}

.hs-quotes--modern .options .download__button {
    border: none;
    border-radius: 3px;
    font-weight: 400;
    height: fit-content
}

.hs-quotes--modern .esign .printed-signature_wrapper {
    display: none
}

@media screen and (min-width:1281px) {
    .hs-quotes--modern .container {
        max-width: 52%
    }
}

@media screen and (max-width:980px) {
    .hs-quotes--modern .container {
        max-width: unset
    }
}

@media screen and (max-width:767px) {

    .colored-section .quote-info_wrapper,
    .container.options,
    .header .container {
        flex-direction: column
    }

    .header .logo_wrapper h1 {
        margin-bottom: 15px;
        margin-top: 10px
    }

    .colored-section .quote-info,
    .colored-section .recipient-info {
        width: 100%
    }

    .colored-section .quote-info {
        text-align: left
    }

    .hs-quotes--modern .options .download__button,
    .hs-quotes--modern .options .print-button {
        font-size: 14px;
        font-weight: 500;
        min-height: 50px;
        width: 100%
    }

    .hs-quotes--modern .esign .esignature__profile {
        flex-wrap: wrap
    }

    .hs-quotes--modern .esignature__verify-button {
        margin-top: 15px
    }

    .hs-quotes--modern .esignature__verify-button,
    .hs-quotes--modern .payment__button--checkout {
        min-width: unset;
        width: 100%
    }

    .comments-text_wrapper span,
    .hs-quotes--modern .options span,
    .hs-quotes--modern .payment span,
    .hs-quotes--modern .signature__container,
    .hs-quotes--modern .terms span {
        font-size: 14px;
        line-height: 22px
    }

    .container.comments h2,
    .hs-quotes--modern .contacts h2,
    .hs-quotes--modern .esign h2,
    .hs-quotes--modern .options h2,
    .hs-quotes--modern .payment h2,
    .hs-quotes--modern .terms h2 {
        margin-bottom: 5px
    }

    .option_wrapper {
        margin-right: 0
    }

    .option_wrapper:not(:last-child) {
        margin-bottom: 20px
    }
}

@media print {
    .hs-quotes--modern .container {
        max-width: unset
    }

    .hs-quotes--modern .options,
    .hs-quotes--modern .payment {
        display: none
    }

    .quote-page-container {
        color-adjust: exact;
        -webkit-print-color-adjust: exact
    }

    .hs-quotes--modern .colored-section,
    .hs-quotes--modern .comments,
    .hs-quotes--modern .contacts,
    .hs-quotes--modern .esign,
    .hs-quotes--modern .header,
    .hs-quotes--modern .options,
    .hs-quotes--modern .payment,
    .hs-quotes--modern .terms {
        page-break-inside: avoid
    }
}

.line-items__table {
    border-collapse: collapse;
    width: 100%
}

.line-items__table-scrollable {
    overflow-x: auto;
    width: 100%
}

.line-items__table td,
.line-items__table th {
    border-style: solid;
    border-width: 1px 0 0;
    height: 4em;
    text-align: right;
    vertical-align: top
}

.line-items__table th {
    font-weight: 600;
    padding: 1em 1.71em
}

.line-items__table-with-many-columns th {
    padding: 1em
}

.line-items__table td {
    -webkit-hyphens: auto;
    hyphens: auto;
    overflow-wrap: break-word;
    padding: 1em 1.71em
}

.line-items__table-with-many-columns td {
    padding: 1em
}

.line-items__table thead th {
    border: none
}

.line-items__table tr>td:first-child,
.line-items__table tr>td:last-child,
.line-items__table tr>th:first-child,
.line-items__table tr>th:last-child {
    padding-left: 0;
    padding-right: 0
}

.line-items__table tr>td:first-child,
.line-items__table tr>th:first-child {
    min-width: 120px;
    text-align: left
}

.line-item-description {
    overflow: hidden;
    overflow-wrap: anywhere;
    white-space: pre-wrap
}

.total-qoute-calculations {
    font-size: 16px;
    font-weight: 600
}

.line-items__table .line-items__table-header--main th {
    border-top: none
}

.line-items__table .currency__container {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end
}

.totals__row .fee__container {
    align-items: end;
    display: flex;
    flex-direction: column
}

.line-items__table .currency__content,
.line-items__table .currency__content--amount-with-frequency {
    white-space: nowrap
}

.line-items__table .currency__content s {
    position: relative
}

.line-items__table .currency__content s:after,
.line-items__table .currency__content s:before {
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(100%);
    height: 1px;
    left: 0;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px
}

.line-items__table .currency__content s:before {
    content: " [start of stricken text (price before discount)] "
}

.line-items__table .currency__content s:after {
    content: " [end of stricken text] "
}

.line-items__table .currency__content--full-width {
    width: 100%
}

.line-items__table td[class^=line-items__cell--max-width] {
    max-width: 250px
}

@media print {
    .line-items__table td.line-items__cell--max-width-5 {
        max-width: 200px
    }

    .line-items__table td.line-items__cell--max-width-6 {
        max-width: 150px
    }

    .line-items__total,
    .line-items__totals {
        break-inside: avoid
    }
}

.signature__container {
    margin: 0 auto;
    max-width: 100%;
    width: 100%
}

.signature__box {
    display: flex;
    flex-wrap: wrap;
    font-weight: 600;
    justify-content: space-between;
    margin-top: 80px;
    page-break-inside: avoid
}

.signature__field {
    margin-bottom: 65px;
    width: 50%
}

.signature__field:before {
    border-style: solid;
    border-width: 1px 0 0;
    content: "";
    display: block;
    width: 70%
}

.esignature {
    margin-bottom: 40px
}

.esignature__profile {
    align-items: center;
    border: 1px solid;
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
    margin-top: 12px;
    max-width: 100%;
    padding: 24px;
    page-break-inside: avoid
}

.esignature__verify-button-container {
    align-items: flex-end;
    display: flex;
    flex-direction: column
}

.esignature__warning--test-mode {
    padding-top: 2px
}

.esignature__verify-button {
    border: none;
    border-radius: 3px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    height: 40px;
    padding-left: 12px;
    padding-right: 12px;
    width: 120px
}

.esignature__tag--sent {
    background: #fdf8f1;
    border: 1px solid #eec378;
    padding-left: 24px;
    padding-right: 24px
}

.esignature__tag--sent,
.esignature__tag--signed {
    font-size: 12px;
    text-align: center;
    vertical-align: middle
}

.esignature__tag--signed {
    background: #e9f8f6;
    border: 1px solid #54baa6;
    padding: 0 6px;
    width: 300px
}

.signature-area {
    color: #00000003 !important;
    font-family: Arial !important;
    font-size: 22px;
    font-weight: 700;
    margin-bottom: -32px
}

.esignature__loading-spinner {
    animation: spin .5s linear infinite;
    border: 4px solid #d3d3d3;
    border-radius: 50%;
    height: 30px;
    margin: 20px 0;
    width: 30px
}

@media print {
    .signature__container {
        display: block !important
    }
}

.scheduled-payments {
    overflow-x: auto
}

.scheduled-payments__table {
    border-collapse: collapse;
    margin-bottom: 0;
    min-width: 400px;
    overflow-x: auto;
    width: 100%
}

.scheduled-payments__table thead {
    border-bottom: 1px solid #000
}

.scheduled-payments__table tr>td:last-child,
.scheduled-payments__table tr>th:last-child {
    text-align: right
}

.scheduled-payments__table td,
.scheduled-payments__table th {
    text-align: left
}

.scheduled-payments__table td {
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    overflow-wrap: break-word;
    padding: 10px 0
}

.payment__button--checkout {
    align-items: center;
    border: none;
    border-radius: 3px;
    display: flex;
    height: 50px;
    justify-content: center;
    width: 300px
}

.payment__button--icon {
    height: 24px;
    margin-right: 5px;
    width: 24px
}

.payment__button-text {
    font-weight: 700
}

button:disabled.payment__button--checkout {
    background-color: #eaf0f6 !important;
    border-color: #eaf0f6 !important;
    color: #b0c1d4 !important;
    cursor: not-allowed
}

button:disabled.payment__button--checkout>.payment__button--icon {
    fill: #b0c1d4
}

.payment__alert--checkout-failed,
.payment__alert--payment-status-failed {
    background-color: #fdedee;
    border: 1px solid #f8a9ad;
    color: #000;
    display: inline-flex;
    padding: 10px
}

.payment__tag {
    border-radius: 3px;
    color: #fff;
    display: inline-block;
    line-height: 28px;
    min-width: 100px;
    padding: 0 6px;
    text-align: center
}

.payment__tag span {
    vertical-align: middle
}

.payment__tag--paid {
    background-color: #00bda5;
    border: 1px solid #00bda5
}

.payment__tag--processing {
    background-color: #dbae60;
    border: 1px solid #dbae60
}

#payment__loading-spinner {
    animation: spin .5s linear infinite;
    border: 4px solid #d3d3d3;
    border-radius: 50%;
    height: 30px;
    width: 30px
}

.payment__warning--test-mode {
    padding-top: 2px
}

@media print {

    .payment-button__heading,
    .payment__button--checkout {
        display: none
    }
}

.hs-download__button {
    background-color: #4c76b8;
    border-radius: 3px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    height: 40px;
    padding-left: 12px;
    padding-right: 12px;
    width: 120px
}

.hs-download__button[disabled] {
    background-color: #d3d3d3;
    cursor: auto
}

.hs-download__alert--error {
    color: red;
    display: none;
    margin-left: 15px
}

.hs-download__loading-spinner {
    animation: spin .5s linear infinite;
    border: 3px solid #fff;
    border-radius: 50%;
    border-top-color: #000;
    display: inline-block;
    height: 25px;
    margin: 0 auto;
    width: 25px
}

@keyframes spin {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(1turn)
    }
}

@media print {
    .hs-download__button {
        display: none
    }
}

.line-item-description {
    font-size: 12px;
    opacity: .7
}

@media print {
    .print-button {
        display: none
    }
}

h1 {
    box-sizing: border-box;
    line-height: 2.5rem;
    font-family: Montserrat, Helvetica, Arial, sans-serif;
    font-weight: 600;
    color: #fff;
    font-size: 32px;
    margin-bottom: 24px
}

.orderform-container {
    overflow: hidden
}

.orderform-side-by-side {
    float: left;
    width: 50%;
    box-sizing: border-box;
    color: #fff;
    font-size: 12pt;
    font-style: normal
}

.orderform-side-by-side-r {
    float: left;
    width: 50%;
    box-sizing: border-box;
    text-align: right;
    color: #fff;
    font-style: normal
}

.orderform-side-by-side-r p {
    margin: 5px
}

.orderform-comments p {
    margin: 0
}

@media only screen and (max-width: 600px) {
    .cart {
        max-height: 100vh !important
    }

    .cart-segment {
        padding-bottom: 60px !important
    }
}

.cart {
    max-height: 600px
}

.DraftEditor-editorContainer,
.DraftEditor-root,
.public-DraftEditor-content {
    height: inherit;
    text-align: initial
}

.public-DraftEditor-content[contenteditable=true] {
    -webkit-user-modify: read-write-plaintext-only
}

.DraftEditor-root {
    position: relative
}

.DraftEditor-editorContainer {
    background-color: #fff0;
    border-left: .1px solid transparent;
    position: relative;
    z-index: 1
}

.public-DraftEditor-block {
    position: relative
}

.DraftEditor-alignLeft .public-DraftStyleDefault-block {
    text-align: left
}

.DraftEditor-alignLeft .public-DraftEditorPlaceholder-root {
    left: 0;
    text-align: left
}

.DraftEditor-alignCenter .public-DraftStyleDefault-block {
    text-align: center
}

.DraftEditor-alignCenter .public-DraftEditorPlaceholder-root {
    margin: 0 auto;
    text-align: center;
    width: 100%
}

.DraftEditor-alignRight .public-DraftStyleDefault-block {
    text-align: right
}

.DraftEditor-alignRight .public-DraftEditorPlaceholder-root {
    right: 0;
    text-align: right
}

.public-DraftEditorPlaceholder-root {
    color: #9197a3;
    position: absolute;
    width: 100%;
    z-index: 1
}

.public-DraftEditorPlaceholder-hasFocus {
    color: #bdc1c9
}

.DraftEditorPlaceholder-hidden {
    display: none
}

.public-DraftStyleDefault-block {
    position: relative;
    white-space: pre-wrap
}

.public-DraftStyleDefault-ltr {
    direction: ltr;
    text-align: left
}

.public-DraftStyleDefault-rtl {
    direction: rtl;
    text-align: right
}

.public-DraftStyleDefault-listLTR {
    direction: ltr
}

.public-DraftStyleDefault-listRTL {
    direction: rtl
}

.public-DraftStyleDefault-ol,
.public-DraftStyleDefault-ul {
    margin: 16px 0;
    padding: 0
}

.public-DraftStyleDefault-depth0.public-DraftStyleDefault-listLTR {
    margin-left: 1.5em
}

.public-DraftStyleDefault-depth0.public-DraftStyleDefault-listRTL {
    margin-right: 1.5em
}

.public-DraftStyleDefault-depth1.public-DraftStyleDefault-listLTR {
    margin-left: 3em
}

.public-DraftStyleDefault-depth1.public-DraftStyleDefault-listRTL {
    margin-right: 3em
}

.public-DraftStyleDefault-depth2.public-DraftStyleDefault-listLTR {
    margin-left: 4.5em
}

.public-DraftStyleDefault-depth2.public-DraftStyleDefault-listRTL {
    margin-right: 4.5em
}

.public-DraftStyleDefault-depth3.public-DraftStyleDefault-listLTR {
    margin-left: 6em
}

.public-DraftStyleDefault-depth3.public-DraftStyleDefault-listRTL {
    margin-right: 6em
}

.public-DraftStyleDefault-depth4.public-DraftStyleDefault-listLTR {
    margin-left: 7.5em
}

.public-DraftStyleDefault-depth4.public-DraftStyleDefault-listRTL {
    margin-right: 7.5em
}

.public-DraftStyleDefault-unorderedListItem {
    list-style-type: square;
    position: relative
}

.public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth0 {
    list-style-type: disc
}

.public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth1 {
    list-style-type: circle
}

.public-DraftStyleDefault-orderedListItem {
    list-style-type: none;
    position: relative
}

.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-listLTR:before {
    left: -36px;
    position: absolute;
    text-align: right;
    width: 30px
}

.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-listRTL:before {
    position: absolute;
    right: -36px;
    text-align: left;
    width: 30px
}

.public-DraftStyleDefault-orderedListItem:before {
    content: counter(ol0) ". ";
    counter-increment: ol0
}

.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth1:before {
    content: counter(ol1, lower-alpha) ". ";
    counter-increment: ol1
}

.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth2:before {
    content: counter(ol2, lower-roman) ". ";
    counter-increment: ol2
}

.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth3:before {
    content: counter(ol3) ". ";
    counter-increment: ol3
}

.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth4:before {
    content: counter(ol4, lower-alpha) ". ";
    counter-increment: ol4
}

.public-DraftStyleDefault-depth0.public-DraftStyleDefault-reset {
    counter-reset: ol0
}

.public-DraftStyleDefault-depth1.public-DraftStyleDefault-reset {
    counter-reset: ol1
}

.public-DraftStyleDefault-depth2.public-DraftStyleDefault-reset {
    counter-reset: ol2
}

.public-DraftStyleDefault-depth3.public-DraftStyleDefault-reset {
    counter-reset: ol3
}

.public-DraftStyleDefault-depth4.public-DraftStyleDefault-reset {
    counter-reset: ol4
}

h1 {
    color: #000
}

h2 {
    color: #333
}

p {
    color: #555
}

.cinput {
    height: 30px;
    padding: 2px 8px
}

.cinput input {
    font-size: 10pt;
    text-align: right
}

.ui.table th,
.ui.table td {
    height: 30px;
    padding: 2px 8px
}

.HeyDayAce {
    max-height: 100px;
    border-style: solid;
    border-color: #ddd;
    border-radius: 10px;
    font-size: 14pt;
    width: 100%;
    background-color: #eee
}

.HeyDayQuestion {
    margin-bottom: 50px
}

.HeyDayPage {
    max-width: 800px;
    margin: auto
}

.HeyDayPage h1 {
    text-align: center;
    padding: 35px
}

.HeyDayQuestionAce {
    margin-top: -30px
}

.HeyDayYN.ui.radio.checkbox input:checked+label:before {
    width: 20px;
    margin-top: -2px;
    height: 20px;
    border-width: 1px;
    background-color: #aaa
}

.HeyDayYN.ui.radio.checkbox input:checked+label:before:before {
    width: 20px;
    margin-top: -2px;
    height: 20px;
    border-width: 3px;
    background-color: #aaa
}

.HeyDayYN input:checked+label:before {
    width: 5.5em;
    height: 5.5em
}

.HeyDayYN label {
    font-size: 16px
}

.HeyDayButtonArea {
    text-align: center;
    padding-top: 20px
}

.ContentSegment {
    width: 100vw;
    padding: 60px;
}

.ContentSegment h2 {
    margin-bottom: 30px;
}

.vh-100 {
    height: 100vh;
    min-height: 100vh;
    max-height: 100vh
}

.vh-50 {
    height: 50vh;
    min-height: 50vh;
    max-height: 50vh
}

.np-home-top, .partnerLogos, .np-testimonials {
    background-color: #4254DD;
}

.np-home-top h2, .partnerLogos h2, .np-testimonials h2 {
    color: #fff;
}

.side-by-side-reco-links, .mosaic-callouts, .np-home-bottom {
    background-color: #fff;
}

.side-by-side-reco-links h2, .mosaic-callouts h2, .np-home-bottom h2 {
    color:#4254DD;
}



.np-footer-image-container {
    position: relative;
    width: 100%;
    height: 200px;
    overflow: hidden
}

.np-footer-image {
    width: 100%;
    height: auto
}

.np-footer-logo-inverted {
    filter: invert(1);
    object-fit: contain;
}

.np-footer-image-container:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #4254dd, #0076fd4d);
    pointer-events: none
}

.EmailSignUp {
    max-width: 550px;
    background-color: #fff;
    border-radius: 8px;
    margin: 60px auto;
    padding: 10px;
}

.EmailSignUp .input {
    display: inline-block;
    width: 55%;
    margin-right: 15px;
}

.EmailSignUp .input input {
    padding: 15px;
    border: solid 1px #afafaf;
    border-radius: 8px;
    transition: all 200ms ease-in-out;
    width: 100%;
}

.EmailSignUp .input input:focus {
    border: solid 1px #423ADD;
}


.HomeTop {
    color: #fff;
    padding: 10vh 0px;
}

.hp-title {
    font-family: Public Sans;
    font-size: 44px;
    font-weight: 600;
    line-height: 52px;
    text-align: center;
    color: #fff
}

.hp-subtitle, .hp-trusted-by {
    font-size: 22px;
    line-height: 32px;
    max-width: 500px;
    margin: 30px auto;
}

.hp-subtitle p {
    text-align: center;
    color: #fff
}

.hp-trusted-by {
    margin-top: 40px;
}

.image-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 16px
}

@media (max-width: 768px) {
    .image-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

.side-by-side-slide-header {
    color: #4254DD;
    text-align: center
}

.np-channel-logos img {
    float: left;
    margin: 0 15px 15px 0;
    max-width: 100%
}

.np-channel-logos:after {
    content: "";
    display: block;
    clear: both
}

.Logos p,
.Logos h1 {
    color: #fff
}

.mosaic-callouts {

}

.mosaic-callouts h2 {
    color: #4254DD;
}

.MosaicCallouts {
    text-align: center;
    padding: 20px
}

.MosaicGrid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
    justify-items: center;

}

.MosaicCell {
    background-color: #F7F9FB;
    border-radius: 10px 10px 0 0;
    position: relative;
    overflow: hidden;
    border-bottom: solid 6px #E356B6;
    max-width: 450px;
}

.MosaicTitle {
    background-color: #4254DD;
    color: #fff;
    padding: 30px;
    text-align: left;
    border-radius: 10px 10px 0 0
}

.MosaicContent {
    padding: 30px;
    color: #000;
    text-align: left;
}



.SideBySideRecoLinks {
    text-align: center;
}

.side-by-side-slide-header {
}

.side-by-side-grid {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin:40px auto;
}

.side-by-side-cell {
    background-color: #F7F9FB;
    padding: 40px;
    flex: 1;
    border-radius: 10px;
    text-align: left;
    max-width: 35%;
    min-width: 350px;
}

.side-by-side-title {
    margin-bottom: 10px;
    color: #4254DD;
}


.partnerLogos h2, .partnerLogos p  {
    color: #fff;
}

.partnerLogos .logo-image {
    width: 100px;
    height: 100px;
}


.LogoGrid {
    width: 65%;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-evenly;
    align-content: flex-start;
    gap: 50px;
    margin: 20px auto;
}


.partnerLogos .LogoGrid {
    width: 65%;
    margin: 50px auto;
}

.logo-image {
    object-fit: contain
}

#hexcladLogo, #peachTruckLogo, #surlatableLogo {
    width: 200px;
}

#halloweenLogo, #KindredBravelyLogo  {
    width:300px;
}


#bouqsLogo {
    width:125px;
}

#funLogo {
    width:90px;
}

#caddisLogo {
    width:160px;
}





.pink-button, .blue-button, .white-button, .transp-white-button, .website-header-menu-item {
    color: #fff;
    text-transform: uppercase;
    padding: 15px;
    margin: 0 15px;
    border-radius: 8px;
    text-decoration: none;
    cursor: pointer;
    transition: all 200ms ease-in-out;
}

.pink-button {
    background-color: #E356B6;
}

.pink-button:hover {
    background-color: #423ADD;
    color:#fff !important;
    text-decoration: none !important;
}


.transp-white-button {
    border: 2px solid #fff;
}
.transp-white-button:hover {
    border: 2px solid #E356B6;
    text-decoration: none !important;
}


.TestimonialsGrid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    padding: 20px
}

.Testimonial {
    background-color: #FDFBF7;
    padding: 40px;
    position: relative;
    border-bottom: 6px solid #E356B6;
    text-align: left;
    z-index: 20;
}

#test1:before, #test2:before, #test3:before, #test4:before {
    content: '';
    width: 70px;
    height: 70px;
    background: #E356B6;
    position: absolute;
    z-index: 1;
    visibility: visible;
}

#test1:before {
    top: -35px;
    left: -35px;
}

#test2:before {
    top: -35px;
    right: -35px;
}

#test3:before {
    bottom: -35px;
    left: -35px;
}

#test4:before {
    bottom: -35px;
    right: -35px;
}


.TestimonialLogo {
    max-width: 100px;
    margin-bottom: 30px
}

.TestimonialQuote {
    font-size: 1.2em;
    margin-bottom: 20px
}

.TestimonialFooter {
    display: flex;
    align-items: center;
    margin-top:20px;
}

.TestimonialImage {
    border-radius: 50%;
    width: 50px;
    height: 50px;
    margin-right: 10px
}

.TestimonialDetails {
    text-align: left
}

.TestimonialName {
    font-weight: 700;
    margin-bottom: 0;
}

.TestimonialTitle {
    color: gray
}



.presentation-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background-image: linear-gradient(-180deg, #fff, #fcf9f7)
}

.presentation-loading {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: linear-gradient(-180deg, #fff, #fcf9f7)
}

.presentation-loading .presentation-loading-loader {
    position: relative;
    top: 42%;
    width: 148px;
    padding: 16px 0;
    margin: 0 auto
}

.presentation-loading .presentation-loading-loader .loader-dot {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    margin: 0 4px;
    padding: 0;
    transition: 3.6s;
    background: #00b5ad;
    opacity: .5;
    animation: wave 1.2s ease infinite
}

.presentation-loading .presentation-loading-loader .loader-dot:nth-child(1) {
    animation-delay: 0ms
}

.presentation-loading .presentation-loading-loader .loader-dot:nth-child(2) {
    animation-delay: .15s
}

.presentation-loading .presentation-loading-loader .loader-dot:nth-child(3) {
    animation-delay: .3s
}

.presentation-loading .presentation-loading-loader .loader-dot:nth-child(4) {
    animation-delay: .45s
}

.presentation-loading .presentation-loading-loader .loader-dot:nth-child(5) {
    animation-delay: .6s
}

@keyframes wave {

    0%,
    40%,
    to {
        transform: translate(0);
        opacity: .5
    }

    10% {
        transform: translateY(-15px);
        opacity: 1
    }
}

.presentation-loading .presentation-loading-logo {
    margin-top: 35px;
    text-align: center
}

.presentation-loading .presentation-loading-content {
    position: absolute;
    top: 50%;
    margin-top: 0;
    left: 50%;
    text-align: center;
    width: 90%;
    max-width: 730px;
    transform: translate(-50%)
}

.presentation-loading .presentation-loading-content h4,
.presentation-loading .presentation-loading-content h5 {
    font-weight: 500
}

.lvsos-container {
    background-color: #fff;
    min-height: 100vh;
    padding: 50px
}

.lvsos-content {
    background-color: #cff;
    padding: 50px;
    border-radius: 50px;
    border-width: 5px;
    border-color: #000;
    border-style: solid
}

.lvsos-inner-content {
    margin: auto;
    max-width: 800px
}

.lvsos-header {
    display: flex;
    align-items: center
}

.lvsos-header h1 {
    margin-right: 20px
}

.lvsos-menu {
    text-align: center;
    margin-bottom: 20px
}

.website {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #f9f9f9
}

.website-header {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 20px 10%;
    background-color: #4254DD;
    color: #fff;
    position: fixed; 
    top: 0; 
    left: 0;
    right: 0;
    z-index: 1000;
}

.logo_container {
    flex-shrink: 0;
}

.logo_container a {
    background:transparent url("https://neonpixel.co/wp-content/uploads/2020/09/LOGO-WHITE@2x.png") no-repeat;
    background-size: contain;
    text-indent: -9999px;
    display: block;
    width:160px;
    height:55px;
}

.website-header>.website-header-menu-item {
    margin-left: 20px;
    color: #fff;
    text-decoration: none; 
}

.website-header-menu-item:first-of-type {
    margin-left: auto; 
}

.website-header>.website-header-menu-item:hover, .footer-wrapper>.website-header-menu-item:hover {
    text-decoration: underline;
    color:#E356B6;
}

.website-body {
    flex: 1;
    margin: 0px auto auto
}

.website-footer {
    width: 100%;
    height: 25rem;
    background-image: url("https://s3.amazonaws.com/neonpixel.co/images/logos/channels/footer-photo.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 0 -300px;
}

.footer-wrapper {
    width: 100%;
    height: 25rem;
    display: flex;
    justify-content: center;
    padding: 20px;
    background: linear-gradient(to bottom, rgba(66,84,221,1), rgba(66,84,221,0));
    color: #fff;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease
}

.footer-wrapper.sticky {
    height: 4rem;
    z-index: 5;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease
}

.website-footer>.footer-wrapper>.footer-left,
.website-footer>.footer-wrapper>.footer-right {
    flex-grow: 0
}

.website-footer>.footer-wrapper>.footer-center {
    flex-grow: 1;
    text-align: center
}

.website-footer>.footer-wrapper>.footer-right>.audio-player-bar>.player-buttons>.player-button {
    background-color: #333;
    color: #fff
}

.website-footer>.footer-wrapper>.footer-right>.audio-player-bar>.player-progress-outer,
.website-footer>.footer-wrapper>.footer-right>.audio-player-bar>.player-volume-outer {
    background-color: #333;
    color: #fff
}

.website-footer>.footer-wrapper>.footer-right>.audio-player-bar>.player-progress-outer>.player-progress {
    background: #111
}

.website-footer>.footer-wrapper>.footer-right>.audio-player-bar>.player-progress-outer>.player-progress>.bar {
    background: #fff
}

.website-footer>.footer-wrapper>.footer-right>.audio-player-bar>.player-volume-outer>i {
    font-size: 1rem
}

.FeaturedEpisode {
    text-align: justify
}

.SponsorMain {
    background-color: #efefef;
    margin-bottom: 15px;
    padding-top: 15px;
    padding-bottom: 15px;
    max-height: 300px
}

.SponsorLink {
    font-size: 10pt
}

.SponsorMain h4 {
    font-size: 12pt
}

.SponsorImage {
    max-height: 224px;
    max-width: 600px;
    max-width: 100%
}

.Sponsor {
    background-color: #fff;
    margin: -80px auto auto;
    max-width: 1170px;
    z-index: 2;
    padding-top: 56px;
    padding-left: 70px;
    padding-right: 70px;
    text-align: left
}

.AnnualSponsor {
    margin: 50px auto;
    text-align: center;
    max-width: 100%
}

.AnnualSponsorLogoContainer {
    text-align: center
}

.SilverSponsorLogoContainer {
    text-align: center;
    max-width: 100%
}

.AnnualSponsorLogo {
    max-width: 600px
}

@media only screen and (max-width: 800px) {
    .AnnualSponsorLogo {
        max-width: 100%
    }
}

.SilverSponsorLogo {
    max-width: 300px;
    min-height: 75px
}

.SilverSponsor {
    margin: 50px auto;
    max-width: 500px;
    text-align: center
}

.ui.container {
    margin-left: 0 !important;
    margin-right: 0 !important
}

.Root {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 1rem;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: stretch !important
}

.AppMenu {
    height: calc(100vh - 210px);
    max-height: 100vh;
    overflow-x: hidden;
    overflow-y: scroll
}

.logo {
    height: 6em;
    padding: 1.5em;
    will-change: filter
}

.logo:hover {
    filter: drop-shadow(0 0 2em #646cffaa)
}

.logo.react:hover {
    filter: drop-shadow(0 0 2em #61dafbaa)
}

@keyframes logo-spin {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

@media (prefers-reduced-motion: no-preference) {
    a:nth-of-type(2) .logo {
        animation: logo-spin infinite 20s linear
    }
}

.card {
    padding: 2em
}

.ApplizxxxxxxxxxxcationsList {
    height: calc(100% - 140px);
    overflow: scroll;
    max-height: calc(100% - 140px)
}

.ui.modal {
    top: 10px
}

.wide {
    width: 100%
}

.AppMenuList {
    height: 100%;
    overflow: scroll;
    max-height: 100%
}

@keyframes onAutoFillStart {}

@keyframes onAutoFillCancel {}

input:-webkit-autofill {
    animation-name: onAutoFillStart !important;
    transition: background-color 50000s ease-in-out 0s !important
}

input:not(:-webkit-autofill) {
    animation-name: onAutoFillCancel !important
}

html {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

*,
*:before,
*:after {
    -moz-box-sizing: inherit;
    -webkit-box-sizing: inherit;
    box-sizing: inherit
}

article,
aside,
footer,
header,
hgroup,
main,
nav,
section,
time,
details {
    display: block
}

html,
body,
div,
iframe,
figure,
legend,
fieldset,
blockquote,
textarea,
pre,
hr,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ol,
ul,
li,
dl,
dt,
dd {
    margin: 0;
    padding: 0
}

img,
picture,
embed,
iframe,
object,
audio,
video {
    display: block;
    max-width: 100%;
    height: auto
}

img,
svg,
canvas,
video,
audio,
iframe,
embed,
object {
    vertical-align: middle
}

img {
    border-style: none
}

iframe {
    border: 0
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

td,
th {
    padding: 0
}

td:not([align]),
th:not([align]) {
    text-align: inherit
}

button,
input,
textarea,
select {
    font: inherit;
    margin: 0
}

body {
    min-height: 100vh;
    text-rendering: optimizeLegibility
}

[hidden] {
    display: none !important
}

template {
    display: none
}

input[type=text],
input[type=email],
input[type=search],
input[type=password] {
    -webkit-appearance: none;
    -moz-appearance: none
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

pre,
code,
kbd,
samp {
    font-family: monospace, monospace;
    font-size: 1em
}

a {
    background-color: transparent
}

b,
strong {
    font-weight: bolder
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted
}

html {
    line-height: 1.15;
    font-size: 100%;
    -ms-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button,
input {
    overflow: visible
}

button,
select {
    text-transform: none
}

button,
[type=button],
[type=reset],
[type=submit] {
    -webkit-appearance: button
}

button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
    border-style: none;
    padding: 0
}

button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: .35em .75em .625em
}

legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

progress {
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type=checkbox],
[type=radio] {
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

summary {
    display: list-item
}

:root {
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: 100%
}

body {
    width: 100%;
    height: 100%;
    min-height: 100vh;
    background: #fff;
    color: #212529;
    font-family: "Public Sans", Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.4;
    letter-spacing: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    scroll-behavior: smooth;
    text-rendering: optimizeSpeed;
    overflow-x: hidden
}

#root {
    width: 100%;
    max-width: 100%;
    height: 100%;
    min-height: 100vh;
    margin: 0;
    padding: 0
}

h1,
h2,
h3,
h4,
h5,
h6 {
    padding: 0;
    font-family: Manrope, Roboto, Helvetica Neue, Arial, Helvetica, sans-serif;
    font-weight: 700;
    line-height: 1.1;
    margin: 0 0 .25em
}

h1 {
    font-size: 2.5rem
}

h2 {
    font-size: 2rem
}

h3 {
    font-size: 1.5rem
}

h4 {
    font-size: 1.2rem
}

h5 {
    font-size: 1.25rem
}

h6 {
    font-size: 1rem
}

h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
    margin-top: 0
}

h1:last-child,
h2:last-child,
h3:last-child,
h4:last-child,
h5:last-child,
h6:last-child {
    margin-bottom: 0
}

p {
    margin: 0 0 1em;
    line-height: 1.65
}

p:first-child {
    margin-top: 0
}

p:last-child {
    margin-bottom: 0
}

a {
    font-weight: 500;
    color: #646cff;
    text-decoration: inherit
}

a:hover {
    color: #535bf2
}

button {
    border-radius: 8px;
    border: 1px solid transparent;
    padding: .6em 1.2em;
    font-size: 1em;
    font-weight: 500;
    font-family: inherit;
    background-color: #1a1a1a;
    cursor: pointer;
    transition: border-color .25s
}

button:hover {
    border-color: #646cff
}

button:focus,
button:focus-visible {
    outline: 4px auto -webkit-focus-ring-color
}

@media (prefers-color-scheme: light) {
    :root {
        color: #213547;
        background-color: #fff
    }

    a:hover {
        color: #747bff
    }

    button {
        background-color: #f9f9f9
    }
}