.clear {
    clear: both;
}

body {
    background-color: #f1f1f1;
    background-color: whitesmoke;
    margin: 0;
    height: 100%;
    min-height: 100%;
    font-family: "Segoe UI","Helvetica Neue","Helvetica","Arial","sans-serif";
    font-size: 1.4rem;
    /*line-height: 2.0rem;*/
}

label {
    font-weight: normal; /*Override bootstrap default*/
}

/* Polymer like flexbox layout names */
.flex {
    -ms-flex: 1 1 0.000000001px;
    -webkit-flex: 1;
    flex: 1;
    -webkit-flex-basis: 0.000000001px;
    flex-basis: 0.000000001px;
}

.layout {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

    .layout.horizontal, .layout.vertical {
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
    }

    .layout.horizontal {
        -ms-flex-direction: row;
        -webkit-flex-direction: row;
        flex-direction: row;
    }

    .layout.vertical {
        -ms-flex-direction: column;
        -webkit-flex-direction: column;
        flex-direction: column;
    }

    .layout.wrap {
        -ms-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .layout.flexoverflowscroll {
        overflow: auto;
        height: auto;
        -webkit-overflow-scrolling: touch;
        -ms-overflow-style: none;
    }

    .layout.justifyend {
        justify-content: flex-end;
    }

    .layout.justifycenter {
        justify-content: center;
    }

.flex.none {
    -ms-flex: 0 0;
    -webkit-flex: 0 0;
    flex: 0 0;
}

.flex.one {
    -ms-flex: 1;
    -webkit-flex: 1;
    flex: 1;
}

.flex.two {
    -ms-flex: 2;
    -webkit-flex: 2;
    flex: 2;
}

.flex.three {
    -ms-flex: 3;
    -webkit-flex: 3;
    flex: 3;
}

.flex.four {
    -ms-flex: 4;
    -webkit-flex: 4;
    flex: 4;
}

.flex.five {
    -ms-flex: 5;
    -webkit-flex: 5;
    flex: 5;
}

.flexcenter {
    align-self: center;
}

.flexend {
    align-self: flex-end;
}

.flexitemaligncenter {
    align-items: center;
}

.flexitemalignstretch {
    align-items: stretch;
}

.applayoutcontainer {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    height: 100vh;
    -webkit-box-orient: horizontal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    /*min-width: 830px;*/ /*TODO: We don't want our meny to wrap Remove when we redesign small menu*/
}

    .applayoutcontainer #topnav, .applayoutcontainer #footer {
        -webkit-flex: 0 0 auto;
        -moz-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        flex-shrink: 0;
    }

    .applayoutcontainer .applayoutbody {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex: 1 0 auto;
        -moz-flex: 1 0 auto;
        -ms-flex: 1 0 auto;
        flex: 1 0 auto;
        -ms-flex-direction: row;
        -webkit-flex-direction: row;
        flex-direction: row;
        /*overflow-y: scroll;*/
        height: calc(100vh - 90px); /*header 45 + footer 45 */
    }

    .applayoutcontainer .applayoutheader {
        height: 45px;
    }

    .applayoutcontainer .applayoutfooter {
        height: 45px;
    }

.sidebar {
    -webkit-flex: 0 0 150px;
    -moz-flex: 0 0 150px;
    -ms-flex: 0 0 150px;
    flex: 0 0 150px;
    overflow: auto;
}

    .sidebar ::-webkit-scrollbar {
        visibility: collapse;
    }

.maincontent {
    -webkit-flex: 1;
    -moz-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    height: 100%;
}

#masthead {
}

#topnav {
    /*background-color: #1e5078;*/
    /*background-color: #d6e8ff;*/
    /*background-color: #39497a;*/ /*Dark blue*/
    /*color: #d6e8ff; /*Whiteish color*/ */ width: 100%;
    height: 45px;
    max-height: 45px;
}

.applicationbanner {
    height: 45px;
    max-height: 45px;
}

.topnavpagetitle {
    /*height: 23px;
    max-height: 23px;*/
    max-width: 1200px;
    /*margin-left: auto;
    margin-right: auto;*/
}

#topnavmenuicon {
    padding: 8px 35px 8px 10px;
}

#topnavlogo {    
    width: 100%;
    height: 39px;
    background-image: url(/images/Logo41.png);
    background-repeat: no-repeat;
    background-position: center center;    
}

/*@media (max-device-width : 480px) {
    #topnavlogo {
        display: none;
    }
}*/

