/*Contains customised components which are specific to Azzuu - generally these are overrides to inputs or new inputs created for azzuu*/
@media (min-width: 1200px) {
    .popup .container {
        width: 970px;
    }
}

label {
    margin-bottom: 0px;
    font-weight: 400;
}

.icon{
    font-family: 'azzuuinterface';
}

.text-right button, .text-right input[type=button], .text-right input[type=submit],
 .text-right a.button, .text-right a.button:hover{
    margin-left:10px;
}

input {
    -webkit-appearance: none;
}

button, input[type=button], input[type=submit],
 a.button, a.button:hover/*,
 a.iconbutton, a.iconbutton:hover*/{
    font-size: 14px;
    border: 1px solid #92959C;
    color:  #92959C;
    border-radius: 20px;
    padding: 10px 20px;
    background-color: transparent;
    display: inline-block;
    text-decoration: none;
    vertical-align: middle;
    outline: none;
    text-decoration: none;
    margin-bottom: 10px;
    user-select: none;
    margin-left: 2.5px;
    margin-right: 2.5px;
}
button:hover, input[type=button]:hover, input[type=submit]:hover, 
a.button:hover, a.button:hover .col, button:hover .col, a.soloButton:hover{
    background-color:  #92959C;
    color: #ffffff;
}
a.button:hover button{
    color: #ffffff;
}
a.soloButton:hover{
        padding: 7px 10px;
        font-size: 17px;
        border: none;
}

button [class^="icon-"], button [class*="icon-"],
a [class^="icon-"], a [class*="icon-"], .tab [class*="icon-"]{
    /*font-size: 15px;*/
    margin-right: 10px;
}

    button.primaryButton, input[type=button].primaryButton, input[type=submit].primaryButton, a.button.primaryButton {
        background-color: #2908C6;
        border-color: #2908C6;
        color: #ffffff;
        
    }
    button.primaryButton:hover, input[type=button].primaryButton:hover, input[type=submit].primaryButton:hover, a.button.primaryButton:hover{
        /*background-color: transparent;
        color: #2908C6;*/
        background-color: #341E9D;
    }
    button.primaryButton.fullWidthButton, input[type=button].primaryButton.fullWidthButton, input[type=submit].primaryButton.fullWidthButton, a.button.primaryButton.fullWidthButton {
        border-radius: 0 0 6px 6px;
        width: 100%;
        margin-bottom: 0px;
        margin-left: 0px;
        text-align: center;
        margin-top: 0px;
    }
        button.primaryButton.halfWidthButton, input[type=button].primaryButton.halfWidthButton, input[type=submit].primaryButton.halfWidthButton, a.button.primaryButton.halfWidthButton,
        button.secondaryButton.halfWidthButton, input[type=button].secondaryButton.halfWidthButton, input[type=submit].secondaryButton.halfWidthButton, a.button.secondaryButton.halfWidthButton {
            border-radius: 0 0 0 6px;
            width: 50%;
            margin-bottom: 0px;
            margin-left: 0px;
            text-align: center;
            margin-top: 0px;
            float: left;
            display: inline-block;
        }
            button.primaryButton.halfWidthButton + .halfWidthButton, input[type=button].primaryButton.halfWidthButton + .halfWidthButton, input[type=submit].primaryButton.halfWidthButton + .halfWidthButton, a.button.primaryButton.halfWidthButton + .halfWidthButton,
            .popdownholder.halfWidthButton + button.primaryButton.halfWidthButton {
                border-radius: 0 0 6px 0;
            }
            .primaryButton + .primaryButton {
                margin-left: 15px;
            }
            .primaryButton.pull-right{
                margin-left: 15px;
            }

button.primaryButton.largeWidthButton, input[type=button].primaryButton.largeWidthButton, input[type=submit].primaryButton.largeWidthButton, a.button.primaryButton.largeWidthButton,
button.secondaryButton.largeWidthButton, input[type=button].secondaryButton.largeWidthButton, input[type=submit].secondaryButton.largeWidthButton, a.button.secondaryButton.largeWidthButton {
    border-radius: 0 0 6px 0;
    width: 70%;
    margin-bottom: 0px;
    margin-left: 0px;
    text-align: center;
    margin-top: 0px;
    float: left;
    display: inline-block;
}
button.primaryButton.smallWidthButton, a.primaryButton.smallWidthButton, input[type=button].primaryButton.smallWidthButton, input[type=submit].primaryButton.smallWidthButton, a.button.primaryButton.smallWidthButton,
button.secondaryButton.smallWidthButton, a.secondaryButton.smallWidthButton, input[type=button].secondaryButton.smallWidthButton, input[type=submit].secondaryButton.smallWidthButton, a.button.secondaryButton.smallWidthButton,
button.rejectionButton.smallWidthButton, a.rejectionButton.smallWidthButton, input[type=button].rejectionButton.smallWidthButton, input[type=submit].rejectionButton.smallWidthButton, a.button.rejectionButton.smallWidthButton {
    border-radius: 0 0 0 6px;
    width: 30%;
    min-width: 30px;
    margin-bottom: 0px;
    margin-left: 0px;
    text-align: center;
    margin-top: 0px;
    float: left;
    display: inline-block;
}
.popup button.smallWidthButton, a button.smallWidthButton {
    display: inline-block;
    margin-right: 0px;
}
.popup button.largeWidthButton, a button.largeWidthButton {
    display: inline-block;
    margin-right: 0px;
}

