html {
	scroll-behaviour: smooth
}

body {
	/* font-family: 'Roboto Condensed', sans-serif; */
	font-family: sans-serif;
	color: #353839;
	font-size: 120%;
	line-height: 130%;
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 800px;
	margin-left: auto; margin-right: auto;
	position: relative;
}

div { margin: 0; padding: 0; }


.form_item { margin-bottom: 1em; }

input {
    margin: 0; paddding: 12px;
		width: 100%; height: 1.5em; font-size: 1.5em;
    -webkit-border-radius: 30px;;
    -moz-border-radius: 30px;;
    border-radius: 30px;; border: 1px solid #23282d;
}

input:hover, select:hover, textarea:hover { background: #d2f2f8; }

textarea {
		margin: 0; paddding: 12px;
    width: 100%; height: 6em;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
		border: 1px solid #23282d;
}

select {
		margin: 0; paddding: 12px;
    width: 100%; font-size: 1.5em; height: 1.5em; line-height: 1.5em;
    -webkit-border-radius: 30px;;
    -moz-border-radius: 30px;;
    border-radius: 30px;; border: 1px solid #23282d;
}

.submit_item input { color: #101068; font-weight: normal; height: 1.4em; font-size: 1.5em; background: #d2f2f8; border-radius: 30px; width: 100% important; }
.submit_item input:hover { color: #101068; background: #d2f2f8; }

.remove_button { width: auto; height: 36px; border: 1px solid black; text-stroke: 1px solid black; border-radius: 30px;; background: #d2f2f8; }

h1 {
    margin: 0; padding: 6px 0; font-size: 2.5em; color: #b0e0e6; text-shadow: 2px 2px #23282d;
    letter-spacing: 2px;
    -moz-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(3deg, 0deg);
    -webkit-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(3deg, 0deg);
    -o-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(3deg, 0deg);
    -ms-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(3deg, 0deg);
    transform: scale(1) rotate(0deg) translate(0px, 0px) skew(3deg, 0deg);
		position: absolute; top: 6px; right: 6px; width: auto; display: inline-block;
		z-index: 99;
}
h1 a { text-decoration: none; color: #b0e0e6; }

.freeze_logo {
	color: #b0e0e6; text-shadow: 2px 2px #23282d;
	letter-spacing: 2px;
	-moz-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(3deg, 0deg);
	-webkit-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(3deg, 0deg);
	-o-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(3deg, 0deg);
	-ms-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(3deg, 0deg);
	transform: scale(1) rotate(0deg) translate(0px, 0px) skew(3deg, 0deg);
}

#header {
    padding: 6px;
}

#main {
    width: auto;
    margin-left: auto;
    margin-right: auto;
		text-align: center;
}

.details_table {
    border-collapse: collapse;
    border: 1px solid #23282d;
		width: 100%;
}


.details_table th { background: #b0e0e6; text-align: center; border: 1px solid #23282d; padding: 2px; }

.details_table td { text-align: center; border: 1px solid #23282d; padding: 2px; #23282d; border-radius: 30px;; }

.big_textarea { height: 18em; }

.green { font-weight: bold; color: darkgreen; background: palegreen; padding: 6px; border: 1px solid darkgreen; border-radius: 3px; }
.red { font-weight: bold; color: darkred; background: lightpink; padding: 6px; border: 1px solid darkred; border-radius: 3px; }
.orange { font-weight: bold; color: #fb4f14; background: #ffd569; padding: 6px; border: 1px solid #fb4f14; border-radius: 3px; }

.centered { text-align: center; font-style: italic; }

.link_button { margin: 0; paddding: 0; margin-bottom: 4px; }
.link_button a {
		margin: 0; paddding: 0;
		display: block; padding-top: 18px; height: 36px;
		text-align: center; text-decoration: none;
		font-size: 1.4em; background: #d2f2f8; border: 1px solid #23282d;
		border-radius: 30px; width: 100%;
}
.link_button a:link, .link_button a:visited { color: #353839; border: 1px solid #23282d; border-radius: 30px; }
.link_button a:hover, .link_button a:active { color: #101068; background: #d2f2f8;  border-radius: 30px; }

#header .link_button { float: right; margin-left: 4px;  }
#header .link_button a { width: auto; }


.items { width: 100%; border-collapse: collapse; }
.items a:link, .items a:visited, .items a:hover, .items a:active {  font-size: 1.3em; text-decoration: none; }
.items tr:nth-child(even) {background: #eee}

hr {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}


/* [ON BIG SCREEN] */
/* (A) WRAPPER */
#hamnav {
  width: 100%;
  background: white;
}

/* (B) HORIZONTAL MENU ITEMS */
#hamitems { display: flex; background: #d2f2f8; }
#hamitems a {
  flex-grow: 1;
  flex-basis: 0;
  padding: 10px;
  color: #353839;
  text-decoration: none;
  text-align: center;
	border: 1px solid #23282d; /* border-radius: 30px; */ padding: 3px;
}
#hamitems a:hover { background: #d2f2f8; }

/* (C) HIDE HAMBURGER */
#hamnav label, #hamburger { display: none; }




/* [ON SMALL SCREENS] */
@media screen and (max-width: 10000px){
  /* (A) BREAK INTO VERTICAL MENU */
  #hamitems a {
    box-sizing: border-box;
    display: block;
    border-top: 1px solid #333;
		/* height: 36px; */
		font-size: 1.5em;
		padding: 10px;
  }

  /* (B) SHOW HAMBURGER ICON */
  #hamnav label {
    display: inline-block;
    color: #353839;
    background: #d2f2f8;
    font-style: normal;
    font-size: 1.2em;
    padding: 10px;
		cursor: pointer;
		border: 1px solid #23282d;
  }

  /* (C) TOGGLE SHOW/HIDE MENU */
  #hamitems { display: none; }
  #hamnav input:checked ~ #hamitems { display: block; }
}

table.sortable th { cursor: pointer; font-size: 1.5em; padding: 6px 0; }
caption  { font-size: 1.6em; font-weight: bold; }


#hamnav {
  position: sticky;
  top: 0;
}


.sub_menu { margin: 0; padding: 0; list-style: none; margin-bottom: 1em; }
.sub_menu li { display: inline-block; margin: 0; padding: 0; list-style: none; }
.sub_menu li a:link, .sub_menu li a:visited, .sub_menu li a:hover, .sub_menu li a:active {
		display: inline-block; color: #353839; background: #d2f2f8; font-size: 1.3em; padding: 6px;
		text-decoration: none; border: 1px solid #353839; border-radius: 30px;
}
