﻿/*
SPS Standard Styles - Compatible with Schoolwires Template 2015
*/

/*
* Text Styles
*/
a img {
	vertical-align: middle;
	border: 0;
}

.bold {
	font-weight: bold !important;
}

.bottom {
	vertical-align: bottom !important;
}

.center {
	text-align: center !important;
}

.centerbox {
	box-sizing: border-box;
	margin: 15px auto;
	text-align: left;
	width: 60%;
}

.clear {
	clear: both;
}

.float-l {
	float: left;
}

.float-r {
	float: right;
}

.hidden {
	display: none;
}


/*Larger margin*/
.marginAll {
	margin: 1em !important;
}

.indent, .marginLeft {
	margin-left: 1em !important;
}

.indent-bottom, .marginBottom {
	margin-bottom: 1em !important;
}

.indent-right, .marginRight {
	margin-right: 1em !important;
}

.indent-top, .marginTop {
	margin-top: 1em !important;
}


/*Smaller margin*/
.marginSmallAll {
	margin: 0.3em !important;
}

.marginSmallLeft {
	margin-left: 0.3em !important;
}

.marginSmallBottom {
	margin-bottom: 0.3em !important;
}

.marginSmallRight {
	margin-right: 0.3em !important;
}

.marginSmallTop {
	margin-top: 0.3em !important;
}


/*Larger padding*/
.paddingAll {
	padding: 1em !important;
}
 
.paddingLeft {
	padding-left: 1em !important;
}

.paddingBottom {
	padding-bottom: 1em !important;
}

.paddingRight {
	padding-right: 1em !important;
}

.paddingTop {
	padding-top: 1em !important;
}


/*Smaller padding*/
.paddingSmallAll {
	padding: 0.3em !important;
}
 
.paddingSmallLeft {
	padding-left: 0.3em !important;
}

.paddingSmallBottom {
	padding-bottom: 0.3em !important;
}

.paddingSmallRight {
	padding-right: 0.3em !important;
}

.paddingSmallTop {
	padding-top: 0.3em !important;
}



/*For table padding*/
.paddingAll td, .paddingAll th {
	padding: 0.2em !important;
}
 
.paddingLeft td, .paddingLeft th {
	padding-left: 0.2em !important;
}

.paddingBottom td, .paddingBottom th {
	padding-bottom: 0.2em !important;
}

.paddingRight td, .paddingRight th {
	padding-right: 0.2em !important;
}

.paddingTop td, .paddingTop th {
	padding-top: 0.2em !important;
}


input, select, textarea {
	color: #000;
}

input:disabled {
	background-color: #EEE !important;
	border: 1px solid #CCC !important;
	padding: 2px;
}

.left {
	text-align: left;
}

.middle {
	vertical-align: middle !important;
}

.nowrap {
	white-space: nowrap;
}

.overflowHideX {
	overflow-x: hidden;
}

.overflowHideY {
	overflow-y: hidden;
}

.right {
	text-align: right;
}

.table-reset {
	border-spacing: 0;
    border-collapse: separate;
	width: 100%;
}

.table-reset td, .table-reset th {
	padding: 0;
}

.top {
	vertical-align: top !important;
}


/*
* TABLES/BOXES
*/

/*Put on the TABLE or DIV tags.*/
.spsBox {
	background-color: #f4f4f4 !important;
}

/*Put on the TABLE or DIV tag.*/
.spsBoxLite {
	background-color: white !important;
}

.spsBoxSoft {
	background-color: white !important;
	border: 1px solid #e6e6e6 !important;
}

.spsBox, .spsBoxLite {
	border: 1px solid #c2c2c2 !important;
}

div.spsBox, div.spsBoxLite, div.spsBoxSoft {
	border-top: 0 !important;
	padding: 5px;
	margin: initial !important;
}

table.spsBox, table.spsBoxLite, table.spsBoxSoft {
	border-collapse: separate !important;
	padding: 0px;
}

	table.spsBox td, table.spsBoxLite td, table.spsBoxSoft td {
		padding: 5px;
	}

	/*table.spsBox td div, table.spsBoxLite td div, table.spsBoxSoft td div {
		margin: 0 !important;
		padding: 0;
	}*/

.spsBoxed, .spsBoxedLite, .spsBoxedSoft {
	font-size: 1em;
	padding: 5px;
}

.spsBoxed {
	background-color: #F6F6F6 !important;
	border: 1px solid #585858 !important;
}

.spsBoxedLite {
	background-color: white !important;
	border: 1px solid #585858 !important;
}

.spsBoxedSoft {
	background-color: white !important;
	border: 1px solid #e6e6e6 !important;
}

/*
spsBoxHead classes:  put on the TR tag for header rows inside spsBox, or DIV if not using tables.
*/
.spsBoxHead th, .spsBoxHeadSoft th {
	border: 0;
}

tr.spsBoxHead td, tr.spsBoxHead th, .spsBoxHead, .spsBoxedHead {
	background-color: #032ABF !important;
	padding: 5px;
}

