@font-face{ 
	font-family: 'hkgroteskpro';
	src: url('../fonts/hkgroteskpro-book.eot');
	src: url('../fonts/hkgroteskpro-book.eot?#iefix') format('embedded-opentype'),
	     url('../fonts/hkgroteskpro-book.woff') format('woff'),
	     url('../fonts/hkgroteskpro-book.ttf') format('truetype'),
	     url('../fonts/hkgroteskpro-book.svg#webfont') format('svg');
    font-weight: 400;
}

@font-face{ 
	font-family: 'hkgroteskpro';
	src: url('../fonts/hkgroteskpro-bold.eot');
	src: url('../fonts/hkgroteskpro-bold.eot?#iefix') format('embedded-opentype'),
	     url('../fonts/hkgroteskpro-bold.woff') format('woff'),
	     url('../fonts/hkgroteskpro-bold.ttf') format('truetype'),
	     url('../fonts/hkgroteskpro-bold.svg#webfont') format('svg');
    font-weight: 700;
}

@font-face{ 
	font-family: 'hkgroteskpro';
	src: url('../fonts/hkgroteskpro-semibold.eot');
	src: url('../fonts/hkgroteskpro-semibold.eot?#iefix') format('embedded-opentype'),
	     url('../fonts/hkgroteskpro-semibold.woff') format('woff'),
	     url('../fonts/hkgroteskpro-semibold.ttf') format('truetype'),
	     url('../fonts/hkgroteskpro-semibold.svg#webfont') format('svg');
    font-weight: 600;
}

body{
    color: #92959C;
    background-color: #F3F4F5;
    font-size: 15px;
    font-family: hkgroteskpro;
    margin-top: 100px;
}

body.dragging{ overflow-x: hidden;}
body.with-subheader{
    margin-top: 150px;
}

body.popupactive{
    overflow: hidden;
}

#main .loadinglogo2{
    display: none;
}

#main.ajaxload .loadinglogo2 {
    position: fixed;
    top: 50%;
    display: block;
    left: 50%;
    transform: translate(-50%);
    z-index: 41;
}

.ajaxload #main_body {
    animation: linear 10s fadeOut50pc;
    animation-fill-mode: forwards;
}

.folder_panel.fadeOut50pc,
.panel.fadeOut50pc{
    animation: linear 2s fadeOut50pc;
    animation-fill-mode: forwards;
}

.ajaxload #main_body:before {
    content: '';
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 100vh;
    background-color: #92959C;
    opacity: 0.6;
    z-index: 40;
    animation: linear 2s fadeIn50pc;
    animation-fill-mode: forwards;
}

.h1, .h2, .h3, h1, h2, h3 {
    margin-top: 30px;
    margin-bottom: 30px;
}

h1 small{
    font-weight: 400;
    line-height: 1;
    font-size: 16px;
    color: #B2B7BF;
}

ul{ padding-left: 15px; }
ul li{ margin: 5px 0px; }
ul.nomargin li{ margin: 0px 0px; }
::-webkit-input-placeholder {    color:    #B2B7C7;}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */   color:    #B2B7C7;   opacity:  1;}
::-moz-placeholder { /* Mozilla Firefox 19+ */   color:    #B2B7C7;   opacity:  1;}
:-ms-input-placeholder { /* Internet Explorer 10-11 */   color:    #B2B7C7;}
::-ms-input-placeholder { /* Microsoft Edge */   color:    #B2B7C7;}

.text-center > .h1, .text-center > .h2, .text-center > .h3, .text-center > h1, .text-left > h1, .text-center > h2, .text-center > h3, .text-left > h2, .text-left > h3 {
    margin-top: 10px;
    margin-bottom: 10px;
}
a, a:hover, a:active, a:focus{
    color: #92959C;
    text-decoration: none;
}
p a:hover, p a:active, p a:focus{
    text-decoration: underline;
}
p.multiline{
    white-space: pre-line;
}

.container-fluid {
    padding-right: 30px;
    padding-left: 30px;
    margin-right: auto;
    margin-left: auto;
}

div#grid_panel.container-fluid {
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 30px;
    background-color: #ffffff;
    display: block;
    min-height: calc(100vh - 203px);
}

.semi-bold{
    font-weight: 600;
}

.icon-twitter.col{ color: #1DA1F2;}
.icon-facebook.col{ color: #3D5A98;}
.icon-instagram.col{ color: #BC3098;}
.icon-pinterest.col{ color: #C7262D;}
.icon-googleplus.col{ color: #d34836;}
.icon-linkedin.col{ color: #007BB5;}
.icon-facebook_stories.col{ color: #3D5A98;}
.icon-instagram_stories.col{ color: #BC3098;}
.icon-snapchat.col{ color: #c9ca3c;}
.icon-email.col{ color: #d11c1c;}
.icon-tv.col{ color: #261e1e;}
.icon-digital_signage.col{ color: #204761;}

.twitter-col{ color: #1DA1F2;}
.facebook-col{ color: #3D5A98;}
.instagram-col{ color: #BC3098;}
.pinterest-col{ color: #C7262D;}
.googleplus-col{ color: #d34836;}
.linkedin-col{ color: #007BB5;}
.email-col {color: #d11c1c; }
.tv-col {color: #261e1e; }
.digital_signage-col {color: #204761; }

.childflexboxrow{
    display: table-column;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
}

header, .subheader {
    width: 100%;
    height: 60px;
    background-color: #ffffff;
    border-bottom: 1px solid #C9D0E1;
    font-size: 16px;
    text-align: center;
    position: fixed;
    z-index: 42;
    top: 0px;

    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.subheader{
    top: 60px;
    left: 0px;
    z-index: 41;
}

.heading, h1{
    font-size: 26px;
    color: #204761;
    font-weight: 600;
}

.heading.neutral, h1.neutral{
    color: #92959C;
}

.heading img, h1 img{
    margin-right: 15px;
}

.heading button, h1 button{
    margin-right: 0px;
}

.stat-heading{
    font-size: 32px;
    margin-bottom: 0px;
    margin-top: 0px;
    color: #204761;
    font-weight: 600;
}

.stat-subheading{
    font-size: 26px;
    margin-bottom: 0px;
    margin-top: 0px;
    color: #204761;
    font-weight: 500;
}

.stat-sub-heading {
    font-size: 20px;
    margin-bottom: 0px;
    margin-top: 0px;
    color: #204761;
    font-weight: 500;
}

#header .centermenu{
    margin-left: 240px;
    margin-right: 240px;
    overflow-y: hidden;
    max-height: 67px;
}

.subheading, h2, a.subheading{
    font-size: 16px;
    color: #204761;
    font-weight: 600;
    margin-top: 30px;
    margin-bottom: 10px;
}

h2 [class^="icon-"]{
    margin-right: 10px;
}

.eventdaytitle{
    font-size: 20px;
    color: #204761;
    font-weight: 500;
}

.helptext{
    font-size: 14px;
}

.labeltext {
    font-size: 14px;
    font-weight: 500;
    color: #204761;
}

.primaryText {
    color: #2908C6;
}

.primaryBG, .primaryBG a{
    color: #F3F4F5;
    background-color: #2908C6;
}

.row .rowrollover{ opacity: 0; transition: 0.2s opacity ease-in-out;}
.row:hover .rowrollover{ opacity: 1;}

.row.fakeheader {
    padding: 20px;
    background-color: #ffffff;
    border-top: none;
    border-bottom: 1px solid #C9D0E1;
    text-align: center;
}

    .row.fakeheader .icon-close{
        position: absolute;
        padding: 0px 20px;
        left: 0px;
        top: 0px;
    }

    .row.fakeheader h4 {
        font-size: 18px;
        margin: 0px;
        color: #204761;
        font-weight: 600;
    }

    /*HEADER*/
    header .logoholder {
        padding: 15px 15px;
        position: absolute;
    }

    header .logoholder.livedisabled {
        filter: grayscale(1) brightness(1.2);
    }

header .main-menu{
    margin-right: 0px;
}

header#editor .main-menu{
    margin-right: 0px;
}

header .main-menu, 
.subheader .main-menu{
    list-style: none;
    display: inline-block;
    padding: 0px;
    margin-bottom: 0px;
}

header .main-menu li, 
.subheader .main-menu li {
    display: inline-block;
    margin: 0px 25px;
    flex: 0 0 auto;
}

    .subheader .main-menu li.mobilespacer {
        display: none;
    }

header .main-menu li > a, 
.subheader .main-menu li > a{
    padding: 18px 0 17px 0;
    display: inline-block;
}

header .main-menu li.active, 
.subheader .main-menu li.active {
    border-bottom: 2px solid #2908C6;
    font-weight: 600;
}

header .main-menu li.active a, 
header .main-menu li a:hover, 
.subheader .main-menu li.active a,
.subheader .main-menu li a:hover{
    color: #2908C6;
    text-decoration: none;
}

header#editor .main-menu li.active a span{ color: #2908C6;}
header#editor .main-menu .button{ margin-bottom: 0px; }

footer {
    display: none;
}

footer .main-menu{
    margin-right: 140px;
}

footer .main-menu{
    list-style: none;
    display: inline-block;
    padding: 0px;
    margin-bottom: 0px;
    width: 100%;
}

footer .main-menu li{
    display: inline-block;
    width: 19%;
    text-align: center;
}

footer .main-menu li > a{
    padding: 5px 0 5px 0;
    display: inline-block;
    font-size: 12px;
}

footer .main-menu li.active{
    border-bottom: none;
}

footer .main-menu li.active a, 
footer .main-menu li a:hover{
    color: #2908C6;
    text-decoration: none;
}

header .option-menu{
    list-style: none;
    display: inline-block;
    padding: 0px;
    margin-bottom: 0px;
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 1;
}

header .option-menu-mobile{ display: none; }
header .option-menu > li {
    display: inline-block;
    border-width: 0px 1px 0px 1px;
    border-color: transparent;
    border-style: solid;
    max-height: 60px;
    height: 60px;
    min-width: 60px;
    margin: 0px 0px;
    float: left;
    float: right;
    max-width: 60px;
    cursor: pointer;
}

header .option-menu > li > div{
    padding: 30px 10px;
    line-height: 0px;
    min-width: 60px;
    height: 60px;
    cursor: pointer;
    position: relative;
}

header#editor .option-menu > li{
    max-width: initial;
}

header#simple .option-menu > li {
    width: auto;
    max-width: initial;
}

header .option-menu > li > div [class^="icon-"], header .option-menu > li > div [class*=" icon-"]{
    line-height: 0px;
}

header .option-menu > li > a {
    width: 30px; height: 30px;
    display: block;
    position: relative;
}

header#editor .option-menu > li > a{
    width: auto;
    font-size: 14px;
    font-weight: 600;
    padding: 23px 10px;
    line-height: 0px;
    min-width: 60px;
    height: 60px;
    cursor: pointer;
    position: relative;
}

header .option-menu > li > a.icon{
    transform: translateY(5px);
}

header #alertnotificator{
    position: relative;
}

header #alertnotificator.active{
    color: #2908C6;
    border-bottom: 2px solid #2908C6;
    padding: 29px 10px;
}

header #alertnotificator[data-unreadnotifications]:before{
    content: attr(data-unreadnotifications);
    background-color: #2908C6;
    color: #ffffff;
    position: absolute;
    border-radius: 20px;
    top: 10px;
    right: 4px;
    width: 22px;
    line-height: 14px;
    font-size: 14px;
    font-family: hkgroteskpro;
    padding: 4px 2px;
    text-align: center;
}
    header #alertnotificator[data-unreadnotifications="0"]:before {
        content: none;
    }

    .accountListDropdown {
        max-height: calc(100vh - 100px);
        overflow-y: auto !important;
    }

    #alertlist{
        list-style: none;
        padding: 0px;
    }

    #lazy_alerts{
        height: 70vh;
        overflow-y: auto;
    }

    #alertlist li{ position: relative; padding: 0px; }

    #alertlist .alertstitle{
        margin: 10px;
        border-bottom: 1px solid #C9D0E1;
        color: #204761;
        padding: 10px 0;
        font-weight: 700;
    }

    #alertlist form {
        display: inline-block;
        float: right;
    }

    #alertlist button#markedasread {
        padding: 0px;
        border-radius: 0;
        border: none;
        display: inline-block;
        float: right;
        width: auto;
        color: #2908C6;
        border-bottom: 2px solid #2908C6;
        font-weight: 400;
    }

    #alertlist p{ font-weight: 500; font-size: 15px; margin-bottom: 0px;}
    #alertlist p small{ font-weight: 200; font-size: 10px; margin-bottom: 0px;}
    #alertlist span[class*="icon-"]{ float: right; font-size: 20px; margin: 0px 15px 0px 0px;}

     #alertlist .alertlistitem_left{
            width: 50px;
        position: absolute;
        left: 0px;
        top: 50%;
        transform: translateY(-50%);
     }

     #alertlist hr{ margin: 0px 15px; }
    #alertlist .alertlistitem_left + .alertlistitem_left{
        left: 50px;
    }

    #alertlist .alertlistitem_left span[class*="icon-"]{
        margin: 0px 7px 0px 0px;
    }

        #alertlist .alertlistitem_left .productholder {
            width: 60px;
            height: 60px;
            display: block;
            border-radius: 6px;
            background-color: #CCCCCC;
            position: relative;
            top: 0px;
            left: 20px;
            content: '';
            background-size: cover;
            background-position: 50%;
                box-shadow: 0px 2px 5px #00000026;
        }

        #alertlist .alertlistitem_left .logoholder {
            position: absolute;
            border: 2px solid white;
            border-radius: 17px;
        }

     #alertlist .alertlistitem_center{
        float: left;
        display: inline-block;
        margin-left: 100px;
        margin-right: 50px;
        left: 0px;
        top: 0px;
     }

     #alertlist .alertlistitem_right{
        width: 50px;
        position: absolute;
        right: 0px;
        top: 50%;
        transform: translateY(-50%);
     }

     #alertlist li.unread:before{
         content: '';
         position: absolute;
         top: 50%;
         left:0px;
         width: 4px;
         height: 70%;
         transform: translateY(-50%);
         border-radius: 0 4px 4px 0;
         background-color: #2908C6;
     }

#loadedsections #alertlist .alertlistitem_left .productholder {
    width: 80px; height: 80px;
}

#loadedsections #alertlist {
    max-width: 100%;
    margin-bottom: 0px;
}

#loadedsections h2 {
    font-size: 20px;
    margin: 20px 0px;
}

