#second-level-navigation a:link, #second-level-navigation a:visited {
    color: #c2c2c2;
}

#main-navigation a:hover, #main-navigation a:focus {
    color: #ffffff;
}

/* skip colouring the main menu options, but blacken the background of their popup's */
#second-level-navigation ul ul.subnav {
    background: #1a1a1a;
}

#second-level-navigation ul.subnav li a:hover {
    color: white;
}

#second-level-navigation ul.subnav {
    border: 1px solid #040404;
}

/* Make the first set of options black text */
#second-level-navigation > ul > li > a {
    color: black !important;
}

.landlord-bg {
    background: #B5C3CC;
    color: black;
}

.landlord-bg-fade {
    /*background: linear-gradient(to bottom, rgba(125,185,232,0) 0%,rgba(181,195,204,1) 100%);*/
    background: #B5C3CC;
    color: black;
}

.buyer-bg {
    background: #6BA5CD;
    color: black;
}

.buyer-bg-fade {
    background: #6BA5CD;
    /*background: linear-gradient(to bottom, rgba(125,185,232,0) 0%,rgba(107,165,205,1) 100%);*/
    color: black;
}


.seller-bg {
    background: #98D1F9;
    color: black;
}

.seller-bg-fade {
    /*background: linear-gradient(to bottom, rgba(125,185,232,0) 0%,rgba(152,209,249,1) 100%);*/
    background: #98D1F9;
    color: black;
}


.tenant-bg {
    background: #48ABD9;
    color: black;
}

.tenant-bg-fade {
    /*background: linear-gradient(to bottom, rgba(125,185,232,0) 0%,rgba(72,171,217,1) 100%);*/
    background: #48ABD9;
    color: black;
}


.logout-bg {
    background: #360606;
    color: black;
}

.applicant-bg {
    background: #68B3B1;
    color: black;
}

.applicant-bg-fade {
    /*background: linear-gradient(to bottom, rgba(125,185,232,0) 0%,rgba(104,179,177,1) 100%);*/
    background: #68B3B1;
    color: black;
}


.viewer-bg {
    background: #B6CED6;
    color: black;
}

.viewer-bg-fade {
    /*    background: linear-gradient(to bottom, rgba(125,185,232,0) 0%,rgba(182,206,214,1) 100%);*/
    background: #B6CED6;
    color: black;
}


li.tenant-sub-menu {
    background: #1A1A1A !important;
}

/* Styles for the drop down menu */
span.menu-title {
    position: relative;
    text-decoration: none;
    width: auto;
    display: block;
    line-height: 1em;
    padding: 0.4em 1em;
    white-space: nowrap;
    font-size: 12px;
    color: black !important;
    font-family: "Palatino Linotype","Book Antiqua","Palatino","serif";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.6em;
    font-family: "Roboto","Palatino Linotype","Book Antiqua","Palatino","sans-serif","serif","Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase !important;
}

.buyer-bg ul, .seller-bg ul, .tenant-bg ul, .logout-bg ul, .applicant-bg ul, .viewer-bg ul {
    background: #1c1c1c;
}

li > ul.show-on-hover {
    display: none !important;
}

li:hover > ul.show-on-hover {
    display: block !important;
}

ul.show-on-hover {
    position: relative !important;
}

ul.show-on-hover:hover > * {
    background: #1c1c1c !important;
}

modal {
    display: none;

}

modal.active {
    display: block;
}

.greyscale-50 {
    filter: grayscale(50%);
}

.drop-shadow {
    filter: drop-shadow(0px 0mm 5.5px #000000) !important;
}

.drop-shadow-white {
    filter: drop-shadow(0px 0 5.5px rgba(255, 255, 255, 0.63)) !important;
}

.drop-shadow-water {
    filter: drop-shadow(0px 0 2.5px rgba(170, 243, 247, 0.91)) drop-shadow(0px -6px 3.5px rgba(5, 169, 244, 0.5)) drop-shadow(0px 2px 1.5px rgba(255, 255, 255, 0.34)) !important;
}


.blue-button-text-shadow {
    text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.46), 1px 0px 1px rgba(0, 0, 0, 0.38), 1px 2px 1px rgba(0, 0, 0, 0.44), 0px 0px 5px #F1F1F1;
}



#content, #issue, section.content {
    /*background: #222;*/
    /*background: #E8E8E8;*/
    background: linear-gradient(to bottom, #E8E8E8 88%,#CFCFCF 105%);
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 36px;
    box-shadow: 0 2px 7px 4px rgba(0, 0, 0, 0.61);
    margin-top: 30px;
    padding: 1px 20px 30px;
    color: black;
}

.modal-link {
    display: inline-block;
}

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

    .modal-link {
        border-right: 1px solid #00d1ff;
    }
}


section.sub-section > content {
    background: rgba(0, 0, 0, 0) linear-gradient(to bottom, #e8e8e8 88%, #cfcfcf 105%) repeat scroll 0 0 !important;
    border-radius: 36px;
}

section.sub-section {

}

section.content-section#content {
    border: 0px solid transparent !important;
    box-shadow: 0 2px 7px 4px rgba(0, 0, 0, 0.61) !important;
    padding: 0px !important;
        
}

section.content-section.no-foot > footer {
    background: rgba(0, 0, 0, 0) linear-gradient(to bottom, #e7e7e7 46%, #D5D5D5 62%,#929292 89%) repeat scroll 0 0 !important;
    height: 23px !important;
    line-height: 0 !important;
    max-height: 20px !important;
    min-height: 34px !important;
    padding: 0 !important;
}


    /* START: Styles for content-section */

    
    #section-sign-in > header, #section-sign-up > header {
        line-height: 60px;
        padding-bottom: 0px;
    }

    section.content-section.no-icon > header {
        line-height: 60px;
        padding-bottom: 0px;
    }

