/*
    DanceScoring.com Global Stylesheet
    Copyright(c) 2021.
    Iowa Web Development / HostIowa.net
*/


/* IMPORTS
----------------------------------------------------------*/
@import url(https://fonts.googleapis.com/css?family=Oswald:400,700);


/* HTML ELEMENTS
----------------------------------------------------------*/

html, body {background: #FFFFFF; font-size: 1.3em; margin: 0px; line-height: 135%; font-family: Arial, Helvetica, sans-serif;}

img {border: 0px;}

a {color: #cc0000; text-decoration: none; font-weight: normal; }
a:hover {text-decoration: underline;}

h1 {font-size: 24px; margin: 0; padding: 0; font-family: 'Oswald'}
h2 {font-size: 21px; margin: 0; padding: 0; font-family: 'Oswald'}
h3 {font-size: 18px; margin: 0; padding: 0; font-family: 'Oswald'}
h4 {font-size: 16px; margin: 0; padding: 0; font-family: 'Oswald'}
h5 {font-size: 14px; margin: 0; padding: 0; font-family: 'Oswald'}
h6 {font-size: 12px; margin: 0; padding: 0; font-family: 'Oswald'}


/* CLASS ELEMENTS
----------------------------------------------------------*/

.clear {padding: 0px; margin: 0px; clear: both;}
.fullsize {width: auto !important; height: auto !important; overflow: hidden;}
.uppercase {text-transform: uppercase;}
.font {font-family: 'Oswald' !important;}
.noshow {display: none;}
.small {font-size: 14px !important; line-height: 120%;}
.med {font-size: 13px !important; line-height: 130%;}
.italic {font-style: italic;}
.point {cursor: pointer;}

.primary {color: #cc0000 !important;}
.secondary {color: #DEBEDD !important;}
.grey {color: #58595B !important;}
.silver {color: #CCCCCC !important;}
.white {color: #FFFFFF !important;}
.black {color: #000000 !important;}

.bg_primary {background-color: #cc0000 !important;}
.bg_secondary {background-color: #DEBEDD !important;}
.bg_black {background-color: #000000 !important;}
.bg_grey {background-color: #58595B !important;}
.bg_silver {background-color: #F2F2F2 !important;}
.bg_manilla {background-color: #FFFFE2 !important;}
.bg_white {background-color: #FFFFFF !important;}

.bg_none {background: none !important;}
.bg_stripe {background-image: url(/images/bg_stripe.png) !important;}

.bd_primary {border: solid 1px #cc0000 !important;}
.bd_secondary {border: solid 1px #DEBEDD !important;}
.bd_black {border: solid 1px #000000 !important;}
.bd_grey {border: solid 1px #58595B !important;}
.bd_silver {border: solid 1px #CCCCCC !important;}
.bd_manilla {border: solid 1px #FFFFE2 !important;}
.bd_white {border: solid 1px #FFFFE2 !important;}
.bd_none {border: none !important;}

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

.align_Left {float: left; margin-right: 20px;}
.align_Center {margin: 0 auto;}
.align_Right {float: right; margin-left: 20px;}

.inline {display: inline !important;}
.block {display: block !important;}
.bold {font-weight: bold !important;}
.normal {font-weight: normal !important;}

.error {display: block; border: solid 1px #C00000; background: #FFC1C1 url(/images/icons/error.png) no-repeat 6px 50%; margin: 4px 0px; padding: 4px 4px 4px 30px; text-align: left; font-weight: bold; color: #C00000; font-size: 12px;}
.alert {display: block; border: solid 1px #FFD700; background: #FFEC8B url(/images/icons/alert.png) no-repeat 6px 50%; margin: 4px 0px; padding: 4px 4px 4px 30px; text-align: left; font-weight: bold; color: #333333; font-size: 12px;}
.information {display: block; border: solid 1px #008B00; background: #BCEE68 url(/images/icons/information.png) no-repeat 6px 50%; margin: 4px 0px; padding: 4px 4px 4px 30px; text-align: left; font-weight: bold; color: #008B00; font-size: 12px;}

.margin0 {margin: 0 !important;}
.margin5 {margin: 5px 0;}
.margin5bottom {margin-bottom: 5px;}
.margin10 {margin: 10px 0;}
.margin20 {margin: 20px 0;}
.margin20top {margin-top: 20px;}
.margin20bottom {margin-bottom: 20px;}

.padding {padding: 10px 30px !important;}
.padding0 {padding: 0;}
.padding5 {padding: 5px;}
.padding10 {padding: 10px;}
.padding20 {padding: 20px;}
.padding20top {padding-top: 20px;}
.padding30 {padding: 30px;}

.width100 {width: 100px !important;}
.halfwidth {width: 50% !important;}
.onethird {width: 30% !important}
.twothird {width: 60% !important}
.fullwidth {width: 100% !important;}

.button {display: inline-block; background-color: #cc0000; color: #fff; font-size: 1.2rem; padding: 0.75rem 3rem; font-family: 'Oswald'; text-transform: uppercase; letter-spacing: 1px; border: solid 1px #000;}
.button:hover {background-color: #000; color: #fff; text-decoration: none;}



/* LINK ELEMENTS
----------------------------------------------------------*/

a.breadcrumb {font-size: 11px; text-decoration: none;}
a.breadcrumb:hover {text-decoration: underline;}


/* MODAL ELEMENTS
----------------------------------------------------------*/
.modalBackgroundProgress {background: rgba(0, 0, 0, 0.5); z-index: 200001 !important; position: absolute;}
.TelerikModalOverlay {background: rgba(0, 0, 0, 0.5) !important; opacity: 1 !important;}
.updateProgress {border: solid 1px #000000; background-color: #FFFFFF; vertical-align: middle; text-align: center; font-size: 9pt; padding: 2em 3em; position: fixed; left: 45%; top: 40%;}

.modalWindow.scoring {height: 710px !important; width: 700px !important;}
.modalWindow.medium {height: 420px !important; width: 700px !important;}
.rwContent {padding: 0 !important; height: 93% !important;}


/* TABLE ELEMENTS
----------------------------------------------------------*/
table {width: 100%; border-collapse: collapse;}
table.noheader {}
table:not(.noheader) tr:first-child {background-color: #000; color: white; font-weight: bold; font-size: 0.7em; vertical-align: bottom;}
table tr {border-bottom: solid 1px #ccc;}
table tr:nth-child(even) {background: #eee;}
table tr:not(:first-child):hover {background: #FFFFE2;}
table td input:not([type=checkbox]):not([type=radio]):not([type=image]):not(.ruButton) {width: 90%;}
table.padding5 td {padding: 0.5em !important;}
table.font-smaller td {font-size: 0.75em !important;}
table td {padding: 0.4em 0;}

/* FORM ELEMENTS
----------------------------------------------------------*/
.form {width: 100%;}

input, select, textarea {font-family: Arial, Helvetica, sans-serif; font-size: 0.9em; padding: 0.1em; border: solid 1px #333;}
input.login {font-size: 1.5em; padding: 0.25em; text-align: center; max-width: 90%;}
input.normal {font-size: 1.0em !important; padding: 0.2em !important; text-align: left !important; max-width: 100% !important;}


/* CUSTOM ELEMENTS
----------------------------------------------------------*/
footer {position: fixed; bottom: 0; left: 0; display: block; margin-top: 40px; background-color: #222; color: #fff; padding: 4px 0; font-size: 11px; line-height: 100%; text-transform: uppercase; letter-spacing: 1px; width: 100%; text-align: center;}
.content {padding: 20px;}

.file-row {font-size: 21px !important;}
.ruButton {font-size: 14px !important;}

ul.cards {margin: 1em auto; text-align: center; padding: 0;}
ul.cards li {display: inline-block; width: 25%}
ul.cards li a {display: block; border: solid 1px #ccc; box-shadow: #ccc 0 0 10px; padding: 1.2em 1em; margin: 1em;}
ul.cards li a:hover {background-color: rgba(0,0,0,0.03); text-decoration: none;}
ul.cards li a img {max-height: 60px;}
ul.cards li a span {display: block;}

img.logo {max-height: 30vh;}

#navtop {
	position: fixed;
	z-index: 9999;
	display: block;
	bottom: 1rem;
	right: 1rem;
	border: solid 1px #000;
	background: rgba(255, 255, 255, 0.7);
	padding: 0.5rem;
	text-align: center;
	font-size: 0.6rem;
	line-height: 100%;
	text-transform: uppercase;
	font-weight: bold;
}

	#navtop i {
		display: block;
		width: 0;
		height: 0;
		border-left: 1rem solid transparent;
		border-right: 1rem solid transparent;
		border-bottom: 1rem solid #000;
		margin: 0 auto 0.25rem;
	}

	#navtop:hover {background: rgba(255, 255, 255, 1.0);}


@media print {
	.no-print {
		display: none !important;
	}
	.break {
		page-break-after: always;
	}
	html, body {
		font-size: 1em;
	}
	#navtop {
		display: none !important;
	}
	h1, h2, h3, h4, h5, h6 {
		page-break-after: avoid;
		break-after: avoid-page;
		margin-bottom: 10px;
	}
	section {
		page-break-inside: avoid !important;
	}
}

/* medium */

@media only screen and (min-width: 46.9em) and (max-width: 64em) {

	html, body {font-size: 1.1em;}

	/*ul.cards li {width: 30%}*/

}

/* small */
@media only screen and (max-width: 46.875em) {

	html, body {font-size: 1.1em;}
	img.logo {max-height: 20vh;}

	ul.cards li {width: 80%}

	footer {font-size: 9px;}
}