body{
    font-size:1.2em;color:#191919
}
a{
    color:#17a2b8
}
a:hover{
    color:#191919
}

img {
  width: 100%;
}
#skip-to-content a{
    padding:6px;
    position:absolute;
    top:-45px;
    left:0px;
    color:white;
    border-right:1px solid white;
    border-bottom:1px solid white;
    border-bottom-right-radius:8px;
    background:#BF1722;
    -webkit-transition:top 1s ease-out;
    transition:top 1s ease-out;
    z-index:100
}
#skip-to-content a:focus{
    position:absolute;
    left:0px;
    top:0px;
    outline-color:transparent;
    -webkit-transition:top .1s ease-in;
    transition:top .1s ease-in
}
.navbar-dark .navbar-nav .nav-link:focus,.navbar-dark .navbar-nav .nav-link:hover{
    color:rgba(255,255,255,0.75)
}
.navbar-dark .navbar-nav .nav-link{
    color:#fff
}
.navbar-dark .navbar-nav .active{
    background-color:#0892b4
}
#footer-credits img{
    height:40px
}
#scroll-to-top{
    display:none;
    position:fixed;
    bottom:2%;
    right:15%;
    z-index:99;
    font-size:20px
}

@media all and (min-width: 992px) {
	.navbar .nav-item .dropdown-menu{ display: none; }
	.navbar .nav-item:hover .nav-link{   }
	.navbar .nav-item:hover .dropdown-menu{ display: block; }
	.navbar .nav-item .dropdown-menu{ margin-top:0; }
.feature-alert p:last-of-type{
    margin-bottom:0
}
@media (min-width: 768px){
.feature-w-25{width:25% !important}
.feature-w-50{width:50% !important}
.feature-w-75{width:75% !important}
.feature-w-100{width:100% !important}
.feature-float-right{float:right !important}
.feature-float-left{float:left !important}}
.carousel-item-title{background-color:rgba(37,36,36,0.72)}
.gallery-img{cursor:pointer}
#item-nav a{position:absolute;top:500px}
#item-nav .previous{left:10px}
#item-nav .next{right:10px}
#map{height:750px;z-index:98}
.mapthumb{height:100px}
.leaflet-fusesearch-panel .header{padding-bottom:1.5em}
.tagcloud0{font-size:0.4em}
.tagcloud1{font-size:0.5em}
.tagcloud2{font-size:0.8em}
.tagcloud3{font-size:1.1em}
.tagcloud4{font-size:1.4em}
.tagcloud5{font-size:1.6em}
.tagcloud6{font-size:1.9em}
.tagcloud7{font-size:2.2em}
.tagcloud8{font-size:2.5em}
.tagcloud9{font-size:2.8em}
.tagcloud10{font-size:3.0em}
.about-contents>h2{font-weight:bold;padding-top:100px;border-top:1px dotted black}
.about-contents>h1,.about-contents>h2,.about-contents>h3,.about-contents>h4,.about-contents>h5,.about-contents>h6{max-width:650px;margin:1.5rem auto 1rem}
.about-contents>p,.about-contents>.about-narrowed-content,.about-contents>.footnotes,.about-contents>ol,.about-contents>ul{margin-left:auto;margin-right:auto;max-width:650px}

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #111;
    overflow-x: hidden;
    padding-top: 60px;
    transition: 0.5s
  }
  
  .sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: #ffffff;
    display: block;
    transition: 0.3s;
  }
  
  .sidenav a, .dropdown-btn {
    padding: 6px 8px 6px 16px;
    text-decoration: none;
    font-size: 20px;
    color: #ffffff;
    display: block;
    border: none;
    background: none;
    width: 100%;
    text-align: left;
    cursor: pointer;
    outline: none;
  }
  
  .dropdown-container {
    display: none;
    background-color: #474747;
    padding-left: 8px;
  }
  
  
  .sidenav a:hover {
    color: #b1b1b1;
  }
  
  .sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 10px;
    font-size: 36px;
    margin-left: 50px;
  }

