@keyframes up-down {
    0%{transform:translateY(100%)}
    100%{transform:translateY(0%)}
}
#up-popups .popup .navbar{height:44px;min-height:auto;margin:0;position:relative;padding:0;border:none;background:#2578c1;border-radius:0}
#up-popups .popup .close-popup{float:none;opacity:1;position:absolute;right: 5px;font:normal normal normal 14px/1;top: 3px;text-align:center;width:44px;height:44px;line-height:44px;color:#fff;text-shadow:none;cursor:pointer}
#up-popups .popup.has-footer .page-content{height:calc(100% - 83px)}
#up-popups .popup.active{z-index:1000}
#up-popups .popup.leftJustify{width:50%!important;top:0;transform:translate3d(0,0,0)!important;left: 0 !important;right:auto;height:100%!important}
#up-popups .popup.rightJustify{width:50%!important;top:0;transform:translate3d(0,0,0)!important;left:auto;height:100%!important}
#up-popups .popup .navbar .title{line-height:44px;font-size:17px;color: var(--main-text-color);padding: 4px 19px;width:calc(100% - 80px);overflow:hidden;height:100%;text-overflow:ellipsis;background:transparent;border:none; white-space: nowrap;}
#up-popups .popup .min{float:none;opacity:1;position:absolute;right:44px;font:normal normal normal 10px/1 FontAwesome;top:0;text-align:center;width:44px;height:44px;line-height:44px;color:#fff;text-shadow:none;cursor:pointer}
#up-popups .popup .min:before{content:"__"}
@keyframes popup-in {
    0%{opacity:.7;transform:translate3d(0px,0px,0px) scale(.9)}
    100%{opacity:1;transform:translate3d(0px,0px,0px) scale(1)}
}
.tab-bar{position:absolute;bottom:0;left:0;right:0;width:calc(100% - 408px);margin-left:160px;height:30px;display:flex}
.tab-bar .tab{height:100%;flex-grow:1;max-width:190px;background:#daecff;border:solid 1px #b5b5b5;margin:0 1px;border-bottom:none;overflow:hidden;text-overflow:ellipsis;min-width:80px;line-height:30px;padding:0 5px;color:#504d4d}
#up-popups .popup .loading:after{background:rgba(255,255,255,0.41)}
#up-popups .popup .close-popup:before{content:"X";font-family:sans-serif}
#up-popups .popup .navbar{height: 50px;width:100%;background: transparent;position:absolute;left:0;top:0;z-index:2;}
#up-popups .popup-tab-bar{position:fixed;z-index:9999999999999;bottom:0;left:0;padding:0 10px;display:flex;width:100%}
#up-popups .popup-tab-bar .tab{height:30px;background:#5b636be8;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);color:#fff;flex-grow:1;flex-basis:0;max-width:200px;color:#333;-webkit-box-shadow:0 0 5px 0 rgba(0,0,0,0.19);-moz-box-shadow:0 0 5px 0 rgba(0,0,0,0.19);box-shadow:0 0 5px 0 rgba(0,0,0,0.19);line-height:30px;padding:0 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#up-popups .popupContainer{width:100%;height:100%;position:fixed;top:0;left:0;display:block}
#up-popups .popupContainer .popup{width:30%;min-height:40%;max-height:90%;background:#fff;position:absolute;left:0;right:0;top:50%;transform:translateY(-50%) scale(0.9);margin:0 auto;display:block;z-index:2;opacity:0;transition:all .3s ease;-webkit-box-shadow:0 0 5px 0 rgba(0,0,0,0.16);-moz-box-shadow:0 0 5px 0 rgba(0,0,0,0.16);box-shadow:0 0 5px 0 rgba(0,0,0,0.16)}
@keyframes popup {
    from{transform:translateY(-50%) scale(.9);opacity:0}
    to{transform:translateY(-50%) scale(1);opacity:1}
}
#up-popups .popupContainer.active .popup{transform:translateY(-50%) scale(1);animation:popup .3s ease;opacity:1}
#up-popups .title{position:absolute;top:0;left:0;width:100%;line-height:44px;padding:0 10px;color:#333;background:#fff;box-sizing:border-box;border-bottom:solid 1px #d8d8d8}
#up-popups .popup{width:65%;height:90%;margin:0 auto;position:fixed;z-index:1000;top:5%;left:0;right:0;-webkit-box-shadow:0 0 5px 0 rgba(0,0,0,0.28);-moz-box-shadow:0 0 5px 0 rgba(0,0,0,0.28);box-shadow:0 0 5px 0 rgba(0,0,0,0.28);animation:popup-in .3s ease;border-radius:1px;overflow:hidden;transition: width .3s ease;}
#up-popups .popup .page-content{background-color:var(--popup-bg-container);position:relative;width:100%;height: calc(100% + 60px);padding-top:50px;padding-bottom: 10px;border-radius:15px;}
#up-popups .popup.medium{width:40%;height:80%}
#up-popups .popup.small{width:500px;max-width:100%;height:40%}
.overlay{background:rgba(128,128,128,0.51);z-index:9;position:fixed;height:calc(100% - 50px);width:100%;left:0;top:50px}
.alert-overlay{background:rgba(128,128,128,0.51);z-index:9;position:fixed;height:calc(100% - 50px);width:100%;left:0;top:50px}
#up-popups .popup .close-popup:hover,#up-popups .popup .min:hover{color:#ef3e33}
#up-popups .hidden,#up-popup-nav.hidden{display:none}
.tab.active{background:#fff!important;color:#5e5e5e;border-bottom:solid #1da1f2 2px}
.tab{font-variant:small-caps}
.popup-tab-bar{position:fixed;bottom:0;width:100%;text-align:right}
.tab{width:200px;background:#f5f5f5;display:inline-block;height:35px;text-align:center;line-height:35px;margin:0 10px;box-shadow:0 0 1px 0 rgba(0,0,0,0.32)}
#up-popup-nav{z-index:9;position:relative}
#up-overlay{position:fixed;background:#00000040;width:100%;height:100%;z-index:999;display:block;top:0;left:0}
#up-popups .popup .footer{
    background:#F4F4F4;
    clear:both;
    margin:0;
    overflow:hidden;
    padding: 10px 0px 10px;
    width:100%;
    text-align:right;
    box-sizing:border-box;
    position: relative;
    position: sticky;
    bottom: 0;
    left:0;
    height: auto;
}
#up-popups .popup button:not(.not-btn),#facebox .link_button{margin:0 0 0 3px;display:inline;padding:0 6px;height:28px;line-height:28px}
#up-popups .popup.content-driven {
    height: auto;
    max-width: 950px;
}

body.evo[class*="my_calendar"] #up-popups .popup {
    overflow: initial;
}

#up-popups .multiSelectOptions {
    border-radius: 0px 0px 8px 8px;
}

#up-popups .popup button.tox-tbtn.tox-tbtn--select.tox-tbtn--select {
    display: flex !important;
}

#up-popups .popup button:not(.not-btn).tox-tbtn {
    height: 34px !important;
}

#up-popups .tox .tox-toolbar-overlord{
    background-color:transparent;
}

#up-popups .tox .tox-toolbar, .tox .tox-toolbar__primary, #up-popups .tox .tox-toolbar__overflow{
    background-image:none;
}

@media screen and (max-width: 767px) {
    #up-popups .popup.content-driven .page-content{
        height: 100%;
        overflow: hidden;
    }
}


#up-popups form  .facebox-content > p {
    padding-left: 0px !important;
    margin: 0;
    width: 100%;
}

#up-popups form .facebox-content {
    max-height: calc(100dvh - 200px);
}

#up-popups .page-content:has(.error) form .facebox-content {
    max-height: calc(100dvh - 300px);
}

#up-popups .popup.content-driven .page-content .image-container{ text-align: center; }

#up-popups .popup.content-driven .page-content .image-container img{ max-height: 1031px; max-width: 100%; }

#up-popups .help_centre #hc_content_selector{
    height: 100% !important;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

#up-popups .help_centre .help_centre_content {
    margin: 0;
    overflow-y: scroll;
    height: 100%;
    flex-grow: 1;
}

#up-popups form.search-form {
    display: block;
    height: 43px;
    width: 100%;
    margin: 0 !important;
    box-sizing: border-box !important;
    position: relative;
    padding-top: 0;
}

#up-popups form.search-form input {
    width: 100% !important;
    height: 37px !important;
    border-radius: 50px !important;
    padding-left: 50px !important;
}

#up-popups .help_centre form.search-form button:not(.not-btn) {
    position: absolute !important;
    right: auto;
    margin: 0 !important;
    padding: 4px 8px;
    top: 4px;
    left: 15px;
    background: transparent;
}
#up-popups .help_centre form.search-form button:not(.not-btn) i:after{
    color: var(--main-text-color);
}

body.evo #up-popups .help_centre_content:has(ul) {
    top: 0px;
    position: relative;
}


@media screen and (max-width: 768px) {
    #up-popups, #up-popups .popup{
        width: 100%;
        height: 100% !important;
        top: 0;
        border-radius: 0 !important;
    }
    #up-popups .popup{
        animation: up-down .3s ease;
    }
    #up-popups .popup .page-content{
        height: 100%;
        padding-bottom: 0;
        border-radius:15px;
    }
    #up-popups .popup.removing{
        transform: translate3d(0, 100%, 0px);
        transition: all .3s ease;
    }
}
@media screen and (min-width: 768px) {
    #up-popups .popup.removing {
        opacity: .7;
        transform: translate3d(0px, 0px, 0px) scale(.9);
        transition: all .3s ease;
    }
    .popup .tox.tox-tinymce{
        height: 381px !important;
    }
}


#up-popups .popup .tox-editor-header {
    width: 100% !important;
}

#up-popups .popup {
    background: var(--popup-bg);
    border-radius: var(--main-border-r);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

#up-popups .popup .footer {
    background: transparent !important;
}

#up-popups .popup .close-popup:before {
    display: none;
}


#up-popups .popup:has(.facebox-content.add-game) {
    max-width: 700px;
}

#up-popups .popup:has(.facebox-content.add-coteachers) {
    max-width: 700px;
    min-height: 255px;
    height: 255px;
}


#up-popups *{
    box-sizing: border-box;
}
#up-popups form .footer {
    position: fixed;
    bottom: 0;
    left: 0;
    margin: 0;
}

@media screen and (max-width: 767px) {
    #up-popups .facebox-content {
        max-height: 100vh;
    }
}

#up-popups .materialStyle .img_left {margin: 0 20px 20px 0}/* repeat from editor-content.css to overwrite margin:0 above */
#up-popups .materialStyle .img_right {margin: 0 0 20px 20px}
#up-popups .materialStyle .img_center, #up-popups .materialStyle .img_full_width {margin: 20px auto}

#up-popups .header {width: 100%; min-height: 44px; position: relative; margin: -10px 0 0; padding: 10px 10px 3px; box-sizing: border-box; overflow: hidden; z-index: 10; border-radius: 8px 8px 0 0}
#up-popups .header + p {clear: both; margin-bottom: 0 0 -10px}
#up-popups .header h4, #up-popups .header span {color: #fff}
#up-popups .header h4 {padding: 0 0 7px 0; max-width: 268px}
#up-popups .header h4 span {max-width: 470px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; display: block; box-sizing: border-box}

#up-popups .facebox-content {padding: 0 1rem; overflow-y: auto; clear: both; -webkit-overflow-scrolling: touch}
#up-popups p, #up-popups fieldset {padding: 5px 0}
#up-popups fieldset {color: #222; color: var(--main-text-color)}
#up-popups .facebox-content p:first-child, #up-popups .facebox-content script:first-child + p {margin-top: 0}
#up-popups .facebox-content p img:not(.icon):not(.close_image):not(.avatar):not(.img_left):not(.img_right):not(.img_center), .logoWrapper img {float: left; margin: 0 1rem; max-width: 100%; height: auto}
#up-popups .facebox-content .materialStyle p[style*='text-align'] > img:not(.icon):not(.close_image):not(.img_left):not(.img_right):not(.img_center) {float: none; margin: inherit}
#up-popups .facebox-content p img.avatar {height: 48px; width: 48px}

/* new inbox popup */
#up-popups .messagePopup .facebox-content p.avatarHolder img.avatar {width: 32px; height: 32px; margin: 0 5px 0 0; display: inline-block}
#up-popups .messagePopup .facebox-content p.avatarHolder .multiple img.avatar {width: 32px; height: 32px; margin: 0 -18px 0 0; display: inline-block}
#up-popups .messagePopup .facebox-content p.avatarHolder .multiple img.avatar:last-child {margin: 0 -5px 0 0}
#up-popups .messagePopup .message_more_users_link {cursor: pointer}
#up-popups .messagePopup .footer .messageOptions li a{
    background:var(--active-color);
    border-radius: var(--border-r-rounded);
    color:#fff;
    font-weight: 500;
    font-size: 12px;
    padding: 2px 15px;
}

#up-popups .messagePopup .avatarHolder.avatar_msg_holder > span:first-of-type{
    width: 50px;
    font-weight: 600;
}

#up-popups .messagePopup  .facebox-content p.avatarHolder.avatar_msg_holder{
    display: flex;
    align-items: center;
}

#up-popups ul.tabnav {margin: 1px 0 10px;white-space: nowrap;overflow-x: auto !important;}

body.evo #up-popups #badge_form ul.tabnav {
    overflow-y: hidden !important;
}

#up-popups .facebox-content .optionsRibbon {left: 0; padding-bottom: 0px;}
#up-popups .facebox-content .optionsRibbon img {margin: 0}
#up-popups .facebox-content .optionsRibbonTable_separate {padding-bottom: 1px}
#up-popups .facebox-content .optionsRibbonTable_separate + table {margin: 0}
#up-popups .facebox-content .optionsRibbon ul {margin-left: 0}
#up-popups #user_trash_popup .optionsRibbon ul {margin-top: 0}

/* Android default browser sprite overflow fix */
#up-popups .facebox-content i {position: relative; z-index: 2; overflow: hidden}
#up-popups .facebox-content p i.inline,
#up-popups .facebox-content p.inline_icon i {margin-top: -4px}
#up-popups .facebox-content p.inline_icon i.xCross {margin-top: 4px}
#up-popups .facebox-content .mce-listbox .mce-caret {position: absolute}
#up-popups .facebox-content i:after {overflow: auto}
#up-popups .facebox-content #ip_addresses i:after {background: none}

.mobile-app .facebox-content * {overflow: hidden}

/* Definition Lists */
#up-popups .facebox-content p + dl {margin-top: -10px}
#up-popups .facebox-content dl {
    margin: 5px 10px;
    overflow: hidden;
    direction: ltr;
}
#up-popups .facebox-content dl dt {margin-top: 8px}

