/* an off-canvas panel */
[offc] {
position: fixed;
transition: all .3s ease;
z-index: 10;
width: 100%;
max-width: 320px;
top: 0;
bottom: 0;
background-color: #f0f0f0;
/* content block */
/* nested trigger */ }
[offc] .offc-inner {
overflow-y: scroll;
height: 100%; }
[offc] .offc-content {
padding: 1em; }
[offc] [offc-trigger] {
position: absolute;
top: 40%;
width: 30px;
text-align: center;
height: 80px;
border: 1px solid #d3d3d3;
background-color: #f0f0f0;
color: #d3d3d3; }
[offc] [offc-trigger]:before {
position: relative;
top: 25px;
font-size: 25px;
font-weight: 300;
line-height: 1; }
[offc] [offc-trigger]:hover {
box-shadow: 0px 0px 5px #d3d3d3; }
[offc-trigger] {
cursor: pointer; }
/* mobile off canvas trigger */
.mobile-offc-trigger-left,
.mobile-offc-trigger-right {
position: fixed;
top: 40%;
width: 30px;
text-align: center;
height: 80px;
border: 1px solid #d3d3d3;
background-color: #f0f0f0;
color: #d3d3d3;
cursor: pointer; }
.mobile-offc-trigger-left:before,
.mobile-offc-trigger-right:before {
position: relative;
top: 25px;
font-size: 25px;
font-weight: 300;
line-height: 1; }
.mobile-offc-trigger-left:hover,
.mobile-offc-trigger-right:hover {
box-shadow: 0px 0px 5px #d3d3d3; }
.mobile-offc-trigger-left {
left: 0; }
.mobile-offc-trigger-left:before {
content: '>'; }
.mobile-offc-trigger-right {
right: 0;
border-right: none; }
.mobile-offc-trigger-right:before {
content: '<'; }
/* active state */
[offc].open {
transform: translate(0px, 0px); }
/* themes */
[offc-dir="left"] {
left: 0;
border-right: 1px solid #d3d3d3;
transform: translate(-320px, 0px);
/* active state */ }
[offc-dir="left"] [offc-trigger] {
left: 0px;
border-left: none; }
[offc-dir="left"] [offc-trigger]:before {
content: '>'; }
[offc-dir="left"].open {
/*[offc-trigger] { right: auto; left: 0; }*/ }
[offc-dir="left"].open [offc-trigger]:before {
content: '<'; }
[offc-dir="right"] {
right: 0;
border-left: 1px solid #d3d3d3;
transform: translate(320px, 0px);
/* active state */ }
[offc-dir="right"] [offc-trigger] {
right: 0px;
border-right: none; }
[offc-dir="right"] [offc-trigger]:before {
content: '<'; }
[offc-dir="right"].open {
/*[offc-trigger] { left: auto; right: 0; }*/ }
[offc-dir="right"].open [offc-trigger]:before {
content: '>'; }
@media (min-width: 25em) {
.mobile-offc-trigger-left,
.mobile-offc-trigger-right {
display: none; }
[offc-dir="left"] [offc-trigger] {
right: -30px;
left: auto;
border-left: none; }
[offc-dir="right"] [offc-trigger] {
left: -30px;
right: auto;
border-right: none; } }
html {
position: relative;
z-index: 0;
-webkit-text-size-adjust: 100%; }
html body {
font: 300 16px "Figtree", sans-serif;
color: #596371;
line-height: 1.375;
overflow-x: clip; }
.admin-content {
min-height: calc( 100vh - 60px - var(--navHeight)); }
.loaded * {
transition: padding-left 0.6s ease, padding-right 0.6s ease; }
/* LEGACY */
[class*="-wrapper"] {
padding-left: 2%;
padding-right: 2%;
width: 100%; }
@media (min-width: 25em) {
html {
z-index: 1; } }
@media (min-width: 31.25em) {
html {
z-index: 3; }
/*[class*="-wrapper"] { padding-left: 3%; padding-right: 3%; }*/ }
@media (min-width: 37.5em) {
html {
z-index: 5; } }
@media (min-width: 48em) {
[class*="-wrapper"] {
max-width: 2500px;
margin: 0 auto; }
html {
z-index: 10; } }
@media (min-width: 70.625em) {
[class*="-wrapper"] {
padding-left: 40px;
padding-right: 40px; }
html {
z-index: 20; } }
@media (min-width: 75em) {
[class*="-wrapper"] html {
z-index: 30; } }
@media (min-width: 100em) {
[class*="-wrapper"] html {
z-index: 40; } }
@media (min-width: 118.75em) {
[class*="-wrapper"] html {
z-index: 50; } }
@media (min-width: 125em) {
[class*="-wrapper"] html {
z-index: 60; } }
/* NEW | OG use for 2019 Dashboard */
@media (min-width: 70.625em) {
[class*="--wrapper"] {
padding-left: 3.5%;
padding-right: 3.5%; } }
@media (min-width: 75em) {
[class*="--wrapper"] {
padding-left: 4%;
padding-right: 4%; } }
@media (min-width: 100em) {
[class*="--wrapper"] {
padding-left: 9%;
padding-right: 9%; } }
@media (min-width: 118.75em) {
[class*="--wrapper"] {
padding-left: 12%;
padding-right: 12%; } }
@media (min-width: 125em) {
[class*="--wrapper"] {
padding-left: 16%;
padding-right: 16%; } }
.svg-container {
padding: 15px; }
.admin-container {
position: relative;
/*z-index: 1;*/ }
.view-transition-container {
position: relative; }
.view-transition-container .view-transition {
transition: transform 0.5s ease; }
.view-transition-container .view-transition.transition-opacity {
opacity: 0;
transition: transform 0.5s ease, opacity 1s ease; }
.view-transition-container.start .view-transition {
transform: translate(-2%, -2%) !important;
opacity: 0 !important; }
.view-transition-container.start.down .view-transition {
transform: translate(0%, -2%) !important; }
.view-transition-container.done .view-transition {
opacity: 1; }
/*.login-failed {
padding: 1em;
background-color: lighten($red, 10);
color: #fff;
margin-top: 20px;
border: 1px solid $red;
}*/
.fc-event {
cursor: pointer; }
.hidden-template {
display: none !important; }
.border-top {
position: relative;
margin-top: 2.75em; }
.border-top:before {
content: '';
position: absolute; }
.border-top.theme-fake-divider {
margin-top: 2.75em; }
.border-top.theme-fake-divider:before {
top: -1.5em;
left: -2em;
right: -2.5em;
height: .5em;
background-color: #f2f2f2; }
.max-width_XXS {
max-width: 325px !important;
margin-left: auto !important;
margin-right: auto !important; }
.max-width_XS {
max-width: 450px !important;
margin-left: auto !important;
margin-right: auto !important; }
.max-width_SM {
max-width: 550px !important;
margin-left: auto !important;
margin-right: auto !important; }
.max-width_SM_2 {
max-width: 650px !important;
margin-left: auto !important;
margin-right: auto !important; }
.max-width_MD {
max-width: 750px !important;
margin-left: auto !important;
margin-right: auto !important; }
.max-width_MD_2 {
max-width: 875px !important;
margin-left: auto !important;
margin-right: auto !important; }
.max-width_LG {
max-width: 1000px !important;
margin-left: auto !important;
margin-right: auto !important; }
.max-width_LG_2 {
max-width: 1100px !important;
margin-left: auto !important;
margin-right: auto !important; }
.max-width_XL {
max-width: 1200px !important;
margin-left: auto !important;
margin-right: auto !important; }
.max-width_XXL {
max-width: 1600px !important;
margin-left: auto !important;
margin-right: auto !important; }
.max-width_3XL {
max-width: 1900px !important;
margin-left: auto !important;
margin-right: auto !important; }
.min-width_25 {
min-width: 25%; }
.min-width_33 {
min-width: 33.3333333333%; }
.min-width_50 {
min-width: 50%; }
.min-width_66 {
min-width: 66.6666666666%; }
.min-width_75 {
min-width: 75%; }
.min-width_100 {
min-width: 100%; }
.padV_SM {
padding-top: .5em;
padding-bottom: .5em; }
.padV_MD {
padding-top: 1em;
padding-bottom: 1em; }
.padV_LG {
padding-top: 2em;
padding-bottom: 2em; }
.padV_XL {
padding-top: 3em;
padding-bottom: 3em; }
.padV_XXL {
padding-top: 4em;
padding-bottom: 4em; }
.padV_3XL {
padding-top: 5em;
padding-bottom: 5em; }
.padH_SM {
padding-left: 1.5%;
padding-right: 1.5%; }
.padH_MD {
padding-left: 3%;
padding-right: 3%; }
.padH_LG {
padding-left: 5%;
padding-right: 5%; }
.padH_XL {
padding-left: 10%;
padding-right: 10%; }
.padH_XXL {
padding-left: 13%;
padding-right: 13%; }
.padH_3XL {
padding-left: 16%;
padding-right: 16%; }
.padALL_XS {
padding: .25em 1%; }
.padALL_SM {
padding: .5em 1.5%; }
.padALL_MD {
padding: 1em 3%; }
.padALL_LG {
padding: 2em 5%; }
.padALL_XL {
padding: 3em 10%; }
.padT_SM {
padding-top: .5em; }
.padT_MD {
padding-top: 1em; }
.padT_LG {
padding-top: 2em; }
.padT_XL {
padding-top: 3em; }
.padT_XXL {
padding-top: 4em; }
.padT_3XL {
padding-top: 5em; }
.padR_SM {
padding-right: .5em; }
.padR_MD {
padding-right: 1em; }
.padR_LG {
padding-right: 2em; }
.padR_XL {
padding-right: 3em; }
.padR_XXL {
padding-right: 4em; }
.padR_3XL {
padding-right: 5em; }
.padB_SM {
padding-bottom: .5em; }
.padB_MD {
padding-bottom: 1em; }
.padB_LG {
padding-bottom: 2em; }
.padB_XL {
padding-bottom: 3em; }
.padB_XXL {
padding-bottom: 4em; }
.padB_3XL {
padding-bottom: 5em; }
.padB_LG_if-not-empty:not(:empty) {
padding-bottom: 2em; }
.padL_SM {
padding-left: .5em; }
.padL_MD {
padding-left: 1em; }
.padL_LG {
padding-left: 2em; }
.padL_XL {
padding-left: 3em; }
.padL_XXL {
padding-left: 4em; }
.padL_3XL {
padding-left: 5em; }
.button {
display: inline-block;
margin: 5px 0;
padding: 0.75em 2em;
overflow: hidden;
position: relative;
font-size: 1em;
font-weight: 400;
font-family: "Figtree", sans-serif;
text-align: center;
text-decoration: none !important;
border: none;
vertical-align: middle;
line-height: 1.1;
-webkit-appearance: none;
outline: none;
border-radius: 4px;
fill: #fff !important;
cursor: pointer;
border-radius: 2em;
transition: color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease; }
.button.svg-container.icon .svg-icon {
width: 100%;
height: 100%;
pointer-events: none; }
.button.small {
padding: 5px 10px;
font-size: 1.2em; }
.button.medium {
font-size: 1.2em;
padding: 0.75em 2.2em; }
.button.large {
font-size: 1.4em;
padding: 0.75em 2.2em; }
.button.xlarge {
font-size: 1.7em;
padding: 0.75em 2.4em; }
.button.ghost-button {
background-color: #fff;
color: #434a4c;
box-shadow: 0 0 0 1px #2d97cc; }
.button.ghost-button:hover {
background-color: #d9d9d9 !important;
color: #4f575a !important;
box-shadow: 0 0 0 3px #2d97cc; }
.button.ghost-button.fast_button_active {
background-color: #f2f2f2 !important;
color: #373d3e !important; }
.button.ghost-button .svg-icon {
fill: #434a4c; }
.button.button-full {
width: 100%; }
.button.flex-item {
flex: 1 auto; }
.button.button-orange {
background-color: #f87d3f;
color: #fff; }
.button.button-orange:hover {
background-color: #e25108 !important;
color: white !important; }
.button.button-orange.fast_button_active {
background-color: #f76c26 !important;
color: #f2f2f2 !important; }
.button.button-orange .svg-icon {
fill: #fff; }
.button.button-grey {
background-color: #e9e9e9;
color: #888888; }
.button.button-grey:hover {
background-color: #c3c3c3 !important;
color: #959595 !important; }
.button.button-grey.fast_button_active {
background-color: gainsboro !important;
color: #7b7b7b !important; }
.button.button-grey .svg-icon {
fill: #888888; }
.button.button-grey:hover, .button.button-grey:focus {
box-shadow: inset 0 0 0 1px #DCDCDC; }
.button.button-grey-400 {
background-color: #d3d3d3;
color: #464646; }
.button.button-grey-400:hover {
background-color: #adadad !important;
color: #535353 !important; }
.button.button-grey-400.fast_button_active {
background-color: #c6c6c6 !important;
color: #393939 !important; }
.button.button-grey-400 .svg-icon {
fill: #464646; }
.button.button-grey-500 {
background-color: #888888;
color: #fff; }
.button.button-grey-500:hover {
background-color: #626262 !important;
color: white !important; }
.button.button-grey-500.fast_button_active {
background-color: #7b7b7b !important;
color: #f2f2f2 !important; }
.button.button-grey-500 .svg-icon {
fill: #fff; }
.button.button-grey-600 {
background-color: #636363;
color: #fff; }
.button.button-grey-600:hover {
background-color: #3d3d3d !important;
color: white !important; }
.button.button-grey-600.fast_button_active {
background-color: #565656 !important;
color: #f2f2f2 !important; }
.button.button-grey-600 .svg-icon {
fill: #fff; }
.button.button-green {
background-color: #9bc84a;
color: #fff; }
.button.button-green:hover {
background-color: #72972e !important;
color: white !important; }
.button.button-green.fast_button_active {
background-color: #8fbf3a !important;
color: #f2f2f2 !important; }
.button.button-green .svg-icon {
fill: #fff; }
.button.button-yellow {
background-color: #f1c74f;
color: #fff; }
.button.button-yellow:hover {
background-color: #e2ac12 !important;
color: white !important; }
.button.button-yellow.fast_button_active {
background-color: #efbf37 !important;
color: #f2f2f2 !important; }
.button.button-yellow .svg-icon {
fill: #fff; }
.button.button-blue {
background-color: #2d97cc;
color: #fff; }
.button.button-blue:hover {
background-color: #1f698d !important;
color: white !important; }
.button.button-blue.fast_button_active {
background-color: #2888b7 !important;
color: #f2f2f2 !important; }
.button.button-blue .svg-icon {
fill: #fff; }
.button.button-red {
background-color: #D14343;
color: #fff; }
.button.button-red:hover {
background-color: #a02727 !important;
color: white !important; }
.button.button-red.fast_button_active {
background-color: #c93131 !important;
color: #f2f2f2 !important; }
.button.button-red .svg-icon {
fill: #fff; }
.button.disabled {
opacity: .5;
cursor: not-allowed !important;
background: #888888; }
.button.disabled:hover {
background: #888888 !important; }
@media (min-width: 70.625em) {
.button:hover, .button:focus {
color: #fff;
background-color: #2d2d2d; } }
.panel-button-top-right {
position: absolute;
top: 0;
left: 0;
padding: .75em; }
.box-button-secondary:hover, .box-button-secondary:focus {
box-shadow: inset 0 0 0 1px #DCDCDC; }
/* fix for existing admin-theme overwriting 2020 update */
/* fix for existing admin-theme overwriting 2020 update */
.admin-container .button {
font-family: "Figtree", sans-serif; }
/* fix for existing admin-theme overwriting 2020 update */
.button-with-icon {
display: table;
padding: 10px; }
.button-with-icon .button-text {
display: table-cell;
vertical-align: middle;
padding: 0 5px; }
.button-with-icon .svg-container {
/*display: table-cell; */
vertical-align: middle; }
.inline-icon-buttons {
overflow: hidden; }
.inline-icon-buttons .button {
float: left !important;
margin-right: 5px;
height: 43px; }
.inline-icon-buttons .svg-container {
width: 23px;
height: 23px; }
.inline-icon-buttons.small .button {
height: 36px;
font-size: 1.25em;
padding: 8px; }
.inline-icon-buttons.small .button.button-width-icon {
line-height: 14px;
padding-left: 5px;
padding-right: 5px; }
.inline-icon-buttons.small .svg-container {
width: 20px;
height: 20px; }
.buttons-on-right {
text-align: left;
margin: 0;
/*padding: 0;*/ }
@media (min-width: 37.5em) {
.buttons-on-right {
text-align: right; } }
.button {
position: relative; }
.button input {
position: absolute;
opacity: 0;
top: 0;
left: 0;
width: 100%;
height: 100%; }
/* BUTTON NAV */
.button-nav .button.secondary {
background-color: #e9e9e9;
color: #636363;
box-shadow: inset 0 0 0 1px #A0A0A0; }
.button-nav .button.secondary:hover {
background-color: #c3c3c3 !important;
color: #707070 !important; }
.button-nav .button.secondary.fast_button_active {
background-color: gainsboro !important;
color: #565656 !important; }
.button-nav .button.secondary .svg-icon {
fill: #636363; }
.admin-container .eventregistration {
/*
&.box #cost .panel.generic-toggle .svg-container
{
&.svg-plus-icon { right: 190px; }
&.svg-arrow-icon-down { right:225px; bottom:0; margin-top:auto; margin-bottom:auto; margin:0; left: auto; }
&.svg-arrow-icon-up { right:259px; bottom:0; margin-top:auto; margin-bottom:auto; margin:0; left: auto; }
}*/ }
.admin-container .eventregistration.box #cost .panel.generic-toggle.active > .panel-heading .svg-container.svg-arrow-icon-up {
transform: rotate(0deg); }
.admin-container .eventregistration.box #cost .panel.generic-toggle.active > .panel-heading .svg-container.svg-arrow-icon-down {
transform: rotate(0deg); }
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
FLEX BUGS - the worst bugs you should be aware of ---- https://github.com/philipwalton/flexbugs
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
1) min-height | if placed on flexed container element, child elements will not inherit the parent's height ( IE 10/11 )
- SOLUTION : Wrap the container and use flex column // OR try adding " height: 1px; " to element
2) flex-basis | text doesn't get wrapped if size is too small ( IE 10/11 )
- SOLUTION : use inner element or wrap element
- REFERENCE : .nav .nav-item .inner
3) min-width/max-width(PX) + margin: auto; | child elements with these styles will shoot outside the container ( IE 10 )
- SOLUTION : put elements in child container and max-width/margin:auto on that
- REFERENCE : .module.layout-C (version 1 and 2)
4) Flex child elements exceed container width ( IE 10/11 )
- SOLUTION : put max-width: 100% on all flexed child elements, or else they will shoot outside the container
- REFERENCE: .subgroup , .flex-inner
5) Flex Grow Amount | flexed elements seem to grow at a different amount in IE EDGE & IE 10 than all other browsers...
- SOLUTION : none so far, bug is not fully tested
______ HOW TO TARGET IE EDGE (FOR NOW) __________________________________________________________________
You can target IE EDGE with the below query. Reference URL : https://jeffclayton.wordpress.com/2015/04/07/css-hacks-for-windows-10-and-spartan-browser-preview/
@supports (-ms-ime-align:auto) {
.class { ... }
}
______ HOW TO TARGET IE 10 + IE 11 __________________________________________________________________
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
// IE 10 and 11 CSS rules go here
}
*/
.base-flex-class, .form .label-container, .form .tick-container {
display: flex;
flex-flow: row wrap;
max-width: 100%;
/* IE 10/11 needs this to keep elements inside containers */ }
.align-flex-start {
align-content: flex-start; }
.flex-group, .flex-nav {
display: flex;
flex-flow: row wrap;
max-width: 100%;
/*
// SIZE
.XS_5 { @include flex-basis(50px!important); }
.XS_4 { @include flex-basis(75px!important); }
.XS_3 { @include flex-basis(125px!important); }
.XS_2 { @include flex-basis(175px!important); }
.XS { @include flex-basis(240px!important); }
.SM { @include flex-basis(300px!important); }
.MD { @include flex-grow(2!important); @include flex-basis(400px!important); }
.LG { @include flex-grow(3!important); @include flex-basis(600px!important); }
.LG_2 { @include flex-grow(3.5!important); @include flex-basis(700px!important); }
.XL { @include flex-grow(4!important); @include flex-basis(800px!important); }
.flex-100 { min-width: 100%; @include flex-basis(100%!important); }
.flex-80 { min-width: 80%; @include flex-basis(150px!important, 80%); } // these can be 0% if you don't want collapsing to full width
.flex-75 { min-width: 75%; @include flex-basis(150px!important, 75%); }
.flex-70 { min-width: 70%; @include flex-basis(150px!important, 70%); }
.flex-66 { min-width: 66.6666666666%; @include flex-basis(150px!important, 66.6666666666%); }
.flex-60 { min-width: 60%; @include flex-basis(150px!important, 60%); }
.flex-50 { min-width: 50%; @include flex-basis(150px!important, 50%); }
.flex-40 { min-width: 40%; @include flex-basis(150px!important, 40%); }
.flex-33 { min-width: 33.3333333333%; @include flex-basis(150px!important, 33%); }
.flex-30 { min-width: 30%; @include flex-basis(150px!important, 30%); }
.flex-25 { min-width: 25%; @include flex-basis(150px!important, 25%); }
.flex-20 { min-width: 20%; @include flex-basis(150px!important, 20%); }
// ^^ min-width and flex-basis need to be present. Flex-Basis needs either a % or PX value to create wrapping )
// ALIGNMENT
.centerV { @include align-items(center); @include align-self(center); }
.centerH { @include justify-content(center); }
.centered { @include align-items(center); @include justify-content(center); @include align-self(center); text-align: center; }
.stretch { @include align-self(stretch); }
.stretch>*{ @include align-self(stretch); } // <-- used to avoid clashing if .centered is used too
.top { @include align-items(flex-start); }
.bottom { @include align-items(flex-end); }
.right { @include justify-content(flex-end); }
// GENERIC COLUMNS
.subgroup.columns-2 > * { min-width: 50%; } // you can use flex-basis to adjust when elements break to full width
*/ }
.flex-group .flex-inner, .flex-nav .flex-inner {
display: flex;
flex-flow: row wrap;
flex: 1 1 100%;
max-width: 100%; }
.flex-group .subgroup, .flex-nav .subgroup {
max-width: 100%;
flex: 1 1 auto; }
/* FLEX-GROUP WRAPPER [OPTIONAL] _______________________________________________________________________________________________________________________________________
.flex-groups { margin-bottom: 2em;
header { padding: 1em; } // don't put font-size on this elm, because it'll mess with margin..
header .inner { font-size: 1.3em; }
}*/
.flex-group.dashboard-main header, .dashboard-main.flex-nav header {
min-width: 100%;
padding: 0 1em .25em; }
.form.right-aligned,
.flex-groups.right-aligned {
/* for a group with tick checkbox / tick radio. keep consistant spacing with the inputs.. */ }
.form.right-aligned .subgroup:last-child,
.flex-groups.right-aligned .subgroup:last-child {
flex-basis: 66.66667%; }
@media (min-width: 48em) {
.form.right-aligned label,
.flex-groups.right-aligned label {
flex: 1 1 auto; } }
@media screen and (min-width: 48em) and (-ms-high-contrast: active), (min-width: 48em) and (-ms-high-contrast: none) {
.form.right-aligned label,
.flex-groups.right-aligned label {
display: inline-block; } }
@media (min-width: 48em) {
.form.right-aligned .subgroup:first-child,
.flex-groups.right-aligned .subgroup:first-child {
text-align: right;
flex: 1 1 33.33333%; } }
.form.stacked .subgroup,
.flex-groups.stacked .subgroup {
flex-basis: 100%; }
.form.stacked .subgroup .tooltip,
.flex-groups.stacked .subgroup .tooltip {
text-align: left; }
/*.modal { display: block; opacity:0; @include transition(opacity 800ms ease); cursor: pointer; }
html.modal-active
{ width: 100%; height: 100%;
body { height: 100%; }
.modal { position: fixed; width: 100%; height: 100%; z-index: 99; background-color: rgba(#fff, .75); top: 0; bottom: 0; opacity: 1; }
.addthis-smartlayers { display: none!important; }
}
// add optional color themes
.modal-active.blue-theme .modal { background-color: $blue; }*/
.modal {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: -1;
pointer-events: none;
display: block;
opacity: 0;
background-color: rgba(255, 255, 255, 0.75); }
html.loaded .modal {
transition: opacity 0.85s ease; }
html.modal-active .modal {
z-index: 99;
opacity: 1;
pointer-events: auto;
cursor: pointer;
height: 100%;
/* <-- Fallback in case JS doesnt fire & add doc height*/ }
html.modal-active .addthis-smartlayers {
display: none !important; }
@media (min-width: 70.625em) {
html.site-nav-active.modal-active .modal {
display: none;
z-index: -1; } }
/* MODAL POPUP */
.modal-content {
display: none; }
.modal-popup {
position: fixed;
top: 3.5vh;
bottom: 3.5vh;
left: 0;
right: 0;
z-index: -100;
opacity: 0;
display: flex;
transition: transform 0.5s ease, opacity 0.35s ease, max-height 0.9s ease;
transform: scale(0) translateY(-50px);
/* _______________ THEME _______________*/
/* DEFAULT */
/* SNIPPET | ADD MODAL */ }
.modal-popup .modal-nav {
position: absolute;
top: -5px;
right: -5px;
display: flex;
justify-content: flex-end;
z-index: 100; }
.modal-popup .modal-nav .nav-item {
flex: 0 1 auto;
height: 2em;
padding: .2em 1em;
z-index: 99;
overflow: hidden;
border-radius: 50%; }
.modal-popup .close-button {
position: relative;
font-size: 1.25em;
background-color: #2d97cc;
color: #fff;
text-align: center;
cursor: pointer;
transition: background-color 0.4s ease;
font-weight: bold; }
.modal-popup .close-button:before {
content: 'X';
position: absolute;
top: 50%;
left: 50%;
color: inherit;
transform: translateX(-50%) translateY(-50%); }
.modal-popup .close-button:hover, .modal-popup .close-button:focus {
background-color: #f87d3f !important;
color: #fff !important;
border-color: #fff !important; }
.modal-popup .modal-outer {
display: flex;
flex-flow: column nowrap;
width: 100%;
overflow: hidden;
position: relative; }
.modal-popup .modal-outer:after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: .5em;
height: 3em;
z-index: 1;
pointer-events: none;
background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #fff 100%);
background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #fff 100%);
background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #fff 100%); }
.modal-popup .modal-inner {
flex: 1 1 auto;
overflow-y: auto;
width: 100%; }
.modal-popup .modal-inner::-webkit-scrollbar {
-webkit-appearance: none;
width: .5em; }
.modal-popup .modal-inner::-webkit-scrollbar-track {
background-color: #DCDCDC; }
.modal-popup .modal-inner::-webkit-scrollbar-thumb {
/*border-radius: .5em;*/
background-color: #888888;
opacity: 1; }
.modal-popup .modal-content-container {
width: 100%;
padding: 3vw; }
.modal-popup .content img {
margin-bottom: 0; }
.modal-popup[modal-theme="theme-default"] {
max-width: 665px;
margin: 0 auto;
max-height: 50%;
/* fallback for init w/ async images */
width: 90%;
/* <-- because IE is a glue sniffing idiot */ }
.modal-popup[modal-theme="theme-default"] .modal-outer {
box-shadow: 1px 1px 50px rgba(0, 0, 0, 0.75);
border-radius: 10px; }
.modal-popup[modal-theme="theme-default"] .modal-inner {
position: relative;
background-color: #fff; }
.modal-popup[modal-theme="theme-default"] .content {
width: 100%;
max-width: 650px;
margin: 0 auto; }
.modal-popup[modal-theme="theme-default"] .content img[async-output] {
transition: opacity 2.5s ease;
opacity: 0;
height: auto !important; }
.modal-popup[modal-theme="theme-default"] .content img[async-output].async-loaded {
opacity: 1; }
.modal-popup[modal-theme="theme-default"] .content > *:last-child {
margin-bottom: 1.5em; }
@media (min-width: 48em) {
.modal-popup[modal-theme="theme-default"] {
width: 95%;
top: 4vh;
bottom: 4vh; } }
@media (min-width: 100em) {
.modal-popup[modal-theme="theme-default"] {
max-width: 800px; } }
.modal-popup[modal-theme="theme--add-snippet"] {
max-width: 1575px;
margin: 0 auto;
max-height: none !important;
height: 93%;
width: 92%;
/* <-- because IE is a glue sniffing idiot */ }
.modal-popup[modal-theme="theme--add-snippet"] .modal-content-container {
padding: 3.5vh 3.5vw; }
.modal-popup[modal-theme="theme--add-snippet"] .modal-nav {
top: 0;
right: 0; }
.modal-popup[modal-theme="theme--add-snippet"] .close-button {
border-radius: 0;
background-color: #fff;
color: #888888;
border-radius: 0 5px 0 0; }
@media (max-width: 55em) {
.modal-popup[modal-theme="theme--add-snippet"] .close-button {
box-shadow: inset 0 0 0 1px #f0f0f0; } }
.modal-popup[modal-theme="theme--add-snippet"] .modal-outer {
box-shadow: 1px 1px 50px rgba(0, 0, 0, 0.75);
border-radius: 5px; }
.modal-popup[modal-theme="theme--add-snippet"] .modal-inner {
position: relative;
background-color: #fff; }
.modal-popup[modal-theme="theme--add-snippet"] .content h2 {
color: #2d97cc; }
.modal-popup[modal-theme="theme--add-snippet"] .main {
padding-top: .2em; }
.modal-popup[modal-theme="theme--add-snippet"] .footer-nav {
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 2;
padding-right: 1.5em;
padding-bottom: .25em;
/* MOBILE OVERRIDE */ }
.modal-popup[modal-theme="theme--add-snippet"] .footer-nav .buttons-on-right {
text-align: right; }
.modal-popup[modal-theme="theme--add-snippet"] .flex-nav .nav-link.label {
align-items: center; }
.modal-popup[modal-theme="theme--add-snippet"] .flex-nav .nav-link.label h2 {
color: #2d97cc; }
.modal-popup[modal-theme="theme--add-snippet"] .module-list.layout-snippet-preview-list .loading-spinner-v2 {
padding-top: 15vh; }
.modal-popup[modal-theme="theme--add-snippet"] .module-list.layout-snippet-preview-list .no-results {
margin-top: 10vh; }
.modal-popup[modal-theme="theme--add-snippet"] .module-list.layout-snippet-preview-list .module-flex {
flex: 1 1 200px;
margin: 0 .5% .75em .5%;
font-size: .9em;
max-width: 49%;
/*&:nth-child(4n-7) { margin-left: 0; }
&:nth-child(4n) { margin-right: 0; }*/ }
@media (min-width: 37.5em) {
.modal-popup[modal-theme="theme--add-snippet"] .module-list.layout-snippet-preview-list .module-flex {
max-width: 32.33333%; } }
@media (min-width: 55em) {
.modal-popup[modal-theme="theme--add-snippet"] .module-list.layout-snippet-preview-list .module-flex {
flex: 0 1 24%;
max-width: 24%; } }
@media (min-width: 118.75em) {
.modal-popup[modal-theme="theme--add-snippet"] .module-list.layout-snippet-preview-list .module-flex {
font-size: 1.05em; } }
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
.modal-popup[modal-theme="theme--add-snippet"] {
/* IE DOESN'T LIKE FIXED RELATIVE POSITIONING INSIDE A CONTAINER */ }
.modal-popup[modal-theme="theme--add-snippet"] .footer-nav {
position: relative;
left: auto;
padding-right: 0; } }
html.modal-active.show-modal-popup {
overflow: hidden; }
html.modal-active.show-modal-popup body {
overflow: hidden; }
html.modal-active.show-modal-popup .modal {
display: block;
opacity: 1; }
html.modal-active.show-modal-popup .modal-popup.ready {
z-index: 1003;
transform: scale(1) translateY(0px);
opacity: 1; }
html.modal--add-snippet-active .modal {
background-color: rgba(0, 0, 0, 0.75);
z-index: 1002; }
@keyframes lds-roller {
0% {
transform: rotate(0deg); }
100% {
transform: rotate(360deg); } }
.loading-spinner-v2 {
display: inline-block;
position: relative;
width: 80px;
height: 80px;
margin: .5em auto 2.5em auto; }
.loading-spinner-v2 div {
transform-origin: 40px 40px;
animation-duration: 1.25s;
animation-timing-function: cubic-bezier(0.26, 0.31, 0.13, 0.83);
animation-iteration-count: infinite; }
.loading-spinner-v2 div:after {
content: " ";
display: block;
position: absolute;
width: 7px;
height: 7px;
border-radius: 50%;
background: #888888;
margin: -4px 0 0 -4px; }
.loading-spinner-v2 div:nth-child(1) {
animation-delay: -0.036s; }
.loading-spinner-v2 div:nth-child(1):after {
top: 63px;
left: 63px; }
.loading-spinner-v2 div:nth-child(2) {
animation-delay: -0.072s; }
.loading-spinner-v2 div:nth-child(2):after {
top: 68px;
left: 56px; }
.loading-spinner-v2 div:nth-child(3) {
animation-delay: -0.108s; }
.loading-spinner-v2 div:nth-child(3):after {
top: 71px;
left: 48px; }
.loading-spinner-v2 div:nth-child(4) {
animation-delay: -0.144s; }
.loading-spinner-v2 div:nth-child(4):after {
top: 72px;
left: 40px; }
.loading-spinner-v2 div:nth-child(5) {
animation-delay: -0.18s; }
.loading-spinner-v2 div:nth-child(5):after {
top: 71px;
left: 32px; }
.loading-spinner-v2 div:nth-child(6) {
animation-delay: -0.216s; }
.loading-spinner-v2 div:nth-child(6):after {
top: 68px;
left: 24px; }
.loading-spinner-v2 div:nth-child(7) {
animation-delay: -0.252s; }
.loading-spinner-v2 div:nth-child(7):after {
top: 63px;
left: 17px; }
.loading-spinner-v2 div:nth-child(8) {
animation-delay: -0.288s; }
.loading-spinner-v2 div:nth-child(8):after {
top: 56px;
left: 12px; }
#admin-modal {
transform: scale(0);
transition: transform ease 0.4s;
height: 0;
opacity: 0;
position: absolute;
width: 100%;
z-index: 900;
height: 100%;
background: rgba(255, 255, 255, 0.9);
display: flex;
justify-content: flex-start;
align-content: flex-start;
align-items: flex-start; }
#admin-modal.active {
position: fixed;
transform: scale(1);
height: 100vh;
opacity: 1;
pointer-events: auto; }
@media (min-width: 37.5em) {
#admin-modal {
flex: 1 1 100%;
justify-content: center;
align-content: center;
align-items: center; } }
#admin-modal .content {
z-index: 9000;
display: flex;
align-items: center;
justify-content: center;
align-content: center;
height: 100%;
flex-flow: column wrap;
flex: 1 1 50%;
background: #ccc;
border-radius: 0;
width: 100%; }
@media (min-width: 37.5em) {
#admin-modal .content {
min-height: 20%;
height: 300px;
flex-flow: column nowrap;
flex: 0 1 25%;
background: #fff;
border: 1px solid #2d97cc;
border-top: 5px solid #2d97cc;
border-radius: 5px;
width: 50%;
min-width: 400px; } }
#admin-modal .content p {
padding: .75em; }
#admin-modal .content p.title {
font-size: 2em;
color: #2d97cc;
padding: 0 0 0em; }
body:has(#admin-modal.active) .admin-header {
transform: translateY(-100%);
transition: transform 1s ease; }
body:has(#admin-modal.active) .sticky-dash {
right: -490px !important; }
body:has(#admin-modal.active) #sticky-dash-modal.modal {
z-index: 1 !important;
pointer-events: none !important;
opacity: 0 !important; }
.APP-modal-active #APP-modal {
transform: scale(1);
height: 100%;
opacity: 1;
position: fixed; }
#APP-modal {
transform: scale(0);
transition: transform ease 0.4s;
height: 0;
opacity: 0;
cursor: default;
position: absolute;
width: 100%;
z-index: 900;
height: 100%;
background: rgba(255, 255, 255, 0.6);
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
align-content: flex-start;
@inlcude align-items(flex-start); }
@media (min-width: 37.5em) {
#APP-modal {
flex: 1 1 100%;
justify-content: center;
align-content: flex-start;
@inlcude align-items(flex-start); } }
#APP-modal .content {
z-index: 9000;
position: relative;
top: 4em;
height: 100%;
background: #fff;
border: 15px solid #ccc;
border-radius: 5px;
padding: 2em;
width: 100%; }
#APP-modal .content:after {
content: "";
position: absolute;
top: 0;
right: 0; }
@media (min-width: 37.5em) {
#APP-modal .content {
height: 90%;
width: 80%; } }
#APP-modal .content .close-btn {
position: absolute;
height: 50px;
width: 50px;
top: 0;
right: 0;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer; }
#APP-modal .content .close-btn .svg-container {
padding: 15px; }
#APP-modal .content .close-btn .svg-container .svg-icon {
fill: #2d97cc; }
#APP-modal .content header {
flex: 1 1 100%;
border-bottom: 1px solid #DCDCDC; }
#APP-modal .content .content-inner-flex {
display: flex;
flex-flow: row wrap;
height: 100%;
max-height: 100%;
overflow: auto; }
#APP-modal .content .flex-col {
flex: 1 1 100%;
margin: 0 .25%;
overflow-y: auto;
height: 100%;
max-height: 100%; }
#APP-modal .content .flex-col .flex-group, #APP-modal .content .flex-col .flex-nav {
padding: 0 1em; }
#APP-modal .content .flex-col .flex-group:nth-of-type(even), #APP-modal .content .flex-col .flex-nav:nth-of-type(even) {
background: #f0f0f0; }
#APP-modal .content .flex-col .flex-group .sub-group:first-of-type, #APP-modal .content .flex-col .flex-nav .sub-group:first-of-type {
border-bottom: 1px solid #ccc; }
#APP-modal .content .flex-col label {
font-weight: 700; }
#APP-modal .content .flex-col label:after {
content: " -"; }
#APP-modal .content .flex-col .value {
padding: .2em .5em;
margin-bottom: .2em;
display: inline-block; }
@media (min-width: 48em) {
#APP-modal .content .flex-col {
flex: 1 1 48%; } }
#APP-modal .content p {
padding: .75em; }
#APP-modal .content p.title {
font-size: 2em;
color: #2d97cc;
padding: 0 0 0em; }
#APP-modal .flex-form.additional-date-container {
width: 100%; }
.event-modal-active #event-modal {
transform: scale(1);
height: 100%;
opacity: 1;
position: fixed;
top: 4em;
left: 0; }
#event-modal {
transform: scale(0);
transition: transform ease 0.4s;
height: 0;
opacity: 0;
cursor: default;
position: absolute;
width: 100%;
z-index: 900;
height: 100%;
background: rgba(255, 255, 255, 0.6);
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
align-content: flex-start;
@inlcude align-items(flex-start); }
#event-modal .loader-box {
position: relative; }
#event-modal .loader-box .buttons-on-right.top-right-position {
position: relative; }
@media (min-width: 55em) {
#event-modal .loader-box .buttons-on-right.top-right-position {
position: absolute;
top: 0;
right: 0; } }
@media (min-width: 37.5em) {
#event-modal {
flex: 1 1 100%;
justify-content: center;
align-content: flex-start;
@inlcude align-items(flex-start); } }
#event-modal .content {
z-index: 9000;
position: relative;
top: 1em;
height: 100%;
background: #fff;
border: 15px solid #ccc;
border-radius: 5px;
padding: 2em;
width: 100%; }
#event-modal .content:after {
content: "";
position: absolute;
top: 0;
right: 0; }
@media (min-width: 37.5em) {
#event-modal .content {
height: 90%;
width: 80%; } }
#event-modal .content .close-btn {
position: absolute;
height: 50px;
width: 50px;
top: 0;
right: 0;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer; }
#event-modal .content .close-btn .svg-container {
padding: 15px; }
#event-modal .content .close-btn .svg-container .svg-icon {
fill: #2d97cc; }
#event-modal .content header {
flex: 1 1 100%;
border-bottom: 1px solid #DCDCDC; }
#event-modal .content .content-inner-flex {
display: flex;
flex-flow: row wrap;
height: 100%;
max-height: 100%; }
#event-modal .content .flex-col {
flex: 1 1 100%;
margin: 0 .25%;
overflow-y: auto;
height: 100%;
max-height: 100%; }
#event-modal .content .flex-col .flex-group, #event-modal .content .flex-col .flex-nav, #event-modal .content .flex-col .flex-nav {
padding: 0 1em; }
#event-modal .content .flex-col .flex-group:nth-of-type(2n), #event-modal .content .flex-col .flex-nav:nth-of-type(2n), #event-modal .content .flex-col .flex-nav:nth-of-type(2n) {
background: #f0f0f0; }
#event-modal .content .flex-col .flex-group .sub-group:first-of-type, #event-modal .content .flex-col .flex-nav .sub-group:first-of-type, #event-modal .content .flex-col .flex-nav .sub-group:first-of-type {
border-bottom: 1px solid #ccc; }
/* #event-modal .content .flex-col label {
font-weight: 700
} */
/* #event-modal .content .flex-col label:after {
content: " -"
} */
#event-modal .content .flex-col .value {
padding: .2em .5em;
margin-bottom: .2em;
display: inline-block; }
@media (min-width: 48em) {
#event-modal .content .flex-col {
flex: 1 1 48%; } }
#event-modal .content p {
padding: .75em; }
#event-modal .content p.title {
font-size: 2em;
color: #2d97cc;
padding: 0 0 0em; }
#event-modal .theme-grey-700 h4 {
color: #000;
font-weight: 700; }
.loader-box {
padding: 1em; }
.popover {
position: absolute;
top: 0;
left: 0;
z-index: 1060;
display: none;
max-width: 300;
padding: 1px;
/*font-family: 'Lato', sans-serif;*/
font-family: 'figtree', sans-serif;
font-size: 1em;
font-weight: normal;
line-height: 1em;
text-align: left;
background-color: #fff;
background-clip: padding-box;
border: 1px solid #fff;
border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: 10px;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
white-space: normal; }
.popover.top {
margin-top: -10px; }
.popover.right {
margin-left: 10px; }
.popover.bottom {
margin-top: 10px; }
.popover.left {
margin-left: -10px; }
.popover-title {
margin: 0;
padding: 8px 14px;
color: #464646;
font-size: 1em;
background-color: #e9e9e9;
border-bottom: 1px solid gainsboro;
border-radius: 9px 9px 0 0; }
.popover-content {
padding: 9px 14px; }
.popover > .arrow, .popover > .arrow:after {
position: absolute;
display: block;
width: 0;
height: 0;
border-color: transparent;
border-style: solid; }
.popover > .arrow {
border-width: 11px; }
.popover > .arrow:after {
border-width: 10px;
content: ""; }
.popover.top > .arrow {
left: 50%;
margin-left: -11px;
border-bottom-width: 0;
border-top-color: #fff;
border-top-color: rgba(0, 0, 0, 0.25);
bottom: -11px; }
.popover.top > .arrow:after {
content: " ";
bottom: 1px;
margin-left: -10px;
border-bottom-width: 0;
border-top-color: rgba(0, 0, 0, 0.25); }
.popover.right > .arrow {
top: 50%;
left: -11px;
margin-top: -11px;
border-left-width: 0;
border-right-color: #fff;
border-right-color: rgba(0, 0, 0, 0.25); }
.popover.right > .arrow:after {
content: " ";
left: 1px;
bottom: -10px;
border-left-width: 0;
border-right-color: rgba(0, 0, 0, 0.25); }
.popover.bottom > .arrow {
left: 50%;
margin-left: -11px;
border-top-width: 0;
border-bottom-color: #fff;
border-bottom-color: rgba(0, 0, 0, 0.25);
top: -11px; }
.popover.bottom > .arrow:after {
content: " ";
top: 1px;
margin-left: -10px;
border-top-width: 0;
border-bottom-color: rgba(0, 0, 0, 0.25); }
.popover.left > .arrow {
top: 50%;
right: -11px;
margin-top: -11px;
border-right-width: 0;
border-left-color: #fff;
border-left-color: rgba(0, 0, 0, 0.25); }
.popover.left > .arrow:after {
content: " ";
right: 1px;
border-right-width: 0;
border-left-color: rgba(0, 0, 0, 0.25);
bottom: -10px; }
/*# INSET LABELS
```
$
```*/
.inset-label-container {
display: table;
position: relative;
width: 100%; }
.inset-label-container.break-buttons-sm {
display: block; }
@media (min-width: 25em) {
.inset-label-container.break-buttons-sm {
display: table; } }
.inset-label {
background: none repeat scroll 0 0 #F2F2F2;
border: 1px solid #d3d3d3;
display: table-cell;
font-weight: 700;
padding: 0 15px;
vertical-align: middle;
white-space: nowrap;
width: 1%;
min-width: 1%;
border-radius: 4px 0 0 4px !important; }
.inset-label.align-top {
vertical-align: top;
padding-top: .5em; }
@media (min-width: 37.5em) {
.inset-label {
width: 14%;
min-width: 14%; } }
.inset-label.button {
font-weight: 300; }
.inset-label.button input {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
width: 100%;
background-color: transparent;
color: #fff;
border: none;
margin: 0;
padding: 0;
cursor: pointer;
font-size: .8em; }
.inset-label.button input.hide-input {
position: static;
opacity: 1;
color: inherit; }
.inset-label.buttons {
display: flex !important;
width: 100%;
border-radius: 0 !important;
border-left: none;
border-top: none;
padding: 0; }
.inset-label.buttons .button,
.inset-label.buttons .svg-container {
flex: 1 1 auto;
border-left: 1px solid #d3d3d3;
cursor: pointer; }
.inset-label.buttons .button:hover,
.inset-label.buttons .svg-container:hover {
background-color: white; }
.inset-label.buttons .button:first-child,
.inset-label.buttons .svg-container:first-child {
border-left: none; }
.inset-label-input {
background: none repeat scroll 0 0 #F2F2F2;
border: 1px solid #d3d3d3;
display: table-cell;
float: left;
margin-bottom: 0 !important;
position: relative;
width: 100%;
z-index: 2;
border-radius: 0 4px 4px 0 !important; }
.inset-label-input input, .inset-label-input select {
margin-bottom: 0 !important;
border: none !important; }
.inset-label-container-right .inset-label {
border-radius: 0 4px 4px 0 !important; }
.inset-label-container-right .inset-label-input {
border-radius: 4px 0 0 4px !important;
border-right: none; }
.inset-label-container-both .inset-label-left {
border-radius: 4px 0 0 4px !important; }
.inset-label-container-both .inset-label-input {
border-radius: 0 !important;
border-left: 0; }
.inset-label-container-both .inset-label-right {
border-radius: 0 4px 4px 0 !important;
margin-left: -1px; }
.inset-label-sandwiched {
display: table-cell;
vertical-align: middle;
text-align: center; }
.inset-label-sandwiched .inset-label-input {
border-left: 1px solid #d3d3d3; }
.inset-label-sandwiched .inset-label {
border-radius: 0 !important; }
.inset-label-sandwiched .inset-label:last-child {
border-radius: 0 4px 4px 0 !important; }
.inset-label-container.wrappable {
display: flex;
flex-flow: row wrap; }
.inset-label-container.wrappable .inset-label {
display: flex !important;
flex: 1 1 100px; }
.inset-label-container.wrappable .inset-label-inner {
flex: 1 1 auto;
align-self: center; }
.inset-label-container.wrappable > * {
align-self: stretch; }
.inset-label-container.wrappable input,
.inset-label-container.wrappable select {
flex: 1 1 200px; }
.inset-label-container.wrappable.auto-sized-labels .inset-label {
flex-basis: auto;
width: auto;
padding: 5px;
white-space: normal;
max-width: 100%; }
.inset-label-container.wrappable.auto-sized-labels input,
.inset-label-container.wrappable.auto-sized-labels select {
flex-basis: 350px; }
.roll-link {
display: inline-block;
overflow: hidden;
/*color: $grey-400;*/
vertical-align: top;
border-bottom: none; }
.roll-link span {
display: block !important;
padding: 0 2px;
position: relative;
transform-origin: 50% 0 0;
transform-style: preserve-3d;
transition: all 400ms ease 0s; }
.roll-link span:after {
/*background: none repeat scroll 0 0 $brand-a;*/
color: #fff;
content: attr(data-title);
display: block;
left: 0;
padding: 0 2px;
position: absolute;
top: 100%;
transform: rotateX(-90deg);
transform-origin: 50% 0 0;
white-space: nowrap; }
.roll-link.fast_button_active span {
padding: 0 7px;
transform: translateY(0%) rotateX(90deg);
/*background: lighten($green, 40) !important; color: $text-color !important;*/ }
.roll-link.fast_button_active span:after {
padding: 0 7px;
/*background: lighten($green, 40); color: $text-color;*/ }
.roll-link:hover span {
padding: 0 7px;
transform: translateY(0%) rotateX(90deg); }
.roll-link:hover span:after {
padding: 0 7px; }
.fade {
opacity: 0;
transition: opacity 0.15s linear !important; }
.fade.in {
opacity: 1; }
.collapse {
display: none; }
.collapse.in {
display: block; }
tr.collapse.in {
display: table-row; }
tbody.collapse.in {
display: table-row-group; }
.collapsing {
position: relative;
height: 0;
overflow: hidden;
transition: all 0.35s ease !important; }
.responsiveTb {
z-index: 10;
width: 100%; }
@media (max-width: 48em) {
.responsiveTb {
z-index: 5; }
.responsiveTb, .responsiveTb tbody, .responsiveTb tbody > td, .responsiveTb thead > tr, .responsiveTb tbody > tr {
display: block;
/* for ie9 and below */
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: borer-box;
/*float: left;*/
clear: left; }
.responsiveTb {
border-spacing: 0;
border-collapse: collapse;
border-color: transparent;
min-width: 300px;
width: 100%; }
.responsiveTb thead {
display: none; }
.responsiveTb tbody > tr {
padding: 20px;
position: relative;
cursor: pointer !important;
/* for ie9 and below */
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box; }
/* setting row header for mobile accordion */
.responsiveTb tbody > tr:before {
content: attr(data-head); }
/* setting row arrow for mobile accordion */
.responsiveTb tbody > tr:after {
content: '';
display: block;
background: url(/images/admin/arrow-down.svg);
position: absolute;
top: 20px;
right: 20px;
width: 20px;
height: 20px; }
.responsiveTb tbody > tr:nth-child(odd) {
background-color: #f0f0f0; }
.responsiveTb tbody > tr.visible td {
display: block !important; }
.responsiveTb .visible:after {
background: url(/images/admin/arrow-up.svg); }
#body .responsiveTb tbody tr.visible td {
border-bottom: 1px solid #d3d3d3 !important; }
.responsiveTb tr.visible td:first-child {
margin-top: 20px;
padding-top: 20px;
border-top: 1px solid #464646 !important; }
.responsiveTb > tbody > tr > td {
text-align: center !important;
overflow: hidden;
display: none;
width: 100%;
clear: both;
cursor: default;
padding: 20px 5px !important; }
.responsiveTb td[data-title] {
text-align: right !important; }
/* setting table data titles on mobile version */
.responsiveTb td:before {
content: attr(data-title);
float: left;
font-weight: 700; }
.responsiveTb .button {
margin: 0; }
/* nested tables */
.responsiveTb td table tr {
padding: 0 !important; }
.responsiveTb td table tr:after {
background-image: none; }
.responsiveTb td table tr td {
text-align: right !important; }
.responsiveTb td table tr td:first-child {
margin-top: 0 !important;
padding-top: 0 !important; }
.responsiveTb tr.visible td table {
width: 75%;
float: right; }
/*.responsiveTb tr.visible td table tr { display: table-row !important; }*/
.responsiveTb tr.visible td table td {
display: inline-block !important;
width: auto !important;
padding: 0px 5px !important; }
#body .responsiveTb tr.visible td table td {
border-bottom: none !important; }
.responsiveTb tr.visible td table td:first-child {
border-top: none !important; } }
@-webkit-keyframes uil-facebook {
0% {
-ms-transform: scale(2);
-moz-transform: scale(2);
-webkit-transform: scale(2);
-o-transform: scale(2);
transform: scale(2); }
90% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); }
100% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); } }
@-webkit-keyframes uil-facebook {
0% {
-ms-transform: scale(2);
-moz-transform: scale(2);
-webkit-transform: scale(2);
-o-transform: scale(2);
transform: scale(2); }
90% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); }
100% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); } }
@-moz-keyframes uil-facebook {
0% {
-ms-transform: scale(2);
-moz-transform: scale(2);
-webkit-transform: scale(2);
-o-transform: scale(2);
transform: scale(2); }
90% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); }
100% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); } }
@-ms-keyframes uil-facebook {
0% {
-ms-transform: scale(2);
-moz-transform: scale(2);
-webkit-transform: scale(2);
-o-transform: scale(2);
transform: scale(2); }
90% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); }
100% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); } }
@-moz-keyframes uil-facebook {
0% {
-ms-transform: scale(2);
-moz-transform: scale(2);
-webkit-transform: scale(2);
-o-transform: scale(2);
transform: scale(2); }
90% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); }
100% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); } }
@-webkit-keyframes uil-facebook {
0% {
-ms-transform: scale(2);
-moz-transform: scale(2);
-webkit-transform: scale(2);
-o-transform: scale(2);
transform: scale(2); }
90% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); }
100% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); } }
@-o-keyframes uil-facebook {
0% {
-ms-transform: scale(2);
-moz-transform: scale(2);
-webkit-transform: scale(2);
-o-transform: scale(2);
transform: scale(2); }
90% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); }
100% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); } }
@keyframes uil-facebook {
0% {
-ms-transform: scale(2);
-moz-transform: scale(2);
-webkit-transform: scale(2);
-o-transform: scale(2);
transform: scale(2); }
90% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); }
100% {
-ms-transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); } }
.loader {
background: none;
position: relative;
width: 200px;
height: 200px; }
.loader > div {
position: absolute;
width: 40px;
height: 60%;
top: 20%;
left: 20px;
background: #464646;
opacity: 0.6;
-ms-animation: uil-facebook 1s cubic-bezier(0.01, 0.73, 0.28, 0.93) infinite;
-moz-animation: uil-facebook 1s cubic-bezier(0.01, 0.73, 0.28, 0.93) infinite;
-webkit-animation: uil-facebook 1s cubic-bezier(0.01, 0.73, 0.28, 0.93) infinite;
-o-animation: uil-facebook 1s cubic-bezier(0.01, 0.73, 0.28, 0.93) infinite;
animation: uil-facebook 1s cubic-bezier(0.01, 0.73, 0.28, 0.93) infinite; }
.loader > div:nth-of-type(2) {
left: 80px;
opacity: 0.8;
-ms-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-webkit-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s; }
.loader > div:nth-of-type(3) {
left: 140px;
opacity: 0.9;
-ms-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-webkit-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s; }
.loading-container {
position: absolute;
z-index: 100;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(255, 255, 255, 0.6);
display: flex;
align-items: center; }
.loading-container .loader {
height: 100%;
max-height: 200px;
margin: 0 auto; }
.loading-container.fix-top {
align-items: flex-start; }
.loading-container.fix-top .loader {
top: 50px; }
.table,
.dataTable {
border-collapse: collapse; }
.table thead tr,
.dataTable thead tr {
border-bottom: 1px solid black; }
.table th, .table td,
.dataTable th,
.dataTable td {
padding: 10px; }
.overflow-wrapper {
overflow-x: scroll; }
.dataTables_paginate.paging_simple_numbers .paginate_button {
margin-left: .25em;
cursor: pointer; }
.dataTables_paginate.paging_simple_numbers .paginate_button.previous {
margin-left: 0; }
.dataTables_info {
border-left: 2px solid #d3d3d3;
padding: .25em 0 .25em .5em; }
.dataTables_filter input {
margin-left: .35em; }
table.align-cells__top tbody td {
vertical-align: top; }
/* used to set some elements that would collapse on themselves without it aka - custom-select and tickbox in a layout form. */
textarea {
min-height: 175px; }
:-moz-placeholder {
font-style: italic;
line-height: inherit;
font-family: inherit;
height: inherit; }
::-moz-placeholder {
font-style: italic;
line-height: inherit;
font-family: inherit;
height: inherit; }
:-ms-input-placeholder {
font-style: italic;
line-height: inherit;
font-family: inherit;
height: inherit; }
::-webkit-input-placeholder {
font-style: italic;
line-height: inherit;
font-family: inherit;
height: inherit; }
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
color: #888888; }
input:-moz-placeholder, textarea:-moz-placeholder {
color: #888888; }
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
color: #888888; }
select,
textarea,
input[type="text"],
input[type="number"],
input[type='password'] {
display: block;
width: 100%;
margin: 0 0 .75em 0;
padding: 5px;
line-height: 1.1;
outline: 0;
color: #464646;
background-color: #e9e9e9;
border: 2px solid transparent;
vertical-align: middle;
font-family: "Figtree", sans-serif;
font-size: 1.15em;
border-radius: 0; }
select,
input[type="text"],
input[type="number"],
input[type="password"] {
height: 42px; }
select[size] {
height: auto; }
select[multiple] {
height: 250px; }
select:focus,
textarea:focus,
input[type="text"]:focus,
input[type='password']:focus,
input[type="number"]:focus {
outline: thin dotted;
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px; }
input[type="radio"]:focus + label,
input[type="checkbox"]:focus + label {
font-weight: bold;
border-bottom: 1px solid #464646; }
input[type="radio"]:checked + label,
input[type="checkbox"]:checked + label {
color: #2d97cc;
font-weight: bold; }
input[type="file"]:focus {
outline: 0;
font-weight: bold; }
fieldset {
padding: .5em 1em 1em; }
legend {
font-size: 2em; }
input[disabled], select[disabled], textarea[disabled] {
opacity: .5;
cursor: not-allowed; }
.toggle-input-state.theme-input-inactive {
opacity: .5; }
.toggle-input-state.theme-input-inactive.toggled {
opacity: 1; }
/* 2021 --- Added a streamlined version of our standard form styling */
.form input[type="radio"], .form input[type="checkbox"] {
display: inline-block;
min-width: 0;
margin: 0;
padding: .5em;
line-height: inherit;
/* < this can be important depending on font used */
outline: none;
color: #464646;
background-color: #e9e9e9;
border: none;
vertical-align: middle;
font-family: "Figtree", sans-serif;
font-size: 1.15em;
border-radius: 0; }
.form .base-flex-class, .form .label-container, .form .tick-container {
flex: 1 1 0%; }
.form .base-flex-class-auto, .form .input {
display: flex;
flex-flow: row wrap;
flex: 1 1 auto;
max-width: 100%; }
.form .flex-item > label {
display: block; }
.form .flex-item input[type="radio"] + label,
.form .flex-item input[type="checkbox"] + label {
display: inline-block;
margin: 0 1em 0 .35em; }
.form .flex-item > div[style="clear:both;"] {
margin: 1em 0; }
.form .flex-item .legacy-tick-box {
display: flex;
flex-flow: row wrap;
width: 100%;
align-items: center; }
.form .flex-item .legacy-tick-box input[type="radio"],
.form .flex-item .legacy-tick-box input[type="checkbox"] {
flex: 0 1 auto;
width: .85em;
height: .85em; }
.form .flex-item .legacy-tick-box label {
flex: 0 1 auto; }
.form .input.disabled,
.form .flex-group.disabled,
.form .disabled.flex-nav {
opacity: .4;
pointer-events: none;
cursor: not-allowed !important; }
.form .flex-group, .form .flex-nav {
display: flex;
flex-flow: row wrap;
max-width: 100%; }
.form .flex-group select, .form .flex-nav select, .form .flex-group textarea, .form .flex-nav textarea, .form .flex-group input[type="text"], .form .flex-nav input[type="text"], .form .flex-group input[type='password'], .form .flex-nav input[type='password'] {
width: auto;
border: none;
padding: .5em;
outline: none;
min-width: 0; }
.form .flex-group .message, .form .flex-nav .message {
margin: 0;
text-align: left;
opacity: 0;
transform: translate(0%, 20%);
transition: all 0.3s ease;
box-shadow: 0px 0px 5px #d3d3d3; }
.form .flex-group.error label, .form .error.flex-nav label {
font-weight: 700;
color: #d14343; }
.form .flex-group.error input:focus, .form .error.flex-nav input:focus, .form .flex-group.error select:focus, .form .error.flex-nav select:focus, .form .flex-group.error textarea:focus, .form .error.flex-nav textarea:focus {
box-shadow: none; }
.form .flex-group.error input:focus + .message, .form .error.flex-nav input:focus + .message, .form .flex-group.error select:focus + .message, .form .error.flex-nav select:focus + .message, .form .flex-group.error textarea:focus + .message, .form .error.flex-nav textarea:focus + .message {
opacity: 1;
transform: translate(0%, 0%);
z-index: 10; }
.form .flex-group.required label:after, .form .required.flex-nav label:after {
content: '*';
color: #D14343;
margin-left: 3px; }
.form .flex-group.required .tick-box label:after, .form .required.flex-nav .tick-box label:after {
content: ''; }
.form .subgroup {
display: flex;
flex-flow: row wrap;
max-width: 100%;
flex: 1 1 250px; }
.form .subgroup > * {
align-self: center; }
.form .subgroup .text {
align-self: center;
text-align: center; }
.form .subgroup .tooltip,
.form .subgroup .tick-box {
flex: 1 1 auto; }
.form .input {
position: relative;
padding: 0.5em; }
.form .input > * {
flex: 1 1 100%; }
.form .input .text {
margin-top: 0;
margin-bottom: 0;
max-width: 100%; }
.form .input input,
.form .input select,
.form .input textarea,
.form .input .custom-select {
margin: 0;
max-width: 100%;
flex-basis: 225px; }
.form .input input[type="file"] {
width: 100%; }
.form .input .button {
flex-basis: 100px;
display: flex;
justify-content: center;
align-items: center; }
.form .input .button .text {
padding: 0;
line-height: inherit; }
.form .input .button.svg-container {
height: inherit;
padding: 0;
min-height: 40px; }
.form .input.centered {
flex-grow: 0;
margin-left: auto;
margin-right: auto; }
@media (min-width: 31.25em) {
.form .input {
flex-flow: row wrap; }
.form .input > * {
flex: 1 1 0%; }
.form .input .button {
flex-basis: 100px; } }
.form .input input + input,
.form .input input + select,
.form .input input + .custom-select,
.form .input select + input,
.form .input select + .custom-select,
.form .input select + select,
.form .input .custom-select + .custom-select {
margin-left: 1em; }
.form .text {
padding: 0.5em 0;
line-height: 1.15; }
.form .text.full {
min-width: 100%;
flex-basis: 100% !important; }
.form .label-container {
padding-bottom: 0;
padding-top: .5em;
align-self: stretch; }
.form .label-container label {
align-self: flex-start;
padding-top: .5em; }
.form.stacked .subgroup {
flex-basis: 100%; }
.form .tick-box {
padding: 0.5em;
position: relative; }
.form .tick-box .inner {
display: flex;
position: relative; }
.form .tick-box input {
-webkit-appearance: none;
-ms-appearance: none;
-moz-appearance: none;
background-color: transparent;
cursor: pointer;
position: absolute;
width: 100%;
height: 100%;
top: 0;
z-index: 2;
left: 0;
/* select arrow ie. */ }
.form .tick-box input::-ms-expand {
display: none; }
.form .tick-box .custom-input {
display: inline-block;
position: relative;
width: 16px;
height: 16px;
background-color: #fff;
border: 1px solid #d3d3d3;
align-self: center;
flex: 0 0 16px; }
.form .tick-box .custom-input:after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
transition: transform 350ms ease;
background-color: transparent;
transform: scale(0);
transform-origin: center; }
.form .tick-box input:checked + .inner .custom-input:after {
transform: scale(1);
/* browsers have a hard time getting this right if the scale is fraction.. */
background-color: #464646; }
.form .tick-box .label {
padding: 0 .5em;
align-self: center; }
.form .tick-box.center {
justify-content: center;
text-align: center; }
.form .tick-container {
padding: 0.5em;
position: relative; }
.form .tick-radios .custom-input {
border-radius: 50%; }
.form .tick-radios .custom-input:after {
border-radius: 50%; }
.form .tick-checkboxes .custom-input {
border-radius: 3px; }
.form .tick-checkboxes .custom-input:after {
border-radius: 3px; }
.form .tick-container.stacked .tick-box {
flex-basis: 100% !important;
min-width: 100%; }
.form .custom-select {
display: flex;
flex-flow: row wrap;
width: 100%;
max-width: 100%;
overflow: hidden;
min-height: 42px;
position: relative;
cursor: pointer;
background-color: #e9e9e9; }
.form .custom-select select {
position: absolute;
width: 100%;
height: 100%;
top: 0;
z-index: 2;
left: 0;
-webkit-appearance: none;
-ms-appearance: none;
-moz-appearance: none;
background-color: transparent;
cursor: pointer;
flex-basis: auto;
position: relative;
padding: 8px 28px 8px 8px;
min-height: 42px;
align-self: center; }
.form .custom-select select::-ms-expand {
display: none; }
.form .custom-select:after {
content: '';
position: absolute;
right: .5em;
top: 0;
bottom: 0;
margin: auto;
z-index: 0;
width: 30px;
height: 100%;
width: 0;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #2d97cc; }
.form .custom-select.inset {
padding: 0;
background-color: gainsboro; }
.form .custom-file {
position: relative;
background-color: #e9e9e9;
padding: 0;
flex: 1 1 100%;
/*@include flex(0 1 225px);*/
transition: background-color 0.4s ease; }
.form .custom-file input[type="file"] {
background-color: transparent;
border: none;
padding: .65em 1em;
opacity: 0;
cursor: pointer; }
.form .custom-file:before {
content: 'Browse Computer';
position: absolute;
top: 50%;
left: 0;
right: 0;
text-align: center;
color: #464646;
transform: translateY(-50%);
font-family: inherit;
font-weight: bold;
text-transform: uppercase;
cursor: pointer; }
.form .custom-file:hover, .form .custom-file:focus {
background-color: #636363; }
.form .custom-file:hover:before, .form .custom-file:focus:before {
color: #fff; }
.form .filename-element {
display: flex;
flex: 1 1 auto;
flex-flow: row wrap;
justify-content: center;
box-shadow: inset 0 0 0 2px #e9e9e9;
background-color: transparent;
font-size: .85em; }
.form .filename-element .file-name {
display: block;
flex: 1 1 100%;
padding: .35em;
text-align: center; }
.form .filename-element .file-name:nth-child(odd) {
border-top: 1px solid #e9e9e9;
border-bottom: 1px solid #e9e9e9; }
.form .filename-element .file-name:first-child {
border-top: none; }
.form .filename-element .file-name:last-child {
border-bottom: none; }
.message {
position: absolute;
left: 0.5em;
width: calc( 100% - 1em);
top: calc( 100% - 0.5em);
z-index: -1;
/*top: calc( 100% - 0.5em );*/ }
.error input, .error select, .error .custom-select, .error textarea {
background-color: #efbebe;
box-shadow: 0 0 0 2px #d14343; }
.error .custom-select select {
box-shadow: none; }
.error .message {
background-color: #d14343;
/*border-left: $error 5px solid;*/
color: #fff;
box-shadow: 1px 1px 2px #000;
/*border-left: 3px solid $error; border-right: 3px solid $error; border-bottom: 3px solid $error;*/
padding: .75em;
font-weight: bold; }
.success:before {
content: '\0A9A';
align-self: center; }
.form.theme-white input[type="text"], .form.theme-white input[type="password"], .form.theme-white select, .form.theme-white textarea {
background-color: #fff; }
.form.theme-white .custom-select {
background-color: #fff; }
.form.theme-white .custom-select select {
background-color: transparent; }
.form.theme-grey-400 input, .form.theme-grey-400 select, .form.theme-grey-400 textarea {
background-color: #e9e9e9;
color: #464646; }
.form.theme-grey-400 .custom-select select {
background-color: transparent;
border: none; }
.form.theme-grey-400 .custom-select:after {
border-top-color: #636363; }
/*
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
LEGACY FORM STYLES
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
*/
.form-row {
clear: both; }
.form-control input, .form-control select, .form-control textarea {
border: 1px solid #d3d3d3; }
.form-control input:focus, .form-control select:focus, .form-control textarea:focus {
border-color: #f0f0f0;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(240, 240, 240, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(240, 240, 240, 0.6); }
.form-control .inset-label .svg-container {
padding: 1.25em; }
.input-file {
display: flex;
flex-flow: row wrap; }
.input-file .custom-file {
position: relative;
background-color: #d3d3d3;
padding: 0;
flex: 0 1 225px;
transition: background-color 0.4s ease; }
.input-file .custom-file input[type="file"] {
background-color: transparent;
border: none;
padding: .65em 1em;
opacity: 0;
cursor: pointer;
width: 100%; }
.input-file .custom-file:before {
content: 'Browse Computer';
position: absolute;
top: 50%;
left: 0;
right: 0;
text-align: center;
color: #464646;
transform: translateY(-50%);
font-family: inherit;
font-weight: bold;
text-transform: uppercase;
cursor: pointer; }
.input-file .custom-file:hover, .input-file .custom-file:focus {
background-color: #636363; }
.input-file .custom-file:hover:before, .input-file .custom-file:focus:before {
color: #fff; }
.input-file .filename-element {
display: flex;
align-items: center;
border: 1px solid #d3d3d3;
background-color: #e9e9e9;
padding: 0 1em; }
.form-control.width-75,
.form-control.width-33,
.form-control.width-50,
.form-control.width-25 {
width: 100%; }
.form-control-label {
padding: 0;
line-height: 1.25;
color: #333;
vertical-align: middle;
/*font-family: 'Lato';*/
font-family: 'Figtree', sans-serif;
font-size: 1.15em;
white-space: normal;
display: inline-block;
margin: .75em .75em .25em .75em; }
.form-control-label.tooltip {
margin-top: 0.5em; }
.info-label {
display: block;
margin: .75em .75em .25em .75em;
line-height: 1.25;
padding: 1em; }
@media (min-width: 37.5em) {
.radOrBox-inline {
display: table;
width: 100%;
min-height: 95px;
padding: 1.5em .75em 1.5em .75em; }
.radOrBox-inline .radOrBox-header {
display: table-cell;
vertical-align: middle;
padding-right: 20px; }
.radOrBox-inline .radOrBox-list {
display: table-cell;
vertical-align: middle; } }
.radOrBox-inline.error {
border: 1px solid #d14343 !important; }
.radOrBox-header {
margin: 0.75em 0.75em 0.25em;
line-height: 1.25;
font-size: 1.15em; }
.radOrBox-list {
margin: 0 .75em;
overflow: hidden; }
.radOrBox {
float: left;
margin: 0 10px 5px 0px;
width: auto; }
.radOrBox.stacked {
float: none; }
.img-preview.size-default {
max-width: 350px; }
.error .radOrBox-container {
border: 2px solid #d14343; }
.error .radOrBox-header {
color: #d14343;
font-weight: 700; }
.error > .form-control-label {
color: #d14343;
font-weight: 700; }
.error > input, .error > select, .error > textarea {
border-color: #d14343;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(209, 67, 67, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(209, 67, 67, 0.6); }
.error > input:focus, .error > select:focus, .error > textarea:focus {
border-color: #d14343;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(209, 67, 67, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(209, 67, 67, 0.6); }
.warning .radOrBox-container {
border: 2px solid #f1c74f; }
.warning .radOrBox-header {
color: #f1c74f;
font-weight: 700; }
.warning > .form-control-label {
color: #f1c74f;
font-weight: 700; }
.warning > input, .warning > select, .warning > textarea {
border-color: #f1c74f;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(241, 199, 79, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(241, 199, 79, 0.6); }
.warning > input:focus, .warning > select:focus, .warning > textarea:focus {
border-color: #f1c74f;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(241, 199, 79, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(241, 199, 79, 0.6); }
.success .radOrBox-container {
border: 2px solid #9bc84a; }
.success .radOrBox-header {
color: #9bc84a;
font-weight: 700; }
.success > .form-control-label {
color: #9bc84a;
font-weight: 700; }
.success > input, .success > select, .success > textarea {
border-color: #9bc84a;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(155, 200, 74, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(155, 200, 74, 0.6); }
.success > input:focus, .success > select:focus, .success > textarea:focus {
border-color: #9bc84a;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(155, 200, 74, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(155, 200, 74, 0.6); }
@media (min-width: 70.625em) {
.form-max-width {
max-width: 1000px;
margin: 0 auto; }
.form,
.form-control {
overflow: hidden; }
.form-control.has-tooltip {
overflow: visible; }
.form .fileupload,
.form .checkboxlist,
.form .radiobuttonlist {
margin: 0 0 .75em 30%; } }
@media (min-width: 70.625em) {
.form-right-aligned .label, .form-right-aligned .form-control-label {
width: 30%;
float: left;
padding-right: 5%;
margin: 0;
text-align: right; }
.form-right-aligned .textbox,
.form-right-aligned .listbox,
.form-right-aligned .textarea,
.form-right-aligned .fileupload,
.form-right-aligned .dropdownlist,
.form-right-aligned .radiobuttonlist {
width: 70%;
margin-left: 30%; }
.form-right-aligned .button {
display: block;
margin: 0 0 .75em 30%; } }
.form-flex .form-control {
width: 100%;
padding: .5em; }
.form-flex .form-control .flex-item.inline-buttons {
display: flex;
flex-flow: row wrap;
max-width: 100%; }
.form-flex .form-control .flex-item.inline-buttons .form-control-label {
flex-basis: 100%; }
.form-flex .form-control .flex-item.inline-buttons input:not(.button) {
margin: 0;
max-width: 100%;
flex: 1 1 auto;
flex-basis: 225px; }
.form-flex .form-control .flex-item.inline-buttons input.button {
margin: 0 5px;
padding: 0 1em; }
.form-flex .form-control .flex-item .input .custom-file {
display: inline-block; }
.form-flex input, .form-flex select, .form-flex textarea {
margin-bottom: 0; }
.form-flex .form-control.flex-item {
align-items: flex-end;
-webkit-align-items: flex-end;
-ms-align-items: flex-end; }
.range-container {
float: left;
width: 86%;
margin: 1em 7%;
height: 1em;
background-color: #d3d3d3;
transition: background-color 0.5s ease;
border-radius: .75em;
position: relative; }
.range-container .range {
display: block;
width: 100%;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
padding: 0;
-webkit-appearance: none;
background: transparent;
z-index: 5;
/* RESET */
/* THUMB */
/* TRACK */
/* TRACK | FOCUS */ }
.range-container .range:focus {
outline: none; }
.range-container .range::-webkit-slider-thumb {
-webkit-appearance: none; }
.range-container .range::-ms-tooltip {
display: none; }
.range-container .range::-webkit-slider-thumb {
width: 4em;
height: 2em;
margin-top: -.5em;
background: transparent;
-webkit-appearance: none;
cursor: pointer;
border: none;
outline: none; }
.range-container .range::-moz-range-thumb {
width: 4em;
height: 2em;
background: transparent;
cursor: pointer;
border: none;
border-radius: 0; }
.range-container .range::-ms-thumb {
width: 4em;
height: 2em;
background: transparent;
cursor: pointer;
border: none; }
.range-container .range::-webkit-slider-runnable-track {
width: 100%;
height: 1em;
background: transparent;
cursor: pointer; }
.range-container .range::-moz-range-track {
width: 100%;
height: 1em;
background: transparent;
cursor: pointer;
outline: none;
border: none; }
.range-container .range::-ms-track {
width: 100%;
height: 1em;
border-width: 0;
background: transparent;
color: transparent;
cursor: pointer; }
.range-container .range::-ms-fill-lower {
background: transparent; }
.range-container .range::-ms-fill-upper {
background: transparent; }
.range-container .range::-moz-focus-outer {
border: 0; }
.range-container .range:-moz-focusring {
outline: none; }
.range-container .range:hover ~ .range-thumb {
background-color: #2478a2; }
.range-container .track-fill {
position: absolute;
top: 0;
bottom: 0;
left: 0;
height: 100%;
z-index: 2;
background-color: #888888;
border-radius: .75em; }
.range-container .range-thumb {
position: absolute;
top: -.35em;
bottom: -.35em;
z-index: 3;
width: 4em;
margin-left: -2em;
left: 50%;
border-radius: 25px;
transition: transform 0.35s ease, background-color 0.4s ease;
background-color: #2d97cc;
box-shadow: -1px 1px 1px 0px rgba(0, 0, 0, 0.75);
pointer-events: none; }
.range-container .range-thumb:before {
content: '';
position: absolute;
left: -.125em;
top: 0;
bottom: 0;
width: 1px;
height: 1px;
border: .4em solid transparent;
border-right-color: #fff;
margin: auto; }
.range-container .range-thumb:after {
content: '';
position: absolute;
right: -.125em;
top: 0;
bottom: 0;
width: 1px;
height: 1px;
border: .4em solid transparent;
border-left-color: #fff;
margin: auto; }
.range-container .range-thumb .text {
color: #fff;
text-transform: uppercase;
font-size: .9em;
position: absolute;
top: 50%;
left: 50%;
line-height: 1;
height: 1em;
transform: translateX(-50%) translateY(-50%);
display: inline-block; }
.range-container .range-thumb .text[type="dollar"]:before {
content: '$'; }
.range-container .range-thumb .text[type="year"]:after {
content: ' yrs.';
text-transform: lowercase;
font-size: .9em; }
.range-container .range-thumb .text[type="month"]:after {
content: ' mo.';
text-transform: lowercase;
font-size: .9em; }
.range-container .range-thumb .text[type="percent"]:after {
content: '%';
text-transform: lowercase;
font-size: .9em; }
.range-container .range-thumb .text[type="word"] {
font-size: .85em;
text-transform: none; }
.range-container.active .range-thumb {
transform: scale(1.05); }
.range-container.focused {
background-color: #d3d3d3; }
.precise-time {
overflow: hidden;
width: 100%; }
.precise-time-label {
width: 100%;
display: block;
/*font-family: 'Lato';*/
font-family: 'Montserrat', sans-serif;
font-size: 1.15em;
line-hegiht: 1.25em;
padding: 0;
margin: 0.75em 0.75em 0.25em 0.25em; }
.precise-time-select {
width: 30.66%;
float: left;
margin-left: 2%; }
.precise-time-select.first {
margin-left: 0; }
.precise-time-colon {
width: 2%;
float: left;
margin-left: 2%;
text-align: center;
height: 40px;
line-height: 40px; }
.form-builder .form-control {
padding: 0; }
.form-builder .form-skeleton {
min-height: 200px;
display: block;
width: 100%; }
.form-builder .form-skeleton .box-component:last-child {
margin-bottom: 0; }
.form-builder .form-controls-list {
width: 100%; }
.form-builder .form-controls-list-item,
.form-builder .form-controls-list-time.flex-item-conditional {
list-style: none;
background-color: #e9e9e9;
margin: 0 5px;
color: #464646;
border: 1px solid #c6c6c6;
margin-bottom: .5em;
padding: .5em;
flex: 1 1 240px; }
.form-builder .form-controls-list-item:hover {
background-color: gainsboro; }
.form-builder .radOrBox-inline {
padding: 0.5em 1em 0;
min-height: initial; }
.form-builder > .box:first-child .flex-container {
min-width: 100%;
margin-bottom: .15em; }
.form-builder > .box:first-child .flex-container:last-child {
margin-bottom: 0; }
.form-builder > .box {
min-width: 100%; }
.box-component-conditional {
background: #afd9ed;
margin: 1em 0;
padding: 1em;
position: relative;
overflow: hidden;
color: #464646;
border: 1px solid #68b6de; }
.box-component-conditional .box-component {
background-color: #fff; }
.box.box-grey-700 .box-component-conditional .box-controls .svg-container {
background: #fff !important; }
.box-component-outline {
box-shadow: 0 0 0 5px #2d97cc;
padding: 1em;
margin-bottom: 21px; }
.flex-item-conditional {
background-color: #afd9ed !important; }
.flex-item-conditional:hover {
background-color: #68b6de !important; }
.form-flex .flex-container.box header {
display: flex;
flex: 1 1 100%;
flex-flow: row wrap; }
.form-flex .flex-container.box header .box-title {
flex: 1 1 auto;
width: auto; }
.form-flex .flex-container.box header .buttons-on-right {
flex: 1 1 auto; }
.form-flex .flex-container.box .buttons-on-right {
flex: 1 1 100%; }
.form-control.flex-item.flex-container.tooltiphackadmin {
overflow: visible; }
.form-control.flex-item.flex-container.tooltiphackadmin .tooltip {
position: unset; }
.form-control.flex-item.flex-container.tooltiphackadmin .tooltip .tooltip-content {
white-space: normal;
font-weight: 400; }
.input[class*="icon-"] {
position: relative; }
.input[class*="icon-"]:before {
content: '';
height: calc(100% - 1em);
width: 30px;
position: absolute;
top: 0.5em;
bottom: 0.5em;
background-size: 80%;
background-position: center;
background-repeat: no-repeat; }
.input.icon-left input {
padding-left: 2em; }
.input.icon-left:before {
left: .75em; }
.input.icon-right input {
padding-right: 2em; }
.input.icon-right:before {
right: .75em; }
.form-group .edit-icon {
background-image: url(/images/admin/edit-icon.svg);
background-repeat: no-repeat;
background-position: center;
background-size: 12px; }
.form-group .edit-icon:hover {
background-image: url(/images/admin/edit-icon.svg) !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: 12px !important; }
.display-form-info .flex-item {
padding: .5em;
margin: .5em;
border: 1px solid #d3d3d3;
background-color: #f0f0f0; }
.display-form-info .heading {
font-weight: 700; }
.display-form-info .heading, .display-form-info .info {
margin-bottom: 0; }
.display-form-info .heading input[disabled], .display-form-info .info input[disabled] {
background: #e9e9e9; }
.display-form-info .heading input, .display-form-info .info input {
background: #ffffff; }
.knowledge-center-search-module.form .flex-group .subgroup, .knowledge-center-search-module.form .flex-nav .subgroup {
padding: 0 1em; }
.knowledge-center-search-module.form .flex-group .subgroup .input, .knowledge-center-search-module.form .flex-nav .subgroup .input {
border: 1px solid #87cbe5;
border-radius: 6em;
padding: 0 .2em 0 1.25em; }
.knowledge-center-search-module.form .flex-group .subgroup .input input, .knowledge-center-search-module.form .flex-nav .subgroup .input input {
padding: 0;
height: auto;
background: transparent;
font-weight: bold;
color: #434a4c;
font-size: 1em;
line-height: 2.5625em;
flex-basis: calc(100% - 41px); }
.knowledge-center-search-module.form .flex-group .subgroup .input .icon-container, .knowledge-center-search-module.form .flex-nav .subgroup .input .icon-container {
min-width: 41px;
padding: 0;
flex-basis: 41px; }
.knowledge-center-search-module.form .flex-group .subgroup .input .icon-container a, .knowledge-center-search-module.form .flex-nav .subgroup .input .icon-container a {
height: 100%;
padding: 7px;
display: flex;
align-items: center;
justify-content: center; }
.flex-nav {
width: 100%;
justify-content: center;
line-height: 0;
/*[ FORM FILTER NAV ( ARTICLE LISTS / ETC ) ]-------------------------------------------------------------------------------------------------------------------*/
/* orig. use for 'previous' & 'next' buttons
&.theme-split-ends
{
@media (max-width: $medium-viewport - .01em)
{ .nav-link { @include flex-basis(100%!important); max-width: 240px; }}
@media (min-width: $medium-viewport)
{ @include justify-content(space-between);
.nav-link {
&:first-child { margin-left: 0; }
&:last-child { margin-right: 0; }
}
}
}*/
/* Unified width presets
&.links_XS_2 .nav-link { @include flex-basis(100px); }
&.links_XS .nav-link { @include flex-basis(150px); }
&.links_XS .nav-link { @include flex-basis(150px); }
&.links_SM .nav-link { @include flex-basis(200px); }
&.links_MD .nav-link { @include flex-basis(300px); }
&.links_LG .nav-link { @include flex-basis(400px); }
&.links-full-width .nav-link { min-width: 100%; }
// Align & stretch
&.links-stretch .nav-link { @include flex-grow(1); }
&.links-right { @include justify-content(flex-end); }
&.links-left { @include justify-content(flex-start); }
*/ }
.flex-nav .nav-link {
flex: 0 1 auto;
flex-flow: row wrap;
max-width: 100%;
margin: .5em 1%;
padding: 0;
/* CAN'T USE PADDING ON THIS ELEMENT --- IE 10-11 USES CONTENT BOX MODEL */
display: flex;
align-items: center;
justify-content: center;
/* <---- Remove this line if you don't want default vertical stretching */
cursor: pointer;
/* IE 10 needs this, else it won't wrap text :( */
/* orig. use for .has-icon buttons */ }
.flex-nav .nav-link .inner {
display: block;
flex: 1 1 auto;
max-width: 100%;
padding: .75em 2em; }
.flex-nav .nav-link .flex-inner {
flex-basis: auto;
padding: .75em 1em; }
.flex-nav .nav-link-group {
flex: 1 1 auto;
display: flex;
justify-content: center;
/* OG USE FOR ARTICLE LIST FILTERS */ }
.flex-nav .nav-link-group.align-left:first-child:last-child {
justify-content: flex-start; }
.flex-nav .nav-link-group.align-right:first-child:last-child {
justify-content: flex-end; }
@media (min-width: 37.5em) {
.flex-nav .nav-link-group.align-left {
justify-content: flex-start; }
.flex-nav .nav-link-group.align-right {
justify-content: flex-end; } }
.flex-nav.form-filter {
line-height: 1;
/* SINGLE .nav-link-group .nav-link.item-grows,*/
/* ALL */ }
.flex-nav.form-filter .nav-link-group {
flex-flow: row wrap; }
.flex-nav.form-filter .nav-link-group.align-left {
justify-content: flex-start; }
.flex-nav.form-filter .nav-link-group.align-right {
justify-content: flex-end; }
.flex-nav.form-filter .nav-link-group.items-grow .nav-link.filter-item {
flex-grow: 1; }
.flex-nav.form-filter .nav-link {
position: relative;
margin: .25em .5em;
/* LEGACY IE doesn't like 100% for some reason */ }
.flex-nav.form-filter .nav-link input[type="text"], .flex-nav.form-filter .nav-link select, .flex-nav.form-filter .nav-link textarea {
min-width: 280px;
height: auto;
/* < SAFARI 14 HEIGHT BUG FIX */
min-height: 45px;
width: 100%;
margin: 0;
line-height: 1.25; }
.flex-nav.form-filter .nav-link input[type="radio"],
.flex-nav.form-filter .nav-link input[type="checkbox"] {
margin: 0;
padding: 0; }
.flex-nav.form-filter .nav-link .tick-box .inner {
padding: 0;
padding: 0 1em; }
.flex-nav.form-filter .nav-link.filter-item:first-child:last-child {
margin-left: 0;
margin-right: 0; }
.flex-nav.form-filter .nav-link .custom-select {
flex: 1 1 auto; }
.flex-nav.form-filter .nav-link.button-filter .button {
display: block;
width: 100%;
line-height: 1.25; }
.flex-nav.form-filter .nav-link.label {
cursor: default;
align-items: flex-start; }
.flex-nav.form-filter .nav-link.label h1, .flex-nav.form-filter .nav-link.label h2, .flex-nav.form-filter .nav-link.label h3 {
white-space: nowrap;
margin: 0;
line-height: 1.25; }
.flex-nav.form-filter .nav-link.label .icon {
display: inline-block;
vertical-align: middle;
/**/ }
.flex-nav.form-filter .nav-link.label .icon svg {
display: block;
width: 30px;
height: 30px;
pointer-events: none; }
@media (max-width: 37.49em) {
.flex-nav.form-filter .nav-link.filter-item {
flex-basis: 100%; }
.flex-nav.form-filter .nav-link .tick-box {
width: 100%; } }
@media (min-width: 48em) {
.flex-nav.form-filter {
/* SINGLE .nav-link-group .nav-link.item-grows,*/
/* ALL */ }
.flex-nav.form-filter .align-left .nav-link:first-child {
margin-left: 0; }
.flex-nav.form-filter .align-right .nav-link:last-child {
margin-right: 0; }
.flex-nav.form-filter .nav-link-group.items-grow .nav-link.filter-item .custom-select {
flex-basis: 200px;
/*max-width: 300px;*/
margin: 0 .25em .25em .25em; }
.flex-nav.form-filter .nav-link-group.items-grow .nav-link.filter-item .custom-select:first-child {
margin-left: 0; }
.flex-nav.form-filter .nav-link-group.items-grow .nav-link.filter-item .custom-select:last-child {
margin-right: 0; } }
.module {
padding-bottom: 2em; }
.module-list .module-flex,
.module-list.module-flex {
display: flex;
flex-flow: row wrap;
max-width: 100%;
/*
&.layout-card
{
.flex-inner { @include flex-direction(column); @include flex(1 1 100%); }
.bg-img { min-height: 225px; @include flex(0 1 250px); }
.content-container { @include flex(1 1 auto); padding: 1.5em 6%; }
.title { display: block; margin-bottom: .5em; }
.nav { @include align-items(flex-end); }
.nav-link { margin: 0; }
}*/ }
.module-list .module-flex .flex-link-container,
.module-list.module-flex .flex-link-container {
display: flex;
flex-flow: row wrap;
flex: 1 1 100%;
max-width: 100%;
cursor: pointer; }
.module-list .module-flex .flex-inner,
.module-list.module-flex .flex-inner {
display: flex;
flex-flow: row wrap;
flex: 1 1 100%;
max-width: 100%; }
.module-list .module-flex .subgroup,
.module-list.module-flex .subgroup {
flex: 1 1 auto;
max-width: 100%; }
.module-list .module-flex .bg-img,
.module-list.module-flex .bg-img {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-color: #e9e9e9; }
.module-list .module-flex .subgroup,
.module-list.module-flex .subgroup {
display: flex;
flex-flow: row wrap; }
.module-list .module-flex .subgroup > *,
.module-list.module-flex .subgroup > * {
flex: 1 1 auto;
max-width: 100%; }
.module-list .module-flex .content .summary .keyword,
.module-list.module-flex .content .summary .keyword {
display: block;
height: 1.35em;
overflow: hidden; }
.module-list .module-flex .content .summary.edited,
.module-list.module-flex .content .summary.edited {
line-height: 1.3;
font-size: .875em; }
.module-list .module-flex .content .title,
.module-list.module-flex .content .title {
color: #2d97cc;
padding-right: 1em;
margin: 0 0 .25em 0;
padding: 0;
line-height: 1.2;
font-size: 1em;
font-weight: bold; }
.box-front .module-list .module-flex .content, .box-front
.module-list.module-flex .content {
/* OG use on 2019 dashboard boxes */ }
.box-front .module-list .module-flex .content .summary, .box-front
.module-list.module-flex .content .summary {
width: 100%; }
.box-front .module-list .module-flex .content .summary .keyword, .box-front
.module-list.module-flex .content .summary .keyword {
height: 1.57em;
line-height: 1.57; }
.box-front .module-list .module-flex .content .title, .box-front
.module-list.module-flex .content .title {
max-height: 2.4em;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical; }
.box-back .module-list .module-flex .content, .box-back
.module-list.module-flex .content {
display: flex;
/* OG use on 2019 dashboard boxes */ }
.box-back .module-list .module-flex .content .summary, .box-back
.module-list.module-flex .content .summary {
flex: 1 1 90px;
max-width: 90px;
min-width: 90px;
margin-bottom: 0;
max-height: 1em; }
.box-back .module-list .module-flex .content .summary .keyword, .box-back
.module-list.module-flex .content .summary .keyword {
max-width: 90px; }
.box-back .module-list .module-flex .content .title, .box-back
.module-list.module-flex .content .title {
flex: 1 1 auto;
max-height: 1em;
line-height: 1;
margin-bottom: 0;
padding-right: 3em;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical; }
.box-back .module-list .module-flex .content:after, .box-back
.module-list.module-flex .content:after {
content: 'Edit';
display: block;
flex: 0 1 auto;
font-weight: 700;
line-height: 1;
border-radius: 1em;
color: #2d97cc;
background: #fff;
padding: .25em;
transition: all 0.3s ease;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%); }
.module-list .module-flex:hover, .module-list .module-flex:focus,
.module-list.module-flex:hover,
.module-list.module-flex:focus {
cursor: pointer; }
.box-back .module-list .module-flex:hover .content:after, .box-back .module-list .module-flex:focus .content:after, .box-back
.module-list.module-flex:hover .content:after, .box-back
.module-list.module-flex:focus .content:after {
background: var(--color_a, #2d97cc);
color: #fff;
padding: .25em 1em; }
.module-list .module-flex .layout-help-callout,
.module-list.module-flex .layout-help-callout {
flex: 1 1 100%;
max-width: 400px;
display: flex;
flex-flow: row wrap;
justify-content: center; }
@media (min-width: 55em) {
.module-list .module-flex .layout-help-callout,
.module-list.module-flex .layout-help-callout {
flex: 0 1 50%; } }
@media (min-width: 75em) {
.module-list .module-flex .layout-help-callout,
.module-list.module-flex .layout-help-callout {
flex: 1 1 30%; } }
.module-list .module-flex .layout-help-callout:nth-of-type(1) .flex-inner,
.module-list.module-flex .layout-help-callout:nth-of-type(1) .flex-inner {
margin: .75em .75em .75em 0;
border-top: 2px solid #F1C74F; }
.module-list .module-flex .layout-help-callout:nth-of-type(1) .button,
.module-list.module-flex .layout-help-callout:nth-of-type(1) .button {
background-color: #F1C74F;
color: #fff;
border-radius: 1em; }
.module-list .module-flex .layout-help-callout:nth-of-type(2) .flex-inner,
.module-list.module-flex .layout-help-callout:nth-of-type(2) .flex-inner {
border-top: 2px solid #F87D3F; }
.module-list .module-flex .layout-help-callout:nth-of-type(2) .button,
.module-list.module-flex .layout-help-callout:nth-of-type(2) .button {
background-color: #F87D3F;
color: #fff;
border-radius: 1em; }
.module-list .module-flex .layout-help-callout:nth-of-type(3) .flex-inner,
.module-list.module-flex .layout-help-callout:nth-of-type(3) .flex-inner {
border-top: 2px solid #07465F; }
.module-list .module-flex .layout-help-callout:nth-of-type(3) .button,
.module-list.module-flex .layout-help-callout:nth-of-type(3) .button {
background-color: #07465F;
color: #fff;
border-radius: 1em; }
.module-list .module-flex .layout-help-callout .section-title,
.module-list.module-flex .layout-help-callout .section-title {
width: 100%; }
.module-list .module-flex .layout-help-callout .nav-container,
.module-list.module-flex .layout-help-callout .nav-container {
display: flex;
justify-content: center;
align-items: flex-end;
width: 100%; }
.module-list .module-flex .layout-help-callout .nav-link,
.module-list.module-flex .layout-help-callout .nav-link {
flex: 1 1 100%;
display: flex;
justify-content: center;
text-align: center; }
.module-list .module-flex .layout-help-callout .button,
.module-list.module-flex .layout-help-callout .button {
padding: .25em 1em; }
.module-list .module-flex .layout-help-callout .flex-inner,
.module-list.module-flex .layout-help-callout .flex-inner {
margin: .75em;
padding-top: .75em; }
.module-list .module-flex .layout-help-callout .flex-inner .content-container,
.module-list.module-flex .layout-help-callout .flex-inner .content-container {
display: flex;
flex-flow: row wrap;
width: 100%; }
.module-list .module-flex .layout-help-callout .flex-inner .content-container .sub-group:nth-of-type(1),
.module-list.module-flex .layout-help-callout .flex-inner .content-container .sub-group:nth-of-type(1) {
flex: 1 1 100%;
text-align: center; }
@media (min-width: 85.3125em) {
.module-list .module-flex .layout-help-callout .flex-inner .content-container .sub-group:nth-of-type(1),
.module-list.module-flex .layout-help-callout .flex-inner .content-container .sub-group:nth-of-type(1) {
flex: 1 1 30%; } }
.module-list .module-flex .layout-help-callout .flex-inner .content-container .sub-group:nth-of-type(2),
.module-list.module-flex .layout-help-callout .flex-inner .content-container .sub-group:nth-of-type(2) {
flex: 1 1 100%; }
@media (min-width: 85.3125em) {
.module-list .module-flex .layout-help-callout .flex-inner .content-container .sub-group:nth-of-type(2),
.module-list.module-flex .layout-help-callout .flex-inner .content-container .sub-group:nth-of-type(2) {
flex: 1 1 70%; } }
.module-list .module-flex .layout-help-callout .flex-inner .content-container img,
.module-list.module-flex .layout-help-callout .flex-inner .content-container img {
margin-bottom: .5em; }
@media (min-width: 85.3125em) {
.module-list .module-flex .layout-help-callout .flex-inner .content-container .content,
.module-list.module-flex .layout-help-callout .flex-inner .content-container .content {
padding-left: 1em; } }
.module-list .module-flex.layout-snippet-preview .flex-inner,
.module-list.module-flex.layout-snippet-preview .flex-inner {
flex-direction: column;
flex: 1 1 100%;
padding: .75vw 1vh; }
.module-list .module-flex.layout-snippet-preview .img-container,
.module-list.module-flex.layout-snippet-preview .img-container {
flex: 0 1 auto;
/**/ }
.module-list .module-flex.layout-snippet-preview .img-container img,
.module-list.module-flex.layout-snippet-preview .img-container img {
width: 33%;
max-width: 80px !important; }
.module-list .module-flex.layout-snippet-preview .content-container,
.module-list.module-flex.layout-snippet-preview .content-container {
flex: 1 1 auto;
padding: .35em 6%; }
.module-list .module-flex.layout-snippet-preview .title,
.module-list.module-flex.layout-snippet-preview .title {
margin: 0;
text-align: center;
font-weight: normal;
line-height: 1.35;
font-size: .985em;
font-weight: 500; }
.module-list .module-flex.layout-snippet-preview.theme-default .flex-inner,
.module-list.module-flex.layout-snippet-preview.theme-default .flex-inner {
background-color: #f0f0f0;
transition: background-color 0.25s ease, transform 0.25s ease; }
.module-list .module-flex.layout-snippet-preview.theme-default .img-container,
.module-list.module-flex.layout-snippet-preview.theme-default .img-container {
border: none; }
.module-list .module-flex.layout-snippet-preview.theme-default .title,
.module-list.module-flex.layout-snippet-preview.theme-default .title {
color: #000; }
.module-list .module-flex.layout-snippet-preview.theme-default:hover .flex-inner, .module-list .module-flex.layout-snippet-preview.theme-default:focus .flex-inner,
.module-list.module-flex.layout-snippet-preview.theme-default:hover .flex-inner,
.module-list.module-flex.layout-snippet-preview.theme-default:focus .flex-inner {
background-color: #2d97cc;
transform: scale(1.015); }
.module-list .module-flex.layout-snippet-preview.theme-default:hover .title, .module-list .module-flex.layout-snippet-preview.theme-default:focus .title,
.module-list.module-flex.layout-snippet-preview.theme-default:hover .title,
.module-list.module-flex.layout-snippet-preview.theme-default:focus .title {
color: #fff; }
.module-list {
display: flex;
flex-flow: row wrap;
max-width: 100%;
/* SNIPPETS | MODAL POPUP */
/* NO RESULTS | OG USE FOR SNIPPET MODAL */
/* LOAD SPINNER --- IF LIST EMPTY | OG USE FOR SNIPPET MODAL*/
/* NO MODULES AVAILABLE MESSAGE */ }
.module-list > .nav {
width: 100%;
display: flex;
justify-content: center;
margin-top: 1.25em; }
.box-front .module-list > .nav {
justify-content: flex-start;
margin-top: 0; }
.box-front .module-list > .nav a {
margin: 0.25em 0 0.75em !important; }
.module-list .box-button {
flex: 0 1 auto;
margin: 0 .35em .35em .35em; }
.module-list .layout-slat {
flex: 1 1 100%; }
.module-list .category-group {
flex: 1 1 100%;
display: flex;
max-width: 100%;
flex-flow: row wrap;
/*&:first-child .category-divider { margin-top: 0; }*/ }
.module-list .category-divider {
flex: 1 1 99%;
padding: .5em .5% .75em .5%;
border-top: 1px solid #d3d3d3;
margin: .5em 0; }
.module-list .category-divider .title {
font-weight: bold;
font-size: 1.1em; }
.module-list .no-results {
width: 100%;
margin: .5em auto;
padding: 2em 5%;
text-align: center;
border-radius: 1em;
background-color: #f0f0f0;
color: #464646;
font-weight: bold;
font-size: 1.35em;
max-width: 850px;
border: 1px solid #d3d3d3;
line-height: 1.25; }
.module-list .loading-spinner-v2 {
transform: scale(1.5); }
.module-list .loading-spinner-v2 div {
animation-name: lds-roller; }
.module-list .category-group ~ .loading-spinner-v2,
.module-list .no-results:not(.hidden) ~ .loading-spinner-v2 {
display: none;
animation: none; }
.module-list .category-group ~ .loading-spinner-v2,
.module-list .no-results:not(.hidden) ~ .loading-spinner-v2 {
animation: none; }
.module-list .no-results[data-id="snippetEmpty"]:nth-child(2) {
display: block !important; }
.module-list .no-results[data-id="snippetEmpty"]:nth-child(2) ~ .loading-spinner-v2 {
display: none;
animation: none; }
.module-list .no-results:not(.hidden) + .no-results.hidden {
display: none !important; }
.module-list.border-dividers__bottom > .module-flex {
padding-top: 1em;
padding-bottom: 1em;
border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
.module-list.border-dividers__bottom > .module-flex:last-of-type {
border-bottom: none; }
.module-list.border-dividers__bottom > .module-flex:first-child {
padding-top: 0; }
.shortcuts-menu {
/*margin-bottom: 1em*2;*/ }
.shortcuts-menu .add-shortcut {
width: 100%;
display: block;
max-width: 50px;
overflow: hidden;
height: 50px;
margin: 1em auto;
position: relative;
/*border: 1px solid $brand-c;*/
border-radius: 50%; }
.shortcuts-menu .add-shortcut input {
opacity: 0;
border: none;
width: 100%;
height: 100%;
cursor: pointer; }
.shortcuts-menu .add-shortcut-menu {
position: absolute;
width: 100%;
bottom: 50px;
font-weight: 300;
z-index: 20;
/*background-color: darken($grey-400, 5);
color: lighten($grey-300, 20);*/ }
.shortcuts-menu .add-shortcut-menu p {
padding: 1em/4 1em 0; }
.shortcuts-menu .add-shortcut-menu ul {
padding: 1em/8 0; }
.shortcuts-menu .add-shortcut-menu ul li {
padding: 1em/4 2em;
cursor: pointer;
/*&:hover { background-color: darken($grey-400, 10); }
&.fast_button_active { background-color: $brand-a; }*/ }
.shortcuts-menu .add-shortcut-icon {
position: relative;
z-index: 1;
padding: 0 !important;
cursor: pointer;
transition: all 0.3s ease;
width: 100%;
height: 100%;
/*.fast_button_active {
background: $brand-a !important;
// .svg-icon { fill: $brandAccen; }
}*/ }
.shortcuts-menu .add-shortcut-icon:before, .shortcuts-menu .add-shortcut-icon:after {
content: '';
display: block;
/*background-color: $brand-c;*/
position: absolute;
border-radius: 0px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%); }
.shortcuts-menu .add-shortcut-icon:before {
width: 60%;
height: 2px; }
.shortcuts-menu .add-shortcut-icon:after {
width: 2px;
height: 60%; }
/* style overrides for jquery plugin used for shortcuts on home page */
.shortcuts-popup {
position: fixed;
display: block;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 90% !important;
max-width: 1000px !important;
height: 90%;
max-height: 600px;
margin: auto;
background-color: #fff;
border: 3px solid #636363;
opacity: 0;
z-index: -1 !important;
transition: all 0.5s ease;
transform: translate(0%, 10%); }
.shortcuts-popup .nav-strip {
text-align: left;
margin-bottom: 1em; }
.shortcuts-popup .popup-tab {
display: none;
text-align: left; }
.shortcuts-popup .popup-tab label {
font-size: 2em;
color: #464646; }
.shortcuts-popup .popup-tab.active {
display: flex; }
.shortcuts-popup .page-tree {
flex: 1 1 350px;
background-color: #f0f0f0; }
.shortcuts-popup .page-tree .admin-left-nav {
width: 100%;
height: 400px;
overflow: scroll;
padding: 0 1em;
margin: 0; }
.shortcuts-popup .content {
flex: 1 1 650px; }
.shortcuts-popup .content > * {
margin-bottom: 1em; }
.shortcuts-popup .button.active {
background-color: #464646;
color: #fff; }
.shortcuts-popup .button {
margin-top: 0; }
.shortcuts-popup .box-offset-action {
opacity: 1;
overflow: hidden; }
.shortcuts-popup .box-offset-action input {
border: none;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
opacity: 0;
cursor: pointer; }
.shortcuts-popup-inner {
overflow: scroll;
height: 100%;
padding: 1em; }
html.shortcuts-modal .shortcuts-popup {
transform: translate(0%, 0%);
opacity: 1;
z-index: 100000 !important; }
@media (max-width: 55em) {
.shortcuts-popup .popup-tab {
flex-wrap: wrap; }
.shortcuts-popup .page-tree {
order: 2; } }
@media (min-width: 55em) {
.shortcuts-popup {
/*padding: 2em 3em 2em 4em;*/ }
.shortcuts-popup-inner {
overflow: scroll;
padding: 2em 3em 2em 4em; }
.page-tree {
margin-right: 2em; } }
@media (min-width: 70.625em) {
.shortcuts-popup-inner {
padding: 4em 6em 4em 8em; } }
.shortcuts-menu .segment-image.flex-item {
flex: 1 1 160px; }
.shortcuts-menu .segment-content.flex-item {
flex: 1 1 calc(100% - 160px); }
@media (min-width: 48em) {
.shortcuts-menu .segment-content.flex-item {
flex: 1 1 100%; } }
@media (min-width: 75em) {
.shortcuts-menu .segment-content.flex-item {
flex: 1 1 calc(100% - 160px); } }
.svg-container {
position: relative;
display: inline-block;
height: 0;
fill: #555;
padding: 3%; }
.svg-container .svg-icon {
position: absolute;
display: block;
width: 100%;
height: 100%;
margin: auto;
cursor: pointer;
left: 0;
right: 0;
top: 0;
bottom: 0;
pointer-events: none; }
.svg-help-icon {
/*position: absolute !important;*/
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
width: 30px;
height: 30px;
border-radius: 50%;
vertical-align: middle;
fill: #fff;
background-color: #888888;
text-align: center; }
.svg-bell-icon {
fill: #fff;
background-color: #888888;
/*padding-bottom: 0;*/
vertical-align: middle;
width: 30px;
/*stroke-width: 6;*/
border-radius: 50%;
/*stroke: $color_a;*/
stroke-linecap: round;
height: 30px;
/*position: absolute;*/
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
transition: all 0.2s ease; }
.svg-bell-icon .svg-icon {
height: 60%;
stroke-width: 7; }
.svg-bell-icon.alert {
background: #f1c74f;
fill: #fff;
/*stroke: $yellow;*/
/*stroke-width: 10;*/
transform: rotate(45deg); }
.svg-visit-site-icon {
fill: #fff;
background-color: #888888;
/*padding-bottom: 0;*/
vertical-align: middle;
width: 30px;
/*stroke-width: 6;*/
border-radius: 50%;
/*stroke: $color_a;*/
stroke-linecap: round;
height: 30px;
/*position: absolute;*/
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
transition: all 0.2s ease; }
.svg-visit-site-icon .svg-icon {
height: 60%;
stroke-width: 7; }
.svg-visit-site-icon.alert {
background-color: #888888;
fill: #fff;
/*stroke: $yellow;*/
/*stroke-width: 10;*/ }
[class*="svg-arrow-icon"] {
width: 25px;
height: 25px;
left: 0;
right: 0;
margin: auto; }
[class*="svg-arrow-icon"] .svg-icon {
height: 80%;
transform: rotate(-90deg);
top: 1px; }
.svg-arrow-icon-left .svg-icon {
height: 80%;
transform: rotate(0deg);
top: 1px; }
.svg-arrow-icon-up .svg-icon {
height: 80%;
transform: rotate(90deg);
top: 1px; }
.svg-arrow-icon-right .svg-icon {
height: 80%;
transform: rotate(180deg);
top: 1px; }
.svg-arrow-icon-down .svg-icon {
height: 80%;
transform: rotate(270deg);
top: 1px; }
.svg-check-mark-icon {
width: 30px;
height: 30px; }
.svg-check-mark-icon .svg-icon {
height: 70%; }
.svg-icons-25 {
width: 25px;
height: 25px; }
.svg-icons-35 {
width: 35px;
height: 35px; }
.svg-icons-45 {
width: 45px;
height: 45px; }
.flex-container {
display: flex;
flex: 1 1 100%;
flex-flow: row wrap;
justify-content: flex-start;
align-content: flex-start; }
.flex-container.align-items-flex-end {
align-items: flex-end; }
.flex-container.noWrap {
flex-flow: row nowrap; }
.flex-item {
flex: 1 1 200px;
max-width: 100%; }
.flex-item.align-self-flex-end {
align-self: flex-end; }
.flex-item.bottom-padding {
padding-bottom: 1.1em; }
.flex-container-box {
flex: 0 1 100%; }
@media (min-width: 31.25em) {
.flex-container-box {
flex: 1 1 240px;
min-width: 50%; } }
.flex-item-100 {
flex: 1 1 100px; }
.flex-item-400 {
flex: 1 1 400px; }
.flex-item-600 {
flex: 1 1 600px; }
.flex-item-800 {
flex: 1 1 800px; }
.flex-item-33 {
flex: 0 1 100%; }
.flex-item-66 {
flex: 0 1 100%; }
@media (min-width: 48em) {
.flex-item-33 {
flex: 0 1 33.33333%;
align-self: stretch; }
.flex-item-66 {
flex: 0 1 66.66666%;
align-self: stretch; } }
.flex-item.has-padding {
padding: .5em; }
.flex-container.advanced-rollbacks .flex-item {
flex: 1 1 350px; }
.no-flexbox .flex-container:before, .no-flexbox .flex-container:after {
content: " ";
display: table; }
.no-flexbox .flex-container:after {
clear: both; }
.no-flexbox .flex-container .flex-item.fallback-25-percent {
float: left;
width: 100%;
flex: none;
margin-right: 0; }
@media (min-width: 48em) {
.no-flexbox .flex-container .flex-item.fallback-25-percent {
width: 48%;
margin-left: 4%; }
.no-flexbox .flex-container .flex-item.fallback-25-percent:nth-child(odd) {
margin-left: 0; } }
@media (min-width: 70.625em) {
.no-flexbox .flex-container .flex-item.fallback-25-percent {
width: 23%;
margin-left: 2% !important; }
.no-flexbox .flex-container .flex-item.fallback-25-percent:first-child {
margin-left: 0 !important; }
.no-flexbox .flex-container .flex-item.fallback-25-percent:nth-child(5n+0) {
margin-left: 0 !important; } }
.ie10 .flex-container .flex-container {
display: inline-block; }
.search-results {
margin-top: 40px; }
@media (min-width: 70.625em) {
.search-results {
margin-top: 0; } }
.page-search-results {
margin: 0;
padding: .25em 1em; }
.page-search-result {
list-style: none;
border-bottom: 1px solid #d3d3d3;
padding: .25em .5em; }
.page-search-result-title {
padding: 0 .5em;
display: inline-block; }
.edit-box {
width: 100%;
padding: 0 1em 2em; }
/* SEGMENTS ------------------------------------------------------------------------------------------------------------------------------------
*** REMOVED BY BEN --- THIS WAS USED ON THE 2018 DASHBOARD ***
.segment {
overflow: hidden;
border-bottom: 1px solid $grey-300;
padding: .5em;
.segement-title { display: inline-block; vertical-align: middle }
.button { margin: 0 0 0 5px; }
.segment-item{width: 100%; display: block; color: #b2b2b2; word-break: break-word;
&.bold-item {font-weight: 700; color: #000;}
}
&.flex-container {width: 100%;}
}
.box.active {
.segment.two-sided .segment-item {color: #fff;
&.bold-item {color: #000;}
}
}
.segment.two-sided {
.segment-top { overflow: hidden; font-size: 1.2em; }
.segment-bottom { }
.segment-title { font-size: 1em; color: $grey-700; }
.segment-item { padding: 0; font-size: .8em; color: #ababab; width: 100%; text-align: left; font-weight: 500; display: block;
&.bold-item {font-weight: 700; color: #000;}
}
}
.segment-image {
&.flex-item {@include flex(0 1 100%);}
img {max-width: 100%; height: auto; padding-right: 0.5em;}
}
.segment-content {
&.flex-item {@include flex(0 1 100%)}
}
@media (min-width: $small-viewport-15) {
.segment-image.flex-item {@include flex(1 1 160px);}
.segment-content.flex-item {@include flex(1 1 100%);}
}
@media (min-width: $large-viewport-10) {
.segment-image.flex-item {@include flex(1 1 160px);}
.segment-content.flex-item {@include flex(1 1 calc(100% - 160px));}
}
.segment-button {padding-top: 1em;}
*/
/*
*, *:after, *:before {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}*/
.clearfix:before, .clearfix:after {
content: '';
display: table; }
.clearfix:after {
clear: both; }
.ntfy-container {
position: absolute;
width: 100%;
top: 0;
left: 0;
z-index: 9001; }
.ntfy-container-global {
position: fixed; }
.ntfy-item {
position: static;
background: rgba(42, 45, 50, 0.85);
padding: 22px 22px 22px 90px;
line-height: 1.4;
z-index: 1000;
/*pointer-events: none;*/
color: rgba(250, 251, 255, 0.95);
width: 100%;
left: 0;
font-size: 90%;
font-family: 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif;
opacity: 0;
transition: opacity 0.3s ease; }
.ntfy-item.ntfy-remove {
opacity: 0 !important;
position: absolute; }
.ntfy-show .ntfy-item {
opacity: 1; }
.ntfy-item a {
color: inherit;
opacity: 0.7;
font-weight: 700; }
.ntfy-item a:hover,
.ntfy-item a:focus {
opacity: 1; }
.ntfy-item p {
margin: 0; }
/* Individual Effects */
/* Slide on top */
.ntfy-item {
box-shadow: inset 4.5em 0 rgba(0, 0, 0, 0.6); }
.ntfy-item .icon {
position: absolute;
display: block;
font-size: 109%;
top: 50%;
left: 1em;
-webkit-transform: translate3d(0, -50%, 0);
transform: translate3d(0, -50%, 0); }
.ntfy-item p {
padding: 0 3.2em;
font-size: 1.2em;
display: inline-block; }
.ntfy-container.ntfy-show p {
-webkit-animation-name: animFade;
animation-name: animFade; }
.ntfy-container.ntfy-hide {
-webkit-animation-name: animSlideUp !important;
animation-name: animSlideUp !important;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s; }
.ntfy-container.ntfy-show {
-webkit-animation-name: animSlideDown;
animation-name: animSlideDown;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s; }
@-webkit-keyframes animSlideDown {
0% {
-webkit-transform: translate3d(0, -100%, 0);
z-index: 0; }
99% {
z-index: 0; }
100% {
-webkit-transform: translate3d(0, 0, 0);
z-index: 9001; } }
@keyframes animSlideDown {
0% {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
z-index: 0; }
99% {
z-index: 0; }
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
z-index: 9001; } }
@-webkit-keyframes animSlideUp {
0% {
-webkit-transform: translate3d(0, 0, 0);
z-index: 9001; }
1% {
z-index: 0; }
100% {
-webkit-transform: translate3d(0, -100%, 0);
z-index: 0; } }
@keyframes animSlideUp {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
z-index: 9001; }
1% {
z-index: 0; }
100% {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
z-index: 0; } }
/* ANIMATION */
.ntfy-animated .ntfy-svg-highlight {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both; }
@-webkit-keyframes ntfy-bounceIn {
0%, 20%, 40%, 60%, 80%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3); }
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1); }
40% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9); }
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03); }
80% {
-webkit-transform: scale3d(0.97, 0.97, 0.97);
transform: scale3d(0.97, 0.97, 0.97); }
100% {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1); } }
@keyframes ntfy-bounceIn {
0%, 20%, 40%, 60%, 80%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3); }
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1); }
40% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9); }
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03); }
80% {
-webkit-transform: scale3d(0.97, 0.97, 0.97);
transform: scale3d(0.97, 0.97, 0.97); }
100% {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1); } }
.ntfy-bounceIn .ntfy-svg-highlight {
-webkit-animation-name: ntfy-bounceIn;
animation-name: ntfy-bounceIn; }
.ntfy-animated.ntfy-bounceIn,
.ntfy-animated.bounceOut {
-webkit-animation-duration: .75s;
animation-duration: .75s; }
.ntfy-item {
position: relative; }
.ntfy-svg-container {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 66px;
height: 100%;
display: inline-block; }
.ntfy-svg-container .ntfy-svg {
cursor: pointer;
display: block;
height: 30px;
width: 100%;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
z-index: 0; }
.ntfy-svg-container.ntfy-svg-highlight {
fill: #ffb923; }
.ntfy-svg-container.ntfy-confirm, .ntfy-svg-container.ntfy-cancel {
cursor: pointer;
background-color: rgba(255, 255, 255, 0.5);
border-left: 1px solid black;
transition: background 0.3s ease; }
.ntfy-svg-container.ntfy-confirm {
right: 65px;
left: auto;
border-left: none; }
.ntfy-svg-container.ntfy-confirm:hover {
background-color: #add06d;
fill: #fff; }
.ntfy-svg-container.ntfy-cancel {
right: 0;
left: auto; }
.ntfy-svg-container.ntfy-cancel:hover {
background-color: #d14343;
fill: #fff; }
.ntfy-item.ntfy-confirm {
padding-right: 160px; }
.ntfy-catch-click {
width: 100%;
height: 100%;
top: 0;
bottom: 0;
left: 0;
right: 0;
position: absolute;
z-index: 1 !important;
display: inline-block;
cursor: pointer; }
.ntfy-avoid-click {
z-index: 0 !important;
position: absolute !important; }
.ntfy-block-ui {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 9000;
transition: opacity 0.3s ease !important;
opacity: 0; }
.ntfy-block-ui.show {
opacity: 1; }
.ntfy-popup {
opacity: 0;
visibility: hidden;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: -1;
transform: translate(0, 5%);
transition: opacity .3s ease, transform .3s ease;
transition-delay: .5s; }
html.ntfy-popup-open {
overflow: hidden; }
html.ntfy-popup-open .ntfy-block-ui.show {
/*background: rgba(0,0,0,.4);*/
/*transition: opacity .1s ease !important;*/ }
.ntfy-popup.open {
opacity: 1;
visibility: visible;
z-index: 9001;
transform: translate(0, 0%); }
.ntfy-popup.open .inner {
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
overflow: scroll;
/*left: 50%;*/
/*top: 50%;*/
/*@include transform(translate(-50%, -50%));*/
background: #fff;
border-radius: 4px;
padding: 1em; }
.RadWindow.rwTransparentWindow {
z-index: 9002 !important; }
#ctl00_body_imgSelector_filesimages_grid_GridData {
min-height: 424px; }
.bci-file-explorer {
overflow: hidden;
border: 1px solid #e9e9e9; }
.bci-file-explorer [style="width:710px;height:450px;"],
.bci-file-explorer .RadFileExplorer,
.bci-file-explorer .rfeLoadingPanel + div,
.bci-file-explorer .rfeLoadingPanel + div > table,
.bci-file-explorer .rfeLoadingPanel + div > div > table {
width: 100% !important;
height: auto !important; }
.bci-file-explorer .RadFileExplorer {
border-color: #e9e9e9;
border-left: none;
border-top: none;
margin-right: -1px;
margin-bottom: -1px;
z-index: 2; }
.bci-file-explorer td {
padding: .5em !important; }
.bci-file-explorer .rspPane.rspFirstItem {
width: 30% !important;
height: 100% !important; }
.bci-file-explorer .rspPane.rspLastItem {
/*width: 70% !important;*/
height: 100% !important; }
.bci-file-explorer .rspPane.rspFirstItem > div,
.bci-file-explorer .rspPane.rspLastItem > div {
width: 100% !important; }
@media (max-width: 37.5em) {
.bci-file-explorer .RadToolBar {
white-space: normal !important; }
.bci-file-explorer .RadToolBar .rtbInner {
height: auto !important; }
.bci-file-explorer .rspPane.rspFirstItem,
.bci-file-explorer .rspPane.rspLastItem,
.bci-file-explorer .rspResizeBar {
display: block !important;
width: 100% !important;
overflow: hidden !important;
clear: both !important; }
.bci-file-explorer .rspResizeBar {
border: none !important; }
.bci-file-explorer .rspPane.rspLastItem {
padding: 0 !important; } }
.bci-file-explorer .button {
margin: .5em auto;
display: table; }
.bci-file-explorer .button.button-grey {
cursor: pointer;
font-size: 18px;
border: 1px solid #A0A0A0;
background-color: #e9e9e9;
color: #888888; }
.bci-file-explorer .button.button-grey:hover {
background-color: #c3c3c3 !important;
color: #959595 !important; }
.bci-file-explorer .button.button-grey.fast_button_active {
background-color: gainsboro !important;
color: #7b7b7b !important; }
.bci-file-explorer .button.button-grey .svg-icon {
fill: #888888; }
.bci-file-explorer .marketing_imageSelector_img_container {
padding: 1em 2em 2em;
display: flex;
align-items: center;
width: 100%; }
.bci-file-explorer .marketing_imageSelector_img_container_inner {
margin: 0 auto; }
.bci-file-explorer .marketing_imageSelector_img_container img {
display: block;
margin: 0 auto;
max-width: 100%; }
.bci-file-explorer a.editImageIcon.rtbWrap .rtbText {
font-size: 12px;
background: url("/images/admin/editimage.png") no-repeat left center; }
.bci-file-explorer a.editCaptionIcon.rtbWrap .rtbText {
font-size: 12px;
background: url("/images/admin/editcaption.png") no-repeat left center;
background-size: 17px; }
.bci-file-explorer a.rename.rtbWrap .rtbText {
font-size: 12px;
background: url("/images/admin/rename.png") no-repeat left center;
background-size: 20px; }
#body .admin-left-nav {
/*.RadTreeView .rtSelected .rtIn { background-color: $brand-a !important; background-image: none; color: #fff !important; }*/ }
#body .admin-left-nav .RadTreeView {
padding: 10px 10px 10px 0;
white-space: normal; }
#body .admin-left-nav .RadTreeView .rtSelected .rtIn:before {
width: 4px;
/*background-color: $brand-a;*/ }
#body .admin-left-nav .RadTreeView .rtLines .rtTop,
#body .admin-left-nav .RadTreeView .rtLines .rtLI,
#body .admin-left-nav .RadTreeView .rtLines .rtBot,
#body .admin-left-nav .RadTreeView .rtLines .rtFirst,
#body .admin-left-nav .RadTreeView .rtLines .rtFirst .rtUL,
#body .admin-left-nav .RadTreeView .rtLines .rtLast .rtTop,
#body .admin-left-nav .RadTreeView .rtLines .rtMid {
background-image: none; }
#body .admin-left-nav .RadTreeView .rtTop, #body .admin-left-nav .RadTreeView .rtMid, #body .admin-left-nav .RadTreeView .rtBot {
padding: 1px 0 15px 40px; }
#body .admin-left-nav .rtTop,
#body .admin-left-nav .rtMid,
#body .admin-left-nav .rtBot {
position: relative;
border-bottom: 1px; }
#body .admin-left-nav .rtPlus,
#body .admin-left-nav .rtMinus {
width: 30px !important;
height: 30px !important;
padding: 0 !important;
margin: 0 !important;
position: absolute;
top: 2px;
left: 4px;
border-radius: 50%;
background-size: 80%;
background-color: #d3d3d3;
background-position: center center !important;
cursor: pointer; }
#body .admin-left-nav .rtPlus:before, #body .admin-left-nav .rtPlus:after,
#body .admin-left-nav .rtMinus:before,
#body .admin-left-nav .rtMinus:after {
content: '';
display: block;
background-color: #fff;
position: absolute;
border-radius: 0px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%); }
#body .admin-left-nav .rtPlus:before,
#body .admin-left-nav .rtMinus:before {
width: 60%;
height: 3px; }
#body .admin-left-nav .rtPlus:after,
#body .admin-left-nav .rtMinus:after {
width: 3px;
height: 60%; }
#body .admin-left-nav .rtPlus {
/*background-image: url(/images/admin/plus.svg) !important;*/
background-image: none;
transform: rotate(0deg);
transition: all 0.2s ease; }
#body .admin-left-nav .rtMinus {
/*background-image: url(/images/admin/close.svg) !important;*/
background-image: none;
transform: rotate(90deg);
transition: all 0.2s ease; }
#body .admin-left-nav .rtMinus:before {
display: none; }
#body .admin-left-nav .RadTreeView .rtIn {
padding: 9px 12px 10px;
display: block;
cursor: pointer;
position: relative; }
#body .admin-left-nav .RadTreeView .rtIn:before {
content: '';
display: block;
width: 1px;
height: 100%;
position: absolute;
left: 0;
top: 0;
background-color: #d3d3d3;
transition: width 0.1s ease, background-color 0.1s ease; }
#body .admin-left-nav .rtHover .rtIn {
padding: 9px 9px 10px !important;
border: none !important;
background-image: none !important;
background-color: transparent !important; }
#body .admin-left-nav .rtHover .rtIn:before {
width: 2px; }
#body .admin-left-nav .rtSelected,
#body .admin-left-nav .rtSelected .rtIn {
border: none !important; }
#body .admin-left-nav .rtSelected .rtIn {
padding: 9px 9px 10px !important;
display: block !important; }
#body .admin-left-nav .rtSp {
display: none !important; }
#body .admin-left-nav .RadTreeView > .rtUL > .rtLI .rtTop,
#body .admin-left-nav .RadTreeView > .rtUL > .rtLI .rtMid,
#body .admin-left-nav .RadTreeView > .rtUL > .rtLI .rtBot {
padding: 0px 0 2px 40px; }
/*#body {
.reMode_selected,
.reTool:hover,
.rtbItem:hover,
.rtIn:hover { background-color: $brand-a !important; background-image: none !important; }
.RadToolBar_Metro .rtbItemClicked .rtbWrap,
.RadToolBar_Metro .rtbSplBtnExpanded .rtbWrap,
.RadToolBar_Metro .rtbDropDownExpanded .rtbWrap,
.RadToolBar_Metro .rtbChecked .rtbWrap,
.RadToolBar_Metro li.rtbChecked .rtbWrap:hover { background-color: $brand-a !important; border: 1px solid $brand-a; }
.RadTreeView_Metro .rtSelected .rtIn { border-color: $brand-a; background-color: $brand-a; }
}*/
.RadGrid_Default.table {
border: none !important; }
.RadGrid_Default.table .rgHeader, .RadGrid_Default.table th.rgResizeCol, .RadGrid_Default.table .rgHeaderWrapper {
background: initial !important; }
.RadGrid_Default.table tbody tr.rgRow {
background-color: #f0f0f0; }
.RadGrid_Default.table table table tr {
background-color: transparent !important; }
.RadGrid_Default.table .rgRow td {
border: initial !important; }
@media (min-width: 48em) {
.RadGrid_Default.table th {
font-size: 1.4em;
padding: .75em 1em; }
.RadGrid_Default.table td {
font-size: 1.2em;
padding: .75em 1em !important; } }
/* LARGER RAD GRID FONT */
.RadGrid_Font_LG > .RadGrid {
font-size: .9em; }
.RadGrid_Font_LG > .RadGrid > table {
font-size: 1em; }
/* OVERFLOW SCROLL ( LARGE TABLES ) */
.theme-RadGrid-overflow-scroll {
overflow: auto;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.3); }
.theme-RadGrid-overflow-scroll .RadGrid_Default {
border: none; }
.theme-RadGrid-overflow-scroll .RadGrid .rgMasterTable .rgHeader {
padding: 4px;
min-width: 100px;
font-size: .95em;
font-weight: bold;
text-align: center; }
.theme-RadGrid-overflow-scroll .RadGrid .rgMasterTable tbody td {
padding: 4px 8px;
text-align: center; }
.theme-RadGrid-overflow-scroll .RadGrid .rgMasterTable tbody tr:first-child td {
padding-top: 16px; }
.theme-RadGrid-overflow-scroll .RadGrid .rgMasterTable tbody tr:last-child td {
padding-bottom: 18px; }
.RadGrid_Default.table .rgPager {
background-color: transparent;
padding: 20px 0; }
.RadGrid_Default.table .rgPager td {
padding: 0px !important;
font-size: 1em; }
.RadGrid_Default.table .rgPager > td > table > tbody > tr > td {
padding: 10px 0 !important; }
.RadGrid_Default.table .rgPager .RadComboBox_Default .rcbInputCell {
padding: 0 4px 0 5px !important; }
@media (max-width: 48em) {
.responsiveTb tfoot {
display: block; }
.responsiveTb tfoot > tr {
display: block; }
.responsiveTb tfoot > tr > td {
display: block; }
.responsiveTb tfoot > tr:after {
display: none; }
.responsiveTb tfoot .rgPagerCell {
display: block;
overflow: hidden;
border-right-width: 1px !important; }
.responsiveTb tfoot .rgWrap {
margin-bottom: 5px;
margin-top: 5px; } }
.responsiveTb .rgAltRow {
background-color: #fff !important; }
.RadEditor.reWrapper {
height: auto !important;
border: none !important;
box-shadow: inset 0 0 0 1px #e9e9e9;
max-width: 100%; }
.RadEditor.reWrapper iframe {
padding: 0.5em 1em !important; }
#body_content_imageSelectorContent_imgsearchcontainer input {
color: #2d2d2d;
padding: 5px 10px;
font-size: 1.2em;
font-weight: 400;
font-family: "Figtree", sans-serif; }
#body_content_imageSelectorContent_imgsearchcontainer input[data-id="imgsearchbox"] {
margin-bottom: 0em; }
#body_content_imageSelectorContent_imgsearchcontainer input.button {
background-color: #2d97cc;
color: #fff; }
@media (min-width: 70.625em) {
#body_content_imageSelectorContent_imgsearchcontainer input.button:hover, #body_content_imageSelectorContent_imgsearchcontainer input.button:focus {
color: #fff;
background-color: #2d2d2d; } }
body .avpw_tool_cutout_centered_enhance {
display: table;
margin: 25px auto 0;
/* width: auto;*/
overflow: scroll;
position: static;
top: auto;
left: auto;
height: auto; }
body #avpw_tool_container {
min-width: calc(100% - 238px);
overflow-x: scroll; }
/* lighting tool adjustments */
body .avpw_inset_group {
float: none; }
body .avpw_tool_cutout_centered_orientation .avpw_inset_group {
float: left; }
body .avpw_controlpanel_adjustments .avpw_inset_button_group {
left: 0;
right: 0;
margin: auto; }
body .avpw_tool_fixed {
position: static;
top: auto;
left: auto;
width: auto;
height: auto;
margin-left: auto;
margin-top: auto; }
/* draw adjustments */
body .avpw_tool_cutout_centered_drawing .avpw_inset_group {
float: left; }
body .avpw_tool_cutout_centered_drawing {
position: static;
top: auto;
left: auto;
width: auto;
height: auto;
margin-left: auto;
margin-top: auto; }
/* splash adjustments */
body .avpw_controlpanel .avpw_inset_group {
float: left; }
body .avpw_controlpanel {
position: static;
top: auto;
left: auto;
width: auto;
height: auto;
margin-left: auto;
margin-top: auto; }
body .avpw_outer-center {
float: none;
right: auto;
display: table;
margin: 18px auto 0; }
body .avpw_inner-center {
float: none;
position: static;
right: auto; }
/*$base-box-color: $brand-a;*/
.box {
position: relative;
margin-bottom: 1em;
padding: 1em 1em 3em;
box-shadow: 0px 0px 5px #d3d3d3;
transition: width 0.2s ease, background 0.2s ease;
/*background: #fff; border-top: 1px solid $base-box-color;*/ }
.box p {
margin-bottom: 0.25em;
/*color: #fff;*/ }
.box .box-link {
list-style: disc;
/*color: #fff;*/ }
.box .box-controls .svg-container {
border-bottom: none !important;
border-left: none !important; }
.box p {
margin-bottom: .5em;
font-weight: 200; }
.box table {
width: 100%; }
.box .table {
margin-top: 1em; }
.box .module {
padding-bottom: 1em; }
.box .box-button {
font-weight: 500;
font-size: 0.75em;
border-radius: 1em;
padding: 0.5em 2em; }
.box:not(.flex-item) .box-button {
margin-left: auto;
margin-right: auto;
display: table; }
.box .buttons-on-right {
width: 100%;
margin: 0;
overflow: hidden; }
.box.flex-item {
/*margin: 5px;*/
border: none; }
.box .sort-handle {
position: absolute;
top: 0;
left: -1px; }
@media (min-width: 75em) {
.box .box-button {
font-size: 1em; } }
.box-even-padding {
padding: .5em; }
.box_SM {
padding: .5em 3%;
margin-bottom: .5em; }
.box-title {
font-size: 1.5em;
font-weight: 300;
display: block;
width: 100%;
margin-top: 0;
margin-bottom: .25em; }
.box-title input {
position: relative;
top: -3px;
margin: 0 5px 0 0; }
h2.box-title {
color: #0070a5;
font-size: 1.5625em;
font-weight: 700;
min-width: 100%; }
h3.box-title {
color: #888888;
font-size: 1.3562em;
font-weight: 700;
min-width: 100%; }
.box-subsection-title {
font-size: 1.5em;
font-weight: 300;
color: #888888; }
.box-list {
margin: .5em 0;
padding: 0;
/* BEN REMOVED 9/9/2019
.segment { overflow: hidden; margin-bottom: 1em; padding: 0; border-bottom: none; }
.segment .segment-title { font-style: italic; }
.segment.two-sided {border-bottom: none; padding: 0 0 1em;
&:last-child {padding: 0;}
}*/ }
.box-link {
/*font-style: italic;
color: #2c96cc;*/
font-size: 1em;
text-decoration: none;
cursor: pointer;
/*float: left;*/ }
.box-link a {
background-color: #f7f7f7;
transition: background-color 0.25s ease; }
.box-link a:hover, .box-link a:focus {
background-color: #fff; }
.box-button {
font-weight: 300; }
.box-button-full {
text-transform: uppercase;
display: block;
font-size: .8em;
margin: 0; }
.box-img {
max-width: 100%;
height: auto;
margin: 0 auto;
display: block; }
.box-arrow-toggle {
display: none; }
.box-controls .svg-container, .sort-handle .svg-container {
border: none !important;
border-left: 1px solid #fff !important;
border-bottom: 1px solid #fff !important;
background-color: #d3d3d3 !important;
cursor: pointer;
float: left;
height: 25px;
width: 25px; }
.box-controls .svg-container:hover, .box-controls .svg-container:focus, .sort-handle .svg-container:hover, .sort-handle .svg-container:focus {
background-color: #636363 !important; }
.box-controls .svg-container.fast_button_active, .sort-handle .svg-container.fast_button_active {
fill: #ededed; }
.box-controls .svg-icon, .sort-handle .svg-icon {
height: 80%;
fill: white !important; }
.box-controls .svg-icon.edit-icon, .sort-handle .svg-icon.edit-icon {
background: url(/images/admin/edit-icon.svg) no-repeat center;
background-size: 65%; }
.box-controls-message {
background: #fcc0a1;
color: #ca4807;
padding: 3px 5px 0px 5px;
font-weight: 300;
overflow: auto;
margin-bottom: .75em; }
.box-controls-message-muted {
background: #fff !important;
color: #888888 !important;
font-size: .875em;
font-style: italic; }
@media (min-width: 31.25em) {
.box-controls {
position: absolute;
top: 0;
right: 0; }
.box-controls-message {
max-height: 24px;
max-width: 50%; } }
.box-offset-action {
cursor: pointer;
position: absolute;
top: -14px;
right: -14px;
padding: 15px;
width: 30px;
border-radius: 50%;
transition: all 0.2s ease; }
.box-offset-action .svg-icon {
transform: scale(0.8);
/*width: 80%; height: 80%;*/ }
.box-stacked {
margin-bottom: 0; }
.box {
/* 2021 --- JS WYSIWYG Editor */ }
.box .panel-title {
position: relative;
/* original toggle */ }
.box .panel-title a[data-toggle] .svg-container,
.box .panel-title .toggle-hit-target > .svg-container {
position: absolute;
width: 35px;
height: 35px;
top: 0;
right: 0;
padding: 20px;
transition: all 0.2s ease;
transform: rotate(45deg); }
.box .panel-title a.collapsed .svg-container {
transform: rotate(0); }
.box .ql-container .ql-editor {
background-color: #fff;
min-height: 200px;
max-height: 350px;
overflow-y: auto; }
.box .panel.generic-toggle {
/* toggle */
/* PANEL NAV ( CUSTOM NAV ) */
/* ( dropdown ) */
/* &.theme-grey-500-B { OG USE FOR SNIPPETS
> .panel-heading .panel-title { border: 1px solid $grey-500; background-color: $grey-500; @include transition(background-color .4s ease);
.box-title { color: #fff; }
.svg-container { fill: #fff; }
}
> .panel-collapse { background-color: $grey-100;
&.has-border { box-shadow: inset 0 0 1px $grey-500; }
}
input[type="text"], select, textarea { background-color: #fff; }
&:hover { > .panel-heading .panel-title { background-color: $grey-600; } }
&.active { > .panel-heading .panel-title { background-color: $grey-600; } }
}*/ }
.box .panel.generic-toggle .box-title {
margin-bottom: 0; }
.box .panel.generic-toggle .toggle-hit-target {
display: block;
padding: .25em .5em; }
.box .panel.generic-toggle .toggle-hit-target.disabled {
cursor: default;
font-style: italic;
opacity: .25; }
.box .panel.generic-toggle .panel-title.has-custom-nav {
display: flex;
flex-flow: row wrap; }
.box .panel.generic-toggle .panel-title.has-custom-nav .toggle-hit-target {
flex: 1 1 auto;
display: flex;
align-items: center; }
.box .panel.generic-toggle .panel-title.has-custom-nav .panel-nav.theme-default {
display: flex;
flex-flow: row wrap;
flex: 0 1 auto;
padding: 0 .25em; }
.box .panel.generic-toggle .panel-title.has-custom-nav .panel-nav.theme-default .nav-item {
flex: 0 1 auto;
display: flex;
padding: 0 .25em; }
.box .panel.generic-toggle .panel-title.has-custom-nav .panel-nav.theme-default .nav-item.icon {
align-items: center;
justify-content: center;
transition: background-color 0.4s ease;
cursor: pointer; }
.box .panel.generic-toggle .panel-title.has-custom-nav .panel-nav.theme-default .nav-item.icon .svg-container {
width: 40px;
height: 40px; }
.box .panel.generic-toggle .panel-title.has-custom-nav .panel-nav.theme-default .nav-item.icon:hover {
background-color: #464646;
/**/ }
.box .panel.generic-toggle .panel-title.has-custom-nav .panel-nav.theme-default .nav-item.icon:hover .svg-container {
fill: #fff; }
.box .panel.generic-toggle .panel-title.has-custom-nav .panel-nav.theme-default .nav-item .button {
margin: .5em; }
.box .panel.generic-toggle .panel-title.has-custom-nav .panel-nav.theme-default .nav-item .button.small {
text-transform: uppercase;
padding: .45em 1em;
font-size: 1em; }
.box .panel.generic-toggle .panel-title.has-custom-nav .panel-nav.theme-default .nav-item:last-child .button {
margin-right: 0; }
.box .panel.generic-toggle .panel-title.has-custom-nav.nav-right .panel-nav {
margin-left: auto; }
.box .panel.generic-toggle .panel-title.layout-box-controls .toggle-hit-target {
flex: 1 1 auto;
display: flex;
padding: 0; }
.box .panel.generic-toggle .panel-title.layout-box-controls .box-title {
flex: 0 1 auto;
display: flex;
width: auto;
align-items: center;
padding: 0 .25em; }
.box .panel.generic-toggle .panel-title.layout-box-controls .box-controls {
flex: 0 1 auto;
display: flex;
margin-left: auto;
position: relative;
z-index: 1;
top: auto;
right: auto; }
.box .panel.generic-toggle .panel-title.layout-box-controls .box-controls .svg-container {
width: 60px;
/*height: 100%;height: 100%;*/
border: none !important;
background-color: transparent !important;
bottom: auto;
margin: 0;
padding: 0;
float: none;
flex: 1 1 auto;
height: auto;
border-right: 1px solid rgba(255, 255, 255, 0.5) !important; }
.box .panel.generic-toggle .panel-title.layout-box-controls .box-controls .svg-container .svg-icon {
max-width: 30px;
max-height: 30px; }
.box .panel.generic-toggle .panel-title.layout-box-controls .box-controls .svg-container:hover {
background-color: #464646 !important; }
.box .panel.generic-toggle .panel-title.layout-box-controls .box-controls .svg-container:last-of-type, .box .panel.generic-toggle .panel-title.layout-box-controls .box-controls .svg-container[style="display: none;"] {
border-right: none !important; }
.box .panel.generic-toggle .svg-container {
transform: rotate(0);
bottom: 0;
margin-top: auto;
margin-bottom: auto; }
.box .panel.generic-toggle .panel-collapse {
transform: scale(0);
transform-origin: center top;
opacity: 0;
height: 0;
transition: transform 0.25s ease, opacity 0.3s ease; }
.box .panel.generic-toggle .panel-body:not(.custom-padding) {
padding: .75em; }
.box .panel.generic-toggle.active > .panel-collapse {
opacity: 1;
height: auto;
transform: scale(1); }
.box .panel.generic-toggle.active > .panel-heading .toggle-hit-target > .svg-container {
transform: rotateZ(45deg); }
.box .panel.generic-toggle.active .panel-title.layout-box-controls .svg-container.svg-3-dots {
background-color: #464646 !important; }
.box .panel.generic-toggle.theme-a {
/* color stuff moved to admin-theme.scss */ }
.box .panel.generic-toggle.theme-a > .panel-heading .panel-title {
transition: background-color 0.4s ease; }
.box .panel.generic-toggle.theme-grey-50 > .panel-heading .panel-title {
border: 1px solid #cacaca;
background-color: #e8e8e8;
transition: background-color 0.4s ease; }
.box .panel.generic-toggle.theme-grey-50 > .panel-heading .panel-title .box-title {
color: #464646; }
.box .panel.generic-toggle.theme-grey-50 > .panel-heading .panel-title .svg-container {
fill: #464646; }
.box .panel.generic-toggle.theme-grey-50 > .panel-collapse {
background-color: #fbfbfb; }
.box .panel.generic-toggle.theme-grey-50 > .panel-collapse.has-border {
box-shadow: 0 0 0 1px #cacaca; }
.box .panel.generic-toggle.theme-grey-50 input[type="text"], .box .panel.generic-toggle.theme-grey-50 select, .box .panel.generic-toggle.theme-grey-50 textarea {
background-color: #fff; }
.box .panel.generic-toggle.theme-grey-50:hover > .panel-heading .panel-title {
background-color: #f0f0f0; }
.box .panel.generic-toggle.theme-grey-500 > .panel-heading .panel-title {
border: 1px solid #888888;
background-color: #888888;
transition: background-color 0.4s ease; }
.box .panel.generic-toggle.theme-grey-500 > .panel-heading .panel-title .box-title {
color: #fff; }
.box .panel.generic-toggle.theme-grey-500 > .panel-heading .panel-title .svg-container {
fill: #fff; }
.box .panel.generic-toggle.theme-grey-500 > .panel-collapse {
background-color: #f5f5f5; }
.box .panel.generic-toggle.theme-grey-500 > .panel-collapse.has-border {
box-shadow: inset 0 0 1px #888888; }
.box .panel.generic-toggle.theme-grey-500 input[type="text"], .box .panel.generic-toggle.theme-grey-500 select, .box .panel.generic-toggle.theme-grey-500 textarea {
background-color: #fff; }
.box .panel.generic-toggle.theme-grey-500:hover > .panel-heading .panel-title {
background-color: #959595; }
.box .panel.generic-toggle.theme-grey-600 > .panel-heading .panel-title {
border: 1px solid #195370;
background-color: #5b5b5b;
transition: background-color 0.4s ease; }
.box .panel.generic-toggle.theme-grey-600 > .panel-heading .panel-title .box-title {
color: #fff; }
.box .panel.generic-toggle.theme-grey-600 > .panel-heading .panel-title .svg-container {
fill: #fff; }
.box .panel.generic-toggle.theme-grey-600 > .panel-collapse {
background-color: #f0f0f0;
/*background-color: #d2d2d2;*/ }
.box .panel.generic-toggle.theme-grey-600 input[type="text"], .box .panel.generic-toggle.theme-grey-600 select, .box .panel.generic-toggle.theme-grey-600 textarea {
background-color: #fff; }
.box .panel.generic-toggle.theme-grey-600:hover > .panel-heading .panel-title {
background-color: #888888; }
.box .panel.generic-toggle.theme-grey-700 > .panel-heading .panel-title {
border: 1px solid #195370;
background-color: #464646;
transition: background-color 0.4s ease; }
.box .panel.generic-toggle.theme-grey-700 > .panel-heading .panel-title .box-title {
color: #fff; }
.box .panel.generic-toggle.theme-grey-700 > .panel-heading .panel-title .svg-container {
fill: #fff; }
.box .panel.generic-toggle.theme-grey-700 > .panel-collapse {
background-color: #DCDCDC; }
.box .panel.generic-toggle.theme-grey-700 input[type="text"], .box .panel.generic-toggle.theme-grey-700 select, .box .panel.generic-toggle.theme-grey-700 textarea {
background-color: #fff; }
.box .panel.generic-toggle.theme-grey-700:hover > .panel-heading .panel-title {
background-color: #636363; }
.box .panel.generic-toggle.theme-a-minimal {
/* color stuff moved to admin-theme.scss */ }
.box .panel.generic-toggle.theme-a-minimal > .panel-heading .panel-title {
transition: background-color 0.4s ease; }
.box .panel.generic-toggle.theme-a-minimal > .panel-collapse > .panel-body {
padding: .5em; }
.box .panel.generic-toggle.theme-a-minimal > .panel-collapse .box-subsection-title {
padding-top: 1.5em; }
.snippets-container > .box-component.add {
margin: 1em .5em; }
.panel.snippet-panel .snippet-img-container {
margin: .25em .5em .25em .25em;
flex: 0 1 65px; }
.panel.snippet-panel .snippet-img-container img {
display: block;
width: 100%; }
.panel.snippet-panel .form-control .inset-label {
min-width: 150px;
line-height: 1.35;
white-space: normal; }
.panel.snippet-panel .form-control .inset-label.align-top {
vertical-align: top; }
.panel.snippet-panel .form-control .inset-label-input[type="file"] {
padding: 1em; }
.panel.snippet-panel .form-control .inset-label-container .img-preview-container {
max-width: 400px; }
.snippets-container {
/* ADD SNIPPET BOX */
/* UI DROP DOWN */ }
.snippets-container .add-snippet-box {
border: 3px dashed #d3d3d3;
min-height: 150px;
color: #464646;
background-color: #e9e9e9;
padding: 1em;
display: flex;
justify-content: center;
align-items: center;
flex-flow: row wrap;
max-width: 100%; }
.snippets-container .add-snippet-box .ui-selectmenu-button {
flex: 1 1 100%;
max-width: 700px;
font-weight: bold;
font-size: 1.35em; }
.snippets-container .add-snippet-box .ui-selectmenu-button span.ui-selectmenu-text {
padding: 0; }
.snippets-container .add-snippet-box .ui-selectmenu-button span.ui-icon {
background: url(/images/admin/arrow-down-snippets.svg) center;
width: 24px;
height: 24px;
margin-top: -12px; }
.snippets-container .add-snippet-box .ui-state-hover,
.snippets-container .add-snippet-box .ui-widget-content .ui-state-hover,
.snippets-container .add-snippet-box .ui-widget-header .ui-state-hover,
.snippets-container .add-snippet-box .ui-state-focus, .snippets-container .add-snippet-box .ui-widget-content .ui-state-focus,
.snippets-container .add-snippet-box .ui-widget-header .ui-state-focus, .snippets-container .add-snippet-box .ui-button:hover, .snippets-container .add-snippet-box .ui-button:focus {
border-color: #464646; }
.snippets-container .ui-menu .ui-menu-item {
padding: 0; }
.snippets-container .ui-selectmenu-menu .ui-menu {
max-height: 350px;
max-width: 750px;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-flow: row wrap;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
box-shadow: 0 3px 5px 1px rgba(0, 0, 0, 0.5); }
.snippets-container .ui-selectmenu-menu .ui-menu .ui-state-disabled {
display: none; }
.snippets-container .ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup.ui-menu-divider {
display: block;
width: 99%;
min-width: 99%;
text-align: center;
background: #636363;
padding-top: .5em;
padding-bottom: .5em;
margin: .25em .5% .5em .5%;
color: #fff; }
.snippets-container .ui-selectmenu-menu .ui-menu li.ui-menu-item:not(.ui-state-disabled) {
display: block;
width: 32.3333%;
max-width: 32.3333%;
-webkit-box-flex: 1 1 30%;
-moz-box-flex: 1 1 30%;
-webkit-flex: 1 1 30%;
-ms-flex: 1 1 30%;
flex: 1 1 30%;
margin-bottom: 1% !important;
margin-right: 0.5% !important;
margin-left: 0.5% !important;
background: #f1f1f1; }
.snippets-container .ui-selectmenu-menu .ui-menu li.ui-menu-item:not(.ui-state-disabled) .selectitemwrapper {
display: block;
padding: 58px 10% .5em 10% !important;
height: auto;
text-align: center; }
.snippets-container .ui-selectmenu-menu .ui-menu li.ui-menu-item:not(.ui-state-disabled) span.ui-icon.selectitem {
width: 60px;
height: 0;
display: block;
padding-top: 48px;
top: 6px;
bottom: initial;
left: 50%;
-ms-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
background-size: contain; }
.snippets-container .ui-state-disabled::marker {
font-size: 0; }
.snippets-container .ui-menu.ui-widget .ui-menu-item-wrapper {
font-size: .85em;
line-height: 1.35; }
.snippets-container .ui-state-active, .snippets-container .ui-widget-content .ui-state-active, .snippets-container .ui-widget-header .ui-state-active, .snippets-container a.ui-button:active, .snippets-container .ui-button:active, .snippets-container .ui-button.ui-state-active:hover {
background-color: #2d97cc;
border: none;
box-shadow: inset 0 0 0 2px #195370; }
/* PANEL THEME - orig. use on EVENT COST AREA */
.panel.theme-sub-options .optionpanel + .optionpanel {
padding-top: 1em; }
.panel.theme-sub-options .suboptionspanel.panel {
padding: 1.5em 5%; }
/* PANEL GROUP */
.panel-group .panel.generic-toggle {
padding-top: .5em;
padding-bottom: .5em;
transition: padding-bottom 1s ease; }
.panel-group .panel.generic-toggle + .panel.generic-toggle {
padding-top: 0; }
.panel-group.theme-dash-panels_MD > .panel {
margin: .5em;
padding: 1em;
border: 4px dashed #e9e9e9; }
.panel-group.theme-dash-panels_XS > .panel {
padding: .3em;
border: 4px dashed #e9e9e9; }
.stacked-panels {
padding: .5em; }
.stacked-panels .panel-group {
background-color: #f2f2f2; }
.stacked-panels .panel-group:first-child {
border-top: 1px solid #d9d9d9; }
.stacked-panels .panel-heading {
font-size: .75em;
padding: .75em;
border: 1px solid #d9d9d9;
border-top: none; }
.stacked-panels .box-title {
margin-bottom: 0; }
.stacked-panels .panel-title .svg-container {
width: 30px;
height: 30px;
padding: 15px; }
.stacked-panels .panel-body {
border: 1px solid #d9d9d9;
border-top: none; }
.stacked-panels .marketing_imageSelector_img_container {
border: none;
margin: 0; }
.stacked-panels .svg-container .svg-icon {
top: -12px; }
.stacked-panels .bci-file-explorer {
border: none; }
.stacked-panels .bci-file-explorer > .flex-container {
border-bottom: 1px solid #e9e9e9;
padding: 0 .5em; }
@media (min-width: 37.5em) {
.stacked-panels .svg-container .svg-icon {
top: -4px; } }
/*.box { @include box-variant($base-box-color); }*/
.box.box-orange {
/*border-top: 1px solid $color !important;*/
border-top: 5px solid #f87d3f !important;
/*height: calc(100% - 0.75em);*/
box-shadow: 0 0 0 1px #f87d3f; }
.box.box-orange .box-title {
/*color: $color;*/
color: #2d97cb;
font-weight: 600;
font-size: 2em; }
.box.box-orange .box-title .title-prefix {
display: block;
font-size: 0.5em; }
.box.box-orange .box-controls .fast_button_active {
background: #f87d3f !important; }
.box.box-orange .box-controls-message {
background: #fcc0a1;
color: #ca4807;
padding: 0px 10px;
font-weight: 300; }
.box.box-orange .box-button {
background-color: #2d97cc;
color: #fff; }
.box.box-orange .box-button:hover {
background-color: #1f698d !important;
color: white !important; }
.box.box-orange .box-button.fast_button_active {
background-color: #2888b7 !important;
color: #f2f2f2 !important; }
.box.box-orange .box-button .svg-icon {
fill: #fff; }
.box.box-orange .box-button.history_button {
background-color: #fff;
color: #434a4c;
box-shadow: 0 0 0 1px #2d97cc; }
.box.box-orange .box-button.history_button:hover {
background-color: #d9d9d9 !important;
color: #4f575a !important;
box-shadow: 0 0 0 3px #2d97cc; }
.box.box-orange .box-button.history_button.fast_button_active {
background-color: #f2f2f2 !important;
color: #373d3e !important; }
.box.box-orange .box-button.history_button .svg-icon {
fill: #434a4c; }
.box.box-orange .box-back {
border-top: 1px solid #68b6de;
padding-top: 1em; }
.box.box-orange .box-back .module-list .nav:last-child {
transform: translate(-50%, 50%);
position: absolute;
bottom: 0;
left: 50%; }
.box.box-orange .box-back .module-list .nav:last-child .button {
margin-bottom: 0; }
.box.box-orange .panel-title {
position: relative; }
.box.box-orange .panel-title .svg-container {
position: absolute;
top: 0;
fill: #ca4807;
right: 0;
width: 35px;
height: 35px;
transform: rotate(45deg);
transition: all 0.2s ease; }
.box.box-orange .panel-title .collapsed .svg-container {
transform: rotate(0); }
.box.box-orange .box-button-primary {
background-color: #f87d3f;
color: #fff; }
.box.box-orange .box-button-primary:hover {
background-color: #e25108 !important;
color: white !important; }
.box.box-orange .box-button-primary.fast_button_active {
background-color: #f76c26 !important;
color: #f2f2f2 !important; }
.box.box-orange .box-button-primary .svg-icon {
fill: #fff; }
.box.box-orange .box-button-secondary {
background-color: #e9e9e9;
color: #f87d3f; }
.box.box-orange .box-button-secondary:hover {
background-color: #c3c3c3 !important;
color: #f98e58 !important; }
.box.box-orange .box-button-secondary.fast_button_active {
background-color: gainsboro !important;
color: #f76c26 !important; }
.box.box-orange .box-button-secondary .svg-icon {
fill: #f87d3f; }
.box.box-orange .inset-label.button.box-button-primary {
border: 1px solid #f87d3f;
position: relative;
min-width: 70px; }
.box.box-green {
/*border-top: 1px solid $color !important;*/
border-top: 5px solid #add06d !important;
/*height: calc(100% - 0.75em);*/
box-shadow: 0 0 0 1px #add06d; }
.box.box-green .box-title {
/*color: $color;*/
color: #2d97cb;
font-weight: 600;
font-size: 2em; }
.box.box-green .box-title .title-prefix {
display: block;
font-size: 0.5em; }
.box.box-green .box-controls .fast_button_active {
background: #add06d !important; }
.box.box-green .box-controls-message {
background: #d8e9ba;
color: #7ca334;
padding: 0px 10px;
font-weight: 300; }
.box.box-green .box-button {
background-color: #2d97cc;
color: #fff; }
.box.box-green .box-button:hover {
background-color: #1f698d !important;
color: white !important; }
.box.box-green .box-button.fast_button_active {
background-color: #2888b7 !important;
color: #f2f2f2 !important; }
.box.box-green .box-button .svg-icon {
fill: #fff; }
.box.box-green .box-button.history_button {
background-color: #fff;
color: #434a4c;
box-shadow: 0 0 0 1px #2d97cc; }
.box.box-green .box-button.history_button:hover {
background-color: #d9d9d9 !important;
color: #4f575a !important;
box-shadow: 0 0 0 3px #2d97cc; }
.box.box-green .box-button.history_button.fast_button_active {
background-color: #f2f2f2 !important;
color: #373d3e !important; }
.box.box-green .box-button.history_button .svg-icon {
fill: #434a4c; }
.box.box-green .box-back {
border-top: 1px solid #68b6de;
padding-top: 1em; }
.box.box-green .box-back .module-list .nav:last-child {
transform: translate(-50%, 50%);
position: absolute;
bottom: 0;
left: 50%; }
.box.box-green .box-back .module-list .nav:last-child .button {
margin-bottom: 0; }
.box.box-green .panel-title {
position: relative; }
.box.box-green .panel-title .svg-container {
position: absolute;
top: 0;
fill: #7ca334;
right: 0;
width: 35px;
height: 35px;
transform: rotate(45deg);
transition: all 0.2s ease; }
.box.box-green .panel-title .collapsed .svg-container {
transform: rotate(0); }
.box.box-green .box-button-primary {
background-color: #add06d;
color: #fff; }
.box.box-green .box-button-primary:hover {
background-color: #8ab63b !important;
color: white !important; }
.box.box-green .box-button-primary.fast_button_active {
background-color: #a2ca5a !important;
color: #f2f2f2 !important; }
.box.box-green .box-button-primary .svg-icon {
fill: #fff; }
.box.box-green .box-button-secondary {
background-color: #e9e9e9;
color: #add06d; }
.box.box-green .box-button-secondary:hover {
background-color: #c3c3c3 !important;
color: #b8d680 !important; }
.box.box-green .box-button-secondary.fast_button_active {
background-color: gainsboro !important;
color: #a2ca5a !important; }
.box.box-green .box-button-secondary .svg-icon {
fill: #add06d; }
.box.box-green .inset-label.button.box-button-primary {
border: 1px solid #add06d;
position: relative;
min-width: 70px; }
.box.box-yellow {
/*border-top: 1px solid $color !important;*/
border-top: 5px solid #ffb923 !important;
/*height: calc(100% - 0.75em);*/
box-shadow: 0 0 0 1px #ffb923; }
.box.box-yellow .box-title {
/*color: $color;*/
color: #2d97cb;
font-weight: 600;
font-size: 2em; }
.box.box-yellow .box-title .title-prefix {
display: block;
font-size: 0.5em; }
.box.box-yellow .box-controls .fast_button_active {
background: #ffb923 !important; }
.box.box-yellow .box-controls-message {
background: #ffd989;
color: #bc8000;
padding: 0px 10px;
font-weight: 300; }
.box.box-yellow .box-button {
background-color: #2d97cc;
color: #fff; }
.box.box-yellow .box-button:hover {
background-color: #1f698d !important;
color: white !important; }
.box.box-yellow .box-button.fast_button_active {
background-color: #2888b7 !important;
color: #f2f2f2 !important; }
.box.box-yellow .box-button .svg-icon {
fill: #fff; }
.box.box-yellow .box-button.history_button {
background-color: #fff;
color: #434a4c;
box-shadow: 0 0 0 1px #2d97cc; }
.box.box-yellow .box-button.history_button:hover {
background-color: #d9d9d9 !important;
color: #4f575a !important;
box-shadow: 0 0 0 3px #2d97cc; }
.box.box-yellow .box-button.history_button.fast_button_active {
background-color: #f2f2f2 !important;
color: #373d3e !important; }
.box.box-yellow .box-button.history_button .svg-icon {
fill: #434a4c; }
.box.box-yellow .box-back {
border-top: 1px solid #68b6de;
padding-top: 1em; }
.box.box-yellow .box-back .module-list .nav:last-child {
transform: translate(-50%, 50%);
position: absolute;
bottom: 0;
left: 50%; }
.box.box-yellow .box-back .module-list .nav:last-child .button {
margin-bottom: 0; }
.box.box-yellow .panel-title {
position: relative; }
.box.box-yellow .panel-title .svg-container {
position: absolute;
top: 0;
fill: #bc8000;
right: 0;
width: 35px;
height: 35px;
transform: rotate(45deg);
transition: all 0.2s ease; }
.box.box-yellow .panel-title .collapsed .svg-container {
transform: rotate(0); }
.box.box-yellow .box-button-primary {
background-color: #ffb923;
color: #fff; }
.box.box-yellow .box-button-primary:hover {
background-color: #d69200 !important;
color: white !important; }
.box.box-yellow .box-button-primary.fast_button_active {
background-color: #ffb10a !important;
color: #f2f2f2 !important; }
.box.box-yellow .box-button-primary .svg-icon {
fill: #fff; }
.box.box-yellow .box-button-secondary {
background-color: #e9e9e9;
color: #ffb923; }
.box.box-yellow .box-button-secondary:hover {
background-color: #c3c3c3 !important;
color: #ffc13d !important; }
.box.box-yellow .box-button-secondary.fast_button_active {
background-color: gainsboro !important;
color: #ffb10a !important; }
.box.box-yellow .box-button-secondary .svg-icon {
fill: #ffb923; }
.box.box-yellow .inset-label.button.box-button-primary {
border: 1px solid #ffb923;
position: relative;
min-width: 70px; }
.box.box-purple {
/*border-top: 1px solid $color !important;*/
border-top: 5px solid #AFA7D6 !important;
/*height: calc(100% - 0.75em);*/
box-shadow: 0 0 0 1px #AFA7D6; }
.box.box-purple .box-title {
/*color: $color;*/
color: #2d97cb;
font-weight: 600;
font-size: 2em; }
.box.box-purple .box-title .title-prefix {
display: block;
font-size: 0.5em; }
.box.box-purple .box-controls .fast_button_active {
background: #AFA7D6 !important; }
.box.box-purple .box-controls-message {
background: #eeedf6;
color: #7061b6;
padding: 0px 10px;
font-weight: 300; }
.box.box-purple .box-button {
background-color: #2d97cc;
color: #fff; }
.box.box-purple .box-button:hover {
background-color: #1f698d !important;
color: white !important; }
.box.box-purple .box-button.fast_button_active {
background-color: #2888b7 !important;
color: #f2f2f2 !important; }
.box.box-purple .box-button .svg-icon {
fill: #fff; }
.box.box-purple .box-button.history_button {
background-color: #fff;
color: #434a4c;
box-shadow: 0 0 0 1px #2d97cc; }
.box.box-purple .box-button.history_button:hover {
background-color: #d9d9d9 !important;
color: #4f575a !important;
box-shadow: 0 0 0 3px #2d97cc; }
.box.box-purple .box-button.history_button.fast_button_active {
background-color: #f2f2f2 !important;
color: #373d3e !important; }
.box.box-purple .box-button.history_button .svg-icon {
fill: #434a4c; }
.box.box-purple .box-back {
border-top: 1px solid #68b6de;
padding-top: 1em; }
.box.box-purple .box-back .module-list .nav:last-child {
transform: translate(-50%, 50%);
position: absolute;
bottom: 0;
left: 50%; }
.box.box-purple .box-back .module-list .nav:last-child .button {
margin-bottom: 0; }
.box.box-purple .panel-title {
position: relative; }
.box.box-purple .panel-title .svg-container {
position: absolute;
top: 0;
fill: #7061b6;
right: 0;
width: 35px;
height: 35px;
transform: rotate(45deg);
transition: all 0.2s ease; }
.box.box-purple .panel-title .collapsed .svg-container {
transform: rotate(0); }
.box.box-purple .box-button-primary {
background-color: #AFA7D6;
color: #fff; }
.box.box-purple .box-button-primary:hover {
background-color: #8073be !important;
color: white !important; }
.box.box-purple .box-button-primary.fast_button_active {
background-color: #9f96ce !important;
color: #f2f2f2 !important; }
.box.box-purple .box-button-primary .svg-icon {
fill: #fff; }
.box.box-purple .box-button-secondary {
background-color: #e9e9e9;
color: #AFA7D6; }
.box.box-purple .box-button-secondary:hover {
background-color: #c3c3c3 !important;
color: #bfb8de !important; }
.box.box-purple .box-button-secondary.fast_button_active {
background-color: gainsboro !important;
color: #9f96ce !important; }
.box.box-purple .box-button-secondary .svg-icon {
fill: #AFA7D6; }
.box.box-purple .inset-label.button.box-button-primary {
border: 1px solid #AFA7D6;
position: relative;
min-width: 70px; }
.box.box-grey {
/*border-top: 1px solid $color !important;*/
border-top: 5px solid #d3d3d3 !important;
/*height: calc(100% - 0.75em);*/
box-shadow: 0 0 0 1px #d3d3d3; }
.box.box-grey .box-title {
/*color: $color;*/
color: #2d97cb;
font-weight: 600;
font-size: 2em; }
.box.box-grey .box-title .title-prefix {
display: block;
font-size: 0.5em; }
.box.box-grey .box-controls .fast_button_active {
background: #d3d3d3 !important; }
.box.box-grey .box-controls-message {
background: white;
color: #a0a0a0;
padding: 0px 10px;
font-weight: 300; }
.box.box-grey .box-button {
background-color: #2d97cc;
color: #fff; }
.box.box-grey .box-button:hover {
background-color: #1f698d !important;
color: white !important; }
.box.box-grey .box-button.fast_button_active {
background-color: #2888b7 !important;
color: #f2f2f2 !important; }
.box.box-grey .box-button .svg-icon {
fill: #fff; }
.box.box-grey .box-button.history_button {
background-color: #fff;
color: #434a4c;
box-shadow: 0 0 0 1px #2d97cc; }
.box.box-grey .box-button.history_button:hover {
background-color: #d9d9d9 !important;
color: #4f575a !important;
box-shadow: 0 0 0 3px #2d97cc; }
.box.box-grey .box-button.history_button.fast_button_active {
background-color: #f2f2f2 !important;
color: #373d3e !important; }
.box.box-grey .box-button.history_button .svg-icon {
fill: #434a4c; }
.box.box-grey .box-back {
border-top: 1px solid #68b6de;
padding-top: 1em; }
.box.box-grey .box-back .module-list .nav:last-child {
transform: translate(-50%, 50%);
position: absolute;
bottom: 0;
left: 50%; }
.box.box-grey .box-back .module-list .nav:last-child .button {
margin-bottom: 0; }
.box.box-grey .panel-title {
position: relative; }
.box.box-grey .panel-title .svg-container {
position: absolute;
top: 0;
fill: #a0a0a0;
right: 0;
width: 35px;
height: 35px;
transform: rotate(45deg);
transition: all 0.2s ease; }
.box.box-grey .panel-title .collapsed .svg-container {
transform: rotate(0); }
.box.box-grey .box-button-primary {
background-color: #d3d3d3;
color: #fff; }
.box.box-grey .box-button-primary:hover {
background-color: #adadad !important;
color: white !important; }
.box.box-grey .box-button-primary.fast_button_active {
background-color: #c6c6c6 !important;
color: #f2f2f2 !important; }
.box.box-grey .box-button-primary .svg-icon {
fill: #fff; }
.box.box-grey .box-button-secondary {
background-color: #e9e9e9;
color: #d3d3d3; }
.box.box-grey .box-button-secondary:hover {
background-color: #c3c3c3 !important;
color: #e0e0e0 !important; }
.box.box-grey .box-button-secondary.fast_button_active {
background-color: gainsboro !important;
color: #c6c6c6 !important; }
.box.box-grey .box-button-secondary .svg-icon {
fill: #d3d3d3; }
.box.box-grey .inset-label.button.box-button-primary {
border: 1px solid #d3d3d3;
position: relative;
min-width: 70px; }
.box.box-taupe {
/*border-top: 1px solid $color !important;*/
border-top: 5px solid #cec5b6 !important;
/*height: calc(100% - 0.75em);*/
box-shadow: 0 0 0 1px #cec5b6; }
.box.box-taupe .box-title {
/*color: $color;*/
color: #2d97cb;
font-weight: 600;
font-size: 2em; }
.box.box-taupe .box-title .title-prefix {
display: block;
font-size: 0.5em; }
.box.box-taupe .box-controls .fast_button_active {
background: #cec5b6 !important; }
.box.box-taupe .box-controls-message {
background: #f7f5f3;
color: #a59579;
padding: 0px 10px;
font-weight: 300; }
.box.box-taupe .box-button {
background-color: #2d97cc;
color: #fff; }
.box.box-taupe .box-button:hover {
background-color: #1f698d !important;
color: white !important; }
.box.box-taupe .box-button.fast_button_active {
background-color: #2888b7 !important;
color: #f2f2f2 !important; }
.box.box-taupe .box-button .svg-icon {
fill: #fff; }
.box.box-taupe .box-button.history_button {
background-color: #fff;
color: #434a4c;
box-shadow: 0 0 0 1px #2d97cc; }
.box.box-taupe .box-button.history_button:hover {
background-color: #d9d9d9 !important;
color: #4f575a !important;
box-shadow: 0 0 0 3px #2d97cc; }
.box.box-taupe .box-button.history_button.fast_button_active {
background-color: #f2f2f2 !important;
color: #373d3e !important; }
.box.box-taupe .box-button.history_button .svg-icon {
fill: #434a4c; }
.box.box-taupe .box-back {
border-top: 1px solid #68b6de;
padding-top: 1em; }
.box.box-taupe .box-back .module-list .nav:last-child {
transform: translate(-50%, 50%);
position: absolute;
bottom: 0;
left: 50%; }
.box.box-taupe .box-back .module-list .nav:last-child .button {
margin-bottom: 0; }
.box.box-taupe .panel-title {
position: relative; }
.box.box-taupe .panel-title .svg-container {
position: absolute;
top: 0;
fill: #a59579;
right: 0;
width: 35px;
height: 35px;
transform: rotate(45deg);
transition: all 0.2s ease; }
.box.box-taupe .panel-title .collapsed .svg-container {
transform: rotate(0); }
.box.box-taupe .box-button-primary {
background-color: #cec5b6;
color: #fff; }
.box.box-taupe .box-button-primary:hover {
background-color: #afa188 !important;
color: white !important; }
.box.box-taupe .box-button-primary.fast_button_active {
background-color: #c4b9a7 !important;
color: #f2f2f2 !important; }
.box.box-taupe .box-button-primary .svg-icon {
fill: #fff; }
.box.box-taupe .box-button-secondary {
background-color: #e9e9e9;
color: #cec5b6; }
.box.box-taupe .box-button-secondary:hover {
background-color: #c3c3c3 !important;
color: #d8d1c5 !important; }
.box.box-taupe .box-button-secondary.fast_button_active {
background-color: gainsboro !important;
color: #c4b9a7 !important; }
.box.box-taupe .box-button-secondary .svg-icon {
fill: #cec5b6; }
.box.box-taupe .inset-label.button.box-button-primary {
border: 1px solid #cec5b6;
position: relative;
min-width: 70px; }
.box.box-navy {
/*border-top: 1px solid $color !important;*/
border-top: 5px solid #07465f !important;
/*height: calc(100% - 0.75em);*/
box-shadow: 0 0 0 1px #07465f; }
.box.box-navy .box-title {
/*color: $color;*/
color: #2d97cb;
font-weight: 600;
font-size: 2em; }
.box.box-navy .box-title .title-prefix {
display: block;
font-size: 0.5em; }
.box.box-navy .box-controls .fast_button_active {
background: #07465f !important; }
.box.box-navy .box-controls-message {
background: #0e8cbe;
color: black;
padding: 0px 10px;
font-weight: 300; }
.box.box-navy .box-button {
background-color: #2d97cc;
color: #fff; }
.box.box-navy .box-button:hover {
background-color: #1f698d !important;
color: white !important; }
.box.box-navy .box-button.fast_button_active {
background-color: #2888b7 !important;
color: #f2f2f2 !important; }
.box.box-navy .box-button .svg-icon {
fill: #fff; }
.box.box-navy .box-button.history_button {
background-color: #fff;
color: #434a4c;
box-shadow: 0 0 0 1px #2d97cc; }
.box.box-navy .box-button.history_button:hover {
background-color: #d9d9d9 !important;
color: #4f575a !important;
box-shadow: 0 0 0 3px #2d97cc; }
.box.box-navy .box-button.history_button.fast_button_active {
background-color: #f2f2f2 !important;
color: #373d3e !important; }
.box.box-navy .box-button.history_button .svg-icon {
fill: #434a4c; }
.box.box-navy .box-back {
border-top: 1px solid #68b6de;
padding-top: 1em; }
.box.box-navy .box-back .module-list .nav:last-child {
transform: translate(-50%, 50%);
position: absolute;
bottom: 0;
left: 50%; }
.box.box-navy .box-back .module-list .nav:last-child .button {
margin-bottom: 0; }
.box.box-navy .panel-title {
position: relative; }
.box.box-navy .panel-title .svg-container {
position: absolute;
top: 0;
fill: black;
right: 0;
width: 35px;
height: 35px;
transform: rotate(45deg);
transition: all 0.2s ease; }
.box.box-navy .panel-title .collapsed .svg-container {
transform: rotate(0); }
.box.box-navy .box-button-primary {
background-color: #07465f;
color: #fff; }
.box.box-navy .box-button-primary:hover {
background-color: #021218 !important;
color: white !important; }
.box.box-navy .box-button-primary.fast_button_active {
background-color: #053547 !important;
color: #f2f2f2 !important; }
.box.box-navy .box-button-primary .svg-icon {
fill: #fff; }
.box.box-navy .box-button-secondary {
background-color: #e9e9e9;
color: #07465f; }
.box.box-navy .box-button-secondary:hover {
background-color: #c3c3c3 !important;
color: #095877 !important; }
.box.box-navy .box-button-secondary.fast_button_active {
background-color: gainsboro !important;
color: #053547 !important; }
.box.box-navy .box-button-secondary .svg-icon {
fill: #07465f; }
.box.box-navy .inset-label.button.box-button-primary {
border: 1px solid #07465f;
position: relative;
min-width: 70px; }
.box.box-blue {
/*border-top: 1px solid $color !important;*/
border-top: 5px solid #2d97cc !important;
/*height: calc(100% - 0.75em);*/
box-shadow: 0 0 0 1px #2d97cc; }
.box.box-blue .box-title {
/*color: $color;*/
color: #2d97cb;
font-weight: 600;
font-size: 2em; }
.box.box-blue .box-title .title-prefix {
display: block;
font-size: 0.5em; }
.box.box-blue .box-controls .fast_button_active {
background: #2d97cc !important; }
.box.box-blue .box-controls-message {
background: #7dc0e2;
color: #1b5978;
padding: 0px 10px;
font-weight: 300; }
.box.box-blue .box-button {
background-color: #2d97cc;
color: #fff; }
.box.box-blue .box-button:hover {
background-color: #1f698d !important;
color: white !important; }
.box.box-blue .box-button.fast_button_active {
background-color: #2888b7 !important;
color: #f2f2f2 !important; }
.box.box-blue .box-button .svg-icon {
fill: #fff; }
.box.box-blue .box-button.history_button {
background-color: #fff;
color: #434a4c;
box-shadow: 0 0 0 1px #2d97cc; }
.box.box-blue .box-button.history_button:hover {
background-color: #d9d9d9 !important;
color: #4f575a !important;
box-shadow: 0 0 0 3px #2d97cc; }
.box.box-blue .box-button.history_button.fast_button_active {
background-color: #f2f2f2 !important;
color: #373d3e !important; }
.box.box-blue .box-button.history_button .svg-icon {
fill: #434a4c; }
.box.box-blue .box-back {
border-top: 1px solid #68b6de;
padding-top: 1em; }
.box.box-blue .box-back .module-list .nav:last-child {
transform: translate(-50%, 50%);
position: absolute;
bottom: 0;
left: 50%; }
.box.box-blue .box-back .module-list .nav:last-child .button {
margin-bottom: 0; }
.box.box-blue .panel-title {
position: relative; }
.box.box-blue .panel-title .svg-container {
position: absolute;
top: 0;
fill: #1b5978;
right: 0;
width: 35px;
height: 35px;
transform: rotate(45deg);
transition: all 0.2s ease; }
.box.box-blue .panel-title .collapsed .svg-container {
transform: rotate(0); }
.box.box-blue .box-button-primary {
background-color: #2d97cc;
color: #fff; }
.box.box-blue .box-button-primary:hover {
background-color: #1f698d !important;
color: white !important; }
.box.box-blue .box-button-primary.fast_button_active {
background-color: #2888b7 !important;
color: #f2f2f2 !important; }
.box.box-blue .box-button-primary .svg-icon {
fill: #fff; }
.box.box-blue .box-button-secondary {
background-color: #e9e9e9;
color: #2d97cc; }
.box.box-blue .box-button-secondary:hover {
background-color: #c3c3c3 !important;
color: #3ea2d4 !important; }
.box.box-blue .box-button-secondary.fast_button_active {
background-color: gainsboro !important;
color: #2888b7 !important; }
.box.box-blue .box-button-secondary .svg-icon {
fill: #2d97cc; }
.box.box-blue .inset-label.button.box-button-primary {
border: 1px solid #2d97cc;
position: relative;
min-width: 70px; }
.box.box-blue-700 {
/*border-top: 1px solid $color !important;*/
border-top: 5px solid #0070a5 !important;
/*height: calc(100% - 0.75em);*/
box-shadow: 0 0 0 1px #0070a5; }
.box.box-blue-700 .box-title {
/*color: $color;*/
color: #2d97cb;
font-weight: 600;
font-size: 2em; }
.box.box-blue-700 .box-title .title-prefix {
display: block;
font-size: 0.5em; }
.box.box-blue-700 .box-controls .fast_button_active {
background: #0070a5 !important; }
.box.box-blue-700 .box-controls-message {
background: #0cb1ff;
color: #002b3f;
padding: 0px 10px;
font-weight: 300; }
.box.box-blue-700 .box-button {
background-color: #2d97cc;
color: #fff; }
.box.box-blue-700 .box-button:hover {
background-color: #1f698d !important;
color: white !important; }
.box.box-blue-700 .box-button.fast_button_active {
background-color: #2888b7 !important;
color: #f2f2f2 !important; }
.box.box-blue-700 .box-button .svg-icon {
fill: #fff; }
.box.box-blue-700 .box-button.history_button {
background-color: #fff;
color: #434a4c;
box-shadow: 0 0 0 1px #2d97cc; }
.box.box-blue-700 .box-button.history_button:hover {
background-color: #d9d9d9 !important;
color: #4f575a !important;
box-shadow: 0 0 0 3px #2d97cc; }
.box.box-blue-700 .box-button.history_button.fast_button_active {
background-color: #f2f2f2 !important;
color: #373d3e !important; }
.box.box-blue-700 .box-button.history_button .svg-icon {
fill: #434a4c; }
.box.box-blue-700 .box-back {
border-top: 1px solid #68b6de;
padding-top: 1em; }
.box.box-blue-700 .box-back .module-list .nav:last-child {
transform: translate(-50%, 50%);
position: absolute;
bottom: 0;
left: 50%; }
.box.box-blue-700 .box-back .module-list .nav:last-child .button {
margin-bottom: 0; }
.box.box-blue-700 .panel-title {
position: relative; }
.box.box-blue-700 .panel-title .svg-container {
position: absolute;
top: 0;
fill: #002b3f;
right: 0;
width: 35px;
height: 35px;
transform: rotate(45deg);
transition: all 0.2s ease; }
.box.box-blue-700 .panel-title .collapsed .svg-container {
transform: rotate(0); }
.box.box-blue-700 .box-button-primary {
background-color: #0070a5;
color: #fff; }
.box.box-blue-700 .box-button-primary:hover {
background-color: #003c59 !important;
color: white !important; }
.box.box-blue-700 .box-button-primary.fast_button_active {
background-color: #005f8c !important;
color: #f2f2f2 !important; }
.box.box-blue-700 .box-button-primary .svg-icon {
fill: #fff; }
.box.box-blue-700 .box-button-secondary {
background-color: #e9e9e9;
color: #0070a5; }
.box.box-blue-700 .box-button-secondary:hover {
background-color: #c3c3c3 !important;
color: #0081bf !important; }
.box.box-blue-700 .box-button-secondary.fast_button_active {
background-color: gainsboro !important;
color: #005f8c !important; }
.box.box-blue-700 .box-button-secondary .svg-icon {
fill: #0070a5; }
.box.box-blue-700 .inset-label.button.box-button-primary {
border: 1px solid #0070a5;
position: relative;
min-width: 70px; }
.box.box-white,
.box .box.box-white {
background-color: #fff; }
.box.box-grey-700 {
/*border-top: 1px solid $color !important;*/
border-top: 5px solid #464646 !important;
/*height: calc(100% - 0.75em);*/
box-shadow: 0 0 0 1px #464646; }
.box.box-grey-700 .box-title {
/*color: $color;*/
color: #2d97cb;
font-weight: 600;
font-size: 2em; }
.box.box-grey-700 .box-title .title-prefix {
display: block;
font-size: 0.5em; }
.box.box-grey-700 .box-controls .fast_button_active {
background: #464646 !important; }
.box.box-grey-700 .box-controls-message {
background: #797979;
color: #131313;
padding: 0px 10px;
font-weight: 300; }
.box.box-grey-700 .box-button {
background-color: #2d97cc;
color: #fff; }
.box.box-grey-700 .box-button:hover {
background-color: #1f698d !important;
color: white !important; }
.box.box-grey-700 .box-button.fast_button_active {
background-color: #2888b7 !important;
color: #f2f2f2 !important; }
.box.box-grey-700 .box-button .svg-icon {
fill: #fff; }
.box.box-grey-700 .box-button.history_button {
background-color: #fff;
color: #434a4c;
box-shadow: 0 0 0 1px #2d97cc; }
.box.box-grey-700 .box-button.history_button:hover {
background-color: #d9d9d9 !important;
color: #4f575a !important;
box-shadow: 0 0 0 3px #2d97cc; }
.box.box-grey-700 .box-button.history_button.fast_button_active {
background-color: #f2f2f2 !important;
color: #373d3e !important; }
.box.box-grey-700 .box-button.history_button .svg-icon {
fill: #434a4c; }
.box.box-grey-700 .box-back {
border-top: 1px solid #68b6de;
padding-top: 1em; }
.box.box-grey-700 .box-back .module-list .nav:last-child {
transform: translate(-50%, 50%);
position: absolute;
bottom: 0;
left: 50%; }
.box.box-grey-700 .box-back .module-list .nav:last-child .button {
margin-bottom: 0; }
.box.box-grey-700 .panel-title {
position: relative; }
.box.box-grey-700 .panel-title .svg-container {
position: absolute;
top: 0;
fill: #131313;
right: 0;
width: 35px;
height: 35px;
transform: rotate(45deg);
transition: all 0.2s ease; }
.box.box-grey-700 .panel-title .collapsed .svg-container {
transform: rotate(0); }
.box.box-grey-700 .box-button-primary {
background-color: #464646;
color: #fff; }
.box.box-grey-700 .box-button-primary:hover {
background-color: #202020 !important;
color: white !important; }
.box.box-grey-700 .box-button-primary.fast_button_active {
background-color: #393939 !important;
color: #f2f2f2 !important; }
.box.box-grey-700 .box-button-primary .svg-icon {
fill: #fff; }
.box.box-grey-700 .box-button-secondary {
background-color: #e9e9e9;
color: #464646; }
.box.box-grey-700 .box-button-secondary:hover {
background-color: #c3c3c3 !important;
color: #535353 !important; }
.box.box-grey-700 .box-button-secondary.fast_button_active {
background-color: gainsboro !important;
color: #393939 !important; }
.box.box-grey-700 .box-button-secondary .svg-icon {
fill: #464646; }
.box.box-grey-700 .inset-label.button.box-button-primary {
border: 1px solid #464646;
position: relative;
min-width: 70px; }
.box.box-grey-700 .box-controls .svg-container {
border-bottom-color: #d3d3d3 !important;
border-left-color: #d3d3d3 !important;
background-color: transparent !important; }
.box.box-grey-700 .box-controls .svg-container:hover {
background-color: gainsboro !important; }
.box.box-grey-700 .box-controls .svg-container.fast_button_active {
background-color: #c3c3c3 !important; }
.box.box-grey-700 .box-controls .svg-icon {
fill: #464646 !important; }
.box.box-grey-700 .button {
border: 1px solid #c6c6c6; }
.box.theme-transparent {
background-color: transparent;
border-top: none !important;
box-shadow: none; }
.box.callout {
padding-top: 1em;
margin: 0 10px 10px;
flex-basis: 500px; }
.box.callout .flex-item {
margin: 0 10px;
flex-basis: 500px; }
.box.callout:first-of-type .svg-arrow-icon-up {
display: none; }
.box.callout:last-of-type .svg-arrow-icon {
display: none; }
.box-component {
position: relative;
overflow: hidden;
margin-bottom: 1em;
/*background-color: $grey-300; */
background: #d3d3d3;
/* The Fallback */
background: rgba(211, 211, 211, 0.3);
color: #464646;
border: 1px solid #c6c6c6;
padding: .5em;
/*.form-control { padding-bottom: .5em; }*/
/* STYLED INSET LABELS */
/* LISTS */
/* FRONT / BACK */
/* THEME */ }
.box-component .box-component {
width: 100%; }
.box-component .box-component-name {
border-bottom: 1px solid #d3d3d3; }
.box-component .box-component-section {
padding-bottom: .5em;
margin-bottom: .5em;
border-bottom: 1px solid #d3d3d3; }
.box-component .box-component-section p {
font-weight: 700; }
.box-component .box-component-section ul {
margin-left: 15px; }
.box-component .form-control {
margin-top: .5em; }
.box-component .form-control:first-child {
margin-top: 0; }
.box-component .inset-label-sandwiched {
padding-left: 1em;
padding-right: 1em; }
.box-component .svg-arrow-icon {
background-color: transparent; }
.box-component .button {
border: 1px solid #bababa;
background-color: #e9e9e9;
color: #636363;
margin: 2px; }
.box-component .inset-label-left {
background-color: #e9e9e9; }
.box-component .inset-label-input {
background-color: #fff; }
.box-component .inset-label-container .limit-label {
display: block;
width: 100%;
padding: 0 .5em;
background-color: #d3d3d3;
font-weight: 500; }
.box-component .inset-label.button {
padding: 0 10px;
background-color: transparent;
border: 1px solid #d3d3d3; }
.box-component .inset-label.button:hover {
background-color: #e1e1e1; }
.box-component .inset-label.button.fast_button_active {
background-color: #d0d0d0 !important; }
.box-component .inset-label.button .svg-icon {
fill: #464646; }
.box-component ul {
list-style: disc; }
.box-component.add {
border: 3px dashed #c6c6c6;
margin-top: 1em;
height: 200px;
cursor: pointer;
text-align: center;
color: #888888; }
.box-component.add:before {
content: '';
display: inline-block;
vertical-align: middle;
height: 100%; }
.box-component.add .inner {
display: inline-block;
vertical-align: middle; }
.box-component.add .svg-icon {
fill: #888888; }
.box-component.add .back {
display: none; }
.box-component.add:hover {
background-color: gainsboro; }
.box-component.add:hover .svg-icon {
fill: #7b7b7b; }
.box-component.hr p {
border-bottom: none;
margin-bottom: 0; }
.box-component.add.flip {
text-align: left;
height: initial; }
.box-component.add.flip:before {
display: none; }
.box-component.add.flip:hover {
background-color: #e9e9e9; }
.box-component.add.flip .front {
display: none; }
.box-component.add.flip .back {
display: block;
padding: 1em; }
.box-component.theme-white-minimal {
background-color: rgba(255, 255, 255, 0.6);
padding: 1em;
border: 1px solid #fff; }
.box-component.theme-white-minimal .box-component-section {
padding-bottom: 1em;
margin-bottom: 1em;
border-bottom: 2px solid #f0f0f0; }
.flash-update-aware.box {
transition: all 0.25s ease; }
.flash-update {
transition: box-shadow 1s ease, transform 0.3s ease 0.1s !important; }
.flash-update.box {
box-shadow: 0 0 0 8px #2d97cc;
transform: scale(0.95); }
.admin-content .loading {
position: relative; }
.admin-content .loading:after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(255, 255, 255, 0.85);
background-repeat: no-repeat;
background-position: center;
z-index: 1000;
background-image: url("data:image/svg+xml, %3Csvg width='150px' height='150px' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid' class='lds-wedges' style='background: none;'%3E %3Cstyle%3E.highlight %7B fill: %23676767 %7D /* CHANGE HIGHLIGHT COLOR HERE. */%3C/style%3E %3Cg transform='translate(50,50)'%3E %3Cg ng-attr-transform='scale(%7B%7Bconfig.scale%7D%7D)' transform='scale(0.7)'%3E %3Cg transform='translate(-50,-50)'%3E %3Cg transform='rotate(177.6 50 50)'%3E %3CanimateTransform attributeName='transform' type='rotate' calcMode='linear' values='0 50 50;360 50 50' keyTimes='0;1' dur='0.625s' begin='0s' repeatCount='indefinite'%3E%3C/animateTransform%3E %3Cpath ng-attr-fill-opacity='%7B%7Bconfig.opacity%7D%7D' ng-attr-fill='%7B%7Bconfig.c1%7D%7D' d='M50 50L50 0A50 50 0 0 1 100 50Z' fill-opacity='0.8' fill='%23d8d8d8'%3E%3C/path%3E %3C/g%3E %3Cg class='highlight' transform='rotate(223.2 50 50)'%3E %3CanimateTransform attributeName='transform' type='rotate' calcMode='linear' values='0 50 50;360 50 50' keyTimes='0;1' dur='0.8333333333333334s' begin='0s' repeatCount='indefinite'%3E%3C/animateTransform%3E %3Cpath ng-attr-fill-opacity='%7B%7Bconfig.opacity%7D%7D' ng-attr-fill='%7B%7Bconfig.c2%7D%7D' d='M50 50L50 0A50 50 0 0 1 100 50Z' transform='rotate(90 50 50)' fill-opacity='0.8'%3E%3C/path%3E %3C/g%3E %3Cg transform='rotate(268.8 50 50)'%3E %3CanimateTransform attributeName='transform' type='rotate' calcMode='linear' values='0 50 50;360 50 50' keyTimes='0;1' dur='1.25s' begin='0s' repeatCount='indefinite'%3E%3C/animateTransform%3E %3Cpath ng-attr-fill-opacity='%7B%7Bconfig.opacity%7D%7D' ng-attr-fill='%7B%7Bconfig.c3%7D%7D' d='M50 50L50 0A50 50 0 0 1 100 50Z' transform='rotate(180 50 50)' fill-opacity='0.8' fill='%23c2c2c2'%3E%3C/path%3E %3C/g%3E %3Cg transform='rotate(314.4 50 50)'%3E %3CanimateTransform attributeName='transform' type='rotate' calcMode='linear' values='0 50 50;360 50 50' keyTimes='0;1' dur='2.5s' begin='0s' repeatCount='indefinite'%3E%3C/animateTransform%3E %3Cpath ng-attr-fill-opacity='%7B%7Bconfig.opacity%7D%7D' ng-attr-fill='%7B%7Bconfig.c4%7D%7D' d='M50 50L50 0A50 50 0 0 1 100 50Z' transform='rotate(270 50 50)' fill-opacity='0.8' fill='%23d8d8d8'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E"); }
.admin-content .loading.loading.fix-top:after {
background-position: center 100px; }
.RadWindow.loading:after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(255, 255, 255, 0.85);
background-repeat: no-repeat;
background-position: center;
z-index: 1000;
background-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='100px' height='100px' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid' class='uil-facebook'%3E%3Cstyle type='text/css'%3E.highlight %7B fill: %232d97cc %7D /* CHANGE HIGHLIGHT COLOR HERE. %3C/style%3E%3Cg transform='translate(20 50)'%3E%3Crect x='-10' y='-30' width='20' height='60' class='highlight' opacity='0.6'%3E%3CanimateTransform attributeName='transform' type='scale' from='2' to='1' begin='0s' repeatCount='indefinite' dur='1s' calcMode='spline' keySplines='0.1 0.9 0.4 1' keyTimes='0;1' values='2;1'%3E%3C/animateTransform%3E%3C/rect%3E%3C/g%3E%3Cg transform='translate(50 50)'%3E%3Crect x='-10' y='-30' width='20' height='60' class='highlight' opacity='0.8'%3E%3CanimateTransform attributeName='transform' type='scale' from='2' to='1' begin='0.1s' repeatCount='indefinite' dur='1s' calcMode='spline' keySplines='0.1 0.9 0.4 1' keyTimes='0;1' values='2;1'%3E%3C/animateTransform%3E%3C/rect%3E%3C/g%3E%3Cg transform='translate(80 50)'%3E%3Crect x='-10' y='-30' width='20' height='60' class='highlight' opacity='0.9'%3E%3CanimateTransform attributeName='transform' type='scale' from='2' to='1' begin='0.2s' repeatCount='indefinite' dur='1s' calcMode='spline' keySplines='0.1 0.9 0.4 1' keyTimes='0;1' values='2;1'%3E%3C/animateTransform%3E%3C/rect%3E%3C/g%3E%3C/svg%3E"); }
/* 3 RECTANGLES VERSION
.loading { position: relative;
&:after
{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(#fff,.87); background-repeat: no-repeat; background-position: center; z-index: 1000;
background-image: svg-url('');
}
&.loading.fix-top:after { background-position: center 100px; }
}
*/
/*
*/
@-ms-keyframes uilsquare {
0% {
border-radius: 0%;
transform: scale(1.15);
background-color: #2d97cc; }
95% {
transform: scale(1.5);
background-color: #e9e9e9; } }
@-webkit-keyframes uilsquare {
0% {
border-radius: 0%;
transform: scale(1.15);
background-color: #2d97cc; }
95% {
transform: scale(1.5);
background-color: #e9e9e9; } }
@keyframes uilsquare {
0% {
border-radius: 0%;
transform: scale(1.15);
background-color: #2d97cc; }
95% {
transform: scale(1.5);
background-color: #e9e9e9; }
/* V1
20% { background-color: $color_a; }
30% { border-radius: 0%; transform: scale(1.16); background-color: $color_a; }
90% { transform: scale(.73); background-color: $grey-300; background-color: #bbb; }
*/ }
/*
.load-spinner ~ div { @include transform(scale(1)); @include transition(opacity 1s ease .25s, transform .75s ease .25s); }
.load-spinner ~ div:not(.fake-display-none) { opacity: 1; }
.loading > .load-spinner { opacity: 1; z-index: 2; }
.loading > .load-spinner.squares { @include transform(rotateZ(-45deg) scale(.55)); }
.loading > .load-spinner ~ div { opacity: 0; @include transform(scale(0)); }
.load-spinner {
position: absolute;
width: 200px;
height: 200px;
top: -1em; right: 0; left: 0;
margin: 0 auto;
opacity: 0;
z-index: -10;
&.squares { @include transform(rotateZ(180deg) scale(0)); @include transition(transform .8s ease, opacity .8s ease .3s);
div {
position: absolute;
z-index: 1;
width: 40px;
height: 40px;
}
div > div {
position: absolute;
top: 0;
left: 0;
width: 40px; height: 40px;
-ms-animation: uilsquare .9s linear infinite;
-webkit-animation: uilsquare .9s linear infinite;
animation: uilsquare .9s linear infinite;
background-color: $color_a;
}
> div:nth-of-type(1) {
top: 30px;
left: 30px;
}
> div:nth-of-type(1) > div {
-ms-animation-delay: 0s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
}
> div:nth-of-type(2) {
top: 30px;
left: 80px;
}
> div:nth-of-type(2) > div {
-ms-animation-delay: 0.1125s;
-webkit-animation-delay: 0.1125s;
animation-delay: 0.1125s;
}
> div:nth-of-type(3) {
top: 30px;
left: 130px;
}
> div:nth-of-type(3) > div {
-ms-animation-delay: 0.225s;
-webkit-animation-delay: 0.225s;
animation-delay: 0.225s;
}
> div:nth-of-type(4) {
top: 80px;
left: 130px;
}
> div:nth-of-type(4) > div {
-ms-animation-delay: 0.3375s;
-webkit-animation-delay: 0.3375s;
animation-delay: 0.3375s;
}
> div:nth-of-type(5) {
top: 130px;
left: 130px;
}
> div:nth-of-type(5) > div {
-ms-animation-delay: 0.45s;
-webkit-animation-delay: 0.45s;
animation-delay: 0.45s;
}
> div:nth-of-type(6) {
top: 130px;
left: 80px;
}
> div:nth-of-type(6) > div {
-ms-animation-delay: 0.5625s;
-webkit-animation-delay: 0.5625s;
-o-animation-delay: 0.5625s;
animation-delay: 0.5625s;
}
> div:nth-of-type(7) {
top: 130px;
left: 30px;
}
> div:nth-of-type(7) > div {
-ms-animation-delay: 0.675s;
-webkit-animation-delay: 0.675s;
animation-delay: 0.675s;
}
> div:nth-of-type(8) {
top: 80px;
left: 30px;
}
> div:nth-of-type(8) > div {
-ms-animation-delay: 0.7875s;
-webkit-animation-delay: 0.7875s;
animation-delay: 0.7875s;
}
}
&.ripple {
div { position: absolute; top: 50%; left: 50%; margin: 0; width: 0; height: 0; opacity: 0; border-radius: 50%; border-width: 16px; border-style: solid;
-ms-animation: uil-ripple 1.35s ease-out infinite; -webkit-animation: uil-ripple 1.35s ease-out infinite; animation: uil-ripple 1.35s ease-out infinite; }
div:nth-of-type(1) { border-color: #fff; }
div:nth-of-type(2) { border-color: $color_a; -ms-animation-delay: 0.675s; -webkit-animation-delay: 0.675s; animation-delay: 0.675s; }
}
}*/
/*
@keyframes uil-ripple {
0% {
width: 0;
height: 0;
opacity: 0;
margin: 0 0 0 0; }
33% {
opacity: 1; }
100% {
width: 100%;
height:100%;
margin: -50% 0 0 -50%;
opacity: 0; } }
.load-spinner {
position: relative;
width: 100px;
height: 100px;
display: block;
margin: 0 auto;
}
.load-spinner.ripple div {
position: absolute;
top: 50%;
left: 50%;
margin: 0;
width: 0;
height: 0;
opacity: 0;
border-radius: 50%;
-ms-animation: uil-ripple 1.35s ease-out infinite;
-webkit-animation: uil-ripple 1.35s ease-out infinite;
animation: uil-ripple 1.35s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
.load-spinner.ripple div:nth-of-type(1) {
background: #2d97cc;
}
.load-spinner.ripple div:nth-of-type(2) {
box-shadow: 0 0 0 40px #ffffff;
-ms-animation-delay: 0.675s;
-webkit-animation-delay: 0.45s;
}
*/
.tooltip {
position: relative; }
.tooltip-trigger {
border: 2px solid rgba(104, 182, 222, 0.55);
color: #2d97cc;
width: 1.5em;
height: 1.5em;
line-height: 1.3;
display: inline-block;
text-align: center;
border-radius: 50%;
font-weight: 700;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
transition: background-color 0.5s ease;
margin-left: .4em; }
.tooltip.show .tooltip-trigger {
background-color: #2d97cc;
color: #fff;
border-color: #2d97cc; }
.tooltip.show .tooltip-content {
opacity: 1;
transform: translate(0%, 5%);
z-index: 100;
box-shadow: 1px 2px 2px #000; }
.tooltip-content {
transition: all 0.3s ease;
opacity: 0;
transform: translate(0%, 15%);
position: absolute;
z-index: -1;
padding: .75em 5%;
width: calc(100% - 1em);
max-width: 400px;
top: 100%;
left: 0.5em;
border: 3px solid #2d97cc;
color: #fff;
background-color: #2d97cc; }
.tooltip.red-theme .tooltip-trigger {
background-color: #d14343;
border: 2px solid #fff;
color: #fff; }
.tooltip.red-theme .tooltip-content {
border: none;
border-left: 5px solid #d14343;
background-color: #f4d2d2; }
.media-gallery {
/* .box:first-child,
.box-component:first-child {
.svg-arrow-icon-up { display: none; }
}
.box:last-child,
.box-component:last-child {
.svg-arrow-icon { display: none; }
}*/
/*[offc] { @include transform(translate(-100%, 0%)); }*/ }
.media-gallery .svg-arrow-icon,
.media-gallery .svg-arrow-icon-up {
display: none; }
.media-gallery .box {
list-style: none; }
.media-gallery .box.youtube,
.media-gallery .box-component.youtube {
overflow: hidden; }
.media-gallery .box.youtube:before,
.media-gallery .box-component.youtube:before {
content: 'youtube';
position: absolute;
top: 0;
left: 0;
background-color: #d14343;
padding: .25em .5em;
color: #fff;
border-right: 1px solid #d3d3d3;
border-bottom: 1px solid #d3d3d3;
border-radius: 0px 0px 5px 0px; }
.media-gallery .box.vimeo,
.media-gallery .box-component.vimeo {
overflow: hidden; }
.media-gallery .box.vimeo:before,
.media-gallery .box-component.vimeo:before {
content: 'vimeo';
position: absolute;
top: 0;
left: 0;
background-color: #add06d;
padding: .25em .5em;
color: #fff;
border-right: 1px solid #d3d3d3;
border-bottom: 1px solid #d3d3d3;
border-radius: 0px 0px 5px 0px; }
.media-gallery .offc-trigger-left {
display: none; }
.media-gallery.open .offc-trigger-left {
display: block;
z-index: 2000; }
.media-gallery .offc-content {
padding: 0;
height: 100%; }
.media-gallery [offc-trigger]:before,
.media-gallery [offc-mobile-btn]:before {
color: #2d97cc; }
.media-gallery .mobile-offc-trigger-left {
display: block; }
.media-gallery .svg-icon {
cursor: pointer; }
.mobile-offc-trigger-left {
display: none; }
.media-gallery.preview {
margin: 1em 0 0 0;
padding-top: .5em;
border-top: 1px solid #e9e9e9;
width: 100%;
display: flex;
flex-flow: row wrap; }
.media-gallery.preview li {
flex: 1 1 auto;
display: flex;
align-content: center;
align-items: center;
height: 200px;
background-color: #e9e9e9;
border: 1px solid #d3d3d3;
margin: 5px;
padding: .5em;
min-width: 200px; }
.media-gallery.preview li img {
max-height: 100%;
width: auto;
margin: 0 auto; }
.media-gallery.preview .box-controls .svg-container {
border-left-color: #d3d3d3;
border-bottom-color: #d3d3d3; }
.media-gallery.editor .inner {
display: flex;
padding: 0 !important; }
.media-gallery.editor .img-container {
height: 300px;
display: flex !important;
align-items: center; }
.media-gallery.editor .img-container div {
height: 100%;
width: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: contain; }
.media-gallery.editor .bar {
padding: .5em;
border-bottom: 2px solid #d3d3d3;
margin-bottom: 1em;
z-index: 200;
background-color: #fff;
position: fixed;
top: 0;
left: 0;
width: 100%;
display: flex;
flex-flow: row nowrap; }
.media-gallery.editor .bar .heading {
display: flex;
align-items: center;
flex: 0 1 auto;
padding-right: .5em;
padding-left: .5em;
margin-right: .5em;
border-right: 1px solid #e9e9e9;
font-size: 1.2em; }
.media-gallery.editor .bar .heading:after {
content: '';
position: absolute;
top: 5px;
bottom: 5px;
width: 10px;
background-color: #2d97cc;
left: 0; }
.media-gallery.editor .bar .buttons {
flex: 1 1 auto; }
.media-gallery.editor .bar .close {
flex: 0 1 auto;
display: flex;
align-items: center; }
.media-gallery.editor .bar .svg-container {
padding: 25px;
display: initial;
float: right;
fill: #2d97cc;
cursor: pointer; }
.media-gallery.editor .bar .svg-container:hover {
background-color: #2d97cc;
fill: #fff; }
.media-gallery.editor .bar .svg-icon {
pointer-events: none; }
.media-gallery.editor .bar + .flex-container {
padding-top: 70px;
width: 100%;
height: 100%;
overflow: auto;
position: fixed;
top: 0;
left: 0; }
.media-gallery.editor .nav {
display: flex;
flex-flow: column nowrap;
position: fixed;
top: 70px;
bottom: 0;
left: 0;
background-color: #fff;
opacity: 0; }
.media-gallery.editor .nav .offc-inner {
overflow-y: hidden;
padding-bottom: 3em; }
.media-gallery.editor .nav .jstree-node {
margin-left: 12px !important; }
.media-gallery.editor .nav .jstree-anchor {
font-size: 1em; }
.media-gallery.editor .nav ul {
margin: 0 !important; }
.media-gallery.editor .nav ul li {
margin-left: 1.25em; }
.media-gallery.editor .tab-group {
flex: 1 1 auto;
display: flex;
height: 100%;
margin: 0; }
.media-gallery.editor .tab-control {
display: flex;
height: 48px;
align-items: stretch;
margin: 0; }
.media-gallery.editor .tab-control > li {
display: flex;
cursor: pointer;
flex: 1 1 auto;
align-items: center;
text-align: center;
background-color: #f0f0f0; }
.media-gallery.editor .tab-control > li span {
display: block;
margin: 0 auto;
pointer-events: none; }
.media-gallery.editor .tab-control > li.active {
background-color: #d3d3d3;
color: #464646; }
.media-gallery.editor [tab-pane] {
display: none;
padding: 1em;
flex: 1 1 100%;
max-width: 100%; }
.media-gallery.editor [tab-pane].active {
display: flex;
display: flex;
flex-flow: column nowrap; }
.media-gallery.editor .nav .img-container {
height: 300px;
width: 95% !important;
margin: 1em auto;
display: none !important; }
.media-gallery.editor .nav .img-container.show > div {
display: block; }
.media-gallery.editor .filetree-container {
flex: 1 1 80%;
overflow-y: scroll; }
.media-gallery.editor .filetree-container .jstree {
padding-bottom: 3em; }
.media-gallery.editor .gallery {
overflow-y: scroll;
background-color: #e9e9e9;
flex-flow: row wrap;
display: flex;
align-items: flex-start;
align-content: flex-start;
max-width: 100%; }
.media-gallery.editor .gallery .box {
flex: 1 1 450px;
margin: .25em; }
.media-gallery.editor .gallery .box .panel.generic-toggle.active > .panel-collapse {
max-height: 500px;
overflow: auto; }
.media-gallery.editor .gallery .form-control {
transform: initial !important;
flex-basis: 100%; }
.media-gallery.editor .gallery .form-control > .flex-item {
margin: .25em;
flex-basis: 100%; }
.media-gallery.editor.open .nav {
opacity: 1; }
@media (min-width: 70.625em) {
.media-gallery.editor .nav {
width: 30%; }
.media-gallery.editor .nav .img-container {
display: flex !important; }
.media-gallery.editor .gallery {
width: 70%;
margin: 0 0 0 30%; }
.media-gallery.editor [offc-trigger],
.media-gallery.editor .mobile-offc-trigger-left {
display: none; }
.media-gallery.editor [offc] {
transform: translate(0%, 0%);
max-width: none; } }
.media-gallery-image-preview #gallery-img-preview {
height: 100%;
width: 100%;
margin: auto; }
.media-gallery-image-preview #gallery-img-preview .img-container {
height: 100%;
margin: auto; }
#media-gallery-preview li {
cursor: pointer; }
html.image-editor-active .modal {
z-index: 1002;
background-color: rgba(0, 0, 0, 0.9); }
.modal-popup[modal-theme="theme-image-editor"] {
top: .5em;
right: .5em;
bottom: .5em;
left: .5em;
/*max-width: 1650px;*/
margin: 0 auto;
max-height: none !important;
background-color: #fff;
/* CROP TOOL ACTIVE */
/* SAVE+CLOSE / REVERT DIALOG */
/* EDITOR */
/* MOBILE + TABLET */
/* DESKTOP */ }
.modal-popup[modal-theme="theme-image-editor"] .modal-inner, .modal-popup[modal-theme="theme-image-editor"] .modal-content-container, .modal-popup[modal-theme="theme-image-editor"] .top-nav, .modal-popup[modal-theme="theme-image-editor"] footer {
display: flex; }
.modal-popup[modal-theme="theme-image-editor"] .modal-content-container {
padding: 0; }
.modal-popup[modal-theme="theme-image-editor"] .modal-outer:after {
content: none; }
.modal-popup[modal-theme="theme-image-editor"] .modal-nav {
transition: opacity 0.35s ease; }
.modal-popup[modal-theme="theme-image-editor"] .modal-nav .nav-item {
border: 2px solid #fff;
background-color: #464646; }
.modal-popup[modal-theme="theme-image-editor"] .button {
transition: background-color 0.35s ease; }
.modal-popup[modal-theme="theme-image-editor"] .img-editor {
width: 100%;
display: flex;
flex-flow: column nowrap;
max-width: 100%; }
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav, .modal-popup[modal-theme="theme-image-editor"] .main {
display: flex;
flex-flow: row wrap;
max-width: 100%; }
.modal-popup[modal-theme="theme-image-editor"] .top-nav {
flex: 0 1 auto;
justify-content: center;
align-items: center;
padding: 0 2.5em 0 0;
flex-flow: row wrap;
max-width: 100%;
background-color: #2d97cc; }
.modal-popup[modal-theme="theme-image-editor"] .top-nav label {
font-weight: bold; }
.modal-popup[modal-theme="theme-image-editor"] .top-nav .button {
margin: 0; }
.modal-popup[modal-theme="theme-image-editor"] .top-nav p {
color: inherit; }
.modal-popup[modal-theme="theme-image-editor"] .top-nav .nav-item {
flex: 1 1 auto;
color: #fff;
padding: 1em; }
.modal-popup[modal-theme="theme-image-editor"] .top-nav .nav-item.save {
display: flex;
justify-content: flex-end; }
.modal-popup[modal-theme="theme-image-editor"] .top-nav select, .modal-popup[modal-theme="theme-image-editor"] .top-nav input[type="text"] {
background-color: #fff;
margin: 0; }
@media (max-width: 37.5em) {
.modal-popup[modal-theme="theme-image-editor"] .top-nav {
padding-right: 0; }
.modal-popup[modal-theme="theme-image-editor"] .top-nav .nav-item {
flex-basis: 100%; } }
@media (min-width: 100em) {
.modal-popup[modal-theme="theme-image-editor"] .top-nav .nav-item {
font-size: 1.1em; } }
@media (min-width: 70.625em) {
.modal-popup[modal-theme="theme-image-editor"] .img-editor {
padding-top: 80px; }
.modal-popup[modal-theme="theme-image-editor"] .top-nav {
height: 80px;
position: fixed;
top: 0;
left: 0;
right: 0;
width: 100%;
z-index: 10; } }
.modal-popup[modal-theme="theme-image-editor"] .main {
flex: 1 1 100%; }
.modal-popup[modal-theme="theme-image-editor"] .main select, .modal-popup[modal-theme="theme-image-editor"] .main input[type="text"], .modal-popup[modal-theme="theme-image-editor"] .main textarea {
border: none;
box-shadow: inset 0 0 0 1px #d3d3d3;
margin: 0;
padding: .5em;
height: auto; }
.modal-popup[modal-theme="theme-image-editor"].crop-active {
/* SECOND DELAY TO HIDE IMG SHIFT CHANGING PAGE POSITION RULES
&.crop-ready {
.editor-content > .inner > div { opacity: 1; }
.editor-content .preview { visibility: visible; top: 0; left: 0; width: 100%!important; height: 100%!important; max-width: 100%; max-height: 100%;
@include transition(none); @include transform(none); }
}*/ }
.modal-popup[modal-theme="theme-image-editor"].crop-active .editor-content {
background: #464646; }
.modal-popup[modal-theme="theme-image-editor"].crop-active .editor-content .preview {
box-shadow: 0 0 0 2px #fff; }
.modal-popup[modal-theme="theme-image-editor"].crop-active .edit-block.cropbox .crop-active-elements {
display: flex; }
.modal-popup[modal-theme="theme-image-editor"].crop-active .edit-block.cropbox [data-id="cropon"] {
display: none; }
.modal-popup[modal-theme="theme-image-editor"].crop-active .edit-block.cropbox [data-id="cropoff"], .modal-popup[modal-theme="theme-image-editor"].crop-active .edit-block.cropbox [data-id="crop"] {
display: inline-block; }
.modal-popup[modal-theme="theme-image-editor"].show-revert-dialog .revert-dialog,
.modal-popup[modal-theme="theme-image-editor"].show-close-dialog .close-dialog,
.modal-popup[modal-theme="theme-image-editor"].show-exit-dialog .exit-dialog {
opacity: 1;
pointer-events: auto;
visibility: visible; }
.modal-popup[modal-theme="theme-image-editor"].show-close-dialog .modal-nav,
.modal-popup[modal-theme="theme-image-editor"].show-close-dialog .top-nav .save {
opacity: 0;
pointer-events: none; }
.modal-popup[modal-theme="theme-image-editor"] .modal-dialog {
position: absolute;
top: 0;
left: 0;
visibility: hidden;
opacity: 0;
pointer-events: none;
width: 100%;
height: 100%;
transition: opacity 0.7s ease;
z-index: 100; }
.modal-popup[modal-theme="theme-image-editor"] .modal-dialog .bg {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1; }
.modal-popup[modal-theme="theme-image-editor"] .modal-dialog .container {
position: relative;
z-index: 12;
margin: 1em; }
.modal-popup[modal-theme="theme-image-editor"] .modal-dialog.close-dialog .flex-group.tick-box-group:not(.show-new-file-info) .save-copy-input, .modal-popup[modal-theme="theme-image-editor"] .modal-dialog.close-dialog .tick-box-group.flex-nav:not(.show-new-file-info) .save-copy-input {
display: none; }
.modal-popup[modal-theme="theme-image-editor"] .modal-dialog.exit-dialog .bg, .modal-popup[modal-theme="theme-image-editor"] .modal-dialog.close-dialog .bg, .modal-popup[modal-theme="theme-image-editor"] .modal-dialog.revert-dialog .bg {
background-color: rgba(0, 0, 0, 0.5); }
.modal-popup[modal-theme="theme-image-editor"] .modal-dialog.exit-dialog .container, .modal-popup[modal-theme="theme-image-editor"] .modal-dialog.close-dialog .container, .modal-popup[modal-theme="theme-image-editor"] .modal-dialog.revert-dialog .container {
background-color: #f0f0f0;
max-width: 600px;
margin: 0 auto;
padding: 2em;
position: absolute;
top: 10%;
left: 50%;
text-align: center;
transform: translateX(-50%); }
.modal-popup[modal-theme="theme-image-editor"] .modal-dialog.exit-dialog .container .title, .modal-popup[modal-theme="theme-image-editor"] .modal-dialog.close-dialog .container .title, .modal-popup[modal-theme="theme-image-editor"] .modal-dialog.revert-dialog .container .title {
/*font-weight: bold;*/
margin-bottom: .5em;
font-size: 1.5em; }
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav {
flex: 1 1 100%;
flex-flow: column nowrap;
background: #e8e8e8;
overflow-y: auto; }
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav::-webkit-scrollbar {
-webkit-appearance: none;
width: .5em; }
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav::-webkit-scrollbar-track {
background-color: #d3d3d3;
border-radius: 0; }
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav::-webkit-scrollbar-thumb {
background-color: #888888;
border-radius: 0; }
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav .edit-block > .toggle-hit-target {
background-color: #fff; }
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav .inner {
padding: 1.5em 8% 2.5em 8%; }
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav .hide-show {
background-color: rgba(255, 255, 255, 0.95); }
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav .button-group {
display: flex;
width: 100%;
max-width: 100%;
justify-content: center;
align-items: center;
flex-flow: row wrap; }
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav .button-group .button {
flex: 0 1 auto;
margin: 0 .25em .25em .25em;
padding: .5em .75em; }
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav .button-group.stretch-to-fill .button {
flex-grow: 1; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content {
flex: 1 1 100%;
display: flex;
flex-flow: column nowrap;
position: relative;
background-color: #fff;
background-image: url(/images/admin/image-editor-bg.png);
background-size: 26px;
transition: background 0.75s ease; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content > .inner {
position: relative;
box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5);
box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5);
/* CROP TOOL GENERATED DIV, ANIMATION FIX */ }
.modal-popup[modal-theme="theme-image-editor"] .editor-content > .inner:before {
content: 'Original Image';
position: absolute;
top: 1em;
left: 0;
right: 0;
display: inline-block;
padding: .5em 1em;
background-color: #464646;
color: #fff;
font-size: 1em;
z-index: 10;
max-width: 200px;
margin: 0 auto;
border-radius: 5px;
text-align: center;
pointer-events: none;
opacity: 0;
transition: opacity 0.5s ease;
box-shadow: 0 0 0 2px #fff; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content .inner {
display: flex;
flex: 1 1 90%;
justify-content: center;
align-items: center;
max-width: 100%;
padding: 2.25em 5%; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content .info-bar {
flex: 0 1 auto;
position: sticky;
bottom: 0;
left: 0;
right: 0;
background-color: #e8e8e8;
background-color: #e9e9e9;
z-index: 10; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content .info-bar .inner {
padding: .25em 1em; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content .info-bar .item {
display: inline-block;
letter-spacing: 1px;
color: #464646; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content .info-bar .item .title {
font-weight: bold;
margin-right: .5em; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content .info-bar .item .title:after {
content: ' :'; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content .info-bar .item + .item:before {
content: '';
margin: 0 .5em;
display: inline-block; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content img {
height: auto !important;
/* IE 11 can't handle the image scaling & it goes outside the container... */ }
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
.modal-popup[modal-theme="theme-image-editor"] .editor-content img {
width: 100%;
max-width: 1500px;
max-height: 85vh; } }
@media (max-width: 979px) {
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav {
order: 2; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content {
order: 1; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content .original {
display: none; }
.modal-popup[modal-theme="theme-image-editor"].show-original-img .editor-content .preview {
display: none;
/*opacity: 0; @include transform(scale(.99) translateX(-50%) translateY(-50%));*/ }
.modal-popup[modal-theme="theme-image-editor"].show-original-img .editor-content .original {
display: block; }
.modal-popup[modal-theme="theme-image-editor"].show-original-img .editor-content > .inner:before {
opacity: 1; } }
@media (min-width: 980px) {
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav {
flex: 1 1 250px;
max-width: 430px;
position: relative; }
.modal-popup[modal-theme="theme-image-editor"] .editor-left-nav > .inner {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content {
flex: 2 1 400px; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content img {
position: absolute;
top: 50%;
left: 50%;
max-width: 94%;
max-height: 94%;
transform: translateX(-50%) translateY(-50%);
transition: opacity 0.4s ease, transform 0.5s ease; }
.modal-popup[modal-theme="theme-image-editor"] .editor-content .original {
opacity: 0;
transform: scale(0.99) translateX(-50%) translateY(-50%); }
.modal-popup[modal-theme="theme-image-editor"].show-original-img .editor-content .preview {
opacity: 0;
transform: scale(0.99) translateX(-50%) translateY(-50%); }
.modal-popup[modal-theme="theme-image-editor"].show-original-img .editor-content .original {
opacity: 1;
transform: scale(1) translateX(-50%) translateY(-50%); }
.modal-popup[modal-theme="theme-image-editor"].show-original-img .editor-content > .inner:before {
opacity: 1; } }
.modal-popup[modal-theme="theme-image-editor"] .edit-block {
display: flex;
flex: 1 1 100%;
flex-flow: row wrap;
align-items: center;
max-width: 100%;
/*
&.compression {
}*/ }
.modal-popup[modal-theme="theme-image-editor"] .edit-block > .toggle-hit-target {
position: relative;
padding: .65em 6%;
width: 100%; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block > .toggle-hit-target .title {
color: #4a4a4a;
font-size: 1.2em;
line-height: 1.35;
font-weight: bold;
padding-right: 30px; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block > .toggle-hit-target + .hide-show {
transform: scale(0) translateY(0%);
transform: scaleY(0);
height: 0;
padding: 0;
transform-origin: center top; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block > .toggle-hit-target.active + .hide-show {
transform: scale(1) translateY(0%);
transform: scaleY(1);
height: auto;
padding: .75em;
opacity: 1; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block > .toggle-hit-target.active .toggle-elm .arrow {
border-bottom-color: #2d97cc;
border-right-color: #2d97cc;
transform: rotateZ(135deg); }
.modal-popup[modal-theme="theme-image-editor"] .edit-block .toggle-elm {
display: flex;
flex: 0 0 35px;
max-width: 100%;
min-height: 3em;
justify-content: center;
align-items: center;
order: 2;
position: absolute;
top: 0;
right: 1.75em;
bottom: 0;
pointer-events: none; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block .toggle-elm .arrow {
width: .75em;
height: .75em;
border-right: 2px solid #4a4a4a;
border-bottom: 2px solid #4a4a4a;
position: relative;
top: -.25em;
transform: rotateZ(35deg) skewX(-22deg);
transform-origin: 70% 70%;
transition: transform 0.6s cubic-bezier(0.83, 0.55, 0, 1.27); }
.modal-popup[modal-theme="theme-image-editor"] .edit-block .hide-show {
display: flex;
flex-flow: row wrap;
align-items: center;
transition: transform 0.3s ease, opacity 0.25s ease;
transform-origin: bottom left;
padding: .75em 8%;
min-width: 100%;
opacity: 0;
text-align: center;
justify-content: center; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block p {
width: 100%;
word-wrap: break-word;
word-wrap: break-all; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block .button {
font-size: 1.1em; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block + .edit-block {
margin-top: 1em; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block .label {
font-weight: bold; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block .label:after {
content: ':';
display: inline-block;
margin: 0 .25em; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block .border-top-bottom {
margin-top: 1em;
margin-bottom: 1em;
padding-top: .5em;
padding-bottom: .5em;
border-top: 1px solid #e9e9e9;
border-bottom: 1px solid #e9e9e9; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block.editHistory div[data-id="queue"] {
display: flex;
flex-flow: row wrap; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block.editHistory .action {
width: 100%;
padding: 0 5%;
text-align: left; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block.editHistory .button {
margin-right: .5em;
font-size: .925em; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block.rename input[type='text'] {
text-align: center;
margin: .25em 0; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block.resize input {
text-align: center; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block.resize input[type='checkbox'] {
display: inline-block;
margin: 1em; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block.resize .flex-container {
margin: 1em auto 0 auto;
max-width: 400px;
border-top: 1px solid #d3d3d3;
padding-top: 1em; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block.flipRotate .button {
margin: .25em; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block.flipRotate .button svg {
display: block;
width: 100%;
max-width: 2em;
max-height: 2em;
margin: 0 auto; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block.cropbox {
/* hide until crop is active */ }
.modal-popup[modal-theme="theme-image-editor"] .edit-block.cropbox [data-id="cropoff"], .modal-popup[modal-theme="theme-image-editor"] .edit-block.cropbox [data-id="crop"] {
display: none; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block.cropbox .crop-active-elements {
display: none; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block .flex-item.fullwidth {
flex: 1 1 100%; }
.modal-popup[modal-theme="theme-image-editor"] .edit-block .flex-item.fifty {
flex: 1 1 45%;
flex-basis: 150px;
padding: 0;
margin: 0 1.75% .5em 1.75%; }
.admin-nav-hamburger {
position: relative;
height: 100%;
width: 60px;
z-index: 100;
cursor: pointer; }
.admin-nav-hamburger .hamburger {
position: absolute;
top: -16px;
right: 20%;
bottom: 0;
left: 20%;
margin: auto;
width: 55%;
height: 4px;
pointer-events: none; }
.admin-nav-hamburger .hamburger:before {
content: '';
position: absolute;
width: 100%;
height: 4px;
top: 8px;
left: 0;
transition: transform 0.2s ease;
transform-origin: center left; }
.admin-nav-hamburger .hamburger:after {
content: '';
position: absolute;
width: 100%;
height: 4px;
top: 16px;
left: 0;
transition: transform 0.2s ease;
transform-origin: center left; }
.menu-drop-down {
overflow: hidden;
height: 50%;
z-index: 100;
width: 100%;
position: relative; }
.drop-down-container .button {
font-size: .875em; }
.drop-down-container ul {
overflow: hidden; }
.drop-down-container li {
list-style: none; }
.switch-multi-drop-down,
.close-multi-drop-down {
position: absolute;
height: 100% !important;
margin: none; }
@media (min-width: 70.625em) {
.switch-multi-drop-down,
.close-multi-drop-down {
display: none; } }
.switch-multi-drop-down.next,
.close-multi-drop-down.next {
right: 2px !important;
left: initial; }
.switch-multi-drop-down.prev,
.close-multi-drop-down.prev {
left: 2px !important;
right: initial; }
.switch-multi-drop-down.close,
.close-multi-drop-down.close {
top: 10px;
height: 25px !important;
left: 0;
right: 0;
margin: auto; }
.admin-alerts > ul {
margin: 0 auto;
width: 100%;
padding: 1.5em;
overflow-y: auto;
overflow-x: hidden;
max-height: 200px; }
.admin-alert {
position: relative;
list-style: none;
color: #fff;
margin-bottom: 2em; }
.admin-alert:last-child {
margin-bottom: 0; }
.admin-alert .svg-container {
position: absolute;
left: -10px !important;
top: -10px !important;
margin: 0 !important;
padding: 0; }
.admin-alert-title {
color: #fff;
display: block;
font-size: 1.5em;
margin-bottom: 1em/4; }
.admin-alert-message {
display: block; }
.admin-alert .svg-check-mark-icon {
width: 30px;
height: 30px;
/*position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;*/
margin: auto;
/*background-color: $brand-a;*/
fill: #fff;
border-radius: 50%; }
.admin-alert .svg-check-mark-icon .svg-icon {
height: 60%; }
.svg-bell-icon.alert .alert-badge {
display: block; }
.alert-badge {
display: none;
position: absolute;
top: -13px;
right: 4px;
background-color: #CC0000;
height: 18px;
width: 18px;
color: #fff;
font-size: .7em;
line-height: 1.35;
transform: rotate(-45deg);
text-align: center;
border-radius: 50%;
border: solid 1px #fff; }
.login-failure.active, .form-alerts.weakPassword.active {
font-size: 1.2em;
border-top: 4px solid red;
padding: 1em 1.5em;
margin-top: 1em;
text-align: center; }
.login-failure.active p, .form-alerts.weakPassword.active p {
color: red;
font-weight: bold; }
.user-admin-list li {
position: relative; }
.user-admin-list li .locked {
background: url(/images/admin/lock.svg) no-repeat;
height: 25px;
width: 25px;
position: absolute;
top: 0;
right: 0;
bottom: 0;
margin: auto; }
.admin-header {
position: sticky;
z-index: 1001;
top: 0;
letter-spacing: 0;
width: 100%;
/****/
/****/
/****/
border-bottom: none !important;
box-shadow: 0 0 1px rgba(0, 0, 0, 0.5); }
/****/
/****/
/****/
.admin-header-wrapper {
position: relative;
z-index: 2;
/* <-- allows notify to slide under header. */
background-color: #fff;
padding: 1px 6px; }
body:not(.no-left-nav) .admin-header-wrapper {
max-width: none; }
.admin-header-inner {
overflow: visible;
position: relative;
display: flex;
flex-flow: row wrap;
/*height: 58px;*/
max-width: 1950px;
margin: 0 auto; }
.admin-header-inner .top-nav {
width: 100%; }
.admin-header-inner .main-nav {
width: 100%;
height: 100%;
display: flex; }
.admin-slate-login-logo {
height: 80px;
width: 80px;
background: url(/images/admin/slate-logo.svg) no-repeat center left;
background-size: contain;
position: relative;
margin: 0 auto 1em; }
.admin-logo-container {
display: flex;
flex-flow: row nowrap;
position: relative;
/* padding: 11px; */
z-index: 20;
width: 80%;
max-width: 250px;
margin: .5em 0;
min-height: 40px; }
.admin-slate-logo {
display: inline-block;
flex: 0 1 auto;
position: relative;
padding: 11px;
z-index: 20;
width: 84px;
max-width: 84px;
margin: 0 .75em 0 0;
background: url(/images/admin/slate-logo.svg) no-repeat center left;
background-size: contain;
position: relative; }
.admin-slate-logo:after {
content: "";
height: 100%;
width: 1px;
position: absolute;
top: 0;
right: 0;
background-color: #2d2d2d; }
.admin-logo,
span.admin-logo {
display: block;
position: relative;
padding: 0px;
z-index: 20;
width: 100%;
max-width: 100%;
/* margin: .5em 0; */
min-height: auto;
background-size: contain; }
.admin-nav-wrap {
display: flex;
flex: 1 1 100%; }
.admin-nav-wrap .admin-nav {
flex: 1 1 auto;
display: flex;
justify-content: flex-end; }
.admin-nav-wrap .admin-nav-extras {
flex: 0 1 auto;
display: flex;
justify-content: flex-end; }
@media (min-width: 37.5em) {
.admin-nav-wrap {
position: relative;
/* force search to stick to this container instead of the whole nav. */ } }
.admin-nav-list {
position: relative;
margin: 0;
padding-top: 0;
flex: 1 1 auto;
display: flex;
justify-content: flex-end; }
.admin-nav-list .root-link-container {
position: relative;
flex-flow: row wrap;
text-align: center; }
.admin-nav-list .root-link-container > .link {
position: relative;
z-index: 101;
transition: background-color 0.35s ease; }
.admin-nav-list .root-link-container > .link svg {
display: inline-block;
width: 22px;
height: 22px;
fill: #2d97cc;
margin-right: .5em;
margin-bottom: -.2em; }
@media (max-width: 37.5em) {
.admin-nav-list .root-link-container > .link svg + .text:has(.username) {
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
width: 1px;
overflow: hidden;
position: absolute !important;
margin: 0;
padding: 0;
border: none;
outline: none; } }
.admin-nav-list .root-link-container.active .drop-down-container {
transform: scaleY(1) translateY(0%);
height: auto; }
.admin-nav-list li {
display: flex;
transition: opacity 1s ease; }
.admin-nav-list .link {
display: block;
cursor: pointer;
text-align: center;
padding: 0 .75em;
width: 100%;
position: relative;
color: #636363; }
.admin-nav-list .link:hover,
.admin-nav-list .link.fast_button_active .link {
text-decoration: none !important; }
.admin-nav-list .drop-down-container {
width: 100%;
z-index: 100;
background-color: #f0f0f0;
height: 0;
transform: scaleY(0.75) translateY(-100%);
transition: transform 0.75s ease;
transform-origin: center top; }
.admin-nav-list .drop-down-container li {
flex: 1 1 96%;
padding: 0 2%; }
.admin-nav-list .drop-down-container li:first-child {
padding-top: .75em; }
.admin-nav-list .drop-down-container li:last-child {
padding-bottom: .75em; }
.admin-nav-list .drop-down-container li + li {
margin-top: .35em; }
.admin-nav-list .drop-down-container .flex-item {
flex: 0 1 250px;
margin: 0;
font-size: .9em;
font-weight: 300;
transition: background-color 0.35s ease;
display: flex;
align-items: center; }
.admin-nav-list .drop-down-container .flex-item svg {
display: inline-block;
width: 22px;
height: 22px;
fill: #0070a5 !important;
/**/ }
.admin-nav-list .drop-down-container .flex-item svg + .text {
margin-left: .75em; }
.admin-nav-list .drop-down-container .flex-item .text {
display: inline-block;
text-align: left; }
.admin-nav-list .drop-down-container .flex-item.button {
box-shadow: none;
background-color: #fff;
color: #23759e;
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1); }
/* MOBILE | SHOW LINKS AS SPACE ALLOWS */
html:not(.active-mobile-nav) .admin-nav-list .link {
color: #636363; }
@media (max-width: 24.99em) {
html:not(.active-mobile-nav) .admin-nav-list .priority-1.pages {
display: none; } }
@media (max-width: 31.24em) {
html:not(.active-mobile-nav) .admin-nav-list .priority-2 {
display: none; } }
@media (max-width: 47.99em) {
html:not(.active-mobile-nav) .admin-nav-list .priority-4 {
display: none; } }
@media (max-width: 54.99em) {
html:not(.active-mobile-nav) .admin-nav-list .priority-5 {
display: none; } }
@media (max-width: 61.24em) {
html:not(.active-mobile-nav) .admin-nav-list .priority-6 {
display: none; } }
@media (max-width: 70.615em) {
html:not(.active-mobile-nav) .admin-nav-list .priority-7, html:not(.active-mobile-nav) .admin-nav-list .priority-8, html:not(.active-mobile-nav) .admin-nav-list .priority-9 {
display: none; } }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .drop-down-container {
position: absolute;
top: 100%;
left: 0;
right: 0;
min-width: 250px;
opacity: 0;
visibility: hidden;
max-height: 88vh;
overflow: auto;
box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.35);
padding: .25em; }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .drop-down-container:has(li:nth-child(6)) {
min-width: 400px; }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .drop-down-container::-webkit-scrollbar {
-webkit-appearance: none;
width: .35em; }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .drop-down-container::-webkit-scrollbar-track {
background-color: rgba(255, 255, 255, 0.75);
border-radius: 0; }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .drop-down-container::-webkit-scrollbar-thumb {
border-radius: 0;
background-color: #000;
opacity: .4; }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container:nth-last-child(-n+6) .drop-down-container {
left: auto;
right: 0; }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .drop-down-container {
transform: scaleY(0);
height: auto;
transform-origin: top center;
transition: transform 0.35s ease, opacity 0.5s ease; }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .drop-down-container li {
flex: 0 1 100%;
padding: 0;
min-height: 60px; }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .drop-down-container li + li {
margin-top: 0; }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .drop-down-container:has(li:nth-child(6)) li {
flex: 1 1 50%; }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item {
display: flex;
flex: 1 1 100%;
align-items: center;
margin: 3px;
padding: .75em;
border-radius: 0;
box-shadow: none;
text-align: left;
line-height: 1.25; }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item:hover, html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item:focus,
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item.button:hover,
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item.button:focus {
background-color: #23759e !important;
color: #fff !important; }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item:hover svg, html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item:focus svg,
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item.button:hover svg,
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item.button:focus svg {
fill: #fff !important; }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container:hover .drop-down-container,
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container:focus .drop-down-container,
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .link:focus + .drop-down-container {
opacity: 1;
visibility: visible;
transform: scaleY(1); }
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container .link:focus:after,
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container:hover > .link:after,
html:not(.active-mobile-nav) .main-nav .admin-nav-list .root-link-container:focus > .link:after {
height: 4px;
inset: auto 0 .5em 0;
opacity: 1; }
/* ACTIVE MOBILE NAV */
@media (max-width: 70.615em) {
.admin-nav-list li {
align-items: center;
justify-content: center; }
html:not(.active-mobile-nav) .admin-nav-list .root-link-container {
flex-flow: column nowrap; }
html:not(.active-mobile-nav) .admin-nav-list .root-link-container.mobile-link {
display: none; }
html:not(.active-mobile-nav) .admin-nav-list .root-link-container > .link {
display: flex;
flex: 1 1 100%;
align-items: center; }
html.active-mobile-nav {
overflow: clip !important; }
html.active-mobile-nav body {
overflow: clip; }
html.active-mobile-nav .header-alert {
position: absolute !important;
transform: translateY(-100%);
opacity: 0; }
html.active-mobile-nav .admin-header-wrapper {
/* _______ LOGO STYLING MOVED TO : admin-theme.scss */ }
html.active-mobile-nav .admin-header-wrapper .admin-alerts-icon {
opacity: .5;
z-index: 0; }
html.active-mobile-nav .admin-header-wrapper .admin-nav-hamburger .hamburger:before {
transform: scaleX(0.65); }
html.active-mobile-nav .admin-header-wrapper .admin-nav-hamburger .hamburger:after {
transform: scaleX(0.35); }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list {
position: fixed;
display: block;
top: 60px;
left: 0;
right: 0;
bottom: 0;
width: 100%;
background: none repeat scroll 0 0;
z-index: 0;
padding: .5em;
overflow-x: hidden;
overflow-y: auto;
cursor: pointer;
/* < for iOS */
background-color: #e9e9e9; }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list::-webkit-scrollbar {
-webkit-appearance: none;
width: .5em; }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list::-webkit-scrollbar-track {
background-color: #2d2d2d;
border-radius: 0; }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list::-webkit-scrollbar-thumb {
border-radius: 0;
background-color: rgba(255, 255, 255, 0.35);
opacity: .4; }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list:before {
content: "";
display: block;
height: 55px;
position: fixed;
top: 0;
width: 100%;
z-index: 20;
background-color: transparent;
border: none; }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list .root-link-container {
max-width: 320px;
margin: 2px auto 0 auto;
font-size: 1.25em;
list-style: none;
opacity: 1;
pointer-events: auto;
overflow: hidden; }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list .root-link-container.mobile-link {
display: block; }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list .link {
text-align: left;
padding: 1.75vh 60px 1.75vh 30px;
color: #000;
letter-spacing: 1px;
background-color: #f5f5f5;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
position: relative; }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list .link .drop-down-arrow {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 55px;
cursor: pointer;
z-index: 2;
background-color: rgba(45, 151, 204, 0.9); }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list .link .drop-down-arrow:after {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
margin: auto;
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHZpZXdCb3g9IjAgMCAxOS40IDM0LjYiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDE5LjQgMzQuNjsiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwb2x5Z29uIGZpbGw9IiNmZmZmZmYiIGRhdGEtdmlld0JveD0iMCAwIDE5LjQgMzQuNiIgcG9pbnRzPSIxOS40LDE3LjMgMi4xLDAgMCwyLjEgMTUuMiwxNy4zIDAsMzIuNCAyLjMsMzQuNiIvPjwvc3ZnPg==);
background-repeat: no-repeat;
background-position: center;
background-size: 30%;
transition: transform 0.35s ease; }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list .link[drop-down-sub-menu-trigger]:after {
content: '';
position: absolute;
top: 0;
bottom: 0;
margin: auto;
right: 16px;
width: 1px;
height: 1px;
border: 8px solid transparent;
border-left-color: #fff; } }
@media (max-width: 70.615em) and (min-height: 1200px) {
html.active-mobile-nav .admin-header-wrapper .admin-nav-list .link {
padding-top: 1.1vh;
padding-bottom: 1.1vh; } }
@media (max-width: 70.615em) {
html.active-mobile-nav .admin-header-wrapper .admin-nav-list .root-link-container.active > .link {
background-color: #2d97cc;
color: #fff; }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list .root-link-container.active > .link svg {
fill: #fff; }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list .root-link-container.active .drop-down-arrow:after {
transform: rotateZ(90deg); }
html.active-mobile-nav .admin-header-wrapper .admin-nav-list .drop-down-container .button:hover,
html.active-mobile-nav .admin-header-wrapper .admin-nav-list .drop-down-container .button:focus {
background-color: #f5f5f5 !important;
box-shadow: inset 0 0 0 3px #2d97cc; } }
@media (min-width: 70.625em) {
ul.admin-nav-list li .link {
color: #636363; } }
.admin-nav-extras > div:first-child {
margin-left: 4px; }
.admin-nav-extras > div + div {
margin-left: 8px; }
.admin-nav-extras .admin-alerts-icon {
flex: 0 1 auto;
display: flex;
align-items: center; }
@media (max-width: 31.25em) {
.admin-nav-extras .admin-alerts-icon.visit-site {
display: none; } }
@media (max-width: 48em) {
.admin-nav-extras .admin-alerts-icon.help-icon {
display: none; } }
@media (max-width: 55em) {
.admin-nav-extras .admin-alerts-icon.bell-icon {
display: none; } }
.admin-nav-extras .admin-search-module {
flex: 0 1 auto;
display: flex;
flex-flow: column nowrap;
justify-content: center;
width: 30px;
transition: width 0.3s ease; }
.admin-nav-extras .admin-search-module .input-container {
position: absolute;
right: 0;
top: 0;
bottom: 0;
width: 100%;
height: 100%;
visibility: hidden;
transition: transform 0.5s ease, background-color 0.35s ease;
z-index: 101;
max-width: 600px;
transform: scaleX(0);
transform-origin: center right;
background-color: #464646;
color: #fff;
line-height: 1;
/*border-radius: 1em;*/ }
.admin-nav-extras .admin-search-module .input-container .search-input {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
background-color: transparent;
color: inherit;
padding: 0 1em;
font-size: 1em;
line-height: inherit;
border: none;
outline: none;
-webkit-appearance: none;
line-height: 1; }
.admin-nav-extras .admin-search-module .input-container .search-input:focus + .placeholder-txt {
opacity: 0; }
.admin-nav-extras .admin-search-module .input-container .placeholder-txt {
position: absolute;
left: 1em;
top: 50%;
transform: translateY(-50%);
color: inherit;
display: inline-block;
pointer-events: none;
transition: opacity 0.7s ease; }
.admin-nav-extras .admin-search-module .input-container .placeholder-txt:before {
content: 'Search in Pages...';
color: inherit; }
.admin-nav-extras .admin-search-module [search-button] {
display: flex;
flex: 1 1 100%;
position: relative;
cursor: pointer;
background-color: transparent;
border-radius: 0;
margin: 0;
padding: 0;
height: 100%;
z-index: 102;
transition: background-color 0.35s ease;
z-index: 102; }
.admin-nav-extras .admin-search-module [search-button] .svg-icon {
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 75%;
height: 75%;
margin: auto;
fill: #fff;
width: 30px;
height: 30px;
background-color: #888888;
border-radius: 50%;
overflow: hidden;
transition: transform 0.85s ease; }
.admin-nav-extras .admin-search-module [search-button]:hover .svg-icon, .admin-nav-extras .admin-search-module [search-button]:focus .svg-icon {
background-color: #add06d; }
@media (min-width: 48em) {
.admin-nav-extras .admin-search-module .admin-search-module {
max-width: 300px; } }
.admin-nav-extras .admin-search-module.active {
width: 80px; }
.admin-nav-extras .admin-search-module.active .input-container {
transform: scaleX(1);
visibility: visible; }
.admin-nav-extras .admin-search-module.active [search-button] {
background-color: #888888;
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 26%;
max-width: 100px; }
.admin-nav-extras .admin-search-module.active [search-button]:hover, .admin-nav-extras .admin-search-module.active [search-button]:focus {
background-color: #add06d;
/**/ }
.admin-nav-extras .admin-search-module.active [search-button]:hover .svg-icon, .admin-nav-extras .admin-search-module.active [search-button]:focus .svg-icon {
transform: scale(1.25); }
.admin-nav-extras .admin-search-module.active [search-button] .svg-icon {
background-color: transparent; }
@media (min-width: 25em) {
.admin-nav-extras .admin-search-module.active {
width: 100px; } }
html.site-search-active .admin-nav-list .root-link-container {
opacity: 0;
pointer-events: none; }
html.site-search-active .admin-search-module {
transition: width 1s ease; }
.admin-alerts-icon .svg-help-icon:hover,
.admin-alerts-icon .svg-help-icon:focus {
background-color: #a14ff6; }
.admin-alerts-icon .svg-visit-site-icon:hover,
.admin-alerts-icon .svg-visit-site-icon:focus {
background-color: #2d97cc; }
.admin-alerts-icon .svg-bell-icon:hover,
.admin-alerts-icon .svg-bell-icon:focus {
background-color: #464646;
fill: #ffb923; }
.ntfy-container.ntfy-container-header {
position: relative;
z-index: 1; }
.ntfy-container.ntfy-container-header.ntfy-show {
z-index: 9001; }
.ntfy-block-ui {
background-color: rgba(255, 255, 255, 0.4); }
/*@media (min-width: $medium-viewport) {
.admin-nav-list .link:hover { background-color: darken( $brand-a, 15%); }
}*/
@media (min-width: 70.625em) {
.admin-header-wrapper {
padding-top: 0;
padding-bottom: 0; }
.admin-nav-hamburger {
display: none; }
.main-nav {
position: relative;
display: flex;
flex-flow: row nowrap;
margin: 0 auto; }
.top-nav {
width: 100%; }
.top-nav .admin-nav-list {
margin-top: .25em; }
.top-nav .admin-nav-list .separator {
position: relative;
height: 100%;
width: 1px;
opacity: 1;
transition: opacity 0.3s ease; }
.top-nav .admin-nav-list .separator:before {
content: "";
width: 1px;
height: 14px;
background: #888888;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%); }
.top-nav .admin-nav-list .separator:has(+ .root-link-container:hover), .top-nav .admin-nav-list .separator:has(+ .root-link-container:focus) {
opacity: 0; }
.top-nav .admin-nav-list .root-link-container {
overflow: visible;
flex-flow: column nowrap;
flex: 0 1 auto; }
.top-nav .admin-nav-list .root-link-container > .link {
font-size: .875em;
flex: 1 1 100%;
display: flex;
align-items: center;
justify-content: center;
padding: .857em 1em;
transition: color 0.3s ease; }
.top-nav .admin-nav-list .root-link-container > .link:after {
content: "";
position: absolute;
bottom: .5em;
height: 4px;
width: 0;
opacity: 0;
background-color: #2d97cc;
transition: height 0.3s ease, width 0.3s ease 0.3s, opacity 0.3s ease 0.6s;
z-index: -1; }
.top-nav .admin-nav-list .root-link-container > .link svg {
fill: #596371;
transition: fill 0.3s ease; }
.top-nav .admin-nav-list .root-link-container > .link .drop-down-arrow {
display: none; }
.top-nav .admin-nav-list .root-link-container > .link .text {
position: relative; }
.top-nav .admin-nav-list .root-link-container:hover .drop-down-container,
.top-nav .admin-nav-list .root-link-container:focus .drop-down-container,
.top-nav .admin-nav-list .root-link-container .link:focus + .drop-down-container {
opacity: 1;
visibility: visible;
transform: scaleY(1); }
.top-nav .admin-nav-list .root-link-container .link:focus,
.top-nav .admin-nav-list .root-link-container:hover > .link,
.top-nav .admin-nav-list .root-link-container:focus > .link {
color: #fff;
transition: color 0.3s ease 0.3s; }
.top-nav .admin-nav-list .root-link-container .link:focus:after,
.top-nav .admin-nav-list .root-link-container:hover > .link:after,
.top-nav .admin-nav-list .root-link-container:focus > .link:after {
opacity: 1;
width: 100%;
height: calc(100% - 1em);
transition: height 0.3s ease 0.3s, width 0.3s ease, opacity 0.3s ease; }
.top-nav .admin-nav-list .root-link-container .link:focus svg,
.top-nav .admin-nav-list .root-link-container:hover > .link svg,
.top-nav .admin-nav-list .root-link-container:focus > .link svg {
fill: #fff;
transition: fill 0.3s ease 0.3s; }
.top-nav .admin-nav-list .root-link-container:hover + .separator,
.top-nav .admin-nav-list .root-link-container:focus + .separator {
opacity: 0; }
.main-nav .admin-nav-list .drop-down-container {
position: absolute;
top: 100%;
left: 0;
right: 0;
min-width: 250px;
opacity: 0;
visibility: hidden;
max-height: 88vh;
overflow: auto;
box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.35);
padding: .25em; }
.main-nav .admin-nav-list .drop-down-container:has(li:nth-child(6)) {
min-width: 400px; }
.main-nav .admin-nav-list .drop-down-container::-webkit-scrollbar {
-webkit-appearance: none;
width: .35em; }
.main-nav .admin-nav-list .drop-down-container::-webkit-scrollbar-track {
background-color: rgba(255, 255, 255, 0.75);
border-radius: 0; }
.main-nav .admin-nav-list .drop-down-container::-webkit-scrollbar-thumb {
border-radius: 0;
background-color: #000;
opacity: .4; }
.main-nav .admin-nav-list .root-link-container {
overflow: visible;
flex-flow: column nowrap;
flex: 0 1 auto; }
.main-nav .admin-nav-list .root-link-container.mobile-link {
display: none; }
.main-nav .admin-nav-list .root-link-container:nth-last-child(-n+6) .drop-down-container {
left: auto;
right: 0; }
.main-nav .admin-nav-list .root-link-container .drop-down-container {
transform: scaleY(0);
height: auto;
transform-origin: top center;
transition: transform 0.35s ease, opacity 0.5s ease; }
.main-nav .admin-nav-list .root-link-container .drop-down-container li {
flex: 0 1 100%;
padding: 0;
min-height: 60px; }
.main-nav .admin-nav-list .root-link-container .drop-down-container li + li {
margin-top: 0; }
.main-nav .admin-nav-list .root-link-container .drop-down-container:has(li:nth-child(6)) li {
flex: 1 1 50%; }
.main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item {
display: flex;
flex: 1 1 100%;
align-items: center;
margin: 3px;
padding: .75em;
border-radius: 0;
box-shadow: none;
text-align: left;
line-height: 1.25; }
.main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item:hover, .main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item:focus,
.main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item.button:hover,
.main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item.button:focus {
background-color: #23759e !important;
color: #fff !important; }
.main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item:hover svg, .main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item:focus svg,
.main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item.button:hover svg,
.main-nav .admin-nav-list .root-link-container .drop-down-container .flex-item.button:focus svg {
fill: #fff !important; }
.main-nav .admin-nav-list .root-link-container > .link {
font-size: 1.25em;
flex: 1 1 100%;
display: flex;
align-items: center;
justify-content: center;
padding: .4em 1em 1em 1em; }
.main-nav .admin-nav-list .root-link-container > .link:after {
content: "";
position: absolute;
inset: auto 0 0 0;
height: 0;
background-color: #2d97cc;
opacity: 0;
transition: height 0.3s ease, inset 0.3s ease, opacity 0.3s ease; }
.main-nav .admin-nav-list .root-link-container > .link svg .nav-icon-fill {
fill: #0c94cb; }
.main-nav .admin-nav-list .root-link-container > .link .drop-down-arrow {
display: none; }
.main-nav .admin-nav-list .root-link-container > .link .text {
position: relative; }
.main-nav .admin-nav-list .root-link-container > .link .text:after {
content: '';
position: absolute;
bottom: -2px;
left: 0;
right: 0;
transform: scaleX(0);
transition: opacity 0.5s ease, transform 0.5s ease;
background-color: #fff;
opacity: 0;
width: 100%;
height: 1px; }
.nav-list .link {
font-size: 1.1em;
vertical-align: middle; }
.nav-triangle {
position: relative; }
.nav-triangle.active {
background: transparent;
position: relative; }
.nav-triangle.active:before {
bottom: 0px; }
.nav-triangle:before {
content: '';
position: absolute;
bottom: -100px;
transition: all 0.2s ease;
left: 0;
right: 0;
width: 0;
height: 0;
margin: auto;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 15px solid #f2f2f2; }
.nav-triangle:hover {
background: transparent !important;
position: relative; }
.nav-triangle:hover:before {
bottom: -2px; }
.admin-nav-list {
display: flex;
flex-flow: row nowrap;
align-items: stretch;
/* height: 100%; - removed for old Safari Desktop */ }
.admin-nav-list li .link {
font-size: .9em; } }
@media (min-width: 85.3125em) {
.admin-nav-list .root-link-container .link {
font-size: 1em; } }
@media (min-width: 100em) {
.admin-nav-list .root-link-container .link {
font-size: 1.1em; }
.admin-nav-list .drop-down-container .flex-item {
font-size: .95em; }
.admin-nav-wrap {
padding-left: 15%; } }
@media (min-width: 118.75em) {
.admin-nav-list .root-link-container .link {
font-size: 1.15em; } }
@media (min-width: 118.75em) and (min-height: 1200px) {
.admin-nav-list .drop-down-container .flex-item {
font-size: 1em; } }
@media (min-width: 125em) and (min-height: 1000px) {
.admin-nav-list .root-link-container .link {
font-size: 1.2em; } }
.sticky-dash {
position: fixed;
bottom: 0;
top: 0;
right: -100vh;
display: flex;
z-index: 2147483649;
box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.5);
background-color: #ffffff;
transition: right ease-in-out 0.35s, height ease-in-out 0.35s;
height: 100%;
max-height: 100%;
max-width: 100%;
width: 100vh;
padding: 0 0 2vh; }
.sticky-dash .sticky-panel {
display: flex;
align-items: center;
height: 100%;
flex-flow: row wrap;
width: 100%; }
@media (max-width: 70.625em) {
.sticky-dash .sticky-panel {
padding-bottom: 4em; } }
.sticky-dash .content-panel-container {
max-width: 100%;
max-height: calc(100% + 2em);
width: 100%;
height: 100%;
overflow-y: auto;
transform: translateX(100%);
transition: transform 0.6s cubic-bezier(0.38, -0.3, 0.32, 1.3), max-height 0.35s ease-in;
transform-origin: top center; }
body:has(.header-alert) .sticky-dash .content-panel-container {
padding: var(--navHeightNoAlert, 108px) 4em 0; }
body:not(:has(.header-alert)) .sticky-dash .content-panel-container {
padding: var(--navHeight, 108px) 4em 0; }
.sticky-dash .content-panel-container .cms-content {
height: 100%;
position: relative;
padding-top: 2em; }
.sticky-dash .content-panel-container .cms-content .link.close-btn {
position: absolute;
top: 0;
left: 0; }
.sticky-dash .content-panel-container .cms-content .content {
display: flex;
flex-flow: column nowrap;
justify-content: flex-start;
align-items: flex-start;
height: 100%; }
.sticky-dash .content-panel-container .cms-content .content .top-user,
.sticky-dash .content-panel-container .cms-content .content .edit-signout {
flex: 0 1 auto;
width: 100%; }
.sticky-dash .content-panel-container .cms-content .content .bottom-user {
flex: 1 1 auto;
width: 100%;
display: flex;
flex-flow: column nowrap; }
.sticky-dash .content-panel-container .cms-content .content .bottom-user .system {
flex: 0 1 auto;
width: 100%; }
.sticky-dash .content-panel-container .cms-content .content .bottom-user .drop-down-system {
flex: 1 1 auto;
width: 100%; }
.sticky-dash .content-panel-container::-webkit-scrollbar {
-webkit-appearance: none;
width: .5em; }
.sticky-dash .content-panel-container::-webkit-scrollbar-track {
background-color: rgba(45, 151, 204, 0.35);
border-radius: 0; }
.sticky-dash .content-panel-container::-webkit-scrollbar-thumb {
border-radius: 0;
background-color: var(--color_b);
opacity: .4; }
.sticky-dash .close-btn {
height: 44px;
width: 44px;
border-radius: 22px;
display: inline-block;
position: relative;
transform: rotate(45deg) translate(-50%);
transition: background-color 0.3s ease; }
.sticky-dash .close-btn:before, .sticky-dash .close-btn:after {
content: "";
position: absolute;
top: 50%;
left: 50%;
display: block;
transform: translate(-50%, -50%);
background: #2d97cc;
transition: background-color 0.3s ease; }
.sticky-dash .close-btn:before {
height: 1.5px;
width: 15px; }
.sticky-dash .close-btn:after {
width: 1.5px;
height: 15px; }
.sticky-dash .close-btn:hover, .sticky-dash .close-btn:focus {
background-color: #2d97cc; }
.sticky-dash .close-btn:hover:before, .sticky-dash .close-btn:hover:after, .sticky-dash .close-btn:focus:before, .sticky-dash .close-btn:focus:after {
background-color: #fff; }
.sticky-dash .top-user .name {
font-weight: 700;
color: #2d97cc; }
.sticky-dash .top-user .role,
.sticky-dash .top-user .adminlink,
.sticky-dash .top-user .edit-signout {
font-size: .875em; }
.sticky-dash .top-user .adminlink a,
.sticky-dash .top-user + .edit-signout a {
font-weight: 700;
color: #2d97cc; }
.sticky-dash .top-user .adminlink a:hover, .sticky-dash .top-user .adminlink a:focus,
.sticky-dash .top-user + .edit-signout a:hover,
.sticky-dash .top-user + .edit-signout a:focus {
text-decoration: underline; }
.sticky-dash .top-user + .edit-signout {
border-top: 1.5px solid #A0A0A0;
border-bottom: 1.5px solid #A0A0A0;
padding: .75em 0;
margin-top: .75em;
cursor: pointer; }
.sticky-dash .top-user + .edit-signout a {
margin: 0 .25em; }
.sticky-dash .top-user + .edit-signout a:first-child {
margin-left: 0; }
.sticky-dash .top-user + .edit-signout a:last-child {
margin-right: 0; }
.sticky-dash .bottom-user {
margin-top: .75em; }
.sticky-dash .bottom-user .Alerts.Here span.text {
color: #2d97cc;
font-weight: bold;
margin: 1em 0 .75em;
font-size: 1.25em;
display: block; }
.sticky-dash .bottom-user .Alerts.Here p, .sticky-dash .bottom-user .Alerts.Here ul, .sticky-dash .bottom-user .Alerts.Here ol {
margin-bottom: 1em; }
@media (min-width: 70.625em) {
.sticky-dash {
position: fixed;
max-width: 100%;
/* left: 0%; */
bottom: 0%;
top: 0;
right: -490px;
transform-origin: bottom left;
width: 490px;
/* @include transform(rotateZ(-90deg)); */ }
.sticky-dash .sticky-panel {
flex-flow: row nowrap; }
.sticky-dash .content-panel-container {
max-height: 100%;
overflow-y: auto;
transform: translateX(100%);
height: 100%;
/* @include transition(transform ease-in-out 0s);@include transform-origin(top center); */ } }
.side-sticky-open #sticky-dash-modal.modal {
z-index: 1002;
opacity: 1;
pointer-events: auto; }
.side-sticky-open #sticky-dash-modal.modal .toggle-hit-target {
position: absolute;
inset: 0; }
.side-sticky-open .sticky-dash {
left: auto;
right: 0;
z-index: 2147483649; }
.side-sticky-open .content-panel-container {
transform: translateX(0%); }
.sticky-click {
cursor: pointer; }
.header-alert {
display: flex;
position: absolute;
left: 0;
right: 0;
opacity: 0;
pointer-events: none;
width: 100%;
max-width: 100%;
z-index: 1000;
text-align: center;
font-size: .6em;
/* THEME */
/* ACTIVE */
/* HIDE */ }
.header-alert.show {
opacity: 1;
position: relative;
margin-top: 0px !important;
pointer-events: auto;
transition: margin-top 0.5s ease, padding-top 1s ease, padding-bottom 1s ease, opacity 1s ease !important; }
.header-alert .inner {
flex: 1 1 auto;
padding: 1.25em 3% 1.25em 6%; }
.header-alert .content {
max-width: 1000px;
margin: 0 auto;
height: 0;
position: relative;
transition: transform 0.75s ease;
transform: scale(0);
transform-origin: center top; }
.header-alert .content h2 p.title {
color: #fff;
font-size: 1.7em;
line-height: 1.9;
margin: 0;
font-weight: 700; }
.header-alert .content p {
font-size: 1.5em;
line-height: 1.5;
font-weight: 400;
margin: 0 0 1em; }
.header-alert .content .button {
margin-top: .75em;
font-size: 1.25em;
font-weight: bold;
padding: .75em 1em;
background: #fff;
color: #2d97cc; }
.header-alert .content .button:hover, .header-alert .content .button:focus {
background: #2d97cc;
color: #fff; }
.header-alert .content .warning-icon {
width: 100%;
max-width: 25px;
margin: 0 auto; }
.header-alert .content-toggle {
display: inline-block;
border-radius: 35px;
letter-spacing: .5px;
line-height: 1.5; }
.header-alert .alert-nav {
display: flex;
flex: 0 1 auto;
flex-flow: row nowrap;
align-items: flex-start;
justify-content: center;
padding: 1em 3% 1em 1em; }
.header-alert .alert-nav .nav-item {
position: relative;
flex: 0 1 30px;
min-height: 30px;
min-width: 30px;
border-radius: 50%;
cursor: pointer;
transition: background-color 0.4s ease; }
.header-alert .alert-nav .nav-item + .nav-item {
margin-left: 4px; }
.header-alert .alert-nav .nav-item .icon {
position: absolute;
top: 30%;
right: 30%;
bottom: 30%;
left: 30%;
width: 40%;
height: 40%;
pointer-events: none; }
.header-alert.theme-default {
background-color: #f87d3f; }
.header-alert.theme-default p {
color: #fff; }
.header-alert.theme-default .nav-item {
box-shadow: inset 0 0 0 1px #fff; }
.header-alert.theme-default .nav-item .icon {
fill: #fff; }
.header-alert.theme-default .warning-icon {
fill: #fff; }
.header-alert.theme-default .nav-item:hover, .header-alert.theme-default .nav-item:focus,
.header-alert.theme-default .content-toggle:hover,
.header-alert.theme-default .content-toggle:focus {
background-color: #464646; }
@media (min-width: 31.25em) {
.header-alert {
font-size: .7em; } }
@media (max-width: 47.99em) {
.header-alert {
/* let reveal button sit in center @ smaller screens */ }
.header-alert:not(.active) .alert-nav {
position: absolute;
top: 0;
right: 0;
bottom: 0; } }
@media (min-width: 48em) {
.header-alert {
font-size: .8em; }
.header-alert .inner {
padding: 1.5em 2% 1.5em 8%; }
.header-alert .content {
transform: scale(1);
height: auto;
/* @include flexbox(); @include justify-content(center); */
max-width: 1400px; }
.header-alert .content p {
align-self: center;
flex: 0 1 auto;
font-size: 1.4em; }
.header-alert .content .button {
flex: 0 0 200px;
align-self: center;
justify-self: flex-end;
margin: 0 auto; }
.header-alert .content-toggle {
display: none; }
.header-alert .content .warning-icon {
position: absolute;
right: 100%;
top: 50%;
width: 25px;
height: 25px;
margin: -11px 25px 0 0; } }
@media (min-width: 70.625em) {
.header-alert .alert-nav {
right: 2%; }
.header-alert .alert-nav .nav-item {
min-width: 36px;
min-height: 36px; } }
@media (min-width: 100em) {
.header-alert .inner {
padding-top: 2vh;
padding-bottom: 2vh; } }
.header-alert.active .content {
transform: scale(1);
height: auto; }
.header-alert.active .content .button {
animation: none; }
.header-alert.active .content-toggle {
display: none; }
.header-alert.hide-alert {
padding-top: 0;
padding-bottom: 0;
opacity: 0;
height: 0; }
h2.section-title {
margin: 0 0 .5em 0; }
.theme-white.content {
color: #fff; }
.theme-white.content h1, .theme-white.content h2, .theme-white.content h3, .theme-white.content h4, .theme-white.content h4, .theme-white.content p, .theme-white.content li, .theme-white.content .title, .theme-white.content .keyword {
color: #fff; }
.admin-section .section-title {
color: #2d97cc; }
.theme-section-grey-200 {
background-color: #f2f2f2; }
.theme-section-grey-300 {
background-color: #e7e7e7; }
.theme-section-grey-700 {
background-color: #3a3a3a; }
.theme-section-grey-700 .section-title {
color: #fff; }
.admin-container {
/* overwrite theme CSS default */ }
.admin-container h1, .admin-container h2, .admin-container h3, .admin-container h4, .admin-container h5 {
font-family: "Figtree", sans-serif; }
.admin-container p.small-title {
display: none; }
@media (min-width: 85.3125em) {
.admin-container p.small-title {
font-family: "Figtree", sans-serif;
font-size: .875em;
color: #434a4c;
padding-bottom: 1em;
display: block; } }
.columns {
zoom: 1; }
.columns:before, .columns:after {
content: '';
display: table; }
.columns:after {
clear: both; }
@media (min-width: 37.5em) {
.columns .column {
float: left; }
.width-25 {
width: 25%; }
.width-30 {
width: 30%; }
.width-50 {
width: 50%; }
.width-70 {
width: 70%; }
.width-100 {
width: 100%; } }
div[data-offc-container]:has(.login-form) {
min-height: 100vh;
display: flex;
flex-flow: column nowrap; }
div[data-offc-container]:has(.login-form) header, div[data-offc-container]:has(.login-form) footer {
flex: 0 1 auto; }
div[data-offc-container]:has(.login-form) .login-form {
flex: 1 1 auto;
display: flex;
flex-flow: row wrap;
align-items: center; }
div[data-offc-container]:has(.login-form) .aspNetHidden {
display: none; }
.login-form {
margin: 0 auto 3em;
max-width: 500px;
padding: 2em; }
.login-form input {
border: 1px solid #d3d3d3; }
.admin-content {
overflow: hidden;
transition: padding-top 1s ease; }
.admin-content.no-left-nav .admin-content-wrapper {
padding-top: 1.5em; }
.admin-content.no-left-nav .admin-left-nav {
display: none; }
.admin-content.no-left-nav .page-content {
width: 100%;
padding-left: 0; }
.admin-content.no-left-nav .page-title {
margin-top: .25em; }
.admin-content-wrapper {
overflow: hidden;
padding-top: 2.5em;
padding-bottom: 2em;
position: relative; }
@media (min-width: 37.5em) {
.admin-content-wrapper {
padding-top: 1.5em; } }
.admin-content--wrapper .cms-region-selector,
.admin-content--wrapper .small-title,
.admin-content--wrapper .dashboard-main {
max-width: 1360px;
margin: 0 auto; }
.admin-content--wrapper {
padding-top: 1.75em;
padding-bottom: 1.75em;
position: relative;
overflow: hidden; }
@media (min-width: 37.5em) {
.admin-content--wrapper {
padding-top: 2.25em;
padding-bottom: 2.25em; } }
@media (min-width: 100em) {
.admin-content--wrapper {
padding-top: 2.75em;
padding-bottom: 2.75em; } }
.page-content {
position: relative; }
.padding-bottom {
padding-bottom: 2em; }
.buttons-container {
margin-bottom: 2em; }
.admin-secondary-wrapper {
padding: 0 !important; }
.admin-secondary-wrapper .box-container {
padding: 2em 1em;
background: white; }
.admin-secondary-wrapper .box-container + .box-container {
margin-top: 1em; }
.flex-group:has(.admin-secondary-wrapper), .flex-nav:has(.admin-secondary-wrapper) {
align-items: flex-start;
justify-content: stretch; }
.admin-secondary-wrapper {
flex: 1 1 76%;
padding-left: 0;
padding-right: 0; }
.admin-feature-wrapper {
flex: 1 1 24%;
padding-left: 1em;
padding-right: 0;
text-align: center;
order: -1;
max-width: calc(100vw - 2.5em); }
@media (min-width: 37.5em) {
.admin-feature-wrapper {
min-width: 400px; } }
@media (min-width: 85.3125em) {
.admin-feature-wrapper {
order: 2;
min-width: 300px; } }
.admin-section:first-of-type > .admin-content--wrapper {
padding-top: .5em; }
.admin-section .section-title {
margin-left: 1vw;
font-size: 1.4em;
font-weight: 600; }
@media (min-width: 25em) {
.admin-section .section-title {
font-size: 1.5em; } }
@media (min-width: 31.25em) {
.admin-section .section-title {
font-size: 1.6em; } }
@media (min-width: 37.5em) {
.admin-section .section-title {
font-size: 1.7em; } }
@media (min-width: 48em) {
.admin-section .section-title {
font-size: 1.8em; } }
body.cms-region-selector-active .admin-content--wrapper {
overflow: visible; }
body.cms-region-selector-active .cms-region-selector {
display: block;
margin: 0 auto 1.25em auto;
padding: 1em 1em 2em;
max-width: 492px;
border-radius: 0;
background-color: #fff; }
body.cms-region-selector-active .cms-region-selector label {
width: 100%;
display: block;
text-align: left;
font-weight: 700;
color: #0070a5;
font-size: 1.5625em;
padding: 0 .5em .25em; }
body.cms-region-selector-active .cms-region-selector select {
width: calc(100% - 1.5em);
max-width: 100%;
background-color: #fff;
outline: none;
box-shadow: inset 0 0 0 1px #87cbe5;
font-weight: bold;
font-size: 1em;
height: auto;
margin: 0 .5em;
padding: .5625em 1em;
border-radius: 3em; }
@media (min-width: 25em) {
body.cms-region-selector-active .cms-region-selector {
margin-left: auto; } }
body.cms-region-selector-active .admin-left-nav {
margin-top: calc(var(--navHeight, 108px)); }
.module-flex.layout-slat .flex-inner {
position: relative; }
.module-flex.layout-slat .bg-img {
flex: 1 1 30%;
min-height: 90px;
max-height: 100px;
max-width: 150px;
/* &.user-image { background-size: contain; } */ }
.module-flex.layout-slat .content-container {
flex: 1 1 70%; }
.module-flex.layout-slat .title {
overflow-wrap: break-word;
word-wrap: break-word; }
.module-flex.layout-slat .content-container .content {
padding: .25em .5em; }
.module-flex.layout-slat .bg-img ~ .content-container .content {
padding: .25em 5% .5em 5%; }
.module-flex.layout-slat .box-offset-action {
opacity: 0;
visibility: hidden;
top: .5em;
right: .5em;
width: 24px;
height: 24px;
padding: 0;
z-index: 2; }
.module-flex.layout-slat .box-offset-action.svg-close-icon {
background-color: #888888;
fill: #fff; }
.module-flex.layout-slat .box-offset-action:hover, .module-flex.layout-slat .box-offset-action:focus {
background-color: #464646; }
.module-flex.layout-slat:hover .box-offset-action, .module-flex.layout-slat:focus .box-offset-action {
opacity: 1;
visibility: visible; }
.module-flex.layout-slat:empty {
display: none; }
/* CALLOUT BOX SECTION ___________________________________________________________________________________________ */
.box-container {
/* BOX */ }
.box-container .shortcuts-menu {
flex: 1 1 100%;
max-width: 100%; }
.box-container .callout-boxes {
flex: 1 1 100%;
max-width: 100%;
justify-content: center; }
.box-container .callout-boxes > .flex-item {
flex: 1 1 260px;
min-width: 50%; }
.box-container .callout-boxes .module-list {
margin-bottom: .75em; }
.box-container a.module-flex {
cursor: pointer; }
.box-container > .flex-container,
.box-container > .flex-container > .flex-container {
align-content: stretch; }
.box-container.flex-container:has(.dashboard-box--pages) .flex-container.flex-item {
align-content: flex-start;
flex-flow: column nowrap; }
.box-container .box {
width: calc(100% - 2vw);
margin: 0 1vw 2vw 1vw;
font-size: .95em; }
.box-container .box .module-flex.layout-slat .content {
transition: background-color 0.5s ease; }
.box-container .box .box-button {
font-size: .975em; }
@media (min-width: 48em) {
.box-container .box .box-button {
font-size: 1.1em; } }
.box-container .box .box-front .module-flex.layout-slat:hover .content, .box-container .box .box-front .module-flex.layout-slat:focus .content {
background-color: #f5f5f5; }
.box-container .box .box-back-title {
margin-bottom: .5em; }
@media (min-width: 25em) and (max-width: 37.5em) {
.box-container {
padding: 0 7%; }
.box-container .box {
margin-bottom: 1.5em; } }
@media (min-width: 64em) {
.box-container .callout-boxes {
flex-basis: 66.66666%; }
.box-container .shortcuts-menu {
flex-basis: 33.33333%; }
.box-container .box {
font-size: .8em; } }
@media (min-width: 70.625em) {
.box-container .box {
font-size: .925em; } }
@media (min-width: 85.3125em) {
.box-container .box {
font-size: 1em; } }
@media (min-width: 118.75em) {
.box-container .box {
margin: 0 .75vw 1vw .75vw; } }
@media (min-width: 156.25em) {
.box-container .box {
margin: 0 .5vw 1vw .5vw; } }
/* ANALYTICS SECTION ___________________________________________________________________________________________ */
.analytics-section,
.broken-links-section {
min-width: 100%; }
.analytics-section .section-title,
.broken-links-section .section-title {
margin-bottom: .5em; }
.analytics-section .admin-stat .inner,
.broken-links-section .admin-stat .inner {
margin: 0 .5em; }
.analytics-section .admin-stat,
.broken-links-section .admin-stat {
padding: 0 1em; }
.analytics-section .canvas-chart,
.broken-links-section .canvas-chart {
display: flex;
flex-flow: row wrap;
align-items: center;
justify-content: center; }
.analytics-section .canvas-chart *,
.broken-links-section .canvas-chart * {
transition: none; }
.analytics-section .canvas-chart.pie-chart canvas,
.broken-links-section .canvas-chart.pie-chart canvas {
width: 100% !important;
height: auto !important; }
.analytics-section .canvas-chart.pie-chart .chart-wrap,
.broken-links-section .canvas-chart.pie-chart .chart-wrap {
flex: 0 1 41.8%; }
.analytics-section .canvas-chart.pie-chart .chart-legend,
.broken-links-section .canvas-chart.pie-chart .chart-legend {
flex: 0 1 58.2%;
display: flex;
justify-content: center;
margin: .5em 0; }
.analytics-section .canvas-chart.pie-chart .chart-legend span,
.broken-links-section .canvas-chart.pie-chart .chart-legend span {
font-weight: 300;
font-size: 0.875em;
color: #fff; }
.analytics-section .canvas-chart.pie-chart .chart-legend ul,
.broken-links-section .canvas-chart.pie-chart .chart-legend ul {
flex: 0 1 auto;
display: flex;
justify-content: center;
flex-flow: column nowrap;
margin: 0; }
.analytics-section .canvas-chart.pie-chart .chart-legend li,
.broken-links-section .canvas-chart.pie-chart .chart-legend li {
display: flex;
flex-flow: row nowrap;
flex: 0 1 auto; }
.analytics-section .canvas-chart.pie-chart .chart-legend .source:before,
.broken-links-section .canvas-chart.pie-chart .chart-legend .source:before {
content: "";
height: .9em;
width: .9em;
margin-right: .5em;
background-color: var(--background-color);
display: inline-block; }
.analytics-section .canvas-chart.pie-chart .chart-legend .percentage,
.broken-links-section .canvas-chart.pie-chart .chart-legend .percentage {
color: #fff;
margin-left: 0.5em;
font-weight: 400; }
@media (min-width: 31.25em) {
.analytics-section .admin-stat .inner,
.broken-links-section .admin-stat .inner {
margin: 0 1vw; } }
@media (min-width: 118.75em) {
.analytics-section .admin-stat .inner,
.broken-links-section .admin-stat .inner {
margin: 0 .75vw; } }
@media (min-width: 156.25em) {
.analytics-section .admin-stat .inner,
.broken-links-section .admin-stat .inner {
margin: 0 .5vw; } }
@media (min-width: 75em) {
.dashboard-stats-boxes .admin-stat.stat-flex-small {
flex-basis: 33%; } }
.admin-stat {
display: flex;
flex-flow: row wrap; }
.admin-stat .inner {
display: flex;
flex: 1 1 100%;
flex-flow: column nowrap;
padding: 1em 5% 2.3em 5%;
box-shadow: inset 0 0 0 8px transparent;
transform: translateZ(0);
-webkit-filter: blur(0);
transition: transform 0.35s ease, box-shadow 0.75s ease; }
.admin-stat.stat-flex-small {
flex: 1 1 20%;
min-width: 240px;
max-width: 100%; }
.admin-stat.stat-flex-33 {
flex: 1 1 50%;
max-width: 100%; }
@media (min-width: 55em) {
.admin-stat.stat-flex-33 {
flex: 1 1 33%; } }
.admin-stat.stat-flex-50 {
flex: 1 1 100%;
max-width: 100%; }
@media (min-width: 48em) {
.admin-stat.stat-flex-50 {
flex: 1 1 50%; } }
.admin-stat.box {
padding: 0;
margin: 0 0 2em;
box-shadow: none;
border: none; }
.admin-stat.yellow-stat .inner {
background-color: #ffb923; }
.admin-stat.orange-stat .inner {
background-color: #f87d3f; }
.admin-stat.green-stat .inner {
background-color: #add06d; }
.admin-stat.purple-stat .inner {
background-color: #AFA7D6; }
.admin-stat.grey-stat .inner {
background-color: #d3d3d3; }
.admin-stat.taupe-stat .inner {
background-color: #cec5b6; }
.admin-stat.navy-stat .inner {
background-color: #07465f; }
.admin-stat.blue-stat .inner {
background-color: #2d97cc; }
.admin-stat .brokenlinks-upsell {
display: block;
min-width: 100%;
margin-top: 1em; }
.admin-stat .brokenlinks-upsell .svg-intrinsic {
height: 28px;
width: 107.52px;
display: inline-block;
position: relative; }
.admin-stat .brokenlinks-upsell .svg-intrinsic .svg-container {
padding: 26.39508929% 0 0 0;
position: absolute;
width: 100%;
inset: 0; }
.admin-stat .brokenlinks-upsell .svg-intrinsic .svg-container svg {
height: 28.38px;
width: 107.53px;
display: inline-block;
position: absolute;
inset: 0; }
.admin-stat .brokenlinks-upsell p {
font-size: .875em;
color: #434a4c;
display: inline-block;
transform: translateY(-0.5em);
margin-left: 1.5em; }
.admin-stat .brokenlinks-upsell p a {
font-weight: 700;
color: #2d97cc; }
.stat-title {
flex: 0 1 auto;
display: flex;
margin-bottom: .5em; }
.stat-title h2 {
display: flex;
align-items: center;
font-size: 1.125em;
line-height: 1.2;
font-weight: 500;
color: #fff;
margin-right: 0.5em; }
.stat-title .icon {
width: 2em;
height: 2em;
flex: 0 0 2em;
align-self: flex-start;
transition: transform 0.3s ease; }
.stat-title .icon svg {
fill: #fff; }
@media (min-width: 37.5em) {
.stat-title h2 {
font-size: 1.125em; }
.stat-title .icon {
width: 3em;
height: 3em;
flex: 0 0 3em; } }
.stat-content {
flex: 1 1 auto;
display: flex;
flex-flow: row wrap;
justify-content: center;
align-content: center; }
.stat-content .stat {
color: #fff;
font-size: 3.125em;
line-height: 1.4;
font-weight: 500;
flex: 1 1 100%;
margin-bottom: 0;
opacity: .5; }
.stat-content .stat-desc {
color: #fff;
font-size: 0.75em;
line-height: 1.2;
font-weight: 300; }
.stat-content .stat-list {
margin-top: .25em;
margin-left: 0;
margin-right: 0;
flex: 1 1 100%; }
.stat-content .stat-list li {
list-style: none;
list-style-position: inside;
font-size: 1em;
line-height: 1.375;
font-weight: 700;
color: #2d97cc;
margin-bottom: 0; }
.stat-content .stat-list li:last-child {
margin-bottom: 0; }
.stat-content .stat-list li a {
display: flex;
flex-flow: row wrap;
justify-content: stretch;
align-items: flex-start;
width: 100%;
color: #2d97cc; }
.stat-content .stat-list li a:before {
content: "";
display: block;
margin: 0 .5em;
border-bottom: 1px dotted #434a4c;
flex: 1 1 auto;
height: 1em;
order: 2; }
.stat-content .stat-list li a span {
flex: 0 1 auto;
display: block; }
.stat-content .stat-list li a span.stat-brokenlinks-page-title,
.stat-content .stat-list li a span.stat-analytics-page-title {
order: 1; }
.stat-content .stat-list li a span.stat-brokenlinks-name,
.stat-content .stat-list li a span.stat-analytics-sessions {
order: 3;
font-size: .875em;
font-weight: 300;
color: #434a4c; }
.stat-content .stat-list li a span.stat-analytics-page-url {
order: 4;
width: 100%;
color: #888888;
font-size: .9em; }
.stat-content .stat-list li a span.stat-brokenlinks-page-title:after,
.stat-content .stat-list li a span.stat-analytics-page-title:after {
content: "View Page";
font-size: .65em;
color: #434a4c;
background: #fff;
padding: .7em 1em 0;
font-weight: 700;
line-height: 1;
border-radius: 1em;
position: absolute;
transform: translateX(-20%);
opacity: 0;
transition: all 0.3s ease; }
.stat-content .stat-list li a span.stat-brokenlinks-page-title:after {
content: "Edit Page"; }
.stat-content .stat-list li a:hover span.stat-brokenlinks-page-title:after,
.stat-content .stat-list li a:hover span.stat-analytics-page-title:after, .stat-content .stat-list li a:focus span.stat-brokenlinks-page-title:after,
.stat-content .stat-list li a:focus span.stat-analytics-page-title:after {
opacity: 1;
transform: translateX(5%); }
.stat-content ol.stat-list li {
list-style: decimal outside;
margin-left: 1.25em;
margin-bottom: 0.75em; }
.stat-content .canvas-chart {
flex: 1 1 100%; }
.feature-image {
display: none; }
@media (min-width: 85.3125em) {
.feature-image {
display: block;
margin-bottom: 1em;
height: 0;
width: 100%;
padding-top: 187.4992064%;
position: relative; }
.feature-image img {
position: absolute;
inset: 0;
height: 100%;
width: 100%;
font-size: 2em;
text-align: center;
background: #2d97cc;
color: white;
display: table-cell;
align-content: center; } }
.knowledge-center {
background: #fff;
padding: 1em;
text-align: left; }
.knowledge-center .stat-list {
padding: 1em; }
.knowledge-center .stat-list a {
font-weight: 700;
margin-bottom: 1em;
display: block;
font-size: .875em;
line-height: 1.571; }
.cms-region-selector {
display: none; }
.top-nav .admin-nav-wrap:has(#adminNav_lblWebsite) {
padding-left: 0; }
.top-nav .admin-nav-wrap:has(#adminNav_lblWebsite) .admin-nav-list .root-link-container:has(#adminNav_lblWebsite) {
flex: 1 1 auto;
align-items: flex-start; }
#adminNav_lblWebsite {
display: block;
text-align: left;
background-color: #fff;
color: #000;
font-style: italic;
font-size: .875em;
padding: .857em 1em;
font-weight: bold; }
#adminNav_lblWebsite:before {
content: 'Location : ';
margin-right: .25em;
color: inherit; }
@media (min-width: 31.25em) {
#adminNav_lblWebsite {
text-align: left;
padding-left: 0; } }
.page-content {
transition: padding 0.65s ease; }
.page-content .page-title + .box {
padding: 1em 1.5em 3em; }
.page-content .data-list {
margin: 1em 0; }
.page-content .data-list.split li {
overflow: hidden; }
.page-content .data-list.split .data-left {
display: inline-block;
float: left;
padding: 1em; }
.page-content .data-list.split .data-right {
display: inline-block;
float: right;
padding: 1em; }
.format-copy ul, .format-copy ol {
margin: 1.25em 1.25em 1.25em 1.5em; }
.format-copy ul li {
list-style: disc; }
.format-copy ol li {
list-style: decimal; }
.format-copy li {
margin-bottom: .5em;
list-style-position: inside;
line-height: 1.25; }
.format-copy li p, .format-copy li ul, .format-copy li ol {
font-size: 1em; }
.page-title {
margin-bottom: 1em; }
.page-title + .page-title-controls {
transform: translateY(-1.75em); }
/* 2021 SNIPPETS */
.box-container.layout-page-section--nav {
flex-flow: row wrap;
max-width: 100%;
width: 100%;
align-items: flex-start;
/* MAIN CONTENT EDITOR */
/* NAV (CONTENT / MODULE) */
/* MOBILE */
/* DESKTOP */ }
.box-container.layout-page-section--nav .page-title {
flex: 1 1 100%;
max-width: 100%;
/**/ }
.box-container.layout-page-section--nav .page-title label {
display: block;
width: 100%; }
.box-container.layout-page-section--nav .box--nav {
flex: 1 1 100%;
margin: 0 0 .75em 0;
transition: transform 0.65s ease; }
.box-container.layout-page-section--nav .box.main {
flex: 1 1 70%;
transition: flex-basis 0.65s ease;
position: relative;
z-index: 5;
margin: 0 0 2em 0;
max-width: 100%;
min-height: 270px; }
.box-container.layout-page-section--nav .box-container-inner {
position: relative;
width: 100%;
display: flex;
flex-flow: row wrap;
max-width: 100%; }
.box-container.layout-page-section--nav .box.main .box-controls-message {
max-width: 100%; }
.box-container.layout-page-section--nav .box.main .box-title {
margin-top: -.4em;
/* OG USE FOR ARTICLE SYSTEM > MODULE EDITOR */ }
.box-container.layout-page-section--nav .box.main .box-title.border-top_LG {
margin: .75em 0 .5em 0;
padding-top: .75em;
border-top: 1px solid #888888; }
.box-container.layout-page-section--nav .box.main .box-controls-message-muted {
position: relative;
margin-bottom: .25em;
padding-left: 2px; }
.box-container.layout-page-section--nav .box--nav .box {
margin: 0;
padding: 0;
font-size: 1em; }
.box-container.layout-page-section--nav .box--nav .box-title {
width: 100%;
margin: 0; }
.box-container.layout-page-section--nav .box--nav .box-title > .toggle-hit-target {
display: flex;
width: 100%;
transition: background-color 0.35s ease;
padding: .25em .5em .5em; }
.box-container.layout-page-section--nav .box--nav .box-title > .toggle-hit-target:hover, .box-container.layout-page-section--nav .box--nav .box-title > .toggle-hit-target:focus {
color: #fff;
background-color: #464646; }
.box-container.layout-page-section--nav .box--nav .box-title > .toggle-hit-target:hover .toggle-icon, .box-container.layout-page-section--nav .box--nav .box-title > .toggle-hit-target:focus .toggle-icon {
fill: #fff; }
.box-container.layout-page-section--nav .box--nav .box-title .title {
flex: 1 1 auto;
font-size: 1em !important;
font-weight: inherit !important;
color: inherit; }
.box-container.layout-page-section--nav .box--nav .box-title .toggle-icon {
flex: 0 0 1.25em;
width: 1.25em;
height: 1.25em;
position: relative;
fill: #2d97cc;
display: inline-block; }
.box-container.layout-page-section--nav .box--nav .box-title .toggle-icon svg {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
width: 100%;
height: 100%;
pointer-events: none;
transform: rotateZ(45deg);
transition: transform 0.65s ease;
fill: inherit; }
.box-container.layout-page-section--nav .box--nav .link-list {
overflow-y: auto;
max-height: 600px;
padding: 0 .7em; }
.box-container.layout-page-section--nav .box--nav .link-list::-webkit-scrollbar {
-webkit-appearance: none;
width: .35em; }
.box-container.layout-page-section--nav .box--nav .link-list::-webkit-scrollbar-track {
background-color: #d3d3d3;
border-radius: .35em; }
.box-container.layout-page-section--nav .box--nav .link-list::-webkit-scrollbar-thumb {
border-radius: .5em;
background-color: #888888;
opacity: .4; }
.box-container.layout-page-section--nav .box--nav .link-list.mouse-down {
overflow: hidden; }
.box-container.layout-page-section--nav .box--nav .link {
display: flex;
width: 100%;
align-items: center;
padding: 1.5vh .35em;
line-height: 1;
transition: background-color 0.35s ease; }
.box-container.layout-page-section--nav .box--nav .link .text {
flex: 0 1 auto;
vertical-align: middle;
line-height: inherit;
padding: 0 .25em 0 .45em;
color: inherit; }
.box-container.layout-page-section--nav .box--nav .link.active {
font-weight: bold; }
@media (min-height: 1200px) {
.box-container.layout-page-section--nav .box--nav .link {
padding-top: 1.25em;
padding-bottom: 1.25em; } }
.box-container.layout-page-section--nav .box--nav .icon {
display: flex;
flex: 0 0 16px;
align-items: center;
position: relative;
transition: opacity 0.5s ease, transform 0.5s ease;
justify-content: center; }
.box-container.layout-page-section--nav .box--nav .icon .svg-icon {
display: block;
position: relative;
z-index: 2;
width: 100%; }
.box-container.layout-page-section--nav .box--nav .icon img {
display: block;
width: 100%; }
.box-container.layout-page-section--nav .box--nav .icon.status .icon {
display: inline-block;
width: 6px;
height: 6px;
max-width: 6px;
max-height: 6px;
border-radius: 50%;
vertical-align: middle;
opacity: .75;
transition: transform 0.35s ease; }
.box-container.layout-page-section--nav .box--nav .icon.status[data-state="0"] .icon {
background-color: #6fa310; }
.box-container.layout-page-section--nav .box--nav .icon.status[data-state="1"] .icon {
background-color: #e1af17; }
.box-container.layout-page-section--nav .box--nav .icon.status[data-state="2"] .icon {
background-color: #d14343; }
.box-container.layout-page-section--nav .box--nav .icon.toggle-arrow .svg-icon {
max-height: 22px; }
.box-container.layout-page-section--nav .box--nav .hover-icon .svg-icon {
fill: #2d97cc; }
.box-container.layout-page-section--nav .box--nav .hover-icon[data-state="0"] .svg-icon {
fill: #6fa310; }
.box-container.layout-page-section--nav .box--nav .hover-icon[data-state="1"] .svg-icon {
fill: #e1af17; }
.box-container.layout-page-section--nav .box--nav .hover-icon[data-state="2"] .svg-icon {
fill: #d14343; }
.box-container.layout-page-section--nav .box--nav .hover-icon.toggle-arrow {
transform: rotateZ(180deg); }
.box-container.layout-page-section--nav .box--nav .drop-down-icon {
margin-left: auto; }
.box-container.layout-page-section--nav .box--nav .drop-down-icon:before {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1; }
.box-container.layout-page-section--nav .box--nav .root.link-container {
border-bottom: 1px solid #d8d8d8;
border-bottom: 1px solid #DCDCDC; }
.box-container.layout-page-section--nav .box--nav .root.link-container:last-child {
margin-bottom: .5em;
border-bottom: none; }
.box-container.layout-page-section--nav .box--nav .root.link .drop-down-icon:before {
background-color: #d3d3d3;
border-radius: 50%; }
.box-container.layout-page-section--nav .box--nav .root.link .drop-down-icon .svg-icon {
fill: #fff; }
.box-container.layout-page-section--nav .box--nav .root.link:hover, .box-container.layout-page-section--nav .box--nav .root.link:focus {
background-color: #2d97cc;
color: #fff;
/*.icon.status {
&[data-state="0"] .icon { box-shadow: 0 0 0 2px $red; }
&[data-state="1"] .icon { box-shadow: 0 0 0 2px #e1af17; }
&[data-state="2"] .icon { box-shadow: 0 0 0 2px #6fa310; }
}*/ }
.box-container.layout-page-section--nav .box--nav .root.link:hover .icon.status .icon, .box-container.layout-page-section--nav .box--nav .root.link:focus .icon.status .icon {
box-shadow: 0 0 0 1px white;
opacity: 1;
transform: scale(1.75) translateX(1px); }
.box-container.layout-page-section--nav .box--nav .root.link:hover:not(.active) .svg-icon, .box-container.layout-page-section--nav .box--nav .root.link:focus:not(.active) .svg-icon {
fill: #fff; }
.box-container.layout-page-section--nav .box--nav .root.link:hover .hover-icon, .box-container.layout-page-section--nav .box--nav .root.link:focus .hover-icon {
opacity: 1; }
.box-container.layout-page-section--nav .box--nav .root.link:hover .drop-down-icon:before, .box-container.layout-page-section--nav .box--nav .root.link:focus .drop-down-icon:before {
background-color: transparent; }
.box-container.layout-page-section--nav .box--nav .root.link.add-module {
flex: 1 1 46%;
margin: .55em 2% .35em 2%;
border-radius: 4px;
text-align: center;
max-width: 300px;
justify-content: center;
background-color: #fff;
color: #2d97cc;
box-shadow: inset 0 0 0 1px rgba(45, 151, 204, 0.5);
line-height: 1.5;
font-weight: bold;
font-size: .8em; }
.box-container.layout-page-section--nav .box--nav .root.link.add-module .icon {
height: 18px; }
.box-container.layout-page-section--nav .box--nav .root.link.add-module .svg-icon {
fill: #2d97cc; }
.box-container.layout-page-section--nav .box--nav .root.link.add-module:hover, .box-container.layout-page-section--nav .box--nav .root.link.add-module:focus {
background-color: #2d97cc;
color: #fff; }
.box-container.layout-page-section--nav .box--nav .root.link.add-module:hover .svg-icon, .box-container.layout-page-section--nav .box--nav .root.link.add-module:focus .svg-icon {
fill: #fff; }
.box-container.layout-page-section--nav .box--nav .root.link.publish-all {
flex: 1 1 46%;
margin: .55em 2% .35em 2%;
border-radius: 4px;
text-align: center;
max-width: 300px;
justify-content: center;
background-color: #fff;
color: #2d97cc;
box-shadow: inset 0 0 0 1px rgba(45, 151, 204, 0.5);
line-height: 1.5;
font-weight: bold;
font-size: .8em; }
.box-container.layout-page-section--nav .box--nav .root.link.publish-all .icon {
height: 18px; }
.box-container.layout-page-section--nav .box--nav .root.link.publish-all .svg-icon {
fill: #2d97cc; }
.box-container.layout-page-section--nav .box--nav .root.link.publish-all:hover, .box-container.layout-page-section--nav .box--nav .root.link.publish-all:focus {
background-color: #2d97cc;
color: #fff; }
.box-container.layout-page-section--nav .box--nav .root.link.publish-all:hover .svg-icon, .box-container.layout-page-section--nav .box--nav .root.link.publish-all:focus .svg-icon {
fill: #fff; }
.box-container.layout-page-section--nav .box--nav .root.link.active.toggle-hit-target {
background-color: #f5f5f5;
box-shadow: 0 0 0 1px #e9e9e9;
color: #464646;
font-weight: normal; }
.box-container.layout-page-section--nav .box--nav .root.link.active .hover-icon.toggle-arrow {
transform: rotateZ(270deg); }
.box-container.layout-page-section--nav .box--nav .root.link.active .drop-down-icon {
transform: rotateZ(45deg); }
.box-container.layout-page-section--nav .box--nav .root.link.active .drop-down-icon:before {
background-color: transparent; }
.box-container.layout-page-section--nav .box--nav .root.link.active ~ .drop-down {
transform: scaleY(1);
height: auto;
margin-top: 0;
opacity: 1; }
.box-container.layout-page-section--nav .box--nav .drop-down .link {
padding: .35em;
color: #000;
font-size: .85em;
line-height: 1.25; }
.box-container.layout-page-section--nav .box--nav .drop-down .grabber-link {
display: flex;
width: 100%;
max-width: 100%;
transition: background-color 0.35s ease; }
.box-container.layout-page-section--nav .box--nav .drop-down .grabber-link .link {
flex: 1 1 auto;
color: inherit;
padding-left: .175em;
padding-right: .175em;
/**/ }
.box-container.layout-page-section--nav .box--nav .drop-down .grabber-link .link .text {
padding: .25em .25em .25em .75em; }
.box-container.layout-page-section--nav .box--nav .drop-down .grabber-link .hover-icon {
flex-basis: 26px;
margin-left: .25em; }
.box-container.layout-page-section--nav .box--nav .drop-down .grabber-link .grab-icon {
flex-basis: 2.5em;
position: relative;
z-index: 10;
padding: 0;
cursor: grabbing; }
.box-container.layout-page-section--nav .box--nav .drop-down .grabber-link .grab-icon .svg-icon {
max-height: 25px;
fill: rgba(70, 70, 70, 0.3); }
.box-container.layout-page-section--nav .box--nav .drop-down .grabber-link .grab-icon:hover {
background-color: #DCDCDC; }
.box-container.layout-page-section--nav .box--nav .drop-down .grabber-link:hover, .box-container.layout-page-section--nav .box--nav .drop-down .grabber-link:focus {
background-color: #f0f0f0; }
.box-container.layout-page-section--nav .box--nav .drop-down .grabber-link:hover .svg-icon, .box-container.layout-page-section--nav .box--nav .drop-down .grabber-link:focus .svg-icon {
fill: #000; }
.box-container.layout-page-section--nav .box--nav .drop-down .grabber-link:hover .icon.status .icon, .box-container.layout-page-section--nav .box--nav .drop-down .grabber-link:focus .icon.status .icon {
/*box-shadow: 0 0 0 1px rgba(#fff,1);*/
opacity: 1;
transform: scale(1.85) translateX(0px); }
.box-container.layout-page-section--nav .box--nav .drop-down .grabber-link:active {
box-shadow: inset 0 0 0 3px #DCDCDC; }
.box-container.layout-page-section--nav .box--nav .root.drop-down {
padding: 0;
transition: transform 0.4s ease, opacity 0.3s ease;
height: 0;
opacity: 0;
transform: scaleY(0);
transform-origin: center top; }
.box-container.layout-page-section--nav .box--nav .root.drop-down > .inner {
padding: .1em 2% .75em 2%; }
.box-container.layout-page-section--nav .box--nav .root.drop-down > .inner > .link-container:first-child .inner {
display: flex;
flex-flow: row wrap;
margin-bottom: .25em; }
@media (max-width: 70.615em) {
.box-container.layout-page-section--nav .link-list {
transition: transform 0.5s ease, opacity 0.5s ease;
transform-origin: center top; }
.box-container.layout-page-section--nav.box--nav-minimized .link-list {
transform: scaleY(0);
opacity: 0;
height: 0; }
.box-container.layout-page-section--nav.box--nav-minimized .box--nav .box-title .toggle-icon svg {
transform: rotateZ(0deg); } }
@media (min-width: 70.625em) {
.box-container.layout-page-section--nav .box-container-inner {
flex-flow: row nowrap; }
.box-container.layout-page-section--nav .box--nav {
order: 2;
flex: 1 1 30%;
max-width: 350px; }
.box-container.layout-page-section--nav .box--nav .box {
margin-left: 1em;
padding: 0;
min-height: 270px; }
.box-container.layout-page-section--nav .box--nav .link .text {
flex: 1 1 auto; }
.box-container.layout-page-section--nav > .box {
order: 1; }
.box-container.layout-page-section--nav .link-list {
transition: opacity 1s ease; }
.box-container.layout-page-section--nav.box--nav-minimized .box--nav {
position: absolute;
right: 0;
transform: translateY(-3em);
width: 350px; }
.box-container.layout-page-section--nav.box--nav-minimized .box--nav .box {
min-height: 0; }
.box-container.layout-page-section--nav.box--nav-minimized .box--nav .box-title .toggle-icon svg {
transform: rotateZ(0deg); }
.box-container.layout-page-section--nav.box--nav-minimized .box--nav .link-list {
pointer-events: none;
opacity: 0;
display: none; }
.box-container.layout-page-section--nav.box--nav-minimized .box--nav .root.link.active ~ .drop-down {
height: 0;
transform: scaleY(0);
opacity: 0; }
.box-container.layout-page-section--nav.box--nav-minimized .box.main {
flex-basis: 100%; }
.box-container.layout-page-section--nav.box--nav-minimized .page-title label {
padding-right: 350px; } }
.help-callouts.admin-section:first-of-type {
padding-top: 0em; }
.help-callouts > .section-title {
margin-left: 0; }
.image-selector.ntfy-popup .inner {
padding: 0; }
.image-selector.ntfy-popup .bar {
padding: .5em;
border-bottom: 2px solid #d3d3d3;
margin-bottom: 1em;
z-index: 200;
background-color: #fff;
position: fixed;
top: 0;
left: 0;
width: 100%; }
.image-selector.ntfy-popup .bar .svg-container {
padding: 25px;
display: initial;
float: right;
fill: #464646;
cursor: pointer; }
.image-selector.ntfy-popup .bar .svg-container:hover {
background-color: #464646;
fill: #fff; }
.image-selector.ntfy-popup .bar .svg-icon {
pointer-events: none; }
.image-selector.ntfy-popup .bar + * {
padding-top: 70px; }
.image-selector.ntfy-popup .bci-file-explorer .button {
display: none; }
.image-selector.ntfy-popup .form-control {
padding: 1em; }
.image-selector.ntfy-popup .marketing_imageSelector_img_container {
align-items: center;
align-content: center;
background-color: #f0f0f0;
padding: 1em;
/*margin: 0 0 0 .5em;*/ }
.image-selector.ntfy-popup .marketing_imageSelector_img_container-inner {
margin: 0 auto; }
.image-selector.ntfy-popup .rspPane.rspLastItem {
display: none !important; }
.image-selector.ntfy-popup.open .rspPane.rspLastItem {
display: block !important; }
#SearchDiv .segment, #subPageContent .segment {
display: flex;
align-items: center;
flex-flow: row wrap;
border-bottom: 1px solid #e9e9e9; }
#SearchDiv .segment-title, #subPageContent .segment-title {
flex: 1 1 300px;
padding: .5em .5em 0 .5em; }
#SearchDiv .segment .button, #subPageContent .segment .button {
float: none;
flex: 0 0 100px;
margin: .5em; }
.context-menu {
margin-top: -68px !important; }
.file-search-button-container {
display: flex;
flex-flow: row wrap; }
.file-search-button-container .button {
margin: 0.5em !important; }
.item-container.three {
flex: 1 1 30%; }
.img-container {
padding: 5px;
display: block !important;
width: 100% !important;
border: 3px dashed #e9e9e9;
overflow: hidden; }
.img-container.pdf-view {
min-height: 90%; }
.img-container #docPreview {
width: 100%;
height: 100%; }
.img-container img {
display: block !important;
max-width: 100% !important;
height: auto !important;
margin: 0 auto; }
.files-images-preview #avpw_controls {
min-width: initial; }
#searchresults {
display: flex;
flex-flow: row wrap;
width: 100%;
justify-content: space-around; }
.searchresultitem {
display: flex;
flex-flow: row wrap;
width: 100%;
justify-content: space-around;
align-items: center;
border-bottom: 1px solid #e9e9e9;
border-top: 1px solid #e9e9e9;
padding: .5em 0; }
.searchresultitem:first-of-type {
border-top: 2px solid #e9e9e9; }
.searchresultitem:last-of-type {
border-bottom: 2px solid #e9e9e9; }
.searchitemthumb {
max-height: 100px;
max-width: 200px; }
.socialdiv {
margin-bottom: 1em; }
/*.socialicons { overflow: hidden; }*/
.socialicons img {
border: 3px solid #fff;
background-color: #464646;
max-height: 45px;
max-width: 45px;
cursor: pointer;
padding: 5px; }
.socialicons img.selected {
border: 3px solid #636363; }
.form-group .edit-icon {
background-image: url(/images/admin/edit-icon.svg);
background-repeat: no-repeat;
background-position: center;
background-size: 12px; }
.form-group .edit-icon:hover {
background-image: url(/images/admin/edit-icon.svg) !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: 12px !important; }
.info-list.layout-flex {
width: 100%;
display: flex;
flex-flow: row wrap; }
.info-list.layout-flex .info-container {
width: 100%;
display: flex;
flex: 1 1 100%;
align-items: center;
flex-flow: row wrap; }
.info-list.layout-flex .item {
display: flex;
flex: 1 1 auto;
padding: .5em 1em; }
.info-list.layout-flex .button {
margin: .25em; }
@media (max-width: 37.5em) {
.info-list.layout-flex .item {
flex: 1 1 100%; } }
.info-list .content-right {
justify-content: flex-end; }
.info-list.theme-alt-greys {
border: 1px solid #DCDCDC; }
.info-list.theme-alt-greys li + li {
border-top: 1px solid #DCDCDC; }
.info-list.theme-alt-greys li:nth-child(odd) {
background-color: #fff; }
.info-list.theme-alt-greys li:nth-child(even) {
background-color: #f5f5f5; }
.snippets-container > .box-component.add {
margin: 1em .5em; }
.snippets-editor-container .module-separator {
/* CMS ONLY SEPARATOR LABEL */ }
.snippets-editor-container .module-separator .title {
font-weight: 600;
font-size: 1.25em;
color: #2d97cc; }
.snippets-editor-container .module-separator p {
font-size: 1em;
font-weight: 400; }
.snippets-editor-container .module-separator .align-with-input {
padding-top: .25em;
padding-right: .25em;
padding-left: 165px; }
.snippets-editor-container .module-separator .highlight {
display: inline-block;
padding: .1em;
letter-spacing: 1px; }
.snippets-editor-container .module-separator .yellow {
background-color: yellow; }
.snippets-editor-container .module-separator .border_bottom {
padding: .15em .25em;
border-bottom: 2px solid #888888;
line-height: 1.25;
margin-left: .25em; }
.snippets-editor-container .module-separator .text_SM {
font-size: .875em; }
.snippets-editor-container .module-separator ul {
color: #2d2d2d; }
.snippets-editor-container .module-separator ul li {
list-style: disc;
margin: .25em 0; }
.snippets-editor-container .module-separator ul ul {
margin-left: .25em;
margin-bottom: .5em; }
.snippets-editor-container .module-separator ul ul li {
list-style: none;
/**/ }
.snippets-editor-container .module-separator ul ul li:before {
content: '-';
margin-right: .5em; }
.snippets-editor-container .snippet-img-container {
margin: 0 .35em 0 0;
flex: 0 1 68px; }
.snippets-editor-container .snippet-img-container img {
display: block;
width: 100%; }
.snippets-editor-container .form-control {
overflow: visible;
/* WYSIWYG editor - hyperlink popup fix */ }
.snippets-editor-container .form-control .k-toolbar {
margin: 0; }
.snippets-editor-container .form-control .inset-label {
min-width: 165px;
font-size: .95em;
padding: 5px 10px 5px 5px;
line-height: 1.55;
white-space: normal; }
.snippets-editor-container .form-control .inset-label.align-top {
vertical-align: top; }
.snippets-editor-container .form-control select, .snippets-editor-container .form-control input[type="text"], .snippets-editor-container .form-control input[type="password"] {
height: 45px; }
.snippets-editor-container .form-control .inset-label-input {
float: none; }
.snippets-editor-container .form-control .inset-label-input[type="file"] {
padding: 1em; }
.snippets-editor-container .form-control .inset-label-input.spectrum.with-add-on {
cursor: pointer; }
.snippets-editor-container .form-control .sp-colorize-container.sp-add-on {
border: 1px solid #DCDCDC; }
.snippets-editor-container .form-control .inset-label-container .img-preview-container {
max-width: 400px; }
.snippets-editor-container .form-control .inset-label-container .img-preview-container img {
display: block; }
.snippets-editor-container .form-control .inset-label-container input[type=text], .snippets-editor-container .form-control .inset-label-container input[type=password], .snippets-editor-container .form-control .inset-label-container select, .snippets-editor-container .form-control .inset-label-container textarea {
margin: 0; }
.snippets-editor-container .form-control input[type="text"], .snippets-editor-container .form-control select, .snippets-editor-container .form-control textarea {
background-color: #fff; }
.snippets-editor-container .form-skeleton-piece-answers + .module-separator .title {
padding: 1em 0 .25em 0; }
.snippets-editor-container .form-skeleton-piece-answers.box-component-section {
margin-bottom: 0;
padding-bottom: 0;
border-bottom: none; }
.snippets-editor-container .form-skeleton-piece-answers.box-component-section + .form-skeleton-piece-answers.box-component-section {
margin-top: .5em;
padding-top: .5em;
border-top: 1px solid #DCDCDC; }
.snippets-container .panel-group.theme-dash-panels_MD > .panel {
margin: .75em 0;
padding: .5em .75em; }
.snippets-container .add-snippet-box {
border: 3px dashed #d3d3d3;
min-height: 150px;
color: #464646;
background-color: #e9e9e9;
padding: 1em;
display: flex;
justify-content: center;
align-items: center;
flex-flow: row wrap;
max-width: 100%; }
.snippets-container .add-snippet-box .ui-selectmenu-button {
flex: 1 1 100%;
max-width: 700px;
font-weight: bold;
font-size: 1.35em;
padding: .5em 1em; }
.snippets-container .add-snippet-box .ui-selectmenu-button span.ui-selectmenu-text {
padding: 0; }
.snippets-container .add-snippet-box .ui-selectmenu-button span.ui-icon {
background: url(/images/admin/arrow-down-snippets.svg) center;
width: 24px;
height: 24px;
margin-top: -12px; }
.snippets-container .add-snippet-box .ui-state-hover,
.snippets-container .add-snippet-box .ui-widget-content .ui-state-hover,
.snippets-container .add-snippet-box .ui-widget-header .ui-state-hover,
.snippets-container .add-snippet-box .ui-state-focus, .snippets-container .add-snippet-box .ui-widget-content .ui-state-focus,
.snippets-container .add-snippet-box .ui-widget-header .ui-state-focus, .snippets-container .add-snippet-box .ui-button:hover, .snippets-container .add-snippet-box .ui-button:focus {
border-color: #464646; }
/* SNIPPET JQUERY UI DROP DOWN */
.snippets-ui-dropdown.ui-selectmenu-menu .ui-menu .ui-menu-item {
padding: 0; }
.snippets-ui-dropdown.ui-selectmenu-menu .ui-menu {
max-height: 350px;
max-width: 750px;
display: flex;
flex-flow: row wrap;
box-shadow: 0 3px 5px 1px rgba(0, 0, 0, 0.5); }
.snippets-ui-dropdown.ui-selectmenu-menu .ui-menu .ui-state-disabled {
display: none; }
.snippets-ui-dropdown.ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup.ui-menu-divider {
display: block;
width: 99%;
min-width: 99%;
text-align: center;
background: #636363;
padding-top: .5em;
padding-bottom: .5em;
margin: .25em .5% .5em .5%;
color: #fff; }
.snippets-ui-dropdown.ui-selectmenu-menu .ui-menu li.ui-menu-item:not(.ui-state-disabled) {
flex: 1 1 30%;
margin-bottom: 1% !important;
display: block;
width: 32.3333%;
max-width: 32.3333%;
margin-right: 0.5% !important;
margin-left: 0.5% !important;
background: #f1f1f1; }
.snippets-ui-dropdown.ui-selectmenu-menu .ui-menu li.ui-menu-item:not(.ui-state-disabled) .selectitemwrapper {
display: block;
padding: 58px 5% .5em 5% !important;
height: auto;
text-align: center;
font-size: .85em;
line-height: 1.35; }
.snippets-ui-dropdown.ui-selectmenu-menu .ui-menu li.ui-menu-item:not(.ui-state-disabled) span.ui-icon.selectitem {
width: 60px;
height: 0;
display: block;
padding-top: 48px;
top: 6px;
bottom: initial;
left: 50%;
transform: translateX(-50%);
background-size: contain; }
.snippets-ui-dropdown.ui-selectmenu-menu .ui-state-disabled::marker {
font-size: 0; }
.snippets-ui-dropdown.ui-selectmenu-menu .ui-menu.ui-widget .ui-menu-item-wrapper {
font-size: .85em;
line-height: 1.35; }
.snippets-ui-dropdown.ui-selectmenu-menu .ui-state-active, .snippets-ui-dropdown.ui-selectmenu-menu .ui-widget-content .ui-state-active, .snippets-ui-dropdown.ui-selectmenu-menu .ui-widget-header .ui-state-active, .snippets-ui-dropdown.ui-selectmenu-menu a.ui-button:active, .snippets-ui-dropdown.ui-selectmenu-menu .ui-button:active, .snippets-ui-dropdown.ui-selectmenu-menu .ui-button.ui-state-active:hover {
background-color: #2d97cc;
border: none;
box-shadow: inset 0 0 0 2px #195370; }
body[style="cursor: move;"] .box-container.layout-page-section--nav .box--nav .root.link.add-module {
pointer-events: none;
opacity: .2; }
/* EMPTY MODULE SECTION */
.empty-module-placeholder {
position: absolute;
top: 50%;
right: 0;
left: 0;
margin: auto;
opacity: 0;
transform: translateY(-60%) scale(0.5);
transition: all 0.5s ease;
display: flex;
flex-flow: row wrap;
align-items: center;
justify-content: center;
pointer-events: none;
background-color: #e9e9e9;
padding: 3em 2em;
width: 85%;
text-align: center;
border-radius: 18px; }
.empty-module-placeholder .title {
font-size: 1.15em;
color: #484848; }
.empty-module-placeholder .title strong {
display: block;
margin-bottom: .75em;
padding-bottom: .5em;
font-size: 1.4em;
border-bottom: 3px solid #fff; }
.snippets-editor-container.modules-empty ~ .msg-empty.empty-module-placeholder {
opacity: 1;
transform: translateY(-50%) scale(1); }
.snippets-editor-container.page-load-modules-empty ~ .msg-page-load.empty-module-placeholder {
opacity: 1;
transform: translateY(-50%) scale(1); }
.snippets-editor-container[style="display: none;"] ~ .empty-module-placeholder {
display: none; }
/* article system fix */
form[action^="./Article"] .snippets-editor-container.modules-empty ~ .msg-empty.empty-module-placeholder {
position: relative;
transform: translateY(0%) scale(1); }
form[action^="./Article"] .empty-module-placeholder {
top: 0;
transform: translateY(60%) scale(0.5); }
/* K-EDITOR WYSIWYG ---
Icon */
.k-i-custom-hR:before {
content: "\e623"; }
.admin-section.blog-articles-section.theme-section-grey-200 h2.section-title {
font-weight: 300; }
.trending-articles .flex-group .flex-item, .trending-articles .flex-nav .flex-item {
flex: 1 1 100%; }
.trending-articles .flex-group h2, .trending-articles .flex-nav h2 {
text-align: center;
margin: 0; }
.trending-articles .flex-group .colorbar, .trending-articles .flex-nav .colorbar {
margin: 1em 0;
height: 6px; }
.trending-articles .flex-group .subgroup, .trending-articles .flex-nav .subgroup {
margin: 1em 0; }
.trending-articles .flex-group .article-image, .trending-articles .flex-nav .article-image {
display: block;
width: 100%;
height: 0;
padding-top: 56.25%;
background-position: center;
background-size: 100% 100%;
transition: background-size 0.38s ease-out, border-color 0.5s ease-out; }
.trending-articles .flex-group .article-image:hover, .trending-articles .flex-nav .article-image:hover {
background-size: 110% 110%;
border-color: #f87d3f; }
.trending-articles .flex-group .article-content a, .trending-articles .flex-nav .article-content a {
display: block;
text-align: center;
font-weight: 700;
padding: .75em 0;
color: #2d97cc;
font-size: 1.125em; }
.trending-articles .flex-group .article-content a:hover, .trending-articles .flex-nav .article-content a:hover {
text-decoration: underline; }
@media (min-width: 61.25em) {
.trending-articles .flex-group, .trending-articles .flex-nav {
/*.subgroup { max-width: 32.333%; margin:1em .5%; }*/ }
.trending-articles .flex-group h2, .trending-articles .flex-nav h2 {
text-align: left; } }
@media (min-width: 37.5em) {
.trending-articles .flex-group .flex-item, .trending-articles .flex-nav .flex-item {
flex: 1 1 32.333%;
/*max-width: 32.333%;*/
margin: 1em .5%; } }
.green-highlight {
color: #6fa310; }
.green-highlight .checkmark-icon {
font-weight: bold; }
.green-highlight .error-icon {
display: none; }
.red-highlight {
color: #d14343;
font-size: 1.1em; }
.red-highlight .checkmark-icon {
display: none; }
.red-highlight .error-icon {
font-weight: bold; }
.page-content {
width: 100%;
max-width: 1650px;
margin: .25em auto; }
.admin-left-nav {
border-right: none;
margin-top: var(--navHeight, 108px);
display: flex;
flex-flow: column nowrap;
transition: margin-top 1s ease;
/* is a little bit much for most browsers but IE 10 it is barely enough. */ }
.admin-left-nav .box {
flex: 1 1 auto; }
.admin-left-nav .box .box-title {
font-size: 1.6em; }
.admin-left-nav .nav {
padding-bottom: 32px; }
.admin-left-nav .box {
margin-bottom: 0em; }
.admin-left-nav .box:last-of-type {
height: 100%;
overflow: auto; }
.admin-left-nav [offc-trigger] {
/*color: #fff; background-color: $color_a;*/
right: -30px;
left: auto; }
.admin-left-nav .RadTreeView {
white-space: normal;
height: 100% !important;
/*overflow: scroll !important; < removed by Ben on 6/22/18 - it doesn't seem to be needed */ }
.admin-left-nav .RadTreeView > .rtUL {
margin-bottom: 135px; }
.admin-left-nav .rtIn.inactive:after,
.admin-left-nav .rtIn.hidden:after,
.admin-left-nav .rtIn.link:after,
.admin-left-nav .rtIn.form:after,
.admin-left-nav .rtIn.inactivehidden:after,
.admin-left-nav .rtIn.inactivelink:after,
.admin-left-nav .rtIn.inactiveform:after,
.admin-left-nav .rtIn.inactivehiddenlink:after,
.admin-left-nav .rtIn.inactivehiddenform:after,
.admin-left-nav .rtIn.inactivehiddenlinkform:after,
.admin-left-nav .rtIn.hiddenlink:after,
.admin-left-nav .rtIn.hiddenform:after {
content: '';
display: inline-block;
margin-left: 5px;
background-repeat: no-repeat;
position: relative;
bottom: -2px; }
.admin-left-nav .rtIn.inactive:after {
background-image: url(/images/admin/pages-icons/inactive.svg);
height: 15px;
width: 15px; }
.admin-left-nav .rtIn.hidden:after {
background-image: url(/images/admin/pages-icons/hidden.svg);
height: 15px;
width: 15px; }
.admin-left-nav .rtIn.link:after {
background-image: url(/images/admin/pages-icons/link.svg);
height: 15px;
width: 15px; }
.admin-left-nav .rtIn.form:after {
background-image: url(/images/admin/pages-icons/form.svg);
height: 15px;
width: 15px; }
.admin-left-nav .rtIn.inactivehidden:after {
background-image: url(/images/admin/pages-icons/inactive-hidden.svg);
height: 15px;
width: 40px; }
.admin-left-nav .rtIn.inactivelink:after {
background-image: url(/images/admin/pages-icons/inactive-link.svg);
height: 15px;
width: 40px; }
.admin-left-nav .rtIn.inactiveform:after {
background-image: url(/images/admin/pages-icons/inactive-form.svg);
height: 15px;
width: 40px; }
.admin-left-nav .rtIn.inactivehiddenlink:after {
background-image: url(/images/admin/pages-icons/inactive-hidden-link.svg);
height: 15px;
width: 60px; }
.admin-left-nav .rtIn.inactivehiddenform:after {
background-image: url(/images/admin/pages-icons/inactive-hidden-form.svg);
height: 15px;
width: 60px; }
.admin-left-nav .rtIn.inactivehiddenlinkform:after {
background-image: url(/images/admin/pages-icons/inactive-hidden-link-form.svg);
height: 15px;
width: 80px; }
.admin-left-nav .rtIn.hiddenlink:after {
background-image: url(/images/admin/pages-icons/hidden-link.svg);
height: 15px;
width: 40px; }
.admin-left-nav .rtIn.hiddenform:after {
background-image: url(/images/admin/pages-icons/hidden-form.svg);
height: 15px;
width: 40px; }
.admin-left-nav.open ~ .page-content {
padding-left: 320px; }
.rtDropAbove,
.rtDropBelow {
z-index: 90000; }
.no-left-nav .offc-toggle-wrapper {
display: none; }
.admin-left-nav-controls .flex-item {
margin-right: .25em;
margin-left: .25em; }
.admin-left-nav-controls .inset-label-container {
padding: .25em; }
.offc-toggle-wrapper {
display: none; }
.not-tree-view-list {
/*a:hover { background-color: darken($grey-200, 2); }*/
/*.not-tree-view-list-item.active a { background-color: darken($grey-200, 5); }*/ }
.not-tree-view-list .not-tree-view-list-item {
margin-bottom: 2px; }
.not-tree-view-list a {
display: block;
padding: 4px 12px 5px;
position: relative;
font-size: .9em; }
.not-tree-view-list a:before {
content: '';
display: block;
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 1px;
transition: width 0.1s ease, background-color 0.1s ease;
/*background-color: $grey-400; */ }
.not-tree-view-list a:hover:before {
width: 2px;
/*background-color: $grey-400;*/ }
.not-tree-view-list .not-tree-view-list-item.active a:before {
width: 4px;
/*background-color: $brand-a;*/ }
@media (min-width: 70.625em) {
.admin-left-nav-controls .flex-item {
margin: .25em; } }
.admin-footer {
background-color: #f0f0f0;
text-align: center;
font-weight: 300;
padding: 1em 0; }
.admin-footer .copyright {
color: #434a4c; }
.admin-footer .copyright a {
color: inherit;
/**/ }
.admin-footer .copyright a:hover, .admin-footer .copyright a:focus {
text-decoration: underline; }
.admin-footer .roll-link {
color: #434a4c; }
.admin-footer:after {
content: '';
position: fixed;
left: 0;
right: 0;
height: 100%;
background-color: #f0f0f0; }
.admin-footer .form {
max-width: 650px;
margin: 2em auto 5em auto; }
.admin-footer .form input[type="text"] {
text-align: center; }
.admin-footer .form p {
color: #b3b3b3;
text-align: center;
width: 100%;
margin-bottom: 2em;
font-size: 1.1em; }
.admin-footer .form .button {
width: 100%;
border-radius: 1em;
background-color: #2d97cb;
margin: 0;
min-height: 2em;
transition: background-color 0.25s ease; }
.admin-footer .form .button:hover, .admin-footer .form .button:focus {
background-color: #f87d3f; }
.admin-footer .form .input {
position: relative;
justify-content: center; }
.admin-footer .form input {
background-color: #767676;
color: #b3b3b3;
border-radius: 1em;
padding: 5px 20px;
min-height: 2em; }
.admin-footer .form input::placeholder, .admin-footer .form input::-webkit-input-placeholder {
color: #b3b3b3; }
.admin-footer .form input:focus {
outline: none;
color: #434a4c; }
.admin-footer .form .subgroup:first-of-type {
flex: 1 1 100%; }
.admin-footer .form .subgroup:last-of-type {
align-content: flex-start;
flex-basis: 100px; }
.admin-footer .form .message {
color: #fff;
padding: .25em; }
.admin-footer .form .message.error {
flex: 0 1 95%;
margin-top: .25em;
background-color: #d14343;
border-radius: .25em; }
.admin-footer .form .message.success {
font-size: 1.5em;
font-weight: bold;
border: 2px solid rgba(255, 255, 255, 0.45);
background-color: rgba(255, 255, 255, 0.05); }
@media (max-width: 91.875em) {
html.offc-left-nav-open .admin-footer {
padding-left: 320px; } }
html {
scroll-padding-top: var(--SiteNavStickyHeight, 120px);
scroll-behavior: smooth; }
body {
font-weight: 400; }
@supports (container: inline-size) {
body {
font-size: clamp(1em, 1.15cqw, 1.1em); } }
@supports not (container: inline-size) {
body {
font-size: clamp(1em, 1.1vw, 1.1em); } }
.RadTreeView .hidden {
display: block !important; }
.font-size_MD {
font-size: 1.1em; }
.screen-reader-only {
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
width: 1px;
overflow: hidden;
position: absolute !important;
margin: 0;
padding: 0;
border: none;
outline: none; }
.form .form-control .CodeMirror.cm-s-monokai {
font-size: .825em;
min-height: calc(90vh - var(--NavHeight, 103px) - 400px); }
/*.catch-click-container { position: relative; }*/
.catch-click {
width: 100%;
height: 100%;
top: 0;
bottom: 0;
left: 0;
right: 0;
position: absolute;
z-index: 5 !important;
display: inline-block;
cursor: pointer; }
.avoid-click {
z-index: 0 !important;
position: absolute !important; }
.fake-display-none {
visibility: hidden;
position: absolute;
opacity: 0; }
.toggle-hit-target {
cursor: pointer; }
.left {
float: left; }
.right {
float: right; }
#googleDescription {
padding: 0 0 1em 1.5em; }
#googleDescription .google-description-title {
color: #1a0dab;
font-size: 18px; }
#googleDescription .google-description-link {
color: #006621;
font-size: 14px; }
#googleDescription .google-description-summary {
color: #545454;
font-size: 13px; }