/* body/background */
html {
	background-color: rgb(255, 255, 255);
	background-position: center top;
}
body {
	background-color: rgb(255, 255, 255);
	background-position: center top;
}
#ios-fixed-background-hack {
	background-color: rgb(255, 255, 255);
	background-position: center top;
}
body {
    background-color: transparent; /* this is because of bootstrap */
}

@media (min-width: 1300px) {
 body,
 html {
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  background-attachment: fixed;
 }
}

/* text colours */
html, body, legend {
    color: #4B4B4B;
}
a {
    color: #4B4B4B;
}
a:hover {
    color: rgb(96, 96, 96);
}
.text-color-alt {
    color: rgb(0, 94, 184);
}
.text-color-alt2 {
    color: rgb(38, 122, 227);
}
.text-color-strong {
    color: #C31919;
}

/* menu */
.menu li a { background: #F3F8FA; border-color: #95B3D6 !important; }
.menu li:hover a { background: #CEE0E6; border-color: #B6D3DC; }
.menu li:selected a { background: #95B3D6; border-color: #95B3D6; }
.menu li a, .menu li a:hover { color: #4B4B4B; }
.menu li.disabled:hover a { background: #F3F8FA !important; border-color: #95B3D6 !important; }

/* message box colours */
.flash-message li { background-color: rgb(0, 180, 79); border-color: rgb(0, 180, 79); color: #FFFFFF; }
.flash-message .info { background-color: #e6f3ff; border-color: #b1d0ec; color: #528cc2; }
.flash-message .warning, .flash-message .warn { background-color: rgb(248, 115, 17); border-color: rgb(248, 115, 17); color: rgb(255, 255, 255); }
.flash-message .error { background-color: #D74040; border-color: rgb(215, 64, 64); color: #FFFFFF; }

/* skin workarounds for IE8 based template */
.box .box-tl { background: transparent url('/res/images/border/white/tl.png') no-repeat !important; }
.box .box-tr { background: transparent url('/res/images/border/white/tr.png') no-repeat !important; }
.box .box-bl { background: transparent url('/res/images/border/white/bl.png') no-repeat !important; }
.box .box-br { background: transparent url('/res/images/border/white/br.png') no-repeat !important; }
.box .box-t  { background: transparent url('/res/images/border/white/t.png')  repeat-x  !important; }
.box .box-b  { background: transparent url('/res/images/border/white/b.png')  repeat-x  !important; }
.box .box-r  { background: transparent url('/res/images/border/white/r.png')  repeat-y  !important; }
.box .box-l  { background: transparent url('/res/images/border/white/l.png')  repeat-y  !important; }

/* styles for BiFrost/etc. */
.generic-box.legacy > .box.box-tl { background-image: url('/res/images/border/white/tl.png'); }
.generic-box.legacy > .box.box-tr { background-image: url('/res/images/border/white/tr.png'); }
.generic-box.legacy > .box.box-bl { background-image: url('/res/images/border/white/bl.png'); }
.generic-box.legacy > .box.box-br { background-image: url('/res/images/border/white/br.png'); }
.generic-box.legacy > .box.box-tc { background-image: url('/res/images/border/white/t.png');  }
.generic-box.legacy > .box.box-bc { background-image: url('/res/images/border/white/b.png');  }
.generic-box.legacy > .box.box-cl { background-image: url('/res/images/border/white/l.png');  }
.generic-box.legacy > .box.box-cr { background-image: url('/res/images/border/white/r.png');  }
.generic-box.legacy > .box.box-header > h1 { color: rgb(60, 60, 60); }

/**
 * [redesign]:
 * Header will appear as per skin on desktop, whilst mobiles will only display the background color.
 */
#header,
#app > #main-header > header {
    background: rgb(255, 255, 255);
    background-size: auto 100%;
}

#header .logo,
#app > #main-header > header > .logo {
    width: 600px;
    height: 70px;
    background: url('/download/branding/b080c487-7d86-4db5-bbc9-bfc6348fda57/preview')  no-repeat;
}

button.login {
    background: url('/download/branding/9b6ddf78-9104-4dba-8f68-55bd59a1e298/preview')  no-repeat;
    background-size: 60px 60px;
}

/* specificity used to align with layout */
#body-wrapper > main.page-login,
#app.module-login > #main {
    justify-content: center;
    align-items: center;
}

/* ajax header */
#emulationSelector {
    border-collapse: separate;

    /* border-spacing has been overwritten by the following in skin.css
        table.noPadding, table.noVerticalPadding {
            border-spacing: 0;
        }
       In order to make both platform and ng look the same, I need to comment it out.
    */
    /* border-spacing: 2px; */

    border-color: gray;
    font-size: 12px;
    line-height: normal;
}
#emulationSelector select {
    font-size: 13px;
}
#emulationSelector .topHeaderDate {
    font-size: 10px;
}

/* begin: More CSS tweaks to make platform and ng look the same */
#emulationSelector select.dropdown,
#emulationSelector select.dropdown option { color: #4B4B4B; background-color: #e7e7e7; }
#emulationSelector a.footerLink:link,
#emulationSelector a.footerLink:visited {
    font-size: 10px;
    color: #FFFFFF;
}
/* end: More CSS tweaks to make platform and ng look the same */

/* text colours */
.text.status.na {}
.text.status.inProgress {}
.text.status.awaiting {}
.text.status.pending {
    color: #BBBBBB;
}
.text.status.completed ,
.text.status.passed {
    color: rgb(165, 204, 68);
}
.text.status.failed {
    color: rgb(205, 28, 36);
}

/**
 * [Header Menu]
 * The buttons use '>' within the selectors to not conflict with the buttons that appear within the panels.
 *
 * @deprecated to be removed with the generated CSS styles
 * @todo new colors to be done within WM-7837
 * @todo some colors don't have states yet
 */
#header > nav > ul > li > a {
    background-color: rgba(0, 0, 0, 0) !important;    border-color: rgb(165, 204, 68) !important;    color: rgb(165, 204, 68) !important;}