#loadedsections .row[data-timeframe] {
    border-bottom: 1px solid #C9D0E1;
    margin-bottom: 30px;
}

#loadedsections #alertlist li {
    padding: 20px 0px;
    border-bottom: 1px solid #C9D0E1;
    margin: 0px;
    min-height: 120px;

}
    #loadedsections #alertlist li .logoholder {
        top: 26px;
        left: 84px;
    }
    #loadedsections #alertlist li:last-of-type {
        border-bottom: none;
    }

#loadedsections .alertlistitem_time_left {
    width: 100px;
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
    font-size: 14px;
    border-right: 1px solid #C9D0E1;
    height: 100%;
}

.alertlistitem_time_left > div {
    position: absolute;
    left: 0px;
    width: 100%;
    top: 50%;
    transform: translateY(-50%);
}

#loadedsections #alertlist a {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

#loadedsections #alertlist .alertlistitem_center {
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
}

#loadedsections #alertlist .alertlistitem_left {
    width: 100px;
    position: absolute;
    left: 100px;
    top: 50%;
    transform: translateY(-50%);
}

#loadedsections #alertlist .alertlistitem_center {
    margin-left: 230px;
}

#loadedsections{ position: relative; }
#loadedsections.loadingmore:after {
    content: 'Loading More...';
    position: absolute;
    bottom: 10px;
    right: 10px;
}

/*HEADER MENUS*/
a[data-dropdown], a[data-sidebar] {
    width: 30px;
    height: 30px;
    display: block;
    background-position: 50%;
    background-repeat: no-repeat;
    text-decoration: none;
    font-size: 17px;
    cursor: pointer;
}

li.opened div[data-dropdown], li.opened div[data-sidebar] {
    color: transparent;
}

header .option-menu > li.opened{
    border-width: 0px 1px 0px 1px;
    border-color: #C9D0E1;
    border-style: solid;
    border-bottom: 1px solid #ffffff;
    box-shadow: 0 1px 0 #ffffff;
}
header .option-menu > li:first-of-type.opened{
    border-right-color: transparent;
}
header .left-option-menu{
    right: auto;
}

li:last-of-type.opened {
    border-right: 0px;
}

li.opened div[data-dropdown]:after, 
li.opened div[data-sidebar]:after{
    content: "\e92f";
    position: absolute;
    color: #92959C;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 50%;
}

div[data-dropdown="account-open"] > div{
    background-image: none;
    background-color: #CCCCCC;
    border-radius: 15px;
    width:30px;
    height:30px;
    background-size: cover;
    background-position: 50%;

    margin: auto;
    margin-top: -15px;
}

li.opened div[data-dropdown="account-open"] > div{
    opacity: 0.3;
}

#search{
    width:100%;
    height:100%;
    position: fixed;
    padding: 50px 120px;
    background-color: #ffffff;
    display: none;
    z-index: 80;
    top: 60px;
}
#search.opened{
    display: block;
}
#seachtext{ font-size: 36px; border-bottom: none; }
#searchresults{
    height: 80vh;
    overflow-y: auto;
    overflow-x: hidden;
}

/*PANELS*/
.container-fluid h1:first-child {
    margin-top: 0px;
}
h1.panelHeading, .h1.panelHeading, .panelHeading{
    margin-bottom: 0px;
    display: inline-block;
}
span.panelHeading{
    color: #204761;
    font-size: 20px;
}
    span.panelHeading .filteredby {
        color: #92959C;
    }
    .breadcrumb_folder small {
        font-size: 14px;
        color: #92959C;
    }
.panelHeading button.iconbutton {
    opacity: 0;
    transition: 0.5s linear opacity;
}
.panelHeading:hover button.iconbutton{
    opacity: 1;
}
.panel-holder, .panel-holder-nocarousel{
    transition: 0.3s ease-in-out height, 0.7s ease-in-out padding;
    padding-top: 30px;
}

    .panel-holder.immediate, .panel-holder-nocarousel.immediate {
        transition: none;
    }
.panel-holder.flex, .panel-holder-nocarousel.flex, .flex{
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-align-content: flex-end;
    align-content: flex-end;
    margin-right: -15px;
    overflow: visible;
}
    .panel-holder.flex.center, .panel-holder-nocarousel.flex.center, .flex.center {
        align-items: center;
    }

.panel-holder.flex.contracted{
    overflow: hidden;
    padding-top: 0px;
}

.panel-holder.flex.expanding{
    overflow: hidden;
}
.panel{
    width: 255px;
    border: #C9D0E1 1px solid;
    border-radius: 6px;
    float: left;
    margin-right: 30px;
    box-shadow: none;
    transition: 0.3s ease-in-out box-shadow, 0.3s ease-in-out transform;
    position: relative;
    flex: 1 0 280px;
    max-width: 255px;
    color: #b2b7c7;
}
    .panel p.textonly {
        position: absolute;
        top: 50%;
        width: 100%;
        text-align: center;
        padding: 0 20px;
        transform: translateY(-50%);
    }

    .panel.folder_panel_wide {
        max-width: 407px;
        width: 407px;
    }

        .panel.folder_panel_wide .panel-image {
            padding-top: 44.5%;
        }

        .panel.folder_panel_wide .panel-body .panel-bottom {
            padding-top: 0px;
            border-top: none;
        }

        .panel.folder_panel_wide .panel-body .panel-bottom p {
            padding-left: 0px;
            margin-bottom: 0px;
        }

        .panel.folder_panel_wide .panel-body h2 {
            font-size: 22px;
        }

    .panel.disabled {
        opacity: 0.3;
        pointer-events: none;
    }

    .panel.visuallydisabled {
        opacity: 0.3;
    }

.panel .panel-image a.underlink,
.panel.basic-post a.underlink{
    position:absolute; 
    width:100%;
    height:100%;
    top:0;
    left: 0;
    opacity: 0;
    z-index: 10;
    border-radius: 6px 6px 0 0;
    transition: linear 0.3s opacity;
    text-align: center;
    min-width: initial;
}
.panel .panel-image .content_type{
    padding: 6px 16px;
    position: absolute;
    top: 0px; right:0px;
    width: 40px; height: 40px;
    border-radius: 0 8px 0 100%;
    background-color: #ffffff;
    left: initial;
    z-index: 5;
    border-left: 1px solid #C9D0E1;
    border-bottom: 1px solid #C9D0E1;
    box-shadow: -2px 2px 6px 0px rgba(0, 0, 0, 0.08);
    pointer-events: none;
}
    .panel .panel-image .userIsAzzuuAdmin {
        position: absolute;
        top: 5px;
        right: 5px;
        width: 30px;
        height: 30px;
        left: initial;
        transform: none;
  
    }

    .panel .panel-image[data-textonly]:after {
        content: attr(data-textonly);
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        color: #204761;
        font-size: 15px;
        text-align: center;
    }

.panel:hover .panel-image a.underlink{
    background-color: rgba(32, 71, 97, 1);
    opacity: 0.4;
    z-index: 4;
}
.panel .imagepanel{
    transition: linear 0.3s filter;
}
    .panel:hover .imagepanel,
    .panel:hover .panel-image-preview {
        filter: blur(2px);
    }
.panel a, .panel button{ outline: none; }
.panel a:hover{opacity: 0.5; }
.panel.archiveinprogress{
    opacity: 0.3;
    transition: 0.5s linear opacity;
}
.panel-holder-small .panel{
    width: 100px;
    margin-right: 7px;
}
.panel-holder-small .panel .panel-body .panel-bottom p{
    padding-left: 0px;
}
.panel-holder-small .panel .panel-body {
    padding: 5px;
}
.panel-holder-small .panel .panel-body .panel-bottom{
    margin-top: 5px;
    padding-top: 5px;
}

.panel-holder-small .panel .panel-image{
    height: 80px;
}
.panel-holder-small .panel .panel-body h2{
    font-size: 13px;
}
.panel:hover{
    transform: translate(0, -2px);
    cursor: pointer;
    box-shadow: 0px 4px 14px rgba(0,0,0,0.1);
}
#calendar_panel{ height: calc(100vh - 180px); }
.calendar-container .panel:hover {
    transform: translate(0, 0px);
}

.panel .panel-image{
    width:100%;
    padding-top: 73%;

    background-color: #e9eaeb;
    position: relative;
    border-radius: 6px 6px 0 0;
    background-position: 50%;
    background-size: cover;
    background-repeat: no-repeat;
    transition: ease-in-out 0.3s background-size;
    /*center the button with flexbox*/
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row; /* works with row or column */ 
    flex-direction: row;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
}
[data-tab-source] .panel .panel-image {
    background-position: 50% 10%;
}
.panel .panel-image .imagepanel{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0px 5px 10px rgba(0,0,0,0.3);
    background-size: contain;
    z-index:2;
    pointer-events: none;
    animation: 0.5s linear 0s 1 fadeIn;
}

    .panel .panel-image img {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        box-shadow: 0px 5px 10px rgba(0,0,0,0.3);
        background-size: contain;
        z-index: 2;
        pointer-events: none;
        animation: 0.5s linear 0s 1 fadeIn;
        width: 90%;
        height: 90%;
        object-fit: contain;
        box-shadow: none;
    }
.panel.panel-dual-logo .panel-image img {
    width: 90%;
    height: 90%;
    top: 30%;
}
    .panel.panel-dual-logo .panel-image img + img {
        width: 70%;
        height: 70%;
        top: 70%;
    }

@keyframes fadeIn {
    0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn50pc {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 0.5;
    }
}
@keyframes fadeInDropdown {
    0% {
    opacity: 0;
    transform: translate(-50%, -100px);
  }
  100% {
    opacity: 1;
    transform: translate(-50%, 0px);
  }
}
@keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes fadeOut50pc {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0.5;
    }
}

.panel .panel-image > div.tickbox {
    opacity: 0;
    right: 10px;
    left: auto;
    top: 10px;
    border-color: #ffffff;
    background-color: rgba(233, 234, 235, 0.75);
}
body.multiselectactive .panel .panel-image > div.tickbox {
    opacity: 1;
}
.multiselectbar {
    opacity: 0;
    bottom: -100px;
    transition: 0.4s ease-out bottom;
}
    .multiselectbar button{ margin-bottom: 0px; }
body.multiselectactive .multiselectbar {
    position: fixed;
    opacity: 1;
    bottom: 0px;
    left: 0px;
    width: 100%;
    padding: 15px;
    background-color: #ffffff;
    border-top: 1px solid #B2B7C7;
    z-index: 10;
}
.panel:hover .panel-image > div.tickbox {
    opacity: 1; 
}

.panel .panel-image > div{
    padding: 10px;
    position: absolute;
    z-index: 6;
    top: 0px;
    left: 0px;
}

.panel .panel-image > div > button,
.panel .panel-image > div > a{
    background-color: #ffffff;
    border: none;
    border-radius: 20px;
    float:left;
    opacity: 0;
    transition: 0.2s opacity ease-in-out;
    font-size: 15px;
    color: #B2B7BF;
    margin-right: 7px;
    margin-left: 0px;
    text-align: center;
}
.panel .panel-image > div > a, .panel .panel-image > div > a:hover{
    line-height: 30px;
}
.panel .panel-image > div > button:hover,
.panel .panel-image > div > a:hover,
.panel .panel-image > div > a:focus,
.panel .panel-image > div > a:active{
    color: #ffffff;
    background-color: #2908C6;
    text-decoration: none;
}

.panel .panel-image > div > button[disabled]:hover,
.panel .panel-image > div > a[disabled]:hover{
    color: #ffffff;
    background-color: #92959C;
    text-decoration: none;
}

.panel .panel-image > button,
.panel .panel-image > a.button{
    position: absolute;
    opacity: 0; transition: 0.2s opacity ease-in-out;
    color: #ffffff;
    border-color: #ffffff;
    background-color: transparent;
    z-index: 12;
    margin: 0px;
    top: calc(50% - 21px);
    text-align: center;
    min-width: initial;
}

.panel .panel-body > button,
.panel .panel-body > a.button {
    text-align: center;
    min-width: initial;
}

.popup a span[class^="icon-"] {
    color: currentColor;
}
    .panel.panel-small .panel-image > button,
    .panel.panel-small .panel-image > a.button {
        font-size: 11px;
    }

.panel .panel-image > button:hover,
.panel .panel-image > a.button:hover{
    background-color: #2908C6;
    border-color: #2908C6;
}

.panel:hover .panel-image > div > button,
.panel:hover .panel-image > div > a,
.panel:hover .panel-image > button,
.panel:hover .panel-image > a{
    opacity: 1;
}