section.content-section.has-icon > header h1 img, section.content-section.has-icon > header h1 i {
    margin-top: 10px;
}
    

    section.content-section, section.sub-section {
        display: flex;
        flex-direction: column;
        border-radius: 36px;
        margin-bottom: 30px;
        box-shadow: 0 2px 7px 4px rgba(0, 0, 0, 0.61);
        margin-top: 30px;
    }

    section.content-section > header, section.sub-section > header {
        background: #006992;
        border-top-left-radius: 36px;
        border-top-right-radius: 36px;
        color: white;
        min-height: 60px;
        /*max-height: 60px;*/
        line-height: 30px;
        display: block;
        font-family: "Roboto","Arial","Helvetica","Palatino Linotype","Book Antiqua","Palatino","serif";
        
    }

        body.account section.content-section > header, body.account section.sub-section header {
            background: #889EA7;
        }

        body.landlord section.content-section > header, body.landlord section.sub-section > header {
            background: #1C3144;
        }

        body.buyer section.content-section > header, body.buyer section.sub-section > header {
            background: #007991;
        }

        body.seller section.content-section > header, body.buyer section.sub-section > header {
            background: #28536B;
        }

        #canvas-wrapper, #canvas, body, html {
            background: #1F1F1F !important;
        }

        /* The blue background we are using doesn't work well with the colour of the landlords header 
            if we change the background to #1D1E1E which is dark grey all the headings look good, but we lose much of the colour from the page, 
            is this an acceptable change?
        */



    section.sub-section > header {
        display: inherit; /* this allows the h1/h2 to set its auto margins for center positioning */
    }

    section.content-section > header {
        padding-bottom: 15px;
    }

    section.sub-section > content {
        padding: 10px;
    }

        section.content-section > header h1 {
            color: white;
            font-size: 35px;
            margin: 0px;
        }

         section.sub-section > header h1 {
            color: white;
            font-size: 21px !important;
            margin: auto;
        }
        section.content-section > header h1 {
            text-transform: uppercase;
        }

        section.sub-section > header h2 {
            color: white;
            font-size: 18px !important;
            margin: 0px;
            /*text-transform: uppercase;*/
        }

    section.content-section > content {
        background: #e8e8e8;
        min-height: 50px;
        display: block;
        color: black;
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 10px;
        padding-right: 10px;
    }

    section.content-section > content p {
        margin-top: 3px;
        margin-bottom: 3px;
    }

    

    section.content-section > footer {
        background: #006992; 
        border-bottom-left-radius: 36px;
        border-bottom-right-radius: 36px;
        color: white;
        min-height: 60px;
        max-height: 60px;
        line-height: 60px;
        display: block;
        font-family: "Roboto","Arial","Helvetica","Palatino Linotype","Book Antiqua","Palatino","serif";
    }

    body.account section.content-section > footer {
        background: #889EA7;
    }

    body.landlord section.content-section > footer {
        background: #1C3144; 
    }

    body.buyer section.content-section > footer {
        background: #007991; 
    }

    body.seller section.content-section > footer {
        background: #28536B;
    }




    html.staff section.content-section > header,html.staff section.sub-section > header,
    html.staff section.content-section > footer, html.staff section.sub-section > footer {
        background: #bababa;
    }

.uppercase {
    text-transform: uppercase !important;
}

indent {
    padding-left: 25px;
    display: inline-block;
}

.pad-both-15per {
    /*margin-left: 15% !important;*/
    /*margin-right: 15% !important;*/
    padding-left: 15% !important;
    padding-right: 15% !important;
}

html.staff, html.staff body {
    background: #323232 !important;
}

html.staff #dashboard-content h1 {
    color: black;
}

    html.staff body ul.breadcrumbs li, html.staff body ul.breadcrumbs li:last-child::before, html.staff body ul.breadcrumbs li:not(:first-child)::before {
        background: #323232 !important;
    }

    /* if the notify form is loaded via a button. then it should display as a square */
    .notify-loader > section.sub-section {
        /*border: 1px solid #7D7F81;*/
        border: 0px solid transparent;
        border-radius: 0px !important;
    }

    /*
        .notify-loader > section.sub-section > header {
            border-left: 1px solid white;
            border-right: 1px solid white;
            border-top: 1px solid white;
        }
        */

    .notify-loader > section.sub-section > header, .notify-loader > section.sub-section > content {
        border-radius: 0px !important;
    }


