@import url('https://fonts.googleapis.com/css?family=Bad+Script|Dancing+Script:400,700|Open+Sans:400italic,400,700|Open+Sans+Condensed:300,300italic,700|Lato:100,300,400,100italic,300italic,400italic,700italic,700,900italic,900');


* {
    box-sizing: border-box;
}

/* Loading Bar */
div.pace {
    border: 2px solid var(--brandColour);
}

div.pace .pace-progress {
    background: var(--brandColour);
    color: var(--brandColour);
}

/* All other styles */

*, body, button, input, textarea, select {
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
}

HTML {
    overflow-y: auto;
    background-color: transparent;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    -webkit-overflow-scrolling: touch;
    font-size: 15px;
}

u {
    text-decoration: underline;
}

.underline {
    text-decoration: underline !important;
}

@-moz-keyframes roll {
    100% {
        -moz-transform: rotate(360deg);
    }
}

@-o-keyframes roll {
    100% {
        -o-transform: rotate(360deg);
    }
}

@-webkit-keyframes roll {
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@-moz-keyframes eggroll {
    100% {
        -moz-transform: rotate(-360deg);
    }
}

@-o-keyframes eggroll {
    100% {
        -o-transform: rotate(-360deg);
    }
}

@-webkit-keyframes eggroll {
    100% {
        -webkit-transform: rotate(-360deg);
    }
}

* {
    -moz-animation-duration: 5s;
    -moz-animation-iteration-count: 1;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: 1;
    -o-animation-duration: 5s;
    -o-animation-iteration-count: 1;
}

.fb_iframe_widget {
    vertical-align: top;
}

canvas { max-width: 100%; }

#egg {
    width: 100%;
    height: 128px;
    position: fixed;
    top: 30%;
    left: 0;
    display: none;
    background: url('/images/Do-a-barrel-roll-gif.gif') 50% 0% no-repeat transparent;
}

/*new bg colour = #e5e5e5*/

.cagedrop {
    /*background: -webkit-gradient(linear, 0 % 0 %, 0 % 100 %, from(rgba(13, 52, 58, 1) ), to(rgba(255, 255, 255, 0.6)) );
    background: -moz-linear-gradient(top, rgba(13, 52, 58, 1) 0 %, rgba(255, 255, 255, .6) 100 %);*/
    width: 100px;
    height: 100px;
    position: absolute;
    bottom: 200px;
    animation: fall 5s linear infinite;
    -webkit-animation: fall 5s linear infinite;
    -moz-animation: fall 5s linear infinite;
    border-radius: 5em; background: url('/images/gipholascage.gif') center;
    background-size: 100px 100px;
    box-shadow: 1px 1px 10px #6AA2E2;
    z-index: 9999;
}

div#drop0 {
    top: -300px;
    left: 45%;
    border: 2px solid #00B7F1;
    z-index: 10000;
    display: none;
}

a.cageVid {
    width: 100px;
    height: 100px;
    padding: 50px;
}

/* animate the drops*/
@-webkit-keyframes fall {
    to { margin-top: 1000px; }
}

@-moz-keyframes fall {
    to { margin-top: 1000px; }
}

@keyframes fall {
    to { margin-top: 1000px; }
}

#beoufLeft {
    left: 1em;
}

#beoufRight {
    right: 1em;
}

.giphylabeouf {
    cursor: pointer;
    width: 480px;
    height: 270px;
    position: fixed;
    bottom: 0;
    background: url('/images/giphylabeouf.gif') center;
    background-size: 480px 270px;
    z-index: 9999;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes flip {
    0% {
        -webkit-transform: perspective(400px) rotateY(0);
        -webkit-animation-timing-function: ease-out;
    }
    40% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg);
        -webkit-animation-timing-function: ease-out;
    }
    50% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
        -webkit-animation-timing-function: ease-in;
    }
    80% {
        -webkit-transform: perspective(400px) rotateY(360deg) scale(.95);
        -webkit-animation-timing-function: ease-in;
    }
    100% {
        -webkit-transform: perspective(400px) scale(1);
        -webkit-animation-timing-function: ease-in;
    }
}

@keyframes flip {
    0% {
        transform: perspective(400px) rotateY(0);
        animation-timing-function: ease-out;
    }
    40% {
        transform: perspective(400px) translateZ(150px) rotateY(170deg);
        animation-timing-function: ease-out;
    }
    50% {
        transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
        animation-timing-function: ease-in;
    }
    80% {
        transform: perspective(400px) rotateY(360deg) scale(.95);
        animation-timing-function: ease-in;
    }
    100% {
        transform: perspective(400px) scale(1);
        animation-timing-function: ease-in;
    }
}

.flip {
    -webkit-backface-visibility: visible !important;
    -webkit-animation-name: flip;
    backface-visibility: visible !important;
    animation-name: flip;
}

@-webkit-keyframes hinge {
    0% { -webkit-transform: rotate(0); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }
    20%, 60% { -webkit-transform: rotate(80deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }
    40% { -webkit-transform: rotate(60deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }
    80% { -webkit-transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }
    100% { -webkit-transform: translateY(700px); opacity: 0; }
}

@keyframes hinge {
    0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; }
    20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out; }
    40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out; }
    80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out; }
    100% { transform: translateY(700px); opacity: 0; }
}

.hinge {
    -webkit-animation-name: hinge;
    animation-name: hinge;
}

BODY {
    margin: 0;
    /*font-family: Calibri, 'Asap', sans-serif;*/
    font-family: Calibri, Arial, Helvetica, sans-serif;
    font-size: 1em;
    background: #eee;
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    text-align: left;
    text-decoration: none;
    color: #333333;
    position: initial !important;
}

iframe {
    border: none;
}

.support-iframe {
    /*overflow: hidden;*/
    height: 865px;
    width: 840px;
    border: 1px solid #E0E0E0;
}

pre, xmp, plaintext, listing {
    display: block;
    font-family: monospace;
    white-space: pre;
}

code, .code {
    font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, sans-serif;
    background-color: #EFF0F1;
    white-space: pre-wrap;
    padding: 1px 5px;
    color: #7D2727;
}

.codeInputDark {
    font-family: monospace !important;
    background-color: #3c3e40;
    white-space: pre-wrap;
    color: #cecece;
    font-size: 0.9em;
}

.codeInputLight, .codeInput{
    font-family: monospace !important;
    background-color: #fff;
    border: 1px solid #dddfe2;
    border-radius: 2px;
    color: #4b4f56;
    white-space: pre-wrap;
    font-size: 0.9em;
}

hr {
    height: 0;
    border-top: 1px solid #ECECEC;
    /*border-top: 1px solid #CCCCCC;*/
    border-left: none;
    border-right: none;
    border-bottom: none;
    margin: 10px 0;
    padding: 0;
    width: 98%;
}

li {
    margin-bottom: 0.5em;
}

.IdleText {
    padding: 1em !important;
}

#loading-progress {
    position: fixed;
    cursor: move;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#logout-progress {
    position: fixed;
}

#loading-progress, #logout-progress {
    width: 314px;
    top: 50%;
    left: 50%;
    /*margin-left: -150px;*/
    border-radius: 5px;
    /* shadow colour in webboss/blogboxx colour css */
    border: 10px solid rgba(26, 26, 26, 0.5);
    z-index: 1000;
    cursor: default;
    box-sizing: content-box;
    max-width: 80%;
}

#loading-text, #mptext {
    text-align: center;
    padding: 7px;
    /*font: bold 1.2em Calibri, Arial, Helvetica, sans-serif;*/
    font-weight: bold;
    font-size: 1.2em;
    background-color: white;
    border-radius: 0;
    color: #222222;
    overflow-y: auto;
}

#update-modal #loading-text {
    text-align: center;
    padding: 0.5em;
    font-weight: bold;
    font-size: 1.2em;
    background-color: #FFFFFF;
    border-radius: 0;
    color: #222222;
    height: 100%;
    box-sizing: border-box;
}

#loading-text p {
    padding: 0.5em 0;
    margin: 0;
}

#loading-blur {
    position: absolute;
    width: 100%;
    background: url('/admin/images/darken.png') transparent center fixed repeat;
    height: 900px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
}

.acctUpdPopBox, .trialPopBox, #ssl_help, #update-modal, .genericModal {
    max-height: 80vh;
    max-width: 80%;
    overflow: auto;
    margin: auto;
    left: 0;
    right: 0;
}

.login-input {
    border-radius: 3px;
    border: 1px grey inset;
    padding: 3px;
    margin: 2px;
    font-weight: bold;
    font-family: inherit;
    font-size: large;
    width: 200px;
    text-align: center;
}

.mceMiddle span {
    top: 35px !important;
}

#main {
    float: left;
    width: 79%;
}

#sidebar {
    float: right;
    width: 21%;
}

sub {
    font-size: x-small;
}

table {
    font-size: inherit;
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    text-align: left;
    text-decoration: none;
    color: #333333;
    width: 100%;
    background-color: #ECECEC;
    border: 1px solid lightgrey;
    border-bottom-width: 3px;
    border-radius: 2px;
    margin-top: 0.3em;
}

tr, .tr {
    background-color: white;
}

.tr {
    display: flex;
    justify-content: stretch;
}

/*tr:hover {
    background-color: #F9F9F9;
}*/

table tr,
.table .tr {
    border-bottom: 1px solid #f2f2f2;
}

td, th,
.td, .th {
    vertical-align: inherit;
}

th,
.th {
    background-color: white;
    text-align: center;
    font-size: small;
    font-weight: bold;
}

th h1, th h2, th h3 {
    font-size: inherit;
    padding: inherit;
    margin: inherit;
}

img {
    border: 0;
    max-width: 100%;
}

.wrapper, .wrapper2 {
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    margin-bottom: 5px;
    text-align: left;
    border-bottom-width: 3px;
    border-radius: 3px;
    display: block !important;
}

.wrapper {
    max-width: calc(100% - 203px);
}

.fullScreen { max-width: 100% !important; }

.errors {
    width: 450px;
    height: 180px;
    position: relative;
    background-color: #FFFFFF;
    border: solid 3px red;
    margin-top: 145px;
    margin-left: 35%;
    text-align: center;
    font-size: large;
    font-weight: bold;
    font-style: normal;
    font-variant: normal;
    padding: 5px;
    overflow: auto;
    float: left;
    z-index: 99;
}

.confirm {
    width: 450px;
    height: 120px;
    position: relative;
    background-color: #FFFFFF;
    border: solid 3px green;
    margin-top: 145px;
    margin-left: 35%;
    text-align: center;
    font-size: 22px;
    font-weight: bold;
    font-style: normal;
    font-variant: normal;
    padding: 5px;
    overflow: auto;
    float: left;
    z-index: 99;
}

.content {
    width: 100%;
    height: 100%;
    /*   z-index: 3;
position:absolute; */
    border: dashed 3px red;
}

.header {
    width: 100%;
    height: 70px;
    margin-left: 7px;
    margin-top: 7px;
    float: left;
    box-sizing: border-box;
    text-align: left;
}

.nav {
    width: 100%;
    min-height: 20px;
    margin-left: 0;
    border: none;
    border-left: none;
    border-right: none;
    margin-top: 0;
    font-size: medium;
    padding: 15px 5px 0;
    text-align: center;
    clear: both;
    box-sizing: border-box;
    color: white;
}

div.nav a {
    font-size: medium;
}

.pagelist, .pagelist2 {
    width: 95%;
    height: 100%;
    min-height: 610px;
    /*position: absolute;*/
    margin-bottom: 20px;
    /*background-color: #768e9d;
border: solid 1px black;*/
    margin-top: 10px;
    margin-left: 25px;
    overflow: auto;
}

.delete {
    width: 450px;
    height: 120px;
    position: relative;
    background-color: #FFFFFF;
    border: solid 3px red;
    margin-top: 145px;
    margin-left: 22%;
    text-align: center;
    padding: 5px;
    overflow: auto;
    float: left;
    z-index: 99;
}

.delshadow {
    width: 450px;
    height: 120px;
    position: relative;
    background-color: grey;
    /*filter: alpha(opacity=55);
-moz-opacity: .55;*/
    margin-top: 15%;
    margin-left: 597px;
    text-align: center;
    float: left;
    z-index: 98;
}

.required {
    font-size: small;
    color: red;
}

.note {
    font-size: 0.8em;
    color: #808080;
}

.dashMiniStats.small.note a {
    text-decoration: none !important;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Source Sans Pro', sans-serif;
    margin-top: 0.3em;
    margin-bottom: 0.5em;
    line-height: 1.24;
}

h1 {
    /* color:#047fc2;*/
    font-size: 1.6em;
    text-transform: capitalize;
}

h2 {
    /*    color:#047fc2; */
    font-size: 1.5em;
    text-transform: capitalize;
}

h3 {
    /*    color:#047fc2;     */
    font-size: 1.4em;
    text-transform: capitalize;
}

h4 {
    /*    color:#047fc2;     */
    font-size: 1.3em;
    text-transform: capitalize;
}

h5 {
    /*    color:#047fc2;     */
    font-size: 1.2em;
    text-transform: capitalize;
}

h6 {
    /*    color:#047fc2;     */
    font-size: 0.9em;
    text-transform: capitalize;
}

a {
    cursor: pointer;
    font-size: inherit;
    color: #047FC2;
    font-weight: bold;
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
}

a:link, a {
    color:var(--brandColour);
    font-weight:normal;
    font-style:inherit;
    text-decoration: none;
    font-variant:normal;
}
a:visited {
    color:var(--brandColour);
    font-weight: 200;
    font-style:normal;
    font-variant:normal;
    text-decoration: none;
}
a:hover {
    color:var(--brandColour);
    font-weight:normal;
    font-style:normal;
    text-decoration:underline;
    font-variant:normal;
}
a:active {
    color:var(--brandColour);
    font-weight:bold;
    font-style:normal;
    text-decoration:overline underline;
    font-variant:normal;
}

/* SMALL */

.small {
    font-size: 0.9em;
    font-style: normal;
}

.small a:link {
    font-size: 0.9em;
    font-style: normal;
}

.small a:visited {
    font-size: 0.9em;
    font-style: normal;
}

.small a:hover {
    font-size: 0.9em;
    font-style: normal;
    text-decoration: overline underline;
}

.small a:active {
    font-size: 0.9em;
    font-style: normal;
}

/* X-SMALL */

.xsmall {
    font-size: 0.8em;
    font-style: normal;
}

.xsmall a:link {
    font-size: 0.8em;
    font-style: normal;
}

.xsmall a:visited {
    font-size: 0.8em;
    font-style: normal;
}

.xsmall a:hover {
    font-size: 0.8em;
    font-style: normal;
    text-decoration: overline underline;
}

.xsmall a:active {
    font-size: 0.8em;
    font-style: normal;
}

/* XS-SMALL */

.xxsmall {
    font-size: 0.7em;
}

.pagelist2 {
    width: 88%;
}

.wrapper2 {
    min-width: 0;
    width: 95%;
}

.bigerror ul li, .green ul li {
    list-style: none;
}

.bigerror ul, .green ul {
    margin: 0;
    padding: 0;
}

.bigerror {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 75%;
    background-color: #E8514A;
    border: solid 2px red;
    padding: 10px 10px 10px 30px;
    margin: 8px auto;
    font-weight: bold;
    text-align: center;
    color: white;
    background: url('/admin/images/error_icon.png') center left no-repeat #E8514A;
    padding-left: 30px;
    padding-right: 30px;
    box-sizing: border-box;
    -moz-box-shadow: 0 3px 8px #333333;
    -webkit-box-shadow: 0 3px 8px #333333;
    box-shadow: 0 3px 8px #333333;
}

.bigerror a {
    color: #000000;
}

.green {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 75%;
    background-color: #ADEA8B;
    border: solid 2px green;
    padding: 10px 10px 10px 30px;
    margin: 8px auto;
    font-weight: bold;
    text-align: center;
    background: url('/admin/images/tick_icon.png') center left no-repeat #ADEA8B;
    padding-left: 30px;
    padding-right: 30px;
    box-sizing: border-box;
    -moz-box-shadow: 0 3px 8px #333333;
    -webkit-box-shadow: 0 3px 8px #333333;
    box-shadow: 0 3px 8px #333333;
}

.bignote {
    border-radius: 3px;
    width: 75%;
    border: solid 2px #D0C8AF;
    padding: 10px 10px 10px 32px;
    margin: 8px auto;
    font-weight: normal;
    text-align: center;
    background: lightGoldenrodYellow url('/admin/images/help-32.png') center left no-repeat;
    font-size: medium;
    -moz-box-shadow: 0 3px 8px #333333;
    -webkit-box-shadow: 0 3px 8px #333333;
    box-shadow: 0 3px 8px #333333;
}

.smallnote {
    border-radius: 3px;
    width: auto;
    border: solid 1px #D0C8AF;
    padding: 3px;
    margin: 8px auto;
    font-weight: normal;
    text-align: center;
    background: lightGoldenrodYellow;
    border-bottom-width: 2px;
}

#sortResponseShopImg {
    border-radius: 3px;
    border: solid 1px #D0C8AF;
    border-bottom-width: 2px;
    padding: 3px;
    margin: 8px auto;
    font-weight: bold;
    text-align: center;
    background-color: lightGoldenrodYellow;
    font-size: small;
    -moz-box-shadow: 0 3px 8px #333333;
    -webkit-box-shadow: 0 3px 8px #333333;
    box-shadow: 0 3px 8px #333333;
    position: absolute;
    z-index: 99;
    display: none;
    margin-left: 120px;
}

#sortResponse, .sortResponse {
    border-radius: 3px;
    border: solid 1px #D0C8AF;
    border-bottom-width: 2px;
    padding: 3px;
    margin: 8px auto;
    font-weight: bold;
    text-align: center;
    background-color: lightGoldenrodYellow;
    font-size: large;
    -moz-box-shadow: 0 3px 8px #333333;
    -webkit-box-shadow: 0 3px 8px #333333;
    box-shadow: 0 3px 8px #333333;
    position: fixed;
    z-index: 99;
    display: none;
    left: 50%;
    top: 1%;
}

.blogAdvert {
    border-radius: 3px;
    border: solid 1px #CECECE;
    border-bottom-width: 3px;
    padding: 3px;
    margin: 8px auto;
    font-weight: bold;
    text-align: center;
    font-size: 1.1em;
    display: none;
}

.quick_link_container {
    float: right;
    border: none;
    text-align: center;
    /* height:390px; */
    margin-top: 15px;
    clear: none;
}

.quick_links {
    float: left;
    width: 50px;
    height: 70px;
    text-align: center;
    font-size: x-small;
    margin: 5px;
    font-weight: bold;
}

#twitterFeed {
    float: right;
    margin: 0.5em;
}

.footerUsers {
    clear: both;
    /*margin: 1em 1.8em 5em 1.8em;*/
}

.footer {
    font-size: small;
    text-align: center;
    margin: 0 auto;
    margin-top: 0;
    -moz-box-shadow: none;
    box-shadow: none;
    min-height: 26px;
    width: 100%;
    /*width: calc(100% - 220px);*/
    /*background-color: #FAFAFA;*/
    border: solid 1px lightGrey;
    border-radius: 0 0 3px 3px;
    /*overflow: hidden;*//* overflow:hidden stops popups in footer working */
    border-bottom-width: 3px;
    border-radius: 3px;
    /*float: right;*/
    bottom: 0;
    position: relative;
    /*width: calc(100vw - 14%);*/
    margin-bottom: 5em;
    padding-top: 0.5em;
}

.footerlink {
    font-size: small;
}

.serverstats {
    width: 27%;
    margin-top: 1em;
    float: right;
    display: none;
}

.recentpages {
    width: 48%;
    float: left;
    min-height: 253px;
    margin-bottom: 1em;
    margin-right: 1em;
    border: none;
}

.datebox {
    float: right;
    width: 150px;
    font-size: small;
    text-align: right;
    margin-bottom: 7px;
    clear: none;
}

.admin_notice_box {
    border: none;
    width: 400px;
    float: left;
    margin-right: 10px;
}

.admin_notice_area {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 99%;
    background-color: #99CCFF;
    border: solid 2px #0099FF;
    padding: 10px 0 10px 5px;
    margin-bottom: 8px;
    font-weight: bold;
    text-align: center;
}

.admin_notice_area_fieldset {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 99%;
    background-color: #99CCFF;
    border: solid 2px #0099FF;
    padding: 10px 0 10px 5px;
    margin-bottom: 1em;
    font-weight: bold;
    text-align: center;
    box-sizing: border-box;
}

.admin_notice_area_fieldset legend {
    text-align: left;
    font-size: larger;
    background-color: white;
    border: 2px solid #0099FF;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    margin-bottom: -12px;
}

.module_box {
    float: left;
    border: none;
    width: 100%;
    border: none;
}

.admin_social {
    clear: both;
    margin: 0.5em;
    float: left;
}

.selectShadow {
    box-shadow: 0 1px 1px #333333;
    border-radius: 3px;
    height: auto;
    display: inline-block;
    margin: 2px;
    width: auto !important;
}

.selectShadow select { margin: 0; }

fieldset select {
    max-width: 100%;
}


input[type="radio"], input[type="checkbox"] {
    box-shadow: none;
}

/*
input, select, textarea
{
-webkit-border-radius:  3px !important;
-moz-border-radius:  3px !important;
border-radius:  3px !important;
border: 1px grey solid;
padding: 4px;
margin: 2px;
font-weight: bold;
font-family: inherit;
font-size:inherit;
box-shadow: 0 1px 1px #333;
-moz-box-shadow: 0 1px 1px #333;
-webkit-box-shadow: 0 1px 1px #333;
transition: box-shadow 0.4s ease-in-out;
}
*/

input, select, textarea {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    border: 1px #BDC3C7 solid;
    padding: 4px;
    margin: 2px;
    font-weight: bold;
    font-family: inherit;
    font-size: inherit;
    border-bottom-width: 2px;
    transition: box-shadow 0.4s ease-in-out;
}

textarea {
    vertical-align: top;
    transition: height 0.2s;
    -webkit-transition: height 0.2s;
    -moz-transition: height 0.2s;
}

/*
input:not([type='button']), input:not([type='submit']) {
border: inherit;
color: inherit;
}
*/

/*
button
{
text-shadow: 0 1px 1px rgba(255,255,255,.3);
background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0.11, #C0C0C0),
    color-stop(0.89, #F5F5F5),
    color-stop(1, #D9D9D9)
    );
  background-image: -moz-linear-gradient(
    center bottom,
    #C0C0C0 11%,
    #F5F5F5 89%,
    #D9D9D9 100%
    );
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#D9D9D9', endColorstr='#C0C0C0');
}

button:active
{
text-shadow: 0 1px 1px rgba(255,255,255,.3);
position: relative;
top: 1px;
background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(1, #D9D9D9),
    color-stop(0.89, #F5F5F5),
    color-stop(0.11, #B0B0B0)
    );
  background-image: -moz-linear-gradient(
    center bottom,
    #D9D9D9 100%,
    #F5F5F5 89%,
    #B0B0B0 11%
    );
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#B0B0B0', endColorstr='#D9D9D9');
}
*/

textarea { width: 98%; }

/*
textarea
{
-webkit-border-radius:  3px;
-moz-border-radius:  3px;
border-radius:  3px;
border: 1px grey solid;
font-family: inherit;
font-size: inherit;
width: 98%;
box-shadow: 0 1px 1px #333;
padding: 4px;
margin: 2px;
}
*/

fieldset {
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    border: 1px solid #C9D1DA !important;
    border-bottom-width: 0;
    font-weight: normal !important;
    background: #fff;
}

fieldset p { margin: 0.5em 0; }

legend {
    font-weight: bold;
    padding: 0 0.5em !important;
    font-size: 1.2em;
    background: #fff;
    box-shadow: rgb(0 0 0 / 7%) -2px 3px 1px 0;
    border: 1px solid #C9D1DA !important;
    border-radius: 4px;
}

.input_red {
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    border: 1px darkred solid;
    background-color: #FF3000;
    font-weight: bold;
    color: white;
    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(0.11, #DD0000),
            color-stop(0.89, #FFE0E0),
            color-stop(1, #FA8E8C)
    );
    background-image: -moz-linear-gradient(
            #DD0000 11%,
            #FFE0E0 89%,
            #FA8E8C 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#DD0000', endColorstr='#FA8E8C');
}

.input_red:active {
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    position: relative;
    top: 1px;
    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(1, rgb(250, 140, 140)),
            color-stop(0.89, rgb(255, 224, 224)),
            color-stop(0.11, rgb(222, 0, 0))
    );
    background-image: -moz-linear-gradient(
            rgb(250, 140, 140) 100%,
            rgb(255, 224, 224) 89%,
            rgb(222, 0, 0) 11%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FA8E8C', endColorstr='#DD0000');
}

.input_red_link {
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    border: 1px darkred solid;
    background-color: #FF3000;
    font-weight: bold;
    color: white;
    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(0.11, #DD0000),
            color-stop(0.89, #FFE0E0),
            color-stop(1, #FA8E8C)
    );
    background-image: -moz-linear-gradient(
            #DD0000 11%,
            #FFE0E0 89%,
            #FA8E8C 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#DD0000', endColorstr='#FA8E8C');
}

.input_blue {
    text-shadow: 0 1px 1px #333333;
    border: 1px #207EBC solid;
    background-color: #99CCFF;
    font-weight: bold;
    color: white;
    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(0.11, #207EBC),
            color-stop(0.89, #C5DEEA),
            color-stop(1, #8ABBD7)
    );
    background-image: -moz-linear-gradient(
            #207EBC 11%,
            #C5DEEA 89%,
            #8ABBD7 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#207EBC', endColorstr='#8abbd7');
}

.input_blue:active {
    text-shadow: 0 1px 1px #333333;
    position: relative;
    top: 1px;
    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(1, #8ABBD7),
            color-stop(0.89, #DAFFE0),
            color-stop(0.11, #207EBC)
    );
    background-image: -moz-linear-gradient(
            #8ABBD7 100%,
            #DAFFE0 89%,
            #207EBC 11%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8abbd7', endColorstr='#207EBC');
}

.input_green {
    text-shadow: 0 1px 1px rgba(255, 255, 255, .3);
    border: 1px darkgreen solid;
    background-color: lightgreen;
    font-weight: bold;
    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(0.11, #00FF00),
            color-stop(0.89, #DAFFE0),
            color-stop(1, #8CFF9D)
    );
    background-image: -moz-linear-gradient(
            #00FF00 11%,
            #DAFFE0 89%,
            #8CFF9D 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00FF00', endColorstr='#8CFF9D');
}

.input_green:active {
    text-shadow: 0 1px 1px rgba(255, 255, 255, .3);
    position: relative;
    top: 1px;
    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(1, #8CFF9D),
            color-stop(0.89, #DAFFE0),
            color-stop(0.11, #00FF00)
    );
    background-image: -moz-linear-gradient(
            #8CFF9D 100%,
            #DAFFE0 89%,
            #00FF00 11%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8CFF9D', endColorstr='#00FF00');
}

.input_grey, .newsbutton {
    text-shadow: 0 1px 1px rgba(255, 255, 255, .3);
    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(0.11, #C0C0C0),
            color-stop(0.89, #F5F5F5),
            color-stop(1, #D9D9D9)
    );
    background-image: -moz-linear-gradient(
            #C0C0C0 11%,
            #F5F5F5 89%,
            #D9D9D9 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D9D9D9', endColorstr='#C0C0C0');
}

.input_grey:active {
    text-shadow: 0 1px 1px rgba(255, 255, 255, .3);
    position: relative;
    top: 1px;
    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(1, #D9D9D9),
            color-stop(0.89, #F5F5F5),
            color-stop(0.11, #B0B0B0)
    );
    background-image: -moz-linear-gradient(
            #D9D9D9 100%,
            #F5F5F5 89%,
            #B0B0B0 11%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#B0B0B0', endColorstr='#D9D9D9');
}

/*
.input
{
text-shadow: 0 1px 1px rgba(255,255,255,.3);

background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.11, #C0C0C0),
color-stop(0.89, #F5F5F5),
color-stop(1, #D9D9D9)
);
background-image: -moz-linear-gradient(
center bottom,
#C0C0C0 11%,
#F5F5F5 89%,
#D9D9D9 100%
);
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#D9D9D9', endColorstr='#C0C0C0');
}

.input:active
{
text-shadow: 0 1px 1px rgba(255,255,255,.3);

position: relative;
top: 1px;
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(1, #D9D9D9),
color-stop(0.89, #F5F5F5),
color-stop(0.11, #B0B0B0)
);
background-image: -moz-linear-gradient(
center bottom,
#D9D9D9 100%,
#F5F5F5 89%,
#B0B0B0 11%
);
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#B0B0B0', endColorstr='#D9D9D9');

}
*/

.online_users {
    float: right;
    border: none;
    text-align: center;
    /* height:390px; */
    margin-top: 15px;
    clear: right;
    width: 100%;
}

.comments {
    float: right;
    border: none;
    text-align: center;
    margin-top: 15px;
    clear: right;
    width: 100%;
}

.staff_tab {
    /*background-color: #eef4f9;*/
    float: left;
    cursor: pointer;
    margin-right: 5px;
    border-top: 1px solid #CAD0D5;
    border-left: 1px solid #CAD0D5;
    border-right: 1px solid #CAD0D5;
    min-width: 13%;
    text-align: center;
    height: 20px;
    padding: 4px;
}

.public_tab {
    float: left;
    cursor: pointer;
    border-top: 1px solid #CAD0D5;
    border-left: 1px solid #CAD0D5;
    border-right: 1px solid #CAD0D5;
    min-width: 13%;
    text-align: center;
    height: 20px;
    padding: 4px;
    margin-top: 10px;
    margin-right: 5px;
    margin-left: 1px;
}

.templ_tab {
    /*background-color: white; */
    float: left;
    cursor: pointer;
    border-top: 1px solid #CAD0D5;
    border-left: 1px solid #CAD0D5;
    border-right: 1px solid #CAD0D5;
    min-width: 15%;
    text-align: center;
    height: 20px;
    padding: 4px;
    margin-top: 10px;
    margin-right: 5px;
    color: #FFFFFF;
}

.lock a {
    color: #990000 !important;
}

.custom_file {
    float: left;
    margin: 5px;
    text-align: center;
    border: dashed #EEF4F9 2px;
    cursor: pointer;
    font-weight: bold;
}

.custom_banner {
    float: left;
    margin: 10px;
    text-align: center;
    border: dashed #EEF4F9 2px;
    cursor: pointer;
    font-weight: bold;
}

.file_thumb {
    float: left;
    margin: 10px;
    text-align: center;
    border: dashed #EEF4F9 2px;
    cursor: pointer;
    font-weight: bold;
    word-wrap: break-word;
    width: 170px;
    height: 170px;
    position: relative;
}

.thumb_filename {
    max-height: 50px;
}

.fileURL {
    display: none;
    position: absolute;
    z-index: 99;
    margin: auto;
    width: 100%;
}

.fileURL input { width: 91%; }

.file_upload_grid {
    width: 141px;
    height: 125px;
}

.file_upload {
    float: left;
    margin: 10px;
    text-align: center;
    border: dashed #EEF4F9 2px;
    cursor: pointer;
    font-weight: bold;
    width: 130px;
    height: 125px;
}

#template_placeholder, #css_placeholder {
    float: left;
    width: 100%;
}

#template_virtual_dir, #css_virtual_dir {
    width: 98%;
    height: 330px;
    overflow: auto;
    border: inset 2px #C0C0C0;
    float: none;
    margin: 0.5em;
    padding: 5px;
    background-color: #E0E0E0;
    border-radius: 2px;
    box-sizing: border-box;
    word-break: break-all;
}

#template_virtual_dir ul, #css_virtual_dir ul {
    list-style: none;
    padding: 0.3em;
}

#template_virtual_dir ul li a, #css_virtual_dir ul li a { color: #222222; }

#template_virtual_dir li:before, #css_virtual_dir li:before {
    content: "\f1c9";
    font-family: FontAwesome;
    color: #989898;
    font-weight: 100;
    font-size: 1.5em;
    margin-right:0.3em;
}

#template_virtual_dir li.listIcon{
    color: #989898;
    font-weight: 100;
    font-size: 1.5em;
    margin-right:0.3em;
}

#template_virtual_dir li.htmlIcon:before {
    content: "\f1c9";
}

#template_virtual_dir li.themeIcon:before {
    content: "\f108";
}

#template_virtual_dir li.themeIconActive:before {
    content: "\f108";
    color: #00B7F1;
    font-weight: bold;
}

#template_virtual_dir li.menuIcon:before {
    content: "\f0c9";
}

#template_virtual_dir li.imageIcon:before {
    content: "\f03e";
}

#template_virtual_dir li.fontsIcon:before {
    content: "\f031";
}

#template_virtual_dir li.cogsIcon:before {
    content: "\f085";
}

div.customTagsDir ul {
    padding: 0;
    margin: 0;
}

div.customTagsDir ul li {
    display: inline-block;
    border: 1px solid #84939D;
    margin: 0.3em;
    border-radius: 3px;
    padding: 0.1em;
    border-bottom: 2px solid #84939D;
}

dir.customTagsDir ul li a { color: #222222; }

#button_holder {
    width: auto;
    height: auto;
    margin-top: 1em;
    float: left;
}

#buttons_placeholder {
    float: none;
    width: 100%;
    word-wrap: break-word;
}

#save_button {
    text-align: center;
    width: 350px;
}

#new_file_button {
    text-align: center;
    width: 100%;
}

#save_file {
    border: 1px solid #5DA423;
    width: 100%;
    border-radius: 3px;
}

.dropshadow {
    -moz-box-shadow: 0 2px 6px rgba(181, 181, 181, 0.61);
    -webkit-box-shadow: 0 2px 6px rgba(181, 181, 181, 0.61);
    box-shadow: 0 2px 6px rgba(181, 181, 181, 0.61);
}

.textshadow {
    /*text-shadow: -1px 1px 2px #333;*/
}

#login_box {
    border: solid black 1px;
    width: 30%;
    background-color: #EEF4F9;
    box-shadow: 0 3px 8px #333333;
}

#login_box2 {
    margin-top: 2em;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 7px 0 0;
    font-family: inherit;
    font-weight: bold;
    font-size: 1em;
    border-radius: 2px;
    border: 1px solid #333333;
    width: 30%;
    box-shadow: 0 3px 8px #333333;
    background-color: white;
}

.login_message {
    width: 345px !important;
    margin: auto;
    margin-top: 1em;
}

#login_wrapper {
    margin: 0 auto;
    min-height: 460px;
}

#login_header, .top_header {
    padding: 7px 0;
    border-radius: 2px 2px 0 0;
    height: auto;
    text-align: center;
    background: white;
    /*
background: -moz-linear-gradient(top,white 0,rgb(250, 250, 250) 100%);
background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,white),color-stop(100%,rgb(250,250,250)));
background: -webkit-linear-gradient(top,white 0,rgb(250, 250, 250) 100%);
background: -o-linear-gradient(top,white 0,rgb(250, 250, 250) 100%);
background: -ms-linear-gradient(top,white 0,#fafafa 100%);
background: linear-gradient(to bottom,white 0,rgb(250, 250, 250) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='white',endColorstr='#fafafa',GradientType=0);
*/
    border-top: 0;
    border-right: 0;
    border-bottom: 1px solid #DDDDDD;
    border-left: none;
}

#login_header img#logo_img {
    float: none;
    width: 250px;
    margin: 0;
}

#login_box3 {
    border: 1px solid lightgrey;
    width: 345px;
    margin-top: 2em;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 0;
    font-family: inherit;
    font-weight: bold;
    font-size: 1em;
    border-radius: 2px;
    box-shadow: 0 0 20px #999999;
    background-color: white;
}

#login_box4 {
    border: 1px solid #DADADA;
    /*width: 375px;*/
    /*width: 345px;*/
    width: 400px;
    margin-top: 2em;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 0;
    font-family: inherit;
    font-weight: bold;
    font-size: 1em;
    border-radius: 2px;
    background-color: #FFFFFF;
    border-bottom-width: 3px;
}

@media (max-width: 480px) {
    #login_box3, .login_message, #login_box4 {
        width: 100% !important;
        min-width: 300px;
    }

    #login-wrapper {
        width: 100%;
        min-width: 280px;
        margin: 15px 0;
    }

    #eu-cookies {
        /* position: relative !important; */
        width: 100%;
        margin: 0;
        height: 10% !important;
        font-size: 0.7em !important;
        box-sizing: border-box;
    }

}

