html {
 scroll-behavior: smooth;
}
body {
    background-color: #002856;
}

body > div {
    background-color: white;
}

.content .section {
    line-height:1.7em;
}

.navigation, .covid {
    background-color: #002856;
    color:white;
    padding: 1em 0;
    font-size:0.8em;
}

.navigation a {
    text-decoration:none;
    color:white;
    margin-left:2em;
}

.navigation a:hover {
    color:#0099ff;
}

.logo { 
    margin: 16px 0;
    width:400px;
    max-width:100%;
}

.menu {
    min-height: 70px;
}

.page-title {
    padding-top:2em;
    padding-bottom:1em;
    margin-bottom:2em;
    background-color: #00447c;
    color:white;
}

.menu a {
    color:black;
    text-decoration:none;
    padding: 0.5em 1em;
    border: 1px solid white;
}
.menu a:hover {
    border: 1px solid #00aeef;
    color: #00aeef;
    border-radius: 4px;
}

.menu .logoholder a, .menu .logoholder a {
    padding:none; border:none; 
}
.footer {
    background: #002856;
    color: white;
    padding: 4em 0;
    font-size: .8em;
    line-height: 2em;
    border-top:6px solid black;
}

.blueback {
    background: #00447c url(footer-blur.jpg);
    background-repeat: repeat-x;
    color: white;
}
.blueback p {
    text-shadow: 1px 1px 0px black;
}
.logline {
    background: #000 url(code-bg-black.jpg);
    background: #00447c url(code-bg-blue.jpg);
    background: #00447c url(heading-bg.jpg?v=3);
    background-size: auto 150%;
    background-position: right;
    background-repeat: no-repeat;
}
.logline .spacer {
    padding:6em 0 5em;
}
.logline h2 {
    color:white;
    margin-bottom:1.2em;
}
.logline p {
    padding-left:.75em;
    font-size: 1.2em;
    color: #ccc;
    line-height:2em;
    font-weight: 200;
}

.text-left { text-align:left; }
.text-right { text-align:right; }
.text-center { text-align:center;; }
.f-right { float:right; }
.f-left { float: left; }
.btn-info { color:white; background-color: #00aeef; border-color:#00aeef; }

.section {
    padding-top:3em;
    padding-bottom:3em;
}
.section.tighttop {
    margin-top:0;
    padding-top:0;
}
.section.tightbottom {
    margin-bottom:0.25em;
    padding-bottom:0.25em;
}
.section.alt {
    background-color: #ddd;
}

.smaller { font-size:0.8em; }
.separated p {
    margin: 2em;
    padding: 1em;
    padding-bottom:2em;
    border-bottom: 1px dashed #ccc;
}
.separated-top p {
    margin: 2em;
    padding: 1em;
    padding-top:2em;
    border-top: 1px dashed #ccc;
}

.tab-content {
    margin-top: 2em;
}
h1 {
    font-size: 1.6em;
    text-transform: uppercase;
    /*
    text-decoration: underline;
    text-decoration-color: #00aeef;
    border-bottom: 1px solid #aaa;
    padding: 7px 0 10px;
    border-top: 1px solid #aaa;
    text-align: center;
    background-color: #f0faff;
    */
    padding-bottom:0.5em;
}

h1.major::before {
  content: url(znd-icon-s.png);
  position:absolute;
  height:90px;
  top:-16px;
  left:-38px
}
h1.major {
  position:relative;
  padding-top:90px;
}

h1.iconize {
    position:relative;
    padding:30px 0 30px 92px;
}

h1.iconize::before{
  content: url(znd-iconside-s.png);
    position:absolute;
    left:-24px;
    top:-12px;
}

h3 {
    color:#002856;
    text-transform:uppercase;
    font-size:1.4em;
    text-align:center;
    border-top:1px solid #aaa;
    border-bottom:1px solid #aaa;
    margin:0.25em 0;
}

.footer h3 {
    color:#ccc;
    border: none;
}

.sleeping-floater { cursor:pointer;left:-40px;position:relative; }
.floater {
    position: relative;
    animation: i-walk 14s infinite  normal linear;
}
.floater img {
    animation: i-flip 14s infinite  normal linear;
}

.card-header {
    font-weight: bold;
    font-size: 1.2em;
    text-align: center;
}

@keyframes i-walk {
    0% {   left:-40px;}
    48% {  left: 100px;}
    50% {  left: 100px;}
    98% {  left: -40px;}
    100% { left: -40px;}
}
@keyframes i-flip {
    48% {  transform: rotateY(0deg);}
    50% {  transform: rotateY(180deg);}
    98% {  transform: rotateY(180deg);}
    100% { transform: rotateY(0deg);}
}


@media (max-width:575px) {
    .logoholder { text-align:center; }
    .text-xs-center { text-align:center; }
    .logline { margin-top: 1em; }
    .logline .spacer {
	padding: 2em 0 1em;
	text-align:center;
    }
    .menu { min-height:150px; }
    @keyframes i-walk {
    0% {   left:0%;}
    48% {  left: calc(100% - 125px);left: -moz-calc(100% - 125px); left:-webkit-calc(100% - 125px);}
    50% {  left: calc(100% - 125px);left: -moz-calc(100% - 125px); left:-webkit-calc(100% - 125px);}
    98% {  left: 0%;}
    100% { left: 0%;}
    }
}

@media (max-width:991px) {
    .logline {
	background-size: 100%;
	background-repeat: no-repeat;
	background: #000 url(code-bg-black-50.jpg);
	background: #00447c url(code-bg-blue-50.jpg);
	background: #00447c url(heading-bg.jpg?v=3);
    }
}