.panel-image .panel-image-preview {
    position: absolute;
    top: 0px; left: 0px;
    width: 100%; height: 100%;
    background-color: #e9eaeb;
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
}

.panel .panel-image > div.img_1_of_2{
    height: 50%;
    border-bottom: 3px solid #ffffff;
    border-radius: 6px 0px 0 0;
}

.panel .panel-image > div.img_2_of_2{
    height: 50%;
    top: 50%;
}

.panel.folder_panel_wide .panel-image > div.img_1_of_2 {
    width: 50%;
    height: 100%;
    top: 0%;
    border-right: 3px solid #ffffff;
    border-bottom: none;
}

.panel.folder_panel_wide .panel-image > div.img_2_of_2 {
    width: 50%;
    top: 0%;
    height: 100%;
    left:50%;
}

.panel.video_panel video {
    object-fit: cover;
    border-radius: 8px 8px 0 0;
}

#userfoldersdrag {
    display: none;
    padding: 15px;
    background-color: #c9d0e1ab;
    border-radius: 6px 0px 0px 6px;
}

    #userfoldersdrag.floatforselection {
        display: block;
        position: fixed;
        top: 60px;
        right: 0px;
        width: 190px;
        max-height: calc(100vh - 60px);
        overflow: hidden;
        overflow-y: auto;
        z-index: 30;
    }

        #userfoldersdrag.floatforselection button.rejectionButton,
        #userfoldersdrag.floatforselection input[type=button].rejectionButton,
        #userfoldersdrag.floatforselection input[type=submit].rejectionButton,
        #userfoldersdrag.floatforselection a.button.rejectionButton {
            background-color: #F2545E;
            border-color: #F2545E;
            color: #ffffff;
        }

    #userfoldersdrag .current_folder.drags_droparea_active {
        background-color: #e5f1ed;
    }

#userfoldersdrag .drags_droparea_active {
    background-color: #ffffff;
}

.small-folder-icon {
    background-image: url(/content/folder.svg);
    width: 20px;
    height: 20px;
    display: inline-block;
    background-size: contain;
    background-position: bottom;
    background-repeat: no-repeat;
    margin-right: 10px;
}

#imagetoupload_holder{ display: none; }
#uploading_holder{ display: none;}
#uploading, .upload_progress {
    background-color: #e0e2e6;
    min-height: 15px;
    margin-bottom: 15px;
}
    .upload_progress{
        display: none;
    }
    #uploading > div, .upload_progress > div {
        background-color: #2908C6;
        width: 1%;
        height: 15px;
        transition: 0.3s ease-in-out width;
    }

.panel .panel-image > div.img_1_of_3 {
    height: 50%;
    width: 50%;
    border-bottom: 3px solid #ffffff;
    border-right: 3px solid #ffffff;
    border-radius: 6px 0px 0 0;
}
.panel .panel-image > div.img_2_of_3 {
    height: 50%;
    width: 50%;
    width: 50%;
    left: 50%;
    border-bottom: 3px solid #ffffff;
    border-radius: 0px 6px 0 0;
}
.panel .panel-image > div.img_3_of_3{
    height: 50%;
    top: 50%;
}

.panel .panel-image > div.panel-image-preview{
    z-index: 5;
    pointer-events: none;
}

.panel .panel-image > div.img_1_of_1 {
    border-radius: 6px 6px 0 0;
    border: 15px solid #e9eaeb;
}

.panel .panel-image > div.img_1_of_4{
    height: 50%;
    width:50%;
    border-bottom: 3px solid #ffffff;
    border-right: 3px solid #ffffff;
    border-radius: 6px 0 0 0;
}
.panel .panel-image > div.img_2_of_4{
    height: 50%;
    top: 0%;
    width:50%;
    width:50%;
    left: 50%;
    border-bottom: 3px solid #ffffff;
    border-radius: 0 8px 0 0;
}
.panel .panel-image > div.img_3_of_4{
    height: 50%;
    top: 50%;
    width:50%;
    border-right: 3px solid #ffffff;
}
.panel .panel-image > div.img_4_of_4{
    height: 50%;
    top: 50%;
    width:50%;
    left: 50%;
}

.panel .panel-image > div.img_1_of_5 {
    height: 50%;
    top: 0%;
    width: 33.3%;
    left: 0%;
    border-bottom: 3px solid #ffffff;
    border-right: 3px solid #ffffff;
    border-radius: 6px 0 0 0;
}

.panel .panel-image > div.img_2_of_5 {
    height: 50%;
    top: 0%;
    width: 33.3%;
    left: 33.3%;
    border-bottom: 3px solid #ffffff;
    border-right: 3px solid #ffffff;
}

.panel .panel-image > div.img_3_of_5 {
    height: 50%;
    top: 0%;
    width: 33.3%;
    left: 66.6%;
    border-bottom: 3px solid #ffffff;
    border-right: none;
    border-radius: 0 6px 0 0;
}

.panel .panel-image > div.img_4_of_5 {
    height: 50%;
    top: 50%;
    width: 50%;
    left: 0%;
    border-right: 3px solid #ffffff;
}

.panel .panel-image > div.img_5_of_5 {
    height: 50%;
    top: 50%;
    width: 50%;
    left: 50%;
    border-right: 3px solid #ffffff;
}

.panel .panel-image > div.img_1_of_6 {
    height: 50%;
    top: 0%;
    width: 33.3%;
    left: 0%;
    border-bottom: 3px solid #ffffff;
    border-right: 3px solid #ffffff;
    border-radius: 6px 0 0 0;
}
.panel .panel-image > div.img_2_of_6 {
    height: 50%;
    top: 0%;
    width: 33.3%;
    left: 33.3%;
    border-bottom: 3px solid #ffffff;
    border-right: 3px solid #ffffff;
}
.panel .panel-image > div.img_3_of_6 {
    height: 50%;
    top: 0%;
    width: 33.3%;
    left: 66.6%;
    border-bottom: 3px solid #ffffff;
    border-right: none;
    border-radius: 0 6px 0 0;
}
.panel .panel-image > div.img_4_of_6 {
    height: 50%;
    top: 50%;
    width: 33.3%;
    left: 0%;
    border-right: 3px solid #ffffff;
}

.panel .panel-image > div.img_5_of_6 {
    height: 50%;
    top: 50%;
    width: 33.3%;
    left: 33.3%;
    border-right: 3px solid #ffffff;
}

.panel .panel-image > div.img_6_of_6 {
    height: 50%;
    top: 50%;
    width: 33.3%;
    left: 66.6%;
}

.panel .panel-body{
    padding: 12px;
    font-size: 12px;
}
.panel .panel-body h2, .panel .panel-body h1{
    margin-top: 0px;
    margin-bottom: 5px;
    font-weight: 400;
    overflow: hidden;
}
.panel .panel-body img{
    padding-right: 10px;
}
.panel .panel-body .panel-bottom{
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #C9D0E1;
    position:relative;
}
.panel .panel-body .panel-bottom p{
    padding-left: 25px;
}
#FileSystemHolder .panel .panel-body .panel-bottom p{
    padding-left: 0px;
}
.panel .panel-body .panel-bottom p.switchaccount{
    cursor: pointer;
}
    .panel .panel-body .panel-bottom p.switchaccount:hover,
    .panel .panel-body .panel-bottom .showhide:hover p {
        font-weight: 700;
    }

.panel .panel-body .panel-bottom span[class*="icon-"]{
    font-size: 15px;
    position: absolute; 
    left: 0px
}

.panel .panel-body .panel-bottom button span[class*="icon-"]{
    font-size: inherit;
    position: inherit;
}

.panel .helptext{
    font-size: 13px;
}
.panel p{
    margin-bottom: 5px;
}

.panel.basic-post{
    font-size: 14px;
    text-align: center;
}
.panel.basic-post h2{
    font-size: 20px;
    font-weight: 600;
}
.panel.basic-post h2.longer{
    font-size: 14px;
    margin-top: 4px;
}
.panel.basic-post .panel-body{
    padding: 20px;
}
.panel.basic-post .panel-body button{
    margin-top: 20px;
}
.panel.basic-post .panel-image{
    width: 64px;
    height: 64px;
    border-radius: 32px;
    margin: 0 auto;
    margin-top: 20px;
    padding: 0px;
    background-color: #C9D0E1;
}
.panel.basic-post .panel-image [class^="icon-"], .panel.basic-post .panel-image [class*=" icon-"]{
    color: #ffffff;
    font-size: 32px;
}
.panel.basic-post .panel-header{
    padding: 10px;
    border-radius: 6px 6px 0 0;
    color: #ffffff;
}

.panel.panel-small{
    width: 160px;
    font-size: 11px;
    flex: 1 0 160px;
    max-width: 200px;
}
.panel.panel-small .panel-image{
    height: 125px;
}
    .panel.panel-small .panel-body h2 {
        font-size: 13px;
    }
.panel.panel-small .panel-body h2 a{
    font-size: 13px;
    color: #3165AF;
}
.panel h2 a {
    color: #204761;
}

.slick-slider{ 
    width: 100vw;
}

.section.trending-holder.api-holder{
    top: 123px;
}
.section.trending-holder.event-holder {
    top: 60px;
    border: none;
    background-color: initial;
    margin-top: 0px;
    margin-bottom: 0px;
    width: 315px;
}

.section.trending-holder {
    position: absolute;
    width: 396px;
    top: 127px;
    right: 30px;
    z-index: 1;
}

.section.trending-holder.follow{
    position: fixed;
    top: 100px;
}
.section.trending-holder .contents{
    max-height: 70vh;
    overflow-y: auto;
}

.trending-present{
    padding-right: 440px;
}

.trending-masonry{
    margin-left: auto;
    margin-right: auto;
    display: block;
}
.panel.trending-panel{
    padding: 15px;
    margin-right: 0px;
    flex: none;
    max-width: 255px;
    transition: none;
}
.panel.trending-panel .feedname{
    margin-right: 22px;
}
.panel.trending-panel .icon-trending,
.panel.trending-panel .icon-rss{
    position: absolute;
    right: 15px;
}

.panel.trending-panel .panel-body{
    padding: 12px 0px 0px 0px;
}
.panel.trending-panel .panel-image{
    border-radius: 6px;
}
.panel.trending-panel .panel-body .roundbutton {
    margin-bottom: 0px;
}
.panel.trending-panel.createpostusingtrending .panel-body h2{ font-size: 26px;}
.panel.trending-panel.createpostusingtrending .panel-body h2.short{ font-size: 40px;}
.panel.trending-panel.createpostusingtrending .panel-body h2.long{ font-size: 18px;}
.panel.trending-panel.createpostusingcalendar .panel-body h2{ font-size: 19px;}

.panel .content_animated{
    float: right; padding: 5px 0px; font-size: 15px; color: #f5ad03;
}
.panel.activepanel{
    border: 1px solid #2908C6;
}

.imagelazyloading:after{
    content: 'Loading';
    top: 50%;
    left:50%;
    position: absolute;
    color: #ffffff;
    transform: translate(-50%, -50%);
}
.imagelazyloading.imagelazyloaded {
    background-color: #e9eaeb;
}
.imagelazyloading.imagelazyloaded:after {
    content: none;
}

#trendinglists{
    list-style: none;
    padding: 0px;
    margin: 0px;
    text-align: center;
}
#trendinglists li{    
    margin: 0px 0px;
    display: inline-block;
    cursor: pointer;
}
    #trendinglists li.selected > div {
        border-color: #2908C6;
        color: #2908C6;
    }
    #trendinglists li > div {
        padding: 7px 17px;
        border: 1px solid #C9D0E1;
        background-color: #ffffff;
        border-radius: 22px;
        margin: 0 7px 10px 7px;
    }

.socialchannels,
.posttype{
    list-style: none;
    padding: 0px;
    margin: 0px;
}
body .socialchannels li,
.posttype li{
    display: inline-block;
    padding-right: 10px;
    float: none;
}
    body .socialchannels li [class*="icon-"] {
        margin-right: 0px;
    }
.socialchannels li:last-of-type,
.posttype li:last-of-type{
    padding-right: 0px;
}

/*SOCIAL POSTING*/
#trending-open-tab{ display: none; }
.tabs {
}
.tab {
    width: 50%;
    float: left;
    padding: 15px 15px;
    text-align: center;
    background-color: #E4E5E6;
    border: 1px solid #C9D0E1;
    border-top: 0px;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
    border-left: 0px;
    position: relative;
}
    .tab.third{
        width: 33.33333333%;
    }
        .tab.quater {
            width: 25%;
        }
        .tab.fifth {
            width: 20%;
        }
.tabs .tab sub, .tabs .tab sup {
    display: block;
    margin-top: 0px;
    line-height: initial;
    top: initial;
}

.tabs.x2 .tab {
    width: 50%;
}
.tabs.x3 .tab {
    width: 33.33333333%;
}
.tabs.x4 .tab {
    width: 25%;
}
.tabs.x5 .tab {
    width: 20%;
}
.tabs.tabs_rounded .tab:first-child {
    border-radius: 6px 0px 0 0;
    border: none;
    border-bottom: 1px solid #C9D0E1;
    border-right: 1px solid #C9D0E1;
}
.tab.active {
    background-color: #ffffff;
    border-bottom: #ffffff 1px solid !important;
    color: #2908C6;
}
    .tab.error {
        background-color: #f6e6e7;
        border-bottom: #f6e6e7 1px solid !important;
        color: #f2545e;
    }
    .tab.active.error {
        background-color: #f8eeef;
        border-bottom: #f8eeef 1px solid !important;
        color: #f2545e;
    }