/* Error, Warning and Info Alerts */
#up-popups .alert_block {clear: both; margin: 1rem 0; border-top: 10px solid transparent}
#up-popups .alert_block p {padding: 0}
#up-popups .loginPopup #alerts i::after {
    color: #fff;
}

#up-popups .loginPopup #alerts i {
    line-height: 15px;
}

#up-popups .loginPopup #alerts p {
    margin-left: 10px;
}

/* FORMS */
#up-popups .facebox-content label, #up-popups .facebox-content fieldset legend, #up-popups .labelGap {display: inline-block;}
#up-popups .labelGap {margin-right: 14px}
#up-popups .facebox-content input[type="checkbox"] + label,
#up-popups .facebox-content input[type="radio"] + label {
    width: auto !important;
}
#up-popups .full_width {width: 100% !important; margin: 0}

#up-popups .footer {background: #f5f5f5; background: var(--highlight-bg-color); clear: both; margin: 2px 0 -10px; overflow: hidden; padding: 8px 10px; position: relative; width: 100%; text-align: right; box-sizing: border-box; border-radius: 0 0 8px 8px}
#up-popups .footer table {box-shadow: none; margin: 0}
#up-popups .footer table th, #up-popups .footer table td {border: 0; padding: 0}

#up-popups .footer input + label {margin: 1px 0 0 0}
#up-popups .footer input, #up-popups .footer label {padding: 0; line-height: 17px; float: left; margin: 7px 0 0 0}
#up-popups .footer label {margin: 0 10px}
#up-popups .footer span {margin: 6px 10px 0 0; display: inline-block}
#up-popups button:not(.not-btn), #up-popups .link_button {margin: 0 0 0 3px; padding: 0 6px; height: 28px; line-height: 28px}
#up-popups .footer button.floatL, #up-popups .footer a.floatL {margin-left: 0}
#up-popups .footer .table-right input {float: right}
#up-popups .footer .table-right label {float: right; margin-right: 0}
#up-popups .footer table .button {float: none;  margin: 0 2px}

#up-popups .tl, #up-popups .tr, #up-popups .bl, #up-popups .br {
    height: 10px;
    width: 10px;
    overflow: hidden;
    padding: 0
}
#up-popups_overlay_modal,
#up-popups_overlay {
    position: fixed;
    top: 0px;
    left: 0px;
    height:100%;
    width:100%
}
.facebox_hide {
    z-index:-100
}
.facebox_overlayBG {
    background-color: #1a517c;
    z-index: 100
}
* html #up-popups_overlay_modal,
* html #up-popups_overlay {
    position: absolute;
}
#up-popups #coupon_form select {position: relative}
#up-popups #coupon_form select#coupon_discount_type {width: auto !important; display: inline-block !important}

/* Log in as user */
#up-popups .login_as_user, #up-popups .login_as_user + .footer {display: flex; justify-content: space-between}
#up-popups .login_as_user > *, #up-popups .login_as_user + .footer > * {width: 48%}
#up-popups .login_as_user > *:not(.vertical_separator) {padding: 10px 10px 0; text-align: center; display: flex; flex-direction: column}
#up-popups .login_as_user > .vertical_separator {width: 1px; margin: 0 10px; background-color: var(--divider-border-color)}
#up-popups .login_as_user > * svg {margin: auto auto 0; width: 70%; display: block}
#up-popups .login_as_user + .footer {text-align: center}
#up-popups .login_as_user + .footer > * {width: 48%}
#up-popups .login_as_user > *:not(.vertical_separator).navbar {
    text-align: left;
}
#up-popups .login_as_user > *:not(.vertical_separator).page-content {
    padding-top: 50px !important;
}
@media screen and (max-width: 400px) {
    #up-popups .login_as_user > *:not(.vertical_separator) {padding: 5px; font-size: 15px}
    #up-popups .login_as_user > .vertical_separator {margin: 0 5px}
}

/* Onboarding popups */
#up-popups .video.xxl_popup {max-height: 100% !important}
#up-popups .video.xxl_popup .embed-max-size {margin: 0; max-width: 1110px; max-height: 619px}
#up-popups .sl-demo .embed-max-size {max-width: 700px !important; margin: 10px auto 0 !important}
#up-popups .sl-demo .embed-container {padding-bottom: calc(62.50% + 25px); width: 100%; transform: scale(1)}
#up-popups .sl-demo .embed-container iframe {position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; border: none}

/* Catalog page access code */
#up-popups .xsml_popup input[type="password"] {width:100%; margin: 0}

/* Email recipients */
#up-popups .facebox-content table#receivers {margin-top: 0}

/* Main Site Sign Up Form */
#up-popups form#signup_form .facebox-content input[type="text"], #up-popups form#signup_form .facebox-content select {
    width: 100%;
    box-sizing: border-box;
    margin-right: 0
}
#up-popups form#signup_form .facebox-content input#captcha {width: 65%}
#up-popups form#signup_form .facebox-content input#captcha ~ img {vertical-align: middle}

/* Portal Sign Up Form */
#up-popups form#join_form .facebox-content label, #up-popups form#join_form .facebox-content input[type="text"] {
    width: auto
}

/* Add Resources Form */
#up-popups div.facebox-resources-filter {clear: both; overflow: hidden; padding: 0 10px}
#up-popups div.facebox-resources-filter > p > * {margin-bottom: 6px}
#up-popups div.facebox-resources-filter > p + p {margin: -10px 0 5px 0}
#up-popups div.facebox-resources-filter input#resource_name {display: inline-block; width: 150px; height: 28px; margin-top: 4px}
#up-popups div.facebox-resources-filter label {width: 115px; line-height: 36px; float: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap}
#up-popups div.facebox-resources-filter select {width: 50%; padding: 1px 4px; height: 28px}
#up-popups form#resources_form .facebox-content label {display: inline; margin-left: -2px}
#up-popups form#resources_form .no-mlol label {margin-left: 0px}
#up-popups form#resources_form .search-item i {margin: -3px 5px 0 0}

/* Preview Resource popup */
#up-popups .resource_popup {display: flex}
#up-popups .resource_popup .resource_content {flex: 1; width: 100%; max-width: 575px; max-height: 500px; overflow: auto; overflow: auto; position: relative; vertical-align: middle}
/*#up-popups .resource_popup .resource_content iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%}#up-popups .resource_popup .resource_content iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%}*/
#up-popups .resource_popup .resource_content *[class*='resource-flowplayer-'] {position: relative; top: 50%; transform: translateY(-50%)}
#up-popups .resource_popup .resource_content.resource_img {display: flex; justify-content: center; background-image: linear-gradient(45deg,#efefef 25%,transparent 0,transparent 75%,#efefef 0,#efefef),linear-gradient(45deg,#efefef 25%,transparent 0,transparent 75%,#efefef 0,#efefef); background-size: 21px 21px; background-position: 0 0,10px 10px}
#up-popups .resource_popup .resource_content.resource_img {display: flex; justify-content: center; background-image: linear-gradient(45deg,#efefef 25%,transparent 0,transparent 75%,#efefef 0,#efefef),linear-gradient(45deg,#efefef 25%,transparent 0,transparent 75%,#efefef 0,#efefef); background-size: 21px 21px; background-position: 0 0,10px 10px}
[data-theme="dark"] #up-popups .resource_popup .resource_content > img {background-image: linear-gradient(45deg,#000000 25%,transparent 0,transparent 75%,#000000 0,#000000),linear-gradient(45deg,#000000 25%,transparent 0,transparent 75%,#000000 0,#000000)}
#up-popups .resource_popup .resource_content > img {max-width: 100%; object-fit: contain}
#up-popups .resource_popup .tableFixed {table-layout: auto}
#up-popups .resource_popup .gs-table .table-head {top: 0}
#up-popups .resource_popup .gs-table.no-edit .table-content {margin-top: 34px}
#up-popups .resource_popup aside {width: 249px}
#up-popups .resource_popup aside ul li i {position: absolute}
#up-popups .resource_popup aside ul li span:not(.ratingStatic) i {margin-top: 0}

/* Add Tool */
#up-popups .tool_row {display: flex; align-items: center; margin: 10px 0; position: relative}
body:not(.portal):not(.edu2) #up-popups .facebox-content .tool_row label {width: auto !important}
#up-popups .tool_row .tool_img {border: 1px solid #e2e0e0; border-right: 1px solid var(--table-border-color); margin: 0 10px; width: 100px; display: flex; align-items: center; padding: 5px; flex-shrink: 0; border-radius: 3px}
#up-popups .tool_row .tool_img img {width: 100%}
#up-popups .tool_row strong {font-size: 15px}
#up-popups .tool_row p {margin: 0; padding: 0; font-size: 13px}
@supports (-webkit-line-clamp: 2) {
    #up-popups .tool_row p {
        display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden
    }
}

/* User Listing Table */
#up-popups .facebox-content table.userListingTable {margin: -5px 0 0}
#up-popups .facebox-content table.userListingTable td {border: 0}
#up-popups .facebox-content table.userListingTable td img {float: none; margin: auto}

/* Add event */
#up-popups form#event_form .facebox-content {min-height: 130px}
#up-popups form#event_form .facebox-content input[type="checkbox"] + label {-webkit-user-select: none}

/* Share */
#up-popups .facebox_share a {word-wrap: break-word}

/* Member Popup */
#up-popups .name_search {
    background: url("../images/search-btn.gif") no-repeat 2px 1px #F4F4F4;
    border: 1px solid #d6d6d6;
    cursor: pointer;
    outline: none;
    width: 24px;
    height: 19px
}
#up-popups .member_block_heading td {
    border: 1px solid #d6d6d6;
    border-collapse: collapse;
    vertical-align: middle;
    padding: 3px
}
#up-popups .member_block_heading + .member_block_heading td {
    border-left: 0
}
#up-popups .member_block_heading td a {
    line-height: 15px;
    display: inline-block;
    padding: 0 0 1px;
    margin: 0;
    width: 16px;
    float: left
}
#up-popups table.member_table + table.member_table td {
    border-left: 0;
    padding-left: 6px
}
#up-popups table.member_table td {
    border: 1px solid #d6d6d6;
    border-top: 0;
    border-collapse: collapse;
    padding: 5px;
    vertical-align: middle
}
#up-popups .member_table tr td:nth-child(2) {
    border-right: 0;
    padding-right: 0
}
#up-popups .member_table tr td:nth-child(3) {
    border-left: 0;
    padding-left: 0
}
#up-popups table.member_table td a {
    display: block;
    width: 113px;
    word-wrap: break-word;
    float: right
}
#up-popups table.member_table td img {
    float: left
}
#up-popups table.member_table input[type="checkbox"] {
    width: 13px;
    height: 13px
}

/* School Portal Search Popup */
#up-popups .schoolsFacebox.facebox-content {
    max-width: 400px
}
#up-popups .schoolsFacebox.facebox-content .schoolsHolder {
    display: table;
    width: 100%
}
#up-popups .schoolsFacebox.facebox-content a {
    display: table-row
}
#up-popups .schoolsFacebox.facebox-content a > div {
    display: table-cell;
    vertical-align: middle;
    border-bottom: 1px solid #e2e0e0; border-bottom: 1px solid var(--divider-border-color);
    padding: 13px 13px 9px 3px
}
#up-popups .schoolsFacebox.facebox-content a div.logoWrapper {
    max-width: 90px;
    height: 50px;
    text-align: center
}
#up-popups .schoolsFacebox.facebox-content a div.logoWrapper img {
    margin: auto;
    box-shadow: none;
    float: none
}
#up-popups .schoolsFacebox.facebox-content a div.logoWrapper + div {
    padding-right: 15px;
    padding-top: 9px;
    word-break: break-all;
    margin-top: -1px
}
#up-popups .schoolsFacebox.facebox-content a:first-child > div {
    padding-top: 3px !important
}
#up-popups .schoolsFacebox.facebox-content a:last-child > div {
    border-bottom: 0;
    padding-bottom: 2px
}
#up-popups .schoolsFacebox.facebox-content + .footer span {
    font-size: 15px;
    margin: 2px 12px 3px
}

/* All multiselect dropdowns */
body:not(.portal):not(.edu2) #up-popups .facebox-content .multiSelectOptions label {width: auto !important; display: inline-block; margin: 0; overflow: hidden; text-overflow: ellipsis; vertical-align: bottom; font-size: 15px}

/* Add report */
#report_form .multiSelectOptions {min-width: 198px; max-width: 500px; width: auto !important}
@media screen and (max-width: 650px) {
    #report_form .multiSelectOptions {max-width: calc(100% - 20px)}
}

/* Add report widget */
.select_report_popup {margin-bottom: 5px; line-height: 1.7}

/* Toggle Expand / Contract */
a.toggleForm {
    display: inline-block;
    width: 100%;
    text-align: center;
    position: relative
}
a.toggleForm:before {
    border-top: 1px solid #C6C5C5;
    content: "";
    left: 0; top: 50%;
    position: absolute;
    width: 99%
}
a.toggleForm span {
    display: inline-block;
    background: #fff;
    position: relative;
    padding: 0 20px
}
a.toggleForm i {
    margin-top: -4px
}
#remaining_toggleForm {
    display: none
}
/* Help Centre */

#up-popups .popup.help_centre {
    max-width: 95%;
    width: 70%;
    height: 90%;
}

#up-popups .facebox-content.help_centre {
    background: var(--content-bg-color);
}

#up-popups .help_centre ul.helpList li {
    background: var(--bg-color);
    padding: 20px;
    margin-bottom: 5px;
    border-radius: var(--main-border-r);
    border: 1px solid var(--bg-color);
}

#up-popups .help_centre ul.helpList li:hover{
    border-color:var(--active-color);
}

#up-popups .help_centre .helpList .hc-topic-icon-title a {
    font-size: 18px;
    font-size: 14px;
    font-weight: 600;
    color: var(--main-text-color);
}

#up-popups .help_centre .hc-topic-icon-title i {
    margin-top: 0px;
}

#up-popups .help_centre .hc-topic-description {
    padding-left: 24px;
    overflow: hidden;
    font-size: 13px;
    font-weight: 400;
}

#up-popups .help_centre .help_centre_content h2{
    color: var(--active-color);
}

#up-popups .help_centre #hc_content_selector{
    height: 100% !important;
}

#up-popups .help_centre .help_centre_content {
    margin: 0;
    overflow-y: scroll;
}

#up-popups .help_centre div#popup_help_center_overview {
    height: 100% !important;
}

#up-popups .help_centre {
    width: 940px
}

#up-popups .help_centre .hc-topic-icon-title {
    margin-bottom: 0
}

#up-popups .help_centre .hc-topic-icon-title i {
    margin-top: 0px;
}

#up-popups .help_centre .hc-topic-icon-title a {
    font-size: 18px
}

#up-popups .help_centre ul.helpLis .hc-topic-icon-title i{
    line-height:14px;
}

#up-popups .help_centre ul.inlineList.helpList {
    margin: 0px 10px;
}

