@charset "UTF-8";
/* CSS Document */

.navbar-light {
	border-bottom: 4px solid #333366;
}

header {
	font-family: calluna, serif;
	font-style: normal; 
	font-weight: 700;
	color: #333366 !important;
}

.nav-item, .nav-link, .mr-auto {
	color: #333366 !important;
	fill: #333366 !important;
}

#email-icon:hover {
	fill: #C33;
}

a .nav-link .nav-item .zoom:hover {
	color: #C33 !important;	
}
.collapse {
	margin-top: 5px;
}
.zoom {
    transition: transform .2s; /* Animation */
}

.zoom:hover {
    transform: scale(1.1); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}

.align-logo-center {
	margin-top: 60px;
	padding: 2% 10%;
	align-content: center;
	text-align: center;
}

ul li {
	display: inline-block;
	list-style: none;
	text-align: center;
	padding: 0 !important;
}

.sm-icons {
	float: none;
	margin: 0;
	padding: 0;
	align-content: center;
	text-align: center;
}

.sm-link {
	padding: 0;
	margin: 40px 2px 80px 0;
}

.sm-link:hover {
    transform: scale(1.1); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}

.nopadding {
   padding: 0 !important;
}

.bcircle {
	transition: opacity 1s ease-in-out;
	-webkit-animation: rotate20 2s; /* Chrome, Safari, Opera */
	animation: rotate20 2s;
	animation-name: rotate20;
	animation-delay: 0s;
}

.btext {
	-webkit-animation: fadeIn 4s;/* Chrome, Safari, Opera */
	animation: fadeIn 4s;
	animation-delay: 0s;
}

.rtext {
	-webkit-animation: fadeIn 5s;/* Chrome, Safari, Opera */
	animation: fadeIn 5s;
	animation-delay: 0s;
}

.st0 {
	-webkit-animation: fadeIn 3s;/* Chrome, Safari, Opera */
	animation: fadeIn 3s;
	animation-delay: 0s;	
}

@-webkit-keyframes fadeIn {
   0% {opacity: 0;}
	50% {opacity: 0;}
   100% {opacity: 1;}
}

@keyframes fadeIn {
   0% {opacity: 0;}
	50% {opacity: 0;}
   100% {opacity: 1;}
} 

/* Code for old Chrome, Safari and Opera */
@-webkit-keyframes rotate20 {
    from {transform: rotate(-10deg);
	transform-origin: 22% 50%;}
    to {transform: none;}
}

/* Standard syntax */
@keyframes rotate20 {
    from {transform: rotate(-10deg);
	transform-origin: 22% 50%;}
    to {transform: none;}
}

.main {
	margin: auto;
}

row {
	padding: 0;
	margin: 0 2rem !important;
}

.gallery-button {
	margin: 0;
	padding: 2rem 2rem;
}

h2 {
	font-family: roboto, sans-serif;
	font-style: bold; 
	font-weight: 700;
	color: #fff;
	background-color: #333366 !important;
	padding: .5rem 2rem;
	margin: 0;
}

footer {
	text-align: center;
	bottom: 0;
	font-family: calluna, serif;
	font-weight: 500;
}
footer p {
	font-size: .9rem;
}

h1 {
	font-family: roboto, sans-serif;
	font-style: bold; 
	font-weight: 700;
	color: #333366 !important;
}

.navbar-collapse .navbar- .navbar-toggler .navbar-toggler-icon {
	float: right !important;
}

.gallery-button h2:hover {
    background-color: #c33 !important;
}

.image-container {
  position: relative;
  width: 100%;
}

.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: #008CBA;
}

.text {
  color: white;
  font-size: 1.2rem;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
.image-container:hover .overlay {
  opacity: .9;	
}
.image-container:hover .text {
  opacity: 1;	
}

.btn-group {
	height: 3.3rem;
	margin-right: 3.3rem;
	text-align: center;
	border: 4px solid #336;
	color: #336;
}

.btn-dblue {
	height: 2.8rem;
	background: #fff; 
	color: #336 !important;
	font-size: 3rem;
	line-height: 1rem;
	vertical-align: center;
	border-radius: 0;
}


a .btn:hover, a .btn-dblue:hover, a zoom:hover {
	background: #C33;
	color: #fff;
	border-radius: 0;
}

.shift-up {
	margin-bottom: .5rem;
}

.toprow {
	margin-top: 1.75rem;
}

.smallspace {
	margin-top: 1rem;
}

.descriptive {
	padding: 0 2rem;
	margin: 0;
}

h6 {
	font-family: calluna, serif;
	font-style: bold; 
	font-weight: 700;
	color: #fff;
	background-color: rgba(51, 51, 102, 0.6) !important;
	padding: .5rem .5rem;
	margin: 0;
}
a .btn-dblue {
	color: #336;
	text-decoration: none;
	border-radius: 0;
}

a .shift-up:hover {
	background: #C33;
	color: #fff;
}

a:hover {
	text-decoration: none;
}

a .zoom:hover {
	color: #C33 !important;
	fill: #c33;
}

.progress {
	height: 1.75rem;
}

h4 {
	font-family: calluna, serif;
	font-style: bold; 
	font-weight: 700;
	color: #336;
	padding: .5rem 0;
	margin: 0;
}

p {
	font-family: roboto, sans-serif;
	font-style:normal; 
	font-weight:300;
	color: #336;
	padding: 1rem 0;
	margin: 0;
}

.row {
	margin-left: 0;
	margin-right: 0;
}

h2 {
    font-size: 1.2rem;
}
h5 {
    font-size: 1rem;
}
@media screen and (max-width: 420px) {
  h2 {
    font-size: 1.2rem;
  }
}