#header > nav > ul > li > a:hover {
            }
#header > nav > ul > li > a:focus {
            }
#header > nav > ul > li > a:disabled ,
#header > nav > ul > li > a.disabled {
            }

/**
 * [Sidebar]
 * This wil be used for both the profile and toolbox slide out panels.
 *
 * @deprecated to be removed with the generated CSS styles
 * @todo new colors to be done within WM-7837
 */
.slideout-panel .submenu-button:hover {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; /* IE8 */
    opacity: 0.75;
}

/**
 * [Navigation Tabs]
 * @deprecated to be removed with the generated CSS styles
 */
.nav.nav-tabs {
    border-color: #eee !important;}
.nav.nav-tabs li a {
    border-color: rgba(0, 0, 0, 0) !important;    color: #4B4B4B !important;}
.nav.nav-tabs li:hover a {
    border-color: #666 !important;    color: rgb(102, 102, 102) !important;}
.nav.nav-tabs li.active a {
    border-color: #666 !important;    color: #555 !important;}

/**
 * [Results List]
 * @deprecated to be removed with the generated CSS styles
 */
.results .list header {
    background-color: #f9f9f9 !important;    color: #333 !important;}
.results .list ,
.results .list header ,
.results .list article {
    border-color: rgb(221, 221, 221) !important;}
.results .list article {
    background-color: rgba(0, 0, 0, 0) !important;}
.results .list article ,
.results .list article a:not(.btn),
.results .list article .text.primary {
    color: #333 !important;}
.results .list article .text.secondary ,
.results .list article .info {
    color: #999999 !important;}
.results .list article:hover {
    background-color: #f5f5f5 !important;}
.results .list article:hover ,
.results .list article:hover a:not(.btn),
.results .list article:hover .text.primary {
    color: #333 !important;}
.results .list article:hover .text.secondary ,
.results .list article:hover .info {
    color: #999999 !important;}