#login_box3 placeholder {
    font-style: italic;
    font-weight: normal;
}

#login_form {
    margin: auto;
    /*width: 270px;*/
    /*width: 250px;*/
    width: 300px;
    font-weight: normal;
    /*text-align: justify;*/
    color: #84939D;
}

#login_form input[type="submit"] {
    padding: 6px;
    min-width: 70px;
    width: 100%;
}

/*
@media (max-width:350px) {
    #login_box4, #login_header, #login_form{ width:100%; margin: 0.3em; box-sizing: border-box;}
    }*/

/*
#login_form input[type="password"] {
    background: white url('images/padlock.png') 3px 6px no-repeat;
    padding-left: 23px;
    }

#login_form input[type="text"] {
    background: white url('images/user.png') 3px 6px no-repeat;
    padding-left: 23px;
    }
*/

#login_footer {
    font-size: 0.9em;
    width: 100%;
    margin: auto;
    text-align: center;
    position: relative;
    box-sizing: border-box;
    margin-top: 1em;
}

/*
body:focus {
outline-color: none;
outline-style: none;
outline-width: 0;
border-radius:0;
}
*/

:focus {
    box-shadow: 0 1px 0 var(--brandColour) inset, 0 -1px 0 var(--brandColour) inset, 1px 0 0 var(--brandColour) inset, -1px 0 0 var(--brandColour) inset !important;
    outline: none;
}

@-moz-document url-prefix() {
    :focus {
        outline-color: lightgrey;
        outline-style: dotted;
        outline-width: 1px;
    }
}

/*
:focus, input[type="radio"]:focus, input[type="checkbox"]:focus {
outline-color: lightgrey;
outline-style: dotted;
outline-width: 1px;
}*/
/*
input:focus, textarea:focus, .selectShadow select:focus, select:focus, #login_form input[type="text"]:focus, #login_form input[type="password"]:focus {

border-radius: 3px !important;
transition: border 0.4s ease-in-out !important;
border: 1px solid #026eb7 !important;
border-bottom-width: 2px !important;
outline-color: #026eb7 !important;
outline-style: solid !important;
outline-width: 0;
}*/

::-webkit-input-placeholder, ::-moz-placeholder, :-moz-placeholder, :-ms-input-placeholder {
    font-style: normal;
    font-family: sans-serif;
    font-size: 0.9em;
}

/* BANNER CREATOR FONTS - UNUSED AS OF JUNE 2012 */
@font-face {
    font-family: 'Edition';
    src: url('/admin/banner_creator/banner_fonts/Edition.ttf') format('truetype');
}

@font-face {
    font-family: 'Fafers';
    src: url('/admin/banner_creator/banner_fonts/Fafers.ttf') format('truetype');
}

@font-face {
    font-family: 'costura_regular';
    src: url('/admin/banner_creator/banner_fonts/costura_regular.ttf') format('truetype');
}

@font-face {
    font-family: 'costura_bold';
    src: url('/admin/banner_creator/banner_fonts/costura_bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Qarmic_sans_Abridged';
    src: url('/admin/banner_creator/banner_fonts/Qarmic_sans_Abridged.ttf') format('truetype');
}

@font-face {
    font-family: 'BLOODY';
    src: url('/admin/banner_creator/banner_fonts/BLOODY.ttf') format('truetype');
}

@font-face {
    font-family: 'CloisterBlack';
    src: url('/admin/banner_creator/banner_fonts/CloisterBlack.ttf') format('truetype');
}

@font-face {
    font-family: 'Deutsch';
    src: url('/admin/banner_creator/banner_fonts/Deutsch.ttf') format('truetype');
}

@font-face {
    font-family: 'Tuffy';
    src: url('/admin/banner_creator/banner_fonts/Tuffy.ttf') format('truetype');
}

@font-face {
    font-family: 'Tuffy_Bold';
    src: url('/admin/banner_creator/banner_fonts/Tuffy_Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Tuffy_Bold_Italic';
    src: url('/admin/banner_creator/banner_fonts/Tuffy_Bold_Italic.ttf') format('truetype');
}

@font-face {
    font-family: 'Tuffy_Italic';
    src: url('/admin/banner_creator/banner_fonts/Tuffy_Italic.ttf') format('truetype');
}

/*@font-face {
    font-family: 'After_Shok';
    src: url('/admin/banner_creator/banner_fonts/After_Shok.ttf') format('truetype');
}*/

@font-face {
    font-family: 'BOYCOTT';
    src: url('/admin/banner_creator/banner_fonts/BOYCOTT.ttf') format('truetype');
}

@font-face {
    font-family: 'FFF_Tusj';
    src: url('/admin/banner_creator/banner_fonts/FFF_Tusj.ttf') format('truetype');
}

@font-face {
    font-family: 'tiza';
    src: url('/admin/banner_creator/banner_fonts/tiza.ttf') format('truetype');
}

/* Page Editor Tabs */

UL.tabNavigation {
    list-style: none;
    margin: 0;
    padding: 0;
    height: 20px;
}

UL.tabNavigation LI {
    display: inline;
}

UL.tabNavigation LI A {
    padding: 7px 15px;
    color: #000000 !important;
    text-decoration: none;
    background-color: silver; /*#AFC7C7;*/
    border-top: 1px solid #CAD0D5;
    border-left: 1px solid #CAD0D5;
    border-right: 1px solid #CAD0D5;
    height: 50px;
    bottom: 2px;
    position: relative;
}

UL.tabNavigation LI A.selected,
UL.tabNavigation LI A:hover {
    background-color: white; /*#eef4f9;*/
    color: #333333 !important;
    padding: 7px 15px;
}

UL.tabNavigation LI A:focus {
    outline: 0;
}

div.tabs > div {
    padding: 5px;
    margin-top: 3px;
    border: 1px solid lightgrey; /*#AFC7C7;*/
    background-color: white; /*#eef4f9;*/
    border-radius: 0;
}

div.tabs > div h2 {
    margin-top: 0;
}

.line-separator {
    margin: 0 10px;
    border-right: 1px solid #CCCCCC;
    padding: 10px 0;
    width: 1px;
    height: 0;
}

.line-separator-hoz {
    margin: 10px 0;
    border-bottom: 1px solid #CCCCCC;
    padding: 0;
    width: 98%;
    height: 1px;
    clear: both;
}

.wordCountError { color: red !important; }

.wordCount { font-weight: bold; font-size: smaller; color: inherit; }

#quick_links_sidebox {
    position: fixed;
    left: 0;
    border-top: 1px solid silver;
    border-right: 1px solid silver;
    border-bottom: 1px solid silver;
    padding: 3px;
    border-radius: 0 2px 2px 0;
    background-color: white;
    box-shadow: 0 4px 8px #333333;
    width: 133px;
    z-index: 99;
    display: none;
}

#quick_links_sidebox-show {
    left: -44px;
    position: fixed;
    border: 1px solid silver;
    padding: 3px;
    border-radius: 2px 2px 0 0;
    background-color: white;
    writing-mode: tb-rl;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
    cursor: pointer;
    z-index: 99;
    display: none;
}

#hide-quick-links, #hide-social_popup {
    width: 16px;
    float: right;
    cursor: pointer;
}

#social_popup {
    position: fixed;
    right: 5em;
    border-top: 1px solid silver;
    border-right: 1px solid silver;
    border-left: 1px solid silver;
    padding: 3px;
    border-radius: 2px 2px 0 0;
    background-color: white;
    box-shadow: 0 4px 8px #333333;
    min-width: 253px;
    bottom: 0;
    z-index: 99;
    display: none;
}

#social_popup-show {
    position: fixed;
    right: 5em;
    border-top: 1px solid silver;
    border-right: 1px solid silver;
    border-left: 1px solid silver;
    padding: 3px;
    border-radius: 2px 2px 0 0;
    background-color: white;
    box-shadow: 0 4px 8px #333333;
    width: auto;
    bottom: 0;
    cursor: pointer;
    z-index: 99;
    display: none;
}

#container-1, #container-2, #container-3 {
    width: auto;
    height: auto;
}

li #twitter-click, li #news-click, li #social-click {
    cursor: pointer;
}

/*.del_button {
    color: white !important;
    padding: 2px;
    font-weight: bold;
    text-decoration: none;
    text-shadow: none;
    border-radius: 2px;
    border: 1px darkRed solid;
    background-color: #FF3000;
    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(0.11, #DD0000),
            color-stop(0.89, #FFE0E0),
            color-stop(1, #FA8E8C)
    );
    background-image: -moz-linear-gradient(
            center bottom,
            #DD0000 11%,
            #FFE0E0 89%,
            #FA8E8C 100%
    );
}*/

.module_section {
    width: 100%;
    clear: both;
    overflow: hidden;
}

/*Templ Ed Menu Example */
#menuEx {
    width: 143px;
    height: 25px;
    border: 2px solid black;
    text-align: center;
    padding: 5px;
    font-size: large;
    font-weight: bold;
}

.getLink {
    display: none;
    margin-top: -35px;
    height: 35px;
    position: relative;
    z-index: 99;
}

.news_box {
    width: 99%;
    display: block;
    border: 1px solid silver;
    border-radius: 2px;
    padding: 3px;
    box-sizing: border-box;
    height: 30px;
    overflow: hidden;
    box-shadow: 0 1px 6px #C0C0C0;
    margin: 0 auto 1em;
}

.news_box iframe {
    height: 50px;
    overflow: hidden;
}

/*Clearfix */

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}

#webbossSearch {
    /*width: 170px;*/
    width: 40%;
    font-size: 1.1em;
}

#databaseSearch {
    font-size: 1em;
}

.searchArea {
    /* float: right; */
    box-sizing: border-box;
    width: 100%;
    padding: 0.5em;
    font-size: 1.1em;
}

input.blue_button.padding4 {
    padding: 0.2em 0.4em;
}

.searchArea i.fa.fa-search {
    font-size: 1.4em;
}

#sysInfoText {
    font-size: 0.9em;
}

div#sysInfoText a {
    /* text-decoration: underline; */
    color: #7D929F !important;
}

.top_box {
    margin-bottom: 1em;
    float: left;
    width: 100%;
}

.top_box fieldset legend {
    font-size: 1em;
    
    box-shadow: none;
    padding: 0 1em !important;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.top_box fieldset legend h2 {
    border-bottom: 1px solid #00b7f1;
}


div.notifications {
    float: left;
    border: none;
    text-align: center;
    margin-top: 15px;
    clear: right;
    width: 15.9%;
    margin-right: 0.5em !important;
    box-sizing: border-box;
    min-height: 91px;
}

div.notifications table {
    border: none;
    border-radius: 3px;
    background-color: transparent;
}

/*Shop Preview*/

.shop_prod_name {
    display: inline-block;
    font-size: small;
    text-align: left;
    line-height: 1.25em;
    margin: 8px 0 3px;
    overflow: hidden;
    padding: 0;
    width: 193px;
    height: 32px;
}

#overlay-preview {
    height: 93px;
    width: 223px;
    margin-left: 0;
    position: absolute;
    margin-top: -94px;
    z-index: 99;
    margin-bottom: 0;
    background-image: none;
    background-position: bottom right;
    background-repeat: no-repeat;
}

.shop_item {
    float: left;
    margin: 3px;
    text-align: center;
    font-weight: bold;
    width: 232px;
    height: 290px;
    padding: 5px;
    overflow: hidden;
}

.shop_item:hover {
    padding: 5px;
    box-shadow: 0 3px 8px #979797;
}

#shop_item_img_holder {
    height: 222px;
    width: 222px;
    background-color: white;
    overflow: hidden;
    border: 1px solid silver;
}

.shop_box_desc {
    margin-top: 0;
    text-align: left;
    height: 15px;
    margin-bottom: 5px;
    font-size: medium;
    width: 193px;
    margin: auto;
}

.console {
    height: 450px;
    width: 100%;
    font-family: monospace;
    font-weight: normal;
    background-color: #333333;
    color: white;
    border-radius: 0;
    border: 2px solid silver;
    padding: 5px;
    overflow: auto;
    box-sizing: border-box;
}

.cpTile {
    margin: 5px;
    display: inline-block;
    width: 9%;
    height: auto;
    cursor: pointer;
}

.cpTile div {
    font-weight: bold;
    text-align: center;
    /*font-size: 1.5em;*/
    font-size: 0.9em;
    color: #84939D;
}

/*Fancy Buttons*/
/*
.green_button {
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background: url('images/tick_icon.png') center left no-repeat #adea8b;
border: solid 1px green;
padding: 10px 10px 10px 30px;
font-weight: bold;
text-align: center;
position: relative;
text-shadow: 0 1px 1px #DFD;
font-size: medium;
color: #0F3D0F;
}

.green_button:active{
border: inset 1px green;
text-shadow: 0 -1px 1px #CAFFCA;
}


a.red_button {
color: white;
text-decoration: none;
}

.red_button {
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background: url('images/error_icon.png') center left no-repeat #E8514A;
border: solid 1px #A21C1C;
padding: 10px 10px 10px 30px;
font-weight: bold;
text-align: center;
position: relative;
text-shadow: 0 -1px 1px #8B1F1F;
font-size: medium;
color: white;
}

.red_button:active{
border: inset 1px red;
text-shadow: 0 1px 1px #D82525;
}

.grey_button, button, .input {
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background: rgb(238, 238, 238);
border: solid 1px grey;
padding: 10px;
font-weight: bold;
text-align: center;
position: relative;
text-shadow: 0 1px 1px white;
font-size: medium;
color: #585858;
}

.grey_button:active, button:active, .input:active{
border: inset 1px grey;
text-shadow: 0 -1px 0 #DADADA;
}

.blue_button {
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background: rgb(117, 180, 221);
border: solid 1px rgb(54, 96, 160);
padding: 10px;
font-weight: bold;
text-align: center;
position: relative;
text-shadow: 0 -1px 0 #29526F;
font-size: medium;
color: white;
}

.blue_button:active{
border: solid 1px #3660A0;
//text-shadow: 0 1px 1px #1669A8;
    }*/
/*
.red_button, .green_button, .grey_button, .blue_button, button, .input {
    cursor: pointer;
    text-decoration: none;
    /*box-shadow: 0 1px 1px #333;
moz-box-shadow: 0 1px 1px #333;
-webkit-box-shadow: 0 1px 1px #333;
    border-bottom-width: 2px;
}

.red_button:active, .green_button:active, .grey_button:active, .blue_button:active, button:active, .input:active {
    cursor: pointer;
    text-decoration: none;
    box-shadow: 0 0 1px #333333;
    moz-box-shadow: 0 0 1px #333333;
    -webkit-box-shadow: 0 0 1px #333333;
}

*/

/* Button and Input Fixes */

.padding4 {
    padding: 4px;
}

.smallButton {
    font-size: 0.8em !important;
}

/*
.paddingIcon {
padding: 5px 5px 5px 30px;
}
*/

.noshadow {
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
}

div#left {
    float: left;
    margin: 0 5px 0 0;
    border-right: 1px solid silver;
    padding: 0;
    width: 48%;
    text-align: left;
}

div#right {
    float: left;
    margin-bottom: 10px;
    width: 50%;
}

.display {
    display: block !important;
}

.hidden {
    display: none !important;
}

.hidden li a {
    font-style: italic;
    color: silver;
}

li .hidden a {
    font-style: italic;
    color: silver;
}

.listItem {
    display: list-item !important;
}
.listItem a, a.draft, a.unpublished {
    padding: 3px;
    color: #222 !important;
    background: #ccc;
    border-radius: 2px;
}

#BannerImgDropDowns {
    max-width: 299px;
}

.top {
    font-size: small !important;
}

td.temp {
    font-size: 16px;
}

.smallmodal {
    display: none;
    width: 300px;
    text-align: left;
    box-shadow: 0 3px 15px 2px rgba(139, 139, 139, 0.85);
    position: fixed;
    padding: 5px;
    background-color: white;
    z-index: 99;
    word-wrap: break-word;
    top: 10%;
    left: 40%;
}

.close, .deleteX {
    margin: 5px;
    float: right;
    width: 16px;
    height: 16px;
    background: url('/public/images/deleteXgrey.png') no-repeat center center transparent;
    position: absolute !important;
    right: 0;
    top: 0;
    z-index: 999;
    border: none;
}

.close.whiteX, .deleteX.whiteX {
    background: url('/public/images/deleteXwhite.png') no-repeat center center transparent !important;
}

.close:hover, .deleteX:hover {
    background: url('/public/images/deleteX.png') no-repeat center center transparent !important;
}

.recentList {
    font-size: 1.1em;
    border: 1px solid #E2E2E2;
    border-bottom-width: 2px;
    padding: 4px;
    margin-bottom: 0.5em;
    float: right;
    width: 50%;
    background: #fff;
    border-radius: 4px;
    color: #ccc;
}

.recentList b {
    color: #333;
}

.largemodal {
    display: none;
    width: 500px;
    height: 400px;
    text-align: left;
    box-shadow: 0 3px 4px 1px rgba(139, 139, 139, 0.5);
    position: absolute;
    padding: 5px;
    background-color: white;
    z-index: 99;
    word-wrap: break-word;
    overflow: auto;
}

.modFieldset {
    float: right;
    width: 721px;
    margin-bottom: 15px;
    text-align: right;
}

.regularcase, .normalcase {
    text-transform: none !important;
}

.lowercase {
    text-transform: lowercase;
}

#update-modal {
    position: absolute;
    width: 500px;
    max-width: 100%;
    /*top: 8%;*/
    /*left: 50%;*/
    /*margin-left: -250px;*/
    left: -100%;
    right: -100%;
    margin: auto;
    border-radius: 2px;
    box-shadow: rgb(91, 139, 199) 0 0 80px;
    border: 10px solid rgba(26, 26, 26, 0.5);
    z-index: 999;
    height: 680px;
    box-sizing: border-box;
}

#update-modal p:last-child {
    margin: 0;
    padding-bottom: 1em;
}

#pgoverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000000;
    opacity: 0.5;
    filter: alpha(opacity=50);
    display: none;
    z-index: 998;
}

#updatetext {
    height: 430px;
    overflow: auto;
    padding: 0.5em;
    text-align: left;
    margin: auto;
    display: block;
    font-weight: normal;
}

.downloadTracker {
    text-align: center;
    width: 50%;
    float: right;
    margin-top: 2em;
    margin-bottom: 2em;
}

.downloadTracker table {
    text-align: center;
}

.draft, .unpublished {
    background-color: #E0E0E0;
    font-style: italic;
    font-weight: bold;
}

.errlist, .successlist {
    margin: auto;
    text-align: center;
    box-sizing: border-box;
}

.errlist li {
    list-style-image: url('/admin/images/error-16.png');
    font-size: large;
    font-weight: bold;
}

.successlist li {
    list-style-image: url('/admin/images/tick-16new.png');
    font-size: large;
    font-weight: bold;
}

.uploadDiv {
    max-width: 500px;
    margin: auto;
}

.fileimg {
    background: url('/admin/images/fileicons/file.png') center center no-repeat;
    background-size: 100px;
}

/*Prod editor tabs inner divs*/
.tabBlock {
    width: 32%;
    display: inline-block;
    border-right: 1px solid #CCCCCC;
    vertical-align: top;
    padding: 5px;
    box-sizing: border-box;
}

.tabBlock input[type="text"] {
    width: 95%;
}

#prod_settings > div:nth-child(5) {
    border: none;
}

#prod_cat optgroup {
    color: grey;
}

#prod_cat optgroup option {
    color: black;
}

.prodCatList {
    width: 95%;
    height: auto;
    max-height: 300px;
    border: 1px solid #CCCCCC;
    overflow: auto;
    padding: 5px;
}

.prodCatList ul li {
    font-size: 1.2em;
}

.prodCatList li label {
    cursor: pointer;
    display: block;
}

* html .prodCatList li label { height: 1%; }

/*IE hack fix */

.prodCatList ul, .prodCatList ul ul {
    list-style-type: none;
    padding-left: 1em;
}

.CatSelected {
    background-color: #F1F1F1;
}

#imgThumbHolder {
    width: 100%;
    max-height: 250px;
    height: 200px;
    overflow: auto;
}

.wordbreak, .wordwrap, .breakword {
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    /*white-space: -pre-wrap;*/
    white-space: -o-pre-wrap;
    word-wrap: break-word;
    hyphens: auto;
}

.breakall {
    word-break: break-all;
    white-space: pre-wrap;
    hyphens: auto;
}

/* jQuery Sortable styles */

/* Edit Category page: mainLI */

.placeholder-border { border: 1px dashed #999999; }

.dashed-placeholder {
    border: 2px dashed #999999;
    width: 100%;
    height: 50px;
}

.dashed-placeholder-thumb {
    border: 2px dashed #999999;
    width: 5px;
    height: 100px;
    background-color: #D3D3D3 !important;
}

.dashed-placeholder-pg {
    border: 2px dashed #999999;
    width: 100%;
    height: 15px;
}

#toplevel { list-style: none; }

.mainLI h3:hover, .sublevel li:hover { cursor: move; }

.mainLI h3:active, .sublevel li:active {
    box-shadow: 3px 4px 8px rgba(129, 129, 129, 0.5);
    margin-top: -1px;
    margin-left: -1px;
}

.mainLI h3 {
    border: 1px solid #E6E6E6;
    padding: 4px;
    background: #F1F1F1;
    background: -moz-linear-gradient(top, #F1F1F1 0%, #F2F2F2 51%, #EDEDED 52%, #EDEDED 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #F1F1F1), color-stop(51%, #F2F2F2), color-stop(52%, #EDEDED), color-stop(100%, #EDEDED));
    background: -webkit-linear-gradient(top, #F1F1F1 0%, #F2F2F2 51%, #EDEDED 52%, #EDEDED 100%);
    background: -o-linear-gradient(top, #F1F1F1 0%, #F2F2F2 51%, #EDEDED 52%, #EDEDED 100%);
    background: -ms-linear-gradient(top, #F1F1F1 0%, #F2F2F2 51%, #EDEDED 52%, #EDEDED 100%);
    background: linear-gradient(to bottom, #F1F1F1 0%, #F2F2F2 51%, #EDEDED 52%, #EDEDED 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1f1f1', endColorstr='#ededed', GradientType=0);
}

ul.sublevel {
    list-style: none;
    vertical-align: middle;
    padding-left: 20px;
}

.container404 {
    overflow: hidden;
}

.leftCol404 {
    width: 40%;
    height: auto;
    float: left;
    padding: 1em;
}

.rightCol404 {
    width: 55%;
    height: auto;
    float: left;
    padding: 1em;
}

.listPlayer {
    width: 45px;
    float: right;
}

ul#badges {
    padding: 0;
}

#badges li {
    display: inline-block;
    margin: 0.5em 1em;
}

.divThirds {
    float: right;
    text-align: left;
    width: 33%;
}

.divThirds fieldset { min-height: 284px; }

.divThirds fieldset legend { text-align: right; }

.helpguides {
    width: 100%;
    min-height: 500px;
}

/**** FLAT UI ****/

.green-flat, .green {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    width: 50%;
    background-color: #8FD117;
    background-image: none;
    border: solid 1px #5E9200;
    border-bottom-width: 3px;
    padding: 10px;
    margin: 8px auto;
    font-weight: bold;
    text-align: center;
    box-sizing: border-box;
    /*position: fixed;
z-index: 500;
left: 50%;
margin-left: -25%;*/
    box-shadow: 0 15px 58px rgba(177, 176, 176, 0.39);
    color: white;
    text-shadow: 0 -1px rgba(0, 0, 0, 0.1);
    font-size: 1.3em;
}

.green-flat a, .green a {
    color: whitesmoke !important;
}

.red-flat, .bigerror {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    width: 50%;
    background-color: #E74C3C;
    border: solid 1px #BB3E31;
    border-bottom-width: 2px;
    padding: 10px;
    margin: 8px auto;
    font-weight: bold;
    text-align: center;
    color: white;
    text-shadow: 0 -1px rgba(80, 11, 11, 0.35);
    font-size: 1.3em;
    background-image: none;
    padding-left: 30px;
    padding-right: 30px;
    box-sizing: border-box;
    box-shadow: 0 15px 58px rgba(177, 176, 176, 0.39);
}

.red-flat a, .bigerror a {
    color: #920101 !important;
}

.warning-flat, .bignote {
    border-radius: 2px;
    width: 50%;
    border: solid 1px #C9A411;
    border-bottom-width: 2px;
    padding: 10px;
    margin: 8px auto;
    font-weight: bold;
    text-align: center;
    background: #F1C40F;
    color: white;
    text-shadow: 0 -1px rgba(92, 79, 13, 0.23);
    font-size: 1.3em;
    box-shadow: none; /*0 15px 58px rgba(177, 176, 176, 0.8);*/
}

.warning-flat a, .bignote a {
    color: whitesmoke !important; /*#836900 !important;*/
}

.info-flat {
    border-radius: 2px;
    width: 50%;
    border: solid 1px #266996;
    border-bottom-width: 2px;
    padding: 10px;
    margin: 8px auto;
    font-weight: bold;
    text-align: center;
    background: #3498DB;
    color: white;
    text-shadow: 0 -1px rgba(44, 96, 131, 0.25);
    font-size: 1.3em;
    box-shadow: 0 15px 58px rgba(177, 176, 176, 0.39);
}

.info-flat a {
    color: #115C8F !important
}

/*replace green button with this*/
.green-button-flat {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background: #1ABC9C;
    border: solid 1px #0D816A;
    border-bottom-width: 3px;
    padding: 0 5px !important;
    font-weight: bold;
    text-align: center;
    position: relative;
    text-shadow: 0 -1px 0 rgba(31, 66, 31, 0.56);
    font-size: medium;
    color: white;
    line-height: 38px;
}

.flatUIbox {
    background-color: white;
    border: solid 1px #D8D8D8;
    font-size: 0.8em;
    padding: 5px;
    margin: 0.5em 0;
    text-align: left;
    border-radius: 2px;
    border-bottom-width: 2px;
}

.container404 {
    overflow: hidden;
}

.leftCol404 {
    width: 35%;
    height: auto;
    float: left;
    padding: 1em;
}

.rightCol404 {
    width: 55%;
    height: auto;
    float: left;
    padding: 1em;
}

#overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    opacity: 0.5;
    filter: alpha(opacity=50);
    display: block;
    z-index: 1051;
}

.stats_progress_bar { }

.widget_progress_bar {
    position: relative;
    width: 300px;
    height: 16px;
    padding: 0;
    margin: 0;
    border: 1px solid #CCCCCC;
    overflow: hidden;
}

.widget_progress_bar_percent {
    float: right;
    font-weight: bold;
}

.widget_progress_colour {
    height: 16px;
    padding: 0;
    margin: 0;
    border: 0 none;
}

#donateTable img {
    vertical-align: middle;
}

#donateTable label {
    cursor: pointer;
}

.backColour { height: 24px; width: 24px; border: 1px solid #111111; display: inline-block; cursor: pointer; }

#blackColour { background-color: black; }

#whiteColour { background-color: white; }

#greyColour { background-color: grey; }

#subscribeModal {
    background-color: white;
    border-radius: 2px;
    border: 1px solid #333333;
    border-bottom-width: 3px;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    height: auto;
    padding: 0.5em;
    box-shadow: rgba(0, 0, 0, 0.5) 0 7px 40px;
    color: #222222;
    margin: 5px;
}

#subscribeModal .newsletterSub {
    border: none;
}

#subscribeModal .newsletterSub h3 { display: none; }

/*****************************************************************/

/* NEW ADMIN STYLES */

:root {

    --brandColour: #00B7F1;
    --contrastColour: #fff;

    /* Override ghost buttons css */
    --grey_button: #505050 !important;
    --blue_button: #00B7F1 !important;
    /*--green_button: #2ECC71;*/
    --green_button: #239a55 !important;
    --red_button: #E74C3C !important;
    --purple_button: #9B59B6 !important;
    --orange_button: #E67E22 !important;
    /*--yellow_button: #F1C40F;*/
    --yellow_button: #d6ae0e !important;

    /* Override variables in ghost buttons css */
    --inputBorderRadius: 4px !important;
    --btnBorderRadius: 4px !important;

    /* Contentual menu colours */
    --contentMenu: #4c4c4c;
    --contentMenuSelected: var(--brandColour);

    --sidebarWidthUnopen: 3em;
    --sidebarWidthOpen: 250px;


    --moduleSidebarWidth: 0px;
    --moduleSidebarWidthOpen: 0px;
    --moduleSidebarWidthClosed: 0px;
    --mainSidebarWidth: 3em;
    --mainWidth: 100%;

    /*--topbarHeight: 40px;*/
    /*--topbarHeight: 34px;*/
    --topbarHeight: 2.5rem;
    --tobBar_bg: #0d0d0d;
    --tobBar_text: #fff;

    --sectionLinksHeight: 4em;

    --sideBarTransitionDuration: 0.2s;

    --sidebarColour: #F5F5F5;
    --sectionLinksBG: #4c4c4c;

    --mainSidebarLogoBG: #151515;
    --mainSidebarText: #c7c7c7;
    --mainSidebarBG: #4c4c4c;
    --mainSidebarBG_1: #393939;
    --mainSidebarBG_2: #2f2f2f;
    --mainSidebarBG_3: #292929;

    --header1_bg: #333;
    --header1_text: #fff;
    --header2_bg: #4C4C4C;
    --header2_text: #efefef;

}

.moduleSidebarShown {
    --moduleSidebarWidthOpen: 320px;
    --moduleSidebarWidthClosed: 2em;
    --moduleSidebarWidth: var(--moduleSidebarWidthOpen);
}

body.lightTheme {

    --tobBar_bg: #d0d0d0;
    --tobBar_text: #444;

    --sidebarColour: #fff;
    --sectionLinksBG: #ebebeb;

    --mainSidebarLogoBG: #efefef;
    --mainSidebarText: #444;
    --mainSidebarBG: #fff;
    --mainSidebarBG_1: #ebebeb;
    --mainSidebarBG_2: #dbdbdb;
    --mainSidebarBG_3: #cbcbcb;

    --header1_bg: #d0d0d0;
    --header1_text: #222;
    --header2_bg: #ddd;
    --header2_text: #222;

    /*--grey_button: #4c4c4c !important;*/
}

body.whiteLabel {
    --tobBar_bg: var(--brandColour);
    --tobBar_text: var(--contrastColour);
}

.brand_button {
    background: var(--brandColour) !important;
    color: var(--contrastColour)  !important;
    border-color: var(--brandColour) !important;
}

.brand_button:hover {
    background: transparent !important;
    color: var(--brandColour) !important;
}

div.top_header, .iconBar {
    color: var(--tobBar_text);
    background: var(--tobBar_bg);
}

.top_header .iconWrap > a, .top_header .iconWrap > a:link, #pinMenu {
    color: var(--tobBar_text) !important;
}

.isMobile {
    --topbarHeight: 3rem;
}

.isMobile .mobileHide {
    display: none;
}

/*table > tr:first-child th,*/
table *:first-child tr:first-child th,
/*.table > .tr:first-child .th,*/
.table *:first-child .tr:first-child .th {
    background: var(--header1_bg);
    color: var(--header1_text);
}