a.underlined {
    border-bottom: 1px solid currentColor;
    padding-bottom: 3px;
}

    button.smallButton,
    button.primaryButton.smallButton,
    button.negativeButton.smallButton,
    button.rejectionButton.smallButton {
        padding: 5px 15px;
        font-size: 13px;
    }

    button.moreButton{
        padding: 10px 13px;
        float: right;
    }
    button.moreButton > span{ margin-right: 0px;}
    button.moreButton.moreButton_oneItem{ display: none; }
    button.moreButton.moreButton_twoItems{ display: none; }
    button.moreButton.moreButton_mobileOnly{ display: none; }

        button.moreButton.moreButton_oneItem + ul.moreMenu,
        button.moreButton.moreButton_twoItems + ul.moreMenu {
            margin-right: 15px;
        }
    button.moreButton.moreButton_mobileOnly + ul.moreMenu{ display: none; }
    button.moreButton.moreButton_oneItem + ul.moreMenu li,
    button.moreButton.moreButton_oneItem + ul.moreMenu li:first-child { pointer-events: all; }
    
    ul.moreMenu{
        z-index: 40;
        list-style: none;
        float:right;
        position: absolute;
        right: 0px;
        margin-right: 68px;
        margin-bottom: 0px;
        pointer-events: none;
    }

    button.moreButton + ul.moreMenu li:first-child{
        /*display: block;*/
        opacity: 1;
        transform: translateY(0px);
        pointer-events: all;
        transition: 0s;
    }
    ul.moreMenu li{
        margin-top: 0px;
        /*display: none;*/
        pointer-events: none;
        opacity: 0;
        transition: 0.3s ease-in all;
    }
    button.moreButton + ul.moreMenu li {opacity: 0; transform: translateY(-30px);}
          .moreButton.moreButton_twoItems + ul.moreMenu li{opacity: 1; transform: initial; display: inline-block; pointer-events: all;}
    button.moreButton.focus + ul.moreMenu{ pointer-events: all; }
    button.moreButton.focus + ul.moreMenu li { pointer-events: all; opacity: 1; transform: translateY(0px); 
                                               transition: 0.3s ease-in opacity,  0.3s ease-in transform;}

    button.moreButton.focus + ul.moreMenu li:nth-child(2) { transition-delay: 0.0s; }
    button.moreButton.focus + ul.moreMenu li:nth-child(3) { transition-delay: 0.1s; }
    button.moreButton.focus + ul.moreMenu li:nth-child(4) { transition-delay: 0.2s; }
    button.moreButton.focus + ul.moreMenu li:nth-child(5) { transition-delay: 0.3s; }
    button.moreButton.focus + ul.moreMenu li:nth-child(6) { transition-delay: 0.4s; }
    button.moreButton.focus + ul.moreMenu li:nth-child(7) { transition-delay: 0.5s; }
    button.moreButton.focus + ul.moreMenu li:nth-child(8) { transition-delay: 0.6s; }
    button.moreButton.focus + ul.moreMenu li:nth-child(9) { transition-delay: 0.7s; }
    button.moreButton.focus + ul.moreMenu li:nth-child(10) { transition-delay: 0.8s; }

    button.reviewButton, input[type=button].reviewButton, input[type=submit].reviewButton, a.button.reviewButton{
        margin: -15px 15px;
        border-radius: 0px;
        background-color: #3165af;
        border-color: #3165af;
        color: #ffffff;
    }
    button.reviewButton:hover, input[type=button].reviewButton:hover, input[type=submit].reviewButton:hover, a.button.reviewButton:hover {
        color: #3165af;
        background-color: transparent;
    }
    button.primaryButton[disabled], input[type=button].primaryButton[disabled], input[type=submit].primaryButton[disabled], a.button.primaryButton[disabled]{
        background-color: #E4E5E6;
        border-color: #C9D0E1;
        color: #92959C;
    }

    button.negativeButton, input[type=button].negativeButton, input[type=submit].negativeButton, a.button.negativeButton {
        background-color: #B2B7C7;
        border-color: #B2B7C7;
        color: #ffffff;
    }
    button.negativeButton:hover, input[type=button].negativeButton:hover, input[type=submit].negativeButton:hover, a.button.negativeButton:hover {
        color: #B2B7C7;
        background-color: transparent;
    }

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

    button.neutralButton, input[type=button].neutralButton, input[type=submit].neutralButton, a.button.neutralButton {
        background-color: #3165AF;
        border-color: #3165AF;
        color: #ffffff;
    }
    button.neutralButton:hover, input[type=button].neutralButton:hover, input[type=submit].neutralButton:hover, a.button.neutralButton:hover {
        color: #3165AF;
        background-color: transparent;
    }

    button.neutralButton.inverted, input[type=button].neutralButton.inverted, input[type=submit].neutralButton.inverted, a.button.neutralButton.inverted {
        border-color: #3165AF;
        color: #3165AF;
        background-color: transparent;
    }
    button.neutralButton.inverted:hover, input[type=button].neutralButton.inverted:hover, input[type=submit].neutralButton.inverted:hover, a.button.neutralButton.inverted:hover {
        background-color: #3165AF;
        color: #ffffff;
    }
    input[type=button][data-icon], input[type=submit][data-icon]{
        padding-left: 50px;
        background-repeat: no-repeat;
        background-position: left 15px center;
    }
    [class^="icon-"], [class*=" icon-"]{ vertical-align: middle; }
    [class^="icon-trend"], [class*=" icon-trend"]{ vertical-align: baseline; }

    [class^="icon-"].somepadding, [class*=" icon-"].somepadding{
        min-width: 20px;
        display: inline-block;
        text-align: left;
    }
    [class^="icon-"].extrapadding, [class*=" icon-"].extrapadding{
        min-width: 30px;
        display: inline-block;
        text-align: left;
    }
    [class^="icon-"].nopadding, [class*=" icon-"].nopadding {
        margin-right: 0px;
    }

    button.iconbutton.noborder,
    a.iconbutton.noborder{
        border: none;
        font-size: 15px;
    }
    button.iconbutton, button.expandcontractbutton,
    a.iconbutton, a.expandcontractbutton{
        border: 1px solid #92959C;
        text-align: center;
        font-size: 17px;
        padding: 0;
        width: 30px;
        height: 30px;
        margin-bottom: 4px;
    }
    button.iconbutton,
    a.iconbutton{
        margin-left: 15px;
    }
    button.iconbutton:hover, button.expandcontractbutton:hover,
    a.iconbutton:hover, a.expandcontractbutton:hover{
        background: #B2B7C7;
        color: #ffffff;
        text-decoration: none;
    }
    a.roundbutton.medialibraryup{
        width: 31px;
        padding: 7px 7px;
        margin-top: -4px;
    }
    a.button.roundbutton.medialibraryup:hover {
        width: 31px;
        padding: 7px 7px;
        margin-top: -4px;
    }
    span.panelHeading a.roundbutton {
        width: 31px;
        padding: 5px 0px;
        margin-top: -3px;
    }
        span.panelHeading a.roundbutton:hover {
            padding: 5px 0px;
            margin-top: -4px;
        }

        button.iconbutton.selected, a.iconbutton.selected {
            background: #2908C6 !important;
            color: #ffffff !important;
        }
    button.iconbutton.selected:hover, a.iconbutton.selected:hover{
        background: #ffffff !important;
        color: #92959C !important;
        text-decoration: none;
    }    

    button.expandcontractbutton {
        font-size: 9px;
        color: #B2B7C7;
        border: 1px solid #B2B7C7;
        width: 20px;
        height: 20px;
        margin-right: 10px;
        margin-left: 0px;
        transform: rotate(180deg);
        transition: 0.5s ease-in-out transform;
    }
    button.expandcontractbutton.contracted{
        transform: rotate(0deg);
    }
    button.rightbutton, .button.rightbutton{
        border: none;
        float: right;
    }
    button.rightbutton > span, .button.rightbutton > span{
        margin-left: 10px;
        margin-right: 0px;
    }
    button.centered{
        margin: 0 auto 10px;
        display: block;
    }
    .button.roundbutton, button.roundbutton,
    .popup .button.roundbutton, .popup button.roundbutton{
        padding: 9px 11px;
        border-radius: 50%;
        width: 40px;
        text-align: center;
        float: left;
        margin-right: 15px;
        min-width: initial;
        width: 31px;
        padding: 5px 0px;
        margin-top: -4px;
    }
    .button.roundbutton.pull-right, button.roundbutton.pull-right,
    .popup .button.roundbutton.pull-right, .popup button.roundbutton.pull-right{
        margin-right: 0px;
        margin-left: 15px;
    }

    li .button.roundbutton, li button.roundbutton, li .popup .button.roundbutton, li .popup button.roundbutton {
        margin: 0px;
        vertical-align: middle;
    }

        button.roundbutton:hover, a.button.roundbutton:hover {
            padding: 9px 11px;
            padding: 5px 0;
        }
    button.roundbutton:hover .col, a.button.roundbutton:hover .col{
        color: #ffffff;
    }
    button.roundbutton [class^="icon-"], button.roundbutton [class*=" icon-"], a.button.roundbutton [class^="icon-"], a.button.roundbutton [class*=" icon-"] {
        margin-right: 0px;
    }
    .button.roundbutton.roundbuttonsmall, button.roundbutton.roundbuttonsmall,
    .popup .button.roundbutton.roundbuttonsmall, .popup button.roundbutton.roundbuttonsmall,
    .textInputWithButton .buttonholder button.roundbutton.roundbuttonsmall {
            padding: 4px 4px;
            font-size: 10px;
            width: 21px;
            height: 21px;
            margin-right: 8px;
            line-height: 10px;
            border-radius: 10px;
    }
        .button.roundbutton.roundbuttonsmall:hover, button.roundbutton.roundbuttonsmall:hover,
        .popup .button.roundbutton.roundbuttonsmall:hover, .popup button.roundbutton.roundbuttonsmall:hover {
            padding: 4px 4px;
        }
        .button.roundbutton.roundbuttonsmall.pull-right, button.roundbutton.roundbuttonsmall.pull-right,
    .popup .button.roundbutton.roundbuttonsmall.pull-right, .popup button.roundbutton.roundbuttonsmall.pull-right{
        margin-right: 0px;
        margin-left: 7px;
    }
    .popup button.primaryButton.fullWidthButton{
        position: absolute;
        bottom: 0px;
        z-index: 3;
        left: 0px;
    }
    .roundbuttonsmall_text{
        font-size: 14px;
        line-height: 23px;
    }
    .soloInline:first-child{
        margin-left: 0px;
    }
    .soloInline{
        position: relative;
        display: inline-block;
        float: left;
        margin-left: 15px;
    }
    .popdownholder.inline{
        position: relative;
        display: inline-block;
    }
    .popdownholder button.soloButton, .popdownholder div.soloButton{
        margin-left: 0px;
    }

    div.soloButton, button.soloButton, a.soloButton{
        border: none;
        text-align: center;
        font-size: 17px;
        padding: 7px 10px;
        cursor: pointer;
    }
    div.soloButton.buttonActivated, button.soloButton.buttonActivated, a.soloButton.buttonActivated{
        color: #2908C6 !important;
    }

        button.soloButton [class^="icon-"], button.soloButton [class*=" icon-"], a.soloButton [class^="icon-"] {
            margin-right: 0px;
        }

    button.iconbutton [class^="icon-"],
    button.iconbutton [class*=" icon-"],
    button.expandcontractbutton [class^="icon-"],
    button.expandcontractbutton [class*=" icon-"],
    a.iconbutton [class^="icon-"],
    a.iconbutton [class*=" icon-"],
    a.expandcontractbutton [class^="icon-"],
    a.expandcontractbutton [class*=" icon-"]{
        font-size: inherit;
        margin-right: 0px;
        text-decoration: none;
    }

    .move_icon_button{ cursor: move; }

