@charset "utf-8";

/***** Layouts *****/
html {
    overflow-y: scroll;
}

body {
    padding-top: 50px;
    padding-bottom: 30px;
    background: #f5f5f5;
    font-size: 14px;
}

table {
    font-size: 14px;
}

table td {
    vertical-align: top;
    padding: 0 2px 2px 0;
}

.break-anywhere {
    overflow-wrap: anywhere;
    hyphens: auto;
}

label {
    font-weight: initial;
}

input::-webkit-input-placeholder { /*Chrome & Opera*/
    color: #333;
}

input:-ms-input-placeholder { /*IE (doesn't seem to work)*/
    color: #333;
}

input::-moz-placeholder { /*Firefox*/
    color: #333;
}

.container {
    background: #fff;
}

.banner {
    background: url(/Images/OhnsHeader.png) no-repeat #fff;
}

.banner-content {
    min-height: 137px;
}

    .banner-content span {
        line-height: 2em;
    }

    .banner-content img {
        float: right;
        margin: 25px 10px;
    }

.headerlogout {
    height: 30px;
    position: relative;
    top: -42px;
    right: 40px;
    z-index: 99999;
    width: 200px;
    float: right;
}

#LogoutName {
    margin: 0 10px 0 0;
}

#HeadLoginView_FullName, #HeadLoginView_FullNameAdmin, #HeadLoginView_FullNameSupervisor {
    margin: 0 10px 0 0;
}

#SelectedUser {
    color: #444; /*#c2e26a;*/
    margin: 18px 6px 6px 6px;
    padding: 0 6px;
    font-size: 120%;
    font-stretch: expanded;
    line-height: 1.2em;
    box-shadow: 0 0 5px 5px rgba(255, 255, 255, .85);
    float: right;
    background: url(/images/white80.png);
}
/*.col-lg-12 {
	padding-bottom: 30px;
}*/

/****** Tables *****/
.table-responsive {
    overflow-x: auto;
}

.threeCols td {
    width: 33%;
}
/****** Dashboard *****/
.list-group .progress {
    margin: 0;
}

a:hover.list-group-item {
    cursor: default;
}

/****** Navigation *****/
.navbar-header img {
    margin: 10px 10px 0 0;
    float: left;
    height: 30px
}

.sub-nav {
    margin-left: 10px;
}

    .sub-nav a {
        padding: 4px 10px !important;
    }

.dropMenuHeader {
    border-top: solid 1px #bbb;
    padding: 3px 3px 0 8px;
    margin: 4px 0 0 0;
    font-weight: bold;
}

.navbar-nav > li > a {
    padding: 15px 10px;
}
/***** Other *****/
::-moz-selection {
    background: #BDE4DA;
    color: #222;
    text-shadow: none;
}

::selection {
    background: #BDE4DA;
    color: #222;
    text-shadow: none;
}

/*/////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/***** orginal stuff ****/

.float_left {
    float: left;
    margin-right: 5px;
}

.float_right {
    margin-left: 5px;
    float: right;
}

.clear {
    clear: both;
}

fieldset.login legend {
    color: #B2E6FF;
    text-align: left;
}

.more {
    color: #428bca;
    text-decoration: none;
    background-image: url("/images/more_arrow.gif");
    background-origin: padding-box;
    background-position: 100% 50%;
    background-repeat: no-repeat;
    background-size: auto auto;
    cursor: pointer;
    padding-right: 10px;
    white-space: nowrap;
}

.less {
    color: #428bca;
    text-decoration: none;
    background-image: url("/images/less_arrow.gif");
    background-origin: padding-box;
    background-position: 0% 50%;
    background-repeat: no-repeat;
    background-size: auto auto;
    cursor: pointer;
    padding-left: 10px;
    white-space: nowrap;
}

    .more:hover, .less:hover {
        color: #2a6496;
        text-decoration: underline;
    }

.title {
    height: 86px;
    text-align: right;
}

.failureNotification {
    border: 0 none;
    color: red;
    margin: 0;
    padding: 0;
    position: static;
    text-align: left;
}

.Blue {
    color: #4f68a5;
}

.Green {
    color: #8dc13b;
}

.GreenDark {
    color: #137366;
}

.Grey {
    color: #555;
}

.Help {
    cursor: help;
}

.StatusTick {
    color: #484848;
    display: block;
    vertical-align: middle;
    background: url("/images/status_tick_icon.png") 10px 7px no-repeat #e8f3f2;
    border: solid 1px #bcded9;
    padding: 8px 8px 8px 80px;
    margin: 16px 0 16px 0;
    clear: both;
}

.StatusAlert {
    color: #484848;
    display: block;
    vertical-align: middle;
    background: url("/images/status_alert_icon.png") 10px 7px no-repeat #efd8bd;
    border: solid 1px #c9781c;
    padding: 8px 8px 8px 45px;
    margin: 16px 0 16px 0;
    clear: both;
}