#topnavmenu {
    width: 100%;
    height: 100%;
    margin: 0px;
}

#topnavuser {
    text-align: right;
    font-size: 16px;
    padding-top: 0px;
    padding-right: 5px;
    margin: 0px;
    height: 22px;
    line-height: 22px;
}



#topnavapplicationname {
    font-size: 2.5rem;
    color: #f49300;
    line-height: 45px;
    padding-left: 40px;
}

.topnavuserfirm, .topnavusername {
    color: #C7C7C7;
}

    .topnavuserfirm a, .topnavuserfirm a:visited, .topnavuserfirm a:hover {
        text-decoration: none;
        color: #C7C7C7;
    }

#topnavuserfirm {
    font-size: 1.3rem;
}

.topnavuserloginstatus {
    color: #d6e8ff;
    font-size: 16px;
}

.topnavavatar {
    height: 45px;
    width: 45px;
    margin-left: 5px;
    position: relative;
    overflow: hidden;
}

    .topnavavatar i {
        margin: 0 3px 0 3px;
        color: yellow;
    }

#topnavmenucontainer {
    margin: 0px;
    /*height: 22px;*/
    vertical-align: middle;
    padding-left: 0px;
    padding-top: 0px;
    color: #000000;
    /*background-color: #1e5078;
    background-repeat: repeat-x;
    background-position: left top;*/
    /*border-top: solid thin #39497a;*/ /*border-left: solid thin black;*/
}

#topnav i {
    font-size: 15px;
    color: white;
    padding: 3px;
}

/* TAB MENU
----------------------------------------------------------*/

div.hideSkiplink {
    background-color: #d6e8ff;
    width: 100%;
}

div.menu {
    padding: 0px 0px 0px 0px;
    font-size: 1em;
    min-width: 800px;
}

    div.menu ul {
        z-index: 90001;
        list-style: none;
        margin: 0px;
        padding: 0px;
        width: auto;
    }

        div.menu ul li.dynamic {
            border-top: 1px solid #6b727c;
            border-bottom: 1px solid #575f6a;
        }

        div.menu ul li a, div.menu ul li a:visited {
            color: white;
            display: block;
            line-height: 1.25em;
            padding: 3px 10px;
            text-decoration: none;
            white-space: nowrap;
            border: none;
            font-size: 1.1em;
        }

        div.menu ul li.dynamic a, div.menu ul li.dynamic a:visited {
            /*background-color: #e2f0ff;*/
            background-color: #5f6975;
            padding: 5px 10px 5px;
        }

        div.menu ul li.has-popup {
            /*background-image: url(/images/submenu.gif);    */
            background-position: right center;
            background-repeat: no-repeat;
            padding-right: 3px;
        }

        div.menu ul li.dynamic.has-popup {
            background-image: url(/images/submenu.gif);
            /*background-color: #e2f0ff;*/
            background-color: #5f6975;
            padding-right: 10px;
        }

        div.menu ul li a:hover {
            background-color: #777777;
            /*color: #465c71;*/
            text-decoration: none;
        }

        div.menu ul li a:active {
            background-color: #465c71;
            /*color: #cfdbe6;*/
            text-decoration: none;
        }

.fullwidth {
    width: 100%;
}

.normalwidth {
    width: auto;
}


#bodycontainer {
    /*height: 100%;*/
    border-top: 1px solid gray;
    border-bottom: 1px solid gray;
    margin-top: 45px;
}

#bodycontent {
    margin-left: 0;
}

@media (min-width: 767px) {
    #bodycontent {
        /*margin-left: 5px;*/
    }

    #maincontenttitlecontainer {
        margin-left: 5px;
    }
}

#maincontent {
    width: 100%;
    /*height: 100%;*/
    background-color: inherit;
}

.scrollcontainer {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.modalpagescrollcontainer {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    -ms-flex: 1 1 0.000000001px;
    -webkit-flex: 1;
    flex: 1;
}

#sidebarmenu {

}

.sidebarmenumobile {
    width: 100vw;
    min-width: 100vw;
}

@media (max-width: 767px) {
    .modalpage .modalpagescrollcontainer {
        overflow: auto;
        /*max-height: calc(100vh - 45px);*/
        flex: 1;
    } 
}

/*@media (max-width: 768px) {
    .modalpage #sidebarmenu {
        display: none;
    }
}*/

@media print {
    .scrollcontainer {
        overflow: visible;
    }

    .maincontent {
        height: 100%;
    }
}