hr{ border-top-color: #C9D0E1; }
hr.minimised{ margin: 0px; }
hr.extended{ margin-left: -15px; margin-right: -15px;}
.popup .contents hr.extended, .section .contents hr.extended{ margin-left: -30px; margin-right: -30px; }
.input-floating-holder{ position: relative; }
input{
    font-size: 16px;
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #C9D0E1;
    padding: 10px 0;
    width: 100%;
    max-width: 400px;
    outline: none;
    display: block;
    clear:right;
    position: relative;
    margin-bottom: 15px;
    border-radius: 0px;
}
    input:focus ~ .floating-label,
    input.populated ~ .floating-label,
    input[disabled] ~ .floating-label,
    input[required]:not(:focus):valid ~ .floating-label,
    textarea:focus ~ .floating-label,
    textarea.populated ~ .floating-label,
    textarea[disabled] ~ .floating-label,
    textarea[required]:not(:focus):valid ~ .floating-label {
        top: -6px;
        bottom: 10px;
        left: 0px;
        font-size: 11px;
        opacity: 1;
    }
    input[disabled] {
        cursor: default;
        opacity: 0.5;
    }
        textarea:focus ~ .floating-label,
        textarea.populated ~ .floating-label,
        textarea[disabled] ~ .floating-label,
        textarea[required]:not(:focus):valid ~ .floating-label {
            top: -20px;
        }
textarea {
    font-size: 16px;
    background-color: transparent;
    border: none;
    border: 1px solid #C9D0E1;
    border-radius: 6px;
    padding: 10px;
    width: 100%;
    outline: none;
    display: block;
    clear: right;
    position: relative;
    margin-bottom: 15px;
}
.input-floating-holder textarea {
    margin-top: 32px;
}
textarea + .floating-label {
    left: 10px;
}
    .floating-label {
        position: absolute;
        pointer-events: none;
        left: 0px;
        top: 11px;
        transition: 0.2s ease all;
    }

input.float-center{ margin: 0 auto;}
input[type=text]:focus,
input[type=url]:focus,
input[type=password]:focus{
    border-bottom: 1px solid #2908C6;
    /*box-shadow: 0 1px 0 #2908C6;*/
    box-shadow: 0px 1px 1px -1px #2908C6;
}

div.input-floating-holder.float-center {
    margin: 0 auto;
    width: 280px;
}

input.input-validation-error {
    border-bottom: 1px solid #F2545E;
}
input.input-validation-error[type=text]:focus,
input.input-validation-error[type=url]:focus,
input.input-validation-error[type=password]:focus{
    border-bottom: 1px solid #F2545E;
    box-shadow: 0 1px 0 #F2545E;
}
textarea{ outline: none; }

.field-validation-error{
    color: #F2545E;
    font-size: 13px;
    margin-top: 0px;
    display: inline-block;
}
.field-validation-error + input{
    margin-top: 0px;
    padding-top: 5px;
}

.basicList{
    list-style: none;
    padding: 0px;
    margin: 0px;
}
.basicList li{
    margin: 10px 0;
    line-height: 1;
}
.basicList li .slider{
        margin-top: 9px;
}
.basicList li .slider + label {
    vertical-align: sub;
    margin-top: 11px;
    cursor: pointer;
}
.basicList li .slider + label.multiline{
    padding-left: 75px;
    position: absolute;
    left: 0px;
    clear: right;
    width: 100%;
}

.basicList li.dropdown{ cursor: pointer; }
.basicList li.dropdown > span{ font-size: 10px; }
.basicList li.dropdown > ul{
    height: 0px;
    overflow: hidden;
    padding-left: 45px;
}
.basicList li.dropdown.expanded > ul{
    height: auto;
    overflow: hidden;
}

  .popup .basicList li button, .buttonholder .basicList li button,
    .popup .basicList li a.button, .buttonholder .basicList li a.button
    { margin-top: 0px; }

textarea.textarea{width: 100%; min-height: 150px; border: 1px solid #C9D0E1; border-radius: 5px;margin-bottom: 15px; padding: 15px; margin-top: 15px;}

.textareabuttonholder{ line-height: 0px;}
.textareabuttonholder textarea.textarea {
    margin-bottom: 0px;
    border-radius: 5px 5px 0 0;
}
.textareabuttonholder button, .textareabuttonholder .button, .textareabuttonholder input, .textareabuttonholder textarea{ line-height: 18px;}

input.text-center {
    margin-left: auto;
    margin-right: auto;
}

input[type=search] {
    padding-left: 40px !important;
    padding-right: 15px;
    border-bottom: none;
    margin: -1px;
    margin-left: -9px;
    border-radius: 20px;
    border: 1px solid #C9D0E1;
    background-image: url('../Content/icon_search.svg');
    background-repeat: no-repeat;
    background-position: left 11px top 11px;
}
input[type=search]:focus{
    border: 1px solid #2908C6;
}

input[type=search].collapsed {
    border: 0px;
    float:left;
}
input[type=search].collapsed:invalid{
    cursor: pointer;
    padding-left: 24px;
    width: 0px;
    transition: 0.5s linear width, 0.5s linear padding;
}
input[type=search].collapsed:focus, input[type=search].collapsed:valid{
    width: 150px;
    padding-left: 40px;
}
input[type=search].collapsed:invalid + .clearsearch {
    opacity: 0;
    transition: 0.3s linear opacity;
}
input[type=search].collapsed:focus + .clearsearch, input[type=search].collapsed:valid + .clearsearch{
    opacity: 1;
}
.soloButton + input[type=search].collapsed{
    margin-left: 15px;
}

.searchresultslist{
    margin: 15px 0px;
    padding: 10px;
    list-style: none;
}
.searchresultslist li{
    padding: 5px 0;
    cursor: pointer;
}
.searchresultslist li .profilepic,
.selectListDropdown li .profilepic{
    width: 30px; height: 30px;
    border-radius: 15px;
    /*background-color: #92959C;*/
    background-size: cover;
    background-position: top center;
    margin-right: 10px;
    vertical-align: middle;
    display: inline-block;
    object-fit: contain;
}
.searchresultslist li[data-exists="true"]{
    opacity: 0.5;
    cursor: not-allowed;
}

    .searchresultslist.searchresultslist_seperated .iconpic {
        width: 50px;
        height: 50px;
        object-fit: contain;
        vertical-align: middle;
        margin-right: 15px;
    }
    .iconpic[src=""], .iconpic[src=unknown] {
        background-color: lightgrey;
        border-radius: 6px;
    }
        .iconpic[src=""].playerpic, .iconpic[src=unknown].playerpic {
            background-image: url(../Content/missingplayer.png);
            background-color: transparent;
            border-radius: 0px;
            background-size: contain;
            background-repeat: no-repeat;
            background-position: bottom center;
        }
    .searchresultslist.searchresultslist_seperated {
        margin: 0px;
        padding: 0px;
        margin-top: -30px;
        margin-bottom: -30px;
        color: #29465F;    
    }
        .searchresultslist.searchresultslist_seperated p{ margin-bottom: 0px; font-weight: 700; }

        .searchresultslist.searchresultslist_seperated small {
            color: #B2B7C7;
            font-size: 12px;
            font-weight: 400;
        }

        .searchresultslist.searchresultslist_seperated .pull-right {
            margin-left: auto;
        }

        .searchresultslist.searchresultslist_seperated li {
            border-bottom: 1px solid #C9D0E1;
            display: flex;
            align-items: center;
            padding: 10px 0;
        }
            .searchresultslist.searchresultslist_seperated li:last-of-type{
                border-bottom: none;
            }

            .searchresultslist.searchresultslist_seperated li.list_groupheading {
                color: #2908C6;
                border: none;
                font-size: 16px;
                margin-top: 20px;
            }

    .textInputWithButton, .searchInput, .selectList {
        width: 100%;
        max-width: 400px;
        border: 1px solid #C9D0E1;
        border-radius: 20px;
        position: relative;
    }
.textInputWithButton, .selectList{
    position: relative;
    display: table;
    border-collapse: separate;
    margin-bottom: 15px;
}
.selectList.opened{
    border-radius: 20px 20px 0px 0px;
    transition: 0.5s ease-in-out border-radius;
}
    .selectList.selectListDropup.opened {
        border-radius: 0 0 20px 20px;
    }
    .textInputWithButton input, .textInputWithButton > p, .selectList input {
        padding: 10px 20px;
        border-bottom: 0px;
        display: table-cell;
        position: relative;
        z-index: 2;
        float: left;
        width: 100%;
        margin-bottom: 0;
        border-radius: 20px 0 0 20px;
        margin: 0px;
        background-color: #ffffff;
        border: none;
        color: #92959C;
        font-size: 16px;
    }
    .textInputWithButton.textInputWithButton_double input{
        width: 50%;
        border-right: 1px solid #C9D0E1;
    }
        .textInputWithButton.textInputWithButton_double input:focus {
            margin-right: 0px;
        }
    .textInputWithButton.textInputWithButton_double input + input {
        border-right: none;
        border-radius: 0px;
    }
    .textInputWithButton img, .selectList img {
        width: 28px;
        height: 28px;
        margin-left: 10px;
        margin-top: 7px;
        object-fit: contain;
        object-position: 50%;
        display: table-cell;
        position: absolute;
        z-index: 2;
        float: left;
        white-space: nowrap;
        vertical-align: middle;
        top: 0px;
        left: 0px;
        z-index: 3;
    }
        .textInputWithButton img + input, .selectList img + input {
            padding-left: 50px;
        }
.textInputWithButton span + input, .selectList span + input{
    border-radius: 0 20px 20px 0;
    margin-left: 0px;
}

.textInputWithButton.dual input{ border-radius: 0; border: none; background-color: transparent; }

    .textInputWithButton input:focus, .selectList input:focus {
        border: 1px solid #2908C6;
        box-shadow: none;
        margin: -1px;
    }
    .textInputWithButton input:focus + .buttonholder > .primaryButton, .selectList input:focus + .buttonholder > .primaryButton{
            border: 1px solid #2908C6;
    }
.textInputWithButton .buttonholder, .selectList .buttonholder{
    
    position: relative;
    font-size: 0;
    white-space: nowrap;

    width: 1%;
    white-space: nowrap;
    vertical-align: middle;

    display: table-cell;
}
#permissionholder.denypermission{
    opacity: 0.7;
}
    #permissionholder.denypermission input, #permissionholder.denypermission label {
        pointer-events: none;
    }

    .textInputWithButton .buttonholder .popdown {
        line-height: 1px;
        font-size: 15px;
    }