@media only screen and (max-width: 500px) {
    span {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
}

.pad-both-15per {

}


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

        section.content-section > header, section.content-section > footer {
            font-family: "Roboto","Arial","Helvetica","Palatino Linotype","Book Antiqua","Palatino","serif";
        }

        section.sub-section {
            /*border: 1px solid #335860;*/
            border: 1px solid #7D7F81;
        }

            section.sub-section > header {
                display: inherit !important;
                vertical-align: middle !important;
            }

                section.sub-section > header > h1, section.sub-section > header > h2 {
                    line-height: 1em;
                    margin: auto !important;
                    vertical-align: middle !important;
                }


        section.content-section {
            box-shadow: none !important;
        }

            section.content-section > header, section.content-section > footer,
            section.sub-section > header, section.sub-section > content {
                border-radius: 0px !important;
            }

            section.content-section > footer {
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
    }

    @media only screen and (max-width: 480px) {
        section.content-section > footer {
            font-size: 12px !important;
        }
    }

    /* END: Styles for content-section */




    section h1 {
        margin-bottom: 30px;
    }

    section.notification-form {
        margin-top: 0px !important;
    }

    h1.normal, h2.normal, h3.normal, h4.normal {
        font-weight: normal !important;
    }

    .dlink-box {
        background: #cdcdcd none repeat scroll 0 0;
        margin-bottom: 10px !important;
    }

    .dlink {
        font-size: 16px;
        margin-bottom: 0;
        margin-top: 0;
    }

    div.group-up {
    }

        div.group-up.enabled {
            /*background: #ff8888;
        */
            border: 3px solid red;
            margin-bottom: 5px;
        }

            div.group-up.enabled *:last-child {
                margin-bottom: 0px !important;
            }

    ul.jus, ol.jus {
        margin: 1em 0;
        padding-left: 100px;
        padding-right: 100px;
        text-align: justify;
    }

    .show-on-hover {
        position: relative;
        z-index: 800000;
    }

        .show-on-hover > * {
            display: none;
        }

    hide {
        display: none !important;
    }

    h2 {
        color: #444444;
    }

    .show-on-hover:hover > * {
        display: table;
        background: white;
        color: black;
        box-shadow: 0px 0px 11px 0px black;
        position: relative;
    }

    .ip-off-black {
        color: #444444;
    }



    .ip-win-bord-col {
        border: 1px solid #545454;
    }

    .keep-together {
        white-space: nowrap !important;
    }

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

        ul.jus, ol.jus {
            padding-left: 5px;
            padding-right: 5px;
        }
    }

    /*.cke_button__table,*/

    .cke_button__newpage,
    .cke_button__templates,
    .cke_button__scayt,
    .cke_button__form,
    .cke_button__checkbox,
    .cke_button__radio,
    .cke_button__textfield,
    .cke_button__textarea,
    .cke_button__select,
    .cke_button__button,
    .cke_button__imagebutton,
    .cke_button__hiddenfield .cke_button__copyformatting,
    .cke_button__removeformat,
    .cke_button__blockquote, .cke_button__creatediv, .cke_button__bidiltr, .cke_button__bidrtl, .cke_button__flash, .cke_button__iframe, .cke_button__insertpre, .cke_button__about, .cke_button__smiley, .cke_button__language, .cke_button__bidirtl {
        display: none !important;
    }

    textarea#details {
        width: 400px;
    }

    img.power-button {
        width: 30px;
    }

    kv.style6 k {
        padding-right: 15px;
    }

    kv.red-col-full2 {
        background: #390707 !important;
    }

        kv.red-col-full2 * {
            color: #EF7878 !important;
        }

    kv.red-col-full {
        background: #FF4545 !important;
    }

        kv.red-col-full * {
            color: white !important;
        }

    kv.red-col * {
        color: red !important;
    }

    h1 {
        font-size: 28px !important;
    }

    h3 {
        font-weight: bold !important;
    }

    kv {
        display: inline-block;
        padding: 10px;
    }

    .no-collapse, .no-collapse * {
        border-collapse: initial !important;
    }

    .ip-btn {
        background: #217ed5 none repeat scroll 0 0;
        border: 0 solid transparent;
        border-radius: 25px !important;
        color: white !important;
        text-decoration: none !important;
        cursor: pointer !important;
        display: inline-block;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    /* only apply this style to desktop machines, exclude mobiles */
    body.is-desktop .ip-btn:hover {
        background: #329dd6 !important;
    }





    .ip-btn-dd {
        min-height: 32px !important;
        vertical-align: middle !important;
        line-height: 32px !important;
        border-radius: 0px !important;
    }


    .ip-bg {
        background: #04273d;
    }

    .ip-btn-col {
        background: #217ed5;
    }

    .ip-btn-hov {
        background: #329dd6;
    }

    .ip-btn-dis {
        background: #9f9f9f;
    }

    .ip-grey-border {
        border: 1px solid #545454;
    }
    /* IMPORTANT */

    .ip-im-bg {
        background: #04273d !important;
    }

    .ip-im-btn-col {
        background: #217ed5 !important;
    }

    .ip-im-btn-hov {
        background: #329dd6 !important;
    }

    .ip-im-btn-dis {
        background: #9f9f9f !important;
    }

    .ip-im-grey-border {
        border: 1px solid #545454 !important;
    }


    .menu-block {
        margin: auto;
        padding-left: 6%;
        text-align: center;
        width: 100%;
    }


    .property-address {
        white-space: pre;
    }

    kv > k {
        display: block;
        background-color: #aaa;
    }

    kv > v {
        display: block;
        background-color: transparent;
        box-shadow: 0px 4px 7px -5px #21BADC;
    }

    kv > k {
        /*background: #194751 none repeat scroll 0 0;*/
        background: #193451;
        border: 2px solid #255180;
        border-top-left-radius: 25px;
        border-top-right-radius: 25px;
        padding-bottom: 2px;
        padding-top: 2px;
        border-bottom: 0px;
    }

    kv > v > input, kv > v > textarea {
        padding-left: 12px;
        padding-right: 12px;
        padding-bottom: 4px;
        width: 94%;
    }

    textarea#let-property-address {
        width: 400px;
    }

    kv > v > button {
        position: absolute;
        margin-left: 1px;
    }

    /*color text in a rusty dark red*/
    rust {
        color: darkred;
    }


#navigation-bottom {
    border-bottom: 1px solid #000000 !important;
}

/*
#email, #address, #tel, #name {
    width: 400px;
}
        */
