* {
  box-sizing: border-box;
}

/* --- Style the body ----------------------------------------------------- */
body {
      
      background-image: url("images/site-background.jpg");
      background-position: top; 
      background-repeat: no-repeat; 
      background-size: cover;

      /* font-family: Garamond, serif; */
      font-family: sans-serif;
      /* font-family: monaco, monospace; */


      /* font-family: Georgia, serif; */
      /* font-family: Verdana, sans-serif; */
      /* font-family: Arial, Helvetica, sans-serif ; */
      color: white;
      opacity: 0.9;

      max-width: 1080px; 
      margin: 0 auto; 
      float: none; 
      }

/* --- Image responsive scaling ----------------------------------------------------- */
.responsive {
              max-width: 100%;
              height: auto;
            }

/* --- iframe styling --------------------------------------------------*/
iframe {
  display: block;
}
/* --- Header styling ----------------------------------------------------- */


.header {
          padding: 60px;
          text-align: center;
          opacity: 1;
        }

/* --- Footer styling ----------------------------------------------------- */
footer {
        padding: 0 10px;
        list-style: none;
        display: flex;
        flex-shrink: 0;
        justify-content: space-around;
        align-items: center;
        background-color: #152837;
        }

.footer {
  padding: 20px;
  text-align: center;
  background: #ddd;
}

/* --- Heading and text styling ----------------------------------------------------- */
h1, h2, h3, h4, h5, h6  {
  font-family: Arial, Helvetica, sans-serif ;
  color: white; /*lightsteelblue;*/
  }

h1 {
    font-size: 50px;
    /*line-height: 20px;*/
    }

h2 {
    font-size: 30px;
    line-height: 30px;
}

h3 {
    font-size: 20px;
    line-height: 18px;
}

.toplink {
  font-size:12px;
  font-style: normal;
  text-align: right;
  }

/* --- List styling ----------------------------------------------------- */
li{
  margin: 0 0 10px 0;
}

ul {
  list-style-type: circle;
}

/* --- Link styling ----------------------------------------------------- */
a:link {color: white;}
a:visited {color: white;}
a:hover {color: white;}
a:active {color: white;}
a {text-decoration:none;}

/* --- Header navigation bar styling ----------------------------------------------------- */
/* Sticky navbar - toggles between relative and fixed, depending on the scroll position. It is positioned relative until a given offset position is met in the viewport - then it "sticks" in place (like position:fixed). The sticky value is not supported in IE or Edge 15 and earlier versions. However, for these versions the navbar will inherit default position */
.navbar {
  overflow: hidden;
  background-color: #152837;
  position: sticky;
  position: -webkit-sticky;
  top: 0;
}

/* Style the navigation bar links */
.navbar a {
  float: left;
  display: block;
  color: white;
  text-align: center;
  padding: 14px 20px;
  text-decoration: none;
  font-family: Verdana, sans-serif;
}

/* Active/current link */
.navbar a.active {
  background-color: #152837;
  color: white;
}

/* Change color on hover */
.navbar a:hover {
  background-color: #ddd;
  color: black;
}

/* --- In page navigation styling ----------------------------------------------------- */

/* Sticky navbar - toggles between relative and fixed, depending on the scroll position. It is positioned relative until a given offset position is met in the viewport - then it "sticks" in place (like position:fixed). The sticky value is not supported in IE or Edge 15 and earlier versions. However, for these versions the navbar will inherit default position */
.navbarsub {
  overflow: hidden;
  background-color: #1c374a; 
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  font-family: Arial, Helvetica, sans-serif ;
}

/* Style the navigation bar links */
.navbarsub a {
  float: left;
  display: block;
  color: white;
  text-align: center;
  padding: 14px 20px;
  text-decoration: none;
}

/* Active/current link */
.navbarsub a.active {
  background-color: #152837;
  color: white;
}

/* Change color on hover */
.navbarsub a:hover {
  background-color: #ddd;
  color: black;
}

/* --- Layout styling ----------------------------------------------------- */

/* --- Column container ---------------- */
.container {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  background-color: #143F6A;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  justify-content: center;
}

.container-item-left {
  flex: 50%;
  padding-right: 5px;
}

.container-item-right {
  flex: 50%;
  padding-left: 5px;
}

.container-item-single {
  flex: 100%;
}

.container-item-iframe {
  flex: 50%;
  display: flex;
  justify-content: center;
}

/* Responsive layout - when the screen is less than 700px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 700px) {
  .container {   
    flex-direction: column;
  }
}

/* Responsive layout - when the screen is less than 400px wide, make the navigation links stack on top of each other instead of next to each other */
@media screen and (max-width: 400px) {
  .navbar a {
    float: none;
    width: 100%;
  }
}

/* --- Slideshow styling -----------------------------------------------*/
* {box-sizing: border-box;}
.mySlides {display: none;}

/* Slideshow container */
.slideshow-container {
max-width: 100%;
position: relative;
margin-top: 5px;
}

/* Caption text */
.text {
color: #f2f2f2;
font-size: 20px;
padding: 8px 12px;
position: absolute;
bottom: 3%;
width: 100%;
text-align: right;
}

.active {
background-color: #717171;
}

/* Fading animation */
.fade {
animation-name: fade;
animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .7} 
  to {opacity: 1}
  }

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
.text {font-size: 11px}
}

/* --- icons -----------------------------------*/
.icon-img {
  width: 1em;
  height: 1em;
  vertical-align: text-top;
}

/* --- End of Styling --------------------------------------------------*/