.textInputWithButton button, .selectList button{
    border-radius: 20px 0px 0px 20px;
    padding: 11px 20px;
    z-index: 2;
    margin: -1px;    
    transition: 0.5s ease-in-out border-radius;
}
.textInputWithButton input + span > button, .selectList input + span > button,
.textInputWithButton > p + span > button {
    border-radius: 0px 20px 20px 0px;
}
.textInputWithButton .buttonholder button, .selectList .buttonholder button,
.popup .textInputWithButton .buttonholder button, .popup .selectList .buttonholder button{
    margin-right: -2px;
    margin-top: -1px;
    min-width: auto;
    border-color: #C9D0E1;
}
    
.textInputWithButton span[class^="icon-"],
.fe-floating-panel-contents .textInputWithButton span[class^="icon-"]{
        margin-right: 0px;
}
.textInputWithButton.small input, .textInputWithButton.small > p {
    padding: 3px 20px;
}

.textInputWithButton.small .buttonholder button {
    padding: 4px 12px;
    position: absolute;
    right: 1px;
    top: 1px;
}
.selectList.opened button{
    border-radius: 0px 20px 0px 0px;
    transition: 0.5s ease-in-out border-radius;
}
.selectList.selectListDropup.opened button {
    border-radius: 0 0px 20px 0;
    transition: .5s ease-in-out border-radius;
}
.selectList.opened input{
    border-radius: 20px 0px 0px 0px;
    transition: 0.5s ease-in-out border-radius;
}
.selectList.selectListDropup.opened input {
    border-radius: 0px 0px 0px 20px;
}

.searchInput span{
    position: absolute;
    left: 10px;
    top: 12px;
}
.searchInput input{
    padding-left: 40px;
    padding-right: 15px;
    border-bottom: none;
    border-radius: 20px;
    margin: -1px;
}
    .searchInput input:focus{
        border: 1px solid #2908C6;
        box-shadow: none;
    }

.selectList.opened .selectListDropdown{
    max-height: 250px;
}
.selectList .selectListDropdown{
    position: absolute;
    width: 100%;
    background-color: #ffffff;
    box-shadow: 0px 4px 14px rgba(0,0,0,0.1);
    z-index: 11;
    max-height: 0px;
    overflow: hidden;
    border-radius: 0 0 20px 20px;
    left: 0px;
    top: 100%;
    transition: 0.5s ease-in-out max-height;
}
    .selectList.selectListDropup .selectListDropdown {
        top: initial;
        bottom: 100%;
        border-radius: 20px 20px 0 0;
    }

    .selectList .selectListDropdown ul {
        list-style: none;
        padding: 0px;
        margin-bottom: 0px;
        max-height: 250px;
        overflow-y: auto;
        border: 1px solid #C9D0E1;
        border-radius: 0 0 20px 20px;
    }
    .selectList.selectListDropup .selectListDropdown ul {
        border-radius: 20px 20px 0 0;
    }
.selectList .selectListDropdown ul li{
    border-bottom: 1px solid #C9D0E1;
    padding: 10px 20px;
    margin: 0px;
    position: relative;
}
.selectList .selectListDropdown ul li.optgroup{
    font-weight: 700;
    padding-top: 30px;
    pointer-events: none;
}
.selectList .selectListDropdown ul li:hover{
    background-color: #f2f3f5;
    cursor: pointer;
}
.selectList .selectListDropdown ul li:last-of-type{
    border-bottom: none;
}
    .selectList .selectListDropdown ul li[data-optgroup] {
        font-weight: 700;
        font-size: 16px;
    }
.selectList .selectListDropdown ul li[data-warning]::after {
    content: attr(data-warning);
    position: absolute;
    top: 14px;
    right: 5px;
    font-size: 11px;
    color: #F2545E;
}
.selectList .selectListDropdown ul li[data-info]::after {
    content: attr(data-info);
    position: absolute;
    top: 14px;
    right: 5px;
    font-size: 11px;
    color: #C9D0E1;
}
.textInputWithButton .selectListDropdown li.match, .selectList .selectListDropdown li.match{
    background-color: rgba(201, 208, 225, 0.30);
}

.selectList.small input {
    padding: 3px 20px;
}
.selectList.small .buttonholder button {
    padding: 4px 20px;
}

.input-colour-picker{}

    .input-colour-picker + .sp-replacer {
        margin-bottom: 15px;
        width: 100%;
        border: 1px solid #C9D0E1;
        border-radius: 20px;
        padding: 0px;
        background-color: #B2B7C7;
        max-width: 400px;
        position: relative;
    }
        .input-colour-picker + .sp-replacer .sp-preview {
            width: 100%;
            border: none;
        }
        .input-colour-picker + .sp-replacer .sp-preview {
            height: 35px;
        }
        .input-colour-picker + .sp-replacer .sp-dd {
            font-size: 0px;
            padding: 5px 0;
            position: absolute;
            top: 4px;
            right: 1px;
        }
        .input-colour-picker + .sp-replacer .sp-dd:after {
            font-family: 'azzuuinterface' !important;
            content: "\e911";
            color: #ffffff;
            font-size: 14px;
            padding: 4px 12px;
        }
/*DROPDOWN*/
.azzuu-dropdown {
    position: absolute;
    top: 100%;
    right: 0px;
    background-color: #ffffff;
    border-radius: 0 0 0 8px;
    border: 1px solid #C9D0E1;
    border-top: 0px;
    border-right: 0px;
    display: none;
    padding: 0px;
    z-index: 2;
    overflow: hidden;
    margin-top: 0px;
}
#header .azzuu-dropdown{
    z-index: 10;
}
header .mainlogo a img{
    height: 30px;
}
.azzuu-dropdown.seperatorlines {
    padding: 15px;
}
.azzuu-dropdown.opened{
    display: block;
    min-width: 400px;
}
.azzuu-dropdown.seperatorlines li{   
    border-bottom: 1px solid #C9D0E1;
    padding: 0px;
    padding-bottom: 10px;
    padding-top: 10px;
    display:block;
    text-align: left;
    position: relative;
    
}
.azzuu-dropdown.azzuu-dropdown-padded li{
    padding:15px;
}
.azzuu-dropdown.azzuu-dropdown-padded li input{
    max-width: 100%;
    margin-bottom: 0px;
}
.azzuu-dropdown li{   
    padding: 0px 0px;
    display:block;
    text-align: left;
    position: relative;
    margin: 0px;
}
.azzuu-dropdown li.selected a {
    color: #2908C6;
    font-weight: 600;
}
.azzuu-dropdown li a{
    padding: 15px;
    width: 100%;
    display: block;
}
.azzuu-dropdown li a:hover, .azzuu-dropdown li button:hover{
    color: #ffffff;
    background-color: #C9D0E1;
    text-decoration: none;
    cursor: pointer;
}
.azzuu-dropdown li button{
    padding: 15px;
    width: 100%;
    display: block;
    background-color: transparent;
    border: none;
    border-radius: 0;
}