/*table.oversizedTable > tr:first-child,*/
table.oversizedTable > * > tr:first-child,
/*.table.oversizedTable > .tr:first-child,*/
.table.oversizedTable > * > .tr:first-child {
    border-color: var(--header1_bg);
}

tr th,
.tr .th {
    background: var(--header2_bg);
    color: var(--header2_text);
}



select, textarea, input:not([type]):not([class*="mce-"]), input[type=""]:not([class*="mce-"]), input[type="text"], input[role="textbox"], input[type="password"], input[type="radio"], input[type="checkbox"], input[type="number"], input[type="tel"], input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="range"], input[type="search"], input[type="time"], input[type="url"], input[type="week"], input[type="file"] {
    border: solid 1px #C9D1DA;
    -moz-border-radius: var(--inputBorderRadius);
    -webkit-border-radius: var(--inputBorderRadius);
    border-radius: var(--inputBorderRadius);
    background-color: #FFFFFF;
    -moz-box-shadow: inset 1px 1px 1px #EEEFF0;
    -webkit-box-shadow: inset 1px 1px 1px #EEEFF0;
    box-shadow: inset 1px 1px 1px #EEEFF0;
    font: normal 0.9em Asap, Calibri, sans-serif;
    margin: 3px 0;
    padding: 7px 6px;
    max-width: 100%;
}

input[type="search"] {
    /* For some reason pure CSS changes this to content-box */
    box-sizing: border-box;
}

table, .table {
    border-spacing: 0;
    font-size: inherit;
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    text-align: left;
    text-decoration: none;
    color: #333333;
    width: 100%;
    background-color: transparent;
    border: none;
    border-bottom-width: 3px;
    border-radius: 8px;
    border-collapse: collapse;
    box-shadow: 0 0 7px rgba(179, 179, 179, 0.48);
    margin-bottom: 0.7em !important;
}

/*
 * Oversized tables
 * Allows side scrolling on mobile
 */
/*@media (max-width: 800px) {*/
/* Allow scrolling */
    table.oversizedTable,
    .table.oversizedTable {
        max-width: 100%;
        overflow-x: auto;
        display: block;
        /*position: relative;*/
    }
/*}*/

.oversizedTable__wrapper {
    position: relative;
}

/* Add scrolling note to top row */
/*table.oversizedTable > tr:first-child > *::after,*/
/*.table.oversizedTable > .tr:first-child > *::after,*/
/*table.oversizedTable > tbody:first-child > tr:first-child > *::after,*/
/*.table.oversizedTable > tbody:first-child > .tr:first-child > *::after,*/
/*table.oversizedTable > thead:first-child > tr:first-child > *::after,*/
/*.table.oversizedTable > thead:first-child > .tr:first-child > *::after {*/
.oversizedTable .oversizedTable__headerCell::after {
    content: 'Swipe sideways to view more columns';
    display: block;
    font-size: 0.8em;
}

/* Stretch top row */
/*table.oversizedTable > tr:first-child > *,*/
/*.table.oversizedTable > .tr:first-child > *,*/
/*table.oversizedTable > tbody:first-child > tr:first-child > *,*/
/*.table.oversizedTable > tbody:first-child > .tr:first-child > *,*/
/*table.oversizedTable > thead:first-child > tr:first-child > *,*/
/*.table.oversizedTable > thead:first-child > .tr:first-child > * {*/
.oversizedTable .oversizedTable__headerCell {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    
    /*position: sticky;*/
    /*display: inline-block;*/
}
/* Compensated for absolute with border to take space */

/* Fix for tables with thead and tbody */
/*table.oversizedTable > thead + tbody tr:first-child > *::after,*/
/*.table.oversizedTable > .thead + .tbody .tr:first-child > *::after {*/
/*    content: '';*/
/*    display: none;*/
/*}*/

/*table.oversizedTable > thead + tbody tr:first-child > *,*/
/*.table.oversizedTable > .thead + .tbody .tr:first-child > * {*/
/*    position: relative;*/
/*}*/

@media (max-width: 600px) {
    /* Use > to ensure we don't affect nested tables */
    .responsiveTable600 > tbody > tr, .responsiveTable600 > tbody > tr > * {
        display: block;
    }
    
}

.noShadow {
    box-shadow: none;
}

th,
.th {
    /*background-color: #3a4043;*/
    text-align: center;
    font-size: 1.3em;
    padding: 0.5em !important;
    font-weight: bold;
    color: white;
    border: none;
    text-transform: uppercase;
}

/*blue/orange header in webboss/blogboss_colour.css */

th h3, th h2, th h1,
.th h3, .th h2, .th h1 { text-transform: uppercase; }

table td,
.table .td {
    font-size: 1em;
    padding: 5px;
}

/* First/top row */

tr:first-child,
.tr:first-child {
    border-radius: 8px 8px 0 0;
}

tr:first-child th:first-child,
.tr:first-child .th:first-child {
    /*border-radius: 0!important;*/
    border-radius: 8px 0 0 0;
}

tr:first-child th:last-child,
.tr:first-child .th:last-child {
    /*border-radius: 0!important;*/
    border-radius: 0 8px 0 0;
}

tr:first-child th:only-child,
.tr:first-child .th:only-child {
    /*border-radius: 0!important;*/
    border-radius: 8px 8px 0 0;
}

/* Last/bottom row */

tr:last-child,
.tr:last-child {
    border-radius: 0 0 8px 8px;
}

tr:last-child td:first-child,
.tr:last-child .td:first-child {
    /*border-radius: 0!important;*/
    border-radius: 0 0 0 8px;
}

tr:last-child td:last-child,
.tr:last-child .td:last-child {
    /*border-radius: 0!important;*/
    border-radius: 0 0 8px 0;
}

tr:last-child td:only-child,
.tr:last-child .td:only-child {
    /*border-radius: 0!important;*/
    border-radius: 0 0 8px 8px;
}

table tbody:not(:last-child) tr:last-child td,
table tbody:not(:first-child) tr:first-child th {
    /* If last child but not last tbody or first child but not first tbody*/
    border-radius: 0 !important;
    /*border-bottom: 1px solid #f2f2f2;*/
}

/***/
table > tr:last-child,
.table .tr:last-child,
table tbody:last-child tr:last-child {
    border-bottom: none;
}

.stripedTable tr:nth-child(odd),
.stripedTable .tr:nth-child(odd) {
    background-color: #f6f6f6;
}

/*tr th, .tr .th, .grey-header {
    background: #E0E0E0;
    color: #828282;
}

tr th a, .tr .th a, .grey-header a {
    color: #555555 !important;
}*/

.grey-header.stickyElement {
    z-index: 63999;
    padding: 0 0.5em;
    margin: 0;
    box-sizing: border-box;
}

.notifications.flatUIbox {
    padding: 0;
    border: #E4E4E4 1px solid !important;
    min-height: 113px;
}

div.notifications table {
    box-shadow: none;
    width: 100%;
    margin: 0 !important;
    border: none !important;
}

div.notifications table tr:first-child th:only-child {
    border-radius: 0 !important;
}

input[type="checkbox"], input[type="radio"] {
    width: 16px;
    height: 16px;
    border: none;
    box-shadow: none;
}

input[type="radio"] {
    background: transparent;
}

.public_tab, .staff_tab, .templ_tab {
    display: inline-block;
    margin: 0.5em auto;
    margin-top: 5px !important;
    margin-left: 0 !important;
    float: none;
    padding: 5px;
    border-radius: 4px;
    border: 1px solid #E7E7E7;
    color: white;
    /*background: rgba(4,127,194,1);*/
}

.none1 {
    background: rgb(109, 179, 242); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(109, 179, 242, 1) 0%, rgba(84, 163, 238, 1) 50%, rgba(54, 144, 240, 1) 51%, rgba(4, 127, 194, 1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(109, 179, 242, 1)), color-stop(50%, rgba(84, 163, 238, 1)), color-stop(51%, rgba(54, 144, 240, 1)), color-stop(100%, rgba(4, 127, 194, 1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(109, 179, 242, 1) 0%, rgba(84, 163, 238, 1) 50%, rgba(54, 144, 240, 1) 51%, rgba(4, 127, 194, 1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(109, 179, 242, 1) 0%, rgba(84, 163, 238, 1) 50%, rgba(54, 144, 240, 1) 51%, rgba(4, 127, 194, 1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(109, 179, 242, 1) 0%, rgba(84, 163, 238, 1) 50%, rgba(54, 144, 240, 1) 51%, rgba(4, 127, 194, 1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(109, 179, 242, 1) 0%, rgba(84, 163, 238, 1) 50%, rgba(54, 144, 240, 1) 51%, rgba(4, 127, 194, 1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6db3f2', endColorstr='#047fc2', GradientType=0); /* IE6-9 */
}

/*
.public_tab:hover, .staff_tab:hover, .templ_tab:hover{
background: #499bea;
text-shadow: -1px 1px 0 #416799;
}
*/

.none2 {
    background: rgb(4, 127, 194); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(4, 127, 194, 1) 0%, rgba(54, 144, 240, 1) 49%, rgba(84, 163, 238, 1) 50%, rgba(109, 179, 242, 1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(4, 127, 194, 1)), color-stop(49%, rgba(54, 144, 240, 1)), color-stop(50%, rgba(84, 163, 238, 1)), color-stop(100%, rgba(109, 179, 242, 1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(4, 127, 194, 1) 0%, rgba(54, 144, 240, 1) 49%, rgba(84, 163, 238, 1) 50%, rgba(109, 179, 242, 1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(4, 127, 194, 1) 0%, rgba(54, 144, 240, 1) 49%, rgba(84, 163, 238, 1) 50%, rgba(109, 179, 242, 1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(4, 127, 194, 1) 0%, rgba(54, 144, 240, 1) 49%, rgba(84, 163, 238, 1) 50%, rgba(109, 179, 242, 1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(4, 127, 194, 1) 0%, rgba(54, 144, 240, 1) 49%, rgba(84, 163, 238, 1) 50%, rgba(109, 179, 242, 1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#047fc2', endColorstr='#6db3f2', GradientType=0); /* IE6-9 */
}

/*
div#modules, div#templ {
    margin-top: 3px;
    color: white;
}
*/

/*#modules a, #updateLink, #custom a {
    border-radius: 2px;
    margin: 0;
    padding: 0 5px;
    color: white;
    white-space: nowrap;
}

#modules a:hover {
    text-decoration: none;
}*/

.activeMod:before {
    content: "\f192"; /*Circle*/
    /*content: "\f205";*/ /*Toggle*/
    /*content: "\f011";*/ /*Power Button*/
    font-family: "FontAwesome";
    color: #15B358;
    font-size: 1.2em;
    margin-right: 0.3em;
}

.activeMod:hover { color: green !important; }

.inactiveMod:before {
    content: "\f10c"; /*Circle*/
    /*content: "\f204";*/ /*Toggle*/
    /*content: "\f011";*/ /*Power Button*/
    font-family: "FontAwesome";
    color: #DD0000;
    /*color: #5a6065;*/
    font-size: 1.2em;
    margin-right: 0.3em;
}

.inactiveMod:hover { color: #DD0000; }

.newUpdate:after {
    content: " \f0ed";
    font-family: "FontAwesome";
    color: #0C7C59;
    font-size: 1.2em;
}

.newUpdate:after:hover, .newUpdate:hover, a.newUpdate:hover { color: #FFFFFF !important; text-decoration: none; }

a.newUpdate {
    position: relative;
    top: 0;
    color: #FFFFFF !important;
}

a#updateLink:hover {
    color: #FFFFFF !important;
    text-decoration: underline;
}

div.top_header {
    width: 100%;
    border-radius: 0;
    box-sizing: border-box;
    clear: both;
    position: fixed;
    border: none;
    z-index: 65000;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/*inner header*/
.header {
    width: 100%;
    height: 70px;
    margin: 20px auto;
    text-align: left;
    padding: 0 1em;
    float: none;
    box-sizing: border-box;
}

div.nav {
    width: 100%;
    margin: auto;
    padding: 0 1em;
    box-sizing: border-box;
}

.pagelist, .pagelist2 {
    width: 100%;
    height: 100%;
    padding: 0 1em;
    margin: 0.5em auto;
    box-sizing: border-box;
    overflow: visible;
}

div.footer {
    margin: 0;
    padding-top: 1em;
    /*width: 85%;*/
    border: none;
    box-sizing: border-box;
    border-top: solid 1px #E0E0E0;
}

.mceLayout, .mceToolbar {
    box-shadow: none;
    border-radius: 2px;
}

fieldset#news legend {
    font-size: 1.3em;
}

.footer .breadcrumbs {
    text-align: left;
    padding-left: 0.7em;
    /* border-bottom: solid 1px #E0E0E0; */
    float: left;
}

.footerStatusBar {
    padding: 0.5em 1.8em;
    /*float: right;*/
    display: inline-block;
}

.footer .footerStatusBar{
    /*padding-right: 0.7em;*/
}

.isMobile .footer {
    display: flex;
    flex-direction: column;
}

.isMobile .footerRow {
    font-size: 0;
    float: none;
    text-align: center;
}

.isMobile .footerRow span {
    display: block;
    font-size: 0.9rem;
    margin: 3px auto;
}

.isMobile .footer  .breadcrumbs {
    order: -1;
    float: none;
    text-align: center;
    padding: 0;
    margin-bottom: 0.5em;
}

.footerAboutLink {
    display: block;
    text-align: center;
    padding: 0.5em;
    padding-top: 0;
    font-size: 0.9em;
}

div.tileBox {
    /*width: 73%;*/
    width: 100%;
    float: left;
    text-align: center;
}

div.homeSocial {
    float: right;
    width: 27%;
    display: none;
}

.admin_social, #twitterFeed {
    clear: both;
    margin: 0 auto;
    float: none;
    width: 100%;
    box-sizing: border-box;
}

#twitterFeed iframe {
    min-width: 100%;
    height: 700px !important;
}

#login_form input[type="text"], #login_form input[type="password"] {
    width: 100%;
    box-sizing: border-box;
    border: 2px solid #DADADA;
    text-align: left;
    font-size: 1.1em;
    font-weight: normal;
    padding-top: 10px;
}

#login_form input[type="text"], #login_form input[type="password"] {
    padding-left: 28px;
}

#login_form input[type="submit"] {
    padding: 6px;
    min-width: 100px;
    font-size: 1.3em !important;
}

div.green_button.plus_button.paddingIcon.public_tab {
    border: inherit;
    border-bottom-width: 2px;
    padding-top: 3px !important;
    padding-left: 6px;
    padding-bottom: 6px;
    border-radius: 2px !important;
    padding: 5px 0 !important;
    font-size: inherit;
}

.banTables div {
    float: left;
    margin-left: 0 !important;
    margin-right: 5px;
    margin-bottom: 5px;
    width: 33%;
}

.banTables div:last-child {
    margin-right: 0 !important;
}

.banWordsList { width: 100% !important; }

form.galForm, div.galImgWrap, div.galAlbumWrap, li.galImgWrap, li.galAlbumWrap {
    width: 320px;
    min-height: 517px;
    display: inline-block;
    padding: 0.5em;
    border: 1px solid #E0E0E0;
    box-sizing: border-box;
    margin: 0.5em;
    position: relative;
}

.galAlbumWrap--loading::before {
    content: url('/admin/images/ajax-svg-ring-loader.svg');
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(255, 255, 255, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

li.galImgWrap{
    margin: 0.2em;
    background: #fff;
}

li.galImgWrap .handle, li.galAlbumWrap .handle {
    width: 100%;
    background-color: #efefef;
    cursor: move;
    height: 15px;
    border-radius: 3px;
}

#sortThis td.handle{
    width: 10px;
    height: 100%;
    background-color: #efefef;
    cursor: move;
    border-radius: 3px;
}

#sortResponseAdmin {
    font-size: 1.3em;
    z-index: 999999999;
    max-width: 300px;
    min-width: 300px;
    text-align: center;
    position: fixed;
    top: 50%;
    left: 50%;
    margin: -70px 0 0 -100px;
}

.galleryOptFlyout {
    text-align: left;
    top: 55px !important;
    right: -83px !important;
    width: 200px !important;
}

.galAlbumWrap {
    min-height: 0 !important;
    transition: all .3s ease-in-out;
    background-color: #FFF;
}

.selectedBox {
    border: #0E76BC 4px solid !important;
}

.selectedBoxCorner {
    width: 0;
    height: 0;
    border-bottom: 55px solid #0E76BC;
    border-left: 55px solid transparent;
    bottom: 0;
    position: absolute;
    right: 0;
    display: none;
}

.selectedBoxCorner:before {
    content: "\f00c";
    font-family: FontAwesome;
    position: absolute;
    top: 23px;
    left: -32px;
    font-size: 2em;
    color: #FFFFFF;
}

.galImgHolder .fa-cog {
    color: #84939D;
    float: right;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
}

.galAlbumWrap .galImgHolder {
    border-bottom: none;
}

.galImgHolder .hotspot {
    border: none;
}

.galImgHolder img {
    max-height: 290px;
}

form.galForm textarea, .photo_title {
    max-width: 95%;
}

.galForm select {
    width: 125px;
}

.galImgHolder {
    text-align: center;
    vertical-align: bottom;
    width: 300px;
    border-bottom: 1px solid #E0E0E0;
    position: relative;
    /* Center image inside */
    display: flex;
    align-items: center;
    justify-content: center;
}

input.jdpicker2 {
    width: 100px;
}

sub {
    font-size: 0.8em;
}

/*
.plus_button, .plusButton {
    !*background: url('images/plus_icon.png') center left no-repeat #adea8b ;*!
    background: url('images/plus_small_white.png') center left no-repeat !important;
    background-color: #84939D !important;
    border: 1px solid #7B7B7B !important;
    text-shadow: #646464 1px 1px 1px !important;
    padding: 5px 5px 5px 30px !important;
    }
*/

.deleteButton {
    background-image: url('/admin/images/error_white.png') !important;
    background-position: center left !important;
    background-repeat: no-repeat !important;
    padding: 5px 5px 5px 30px !important;
}

/*

.blue_button, .blue_button:active {
    background: rgb(169, 228, 247); !* Old browsers *!
    background: -moz-linear-gradient(top, rgba(169, 228, 247, 1) 0%, rgba(15, 180, 231, 1) 100%); !* FF3.6+ *!
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(169, 228, 247, 1)), color-stop(100%, rgba(15, 180, 231, 1))); !* Chrome,Safari4+ *!
    background: -webkit-linear-gradient(top, rgba(169, 228, 247, 1) 0%, rgba(15, 180, 231, 1) 100%); !* Chrome10+,Safari5.1+ *!
    background: -o-linear-gradient(top, rgba(169, 228, 247, 1) 0%, rgba(15, 180, 231, 1) 100%); !* Opera 11.10+ *!
    background: -ms-linear-gradient(top, rgba(169, 228, 247, 1) 0%, rgba(15, 180, 231, 1) 100%); !* IE10+ *!
    background: linear-gradient(to bottom, rgba(169, 228, 247, 1) 0%, rgba(15, 180, 231, 1) 100%); !* W3C *!
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a9e4f7', endColorstr='#0fb4e7', GradientType=0); !* IE6-9 *!
    }

.red_button, .red_button:active, .bigerror {
    background: rgb(255, 48, 25);
    background: -moz-linear-gradient(top, rgba(255, 48, 25, 1) 0%, rgba(207, 4, 4, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 48, 25, 1)), color-stop(100%, rgba(207, 4, 4, 1)));
    background: -webkit-linear-gradient(top, rgba(255, 48, 25, 1) 0%, rgba(207, 4, 4, 1) 100%);
    background: -o-linear-gradient(top, rgba(255, 48, 25, 1) 0%, rgba(207, 4, 4, 1) 100%);
    background: -ms-linear-gradient(top, rgba(255, 48, 25, 1) 0%, rgba(207, 4, 4, 1) 100%);
    background: linear-gradient(to bottom, rgba(255, 48, 25, 1) 0%, rgba(207, 4, 4, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3019', endColorstr='#cf0404', GradientType=0);
    }

.green_button, .green_button:active, .green {
    border: 1px solid #2ECC71;
    text-shadow: 1px 1px 0 #689324;
    background: rgb(139, 223, 66); !* Old browsers *!
    background: -moz-linear-gradient(top, rgba(139, 223, 66, 1) 0%, rgba(135, 221, 60, 1) 100%); !* FF3.6+ *!
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(139, 223, 66, 1)), color-stop(100%, rgba(135, 221, 60, 1))); !* Chrome,Safari4+ *!
    background: -webkit-linear-gradient(top, rgba(139, 223, 66, 1) 0%, rgba(135, 221, 60, 1) 100%); !* Chrome10+,Safari5.1+ *!
    background: -o-linear-gradient(top, rgba(139, 223, 66, 1) 0%, rgba(135, 221, 60, 1) 100%); !* Opera 11.10+ *!
    background: -ms-linear-gradient(top, rgba(139, 223, 66, 1) 0%, rgba(135, 221, 60, 1) 100%); !* IE10+ *!
    background: linear-gradient(to bottom, rgba(139, 223, 66, 1) 0%, rgba(135, 221, 60, 1) 100%); !* W3C *!
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8BDF42', endColorstr='#91e842', GradientType=0); !* IE6-9 *!
    }
*/

.large_button {
    padding: 0.5em;
    font-size: 1.5em;
}

.text-center, .textCenter {
    text-align: center;
}

.text-right, .textRight {
    text-align: right;
}

.text-left, .textLeft {
    text-align: left;
}

.center, .marginAuto {
    margin: 0 auto;
    max-width: 60%;
}

input, textarea, select {
    transition: all 0.2s linear;
}

.aclAccountList__privsListBtn, .aclAccountList__roleAccountListBtn {
    cursor: pointer;
}

.aclAccountList__privsList, .aclAccountList__roleAccountList {
    text-align: left;
}

.aclAccountList__privsListSection {
    padding: 0.5em;
}

.aclAccountList__privsListSectionHeader {
    font-size: 1.2em;
}

.aclAccountList__privsListSection ul {
    display: flex;
    flex-wrap: wrap;
    margin-top: 0;
    padding-left: 0;
}

.aclAccountList__privsListSection li {
    margin-left: 2em;
}



.aclSection__header {
    display: flex;
    align-items: center;
}

input.toggleSectionACL {
    margin: 0;
}

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

.aclCheckLabel {
    /*border-right: 1px solid #C9C9C9;*/
    padding: 0;
    /*margin: -2px 0;*/
    white-space: nowrap;
    display: inline-block;
    /*width: 165px;*/
    /*width: 24.6%;*/
    width: 20%;
    min-width: 200px;
    text-overflow: ellipsis;
    overflow: hidden;
}

input.aclCheck {
    margin: 0;
}

.click2close {
    position: fixed;
    z-index: 2000;
    cursor: pointer;
    left: 35%;
    top: 25%;
    width: 30%;
}

.IdleModel {
    z-index: 2000 !important;
    width: 400px !important;
    margin-left: -200px !important;
}

/* New error messages */
.bigerror, .error, .green, .success, .warning, .info, .updater, .updater-beta, .info-gold, .special {
    border-radius: 2px;
    max-width: 75%;
    min-width: 70%;
    padding: 1em 3.8em;
    margin: 8px auto;
    text-align: left;
    color: white;
    box-sizing: border-box;
    font-size: 1em;
    font-weight: normal;
}

.stickyFooter .special {
    padding: 10px 5px 10px 45px;
    display: inline-block;
    width: auto;
    min-width: 0;
    margin: 0;
}

#login_wrapper .bigerror, #login_wrapper .error, #login_wrapper .green, #login_wrapper .success, #login_wrapper .warning, #login_wrapper .info, #login_wrapper .updater, #login_wrapper .updater-beta, #login_wrapper .info-gold {
    min-width: 21% !important;
}

.info-gold {
    border: solid 1px #EEE8AA;
    background: url('/admin/images/info-circle-white.png') 1.1em no-repeat #FAFAD2;
    text-shadow: 0 -1px 0 #CCC68F;
}

.bigerror, .error {
    border: solid 1px #B20E12;
    background: url('/admin/images/error-circle-white.png') 1.1em no-repeat #C60F13;
    text-shadow: 0 -1px 0 #8B1616;
}

.green, .success {
    border: solid 1px #549420;
    background: url('/admin/images/tick-circle-white.png') 1.1em no-repeat #5DA423;
    text-shadow: 0 -1px 0 #2A4A0F;
}

.special {
    border: solid 1px #de7700;
    background: url(/admin/images/star-icon-white.png) 1.1em no-repeat #FF9800;
    text-shadow: 0 -1px 0 #de7700;
}

.special a.yellow_button.btn:hover {
    color: white !important;
    border-color: white !important;
}

.warning {
    border: solid 1px #CC9F01;
    background: url('/admin/images/warning-triangle-white.png') 1.1em no-repeat #E3B000;
    text-shadow: 0 -1px 0 #A98E2C;
}

.info {
    /*border: solid 2px #2796B7;
    background: url('/admin/images/info-circle-white.png') 1.1em no-repeat #2BA6CB;
    text-shadow: 0 -1px 0 #166A83;*/
    border: solid 1px #00a2d6;
    background: url('/admin/images/info-circle-white.png') 1.1em no-repeat #00b7f1;
    text-shadow: 0 -1px 0 #00a2d6;
    color: #FFFFFF;
}

.updater {
    border: solid 2px #0C6445;
    background: url('/admin/images/fa-cloud-upload.png') 1.1em no-repeat #0C7C59;
    text-shadow: 0 -1px 0 #063124;
}

.updater-beta {
    border: solid 2px #B0431D;
    background: url('/admin/images/fa-wrench.png') 1.1em no-repeat #E95224;
    text-shadow: 0 -1px 0 #B03E1B;
}

.info a, .warning a, .success a, .error a, .updater a, .updater-beta a, .special a {
    color: #FFFFFF !important;
    font-weight: bold;
    text-decoration: underline !important;
}

div#updGreenBox {
    text-align: center;
}

/* Use smallBtn for inline type buttons */
.smallBtn {
    font-size: 0.8em !important;
    padding: 5px !important;
}

/********NEW SLIDER STYLES**********/

.removeImg {
    float: right;
    font-weight: bold;
    font-family: cursive;
    cursor: pointer;
    padding: 0 5px;
    line-height: 1.3;
    color: grey;
}

.removeImg:hover { color: red; }

div#slideshowHolder button ~ #buttonSpin {
    display: none !important;
}

.slideshowHolder {
    /* Prevent massive oversized banners overlapping controls */
    max-height: 100vh;
    overflow: hidden;
}

.imgPreview { max-width: 250px; }

#BannerImgDropDowns {
    max-width: 250px;
    display: inline-block;
}

#sortable { list-style-type: none; margin: 0; padding: 0; }

#bannerImgDrag #sortable li.imageBox {
    display: inline-block;
    margin: 5px;
    padding: 5px;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #CCCCCC;
    border-bottom-width: 3px;
    border-radius: 2px;
    box-sizing: content-box;
    width: 300px;
}

#sortable li.imageBox:hover { cursor: move; }

#sortable li.imageBox:active {
    box-shadow: 3px 4px 8px rgba(129, 129, 129, 0.5);
    margin-top: 4px;
    margin-left: 5px;
}

div#topbar {
    background-color: #F0F0F0;
    margin-bottom: 3px;
    font-size: 0.8em;
    cursor: move;
    border-radius: 2px;
}

#ft-buttons-slideshowHolder { margin-top: 0; }

.slick-prev:before, .slick-next:before { color: black !important; }

.slide-opacity .slide { opacity: 0.8; }

.slick-slide img { transition: all 300ms ease; }

.slick-center img {
    -moz-transform: scale(1.08);
    -ms-transform: scale(1.08);
    -o-transform: scale(1.08);
    -webkit-transform: scale(1.08);
    transform: scale(1.08);
    box-shadow: 0 3px 10px rgba(132, 132, 132, 0.5);
}

.slick-center { opacity: 1 !important; }

.slick-slide { margin: 10px; }

.slick-slider { margin-bottom: 30px !important; }

.slide-shadow { box-shadow: 0 3px 10px rgba(132, 132, 132, 0.5); }

/*
.slideCaption {
position:relative;
box-sizing: border-box;
padding: 1em;
position: absolute;
bottom: 0;
width: 100%;
box-sizing: border-box;
}*/
.slideCaption {
    position: relative;
    box-sizing: border-box;
    padding: 1em;
    bottom: 50px;
    width: 100%;
}

/*************/

input[type="range"] {
    -webkit-appearance: none !important;
    background-color: #CCCCCC;
    height: 5px;
    vertical-align: 1px;
    box-shadow: none;
    border: none;
    padding: 0;
    width: 225px;
}

form#compressionform #compressionVal {
    width: 40px;
}

form#compressionform #compression {
    width: 150px;
    padding: 0;
}

form#imageform, form#compressionform {
    display: inline-block;
}

#renderBox {
    position: fixed;
    top: 5%;
    width: 30%;
    box-shadow: 3px 3px 8px rgba(87, 87, 87, 0.5);
}

#compression {
    width: 100%;
    box-sizing: border-box;
    padding: 5px 0;
}

#compressionVal {
    width: 70%;
    border: none;
    background: transparent;
    padding: 0.5em;
    box-shadow: none;
    font-weight: bold;
    text-align: right;
}

.upgradeBoxSuccess {
    position: fixed;
    width: 300px;
    top: 30%;
    left: 50%;
    margin-left: -150px;
    border-radius: 2px;
    border: 10px solid rgba(26, 26, 26, 0.5);
    z-index: 999;
    box-shadow: rgba(0, 183, 241, 0.5) 0 0 80px;
}

div.swatch {
    width: 57px;
    height: 42px;
    border: #84939D 1px solid;
    border-radius: 2px;
    padding: 3px;
    display: inline-block;
    margin: 0 3px;
    box-sizing: border-box;
}

.smallswatch {
    width: 38px !important;
    height: 38px !important;
}

.largeswatch {
    width: 100px !important;
    height: 100px !important;
}

.gradient100 {
    width: 100% !important;
    height: 100% !important;
}

div#gradRadios {
    width: 32px;
    float: left;
}

.radioswatch {
    width: 130px !important;
    height: 100px !important;
    padding: 4px !important;
}

.radioswatch .gradient {
    width: 86px !important;
    margin: 0 !important;
}

.radioswatch label {
    float: left;
    margin-right: 3px;
    font-weight: bold;
}

div.gradient {
    border: 1px solid #333333;
    width: 30px;
    height: 30px;
    box-sizing: border-box;
    border-radius: 2px;
    float: left;
    margin-right: 2px;
    cursor: crosshair;
}

div.delGrad {
    padding-top: 0;
}

.showCode { cursor: help; }

div.swatch:hover {
    box-shadow: 1px 1px 8px rgba(119, 119, 119, 0.6);
}

/* BLOG LAYOUT EDITOR */


.blogLayout__wrapper {
    display: flex;
    align-items: flex-start;
}

.blogLayout__blogMain {
    width: 75%;
}

.blogLayout__blogWrap {
    width: 75%;
    float: left;
    margin: 0 !important;
    border: none !important;
}

.blogLayout__layout {
    background: #efefef;
    border: 3px solid #84939D;
    margin: 0.3em;
    padding: 0.5em;
    box-sizing: border-box;
    display: block;
    /*cursor: pointer;*/
    position: relative;
}

.blogLayout__layout::before {
    font-family: 'Font Awesome 6 Free', 'sans-serif';
    content: '\f070'; /* Eye-slash */
    position: absolute;
    top: 0.5em;
    right: 0.5em;
}

.blogLayout__checkbox {
    display: none;
}

.blogLayout__header {
    display: block;
    font-size: 1.5em;
    color: #000;
}

.blogLayout__layout {
    cursor: not-allowed;
}

.blogLayout__checkbox + .blogLayout__layout {
    cursor: pointer;
}

.layoutActive, .blogLayout__checkbox:checked + .blogLayout__layout {
    /*border-color: #578455;*/
    border-color: #00b7f1;
}

.layoutActive::before, .blogLayout__checkbox:checked + .blogLayout__layout::before {
    content: '\f06e'; /* Eye */
}

/*.blogLayout__checkbox:not(:checked) + .blogLayout__layout .blogLayout__placeholder {*/
/*    font-size: 0;*/
/*}*/

/*.blogLayout__placeholder {*/
/*    font-size: 15px;*/
/*}*/

.blogLayout__checkbox:not(:checked) + .blogLayout__layout .blogLayout__placeholder,
.blogLayout__checkbox:not(:checked) + .blogLayout__layout .blogLayout__placeholderWrapper {
    /*font-size: 0;*/
    /*margin: 0;*/
    display: none;
}

/*.layoutActive .blogLayout__placeholder, .blogLayout__checkbox:checked + .blogLayout__layout .blogLayout__placeholder {*/
/*    font-size: 15px;*/
/*}*/

/*.blogLayout__checkbox:not(:checked) + .blogLayout__layout .blogLayout__placeholder {*/
/*    font-size: 0;*/
/*}*/


/*.blogLayout__checkbox:checked + .blogLayout__layout .blogLayout__placeholder {*/
    /*display: initial;*/
/*}*/

/*.blogLayout {*/
/*    !*max-width: 1000px;*!*/
/*    margin: auto;*/
/*    min-height: 900px;*/
/*    height: auto;*/
/*    overflow: hidden;*/
/*}*/


.blogLayout__layout--sidebar {
    width: 25%;
}

@media (max-width: 800px) {
    .blogLayout__wrapper {
         flex-wrap: wrap;
    }
    .blogLayout__layout--sidebar, .blogLayout__blogMain {
        width: 100%;
    }
}


.blogLayout__placeholder {
    background: #ccc;
    margin: 0.5em 0;
}

span.blogLayout__placeholder {
    display: inline-block;
    margin: 2px;
}