#up-popups .help_centre form.search-form {
    margin: 0 17px .7rem 0 !important;
}

#up-popups .facebox-content.help_centre {
    min-height: 600px;
    overflow: hidden;
}

#up-popups .help_centre form.search-form input[type="text"] {
    width: 145px
}

#up-popups .help_centre .help_centre_heading {
    padding: 13px 17px;
    margin-top: 40px;
}

#up-popups .help_centre .hc-topic-icon-title i{
    height:20px;
}

#up-popups .help_centre .optionsRibbon ul li {
    padding: 0px 5px;
}


#up-popups .help_centre .help_centre_content.help_overview {
    margin-bottom:13px;
    margin-top:0px;
    padding: 0 17px 5px
}

#up-popups .help_centre .help_centre_content .optionsRibbon {
    margin-left: -2px;
    display: inline-block
}

#up-popups .help_centre .help_centre_content .hc-edit {
    text-align: left !important;
    width: 99.5%
}

#up-popups .help_centre .help_centre_heading h1 {
    font-weight: 600;
}


#up-popups .popup.help_centre #helpTabs {
    overflow-y: hidden !important;
    margin-bottom: 10px;
    text-align: center;
    flex-shrink: 0;
}

@media screen and (max-width: 768px) {
    #up-popups .popup.help_centre #helpTabs {
        padding-bottom: 3.5rem;
    }
}

#up-popups .facebox-content.help_centre{
    box-shadow: none;
    background-color: var(--content-bg-color);
    display: flex !important;
    flex-direction: column;
    min-height: 500px;
    overflow: hidden;
    height: 100% !important;
    border-radius: var(--main-border-r);
    padding-top: 1rem;
}

#up-popups .help_centre .contentBlock .sideText h3:first-child {
    line-height: 1.1;
    margin-bottom: 5px;
    color: var(--main-text-color);
    font-weight: 600;
    font-size: 15px;
    margin-top: 0px;
}


#up-popups .help_centre .help_centre_content{
    margin-top: 10px;
    width: 100%;
}

#up-popups .help_centre .help_centre_content, #up-popups .help_centre .help_centre_heading{
    background-color: var(--bg-color);
}

#up-popups .help_centre .help_centre_content{
    border-radius: 0 0 20px 20px;
}

#up-popups .help_centre .help_centre_heading{
    border-radius: 20px 20px 0 0;
}

#up-popups .help_centre .contentBlock .sideText h3:first-child {
    line-height: 1.1;
    margin-bottom: 5px;
    color: var(--main-text-color);
    font-weight: 600;
    font-size: 15px;
}

#up-popups .contentBlock .sideText .hc-limit-lines {
    max-height: 48px;
    overflow: hidden;
    font-size: 13px;
    line-height: 16px;
}


#up-popups .help_centre .contentBlock {
    border-radius: var(--main-border-r);
    transition: all .4s ease-in-out;
    background:var(--bg-color);
    border:1px solid var(--bg-color);
}

#up-popups .help_centre form.search-form input{
    background: var(--bg-color);
}

#up-popups .help_centre .contentBlock:hover{
    background:var(--bg-color);
    border-color: var(--active-color);
}

#up-popups .help_centre #popup_help_center_overview,
#up-popups .help_centre #popup_help_center_general,
#up-popups .help_centre #popup_help_center_teachers,
#up-popups .help_centre #popup_help_center_students,
#up-popups .help_centre #popup_help_center_assistants,
#up-popups .help_centre #popup_help_center_managers,
#up-popups .help_centre #popup_help_center_parents,
#up-popups .help_centre #popup_help_center_developers,
#up-popups .help_centre #popup_help_center_administrators{
    background-color: transparent;
}
/* Help Centre */
#up-popups .help_centre {overflow: hidden}
#up-popups .help_centre .help_center_flex {display: flex; flex-flow: row wrap; justify-content: space-between}
#up-popups .help_centre .contentBlock {box-shadow:var(--box-shadow); width: 48.7%; margin-bottom: 10px; float: none; display: flex; align-items: center; border: 1px solid #e2e0e0; border: 1px solid var(--table-border-color); border-radius: 15px; transition: all .4s ease-in-out}
#up-popups .help_centre .contentBlock:hover {box-shadow: var(--box-shadow-hover); border-color: #dfdfdf; border-color: var(--main-border-color)}
#up-popups .help_centre .contentBlock:nth-child(1), #up-popups .help_centre .contentBlock:nth-child(2) {margin-top: 10px}
#up-popups .help_centre .contentBlock .sideImg img {vertical-align: bottom}
#up-popups .help_centre .contentBlock .sideText *:first-child {line-height: 1.1; margin-bottom: 5px}

#up-popups .help_centre form {text-align: right; padding-bottom: 12px}
#up-popups .help_centre form.search-form input[type="text"] {width: 261px; height: 29px; margin: 0; padding: 3px 5px 2px; border-radius: 3px 0 0 3px}
#up-popups .help_centre form.search-form button:not(.not-btn) {margin: 0 0 0 -4px; border-radius: 0 3px 3px 0; height: 29px; vertical-align: top; position: relative}
#up-popups .help_centre form.search-form button i {margin-top: -3px}
#up-popups .help_centre img.screenshot {float: none !important; border: 1px solid #cccccc; display: block; margin: 0 auto !important; box-shadow: none}

#up-popups .help_centre .optionsRibbon {width: auto; left: 3px; top: 0}
#up-popups .help_centre .optionsRibbon.mr0 {margin: 0}
#up-popups .help_centre .optionsRibbon + .clearfix.mobile_only {display: none}
#up-popups .facebox-content.help_centre .optionsRibbon i {
    height: 15px;
    line-height: 15px;
}
#up-popups .facebox-content.help_centre .optionsRibbon i:after{
    color: var(--main-text-color);
}
#up-popups .help_centre .help_centre_content {margin:0}
#up-popups:not(.portal):not(.edu2) .help_centre .help_centre_content p {padding-right: 8px; width: 100%; box-sizing: border-box}
#up-popups .help_centre .help_centre_content h2 span[style*="color"] {color: var(--link-hover-text-color) !important; font-size: 22px !important}/*overwrite inline colour for now*/
#up-popups .help_centre .help_centre_content p:last-child {margin-bottom: 0}
#up-popups .help_centre .help_centre_content code {font-family: inherit}

#up-popups .help_centre .search-item {margin-top: 0}
#up-popups .help_centre .search-description {margin-bottom: 20px}
#up-popups .hc-topic-icon-title {width: 100%; overflow: hidden}

#up-popups .help_centre .help_centre_content h3{
    color: var(--main-text-color);
    font-weight:600;
    margin-top:10px;
}

#up-popups .help_centre .help_centre_content {
    padding: 13px 17px;
    overflow-y: scroll;
}

/* --------- Fix for the Add Class for existing scroll click bug -------- */
.facebox-content .search-item {position: relative}
.facebox-content h2 + .search-item {margin-top: 10px}

