html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, pre, a, address, big, code,
del, em, ins, q, s, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, embed,
footer, menu, nav, output, section,
audio, video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}

article, footer, header, menu, nav, section{display:block;}
html{overflow-y:scroll;background:#FFF;}
img, embed, object, video{max-width:100%;border:none}
body{font-family:Verdana, sans-serif;font-size:1em;line-height:1.6em;color:#000;}

.hidden{display:none;}
.text_mid{text-align:center}
.text_right{text-align:right}
.text_smaller{font-size:80%;}
.text_fill{white-space:nowrap;}

h1, h2, h3, h4{margin-bottom:0.8em;line-height:1em;text-rendering:optimizeLegibility;}
p, ul, ol, dl{font-size:1em;line-height:1.6em;margin-bottom:1.6em;}
ul{list-style-type:disc;margin-left:3em;}
ol{list-style-type:decimal;margin-left:1.6em;}
b, strong{font-weight:700;}
i, em{font-style:italic;}
a, a:visited{outline:none;color:#0077BB;text-decoration:none;}
a:hover{outline:none;text-decoration:none;}
a:active, a:focus{outline:none;}

nav{display: flex;
    justify-content: space-around;
	align-items: center;
	background-color:#0077BB;
	padding:5px;}
nav ul, nav ol{list-style:none;margin:0;padding:0;}
nav>span{font-weight:bold;font-size:120%;color:#1dd7ef}
.nav{max-width:100%;text-align:left;padding:4px 8px;border-bottom:0px solid #fff;}
.nav li{display:inline;margin:10px;padding-bottom:4px;}
.nav li.active{border-bottom:2px solid #fff;padding-bottom:2px}
.nav li:hover{opacity:0.7}
.nav li a{color:#fff;font-size:1em;font-weight:700;text-decoration:none;}
.nav li a:active{opacity:0.5;}
.nav li a img{vertical-align:middle;}
#nav-fixed{position:fixed;top:0;width:100%;left:50%;margin:0 0 0 -50%;z-index:100;background-color:#0077BB;}
#nav-spacer{position:relative;top:0;width:100%;left:50%;margin:0 0 0 -50%;z-index:1;background-color:#0077BB;}

div.homeContainer{
	display:flex;
	flex-direction:column;
	padding:10px 0;
}
div.homeContent{
    display: flex;
    flex-direction: column;
    align-items: center;
	margin-bottom:5px;
	padding:5px;
}
div.space_between{
	display: flex;
    justify-content: space-between;
}
form{
	flex:1;
}
.flex_centre{
	display: flex;
    flex-direction: column;
    align-items: center;
}
fieldset{
	display:flex;
	justify-content: center;
	flex:1;
	margin:10px;
	background-color: lightblue;
	border:2px solid cornflowerblue;
	border-radius:2px;
}
button{
	font-size:100%;
}
fieldset.fsAction{
	justify-content: space-evenly;
	padding-bottom:10px;
}
fieldset.fsAction button{
	margin:0 20px;
}
fieldset.fsCreate{
	flex-direction:column;
	padding:10px;
}
fieldset.fsCreate button{
	margin-top:8px;
}
fieldset.fsSave{
	margin:4px 0 24px;
	padding:5px;
}
legend{
	margin-left:20px;
	padding:0 10px;
	border-radius: 4px;
	background-color: inherit;
	text-decoration: underline;
}
ul.hidenodes{
	list-style:none
}
table {
	margin: 2px 4px 4px;
	border-collapse: collapse;
}
th, td {
	padding: 0 4px;
	border:1px solid cornflowerblue;
	border-radius: 2px;
}
th {
	background-color: lightblue;
	font-weight:bold;
	vertical-align: middle;
}
.col_button{
	padding: 0 0 0 6px;
	background-color:white;
	border:none;
	text-align:center;
}
.col_total{
	width:30px
}
input{
	font-size: 100%;
}
input#date_new{
	font-size: 110%;
}
input.text_new{
	width:180px;
}
input.ip_flex{
	flex:1;
}
select{
	font-size:105%;
	padding:1px;
	background-color: lightcyan;
}
textarea{
	flex:1;
}
a.info_link{
	position:absolute;
	top:0;
	right:10px;
	text-decoration: underline;
}
.for_print{margin:4px 30px;}
.hide_for_print{display:none !important}

.container-full{padding-top:0.5em;width:100%;text-align:center}
.container{padding:0;margin:0 auto;position:relative;max-width:60em;}
.container-cols{margin:0 -1em;}
.clearfloat{clear:both;}
#footer{text-align:center;background:#0077BB;color:#eee;z-index:30;position:relative;padding-bottom:28px;}
#footer.container-full{padding-top:0;}
.column{width:33.3333%;margin:0;padding:0 1em;border:0 none;display:inline-block;float:left;box-sizing:border-box;}
.column-fixed{width:330px;margin:0;padding:0 1em;border:0 none;display:inline-block;box-sizing:border-box;}
.col1{width:260px;margin:0;padding:0 1em;border:0 none;display:inline-block;float:left;box-sizing:border-box;}
.col2{width:730px;margin:2px 0;padding:0 1em;border:0 none;display:inline-block;float:left;box-sizing:border-box;}
#content .column p{padding-bottom:0.5em}
#footer .column{text-align:center;margin-bottom:1em}
#footer a, #footer a:visited{color:#969A7A;}

a#downarrow{display:none;position:fixed;bottom:0px;left:50%;min-width:88px;min-height:26px;margin:0 0 0 -44px;padding:0;opacity:0.7;z-index:20;
	background:url(../img/down.png) no-repeat top center;transition:all ease-in-out .4s;-webkit-transition:all ease-in-out .4s;
	-moz-transition: all ease-in-out .4s;-o-transition:all ease-in-out .4s;-webkit-backface-visibility:hidden;}
a#downarrow:hover{opacity:1;cursor:pointer}
h1{text-align:center;font-size:3em;font-weight:600;line-height:1.3em;margin:0.5em 0;}
h2{margin-top:4px;text-align:center;font-size:1.3em;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#0077bb;}
h3{width:100%;margin-bottom:4px;padding:5px;background-color:#0077bb;color:white;text-align:center;font-weight:bold;}
h3 span {font-size:150%;font-weight:300;line-height:1.1em;display:inline-block;width:100%;color:#382E15;}
h4{margin:10px;text-align:center;font-weight:700;font-size:125%;color:#0077bb}
h5{font-weight:700;font-size:1.2em}
h6{font-weight:700;font-size:1.1em;margin:24px 0 4px;color:red;text-align:center}
#footer h2{color:#fff;display:block;text-align:center;margin-bottom:0.2em}
#footer p{font-size:0.7em;margin:0}
p.success{color:#267F00;text-align:center;font-size:1.4em;margin-bottom:30px}
p.error{color:#FF0000;text-align:center;font-size:1.4em;margin-bottom:30px}


form.score_table th,form.score_table td{width:90px;text-align:center}
form.score_table td{font-size:110%;line-height:125%}
form.score_table td.pair_names{background-color:lightblue}
form.score_table input{width:40px;padding:0;border:none;font-size:125%;text-align:center;background-color:inherit}
/* Chrome, Safari, Edge, Opera */
form.score_table input::-webkit-outer-spin-button,
form.score_table input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* Firefox */
form.score_table input[type=number] {
  -moz-appearance: textfield;
}

table.results{font-size:100%}
table.results td{text-align: center}

div.saved_dialog{
	position:fixed;
	margin-top:50px;
	background-color:#267F00;
	padding:20px;
	border-radius:6px;
}

.hide_slowly {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 2s, opacity 2s linear;
}


@media only screen and (min-width:768px) and (max-width:1023px){
	.nav li{margin:0 3%;}
	.hidetablet{display:none}
	#content .column{width:50%}
	.col1{width:33%}
	.col2{width:66%}
}
@media only screen and (max-width:767px){
	.container{max-width:100%;padding:0 0.5em}
	h1{font-size:2em;padding:0;}
	.nav li{margin:0 10px;font-size:1.1em;}
	.nav li a img{padding-top:0.1em;}
	.container-cols{margin:0;}
	.column{width:100%}
	.col1{width:100%}
	.col2{width:100%}
	.hidemob{display:none}
}
@media only screen and (max-width:319px){
	body{min-width:300px;font-size:90%}
	.container{max-width:100%;padding:0 0.2em}
}