/* HDSB Chemical Inventory  - Site Styles */

body {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
	color: #444444;
	height: 100%;
	background-color: #ececec;
	background: url("images/wallpaper.jpg");
}	
img.banner {
	width: 100%;
	margin: 0;
	padding: 0;
}
h1, h2, h3 {
	margin-top: 10px;
	margin-bottom: 10px;
	font-weight: normal;
	color: #2c3e50;
	font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
}
h3 {
	padding: 8px;
	color: #2c3e50; /* midnight blue */
	background-color: #95a5a6; /* concrete */
	font-weight: normal;
}
#wrapper {
	position: relative;
	max-width:  980px;
	padding: 0;
	margin-right: auto;
	margin-left: auto;
}
#page-container {
	position: relative;
	max-width: 100%;
	margin-top: 0;
	padding: 0;
	margin-right: auto;
	margin-left: auto;
	overflow: hidden;
}

/* menu styles */
#menu {
	position: relative;
	width: 100%;
	padding: 0 0 0 0;
	background-color: #ececec; /* silver */
	color: #2c3e50; /* midnight blue */
	height: 40px;
}
#menu-1, #menu-2, #menu-3, #menu-4, #menu-5, #menu-6 {
	margin: 0;
	display: inline-block;
	height: 40px;
	float: left;
	text-align: center;
}	
#menubar { 
	position: relative;
	display: inline-block;
	margin: 0;
	padding: 0;
	height:  40px;
}
#menubar li { 
	float: left;
	list-style: none;
}
#menubar li ul { 
	margin: 0 0 0 0;
	padding: 0;
	position: absolute;
	visibility: hidden;
	z-index: 30;
}
#menubar li ul li { 
	float: none;	
}
a.menu:link, a.menu:visited, a.menu:active, a.menu:hover {
	position: relative;
	display: inline-block;
	width: 100px;
	height: 30px;
	color: #2c3e50; /* midnight blue */
	padding-top: 10px;
	font-weight: normal;	
	text-decoration: none;
	font-size: 1.2em;
	font-weight: bold;
	border-right: 1px solid #2c3e50; /* midnight blue */
}
a.menu:hover {
	color: #2c3e50; /* midnight blue */
	background-color: #fff;
}
a.menu:selected {
	color: #685E4B;
}
a.menu-drop:link, a.menu-drop:visited, a.menu-drop:active, a.menu-drop:hover {
	display: block;
	width: 180px;
	color: #333333;
	text-decoration: none;
	font-weight: normal;
	padding: 5px;
	background-color: #fff;
	/*background: url("images/white-transparent.png");	*/
	text-align: left;
}
a.menu-drop:hover {
	background-color: #ececec;
	color: #2c3e50; /* midnight blue */
}
#menu-phone {
	display: none;
}
#menu-computer {
	display: inline;
}
#header-tab {
	position: relative;
	width: 100%;
	margin: 0;
	padding: 0;
	background-color: #2c3e50; /* midnight blue */
	color: #fff;
	text-align: center;
	/*box-shadow: 0px 10px 5px #888888;*/
}
#header-tab h1 {
	position: absolute;
	left: -9999px;
}	
#content-container {
	display: inline-block;
	width:  100%;
	background: url("images/white-transparent.png");
	min-height: 100%;
	z-index: 1;
}	
#login-phone {
		display: none;
}
#left-column {
	position: relative;	
	float: left;
	padding: 2%;
	width: 60%;
}
#left-column p {
	text-align: justify;	
}
#right-column {
	position: relative;
	text-align: left;
	float: right;
	padding: 2%;
	width: 32%;
	overflow: hidden;
}

@media screen and (max-width: 980px) {
	body {
		font-size: 0.8em;
	}
	#left-column {
		position: relative;
		display: inline;
		padding: 5%;
		width: 90%;
	}
	#right-column {
		position: relative;
		display: inline;
		text-align: left;
		padding: 5%;
		width: 90%;
		overflow: hidden;
	}
	h1 {
		margin-top: 0;
		font-size: 160%;
	}
	h2 {
		margin-top: 0;
		font-size: 130%;
	}
	h3 {
		margin-top: 0;
		font-size: 110%;
	}
	#login-phone {
		position: relative;
		display: inline-block;
		width: 100%;
	}
	a.phone-buttons:link, a.phone-buttons:visited, a.phone-buttons:active, a.phone-buttons:hover {
		position: relative;
		float: left;
		display: inline-block;
		width: 94%;
		padding: 2% 3% 2% 3%;
		text-decoration: none;
		font-size: 1.5em;
		border-radius: .3em .3em .3em .3em;
		-webkit-border-radius: .3em .3em .3em .3em;
		-moz-border-radius: .3em .3em .3em .3em;
		background-color: #2c3e50; /* midnight blue */
		color: #fff;
	}
	a.phone-buttons:hover {
		background-color: #95a5a6; /* concrete */
		color: #2c3e50; /* midnight blue */
	}	
	#menu-phone {
		display: inline;
	}
	#menu-computer {
		display: none;
	}
	a.menu-drop {
		font-size: 1.3em;
	}
}