.preview-game-badge div {display: inline-block; margin-top: 8px; margin-bottom: 8px; padding: 5px; border: 1px solid #C6C5C5}

/* --------- Wizard -------- */
#up-popups .wizard_wrapper {padding: 0; margin-bottom: -5px; border-radius: 0 0 8px 8px; overflow: hidden}
.wizard_wrapper {display: flex}
.wizard_nav {padding: 10px; width: 150px; background-color: #f5f5f5; flex-shrink: 0}
.wizard_nav button {font-size: 15px}
.wizard_nav button:focus:enabled, .wizard_nav button:hover:enabled {box-shadow: none; opacity: 1}
.wizard_nav button i {margin: 0 5px 0 0}
.wizard_nav button.selected, .wizard_nav button:hover:enabled {color: #fff}
.wizard_nav button.selected i:after, .wizard_nav button:hover:enabled i:after {left: -40px}
.wizard_content {flex: 1; padding: 20px 17px 17px; box-sizing: border-box}
.wizard_content .flex_container {display: flex; flex-direction: column; height: 100%}
.wizard_content[aria-hidden="true"] {display: none}
.wizard_content h3 {font-size: 18px; margin-bottom: 15px}
.wizard_content form .wizard_row {margin-bottom: 20px; width: 100%}
.wizard_content form select, .wizard_content form textarea, .wizard_content form label, .wizard_content form input {margin: 0}
.wizard_content form label {clear: both; margin-bottom: 4px; width: 100% !important}
.wizard_content form label + p {margin-top: 0}
.wizard_content form select {width: 100% !important}
.wizard_content form p, .wizard_content form fieldset label {font-size: 15px}
.wizard_content form input {width: 100% !important}
.wizard_content form a.link_button i {margin-top: -2px}
.wizard_content form .required {font-size: 14px}
.wizard_content form .required i {width: auto; height: auto; overflow: visible !important}
.wizard_content form .required i:after {display: none}
@media screen and (max-width: 600px) {
    .wizard_wrapper {flex-direction: column}
    .wizard_nav {width: 100%}
    .wizard_nav a {display: inline-block}
}

.get_started_wizard {width: 900px; max-width: 100%; height: 490px; overflow: auto}
.get_started_wizard .wizard_nav {box-sizing: border-box; position: relative; display: flex}
.get_started_wizard .wizard_nav:before {position: absolute; content: ''; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(rgba(0,0,0,0.2) 20%, rgba(0,0,0,0) 90%)}
.get_started_wizard .wizard_nav button {background-color: #3d464e; position: relative; border-radius: 6px; margin: 3px 0 7px; padding: 0 11px; transition: all .3s ease; min-height: 34px}
.get_started_wizard .wizard_nav button span {display: flex; align-items: center; justify-content: space-between}
.get_started_wizard .wizard_nav button .wizard-menu-number {display: none}
.get_started_wizard .wizard_nav button .wizard-menu-text {white-space: nowrap; overflow: hidden;}
.get_started_wizard .wizard_nav button:not(.selected):not(.completed) span {color: #fff}
.get_started_wizard .wizard_nav button:not(.selected):not(.completed):hover:enabled span,
.get_started_wizard .wizard_nav button:not(.selected):not(.completed):focus:enabled span {color: #222}
.get_started_wizard .wizard_nav button i {display: none; margin: 0 -3px 0 5px}
.get_started_wizard .wizard_nav button.selected + button i {display: none}
.get_started_wizard .wizard_nav button.selected i.forward,
.get_started_wizard .wizard_nav button.completed:not(.selected) i.tickCircle {display: block}
.get_started_wizard .wizard_nav button.selected i.forward:after,
.get_started_wizard .wizard_nav button.completed:not(.selected) i.tickCircle:after {left: 0}
.get_started_wizard .wizard_nav button.selected,
.get_started_wizard .wizard_nav button.completed,
.get_started_wizard .wizard_nav button:hover:enabled,
.get_started_wizard .wizard_nav button:focus:enabled {background-color: #fff; background-image: none; color: #222}

.get_started_wizard form {display: flex; flex-direction: column; height: 100%; overflow: auto}
.get_started_wizard .scroll {display: flex; flex-wrap: wrap; overflow: auto; width: 100%; padding: 0 3px; box-sizing: border-box}
.no-touch .get_started_wizard .scroll::-webkit-scrollbar {-webkit-appearance: none; width: 5px; height: 20px}
.no-touch .get_started_wizard .scroll::-webkit-scrollbar-thumb {border-radius: 4px; background-color: rgba(0, 0, 0, .5); -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5)}
.get_started_wizard .setup_language > * > div {width: 100%; height: 31px; position: relative}
.get_started_wizard .setup_language img {margin: 7px 0 0 23px !important; position: absolute; width: 16px}
.get_started_wizard .setup_language input[type="radio"] + label:before {margin-right: 28px}
.get_started_wizard .setup_language label {font-size: 15px}
.get_started_wizard input[type='radio'] + label {position: relative; z-index: 1}
.get_started_wizard .theme_list > div {height: 34px; position: relative}
.get_started_wizard .theme_list > div div {width: 80px; height: 20px; border-radius: 20px; margin: 1px 0 0 23px !important; position: absolute; border: 1px solid #e2e0e0; border: 1px solid var(--table-border-color)}
.get_started_wizard .theme_neo div {background: linear-gradient(90deg, #B54376, #B54376 25%, #5E656B 25%, #5E656B 50%, #378A98 50%, #378A98 75%, #5FB4B7 75%)}
.get_started_wizard .theme_matrix div {background: linear-gradient(90deg, #02bfae, #02bfae 25%, #3a5268 25%, #3a5268 50%, #4394d0 50%, #4394d0 75%, #2e75a9 75%)}
.get_started_wizard .theme_indie div {background: linear-gradient(90deg, #519286, #519286 25%, #58ad9d 25%, #58ad9d 50%, #6161A0 50%, #6161A0 75%, #293546 75%)}
.get_started_wizard .theme_1 div {background: linear-gradient(90deg, #fca538, #fca538 25%, #d96436 25%, #d96436 50%, #3d577d 50%, #3d577d 75%, #666679 75%)}
.get_started_wizard .theme_2 div {background: linear-gradient(90deg, #fca538, #fca538 25%, #d96436 25%, #d96436 50%, #3d577d 50%, #3d577d 75%, #fff 75%)}
.get_started_wizard .theme_3 div {background: linear-gradient(90deg, #569a96, #569a96 25%, #64cac2 25%, #64cac2 50%, #CA6760 50%, #CA6760 75%, #515a63 75%)}
.get_started_wizard .theme_4 div {background: linear-gradient(90deg, #2a7fd4, #2a7fd4 25%, #2d89e6 25%, #2d89e6 50%, #579125 50%, #579125 75%, #fff 75%)}
.get_started_wizard .theme_5 div {background: linear-gradient(90deg, #12a8d9, #12a8d9 25%, #f78e1e 25%, #f78e1e 50%, #a9bd29 50%, #a9bd29 75%, #e20177 75%)}
.get_started_wizard .theme_6 div {background: linear-gradient(90deg, #2ac09e, #2ac09e 25%, #ef6268 25%, #ef6268 50%, #45617d 50%, #45617d 75%, #517494 75%)}
.get_started_wizard .theme_7 div {background: linear-gradient(90deg, #2ac09e, #2ac09e 25%, #ef6268 25%, #ef6268 50%, #45617d 50%, #45617d 75%, #fff 75%)}
.get_started_wizard .theme_8 div {background: linear-gradient(90deg, #5b87a4, #5b87a4 25%, #a3d5f6 25%, #a3d5f6 50%, #3b996c 50%, #3b996c 75%, #505861 75%)}
.get_started_wizard .theme_9 div {background: linear-gradient(90deg, #5b636b, #5b636b 25%, #3e464e 25%, #3e464e 50%, #3a919e 50%, #3a919e 75%, #57b3bb 75%)}
.get_started_wizard .theme_10 div {background: linear-gradient(90deg, #428769, #428769 25%, #505050 25%, #505050 50%, #327d86 50%, #327d86 75%, #408e94 75%)}
.get_started_wizard .theme_11 div {background: linear-gradient(90deg, #5eb34c, #5eb34c 25%, #545253 25%, #545253 50%, #3E95C1 50%, #3E95C1 75%, #fff 75%)}
.get_started_wizard .theme_12 div {background: linear-gradient(90deg, #6161a0, #6161a0 25%, #3b3b46 25%, #3b3b46 50%, #519286 50%, #519286 75%, #58ad9d 75%)}
.get_started_wizard .theme_13 div {background: linear-gradient(90deg, #6161a0, #6161a0 25%, #3b3b46 25%, #3b3b46 50%, #519286 50%, #519286 75%, #fff 75%)}
.get_started_wizard .theme_14 div {background: linear-gradient(90deg, #1d8c7a, #1d8c7a 25%, #55b9a5 25%, #55b9a5 50%, #fba231 50%, #fba231 75%, #f18a2f 75%)}
.get_started_wizard .theme_15 div {background: linear-gradient(90deg, #02bfae, #02bfae 25%, #3a5268 25%, #3a5268 50%, #4394d0 50%, #4394d0 75%, #2e75a9 75%)}
.get_started_wizard .theme_16 div {background: linear-gradient(90deg, #02bfae, #02bfae 25%, #3a5268 25%, #3a5268 50%, #4394d0 50%, #4394d0 75%, #fff 75%)}
.get_started_wizard .theme_list > div input[type="radio"] + label:before {margin-right: 100px}
.get_started_wizard .theme_list > div .btn_tooltip i {margin-top: -4px}
.get_started_wizard .theme_list > div .btn_tooltip .tooltip_content {left: 0}
.get_started_wizard fieldset div {position: relative; margin: 4px 8px}
.get_started_wizard fieldset label {padding-left: 25px; width: auto !important}
.get_started_wizard fieldset input[type="checkbox"] + label:before {position: absolute; top: 1px; left: 0}
.get_started_wizard .info_indent {display: flex; margin: 20px 0}
.get_started_wizard .info_indent i {flex-shrink: 0}
.get_started_wizard .info_indent div {font-size: 14px; color: #707070; color: var(--dark-grey-text-color)}
.get_started_wizard .wizard_image_demo {overflow: hidden; width: 100%}
.get_started_wizard #UploaderWrapper {width: calc(100% - 11px)}
.get_started_wizard .wizard_complete {position: relative; max-width: 460px; margin: auto}
.get_started_wizard .wizard_complete div {position: absolute; top: 30%; width: 100%; height: 16%; display: flex; align-items: center; justify-content: center}
.get_started_wizard .wizard_complete div h3 {color: #fff; margin: 0; font-size: 33px}
.get_started_wizard .wizard_complete ~ strong {font-size: 19px}
.get_started_wizard .wizard_footer {display: flex; justify-content: space-between; align-items: center; margin-top: auto; padding: 15px 3px 3px}
.get_started_wizard .wizard_footer > *[excalibur-click] {margin: 0}
.get_started_wizard .wizard_footer > *[excalibur-click] i {margin: -3px -6px 0 0}
.get_started_wizard .wizard_footer > *[excalibur-click] i.arrowLeft {margin: -3px 0 0 -6px}
.get_started_wizard .wizard_footer > *:only-child {margin-left: auto}
@media screen and (min-width: 980px) {
    .get_started_wizard .setup_language > * > div {width: 33%}
    .get_started_wizard .theme_list {columns: 2; width: 100%}
}
@media screen and (max-width: 900px) {
    .get_started_wizard .wizard_complete div h3 {font-size: 28px}
}
@media screen and (max-width: 750px) {
    .get_started_wizard .wizard_complete div h3 {font-size: 4vw}
}
@media screen and (min-width: 601px) {
    .get_started_wizard .wizard_nav {padding: 20px; width: 250px; background: no-repeat 50% bottom/cover #02BFAE url('/images/wizard/left-menu-shapes.svg'); background-color: var(--left-bar-bg); flex-direction: column}
    .get_started_wizard .wizard_nav_img {width: 100%; height: 100%; max-height: 170px; background: no-repeat center/contain; margin: 20px 0}
    .get_started_wizard #panel1.selected ~ .wizard_nav_img {background-image: url('/images/wizard/select-your-language.svg')}
    .get_started_wizard #panel2.selected ~ .wizard_nav_img {background-image: url('/images/wizard/about-yourself.svg')}
    .get_started_wizard #panel3.selected ~ .wizard_nav_img {background-image: url('/images/wizard/about-organization.svg')}
    .get_started_wizard #panel4.selected ~ .wizard_nav_img {background-image: url('/images/wizard/select-theme.svg')}
    .get_started_wizard #panel5.selected ~ .wizard_nav_img {background-image: url('/images/wizard/upload-logo.svg')}

    .wizard_content form .wizard_row.wizard_row_2_col {display: flex; justify-content: space-between}
    .wizard_content form .wizard_row.wizard_row_2_col > div {width: calc(50% - 10px)}
    .get_started_wizard .setup_language > * > div {width: 50%}
}
@media screen and (max-width: 600px) {
    .get_started_wizard .wizard_nav {width: 100%; justify-content: space-between; padding: 10px 15px; background: #02BFAE; background: var(--header-bg-color)}
    .get_started_wizard .wizard_nav:after {content: ''; top: 50%; left: 20px; right: 20px; height: 1px; background: rgba(255,255,255,.4); position: absolute; z-index: 0; margin-top: -1px}
    .get_started_wizard .wizard_nav button {width: 34px; box-sizing: border-box; border-radius: 50%; flex-shrink: 0; z-index: 1; margin: 3px 0}
    .get_started_wizard .wizard_nav button:disabled {opacity: 1}
    .get_started_wizard .wizard_nav button:disabled span {opacity: .5}
    .get_started_wizard .wizard_nav button span:first-child {display: flex; height: 100%; justify-content: center}
    .get_started_wizard .wizard_nav button span:last-child,
    .get_started_wizard .wizard_nav_img {display: none}

    .get_started_wizard .wizard_content {max-height: calc(100% - 60px)}
    .wizard_content form .wizard_row.wizard_row_2_col div:not(:last-child) {margin-bottom: 20px}
    .get_started_wizard .wizard_complete div h3 {font-size: 6vw}
}

/* ------------------------ Badge creator ------------------------- */
body.evo #up-popups .popup:has(#badge_form) {
    width: 900px !important;
    max-width: 900px !important;
}
body.evo #up-popups #badge_form .badge_tabnav {
    margin-left: -15px;
}
body.evo #up-popups #badge_form .badge_tabnav li > a {
    margin: 0px !important;
}
body.evo #up-popups #badge_form .badge_tabnav .width-wrap {
    box-shadow: none !important;
}
#up-popups #badge_form > div {position: relative}
#up-popups #badge_form .tabnav li a {margin: 0 6px 1px}
#up-popups #badge_form .tabnav li:first-child a {margin-left: 0}
#up-popups .badgeWrapper {min-height: 270px; margin-top: 20px}
#up-popups .badgeWrapper > p {
    height: 22px;
    text-align: center;
    padding: 0 0 10px 0 !important;
    margin-bottom: 0;
    border-bottom: 1px solid #e2e0e0; border-bottom: 1px solid var(--table-border-color)
}
.badgeHolder {width: 220px; height: 240px; position: relative; padding: 10px 0 0 0; margin: auto}
.badgeHolder .finalMessage {margin: 220px 0 0 0}
.badgeHolder > div:not(.finalMessage), .badgeHolder .finalBanner p, .badgeHolder .finalBanner img, .badgeHolder .finalBanner div {
    position: absolute;
    width: 220px
}
.badgeHolder .finalBanner p {
    font-family: Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    text-align: center;
    top: 170px;
    font-size: 15px;
    z-index: 3;
    padding: 5px 0 !important
}
.badgeHolder .finalBanner img {z-index: 2; width: auto}
.badgeHolder .finalBanner div {z-index: 1}
#up-popups .badgeHolder .finalMessage p {
    height: 155px;
    padding: 0 15px;
    margin: 15px 0 0;
    overflow: auto
}
.badgeOptions:not(.badgeOverview) {display: none}
.badgeOptions .owl-item {text-align: center}
.badgeOptions .owl-item a {display: inline-block; width: 90px; height: 90px; border-radius: 6px; overflow: hidden}
.badgeOptions .owl-item a img {width: 100%}
#up-popups .badgeImages .owl-item a img {width: 126px; height: 126px; margin: -16px 0 0 -19px}
#up-popups .badgeImages .badgeImages_btn_holder {display: flex; justify-content: center; align-items: center; padding: 5px 15px 0; text-align: center}
#up-popups .badgeImages .badgeImages_btn_holder input {margin-top: 0; width: auto !important}
#up-popups .badgeGallery .owl-item a img {width: 70px; height: 70px; margin: 10px 0 0 -3px}
#up-popups .badgeGallery .owl-buttons {margin-top: 5px}
.badgeOptions .owl-theme .owl-controls .owl-buttons div {border-radius: 3px; border: 1px solid #c8c8c8; background-color: transparent; padding: 5px 9px 5px 10px; opacity: 1}
.badgeOptions .owl-theme .owl-controls .owl-buttons div:hover i:after {left: -20px}
.badgeColors input {width: 200px; padding: 4px 5px 5px}
#up-popups .facebox-content .badgeText textarea {height: 123px; resize: none}
#up-popups .facebox-content .badgeLibraryCheckboxes p {line-height: 2}
#up-popups .facebox-content .badgeColors label {width: 130px}
#up-popups .facebox-content .badgeColors .color_recommendations input {color: #fff; width: 46.5% !important; margin-bottom: 5px}
@media screen and (min-width: 980px) {
    #up-popups .facebox-content .badgeColors .color_recommendations > *:first-child {width: 148px}
}

/* ------------------------ Assignment popup form------------------------- */
#up-popups .assignment_pop .toggleForm {display: block; margin-top: -5px; margin-bottom: 3px}
#up-popups .assignment_pop label, #up-popups .assignment_pop legend {width: auto}
#up-popups .assignment_pop .title_container label,
#up-popups .assignment_pop label.min-w-80,
#up-popups .assignment_pop legend.min-w-80 {min-width: 80px}
#up-popups .assignment_pop label.min-w-76,
#up-popups .assignment_pop legend.min-w-76 {min-width: 76px}
#up-popups .assignment_pop #assignment_name {width: 688px; margin-right: 0}
#up-popups .assignment_pop span.max-info {margin-right: 21px}
#up-popups .assignment_pop #timer input {padding: 0px 5px}
#up-popups .assignment_pop .modal-textarea p {padding: 0; margin: 0 0 5px}
#up-popups .class_pop hr, #up-popups .assignment_pop hr {display: block; height: 1px; border: 0; border-top: 1px dashed #C6C5C5; padding: 0; margin-bottom: 0}
#up-popups .class_pop hr {margin-bottom: 8px}
input#randomize + label {min-width: 20px !important}
#up-popups .assignment_pop #assignment_width, #up-popups .assignment_pop #assignment_height {width: 100px}
#up-popups .assignment_pop label[for*="items_to_sync_"] {width: 200px !important}
#up-popups .assignment_pop input#assignment_gateway {width: 20px}
#up-popups .assignment_pop .col-2 > * {vertical-align: top; margin: 0; user-select: none}
#up-popups .assignment_pop .col-2 > * > *:first-child {margin-bottom: 5px}
#up-popups .assignment_pop .col-2 > * > label:not(:first-child) {margin: 0 14px 5px 0}

#up-popups table.attendance span {display: none}

#up-popups .oneLine {clear: both; margin-top: 15px}
#up-popups .oneLine p {display: inline-block; margin-top: 0}

/* ----------------- Minor tweak for the Import Qty/Ccf popup ----------------- */
#UploadCCF {
    min-width: 0 !important
}
#UploadCCF .optionsRibbon, #UploadQTI .optionsRibbon {
    width: 99%!important;
    margin: 0 auto;
    display: block;
    height: auto
}

/* ----------------- Language Selection Form ----------------- */
#up-popups form.langForm .facebox-content {padding-left: 15px; padding-right: 15px}
#up-popups form.langForm .facebox-content div {padding: 4px 0; height: 24px; position: relative}
#up-popups form.langForm .facebox-content img {margin: 7px 0 0 22px; position: absolute; width: 16px}
#up-popups form.langForm .facebox-content input[type="radio"] + label:before {margin-right: 28px}

/* ----------------- New Tool Provider select overwrite default 180px width ----------------- */
.tp-select-facebox {width: auto}

/* ----------------- People Picker ----------------- */
#up-popups .section-intro {padding: 0 10px; overflow: hidden}
#up-popups .section-intro .contentBlock {margin-bottom: 10px}
#up-popups .section-intro .contentBlock .sideText p {width: auto}
#up-popups .section-intro .contentBlock .sideText p.number {line-height: 1.3; width: 30px; margin-top: -15px !important}
#up-popups .section-intro .contentBlock .sideText p:not(.number) {padding-left: 50px;}
#up-popups .section-intro .contentBlock .sideImg {margin-bottom: 4px}
#up-popups .section-intro .contentBlock .sideImg img {border: 1px solid #c7c7c7}

#up-popups #PeoplePicker .pp_filter {display: flex}
#up-popups #PeoplePicker .pp_filter input, #up-popups #PeoplePicker .pp_filter select {width: calc(100% - 5px) !important; margin-right: 5px}
#up-popups #PeoplePicker .pp_filter input, #up-popups #PeoplePicker .pp_filter select {
    font-size: 12px;
    color: var(--main-text-color) !important;
}

#up-popups #PeoplePicker .pp_filter .select2-container-multi .select2-choices{
    min-height: 33px !important;
    background-color: var(--input-bg) !important;
}
#up-popups #PeoplePicker .pp_filter input#name {
    min-height: 33px;
}

#up-popups #PeoplePicker .pp_filter .select2-container-multi .select2-choices .select2-search-choice {
    font-size: 11px;
    font-weight: 400;
    border-radius: 5px;
    margin: 3px;
}


#up-popups #PeoplePicker p.search-navigation>span,
#up-popups #PeoplePicker p.search-navigation>a{
    margin-bottom: 5px;
    display: inline-block;
    font-size: 12px;
    width: 30px;
    height: 30px;
    line-height: 18px;
    padding: 5px;
    text-align: center;
    vertical-align: middle;
    color: var(--button-color-2);
}

#up-popups #PeoplePicker p.search-navigation>a.next {
    border: 0px;
    box-shadow: none;
    margin-bottom:0px;
}

#up-popups #PeoplePicker .pp_filter .select2-result-label {
    font-size: 12px;
    font-weight: 400;
}

#up-popups #PeoplePicker p.search-navigation>a.previous {
    width: 60px;
}

#up-popups #PeoplePicker .pp_filter .pp_name {margin-bottom: 10px}
#up-popups #PeoplePicker .pp_filter select {padding-top: 3px}
#up-popups #PeoplePicker .select2-container {flex: 1; margin: 0 5px 10px 0; align-self: flex-start}
#up-popups #PeoplePicker .select2-container:last-of-type {margin-right: 0}
#up-popups #PeoplePicker .select2-container .select2-choices {border-radius: 3px}
#up-popups #PeoplePicker .tabnav {display: none}
#up-popups #PeoplePicker .tab-content {width: 50%; float: left}
#up-popups #PeoplePicker .tab-content .half {width: 100%; position: relative; min-height: 430px}
#up-popups #PeoplePicker .half.left {float: left}
#up-popups #PeoplePicker .half.right {float: right}
#up-popups #PeoplePicker .half#people_selected {overflow: hidden}
#up-popups #PeoplePicker .people_scroller {overflow: auto}
#up-popups #PeoplePicker .half.right .search-navigation {padding: 5px}
#up-popups #PeoplePicker .search-navigation {margin-top: 5px; margin-bottom: 0}
#up-popups #PeoplePicker table {width: 100%;margin: 0;border: none !important;padding: 0px;background:transparent;}
#up-popups #PeoplePicker table td {border-width: 0 0 1px 0}
#up-popups #PeoplePicker table th.title_column {width: 409px}
#up-popups #PeoplePicker .table-header table {width: 100%; border-bottom: 1px solid #e2e0e0; border-bottom: 1px solid var(--table-border-color)}

body.evo #up-popups #PeoplePicker table tr.highlight td {
    background: var(--table-selected) !important;
}
#up-popups #PeoplePicker table td {
    border-width: 0 0 1px 0;
    background: transparent !important;
}

#up-popups #PeoplePicker .pp_filter input,
#up-popups #PeoplePicker .pp_filter select{
    border-color:var(--main-border-color) !important;
}

#up-popups .messageSendPopup .select2-choices a.select2-search-choice-close {
    display: inline-block;
    position: absolute;
    top: 0;
    margin-left: 10px;
}

body.evo .replyPopup.biggerHeight {
    height: auto !important;
}

@media screen and (max-width: 996px) {
    #up-popups #PeoplePicker {min-width: 740px}
    #up-popups #PeoplePicker .select2-container input {margin: 1px 0}
}
@media screen and (min-width: 769px) {
    #up-popups #PeoplePicker .tab-content.first {border-right: 1px solid #e2e0e0; border-right: 1px solid var(--table-border-color); box-sizing: border-box}
}
@media screen and (max-width: 768px) {
    #up-popups #PeoplePicker {min-width: 0px}
    #up-popups #PeoplePicker .pp_filter {display: block}
    #up-popups #PeoplePicker .pp_filter span {float: left; width: 50%; margin-bottom: 10px}
    #up-popups #PeoplePicker .tabnav {display: block}
    #up-popups #PeoplePicker .half {min-height: 0}
    #up-popups #PeoplePicker:not(.transfer_seats) table th:last-child {padding: 0}
    #up-popups #PeoplePicker table th.title_column {width: auto}
    #up-popups #PeoplePicker .tab-content {width: 100%; float: left}
    #up-popups #PeoplePicker .tab-content.first {border-right: 0 none}
    #up-popups #PeoplePicker .tab-content.second {display: none}
    #up-popups #PeoplePicker .search-navigation {margin-top: 10px}
    #up-popups #PeoplePicker .search-navigation a {margin: 0 5px}
    #up-popups{height: 100% !important;width: 100% !important;}
    #up-popups .facebox-content{/* height: 100% !important; */width: 100% !important; max-height: 100%;}
}

/* Transfer seats */
#up-popups #PeoplePicker.transfer_seats .transfer_quantity select {width: 50px !important; margin-right: 0}
@media screen and (min-width: 768px) {
    #up-popups #PeoplePicker.transfer_seats .tabs-extra-class span {margin-bottom: 10px}
}
@media screen and (min-width: 980px) {
    #up-popups #PeoplePicker.transfer_seats {min-width: 796px}
}

/* Proficiency Picker */
#up-popups #ProficiencyPicker {min-width: 980px; height: auto; max-height: none}
#up-popups #ProficiencyPicker .pp_filter {display: flex}
#up-popups #ProficiencyPicker .pp_filter input, #up-popups #ProficiencyPicker .pp_filter select {width: calc(100% - 5px) !important; margin-right: 5px}
#up-popups #ProficiencyPicker .pp_filter select {padding-top: 3px}
#up-popups #ProficiencyPicker .select2-container {flex: 1; margin: 0 5px 10px 0}
#up-popups #ProficiencyPicker .select2-container:last-of-type {margin-right: 0}
#up-popups #ProficiencyPicker .select2-container .select2-choices {border-radius: 3px}
#up-popups #ProficiencyPicker .tabnav {display: none}
#up-popups #ProficiencyPicker .tab-content {width: 50%; float: left}
#up-popups #ProficiencyPicker .tab-content .half {width: 100%; position: relative; min-height: 430px}
#up-popups #ProficiencyPicker .half.left {float: left}
#up-popups #ProficiencyPicker .half.right {float: right}
#up-popups #ProficiencyPicker .half#proficiency_selected {overflow: hidden}
#up-popups #ProficiencyPicker .proficiency_scroller {overflow: auto}
#up-popups #ProficiencyPicker .half.right .search-navigation {padding: 5px}
#up-popups #ProficiencyPicker .search-navigation {margin-top: 5px; margin-bottom: 0}
#up-popups #ProficiencyPicker table {width: 100%; margin: 0}
#up-popups #ProficiencyPicker table td {border-width: 0 0 1px 0}
#up-popups #ProficiencyPicker table th.title_column {width: 409px}
#up-popups #ProficiencyPicker .table-header table {width: 100%; border-bottom: 1px solid #e2e0e0; border-bottom: 1px solid var(--table-border-color)}

@media screen and (max-width: 996px) {
    #up-popups #ProficiencyPicker {min-width: 740px}
    #up-popups #ProficiencyPicker .select2-container input {margin: 1px 0}
}
@media screen and (min-width: 769px) {
    #up-popups #ProficiencyPicker .tab-content.first {border-right: 1px solid #e2e0e0; border-right: 1px solid var(--table-border-color); box-sizing: border-box}
}
@media screen and (max-width: 768px) {
    #up-popups #ProficiencyPicker {min-width: 0px}
    #up-popups #ProficiencyPicker .pp_filter {display: block}
    #up-popups #ProficiencyPicker .pp_filter span {float: left; width: 50%; margin-bottom: 10px}
    #up-popups #ProficiencyPicker .tabnav {display: block}
    #up-popups #ProficiencyPicker .half {min-height: 0}
    #up-popups #ProficiencyPicker:not(.transfer_seats) table th:last-child {padding: 0}
    #up-popups #ProficiencyPicker table th.title_column {width: auto}
    #up-popups #ProficiencyPicker .tab-content {width: 100%; float: left}
    #up-popups #ProficiencyPicker .tab-content.first {border-right: 0 none}
    #up-popups #ProficiencyPicker .tab-content.second {display: none}
    #up-popups #ProficiencyPicker .search-navigation {margin-top: 10px}
    #up-popups #ProficiencyPicker .search-navigation a {margin: 0 5px}
}

/* ----------------- Assignment three columns ----------------- */
#up-popups .columns-display {clear: both}
#up-popups .columns-display:before, #up-popups .columns-display:after {content: " "; display: table}
#up-popups .columns-display:after {clear: both}
#up-popups .columns-display br {display: none}
#up-popups .columns-display label, #up-popups .columns-display legend {width: 100%; margin: 0 0 2px; font-size: 14px}
#up-popups .columns-display select,
#up-popups .columns-display input,
#up-popups .columns-display textarea {width: 100%; margin-right: 0}
#up-popups .columns-display .title_container input {width: 100% !important; margin-right: 0}

#up-popups .columns-display .column {height: 135px; float: left; border-right: 1px solid #e2e0e0; border-right: 1px solid var(--table-border-color)}
#up-popups .columns-display .column.auto-height {height: auto}
#up-popups .columns-display .column > div {margin-bottom: 10px; height: 55px}
#up-popups .columns-display .column > div#duration {margin-bottom: 0; height: auto}
#up-popups .columns-display .column > div#duration > div {margin-bottom: 10px; height: 55px}
#up-popups .columns-display .column p {margin: 0; padding: 0}
#up-popups .columns-display .column div.half {width: 45%; margin-right: 5%; float: left}
#up-popups .class_pop .columns-display .column div.half:nth-child(2) {width: 45%; margin-right: 0%; margin-left: 4%; float: left}
#up-popups .columns-display .column div.half.max-submissions {width: 53%; margin-right: 4%; float: left}
#up-popups .columns-display .column div.half.max-submissions + div.half {width: 42%; margin-right: 0; float: left}

#up-popups .columns-display .column input + label {margin-top: 5px}
#up-popups .columns-display .column #threshold input {height: 27px}

#up-popups .columns-display .column div .half label {display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis}

#up-popups .columns-display .column.one input {width: 80px; margin-right: 0}
#up-popups .columns-display .column.one div:nth-child(2) p label {display: block; width: 100%}
#up-popups .columns-display .column.three input#assignment_begin_at,
#up-popups .columns-display .column.three input#assignment_end_at {
    width: 100%;
    min-width: -moz-available;          /* WebKit-based browsers will ignore this. */
    min-width: -webkit-fill-available;  /* Mozilla-based browsers will ignore this. */
}
#up-popups .columns-display .column.four div p {margin: 0; padding: 0}

#up-popups .columns-display .column.one {width: 27%; padding-right: 1.5%}
#up-popups .columns-display .column.two {width: 21%; padding-left: 1.5%; padding-right: 1.5%}
#up-popups .columns-display .column.three {width: 28%; padding-left: 1.5%; padding-right: 1.5%}
#up-popups .columns-display .column.four {width: 23%; padding-left: 1.5%; border-right: 0 none}

#up-popups .columns-display .column.indie {height: auto}
#up-popups .columns-display .column.one.cols1 {width: 100%; border: 0}

#up-popups .columns-display .column.one.cols2 {width: 46%; padding-right: 3.8%}
#up-popups .columns-display .column.two.cols2 {width: 46%; padding-left: 3.8%; padding-right: 0; border-right: 0 none}

#up-popups .columns-display .column.one.cols3 {width: 30%; padding-right: 3%}
#up-popups .columns-display .column.two.cols3 {width: 27%; padding-left: 3%; padding-right: 3%}
#up-popups .columns-display .column.two.cols2 input[type="text"].hasDatepicker,
#up-popups .columns-display .column.two.cols3 input[type="text"].hasDatepicker {width: 100%}
#up-popups .columns-display .column.three.cols3,
#up-popups .columns-display .column.four.cols3 {width: 30%; padding-left: 3%; padding-right: 0; border-right: 0 none}

#up-popups .columns-display + .modal-textarea p {font-size: 14px}

#up-popups .columns-display .group-name p,
#up-popups .columns-display .group-description p {padding-top: 0}
#up-popups .columns-display .group-description p {margin-bottom: 5px}
#up-popups .columns-display .group-name input,
#up-popups .columns-display .group-description textarea {width: 100%}

/* Feeds select */
#up-popups #multipost td {position: relative}
#up-popups #multipost td input[type="checkbox"] + label:before {position: absolute; top: 13px; left: 8px}

/* Gradebook popup */
#up-popups .gradebook_column_width input {width: auto !important}

#up-popups .grading-thread-comment-list {margin: 0 0 10px !important}
#up-popups .grading-thread-comment-list .comment .content {display: block}
#up-popups .grading-thread-comment-textarea {margin: 0 0 3px}
#up-popups .avatarHolder img.avatar {border-radius: 50%; border: 1px solid #e2e2e2}
#up-popups table.rubric tr td {font-size: 13px}

/* Google Fonts popup */
.fonts_holder .fonts_loading {text-align: center}
.fonts_holder .fonts_loading img {width: 100px}
.fonts_holder li {margin-bottom: 10px; border-top: 1px solid #e2e0e0; border-top: 1px solid var(--table-border-color); padding-top: 7px; position: relative}
.fonts_holder li span {display: block; margin: 5px 0 0 28px; font-size: 17px}
.fonts_holder li span.no-results {text-align: center}
#up-popups .fonts_holder li input[type="checkbox"] + label:before {top: 13px; position: absolute}
.google_fonts_top {position: relative}
.google_fonts_top span {position: absolute; top: 0; right: 0; z-index: 9}
#up-popups .facebox-content .google_fonts_top input[type="text"] {width: 200px}

#up-popups .facebox-content .people_picker_top {margin-bottom: 0}
#up-popups .facebox-content .people_picker_top #s2id_proficiency_picker_search {width: 100%}

@media only screen and (max-width: 459px) {
    #up-popups, #up-popups.popup, #up-popupsContent {width: 100%}

    .loginOptions {margin-bottom: 15px}
    .difSignIn {margin-left: -10px; margin-right: -10px; padding-left: 15px; padding-right: 15px}
    #up-popups .loginPopup {padding-bottom: 0}

    .badgeOptions {padding: 10px 0}
    .badgeOptions .owl-item a {width: 50px; height: 50px}
    #up-popups .badgeImages .owl-item a img {width: 70px; height: 70px; margin: -8px 0 0 -10px}
    #up-popups .badgeGallery .owl-item a img {width: 40px; height: 40px; margin: 5px 0 0 0}
    #up-popups div.facebox-resources-filter > p > * {width: 100% !important}
}
@media only screen and (min-width: 460px) {
    #up-popups .facebox-content, #up-popups div.error {width: 420px}
    #up-popups .help_centre .help_centre_content.help_overview {padding-right: 8px}

    /* Main Site */
    #up-popups form#signup_form .facebox-content, #up-popups .header.signup_form ~ #alerts, #up-popups .header.signup_form ~ div.error {width: 400px}
    #up-popups form#signup_form .facebox-content input#captcha {width: 310px}

    .owl-carousel .owl-wrapper-outer {padding-top: 10px}
    .badgeHolder {padding: 10px 15px 0}
    .badgeHolder .finalMessage {margin: 30px 0 0 250px}
    #up-popups .facebox-content .badgeOptions input:not([type*='radio']), #up-popups .facebox-content .badgeOptions textarea {width: 290px; margin-right: 0}

    #up-popups .row.col-2:not(.hide) {display: flex; flex-flow: nowrap; justify-content: space-between}
    #up-popups .row.col-2 > * {width: 48%}
    #up-popups .assignment_pop .row.col-2 > * {width: 48% !important}
}
@media only screen and (max-width: 479px) {
    /* People Picker */
    #up-popups .section-intro .contentBlock .sideText {margin-top: -123px}
    #up-popups .section-intro .contentBlock .sideText p.number {margin: 42px 0 60px 210px !important}
    #up-popups .section-intro .contentBlock .sideText p:not(.number) {padding: 0}
    /* Add Tool */
    #up-popups .tool_row .tool_img {width: 60px; padding: 2px; margin-top: -3px}
}
@media screen and (min-width: 560px) {
    /* Global */
    #up-popups .facebox-content, #up-popups #alerts, #up-popups div.error {width: 500px}
    #up-popups .loginPopup #alerts{width: auto}
    #up-popups .header h4 {font-size: 19px; max-width: 468px}
    #up-popups form.langForm .facebox-content div {width: 50%; float: left}
    #up-popups ul.tabnav li .dropDown {right: 5px}
    /* Logged In */
    #up-popups form#enroll_form .facebox-content, #up-popups form#group_join_form .facebox-content,
    #up-popups .header.access_code ~ #alerts, #up-popups .header.access_code ~ div.error {width: 342px}
    #up-popups .header.access_code h4 {width: 310px}
    #up-popups .facebox_share, #up-popups div.facebox-resources-filter {width: 500px}
}
@media screen and (min-width: 769px) {
    /* Global */
    #up-popups .facebox-content, #up-popups #alerts, #up-popups div.error, #up-popups div.facebox-resources-filter {width: 700px}
    #up-popups .loginPopup #alerts{width: auto}
    #up-popups .header h4 {max-width: 668px}
    #up-popups form.langForm .facebox-content div {width: 33%}
    #up-popups .sml_popup {width:600px}
    #up-popups .xsml_popup {width:400px !important}
    #up-popups .xl_popup, #up-popups .xxl_popup {width:700px}
    #up-popups .header.sml_popup h4 {width: 468px}
    #up-popups .header.xsml_popup h4 {width: 368px}
    /* Portal */
    #up-popups form#join_form .facebox-content, #up-popups .header.join_form ~ #alerts, #up-popups .header.join_form ~ div.error {width: 615px}
    /* Logged In */
    #up-popups form#class_list .facebox-content, #up-popups .header.class_list ~ #alerts, #up-popups .facebox-content select.fullWidth {width: 500px}
    #up-popups .header.class_list h4 {width: 468px}
    #up-popups form#class_form .facebox-content, #up-popups .header.class_form ~ #alerts, #up-popups .header.class_form ~ div.error {width: 730px}
    #up-popups .header.class_form h4 {width: 638px}
    #up-popups .assignment_list, #up-popups form#enroll_form .facebox-content, #up-popups form#group_join_form .facebox-content {width:600px}

    #up-popups #badge_form ul.tabnav {padding-right: 240px}
    .badgeWrapper {position: absolute; top: 10px; right: 25px}
    body:not(.portal):not(.edu2) #up-popups .facebox-content .badgeWrapper > p {padding: 4px 15px 13px !important; width: auto !important; border-bottom: 0}
    .badgeWrapper .badgeHolder {height: 400px; border-left: 1px solid #e2e0e0; border-left: 1px solid var(--table-border-color)}
    .badgeWrapper .badgeHolder .finalMessage {margin: 225px 0 0 0}
    .badgeOptions {height: 394px; margin-right: 230px; padding: 0 15px 0 0}
    #up-popups .badgeWrapper {margin-top: 0}
}
@media screen and (max-width: 600px) {
    #up-popups .assignment_pop .columns-display .column.one,
    #up-popups .assignment_pop .columns-display .column.two,
    #up-popups .assignment_pop .columns-display .column.three,
    #up-popups .assignment_pop .columns-display .column.four {width: 100%; padding: 0; border: 0}

    #up-popups .assignment_pop .columns-display .column.one,
    #up-popups .assignment_pop .columns-display .column.three,
    #up-popups .assignment_pop .columns-display .column.two,
    #up-popups .assignment_pop .columns-display .column.four {padding-right: 0}
}
@media screen and (max-width: 979px) {
    /* Resets for tags in logged-in view */
    body:not(.portal):not(.edu2) #up-popups .facebox-content label, #up-popups .labelGap,
    body:not(.portal):not(.edu2) #up-popups .facebox-content legend {display: block; width: 100% !important}
    body:not(.portal):not(.edu2) #up-popups .facebox-content input[type="checkbox"]:not(.emptyLabel) + label,
    body:not(.portal):not(.edu2) #up-popups .facebox-content input[type="radio"]:not(.emptyLabel, [name="language"]) + label {line-height: 30px}
    body:not(.portal):not(.edu2) #up-popups .facebox-content .search-item input[type="radio"]:not(.emptyLabel) + label {line-height: 21px}
    #up-popups #up-popupsContent span.max-info + label,
    body:not(.portal):not(.edu2) #up-popups .facebox-content select + label,
    body:not(.portal):not(.edu2) #up-popups .facebox-content [type="checkbox"] + label + label,
    body:not(.portal):not(.edu2) #up-popups .facebox-content input[type="hidden"] + label {margin-top: 10px}/* type=hidden for Lesson and Quiz assignment popups */

    body:not(.portal):not(.edu2) #up-popups .facebox-content input[type="password"],
    body:not(.portal):not(.edu2) #up-popups .facebox-content input[type="text"],
    body:not(.portal):not(.edu2) #up-popups .facebox-content input[type="file"],
    body:not(.portal):not(.edu2) #up-popups .facebox-content textarea,
    body:not(.portal):not(.edu2) #up-popups .facebox-content legend,
    #up-popups .facebox-content:not(.help_centre) .optionsRibbon {max-width: 100%; box-sizing: border-box; margin: 0}
    body:not(.portal):not(.edu2) #up-popups .facebox-content select,
    #up-popups .facebox-content input[type="text"].hasDatepicker,
    #up-popups form#action_form .select2-container {width: 100% !important; display: block}
    body:not(.portal):not(.edu2) #up-popups .facebox-content p {width: 100% !important; padding: 0}

    #up-popups form label br{display:none}

    #up-popups .facebox-content p.mb0 + p.mt0,
    #up-popups .facebox-content #assignmentScore + label,
    #up-popups form#resources_form .facebox-content .search-item {margin-top: 10px}
    /*#up-popups .facebox-content .optionsRibbon {margin-left: 3px; width: auto}*/

    body:not(.portal):not(.edu2) #up-popups .facebox-content .badgeLibraryCheckboxes label:not(:first-child) {display: inline-block; width: auto !important}

    /* Attendance Table */
    #up-popups table.attendance, #up-popups table.attendance tr, #up-popups table.attendance td, #up-popups table.attendance span {display: block; text-align: left}
    #up-popups table.attendance th, #up-popups table.attendance td.highlight {display: none}
    #up-popups table.attendance td {line-height: 20px; height: auto; border-width: 0; padding: 5px 0}

    #up-popups .help_centre .contentBlock {padding: 10px 15px; width: 100%}
    #up-popups .help_centre .contentBlock:nth-child(1), #up-popups .help_centre .contentBlock:nth-child(2) {margin-top: 0}
    #up-popups .help_centre .contentBlock, #up-popups .help_centre .contentBlock:nth-child(2n+2), #up-popups .help_centre .contentBlock:nth-last-child(2) {margin-bottom: 10px}
    #up-popups .help_centre .contentBlock:last-child {margin-bottom: 0}
    #up-popups .help_centre .help_centre_content img {height: auto !important}

    /* People Picker */
    #up-popups .section-intro .contentBlock .sideText p.number {width: 30px !important; line-height: 30px; display: block}
    #up-popups .section-intro .contentBlock .sideText p:not(.number) {width: auto !important}


    /* Action form */
    #up-popups form#action_form select#rule_action_execute_when {margin-bottom: 10px}
}
@media screen and (min-width: 980px) {
    /* Global */
    #up-popups .facebox-content {overflow-y: auto; -webkit-overflow-scrolling: touch; }
    #up-popups .no_max_height {max-height: 100%}
    #up-popups #up-popupsContent, #up-popups #alerts {min-width: 100%}
    #up-popups div.error {width: auto}
    #up-popups .header h4 {max-width: 100%}
    #up-popups form.langForm .facebox-content {width: 820px}
    #up-popups form.langForm .facebox-content div {width: 205px}
    #up-popups .xl_popup {width: 840px;max-width: 950px !important;}
    #up-popups .xxl_popup {width: 950px;}

    /* Logged In */
    #up-popups form#assignment_form .facebox-content {
        width: 850px
    }



    #up-popups .sml_popup input[type='text']:not([style*='width']) {margin: 0}
    #up-popups .sml_popup input[type='text'].sml_popup_inline_input {width: calc(100% - 130px); margin: 0}

    #up-popups div.facebox-resources-filter, #up-popups form#resources_form .facebox-content {width: 775px}
    #up-popups div.facebox-resources-filter label {width: auto; margin: 0 3px 0 0}
    #up-popups div.facebox-resources-filter select {width: 140px; margin-right: 5px; margin-left: 5px; display: inline-block}

    #up-popups .facebox-content .row.col-2 input[type="text"],
    #up-popups .facebox-content .row.col-2 label,
    #up-popups .facebox-content .row.col-2 legend {width: 100%; margin-right: 0}
    #up-popups .facebox-content .row.col-2 .emptyLabel + label,
    #up-popups .facebox-content .row.col-2 input[type="checkbox"] + label,
    #up-popups .facebox-content .row.col-2 input[type="radio"] + label {width: auto}

    #up-popups .facebox-content .inline_form_elements,
    #up-popups .facebox-content .badgeLibraryCheckboxes p {display: table}
    #up-popups #badge_form .facebox-content .badgeOverview .badgeLibraryCheckboxes p {
        display: block;
    }
    #up-popups #badge_form.facebox-content input[type=radio] + label{width:auto;}
    #up-popups .facebox-content .inline_form_elements > *:first-child,
    #up-popups .facebox-content .badgeLibraryCheckboxes p label:first-child {display: table-cell; width: 128px}
    #up-popups .facebox-content .inline_form_elements > p {display: inline-block; margin: 0}
    #up-popups .facebox-content .badgeColors .color_recommendations {margin-top: 10px}

    #up-popups .halfColumnForm {width: 323px; float: left; margin-top: 0}
    #up-popups .halfColumnForm input[type="text"],
    #up-popups form#action_form .select2-container {width: 180px}

    #up-popups #ResourceLibraryFilterWrapper .facebox-content {max-height: 60vh !important; width: auto; max-width: 925px}

    #up-popups p.inline_form_elements {margin-bottom: 0}
    #up-popups .inline_form_elements select#rule_action_execute_when,
    #up-popups .inline_form_elements select#rule_action_execute_when ~ * select {margin-bottom: 10px}
    #up-popups .inline_form_elements select#rule_action_execute_when ~ .after .time_wrap {display: inline-block}
}
@media screen and (min-width: 1280px) {
    #up-popups .help_centre {width: 1033px}
    #up-popups .xxl_popup {width: 1100px; max-width:1200px !important;}
}
#up-popups .nav, #up-popups .footer{
    background: transparent !important;
}
#up-popups .nav i:after{
    left: 0;
}
#up-popups .nav *{
    color: var(--main-text-color);
}
#up-popups.add-popup {
    background: var(--popup-bg) !important;
    backdrop-filter: blur(6px);
}
#up-popups form .footer {
    background-color: var(--popup-bg) !important;
    z-index: 2;
}
#up-popups .facebox-content {
    width: 100% !important;
}

#up-popups div#alerts {
    width: 100% !important;
}
#up-popups .facebox-content {
    margin-bottom: 10px;
    max-height: min(80dvh, 100dvh - 150px);
}
body.evo #up-popups #multipost.facebox-content:has(#classes) {
    max-height: 65vh;
}
body.evo[class*="_game_admin"] #up-popups .facebox-content,
body.evo[class*="_teacher_game"] #up-popups .facebox-content,
body.evo #up-popups .messagePopup .facebox-content{
    max-height: 70dvh;
}

body.evo #up-popups #resources_uploader_form .facebox-content.resources-scroll{
    max-height: calc(100dvh - 350px) !important;
}

body.evo #up-popups #multipost.facebox-content:has(#classes) table tr:first-child th {
    position: relative !important;
}
body.evo #up-popups .facebox-content.xxl_popup.two-columns {
    max-height: 65vh;
}
@media screen and (min-height: 600px) {
    body.evo #up-popups .facebox-content.xxl_popup.two-columns {
        max-height: 80vh;
    }
}
#up-popups .page-content {
    padding: 12px 19px;
}
#up-popups .facebox-content dl dt {
    margin-top: 8px;
    font-size: 13px;
    font-weight: 600;
}
#up-popups .facebox-content dl dd {
    font-size:13px;
}

#up-popups .facebox-content dl i {
    margin-top:0px;
}
#up-popups .facebox-content i:after {
    color: var(--active-color);
}

#up-popups .facebox-content dl dt {
    margin-top: 8px;
    font-size: 13px;
    font-weight: 600;
}

#up-popups .facebox-content dl dd {
    font-size: 13px;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* number of lines to show */
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    padding:0px 10px;
    height: 42px;
    white-space: normal;
}

#up-popups .facebox-content dl > dt:not(:has(i)) {
    height: 110px;
}

#up-popups .facebox-content dl > dt:not(:has(i)) + dd {
    margin-top: 60px !important;
}

#up-popups .facebox-content dl i {
    margin-top: 0px;
}

#up-popups .facebox-content i:after {
    color: var(--active-color);
}

#up-popups .popup .footer button:not(.not-btn), #facebox .footer .link_button, #up-popups .resource_popup .link_button,
body.evo #up-popups form#grade_form a#GradebookPostButton{
    background: var(--active-color);
    color: #fff;
    font-weight: 500;
    padding: 3px 20px !important;
    font-size: 12px;
    border-radius: 20px;
    align-items: center;
    color: #fff;
    transition: all .2s ease-in-out;
    line-height: 20px !important;
}

#up-popups .popup.grade_pop.rubric-mode {
    width: 90% !important;
    max-width: 90%;
}

/* Kades edits */
#up-popups .facebox-content label, #up-popups .facebox-content fieldset legend, #up-popups .labelGap {
    font-weight: 600;
}

#up-popups .footer span {
    font-size: 13px;
}