.navbar-nav.navbar-center {
    position: absolute;
    left: 50%;
    transform: translatex(-50%);
}
  
  #main {
    transition: margin-left .5s;
    padding: 20px;
  }
  
  @media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}
  }
  
  .accordion {
    background-color: rgb(105, 105, 105);
    color: white;
    cursor: pointer;
    padding: 15px;
    width: 100%;
    border: solid;
    border-width: 2px;
    text-align: center;
    outline: none;
    font-size: 20px;
    transition: 0.4s;
  }
  
  .active, .accordion:hover {
    background-color: rgb(133, 133, 133);
  }
  
  .panel {
    padding: 0 18px;
    background-color: white;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }
  
  .custom {
    width: 200px;
    height: 80px;
    padding: 15px;
  }
  
  .customa {
    width: 200px;
    height: 80px;
    padding: 20px;
  }
  
  
  #sticky {
    position: sticky;
    top: 0;
    width: 100%;
    padding: 1.5%;
  }
  
  .content {
    padding: 16px;
    margin: 250px
  }
  
  #sticky + .content {
    padding-top: 60px;
  }

  #glossary a:hover {
        background-color:rgb(202, 202, 202);
  }

  #gloss {
    color: white;
    display: block;
  }

  #glossary {
  height: 100%;
  width: 0;
  z-index: 1;
  transition: 0.5s;
  }
  
  #main-holder {
    width: 50%;
    height: 70%;
    display: grid;
    justify-items: center;
    align-items: center;
    background-color: white;
    border-radius: 7px;
    border-radius: 12%;
    box-shadow: 0px 0px 5px 2px black;
  }
  
  .login-bg {
    background-color:rgb(70, 70, 70);
    margin: 20% 30% 10% 30%;
    padding: 1% 0% 3% 0%;
    border: solid rgb(70, 145, 189);
    border-radius: 12%;
  }
  
  #login-header {
    text-align: center;
    color:rgb(255, 255, 255)
  }
  
  #login-error-msg-holder {
    width: 100%;
    height: 100%;
    display: grid;
    justify-items: center;
    align-items: center;
  }
  
  #login-error-msg {
    width: 40%;
    text-align: center;
    margin: 2%;
    padding: 1%;
    font-size: 18px;
    font-weight: bold;
    color: #8a0000;
    border: .5% solid #8a0000;
    background-color: #e58f8f;
    opacity: 0;
  }
  
  #error-msg-second-line {
    display: block;
  }
  
  #login-form {
    display: grid;
    justify-items: center;
    align-items: center;
  }
  
  .login-form-field::placeholder {
    color: #3a3a3a;
    justify-items: center;
    align-items: center;
  }
  
  .login-form-field {
    border: solid;
    border-color: (70, 145, 189);
    margin-bottom: 3%;
    border-radius: 5%;
    padding: 0% 0% 1% 1%;
    width: 50%;
  }
  
  #login-form-submit {
    width: 50%;
    padding:1%;
    border: none;
    border-radius: 2%;
    color: white;
    font-weight: bold;
    background-color: #007aaa;
    cursor: pointer;
    outline: none;
  }

  .box {
    width: 500px;
    padding: 40px;
    position: absolute;
    top: 50%;
    left: 50%;
    background: #191919;
    ;
    text-align: center;
    transition: 0.25s;
    margin-top: 100px
}

.box input[type="text"],
.box input[type="password"] {
    border: 0;
    background: none;
    display: block;
    margin: 20px auto;
    text-align: center;
    border: 2px solid #fcff5b;
    padding: 10px 10px;
    width: 250px;
    outline: none;
    color: white;
    border-radius: 24px;
    transition: 0.25s
}

.box h1 {
    color: white;
    text-transform: uppercase;
    font-weight: 500
}

.box input[type="mbmgstaff"]:focus,
.box input[type="Data_Preservation_Rocks13"]:focus {
    width: 300px;
    border-color: #2ecc71
}

.box input[type="submit"] {
    border: 0;
    background: none;
    display: block;
    margin: 20px auto;
    text-align: center;
    border: 2px solid #2ecc71;
    padding: 14px 40px;
    outline: none;
    color: white;
    border-radius: 24px;
    transition: 0.25s;
    cursor: pointer
}

.box input[type="submit"]:hover {
    background: #2ecc71
}

