body {
    font-size: 16px;
}

h1 {
    color: #002a7f;
    font-weight: bold;
    
}

h3 {
    color: #002a7f;
    font-weight: bold;
    padding-bottom: 5%;
}

a {
    color: #002a7f;
}


/*--------------------------------------------*/
/* Custom line-break library to replace <br>  */
/*--------------------------------------------*/

/* constant break */

.br1 {
    height: 10px;
}

.br2 {
    height: 20px;
}

.br3 {
    height: 30px;
}

.br4 {
    height: 40px;
}

.br5 {
    height: 50px;
}


/*--------------------------------------------*/
/* Helper classes  */
/*--------------------------------------------*/

.bg-info {
    background-color: #F0F0F0;
}

.bg-info-blue{
    background-color: #224790;
}

.bg-primary {
  color: #fff;
  background-color: #002a7f;
}

.bg-primary a {
    color: #fff;
    text-decoration: underline;
}



/* break collapse (hidden on mobile view) */
@media only screen and (min-width: 1000px) {
    .brc1 {
        height: 10px;
    }

    .brc2 {
        height: 20px;
    }

    .brc3 {
        height: 30px;
    }

    .brc4 {
        height: 40px;
    }

    .brc5 {
        height: 50px;
    }
}

@media only screen and (max-width: 999px) {
    .brc1, .brc2, .brc3, .brc4, .brc5 {
        height: 0px;
    }
}


/*320px — 480px: Mobile devices
481px — 768px: iPads, Tablets
769px — 1024px: Small screens, laptops
1025px — 1200px: Desktops, large screens
1201px and more —  Extra large screens, TV*/

/*481px — 768px: iPads, Tablets*/
@media (max-width: 768px) {
    .row.vertical-align {
        display: block; /* Turn off the flexible box layout */
    }
}

@media screen and (min-width: 769px){
    .bannerimg {
        background-repeat: no-repeat;
        background-position: center center;
        background-size:cover;
        padding:3%; 
        height:800px;
        position:relative;
    }
    .bannerimg.sm {
        height:425px;
    }
    
    
    #bannerimg h1{
        font-size:5rem;
    }
    #bannerimg h2{
        font-size: 4rem;
        font-weight:bold;
    }
    
    .banner-image-box{
        color: white; 
        text-shadow: black 0.1em 0.1em 0.2em; 
        font-size: 1.5rem;
        background-color:rgba(0, 0, 0, 0.5); 
        padding:5%; 
        width:65%;
    }
}

@media screen and (min-width: 1025px){
     #bannerimg h1{
        font-size:7rem;
    }
    #bannerimg h2{
        font-size: 4.5rem;
    }
}

@media only screen and (min-width: 768px) {
        .dropdown:hover .dropdown-menu {
            display: block;
        }
    }

@media only screen and (max-width: 768px) {

    #middlelogo {
    float:left;
    }
        #middlehead {
            float: left !important;
        }
}

/*--------------------------------------------*/
/* Panels  */
/*--------------------------------------------*/

.panel-heading .accordion-toggle:after {
/* symbol for "opening" panels */
font-family: 'Glyphicons Halflings'; /* essential for enabling glyphicon */
content: "\e114"; /* adjust as needed, taken from bootstrap.css */
float: right; /* adjust as needed */
color: grey; /* adjust as needed */
}
.panel-heading .accordion-toggle.collapsed:after {
/* symbol for "collapsed" panels */
content: "\e080"; /* adjust as needed, taken from bootstrap.css */
}
.panel-default {
    border-color: #fff; 
    border-radius: 0 !important;
}
.panel-default h4{
    color: #002a7f;
    font-size: 1.8rem;
    font-weight: bold;
}
.panel-default a{
    text-decoration: none;
}
.panel-default>.panel-heading {
    color: #333;
    background-color: #fff;
    border-color: #ddd;
}

/*--------------------------------------------*/
/* Buttons  */
/*--------------------------------------------*/

.btn-primary {
    color: #002a7f;
    background-color: #fff;
    border-color: #002a7f;
}
.btn-primary:hover {
    color: #003cb3;
    background-color: #fff;
    border-color: #003cb3;
}
.btn-primary:focus,
.btn-primary.focus {
  color: #002a7f;
  background-color: #fff;
  border-color: #002a7f;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: #002a7f;
  background-color: #fff;
  border-color: #002a7f;
}

.btn-primary:active:hover,
.btn-primary.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary.focus {
  color: #002a7f;
  background-color: #fff;
  border-color: #002a7f;
}