body.evo input[type="checkbox"]+label:before, input[type="radio"]+label:before {
    border: 1px solid var(--border-darker-color);
}

[data-theme="dark"] body.evo input[type="checkbox"]+label:before, [data-theme="dark"] input[type="radio"]+label:before {
    background-color: #414147;
}

#up-popups .facebox-content p {
    margin: 0 auto;
}

/* Kades Styles */
#up-popups .facebox-content .optionsRibbonTable_separate + table{
    padding: 0px;
}

#up-popups .facebox-content .optionsRibbonTable_separate{
    margin-bottom:10px;
}
#up-popups .facebox-content .dl-item, #up-popups .facebox-content dl > dt {
    vertical-align: top;
    width: calc(33% - 3px);
    display: inline-block;
    text-align: center;
    background: var(--popup-widget-bg);
    height: 139px;
    /* margin: 4px; */
    padding: 10px;
    position: relative;
    border-radius: var(--main-border-r);
    overflow: hidden;
}

#up-popups .facebox-content dt a, #up-popups .facebox-content dt a i {
    display: block;
    text-align: center;
    margin: 0 auto;
    /* position: relative; */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#up-popups .facebox-content dd {
    margin: 0;
    font-size: 11px !important;
    line-height: 14px;
}

#up-popups .facebox-content dl {
    display: flex;
    flex-flow: row wrap;
    column-gap: 6px;
    row-gap: 6px;
    margin: 0 !important;
    justify-content:left;
}