#footer-container {
	position: relative;
	margin-top: -6px;
	width: 100%;
	color: #fff;
	background-color: #2c3e50; /* midnight blue */
	/*box-shadow: 0px -10px 5px #888888;*/
	z-index: 2;
}
#footer-content {
	padding: 2%;
}
a.footer:link, a.footer:visited, a.footer:active {
	color: #fff;
	text-decoration: underline;
	outline: none;	
}
a.footer:hover {
	color: #95a5a6; /* concrete */
	text-decoration: none;
	outline: none;
}

a.side-menu-links:link, a.side-menu-links:visited, a.side-menu-links:active, a.side-menu-links:hover {
	position: relative;
	float: left;
	display: inline-block;
	width: 94%;
	padding: 2% 3% 2% 3%;
	text-decoration: none;
	font-size: 1.0em;
	border-radius: .3em .3em .3em .3em;
	-webkit-border-radius: .3em .3em .3em .3em;
	-moz-border-radius: .3em .3em .3em .3em;
	background-color: #2c3e50; /* midnight blue */
	color: #fff;
}
a.side-menu-links:hover {
	background-color: #95a5a6; /* concrete */
	color: #2c3e50; /* midnight blue */
}

/* hide notices and overview sections by default */
table#log-overview-section {
	display: none;
}
a.toggle-links:link, a.toggle-links:visited, a.toggle-links:active, a.toggle-links:hover {
	position: relative;
	float: left;
	display: inline-block;
	width: 10%;
	padding: 1px;
	text-decoration: none;
	text-align: center;
	font-size: 1.3em;
	line-height: 20px;
	border-radius: .3em .3em .3em .3em;
	-webkit-border-radius: .3em .3em .3em .3em;
	-moz-border-radius: .3em .3em .3em .3em;
	color: #95a5a6; /* concrete */
	background-color: #2c3e50;  /* midnight blue */
}
a.toggle-links:hover {
	color: #2c3e50;  /* midnight blue */
	background-color: #fff; /* white */
}

/* editable content */
div.editable {
	margin: 2px;
	outline: none;
	display: inline-block;
	-webkit-border-radius: 0.3em;
	-moz-border-radius: 0.3em;
	border-radius: 0.3em;
	border: 1px solid #ececec;
	padding: 10px;
	color: #555555;
	font-size: 1.2em;
}
div.editable:focus {
	border: 1px solid #999999;
}
div.save-button {
	display: none;
	margin: 2px 2px 2px 5px;
	outline: none;
	background-color: #ececec;
	-webkit-border-radius: 0.3em;
	-moz-border-radius: 0.3em;
	border-radius: 0.3em;
	border: 1px solid #999999;
	padding: 1px;
	color: #555555;
	cursor: pointer;
}
div.save-button:hover {
	background-color: #2c3e50; /* midnight blue */
	color: #fff;
}


/* jquery notices during form submission */
div#changePwdOutput {
	display: none;
	background-color: #fff;
}

/* inventory table styles */
table.inventory-table {
	width: 100%;
}
table.inventory-table td {
	border: 1px solid #999999;
	padding: 5px;
	background-color: #fff;
}

select {
	outline: none;
	-webkit-border-radius: 0.1em;
	-moz-border-radius: 0.1em;
	border-radius: 0.1em;
	border: 1px solid #999;
	border: inset 1px solid #333;
	font-size: 1.0em;
	padding: 4px;
	color: #ffffff;
	background: #95A5A6;
	margin: 5px 0;
}

/* search labs */
input#searchLabInput, input#searchLabInput {
	outline: none;
	-webkit-border-radius: 0.1em;
	-moz-border-radius: 0.1em;
	border-radius: 0.1em;
	border: 1px solid #999;
	border: inset 1px solid #333;
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	font-size: 1.2em;
	padding: 4px;
	color: #555555;
}
div#searching_labs_status {
	display: inline;
	font-size: 1.0em;
}