td.back-cell { /* have this cell stretch to fit only its button */
    width: 0px;
    max-width: 15px;
}

    img.back-button {
        /*background: rgba(137, 134, 134, 0.24) none repeat scroll 0 0;*/
        background: #222 none repeat scroll 0 0;
        border-bottom-left-radius: 39px;
        border-top-left-radius: 39px;
        /*box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.58);*/
        box-shadow: 0 4px 9px 1px rgba(0, 0, 0, 0.58);
        padding: 7px 22px 7px 5px;
        text-align: center;
        vertical-align: middle;
        border: 2px solid white;
        cursor: pointer;
    }

        img.back-button:hover {
            background: #0d5d77 none repeat scroll 0 0;
            border-color: #5ddee0;
        }

    img#back-button {
        cursor: pointer;
    }

    table#interface-contanier {
        width: 100%;
    }

    a {
        /*color: #00E1FF;*/ /* Cyan */
        color: #0153D6;
        text-decoration: none;
    }

        a:hover {
            /*color: #99FFFD;*/
            text-decoration: underline;
        }

    button {
        cursor: pointer;
        margin-left: 4px;
        margin-right: 4px;
        max-width: 450px;
    }

    section#breadcrumbs a {
        color: #00E1FF; /* Cyan */
        text-decoration: none;
    }

    .full-width {
        width: 100% !important;
    }

    section#breadcrumbs a:hover {
        color: #99FFFD;
    }

    img.remove-item {
        cursor: pointer;
    }

    .help-topic {
        /*border: 2px solid white;*/
        border: 2px solid rgba(255, 255, 255, 0.2);
        display: inline-block;
        padding: 5px;
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 22px;
        border-bottom-right-radius: 22px;
        background: #222;
        margin: 10px;
        box-shadow: 0 4px 9px 1px rgba(0, 0, 0, 0.58);
        text-align: center;
        width: 175px; /* make all buttons equal width*/
        padding-top: 12px;
    }

    .help-icon {
        position: relative;
        z-index: 9999;
    }

    .help-title {
        position: relative;
        z-index: 9999;
    }

    input#password {
        margin-bottom: 10px;
    }

    input#password-confirm {
        margin-top: 10px;
    }

    /*item > cl {
        width: 100%;
    }*/

    cl {
        padding: 5px;
    }

    items > item:hover {
        background: #F2F2F2 none repeat scroll 0 0;
    }

    items > item {
        border: 1px solid #ccc9c9;
        /*display: block;*/
        display: flex;
        margin: 10px;
        padding: 10px;
        text-align: left
    }

    item textarea {
        width: calc(100% - 6px);
        border: 1px solid #C1C1C1;
    }

    kv2 {
        border: 1px solid #C8C8C8;
        display: flex;
        margin-left: 7px;
        margin-right: 7px;
    }


        kv2 k, kv2 v, kv2 > textarea {
            display: block;
            width: 100%;
            padding: 5px;
            text-align: center;
            vertical-align: middle;
        }

        kv2.text {
            background-color: white;
        }

            kv2.text > k {
                text-align: left;
            }

        kv2 > textarea {
            width: -moz-available;
            background: transparent none repeat scroll 0 0;
            border: 0 solid transparent;
            margin: 4px;
            resize: none;
            text-align: left;
        }


        kv2 k {
            background: #D6D6D6 none repeat scroll 0 0;
        }

        kv2 v, kv2 > textarea {
            /*/background: #D6D6D6 none repeat scroll 0 0;*/
            border-left: 1px solid #C8C8C8;
        }


        kv2:not(:first-child) {
            border-top: 0px solid transparent;
        }

    .help-topic:hover::before {
        background-attachment: scroll;
        background-clip: border-box;
        background-color: rgba(100, 249, 247, 0.77);
        background-image: url("//client.ianperks.org/images/animations/waves2.gif");
        background-origin: padding-box;
        background-repeat: repeat;
        background-size: cover;
        border-radius: 23px;
        content: "";
        display: block;
        float: left;
        height: 149px;
        margin-left: 8px;
        opacity: 0.1;
        position: absolute;
        width: 160px;
        z-index: 99999;
    }


    .help-topic:hover {
        background: #0d5d77;
        border-color: #5DDEE0;
        color: #00eaff;
        cursor: pointer;
    }

    .help-topic .help-title {
        text-align: center;
        padding: 3px 5px;
        font-size: 12px;
        text-shadow: 1px 1px 2px rgba(14, 119, 160, 0.74), 1px 1px 1px black;
    }

    /*
    .help-icon {
        width: 100px;
        min-width: 100px;
        max-width: 100px;
        height: 100px;
        min-height: 100px;
        max-height: 100px;
        border: 1px solid #00F2EE;
        border-radius: 13px;
        padding: 1px;
        border-radius: 6px;
        background: #ffffff;
    }
    */
    .help-icon {
        background: #ffffff none repeat scroll 0 0;
        border: 2px solid #3480A9;
        /*border: 1px solid #00f2ee;*/
        border-radius: 6px;
        height: 113px;
        max-height: 101px;
        max-width: 100px;
        min-height: 144px;
        min-width: 144px;
        padding: 1px;
        width: 100px;
    }

    .help-topic:hover .help-icon {
        border: 2px solid #14f3ff
    }

    section {
        max-width: 1000px;
        margin: auto;
    }

    body {
        background-color: #04273D; /*#17364a;*/
        color: white;
        font-family: Roboto,Verdana,Arial;
        text-align: center;
        margin-top: 25px;
    }

    .parallelogram.red {
    }

    .dash-buttons {
        margin-top: 20px;
    }

    .mini-dash-button {
        box-shadow: 0 1px 2px 0 #aeaeae;
        background: linear-gradient(to bottom, #FFFFFF 0%,#D7D6D6 100%);
    }


    /* https://www.viget.com/articles/angled-edges-with-css-masks-and-transforms */

    .quote {
        background: #41ade5;
        position: relative;
        z-index: 1;
    }

        .quote:before, .quote:after {
            background: inherit;
            content: '';
            display: block;
            height: 50%;
            left: 0;
            position: absolute;
            right: 0;
            z-index: -1;
            -webkit-backface-visibility: hidden;
        }

        .quote:before {
            top: 0;
            -webkit-transform: skewY(1.5deg);
            transform: skewY(1.5deg);
            -webkit-transform-origin: 100% 0;
            transform-origin: 100% 0;
        }

        .quote:after {
            bottom: 0;
            -webkit-transform: skewY(-1.5deg);
            transform: skewY(-1.5deg);
            -webkit-transform-origin: 100%;
            transform-origin: 100%;
        }

    .quote {
        color: #fff;
        font-family: 'Fira Sans', sans-serif;
        margin: 50px 0;
        padding: 20% 20px;
        text-align: center;
    }


    .trapezoid {
        border-bottom: 56px solid red;
        border-left: 20px solid transparent;
        border-right: 20px solid transparent;
        display: inline-block;
        height: 0;
        width: 70px;
        position: relative;
        width: 93px;
        background: #233839 none repeat scroll 0 0;
        border-top-right-radius: 28px;
        box-shadow: 0 0 6px 2px #000000;
        text-transform: uppercase;
        overflow: hidden;
    }

        .trapezoid .title {
            position: relative;
            top: 19px;
        }

    .parallelogram {
        /*
    background: #233839 none repeat scroll 0 0;
    display: inline-block;
    height: 100px;
    transform: skew(-15deg);
    width: 150px;
    line-height: 100px;
    margin: 0px;
    vertical-align: middle;
    border: 2px outset #00e1ff;
    overflow: hidden;
    */
        /*
    background: #233839 none repeat scroll 0 0;
    border: 2px outset #00e1ff;
    */
        background: #e8e8e8 none repeat scroll 0 0;
        border: 2px outset #919696;
        display: inline-block;
        /* big */
        /*
    height: 55px;
    line-height: 55px;
    */
        /* medium */
        height: 47px;
        line-height: 48px;
        margin: -4px;
        /*outline: 2px solid #0e0e0e;*/
        overflow: hidden;
        transform: skew(-15deg);
        vertical-align: middle;
        width: 160px;
        box-shadow: 0 0 6px 2px #000000;
        text-transform: uppercase;
        border-top-right-radius: 28px;
        float: left;
    }


        .parallelogram:last-child {
            border-bottom-right-radius: 36px;
        }

        .parallelogram.red {
            background: #4b1e1e none repeat scroll 0 0;
            border: 2px outset #ff0000;
            color: #f17474;
        }


            .parallelogram.red:hover {
                background: #9d0a0a none repeat scroll 0 0;
                color: #f4bbbb;
            }

        .parallelogram:hover {
            background: #c8c8c8 none repeat scroll 0 0;
            color: #3D3D3D;
            /*
    background: #035d5f none repeat scroll 0 0;
    color: #c9f0f1;
    */
        }

    #logo-tagline {
        color: #767676;
    }


    .parallelogram .title { /* tilt the text back to normal alignment */
        display: block;
        transform: skew(15deg);
        pointer-events: none;
    }






    section.content-section#content {
    }

    textarea {
        font-family: Roboto, Verdana, Arial;
    }


    section#about textarea#details {
        width: 80%;
        height: 400px;
        border: 3px solid #777;
        font-family: Roboto, Verdana, Arial;
        padding: 5px;
    }

    #content h2 {
    }