#up-popups .facebox-content dt i {
    font-size: 20px;
    width: auto;
    background: var(--bg-color);
    width: 40px;
    height: 40px;
    border-radius: 20px;
    padding-top: 7px;
    margin: 0 auto;
    margin-bottom: 8px !important;
    display: block;
    box-shadow: var(--box-shadow);
}
#up-popups .facebox-content dl > dt {
    padding-top: 17px;
    margin: 0;
}
#up-popups .facebox-content .dl-item dt a:after, #up-popups .facebox-content dl > dt a:after {
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 2;
}

#up-popups .facebox-content dl dt a:hover:after {
    background: #0000000d;
}
#up-popups .facebox-content dl dt a{
    color: var(--main-text-color) !important;
}
.facebox-content dl > dt + dd{
    /* display: none; */
    position: relative;
    margin-top: 85px !important;
    width: calc(33% - 6px);
    margin-left: calc(-33% + 0px) !important;
    text-align: center;
}

#up-popups .resource_popup aside ul li {
    padding-left: 25px;
}

#up-popups .contentBlock .sideText .hc-limit-lines {
    max-height: 48px;
    overflow: hidden;
    font-size: 13px;
    line-height: 16px;
}

#up-popups .help_centre .contentBlock {
    border-radius: var(--main-border-r);
    transition: all .4s ease-in-out;
    background:var(--bg-color);
    border:1px solid var(--bg-color);
}