.StatusError {
    background-color: #FF9494;
    color: white;
    display: block;
    vertical-align: middle;
    border: solid 1px #c9781c;
    padding: 8px 8px 8px 45px;
    margin: 16px 0 16px 0;
    clear: both;
}

.StatusNull {
    color: #484848;
    display: block;
    vertical-align: middle;
    background: url("/images/status_null_icon.png") 10px 7px no-repeat #dddddd;
    border: solid 1px #aaaaaa;
    padding: 8px 8px 8px 80px;
    margin: 16px 0 16px 0;
    clear: both;
}

.ResponseAlert {
    display: block;
    position: fixed;
    top: 25%;
    width: 50%;
    left: 25%;
    cursor: pointer;
    min-height: 50px;
    color: #484848;
    vertical-align: middle;
    background: url("/images/close2.png") right 5px top 5px no-repeat #efd8bd;
    box-shadow: 0 0 5px 0 rgba(50, 50, 50, 0.75);
    border: solid 1px #c9781c;
    padding: 12px;
    margin: 0;
    z-index: 999;
}

.ResponseTick {
    display: block;
    position: fixed;
    top: 45%;
    width: 45%;
    left: 27%;
    cursor: pointer;
    min-height: 50px;
    color: #484848;
    vertical-align: middle;
    background: url("/images/close2.png") right 2px top 2px no-repeat #e8f3f2;
    box-shadow: 0 0 5px 0 rgba(50, 50, 50, 0.75);
    border: solid 1px #bcded9;
    padding: 12px;
    margin: 0;
    z-index: 999;
}

@media only screen and (max-width: 992px) {
    .ResponseTick {
        width: 90%;
        left: 5%;
    }

    .ResponseAlert {
        width: 90%;
        left: 5%;
    }
}

img[onclick="show(this)"] {
    margin: 0 0 2px 6px;
    cursor: pointer;
}

.MemberSelect {
    float: right;
    margin-top: 6px;
}

.NoteHolder {
    position: absolute;
    font-size: initial;
    margin-top: 25px;
    max-width: 100%;
    min-width: 75%;
}
    /*To allow divs in notes lets be restrictive*/
    .NoteHolder div:first-child[class~="WhiteBg"] {
        background: url(/Images/close2.png) top right no-repeat #ffffff;
        border: 1px solid #e3e3e3;
        border-radius: 8px;
        box-shadow: 0 0 15px 0 rgba(50, 50, 50, 0.75);
        color: #3c3c3c;
        cursor: pointer;
        display: none;
        padding: 19px;
        position: relative;
        /*max-width: 94%;*/
        font-size: 90%;
        font-weight: normal;
        z-index: 102;
    }

.RightContainerMarginBottom {
    float: right;
    margin: 0 0 8px 5px;
}

.RightContainerMarginTop {
    float: right;
    margin: 8px 0 0 5px;
}

.Normal {
    font-size: initial;
    font-weight: normal;
    font-style: normal;
}

.Italics {
    font-style: italic;
}
/* Internet Explorer doesn't support initial in any context, dropdowns and textboxes inside h2 elements look terrible */
h2 select, h2 input {
    font-size: 16px;
}

/* END ///////////////////////////////////////////////////////////////////////////////////////////////////////// */

/****** Footer *****/
.footer {
    margin: 10px auto;
    padding: 0 0;
    background: #fff;
    min-height: 20px;
}

    .footer span {
        margin: 0;
        display: block;
    }

    .footer div {
        text-align: center;
    }

        .footer div a {
            display: inline-block;
            margin: 0;
            /*color:#555;*/
        }

    .footer table {
        width: 100%;
        font-size: 14px;
    }

        .footer table td {
            vertical-align: top;
            padding: 12px 0;
        }

/****** Forms *****/

.PopupForm {
    background: #fff !important;
    box-shadow: 0 0 15px 0 rgba(50, 50, 50, 0.75);
    left: 0;
    padding: 12px;
    position: absolute;
    width: 100%;
    z-index: 999;
}

::-webkit-input-placeholder {
    color: #aaa;
}

:-moz-placeholder, ::-moz-placeholder {
    color: #aaa;
}

:-ms-input-placeholder {
    color: #aaa;
}

.buttonLogout {
    float: right;
    margin: 7px 0 0 0;
}

    .buttonLogout a {
        bottom: 2px;
        position: relative;
    }

/****** Side bar graphs *****/
/*.col-lg-3 .list-group {
	position: fixed;
	width: 15%;
}*/

.col-lg-3 .progress {
    margin: 2px 0 0 0;
}

.bg-white {
    background: #fff;
}

.bg-blue {
    background: #dff4fe;
}

/***** Over-write bootstrap *****/

.btn-success, .btn-success:visited {
    background-color: #8dc13b;
    border-color: #8dc13b;
}