.tabs.tabs_rounded .tab:nth-last-child(2) {
    border-radius: 0px 6px 0 0;
    border: none;
    border-bottom: 1px solid #C9D0E1;
}
    .tabs_midsection {
        border-top: 1px solid #C9D0E1;
        margin-left: -15px;
        margin-right: -16px;
    }
    .tabs_midsection .tab:first-child{
        border-left: none;
    }

      .tabs .tab[data-number="1"]::before{ content: '1. ';}
    .tabs .tab[data-number="2"]::before{ content: '2. ';}
    .tabs .tab[data-number="3"]::before{ content: '3. ';}
    .tabs .tab[data-number="4"]::before{ content: '4. ';}
    .tabs .tab[data-number="5"]::before{ content: '5. ';}

.tabs.hideimage .tab[data-tab-target="image"] {
    display: none;
}

.faketab {
    background-color: #ffffff;
    border: 1px solid #C9D0E1;
    border-top: none;
    padding: 15px;
}
    div[class*="col-"] .section.extrapadding .contents .tabs_midsection{
        margin-left: -30px;
        margin-right: -31px;
    }

.socialListPanels {
    margin: 0px;
    padding: 0px;
    display: flex;
    flex-wrap: wrap;
}
     .socialListPanels li{
        float: left;
        width: 190px;
        display: inline-block;
        list-style: none;
        margin: 0px;
        text-align: center;
        margin-right: 15px;
        margin-bottom: 15px;
        user-select: none;
        min-height: 170px;
     }
     .socialListPanels li .slider{
        left: calc(50% - 15px);
     }

     .socialListPanels li.accountDisabled.messageentered[data-checked=true] .social_label{
         background-color: #FEF3F4;
     }
     
     .socialListPanels li > .social_label{
         width: 100%;
         padding: 15px;
         border: 1px solid #cccccc;
         border-radius: 10px;
         position:relative;
         cursor: pointer;
         display: inline-block;
         margin-bottom: 10px;
     }
     .socialListPanels li.selected > .social_label{
         border-width: 2px;
     }

     .socialListPanels span.social_size.col {
        font-size: 22px;
        margin-bottom: 15px;
        display: inline-block;
    }

     .socialListPanels input[type=checkbox]{
         display: none;
     }

     .socialListPanels input[type=checkbox]:checked + .social_label{
         border-color: #92959C;
     }
     .socialListPanels input[type=checkbox].selected:checked + .social_label,
     .socialListPanels input[type=checkbox][checked].selected + .social_label{
         border-color: #2908C6;
     }

    .socialListPanels li[data-checked=false] .social_label {
        background-color: #F3F4F6;
    }
    .socialListPanels li[data-checked=false] .social_label span.col {
        color: #BEBFC4 !important;
    }

    .socialListPanels li[data-checked=true] .message-state,
    .socialListPanels li[data-checked=true] .message-status{
        cursor: pointer;
    }
    .socialListPanels li .message-status{
        font-size: 12px;
    }
    .socialListPanels li[data-checked=true] .message-state:after{
         content: 'Create Message';
         color:#C9D0E1;
     }
    .socialListPanels li.messageentered[data-checked=true] .message-state:after{
         content: 'Edit Message';
         color:#92959C;
     }
     .socialListPanels li.messageentered.selected[data-checked=true] .message-state:after,
     .socialListPanels li.selected[data-checked=true] .message-state:after{
         content: 'Editing Now';
         font-weight: 600;
         color: #2908C6;
     }
     .socialListPanels li.messageentered.accountDisabled[data-state=rejected] .message-state:after{
         content: 'This Is Not Editable';
         
     }
        .socialListPanels li.selected.messageentered.accountDisabled[data-state=rejected] .message-state:after {
            color: #f2545e;
        }

     .socialListPanels li.selected .social_label{
         border-color: #2908C6;
     }
     .socialListPanels li.messageentered[data-checked=true] .social_label{
        background-color: #F3FDF9;
     }
     .socialListPanels li[data-state=cancel_circle] .social_label,
     .socialListPanels li[data-state=rejected] .social_label,
     .socialListPanels li[data-state=errored] .social_label{
         border-color: #f2545e;
     }
     .socialListPanels li[data-state=rejected] .social_label{
         background-color: #FEF3F4;
     }
        .socialListPanels li[data-state=livedisabled] .social_label {
            background-color: #eef4fb;
        }
        .socialListPanels li[data-state=livedisabled].messageentered[data-checked=true] .social_label {
            background-color: #f3f8fd;
        }
        .socialListPanels li[data-state=livedisabled] .social_label {
            border-color: #8295ae;
        }
        .livedisabled { color: #8295ae; }
        .socialListPanels li[data-state=awaiting] .social_label{
            border-color: #f5ad03;
        }

    .socialListPanels.scheduledListPanels li.selected .postdate:after{
        color: #92959C;
    }
    .socialListPanels.scheduledListPanels li.dateselected .postdate:after {
        color: #2908C6;
    }
    .socialListPanels.scheduledListPanels li .postdate:after{
         content: attr(data-scheduleddate);
         color: #C9D0E1;
     }
    .socialListPanels.scheduledListPanels li.selected .postdate:after{
        font-weight: 600;
    }
    .socialListPanels.scheduledListPanels li .postdate.negative:after{
         content: attr(data-error);
         color: #f2545e;
     }
     .socialListPanels.scheduledListPanels li.dateselected .social_label{
         background-color: #F3FDF9;
     }
     .socialListPanels.scheduledListPanels li.dateerror .social_label{
         background-color: #FEF3F4;
     }

        .socialListPanels input[type=checkbox] + .social_label .remove {
            display: none;
        }
        .socialListPanels input[type=checkbox]:checked + .social_label .remove,
        .socialListPanels input[type=checkbox][checked] + .social_label .remove {
            display: block;
            position: absolute;
            top: 0px;
            left: 0px;
            background-color: #f2545e;
            color: #ffffff;
            padding: 7px 17px 13px 10px;
            border-radius: 5px 0 100% 0;
            cursor: pointer;
        }
     .socialListPanels input[type=checkbox] + .social_label .tick{
         display: none;
         position: absolute;
        top: 0px;
        right: 0px;
        background-color: #2908C6;
        color: #ffffff;
        padding: 7px 7px 13px 23px;
        border-radius: 0 5px 0 100%;
     }
        .socialListPanels input[type=checkbox] + .social_label .tick.show {
            display: block;
        }
     .socialListPanels input[type=checkbox].textentered + .social_label .tick{
         display: block;
     }

    .socialListPanels input[type=checkbox] + .social_label .state{
         position: absolute;
        top: 0px;
        right: 0px;
        color: #ffffff;
        padding: 7px 7px 13px 23px;
        border-radius: 0 5px 0 100%;
     }
    .socialPanelHolder .schedule_error {
        font-size: 13px;
    }

    .bootstrap-datetimepicker-widget {
        border: 1px solid #C9D0E1;
        border-radius: 6px;
        margin-bottom: 100px;
    }
    #timepicker_start{ display: none; }

     .post-message-previewcreator{
         border-radius: 5px;
         width:100%;
     }
     .post-message-previewcreator tr td{
         width:50%;
         vertical-align: top;
         position: relative;
     }
     .post-message-previewcreator tr td{
        padding-right: 30px;
     }
     #writemessage .emojiInput, .edit-post-message .emojiInput{
         border: 0px; padding: 15px;
         width: 100%;
         height: 300px;
         margin-top: 42px;
         display: block;
         border-radius: 0 0 8px 8px;
     }
        #writemessage .emojiInput{
            height: 300px;
        }
        .edit-post-message .wdt-emoji-picker-parent {
            border: 1px solid #c9d0e1;
            border-radius: 6px;
            position: relative;
        }
    .edit-post-message .wdt-emoji-picker-parent .emojiInput{
        border-top: 1px solid #c9d0e1;
    }
    .wdt-emoji-popup.open{ z-index: 200; }
     #writemessage .emojiInput[disabled]{
         background-color: #FEF3F4;
     }
     .wdt-emoji-picker-parent.inputdisabled:after{
         content: 'This Message is no longer editable';
         position: absolute;
         left: 15px;
         bottom: 0px;
         color: #f2545e;
     }
     .wdt-emoji-picker-parent.inputdisabled .charactercount{
         color: #f2545e;
     }
     #writemessage .messageinfooptions{
        border-bottom: 1px solid #C9D0E1;
        padding: 10px;
        position: absolute;
        top: 0px;
        width: 100%;
        padding-right: 41px;
        z-index: 1;
     }
     .event-holder #writemessage .messageinfooptions{
         padding-left: 0px;
     }
     #writemessage .messageinfooptions .slider{
             margin-bottom: 0px;
     }
    #writemessage .messageinfooptions button [class^="icon-"]{
        margin-right: 0px;
    }   
    .messageinfooptions .inline:last-child button{
        border-left: 1px solid #C9D0E1;
    }
     #writemessage .previewheader{
        border-bottom: 1px solid #C9D0E1;
        padding: 10px;
        color: #204761;
        font-weight: 600;
     }
     #writemessage .wdt-emoji-picker {
        top: -30px;
        right: 10px;
        z-index: 2;
    }

        .popup #writemessage .buttonstrip-holder-more {
            display: none !important;
            opacity: 0;
        }

     button[type=button].editorPostViewCommentsButton{
        margin: -15px 15px;
        border-radius: 0px;
     }
     button[type=button].editorPostHashtagButton,
     button[type=button].editorPostMentionButton,
     button[type=button].editorLinkButton{
        margin: -10px;
        margin-right: 0px;
        margin-left: 0px;
        border-radius: 0px;
        border: 1px solid #C9D0E1;
        border-top: none;
        border-bottom: none;
        padding-top: 11px;
        margin-left: -1px;
        padding: 10px 13px 11px 13px;
        min-width: auto;
     }
     .pull-left button[type=button].editorLinkButton{
        margin-left: -2px;
     }

     button[type=button].editorPostHashtagButton span,
     button[type=button].editorPostMentionButton span,
     button[type=button].editorLinkButton span{
         margin-right: 0px;
     }
     .editorPostHashtagList ul.basicList{
        max-height: 250px;
        overflow-y: auto;
        padding-right: 0px;
        overflow-x: hidden;
     }
    .editorPostHashtagList ul.basicList li {
        margin: 0;
        padding: 10px;
        cursor: pointer;
    }
    .editorPostHashtagList ul.basicList li + li{
        border-top: 1px solid #C9D0E1;
    }
        .editorPostHashtagList ul.basicList li:hover {
            background-color: #F3F4F5;
        }

        li ul.basicList {
            margin-left: 30px;
        }
     
        .approverNoteHolder {
            border: 1px solid #C9D0E1;
            border-radius: 6px;
            padding: 10px 25px;
            display: none;
        }
        .approverNoteHolder h5{
            font-size: 16px;
        }
        .approverNoteHolder.review-panel{
            border-color: #3165AF;
        }
        .approverNoteHolder.negative-panel{
            border-color: #f2545e;
        }
        .approverNoteHolder.review-panel h5{
            color: #3165AF;
            font-weight: 600;
        }
        .approverNoteHolder.negative-panel h5{
            color: #f2545e;
            font-weight: 600;
        }
        .viewcomment_datecreated{ font-size: 13px;}

     #charactersLeft.charlimitexceeded{ color: #f2545e; }
     .charactercount{
         position: absolute;
        bottom: 0px;
        right: 15px;
     }
     #writemessage{
        border: 1px solid #c9d0e1;
        border-radius: 6px;
        position: relative;
     }
     #socialPreviewHolder{
        padding: 20px 20px;
        position: relative;
        border: 1px solid #c9d0e1;
        border-radius: 6px;
     }
    .recentpanel #socialPreviewHolder {
        border: none;
    }
     #socialPreviewHolder .facebook_preview{
         padding-left: 20px;
         width: 497px;
     }
     #socialPreviewHolder .socialavatar{ 
         width: 40px;
         height: 40px;
         background-color: #92959C;
         float:left;
         border-radius: 50%;
         background-size: cover;
     }
     #socialPreviewHolder .facebook_preview .socialavatar{
         margin-right: 8px;
     }
     #socialPreviewHolder .linkedin_preview{
         font-family: "Source Sans Pro", Helvetica, Arial, sans-serif, "Hiragino Kaku Gothic Pro", Meiryo, "Hiragino Sans GB W3", "Noto Naskh Arabic", "Droid Arabic Naskh", "Geeza Pro", "Simplified Arabic", "Noto Sans Thai", Thonburi, Dokchampa, "Droid Sans Thai", "Droid Sans Fallback", -apple-system, ".SFNSDisplay-Regular", "Heiti SC", "Microsoft Yahei", "Segoe UI";
     }
     #socialPreviewHolder .linkedin_preview .socialavatar{
         margin-right: 8px;
     }
     #socialPreviewHolder .linkedin_preview .socialPreviewFooter{
         padding-top: 10px;
         margin-top: 10px;
         border-top: #C9D0E1 1px solid;
         color: #4B4F56;
     }
     #socialPreviewHolder .linkedin_preview .socialPreviewFooter span[class^="icon-"]{
         margin-left: 20px;
         margin-right: 8px;
     }
     #socialPreviewHolder .linkedin_preview .socialPreviewFooter span[class^="icon-"]:first-child{
         margin-left: 0px;
     }

     #socialPreviewHolder .socialavatartext{
         float:left;
     }
     #socialPreviewHolder .socialname{ font-size: 15px; color: #204761; margin-bottom: 0px;}
     #socialPreviewHolder .socialposttime{ font-size: 11px; margin-bottom: 0px; }

     #socialPreviewHolder .socialPreviewHeader{}
     #socialPreviewHolder .socialPreviewFooter{}
     #socialPreviewHolder .messagePreview{ height: auto; width: 100%; margin: 10px 0; white-space: pre-wrap; }
     /*#socialPreviewHolder .imagePreview, .imagePreview.sizebyratio{ 
         height: 100px; min-height: 100px; background-color: #B2B7C7; width: 100%; background-size: cover; height: 0px; 
     }*/
     #socialPreviewHolder .imagePreview, .imagePreview.sizebyratio{ 
         min-height: 100px; background-color: #B2B7C7; width: 100%;
     }

     #socialPreviewHolder .imagePreview.generationinprogress{
             min-height: 200px;
     }
     #socialPreviewHolder .imagePreview.generationinprogress:after{
         content: 'Image Generation In-Progress';
         position: absolute;
         top: 50%;
         left:50%;
         transform: translate(-50%, -50%);
         font-size: 32px;
         text-align: center;
         color: #ffffff;
     }

        #socialPreviewHolder .imagePreview.generationinprogress {
    
            background-color: #E9EAEB;
            border: none;
            background-image: url('/content/loadingimage.png');
            background-size: auto;
            background-position: 50%;
            background-repeat: no-repeat;
        }

            #socialPreviewHolder .imagePreview.generationinprogress[src=''] {
          
                background-color: #E9EAEB;
                border: none;
                background-image: url('/content/generatingimage.png');
                background-size: auto;
                background-position: 50%;
            }

        #socialPreviewHolder .imagePreview.videoPreview.generationinprogress:after {
            content: 'Video Generation In-Progress';
        }
            #socialPreviewHolder .facebook_preview .socialPreviewFooter{ padding-top: 10px; border-top: 1px solid #C9D0E1; margin-top: 8px; color: #4B4F56; }
     #socialPreviewHolder .twitter_preview .socialPreviewFooter{ margin-top: 15px;}
     
     #socialPreviewHolder .twitter_preview{
        margin-left: 58px;
        position: relative;
        width: 506px;
     }

     #socialPreviewHolder .socialPreviewFooter span[class^="icon-twitter"]{ margin-right: 55px;}
     #socialPreviewHolder .socialPreviewFooter span[class^="icon-facebook"]:first-of-type{ margin-left: 0px;}
     #socialPreviewHolder .socialPreviewFooter span[class^="icon-facebook"]{ margin-left: 30px;}

     #socialPreviewHolder .twitter_preview .socialavatar{
        width: 48px;
        height: 48px;
        border-radius: 50%;
        position:absolute;
        left: -58px;
     }
     #socialPreviewHolder .twitter_preview  .socialposttime{
         font-size: 15px;
         color: #90949C;
     }
     #socialPreviewHolder .twitter_preview .imagePreview{
         width: 506px;
     }
     #socialPreviewHolder .facebook_preview .imagePreview{
         width: 476px;
     }
     #socialPreviewHolder .twitter_preview .messagePreview{
         margin-top: 0px;
     }

     #socialPreviewHolder .resulticon{
        display: none;
        position: absolute;
        top: 0px;
        right: 0px;
        color: #ffffff;
        padding: 7px 7px 13px 23px;
        border-radius: 0 5px 0 100%;
     }
     #socialPreviewHolder[data-result] .resulticon{
         display: block;
     }
     #socialPreviewHolder[data-result="approved"]{
         border: 1px solid #2908C6;
     }
     #socialPreviewHolder[data-result="approved"] .resulticon{
         background-color: #2908C6;
     }
     #socialPreviewHolder[data-result="rejected"]{
         border: 1px solid #f2545e;
     }
     #socialPreviewHolder[data-result="rejected"] .resulticon{
         background-color: #f2545e;
     }
     #socialPreviewHolder[data-result="review"]{
         border: 1px solid #3165AF;
     }
     #socialPreviewHolder[data-result="review"] .resulticon{
         background-color: #3165AF;
     }

     #socialPreviewHolder .resulticon > span{
         display: none;
     }
     #socialPreviewHolder[data-result="approved"] .resulticon > span[class^=icon-approved]{
         display: block;
     }
     #socialPreviewHolder[data-result="rejected"] .resulticon > span[class^=icon-rejected]{
         display: block;
     }
     #socialPreviewHolder[data-result="review"] .resulticon > span[class^=icon-edit]{
         display: block;
     }
     
    .accountImagePreviewHolder{ width: 140px; float:left;}
    .accountImagePreviewOps{ float:left;}
    .accountImagePreview{ width: 140px; height: 140px; background-color: #CCCCCC; border-radius: 5px; margin-bottom: 30px;
        background-position: 50%;
        background-size: cover;
    }

    ul.reorderlist.ui-sortable li{
        cursor: n-resize;
    }
    .socialPreviewAndApprovalPost{
        border: 1px solid #F3F4F5;
        padding: 20px;
        margin: 15px 0;
    }

    .wdt-emoji-popup{ /*margin-top: 110px;*/ }

    .col-lg-7.recentpanel{
        border-left: 1px solid #c9d0e1;
    }
    .recentpanel .tabs{
        border-radius: 0;
        overflow-x: auto;
        overflow-y: hidden;
        height: 100px;
        margin-left: -15px;
        margin-right: -15px;
        margin-bottom: 30px;
    }