#up-popups .help_centre form.search-form input{
    background: var(--bg-color);
}

#up-popups .help_centre .contentBlock:hover{
    background:var(--bg-color);
    border-color: var(--active-color);
}
div#up-popups .popup:not(:last-child) {
    z-index: 999;
}

#up-popups #coupon_apply_form a{
    color: var(--main-text-color);
    font-size:13px;
    font-weight:500;
}

#up-popups #coupon_apply_form i{
    line-height:16px;
}

#PeoplePicker .section-intro .contentBlock .sideImg img {
    width: 100px;
    height: auto;
}


#up-popups #PeoplePicker .tab-content > div {
    padding: 0px 9px;
}

#up-popups .popup.video p{
    margin: 0 auto;
    text-align: center;
}

#up-popups .popup.video .embed-container{
    text-align: center;
}


/* News Settings */

body.evo.ctr_home_news #up-popups form#feed_form dl {
    display: block;
}

body.evo.ctr_home_news #up-popups form#feed_form dl > dt {
    width: 100%;
    margin: 0;
    padding: 10px;
    display: block;
    height: auto;
    text-align: left;
}

body.evo.ctr_home_news #up-popups form#feed_form .facebox-content dl > dd {
    display: inline-block;
    margin-left: 0px;
    margin-top: 10px !important;
}

body.evo.ctr_home_news #up-popups form#feed_form .facebox-content dl > dd label {
    font-weight: 500;
}


/* Add Sections */
body.evo #up-popups label[for="resource_description"] br {
    display: none;
}

body.evo #up-popups #resource_form .options_btn {
    background: var(--active-color);
    color: #fff;
    font-weight: 500;
    padding: 5px 20px !important;
    font-size: 12px;
    border-radius: 20px;
    align-items: center;
    color: #fff;
    transition: all .2s ease-in-out;
    line-height: 20px !important;
    border: 0px;
}

body.evo #up-popups #resource_form .options_btn i {
    height: 20px;
}

body.evo #up-popups #resource_form .options_btn i::after {
    color: #fff;
}



/* Dialog Boxes */

body.evo .jconfirm .jconfirm-box, body.evo .popover-stack > .popover{
    background: var(--popup-bg-container);
    border-radius: var(--main-border-r);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    padding: 10px 20px;
    font-family:var(--font-primary);
}

body.evo .jconfirm .jconfirm-box .buttons{
    background: var(--popup-bg-container);
}


body.evo .jconfirm .jconfirm-box div.content{
    border-radius: var(--main-border-r);
    min-height: auto;
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 500;
    padding: 10px 0px;
}

body.evo .jconfirm .jconfirm-box div.title, body.evo .popover-stack .popover-header{
    background:none;
    font-size:18px;
    color:var(--main-text-color);
    font-weight:600;
    font-family:var(--font-primary);
    padding: 10px 0px;
}

body.evo .popover-stack .popover-header h2{
    color:var(--main-text-color);
}

.jconfirm.white .jconfirm-box .buttons button.btn-default, body.evo .with-blocker.popover-stack .popover-footer button{
    background: var(--active-color);
    color: #fff;
    font-weight: 500;
    padding: 3px 20px !important;
    font-size: 13px !important;
    border-radius: 20px;
    align-items: center;
    color: #fff;
    transition: all .2s ease-in-out;
    line-height: 20px !important;
}


/* Kades Popup edits to be reviewed by Keenan */

body.evo #up-popups .facebox-content dl > dt > a {
    line-height: 13px;
    overflow: visible;
    white-space: pre-wrap;
}

#up-popups .facebox-content dt a, #up-popups .facebox-content dt a i {
    line-height: 25px;
}

#up-popups .facebox-content .dl-item, #up-popups .facebox-content dl > dt{
    height:150px;
}

.facebox-content dl > dt + dd{
    margin-top:93px !important;
}

#up-popups ul.tabnav{
    display: flex;
    position: relative;
}

body.evo #up-popups .optionsRibbon ul li a i.add:after {
    color: #fff;
}




/* Profile */

body.evo.ctr_user #up-popups div#Uploader ul#helpTabs.tabnav {
    display: inline-block;
    height: 60px;
}

body.evo #up-popups #file_uploader_form .facebox-content #UploaderContainer {
    border: 2px dashed var(--content-bg-color);
    border-radius: 20px;
}

body.evo #file_uploader_form .facebox-content #UploaderContainer div{
    font-size: 13px;
    font-weight: 500;
}

body.evo #up-popups #resources_file .uploader_filter_name {
    padding: 5px 8px;
    font-size: 14px;
    width: auto;
}



/* Paths & Resources Library Popup */
#up-popups div.facebox-resources-filter{
    font-size:13px;
}

body.evo #up-popups #ResourceLibraryFilterWrapper .search-metadata {
    background: var(--light-gray-bg);
    border-radius: 20px;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: 500;
    color: var(--light-grey-text-color);
    margin: 5px 0 10px 26px;
    width: fit-content;
}

body.evo #up-popups #ResourceLibraryFilterWrapper .search-metadata i{
    margin-top: 8px;
}


/* Lesson Filter Popup */

body.evo[class*='_lesson'] #up-popups .filters-rules-wrapper select, body.evo .filters-rules-wrapper input{
    height: 32px;
    margin-right: 5px !important;
}

body.evo[class*='_lesson'] #up-popups .filters-wrapper .select2-container-multi .select2-choices .select2-search-choice{
    line-height: 25px;
    border-radius: 6px;
    height: 28px;
    margin: 2px;
}

body.evo[class*='_lesson'] #up-popups .filters-wrapper .select2-container-multi .select2-search-choice{
    margin: 0px;
}

body.evo[class*='_lesson'] #up-popups .filters-wrapper .select2-container-multi .select2-search-choice div{
    font-weight: 500;
    font-size: 12px;
}

body.evo[class*='_lesson'] #up-popups .filters-wrapper .filters-and a {
    width: 32px;
    height: 32px;
    line-height: 32px;
    border-radius: 6px;
    background: var(--active-color);
    border-color: var(--active-color);
}

body.evo[class*='_lesson'] #up-popups .filters-wrapper .filters-and a span{
    color: #fff;
}

body.evo[class*='_lesson'] #up-popups .filters-buttons i:after{
    color: var(--main-text-color);
    font-size: 12px;
}

body.evo[class*='_lesson'] #up-popups .filters-buttons a{
    background-color: var(--bg-color);
    border-radius: var(--border-r-rounded);
    margin-right: 5px;
    height: 30px;
    width: 30px;
    line-height: 30px;
}

body.evo[class*='_lesson'] #up-popups .filters-wrapper .filters-buttons{
    border-right: 0px;
}


/* Resources */

body.evo[class*="_library"] #up-popups .resource_popup.xl_popup{
    max-width: 95%;
    width: 70%;
    box-shadow: none;
    background-color: var(--content-bg-color);
    border-radius: var(--main-border-r);
}

/* Add class popup */

body.evo #up-popups #class_form .facebox-content p#duration label,
body.evo #up-popups #class_form .facebox-content p:has(#lo_age):has(#hi_age) label {
    width: 100%;
}

body.evo #up-popups #class_form .facebox-content #lo_age,
body.evo #up-popups #class_form .facebox-content #hi_age {
    width: 30%;
    min-width: 200px;
}

/* Calendar */

body.evo[class*="_calendar"] #up-popups .popup form#event_form .tox-editor-header {
    position: relative !important;
    top: 0px !important;
}

body.evo[class*="_calendar"] #up-popups .popup .optionsRibbon {
    height: auto;
}

body.evo[class*="_calendar"] #up-popups .popup .optionsRibbon ul li {
    padding: 5px;
}

body.evo[class*="_calendar"] #up-popups .popup .calendar_event {
    font-size: 13px;
    font-weight: 600;
}




/* Vex Popups Notifications on Student Awards and Points*/
body.evo .vex .vex-content .vex-header {
    line-height: 44px;
    font-size: 17px;
    color: var(--main-text-color);
    padding: 4px 19px;
    width: calc(100% - 80px);
    overflow: hidden;
    height: 100%;
    text-overflow: ellipsis;
    background: transparent;
    border: none;
}

body.evo .vex .vex-content .vex-close:before{
    color: var(--main-text-color);
}


body.evo .vex .vex-content{
    background: var(--popup-bg);
    border-radius: var(--main-border-r);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

body.evo .vex .vex-content .vex-body{
    background: var(--bg-color);
    border-radius: var(--main-border-r);
    box-shadow: var(--box-shadow);
    padding: 10px;
}


/* Help Center API */

#up-popups .help_centre .help_centre_content dl dd, #up-popups .help_centre .help_centre_content dl dt {
    font-family: 'Roboto', Helvetica, Arial, sans-serif;
    overflow: visible;
}


#up-popups .help_centre .help_centre_content pre,
#up-popups .help_centre .help_centre_content dl{
    color: var(--main-text-color);
    background: var(--content-bg-color);
    border-radius: var(--main-border-r);
    padding: 20px;
    font-family: 'monospace', Helvetica, Arial, sans-serif;
    font-size: 12px;
    line-height: 1.75;
}


#up-popups .help_centre .help_centre_content dl dd, #up-popups .help_centre .help_centre_content dl dt{
    color: var(--main-text-color);
    background: var(--content-bg-color);
    -webkit-line-clamp: unset;
    overflow: visible;
    white-space: unset;
    height: auto;
    text-align: left;
    margin-top: 0px !important;
    width: 100%;
    margin-left: 0px !important;
    padding-left:0px;
    font-size: var(--font-size-medium) !important;
    line-height: 20px;
}

#up-popups .help_centre .help_centre_content dl dd{
    font-weight:var(--font-weight-light);
}

#up-popups .help_centre .help_centre_content dl{
    color: var(--main-text-color);
    display: inline-block;
    font-family: 'monospace', Helvetica, Arial, sans-serif;
}

#up-popups .help_centre p > pre,
#up-popups .help_centre p > pre code,
#up-popups .help_centre li > pre code,
#up-popups .help_centre dd > pre code,
#up-popups .help_centre td > pre code,
#up-popups .help_centre .help_centre_content pre code {
    color: var(--main-text-color);
    background: var(--content-bg-color);
    white-space: pre;
    -webkit-overflow-scrolling: touch;
    display: block;
    max-width: 100%;
    min-width: 100px;
    font-size: 13px;
    padding: 20px;
    line-height: 1.75;
    border-radius: 10px;
    font-family: 'monospace', Helvetica, Arial, sans-serif;
    font-weight:400;
}

#up-popups .help_centre pre:has(code){
    margin-bottom: 10px;
}

#up-popups .help_centre .help_centre_content dl > dt{
    width: 100%;
}

#up-popups .help_centre .help_centre_content dl {
    margin-bottom: 20px !important;
}


body.evo #up-popups .optionsRibbon ul li:has(a) {
    padding: 5px;
}

/* Help Center Mobile*/

@media screen and (max-width: 1369px) {

    body.evo #up-popups .popup.help_centre {
        max-width: 90%;
        width: 80%;
        height: 90%;
    }
}


@media screen and (max-width: 1025px) {

    body.evo #up-popups .facebox-content.help_centre{
        min-height: 95vh !important;
    }

    body.evo #up-popups .help_centre .help_centre_content{
        padding:10px;
    }

    body.evo #up-popups .help_centre ul.inlineList.helpList{
        margin:0px;
    }

    body.evo #up-popups #hc_content_selector .help_centre_heading h1 {
        text-align: left;
    }

    body.evo #up-popups .help_centre .help_centre_heading {
        padding: 10px;
    }

    body.evo #up-popups .help_centre .optionsRibbon ul li {
        padding: 10px 5px;
    }

    body.evo #up-popups .help_centre .optionsRibbon{
        height:70px;
    }

    body.evo #up-popups .help_centre .help_centre_heading{
        margin-top:10px;
    }

    body.evo #up-popups .popup.help_centre {
        max-width: 100%;
        width: 100%;
        height: 90%;
    }

    body.evo #up-popups .help_centre .help_centre_heading {
        height: 120px;
        padding-bottom: 10px;
    }

    body.evo #up-popups .help_centre .optionsRibbon ul li{
        padding: 5px 10px;
    }

    body.evo #up-popups .help_centre .optionsRibbon{
        width: auto;
        left: 0px;
        top: 8px;
        position: relative !important;
        display: block;
        height: 50px;
    }

    body.evo #up-popups .help_centre .help_centre_content{
        max-height: 100% !important;
        height: 100% !important;
    }


    body.evo #up-popups .help_centre_heading h1 {
        display: block;
        clear: both;
        margin-top: 20px;
        padding: 0px;
        text-align: center;
    }

}