#grad0 {
    background-color: #CCCCCC;
}

.galImgDetails textarea {
    height: 56px;
    width: 95%;
    resize: none;
}

.galImgDetails select {
    width: 157px;
}

.galImgDetails h3, .galImgDetails span {
    text-align: center;
    display: block;
}

.addExif {
    position: absolute;
    right: 0;
    bottom: 0;
    margin: 8px 5px;
    display: none;
}

.galImgHolder:hover > .addExif {
    display: block;
}

.galImgHolder #buttonSpin { display: none; }

.pure-g.gutters {
    margin: 0 -0.5em;
}

.pure-g.gutters > [class *=pure-u] {
    box-sizing: border-box;
}

.pure-g.gutters--stacked > [class *=pure-u] {
    /* Where boxes may stack, add padding top and bottom too */
    padding: 0.5em !important;
}

#tinymce div[class *=pure-u], #tinymce div.pure-g {
    border: 1px solid grey;
}

body#tinymce {
    overflow: visible !important;
}

/*
For custom buttons using images
Default ones use icon fonts and change colour to white
Custom ones use images so use filter to make them white
 */
.mce-btn.mce-active i.mce-i-none,
.mce-btn.mce-active:hover i.mce-i-none {
    filter: brightness(10);
}

/*
.mce-text {
color: initial !important;
background-color: initial !important;
}
*/
@media only screen and (max-width: 89.875em) {
    /* CSS rules here */
    .cpTile { width: 126px; font-size: 0.9em; }
}

@media only screen and (max-width: 77.75em) {
    /* CSS rules here */
    .cpTile { font-size: 0.9em; }
}

@media only screen and (max-width: 71.1875em) {
    /* CSS rules here */
    .cpTile { width: 170px; font-size: 0.8em; }
}

@media (max-width: 1366px) {
    table {
        font-size: 0.9em;
    }
}

.mce-window, .mce-floatpanel.mce-fixed {
    /*position: absolute !important;*/
}

div#captureScreenshot {
    padding: 4px;
    cursor: pointer;
    position: fixed;
    z-index: 2000;
    bottom: 0;
    left: 5px;
    background: #ECECEC;
    border-radius: 2px 2px 0 0;
}

a#captureScreenshot {
    cursor: help;
}

.blogQ {
    width: 35% !important;
}

table#faq td h2 {
    color: #000;
}

table#faq td h2.ui-state-active {
    color: #fff;
}

#faq li {
    margin: 0 5px;
    padding: 0.5em;
    font-size: 1.1em;
}

.slickPreview {
    width: 100%;
    height: 32px;
}

.slicknav_btn {
    position: relative;
    display: block;
    vertical-align: middle;
    float: right;
    padding: .438em .625em;
    line-height: 1.125em;
}

.slicknav_menu .slicknav_menutxt {
    display: block;
    line-height: 1.188em;
    float: left;
    color: #FFFFFF;
    font-weight: 700;
    text-shadow: 0 1px 3px #000000;
}

.slicknav_menu .slicknav_icon {
    float: left;
    margin: .188em 0 0 .438em;
}

.slicknav_menu .slicknav_icon-bar {
    background-color: #FFFFFF;
}

.slicknav_menu .slicknav_icon-bar {
    display: block;
    width: 1.125em;
    height: .125em;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .25);
    -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .25);
    box-shadow: 0 1px 0 rgba(0, 0, 0, .25);
}

.slicknav_btn .slicknav_icon-bar + .slicknav_icon-bar {
    margin-top: .188em;
}

.skinBox {
    width: auto;
    display: inline-block;
    box-sizing: border-box;
    margin: 0.5em;
    padding: 0.5em;
    word-break: break-all;
    overflow: hidden;
    position: relative;
}

.skinBox.white_button .deleteX {
    position: relative !important;
}

#h0ney, #h0neyLabel { display: none; }

td#marketMenu { padding: 0; width: 222px; }

td#marketMenu h2 {
    text-align: center;
    background-color: #84939D;
    display: block;
    padding: 1em;
    margin: 0;
    color: #FFFFFF;
    font-size: 1.7em;
}

.marketSelect {
    width: 100%;
    border: none;
    box-shadow: none;
    padding: 1em;
    font-size: 1.1em;
    margin: 0;
}

.marketBoxSingle {
    width: 100%;
    padding: 0.5em;
    display: inline-block;
    position: relative;
}

.marketBox {
    width: 200px;
    padding: 0.5em;
    margin: 2px;
    margin-bottom: 1em !important;
    display: inline-block;
    position: relative;
}

.marketBox:hover, div.staffPick {
    box-shadow: 0 5px 0 0 #00B7F1;
    border: #00B7F1 1px solid;
}

.marketBox h3 {
    height: 43px;
    overflow: hidden;
    -ms-text-overflow: ellipsis; text-overflow: ellipsis;
}

div.staffPick:hover {
    box-shadow: 0 5px 0 0 #84939D;
    border: #84939D 1px solid;
}

.marketInfo {
    float: left;
    text-align: left;
    width: 25%;
    font-size: 1.1em;
}

.marketImgView {
    float: left;
    width: 75%;
    text-align: left;
    padding-left: 0.5em;
    box-sizing: border-box;
}

.marketImgView img {
    max-width: 300px;
    height: auto;
}

.marketNotes {
    font-weight: normal;
    font-size: 0.9em;
    max-height: 200px;
    overflow-y: auto;
}

.marketStaffPickIcon {
    text-align: left;
    height: 50px;
    color: #00B7F1;
    font-size: 1.5em;
}

.marketStaffPickIcon img {
    vertical-align: middle;
}

.featured_ribbon {
    position: absolute;
    height: 64px;
    width: 0;
    padding: 0;
    background-color: rgba(0, 0, 0, 0);
    border-radius: 0;
    right: 8px;
    top: 0;
    -webkit-transform: rotate(0deg) skew(0deg);
    transform: rotate(0deg) skew(0deg);
    border-top: 13px #00B7F1;
    border-left: 15px solid #00B7F1;
    border-right: 15px solid #00B7F1;
    border-bottom: 15px solid rgba(0, 0, 0, 0);
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

/* MARKETPLACE VOTING COUNT BUBBLE */
.vote_box {
    position: relative;
    background: #FFFFFF;
    border: 1px solid #CCCCCC;
    width: 100px;
    max-width: 200px;
    font-size: 0.8em;
    border-radius: 3px;
    padding-left: 3px;
    display: inline-block;
    vertical-align: top;
    margin-left: 3px;
    font-weight: normal;
}

.vote_box:after, .vote_box:before {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.vote_box:after {
    border-color: rgba(255, 255, 255, 0);
    border-right-color: #FFFFFF;
    border-width: 4px;
    margin-top: -4px;
}

.vote_box:before {
    border-color: rgba(204, 204, 204, 0);
    border-right-color: #CCCCCC;
    border-width: 6px;
    margin-top: -6px;
}

.marketInfo .bigerror, .marketInfo .error, .marketInfo .green, .marketInfo .success, .marketInfo .warning,
.marketInfo .info {
    width: 100%;
}

a#marketplace {
    background-color: #00B7F1;
    /*color: #FFFFFF !important;*/
    /*padding: 2px;*/
    /*border-radius: 3px;*/
}

a#marketplace:hover { color: #FFFFFF !important; }

a#myThemes {
    background-color: #5DA423;
    /*color: #FFFFFF !important;*/
    /*padding: 2px;*/
    /*border-radius: 3px;*/
}

a#myThemes:hover { color: #FFFFFF !important; }

.marketBox .upgradePopupButton {
    font-size: 19px !important;
}

.marketBoxSingle .upgradePopupButton {
    font-size: 19px !important;
}

@media all and (max-width: 720px) {
    .bigerror, .error, .green, .success, .warning, .info {
        width: 96% !important;
        box-sizing: border-box;
        font-size: 0.9em;
    }
}

@-webkit-keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
        transform: scale(.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        transform-origin: right center;
    }
}

@keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
        transform: scale(.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        transform-origin: right center;
    }
}

.zoomOutRight {
    -webkit-animation-name: zoomOutRight;
    animation-name: zoomOutRight;
}

@-webkit-keyframes shake {
    from, to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }

    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }
}

@keyframes shake {
    from, to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }

    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }
}

.shake {
    -webkit-animation-name: shake;
    animation-name: shake;
}

@-webkit-keyframes rubberBand {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }

    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        transform: scale3d(1.25, 0.75, 1);
    }

    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1);
    }

    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        transform: scale3d(1.15, 0.85, 1);
    }

    65% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1);
    }

    75% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1);
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes rubberBand {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }

    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        transform: scale3d(1.25, 0.75, 1);
    }

    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1);
    }

    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        transform: scale3d(1.15, 0.85, 1);
    }

    65% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1);
    }

    75% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1);
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.rubberBand {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand;
}

#cageFaceStage {
    position: relative;
    width: 100%;
    height: 100%;
}

.ballCageFace {
    border-radius: 35px;
    width: 6px;
    height: 6px;
    background: red;
    position: absolute;
    background: url('/images/transparent_nic_cage.gif') no-repeat center #FFFFFF;
    background-size: contain;
}

#log, #collide-log {
    background: black;
    position: absolute;
    top: 0;
    left: 0;
    color: lime;
}

td#blogOpts img {
    vertical-align: inherit;
}

#BimgPreview { padding: 0; background-repeat: no-repeat; background-size: cover; background-position: center center; position: relative; margin: 0 auto; width: 100%; max-height: 400px; }

#previewImg img { width: auto; height: auto; visibility: hidden; }

#previewImg {
    position: relative;
    overflow: hidden;
    max-height: 400px;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0);
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.7) 0, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0.7) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7) 0, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0.7) 100%);
}

#previewImg h1 {
    position: absolute;
    bottom: 0;
    color: #FFFFFF;
    left: 0.5em;
    text-shadow: 1px 1px 2px #333333;
    font-size: 4em;
}

div#ui-datepicker-div {
    width: auto !important;
}

.StNicCage {
    width: auto;
    position: fixed;
    bottom: -10px;
    left: -210px;
    transform-origin: bottom left;
}

.StNicCageMove {
    display: block !important;
    -webkit-animation: santa-move 1s 1s ease-out forwards;
    animation: santa-move 1s 1s ease-out forwards;
    -webkit-animation-duration: 26s;
    animation-duration: 26s;
}

@-webkit-keyframes santa-move {
    100% {
        left: 100%;
        transform: scale(2);
    }
}

@keyframes santa-move {
    100% {
        left: 100%;
        transform: scale(2);
    }
}

.notiBox {
    display: none;
    position: fixed;
    left: 1%;
    border: 1px solid #84939D;
    min-height: 40px;
    bottom: 4%;
    margin: 1em;
    background: #EFEFEF;
    padding: 1.1%;
    border-radius: 2px;
    border-bottom: 3px solid #84939D;
    box-shadow: 0 5px 11px rgba(153, 153, 153, 0.55);
}

#bPerma {
    background-color: #E95224;
    padding: 0.6em;
    border-radius: 3em;
    color: #FFFFFF;
}


ul li ul.contextualMenuList {
    display: none;
}

ul ul.contextualMenuList, ul ul ul.contextualMenuList {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

ul.contextualMenuFlyout {
    position: absolute;
    left: 194px;
    z-index: 999999;
    width: 150px;
    top: 0;
    display: none;
}

ul.contextualMenuFlyout:hover {
    display: block;
}

li.li-header { font-weight: bold; }


/*ul#adminNav li a {
    color: #50595F !important;
}*/

ul#adminNav li a#subscriptionPurchase, ul#adminNav li a#upgradePopup, ul#adminNav li a#trialPopup, ul#adminNav li a#reviewNav {
    color: #00B7F1 !important;
    font-weight: bold;
}

ul#adminNav li a#subscriptionPurchase:hover, ul#adminNav li a#upgradePopup:hover, ul#adminNav li a#trialPopup:hover, ul#adminNav li a#reviewNav:hover {
    color: #ffffff !important;
    font-weight: bold;
}

.pagelist-new {
    width: 100%;
    height: 100%;
    padding: 0.3em 1.8em;
    margin: 0;
    box-sizing: border-box;
    overflow: visible;
    float: left;
    padding-bottom: 2em;
    
    /* Remove scrollbar when not needed */
    /* Added by Oli - 23/05/2018 */
    /*min-height: 100vh;*/
    flex-grow: 1;

    background: #eee; /* Added by Oli 05/06/2018 */
    z-index: 1;
}

@media (max-width: 800px) {
    .pagelist-new {
        padding: 0.5em;
    }
}

.isMobile .pagelist-new {
    padding: 0.5em;
}

.isMobile .contextualMenu {
    display: none;
}

body.theme-editor .pagelist-new {
    padding: 0.5em;
}

a.hvr-icon-forward:hover + ul.contextualMenuFlyout {
    display: block;
}

@-webkit-keyframes rotating {
    from {
        -webkit-transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
    }
}

.rotating {
    animation-name: rotating;
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.wrapper {
    /*width: 85%;*/
    width: 87%;
    border: none;
    background: transparent;
    float: right;
    min-height: 100vh;
    min-width: initial;
    /*margin-top: 40px;*/
    /*margin-top: 34px;*/
    
    /* Remove scrollbar when not needed */
    /* Added by Oli - 23/05/2018 */
    margin-top: 0;
    margin-bottom: 0;
    padding-top: var(--topbarHeight);
    
    display: flex !important;
    flex-direction: column;
    justify-content: space-between;
    
    width: 100%;
    max-width: calc(100% - 3em);
}

.popupWrapper {
    padding: 1em;
}

#headerTitle {
    /*float: left; Uses flex now*/
    width: 49%;
    flex: 1;
    height: auto;
    text-align: left;
    margin-top: 0;
    margin-left: 0.5em;
    box-sizing: border-box;
    vertical-align: top;
    display: inline-block;
    /*padding-top: 0.3em;*/
}

#headerTitle h1 {
    margin: 0;
    /*font-size: 1.5em;
    font-size: 1.5vw;*/
    font-size: 1.3em;
    font-size: 1.2vw;
    font-size: clamp(12px, 1.2vw, 2em);
    padding-top: 0;
    display: inline-block;
    line-height: 1;
    /* truncate */
    /*max-width: calc(100% - 30em);*/
    white-space: nowrap;
}

@media (max-width: 600px) {
    #headerTitle {
        display: none;
    }
}

span.headerTitleSpan {
    display: inline-block;
    vertical-align: top;
}

.webName {
    max-width: 50vw;
}

#pgtitle {
    display: inline-block;
    max-width: 40vw;
    line-height: 1;
    /*vertical-align: bottom;*/
}

.iconBar {
    /*float: right; Uses flex now */
    /*font-size: 1.7em;*/
    font-size: 1.5em;
    /*padding: 0.1em 0.5em;*/
    margin-right: 0;
    /*position: relative;*/

    /* Fixing overlap */
    /*position: fixed;*/
    /*right: 0;*/
    /*top: 0;*/
    
    position: relative;
    align-self: stretch;
    display: flex;
    align-items: center;
}

.iconBar i {
    margin: 0 0.2em;
    cursor: pointer;
}

.iconBar i:hover {
    /*color: #84939D;*/
    color: var(--tobBar_text);
}

div#unreadMsg, div#unreadNoti {
    position: absolute;
    background: #FF0000;
    border-radius: 2em;
    font-size: 11px;
    min-width: 15px;
    height: 16px;
    text-align: center;
    left: 0;
    padding: 1px;
    box-sizing: border-box;
}

#notiList li i.fa.fa-eye-slash {
    float: right;
    cursor: pointer;
}

i#allSeen {
    float: right;
}

#notiList li i.fa.fa-eye-slash:hover, i#allSeen:hover {
    color: #FF0000;
}

.currentuser div#userDetails { text-align: left; margin-bottom: 0.5em; }

.currentuser, .notiFlyout {
    color: #84939D;
    border-radius: 3px;
    width: 185px;
    position: absolute;
    background: #FFFFFF;
    border: 4px solid #84939D;
    top: 53px;
    right: -75px;
    z-index: 9999;
    box-shadow: 0 2px 7px rgba(154, 154, 154, 0.7);
    text-align: center;
    box-sizing: border-box;
    padding: 0.5em;
    font-size: small;
    min-width: 160px;
    word-break: break-all;
    display: none;
}

table#notiFlyoutTable ul#notiList {
    max-height: 600px;
}

#notiFlyoutTable {
    color: #84939D;
    background: #FFFFFF;
    /*border: 4px solid #84939D;*/
    box-sizing: border-box;
    padding: 0.5em;
    word-break: break-all;
}

#notiFlyoutTable ul, #notiFlyoutTable ul li {
    list-style: none;
    padding: 0;
    text-align: left;
}

#notiFlyoutTable li i.fa.fa-eye-slash {
    float: right;
    cursor: pointer;
}

#notiFlyoutTable ul li a {
    color: #84939D !important;
    text-decoration: none;
    background-color: #F3F3F3;
    width: 100%;
    font-size: 1.1em;
    padding: 0.5em;
    box-sizing: border-box;
    display: block;
}

#notiFlyoutTable ul li a:hover {
    background: #CCCCCC;
    color: #FFFFFF !important;
}

#notiFlyoutTable li i.fa.fa-eye-slash {
    display: none;
}

ul#notiList {
    max-height: 277px;
    overflow-y: auto;
}

.currentuser:after, .currentuser:before, .notiFlyout:after, .notiFlyout:before {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.currentuser:after, .notiFlyout:after {
    border-color: rgba(235, 235, 235, 0);
    border-bottom-color: #FFFFFF;
    border-width: 15px;
    margin-left: -15px;
}

.currentuser:before, .notiFlyout:before {
    border-color: rgba(132, 147, 157, 0);
    border-bottom-color: #84939D;
    border-width: 21px;
    margin-left: -21px;
}

.clear { clear: both; }

.top_header { /*height: 40px;*/ min-height: var(--topbarHeight); padding: 0; }

#homeLink:after { content: ""; padding: 0; }

div#logo_img {
    height: 65px;
    /*min-width: 171px;*/
    width: auto;
    /* max-width: inherit; */
    float: none;
    margin-right: 0;
    background-color: #FFFFFF;
    text-align: center;
    /* padding-left: 0.5em; */
    box-sizing: content-box;
    /* position: fixed; */
    z-index: 9999;
    /*border-right: 1px solid #C3C3C3;*/
}

div#logo_img a {
    display: block;
}

/*div#logo_img img {
    height: 42px;
    width: auto;
    padding: 10px 0;
}*/
div#logo_img img {
    height: 39px;
    width: auto;
    padding: 13px 0;
}

.iconWrap {
    position: relative;
    margin: 0 2px;
    padding: 0;
    width: auto;
    height: auto;
    display: inline-block;
}

.isMobile .iconWrap {
    /*font-size: 1.2em;*/
}

.iconWrap--search {
    position: static;
}

.hvr-icon-hang:after {
    content: "\f13a" !important;
    right: 7px !important;
    padding: 0 !important;
    width: 16px;
    text-align: center;
}

.hvr-icon-forward:after {
    right: 0.5em !important;
}

.hvr-icon-forward:after:hover {
    -webkit-transform: translateX(5px) !important;
    transform: translateX(5px) !important;
}

a#hideMenu, a#pinMenu {
    /*float: left; Uses flex now */
    /*font-size: 1.7em;*/
    font-size: 1.5em;
    /*margin: 4px 0.5em;*/
    margin: 2px 0.5em;
    box-sizing: border-box;
}

/* Webkit Scroll Bars */

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background-color: rgba(255, 255, 255, 0);
    border-radius: 0;
}

::-webkit-scrollbar-track-piece {
    background-color: #E4E4E4;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb {
    background: #707F89;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover,
::-webkit-scrollbar-thumb:active {
    background: #84939d;
}

.nostyle {
    border: none !important;
    -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important;
}

fieldset.nostyle {
    margin-top: 1em;
}

.notiFlyout ul, .notiFlyout ul li {
    list-style: none;
    padding: 0;
    text-align: left;
}

.notiFlyout ul li a:hover { background: #CCCCCC; color: #333 !important; }

.notiFlyout ul li a:link {
    color: #84939D !important;
    text-decoration: none;
    background-color: #F3F3F3;
    width: 100%;
    font-size: 0.9em;
    padding: 0.3em;
    box-sizing: border-box;
    border-left: 3px solid #84939D;
    display: block;
}

.inputWrap {
    width: 100%;
    position: relative;
    display: block;
    margin-bottom: 0.9em;
}

.inputWrap i.fa {
    position: absolute;
    z-index: 999;
    top: 31px;
    left: 5px;
    color: #84939D;
    font-size: 1.4em;
}

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
}

.inputWrap span {
    color: #ABABAB;
    font-weight: normal;
}

.loginFooter {
    font-size: 0.9em;
    text-align: center;
}

#login_header {
    border-bottom: none;
    padding: 1em 0;
}

input[type="button"], input[type="submit"], input[type="reset"] {
    -webkit-appearance: none;
    -webkit-border-radius: var(--btnBorderRadius);
}

input[type="radio"] {
    -webkit-appearance: radio;
}

input[type="checkbox"] {
    -webkit-appearance: checkbox;
}

div#login_form:last-child {
    text-align: center;
}

/*@media (max-width: 900px) {*/
/*    #headerTitle { display: none; }*/
/*}*/

/*@media (max-width: 950px) {*/
/*    #headerTitle h1 { font-size: 100%; }*/
/*}*/

@media (max-width: 1024px) {
    /*.nav-new { display: none; z-index: 70000; }*/

    /*.wrapper { width: 100% !important; max-width: 100%; }*/

    a#hideMenu i { content: ''; }
}

@media (min-width: 1025px) {
    .nav-new { display: block; }

    /*.wrapper{ width: 82%; }*/
    a#hideMenu i { content: ''; }
}

@media (min-width: 1600px) {
    .wrapper, div.footer {
        /*width: 85%;*/
        /*width: 87%;*/
    }
}

div#bloggerInfo, div#wordpressInfo, div#tumblrInfo {
    text-align: left;
    display: none;
}

#tumblrInfo img, #bloggerInfo img, #wordpressInfo img {
    height: 45px;
    margin: auto;
    display: inherit;
}

.feedbackWrapper {
    display: inline-block;
    position: relative;
}

.feedbackForm  {
    /*border: 1px solid #EBEBEB;*/
    border: 2px solid #ccc;
    /*float: right;*/
    padding: 0.3em;
    text-align: center;
    /*font-size: 0.8em;*/
    position: absolute;
    /*left: 94%;*/
    background: #FFFFFF;
    color: #9E9E9E;
    border-bottom: 2px solid #EBEBEB;
    border-radius: 2px;
    box-shadow: 0 1px 6px rgba(64, 64, 64, 0.15);
    z-index: 63998;
    cursor: default;
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
    width: 15rem;
}

.feedbackForm {
    /*left: 82%;*/
    color: #848484;
}

.feedbackForm  .dragBar {
    background: #F9F9F9 url('/admin/images/grip-handle.png') no-repeat left center;
    cursor: move;
    overflow: hidden;
    height: 18px;
}

.feedbackForm p {
    text-align: left;
}

.feedbackBox .fa-thumbs-up:hover {
    color: #5DA423;
    cursor: pointer;
}

.feedbackBox .fa-thumbs-down:hover {
    color: #C60F13;
    cursor: pointer;
}

.feedbackPositiveColour { color: #5DA423; }

.feedbackNegativeColour { color: #C60F13; }

#breadcrumb {
    padding: 8px 15px;
    margin-bottom: 1em;
    list-style: none;
    background-color: #F5F5F5;
    border-radius: 4px;
    color: #CCCCCC;
    position: relative;
}

/*#breadcrumb > a + a:before {
    padding: 0 5px;
    color: #ccc;
    content: "/\00a0";
    }*/
#breadcrumb a {
    text-decoration: none;
    font-weight: lighter;
}

#breadcrumb a:hover {
    text-decoration: none;
    font-weight: bold;
}

select.contextualMenu {
    font-size: 1.1em;
    font-weight: 500;
    height: 50px;
    z-index: 64000;
    position: relative;
    background: #4c4c4c !important;
    /*-webkit-appearance: none;*/
}

/*.whiteLabel select.contextualMenu {
    background: var(--brandColour) !important;
    color: var(--contrastColour) !important;
}*/

select.contextualMenu.is_stuck {
    /*box-shadow: 0 2px 5px rgba(130, 130, 130, 0.38);*/
}

.isMobile .contextualMenu {
    position: relative !important;
}

div#helpiconlinks img {
    margin: 3px;
}

/* Hide all old tabs */
.module_section .public_tab {
    display: none;
}

/*form#cat_list table td {
    word-break: break-all;
}*/

.overlay-help, .overlay-context-help, .overlay-theme-help {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(51, 51, 51, 0.90);
    /*z-index: 200000;*/
    z-index: 2000000001;
    background-image: url('/admin/help/images/welcome1-overlay.png');
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}

.overlay-help #newInterfaceHelpButton, .overlay-context-help #newInterfaceHelpButton, .overlay-theme-help #newInterfaceHelpButton{
    position: absolute;
    bottom: 10%;
    right: 7em;
    font-size: 2em;
}

.overlay-context-help {
    background-image: url('/admin/help/images/contextual-menu-overlay.png');
    background-position: top center;
}

.overlay-theme-help {
    background-image: url('/admin/help/images/overlay/theme-editor/theme-ed-welcome-1.png');
    background-position: top center;
}

@media (max-width: 1557px) and (min-width: 1280px){
    .overlay-theme-help {
        background-image: url('/admin/help/images/overlay/theme-editor/theme-ed-welcome-1.png');
        background-position: center center !important;
        background-size: 85vw;
    }
}

fieldset#pageStatusBox i.fa.fa-file-text {
    color: #84939D;
}

fieldset#pageStatusBox i.fa.fa-check-circle {
    color: #15B358;
}

input.hidden {
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    outline: none;
    border: 0;
}

a.ui-button.ui-widget.ui-state-default.ui-button-icon-only.custom-combobox-toggle.ui-corner-right {
    height: 33px;
    box-sizing: border-box;
    padding: 0;
    font-size: 0.5em;
    top: -2px;
    border-bottom: 2px solid #D3D3D3;
    background: #F1F1F1;
}

.mfp-iframe-scaler iframe {
    background: #FFFFFF !important;
}

input.invisible {
    width: 90%;
    border: none !important;
    box-shadow: none !important;
    font-weight: bold;
    font-size: 1.1em;
}

h3 input.invisible:hover {
    background-color: #F9F9F9;
}

h3.editName {
    position: relative;
}

h3.editName:hover:after {
    content: "\f040";
    font-family: FontAwesome;
    display: inline-block;
    margin-left: 7px;
    position: absolute;
    top: 10px;
}

input.invisible:focus {
    outline: inherit;
    border: 1px solid #E4E4E4 !important;
}

a.note, .note a {
    color: inherit !important;
    font-weight: inherit !important;
    text-decoration: underline !important;
}

#uploadedFiles i.fa.fa-download {
    font-size: 1.3em;
}

.draft, .unpublished { background-color: #E0E0E0; font-style: italic; font-weight: bold; }

.time { background-color: #BACDDA; font-style: italic; }

.draft a, .time a, .unpublished a { font-style: italic; }

.topButton, .restartTutorial {
    position: fixed;
    bottom: 1em;
    right: 1em;
    border: 1px solid #E0E0E0;
    background: #CCCCCC;
    padding: 0.5em;
    border-radius: 3px;
    color: #222222;
    border-bottom: 2px solid #AFAFAF;
    z-index: 70000;
}

body.tawkTo_visible {
    bottom: 4em;
}

.restartTutorial{
    right: 5em;
    cursor: pointer;
}

.restartTutorial a, .restartTutorial a i.fa{ cursor: pointer; }

.topButton a.top, .restartTutorial a { color: #222222 !important; }

div#suggestions {
    font-size: 6em;
    color: #FFFFFF;
    width: 115px;
    height: 115px;
    float: left;
    padding: 10px;
    border-radius: 7em;
    text-align: center;
    box-sizing: content-box;
}

li.ui-autocomplete-category {
    border-bottom: 1px solid #CCCCCC;
    padding: 7px;
    text-align: center;
    border-top: 1px solid #CCCCCC;
    font-weight: bold;
}

ul.ui-autocomplete {
    z-index: 999999999999 !important;
    min-height: 26px !important;
}

.ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text {
    padding: 0.7em !important;
}

.iconBar span.ui-combobox input {
    width: 200px;
    height: 29px;
    background: #FFFFFF;
    font-size: 0.7em;
}

.iconBar a.ui-button.ui-widget.ui-state-default.ui-button-icon-only.ui-corner-right.ui-combobox-toggle {
    height: 28px;
    width: 20px;
    top: 0;
    background: #FFFFFF;
}

.iconWrapSearch {
    display: none;
    position: absolute;
    /*right: 16.5em;*/
    /*width: 200px;*/
    top: 0;
    left: 0;
    right: 2px;
    margin-left: 1.5em;
}

@media (max-width: 800px) {
    .iconWrapSearch {
    
    }
}

.iconWrapSearch .select2-dropdown{
    z-index: 65000 !important;
    top: -1px;
}

.iconWrapSearch .select2-container{
    vertical-align: top !important;
}

.iconWrapSearch .select2-container--default .select2-selection--single .select2-selection__rendered{
    color: #777 !important;
    font-size: 0.8em !important;
}

.select2-rendered__match {
    text-decoration: underline;
    font-weight: bold;
}

.select2-selection__rendered {
    padding-top: 3px !important;
    padding-bottom: 2px !important;

    margin-top: 3px !important;
}

.select2-selection__rendered li {
    margin: 0;
}

input.select2-search__field {
    margin: 0.5em 0;
}

.select2-selection__arrow{
    height: 33px !important;
}

.select2-selection {
    border: none !important;
    border-radius: 2px !important;
}

.select2-container{
    vertical-align: text-bottom !important;
    z-index: 99999999;
}

input.ui-state-default.ui-combobox-input.ui-autocomplete-input.ui-widget.ui-widget-content.ui-corner-left {
    text-decoration: none;
    color: #222222;
    position: relative;
    display: inline-block;
    border: 1px solid #E4E4E4;
    background: #FFFFFF;
    box-shadow: 0 1px 0 0 #E4E4E4;
    margin-bottom: 0.3em;
    box-sizing: border-box;
}

#stickyConfig {
    background: #FFFFFF;
    z-index: 9999;
}

.jaydenIronMan {
    position: fixed;
    z-index: 9999999;
    bottom: 0;
}

.jaydenIronMan img {
    height: 0;
}

.jaydenBatMan {
    height: auto;
    width: auto;
    position: fixed;
    z-index: 0;
    bottom: -12px;
    left: -400px;
}

.easterCage {
    display: none;
    position: fixed;
    bottom: -5px;
    z-index: 999999999;
    left: -230px;
    cursor: pointer;
}

.gradx_slider {
    cursor: ew-resize !important;
}

table#sitestats .statURL {
    word-break: break-all;
}

#login_wrapper .info, .setpasspg .success, .setpasspg .error {
    width: 40%;
}

.dashSort, .graphSort {
    display: flex; /* or inline-flex */
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    position: relative;
}

.statBox {
    width: 200px;
    height: 77px;
    background: #333;
    color: #FFFFFF;
    font-size: 0.8em;
    padding: 0.5em;
    box-sizing: border-box;
    margin: 0 5px 5px 0;
    float: left;
    position: relative;
    border-radius: 4px;
    cursor: pointer;
    /*order: 1;*/
    flex: 1 1 auto;
    align-self: auto;
    /*flex-grow: 1;
    flex-shrink: 1;
    flex-basis: auto;*/

    background: var(--grey_button) !important;
}

.statBox div {
    font-size: 3.3em;
    box-sizing: border-box;
    /*width: 100%;*/
    display: inline-block;
    width: 129px;
}

.statBox:hover {
    /*background-color: #84939d !important;*/
    background-color: var(--brandColour) !important;
    color: var(--contrastColour) !important;
}

/*.statBox {
    background: #97A6B1 !important;
}*/

div#currVersion {
    background: #00B7F1 !important;
}

div#currVersion:hover {
    background: #84939D !important;
}

.statNav {
    display: block;
    width: 100%;
    clear: both;
}

.statNav a {
    padding: 0.3em;
    color: #FFFFFF !important;
    background: #84939D;
    display: inline-block;
    margin: 0.3em;
    border-radius: 3px;
}

.statNav a:hover {
    text-decoration: none;
    background: #00B7F1;
}

.infospot{
    cursor: help;
    border-bottom: darkred dotted 1px;
}

.hotspot {
    border-bottom: none !important;
}

.hotspot img {
    vertical-align: middle;
}

.dash_graph {
    float: left;
    width: 49%;
    height: auto;
    max-height: 500px;
    border: 1px solid;
    padding: 0.3em;
    border-radius: 1px;
    border-top: 20px solid;
    border-color: #E0E0E0;
    background: #FFFFFF;
    cursor: move;
    box-sizing: border-box;
    margin: 0.1em;
    overflow: hidden;
    position: relative;
    /*order: 1;*/
    flex: 1 1 auto;
    align-self: auto;
    /*flex-grow: 1;
    flex-shrink: 1;
    flex-basis: auto;*/
}

div.dash_graph div.graphs {
    cursor: default;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.statBox i.fa {
    padding-right: 0;
    font-size: 3.3em;
}

.mediumBox {
    height: 164px;
    font-size: 0.9em;
}

.largeBox {
    height: 250px;
    font-size: 1.5em;
    width: 322px;
}

.ui-state-highlight {
    float: left;
    background: #E0E0DD !important;
    border: 1px solid #CCCCCC !important;
    opacity: 0.5;
    box-sizing: border-box;
    display: flex;
    padding: 0.5em;
    margin: 0.5em;
    flex-wrap: wrap;
}

#OptTabl { text-align: center; }

#OptTabl tr td:nth-child(1) {
    text-align: right;
    font-size: 1.1em;
}