/* search labs */
input#searchLabMasterInput, input#searchLabMasterInput {
	outline: none;
	-webkit-border-radius: 0.1em;
	-moz-border-radius: 0.1em;
	border-radius: 0.1em;
	border: 1px solid #999;
	border: inset 1px solid #333;
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	font-size: 1.2em;
	padding: 4px;
	color: #555555;
}
div#searching_labs_master_status {
	display: inline;
	font-size: 1.0em;
}

/* search items */
input#searchTextInput, input#searchTextInputMasterList {
	outline: none;
	-webkit-border-radius: 0.1em;
	-moz-border-radius: 0.1em;
	border-radius: 0.1em;
	border: 1px solid #999;
	border: inset 1px solid #333;
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	font-size: 1.2em;
	padding: 4px;
	color: #555555;
}
div#searching_status {
	display: inline;
	font-size: 1.0em;
}
div.updating-status {
	display: inline-block;
	font-size: 1.0em;
}

/* default link styles */
a:link, a:visited, a:active {
	color: #333333;
	text-decoration: underline;
	outline: none;	
}
a:hover {
	color: #000000;
	text-decoration: underline;
	outline: none;
}

/* youtube container */
#youtube {
	border: 2px solid #999999;
	padding: 5px;
	text-align: center;
	border-radius: .5em .5em .5em .5em;
	-webkit-border-radius: .5em .5em .5em .5em;
	-moz-border-radius: .5em .5em .5em .5em;	
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);	
}

/* fancy links */
a.fancy:link, a.fancy:visited, a.fancy:active {
	display: inline-block;
	width: 98%;
	padding: 1%;
	text-decoration: none;
	color: #222222;	
	border: 1px solid #ececec;
	border-radius: .3em .3em .3em .3em;
	-webkit-border-radius: .3em .3em .3em .3em;
	-moz-border-radius: .3em .3em .3em .3em;	
	background-color: #fff;
	outline: none;	
}
a.fancy:hover {
	display: inline-block;
	width: 98%;
	padding: 1%;
	text-decoration: none;
	color: #000000;
	background-color: #2c3e50; /* midnight blue */
	color: #fff;
	border-radius: .3em .3em .3em .3em;
	-webkit-border-radius: .3em .3em .3em .3em;
	-moz-border-radius: .3em .3em .3em .3em;		
	outline: none;
}

/* rounded corners style */
.rounded {
	border-radius: .5em .5em .5em .5em;
	-webkit-border-radius: .5em .5em .5em .5em;
	-moz-border-radius: .5em .5em .5em .5em;	
}

/* jquery shake effects */	
.ui-effects-wrapper {
	display:inline;
}

/* default image style (no borders,etc) */
img {
	margin: 0;
	padding: 0;
	border: none;
	outline: none;
}

/* special font sizes */
.small {
	font-size: 0.7em;
	font-style: italic;
	line-height: 0px;
}

hr.thin-blue-line {
    border: 0;
	margin: 1px 0 0 0;
    border-bottom: 1px solid #2c3e50; /* midnight blue */
    background: #fff;
}


/* add new school container and form */
#add-new-school-wrapper {
	display: none;
	padding: 2%;
	background-color: #fff	
}

/* signup/login styles */
#dynamic-box {
	position: relative;
	min-height: 520px;
	overflow: hidden;
	width: 100%;
}
#login-wrapper, #signup-wrapper, #forgot-wrapper {
	position: absolute;
	top: 2px;
	display: block;
	padding: 2%;
	-webkit-border-radius: 0 0 0.4em 0.4em;
	-moz-border-radius: 0 0 0.4em 0.4em;
	border-radius: 0 0 0.4em 0.4em;
	border: 1px solid #999;
	border: inset 1px solid #333;
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	width: 94%;
	background-color: #fff;
}
#loginFrm, #signupFrm, #forgotFrm {
	color: #444444;
	font-size: 1.3em;
}
.loginInput  {
	outline: none;
	-webkit-border-radius: 0.1em;
	-moz-border-radius: 0.1em;
	border-radius: 0.1em;
	border: 1px solid #999;
	border: inset 1px solid #333;
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	font-size: 1.2em;
	padding: 4px;
	color: #555555;
	width: 90%;
}
.loginInput:focus  {
	-webkit-border-radius: 0.1em;
	-moz-border-radius: 0.1em;
	border-radius: 0.1em;
	outline: none;
	border: 1px solid #2c3e50;
	border: inset 1px solid #333;
	-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3);
	font-size: 1.2em;
	padding: 4px;
	color: #555555;
}
#submitBtn {
	outline: none;
	border: 1px solid #999;
	border: inset 1px solid #333;
	font-size: 1.0em;
	padding: 5px;
	-webkit-border-radius: 0.2em;
	-moz-border-radius: 0.2em;
	border-radius: 0.2em;
	-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);	
}
#submitBtn:hover {
	outline: none;
	cursor: pointer;
	border: 1px solid #2c3e50;
	color: #222222;
}
#loginInfo, #signupInfo, #forgotInfo {
	display: none;
}
.logout-message {
	padding: 20px;
	font-size: 1.2em;
	-webkit-border-radius: 0.4em;
	-moz-border-radius: 0.4em;
	border-radius: 0.4em;
	border: 1px solid #2c3e50; /* midnight blue */
	border: inset 1px solid #333;
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);	
	background-color: #fff;
	text-align: left;
}
img.close-button {
	float: left;
	width: 21px;
	margin: 0 0 0 0;
}
img.hide-button {
	position: absolute;
	top: -15px;
	left: -15px;
	width: 30px;
	margin: 0 0 0 0;
}
img.green-checkmark {
	float: left;
	margin: 0 5px 0 0;
}
.error {
	color: #990000;
}
.success {
	color: #009900;
}
span.mandatory {
	color: #ff0000;
	font-size: 1.0em;
}