/*--------------------------------------------*/
/* Text  */
/*--------------------------------------------*/

.text-warning {
    color: #e39a27;
}

a.text-warning:hover,
a.text-warning:focus {
  color: #e39a27;
}

a.text-warning {
    font-size: 1.7rem;
    text-decoration: underline;
}

/*--------------------------------------------*/
/* Spacing  */
/*--------------------------------------------*/

.m-0 { margin:0!important; }
.m-1 { margin:.25rem!important; }
.m-2 { margin:.5rem!important; }
.m-3 { margin:1rem!important; }
.m-4 { margin:1.5rem!important; }
.m-5 { margin:3rem!important; }

.mt-0 { margin-top:0!important; }
.mr-0 { margin-right:0!important; }
.mb-0 { margin-bottom:0!important; }
.ml-0 { margin-left:0!important; }
.mx-0 { margin-left:0!important;margin-right:0!important; }
.my-0 { margin-top:0!important;margin-bottom:0!important; }

.mt-1 { margin-top:.25rem!important; }
.mr-1 { margin-right:.25rem!important; }
.mb-1 { margin-bottom:.25rem!important; }
.ml-1 { margin-left:.25rem!important; }
.mx-1 { margin-left:.25rem!important;margin-right:.25rem!important; }
.my-1 { margin-top:.25rem!important;margin-bottom:.25rem!important; }

.mt-2 { margin-top:.5rem!important; }
.mr-2 { margin-right:.5rem!important; }
.mb-2 { margin-bottom:.5rem!important; }
.ml-2 { margin-left:.5rem!important; }
.mx-2 { margin-right:.5rem!important;margin-left:.5rem!important; }
.my-2 { margin-top:.5rem!important;margin-bottom:.5rem!important; }

.mt-3 { margin-top:1rem!important; }
.mr-3 { margin-right:1rem!important; }
.mb-3 { margin-bottom:1rem!important; }
.ml-3 { margin-left:1rem!important; }
.mx-3 { margin-right:1rem!important;margin-left:1rem!important; }
.my-3 { margin-bottom:1rem!important;margin-top:1rem!important; }

.mt-4 { margin-top:1.5rem!important; }
.mr-4 { margin-right:1.5rem!important; }
.mb-4 { margin-bottom:1.5rem!important; }
.ml-4 { margin-left:1.5rem!important; }
.mx-4 { margin-right:1.5rem!important;margin-left:1.5rem!important; }
.my-4 { margin-top:1.5rem!important;margin-bottom:1.5rem!important; }

.mt-5 { margin-top:3rem!important; }
.mr-5 { margin-right:3rem!important; }
.mb-5 { margin-bottom:3rem!important; }
.ml-5 { margin-left:3rem!important; }
.mx-5 { margin-right:3rem!important;margin-left:3rem!important; }
.my-5 { margin-top:3rem!important;margin-bottom:3rem!important; }

.mt-6 { margin-top:6rem!important; }
.mr-6 { margin-right:6rem!important; }
.mb-6 { margin-bottom:6rem!important; }
.ml-6 { margin-left:6rem!important; }
.mx-6 { margin-right:6rem!important;margin-left:6rem!important; }
.my-6 { margin-top:6rem!important;margin-bottom:6rem!important; }

.mt-auto { margin-top:auto!important; }
.mr-auto { margin-right:auto!important; }
.mb-auto { margin-bottom:auto!important; }
.ml-auto { margin-left:auto!important; }
.mx-auto { margin-right:auto!important;margin-left:auto!important; }
.my-auto { margin-bottom:auto!important;margin-top:auto!important; }

.p-0 { padding:0!important; }
.p-1 { padding:.25rem!important; }
.p-2 { padding:.5rem!important; }
.p-3 { padding:1rem!important; }
.p-4 { padding:1.5rem!important; }
.p-5 { padding:3rem!important; }

.pt-0 { padding-top:0!important; }
.pr-0 { padding-right:0!important; }
.pb-0 { padding-bottom:0!important; }
.pl-0 { padding-left:0!important; }								
.px-0 { padding-left:0!important;padding-right:0!important; }
.py-0 { padding-top:0!important;padding-bottom:0!important; }

.pt-1 { padding-top:.25rem!important; }			
.pr-1 { padding-right:.25rem!important; }						
.pb-1 { padding-bottom:.25rem!important; }		
.pl-1 { padding-left:.25rem!important; }							
.px-1 { padding-left:.25rem!important;padding-right:.25rem!important; }
.py-1 { padding-top:.25rem!important;padding-bottom:.25rem!important; }