#maintoolbar {
    background-image: url(/Images/app_titlebar.gif);
    background-repeat: repeat-x;
    background-position: left top;
    height: 26px;
    padding: 0px 10px 0px 10px;
    margin: 0px 0px 0px 0px;
    vertical-align: middle;
    overflow: hidden;
    color: #15428b;
    font-size: 14px;
    font-weight: bold;
}

#leftsidebar {
    width: 160px;
    background-color: inherit;
    color: #333;
    border: 0px solid gray;
    border-right: #d6e8ff 1px solid;
}

#leftsidebarcontainer {
    width: 150px;
    overflow: hidden;
}

    #leftsidebarcontainer .search input,
    #leftsidebarcontainer .search select {
        max-width: 145px;
    }

    #leftsidebarcontainer .searchcontainer input,
    #leftsidebarcontainer .searchcontainer select {
        max-width: 145px;
    }

.searchcontainer {
    padding-left: 4px;
    padding-right: 4px;
}

    .searchcontainer input,
    .searchcontainer select {
        max-width: 145px;
    }

    .searchcontainer label {
        font-weight: normal;
    }

/* Old footer uses ID */
#footer {
    width: 100%;
    /*margin-top: 3px;*/
    background-color: #dee0e0;
    font-size: 0.7em;
}

    #footer #divfootersysinfo {
        margin-top: 50px;
        font-size: 9px;
        color: grey;
    }

.footer {
    width: 100%;
    margin-top: 3px;
    background-color: #dee0e0;
    font-size: 0.7em;
}

    .footer #divfootersysinfo {
        font-size: 9px;
        color: grey;
    }

.titlebar {
    position: relative;
    /*background-color: #CECECE;
    background-repeat: repeat-x;
    background-position: left top;*/
    /*min-height: 70px;*/
    min-width: 320px; /*Iphone 4*/
    height: 100%;
    /*height: 106px;*/
    line-height: 23px;
    padding: 0;
    margin: 0 0 0 0;
    overflow: hidden;
    white-space: nowrap;
    color: white;
    font-size: 25px;
    font-weight: normal;
    /*Ensures we get a nice image header*/
    max-height: 180px;
    /*height: calc(100vw / 2.5);*/
}

    .titlebar img {
        /*width: 100%;*/
        margin-left: auto;
        margin-right: auto;
        max-height: 200px;
        max-width: 100%;
    }

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

@media (max-width: 767px) {
    .titlebar img {
        max-height: 100px;
    }
}

.titlebarcontent {
    height: 100%;
}

.titlebarheaderimagetext {
    position: absolute;
    bottom: 8px;
    left: 15px;
    background-color: rgba(120, 120, 120, 0.6);
    border-radius: 3px;
    padding: 3px 5px;
}

    .titlebarheaderimagetext.noheroimage {
        background-color: transparent;
        color: black;
        top: 35px;
    }

@media (max-width: 767px) {
    .titlebarheaderimagetext {
        bottom: 4px;
        left: 4px;
        background-color: rgba(120, 120, 120, 0.6);
        padding: 0 5px;
        font-size: 12px;
    }
}

.titlebar i {
    margin: 5px 10px;
    font-size: 35px;
}

.modalpage .titlebar a {
    color: white;
    text-decoration: none;
    border-radius: 0;
    padding: 0;
    width: 100%;
}

.modalpage #divtopnavpagetitle {
    height: 45px;
    width: 100%;
    z-index: 1;
    /*margin-top: -45px;*/
    background-color: #64320e;
}

.modalpage .topnavpagetitle {
    max-height: 45px;
    max-width: none;
}

.modalpage .titlebar {
    height: 45px;
    line-height: 45px;
    /*width: 100vw;*/
    min-height: initial;
    min-width: initial;
    /*background-color: black;*/
}

@media (max-width: 768) {
    .modalpage .titlebar {
        /* Make it stick to top on mobile*/
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        background-color: #64320e;
    }
}

.modalpage .titlebarcontent {
    /* Make it stick to top*/
    position: relative;
}

@media (min-width: 1000px) {
    .modalpage #divtopnavpagetitle {
        margin-top: 0;
        background-color: black;
    }
}

@media (max-width: 1000px) {
    .modalpage #topnav {
        display: none;
    }
}

.sectiontitlebar {
    height: 28px;
    line-height: 28px;
    padding: 0 3px 0 3px;
    margin: 0 0 0 0;
    overflow: hidden;
    white-space: nowrap;
    color: #15428b;
    font-size: 14px;
    font-weight: bold;
    /*background-image: linear-gradient(to bottom right, #f1f1f1 40%, #4C545E 100%);*/
}

    .sectiontitlebar > a {
        color: #15428b;
        text-decoration: none;
    }