.azzuu-dropdown.seperatorlines li:first-of-type{
    padding-top: 0px;
}
.azzuu-dropdown.seperatorlines li:last-of-type{
    border-bottom: none;
    padding-bottom: 0px;
}
.azzuu-dropdown li .accountswitchers {
    float: right;
    top: 18px;
    right: 60px;
    font-size: 11px;
    position: absolute;
}
#undopip > button:hover {
}
.azzuu-dropdown li .accountswitchers a {
    display: inline;
    padding: 0px;
}
    .azzuu-dropdown li .accountswitchers a:hover {
        background-color: transparent;
        color: #2908C6;
    }
    .azzuu-dropdown li.selected .accountswitchers a:hover {
        background-color: transparent;
        color: #B2B7C7;
    }
    .azzuu-dropdown li .logoholder {
    float: right;
    width: 30px;
    height: 30px;
    display: block;
    border-radius: 15px;
    background-color: #ccc;
    position: absolute;
    top: 11px;
    right: 15px;
    content: '';
    background-size: cover;
    background-position: 50%;
    cursor: pointer;
}
#alertlist li .logoholder {
    float: right;
    width: 30px;
    height: 30px;
    display: block;
    border-radius: 15px;
    background-color: #CCCCCC;
    position: absolute;
    top: 13px;
    left: 64px;
    content: '';
    background-size: cover;
    background-position: 50%;
}
#alertlist{ max-width: 600px;}

.azzuu-sidebar{
    position: absolute !important;
    top: 100%;
    right: 0px;
    background-color: #ffffff;
    border-left: 1px solid #C9D0E1;
    /*display: none;*/
    padding: 0px;
    z-index: 2;
    overflow: hidden;
    height:100%;
    padding: 15px;
    text-align: right;
    margin-top: 0px;
    transform: translateX(100%);
    transition: 0.3s ease-in transform, 0.3s linear opacity;
    min-width: 330px!important;
    opacity: 0.1;
    font-weight: 400;
}
.azzuu-sidebar.opened, .azzuu-sidebar.left.opened{
    display: block;
    min-width: 330px;
    min-height: 500px;
    transform: translateX(0%);
    opacity: 1;
}
.azzuu-sidebar p{
    line-height: 15px;
}
.azzuu-sidebar .icon{
    float:right; 
    width: 40px; 
    height: 40px;
    background-size: cover;
    margin-bottom: 20px;
}
.azzuu-sidebar.left{
    right: initial;
    left: 0px;
    transform: translateX(-100%);
    text-align: left;
    border-left: none;
    border-right: 1px solid #C9D0E1;
}

/*TOOLTIP*/
[data-tooltip]{ position: relative; }
[data-tooltip]::before {
    opacity: 0;
    /*content: '';*//*Don't know why this was here - removed because it was causing issues on Safari*/
    transition-delay: 0s;
}
[data-tooltip]:hover::before{
    content: attr(data-tooltip);
    position: absolute;
    display: block;
    top: 0px;
    background-color: #2908C6;
    padding: 2px 8px;
    border-radius: 4px;
    left:0px;
    /*width: auto;*/
    /*top: -100%;*/
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    color: #ffffff;
    font-size: 13px;
    line-height: 21px;
    z-index: 100;
    opacity: 1;
    transition-delay: 0s;
    transition: 0.2s linear opacity;
}
    [data-tooltip][data-tooltip-bottom]:hover::before {
        top: 25px;
    }
    [data-tooltip][data-tooltip-bottom-percentage]:hover::before {
        top: 110%;
    }
    [data-tooltip][data-tooltip-offset]:hover::before {
        transform:translateX(-20%);
    }
.deferred[data-tooltip]:hover::before{    
    transition-delay: 2s;
    transition: 1s ease-in opacity;
}
/*POPDOWN*/

.popdownholder.opened .popdown, .popdown.opened,
.popdownholder_sidebutton.opened .popdown {
    opacity: 1;
    pointer-events: initial;
    z-index: 13;
}

.popdown{
    transition: .3s linear opacity;
    opacity: 0;
    border: 1px solid #c9d0e1;
    border-radius: 0 6px 6px 6px;
    background-color: #ffffff;
    padding: 10px;
    left: 3px;
    position: absolute;
    top: calc(100% + 16px);
    z-index: 2;
    white-space: nowrap;
    box-shadow: 0px 4px 14px rgba(0,0,0,0.1);
    pointer-events: none;
}

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

}

.popdown:before {
    content: "";
    position: absolute;
    border-style: solid;
    border-color: #c9d0e1 transparent;
    display: block;
    width: 0;
    top: -14px;
    bottom: auto;
    left: 5px;
    right: auto;
    border-width: 0 14px 14px;
}
.popdown.centered{
    left: 50%;
    transform: translateX(-50%);
    border-radius: 6px 6px 6px 6px;
}
.popdown.centered:before{
    left:50%;
    transform: translateX(-50%);
}
.popdown.centered:after{
    left:50%;
    transform: translateX(-50%);
}

.popdown.righted{
    right: 0px;
    left: initial;
    border-radius: 6px 6px 6px 6px;
}
.popdown.righted:before{
    left: initial;
    right: 5px;
}
.popdown.righted:after{
    left: initial;
    right: 6px;
}

.popdown.upwards{
    top: initial;
    bottom: 190%;
}
    .popdown.upwards::after {
        bottom: -13px;
        top: auto;
        border-width: 13px 13px 0px;
    }
    .popdown.upwards:before {
        bottom: -14px;
        top: auto;
        border-width: 14px 14px 0px;
    }

.popdownholder .popdown p,
.popdownholder_sidebutton .popdown p {
    margin: 0 -10px 0 -10px;
    padding: 0px 0px;
    border-bottom: #C9D0E1 1px solid;
    overflow: hidden;
}
    .popdownholder .popdown p a,
    .popdownholder_sidebutton .popdown p a {
        padding: 15px 30px;
        display: inline-block;
        width: 100%;
        text-align: center;
    }
.popdownholder .popdown small,
.popdownholder_sidebutton .popdown small {
    white-space: initial;
}
.popdownholder .popdown span.pullright,
.popdownholder_sidebutton .popdown span.pullright {
    float: right;
    padding: 10px;
    margin: -10px;
    border-left: 1px solid #c9d0e1;
}
.popdownholder .popdown p a:hover,
.popdownholder_sidebutton .popdown p a:hover {
    text-decoration: none;
    background-color: #C9D0E1;
    color: #ffffff;
}
.popdownholder .popdown p a:active, .popdownholder .popdown p a:visited, .popdownholder .popdown p a:focus,
.popdownholder_sidebutton .popdown p a:active, .popdownholder_sidebutton .popdown p a:visited, .popdownholder_sidebutton .popdown p a:focus {
    text-decoration: none;
}
    .popdownholder .popdown p:first-of-type,
    .popdownholder_sidebutton .popdown p:first-of-type {
        margin-top: -10px;
        border-radius: 6px 6px 0px 0px;
    }
    .popdownholder .popdown p:last-of-type,
    .popdownholder_sidebutton .popdown p:last-of-type {
        border-bottom: none;
        margin-bottom: -10px;
        border-radius: 0px 0px 6px 6px;
    }

.popdownholder.halfWidthButton{ width: 50%; display: inline-block; position: relative; float:left;}
.popdownholder.halfWidthButton button{ width: 100%; }

.popdownholder_sidebutton > button + button {
    border-left: 1px solid currentColor;
    cursor: pointer;
    display: inline-block;
    border-radius: 0px 50px 50px 0px;
    margin-left: -5px !important;
}
    .popdownholder_sidebutton > button + button > span {
        margin-right: 5px;
    }
    .popdownholder_sidebutton > button {
        margin-right: 0px;
        border-radius: 50px 0px 0px 50px;
    }

/*POPUP DIALOGUE*/
.popup, .signinholder {
    display: none;
    transition: opacity .3s ease-in .1s, transform .3s ease-in 0s;
    opacity: 0;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 100;
    background-color: #ffffff;
    border: 1px solid #C9D0E1;
    border-radius: 6px;
    min-width: 465px;
    max-width: 1240px;
    /*overflow-y: auto;*/
    text-align: center;
    /*margin-top: 34px;*/
    max-height: 90vh;
}
.popup.infopanel{
    z-index: 10;
}
.popup.large{
    max-width: 90%;
    min-width: 60%;
}
    .popup.infopanel a{
        text-decoration: underline;
    }
        .popup.infopanel a.button{
            text-decoration: none;
        }

        .popup .preview_image {
            width: 200px;
            height: 200px;
            border-radius: 100px;
            margin: 0 auto;
            background-color: #CCCCCC;
            background-size: contain;
            background-position: 50% 50%;
        }