tr.spsBoxHeadSoft td, tr.spsBoxHeadSoft th, .spsBoxHeadSoft, .spsBoxedHeadSoft {
	background-color: #dbdff0 !important;
	padding: 5px;
}

.spsBoxHeadSoft, .spsBoxedHeadSoft {
	border-color: #c2c2c2 !important;
}

.spsBoxHead, .spsBoxHeadSoft {
	border-bottom: 0 !important;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
}

.spsBoxHead,
.spsBoxHead *,
tr.spsBoxHead td,
tr.spsBoxHead th,
tr.spsBoxHead td a,
tr.spsBoxHead th a,
.spsBoxedHead,
.spsBoxedHead a {
	color: #FFF !important;
	font-size: 1em;
	font-weight: bold !important;
}

.spsBoxHeadSoft,
.spsBoxHeadSoft a,
tr.spsBoxHeadSoft td,
tr.spsBoxHeadSoft td a,
tr.spsBoxHeadSoft th,
tr.spsBoxHeadSoft th a,
.spsBoxedHeadSoft,
.spsBoxedHeadSoft a {
	color: #000 !important;
	font-size: 1em;
	font-weight: bold !important;
	margin: initial !important;
}

.spsBoxHead a:hover, .spsBoxedHead a:hover, .spsBoxHeadSoft a:hover, .spsBoxedHeadSoft a:hover {
	text-decoration: underline;
}

/*Put on the TR tag.*/
.spsBoxRow td {
	border-bottom: 1px solid #CCCCCC;
}

.spsBoxRow:last-child td {
	border-bottom: 0 !important;
}
/*Put on a SPAN or DIV tag for note text inside a spsBox.*/
.spsBoxNoteText {
	color: #787878;
	font-size: 0.8em;
}


/* Fix headers used with the header box styles. */
h2.spsBoxHead, h2.spsBoxHeadSoft {
	font-family: inherit !important;
	font-size: 1.25em !important;
}

h3.spsBoxHead, h3.spsBoxHeadSoft {
	font-family: inherit !important;
	font-size: 1.1em !important;
}


/*
spsBoxPopup classes:  For use with Javascript-created popups and the 
					  functions in "/Tools/js/Popup.js". 
*/
.spsBoxPopup {
	background-color: #F7F7F7 !important;
	border: 2px solid black;
	display: none;
	padding: 5px;
	position: absolute;
	z-index: 100;
}

	.spsBoxPopup a img {
		display: inline;
		vertical-align: middle;
	}

	.spsBoxPopup table {
		border-collapse: separate;
		/*Fix issue in Firefox*/
	}

.spsBoxPopupIframe {
	border: 0;
	display: none;
	position: absolute;
	z-index: 0;
	filter: 'progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)';
}


/*Flyouts*/
.SPSFlyout div {
	margin: 0 !important;
}

.SPSFlyout h2 {
	border: 0;
}


/*For use on form fields.*/
.spsFormField {
	font-family: Arial, Helvetica, Geneva, sans-serif;
	font-size: 1em !important;
}

.spsFormFieldSmall {
	font-family: Arial, Helvetica, Geneva, sans-serif;
	font-size: 0.9em !important;
}

/*
Turn "button" and "a" elements into buttons.
*/
.spsButton, .spsButtonSmall, .spsButtonSmaller {
	background: #f2f2f2 url("/Scripts/jquery1.10/css/images/ui-bg_glass_85_f2f2f2_1x400.png") repeat-x scroll 50% 50%;
	border: 1px solid #DBDBDB;
	border-radius: 3px 3px 3px 3px;
	color: black !important;
	display: inline-block;
	font-weight: bold !important;
	overflow: visible;
	text-align: center;
}

.spsButton {
	font-size: 1em !important;
	padding: 6px 19px 7px;
}

.spsButtonSmall {
	font-size: 0.9em !important;
	padding: 3px 8px 2px 8px;
}

.spsButtonSmaller {
	font-size: 0.8em !important;
	font-weight: normal !important;
	min-width: 30px;
	padding: 1px 5px 2px;
}

.spsButton:hover, .spsButtonSmall:hover, spsButtonSmaller:hover {
	background: white;
	border-color: #585858;
	text-decoration: none !important;
}

/*District page titles*/
.spsPageTitle {
	font-size: 1.1em !important;
	font-weight: bold !important;
}


/*
spsTextButton classes: Use on "a" elements or .Net LinkButton controls.
*/
.spsTextButton {
	font-weight: bold !important;
	/*color: #a55157 !important;*/
	font-size: 1em !important;
}

.spsTextButtonSmall {
	/*color: #a55157 !important;*/
	font-size: 0.9em !important;
	font-weight: bold !important;
}

.spsTextButtonLarge {
	font-weight: bold !important;
	/*color: #a55157 !important;*/
	font-size: 1.1em !important;
}

/*
Misc text classes
*/
.spsErrorText {
	color: #bc0000 !important;
}