.top_box .notifications {
    display: none;
}

.CodeMirror-fullscreen {
    top: 33px !important;
    z-index: 64500 !important;
    max-width: 100% !important;
}

.CodeMirror * {
    font-family: monospace !important;
}

div.mce-fullscreen {
    top: 35px !important;
    z-index: 65535 !important;
}

.jq-ui-tooltip {
    z-index: 99999999 !important;
}

.dragThis {
    cursor: move !important;
}

.dragThis p, .dragThis .success, .dragThis .error, .dragThis .warning, .dragThis .info, .dragThis h1, .dragThis h2, .dragThis h3, .dragThis span, .dragThis table {
    cursor: initial !important;
}

.newsPopBox {
    position: fixed !important;
    z-index: 66000 !important;
}

.smallNewsBox {
    width: 25%;
    margin: 0 auto;
    font-size: 0.9em;
}

#recurrOpts {
    width: auto;
    display: inline-block;
    margin-left: 0.5em;
}

#totalRecur { font-weight: normal; }

#prod_recurr_unit { width: 85px; }

.public_tab.blue_button {
    height: auto;
    z-index: 64000;
}

#breadcrumb .fa {
    color: #BFBFBF;
}

.fluidWidth {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    padding: 0 calc(50vw - 50%);
}

.fluidWidthFull {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
}

#helpiconlinks { text-align: center; }

input[type="number"] {
    max-width: 75px;
}

.pgTitle a:link, td.pgTitleTD {
    font-size: 1.1em;
    font-weight: bold;
}

.pgTitle ul {
    list-style: none;
}

.pgTitle ul ul {
    list-style: circle;
}

.ui-widget-content {
    border: solid 1px #C9D1DA;
}

.shortcutSpinner {
    position: fixed;
    top: 50%;
    left: 50%;
    font-size: 5em;
    width: 100px;
    height: 100px;
    background: rgba(0, 0, 0, 0.75);
    border-radius: 5px;
    text-align: center;
    color: #FFFFFF;
    z-index: 99999;
}

.simpleModal {
    position: fixed;
    top: 10%;
    left: 30%;
    font-size: 1em;
    width: 50%;
    height: auto;
    background: rgba(0, 0, 0, 0.75);
    border-radius: 5px;
    text-align: center;
    color: #FFFFFF;
    display: none;
    cursor: pointer;
    z-index: 99999;
}

.shortcutHelp ul {
    padding: 0;
}

.shortcutHelp ul li {
    display: inline-block;
    width: 25%;
    text-align: left;
}

select.invisibleInput, input.invisibleInput, textarea.invisibleInput {
    border: none !important;
    background-color: #F9F9F9;
    margin: 0 !important;
    padding: 3px;
}

tr:hover input.invisibleInput, input.invisibleInput:hover {
    background-color: #F9F9F9;
}

table#deliveryDeets input, table#customerDeets input {
    width: 300px;
}

*.backgroundWhite {
    background: #fff !important;
}

.redColourBackground{
    background-color: #e24b3f !important;
}

.redColour, .colourRed, a.redColour, a.redColour:link {
    color: #e24b3f !important;
    /*color: #E74C3C;*/
}

.greenColour, .colourGreen, a.greenColour, a.greenColour:link {
    color: #30bd55 !important;
    /*color: #5DA423;*/
}

.blueColour, .colourBlue, a.blueColour, a.blueColour:link {
    color: #4496da !important;
    /*color: #00B7F1 !important;*/
}

.yellowColour, .colourYellow, a.yellowColour, a.yellowColour:link {
    color: #ef9d22;
    /*color: #F1C40F;*/
}

.orangeColour, .colourOrange, a.orangeColour, a.orangeColour:link {
    color: #E67E22;
}

.purpleColour, .colourPurple, a.purpleColour, a.purpleColour:link {
    color: #9B59B6;
}

.greyColour, .colourGrey, .regentGrey, a.greyColour, a.greyColour:link {
    color: #84939D;
}

.silverGrey, .colourSilver, a.silverGrey, a.silverGrey:link {
    color: #CCCCCC;
}

.blackColour, .colourBlack, a.blackColour, a.blackColour:link {
    color: #000000;
}

.galleryColour, .colourGallery, a.galleryColour, a.galleryColour:link {
    color: #EFEFEF;
}

.greyColourBackground{
    background-color: #cccccc !important;
}

.inline {
    display: inline-block !important;
}

.textCenter {
    text-align: center;
}

div#whatIsresDesModal {
    position: absolute;
    margin: auto;
    left: 30%;
    z-index: 60000;
    box-shadow: 0 5px 10px rgba(51, 51, 51, 0.41);
    display: none;
}

.modalOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(51, 51, 51, 0.41);
    opacity: 0.5;
    filter: alpha(opacity=50);
    display: none;
    z-index: 1051;
    cursor: pointer;
}

.responsiveSlider #buttonSpin {
    display: none !important;
}

.responsiveSlider {
    text-align: center;
    position: absolute;
    width: auto;
    min-width: 440px;
    top: 30%;
    left: 40%;
    display: none;
    
    z-index: 999999;
}

.responsiveControls {
    background: #EFEFEF;
    border: 1px solid #D3D3D3;
    margin-bottom: 0.5em;
    padding: 0.5em;
    max-width: 440px;
    margin: 0.5em auto;
    position: relative;
}

.responsiveSlider div#thisDevice, .responsiveControls {
    box-shadow: 0 7px 15px rgba(162, 162, 162, 0.20);
}

.responsiveControls .dragHandle {
    width: 100%;
    background: transparent url('/admin/images/grip-handle.png') repeat-x;
    height: 12px;
    margin-top: -0.3em;
    margin-bottom: 0.2em;
    /* clear: both; */
    position: relative;
    box-sizing: border-box;
}

.responsiveControls a.close {
    top: -6px;
    right: -4px;
    background-color: #EFEFEF !important;
    position: relative !important;
    margin: 0;
}

.screen { z-index: 5 !important; }

.marvel-device {
    -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s;
}

button i.fa {
    font-size: 1.5em;
    vertical-align: middle;
}

.fa_button {
    width: 2em;
    height: 2em;
    padding: 0.5em !important;
    text-align: center;
    line-height: 0;
    margin: 0 !important;
}

.fa_button i.fa {
    font-size: inherit;
}


button#landscape i.fa.fa-mobile {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.contentEditor__publishWrapper {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    padding: 0;
    /*position: relative;*/
    width: 100%;
    z-index: 1;
    position: relative;
    margin-bottom: 1em;
    
    min-height: 180px; /* Fix the sticky */
}

.contentEditor__topBoxes {
    border-radius: 3px;
    width: 33%;
    flex-grow: 1;
    padding: 0 0.5em;
    
    background-color: #fff;
    text-align:  center;
    margin: 5px;
    border: 1px solid #ccc;
    
    display: flex;
    flex-direction: column;
}

.contentEditor__topBoxes:only-child {
    /* When there's only one box */
    flex-grow: 0;
    margin-left: auto;
}

.contentEditor__topBoxesInner {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}


/*.contentEditor__topBoxes fieldset {
    background-color: #fff;
    border-radius: 3px;
    padding: 1em;
    text-align:  center;
    !*display: flex;
    justify-content:  center;*!
    width: 100%;
    height: 100%;
}*/

#pgQuickSave {
    z-index: 1000;
}

#pgQuickSave.is_stuck + div {
    /*display: none !important;*/
}

#pgQuickSave.is_stuck {
    box-shadow: 0 5px 10px rgba(0,0,0,0.3);
    margin-top: 0;
    cursor: move;
    bottom: auto !important;
    height: auto;
    min-height: 135px;
    right: 0;
}

#pgQuickSave.ui-draggable-disabled {
    opacity: 1;
    left: 0 !important;
}

#pgQuickSave.ui-state-disabled {
    cursor: initial;
    pointer-events: auto;
}

.contentEditor__topBoxes h3 {
    margin-bottom: 0;
}

.contentEditor__topBoxes input,
.contentEditor__topBoxes a {
    margin: 0;
}

.contentEditor__statusIcon.fa {
    font-size: 3em;
    color: #00b7f1;
}


.radioSwitch {
    display: flex;
    background: #fff;
    border: 1px solid #ccc;
    margin: 0;
}


.radioSwitch .radioSwitchLabel {
    background: #fff;
    padding: 8px;
    text-align: center;
    width: 50%;
    margin: 0;
    cursor: pointer;
}

.radioSwitchInput {
    display: none;
}

.radioSwitchInput--checked:checked ~ .radioSwitch .radioSwitchLabel--checked {
    background: #30bd55;
    color: #fff;
}

.radioSwitchInput--unchecked:checked ~ .radioSwitch .radioSwitchLabel--unchecked {
    background: #e84c3c;
    color: #fff;
}


body.page_editor {
    /*--btnBorderRadius: 4px;*/
}

.page_editor  .pagelist-new {
    padding: 0;
}

.page_editor .breadcrumbs,
.page_editor #breadcrumb,
.page_editor .contextualMenu {
    display: none;
}

.page_editor {
    --pageEditor__topbarHeight: 3em;
}
.pageEditor__topBar {
    position: sticky;
    z-index: 10000;
    display: flex;
    padding: 0.5em;
    top: var(--topbarHeight);
    height: var(--pageEditor__topbarHeight);
    background: #eee;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    
    /*position: fixed;*/
    left: calc(var(--mainSidebarWidth) + var(--moduleSidebarWidth));
    right: 0;
}

.pageEditor__topBarBox {
    position: relative;
}

.pageEditor__topBar .pageEditor__topBtn {
    height: 2em;
    margin: 0 !important;
    /*padding: 0.5em;*/
    padding: 0 0.5em !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--btnBorderRadius);
}

.pageEditor__topBar .pageEditor__topBtn--hidden {
    display: none;
}

.pageEditor__topBtn + #buttonSpin {
    display: none !important;
}

.pageEditor__topBtn .fa:first-child {
    margin-right: 5px;
}

.pageEditor__topBtn .fa:last-child {
    margin-left: 5px;
}

.pageEditor__topBtn--lock {
    padding: 0 !important;
    width: 2em;
}

.pageEditor__dialog--lock ~ .ui-dialog-buttonpane button:disabled {
    display: none !important;
}

.pageEditor__topStatusMsg--time {
    color: var(--grey_button);
}
.pageEditor__topStatusMsg--unpublished {
    color: var(--grey_button);
}
.pageEditor__topStatusMsg--published {
    color: var(--green_button);
}
.pageEditor__topStatusMsg--archived {
    color: var(--grey_button);
}
.pageEditor__topStatusMsg--new {
    color: var(--grey_button);
}

.pageEditor__topStatusMsg--new .fa-floppy-o {
    position: relative;
}

.pageEditor__topStatusMsg--new .fa-floppy-o:after {
    content: '!';
    font-size: 0.5em;
    font-weight: bold;
    width: 1em;
    height: 1em;
    background: red;
    color: #fff;
    border-radius: 100%;
    border: 2px solid #efefef;
    position: absolute;
    /* top: 0; */
    bottom: -3px;
    /* left: 0; */
    right: -2px;
}

.pageEditor__saveBox {
    position: relative;
    /*background: #239a55;*/
    display: inline-flex;
    align-items: center;
    margin: 0 !important;
    margin-left: auto !important;
    padding: 0;
    /*background: var(--green_button) !important;*/
}

.pageEditor__saveBoxArrow {
    color: #fff !important;
    width: 2em;
    height: 2em;
    text-align: center;
    line-height: 2em;
    border-radius: 0 var(--btnBorderRadius) var(--btnBorderRadius) 0 !important;
    border: none !important;
    border-left: 1px solid #fff !important;

    padding: 0 !important;
    margin: 0 !important;
}

.pageEditor__saveBtn.pageEditor__saveBtn--main, .pageEditor__saveBoxArrow {
    background: var(--green_button) !important;
}

.pageEditor__saveBtn--main {
    border-radius: var(--btnBorderRadius) 0 0 var(--btnBorderRadius) !important;
    border: none !important;
    color: #fff !important;
}

.pageEditor__topBarDropdown {
    display: none;
    position: absolute;
    top: 100%;
    flex-direction: column;
    background: #fff;
    border: 1px solid #ccc;
    border-top: none;
    border-radius: 0 0 3px 3px;
    box-shadow: 0 0 10px -5px #000;
}

.pageEditor__topBarDropdown--open {
/*.pageEditor__topBarDropdown.tour-step-backdrop {*/
    display: flex;
}

.pageEditor__saveBoxDropdown {
    width: 100%;
}

.pageEditor__saveBtn {
    margin: 0 !important;
    padding: 0.5em;
    border: none;
    border-top: 1px solid #ccc;
    cursor: pointer;
    min-width: 11em;
}

.pageEditor__saveBoxDropdown .pageEditor__saveBtn {
    border-radius: 0;
}

.pageEditor__saveBoxDropdown .pageEditor__saveBtn:hover {
    background: #e2e2e2;
}


.page_editor button i.fa {
    font-size: 1em;
}

.isMobile .pageEditor__sidebar {
    top: calc(var(--topbarHeight) + var(--pageEditor__topbarHeight));
    --sidebarHeight: calc(100vh - var(--topbarHeight) - var(--pageEditor__topbarHeight));
}

.isMobile .pageEditor__topBar {
    left: calc(var(--mainSidebarWidth));
}

.pageEditor__sidebar .pgTools .btn,
.moduleSidebar__section--page_tools .btn {
    width: 100%;
}

.pageEditor__sidebar .btn i.fa {
    font-size: 1.4em;
    /*font-size: 20px;*/
    float: left;
}

.pageEditor__sidebar input,
.pageEditor__sidebar textarea,
.pageEditor__sidebar select,
.pageEditor__sidebar .tagit {
    margin: 0 !important;
    width: 100%;
    margin-top: 5px !important;
}

.pageEditor__sidebar input[type="checkbox"] {
    width: 1.1em;
    height: 1.1em;
    /*margin-left: auto;*/
}

.pageEditor__pageOption .tagit {
    order: 1;
}

.pageEditor__pageOption {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    /*margin-bottom: 1em;*/

    border-bottom: 1px solid #ccc;
    /*padding: 10px 0;*/
    padding: 15px 0;
    margin: 0;
}

/*.pageEditor__pageOption label {*/
/*    margin-bottom: 5px;*/
/*}*/

.pageEditor__pageOption:last-child {
    border-bottom: none;
}

.pageEditor__pageOption--passwordHolder {
    width: 100%;
}

.pageEditor__pageOption label a {
    text-decoration: underline;
    font-weight: inherit;
}

.pageEditor__passwordInputHolder {
    /* width: 100%; */
    display: flex;
    align-items: center;
}

.pageEditor__extraPagetextHolder {
    width: 100%;
}

.pageEditor__extraPagetext {
    display: flex;
    /*justify-content: space-between;*/
    align-items: center;
    margin: 5px 0;
}

.pageEditor__extraPagetextDelete {
    width: 2em;
    height: 2em;
    padding: 0 !important;
    margin: 0 !important;
    margin-left: auto !important;
}

.pageEditor__sidebar .pageEditor__extraPagetextDelete i.fa {
    font-size: inherit;
    float: none;
}

button.pageEditor__extraPagetextAdd {
    margin: 5px 0 0 0;
    width: 100%;
}

.pageEditor__sidebar .fileManagerInput__img:not([src='']) ~ .fileManagerInput__btn {
    display: none !important;
}

.pageEditor__sidebar .pgTools h2 {
    display: none;
}

.page_editor .mce-tinymce {
    box-sizing: border-box;
    border-left: none;
}

.page_editor .responsiveBar {
    top: calc(var(--topbarHeight) + var(--pageEditor__topbarHeight));
}

body.page_editor ul.tagit.ui-widget.ui-widget-content.ui-corner-all {
    margin-top: 0;
}

.pageEditor__modulesDialog a {
    color: #00b7f1 !important;
    font-weight: bold !important;
    text-decoration: underline !important;
}


.pageEditor__draftsWrapper {
    max-height: 600px;
    overflow: auto;
}

.pageEditor__draftsTableHeaderRow {
    position: sticky;
    top: 0;
}

@media (max-width: 800px) {
    
    .pageEditor__hideMobile {
        display: none;
    }
    
    .pageEditor__topBtn:not(.pageEditor__saveBtn) .fa:first-child {
        margin: 0;
    }
    
}


.genericModal {
    position: absolute;
    width: 575px;
    top: 8%;
    left: 50%;
    margin-left: -275px;
    border-radius: 3px;
    box-shadow: rgb(173, 173, 173) 0 0 80px;
    border: 10px solid rgba(26, 26, 26, 0.5);
    z-index: 1055;
    height: 650px;
    box-sizing: border-box;
    display: none;
    background: #fff;
}

.modalContent {
    text-align: center;
    padding: 0.5em;
    font-weight: normal;
    font-size: 1.2em;
    background-color: #FFFFFF;
    border-radius: 0;
    color: #222222;
    height: 100%;
    box-sizing: border-box;
    overflow: auto;
}

.changelog .modalContent {
    text-align: left;
    font-weight: normal;
}

.changelog h1 {
    border-bottom: 1px solid #CCCCCC;
    padding-bottom: 0.5em;
}

.changelog a.close {
    right: 5px;
}

div#thisDevice {
    /*max-width: 100%;*/ /* Use scaling now instead of max-width */
}

.removePass, .remove301, .remove302, .remove {
    color: #C60F13;
    cursor: pointer;
}

.showPass, .hidePass {
    cursor: pointer;
    color: #84939D;
    /* Removed the nbsp so add margin instead */
    margin-left: 5px;
}

#pswd_info {
    display: none;
}

#pswd_info {
    position: relative;
    top: 13px;
    /*bottom: -115px\9;*/
    left: 40%;
    width: 250px;
    padding: 15px;
    background: #FEFEFE;
    font-size: .875em;
    border-radius: 5px;
    box-shadow: 0 1px 3px #CCCCCC;
    border: 1px solid #DDDDDD;
}

#pswd_info h4 {
    margin: 0 0 10px;
    padding: 0;
    font-weight: normal;
}

#pswd_info::before {
    content: "\25B2";
    position: absolute;
    top: -17px;
    left: 45%;
    font-size: 25px;
    line-height: 14px;
    color: #DDDDDD;
    text-shadow: none;
    display: block;
}

.invalid {
    /*background:url(../images/invalid.png) no-repeat 0 50%;*/
    padding-left: 22px;
    line-height: 24px;
    color: #EC3F41;
}

.invalid:before {
    font-family: 'FontAwesome';
    content: '\f00d';
}

.valid {
    /*background:url(../images/valid.png) no-repeat 0 50%;*/
    padding-left: 22px;
    line-height: 24px;
    color: #3A7D34;
}

.valid:before {
    font-family: 'FontAwesome';
    content: '\f00c';
}

#pswd_info ul, #pswd_info li {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.emphasis, .italics {
    font-style: italic;
}

.bold {
    font-weight: bold !important;
}

.uppercase {
    text-transform: uppercase !important;
}

.lowercase {
    text-transform: lowercase !important;
}

.font-0-8x {
    font-size: 0.8em !important;
}

.font-1-3x {
    font-size: 1.3em !important;
}

.font-1-5x {
    font-size: 1.5em !important;
}

.font-2x {
    font-size: 2em !important;
}

.font-3x {
    font-size: 3em !important;
}

.font-4x {
    font-size: 4em !important;
}

.font-5x {
    font-size: 5em !important;
}

.floatLeft {
    float: left;
}

.floatRight {
    float: right;
}

.floatCenter {
    margin: 0 auto;
}

.flexFloatLeft {
    margin-right: auto;
}

.flexFloatRight {
    margin-left: auto;
}

.flexFloatCenter {
    margin-left: auto;
    margin-right: auto;
}

.margin05em {
    margin: 0.5em;
}

.margin1em {
    margin: 1em;
}

.marginBottom1em {
    margin-bottom: 1em;
}

.width60{
    width: 60%;
}

.width80{
    width: 80%;
}

.width100{
    width: 100% !important;
}

.width70px{
    width: 70px;
}

.width75px{
    width: 75px;
}

.widthAuto{
    width: auto !important;
}


.flex0 {
    flex: 0;
}

.flexGrow1 {
    flex-grow: 1;
}
.flexGrow0 {
    flex-grow: 0;
}
.flexShrink1 {
    flex-shrink: 1;
}
.flexShrink0 {
    flex-shrink: 0;
}



a.mngAcctLink {
    color: #00B7F1 !important;
    text-decoration: underline !important;
}

.marvel-device .screen.ios {
    height: 100%;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch !important;
}

.marvel-device .screen.ios iframe {
    height: 100%;
    width: 1px;
    min-width: 100%;
    *width: 100%;
}

.tutorialZindex {
    z-index: 3000000001 !important;
    transition: all 0.4s ease-in-out;
}

.truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; /** IE6+, Firefox 7+, Opera 11+, Chrome, Safari **/
    -o-text-overflow: ellipsis; /** Opera 9 & 10 **/
    /* note that this width will have to be smaller to see the effect */
}

.ui-autocomplete.ui-corner-all {
    margin: 0 !important; /* Fix for icon bar search autocomplete */
}

#blogSubButton {
    top: 16px;
    position: absolute;
    right: 8px;
}

@-moz-document url-prefix() {
    #blogSubButton {
        top: 0;
        position: absolute;
        right: 8px;
    }
}

i.mce-ico.mce-i-template {
    color: inherit;
}

i.fa-mco.mce-ico.mce-i-template {
    font-size: 1.5em;
    vertical-align: middle;
    line-height: 1;
    width: auto;
    height: auto;
}

.pgTools {
    text-align: center;
}

.pgTools h2 {
    text-align: left;
}

.pgTools button .fa {
    width: 1.28571429em;
    height: auto !important;
    line-height: normal;
    font-size: 1em;
}

.leftCol404 h1 {
    font-size: 8em;
    margin: 0;
    text-align: center;
}

div#logo_img img {
    box-sizing: content-box;
}

/* new forms module */

.pure-form legend{
    color: inherit;
}

.pure-form.pure-form-aligned legend {
    display: inline-block;
    float: left;
    width: 10em;
    font-weight: inherit;
    color: inherit;
    padding: .3em 0 !important;
    font-size: initial;
    text-align: right;
    margin: 0 1em 0 0;
    border-bottom: none;
}
.pure-form.pure-form-aligned .pure-radio-group {
    float: left;
}

.pure-form-stacked fieldset label {
    float: none;
}

.submitMessageHolder, .formLoader {
    width: 100%;
    text-align: center;
}
a.showForm {
    display: block;
    text-align: center;
    margin-top: 1em;
}

.fa-input-before {
    position: relative;
    z-index: 2;
    width: 2em;
    height: 2em;
    line-height: 2;
}

.pure-form-stacked .fa-input-before {
    position: absolute;
}

.pure-form-aligned .fa-input-before + input,
.pure-form-aligned .fa-input-before + textarea,
.pure-form-aligned .fa-input-before + select {
    margin-left: -2.1em !important;
    padding-left: 2.1em !important;
    position: relative;
    z-index: 1;
    vertical-align: baseline;
}
.pure-form-stacked .fa-input-before + input,
.pure-form-stacked .fa-input-before + textarea,
.pure-form-stacked .fa-input-before + select {
    /*margin-top: -2em !important;*/
    padding-left: 2em !important;
    position: relative;
    z-index: 1;
}

.ddcommon .ddChild {
    width: auto !important;
    min-height: 250px !important;
}

.dd .ddChild li.optgroup .optgroupTitle {
    font-style: normal !important;
    font-size: 1.5em;
}

.dd .ddChild li img {
    width: 75px;
}

.dd .ddTitle .ddTitleText img {
    padding: 5px;
    width: 75px;
    float: left !important;
}

.formInputHolder {
    display: none;
}

td#cachePageBar .widget_progress_bar {
    font-size: 1.5em;
    width: 100%;
    height: 2em;
}
td#cachePageBar .widget_progress_colour {
    height: 2em;
}

.btn:hover i.fa {
    color: inherit !important;
}

.mod_forms_preview textarea{
    width: auto;
}

.tableNameColumn i.fa.fa-download.fa-fw.tooltip {
    color: #84939d;
    cursor: pointer;
}

a#addGPS {
    color: #fff !important;
}

table#htaccessTable td{
    vertical-align: top;
}

.dd span#blog_share_img_title {
    word-wrap: break-word;
    word-break: break-all;
}

figure.align-left{float:left}
figure.align-right{float:right}
figure.image.align-center{display:table;margin-left:auto;margin-right:auto}

.imgBorder {
    padding: 0.3em;
    border: 1px solid #d6d6d6;
    border-radius: 2px;
    margin: 0.5em;
}


/*
pre[class*="language-"]:before {
    content: attr(class);
    -webkit-writing-mode: vertical-lr;
    -ms-writing-mode: tb-lr;
    writing-mode: vertical-lr;
    font-size: 1.3rem;
    color: white;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: #999;
    padding: 1px 0;
    !* text-indent: 15px; *!
}

pre[class*="language-"]:before {
    width: 20px;
    line-height: 2;
    position: relative;
    top: auto;
    left: auto;
    padding: 0 1rem 1rem 0;
    margin-left: -1rem;
    height: 100%;
    float: left;
    top: -1rem;
    margin-bottom: -1.9rem;
    margin-right: 1rem;
}

pre[class*="language-"] {
    padding-top: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

pre[class*="language-"]{
    padding-top: 21px;
}*/


.iconWrap a.openSSLhelp {
    /*padding: 3px 10px 1px 70px;*/
    /*font-size: 0.8em;*/
}

.openSSLhelp .fa-exclamation-triangle {
    position: absolute;
    bottom: -3px;
    right: 0;
    font-size: 0.6em;
    color: orange;
}

/* New Small Inline Notices */

.smallNoticeBox{
    background: #f1f1f1;
    color: #222;
    border: 1px solid #e4e4e4;
    border-left: 0;
    /*padding: 5px 26px;*/
    padding: 5px 0.3em;
    font-size: 0.9em;
    margin: 0.7em 0;
    position: relative;
    font-weight: normal;
    box-sizing: border-box;
    display: inline-block;
}

.smallNoticeBox:before {
    font-family: "FontAwesome";
    margin-right: 3px;
}

.smallInfo{
    border-left: 7px solid #00b7f1;
}

.smallInfo:before {
    content: "\f05a"; /* i in circle */
    color: #00b7f1;
}

/*.smallInfo:before {
    content: "\f05a";
    color: #fff;
    background: #00b7f1;
    top: 0;
    bottom: 0;
    position: absolute;
    left: 0;
    padding: 0.3em;
    width: 12px;
}*/

.smallSuccess:before {
    content: "\f058"; /* Tick */
    color: #239a55;
}

.smallSuccess{
    border-left: 7px solid #239a55;
}

.smallError:before {
    content: "\f057"; /* Error cross X */
    color: #e74c3c;
}

.smallError{
    border-left: 7px solid #e74c3c;
}

.smallWarning:before {
    content: "\f071"; /* Triangle */
    color: #E3B000;
}

.smallWarning{
    border-left: 7px solid #E3B000;
}

.smallNote:before {
    content: "\f069"; /* Asterisk */
    color: #929292;
}

.smallNote{
    border-left: 7px solid #929292;
}

.smallTip:before {
    content: "\f059"; /* Question Mark*/
    color: #00b7f1;
}

.smallTip{
    border-left: 7px solid #929292;
}

.trialUpgButton{
    width:49%;
    height:90px;
    font-size: 1.3em;
}

a.btn:after {
    content: "" !important;
    display: none !important;
}

.spacer {
    margin: 1em;
    clear: both;
    overflow: hidden;
    box-sizing: border-box;
}

/* Toggle Switch Styles */

.onoffswitch {
    position: relative; width: 64px;
    -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
    display: none;
}
.onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer !important;
    height: 36px; padding: 0; line-height: 36px;
    border: 2px solid #E3E3E3; border-radius: 36px;
    background-color: #E74C3C;
    transition: background-color 0.3s ease-in;
}
.onoffswitch-label:before {
    content: "";
    display: block; width: 36px; margin: 0;
    background: #FFFFFF;
    position: absolute; top: 0; bottom: 0;
    right: 26px;
    border: 2px solid #E3E3E3; border-radius: 36px;
    transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label {
    background-color: #239a55;
}
.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
    border-color: #239a55;
}
.onoffswitch-checkbox:checked + .onoffswitch-label:before {
    right: 0;
}

/*****************/

figure.op-ad legend {
    font-weight: normal;
    font-size: 0.8em;
    text-transform: lowercase;
    font-variant: small-caps;
    color: #cccccc;
}

figure.op-ad fieldset {
    border: none;
    border-top: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
    margin: 1em 0;
}

html.no-ab div.ab {
    display: none;
    border: 1px solid #EFEFEF;
    padding: 0.3em;
    width: 100%;
    margin: 0 auto;
}

html.ab div.ab{
    display:inline-block !important;
    /*background: #d6d6d6;*/
    background: #ffffff url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAIklEQVQYV2NkQAI3b978zwjjgzjq6uqMYAEYB8RmROaABAACog+PUszzSAAAAABJRU5ErkJggg==');
    width: 100%;
    height: 100%;
    padding: 0.5em;
    color: #a2a2a2;
}

.logoFloatLeft{
    float:left;
}
.logoFloatRight{
    float:right;
}
.logoBlockLeft{
    width:100%;
    text-align:left;
}
.logoBlockRight{
    width:100%;
    text-align:right;
}
.logoBlockCenter{
    width:100%;
    text-align:center;
}

.ui-widget {
    font-family: inherit;
    font-size: inherit;
}

.accordianMenu.ui-accordion .ui-accordion-content{
    overflow-x: initial !important;
    padding: 1em !important;
    overflow-y: visible !important;
}

.blogAccordian .pgTools h2 {
    display: none;
}

.blogAccordian .pgTools {
    font-size: 0.9em;
}

.fbAppLabel{
    width: 80px;
    display: inline-block;
}

ol#tokenGuide li {
    font-size: 1.2em;
    font-weight: 500;
}

span.tagit-label:before {
    content: "\f02b";
    font-family: FontAwesome;
    margin-right: 0.3em;
}

div#dropDownMenus ul li span.tagit-label:before {
    content: "\f150";
    font-family: FontAwesome;
    margin-right: 0.3em;
}

#formEmail ul li span.tagit-label:before, .tagit-email + ul.tagit li span.tagit-label:before {
    content: "\f1fa";
    font-family: FontAwesome;
    margin-right: 0.3em;
    font-weight:bold;
}

.fa.miniSeller{
    color: #CCCCCC;
    font-size: 32px;
}
img.miniSeller{
    width:32px;
    border-radius:2em;
}


/* CARDS */
.z-depth-1, nav, .card-panel, .card, .toast, .btn, .btn-large, .btn-floating, .dropdown-content, .collapsible, .side-nav {
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
}
.card {
    position: relative;
    margin: .5rem 0 1rem;
    background-color: #fff;
    transition: box-shadow .25s;
    border-radius: 2px;
}
.card.horizontal {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 60%;
}
.card.horizontal .card-image {
    max-width: 50%;
    /* margin-right: 0.3em; */
    text-align: center;
    padding: 24px;
}
.card .card-image {
    position: relative;
}
.card.horizontal .card-image img {
    border-radius: 2px 0 0 2px;
    max-width: 100%;
    width: auto;
    /* zoom: 2; */
    border-radius: 5em;
    top: 50%;
    transform: translateY(-50%);
}
.card .card-image img {
    display: block;
    border-radius: 2px 2px 0 0;
    position: relative;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
}
.card.horizontal .card-stacked {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative;
}
.card.horizontal .card-stacked .card-content {
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
.card .card-content {
    padding: 24px;
    border-radius: 0 0 2px 2px;
}
.card .card-content h5{
    font-size: 1.64rem;
    line-height: 110%;
    margin: .82rem 0 .656rem;
}
.card .card-content p {
    margin: 0;
    color: rgba(0,0,0,0.71);
}
.card-panel span, .card-content p {
    -webkit-font-smoothing: antialiased;
}
.card .card-action:last-child {
    border-radius: 0 0 2px 2px;
}
.card .card-action {
    position: relative;
    background-color: inherit;
    border-top: 1px solid rgba(160,160,160,0.2);
    padding: 16px 24px;
}
.card .card-action a:not(.btn):not(.btn-large):not(.btn-large):not(.btn-floating) {
    /*color: #ffab40;*/
    margin-right: 24px;
    transition: color .3s ease;
    text-transform: uppercase;
    text-decoration: none;
}
.card .card-action a:not(.btn):not(.btn-large):not(.btn-large):not(.btn-floating):hover {
    /*color: #ffd8a6;*/
}
.card .card-content p a {
    transition: color .3s ease;
}

.card .card-action .fa.fa-info-circle  {
    float: right;
    color: #CCCCCC;
    font-size: 16px;
}

.card .card-action .fa, .card .card-action a svg  {
    font-size: 16px;
    color: inherit;
    fill: currentColor;
    vertical-align: top;
}

.card .fa.card-nopic{
    color: #CCCCCC;
    font-size:100px;
}

.pgSocialImg div#socialImg_msdd, .pgSocialImg #BannerImgDropDowns {
    width: 90% !important;
    max-width: 90% !important;
}

button#reloadImgs, button[id^='reloadImgs_'] {
    width: 24px;
    padding: 0.3em;
    box-sizing: content-box;
}