body.taking-screenshot textarea.do-not-capture, body.taking-screenshot input.do-not-capture {
    background: url("https://client.ianperks.org/images/redacted.png") !important;
    background-size: 100px auto !important;
    background-repeat: no-repeat !important;
    background-color: transparent !important;
    background-position: center top !important;
    border: 0px solid transparent !important;
    color: transparent !important;
}

hr.grey {
    border-top: 1px solid #bababa;
    border-bottom: 0px solid transparent;
    border-left: 0px solid transparent;
    border-right: 0px solid transparent;
}

    hr.dots {
        /*border-bottom: 2px dotted rgba(12, 178, 215, 0.67) !important;*/
        border-bottom: 2px dotted #04273d !important;
        border-left: medium none;
        border-right: medium none;
        border-top: medium none;
    }


    kv {
        width: calc(100% - 20px);
        max-width: 450px;
    }

    /*
#email, #address, #tel, #name, textarea#let-property-address {
    width: calc(100% - 26px);
}
*/

    .red-col {
        color: red !important;
        text-decoration: none !important;
    }

    expired {
        display: block;
    }

    active {
        display: none;
    }

    body.session expired {
        display: none !important;
    }

    body.session active {
        display: block !important;
    }

    .blue-button-im.disabled, .blue-button-im.disabled:hover {
        cursor: not-allowed !important !important;
        /*background-color: #0A365B;*/
        background-color: #9f9f9f !important;
        color: #565252 !important;
    }

    .blue-button.disabled, .blue-button.disabled:hover {
        cursor: not-allowed !important;
        /*background-color: #0A365B;*/
        background-color: #9f9f9f !important;
        color: #565252;
    }

    .blue-button-im.disabled:hover {
        /*border: 2px solid rgba(255, 255, 255, 0.2);*/
        /*background-color: #0A365B;*/
        background-color: #9f9f9f !important;
        color: #565252 !important;
    }

    .blue-button.disabled:hover {
        /*border: 2px solid rgba(255, 255, 255, 0.2);*/
        /*background-color: #0A365B;*/
        background-color: #9f9f9f !important;
        color: #565252;
    }

    .circ-mask {
        clip-path: circle(50% at 0 50%);
        -webkit-clip-path: circle(50% at 0 50%);
    }

    .staff-account {
        background: rgba(0, 0, 0, 0) linear-gradient(90deg, #933496 0%, #000000 100%) repeat scroll 0 0 !important;
    }

    body.editing-page .staff-account {
        background: #2B1313 url("https://client.ianperks.org/images/animations/ZebraBottomLeftToTopRight.gif") repeat scroll 0 0 !important;
    }

    button.red-btn {
        background: #A40606;
    }

    button.green-btn {
        background: #296A29;
    }

    body.editing-page #cke_editor1 {
        /*left: unset !important;*/
        /*right: unset !important;*/
        /*width: 80% !important;*/
        width: 750px;
        min-width: 750px;
        max-width: 750px;
        /*margin-left: 10% !important;*/
        margin: auto;
        /*
    width: 43% !important;
    margin-left: 29% !important;
        */
        /*opacity: 0.9;*/
    }

        body.editing-page #cke_editor1:hover {
            /*opacity: 1;*/
        }

    .cke_float .cke_top {
        background: #DDDDDD;
    }

    #cke_editor1:hover .cke_top {
        background: transparent !important;
    }
    /*
@media only screen and (max-width: 500px) {

    body.editing-page #cke_editor1 {
        left: unset !important;
        right: unset !important;
    
        width: 80% !important;
        margin-left: 10% !important;
    
    
    }

}
    */
    .show-when-editing {
        display: none;
    }

    .show-when-not-editing {
        display: none;
    }

    body.editing-page .show-when-editing {
        display: inline-block !important;
    }

    body:not(.editing-page) .show-when-not-editing {
        display: inline-block !important;
    }

    button {
        background: #217ed5 none repeat scroll 0 0;
        border: 0 solid transparent;
        border-radius: 25px;
        color: white;
    }

        button:hover {
            background: #888888;
        }

    body.editing-page section#editor1 {
        border: 1px dashed red;
        min-height: 50px;
        min-width: 50px;
    }


    .blue-button {
        /*background: #193451 none repeat scroll 0 0;*/
        background: #217ED5;
        /*border: 2px solid rgba(255, 255, 255, 0.2);*/
        border: 0px;
        border-radius: 22px;
        /*box-shadow: 0 4px 9px 1px rgba(10, 10, 10, 0.58);*/
        /*box-shadow: 0 4px 9px -2px rgba(10, 10, 10, 0.58);*/
        color: white;
        display: inline-block;
        font-size: 16px;
        margin: 10px;
        padding: 1px 5px 5px;
        text-align: center;
        width: 225px;
    }

    /* allow our template menu to overflow (display outside the bounds of its container) the ckeditor */
    .cke_top {
        overflow: visible !important;
        min-height: 98px !important;
    }



    section#editor1 p {
        color: #3D3D3D;
    }

    .temp-picker {
        min-width: 50px;
        background-color: #33393D !important;
        cursor: pointer !important;
        text-align: center !important;
        justify-content: center !important;
        padding: 15px !important;
        border: 3px groove sienna;
    }

        .temp-picker h4 {
            font-family: Arial !important;
            font-size: 16px !important;
            color: white !important;
            margin-top: 10px;
            text-align: center !important;
        }




        .temp-picker:hover {
            background-color: #9f9f9f !important;
        }

    .blue-button-im {
        /*background: #193451 none repeat scroll 0 0;*/
        background: #217ED5 !important;
        /*border: 2px solid rgba(255, 255, 255, 0.2);*/
        border: 0px !important;
        border-radius: 22px !important;
        /*box-shadow: 0 4px 9px 1px rgba(10, 10, 10, 0.58);*/
        /*box-shadow: 0 4px 9px -2px rgba(10, 10, 10, 0.58);*/
        color: white !important;
        display: inline-block !important;
        font-size: 16px !important;
        margin: 10px !important;
        padding: 1px 5px 5px !important;
        text-align: center !important;
        width: 225px !important;
        text-decoration: none !important;
    }


    .blue-button:not(.disabled):hover {
        /*background: #0d5d77 none repeat scroll 0 0;*/
        /* background: #888888;*/
        background-color: #329dd6;
        /*border-color: #5ddee0;*/
        /*color: #00eaff;*/
        cursor: pointer;
    }


    .blue-button-im:not(.disabled):hover {
        /*background: #0d5d77 none repeat scroll 0 0;*/
        /* background: #888888;*/
        background-color: #329dd6 !important;
        /*border-color: #5ddee0;*/
        /*color: #00eaff;*/
        cursor: pointer !important;
    }



    .red-button.disabled, .red-button.disabled:hover {
        cursor: not-allowed !important;
        background-color: #c8c8c8;
        /*background-color: #0A365B;*/
        /*color: #565252;*/
        /*display: none;*/
    }

    /*
        .red-button.disabled:hover {
            border: 2px solid rgba(255, 255, 255, 0.2);
            background-color: #0A365B;
            color: #565252;
        }
    */


    .red-button {
        background: #511919 none repeat scroll 0 0;
        border: 2px solid rgba(255, 255, 255, 0.2);
        border-radius: 22px;
        box-shadow: 0 4px 9px 1px rgba(10, 10, 10, 0.58);
        color: #EE0B0B;
        display: inline-block;
        font-size: 18px;
        margin: 10px;
        padding: 1px 5px 5px;
        text-align: center;
        width: 225px;
    }


        .red-button:hover {
            background: #B00909 none repeat scroll 0 0;
            border-color: #F47373;
            color: white;
            cursor: pointer;
        }

    .px400 {
        /*max-width: 400px !important;*/
        /* iPhone settings 
        Do not go above 250px for iphone vertical display 
        
        max-width: 250px !important;  
        width: 330px;
    */
        max-width: 350px;
        width: 350px;
        font-size: 18px;
        padding: 8px;
        text-align: center;
    }

    .generic-txt-title {
        color: #7B7B7B;
        display: block;
        pointer-events: none;
        position: absolute;
        text-align: center;
        top: 9px;
        width: 100%;
    }

    .generic-txt-wrapper {
        position: relative;
    }

        .generic-txt-wrapper.has-text .generic-txt-title {
            display: none;
        }



    a.modal-link, modal-link {
        background: #C6E9F9 none repeat scroll 0 0;
        border: 1px solid #00d1ff;
        margin-left: 2px;
        margin-right: 2px;
        padding: 4px;
        text-decoration: none !important;
        color: black !important;
        cursor: pointer;
    }

    .is-desktop a.modal-link:hover, .is-desktop modal-link {
        background: #d4f5f8;
    }


    modal.active {
        position: absolute;
        left: 50%;
        z-index: 500000;
    }

        modal.active window {
            position: relative;
            right: 50%;
            background: #ddd;
            border-radius: 32px;
        }

    /* display the greyed out modal layer below the modal window, but above all other page elements */
    .ui-front {
        z-index: 99999 !important;
    }

    modal.active window > title {
        /*   bor*/
    }


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

        .ui-dialog {
            width: calc(100% - 6px) !important;
            left: 0px !important;
            max-width: calc(100% - 2px) !important;
            border-radius: 0px !important;
            border: 0px solid transparent !important;
            margin: 0px !important;
            border-radius: 25px !important;
            /*
        margin-left:3px !important;
        margin-right: 3px !important;
        
        */
        }

            /* Make the close button easier to hit on mobile devices */
            .ui-dialog close {
                transform: scale(1.5);
            }
    }

    .hide-modal-toolbar .ui-dialog-titlebar {
        display: none;
    }

    .ui-widget-overlay {
        opacity: 1;
        background: rgba(33, 35, 35, 0.56) none repeat scroll 0 0;
    }

    modal window header {
        display: block;
        margin-bottom: 8px;
        padding-bottom: 24px;
        border-bottom: 1px solid #AEAEAE;
        padding-top: 17px;
    }

    modal.ui-dialog.ui-dialog-content {
        padding: 0px;
    }

    modal {
        font-family: "Roboto","Arial","Helvetica","Palatino Linotype","Book Antiqua","Palatino","serif";
        color: #666;
    }

        modal h1, modal h2, modal h3, modal h4, modal h5 {
            color: #666;
        }

    .ui-dialog {
        z-index: 99999;
    }

    modal p {
        color: #666;
    }

    modal header {
        color: #666;
        font-size: 17px;
        text-align: left;
        position: relative;
        top: -10px;
        margin-bottom: -10px;
        padding-left: 30px;
        padding-right: 30px;
    }

    div.ui-dialog {
        border-radius: 20px;
    }

    modal ul, modal ol, modal li, modal b {
        color: #666;
    }

    modal content {
        display: block;
        text-align: justify;
        padding-left: 30px;
        padding-right: 30px;
        padding-bottom: 5px;
    }

    modal h3 {
        font-size: 14px;
        font-weight: normal !important;
    }


    .ui-dialog {
        max-width: 1000px;
    }

    modal header close {
        background: rgba(0, 0, 0, 0) url("https://client.ianperks.org/images/WhiteCrossAlt16px.png") repeat scroll 0 0;
        display: block;
        float: right;
        right: 10px;
        width: 16px;
        height: 16px;
        margin-top: 3px;
        opacity: 0.7;
        cursor: pointer;
    }


        modal header close:hover {
            /*filter:invert(100%);*/
            background: rgba(0, 0, 0, 0) url("https://client.ianperks.org/images/RedCrossAlt16px.png") repeat scroll 0 0;
            /* filter: hue-rotate(200deg);  change red to blue */
        }



    modal > window > header, modal > window > header * {
        text-transform: uppercase;
    }
    /* style 2 */
    modal > window > header {
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
        background: #217ed5;
        top: 24px !important;
        margin-bottom: 0px !important;
        color: white !important;
    }

    modal > window > content {
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 20px;
        border-bottom-right-radius: 20px;
        background: #e8e8e8;
        margin-top: 0px;
        min-height: 100px;
    }

    .ui-widget-content {
        border: 0px solid transparent !important;
        background: transparent !important;
        padding: 0px !important;
    }



    modal > window > content {
        padding-top: 20px;
        position: relative;
        top: -20px;
        padding-left: 25px;
        padding-right: 25px;
        padding-bottom: 25px;
    }

    modal content {
        position: relative;
        top: 24px !important;
    }

    money {
        /*color: #005E82;*/
    }

    .half-break {
        margin-bottom: 10px !important;
    }

    modal ul, modal ol {
        padding: 0 0 0 15px;
    }

    .from-square-space {
        /* max-width: 550px; */
    }

    #pre-submit.submitted {
        background: transparent none repeat scroll 0 0;
        border: 1px solid black;
        color: black;
    }

    section.submitted footer, section.submitted header {
        border-radius: 0px !important;
    }


    table.text-top-left tr td {
        text-align: left;
        vertical-align: top;
    }

    .from-square-space .blue-button {
        color: white;
    }

    .from-square-space .form-item {
        display: flex;
        flex-direction: column;
        text-align: left;
        margin-bottom: 17px;
    }

    .hide {
        display: none !important;
    }

    span.required {
        color: red;
    }


    .submitting, .submitting:hover {
        background-color: #9f9f9f !important;
        color: #565252;
        cursor: not-allowed !important;
    }

    info {
        width: 230px;
        text-align: left !important;
        /*border: 1px solid red;*/
        display: block;
    }

    .permission-item {
        margin-bottom: 10px;
        background: #cfcfcf none repeat scroll 0 0;
        border: 1px solid #676767;
        /*padding-top: 10px;*/
    }

        .permission-item header {
            background: rgba(179, 179, 179, 0.31);
            padding-top: 10px;
        }



        .permission-item[status="rejected"] {
            background: rgba(255, 58, 58, 0.23) !important; /*red*/
        }

        .permission-item[status="authorised"], .permission-item[status="approved"], .permission-item[status="accepted"] {
            background: rgba(85, 221, 33, 0.23) !important; /*green*/
        }



        .permission-item header h3 {
            margin: 0;
        }

        .permission-item header {
            border-bottom: 1px solid #B3B3B3;
            margin-bottom: 5px;
            padding-bottom: 5px;
        }


    .from-square-space * {
        color: #585757;
    }

    .from-square-space .description {
        /*color: #999999;*/
        /*color: #3C758F !important;*/
        color: #08232F !important;
        font-size: 11px;
    }

    .from-square-space .title {
        color: #145370 !important;
        font-size: 14px;
    }

    section#editor1 a.external-link {
        /* white-space: nowrap; */
    }

    landlord, tenant {
        display: none; /* hide by default */
    }


    body.no-landlords kv2.landlord-group,
    body.no-landlords kv2.sub-landlord {
        display: none !important;
    }


    body.all-landlords kv2.sub-landlord landlord {
        display: block;
    }

    body.primary-landlords kv2.sub-landlord landlord[primary="1"] {
        display: block;
    }

    body.primary-landlords kv2.sub-landlord landlord:not([primary="1"]) {
        display: none;
    }


    body.no-tenants kv2.tenant {
        display: none !important;
    }

    /* if no tenants or landlords are selected as 
    recipents then prevent mail shot from displaying
    any results
*/

    body.no-tenants.no-landlords isa,
    body.no-tenants.no-landlords isd,
    body.no-tenants.no-landlords ist {
        display: none !important;
    }

    body.all-tenants kv2.tenant tenant {
        display: block;
    }

    body.primary-tenants kv2.tenant tenant[primary="1"] {
        display: block;
    }

    body.primary-tenants kv2.tenant tenant:not([primary="1"]) {
        display: none;
    }


    isa, isd, ist {
        display: none;
    }

    body.isa isa, body.isd isd, body.ist ist {
        display: block;
    }

    img.managed, img.managed-plus, img.let-only {
        display: none;
    }

    /*
body.managed img.managed, body.let-only img.let-only {
    display: block;
}
*/

    tr[terms="{}"] > td > img.managed, tr[terms="{}"] > td > img.managed-plus {
        display: none;
    }

    tr[terms="{}"] > td > img.let-only {
        display: block;
    }


    tr[terms="{}"], tr[terms="1"], tr[terms="2"] {
        display: none;
    }

    /* show let-only properties when selected */
    body.let-only tr[terms="{}"] {
        display: table-row;
    }

    /* show all management and management plus properties */
    body.managed tr[terms="1"], body.managed tr[terms="2"] {
        display: table-row;
    }


    error {
        display: none;
    }


    /* 1=managed, 1=management plus */
    tr[terms="1"] > td > img.managed, tr[terms="1"] > td > img.managed {
        display: block;
    }

    tr[terms="2"] > td > img.managed-plus, tr[terms="2"] > td > img.managed-plus {
        display: block;
    }

    tr[terms="1"] > td > img.let-only, tr[terms="1"] > td > img.let-only,
    tr[terms="2"] > td > img.let-only, tr[terms="2"] > td > img.let-only {
        display: none;
    }

    section#editor1 a.external-link::before {
        background: rgba(0, 0, 0, 0) url("https://client.ianperks.org/icons/link-1.png") repeat scroll 0 0;
        content: "";
        display: inline-block;
        height: 16px;
        vertical-align: sub;
        width: 16px;
        margin-right: 3px;
    }

    filters table {
        margin: auto;
    }

        filters table tr td {
            vertical-align: top;
        }

    .opt-cont {
        margin: 3px;
        width: 224px;
    }

    filters {
        display: block;
    }


    kv2.sub-landlord > k, kv2.tenant > k {
        padding-top: 0px;
    }

    kv2[primary="1"] k {
        background: #F0F1DB; /* light yellow */
    }

    .shot-list kv2 > v {
        font-size: 11px;
    }

    .tenant[primary="1"] > k > icon, .sub-landlord > k > icon, landlord > icon, tenant > icon {
        background-image: url("https://client.ianperks.org/images/primary-star.png");
        background-repeat: no-repeat;
        background-size: contain;
        content: " ";
        display: inline-block;
        height: 16px;
        margin-right: 3px;
        vertical-align: text-bottom;
        width: 16px;
    }

    .tenant > k, .sub-landlord > k {
        white-space: nowrap;
    }

        .tenant > k > icon, .sub-landlord > k > icon,
        landlord > icon, tenant > icon {
            visibility: hidden;
        }

    .tenant[primary="1"] > k > icon, .sub-landlord[primary="1"] > k > icon,
    landlord[primary="1"] > icon, tenant[primary="1"] > icon {
        visibility: visible !important;
    }


    .opt-cont .hist-btn {
        margin-left: 2px !important;
        margin-right: 2px !important;
        margin-top: 0px !important;
        margin-bottom: 3px !important;
        cursor: pointer;
        max-height: 10px !important;
        height: 10px !important;
        display: block !important;
        padding: 0px !important;
        min-height: 22px !important;
    }

    table.shot-list kv2 > k {
        text-align: right !important;
    }


    table.shot-list tbody tr:nth-child(odd) {
        background: #e0e0e0 none repeat scroll 0 0;
    }

    table.shot-list tr td {
        border-bottom: 1px solid #888888;
    }

    tab {
        display: block;
        margin-left: 30px;
    }

        tab[amount="1"] {
            margin-left: 30px;
        }

        tab[amount="2"] {
            margin-left: 60px;
        }

        tab[amount="3"] {
            margin-left: 90px;
        }

        tab[amount="4"] {
            margin-left: 120px;
        }

        tab[amount="5"] {
            margin-left: 180px;
        }

        tab[amount="6"] {
            margin-left: 240px;
        }

        tab[amount="7"] {
            margin-left: 300px;
        }

    red {
        color: red;
    }

    grey {
        color: #444;
    }

    purple {
        color: purple;
    }

    kv2.landlord-group, kv2.sub-landlord, kv2.tenant {
        border-right: 0px solid transparent;
        width: calc(100% - 7px);
    }

        kv2.sub-landlord > v, kv2.tenant > v {
            padding: 0px;
            padding-bottom: 2px;
            vertical-align: top;
        }

        kv2.sub-landlord > v, kv2.tenant > v {
            padding-left: 1px;
        }


    landlord {
        display: block;
    }

    tenant {
        display: block;
    }

    email {
        /*display: inline-block;*/
        display: -moz-box;
        /*display: -webkit-box;*/
        overflow: hidden;
        /*white-space: nowrap;*/
        white-space: normal;
        vertical-align: bottom;
        width: 17px;
        height: 21px;
        transition: all 1s ease 0s;
        max-width: 300px;
    }

        email:hover {
            -webkit-transition: all 1s;
            transition: all 1s ease 0s;
            max-width: 300px;
            width: 60% !important;
            text-overflow: ellipsis;
            /*background: #d3d7d7 none repeat scroll 0 0;*/
        }

    div.show-contacts {
        background: #DDD !important;
        white-space: pre;
        text-shadow: 0px 0px 1px #08CEF1;
    }

    email > icon {
        background-image: url('https://client.ianperks.org/images/email-icon.png');
        background-size: contain;
        content: " ";
        display: inline-block;
        height: 16px;
        margin-right: 3px;
        vertical-align: middle;
        width: 16px;
        background-repeat: no-repeat;
    }

    email.posting > icon {
        background-image: url("https://client.ianperks.org/images/animations/ZebraBottomLeftToTopRight.gif") !important;
        border-radius: 70px;
    }

    /* if the email has been posted then change the icon */
    email.posted > icon {
        background-image: url("https://client.ianperks.org/images/yes-check.png") !important;
    }

    email.failed > icon {
        background-image: url("https://client.ianperks.org/images/error.png") !important;
    }

    email[block="block"] > icon {
        background-image: url('https://client.ianperks.org/images/cross.png') !important;
    }

    /*email > a {
        overflow: hidden;
        width:10px;
    }*/



    a.email {
        cursor: pointer;
    }

        a.email:empty {
            display: none;
        }

    .email::before {
        background-image: url('https://client.ianperks.org/images/email-icon.png');
        background-size: contain;
        content: " ";
        display: inline-block;
        height: 16px;
        margin-right: 3px;
        vertical-align: middle;
        width: 16px;
    }

    a.external-link, a.external, a.email {
        color: #2476cd !important;
        text-decoration: none !important;
        font-weight: bold;
    }

    .is-desktop a.external-link:hover, .is-desktop a.external:hover, .is-desktop a.email:hover {
        color: #42663F !important;
    }


    body.editing-page div.ui-widget-content {
        background: rgb(27, 27, 27) !important; /*very dark grey */
        color: white !important;
    }

        body.editing-page div.ui-widget-content textarea {
            width: 100% !important;
            padding: 5px !important;
            color: white !important;
            margin: 5px !important;
        }


    body div.padding {
        padding-left: 40px;
        padding-right: 40px;
    }

    body.editing-page div.padding {
        border: 1px dashed red; /* show padding region on the page */
    }


    body.editing-page pageicon, body.editing-page pagetitle, body.editing-page pagetags {
        border: 1px dashed red;
        cursor: pointer;
        display: block;
        margin: 10px;
        padding: 10px;
    }

        body.editing-page pageicon:hover, body.editing-page pagetitle:hover, body.editing-page pagetags:hover {
            background: rgba(133, 192, 200, 0.43);
        }


    body:not(.editing-page) pagetags {
        display: none;
    }

    body.editing-page pagetags {
        display: block;
    }

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

    div.title > i {
        color: #666;
        font-size: 16px;
        font-style: normal !important;
    }

    body.editing-page pageicon::before {
        content: 'ICON: ';
        color: #4FF15D;
        position: absolute;
        float: left;
        display: block;
    }



    body.editing-page pagetags {
        font-size: 12px;
        word-spacing: 10px;
        text-align: right;
    }


    body.editing-page pagetitle::before {
        content: 'TITLE: ';
        color: #4FF15D;
        float: left;
    }



    body.editing-page pagetags::before {
        content: 'TAGS: ';
        color: #4FF15D;
        float: left;
    }



    section#editor1 h1 {
        line-height: 40px;
    }

    .all-black-bg:hover, .all-black-bg:hover * {
        background-color: black !important;
    }

    .red-info {
        color: #B74646 !important;
    }