.contentframe {
    margin: 0px;
    padding: 5px;
    /*border-top: solid 1px #39497a;*/
    background-color: #d6e8ff;
}

.maintoolbar {
    background-color: Silver;
}

.contenttoolbar {
    /*background-image: url(/styreweb/images/gridtoolbar_back.gif);*/
    background-repeat: repeat-x;
    background-position: left top;
    padding: 0px 10px 0px 10px;
    margin: 0px 0px 0px 0px;
    height: 28px;
    border-bottom: solid 1px #39497a;
}

.quickhelp {
    margin: 0px;
    padding: 5px;
    background-color: White;
}

.videolink {
    margin: 0px;
    padding: 5px;
    background-color: White;
}

    .videolink ul {
        list-style: none;
        line-height: 2.1em;
        padding: 0px;
        margin: 0px;
    }

/* Section header formatting */
.subsectionheader {
}

.subsectionheadertitlespacer {
    height: 10px;
}

.subsectionheadertitle {
}

.subsectionheadertitletextleft {
    text-align: left;
    font-size: 10pt;
    color: #000000;
    text-decoration: none;
    padding-left: 5px;
    width: 100%;
}

.subsectionheadertitletextright {
    text-align: right;
    font-size: 10pt;
    color: #000000;
    text-decoration: none;
}

.subsectionheaderline {
    background-color: #a4bed9;
    height: 1px;
}

.dock-control /*The content control */ {
    border: 1px solid rgb(224, 224, 224);
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 20px;
    margin-left: 5px;
    -ms-flex: 0 0 auto;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    margin-right: 5px;
}

    .dock-control.main {
        overflow: visible;
        border: none;
    }

.dock-contentarea /*Area that we have content in */ {
    height: 100%;
    /*border-style: solid;
    border-width: 1px;
    border-color: #a4bed9;
    border-radius: 2px;*/
}

.dock-contentcontainer {
    border-style: none;
    border-width: 1px;
    border-color: #a4bed9;
    border-radius: 2px;
}

.dock-titlebar /*Our title area box*/ {
    font-size: 14px;
    font-weight: bold;
    /*font-style: italic;*/
    /*padding-top: 3px;
    padding-bottom: 3px;
    padding-left:1px;*/
    background-color: #ECF4FF;
    /*
    background-color: Lavender;
    border-style: solid;
    border-width: 1px;
    border-color: Gray;
*/
}

.detailederrorpanel {
    border-top: 2px solid red;
    border-left: 2px solid red;
}

    .detailederrorpanel .stacktrace {
        font-size: 10px;
        font-family: 'Courier New';
    }

.administratorpanel {
    border-left: 2px solid #fb00e7;
}

.supportpanel {
    border-left: 2px solid red;
}

.administratorbutton {
    box-shadow: 0 5px 2px -2px #fb00e7 !important;
}

.supportbutton {
    box-shadow: 0 5px 2px -2px red !important;
}

.dock-fixed-content /*our fixed title formatting */ {
    width: 100%;
    overflow: hidden;
}

.dock-toolbar-left /* left side container for toolbar that have right aligned toolbar content too*/ {
    display: inline-block;
}

.dock-toolbar-right {
    display: inline-block;
    flex-grow: 1;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    /*-ms-flex-direction: row;
    -webkit-flex-direction: row;*/
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
    justify-content: flex-end;
}

.dock-toolbar-content /* our toolbar area box */ {
    background-color: #f9f9f9;
    padding-left: 2px;
    padding-top: 3px;
    padding-bottom: 3px;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
}

.dock-content /* Our content area box */ {
    height: 100%;
    background-color: White;
    /*overflow: hidden;*/
    display: block;
    /*margin: 5px;
    padding: 5px;*/
    overflow: auto;
    padding-bottom: 1px;
}

.main .dock-content {
    overflow: visible;
}

/*section Collapse */
.dock-control.collapse {
}

.dock-content .collapse {
    visibility: collapse;
}

.JournalMultiEditColumnAmount {
    text-align: right;
}

.noborder {
    border: none;
}

@media print {
    .search,
    .button,
    #videolinkcontainer,
    #quickhelpcontainer,
    .sidebar,
    #topnav,
    .urlback {
        display: none;
    }
}

.searchcontainer input[type="text"] {
    width: 100%;
}