.wb-fb-message-bot{
    background: #000;
    border: 0.3em solid rgba(0, 0, 0, 0.36);
    width: 32px;
    height: 32px;
    z-index: 9999999;
    position: fixed;
    bottom: 4em;
    right: 7em;
    border-radius: 5em;
    padding: 0.3em;
    box-sizing: content-box !important;
}
.wb-fb-message-bot img {
    top: 50%;
    transform: translateY(-50%);
    position: relative;
    margin-top: 0;
}
.wb-fb-message-bot:active {
    box-shadow: 0 3px 5px rgba(107, 107, 107, 0.52);
}
.wb-fb-message-bot a:after{
    content: '';
}

input#photoimg {
    width: 33%;
}

label.labelWidth {
    width: 15%;
    display: inline-block;
}

.top_header .currentuser a {
    color: #00b7f1 !important;
    font-weight: bold;
}

form#modifyForm select {
    width: 50%;
}

form#modifyForm #set_w_type {
    width: 17%;
}

form#modifyForm label {
    width: 30%;
    display: inline-block;
}

input.membSearch {
    height: 43px;
    border-radius: 0;
}

.reviewArrow {
    /* position: relative; */
    background: #efefef;
    border: 4px solid #00b7f1;
    position: absolute;
    left: 240px;
    top: 75px;
    color: #222;
    padding: 0.5em;
    min-width: 177px;
    box-shadow: 5px 5px 5px rgba(204, 204, 204, 0.68);
    cursor: pointer;
    z-index: 9999999;
}
.reviewArrow h3 a{
    color: #222222;
}
.reviewArrow h3 a:after{
    content: none;
}
.reviewArrow:after, .reviewArrow:before {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.reviewArrow:after {
    border-color: rgba(239, 239, 239, 0);
    border-right-color: #efefef;
    border-width: 20px;
    margin-top: -20px;
}
.reviewArrow:before {
    border-color: rgba(0, 183, 241, 0);
    border-right-color: #00b7f1;
    border-width: 26px;
    margin-top: -26px;
}

div#cogLoader {
    background: rgba(34, 34, 34, 0.72);
    color: #fff;
    padding: 0.3em;
    border-radius: 0.3em;
    width: auto;
    margin: 0 auto;
    position: fixed;
    top: 50%;
    left: 64%;
    transform: translate(-84%, -50%);
    z-index: 999999;
    font-size: 2.2em;
}

div#resposiveMsg {
    position: fixed;
    z-index: 999999;
    top: 50%;
    left: 50%;
    transform: translate(-43%, -50%);
    cursor: pointer;
}

i.fa.fa-question-circle.brandColour.tooltip {
    color: #0578b9;
    cursor: help;
    font-size: 16px;
}

#template_virtual_dir label, #template_virtual_dir a,
#css_virtual_dir label, #css_virtual_dir a {
    cursor: pointer;
}

#template_virtual_dir label:hover, #template_virtual_dir a:hover,
#css_virtual_dir label:hover, #css_virtual_dir a:hover,
#template_virtual_dir label:active, #template_virtual_dir a:active,
#css_virtual_dir label:active, #css_virtual_dir a:active,
#template_virtual_dir label:focus, #template_virtual_dir a:focus,
#css_virtual_dir label:focus, #css_virtual_dir a:focus{
    color: #000;
    text-decoration: none;
    /*border: 1px solid #84939d;
    padding: 3px;*/
    box-sizing: border-box;
    border-radius: 3px;
    border-bottom-width: 2px;
    font-weight: bold;
}

div#tt {
    background: #fff;
    border: 1px solid #c5c5c5;
    -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
}

div#ttbot {
    background: #fff;
    box-shadow: none;
}

div#ttcont {
    background: #fff;
    color: #333;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 1em;
}

div#tttop {
    background: #fff;
}

/* UPDATED MESSAGE BOXES */

.info, .success, .warning, .error, .validation, .bigerror, .green, .updater, .updater-beta, .info-gold, .special, .noticeBox, .blue, .yellow {
    border: 0 solid;
    margin: 0.5em auto;
    padding:15px 10px 15px 50px;
    background-repeat: no-repeat;
    background-position: 10px center;
    background-size: 25px;
    text-shadow: none;
    color: #FFFFFF;
    border-radius: 4px;
    width: auto;
    max-width: 75%;
    min-width: 70%;
}

.info a:last-child, .success a:last-child, .warning a:last-child, .error a:last-child, .validation a:last-child, .noticeBox a:last-child {
    margin-top: 0.5em;
    display: inline-block;
}

.noticeBoxInfo, .info{
    background-color: #4496da;
    background-image: url('/admin/images/info-circle-white.png');
}
.noticeBoxSuccess, .success, .green{
    background-color: #30bd55;
    background-image: url('/admin/images/tick-circle-white.png');
}
.noticeBoxWarning, .warning{
    background-color: #ef9d22;
    background-image: url('/admin/images/warning-triangle-white.png')
}
.noticeBoxError, .error, .bigerror{
    background-color: #e24b3f;
    background-image: url('/admin/images/error-circle-white.png');
}
.noticeBoxGold, .info-gold {
    background-color: #dcad21;
    background-image: url('/admin/images/info-circle-white.png');
}
.noticeBoxSpecial, .special{
    background-color: #FF9800;
    background-image: url('/admin/images/star-icon-white.png');
}
.updater {
    background-color: #0C7C59;
    background-image: url('/admin/images/fa-cloud-upload.png');
}
.updater-beta {
    background-color: #E95224;
    background-image: url('/admin/images/fa-wrench.png');
}

.noticeBoxIcon:before {
    /* No icons on these yet */
    display: none;
}

.noticeBoxIcon[class*=fa-]:before {
    display: inline-block;
}

.noticeBoxInner {
    display: inline;
}

.noticeBox a,
.noticeBox a:link {
    color: #ffffff !important;
    text-decoration: underline;
}
    
    /* Konami code thing */
#magicGif{
    box-shadow: 0 0 11em goldenrod;
    border: 1px solid goldenrod;
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 252px;
}

a#notiHeadLink {
    color: #84939D !important;
    font-weight: bold;
}

.tooltip:not(a){
    cursor: help;
}

.smallInput{
    width:70px;
}

ul#galsort{
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.displayNone{
    display: none;
}

.displayBlock {
    display: block;
}

.displayInlineBlock {
    display: inline-block;
}

.displayFlex {
    display: flex;
}

.flexCenter {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.flexJustified {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.flexWrap {
    flex-wrap: wrap;
}

.flex1 {
    flex: 1;
}

/* Use this to get styles without affect structure eg. <h3 class="displayContents"><label> displays inline like label but with h3 styles */
.displayContents {
    display: contents;
}

.dotted {
    background-image: -webkit-repeating-radial-gradient(center center, rgba(0,0,0,.2), rgba(0,0,0,.2) 1px, transparent 1px, transparent 100%);
    background-image: -moz-repeating-radial-gradient(center center, rgba(0,0,0,.2), rgba(0,0,0,.2) 1px, transparent 1px, transparent 100%);
    background-image: -ms-repeating-radial-gradient(center center, rgba(0,0,0,.2), rgba(0,0,0,.2) 1px, transparent 1px, transparent 100%);
    background-image: repeating-radial-gradient(center center, rgba(0,0,0,.2), rgba(0,0,0,.2) 1px, transparent 1px, transparent 100%);
    -webkit-background-size: 3px 3px;
    -moz-background-size: 3px 3px;
    background-size: 3px 3px;
}

.striped {
    background-image: -webkit-repeating-linear-gradient(135deg, rgba(0,0,0,.3), rgba(0,0,0,.3) 1px, transparent 2px, transparent 2px, rgba(0,0,0,.3) 3px);
    background-image: -moz-repeating-linear-gradient(135deg, rgba(0,0,0,.3), rgba(0,0,0,.3) 1px, transparent 2px, transparent 2px, rgba(0,0,0,.3) 3px);
    background-image: -o-repeating-linear-gradient(135deg, rgba(0,0,0,.3), rgba(0,0,0,.3) 1px, transparent 2px, transparent 2px, rgba(0,0,0,.3) 3px);
    background-image: repeating-linear-gradient(135deg, rgba(0,0,0,.3), rgba(0,0,0,.3) 1px, transparent 2px, transparent 2px, rgba(0,0,0,.3) 3px);
    -webkit-background-size: 4px 4px;
    -moz-background-size: 4px 4px;
    background-size: 4px 4px;
}

.galPhotoDelCheck {
    position: absolute;
    top: 22px;
    right: 10px;
}

.galPhotoDelCheck i.fa {
    vertical-align: bottom;
    font-size: 18px;
    cursor: pointer;
}

.imgBlur{
    filter: blur(1.2px);
}

#buttonSpin {
    position: absolute;
}

.ghostBorder {
    background: transparent;
    border: 1px solid;
    padding: 0.3em 0.7em;
    border-radius: 2px;
    text-decoration: none;
}

.ghostBorder:hover {
    background: currentColor;
    border: 1px solid transparent;
    padding: 0.3em 0.7em;
    border-radius: 2px;
    text-decoration: none;
    /* -webkit-text-stroke: 1px white; */
    text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
}

#cat_list h3 .fa {
    font-size: 16px;
}

td.prodImgThumb{
    position: relative;
    overflow: hidden;
}

td.prodImgThumb img{
    position: relative;
    transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
}

td.prodImgThumb img.pdImgFXTop {
    opacity: 1;
}

td.prodImgThumb img.pdImgFXBottom {
    opacity: 0;
    transition: all .55s ease-in-out;
    -moz-transition: all .55s ease-in-out;
    -webkit-transition: all .55s ease-in-out;
    position: absolute;
    top: 5px;
    left: 5px;
}

td.prodImgThumb:hover img.pdImgFXBottom {
    opacity: 1;
}
td.prodImgThumb:hover img.pdImgFXTop {
    opacity: 0;
}

td.prdGroupTD {
    position: relative;
}

.groupSlideDown {
    position: absolute;
    min-width: 300px;
    max-width: 350px;
    border: 1px solid #ccc;
    background: #fafafa;
    box-shadow: 3px 3px 2px rgba(181, 181, 181, 0.50);
    margin: 0;
    list-style: none;
    display: block;
    padding: 0.5em;
    max-height: 150px;
    z-index: 999;
    box-sizing: content-box;
}

.groupSlideDown:after, .groupSlideDown:before {
    bottom: 100%;
    left: 22%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.groupSlideDown:after {
    border-color: rgba(250, 250, 250, 0);
    border-bottom-color: #fafafa;
    border-width: 10px;
    margin-left: -10px;
}
.groupSlideDown:before {
    border-color: rgba(204, 204, 204, 0);
    border-bottom-color: #cccccc;
    border-width: 11px;
    margin-left: -11px;
}

.groupSlideDown .col {
    text-align: left;
    padding: 0.5em;
    display: inline-table;
    width: 50%;
    position: relative;
}

.groupSlideDown .col label {
    display: inline-block;
    width: 100%;
    text-align: left;
    margin-bottom: 0.5em;
    cursor: pointer;
}

.attrList span.tagit-label:before {
    content: "\f0e8";
    font-family: FontAwesome;
    margin-right: 0.3em;
}

.groupSlideDown .overflowY{
    overflow-y: auto;
    height: 150px;
}

.groupSlideDown a.close {
    right: 15px;
}

td#shopCatList ul li {
    text-align: left;
}

td#shopCatList ul {
    padding-left: 0;
    margin: 0;
}

input.select2-search__field {
    width: auto !important;
}

.select2-container {
    max-width: 100%;
}

.optgroup-style{
    font-weight: bold;
}

select#prodCatSelect {
    width: 100%;
}

.shopCategorySelect--single + .select2 {
    min-width: 10em;
}

.productEditor__categorySelectHolder .select2-selection__rendered {
    margin-top: 0 !important;
}

select#prodCatSelect strong.select2-results__group {
    display: none !important;
}

select#prodCatSelect strong.select2-results__group + ul li:first-child {
    font-weight: bold !important;
    font-size: 1.1em;
    text-transform: uppercase;
    margin-left: 0;
}

select#prodCatSelect strong.select2-results__group + ul li {
    margin-left: 0.9em;
}

strong.select2-results__group{
    text-transform: uppercase;
}

.select2-results__options--nested span.optgroup-sub-level:before {
    content: "\21B3";
    padding-right: 0.5em;
}


div#prdSettings label, div#priceSettings label, div.customGrp label {
    width: 50%;
    display: inline-block;
}

div#prdSettings .clear, div#speshSettings .clear{
    margin-bottom: 0.5em;
}

div#prdSettings input[type='checkbox']{
    cursor: pointer;
}

div#prdSettings input, div#prdSettings select, div#priceSettings input, div#priceSettings select, div#speshSettings input, div#speshSettings select{
    vertical-align: baseline;
}

.numberInput{
    width: 75px;
}

div#prdSettings a, div#speshSettings a {
    text-decoration: underline;
}

.currencyAlignFix{
    margin-left: -15px;
}

.childProdAddButton, .childProdAddOptionalExtra, .addonProdAddButton {
    background: #e0e0e0;
    font-size: 4em;
    text-align: center;
    color: #9a9a9a;
    border-radius: 2px;
    cursor: pointer;
    width: 49.7777%;
    display: inline-block;
    box-sizing: border-box;
}

.childProdAddButton:hover, .childProdAddOptionalExtra:hover, .addonProdAddButton:hover {
    color: #ccc;
    background: #efefef;
}

.childProdAddButton div, .childProdAddOptionalExtra div, .addonProdAddButton div {
    display: block;
    font-size: 0.4em;
}

.addonPrdElements div{
    padding-bottom: 0.9em !important;
}

.attrList ul {
    margin-left: 20%;
    padding-left: 0.3em;
    list-style: none;
    width: 60%;
}

.param label {
    font-weight: bold;
    margin-top: 1em;
}

.param .attrList label {
    margin-top: 0.5em;
}

div.customGrp textarea {
    float: right;
    width: 49%;
    min-width: 49%;
    resize: vertical;
}

div.customGrp .select2-container {
    width: 49% !important;
    float: right;
    margin-bottom: 1em;
    height: auto;
}

div.customGrp .select2-container--default .select2-selection--multiple {
    border-radius: 2px;
    border: solid 1px #C9D1DA !important;
}

.attrSort li {
    background: rgba(236, 236, 236, 0.58);
    padding: 0.3em;
    cursor: move;
    border-radius: 3px;
    height: 30px;
    box-sizing: border-box;
    position: relative;
}

.attrSort li:active {
    box-shadow: 2px 4px 8px rgba(117, 117, 117, 0.36);
}

.attrSort .dotted {
    width: 15px;
    display: inline-block;
    border: 1px solid rgba(197, 197, 197, 0.63);
    height: 100%;
    vertical-align: bottom;
    margin-right: 0.3em;
    border-radius: 2px;
    cursor: move;
}

#shopProdTools .pgTools button{
    display: none;
}
#shopProdTools .pgTools h2{
    cursor: pointer;
}

#shopProdTools .pgTools.changed h2:after {
    content: " \f056";
    font-family: FontAwesome;
    font-size: 0.6em;
}
#shopProdTools .pgTools h2:after {
    content: " \f055";
    font-family: FontAwesome;
    font-size: 0.6em;
}
/* New TinyMCE mobile editor */
div[data-ephox-mobile-fullscreen-style] {
    z-index: 999999;
}

.largeText {
    font-size: 1.4em;
    font-weight: bold;
}

.ajaxResult{
    font-size: 1.3em;
    z-index: 9999;
    max-width: 400px;
    min-width: 300px;
    text-align: center;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
    word-break: break-word;
}

.ajaxResult.success {
    animation-name: fadeOutDownAJAX;
    animation-delay: 3s;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
    animation-play-state: running;
}

.isMobile .ajaxResult.success {
    animation-name: fadeOutUpAJAX;
}

.ajaxResult--noHide {
    animation: none !important;
}

@-webkit-keyframes fadeOutDownAJAX {
    0% {
        opacity: 1;
    }
    
    99% {
        opacity: 0;
        -webkit-transform: translate(-50%, 100%);
        transform: translate3d(-50%, 100%);
    }
    
    100% {
        opacity: 0;
        -webkit-transform: translate(-50%, 100%);
        transform: translate(-50%, 100%);
        display: none;
    }
}

@-webkit-keyframes fadeOutUpAJAX {
    0% {
        opacity: 1;
    }
    
    99% {
        opacity: 0;
        -webkit-transform: translate(-50%, -100%);
        transform: translate3d(-50%, -100%);
    }
    
    100% {
        opacity: 0;
        -webkit-transform: translate(-50%, -100%);
        transform: translate(-50%, -100%);
        display: none;
    }
}

.isMobile .ajaxResult {
    max-width: 90%;
    top: calc(var(--topbarHeight) + 10vw);
}

.pointer{
    cursor: pointer !important;
}

.fadeInUp {
    animation-duration: 1.5s;
}

#postGeneral ul.tagit.ui-widget.ui-widget-content.ui-corner-all {
    width: 40%;
}

label.structured, label.structured20 {
    width: 20%;
    display: inline-block;
}

label.structuredLong, label.structured30 {
    width: 30%;
    display: inline-block;
}

label.structuredExtraLong, label.structured40 {
    width: 40%;
    display: inline-block;
}

label.structuredShort, label.structured10 {
    width: 10%;
    display: inline-block;
}

label.structured + input + .tagit {
    display: inline-block;
    /*margin: 0;*/
    margin-top: 0;
    vertical-align: middle;
}

@media (max-width: 600px) {
    label.structured, label.structured10, label.structured20, label.structured30, label.structured40, label.structuredShort, label.structuredLong, label.structuredExtraLong {
        /*width: 100%;*/
        display: inline;
    }
}

/* Replace all size="100%" with this */
.inputLong {
    width: 100%;
    max-width: 50em !important;
}

.inputMedium {
    width: 100%;
    max-width: 25em !important;
}

.headerUnderline{
    border-bottom: 1px solid #e0e0e0;
}

h1 i.fa, h2 i.fa, h3 i.fa, h4 i.fa, h4 i.fa, h5 i.fa, h6 i.fa {
    font-size: inherit;
}

th i.fa.fa-question-circle,
.th i.fa.fa-question-circle {
    background: #fff;
    border-radius: 1em;
    height: 1em;
    width: 1em;
    font-size: 1rem;
    text-align: center;
}

#weightChartTable td input[type="number"]{
    width:80px;
}

#weightChartTable{
    width: 30%;
    text-align:center;
}

span.ddlabel{
    overflow: hidden;
    display: block;
    word-wrap: break-word;
    text-overflow: ellipsis;
}

.ui-tabs .ui-tabs-nav {
    display: flex;
    flex-wrap: wrap;
    
}

.ui-tabs .ui-tabs-nav li.ui-tabs-active{
    padding-bottom: 0 !important;
}

.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
    padding: 0.5em;
}

.stickyElement.is_stuck {
    z-index: 6500;
}

/* Weird sticky scrolling fix */
.is_stuck + div {
    /*display: none !important;*/
}

.whiteColour{
    color: #ffffff !important;
}

.margin0{
    margin: 0 !important;
}

.padding0 {
    padding: 0 !important;
}

input#bacs_account, input#bacs_sort {
    width: 330px;
}

button#prodListButton {
    display: inline-block !important;
    position: relative !important;
}

/*FIX FOR FILE DISPLAY MODAL*/
div#mce-modal-block {
    z-index: 99999 !important;
}
.mce-window.mce-in {
    z-index: 999999 !important;
}

@media (max-width: 1024px) {

    .mce-floatpanel {
        max-width: 99% !important;
        margin: 0.5%;
    }

    .mce-window-body, .mce-foot, .mce-foot .mce-container-body {
        max-width: 100% !important;
    }

    .mce-foot .mce-container-body .mce-abs-layout {
        position: relative;
    }

    .mce-foot .mce-container-body.mce-abs-layout {
        text-align: right;
    }

    .mce-foot .mce-container-body.mce-abs-layout .mce-abs-layout-item {
        position: relative !important;
        left:  0 !important;
        margin-right: 4px;
        /*     float: right; */
    }

}

button, html input[type=button], input[type=reset], input[type=submit] {
    cursor: pointer;
}

.select2-container{
    vertical-align: middle !important;
    /*height: 35px;*/
    margin-bottom: 0.5em !important;
}

/* Fix for width overflowing */
/* https://stackoverflow.com/a/34544106 */
.select2-container {
    display: table !important;
    table-layout: fixed;
}

.width100px{
    width: 100px;
}

.mce-floatpanel.mce-fixed {
    z-index: 999999 !important;
}

#add_banner_child{
    width: 100%;
    z-index: 999999999 !important;
}

#add_banner_child img {
    width: auto;
    max-height: 200px;
    margin: 0 auto;
    position: relative;
    text-align: center;
}

#add_banner_child li {
    text-align: center;
}

#add_banner_child .ddlabel {
    font-size: 1.3em;
    font-weight: bold;
}

.shopSettings__acceptedCards .pretty {
    /*top: -20px;*/
}

.shopSettings__acceptedCards label{
    cursor: pointer;
}

.shopSettings__acceptedCards label img{
    /*width: 90px;*/
    height: 60px;
    border: 1px solid #efefef;
}

.shopSettings__acceptedCards .pretty {
    top: 4px;
    right: 4px;
    position: absolute;
    margin: 0 !important;
}

.shopSettings__acceptedCards .pretty .state label:after {
    background: #fff;
    border: 1px solid #333;
}

.shopSettings__acceptedCards .pretty .icon {
    border: 2px solid #ccc;
}

.cardLogo {
    display: inline-flex;
    align-items: center;
    position: relative;
}

.cardLogo, .cardLogo * {
    cursor: pointer !important;
}


.shopSettings__gatewayLogo {
    /*width: 200px;*/
    height: 50px;
}

.shopSettings__gatewayModeLabel {
    min-width: 10em;
}

.shopSettings__gatewayModeInput {
    display: none;
}

.shopSettings__gatewayModeBtn {
    width: 10em;
}

.shopSettings__gatewayModeBtn i {
    display: none;
}
/*.shopSettings__gatewayModeInput:checked + .shopSettings__gatewayModeBtn i {*/
/*    display: inline-block;*/
/*}*/

/*.shopSettings__gatewayModeInput:not(:checked) + .shopSettings__gatewayModeBtn .fa-square-o,*/
/*.shopSettings__gatewayModeInput:not(:checked) + .shopSettings__gatewayModeBtn .fa-circle-o {*/
/*    display: inline-block;*/
/*}*/

/*.shopSettings__gatewayModeInput:checked + .shopSettings__gatewayModeBtn .fa-check-square-o,*/
/*.shopSettings__gatewayModeInput:checked + .shopSettings__gatewayModeBtn .fa-check-circle-o {*/
/*    display: inline-block;*/
/*}*/

.shopSettings__gatewayModeInput:checked + .shopSettings__gatewayModeBtn {
    background: var(--blue_button);
}

/* Special input types */

.toggleSwitch {
    background: #e0e0e0;
    padding: 5px;
    display: inline-flex;
    align-items: stretch;
    justify-content: space-around;
    border-radius: 5px;
    max-width: 100%;
}

.toggleSwitch__label {
    background: #e0e0e0;
    padding: 5px;
    text-align: center;
    border-radius: 5px;
    cursor: pointer;
}


.toggleSwitch__input:checked + .toggleSwitch__label {
    background: var(--blue_button);
    color: var(--contrastColour);
    /*font-weight: bold;*/
}

/* This is for using an image/button etc as a checkbox/radio button (like filemanager modal) */
/* Must be linked through <input id="something" /><label for="something"></label> */

/* Hide this original checkbox/radio */
.imageRadioCheck__input {
    display: none;
}

.imageRadioCheck__label {
    cursor: pointer;
    /*border: 2px solid transparent;*/
    display: inline-block;
}

.imageRadioCheck__input:checked ~ .imageRadioCheck__label {
    /*border-color: var(--blue_button);*/
    /* Outline doesn't take space like border does */
    outline: 2px solid var(--blue_button);
}

.intl-tel-input {
    max-width: 100%;
}


.stickyPosition{
    position: sticky;
}

div#madeChanges {
    position: fixed;
    top: 15%;
    left: 65%;
    transform: translate(-65%, -50%);
    box-shadow: 0 4px 10px 3px #00000030;
}

.langChangeTable input[type="text"] {
    margin: 0;
}

.langResetBtn {
    border: none;
    width: auto;
    padding: 0;
    margin: 0;
    vertical-align: middle;
    color: #84939d;
}

#wpImportBox {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-grow: 1;
    width: auto;
    padding: 10px;
}

#wpImportBox i {
    padding: 0 10px;
}

.pretty {
    margin-bottom: 0.5em;
    margin-top: 0.5em;
}

.newsDiv {
    position: relative;
    display: block;
    height: 59px;
    margin-bottom: 1em;
    overflow: hidden;
}

div#DigiProdDropDowns {
    width: 80%;
    display: inline-block;
}

div#DigiProdDropDowns select{
    width: 100%;
}

.childProdInner, .addonProdInner {
    position: relative;
}

.bin, .trash{
    margin: 5px;
    float: right;
    width: 16px;
    height: 16px;
    background: transparent;
    position: absolute !important;
    right: 0;
    top: 0;
    z-index: 999;
    border: none;
    cursor: pointer;
}

.bin:after, .trash:after {
    content: "\f1f8";
    font-family: FontAwesome;
    color: #e24b3f !important;
}

.bin:hover:after, .trash:hover:after {
    color: #333333 !important;
}

.childProdButtonWrapper, .addonProdButtonWrapper {
    margin: 0.5em auto !important;
}

.childPrdElements + p {
    margin: 0;
}

.pure-g.gutters.childProdButtonWrapper div:first-child, .pure-g.gutters.addonProdButtonWrapper div:first-child {
    border-right: 2px solid #ececec;
}

ul.childProdList li {
    display: inline-block;
    border: 1px solid #E0E0E0;
    margin: 0.3em;
    padding: 0.3em;
    border-radius: 2px;
    border-bottom: 2px solid #E0E0E0;
}

ul.childProdList {
    margin: 0;
    padding: 0;
}

ul.childProdList li:hover {
    border-bottom: 2px solid #84939d;
}

ul.childProdList li a {
    text-decoration: none;
}

.productEditor__priceInput {
    /*margin: 0 !important;*/
    margin-bottom: 0 !important;
    margin-top: 1em !important;
}

.productEditor__profitNote {
    display: inline-block;
    vertical-align: middle;
    float: right;
}

.productEditor__categorySelectHolder {
    border-right: 1px solid #ccc;
}

.productEditor__imagesRow {
    display: flex;
    align-items: center;
}

.productEditor__imagesWrapper {
    /* display: inline-block; */
    /* vertical-align: middle; */
    flex: 1;
}

.productEditor__imagesList {
    /*display: flex;*/
    /*flex-wrap: wrap;*/
    display: block;
    list-style-type: none;
    margin: 0;
    padding: 0;
    
    margin-left: -20px; /* Needed to offset for the bit below */
}

.productEditor__imagesList::before {
    /* This just adds extra space at the start of the list to make it easier to drop an image at the start */
    content: '';
    width: 20px;
    height: 100px;
    /* display: block; */
    float: left;
}

.productEditor__imagesList li {
    margin: 1px;
    padding: 0;
    width: 100px;
    height: 100px;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #d3d3d3;
    background-color: white;
    position: relative;
    float: left;
}


.productEditor__imagesList .productEditor__image .productEditor__imageThumb {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
}

.productEditor__imageCheck {
    position: absolute;
    top: 2px;
    right: 2px;
    margin: 0;
}

.productEditor__image:hover {
    cursor: move;
}

.productEditor__image:active {
    box-shadow: 3px 4px 8px rgba(129, 129, 129, 0.5);
    margin-top: -1px;
    margin-left: -1px;
}

.productEditor__image:hover {
    cursor: move;
}

.productEditor__imageBtn {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
}

.productEditor__imageBtn {

}

.productEditor__imageListWarning {
    display: none;
}
.productEditor__imageListWarning--shown {
    display: block;
}


.productEditor__variantsWrapper {

}

.productEditor__variantsWrapper input, .productEditor__variantsWrapper select, .productEditor__variantsWrapper button, .productEditor__variantsWrapper .tagit  {
    margin: 0 !important;
}

.productEditor__variantsWrapper input, .productEditor__variantsWrapper button {
    margin: 0 !important;
}

.productEditor__variantProductsTable .fileManagerInput__img {
    width: 50px;
    height: 50px;
    object-fit: cover;
}

.productEditor__variantProductsTable .fileManagerInput__img[src=''] {
    display: none;
}


.dragHandle, .handle {
    cursor: move !important;
}

textarea#sourceText, pre#sourceText {
    width: 100%;
    height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
}

.shopImgModal {
    width: 1024px;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 100000000;
}

.shopImgContainer {
    /*display: flex;*/
    /*flex-wrap: wrap;*/
    /*justify-content: space-around;*/
    /*overflow: auto;*/
}


.shopImgModalInner {
    display: flex;
    flex-direction: column;
    border: 1px solid #efefef;
}

.shopImgModalInner .ui-tabs-nav {
    flex-shrink: 0;
}


.shopImgModalSectionInner {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    /*height: 550px;*/
    height: 100%;
}

.shopImgModalSectionInner__content {
    height: 100%;
    overflow: auto;
    display: block;
    border: 1px solid #eee;
}

.shopImgModalSection {
    height: 100% !important;
    overflow: auto;
}

/*div#shopImgModal__viewFiles {
    height: auto;
    overflow: auto;
}*/

form.shopImgModal__form {
    height: 100%;
}

.shopImgUpload__dropzone {
    height: 100%;
}

/************/
/* DROPZONE */
/************/

form.dropzone {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    border: 2px dashed #357fbb;
    background: #efefef;
    flex-wrap: wrap;
}

.dz-default.dz-message {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.dz-default.dz-message:before {
    content: "\f019";
    display: block;
    font-family: FontAwesome;
    font-size: 2em;
    margin: 5px;
}

.dropzone--small .dz-default.dz-message {
    font-size: 1.5em;
    margin: 1em 0;
    flex-direction: row;
}

.dropzone--small .dz-default.dz-message:before {
    font-size: 2em;
    display: inline-block;
}

.dz-default.dz-message {
    font-size: 2em;
}

body .dropzone .dz-preview .dz-progress .dz-upload {
    background-color: #333 !important;
    background-image: linear-gradient(
            -45deg,
            rgba(255, 255, 255, 0.2) 25%,
            transparent 25%,
            transparent 50%,
            rgba(255, 255, 255, 0.2) 50%,
            rgba(255, 255, 255, 0.2) 75%,
            transparent 75%,
            transparent
    ) !important;
    background-size: 32px 32px;
    animation: progressBarStriped 2s linear infinite;
}

@keyframes progressBarStriped {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 32px 32px;
    }
}

body .dropzone .dz-preview .dz-details .dz-filename {
    margin-top: 40px !important;
}

body .dropzone .dz-processing:not(.dz-error, .dz-complete) .dz-details::after {
    content: 'Uploading. Please wait';
    font-size: 11px;
    /* padding-top: 32px; */
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
}

/*.shopImgModal__form .dz-error-mark path {*/
.shopImgModal__form path {
    stroke: white;
    fill: #333;
}

.shopImgModal__form .dz-error-mark g {
    fill-opacity: 1;
}

.dz-preview.dz-image-preview.dz-error.dz-complete:before {
    content: '';
    display: block;
    height: 120px;
    width: 120px;
    background: rgba(255,255,255,0.5);
    position: absolute;
    z-index: 100;
}

.shopImgModal__label {
    cursor: pointer;
}

.shopImgModal__label img {
    border: 1px solid #eee;
}

.shopImgModal__checkbox {
    display: none;
}

.shopImgModal__checkbox:checked + .shopImgModal__label img {
    border-color: #00b7f1;
}

.shopImgModal__imgInner {
    border: 1px solid #efefef;
}

.shopImgModal__checkbox:checked + .shopImgModal__imgInner {
    border-color: #00b7f1;
}

.shopImgModal__imgHolder {
    float: left;
    margin: 4px;
    box-sizing: content-box;
    overflow: hidden;
    position: relative;
}
.flexImages .shopImgModal__imgHolder img {
    display: block;
    width: auto;
    height: 100%;
}

.shopImgModal__caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition-duration: 0.3s;
    background-image: linear-gradient(to top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}

