@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Icons');
@import url('https://fonts.googleapis.com/css2?family=Comic+Neue:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');

html{
    font-family: 'Source Sans Pro', sans-serif;
}

body{
    font-family: 'Source Sans Pro', sans-serif;
}

main{
    min-height: -webkit-fill-available;
}

footer{
    background-color: #0096DC;
    color:white;
    padding:1em;
    margin-top:2em;
}

::-webkit-scrollbar {
  width: 1em;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

a{
    font-size:20px;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #0096DC;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

iframe{
    width:100%;
    min-height:300px;
    padding-top:1rem;
}

.footer-links{
    color:white;
}

h1,h2,h3,h4,h5{
    font-family: 'Merriweather', serif;
    font-weight:bold;
}

h2{
    width:100%;
    color:#004380;
}

h3{
    font-size:1.4rem;
    color:#004380;
    margin-top:1rem;
    padding-bottom:0.5em;
}

h5{
    font-size:1.2em;
}

p, ul, ol{
    font-size: 20px;
    line-height: 33px;
}

a{
    overflow-wrap:break-word;
}

.font-comic{
    font-family: 'Comic Neue', cursive;
}

.font-merryweather{
    font-family: 'Merriweather', serif;
}

.color-yellow{
    color: #f39200 
}


.color-lightblue{
    color:#0096DC;
}

.color-darkblue{
    color: #004380
    
}

.color-pink{
    color:#ff69b4;
    
}

.color-purple{
    color: #6c2383 
}

.color-red{
    color: #dc3545;
    
}
a:hover, a:active{
    text-decoration:none;
    color:black;
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;

  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;

  /* Support for IE. */
  font-feature-settings: 'liga';
}

img{
    max-width:100%;
}

.navbar ul, .navbar li{
    font-size: 16px;
}

.navbar-toggler-icon {
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.jumbotron{
    border-radius:0;
    color:white;
}

.nav-background{
    background-color: #0096DC !important;
}

.navbar-collapse{
    flex-wrap:wrap;
}

.fixed-top{
    transition: background-color 0.2s ease-out;
}

.fixed-top.scrolled {
  background-color: #0096DC !important;
}


.navbar-collapse{
    width:100%;
}

#navsearch{
    flex-flow:row;
}

.scroll-btn-visible{
    background-color:red;
}

.dropdown-nav{
    font-family: 'Merriweather', serif;
    padding-bottom:5px;
    border-bottom: solid 3px #004380;
    font-weight:bold;
    color: #004380;
}

.header-container{
    padding-top:5%;
    margin-bottom:5%;
}

.page-header{
    text-shadow: 0 5px 15px rgba(0,0,0,0.3);
    font-size: 46px;
}

.bg-blonde{
    background-color:#FDEED8;
    margin: 30px 0 30px !important;
}
#search .search-button {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.search-section input.form-control {
    border: 1px solid;
    border-color: rgba(39,39,39,0.5);
    height: 46px;
}

.subheading{
  text-shadow: 0 0 5px rgb(0 0 0 / 30%);
  font-size: 22px;
}
.sub-heading{
    font-size: 1.2em;
}

.content-heading{
    margin-bottom:1em;
}

.hide-link{
    display:none;
}

.input-group-append{
    display:block;
}


.content-heading-text::before{
    position: absolute;
    left: 47%;
    right: 47%;
    top:110%;
    content: "";
    background: #004380;
    height: 5px;
    transition-property: left, right;
    -webkit-transition-property: left, right;
    transition-duration: 0.25s;
    -webkit-transition-duration: 0.25s;
    transition-timing-function: ease-out;
    -webkit-transition-timing-function: ease-out;
    border-radius: 50px;
    z-index: 1;
}

.nav-link{
    color:white;
    width:max-content;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin: 0 17px;
    overflow: hidden;
    padding-left: 0 !important;
    padding-right: 0 !important;
    transform: perspective(1px) translateZ(0);
    -webkit-transform: perspective(1px) translateZ(0);
}
.nav-link:before{
    position: absolute;
    left: 51%;
    right: 51%;
    bottom: 0;
    content: "";
    background: #FFF;
    height: 3px;
    transition-property: left, right;
    -webkit-transition-property: left, right;
    transition-duration: 0.25s;
    -webkit-transition-duration: 0.25s;
    transition-timing-function: ease-out;
    -webkit-transition-timing-function: ease-out;
    border-radius: 50px;
    z-index: -1;
}

.nav-link:hover{
    color: #fff;
}
.nav-link:hover:before, .nav-link:focus:before, .nav-link:active:before {
    color: #FFF;
    left: 0;
    right: 0;
}

.nav-link-active::before{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    content: "";
    background: #FFF;
    height: 3px;
    transition-property: left, right;
    -webkit-transition-property: left, right;
    transition-duration: 0.25s;
    -webkit-transition-duration: 0.25s;
    transition-timing-function: ease-out;
    -webkit-transition-timing-function: ease-out;
    border-radius: 50px;
    z-index: -1;
    
}

.navbar-nav .dropdown-menu{
    position:relative;
    top:-10;
}

.navbar-nav{
    justify-content:space-evenly;
}

.subnav-link:hover,.subnav-link:hover{
    border-bottom: solid 3px #004380;
}

.btn-page{
    font-weight:bold;
}

.btn-page:hover, .btn-page:focus{
    background: rgba(0,0,0,.1);
}

.btn-page-active{
    border-bottom:solid 3px black;
    padding-bottom:5px;
    
}

.subnav-link-active{
    border-bottom: solid 3px #004380;
}

.subnav-link{
    color:black;
    white-space: break-spaces;
}


.dropdown-menu{
    padding:1em;
    text-align:center;
}

.dropdown-item{
    max-width:100% !important;
    padding:0;
    padding-top:0.25rem;
    margin: 10px 0;
}

.dropdown-item:active, .dropdown-item:hover{
    background-color:transparent;
    color:black;
}

.dropdown-toggle::after{
    display:none;
}

.home-header-container{
    text-align:center;
}

.home-page-buttons{
    margin-top:1em;
}

.btn-warning:active,.btn-warning:focus, .btn-warning:hover,.btn-warning{
    background-color:#f39200 !important;
    border-color:#f39200 !important;
    color:white !important;
    box-shadow:none !important;
}

.nav-item .btn-danger{
    background: #B10933;
    border-color: #B10933;
    transition: 0.2s ease-out;
}
.nav-item .btn-danger:hover{
    filter: brightness(85%);
}

.btn-primary:active,.btn-primary:focus, .btn-primary:hover,.btn-primary{
    background-color:#004380 !important;
    border-color:#004380 !important;
    color:white !important;
    box-shadow:none !important;
}

.btn-read-more{
    width:100%;
}


.btn-info:active,.btn-info:focus, .btn-info:hover,.btn-info{
    background-color:#6c2383 !important;
    border-color: #6c2383 !important;
    box-shadow: none !important;
}

.btn:active, .btn:focus,.btn:hover{
    filter: brightness(70%);
    box-shadow:none;
}

.card-container{
    margin-bottom:1em;
    cursor:pointer !important;
}


.card{
    height:100%;
}


.card-title{
    position:absolute;
    padding:0.5em;
    bottom:0;
    left:1em;
    right:1em;
    background-color: rgba(0, 150, 220, 0.7);
    border-radius:0.2em;
    color:white;
    font-size: 19px;
    word-wrap: normal;
}

.card-body{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
}

#navsearch{
    justify-content:center;
}

.related-section-background{
    background-color:#FDFCFD;
    background-image: url("/media/0tue0ntf/tree.png");
    background-position: 70% 10%;
    background-size: cover;
}

.visible{
    display:flex;
}


@media (min-width: 1200px){
    .navbar-expand-xl .navbar-nav .dropdown-menu {
        position: absolute;
        left:-11em;
        min-width:800px;
        top:89%;
    }
    
    .navbar-nav{
        flex-wrap:wrap;
    }
    
    .nav-item .btn-danger{
    margin-top:0.4em;
    }
    
    .nav-search-input{
        width:0px !important;
        display:none;
        transition:width(0.5s);
    }
    
    #navsearch{
        position:absolute;
        right: 0.5em;
        top: 1.3em;
    }
    
    .dropdown-menu{
        text-align:left;
    }
    .form-control{
        display:inline-block;
        width:auto !important;
    }
    
    .dropdown-menu::after{
      position: absolute;
      content: "";
      width: 0px;
      height: 0px;
      border-right: 10px solid transparent;
      border-bottom: 15px solid white;
      border-left: 10px solid transparent;
      top: -10;
      left: 31%;
    }
    .subnav-link{
        margin-right:1em;
    }
}