.progress-bar[aria-valuenow="1"], .progress-bar[aria-valuenow="2"] {
    min-width: 3px;
}

li[class="dropdown open"] a span[class="caret"] {
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 4px solid;
    border-top: 4px solid transparent;
    display: inline-block;
    height: 0;
    margin-left: 2px;
    margin-bottom: 4px;
    vertical-align: middle;
    width: 0;
}
/***** Extra bootstrap button *****/
.btn-toggle {
    color: #fff;
    background-color: #894bec;
    border-color: #723ec4;
}

    .btn-toggle:hover, .btn-toggle:focus, .btn-toggle:active, .btn-toggle.active, .open > .dropdown-toggle.btn-toggle {
        color: #fff;
        background-color: #723ec4;
        border-color: #6135a7;
    }

    .btn-toggle:active, .btn-toggle.active, .open > .dropdown-toggle.btn-toggle {
        background-image: none;
    }

    /*.btn-toggle.disabled, .btn-toggle[disabled], fieldset[disabled] .btn-toggle, .btn-toggle.disabled:hover, .btn-toggle[disabled]:hover, fieldset[disabled] .btn-toggle:hover, .btn-toggle.disabled:focus, .btn-toggle[disabled]:focus, fieldset[disabled] .btn-toggle:focus, .btn-toggle.disabled:active, .btn-toggle[disabled]:active, fieldset[disabled] .btn-toggle:active, .btn-toggle.disabled.active, .btn-toggle[disabled].active, fieldset[disabled] .btn-toggle.active {
    background-color: #b49dd9;
    border-color: #a590c7;
}*/

    .btn-toggle .badge {
        color: #894bec;
        background-color: #fff;
    }

.btn.aspNetDisabled, fieldset[disabled] .btn {
    border-color: #aaa;
    background-color: #bbb;
}

.colour-toggle {
    color: #894bec !important;
}

.colour-info {
    color: #31b0d5 !important;
}

.colour-primary {
    color: #3071a9 !important;
}

.colour-success {
    color: #5cb85c !important;
}

.colour-warning {
    color: #f0ad4e !important;
}

.colour-danger {
    color: #d9534f !important;
}

.backgroun-toggle {
    background-color: #894bec;
}

.backgroun-info {
    background-color: #31b0d5;
}

.backgroun-primary {
    background-color: #3071a9;
}

.backgroun-success {
    background-color: #5cb85c;
}

.backgroun-warning {
    background-color: #f0ad4e;
}

.backgroun-danger {
    background-color: #d9534f;
}

.ValidationError {
    font-size: 11px;
    color: red;
    padding-top: 10px !important;
}

.notification {
    padding: 10px 15px;
    background-color: #d9534f;
}

.twoColumnsGrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.instructionVideos p {
    padding-top: 2px;
}

.notification.success {
    color: #0f5132;
    background-color: #d1e7dd;
    border-color: #badbcc;
}

.instructionVideos p a {
    text-decoration: underline;
}

.releaseNoWrapper {
    text-align: left !important;
    color: #a0a0a0;
    font-size: 12px;
    padding-top: 5px;
}

    .releaseNoWrapper > span {
        display: inline;
    }

/***** Run log page *****/
/*#MainContent_FormHeadName1, #MainContent_FormHeadName2, #MainContent_FormHeadName3, #MainContent_FormHeadName4, 
#MainContent_FormHeadRun1, #MainContent_FormHeadRun2, #MainContent_FormHeadRun3, #MainContent_FormHeadRun4 {
    padding: 2px 5px;
    background-color: #5cb85c;
    color: #fff;
}*/
/***** Media queries */
@media only screen and (max-width: 1200px) {
    .navbar-header img {
        margin: 10px 10px 0 20px;
        float: left;
        height: 35px;
    }

    .m4-hide {
        display: none;
    }
}

@media only screen and (max-width: 767px) {
    .m-hide {
        display: none;
    }

    .m-show {
        display: inherit;
    }
}

@media only print {
    .m-show {
        display: none;
    }

    .MemberSelect {
        display: none;
    }
}

@media only screen and (min-width: 768px) {
    .m-show {
        display: none;
    }
}

@media only screen and (max-width: 992px) {
    .m2-hide {
        display: none;
    }
}

@media only screen and (max-width: 530px) {
    .m3-hide, .banner-content img {
        display: none;
    }

    .col-lg-12, .col-lg-6 {
        padding-left: 3px;
        padding-right: 3px;
    }
}

.text-center {
    text-align: center !important;
}

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

.bg-level-0,
.bg-orange {
    background-color: #e7d49f !important;
}

.bg-level-1,
.bg-green {
    background-color: #BBF4C1 !important;
}

.bg-level-2,
.bg-lightblue {
    background-color: #B4DBE4 !important;
}

table td .bi {
    font-size: 25px;
}