.font10px {
    font-size: 0.7em;
}

.blockcontainer {
    white-space: nowrap;
}

.blockright100left {
    display: inline-block;
    /*width: calc(100% - 104px);*/ /*TODO:Why not 100? Where is the margin coming from*/
    vertical-align: top;
    /*max-width: 1200px;*/
}

.blockright100right {
    display: inline-block;
    width: 100px;
    vertical-align: top;
}

@media all and (max-width: 1024px) {
    .blockright100left {
        width: 100%;
    }

    .blockright100right {
        visibility: collapse;
    }
}

.containerinlineblock {
    margin: 0;
}

    .containerinlineblock > div {
        display: inline-block;
        padding: 0;
        margin: 0;
        vertical-align: top;
    }

.buttoneditsquare {
    height: 15px;
    width: 15px;
    background: url(//portal.styreweb.com/images/appbar.edit_12b.png) no-repeat;
    cursor: pointer;
    padding-top: 3px;
    padding-bottom: 3px;
}


.media {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
}

.media-figure {
    margin-right: 1em;
}

.media-body {
    -ms-flex: 1;
    -webkit-flex: 1;
    flex: 1;
}

.previewinfo-container {
    width: 100%;
    max-width: 600px;
    margin-top: 3px;
    margin-bottom: 3px;
}

.previewinfo {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    background-color: #fbca65;
    border-radius: 5px;
}

.previewinfo-figure {
    margin-right: 1em;
}

.previewinfo-body {
    -ms-flex: 1;
    -webkit-flex: 1;
    flex: 1;
    /*margin-left: 1em;*/
    padding: 0.1em 0.5em;
}

.overflowhidden {
    overflow: hidden;
}

/*wrapper is part of our flex layout. container will be positioned inside this relative */
.sidebarmenuwrapper {
    flex: 1;
    min-width: 150px;
    position: relative;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    overflow-x: hidden;
    background-color: #fdfdfd;
    border-right: solid 1px #e8e8e8;
}

.sidebarmenuwrapperfixedwidth {
    width: 27rem;
    /*min-width: 27rem;*/
    max-width: calc(100vw - 130px); /* on mobile full width minus hints to our main content and for our button */
}

.sidebarmenuwrapper h1 {
    margin: 0;
	text-align: center;
    font-size: 1.8rem;
    font-weight: 500;    
    padding: 10px;
    width: 100%;
    background-color: #d3d3d3;
    color: #5a5a5a;
}

    .sidebarmenuwrapper h2 {
        margin: 0;
        padding: 12px;
        background-color: whitesmoke;
        font-size: 1.4rem;        
    }

    .sidebarmenuwrapper h3 {
        margin: 0;
        padding: 10px;        
        background-color: #f7f7f7;
        font-size: 1.2rem;
        border-bottom: solid 1px #f9f9f9;
    }


.sidebarmenucontainer {
    position: absolute;
    height: calc(100vh - 45px); /*cannot use 100% so we need to take device minus fixed header/footer */
    width: 100vw;
    max-width: 350px;
    z-index: 100;
    background-color: #ececec;
    border-right: solid 1px #e0e0e0;
    white-space: nowrap;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
}

.sidebarmenuscrollcontainer {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    -ms-flex: 1 1 0.000000001px;
    -webkit-flex: 1;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    /*height: calc(100% - 22px);*/
    height: calc(100vh - 45px);
}

/*@media (min-width: 400px) {
    .sidebarmenuwrapper {
        min-width: 27rem;
    }
}*/


@media (min-width: 992px) { /* boot strap break point*/
    .sidebarmenucontainer {
        position: relative; /*Override the absolute positioning we have on small devices */
        height: calc(100vh - 88px); /*cannot use 100% so we need to take device minus fixed header/footer */
        height: 100%;
        z-index: auto;
        max-width: 264px;
    }

    .sidebarmenuscrollcontainer {
        height: 100%;
    }
}

.sidebarmenucontainer h1 {
    background-color: #e0e0e0;
    padding: 5px 5px;
    margin: 0;
    font-size: 2rem;
}

.sidebarmenucontainer ul {
    list-style-type: none;
    padding: 5px;
    font-size: 1.7rem;
}

    .sidebarmenucontainer ul li {
        border-bottom: solid 1px #efefef;
        padding: 7px 0;
        margin: 0;
    }

.sidebarmenucontainer a, .sidebarmenucontainer a:visited, .sidebarmenucontainer a:hover {
    text-decoration: none;
    color: black;
    display: block; /*Ensures it fills its container to get touch area as large as possible*/
}

.sidebarmenucontainer .lefmenusubheader {
    background-color: #e0e0e0;
    padding: 5px;
    margin: -15px -10px 0 -10px;
}

.sidebarmenucontainer i {
    padding: 10px;
}

/*Hide sidebare totally when we are on a modalpage when embedded*/
.embedded.modalpage .sidebarmenuwrapper {
    display: none;
}

.embedded.listpage .applayoutbodywrapper {
    display: none;
}


@media (min-width:1000px) {
    /* We always show side bar menu on screens larger than 1000. A JS script runs on load to ensure that hidden is removed*/
    .maincontentcontainerwrapper {
        /*margin-left: 210px;*/
    }
}

@media (max-width: 992px) {
    .sidebarmenucontainer {
        /*width: 264px;*/ /* 760 + 264 = 1024 need to adjust .container breakpoints to ensure we fit exactly without x-scrollbar on an ipad*/
    }
}


.maincontentcontainerwrapper {
    position: relative;
    max-width: 100vw;
}

/* override bootstrap contain widths when we have our side menu open
    else it will overflow to the right on larger screens.
    Not a problem on mobile

*/
@media (min-width: 768px) {
    /* When left menu is visible we adjust our container width
        from 992> they will be side by side
        under 992 sidebarmenu will float above content
    */
    .leftmenuvisible .container {
        /* 750px - 210 px*/
        /*width: 540px;*/
    }
}

@media (min-width: 992px) {
    .leftmenuvisible .container {
        /* 970px - 210 px*/
        width: 760px;
        width: 797px;
        width: 814px;
    }
}

@media (min-width: 1200px) {
    .leftmenuvisible .container {
        /* 1170px - 210 px*/
        width: 960px;
    }
}

/*leftmenuinitialvisible gets added on load when width is > 992 by a jscript
    Do stuff that only happens on larger devices
*/
.leftmenuinitialvisible #pnlorglistsummary {
    display: none;
}