.spsHiliteText {
	color: #bc0000 !important;
	font-weight: bold !important;
}

.spsHiliteSmallText {
	color: #bc0000 !important;
	font-size: 0.8em !important;
	font-weight: bold !important;
}

.spsSmallText, .smaller {
	font-size: 0.8em !important;
}

tr.spsSmallText td, tr.smaller td {
	font-size: 0.8em !important;
}

.spsLargeText, .larger {
	font-size: 1.1em !important;
}

tr.spsLargeText td, tr.larger td {
	font-size: 1.1em !important;
}

.spsNoteText {
	font-size: 0.9em !important;
	color: #999999;
}
/*
Tab styles
*/
.spsTabSelected {
	font-size: 1em;
	font-weight: bold !important;
	background-color: #fff;
	border: 1px solid #000000;
	border-bottom: none !important;
	text-align: center;
}

	.spsTabSelected a {
		color: #A55131;
	}

		.spsTabSelected a:hover {
			text-decoration: none;
		}

.spsTabUnselected {
	background: #e3e3e3;
	border: 1px solid #000000;
	font-weight: bold !important;
	text-align: center;
}

	.spsTabUnselected a {
		color: black;
	}

		.spsTabUnselected a:hover {
			font-size: 1em !important;
			text-decoration: underline;
		}

.spsTabEmpty {
	border-bottom: 1px solid #000000 !important;
}

.spsTabSection {
	border-left: 1px solid #000000 !important;
	border-right: 1px solid #000000 !important;
	border-bottom: 1px solid #000000 !important;
	background-color: #f7f7f7;
	padding: 5px;
	padding-top: 10px;
}


/*
Pure CSS Styles - Compatible with Schoolwires Template
*/

.pure-g > div {
/*
	margin-bottom: 0 !important;
	margin-top: 0 !important;
	padding-bottom: 0 !important;
	padding-top: 0 !important;
*/
}

.pure-g [class*=pure-u] {
	color: inherit !important;
}

#top-bar .pure-g [class*=pure-u] {
	color: #E1E1E1 !important;
}

.pure-g [class*=pure-u] div.sps-page-title {
	padding: 10px 0 0 10px;
}

.pure-button {
	background-color: rgb(245, 245, 245);
	border: 1px solid rgb(219, 219, 219);
	border-radius: 3px;
	color: black !important;
	font-weight: bold !important;
	padding: 0.2em 0.7em;
}

.pure-button:hover {
	background-color: white;
}

.pure-u-1, .pure-u-1-1, .pure-u-24-24, .pure-u-5-5 {
	width: 99%;
}


/*Button size modifiers*/
a.pure-button:visited {
	color: black !important;
}

.button-xsmall, .button-xsmall > span {
	font-size: 72% !important;
	padding: 0.2em 0.7em;
}

.button-small, .button-small > span {
	font-size: 82% !important;
	padding: 0.2em 0.7em;
}

.button-large, .button-large > span {
	font-size: 110% !important;
}

.button-xlarge, .button-xlarge > span {
	font-size: 115% !important;
}

/*Button color modifiers*/
.button-success,
.button-error,
.button-warning {
	color: white;
	border-radius: 4px;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}

.button-success {
	background: rgb(28, 184, 65); /* this is a green */
}

.button-error {
	background: rgb(202, 60, 60); /* this is a maroon */
}

.button-warning {
	background: rgb(223, 117, 20); /* this is an orange */
}


/*
* Print Styles
*/
@media print {
	.noprint {
		display: none;
	}
	
	a {
		color: black;
		text-decoration: none;
	}
	
	body {
		background-image: none;
	}
	
	.printonly {
		display: block;
	}

	.spsBoxHead th, .spsBoxHead td {
		background-color: white !important;
	}
	
	.spsBoxHead {
		border: 0px !important;
		border-bottom: 2px solid black !important;
	}
}

@media screen {
	.printonly {
		display: none;
	}
}


/*
* Responsive Styles
*/

.mobile {
	display: none;
}

/*Mobile*/
@media screen and (max-width: 35.5em) {
	.centerbox {
		margin-left: 0;
		margin-right: 0;
		width: 99% !important;
	}

	.nomobile, .nomobile-sm {
		display: none !important;
	}

	.mobile {
		display: inherit;
	}
}

@media screen and (max-width: 48em) {
	/*#main-content {
		padding-left: 5px;
		padding-right: 5px;
	}*/

	.nomobile, .nomobile-md {
		display: none !important;
	}

	.mobile {
		display: inherit;
	}
}


/* Template fixes */
/*
#aspnet {
	margin-top: 1em;
}

#aspnet ul {
	padding-left: 2em;
}

#content-meat {
	grid-template-columns: minmax(2vw,1fr) minmax(220px,280px) minmax(473px,1640px) minmax(2vw,1fr) !important;
}

#pageTitleWrapper {
	margin-bottom: 0.5em !important;
}
*/
