#header-bottom {
clear: left;
text-align: center;
margin: 0px;
padding: 0px;
}

#tagline {
display:flex;
justify-content: space-around;
background-color: #ffffce;
box-shadow: 0 2px 12px rgb(34 34 34 / 35%);
border-top: 1px solid #1D0F99;
border-bottom: 1px solid #1D0F99;
color: #1D0F99;
font-size: 90%;
margin: 10px 0px 0px 0px;
padding: 2px 3px 3px 3px;
text-transform: uppercase;
text-shadow: 2px 2px 15px #898954;
}

#tagline div {
  padding:0px 15px;
}

#maincontent h1 {
color: #1D0F99;
font-size: 110%;
margin: 10px 0px 0px 0px;
padding: 5px 0px 5px 0px;
border-bottom: 4px solid #b9d2e3;
display: inline-block;
}

.suplink {
	vertical-align : top;
	font-family: arial;
	font-size : 80%;
	font-weight : normal;
}

.highlight{
	background-color: #F9F1DF;
	margin: 10px;
	padding: 7px;
}

/* //////////////////////////////////////////////////////// */

html,body{font-family: 'Open Sans', sans-serif; font-size:16px;}

body {
margin: 0px;
padding: 0px;
background-color: #293576;
color: #33333e;
}

#wrap {max-width: 1200px; margin: auto; background-color: #ffffff;}

#topbar {
  display:flex;
  padding:0px 10px 0px 30px;
  font-family: Arial;
  background-image: url("topbg.jpg");
  background-repeat: repeat-x;
  background-position: bottom left;
}

#topmenu a {
text-decoration: none;
text-transform: uppercase;
font-family:Arial; 
font-size:9pt; 
color: #45647B;
letter-spacing: 0.5px;
}

#topmenu a:hover {
color: #ff0066;
}

#icon {
  display: none;
  color:#D1A259;
  padding:2px 16px;
  font-size: 36px;
}
#icon:hover {
  color:#D1A259;
}

.container {
    position: relative;
	background-color: antiquewhite;
}

#respmenu {
    width: 220px;
    position: absolute;
    top: 0px;
    left: 30px;
	/*background-color:#297BBD;*/
	background-image: linear-gradient(to right, #146bb3, #3a7eb6);
	min-height: 100%;
}
#respmenu.responsive {display:block; padding:20px 0px;}

#menu {
	padding: 0px;
	margin: auto;
	margin-top: 20px;
	list-style: none;
	font-size: 0.9em;
	}

#menu ul {
    list-style:none;
    margin: 0;
    padding: 0;
	}
	
#menu li {
	padding: 2px;
	margin: 0px;
	text-align:center;
	}	

#menu li a {
	text-decoration: none;
	display: block;
	padding: 3px 0px;
	}	
	
#menu li a:link, #menu li a:visited {
	color: white;
	}
	
#menu li a:hover, #menu li a:active {
	color: #DFE0EB;
	background-color: #105693;
	}
	
#menu li.header {
	text-decoration: none;
	text-transform: uppercase;
	background-color: #005dad; /* For browsers that do not support gradients */
    /* background-image: linear-gradient(#005dad, #1f6cac); */
	border-radius: 11px 11px 0px 0px;
	margin: 25px 0px 10px 0px;
    padding: 2px 0px 10px 0px;
	color: #cccee7;
	word-spacing: 0.12em;
	}

#maincol {
    margin-left: 250px;
	padding:5px 25px;
}

#maincontent {max-width:900px; min-height:1100px; padding:25px; margin:20px auto; background-color: white; border-radius: 7px; font-size:1em; box-shadow: 0 2px 12px rgb(34 34 34 / 35%);}

.desc {
  padding: 15px;
  text-align: center;
  font-size: 0.9em;
  font-family:Arial;
}

.button {
  background-color: #82839b;
  border: none;
  border-radius:5px;
  color: white;
  padding: 10px 15px;
  text-align: center;
  text-decoration: none;
  font-size: 0.9em;
  max-width:90%;
  cursor: pointer;
}
.button:hover {background-color: #5d609f;}

img.imgleft {float:left; margin: 10px 30px 30px auto;}
img.imgright {float:right; margin: 10px auto 30px 30px;}

input, textarea {
    padding: 12px 20px;
    margin: 5px 0;
    box-sizing: border-box;
	font-size:1.1em;
}

select {
    padding: 12px 30px 12px 12px;
    margin: 5px 0;
	background-color: white;
    box-sizing: border-box;
	font-size:1.1em;
	-webkit-appearance: none !important; -moz-appearance: none; 
	background-image: url(arrow2.png); background-repeat: no-repeat; background-position: right .5em top 50%, 0 0; background-size: .65em auto;
}

input[type=submit] {-webkit-appearance: none; min-height:2em; width:200px; margin:auto; display:block;}

.clearfix::after { /* make div of class clearfix to contain floating images */
  content: "";
  clear: both;
  display: table;
}

.hr {display:none;}

h3 {
   text-align: center; 
   padding: 10px;
   margin:20px 0px;
   background-color: #365162;
   color: #FF9933;
   font-size: 1.3em;
   font-weight:normal;
}

h6 {font-size:1em; font-weight:normal; background-color:#5d85a3; color:antiquewhite; padding:5px; margin: 20px 0px 10px 0px;}

#maincontent li {padding:2px;}

.quotebox {
	background-color: #F9F1DF;
	border-color: #000080;
	width: 90%;
	max-width: 450px;
	border: double;
	margin: 15px auto;
    padding: 10px 15px;
}

@media screen and (max-width: 1000px) {
  #alapet {font-size:1.2em;}
}
@media screen and (max-width: 900px) {
  #topbar {padding:0px 10px 0px 0px;}
  #topmenu {display: none;}
  #icon {display: inline-block;}
  #respmenu {position:relative; top:-145px; left:0px; width:100%; display:none; box-shadow: 0px 10px 20px -5px #111;}
  #tagline {text-transform: none; text-shadow: 2px 2px 20px #898954;}
  #tagline div {padding: 0px 10px;}
  #maincol {margin-left: 0px;}
  #maincontent {max-width:100%; min-height:auto;}
  #maincontent ul {padding-inline-start: 15px;}
  #maincontent ol {padding-inline-start: 20px;}
  .container {margin:0px;}
  #menu {width:250px; color:ffffff; font-size:1.1em; margin-top:0px; font-size:1.2em;}
  #menu li a {padding:6px 2px;}
  /* img {max-width:100%;height:auto;} */
  img.imgleft, img.imgright {float:none; margin:30px auto; display:block;}
}

@media screen and (max-width: 500px) {
  #tagline {font-size: 3vw;}
  #maincol {padding: 5px 10px;}
  #maincontent {margin:10px auto; padding:10px;}
}

@media screen and (max-width: 321px) {
  #alapet {font-size:1em;}
  #icon {right:0px;}
}