.signinholder input, .signinholder input:active {
    width: 255px;
}
.popup.text-left{
    text-align: left;
}
.signinholder{
    min-width: 358px;
    transform: translate(-50%, -80%);
}
.popup h1:first-of-type{
    margin-top: 0;
    margin-bottom: 10px;
}

    .popup .contents {
        padding: 30px /*30px 30px 0 30px*/;
        overflow-y: auto;
        max-height: 80vh;
        /*margin-bottom: 60px;*/        
    } 
    /*.popup .contents.includesbutton{
        padding-bottom: 60px;
    }*/
        .popup .contents .contents {
            overflow-y: auto;
            max-height: initial;
        }
        .popup .contents.includesbutton {
            margin-bottom: 42px;
        }
        .popup .contents.includesbutton > div:last-of-type {
            padding-bottom: 30px;
        }

        .popup .contents.flushwithtop {
            padding-top: 0px;
        }
        .popup .contents.flushwithbottom {
            padding-bottom: 0px;
        }
    .popup .contents.overflow-visible{
        overflow: visible;
    }
    .popup.overflow-visible .contents{
        overflow: visible;
    }
    .popup .contents p:last-child{
        margin-bottom: 0px;
    }
    .signinholder .contents{
        padding: 30px 50px;
    }
.popup.opened {
    transform: translate(-50%, -50%);
    opacity: 1;
    transition: transform .3s ease-in 0s, opacity .2s ease-in 0s;
}
    .popup button, .buttonholder button,
    .popup a.button, .buttonholder a.button
    { margin-right: 30px; margin-top: 30px; min-width: 140px;}

    .popup button.iconbutton, .buttonholder button.iconbutton
    .popup a.iconbutton, .buttonholder a.iconbutton
     { margin-right: 30px; margin-top: auto; min-width: auto;}
    .popup button:last-of-type, .buttonholder button :last-of-type,
    .popup a.button:last-of-type, .buttonholder a.button :last-of-type
    { margin-right: 0px;}
    .popup button:last-of-type + a.button{
        margin-left: 30px;
    }

    .popup .container .row .col-xs-12 h2:first-child{ margin-top: 0px; }

    .popup div.popup_close{
        position: absolute;
        top: 0px;
        right: 0px;
        cursor: pointer;
        padding: 15px;
        z-index: 1;
    }
    .popup.loading .popup_close{
        display: none;
    }
    .popup.loading .contents {
        padding: 60px;
    }
    #success{ display: block; z-index: 150; min-width: 300px;}
    #progress{ display: block; z-index: 150; min-width: 300px;}
    #error{ display: block; z-index: 150; min-width: 400px; }
    #messagepopup{ display: block; z-index: 150; min-width: 350px; }
.signinholder{
    display: block;
}

.fader{
    display: none;
    opacity: 0.6;
    background-color: #204761;
    width: 100%;
    height: 100%;
    top: 0px; left: 0px;
    position: fixed;
    z-index: 98;
}
.fader.subfader{
    width: calc(100% + 2px);
    margin-left: -1px;
    margin-top: -1px;
    height: calc(100% + 2px);
    border-radius: 6px;
    opacity: 0.4;
}

/*CHECKBOXES*/

.slider {
    border: none;/*1px solid #92959C;*/
    width: 30px;
    height: 15px;
    background: transparent;
    margin: 0px;
    position: relative;
    border-radius: 50px;
    float: left;
    display: inline-block;
    margin-right: 15px;
    margin-top: 0px;/*inputs shouuld have bottom margins -  never top margins*/
    margin-bottom: 15px;
    overflow: hidden;
}
.slider.right{
    float:right;
    margin-right: 0px;
    margin-left: 15px;
}

.slider.large{
    width: 46px;
    height: 24px;
}
    .slider.large > input + label:after {
        width: 20px;
        height: 20px;
    }
    .slider.large input[type=checkbox]:checked + label:after {
        left: 24px;
    }
    .slider.large + label {
        margin-top: 4px;
    }

.slider > input + label {
  display: block;
  width: 46px;
  height: 24px;
  cursor: pointer;
  position: absolute;
  top: 0px;
  z-index: 0;
  left: 0px;
  border-radius: 6px;
  background-color: #C9D0E1;
}
.slider.large > input + label{
    border-radius: 16px;
}

