﻿/*
Template Name: Search Laboratory Systems Theme
Template Version: 1.0
Author: Michael Walkden

This CSS file includes all the generic CSS styles which make up the Search Laboratory look and feel for systems websites.

Include it at the top of your CSS imports and you can override these rules in css files lower down.

It allows a common style for:
    Error Page
    Login Page
    Buttons
    Modal headers/footers
*/

/* Import fonts */
@import url(https://fonts.googleapis.com/css?family=Ruda:400,700,900);

/* BASIC THEME CONFIGURATION */
body {
    color: #797979;
	/*background: #f2f2f2; removed because the table-striped background was the same...*/
    font-family:"Raleway", helvetica, arial, sans-serif;  /*'Ruda', sans-serif;*/
    padding: 0px !important;
    margin: 0px !important;
    font-size:13px;
}

.stripes {
    height: 10px;
    width: 100%;
    background-image: url('Images/Candy Stripe.svg');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin-bottom:20px;
}

ul li {
    list-style: none;
}

a, a:hover, a:focus {
    text-decoration: none;
    outline: none;
}
::selection {

    background: #00b6dd;
    color: #fff;
}
::-moz-selection {
    background: #00b6dd;
    color: #fff;
}

#container {
    width: 100%;
    height: 100%;
}

#full-width-container {
    width: 100%;
    height: 100%;
    margin-top:170px;
}

/* Search Labs Bootstrap Modifications */
.modal-header {
	background: #00b6dd;
}

.modal-header p {
    color:white;
    margin-top:5px;
}

.modal-title {
	color: white;
}

.btn-round {
	border-radius: 20px;
	-webkit-border-radius: 20px;
}

/*Theme Buttons*/

.btn-searchlabs {
  color: #fff;
  background-color: #e60000;
  border-color: #48bcb4;
}
.btn-searchlabs:hover,
.btn-searchlabs:focus,
.btn-searchlabs:active,
.btn-searchlabs.active,
.open .dropdown-toggle.btn-searchlabs {
  color: #fff;
  background-color: #48bcb4;
  border-color: #48bcb4;
}

.btn-searchlabs02 {
  color: #fff;
  background-color: #ac92ec;
  border-color: #967adc;
}
.btn-searchlabs02:hover,
.btn-searchlabs02:focus,
.btn-searchlabs02:active,
.btn-searchlabs02.active,
.open .dropdown-toggle.btn-searchlabs02 {
  color: #fff;
  background-color: #967adc;
  border-color: #967adc;
}

.btn-searchlabs03 {
  color: #fff;
  background-color: #48cfad;
  border-color: #37bc9b;
}
.btn-searchlabs03:hover,
.btn-searchlabs03:focus,
.btn-searchlabs03:active,
.btn-searchlabs03.active,
.open .dropdown-toggle.btn-searchlabs03 {
  color: #fff;
  background-color: #37bc9b;
  border-color: #37bc9b;
}

.btn-searchlabs04 {
  color: #fff;
  background-color: #ed5565;
  border-color: #da4453;
}
.btn-searchlabs04:hover,
.btn-searchlabs04:focus,
.btn-searchlabs04:active,
.btn-searchlabs04.active,
.open .dropdown-toggle.btn-searchlabs04 {
  color: #fff;
  background-color: #da4453;
  border-color: #da4453;
}

.btn-clear-g {
	color: #48bcb4;
	background: transparent;
	border-color: #48bcb4;
}

.btn-clear-g:hover {
	color: white;
}

/* Body Layout */
.sl-body {
    margin-top:170px;
}

/*SEARCH LABS ERROR PAGE*/

.sl-logo-logon { max-width:250px; text-align:center; margin:25px 5px 25px 5px; }
.sl-logo-icon { position:absolute; left:1em; top:1em; height:60px; margin-top:-12px }

.sl-logo-headericon {
    position: absolute;
    left: 1.7em;
    top: 1em;
    height: 60px;
    margin-top: -2px;
}

.sl-logo-header { max-width:300px; text-align:center; height:55px; margin:12.5px 5px 12.5px 5px; padding-left:90px;}
.sl-logo-lightbox {
    max-width: 600px;
    text-align: center;
    height: 80px;
    margin: 12.5px 5px 12.5px 5px;
}

.sl-logo-websitelink {
    position: absolute;
    left: 15.3em;
    top: 5.5em;
    height: 40px;
    margin-top: -2px;
    font-size: 0.93em;
}

.sl-logo-websitelink.smaller{
    top: 3.5em;
}

.sl-logo-websitelink.a:active{
    color:#e60000;
}

.sl-logo-websitelink.a:visited{
    color:#e60000;
}

.error-page-image {
    position: absolute;
    right: 5%;
    bottom: 5%;
    height: 60%;
}

/* Welcome to Clients Banner */
.client-welcome {
    max-width: 65%;
    margin: 8% auto 0;
    padding: 0px 5px 5px 5px;
}

.welcome-image {    
    width:60%;
}

.header-image {
    width: 350px;
    padding: 5px 0 7px 0;
}

.header-image.smaller {
    width: 200px;
    padding: 5px 0 7px 0;
}

.client-welcome h2.client-heading {
	margin: 0;
	padding: 25px 20px;
	text-align: center;	
	color: #e60000;
	font-size: 20px;
	text-transform: uppercase;
	font-weight: 300;
}