/* item management */
div.item-management-add, div.item-management-remove {
	margin: 0;
	padding: 0;
}
div.item-management-add:hover, div.item-management-remove:hover {
	cursor: pointer;
}
div.item-management-add img, div.item-management-remove img, a.deactivate-school img,  a.deactivate-user img, a.activate-school img,  a.activate-user img {
	margin: 0;
	padding: 0;
	opacity: 0.7;
}
div.item-management-add img:hover, div.item-management-remove img:hover, a.deactivate-school img:hover,  a.deactivate-user img:hover, a.activate-school img:hover,  a.activate-user img:hover  {
	margin: 0;
	padding: 0;
	opacity: 1.0;
}

div.item-management-levels {
	margin: 0;
	padding: 0;
}
div.item-management-levels img {
	margin: 0;
	padding: 0;
	opacity: 0.7;
}
div.item-management-levels img:hover {
	margin: 0;
	padding: 0;
	opacity: 1.0;
}
div.item-management-levels:hover {
	cursor: pointer;
}
tr.hidden-info-container {
	position: relative;
	display: none;
}
tr.hidden-info-container td {
	position: relative;
	box-shadow: 3px 3px 5px #888888;
}
tr.hidden-requested-info-container {
	position: relative;
	display: none;
}
tr.hidden-requested-info-container td {
	position: relative;
	box-shadow: 3px 3px 5px #888888;
}

/* basic table formatting */
table.basic {
	border-spacing: 0;
	border-collapse: collapse;
	width: 100%;
}
table.inventory-table td {
	background-color: #fff;
	box-shadow: none;
}

div#request-new-item-wrapper {
	padding: 2%;
	background-color: #fff
}

input[type=checkbox]#checkBox:hover {
	cursor: pointer;
}
input[type=checkbox]#checkBox:before { 
	content:""; 
	position: relative;
	display: inline-block; 
	float: left;
	margin: -7px 0 0 0;
	width: 25px; 
	height: 25px; 
	background: url("images/checkbox.jpg");
}
input[type=checkbox]#checkBox:checked:before { 
	background: url("images/checkbox-checked.jpg");
}

/* diagnostic window */
div#diagnostic-window {
	position: relative;
	display: none;
	border: 1px solid #333333;
	width: 100%;
	padding: 2%;
	background: #fff;
}

/* like button */
a.like-button:link, a.like-button:visited, a.like-button:active, a.like-button:hover {
	position: relative;
	display: inline-block;
	text-decoration: none;
	padding: 2px;
	border-radius: .3em .3em .3em .3em;
	-webkit-border-radius: .3em .3em .3em .3em;
	-moz-border-radius: .3em .3em .3em .3em;	 	
}
a.like-button:hover {
	background-color: #2c3e50; /* midnight blue */
	color: #fff;
	border-radius: .3em .3em .3em .3em;
	-webkit-border-radius: .3em .3em .3em .3em;
	-moz-border-radius: .3em .3em .3em .3em;	 
}
.super-small {
	font-size: 0.5em;
}

/* button style */
a.button:link, a.button:active, a.button:visited, a.button:hover {
	position: relative;
	display: inline-block;
	padding: 10px;
	background: #2C3E50;
	color: #A8AFB5;
	text-decoration: none;
}
a.button:hover {
	background: #A8AFB5;
	color: #2C3E50;
}


/* log icons */
img.log-icons {
	position: relative;
	display: inline-block;
	width: 15px;
	float: left;
	border: 1px solid #95a5a6; /* concrete */
	border-radius: 0.3em;
	padding: 1px;
}