.slider input[type=checkbox]:checked + label{
    background-color: #2908C6;
}
.slider.slider_disabled input[type=checkbox]:checked + label{
    background-color: #F2545E;
}
.slider > input + label:after {
    content: '';
    width: 10px;
    height: 10px;
    position: absolute;
    top: 2px;
    left: 2px;
    background: #FFFFFF;
    border-radius: 50px;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
.slider input[type=checkbox] {
  visibility: hidden;
}
.slider input[type=checkbox]:checked + label:after {
  left: 17px;
}
.slider input[type=checkbox][disabled]:checked + label:after,
.slider > input[disabled] + label:after
{
    opacity: 0.4;
}
.slider input[type=checkbox]:checked + label:after {
  background: #FFFFFF;
}

.slider + label{ vertical-align: middle; margin-top: 0px; /*inputs shouuld have bottom margins -  never top margins*/ margin-bottom: 15px; }

.slider_subsliders.enabled .basicList{
    display: none;
}
.slider_subsliders label[data-enabled]{
    display: none;
}
.slider_subsliders label[data-disabled]{
    display: inline-block;
}
.slider_subsliders.enabled label[data-enabled]{
    display: inline-block;
    color: #2908C6;
}
.slider_subsliders.enabled label[data-disabled]{
    display: none;
}

/*TICKBOXES*/

.tickbox {
    border: 1px solid #92959C;
    width: 24px;
    height: 24px;
    background: transparent;
    margin: 0px;
    position: relative;
    border-radius: 50px;
    float: left;
    display: inline-block;
    margin-right: 15px;
    margin-top: 0px;/*inputs shouuld have bottom margins -  never top margins*/
    margin-bottom: 15px;
}
.tickbox.right{
    float:right;
    margin-right: 0px;
    margin-left: 15px;
}

.tickbox > input +  label {
  display: block;
  width: 24px;
  height: 24px;
  cursor: pointer;
  position: absolute;
  top: 0px;
  z-index: 1;
  left: 0px;
  border-radius: 50px;
}
.tickbox > input + label:after {
    content: '';
    width: 20px;
    height: 20px;
    position: absolute;
    top: 4px;
    left: 3px;
    /*background: #92959C;*/
    border-radius: 50px;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
    opacity: 0;
}
.tickbox input[type=checkbox] {
  visibility: hidden;
}
.tickbox input[type=checkbox]:checked + label:after {
    left: 2px;
    top: 2px;
    opacity: 1;
    font-size: 13px;
}
.tickbox input[type=checkbox][disabled]:checked + label:after,
.tickbox > input[disabled] + label:after
{
    opacity: 0.4;
}
.tickbox input[type=checkbox]:checked + label:after {
  color: #2908C6;
  font-family: 'azzuuinterface' !important;
  content: "\e914";
}
    .panel .panel-image .tickbox input[type=checkbox]:checked + label:after {
        background-color: white;
        line-height: 1.7;
        padding-left: 3px;
        left: 1px;
        top: 1px;
    }

.tickbox + label {
    vertical-align: sub;
    margin-top: 0px; /*inputs shouuld have bottom margins -  never top margins*/
    margin-bottom: 15px;
}

.tickbox.small {
    width: 16px;
    height: 16px;
    margin-bottom: 1px;
    margin-top: 2px;
}

    .tickbox.small input[type="checkbox"]:checked + label::after {
        left: 3px;
        top: 1px;
        opacity: 1;
        font-size: 9px;
    }
    .tickbox.small > input + label::after {
        content: '';
        width: 12px;
        height: 12px;
    }
.tickbox + label {
    vertical-align: middle;
    margin-top: 0px;
    margin-bottom: 0px;
    cursor: pointer;
}

.upload-holder{
    cursor: pointer;
}

.upload-holder input[type=file] {
    display: block;
    display: inline-block;
    background-color: #ededed;
    opacity: 0.001;
    margin-bottom: 0px;
    cursor: pointer;
}

.upload-holder .upload-label {
    font-size: 14px;
    border: 1px solid #92959C;
    color: #92959C;
    border-radius: 20px;
    padding: 10px 20px;
    background-color: transparent;
    display: inline-block;
    text-decoration: none;
    vertical-align: middle;
    outline: none;
    text-decoration: none;
    margin-bottom: 10px;
    user-select: none;
    background-color: #2908C6;
    border-color: #2908C6;
    color: #ffffff;
    top: 0px;
    margin: 0 auto;
    pointer-events: none;
    cursor: pointer;
}

.text-left .upload-holder .upload-label{
    left: 0px;
}
/*MEDIA TABLE*/
.mediaTable {
    color: #B2B7C7;
    width: 100%;
    font-size: 13px;
}
.mediaTable th{
    color: #92959C;
    padding: 10px;
}
.mediaTable th span{
    font-size: 12px;
    margin-left: 15px;
}
    .mediaTable tbody tr {
        border-top: 1px solid #C9D0E1;
    }
    .mediaTable tr td:first-child{ font-weight: 600; color: #204761; position: relative; }
    .mediaTable tr td:last-child{ text-align: right;}
.mediaTable td{
    padding: 15px;
    vertical-align: central;
}
.mediaTable .preview{
    width: 80px;
    height: 80px;
    border-radius: 6px;
    display: inline-block;
    border: 1px solid #C9D0E1;
    vertical-align: middle;
    margin-right: 20px;
    padding: 15px;
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    position: relative;
}
    .mediaTable a.underlink {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
    }
    .mediaTable thead th.orderby {
        cursor: pointer;
    }

[data-pickertype="folder"] .panel.file_panel {
    opacity: 0.4;
    pointer-events: none;
}
/*SECTION*/
.section{
    width: 100%;
    border-radius: 6px;
    background-color: #ffffff;
    border: 1px solid #C9D0E1;
    margin-top: 30px;
    margin-bottom: 60px;
}
    
    div[class*="col-"] .section.extrapadding .contents{
        padding: 30px;
    }
    .section .contents div[class*="col-"],
    .section .contents-header div[class*="col-"] {
        /*padding-right: 30px;
        padding-left: 30px;*/
    }
    .section .contents div.row {
        margin-right: -15px;
        margin-left: -15px;
    }
    .section .contents-header div.row {
        margin-right: -30px;
        margin-left: -30px;
    }

        .section .contents div[class*="col-"] .row div[class*="col-"],
        .section .contents-header div[class*="col-"] .row div[class*="col-"] {
            padding-left: 15px;
        }
    .section .contents{
        padding: 30px;
    }
        .section .contents h2:first-of-type {
            margin-top: 0px;
        }
.section.approvalqueuesection .contents {
    padding: 15px;
}
    .section .contents.contents-split{
        float:left;
        width: 50%;
        border-right: 1px solid #C9D0E1;
    }
    .section .contents.contents-split:last-child{
        border-right: 0px;
    }
    div[class*="col-"] .section .contents-header{
        padding: 20px 0px;
    }
        div[class*="col-"] .section .contents-header.contents-header-filter {
            padding-bottom: 0px;
            align-items: flex-end;
        }
.contents-header .contents-primary-button {
    position: absolute;
    top: 55px;
    right: 20px;
}
.section .contents-header.contents-header-filter h1 {
    margin-bottom: 15px;
}
div[class*="col-"] .section.extrapadding .contents-header {
    /*padding: 20px 15px;*/
}
    .section .contents-header{
        border-bottom: 1px solid #C9D0E1;
        margin: 0 15px;
        padding: 20px 15px;
        border-radius: 6px 6px 0 0;
        display: -ms-flexbox;
	    display: -webkit-flex;
	    display: flex;

	    -ms-flex-align: center;
	    -webkit-align-items: center;
	    -webkit-box-align: center;
        flex-wrap: wrap;

	    align-items: center;
    }
    .section .contents-header h1{
        margin: 0px;
    }
    .section .contents-header div p:last-child{
        margin: 0px;
    }
    .section .contents > h2,
    .popup .contents > h2, 
    .section .contents > h1{
        margin: 0px;
        margin-bottom: 15px;
    }
    .section h2 {
        /*margin: 0px;*/
        margin-bottom: 10px;
    }
    .section button.fullWidthButton{
        border-radius: 0px 0px 6px 6px;
    }
    .section button.roundedButton{
        border-radius: 6px 6px;
    }

    .section .contents.splt [class^="col-"]:first-of-type,
    .popup .contents.splt [class^="col-"]:first-of-type{
        border-left: none;
    }
    .section .contents.splt [class^="col-"]:last-of-type,
    .popup .contents.splt [class^="col-"]:last-of-type{
        border-right: none;
    }
    .section .contents.splt [class^="col-"],
    .popup .contents.splt [class^="col-"]{
        border-left: 1px solid #C9D0E1;
        border-right: 1px solid #C9D0E1;
        margin-left:-1px;
    }
    .section .contents.seperatorlines > div[class^="col-"]{
        border-right: 1px solid #C9D0E1;
    }
    .section .contents.seperatorlines > div[class^="col-"]:last-of-type{
        border-right: none;
    }
    .section .contents.seperatorlines > form > div[class^="col-"]{
        border-right: 1px solid #C9D0E1;
    }
    .section.slim{
        margin-bottom: 30px;
    }
    .section.slim h2 {
        margin: 0px;
        font-size: 18px;
    }
        .section.slim .contents-header, 
        .popup .contents-header {
            padding: 15px 0px;

        }

        .popup .contents-header {
            border-bottom: 1px solid #c9d0e1;
        }
            .popup .contents-header h1, .popup .contents-header h2 {
                margin-top: 0px;
                margin-bottom: 0px;
            }

    .section.slim .contents {
        padding: 10px 15px;
    }
    .section .contents-header + .col-xs-12 > .contents,
    .section .contents-header + .col-sm-12 > .contents{
        border-top: none;
    }
.contents-header-filters {
    padding: 0px;
    list-style: none;
    margin: 0px 0px;
    margin-top: 7px;
    float: right;
}
.text-center .contents-header-filters{
    float: initial;
}
.contents-header-filters li {
    display: inline-block;
    padding: 0px 15px;
    cursor: pointer;
    margin: 0px 0px;
    vertical-align: middle;
}
    .contents-header-filters li:hover {
        color: #2908C6;
    }
    .contents-header-filters li.selected {
        color: #2908C6;
        font-weight: 600;
    }
    .contents-header-filters li.selected > span{
        border-bottom: 2px solid #2908C6;
        padding: 1px 0;
    }
    ul.contents-header-filters.contents-header-filters-large {
        transform: translateY(29px);
        padding-bottom: 41px;
    }
    .contents-header-filters.contents-header-filters-large li.selected > span {
        border-bottom: 2px solid #2908C6;
        padding: 11px 0;
    }
    .contents-header-filters.contents-header-filters-large li {
        padding: 0px 45px;
    }

    /*BUTTON STRIP*/

    ul.buttonstrip{
        padding: 0px;
        list-style: none;
    }
    ul.buttonstrip li{
        float:left;
        padding: 0px;
        border-right: solid 1px #C9D0E1;
    }
        ul.buttonstrip li:last-child {
            border-right: none;
        }

        ul.buttonstrip li:hover {
            background-color: #92959C;
            color: #ffffff;
        }
        ul.buttonstrip li span {
            margin-right: 10px;
        }
        ul.buttonstrip li button,
        ul.buttonstrip li a,
        .buttonstrip-holder-more li button,
        .buttonstrip-holder-more li a {
            border: none;
            text-align: center;
            font-size: 14px;
            padding: 5px 20px;
            cursor: pointer;
            margin-bottom: 0px;
            display: inline-block;
            min-width: auto;
            margin-top: 0px;
        }
        ul.buttonstrip li a:hover{
            background-color: #92959C;
            color: #ffffff;
        }
        ul.buttonstrip li:first-child button{
            /*padding-left: 0px;*/
        }

        #undopip, #messagepip{ 
            position: fixed;
            top: 150px;
            left: 50%;
            transform: translateX(-50%);
            /*padding: 20px;*/
            padding-left: 30px;
            /*padding-right: 90px;*/
            border: 1px solid #2908C6;
            border-radius: 6px;
            z-index: 50;
            background-color: #2908C6;
            box-shadow: 0px 4px 14px rgba(0,0,0,0.1);
            color: #ffffff;
            animation: 0.5s linear 0s 1 fadeInDropdown;
        }
        #messagepip{
            padding: 10px 15px;
            top: 90px;
            display: none;
        }
        #messagepip.negative{
            background-color: #F2545E;
            border: 1px solid #F2545E;
        }
        #undopip > button{
            border: 0px;
            border-left: 1px solid #ffffff;
            color: #ffffff;
            border-radius: 2px;
            margin-bottom: 0px;
            padding: 10px 20px;
            margin-left: 30px;    
            /*position: absolute;*/
            top: 0px;
            right: 0px;
            height: 61px;
        }
        #undopip > button:hover{
            border-radius: 0;
            color: #2908C6;
            background-color: #ffffff;
        }
            #undopip > button:last-of-type:hover {
                border-radius: 0 5px 5px 0;
            }
        #undopip > button > span{
            margin-right: 0px
        }
            #undopip > button + button {
                margin-left: -2px;
            }

            .apiVariableList{
                list-style: none;
                padding: 0px;
            }
            .apiVariableList hr{
                width: 100%;
                margin: 5px 0px;
            }
            .apiVariableList li{
                float: left;
                border: 1px solid #2908C6;
                border-radius: 3px;
                padding: 0px 15px;
                margin-right: 5px;
                display: inline-block;
                background-color: #2908C6;
                color: #ffffff;
                font-weight: 600;
                text-align: center;
                cursor: pointer;
            }
            .apiVariableList li.sub{
                background-color: #08aec6;
            }
                .apiVariableList li.sub_pc {
                    background-color: #278e9d;
                }
            #api_textedit{
                border: 1px solid #C9D0E1;
                border-radius: 6px;
                min-height: 90px;
                max-height: 90px;
                overflow: auto;
                padding: 5px;
                margin-bottom: 15px;
                margin-top: 10px;
                white-space: pre-wrap;
                -webkit-user-modify: read-write;
                word-wrap: break-word;
                -webkit-line-break: after-white-space;
            }
            .apiVariableList li span{
                font-weight: 300;
                font-size: 14px;
                opacity: 0.7;
            }
            label#selectedvariable {
                font-weight: 600;
                margin: 5px 0;
                color: #111;
            }
            #api_textedit div[data-fieldname] {
                display: inline-block;
                border-radius: 2px;
                background-color: #b7b7b7;
                padding: 2px 5px;
                margin-bottom: 1px;
                color: #ffffff;
            }
            #api_text_preview{
                width: 100%;
                border: 1px solid #C9D0E1;
                border-radius: 6px;
                min-height: 80px;
                padding: 5px;
            }

            .editorPostHashtagList.editorPostHashtagList_trendingandfavourite{
                width: 425px;
            }

            .editorPostHashtagList div {
                width: 200px;
                float: left;
                display: inline-block;
            }