.shopImgModal__caption p {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.shopImgModal__imgHolder:hover .shopImgModal__caption {
    bottom: 0;
}

.shopImgInner {
    width: 100%;
    max-width: none;
    height: 100%;
    max-height: none;
    margin: 0;
}

.shopImgInner {
    display: block;
    max-height: 100%;
    height: 100%;
}


.shopImgModal__buttonHolder {
    padding: 1em;
}


.is-loading {
    background-color: #fff !important;
    background-image: url('/public/images/loading_ring.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 32px;
}

.is-broken {
    background-image: url('/public/images/broken_image.png');
    background-color: #be3730 !important;
    width: 120px;
    background-repeat: no-repeat;
    background-position: center;
}
.is-loading img,
.is-broken img {
    opacity: 0;
}

a.noHrefIcon:after {
    content: "" !important;
    padding-left: 0 !important;
    font-size: 0 !important;
    vertical-align: unset !important;
    display: none;
}


/**************************
****** Shop Categories page
**************************/

.shopCatWrapper {
    display: flex;
}

.shopCatEditorWrapper {
    width: 60%;
    flex-grow: 1;
}

.shopCatWrapper .btn {
    margin: 0;
}

.shopCatList_newLink {
    padding: 1em;
    font-size: 0.8em;
    border: 0;
}

.shopCatList__editLink:hover, .shopCatList_newLink:hover {
    text-decoration: none;
}

.shopCatListWrapper {
    width: 30%;
    flex-grow: 1;
    padding: 1em;
    padding-left: 0;
}


.shopCatEditorWrapperInner {
    padding: 1em;
    border-left: 1px solid #ccc;
}

.shopCatList.ui-accordion {
    width: 100%;
    padding: 0;
}

ul.subCatList {
    padding-left: 5px !important;
    margin-left: 2em;
    border-left: 2px solid #00b7f1 !important;
}

.shopCatListLi {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 2px 0;
    padding-right: 1em;
}

.shopCatListInner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: calc(100% - 2em);
}

.shopCatListInner .dragHandle {
    flex-shrink: 0;
}

.shopCatListInner .note {
    padding: 0 5px;
}

.shopCatListLi label {
    margin-right: 1em;
}

.shopCatList h3,
.shopCatList h4 {
    margin: 0;
    display: flex;
    flex-grow: 1;
    align-items: center;
}

.shopCatList a {
    display: inline-flex;
    align-items: center;
}

a.shopCatList__editLink {
    flex-grow: 1;
}

a.shopCatList__editLink:hover {
    background: #f7f7f7;
    text-decoration: none;
}

.shopCatListLi .noHrefIcon {
    text-decoration: none;
    cursor: pointer;
}

.shopCatList a.smallList{
    display: initial !important;
}


.shopCatList__img {
    width: 75px;
    height: 75px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    margin-right: 1em;
}

.shopCatList__name {
    font-size: 0.8em;
    margin-right: 1em;
    max-width: 65%;
}

.shopCatList__name, .shopCatList__note {
    text-decoration: none;
    color: #333333;
    border-bottom: 3px solid transparent;
}

li.shopCatListAdd a {
    margin: 0;
}



a.shopCatList__newLink {
    width: 100%;
    background: #EFEFEF !important;
    color: #141414 !important;
    border: 1px solid transparent !important;
    justify-content: center;
    font-size: 1em !important;
    /*padding: 0 !important;*/
    text-align:  center;
    margin: auto !important;
    margin-top: 1em;
}

a.shopCatList__newLink:hover {
    border: 1px solid transparent !important;
    color: #333333 !important;
    background: #cccccc !important;
}

.shopCatList__desc {
    position: absolute;
    left: 0;
    right: 0;
    display: none;
    top: 100%;
    background: #fff;
    z-index: 1;
    border: 1px solid #ccc;
}

.shopCatList__descIcon:hover + .shopCatList__desc {
    display: block;
}

.shopCatList i.filterDropArrow {
    margin: 0;
    margin-left: 1em;
    /*padding: 0.5em;*/
    padding: 0;
    flex-grow: 0;
    text-align: left;
    
    background: none !important;
    border: none !important;
    color: #333;
}

.filterDropArrow:focus {
    border: 0;
    outline: 0;
    box-shadow: none !important;
}

.shopCatList .filterDropArrow:before {
    transition: transform 0.2s;
    display: inline-block;
    width: 1em;
    height: 1em;
}

.shopCatList .filterDropArrow.ui-state-active:before {
    transform: rotate(90deg);
}

.shopCatList .filterDropArrow .ui-icon {
    display: none;
}

@media (max-width: 800px) {
    
    
    .shopCatListWrapper, .shopCatEditorWrapper {
        display: none;
    }
    
    .shopCatWrapper--list .shopCatListWrapper {
        display: block;
    }
    
    .shopCatWrapper--edit .shopCatEditorWrapper {
        display: block;
    }
    
    .shopCatEditor__imageHolder {
        display: none;
    }
    
    .shopCatEditorWrapperInner {
        border-left: 0;
    }
    
}

.shopCatEditor .select2-selection--single {
    height: 100% !important;
}
.shopCatEditor .select2-selection__rendered{
    word-wrap: break-word !important;
    text-overflow: inherit !important;
    white-space: normal !important;
}

.filterHeader {
    cursor: pointer;
}

.shopCatList.ui-widget.ui-widget-content {
    border: none;
}

.dragHandle {
    display: none;
    margin-right: 0.5em;
}

.ui-sortable .dragHandle {
    display: inline-block;
}

.dragHandle img {
    width: 2em;
    height: 2em;
}

.fa-grab-handle:before, .fa-grab-handle:after {
    content: "\f142";
    margin: 1px;
    font-size: 1.5em;
    color: #666;
}

button.shopCatList__sortDoneBtn {
    display: none;
}


.shopCatList__checkbox {
    display: none;
}

.shopCatList__checkbox:checked + li {
    background: #ccc;
}

.fa-square-o:before {
    /*content:"\f046";*/
}


.shopCatList__checkbox:checked + li > div > label > .fa-square-o:before {
    content:"\f046";
}


.shopCatList__controlsWrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
}

.shopCatList__controlsAccordion {
    margin: 1em 0;
}

.shopCatList__controlsActionsSelect {
    margin: 0;
}

.shopCatList__controlsActions {
    margin-top: 2em;
    display: flex;
    flex-wrap: wrap;
    justify-content:  space-between;
}


.shopCatEditor__formInner {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

.shopCatEditor__imageHolder {
    margin-left: auto;
    padding-left: 1em;
}

.shopCatEditor__formInnerWrapper {
    display: flex;
}

.shopCatEditor__inputHolder label {
    width: 10em;
    display: inline-block;
}

.shopCatEditor__inputHolder {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    margin-bottom: 0.5em;
}

.shopCatEditor__inputHolder .select2 {
    max-width: 100%;
    /*width: 100%;*/
    flex: 1;
    min-width: 200px;
}

.shopImgModal.is_stuck + div {
    display: none !important;
}

.shopImgsTable__counterList {
    display: none;
    position: absolute;
    background: #fff;
    padding: 0.5em 1.5em;
    border: 1px solid #ccc;
}

.shopImgsTable__counterList li {
    margin-bottom: 0;
}

.shopImgsTable__counter:hover + .shopImgsTable__counterList {
    display: block;
}
.ui-front {
    z-index: 99999999;
}

.fixedCenter {
    position: fixed;
    top: 50%;
    left: 58%;
    transform: translate(-50%, -50%);
    z-index: 999999;
}

.fieldsetAuto {
    display: inline-block;
    width: auto;
}




ul#adminNav li a#upgradePopup, ul#adminNav li a#trialPopup, ul#adminNav li a#reviewNav {
    color: #00B7F1 !important;
    font-weight: bold;
}

ul#adminNav li a#upgradePopup:hover, ul#adminNav li a#trialPopup:hover, ul#adminNav li a#reviewNav:hover {
    color: #ffffff !important;
    font-weight: bold;
}



#sidebarSearchInput {
    display: none;
    width: 90%;
    margin: 0 5%;
    box-sizing: border-box;
}

.hideNext + * {
    display: none !important;
}

.stickyFooter {
    position: fixed;
    bottom: -100%;
    left: var(--mainSidebarWidth);
    width: 100%;
    background: #fff;
    box-shadow: 0 -2px 10px rgba(0,0,0,0.5);
    transition-property: bottom;
    transition-duration: 0.2s;
    z-index: 6500;
}

.wrapper.hasStickyFooter .footer {
    padding-bottom: 5em;
}

.stickyFooter.stuck {
    bottom: 0;
}

.stickyFooter button,
.stickyFooter input {
    margin: 5px;
}

.prodPageInputs{
    display: inline-block;
    width: 75%;
}

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

.productChildProductLink {
    background: #efefef;
    padding: 10px;
    margin: 5px;
    text-decoration: none;
    max-width: 18%;
    min-width: 120px;
    text-align: center;
}


.flexAlignCenter {
    display: flex;
    align-items: center;
}

.flexAlignBaseline {
    display: flex;
    align-items: baseline;
}

.flexAlignTop {
    display: flex;
    align-items: flex-start;
}

.flexAlignBottom {
    display: flex;
    align-items: flex-end;
}

.pure-g.shopImgSize__imageRow {
    margin-bottom: 1em;
}

.shopImgSize__sizeLabel {
    width: 3em;
    display: inline-block;
}

td.ui-datepicker-today .ui-state-default.ui-state-highlight {
    width: 100%;
    margin: 0;
    font-weight: bold;
    border: 1px solid #dad55e !important;
    background: #fffa90 !important;
}

.prodImg-select-mark {
    pointer-events: none;
    opacity: 0;
    z-index: 500;
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    margin-left: -27px;
    margin-top: -27px;
}

.prodImg-select-mark svg path {
    fill: #00b7f1;
    stroke: #0e76bc;
}

.shopImgModal__checkbox:checked + .shopImgModal__label .prodImg-select-mark{
    opacity: 100;
}

.ui-tooltip{
    word-wrap: break-word;
}

.ui-widget .ui-tooltip-content a {
    color: var(--brandColour);
}

#fileSearch{
    padding: 0.7em;
    margin-top: 0;
}

li.sidebarLiHide {
    display: none;
}

.stickySidebar {
    height: 100vh !important;
    overflow-y: auto;
}

.accordianMenu .select2.select2-container, #BcatSelect {
    min-width: 100%;
}

.featured_ribbon {
    position: absolute;
    height: 64px;
    width: 0;
    padding: 0;
    background-color: rgba(0,0,0,0);
    border-radius: 0;
    right: 8px;
    top: 0;
    -webkit-transform: rotate(0deg) skew(0deg);
    transform: rotate(0deg) skew(0deg);
    border-top: 13px #B55B16;
    border-left: 15px solid #B55B16;
    border-right: 15px solid #B55B16;
    border-bottom: 15px solid rgba(0,0,0,0);
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.contentEditor__topBoxesInner .featuredPost .fa {
    font-size: 1.3em !important;
    color: #ef9d22 !important;
}

.contentEditor__topBoxesInner .featuredPost {
    font-size: 0.9em;
}

.contentEditor__topBoxesInner .fa-floppy-o {
    position: relative;
}
.contentEditor__topBoxesInner .fa-floppy-o:after {
    content: '!';
    font-size: 0.5em;
    font-weight: bold;
    width: 1em;
    height: 1em;
    background: red;
    color: #fff;
    border-radius: 100%;
    border: 4px solid #fff;
    position: absolute;
    /* top: 0; */
    bottom: -4px;
    /* left: 0; */
    right: -4px;
}

.linkedInHelpLink {
}

.linkedInHelp {
    position: absolute;
    top: auto;
    left: auto;
}

/* Strange FB injected element */
html > iframe#facebook-jssdk-iframe {
    display: none;
}




.tinymceFullscreenNotice {
    position: fixed;
    top: 50px;
    right: 10px;
    z-index: 99999;
    background: rgba(0,0,0,0.5);
    color: #fff;
    padding: 1em;
    border-radius: 5px;
}

.tinymceFullscreenNoticeBtn {
    display: block;
    color: #fff;
    margin: auto;
}


#update-modal ul li p {
    margin: 0;
    padding: 0 !important;
}

form#displaySettingsCategory a {
    text-decoration: underline;
}


.currInputHolder {
    display: flex;
    align-items: baseline;
}

.currInputHolder input {
    flex: 1;
    width: 100%;
}

.tr.postageRow {
    padding-top: 1em;
    padding-bottom: 1em;
}

.postageRow--error, .postageInputError {
    border: 2px solid red !important;
}

.tableRowPlaceholder {
    display: none !important;
}

div.shopSettings__dragColumn {
    display: flex;
    align-items: flex-start;
}

.postageBasicInput {
    height: 2.1em;
    width: 100%;
}

button.postageRow__button {
    padding: 0.5em;
}

button.postageRow__button i {
    font-size: 1em;
}

.postageRow__dragHandle {
    display: block;
}

.postageRow__dragHandle .fa-grab-handle {
    line-height: 2em;
}

.postageLocationRow__mapWrapper--hidden {
    visibility: hidden;
    position: absolute;
}

.postageLocationRow__mapInputHolder {
    display: flex;
    align-items: baseline;
}

.postageLocationRow__address {
    flex: 1;
    margin-left: 0.5em;
}

/*.shippingRestrictionsWrapper {
    display: flex;
    align-items: center;
}*/
.shippingRestriction {
    display: inline-block;
}

.shippingRestriction input + .tagit {
    margin-top: 0;
    display: inline-block;
    vertical-align: middle;
}

.shippingRestriction .select2 {
    width: auto !important;
}

.chartRow__valueInput {
    vertical-align: baseline;
}

.chartRow__valueBefore {
    display: inline-block;
    width: 3em;
}

.konamiDiv, .sparkley {
    z-index: 999999999999;
}

div#selectables ul li span.tagit-label:before {
    /*content: "\f0da";*/
    content: "\f217";
    font-family: FontAwesome;
    margin-right: 0.3em;
    font-weight:bold;
}

div#selectables ul.tagit {
    width: 80%;
    display: inline-block;
    vertical-align: bottom;
}

div#selectables {
    display: inline-block;
}

table.addonProdTable > tbody > tr > td:first-child {
    font-weight: bold;
}

.x-small{
    font-size: 0.6em;
}

.x-smallButton {
    font-size: 0.7em !important;
}

a.noafter[target=_blank]:after, a.noafter[target=blank]:after{
    content: "";
}

table#prodTable .productChildProductLink {
    background: transparent;
    min-width: auto;
    margin: 0;
}

.quantityControl, .quantitySelectable{
    display: inline-block;
}

/* Changed an `<input onclick />` to an <a> so correct the styling */
a.editProfileHeaderBtn:link,
a.editProfileHeaderBtn:visited {
    color: #fff !important;
    font-weight: normal;
}

a.editProfileHeaderBtn:link:hover {
    color: #00b7f1 !important;
}

.no-line { text-decoration: none !important; }


  /******************/
 /** Support page **/
/******************/

.supportTutorialsWrapper {
    /*max-height: 300px;*/
    /*overflow: auto;*/
}

.supportTutorialVideo {
    /*width: 230px;*/
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 5px;
    position: relative;
    margin-top: 1em;
}

.supportTutorialVideoLink {
    cursor: pointer;
    display: block;
}

.supportTutorialVideoLink::after {
    display: none;
}

.supportTutorialVideoImg {
    width: 100%;
}

.supportTutorialVideoTitle {
    text-align: left;
    padding: 5px;
    padding-top: 0;
    margin: 0;
    font-size: 1.1em;
    color: inherit;
}

.supportTutorial__showMoreBtn {

}

.supportKnowledgebaseIframe {
    flex: 1;
    /*flex-basis: 800px;*/
    flex-basis: 400px;
}

.supportFacebookEmbed {
    flex: 0;
    flex-basis: 400px;
    max-width: 100%;
}

iframe.support-iframe {
    width: 860px;
    max-width: 100%;
}


  /***********************/
 /** Support log page **/
/*********************/


.supportSubForm {
    display: none;
}


.supportPercentBar {
    position: relative;
    padding: 0.5em;
    border: 1px solid #999;
    border-radius: 5px;
    overflow: hidden;
}

.supportPercentBarInner {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 0;
    
    transition: width, background-color;
    transition-duration: 1s;
}

.supportPercentBarInner--0 {
    background-color: rgb(197, 255, 0);
}

.supportPercentBarInner--40 {
    background-color: rgb(241, 255, 77);
}

.supportPercentBarInner--60 {
    background-color: rgb(255, 152, 55);
}

.supportPercentBarInner--80 {
    background-color: rgb(243, 86, 51);
}

.supportPercentBarInner--90 {
    background-color: rgb(255, 0, 0);
}

.supportPercentBarText {
    position: relative;
}


.supportLogEntry {
    background: transparent;
    margin-top: 1em;
}

.supportLogEntry td {
    padding: 1em 0;
}

.supportLogEntry__header {
    display: flex;
    justify-content: space-between;
    padding: 0.5em;
    background: #00b7f1;
    border-radius: 3px 3px 0 0;
}

.supportLogEntry__body {
    padding: 1em;
    background: #fff;
    display: flex;
    align-items: center;
}

.supportLogEntry__messageWrapper {
    flex: 1;
}


.supportLogEntry--old {
    display: none;
}

.supportPercentValues {
    display: none;
}


.supportLog__monthHeader {
    display: flex;
    align-items: center;
    background: transparent;
}

.supportLog__monthHeader::before, .supportLog__monthHeader::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #000;
}

.supportLog__monthHeaderInner {
    padding: 0.5em 1em;
    cursor: pointer;
}



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

.supportAddSupport__inputHolder--message {
    width: 100%;
}

.supportAddSupport__inputHolder--message textarea {
    width: 100%;
    height: 6em;
}

.supportAddSupport__inputHolder--submit {
    width: 100%;
    text-align: right;
}



.newRowFadeIn {
    animation-name: newRowFadeIn;
    animation-delay: 0.5s;
    animation-duration: 1s;
    animation-fill-mode: both;
}

@keyframes newRowFadeIn {
    from {
        background: #ccc;
    }
    to {
        background: #fff;
    }
}

.CodeMirror-wrap pre {
    word-break: break-word !important;
}

table#ordertbl tr {
    border-bottom: 0;
}

table#ordertbl tr.itemRow, table#ordertbl td.detailRow {
    border-bottom: 1px solid #ECECEC;
}

table#customerDeets tr, table#deliveryDeets tr, table#giftAidDeets tr {
    border-bottom: 0;
}

table#customerDeets td:nth-child(1), table#deliveryDeets td:nth-child(1), table#giftAidDeets td:nth-child(1) {
    border-bottom: 1px solid #ececec;
}

.smallNoticeBox a {
    text-decoration: underline !important;
}

img.supportTutorialVideoImg {
    transition: .3s all ease-in-out;
}

img.supportTutorialVideoImg:hover {
    filter: opacity(0.5);
    transition: .3s all ease-in-out;
}

.overlayDark {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(51, 51, 51, 0.90);
    /*z-index: 200000;*/
    z-index: 2000000001;
}

.shopSettingsTabContent {
    padding: 1em !important;
}

.shopSettingsTabContent .shopSettingsSaveBtn {
    width: auto !important;
    bottom: auto !important;
    position: absolute;
    top:0;
    right: 0;
}

@media (max-width: 600px) {
    .shopSettingsSaveBtn {
        /*float: none;*/
        /*clear: both;*/
        position: relative !important;
    }
}

.shopSettingsTabContent form {
    position: relative;
}

.shopSettings__gatewaySetupGuide a {
    color: #00b7f1 !important;
}

.shopSettings__gatewaySetupGuide a i {
    font-size: 0.8em;
}

img.galleryImgThumb {
    width: 100%;
    height: 220px;
    object-fit: contain;
}

.galleryDeleteCheckboxHolder{
    position: absolute;
    right: 0;
}
.photoDeleteCheckIcon{
    vertical-align: middle;

}
.galleryCoverRadio{
    position: absolute;
    left: 45%;
    vertical-align: middle;
}
/*.showGalSettingsBtn {
    position: relative;
    left: .2em;
    bottom: .2em;
}*/

.galleryCaptionTextarea {
    width: 100%;
    resize: vertical;
    max-height: 150px;
    overflow: auto !important;
}


.pure-g.pure-v-borders .pure-u-1 {
    border-left: 1px solid #ccc;
}

.pure-g.pure-v-borders .pure-u-1:first-child {
    border-left: none;
}


.mfp-wrap .mfp-exifViewer .mfp-content {
    max-width: 100%;
}

/* Magnific doesn't display SVGs correctly if they don't have width attributes so add min-width just for SVGs*/
.mfp-img[src$=".svg"] {
    min-width: 200px;
    min-height: 200px;
}

/* jQuery UI Widget */

.ui-widget.ui-dialog {
    padding: 0;
}

.ui-widget.ui-dialog .ui-dialog-buttonpane {
    padding: 0;
}

.ui-dialog:focus {
    box-shadow: none !important;
}

.ui-widget.ui-dialog .ui-dialog-titlebar {
    background: #333;
    color: #fff;
}

.convertImg img{
    vertical-align: bottom;
    cursor: pointer;
}

.create-webp-copy-on-upload label {
    color: #4496da;
    font-weight: bold !important;
}

.overwrite-existing-files label {
    color: #e24b3f;
    font-weight: bold !important;
}

.createSqThumb i.fa{
    cursor: pointer;
}

.seoWrapper {
    margin: 0 auto;
    width: 1024px;
    max-width: 100%;
}

.seoPanel {
    text-align: center;
    min-height: 300px;
    border: 5px solid #00b7f1;
    border-radius: 3px;
    margin-bottom: 1em;
    position: relative;
    overflow: hidden;
    background: #ffffff;
    height: 100%;
}

.seoPanel:hover {
    box-shadow: 0 0 6px rgba(0, 0, 0, .3);
}

.seoPanel img {
    margin-top: 1em;
}

.seoPanel div{
    width: 90%;
    margin: 1em auto;
    /*font-size: 0.9em;*/
}

.lazyLoadWrapper {
    min-height: 0;
    /*margin-top: 1em;*/
}

.lazyLoadForm div {
    width: auto;
    margin: 0;
}

.backgroundLightGrey {
    background: #fbfbfb;
}

a.noUnderline {
    text-decoration: none !important;
}

table#uploadedFiles tr.backgroundLightGrey {
    color: #808080;
}

a.imgType img {
    max-height: 150px;
}

.ui-draggable.ui-draggable-dragging {
    z-index: 1000;
}


/*
/////////////////////////////////
///////// CSS VARIABLES
// Inherited from system type (eg. branding-instantecom.css)
/////////////////////////////////
*/


.tinymceIsFullscreen .nav-new {
    z-index: 0;
}

body.moduleSidebarShown .wrapper {
    --mainWidth: calc(100% - var(--sidebarWidthUnopen) - var(--moduleSidebarWidth));
}

body.moduleSidebarHidden {
    --moduleSidebarWidth: var(--moduleSidebarWidthClosed);
}

.adminSidebar, .wrapper {
    --mainSidebarWidth: var(--sidebarWidthUnopen);
}

/*.adminSidebar:hover,*/
.adminSidebar--open,
.adminSidebar--pinned + .wrapper /* Only change wrapper width for pinned, otherwise overlap */ {
    --mainSidebarWidth: var(--sidebarWidthOpen);
    --mainWidth: calc(100% - var(--mainSidebarWidth));
}

.isMobile .wrapper, .isMobile .adminSidebar {
    --sidebarWidthUnopen: 0px;
    --sidebarWidthOpen: clamp(200px, 400px, 100vw);
    --mainWidth: calc(100% - var(--moduleSidebarWidth));
    /*--mainWidth: 100%;*/
    max-width: var(--mainWidth);
}

.isMobile .wrapper {
    --mainWidth: calc(100% - var(--moduleSidebarWidthClosed)) !important;
}

.isMobile .adminSidebar {
    max-width: 100%;
}

.adminSidebar__mobileOverlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,0.5);
    z-index: -1;
    display: none;
}

.adminSidebar--open .adminSidebar__mobileOverlay {
    display: block;
}


a#pinMenu.adminSidebar--pinned {
    transform: rotate(45deg);
}

.adminSidebar__hideSmall {
    max-width: 0 !important;
    max-height: 0;
    overflow: hidden;
}

/*.adminSidebar:hover .adminSidebar__hideSmall,*/
.adminSidebar.adminSidebar--open .adminSidebar__hideSmall {
    /*display: none !important;*/
    max-width: 100% !important;
    max-height: 100%;
}

.adminSidebar__hideSmall.adminSidebar__linkText {
    /* We only want to modify the transition delay of font-size to help transition when opening/closing but leave color as 0s */
    transition-property: font-size, color;
}

/* The text shown when open needs to be delayed until transition finishes so it doesn't cause the icons to jump */
/*.adminSidebar:hover .adminSidebar__hideSmall.adminSidebar__linkText,*/
.adminSidebar.adminSidebar--open .adminSidebar__hideSmall.adminSidebar__linkText {
    transition-delay: var(--sideBarTransitionDuration), 0s !important;
    /*max-width: var(--sidebarWidthOpen) !important;*/
    font-size: 1em;
}
/* Hiding the text needs to happen before the transitions so it doesn't cause the icons to jump */
.adminSidebar__hideSmall.adminSidebar__linkText  {
    transition-delay: 0s;
    font-size: 0;
}


/*.adminSidebar:hover .adminSidebar__hideSmall,*/
/*.adminSidebar--open .adminSidebar__hideSmall {*/
/*    display: block !important;*/
/*}*/

/*.adminSidebar--open + .wrapper {*/
/*    margin-left: 250px;*/
/*    width: calc(100% - 250px);*/
/*}*/

.wrapper {
    width: var(--mainWidth);
}

.adminSidebar {

    min-height: calc(100vh - var(--topbarHeight));
    box-sizing: border-box;
    position: fixed;
    /* top: $topbarHeight; */
    top: var(--topbarHeight);
    bottom: 0;
    left: 0;
    width: var(--mainSidebarWidth);

    background-color: var(--mainSidebarBG);
    --logoHeight: 65px;
    transition-duration: var(--sideBarTransitionDuration);
    --sidebarIconWidth: 2.5em;

    font-weight: bold;

    z-index: 10;

    box-shadow: -2px 0 5px #333;
    /*display: flex;*/
    /*flex-direction: column;*/

}



.adminSidebarInner {
    position: relative;
    height: 100%;
    /*overflow: auto;*/
}

.adminSidebar:not(:hover):not(.adminSidebar--open) .adminSidebarInner {
    margin-left: 0 !important;
}

.adminSidebar__logoHolder {
    background: var(--mainSidebarLogoBG);
    display: flex;
    align-items: center;
    justify-content: center;
    height: var(--logoHeight);
}

.adminSidebar__logoLink  {
    display: contents;
}

.adminSidebar .productLogo,
.adminSidebar .productLogoSmall {
    position: absolute;
    /*left: 0;*/
    opacity: 0;
    padding: 5px !important;
    max-height: 65px !important;
}

/*.adminSidebar .productLogo {*/
/*    position: absolute;*/
/*    left: 0;*/
/*    opacity: 0;*/
/*    padding: 0 !important;*/
/*    height: 30px !important;*/
/*}*/

/*.adminSidebar .productLogoSmall {*/
/*    position: relative;*/
/*    height: 30px !important;*/
/*}*/

.adminSidebar .productLogoSmall {
    opacity: 1;
}

/*.adminSidebar:hover .productLogo,*/
.adminSidebar--open .productLogo {
    opacity: 1;
}
/*.adminSidebar:hover .productLogoSmall,*/
.adminSidebar--open .productLogoSmall {
    opacity: 0;
}
.adminSidebar__item {
    /*overflow: hidden;*/
}

.adminSidebar__item--hidden {
    display: none !important;
}

.adminSidebar__list {
    /*max-height: calc(100vh - var(--topbarHeight) - var(--logoHeight) - 35px);*/
    /*overflow: auto;*/
}

.adminSidebar {
    /*--mainSidebarBG: var(--mainSidebarBG);*/
}

.adminSidebar__section--level1,
.adminSidebar__section--level0 .adminSidebar__link--sectionOpen {
    --mainSidebarBG: var(--mainSidebarBG_1);
}

.adminSidebar__section--level2,
.adminSidebar__section--level1 .adminSidebar__link--sectionOpen {
    /*--mainSidebarBG: #333333;*/
    --mainSidebarBG: var(--mainSidebarBG_2);
}

.adminSidebar__section--level3,
.adminSidebar__section--level2 .adminSidebar__link--sectionOpen  {
    --mainSidebarBG: var(--mainSidebarBG_3);
}

.adminSidebar__section--level4 {
}

.adminSidebar__section {
    /*position: absolute;*/
    /*top: 0;*/
    /*bottom: 0;*/
    /*left: var(--sidebarIconWidth);*/
    /*left: 100%;*/
    /*right: 0;*/
    /*display: none;*/
    /*width: var(--mainSidebarWidth);*/
    background: var(--mainSidebarBG);
    /*transition-property: left;*/
    transition-duration: var(--sideBarTransitionDuration);

    /*opacity: 0;*/

    overflow: auto; /* unsure why this is hidden anyway? */ /* Probably to stop sections overflowing when the sidebar is close/shrunk but not sure if still needed */

    z-index: 1;
    position: fixed;
    top: calc(var(--topbarHeight) + var(--logoHeight));
    bottom: 0;
    left: calc(var(--mainSidebarWidth) * -1);
    right: auto;
    width: 0;
    max-width: 100%;
}

.adminSidebar__section--open {
    /*display: block;*/
    /*opacity: 1;*/
    left: var(--sidebarIconWidth);
    width: calc(var(--mainSidebarWidth) - var(--sidebarIconWidth));
}

.adminSidebar__section--child_open {
    left: 0;
}

.adminSidebar__section--current {
    overflow: auto;
}

.adminSidebar__section--level0 {
    left: 0;
    width: var(--mainSidebarWidth);
}

.adminSidebar__link--sectionOpen {
    background: var(--mainSidebarBG);
}

#adminSidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
    transition-duration: 0s;
}
#adminSidebar li {
    margin: 0;
}

.adminSidebar__link {
    display: flex;
    align-items: center;
    padding: 0.5em 0;
    text-decoration: none !important;
    color: var(--mainSidebarText) !important;
    /*transition: .3s all;*/
    /*transition: none !important;*/
}

.isMobile .adminSidebar__link {
    padding: 10px 0;
}

#adminSidebar .adminSidebar__link:hover {
    /* Needs id to make it more specific than .adminSidebar__accordionHeader--open .adminSidebar__link */
    background: var(--contentMenuSelected);
    transition: .3s all ease-in-out;
    color: var(--contentMenu) !important;
}

.adminSidebar__accordionHeader {

}

.adminSidebar__accordionHeader--open {
    color: var(--brandColour);
}

.adminSidebar__accordionHeader--open .adminSidebar__link {
    color: var(--brandColour) !important;
}

.adminSidebar__accordionItem {
    display: none;
}

.adminSidebar__link--active,
.adminSidebar__link--sectionOpen {
    color: var(--brandColour) !important;
    font-weight: bold !important;
}

.adminSidebar__link--separator {
    font-weight: bold !important;
    /* border-bottom: 1px solid; */
    border-top: 1px solid;
}

.adminSidebar__link--blue {
    color: var(--brandColour) !important;
}
.adminSidebar__link--bold {
    font-weight: bold !important;
}

/*.adminSidebar__link--sub {*/
/*    padding: 0.5em;*/
/*}*/

/* Don't show target icon when sidebar shrunk */
.adminSidebar:not(:hover):not(.adminSidebar--open) .adminSidebar__link::after {
    display: none;
}

.adminSidebar__icon {
    width: var(--sidebarIconWidth);
    text-align: center;
    /*font-size: 1.2em !important;*/
    position: relative;
}

.adminSidebar__icon--active {

}
.adminSidebar__icon--inactive {

}

.adminSidebar__icon--inactive::after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 1.5em;
    height: 2px;
    background: red;
    transform: rotate(-45deg);

    /*font-family: 'FontAwesome';*/
    /*font-size: 1.5em;*/
    /*content: '\f05e';*/
    /*color: #cccccc;*/
}

.wb-ads:before {
    content: 'AD';
    font-size: 0.9em;
}

.adminSidebar__link {
    /*max-height: 2em;*/
}

.adminSidebar__linkText {
    padding-left: 1em;
    display: block;
    line-height: 1;
}

.adminSidebar__icon + .adminSidebar__linkText {
    padding-left: 0;
}

.adminSidebar__arrow {
    margin-left: auto;
    margin-right: 0.5em;
}

.adminSidebar:not(:hover):not(.adminSidebar--open) #sidebarSearchInput {
    display: none !important;
}

.adminSidebar--searching {
    --sideBarTransitionDuration: 0s;
}

.adminSidebar__item--searchHide {
    display: none;
}
.adminSidebar__item--searchShow {
    display: block;
}
.adminSidebar__section--searchShow {
    display: block;
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
}

.adminSidebar__item--searchMatch {
    font-weight: bold;
}

.adminSidebar__item--searchMatch {

}

.adminSidebar__section--searchShow .adminSidebar__backBtn {
    display: none;
}


/*.moduleSidebarHidden .moduleSidebar, .saveBtnHolder {
    left: calc(0 - var(--moduleSidebarWidth) - var(--mainSidebarWidth));
}*/


.moduleSidebar {

    --sidebarHeight: calc(100vh - var(--topbarHeight));

    float: left;
    /* width: 15%; */
    width: var(--moduleSidebarWidth);
    /* max-width: 203px; */
    height: var(--sidebarHeight);
    border-right: 1px solid #C3C3C3;
    background-color: var(--sidebarColour);
    z-index: 100;
    min-height: var(--sidebarHeight);
    box-sizing: border-box;
    position: fixed;
    /* top: $topbarHeight; */
    top: calc(var(--topbarHeight));
    /*top: calc(var(--topbarHeight) + var(--pageEditor__topbarHeight));*/
    bottom: 0;
    left: 0;

    transition-duration: var(--sideBarTransitionDuration);
    /*overflow: hidden;*/

    /* account for new small sidebar */
    left: var(--sidebarWidthUnopen);
}

.moduleSidebarInner {
    max-height: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.moduleSidebar__sectionLinksWrapper {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    background-color: var(--sectionLinksBG);
    height: var(--sectionLinksHeight);
}

.moduleSidebar__sectionLink {
    width: 100%;
    padding: 0.5em;
    text-align: center;
    text-decoration: none;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--sectionLinksBG);
    color: var(--brandColour) !important;
}

.moduleSidebar__sectionLink:hover,
.moduleSidebar__sectionLink--active {
    background: var(--sidebarColour);
    text-decoration: none;
}

.moduleSidebar__sectionLinkText {
    display: block;
    font-weight: bold;
    font-size: 1.1em;
}

i.moduleSidebar__sectionLinkIcon {
    font-size: 2rem;
    display: block;
}

.moduleSidebar__sectionLinkIcon + .moduleSidebar__sectionLinkText{
    /* If there's an icon, make text smaller */
    font-size: 0.8em;
    font-weight: normal;
}

.moduleSidebar__sectionLink--collapse {
    width: auto;
}

.moduleSidebarHidden .moduleSidebarInner {
    display: none;
}

.moduleSidebarCollapsedInner {
    display: none;
}