.section .contents div[class*="col-"].recentpanel .tabs {
    margin-left: -15px;
    margin-right: -15px;
}
    .recentpanel .tabs .tab{
        border: 0px;
        width: 200px;
        min-width: 200px;
        border-right: 1px solid #C9D0E1;
    }
    .recentpanel .tabs .tab:first-of-type {
        border-radius: 0px;
    }
    .recentpanel .tabs .tab p{
        margin: 10px 0 0;
        font-weight: 400;
        font-size: 14px;
    }
    .recentpanel .section{
        border: 0px;
    }
    .recentpanel #socialPreviewHolder{
        padding: 0 20px;
    }
    .recentpanel .tabscroller{
        width: 100%;
        overflow: auto;
    }
    .recentpanel .tabscroller .tabscroller_inner{
            width: 20000px;
    }
    .recentpanel .tabscroller .tab{
        position: relative;
    }
    .recentpanel .tabscroller .tab .socialstatus{
         position: absolute;
        top: 0px;
        right: 0px;
        color: #ffffff;
        padding: 7px 7px 13px 18px;
        border-radius: 0 0px 0 100%;
    }
    .recentpanel .tabscroller .tab .socialstatus.approved{
        background-color: #2908C6;
    }
    .recentpanel .tabscroller .tab .socialstatus.rejected{
        background-color: #f2545e;
    }
    .recentpanel .tabscroller .tab .socialstatus.awaitingapproval{
        background-color: #f5ad03;
    }
    .recentpanel .tabscroller .tab .socialstatus.returned{
        background-color: #3165af;
    }
    .recentpanel .tabscroller .tab:last-child{
        border-right: none;
    }
    .row.statsrow {
        padding-left: 20px;
        padding-right: 20px;
    }
    .statsrow{
        border-top: 1px solid #C9D0E1; padding-top: 15px; padding-bottom: 15px;
    }
    .statsrow:first-child{
        border-top: 0px;
    }
    .statsrow .heading{
        padding: 0px;
    }

    .approvalqueue .panel{
        width: 100%;
        max-width: 100%;
    }
    .approvalqueuesection.section{
        margin-top: 15px;
        margin-bottom: 5px;
    }
        .approvalqueuesection.section .contents{ text-align: center;}
        .approvalqueuesection.section .contents h2 {
            margin-bottom: 0px;
            text-align: center;
            display: inline-block;
        }
    .approvalqueuesection.approved{
        border-top: 6px solid #2908C6;
    }
    .approvalqueuesection.awaiting{
        border-top: 6px solid#f5ad03;
    }
    .approvalqueuesection.review{
        border-top: 6px solid #3165af;
    }
    .approvalqueuesection.rejected{
        border-top: 6px solid #f2545e;
    }
    .approvalqueuescroller {
        height: calc(100vh - 228px);
        overflow-y: auto;
    }
    
    .scheduleholder{}

    /*FULLCALENDAR*/
    .fc .fc-toolbar.fc-header-toolbar{
        border:1px solid #C9D0E1;
        margin-bottom: 0em;
        border-radius: 6px 6px 0 0;
    }
    div[data-tab-source="contentcalendar"] .fc .fc-toolbar.fc-header-toolbar{
        border: none;
    }
    div[data-tab-source="contentcalendar"] .fc-view > table {
        border: none;
    }
    div[data-tab-source="contentcalendar"] .fc-unthemed .fc-row{
        border-left:none; border-right: none;
    }
    .fc-view>table{
        border:1px solid #C9D0E1;
    }
    .fc .fc-body  td, .fc .fc-body th{
        border: 0px none;
        position: relative;
    }
    .fc .fc-head th{
        border: 0px none;
        color: #204761;
        font-weight: 600;
        padding: 10px;
    }
    .fc-ltr .fc-basic-view .fc-day-top .fc-day-number {
        width: 100%;
        float: left;
        text-align: center;
        padding: 10px 0px 5px 0px;
    }
    .popup .fc-ltr .fc-basic-view .fc-day-top .fc-day-number{
        padding: 10px 0px;
    }
    .popup .fc .fc-body .fc-bg .day_selected::before,
    .popup .fc .fc-body .fc-bg .day_selected_error::before{
        top: 1px;
    }

    #calendarOutOfOffice.fc .fc-basic-view .fc-day-top .fc-day-number{
        padding: 5px 0px 0px 0px;
    }

    .fc-head, .fc-head-container.fc-widget-header{
        border-bottom: 0px none;
    }
    .fc-toolbar h2{
        margin-top: 15px;
    }
    .fc-unthemed .fc-bg td.fc-today{
        background-color: #ffffff !important;
    }
    .fc.fc-unthemed .fc-body  td.fc-today{
        /*background-color: rgba(245, 245, 245, 0.50);*/
        color: #204761;
        font-weight: 700;
    }
    .fc.fc-unthemed .fc-body  td.fc-today.day_selected,
    .fc.fc-unthemed .fc-body  td.fc-today.day_selected_error{
        color: #ffffff;
    }
    .fc .fc-body .day_selected,
    .fc .fc-body .day_selected_error{
        color: #ffffff;
        opacity: 1;
        font-weight: 600;
    }
    .fc .fc-body .fc-bg .day_selected::before,
    .fc .fc-body .fc-bg .day_selected_error::before{
        background-color: #2908C6;
        width: 30px;
        height: 30px;
        position: absolute;
        content: '';
        left: 50%;
        border-radius: 50%;
        transform: translate(-50%, 0);
        border: #341E9D 3px solid;
        top: 10px;
    }
    .fc .fc-body .fc-bg .day_selected_error::before {
        background-color: #f2545e;
        border: #c74850 3px solid;
    }
    .fc .fc-toolbar > .fc-center > h2 {
        margin-top: 18px !important;
    }
    .fc-icon.fc-icon-icon-arrow_left, .fc-icon.fc-icon-icon-arrow_right{
            font-family: 'azzuuinterface' !important;
    }
    .fc button.fc-button {
        background-color: transparent;
        border: none;
        background-image: none;
        box-shadow: none;
        margin: 10px;
    }
    .fc-icon.fc-icon-icon-arrow_left::after{
            content: "\e90f";
            color: #C2C7D0;
    }
    .fc-icon.fc-icon-icon-arrow_right::after{
            content: "\e90e";
            color: #C2C7D0;
    }
    .fc .fc-event {
        border-radius: 18px;
    }
    .fc .fc-content{
        padding: 3px;
        padding-top: 1px;
    }
    #calendarCurrent, #calendarNext{ background-color: #ffffff;} 
    #calendar_dash.fc .fc-toolbar.fc-header-toolbar {
        border-radius: 0 0;
        border-top: 0px;
    }
    #dashboard_calendar_holder{ margin-top: 0px; overflow-x: hidden; }
    #dashboard_calendar_holder .tab{ border-top: 1px solid #C9D0E1; }
    #dashboard_calendar_holder .tabs .tab:last-of-type{
            border-radius: 0px 8px 0 0;
    }
    #dashboard_calendar_holder .fc-month-view .fc-event.dashboard_calendar_event,
    #post_calendar_holder .fc-month-view .fc-event.dashboard_calendar_event {
        width: auto;
        display: inline-block;
        border-radius: 50%;
        color: #ffffff;    
        width: 5px;
        height: 5px;
        padding: 1px;
        border-color: transparent;
    }
        #dashboard_calendar_holder .fc-month-view .fc-event.dashboard_calendar_event,
        #post_calendar_holder .fc-month-view .fc-event.dashboard_calendar_event {
            font-size: 1px;
            color: transparent;
        }
        #dashboard_calendar_holder .fc-row .fc-content-skeleton {
            padding-bottom: 0px;
        }
    #dashboard_calendar_holder .fc .fc-head th{
        border-right: 1px solid #C9D0E1;
        padding: 20px 10px;
    }
    #dashboard_calendar_holder fc-row fc-widget-header{
        border-bottom: 1px solid #C9D0E1;
    }
    #dashboard_calendar_holder .fc .fc-row .fc-content-skeleton td{
        border-right: 1px solid #C9D0E1;
        text-align:center;
    }
    #post_calendar_holder .fc .fc-row .fc-content-skeleton td {
        text-align:center;
        cursor: pointer;
    }
        #post_calendar_holder .fc .fc-row .fc-content-skeleton td.fc-day-top:hover:after {
            content: "\e939";
            color: #ffffff;
            position: absolute;
            top: -15px;
            left: 50%;
            font-size: 10px;
            background-color: #2908C6;
            border-radius: 20px;
            padding: 8px 10px;
            transform: translateX(-50%);
            cursor: pointer;
            font-family: 'azzuuinterface' !important;
        }
    .scheduleholder #post_calendar_holder .fc .fc-row .fc-content-skeleton td.fc-day-top:hover:after {
        content: none;
    }

    .scheduleholder .fc .fc-body .fc-bg .day_selected::before, .fc .fc-body .fc-bg .day_selected_error::before{
        top: 1px;
    }