.collapsable{ border-bottom: 1px solid #C9D0E1; }
.collapsable .searchresultslist {
    margin: 0px 0px;
    padding: 0px;
    list-style: none;
}
.collapsable-title {
    margin: 15px 0 10px;
    cursor: pointer;
}
.collapsable.contracted .collapsable-panel {
    height: 0;
    transition: 0.5s height linear;
    overflow: hidden;
}
.collapsable.contracted [class^="icon-"] {
    transform: rotate(180deg);
}
.collapsable.contracted.immediate .collapsable-panel {
    transition: none;
}

ul.buttonstrip.hashtags {
    padding: 0px;
    list-style: none;
    border: 1px solid #C9D0E1;
    border-left: none;
    border-right: none;
    margin-bottom: 30px;
}
    ul.buttonstrip.hashtags li {
        margin: 0px;
    }
        ul.buttonstrip.hashtags li button,
        ul.buttonstrip.hashtags li:hover ul li button {
            padding: 7px 15px;
            color: #2908C6;
            max-width: 230px;
            overflow: hidden;
            max-height: 35px;
        }
    ul.buttonstrip.hashtags li a {
        padding: 7px 15px;
        text-align: center;
    }
    ul.buttonstrip.hashtags li.more {
        float: right;
    }
    ul.buttonstrip.hashtags li:hover button,
    ul.buttonstrip.hashtags li:hover a,
    ul.buttonstrip.hashtags li:hover ul li:hover button,
    ul.buttonstrip.hashtags li:hover ul li:hover a{
        color: #ffffff;
    }
    ul.buttonstrip.hashtags > li.notvisible {
      display: none;
    }
    ul.buttonstrip.hashtags > li > ul {
        display: none;
        position: absolute;
        right: 0px;
        width: 200px;
        background-color: #ffffff;
        z-index: 1;
        padding: 0px;
        border: 1px solid #C9D0E1;
    }
    ul.buttonstrip.hashtags > li.more:hover > ul {
        display: block;
    }
    ul.buttonstrip.hashtags > li > ul > li{
        display: block;
        list-style: none;
        width:100%;
    }
    .livefeed .livefeed_items{
        display: -webkit-flex;
        display: flex;
        max-width: 100%;
        overflow: auto;
        /*-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;
        overflow: visible;*/
    }
    #livefeed_tall.livefeed .livefeed_items{
        flex-direction: column;
        max-height: 400px;
    }
    #livefeed_tall.livefeed .livepanel{
        border-right: none;
        border-bottom: 1px solid #C9D0E1;
        width: 100%;
    }
    .livepanel{
        width: 255px;
        min-width: 255px;
        border-right: 1px solid #C9D0E1;
        background-color: #ffffff;
        padding: 12px;
        float: left;
    }
    .popup .livepanel{
        width: 100%;
        border-right: none;
    }
    .livepanel ul.socialchannels li{
        margin: 0px;
    }
    .livepanel .livepanel-body p.feedtext{
        font-size: 13px; color: #204761;
        text-align: left;
        margin-bottom: 10px;
        white-space: pre-line;
    }
    .livepanel .livepanel-image{
        width: 100%;
        padding-top: 73%;
        background-color: #e9eaeb;
        position: relative;
        border-radius: 6px;
        background-position: 50%;
        background-size: cover;
        background-repeat: no-repeat;
        transition: ease-in-out 0.3s background-size;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: row;
        flex-direction: row;
        -webkit-align-items: center;
        align-items: center;
        -webkit-justify-content: center;
        justify-content: center;
    }

    .livepanel .livepanel-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;
    }
    .livepanel .livepanel-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;
        max-width: 90%;
        max-height: 90%;
    }
        .livepanel .livepanel-image img.notloaded {
            filter: blur(2px);
        }

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

.eventsummary .action{
    font-weight: 500;
    text-transform: uppercase;
}

.periodendevents .eventsummary {
    width: 500px;
    margin: 0 auto;
    margin-top: 30px
}
    /*.eventsummary  .deleteaction {
        display: none;
    }
    .eventsummary > div:hover .deleteaction {
        display: inline-block;
    }*/

[class^="icon-info"], [class*="icon-info"] {
    opacity: 0.3;
}
    [class^="icon-info"]:hover, [class*="icon-info"]:hover {
        opacity: 1;
    }

.content-header {
    background-image: url('../Content/contentheader.jpg');
    color: #fff;
    text-align: center;
    padding: 50px;
    background-size: cover;
    margin: -42px -30px 60px;
    background-position: top center;
}
    .content-header.content-header-error {
        background-image: url('../Content/contentheader_error.jpg');
    }
    .content-header h1 {
        color: #ffffff;
    }
.apiVariableList li ul {
    position: absolute;
    z-index: 2;
    display: none;
    top: 50%;
    transform: translateY(-50%);
}

    .apiVariableList li ul li {
        display: block;
        float: initial;
        margin: 0px;
    }
li[data-dd] {
    padding: 10px;
}
.popdown ul {
    margin-top: 5px;
    margin-bottom: 10px;
}
.popdown ul:last-child {
    margin-bottom: 5px;
}
    .popdown ul li {
        padding: 0px 10px;
    }
.tox button.tox-tbtn,
.popup .tox button.tox-tbtn,
.popup .tox button.tox-mbtn {
    min-width: initial;
}
.tox .tox-form__group, 
.tox .tox-checkbox {
    margin-bottom: 15px;
}
.tableholder table tr:nth-child(even) {
    background-color: #e8e8e8;
}

.tableholder table tr td,
.tableholder table tr th {
    white-space: nowrap;
    border-right: 1px solid #cccccc;
    padding: 5px 12px;
    position: relative;
}

    .tableholder table tr th p {
        padding: 0px;
        margin: 0px;
        margin-right: 60px;
    }

.tableholder {
    overflow: auto;
    max-height: 70vh;
}
    .tableholder thead .popdownholder {
        float: right;
        float: initial;
        display: inline-block;
        position: absolute;
        right: 3px;
        top: 5px;
    }

    .tableholder thead .soloButton {
        font-size: 7px;
        padding: 0px 10px;
        margin-bottom: 0px;
    }

.datatypeSelector {
}

    .datatypeSelector .datatype {
        font-size: 9px;
        margin-right: 6px;
    }

.tableholder input {
    font-size: 15px;
    border-bottom: 3px transparent solid;
    margin-bottom: 0px;
    padding: 0px;
}
.panel.screen-panel {
    text-align: center;
    padding: 20px;
    min-height: 100px;
}

.tox .tox-dialog {
    max-width: 700px !important;
}
    .tox .tox-dialog hr {
        border-bottom: 2px solid #b3b3b3;
        width: 100%;
        padding-top: 10px;
        margin-bottom: 10px;
    }