.pt-2 { padding-top:.5rem!important; }												
.pr-2 { padding-right:.5rem!important; }								
.pb-2 { padding-bottom:.5rem!important; }				
.pl-2 { padding-left:.5rem!important; }												
.px-2 { padding-right:.5rem!important;padding-left:.5rem!important; }
.py-2 { padding-top:.5rem!important;padding-bottom:.5rem!important; }

.pt-3 { padding-top:1rem!important; }								
.pr-3 { padding-right:1rem!important; }				
.pb-3 { padding-bottom:1rem!important; }				
.pl-3 { padding-left:1rem!important; }								
.py-3 { padding-bottom:1rem!important;padding-top:1rem!important; }
.px-3 { padding-right:1rem!important;padding-left:1rem!important; }

.pt-4 { padding-top:1.5rem!important; }								
.pr-4 { padding-right:1.5rem!important; }				
.pb-4 { padding-bottom:1.5rem!important; }				
.pl-4 { padding-left:1.5rem!important; }								
.px-4 { padding-right:1.5rem!important;padding-left:1.5rem!important; }
.py-4 { padding-top:1.5rem!important;padding-bottom:1.5rem!important; }

.pt-5 { padding-top:3rem!important; }	
.pr-5 { padding-right:3rem!important; }	
.pb-5 { padding-bottom:3rem!important; }	
.pl-5 { padding-left:3rem!important; }	
.px-5 { padding-right:3rem!important;padding-left:3rem!important; }
.py-5 { padding-top:3rem!important;padding-bottom:3rem!important; }

.pt-6 { padding-top:6rem!important; }	
.pr-6 { padding-right:6rem!important; }	
.pb-6 { padding-bottom:6rem!important; }	
.pl-6 { padding-left:6rem!important; }	
.px-6 { padding-right:6rem!important;padding-left:6rem!important; }
.py-6 { padding-top:6rem!important;padding-bottom:6rem!important; }

/*--------------------------------------------*/
/* Menu                                         */
/*--------------------------------------------*/
.dropdown-toggle:hover {
    color: white !important;
    background-color: #002a7f !important;
}
.dropdown-menu {
    color: white !important;
    background-color: rgba(0, 42, 127, 0.8) !important;
}
.dropdown-menu a {
    color: white !important;
}
.dropdown-menu a:hover {
    color: #002a7f !important;
}

@media only screen and (min-width: 768px) {
    a {
        border-radius: 10px;
    }
}

.dropdown-menu .active a {
    background-color: #002a7f !important;
    color: white !important;
}

.row.display-flex {
  display: flex;
  flex-wrap: wrap;
}
.row.display-flex > [class*='col-'] {
  display: flex;
  flex-direction: column;
}

.vertical-align {
    display: flex;
    align-items: center;
}

.footer-menu a {
    color: white!important;
}

.footer-menu li {
    list-style: none;
}

#main {
    overflow-x:hidden;
    margin-top: 25px;
}

.banner-image-box-bottom {
    color: white; 
    text-shadow: black 0.1em 0.1em 0.2em; 
    font-size: 1.5rem;
    background-color:rgba(0, 0, 0, 0.5); 
    padding:5%; 
    width:100%; 
    position: absolute;
    bottom: 8px;
    left: 16px;
}

.banner-image-box{
    color: white !important; 
    text-shadow: black 0.1em 0.1em 0.2em; 
    font-size: 1.5rem;
    background-color:rgba(0, 0, 0, 0.5); 
    padding:5%; 
}

.banner-image-box h1 {
    color: #fff;
}

.banner-image-box .btn-default{
    background: none; 
    color:white; 
    font-size: 1.5rem;
}
.equal{
    display: flex;
    flex-wrap: wrap;
}

.breadcrumb1 a{
    color: grey;
}

.collaborator-box {
    padding: 5%; 
    outline: 5px 
    solid #002a7f; 
    height:300px;
    position: relative;
}

.collaborator-box .btn {
    position: absolute;
    bottom: 8px;
    left: 50%;
    transform: translate(-50%);
}

.fa-facebook-f:hover {
    color: #ededed;
    text-shadow: 1px 1px #002a7f;
}

.vertical-align {
    display: flex;
    flex-direction: row;
}

.vertical-align > [class^="col-"],
.vertical-align > [class*=" col-"] {
    display: flex;
    align-items: center; /* Align the flex-items vertically */
    justify-content: center; /* Optional, to align inner flex-items
                  horizontally within the column  */
    flex-direction: column;
}