#calendar_scheduled .fc-row.fc-week.fc-widget-content {
    height: calc((100vh - 320px) / 6);
}

#dashboard_calendar_holder .fc-ltr .fc-basic-view .fc-day-top .fc-day-number {
    font-size: 36px;
    padding-bottom: 5px;
}
    #dashboard_calendar_holder td.fc-day.fc-widget-content,
    #dashboard_calendar_holder td.fc-axis.fc-widget-content{
        border-right: 1px solid #C9D0E1; 
    }

td.fc-axis.fc-time.fc-widget-content, 
td.fc-axis.fc-widget-content, 
th.fc-axis.fc-widget-header {
    width: 60px !important;
    padding: 0px 20px !important;
}

#calendar_panel {
    margin-left: -30px;
    margin-right: -15px;
}
#dashboard_calendar_holder {
    margin-top: 0;
    margin-right: 0px;
    padding-right: 0px;
}

.fc-month-view .fc-day-grid-event .fc-time {
    display: none;
}

    #calendar_team.fc .fc-toolbar.fc-header-toolbar{
        border-radius: 0px;
        border-left: 0px;
        border-right: 0px;
    }
    #calendar_team.fc table, 
    #calendar_team.fc.fc-unthemed thead,
    #calendar_team.fc .fc-head-container.fc-widget-header{
        border: none;
    }

#calendarPostPopup {
    position: absolute;
    height: auto;
    width: auto;
    border-radius: 6px;
    border: 1px solid #C9D0E1;
    background-color: #ffffff;
    z-index: 12;
    padding: 15px 0 0 0px;
    box-shadow: 0px 4px 14px rgba(0,0,0,0.1);
    transform: translate(-60%, -110%);
    max-width: 650px;
}
    #calendarPostPopup .calendar-container{
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        padding: 0 15px;
        margin-right: 0px;
    }
    #calendarPostPopup .loading{
        padding: 15px 30px 30px 15px;
    }
    #calendarPostPopup .panel{ 
        margin-right: 15px; 
        flex: 0 0 auto;
    }

    #calendarPostPopup:after {
        content: "";
        position: absolute;
        border-style: solid;
        border-color: #fff transparent;
        display: block;
        width: 0;
        top: -13px;
        bottom: auto;
        left: 1px;
        right: auto;
        border-width: 0 13px 13px;

        left: 60%;
        transform: translateX(-50%);

        bottom: -12px;
        top: auto;
        border-width: 13px 13px 0px;
    }

    #calendarPostPopup:before {
        content: "";
        position: absolute;
        border-style: solid;
        border-color: #c9d0e1 transparent;
        display: block;
        width: 0;
        top: -14px;
        bottom: auto;
        left: 0px;
        right: auto;
        border-width: 0 14px 14px;

        left: 60%;
        transform: translateX(-50%);

        bottom: -14px;
        top: auto;
        border-width: 14px 14px 0px
    }

    /*!FULLCALENDAR*/

    .activitylogtable.row{
        border-top: 1px solid #C9D0E1;
    }
    .activitylogtable.row:first-child{
        border-top: none;
    }

    .activitylogtable > .col-sm-12{
        padding: 15px 15px;
        text-align: center;
    }
    .activitylogtable > .col-sm-12 + .col-sm-12{
        border-left: 1px solid #C9D0E1;
        text-align: left;
    }
    .activitylogtable p{
        white-space: pre-line;
    }
    .popup .activitylogtable{
        width: 700px;
    }

    /*Draggable*/
    .drags_droparea_active{ background-color: rgba(201, 208, 225, 0.30); outline: 2px solid #C9D0E1; border-radius: 6px;    }
    .drags_droparea_active.drags_hovered{ background-color: rgba(8, 198, 132, 0.30); outline: 2px solid #2908C6;    }

    .active_handle{ opacity: 0.5; pointer-events: none;}

    .drags_droparea_active[data-nodrop] { background-color: rgba(201, 208, 225, 0.30); outline: 2px solid #f2545e; }
    .drags_droparea_active.drags_hovered[data-nodrop] { background-color: rgba(242, 84, 94, 0.30); outline: 2px solid #f2545e; }

    button.removefolder {display: none;}
    button.removefolder.drags_droparea_active { display:inline-block; outline: none; border-radius: 20px;}
    button.removefolder.drags_droparea_active.drags_hovered{ background-color: #bb3b43; }

    /*Colours*/

    .positive, a.positive, .positive_strong strong {
        color: #2908C6;
    }
.awaiting, .awaiting_strong strong {
    color: #f5ad03;
}
.review, .review_strong strong {
    color: #3165af;
}
.negative, a.negative, .negative_strong strong {
    color: #f2545e;
}
    .heading-col{
        color: #204761;
    }

    .positive-bg, #dashboard_calendar_holder .fc-event.positive-bg,
    #post_calendar_holder .fc-event.positive-bg {
        background-color: #2908C6;
    }
    .awaiting-bg, #dashboard_calendar_holder .fc-event.awaiting-bg,
    #post_calendar_holder .fc-event.awaiting-bg {
        background-color: #f5ad03;
    }
    .review-bg, #dashboard_calendar_holder .fc-event.review-bg,
    #post_calendar_holder  .fc-event.review-bg{
        background-color: #3165af;
    }
    .negative-bg, #dashboard_calendar_holder .fc-event.negative-bg,
    #post_calendar_holder .fc-event.negative-bg {
        background-color: #f2545e;
    }
    
    .home-dropdown-holder .subheader{ position: relative;  top: 0px; }

    .main-menu li[data-home-dropdown-menu] .home-dropdown-holder{ transform: translateY(-200px); transition: 0.3s ease-out opacity; opacity: 0; position: absolute; top: 60px; width: 100%; left: 0px; padding-bottom: 50px; }
    .main-menu li[data-home-dropdown-menu]:hover .home-dropdown-holder{ transform: translateY(0px); transition: 0.3s ease-in opacity; opacity: 1; }
.with-subheader header .main-menu li[data-home-dropdown-menu] {
    margin: 0px 25px;
}
.with-subheader header .main-menu li[data-home-dropdown-menu] > a {
    padding: 18px 0 17px 0;
}
.with-subheader .home-dropdown-holder {
    display: none;
}

    header .main-menu li[data-home-dropdown-menu] {
    display: inline-block;
    margin: 0px 0px;
}

header .main-menu li[data-home-dropdown-menu] > a{
    padding: 18px 25px 24px 25px;
    position: relative;
}
header .main-menu li[data-home-dropdown-menu]:hover > a:after{
    content: '';
    height: 42px;
    width: 300%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 30px;
}
header .main-menu .subheader .main-menu {
    margin-right: 0px;
}
.popdownholder.opened .popdown.editorPostFeedParamList,
.popdownholder.opened .popdown.editorPostLinkParamList{
    padding-top: 0px;
    padding-bottom: 0px;
}
.popdownholder.opened .popdown li{ cursor: pointer; }

.editorLinkPostParamList {
    min-width: 300px;
}
.editorPostFeedParamList .basicList li,
.editorPostLinkParamList .basicList li,
.editorLinkPostParamList .basicList li {
    margin: 0px -10px;
    padding: 15px 10px 15px 10px;
    border-bottom: 1px solid #C9D0E1;
    cursor: pointer;
}
.editorPostFeedParamList .basicList li:hover,
.editorPostLinkParamList .basicList li:hover,
.editorLinkPostParamList .basicList li:hover {
    background-color: #F3F4F5;
}
.editorPostFeedParamList .basicList li strong,
.editorPostLinkParamList .basicList li strong,
.editorLinkPostParamList .basicList li strong
{ color: #204761; }

.editorPostFeedParamList .basicList li:last-of-type,
.editorPostLinkParamList .basicList li:last-of-type
.editorLinkPostParamList .basicList li:last-of-type{
    border-bottom: 0px;
    padding-bottom: 1px;
    margin-bottom: 0px;
}

.editorPostLinkParamList, .editorPostFeedParamList{ width: 400px;}

.breadcrumbchevron{
    font-size: 12px;
    padding: 0px 10px;
    color: #92959C;
}
.post-back{
    margin-left: 60px;
}

.analytics_subtitle{
    font-size: 13px;
    margin-bottom: 0px;
    margin-top: 0px;
}
.columnflex {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    height: 100vh;
}

#newsFeed .feed-item:last-of-type hr.extended{
    display: none;
}
.feed-item h2 a{ color: #204761; }
.feed-item h2 .icon-calendar{ color: #C9D0E1;}

#calendar_scheduled.fc .fc-toolbar.fc-header-toolbar {
    border-radius: 0px;
}
.pitch {
    background-color: #2e7c46;
    background-image: url('/content/pitch.png');
    background-size: 100% 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    min-height: 270px;
    margin-bottom: 10px;
    border-radius: 6px;
    /*padding: 40px 20px 0px 20px;*/
    padding: 40px 0px 71% 0px;
    padding-bottom: calc(53%);
    position: relative;
}
.pitch_holder{
    max-width: 800px;
}
.pitch > div{
    margin: 15px 0;
    padding: 0 20px;
    color: #ffffff;
    position: absolute;
    top: 0%;
    width: 100%;
}

.pitch[data-formationrows="4"] > div{
    height: 25%;
    display: flex;
    align-items: center;
}
.pitch[data-formationrows="4"] > div:nth-child(1){ top: 0%; }
.pitch[data-formationrows="4"] > div:nth-child(2){ top: 25%; }
.pitch[data-formationrows="4"] > div:nth-child(3){ top: 50%; }
.pitch[data-formationrows="4"] > div:nth-child(4){ top: 75%; }

.pitch[data-formationrows="5"] > div{
    height: 20%;
    display: flex;
    align-items: center;
}
.pitch[data-formationrows="5"] > div:nth-child(1){ top: 0%; }
.pitch[data-formationrows="5"] > div:nth-child(2){ top: 20%; }
.pitch[data-formationrows="5"] > div:nth-child(3){ top: 40%; }
.pitch[data-formationrows="5"] > div:nth-child(4){ top: 60%; }
.pitch[data-formationrows="5"] > div:nth-child(5){ top: 80%; }

.pitch[data-formationrows="6"] > div:nth-child(1){ top: 0%; }
.pitch[data-formationrows="6"] > div:nth-child(2){ top: 16.66666666666667%; }
.pitch[data-formationrows="6"] > div:nth-child(3){ top: 33.33333333333333%; }
.pitch[data-formationrows="6"] > div:nth-child(4){ top: 50%; }
.pitch[data-formationrows="6"] > div:nth-child(5){ top: 66.66666666666667%; }
.pitch[data-formationrows="6"] > div:nth-child(6){ top: 82.33333333333333%; }
.pitch[data-formationrows="8"] {
    padding-bottom: calc(63%);
}
.pitch[data-formationrows="8"] > div:nth-child(1) {
    top: 0%;
}
.pitch[data-formationrows="8"] > div:nth-child(2){ top: 12.5%; }
.pitch[data-formationrows="8"] > div:nth-child(3){ top: 25%; }
.pitch[data-formationrows="8"] > div:nth-child(4){ top: 37.5%; }
.pitch[data-formationrows="8"] > div:nth-child(5){ top: 50%; }
.pitch[data-formationrows="8"] > div:nth-child(6){ top: 62.5%; }
.pitch[data-formationrows="8"] > div:nth-child(7){ top: 75%; }
.pitch[data-formationrows="8"] > div:nth-child(8){ top: 87.5%; }

.pitch[data-formationrows="10"] > div:nth-child(1){ top: 0%; }
.pitch[data-formationrows="10"] > div:nth-child(2){ top: 10%; }
.pitch[data-formationrows="10"] > div:nth-child(3){ top: 20%; }
.pitch[data-formationrows="10"] > div:nth-child(4){ top: 30%; }
.pitch[data-formationrows="10"] > div:nth-child(5){ top: 40%; }
.pitch[data-formationrows="10"] > div:nth-child(6){ top: 50%; }
.pitch[data-formationrows="10"] > div:nth-child(7){ top: 60%; }
.pitch[data-formationrows="10"] > div:nth-child(8){ top: 70%; }
.pitch[data-formationrows="10"] > div:nth-child(9){ top: 80%; }
.pitch[data-formationrows="10"] > div:nth-child(10){ top: 82%; }

.pitch > div > div{
    content: '';
    float: left;
    text-align: center;
    position: relative;
    min-height: 50px;
}
    .pitch > div > div .player_placeholder,
    .bench > div .player_placeholder {
        content: '';
        width: 35px;
        height: 35px;
        margin: 0 auto;
        display: flex;
        justify-content: unset;
        background-color: rgba(255, 255, 255, 0.50);
        position: relative;
        object-fit: contain;
        cursor: pointer;
        /*pointer-events: none;*/
    }

        .pitch > div > div .player_placeholder img,
        .bench > div .player_placeholder img {
            pointer-events: none;
        }

.pitch > div > div .player_placeholder[data-shirtnumber],
.bench > div .player_placeholder[data-shirtnumber] {
    border-radius: 0;
    border: none;
    background-color: transparent;
    opacity: 1;
    display: block;
}
.player_placeholder img{width: 100%; height: 100%; object-fit: contain;}

.pitch > div > div .player_nameholder,
.bench > div .player_nameholder{
    min-height: 25px;
    font-size: 11px;
}

.secondaryteamholder .pitch > div > div .player_placeholder, 
.secondaryteamholder .bench > div .player_placeholder{
    /*width: 20px;
    height: 20px;*/
}
.secondaryteamholder .pitch > div{
    margin: 7px 0;
}

.pitch > div > div .player_placeholder.selected/*,
.bench > div .player_placeholder.selected*/{
    border-color: #2908C6;
    border-width: 3px;
}

.pitch > div > div .player_placeholder[data-shirtnumber].selected:before,
.bench > div .player_placeholder[data-shirtnumber].selected:before {
    content: '';
    width: 100px;
    height: 140%;
    border-radius: 6px;
    border: 1px solid #2908C6;
    position: absolute;
    background-color: rgba(8, 198, 132, 0.50);
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}

[data-panel="redcard"] .pitch > div > div .player_placeholder.selected,
[data-panel="substitution"] .pitch > div > div .player_placeholder.selected,
[data-panel="multisubstitution"] .pitch > div > div .player_placeholder.selected {
    border-color: #f2545e;
    background-color: rgba(242, 84, 94, 0.50);
    border-width: 3px;
}

.bench > div{
    float:left;
    width: 14%;
    text-align: center;
    position: relative;
}
[data-panel="substitution"] .bench,
[data-panel="multisubstitution"] .bench,
[data-panel="redcard"] .bench,
[data-panel="yellowcard"] .bench,
[data-panel="manofthematch"] .bench {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
}
[data-panel="substitution"] .bench > div,
[data-panel="multisubstitution"] .bench > div,
[data-panel="redcard"] .bench > div,
[data-panel="yellowcard"] .bench > div,
[data-panel="manofthematch"] .bench > div {
    flex: 1 0 105px;
    max-width: 50%;
    position: relative;
    width: auto;
    margin: 20px 0px;
}
[data-panel="substitution"] .bench > div:before,
[data-panel="multisubstitution"] .bench > div:before,
[data-panel="redcard"] .bench > div:before,
[data-panel="yellowcard"] .bench > div:before,
[data-panel="manofthematch"] .bench > div:before {
    content: '';
    width: 95px;
    height: 140%;
    border-radius: 6px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    border: 1px solid #C9D0E1;
    background-color: rgba(201, 208, 225, 0.50);
}

[data-panel="multisubstitution"] .pitch div[data-index]:after {
    content: 'X';
    content: attr(data-index);
    position: absolute;
    color: #ffffff;
    background-color: #2908C6;
    border-radius: 28px;
    padding: 2px 9px;
    top: -18px;
    right: initial;
    left: calc(50% + 35px);
}

[data-panel="multisubstitution"] .bench > [data-index]:after {
    content: 'X';
    content: attr(data-index);
    position: absolute;
    color: #ffffff;
    background-color: #2908C6;
    border-radius: 28px;
    padding: 5px 10px;
    right: initial;
    left: calc(50% + 35px);
    top: -18px;
}

[data-panel] .bench > div.selected:before {
    content: '';
    width: 100px;
    height: 140%;
    border-radius: 6px;
    border: 1px solid #2908C6;
    position: absolute;
    background-color: rgba(8,198,132,.5);
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);

    border: 1px solid #2908C6;
    background-color: rgba(8, 198, 132, 0.50);
}
    [data-panel="redcard"] .bench > div.selected:before{
        border: 1px solid #f2545e;
        background-color: rgba(242, 84, 94, 0.50);
    }
    [data-panel="yellowcard"] .bench > div.selected:before{
        border: 1px solid #f5d403;
        background-color: rgba(242, 229, 84, 0.50);
    }
    [data-panel="manofthematch"] .bench > div.selected:before{
        border: 1px solid #2908C6;
        background-color: rgba(8, 198, 132, 0.50);
    }

    [data-panel="substitution"] .bench .player_placeholder,
    [data-panel="multisubstitution"] .bench .player_placeholder,
    [data-panel="redcard"] .bench .player_placeholder,
    [data-panel="yellowcard"] .bench .player_placeholder,
    [data-panel="manofthematch"] .bench .player_placeholder {
        display: none;
    }
.col-sm-3.playerlist {
    max-height: 50vh;
    overflow-y: auto;
}
.playerlist p.selected{ color:#2908C6; }
.pitch.locked, .playerlist.locked{
    pointer-events: none;
    cursor: not-allowed;
}
.playerlist li.disabled{
    opacity: 0.3;
    pointer-events: none;
}
.playerlist li.removebutton.disabled{
    pointer-events: all;
}
.pitch.loading:after {
    content: "Loading";
    position: absolute;
    top: 40%;
    left: 50%;
    background-color: #ffffff;
    padding: 20px;
    border-radius: 6px;
    transform: translate(-50%, -50%);
}
.odometer.odometer-theme-default, #scoreholder{
   
}
#goaltimeholder {
    padding: 10px 0px;
    text-align: center;
    font-size: 30px;
    display: inline-block;
    position: relative;
    vertical-align: middle;
}
#goaltimeholder .goaltime{
    color: #204761;
}
#goaltimeholder .increment, #goaltimeholder .decrement,
#scoreholder .increment, #scoreholder .decrement {
    opacity: 0.3;
    font-size: 9px;
    cursor: pointer;
}
#goaltimeholder:hover .increment, #goaltimeholder:hover .decrement,
#scoreholder:hover .increment, #scoreholder:hover .decrement{
    opacity: 1;
}