.moduleSidebarHidden .moduleSidebarCollapsedInner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* transform: rotate(-90deg); */
    width: var(--moduleSidebarWidth);
    height: var(--sidebarHeight);
}

.moduleSidebar__sectionLink--expand {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none !important;
}

.moduleSidebarCollapsedText {
    writing-mode: vertical-lr;
    /*transform: rotate(180deg);*/
    padding: 1em 0;
    font-weight: bold;
}


.moduleSidebar__sectionList {
    padding: 0;
    list-style: none;
    margin: 0;
    overflow: hidden;
    display: flex;
    width: auto;
}

.moduleSidebar__section {
    display: inline-block;
    width: var(--moduleSidebarWidth);
    flex-shrink: 0;
    padding: 1em;
    overflow: auto;
    /*max-height: calc(100vh - 34px - 5em - 6em);*/
    max-height: calc(100vh - var(--topbarHeight) - var(--sectionLinksHeight));
    position: relative;
}

.moduleSidebar__section h2,
.moduleSidebar__section h3 {
    margin-top: 0;
}

.shopPlaceholderImg {
    vertical-align: middle;
}

.serifEmphasis{
    font-family: serif;
    font-size: 1.3em;
    font-weight: bold;
}

.tooltipTxt {
    border-bottom: 1px dotted #84939d;
}

.width50{
    width: 50%;
}

.width20{
    width: 20%;
}

.supportAccessRequest .smallNoticeBox a {
    display: none !important;
}


.fileManagerModal {
    padding: 0 !important;
}

.fileManagerModalInner {
    display: flex;
    flex-direction: column;
    border: 1px solid #efefef;
    padding: 5px !important;
    font-size: 1em;
    height: 100vh;
}

.fileManagerModal__loader {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 2em;
    color: var(--brandColour);
}

.fileManagerModalInner .ui-tabs-nav {
    flex-shrink: 0;
}

.fileManagerModal .ui-tabs-panel, .stock_photos--popup .ui-tabs-panel {
    padding: 0 !important;
}

.fileManagerModal__IntroHolder {
    padding: 1em;
}

.fileManagerModalSectionInner {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    /*height: 550px;*/
    height: 100%;
}

.fileManagerModalSectionInner__content {
    height: 100%;
    overflow: auto;
    display: block;
    border: 1px solid #eee;
}

.fileManagerModalSection {
    height: 100% !important;
    overflow: auto;
}

form.fileManagerModal__form {
    height: 100%;
}

.fileManagerModal__dropzone {
    height: 100%;
}

.fileManagerModal__filtersBar {
    display: flex;
    align-items: center;
    justify-content: space-around;
    justify-content: space-between;
    margin-bottom: 10px;
}

.fileManagerModal__filtersWrapper {
    display: flex;
    position: relative;
    /*width: 25%;*/
}

.fileManagerModal__filtersWrapper--left {
    justify-content: flex-start;
}

.fileManagerModal__filtersWrapper--right {
    justify-content: flex-end;
}


.fileManagerModal__filterWrapper {
    display: flex;
    background: #efefef;
    border: 1px solid #ccc;

}

.fileManagerModal__filterBtn {
    width: 2em;
    height: 2em;
}

.fileManagerModal__filterBtn i {
    line-height: 2em;
}


.fileManagerModal__dropdown {
    position: absolute;
    /*left: 0;*/
    top: 100%;
    z-index: 10;
    max-height: 0;
    overflow: hidden;

}

.fileManagerModal__filtersWrapper--left .fileManagerModal__dropdown {
    left: 0;
}

.fileManagerModal__filtersWrapper--right .fileManagerModal__dropdown {
    right: 0;
}

.fileManagerModal__dropdownOpenButton {
    text-decoration: none !important;
    font-weight: normal !important;
}

.fileManagerModal__dropdown:focus, .fileManagerModal__dropdown:hover {
    max-height: none;
}

.fileManagerModal__dropdownOpenButton:focus + .fileManagerModal__dropdown{
    max-height: none;
}

.fileManagerModal__dropdownList {
    /*display: flex;*/
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: left;

    background: #fff;
    border: 1px solid #eee;
}

.fileManagerModal__dropdownListItem {
    margin: 0;
}

.fileManagerModal__dropdownItem {
    display: block;
    padding: 5px;
    /*margin: 0 5px;*/
    /*background: #eee;*/
    /*border: 1px solid #eee;*/
}

.fileManagerModal__dropdownItem--active {
    background: #eee;
}

.fileManagerModal__filterSearch {
    position: relative;
    margin: 0 1em;
}

.fileManagerModal__filterSearchInput {
    padding: 0.3em !important;
    padding-left: 1.8em !important;
    width: 100%;
    box-sizing: border-box !important;
}

.fileManagerModal__filterSearchIcon {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    line-height: 1.8em !important;
    height: 1.8em;
    width: 1.8em;
}

.fileManagerModal__folderHolder {
    margin: 50px 0;
    background: #efefef;
}

.fileManagerModal__folderHolder:first-child {
    margin-top: 0;
}

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

.fileManagerModal__imgHolder {
    width: 20%;
    flex-shrink: 1;
    flex-grow: 0;
    box-sizing: border-box;
    margin: 0;
    padding: 5px;
    min-width: 100px;
    position: relative;
    overflow: hidden;
}

/*.fileManagerModal__imgHolder::before {*/
/*    content: '';*/
/*    display: block;*/
/*    padding-bottom: 100%;*/
/*}*/


.fileManagerModal__label {
    background: #fff;
    position: relative;
    display: block;
    cursor: pointer;
    outline: 1px solid #ddd;
    outline-offset: -3px;
    border: 2px solid #eee;
}

.fileManagerModal__checkbox:checked + .fileManagerModal__label {
    /*outline: 2px solid var(--brandColour);*/
    border-color: var(--brandColour);
    /*outline-offset: -1px;*/
}

.fileManagerModal__imgContainer .fileManagerModal__imgWrapper {
    box-sizing: border-box;
    position: relative;
    background: url('/admin/images/transparent_pattern.jpg');
    aspect-ratio: 1;
}

/*.fileManagerModal__imgWrapper::before {*/
/*    content: '';*/
/*    display: block;*/
/*    padding-bottom: 100%;*/
/*}*/

.fileManagerModal__img, .fileManagerModal__gradient {
    width: 100%;
    height: 100%;
    object-fit: contain;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;

    /*border: 1px solid #eee;*/
}

.fileManagerModal__magnific {
    position: absolute;
    bottom: 0;
    right: 0;
    display: none;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 100%;
    width: 1.5em;
    height: 1.5em;
    line-height: 1.5em;
    text-align: center;
}

.fileManagerModal__magnificImg::after {
    content: '';
    display: none !important;
}

.fileManagerModal__label:hover .fileManagerModal__magnific {
    display: block;
}


.fileManagerModal__notFoundNote {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}

.fileManagerModal__checkbox {
    display: none;
}

.fileManagerModal__checkbox:checked + .fileManagerModal__label img {
    /*border-color: var(--brandColour);*/
}

.fileManagerModal__imgInner {
    border: 1px solid #efefef;
}

.fileManagerModal__checkbox:checked + .fileManagerModal__imgInner {
    border-color: var(--brandColour);
}

.flexImages .fileManagerModal__imgHolder img {
    display: block;
    width: auto;
    height: 100%;
}

.fileManagerModal__info {
    display: none;
}

.fileManagerModal__info--name {
    display: block;
}

.fileManagerModal__infoWrapper {
    padding: 0.5em;
    /*max-height: 2em;*/
    overflow: hidden;

    display: flex;
    justify-content: space-between;
    width: 100%;

    align-items: center;
}

.fileManagerModal__label:hover .fileManagerModal__infoWrapper {
    /*max-height: none;*/
}

.fileManagerModal__info--name {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.fileManagerModal__label:hover .fileManagerModal__info--name {
    white-space: normal;
    word-break: break-all;
}

.fileManagerModal__infoTooltip {
    /*display: none;*/
    /*position: absolute;*/
    /*right: 0;*/
    /*padding: 0.5em;*/
}

/*.fileManagerModal__label:hover .fileManagerModal__infoTooltip {*/
/*    display: inline-block;*/
/*}*/

.fileManagerModal__infoIcon:hover ~ .fileManagerModal__info {
    display: block;
}

.fileManagerModal__fileList--grid {

}

.fileManagerModal__fileList--list {

}

.fileManagerModal__fileList--list .fileManagerModal__imgWrapper,
.fileManagerModal__fileList--details .fileManagerModal__imgWrapper {
    width: 50px;
    flex-shrink: 0;
}

.fileManagerModal__fileList--list .fileManagerModal__label,
.fileManagerModal__fileList--details .fileManagerModal__label {
    display: flex;
    align-items: center;
}

.fileManagerModal__fileList--list .fileManagerModal__imgHolder {
    width: 25%;
}

.fileManagerModal__fileList--details .fileManagerModal__imgHolder {
     width: 100%;
}

.fileManagerModal__fileList--details .fileManagerModal__infoTooltip {
    display: none !important;
}

.fileManagerModal__fileList--details .fileManagerModal__info--name {
    flex-grow: 1;
    text-align: left;
}

.fileManagerModal__fileList--details .fileManagerModal__info {
    display: block;
    /*width: 100px;*/
    width: 6em;
}

.fileManagerModal__fileList--details .fileManagerModal__info--extension {
    width: 4em;
}

.fileManagerModal__fileList--details .fileManagerModal__info--date {
    /*width: 200px;*/
    width: 12em;
}

.fileManagerModal__fileList--details .fileManagerModal__info--dateSmall {
    /*width: 150px;*/
    width: 9em;
}

.fileManagerModal__detailsColumnsHolder {
    display: none;
}

.fileManagerModal__fileList--details .fileManagerModal__detailsColumnsHolder {
    display: flex;
}

.fileManagerModal__detailsColumnsHolder {
    padding: 5px;
}

.fileManagerModal__detailsColumnsHolder .fileManagerModal__imgWrapper {
    background: none;
}

.fileManagerModal__detailsColumnsHolder .fileManagerModal__imgWrapper::before {
    display: none
}


.fileManagerModal__viewBtn {
    display: inline-block;
}

.fileManagerModal__viewBtn--active {
    color: var(--brandColour) !important;
}


.fileManagerModalSection  .stockPhotosIframe {
    height: calc(100% - 5px);
}

.fileManagerModal__buttonHolder {
    padding: 1em;
}

.fileManagerModal__imgHolder--noImage .fileManagerModal__magnific {
    display: none !important;
}

.fileManagerModal__imgHolder--noImage .fileManagerModal__infoTooltip {
    display: none !important;
}

.fileManagerModal__imgHolder--noImage .fileManagerModal__info,
.fileManagerModal__imgHolder--uploadBtn .fileManagerModal__info {
    display: none !important;
}

.fileManagerModal__imgHolder--noImage .fileManagerModal__info--name,
.fileManagerModal__imgHolder--uploadBtn .fileManagerModal__info--name {
    display: block !important;
}

.fileManagerModal__gradientPreview {
    width: 100px;
    height: 100px;
}




.fileManagerModal__productGroupHolder {
    margin: 0;
}

.fileManagerModal__productGroupHolder--filter_visible [data-visibility=hidden]{
    display: none !important;
}
.fileManagerModal__productGroupHolder--filter_hidden [data-visibility=visible]{
    display: none !important;
}

.fileManagerModal__filterBtn--visibility[data-value='all'] .fa-eye,
.fileManagerModal__filterBtn--visibility[data-value='hidden'] .fa-eye {
    display: none;
}

.fileManagerModal__filterBtn--visibility[data-value='visible'] .fa-eye-slash {
    display: none;
}

.fileManagerModal__filterBtn--visibility[data-value='visible'] i, .fileManagerModal__filterBtn--visibility[data-value='hidden'] i {
    color: #00B7F1;
}

.fileManagerModal__productHolder {
    display: contents;
}

.fileManagerModal__subProductsHolder {
    display: none;
}

.fileManagerModal__productHolder--open {
    /*display: block;*/
    width: 100%;
    /*border: 2px solid #00b7f1;*/
}
.fileManagerModal__productHolder--open > .fileManagerModal__subProductsHolder {
    /*display: block;*/
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.fileManagerModal__productHolder .fileManagerModal__subProductsHolder {
    padding: 1em;
}

.fileManagerModal__subProductsHeader {
    width: 100%;
}

.productSelectModal__showChildBtn, .productSelectModal__showChildBtn:hover {
    font-size: 0.9rem;
}

.fileManagerModal__productHolder--subSelected > .fileManagerModal__imgHolder > .fileManagerModal__label {
    border-bottom-color: var(--brandColour);
}

.fileManagerModal__subProductsCount {
    /*color: var(--brandColour);*/
}

.productSelectModal__link {
    margin-right: 0.5em;
}

.productSelectModal__hidden--category {
    display: none !important;
}

.productSelectModalInput__wrapper {
    display: inline-block;
}


.fileManagerInput__wrapper {
    display: inline-block;
    /*min-width: 300px;*/
}

.fileManagerInput__img {
    max-height: 100px;
    max-width: 100px;
}

.fileManagerInput__btn, .fileManagerInput__img {
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
}

/* fileManagerModal smaller */
.fileManagerModal {
    container-name: fileManagerModal;
    container-type: size;
}



@container fileManagerModal (max-width: 800px) {
    .fileManagerModalInner  {
        font-size: 0.9em !important;
    }
}

@container fileManagerModal (max-width: 600px) {
    .mobileHide {
        display: none;
    }
    
    .fileManagerModalInner  {
        font-size: 0.8em !important;
    }
    
}

@container fileManagerModal (max-width: 400px) {
    .fileManagerModal__filtersBar {
        flex-wrap: wrap;
    }
    .fileManagerModal__filterSearch {
        order: 10;
        margin: 0;
        margin-top: 1em;
        width: 100%;
    }
}

@media (max-width: 400px) {
    .fileManagerModal__dialog {
        position: fixed;
        top: var(--topbarHeight) !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: auto !important;
        height: auto !important;
        max-width: 100% !important;
        max-height: 100% !important;
    }
}

.stock_photos--popup .popupWrapper {
    padding: 0;
}

.stock_photos--popup .stockSearch fieldset {
    border: none !important;
}

.stock_photos--popup .stockSearch legend {
    display: none;
}

.stock_photos--popup .stockLogoContainer {
    width: 100%;
}

.stock_photos--popup .stockLogoContainer img {
    width: 100%;
    height: 32px;
    object-fit: contain;
}


.mce-floatpanel {
    max-height: 90vh !important;
}

.mce-reset {
    max-height: 100%;
}

.mce-window-body {
    /* .mce-floatpanel max-height 90vh - .mce-window-head 39px - .mce-foot 50px */
    max-height: calc(90vh - 89px);
}



@media (min-width: 2560px) {
    /* 4K screens */
    .mce-window.mce-in[aria-label="HTML source code"] {
        transform: scale(1.5) !important;
    }
    .wrapper{
        max-width: 70%;
        margin: 0 auto !important;
        float: none;
    }
}

@media (max-width: 1440px) {
    .mce-window.mce-in[aria-label="HTML source code"] {
        transform: scale(.8) !important;
    }
}

@media (max-width: 1024px) {
    .mce-window.mce-in[aria-label="HTML source code"] {
        transform: scale(.7) !important;
    }
}

@media (max-width: 768px) {
    .mce-window.mce-in[aria-label="HTML source code"] {
        transform: scale(.65) !important;
    }
}

@media (max-width: 425px) {
    .mce-window.mce-in[aria-label="HTML source code"] {
        transform: scale(.5) !important;
    }
}

table.dnsTable td {
    font-size: 1.2em;
    padding: 0.5em 1em;
}

.ui-dialog {
    max-width: 90vw;
    /*max-height: 90vh;*/
    max-height: calc(90vh - var(--topbarHeight));
    position: fixed !important;
}

.modalContent {
    max-height: 100%;
}

.fileManagerModal, .productSelectModal {
    /*max-height: 100% !important;*/
    max-height: calc(90vh - 100px) !important;
    /*     overflow: hidden !important; */
}

.dropzone {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: auto;
    max-width: 94vw;
}

.dropzone .dz-default.dz-message {
    margin: 0;
}

.notVisible{
    visibility: hidden;
}

.shopProdAttrTable__paramInheritCheckbox {
    vertical-align: bottom;
}

.tr.shopProdAttrTable__row.shopProdAttrTable__row--childProduct {
    border-left: 0.5em grey solid;
    background: #eeeeee !important;
}

.shopProdAttrTable__imgHolder.shopProdAttrTable__imgHolder--hover.noHrefIcon {
    margin-right: 0.3em;
}

.shopProdAttrTable__row--childProduct a.shopProdAttrTable__productLink:before {
    content: '\f148';
    font-family: 'FontAwesome';
    transform: rotate(90deg);
    display: inline-block;
    font-size: 2.3em;
    vertical-align: top;
    margin-left: -1em;
    color: grey;
}

.shopProdAttrTable__imgHolder.noHrefIcon {
    margin-left: 0.3em;
}

.shopProdAttrTable__row {
    /*margin: 5px 0;*/
}

.shopProdAttrTable__rowGroup .tr.shopProdAttrTable__row {
    border-bottom: 1px solid #ECECEC;
}

.shopProdAttrTable__imgHolder {
    width: 100px;
    height: 100px;
    display: inline-block;
}

.shopProdAttrTable__imgHolder--hover img {
    transition: 0.2s;
}

.shopProdAttrTable__imgHolder--hover:hover img {
    opacity: 0;
}

.shopProdAttrTable__productName {
    margin: 0;
    display: inline-block;
    vertical-align: top;
    font-size: 1.1em;
    width: 50%;
    line-height: 1.2;
}

.shopProdAttrTable__productLink {
    text-decoration: none !important;
    display: block;
}

.shopProdAttrTable__row--childProduct .shopProdAttrTable__productNameHolder {
    padding-left: 4em;
}

.shopProdAttrTable__accordion--inactive {
    display: none !important;
}

.shopProdAttrTable__codeView {
    max-height: 250px;
    overflow: auto;
    display: block;
    overflow-wrap: break-word;
}

#advToolsButtons{
    clear: both;
    margin-top: 2em;
}

/* The list style
-------------------------------------------------------------- */

ul.directory-list {
    max-height: 800px;
    overflow: auto;
    height: 100%;
}

.directory-list ul {
    margin-left: 10px;
    padding-left: 20px;
    border-left: 1px dashed #ddd;
}

ul.directory-list li {
    list-style: none;
    color: #888;
    font-size: 17px;
    font-style: normal;
    font-weight: normal;
    width: 100%;
}

ul.directory-list a {
    border-bottom: 1px solid transparent;
    color: #888;
    text-decoration: none;
    transition: all 0.2s ease;
    white-space: nowrap;
    cursor: pointer;
}

ul.directory-list a:hover {
    border-color: #eee;
    color: #000;
}

.directory-list .folder,
.directory-list .folder > a {
    color: #777;
    font-weight: bold;
}

.directory-list .folder > a:hover {
    font-style: italic;
}

.directory-list li > ul { display: none; }

.directory-list li.folder--open {
    display: block;
}

/* The icons
-------------------------------------------------------------- */

.directory-list li:before {
    margin-right: 10px;
    content: "\f1c9";
    font-family: 'FontAwesome';
    /* height: 20px; */
    vertical-align: middle;
    /* width: 20px; */
    /* background-repeat: no-repeat; */
    /* display: inline-block; */
    /* background-image: url(data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><path fill='lightgrey' d='M85.714,42.857V87.5c0,1.487-0.521,2.752-1.562,3.794c-1.042,1.041-2.308,1.562-3.795,1.562H19.643 c-1.488,0-2.753-0.521-3.794-1.562c-1.042-1.042-1.562-2.307-1.562-3.794v-75c0-1.487,0.521-2.752,1.562-3.794 c1.041-1.041,2.306-1.562,3.794-1.562H50V37.5c0,1.488,0.521,2.753,1.562,3.795s2.307,1.562,3.795,1.562H85.714z M85.546,35.714 H57.143V7.311c3.05,0.558,5.505,1.767,7.366,3.627l17.41,17.411C83.78,30.209,84.989,32.665,85.546,35.714z' /></svg>); */
    /* background-position: center 2px; */
    /* background-size: 60% auto; */
}

.directory-list li.folder:before {
    /* folder icon if folder class is specified */
    /*background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><path fill='lightblue' d='M96.429,37.5v39.286c0,3.423-1.228,6.361-3.684,8.817c-2.455,2.455-5.395,3.683-8.816,3.683H16.071 c-3.423,0-6.362-1.228-8.817-3.683c-2.456-2.456-3.683-5.395-3.683-8.817V23.214c0-3.422,1.228-6.362,3.683-8.817 c2.455-2.456,5.394-3.683,8.817-3.683h17.857c3.422,0,6.362,1.228,8.817,3.683c2.455,2.455,3.683,5.395,3.683,8.817V25h37.5 c3.422,0,6.361,1.228,8.816,3.683C95.201,31.138,96.429,34.078,96.429,37.5z' /></svg>");*/
    /*background-position: center top;*/
    /*background-size: 75% auto;*/
    content: "\f07b";
    font-family: 'FontAwesome';
}

.directory-list li.folder--open:before {
    /* folder icon if folder class is specified */
    content: "\f07c";
    font-family: 'FontAwesome';
}


/*****************/
div#activeThemeFiles {
    text-align: left;
}

div#activeThemeFiles ul {
    display: inline-block;
}

div#activeThemeFiles ul ul {
    list-style: none;
}

div#activeThemeFiles ul li b {
    width: 20%;
    display: inline-block;
}


#updateNotiIcon{
    cursor: pointer !important;
}

th#blogTitleCol {
    width: 25%;
}

/* Hide disabled tour buttons */
.popover button.disabled {
    display: none;
}
.verticalAlignMiddle{
    vertical-align: middle;
}

.deviceBreakdown a {
    font-size: 0.8em;
}

.rotate {
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    transition-property: transform;
    overflow: hidden;
}

.rotate:hover, .rotate:focus, .rotate:active {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
}

.hvr-tilt {
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    transition-property: transform;
    overflow: hidden;
}

.hvr-tilt:active, .hvr-tilt:focus, .hvr-tilt:hover {
    -webkit-transform: rotate(20deg);
    transform: rotate(20deg);
}

.backgroundBanned {
    background-color: #FEA7A7;
    color: #FFFFFF !important;
}

.backgroundBanned a {
    color: #333333 !important;
}

.pagination--bottom {
    display: inline-block;
}

table#accountUsers a.greyColour:visited {
    color: #84939d;
}

table#loggedinUserTable th {
    font-size: 0.9em;
    background: #c5cace;
    border-bottom: grey;
}

table#loggedinUserTable tr:first-child th:first-child, table#loggedinUserTable .tr:first-child .th:first-child{
    border-radius: 4px 0 0 0;
}

table#loggedinUserTable tr:first-child th:last-child, table#loggedinUserTable .tr:first-child .th:last-child {
    border-radius: 0 4px 0 0;
}

table#loggedinUserTable td {
    text-align: center;
}

.select2-dropdown {
    border-left: 1px solid #C9D1DA !important;
    border-right: 1px solid #C9D1DA !important;
    border-bottom: 1px solid #C9D1DA !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid #C9D1DA;
    width: 95% !important;
    margin-left: 0.4em;
}

img.shadow {
    border-radius: 3px;
    box-shadow: -2px 2px 4px rgb(179 179 179 / 48%);
}

.prodListStockInfo {
    max-height: 5em;
    overflow: auto;
}

table#stockChannelProdTable td {
    font-size: 1.2em;
}
table#stockChannelProdTable td img {
    vertical-align: middle;
}

table#stockChannelProdTable td:first-child {
    /*padding-left: 3em;*/
    width: 100px;
}

table#stockChannelProdTable td:nth-child(2) {
    text-align: left;
}


.productStockInputs__label {
    display: inline-block;
    width: 10em;
}

a#removeProd i.fa{
    cursor: pointer;
}

div#stockItems_child {
    /*min-height: 70vh !important;*/
}

select.contextualMenu {
    background: var(--contentMenu) !important;
    color: var(--contrastColour) !important;
}

select.contextualMenu option:checked {
    text-align: center;
    background: var(--contentMenuSelected);
    font-weight: bold;
    color: var(--contentMenu);
}

select.contextualMenu option {
    text-align: left;
}

.productEditor__variantProductsTable .productStockInputs__channelList--assigned,
.multiQtyCol .productStockInputs__channelList--assigned {
    max-height: 15em;
    overflow: auto;
}

.productStockInputs__unusedChannels {
    border-top: 1px solid #e0e0e0;
    box-shadow: 0px -2px 2px #cacaca63;
}

.productStockInputs__channel {
    display: flex;
    align-items: baseline;
}

.productStockInputs__channel input{
    margin-bottom: 0.3em !important;
}

a.productStockInputs__channelUnassignBtn.tooltip {
    margin-left: 5px;
}

.productStockInputs__channel label.structuredExtraLong:hover {
    border-bottom: 1px solid #e0e0e0;
}


.itemList__searchForm {
    min-width: 50%;
    margin-bottom: 0.5em;
}

.itemList__searchBtn {
    margin-bottom: 0 !important;
}

.itemListForm__inputHolder {
    display: flex;
    align-items: baseline;
    padding-right: 1em;
}

.itemListForm__label {
    width: auto;
    margin-right: 0.5em;
    font-weight: bold;
}

.itemListForm__input {
    flex-shrink: 1;
}

.itemListForm__input--search {
    width: 100%;
    /*width: 20em;*/
}

.itemListForm__row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
}

.itemList__listWrapper {
    position: relative;
}

.itemList__listWrapper--loading {
    min-height: 250px;
}

.itemList__listLoader {
    display: none;
    background: rgba(238, 238, 238, 0.7);
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
}

.itemList__listWrapper--loading .itemList__listLoader {
    display: flex;
}

.itemList__row {

}

.itemList__row--selected {
    background: #ccc !important;
}

p.dashHeaderSubtext span.alert.alert-success.mb-3 {
    color: green;
}
p.dashHeaderSubtext span.alert.alert-danger.mb-3 {
    color: red;
}
p.dashHeaderSubtext span.alert.alert-info.mb-3 {
    color: #385D7A;
}
p.dashHeaderSubtext span.alert.alert-warning.mb-3 {
    color: #857B26;
}

.currentuser .serverStatusMsg.alert.alert-success.mb-3,
div.supportStatus.alert.alert-success.mb-3 {
    color: #1D643B;
    background-color: #D7F3E3;
    border-color: #C7EED8;
}

.currentuser .serverStatusMsg.alert.alert-danger.mb-3,
div.supportStatus.alert.alert-danger.mb-3 {
    color: #761B18;
    background-color: #F9D6D5;
    border-color: #F7C6C5;
}

.currentuser .serverStatusMsg.alert.alert-info.mb-3,
div.supportStatus.alert.alert-info.mb-3 {
    color: #385D7A;
    background-color: #E2F0FB;
    border-color: #D6E9F9;
}

.currentuser .serverStatusMsg.alert.alert-warning.mb-3,
div.supportStatus.alert.alert-warning.mb-3 {
    color: #857B26;
    background-color: #FFFBDB;
    border-color: #FFFACC;
}

.currentuser .serverStatusMsg.alert.mb-3 a {
    color: inherit !important;
}

.currentuser .serverStatusMsg.alert.mb-3 {
    border: 1px solid transparent;
    padding: 0.5em;
    border-radius: 2px;
    text-align: center;
    font-weight: normal;
}

div.supportStatus {
    color: inherit !important;
}

div.supportStatus {
    text-align: center;
    padding: 0.5em;
    border: 3px solid;
    border-radius: 8px;
    margin: 0.5em 0;
    font-size: 1em;
}

/*** eCom Connect banner ***/


.ecom_connect__context {
    width: 100%;
    /*position: absolute;*/
    /*top: 0;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.ecom_connect__context h1{
    text-align: center;
    color: #fff;
    /*font-size: 5em;*/
}

.ecom_connect__area{
    background: var(--brandColour);
    background: linear-gradient(to left, #007ca3, var(--brandColour));
    width: 100%;
    /*height: 180px;*/
    height: auto;
    /*min-height: 180px;*/
    position: relative;
    margin: 1em 0;
    cursor: pointer;
    border-radius: 8px;
}

.ecom_connect__area a {
    position: relative;
    display: block;
    z-index: 999999;
    top: 0;
}

.ecom_connect__circles{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin: 0;
}

.ecom_connect__circles li{
    position: absolute;
    display: block;
    list-style: none;
    width: 20px;
    height: 20px;
    background: rgba(255, 255, 255, 0.2);
    animation: ecom_connect__animate 25s linear infinite;
    bottom: -150px;

}

.ecom_connect__circles li:nth-child(1){
    left: 25%;
    width: 80px;
    height: 80px;
    animation-delay: 0s;
}


.ecom_connect__circles li:nth-child(2){
    left: 10%;
    width: 20px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 12s;
}

.ecom_connect__circles li:nth-child(3){
    left: 70%;
    width: 20px;
    height: 20px;
    animation-delay: 4s;
}

.ecom_connect__circles li:nth-child(4){
    left: 40%;
    width: 60px;
    height: 60px;
    animation-delay: 0s;
    animation-duration: 18s;
}

.ecom_connect__circles li:nth-child(5){
    left: 65%;
    width: 20px;
    height: 20px;
    animation-delay: 0s;
}

.ecom_connect__circles li:nth-child(6){
    left: 75%;
    width: 110px;
    height: 110px;
    animation-delay: 3s;
}

.ecom_connect__circles li:nth-child(7){
    left: 35%;
    width: 150px;
    height: 150px;
    animation-delay: 7s;
}

.ecom_connect__circles li:nth-child(8){
    left: 50%;
    width: 25px;
    height: 25px;
    animation-delay: 15s;
    animation-duration: 45s;
}

.ecom_connect__circles li:nth-child(9){
    left: 20%;
    width: 15px;
    height: 15px;
    animation-delay: 2s;
    animation-duration: 35s;
}

.ecom_connect__circles li:nth-child(10){
    left: 85%;
    width: 150px;
    height: 150px;
    animation-delay: 0s;
    animation-duration: 11s;
}



@keyframes ecom_connect__animate {

    0%{
        transform: translateY(0) rotate(0deg);
        opacity: 1;
        border-radius: 0;
    }

    100%{
        transform: translateY(-1000px) rotate(720deg);
        opacity: 0;
        border-radius: 50%;
    }

}

.ecomBlue{
    color: #0e76bc;
}

.statListForm__inputHidden_clear {
    padding: 0.3em;
}

.siteStats__tabNav {
    display: flex;
}

.siteStats__tabBtn {
    flex: 1;
    margin: 1em !important;
    font-size: 1em;
}

.siteStats__tabBtn--active, .siteStats__tabBtn:active, .siteStats__tabBtn:focus {
    border-color: var(--blue_button) !important;
    color: var(--blue_button) !important;
    /*background: none !important;*/
    background: #fff !important;
    font-weight: bold !important;
}

.siteStats__graphHolder {
    padding: 5px;
}

.siteStats__graphWrapper {
    position: relative;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 0 7px rgb(179 179 179 / 48%);
    padding: 10px;
    height: 100%;
    min-height: 400px;
}

.siteStats__graphWrapper--zoomed {
    position: fixed;
    top: 10vh;
    bottom: 10vh;
    left: calc(10% + var(--mainSidebarWidth));
    right: 10%;
    /*top: 0;*/
    /*bottom: 0;*/
    /*left: var(--mainSidebarWidth);*/
    /*right: 0;*/
    height: auto;
    width: auto;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 10;
}

.siteStats__graphZoomOverlay {
    position: fixed;
    display: none;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.5);
}

.siteStats__graphWrapper--zoomed .siteStats__graphZoomOverlay {
    display: block;
}

.siteStats__graphWrapper--zoomed .siteStats__graphContent {
    width: 100%;
    /*height: 80vh;*/
    flex: 1;
}

.siteStats__graphWrapper--zoomed .siteStats__graphHeader,
.siteStats__graphWrapper--zoomed .siteStats__graphFooter {
    width: 100%;
    background: #fff;
    z-index: 10;
}

.siteStats__graphWrapper--zoomed .siteStats__graphTitle {
    margin-top: 0.5em
}

.siteStats__graphWrapper--zoomed .siteStats__graphRefreshBtn {
    margin: 5px;
}

.siteStats__graphLoader {
    display: none;
    /*background: rgba(255, 255, 255, 0.7);*/
    background: #fff;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
}

.siteStats__graphWrapper--loading .siteStats__graphLoader {
    display: flex;
}

.siteStats__graphWrapper--loading .siteStats__graphContent {
    visibility: hidden;
}


/*.siteStats__graphZoomBtn {*/
/*    display: none;*/
/*}*/

.siteStats__graphHeader {
    width: 100%;
    /*display: flex;*/
    /*justify-content: space-between;*/
    background: #fff;
    z-index: 1;
    position: relative;
}

.siteStats__graphTitle {
    margin: 0;
    width: 100%;
    text-align: center;
}

.siteStats__graphWrapper--loading .siteStats__graphFooter,
.siteStats__graphWrapper--loading .siteStats__graphRefreshBtn,
.siteStats__graphWrapper--error .siteStats__graphFooter {
    display: none;
}

.siteStats__graphFooter {
    display: flex;
    justify-content: center;
}

.siteStats__graphExportBtn {
    margin: 0 5px;
}

.siteStats__graphRefreshBtn {
    position: absolute;
    top: 0;
    right: 0;
    width: 1.5em;
    height: 1.5em;
    line-height: 1em;
    text-align: center;
    padding: 0.25em;
    /*margin: 5px;*/
    z-index: 1;
}

.siteStats__statRuleReasonInput {
    display: none;
}