#client-welcome-text {
    padding:0em 6.6em 0em 11em;    
}

#client-welcome-text p {
    font-size: 17px;
    color: white;
}
.menu-sl-blue {
    color:#e60000;
    font-size:22px;
}

/*LOGIN CONFIGURATION PAGE*/

.sl-logo-logon { max-width:250px; text-align:center; margin:25px 5px 25px 5px; }
.rl-login-logo { float:left; height:50px; }

.form-login {
    max-width: 630px;
    margin: 100px auto 0;
    background: #fff;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    border: 2px solid #00b6de;
    padding:0px 5px 5px 5px
}

.form-login hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #00b6de;
    margin: 1em 0;
    padding: 0; 
}

.form-login h2.form-login-heading {
	margin: 0;
	padding: 25px 20px;
	text-align: center;
	background: #000000;
	border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
	color: #fff;
	font-size: 20px;
	text-transform: uppercase;
	font-weight: 300;
}
.login-wrap {
	padding: 20px;
}
.login-wrap .registration {
	text-align: center;
}
.login-social-link {
	display: block;
	margin-top: 20px;
	margin-bottom: 15px;
}

.navbar-name {
    padding:15px 10px 15px 0;
    color:#aeb2b7;
}
/* HEADER AND MENU STYLE*/
/* HEADER STYLE */
.tui-header { font-family:Arial; height:80px; background:#00b6dd; }
.tui-header .typography { border:none; width:180px; height:62px; padding-top:5px }
.tui-header .logo { border:none; width:90px; height:62px }
.tui-header h1 { color:#21368b; font-weight:normal; padding:0; margin:10px 0 2px 8px; }
.tui-header strong { color:white; font-size:1.5em; margin-right:10px; line-height:60px; }

.sl-filter-box {
    float:right;
    line-height:2em;
    padding:17px 15px 0px 0px;
}
.sl-filter-box input {
    width: 100%;
    padding-left:4px;
}

/* MENU STYLE */
.tui-menu { background-color:#00b6dd; height:34px; border-top:1px solid white; }
.tui-menu ul { margin:0 8px; }
.tui-menu ul > li { position:relative; display:inline; float:left; clear:right; z-index:1200; }
.tui-menu a { display:block; /*height:20px;*/ padding:4px 5px; margin:2px; color:white; text-decoration:none; white-space:nowrap; }
.tui-menu a.show { color:White; background-color: #00b6dd;  /*background-image:url("Images/blue2.gif");*/ }
.tui-menu ul ul { position:absolute; display:none; background: #00b6dd; padding-bottom:1px; z-index:1200; }
.tui-menu ul ul li { display:block; float:none; }
.tui-menu ul ul a { color:#21368B; min-width:150px; padding:4px 3px; }
.tui-menu ul ul a:hover { background-image:url("Images/blue2.gif"); border-color:#232428; color:White; }

.tui-test-underlay { background-image: url("Images/TestSite.png"); background-repeat:repeat;  }

.tui-header-right { float:right; padding-top:1.8em; width:15em }

ul { display: block;
    list-style-type: disc;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 4px; 
}


.missing-report {
    background-color: #ff9b9b !important;
}


.tableau-report-select{
    min-width: 300px;
    display: block;
}

#ui-datepicker-div {
    z-index: 1090 !important;
}

.temp-margin {
    margin-top: 15px;
}

.clickable {
    cursor: pointer;
}

.highlight {
    background-color: rgba(0,0,0,.05);
}

.date-pad {
    margin-bottom: 15px;
}

.date-align {
    padding-top: 8px;
}

.records-body {
    display: block;
    height: 200px;
    width: auto;
    overflow-y: auto;
    overflow-x: hidden;
}

.records-body thead {
    width: 100%;
}

.table-container {
    border: 1px solid #ccc;
    border-radius: 3px;
    width: 100%;
    margin-bottom: 15px;
}

.table-container table {
    width: 100%;
}

.scroll-container {
    border-top: 1px solid #ccc;
    max-height: 240px;
    overflow-y: scroll;
}

.scroll-container td:first-child {
    border-right: 1px solid #ccc;
    width: 100px;
}

.scroll-container td {
    border-bottom: 1px solid #ccc;
}

.scroll-container tr {
    height: 30px;
    padding: 0;
}

.scroll-container td {
    padding: 2px;
}

.pinned-header {
    height: 30px;
}

.pinned-header th:first-child {
    border-right: 1px solid #ccc;
    width: 100px !important;
}

.pinned-header th {
    padding-left: 5px;
}

.comm-instance td {
    padding-left: 5px;
}

.no-pad {
    padding: 0px !important;
}

.editor-margin .trumbowyg-box {
    margin-top: 0px !important;
}

.editor-margin {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.status-box {
    min-height: 30px;
}

.tooltip-inner {
    width: 275px !important;
    margin-left: 5px;
    margin-right: 5px;
    max-width: 100% !important;
    padding-top: 5px;
    padding-bottom: 5px;
}

.v-margin-15 {
    margin-bottom: 15px;
    margin-top: 15px;
}

.comm-error{
    color:red !important;
}

.downtime{
    color: red !important;
}

.navbar-reduced{
    max-height:75px !important;
    min-height:50px !important;
}