#goaltimeholder .increment, #scoreholder .increment{
    position: absolute;
    top: 0px;
    left: 50%;
    padding: 0px 15px;
    transform: translate(-50%);
}
#goaltimeholder .decrement, #scoreholder .decrement{
    position: absolute;
    bottom: 0px;
    left: 50%;
    padding: 0px 15px;
    transform: translate(-50%);
}
#scoreholder {
    padding: 0px;
    font-size: 55px;
    width: 100%;
    display: inline-block;
    text-align: center;
    margin-top: 10px;
}
#scoreholder .crest {
    width: 40px;
    height: 40px;
    background-position: 50%;
    background-size: contain;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin: 0 auto;
    margin-top: 24px;
    margin-bottom: 10px;
}
#scoreholder .teamholder{
    width: 75px;
    font-size: 14px;
    display: inline-block;
    vertical-align: top;
}
    #scoreholder .scores{
        display: inline-block;
    }
    #scoreholder .homescore, #scoreholder .awayscore {
        font-size: 55px;
    }
.scoreholder_home, .scoreholder_away{ 
    position: relative;
    padding: 22px 12px;
    display: inline-block;
}
.scoreboard {
    padding: 5px 5px;
    font-size: 32px;
    width: 100%;
    display: inline-block;
    position: relative;
    margin: 0 0px;
    text-align: center;
}
.scoreboard > span{
    margin: 0 10px;
}
.homescore, .awayscore{
    font-size: 36px;
    color: #204761;
}
.match_state{
    color: #2908C6;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 0px;
}
.event_time {
    color: #204761;
    margin-right: 20px;
}
#loadingEvents {
    position: fixed;
    top: 50%;
    left: 0px;
    width: 100%;
    text-align: center;
    font-size: 24px;
}
#createNewTemplateList {
    display: flex !important;
    flex-wrap: wrap;
}
    #createNewTemplateList .panel.folder_panel_wide {
        max-width: 470px;
        width: 407px;
    }
    #createNewTemplateList .panel{
        flex: 1 0 265px;
    }

#approvedTemplateList {
    display: flex !important;
    flex-wrap: wrap;
}
.templateselector .selected {
    border-color: #2908C6;
}
.searchresultslist li.selected {
    color: #2908C6;
    font-weight: 600;
}

.teamnames{ display: inline-block; }
.teamnames + span{ font-size: 26px; margin: 0 15px;}

.teamnames .crest {
    width: 33px;
    height: 33px;
    background-position: 50%;
    background-size: contain;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin: 0 15px;
}
.tab .crest {
    width: 33px;
    height: 33px;
    background-position: 50%;
    background-size: contain;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin: 0 15px;
}

div#eventtypepanels {
    padding-top: 0px;
}

    div#eventtypepanels .panel {
        width: 115px;
        flex: 1 0 115px;
        max-width: 115px;
        margin-right: 20px;
    }
    div#eventtypepanels .panel h2 {
        font-size: 12px;
    }

#matchevents.section.slim .contents {
    padding: 20px 25px;
}
#matchevents .panel {
    margin-bottom: 20px;
}
#basicposttext{
    border: 0px;
    border-radius: 0px;
    margin-bottom: 0px;
    padding: 10px;
    margin-top: 0px;
}
#matchevents .panel.basic-post .panel-body {
    padding: 12px 5px;
}
.event-holder .crest {
    width: 40px;
    height: 40px;
    background-position: 50%;
    background-size: contain;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin: 0 auto;
}
.popdownholder .crest{
    width: 20px;
    height: 20px;
    background-size: contain;
    background-position: 50%;
    background-repeat: no-repeat;

}
button.lock_team {
    position: absolute;
    top: 52px;
    left: 22px;
    border-radius: 0 0 6px 6px;
    background-color: #ffffff;
    padding: 5px 12px;
    font-size: 18px;
    border-top: 0px;
}
button.lock_team span{
    margin-right: 0px;
}
.section .subheading{
    margin-top: 0px;
}

.player_placeholder:empty {
    border-radius: 100%;
    border: 1px solid #ffffff;
}
.bench .player_placeholder:after {
    border: 1px solid #c9d0e1;
    content: '';
    width: 45px;
    height: 45px;
    position: absolute;
    top: 0px;
    border-radius: 3px;
    left: -14px;
}

.bench .player_placeholder.selected:after {
    border: 2px solid #2908C6;
}
.bench .player_placeholder[data-shirtnumber]:after{
    content: none;
}
#matchtime:before, #matchtime_popup:before{ content: '('; }
#matchtime:after, #matchtime_popup:after{ content: ')'; }
#matchtime:empty:before, #matchtime_popup:empty:before{ content: ''; }
#matchtime:empty:after, #matchtime_popup:empty:after{ content: ''; }

#writemessage.event_messageinputholder{
    border: 1px solid #C9D0E1;
    border-radius: 6px;
}
.event_messageinputholder ul.buttonstrip.hashtags {
    margin-bottom: 0;
    border-bottom: 0px;
}
.section .contents[data-tab-source]{
    border-top: 0px;
}
.row.teamgoal, .row.owngoal{
    display: flex;
    margin-top: 15px;
}
.goalscorerholder {
    /*position: absolute;*/
    bottom: 0px;
    margin-bottom: 0px; /*10px*/
    color: #2908C6;
    font-size: 16px;
}
.goalscorerholder > span{ /*display: block;*/ }
    .goalscorerholder > p {
        color: #204761;
        font-weight: 600;
        font-size: 22px;
    }
.goalscorerholder .team{font-size: 22px;}
.goalscorerholder .player{font-size: 22px;}
.goalscorerholder .player:not(:empty):before{
    content: ', '
}
.owngoal .goalscorerholder .player{color: #f2545e;}
.goalscorerholder .time{font-size: 22px;}

[data-place].selected:before {
    content: '';
    width: 100px;
    height: 140%;
    border-radius: 6px;
    border: 1px solid #2908C6;
    position: absolute;
    background-color: rgba(8, 198, 132, 0.50);
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}

[data-place].selected.negative:before {
    border: 1px solid #f2545e;
    background-color: rgba(242, 84, 94, 0.50);
}
[data-place].selected.caution:before {
    border: 1px solid #f5d403;
    background-color: rgba(242, 239, 84, 0.50);
}

.smalleventicon{
    height: 30px;
    margin-right: 15px;
    margin-bottom: 10px;
}

.livesettings_defaulttext div[contenteditable]:empty:before{
    content: 'Type your default text here..';
}
.livesettings_defaulttext textarea.text_preview{
    width: 100%;
    min-height: 80px;
    margin-bottom: 15px;
    display: none;
    padding: 7px 5px;
}
.livesettings_defaulttext textarea.text_preview.show{
    display: block;
}
.manageevents_uploadedimage {
    min-width: 50px;
    min-height: 50px;
    max-width: 100px;
    max-height: 100px;
    margin-right: 15px;
}
    .manageevents_uploadedimage[src=""], .manageevents_uploadedimage[src=unknown] {
        background-color: lightgrey;
        border-radius: 6px;
        min-width: 100px;
        min-height: 100px;
    }
.addtomedialibrary {
    position: absolute !important;
    bottom: -8px;
    left: 40px;
    margin: 0px;
}
#eventTypeList .profilepic {
    background-color: transparent;
    border-radius: 0px;
    background-size: contain;
    background-position: 50%;
    background-repeat: no-repeat;
}

