/*
#85BFF2 light blue
#AED8F2 lighter blue
#41BF9B green
#82A633 olive type green
#B3D962 light green
#3ba6cc another blue
#B254BF purple
#7754BF darker purple

fonts
font-family: 'Gabriela', serif;

font-family: 'Arbutus Slab', serif;

Light 300
Light 300 Italic
Regular 400
Regular 400 Italic
SemiBold 600
SemiBold 600 Italic
Bold 700
Bold 700 Italic
ExtraBold 800
ExtraBold 800 Italic
Black 900
Black 900 Italic
font-family: 'Mulish', sans-serif;
*/

.container {
  position: relative;
  text-align: center;
  height: auto;
}

.navcontainer {
  position: relative;
  text-align: center;
  height: 70px;
  border-bottom: 2px solid #7497A8;
}

html {
  height: auto;
}


body {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
background-color: #FFFEFC;
}

p {
font-family: 'Mulish', sans-serif;
    font-size: 14px;

}

h1 {
    font-size: 40px;
font-family: 'Mulish', sans-serif;
    line-height: .8;
}




#contentblocks {
 height: auto;

}

h2 {
   font-size: 1vw;
   font-family: 'Mulish', sans-serif;
   color: black;
}

h3 {
     font-size: 70px;
   font-family: 'Mulish', sans-serif;
    text-shadow: 2px 4px 8px #afaead;
        line-height: .8;
}

h4 {
font-family: 'Mulish', sans-serif;
    font-size: 18px;
color: black;
    }
    
h5 {
font-family: 'Mulish', sans-serif;
    font-size: 16px;
text-align: center;
font-weight: bold;
    }

h6 {
font-family: 'Mulish', sans-serif;
    font-size: 16px;
}


video {
  height: auto;
  width: 100%;
}

#mainbtn {
  float: left;
}


.img-circle {
   border: 2px solid #CCC;
   box-shadow: 4px 4px #CCC;
}

div.gallery {
    border: 1px solid #ccc;
    margin-bottom: 25px;
}

div.gallery:hover {
    border: 1px solid #777;
}

div.gallery img {
    width: 100%;
    height: auto;
}


* {
    box-sizing: border-box;
}

.responsive {
    padding: 0 6px;
    float: left;
    width: 33.3%;
}

@media (min-width: 544px) {
    .responsive {
        max-width: 100%;
        margin: 6px 0;
    }
}

@media (min-width: 768px) {
    .responsive {
        max-width: 100%;
    }
}


@media (min-width: 992px) {
    .column {
        width: 100%;
    }
}

@media (min-width: 1200px) {
    .column {
        width: 100%;
    }
}


.clearfix:after {
    content: "";
    display: table;
    clear: both;
}

<!--Navigation-->

.navbar {
   background-color: #FFFEFC;
   width: auto;
   height: auto;
}

.navbar-brand {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    text-align: center;
    margin: auto; 
}

.navbar a {
    font-size: 20px;
    font-family: 'Mulish', sans-serif;
    color: #7497A8;
}

.navbar h2 {
    font-size: 35px;
    font-family: 'Arbutus Slab', serif;
    font-weight: bold;
    color: #7497A8;
}



.dropbtn {
    background-color: black;
   font-family: 'Mulish', sans-serif;
    font-size: 20px;
    border: none;
    padding: 10px 14px;

}

.dropdown {
    display: inline-block;
}

.dropdown-content {
    display: none;
    background-color: #f1f1f1;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    display: inline-block;
}

.dropdown-content a:hover {
    background-color: #ddd;
 }

.dropdown:hover .dropdown-content {
    display: inline-block;
    }

.dropdown:hover .dropbtn {
    color: black;
    background-color: #cce5f0;
    }


.image {
 position: relative;
 width: 100%;
 border: 2px solid #85959E;
 margin-top: 5px;
}

.image__img {
 display: block;
 width: 100%;
}

.image__overlay {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 background: rgba(0, 0, 0, 0.6);
 backdrop-filter: blur(5px);
 color: #ffffff;
 font-family: 'Mulish', sans-serif;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 opacity: 0;
 transition: opacity 0.25s;
}


.image__overlay > * {
 transform: translateY(20px);
 transition: transform 0.25s;
}

.image__overlay:hover {
 opacity: 1;
}

.image__overlay:hover > * {
 transform: translateY(0);
}

.image__title {
 font-size: 2em;
 font-weight: bold;
}

.image__title a {
 color: white;
 text-decoration: none;
 font-family: 'Arbutus Slab', serif;
}

.image__description {
 font-size: 1.25em;
 margin-top: 0.25em;
}

.imageA {
 position: relative;
 width: 100%;
 border: 2px solid #85959E;
 margin-top: 5px;
}

.imageA__img {
 display: block;
 width: 100%;
 height: 100%;
}

.imageA__overlay {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 background: rgba(0, 0, 0, 0.6);
 backdrop-filter: blur(5px);
 color: #ffffff;
 font-family: 'Mulish', sans-serif;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 opacity: 0;
 transition: opacity 0.25s;
}


.imageA__overlay > * {
 transform: translateY(20px);
 transition: transform 0.25s;
}

.imageA__overlay:hover {
 opacity: 1;
}

.imageA__overlay:hover > * {
 transform: translateY(0);
}

.imageA__title {
 font-size: 2em;
 font-weight: bold;
}

.imageA__overlay a {
 color: white;
 text-decoration: none;
 font-family: 'Mulish', sans-serif;
}

.imageA__description {
 font-size: 1.25em;
 margin-top: 0.25em;
}


footer {
    left: 0;
    bottom: 0;
    text-align: center;
   font-family: 'Mulish', sans-serif;
    color: #7497A8;
    width: 100%;
    height: auto;
    margin-top: 10px;
    border-top: 2px solid #7497A8;
}

.centered {
margin-left: 0px;
margin-right: 0px;
}

.cola {
margin: auto;
width: 50%;
padding: 10px;

}
.colb {
text-align: right;
margin-top: 50px;
float: left;
}


.verthorizctr {
display: table-cell;
text-align: center;
vertical-align: middle;
}