@media (min-width: 992px) {
    .leftmenuinitialvisible #topnavmenuicon {
        display: none;
    }

    .leftmenuinitialvisible #topnavlogo {
        margin-left: 5px;
    }
}

/*Override bootstrap styling for forms*/

.form-inline {
    width: 100%;
}

@media (min-width: 768px) {
    .form-inline .form-group {
        margin-bottom: 10px;
    }

    .form-inline .form-control, .form-inline .input-group {
        width: 350px;
    }

    .form-inline {
        width: 650px;
    }
}


.appbarcontainer {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    background-color: #38485f;
    color: #dbdbdb;
}

.appbar {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    position: relative;
    width: 7.5rem;
    overflow-y: auto;
    overflow-x: hidden;
}

    .appbar ul {
        font-size: 0.9rem;
        padding: 0;
        margin: 5px 0;
    }

        .appbar ul li {
            display: block;
            border: none;
            /*border-left: solid 3px transparent;*/
        }

            .appbar ul li.selected {
                /*border-left: solid 3px #c17ebc;
            background-color: #562c7b;*/
                border-left: solid 3px #8ac7d8;
                background-color: #006986;
                color: #e2e2e2;
            }

    .appbar i {
        font-size: 18px;
        margin-bottom: 3px;
        color: #e0e0e0;
    }

    .appbar a, .appbar a:visited, .appbar a:hover {
        color: #e0e0e0;
        text-decoration: none;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -ms-flex-direction: column;
        -webkit-flex-direction: column;
        flex-direction: column;
        align-items: center;
        padding: 10px 0;
    }

        .appbar a:hover {
            background-color: #372d90;
            color: #e2e2e2;
        }

.backnavcontainer {
    background-color: silver;
    height: 36px;
}

    .backnavcontainer a, .backnavcontainer a:visited, .backnavcontainer a:hover {
        color: black;
    }

        .backnavcontainer a:hover {
            background-color: #51e7ff;
        }

.swDialogForm {
}

.swDialogFormField {
    padding: 5px;
}

    .swDialogFormField label, .swDialogFormField span {
        display: inline-block;
        min-width: 125px;
        padding-right: 5px;
        font-weight: normal;
    }

    .swDialogFormField input {
        padding: 5px;
    }

.appbarcontainer.lighttheme {
    background-color: #e8e7e730;
    color: #565656;
}

.lighttheme .appbar a, .lighttheme .appbar a:visited, .lighttheme .appbar a:hover {
    color: rgb(66, 66, 66);
}