.dismissed, .subbedoff{
    opacity: 0.7;
    pointer-events: none;
}
#redcardselector .subbedoff, #yellowcardselector .subbedoff, #manofthematchselector .subbedoff,
#playerstatsselector .subbedoff, #playerstatsselector .dismissed {
    pointer-events: all;
}
.dismissed .player_nameholder{
    color: #f2545e;
    font-weight: bold;
}
.cautioned .player_nameholder:after{
    content: '';
    width: 11px;
    height: 16px;
    border-radius: 1px;
    background-color: #f6ea05;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
}
.dismissed .player_nameholder:after{
    content: '';
    width: 11px;
    height: 16px;
    border-radius: 1px;
    background-color: #f32b38;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
}
.subbedoff .player_nameholder:after{
    content: '→';
    color: #f32b38;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
    font-weight: bold;
}
.subbedon .player_nameholder:after{
    content: '←';
    color: #2908C6;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
    font-weight: bold;
}

.mediaform .panel-holder-small .panel{
    flex: none;
}
.mediaform .panel-holder-small .panel.selected {
    border: 1px solid #2908C6;
}
div[class*="col-"] .mediaform .section .contents-header{
    padding: 0px;
}
.mediaform .contents > div {
    overflow: auto;
    max-height: 359px;
}
#mediapicker_popupselector.nofilesfound,
[data-mediapicker].nofilesfound {
    position: relative;
}
    #mediapicker_popupselector.nofilesfound:after,
    [data-mediapicker].nofilesfound:after {
        content: 'No files found which match the search term';
        position: absolute;
        top: 86px;
        left: 16px;
    }

#mediapicker_popupselector .contents{
    min-height: 100px;
}
.hometeamholder{ max-width: 800px; }
.awayteamholder{ max-width: 800px; }

.rightalignsearch{
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}
.folderup {
    color: #204761;
    margin-bottom: 10px;
    margin-left: 15px;
    cursor: pointer;
}
    .folderup.noselect {
        opacity: 0.2;
        cursor: not-allowed;
    }
    .imageselectorsection {
        display: none;
    }
.imageselectorsection .panel-holder-small{
    display: flex;
    flex-wrap: wrap;
}
.imageselectorsection .panel-holder-small .panel .panel-image{
    background-position: 50% 0px;
}

#variablelist li.selected{ background-color:#efefef;}

.timeadjustmentholder{
    padding: 22px 0px;
    text-align: center;
    font-size: 17px;
    width: 100%;
    display: inline-block;
    position: relative;
     user-select: none;
}
.timeadjustmentholder > .addtime{
    padding: 0 10px;
    font-size: 22px;
    cursor: pointer;
}
.eventsummary > div{
    text-align: center;
}
.eventsummary  > div.home{
    text-align: left;
}
.eventsummary  > div.away{
    text-align: right;
}

.eventsummary.goalsonly > div {
    text-align: center;
}
    .eventsummary.goalsonly > div.home {
        text-align: left;
    }

    .eventsummary.goalsonly > div.away {
        text-align: right;
    }

time{ opacity: 0.3;}
time[data-formatted]{ opacity: 1;}

#productgroupings {
    border-radius: 0px;
    border-top: 1px solid #C9D0E1;
    display: none;
    margin-top: 15px;
    padding-top: 15px;
}

#socialPreviewHolder #productgroupings {
    border-radius: 0px;
    border-top: none;
    border-bottom: 1px solid #C9D0E1;
    margin-top: 0px;
    padding-top: 0px;
    margin-bottom: 15px;
    padding-bottom: 15px;
}
.post-message-previewcreator #socialPreviewHolder #productgroupings {
    border-bottom: none;
    border-top: 1px solid #C9D0E1;
    margin-bottom: 0px;
    padding-bottom: 0px;
    margin-top: 15px;
    padding-top: 15px;
}
#productgroupings .products img {
    margin: 5px;
    min-width: 50px;
    max-width: 160px;
    height: 80px;
    object-position: 50%;
    object-fit: contain;
    cursor: pointer;
    border: 1px solid #F3F4F5;
}

    #productgroupings .products img.selected {
        border: 1px solid #09C785;
        outline: 1px solid #09C785;
        pointer-events: none;
        cursor:not-allowed;
    }

    #productgroupings .products {
        display: inline-block;
        display: -webkit-flex;
        display: flex;
        overflow: auto;
        float: left;
        width: calc(100% - 165px);
    }

    #productgroupings .addtemplate {
        padding: 30px;
        background-color: #e2f8f1;
        color: #09C785;
        display: inline-block;
        float: left;
        margin: 5px;
        cursor: pointer;
    }

    #productgroupings .deletetemplate {
        padding: 27px;
        color: #dd453c;
        font-size: 19px;
        display: inline-block;
        float: left;
        margin: 5px;
        cursor: pointer;
    }
.icon-tick-animated {
    background-image: url('../Content/tick_circle_large_animated.svg');
    width: 64px;
    height: 64px;
    position: relative;
    background-position: 50%;
    background-size: contain;
    display: inline-block;
}
div.wdt-emoji-preview-close {
    padding: 0 15px 15px 0;
    right: 0px;
    bottom: 0px;
    position: absolute;
    cursor: pointer;
}

.loadinglogo {
    perspective: 420px;
    position: relative;
    width: 200px;
    height: 50px;
    margin: 0 auto;
}
    .loadinglogo > img {
        width: 200px;
        transform: translateZ(-58px);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        position: absolute;
        left: 50%;
        animation: rotatelogo1 ease-in-out 3s infinite;
      
    }
        .loadinglogo > img + img {
            transform: rotateY(180deg);
            animation: rotatelogo2 ease-in-out 3s infinite;
        }

        @keyframes rotatelogo1{
            0% {
                transform: translateX(-50%) translateZ(-58px) rotateY(0deg);
            }
            100% {
                transform: translateX(-50%) translateZ(-58px) rotateY(359deg);
            }
        }

        @keyframes rotatelogo2{
            0% {
                transform: translateX(-50%) translateZ(-58px) rotateY(180deg);
            }
            100% {
                transform: translateX(-50%)translateZ(-58px) rotateY(539deg);
            }
        }
.loadinglogo2 {
    position: relative;
    width: 150px;
    height: 50px;
    margin: 0 auto;
}
    .loadinglogo2.whiteout{
        animation: 1s fadeIn linear;
    }
    .loadinglogo2.whiteout img {
        filter: contrast(0) brightness(2) grayscale(1);
    }

    .loadinglogo2 > img {
        animation: bouncelogo ease-in-out 3.5s infinite;
    
    }

        .loadinglogo2 > img + img {
            animation-delay: 0.1s;
        }

            .loadinglogo2 > img + img + img {
                animation-delay: 0.2s;
            }

                .loadinglogo2 > img + img + img + img {
                    animation-delay: 0.3s;
                }

                    .loadinglogo2 > img + img + img + img + img {
                        animation-delay: 0.4s;
                    }

@keyframes bouncelogo {
    0% {
        transform: translateY(0px);
    }

    5% {
        transform: translateY(0px);
    }

    15% {
        transform: translateY(-20px);
    }

    50% {
        transform: translateY(0px);
    }

    100% {
        transform: translateY(0px);
    }
}
#templatelist + div#allTemplatesList {
    margin-top: 120px;
}

#templatelist[style="display: none;"] + div#allTemplatesList {
    margin-top: 0px;
}

.group_selector .panel {
    pointer-events: none;
}

div#createbasicpost {
    margin-bottom: 50px;
}

.replytopostholder {
    width: 580px;
    margin: -20px;
    padding: 20px;
}
    .replytopostholder strong {
        margin-bottom: 15px;
        display: inline-block;
    }
    .replytopostholder.selected {
        border: 1px solid #2908C6;
        border-radius: 8px;
    }

    .socialaccountfeedview {
        display: inline-block;
        margin: 0px;
        padding: 0px;
        float: left;
        list-style: none;
    }
    .socialaccountfeedview li {
        margin: 0px;
        padding: 0px;
        padding-left: 30px;
        display:inline-block;
    }

.replytopostfromfeed {
    cursor: pointer;
    margin-bottom: 15px;
    display: block;
    padding: 5px 20px !important;
}
    .replytopostfromfeed .replytopostfromfeed_off {
        display: inline-block;
        color: #F2545E;
        display: none;
    }
    .replytopostfromfeed .replytopostfromfeed_on {
        display: none;
        color: #2908C6;
    }
        .replytopostfromfeed button.iconbutton, a.iconbutton {
            margin-left: 0px;
            margin-right: -20px;
        }
    .replytopostfromfeed[data-reply=on] {
        border-color: #2908C6;
    }
    .replytopostfromfeed[data-reply="on"] .replytopostfromfeed_off {
        display: none;
    }
    .replytopostfromfeed[data-reply="on"] .replytopostfromfeed_on {
        display: inline-block;
    }

button.iconbutton.noborder.removereply {
    margin-top: -15px;
    margin-bottom: -13px;
}
.contents.manageevents_max_height {
    height: 560px;
    overflow: auto;
}
#folderselect_team {
    position: absolute;
    left: 55px;
    bottom: -7px;
}
.bootstrap-datetimepicker-widget button[data-action] {
    width: 50px;
    background-color: #2908C6;
    background-image: none;
    color: #ffffff;
    border-color: #2908C6;
    min-width: 50px;
}
.bootstrap-datetimepicker-widget span.glyphicon.glyphicon-time,
.bootstrap-datetimepicker-widget span.glyphicon.glyphicon-calendar {
    background-color: #2908C6;
    color: white;
}

.bootstrap-datetimepicker-widget table td.active, .bootstrap-datetimepicker-widget table td.active:hover {
    background-color: #2908C6 !important;
}

.lightbox{ display: none; }
.lightbox .lb-container {
    background-color: #e9eaeb;
}
.folderBreadcrumb{
    width: 100%;
}

.uploadedimageholder > div{
    display: inline-block;
    padding: 10px;
}
.uploadedimageholder > div img {
    max-width: 100px;
    max-height: 100px;
    border-radius: 6px;
}
    .uploadedimageholder > div button,
    .uploadedvideoholder > div button {
        color: #F2545E;
        display: block;
        margin: 0 auto !important;
    }
#stats {
    display: flex;
    flex-wrap: wrap;
    margin-top: 20px;
}
    #stats > div {
        max-width: 600px;
        border-right: 1px solid #C9D0E1;
        padding: 0 15px;
        border-left: 1px solid #C9D0E1;
        margin-left: -1px;
        border-top: 1px solid #C9D0E1;
        border-bottom: 1px solid #C9D0E1;
        margin-top: -1px;
        min-width: 300px;
        flex: 1 1;
    }
    #stats > div.morestats{
        border-left-color: #ffffff;
    }
    #stats table {
        table-layout: auto;
    }
#stats table tr tr:first-child{ width: 50%;}
#stats table tr{
    border-bottom: 1px solid #C9D0E1;
}
    #stats table tr td {
        padding: 6px 0px;
    }
    #stats table tr:last-child {
        border-bottom: none;
    }
    #stats table th,
    #stats table tr td[data-column-name] {
        padding-left: 10px;
        text-align: center;
    }

    #fixturestats .stat-category {
        margin-bottom: 50px;
    }

.statholder {
    margin-bottom: 5px;
}

#stats .statholder {
    margin-bottom: 5px;
}
    #stats .statholder .tickbox + label:after {
        content: ': ';
        margin-right: 10px;
    }
    #stats .statholder span, #stats [data-column-name] {
        font-weight: 700;
    }
    #stats .statholder.tabledata label {
        font-weight: 400;
    }

table tr td {
    padding-right: 20px;
}

.translation table{
    width: 100%;
}

.translation table tr {
    width: 100%;
    display: flex;
}

.translation table tr td {
    flex-basis: 0;
    flex-grow: 1;
    display: flex;
    align-items: center;
}


    .translation table tr.dupe {
        display: none;
    }

.translation table tr td input{
    width: 55%;
    clear: none;
    margin-right: 5px;
}

.translation table tr td .icon {
    cursor: pointer;
}

.translation table tr td + td + td {
width: 20%;
    }

.assetpreview {
    width: 50px;
    height: 50px;
    margin-right: 10px;
    object-fit: contain;
    object-position: 50%;
    display: inline-block;
    vertical-align: middle;
    border: 1px solid #c9d0e1;
    border-radius: 4px;
    font-size: 25px;
    line-height: 43px;
    text-align: center;
}
    .assetpreview > img {
        width: 100%;
        object-fit: contain;
        object-position: 50%;
        height: 100%;
    }
        .assetpreview > img:hover {
            background-color: #92959C;
        }

.handle.ui-sortable-handle {
    cursor: row-resize;
}
.ace-changed {
    border-left: #6FB73F 3px solid;
}
.more {
    font-size: 12px;
    font-weight: bold;
    text-decoration: underline;
    cursor: pointer;
}
.grouptitle {
    font-weight: bold;
    font-size: 18px;
    color: #204761;
}
    .grouptitle + div {
        margin-bottom: 50px;
    }
.participant_groups {
    width: 100%;
}
.participant_groups th{
    font-weight: bold;
    text-align: center;
}
    .participant_groups tfoot th {
        text-align: left;
    }
        .participant_groups tfoot th span {
            padding-top: 10px;
            display: inline-block;
        }

.participant_groups > tbody > tr > td{
    margin-right: 10px;
}
    .participant_groups > tbody > tr > td:nth-child(2n+1) table {
        background-color: #f2f2f2;
    }
    @media (max-width: 992px) {
        #ViewCampaign_GenerateThumbnail_Form {
        text-align:left;
        font-size: 14px;
        }

        #ViewCampaign_GenerateThumbnail_Form button {
                margin-left: 0;
        }

        #ViewCampaign_GenerateThumbnail_Form span.icon-thumbnails {
                display: none;
        }
    }