/* People Picker */
#up-popups #people_picker a.pp_add,
#up-popups #people_picker a.pp_remove {
    display: inline-block;
    border: 0px;
    border-radius: 50px;
    font-weight: 600;
    font-size: 12px;
    background: transparent;
    height: 25px;
    width: 25px;
    line-height: 25px;
    text-align: center;
    background-color: var(--active-color);
}

body.evo #up-popups #people_picker table tr th i {
    font-size: 13px;
}

body.evo #up-popups #people_picker table tr th i:after{
    color: #fff;
}

body.evo .tox-dialog-wrap button.tox-button.tox-button--secondary{
    padding: 5px 15px;
    display: inline-block;
    border: 1px solid var(--button-border-color);
    border-radius: 50px;
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-small);
    color: var(--button-color-2);
    background: transparent;
    font-family: var(--primary-font);
}


body.evo .tox .tox-button--icon, .tox .tox-button.tox-button--icon,
.tox .tox-button.tox-button--secondary.tox-button--icon{
    padding: 0px;
}

body.evo .tox-dialog {
    background: var(--popup-bg) !important;
    border-radius: var(--main-border-r) !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

.body.evo .tox #Uploader #dropzone{
    background: var(--bg-color) !important;
    border-radius: var(--main-border-r) !important;
    box-shadow: var(--box-shadow)!important;
    min-height: 180px;
    margin-bottom: 10px;
}

/* Login facebox */
#facebox:has(div.loginPopup) {
    position: absolute;
    z-index: 400;
}


body.evo.portal .popup,
body.evo.login .popup{
    position: relative;
    padding: 10px 0 5px;
    background: var(--bg-color);
    box-shadow: 0 0 10px rgba(0,0,0,.2);
    border-radius: 10px;
}

body.evo.portal .header,
body.evo.login .header{
    width: 100%;
    min-height: 44px;
    position: relative;
    margin: -10px 0 0;
    padding: 10px 10px 3px;
    box-sizing: border-box;
    overflow: hidden;
    z-index: 10;
    border-radius: 8px 8px 0 0;
}

body.evo.portal .header h4,
body.evo.login .header h4{
    color: #fff;
    font-size: 19px;
    font-family: 'Roboto Slab', Helvetica, Arial, sans-serif !important;
    padding: 0 0 7px 0;
}

body.evo.portal .close,
body.evo.login .close{
    width: 15px;
    height: 15px;
    background: url('../images/icons/icons.svg') no-repeat top right;
    position: absolute;
    top: 5px;
    right: 5px;
    border: 9px solid transparent;
}

body.evo.portal .loginOptions a,
body.evo.login .loginOptions a{
    color: var(--link-text-color);
}

body.evo.portal .difSignIn,
body.evo.portal input[type="submit"],
body.evo.portal input[type="button"],
body.evo.portal button#submit_button{
    background: var(--header-bg-color);
}


body.evo #facebox:has(div.loginPopup) + div#facebox_overlay {
    position: fixed;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
}

body.evo #up-popups .facebox-content.loginPopup {
    max-height: calc(100dvh - 150px);
    box-shadow: unset;
}

body.evo #up-popups .facebox-content fieldset legend {
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-medium);
}

body.evo #up-popups form#user_trash_popup .facebox-content i.refresh {
    height: 15px;
}

body.evo #up-popups #user_trash_popup .optionsRibbon ul li {
    padding: 10px 0px;
}

body.evo #up-popups .evo-popup-description{
    display:none !important;
}

body.evo .vex.vex-theme-os .vex-content .vex-header h2 {
    color: var(--main-text-color);
    font-weight:var(--font-weight-bold);
}


body.evo #up-popups ul.tabnav:not(.bypass) li:nth-last-child(3) a:before {
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
}

/* Onboarding Wizard */
body.evo .get_started_wizard .wizard_nav button .wizard-menu-text,
body.evo .get_started_wizard .wizard_nav button span{
    font-size: .8rem;
    font-weight: var(--font-weight-semibold);
}

body.evo .get_started_wizard .wizard_footer > *[excalibur-click] {
    background: var(--active-color);
    border: 1px solid var(--active-color);
    color: #fff;
    font-size: var(--font-size-medium);
    font-weight: var(--font-weight-medium);
}


body.evo[class*="_onboarding"] .wizard_content .optionsRibbon{
    width:auto;
}

body.evo.portal #up-popups .popup.loginPopup button:not(.not-btn),
body.evo.portal #up-popups .popup.loginPopup a,
body.evo.loginPage .frmLogin#login_form .difSignIn:first-of-type,
body.evo.loginPage .frmLogin .difSignIn{
    display: block;
    margin: 0 auto;
    margin-bottom: 10px;
    padding: 5px 20px;
    height: 40px;
    border-radius: var(--border-r-rounded);
    text-align: center;
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-medium) !important;
    box-shadow: 0px 2px 6px 0px rgb(11 0 60 / 2%);
    width:100%;
}

body.evo.portal #up-popups .popup.loginPopup a
{
    line-height: 33px;
    background:var(--active-color);
    color: #fff;
    margin: 24px auto 0 !important;
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-medium) !important;
}

body.evo.portal #up-popups .popup.loginPopup .frmLogin a:empty {
    display: none;
}

body.evo.portal #up-popups .popup.loginPopup .frmLogin .info {
    margin-bottom: 10px;
}

body.evo.portal #up-popups .popup.loginPopup .frmLogin .alert_block .alert_flex a {
    background: transparent;
    position: absolute;
    top: -3px;
    right: -1px;
    width: auto;
    padding: 3px;
}

body.evo.portal #up-popups .popup.loginPopup .frmLogin[data-active_window="password"] input#email {
    width: 100%;
    padding: 8px;
    border-radius: 8px !important;
    margin-bottom: 15px;
}

body.evo.loginPage .frmLogin#login_form .difSignIn:first-of-type,
body.evo.loginPage #loginForm form#sso .difSignIn:not(:first-of-type){
    line-height:40px;
    margin-bottom:20px;
    background:var(--button-bg-2);
    color: #fff;
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-medium) !important;
}

body.evo.loginPage .frmLogin .difSignIn{
    color: #fff;
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-medium) !important;
    line-height:40px;
}

body.evo.loginPage #loginForm {
    padding-top: 15px;
    padding-bottom: 25px;
}

body.evo.loginPage #loginForm form#sso .difSignIn,
body.evo.loginPage .frmLogin .difSignIn{
    padding: 0px !important;
    margin-top:0px;
    margin-bottom:10px;
    width:100%;
}

body.evo.loginPage #loginForm form#sso button {
    width: 100%;
}

body.evo.loginPage #loginForm button{
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-medium) !important;
    width: 100%;
}

body.evo.loginPage #loginForm button#submit_button {
    margin-bottom: 10px;
}

body.evo.portal #up-popups .popup.loginPopup button#submit_button,
body.evo.portal #up-popups .popup.loginPopup form#sso a.difSignIn:first-of-type
{
    background: var(--active-color);
    color: #fff;
    border-color: var(--active-color);
    opacity: 1;
}

body.evo.loginPage #loginForm{
    max-height: 90dvh;
    overflow-y: auto;
}

body.evo.loginPage #loginForm [data-active_window="credentials"] input[type="text"],
body.evo.loginPage #loginForm [data-active_window="admin"] input[type="text"],
body.evo.loginPage #loginForm input[type="password"],
body.evo.loginPage #loginForm input#password, #facebox .frmLogin input[type="password"],
body.evo.loginPage #loginForm input[type="text"]{
    font-size: var(--font-size-small);
    padding: 8px;
    border-radius: 8px !important;
    margin-bottom: 15px;
}

body.evo.loginPage #login_form input[type="text"]#userid{
    margin-bottom:15px;
}

body.evo.loginPage #loginForm .frmLogin label[for="userid"],
body.evo.loginPage #loginForm .frmLogin label[for="password"]{
    color:var(--main-text-color);
}

body.evo.loginPage .loginOptions a{
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-medium);
}

body.evo.loginPage .loginOptions label[for="checkboxName"] span{
    color:var(--main-text-color);
}

body.evo.portal #up-popups .popup.loginPopup .separator{
    margin:5px 0px 15px 0px;
}

body.evo.portal #up-popups .popup.loginPopup button:not(.not-btn),
body.evo.loginPage #loginForm button:not(#submit_button)
{
    background: var(--bg-color);
    color: var(--main-text-color);
    border: 1px solid var(--button-border-color);
    color:var(--main-text-color);
}

body.evo.loginPage #loginForm button:not(#submit_button):hover{
    background: var(--button-hover-bg-2);
}

body.evo.portal #up-popups .popup.loginPopup button:not(.not-btn) i:after {
    line-height: 25px;
}

body.loginPage.evo .powered_by a {
    color: #fff;
    font-weight: var(--font-weight-semibold);
}

body.evo.portal #up-popups .popup.loginPopup button:not(.not-btn):hover
{
    filter: brightness(97%);
}


body.evo.portal #up-popups .popup.loginPopup #login_form .loginOptions a{
    color: var(--link-color);
    background: none;
    padding:0px;
    text-align: right;
    line-height: normal;
    height: auto;
    margin-top:3px !important;
    box-shadow: none;
}

body.evo.portal #up-popups .popup.loginPopup {
    width: 25vw !important;
    min-width: 400px;
    background: var(--evo-sub-side);
}

@media screen and (max-width: 768px) {
    body.evo.portal #up-popups .popup.loginPopup {
        min-width: auto;
        width: 100% !important;
    }
}

body.evo.portal #up-popups .popup.loginPopup form#login_form label {
    display: block;
    width: auto;
}

body.evo.portal #up-popups .popup.loginPopup form#login_form input,
body.evo.portal .popup.loginPopup form.frmLogin input{
    width: 100%;
    padding: 8px;
    border-radius: 8px !important;
    margin-bottom: 15px;
}

body.evo.portal #up-popups .popup.loginPopup .loginOptions {
    margin: 10px 0 30px 0;
    display: flex;
    align-items: start;
    font-size: var(--font-size-small);
}

body.evo.portal #up-popups .popup.loginPopup form#login_form .loginOptions label {
    width: 80% !important;
}

body.evo.portal #up-popups .popup.loginPopup .loginOptions label span {
    font-weight: var(--font-weight-medium);
}

body.evo.portal #up-popups .popup.loginPopup a.difSignIn,
body.evo.loginPage #loginForm form#sso .difSignIn:not(:first-of-type){
    background: var(--button-bg-2);
    opacity: .9;
}

body.evo.portal #up-popups .popup.loginPopup a.difSignIn:hover,
body.evo.loginPage #loginForm form#sso .difSignIn:not(:first-of-type):hover{
    opacity: 1;
}


body.evo.portal #up-popups .popup.loginPopup button_btn i,
body.evo.loginPage #loginForm button i,
body.evo.portal #up-popups .popup.loginPopup button i{
    margin-top: 0px;
    vertical-align: middle;
    width: auto;
    height: auto;
    font-size: 18px;
}

body.evo.portal #up-popups .popup.loginPopup button i:after {
    vertical-align: middle;
}

body.evo.portal #up-popups .popup.loginPopup button#google_apps_btn i:not(.rotateClockwiseThick):after,
body.evo.loginPage #loginForm button#google_apps_btn i:after
{
    font-family: 'Font Awesome 5 Brands';
}

body.evo.portal #up-popups .popup.loginPopup button#saml2_btn i:after,
body.evo.loginPage #loginForm button#saml2_btn i:after{
    color: #57286f;
}

body.evo.portal #up-popups .popup.loginPopup button#clever_btn i:after,
body.evo.loginPage #loginForm button#clever_btn i:after
{
    color: #27548c;
    content: '\e266';
    font-family: 'Font Awesome 6 Pro';
    font-weight: 800;
}

body.evo.portal #up-popups .popup.loginPopup button#google_apps_btn i:after,
body.evo.loginPage #loginForm button#google_apps_btn i:after{
    color: #c33b2b;
    content:'\f1a0';
}

body.evo.portal #up-popups .popup.loginPopup button#office365_sso_btn i:after,
body.evo.loginPage #loginForm button#office365_sso_btn i:after{
    color: #0067B8;
}

body.evo.portal #up-popups .popup.loginPopup button i.rotateClockwiseThick,
body.evo.loginPage #loginForm button i.rotateClockwiseThick{
    display:none;
}

body.evo.loginPage #loginForm a.difSignIn i{
    display:none;
}

body.evo #up-popups .facebox-content span#star_rating label {
    width: auto;
}

/* Specific and targeted popup settings */

body.evo #up-popups .popup:has(.facebox-content.gradebook-export-popup) {
    max-width: 500px;
}

body.evo #up-popups .facebox-content.gradebook-export-popup dl {
    justify-content: space-around;
}

body.evo #up-popups .facebox-content.gradebook-export-popup dl > dt {
    width: 45%;
}

body.evo #up-popups .facebox-content.gradebook-export-popup dl > dt + dd {
    width: 40%;
    margin-left: calc(-48% + 0px) !important;
}

body.evo #up-popups .popup:has(.facebox-content.add-assignment) {
    max-width: 700px !important;
}

body.evo #up-popups .popup .facebox-content.assignment_pop {
    max-height: calc(100dvh - 220px) !important;
}

body.evo #up-popups .popup:has(.alert_block[role="alert"]) .facebox-content.assignment_pop {
    max-height: calc(100dvh - 270px) !important;
}

/* Reports */
body.evo .ui-datepicker .ui-datepicker-buttonpane button {
    background: var(--active-color);
    border-radius: 50px;
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-small);
    padding: 0px 10px;
    font-family: var(--font-family);
}
/* RTL */
[dir="RTL"] #up-popups .section-intro .contentBlock .sideText p:not(.number) {
    padding-left: 0px;
    padding-right: 50px;
}

[dir="RTL"] #up-popups #PeoplePicker .tab-content.first {
    float: right !important;
}

[dir="RTL"] body.evo #up-popups #people_picker table tr th i{
    height:25px;
}


body.evo #up-popups #level_form .facebox-content p > input:not(:has(+ *)) {
    width: auto;
}

body.evo #up-popups #report_form .report-popup select {
    width: 20%;
}

body.evo #up-popups #report_form .report-popup label {
    width: 130px;
}

body.evo #up-popups input,
body.evo #up-popups select,
body.evo #up-popups textarea{
    font-size: var(--font-size-medium);
}

body:not(.portal):not(.edu2) #up-popups .facebox-content .multiSelectOptions label {
    font-size: var(--font-size-medium);
}


/* Temporary Tailwind holder */
.tw-btn {
    background-color: var(--active-color) !important;
    color: var(--text-white) !important;
  }
  
.tw-btn .refresh::after {
    color: var(--text-white) !important;
}