.forgot {
    text-decoration: underline
}

  #page-container {
    position: relative;
    min-height: 100vh;
  }
  
  #content-wrap {
    padding-bottom: 1em;    /* Footer height */
  }
  
  #footer {
    position: absolute;
    width: 100%;         /* Footer height */
  }

  /********** Large devices only **********/
  @media (min-width: 1200px) {
  nav {
    width: 100%;
  }
  }

  /***********Medium Devices only*********/
  @media (min-width: 992px) and (max-width: 1199px) {
    #main-holder {
      width: 30%;
      height: 20%;
      display: grid;
      border-radius: 7px;
      box-shadow: 0px 0px 5px 2px black;
    }
    
    .login-bg {
      background-color:rgb(151, 151, 151);
      margin: 20% 20% 10% 20%;
      padding: 1% 0% 3% 0%;
    }
    
    
    #login-error-msg {
      width: 40%;
      text-align: center;
      margin: 2%;
      padding: 1%;
      font-size: 18px;
    }
    
    #error-msg-second-line {
      display: block;
    }
    
    .login-form-field {
      border: 0.5% solid #3a3a3a;
      margin-bottom: 3%;
      border-radius: 5px;
      outline: none;
      padding: 0% 0% 1% 1%;
      width: 50%;
    }
    
    #login-form-submit {
      width: 50%;
      padding:1%;
      border-radius: 2%;
    }

    nav {
      width: 106%;
    }

    #footer {
      position: absolute;
      bottom: 0%;
      width: 106%;
      height: 20%;            /* Footer height */
    }
  }

   /************Small Devices only**********/
   @media (min-width: 768px) and (max-width: 992px) {
    #main-holder {
      width: 30%;
      height: 20%;
      display: grid;
      border-radius: 7px;
      box-shadow: 0px 0px 5px 2px black;
    }
    
    .login-bg {
      background-color:rgb(151, 151, 151);
      margin: 20% 15% 10% 10%;
      padding: 2% 0% 3% 0%;
    }
    
    
    #login-error-msg {
      width: 40%;
      text-align: center;
      margin: 2%;
      padding: 1%;
      font-size: 18px;
    }
    
    #error-msg-second-line {
      display: block;
    }
    
    .login-form-field {
      border: 0.5% solid #3a3a3a;
      margin-bottom: 3%;
      border-radius: 5px;
      outline: none;
      padding: 0% 0% 1% 1%;
      width: 60%;
    }
    
    #login-form-submit {
      width: 50%;
      padding:1%;
      border-radius: 2%;
    }

    nav {
      width: 100%;
    }

    #footer {
      position: absolute;
      bottom: 5%;
      width: 100%;
      height: 20%;
      margin-bottom: 0%;        /* Footer height */
    }
  }

  /********** Extra small devices only **********/
  @media (min-width: 380px) and (max-width: 767px) {
    #main-holder {
      width: 30%;
      height: 20%;
      display: grid;
      border-radius: 7px;
      box-shadow: 0px 0px 5px 2px black;
    }
    
    .login-bg {
      background-color:rgb(151, 151, 151);
      margin: 10% 15% 10% 10%;
      padding: 2% 0% 3% 0%;
    }
    
    
    #login-error-msg {
      width: 40%;
      text-align: center;
      margin: 2%;
      padding: 1%;
      font-size: 18px;
    }
    
    #error-msg-second-line {
      display: block;
    }
    
    .login-form-field {
      border: 0.5% solid #3a3a3a;
      margin-bottom: 3%;
      border-radius: 5px;
      outline: none;
      padding: 0% 0% 1% 1%;
      width: 60%;
    }
    
    #login-form-submit {
      width: 50%;
      padding:1%;
      border-radius: 2%;
    }

    nav {
      width: 100%;
    }

    #cbtable {
      width: 50%;
    }

    #cbbutton {
      clear: both;
    }

    #tabletext {
      display: none;
    }

    #describe {
      display: none;
    }

    #footer {
      visibility: hidden;
    }

    iframe {
      height: 10%;
    }
  }

  /* XXS Device only */
  @media (max-width: 379px) {
    nav {
      width: 120%;
    }
  }