@font-face {font-family:'Droid Sans';src:local('Droid Sans'), url('/fonts/DroidSans-webfont.woff') format('woff'),url('/fonts/DroidSans-webfont.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}

body{font-family:'Droid Sans',sans-serif;width:100%;min-width:480px;margin:0;padding:0;box-sizing:border-box;background:#FFF;text-align:center}

article{display:block;padding:0 1em 1em}
table{width:100%;box-sizing:border-box;table-layout:fixed;text-align:center;border-collapse:collapse}

h1,h2,h3{text-decoration:none;text-transform:uppercase}
h2{margin:0 auto 0.5em;font-size:2.222rem;line-height:2.5rem;}
h3{background:#000;color:#FFF;width: 100%;font-size:18px;margin-top: 10px;line-height:2em}
fieldset{border:0;padding:0}
label{font-weight:bold}
label,input,select,textarea,option{font-size:16px;font-family:inherit}

ul{list-style:none;padding:0}
@media screen and (max-width:768px){td input[type=button]{min-height:2em}}

thead th,tfoot th{background:#000;background:linear-gradient(#333,#000);color:#FFF;padding:3px;box-sizing:border-box}
th{padding:3px;box-sizing:border-box}
td,th{border:1px solid #888}tbody tr{background:#FFF}tbody tr:nth-child(even){background:#EEE}
td input{width:100%;box-sizing:border-box;text-align:center}
td input[type=button]{width:95%;height:95%;margin:0 2.5%;min-height:1.5em;white-space:normal}
td input[type=checkbox]{margin:0;width:1em;height:1em}
.tablet td input[type=button]{min-height:4em;width:80%;margin:10%}
th.orderno{width:70px}
th.quantity,th.DATE,th.SR{width:60px}
td.blank{background:#333}
td.alert{background:#F11 !important;color:#000 !important;font-weight:bold}tr:nth-child(even) td.alert{background:#E00 !important}
td.warn{background:#FF1 !important;color:#000 !important;font-weight:bold}tr:nth-child(even) td.warn{background:#EE0 !important}
td.active{background:#1F1 !important;color:#000 !important;font-weight:bold}tr:nth-child(even) td.active{background:#0E0 !important}
td select{width:100%;margin:0}
tr.complete{background:#9FF}tr.complete:nth-child(even){background:#8EE}
tr.complete td.alert,tr.complete td.warn{background:transparent !important}
.viewonly td.action,.viewonly th.action{display:none}
td.comment{white-space:pre-wrap;overflow-wrap:break-word}

input[type=text]:focus,select:focus,textarea:focus{box-shadow:0 0 .5em #00F}
input[type=text]{padding-left:0.5em}
input[type=checkbox],input[type=radio]{width:1em;height:1em;margin:0;padding:0;vertical-align:middle;border:none}
input[type=button].checkpass{width:45%;background:#6F6;background:linear-gradient(to bottom,#DFD,#1A1)}
input[type=button].checkfail{width:45%;background:#F66;background:linear-gradient(to bottom,#FDD,#D11)}
textarea{box-sizing:border-box;max-width:100%}

.modalDialog{display:none;font-size:1rem;text-align:center;position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(222,222,222,0.8);z-index:100;opacity:0;transition:opacity 100ms ease-in;pointer-events: none;overflow:scroll}
.modalDialog.show{display:inherit;opacity:1;pointer-events:auto}
.modalDialog>div{width:100%;max-width:480px;position:relative;margin:auto;padding:1em;border-radius:.75em;border:1px solid #333;box-shadow:0 0 .5em #333;background:#fff;background:linear-gradient(#fff,#ccc)}
.modalDialog h2{text-align:center}
.modalDialog input,.modalDialog select,.modalDialog textarea{display:block;margin:0.5em auto}
.close{color:#333;position:absolute;top:0;right:0;width:2em;line-height:2em;text-align:center;text-decoration:none;font-weight:bold;cursor:pointer}.close:hover{color:#F00}

#Submit{
	color:#FFF;
    border:0;
    background:#ffa123;
    font-weight:normal;
    text-transform:uppercase;
    font-size:20px;
    margin-bottom: 10px;
    margin-top: 10px;
    width: 302px;
    height: 2em;
}

.banner{	display:-webkit-flex;display:flex;
	-webkit-justify-content:space-around;justify-content:space-around;
	margin:0;
	padding:0;
	padding:20px;
	max-height:unset;
	background:#e8e8e8;
}

.banner svg{max-height:100px;margin:10px;width:100%}
.banner img{max-height:120px;margin:0px;}
.sballlogo{max-width:119px}
.sballlogo path{fill:#000}
.deadlylogo{display:block;max-width:378px;align-self:center;flex:0 0 67%;}
.landscapelogo{display:none}

header{
	top:0;
	background:#888;border-bottom: 1px solid #8888;
	box-shadow: 0 1px 1px 0 #8888;
	display: block;
	width: 100%;
	font-size:1.25rem;
	letter-spacing:1px;
}
	
#SiteMenu > ul {
	display:-webkit-flex;display:flex;
	-webkit-flex-wrap:wrap;flex-wrap:wrap;
	-webkit-justify-content:center;justify-content:center;
	margin:0;
	padding:0;
}
	
#SiteMenu > ul > li {
	-webkit-flex:0 1 auto;flex: 0 1 auto;
	margin:0;
	padding:0;
	position:relative;
	transition:all linear 0.1s;
}
		
#SiteMenu > ul > li:hover {
	background:#FFF8;
	z-index: 100;
}
			
#SiteMenu > ul > li span + div {
	background:linear-gradient(to bottom,#888 0,#333 100%);
	border-radius:0 0 2px 2px;
	box-shadow:0 3px 1px rgba(0,0,0,.05);
	display:none;
	position:absolute;
	width:inherit;width:max-content
}
			
#SiteMenu > ul > li:hover span + div {
	display: block;
}
				
#SiteMenu > ul > li span + div > ul > li {
	margin: 0;
	padding: 0;
}
					
#SiteMenu > ul > li span + div > ul > li > a {
	color: rgba(255,255,255,.9);
	display: block;	
	padding: .25rem 1rem;
	text-decoration: none;
	text-transform: uppercase;
}
						
#SiteMenu > ul > li span + div > ul > li:hover > a {
	background-color: rgba(0,0,0,.15);	
}
	
#SiteMenu > ul > li > a , #SiteMenu > ul > li > span {
	color:#fff;
	display:-webkit-flex;display: flex;
	-webkit-align-items:flex-start;align-items: flex-start;
	font-weight:200;
	padding:.25rem 1rem;
	text-decoration: none;
	text-shadow:0 1px 1px rgba(0,0,0,.1);
	transition:all linear 0.1s;
}
			
#SiteMenu > ul > li > a > div > span {
	margin: 4px 0 0;  
}

header hr{
	margin:0
}

@media screen and (max-width:768px){
	td input[type=button]{min-height:2em}
	input,select,textarea,#PageNav a{font-size:16px !important}

	td input[type=button]{width:95%;height:95%;margin:0 2.5%;-webkit-appearance: none;-webkit-border-radius: 0;border-radius:0;background:#6F6;background:linear-gradient(to bottom,#DDD,#CCC);min-height:1.5em;max-height:3em;min-width:1.5em;max-width:6em;white-space:normal}
	article{padding:0}
	.modalDialog{width:100%;height:100%}
	.modalDialog>div{max-height:100%;-webkit-overflow-scrolling:touch;overflow-y:scroll;}
	.modalDialog>div{max-width:100%;box-sizing:border-box;position:relative;margin:0% auto;padding:1em;border-radius:.75em;border:1px solid #333;box-shadow:0 0 .5em #333;background:#fff;background:linear-gradient(#fff,#ccc)}
	article h1{margin:0;text-align:center;background:#888;color:#FFF}
	article form{margin:0}
	article hr{display:none;margin:0}
	.banner{padding:0}
	.sballlogo,.deadlylogo{display:none}.landscapelogo{display:block}
	header{position:initial}
}	


.Confirmation{bottom:0;background:#FFF;color:#000;width:100% !important}
.Confirmation h3{margin:0 0 10px}
.Confirmation a{color:inherit}


#SubMenu {
	display:-webkit-flex;display:flex;
	-webkit-flex-wrap:wrap;flex-wrap:wrap;
	-webkit-justify-content:center;justify-content:center;
	margin:0;
	padding:0;
}
	
#SubMenu > li {
	-webkit-flex:0 1 auto;flex: 0 1 auto;
	margin:0;
	padding:0;
	position:relative;
	transition:all linear 0.1s;
}
		
#SubMenu > li:hover {
	background:#FFF8;
	z-index: 100;
}

#SubMenu > li > a{
	color:#fff;
	display:-webkit-flex;display: flex;
	-webkit-align-items:flex-start;align-items: flex-start;
	font-weight:200;
	padding:.25rem 1rem;
	text-decoration: none;
	text-shadow:0 1px 1px rgba(0,0,0,.1);
	transition:all linear 0.1s;
}