body {
	font-family: "Raleway", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	background:#ffffff;
	color:#212529;
}
a {
	color: #212529 !important;
}
ul.nav li a, ul.nav li a:visited {
    color: #212529 !important;
}

ul.nav li a:hover, ul.nav li a:active {
    color: #212529 !important;
}

ul.nav li.active a {
    color: #212529 !important;
}
h1, h2, h3, h4 {
	font-family: "Gilda Display", serif;
	font-weight: 400;
	font-style: normal;
	color:#043F45;
}
.bg-header {
	background:#043F45;
	color:#ffffff;
	text-transform:uppercase;
	font-size:14px;
}
.bg-green {
	background:#043F45;
	color:#ffffff;
}
.bg-opaque {
	background: rgba(229, 234, 241, 0.87);
}
.bg-opaque:hover {
	background: rgba(229, 234, 241, 0.95);
}
.sh-blue {
	background:#1d7589;
	color:#ffffff;
}
.fw-bold {
	color:#043F45;
}
.nav-format {
	font-size:16px;
	text-transform:uppercase;
}
.nav-small {
	font-size: 12px;
}
.small {
	font-size: 11px;
}
.header-sub {
	background:#E5EAF1;
}
.bg-sub {
	background:#E5EAF1;
}
.montsererrat {
	font-family: "Montserrat", sans-serif;
	font-weight: 400;
	font-style: normal;
}
.caphead {
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	text-transform: uppercase;
	margin-bottom:10px;
}
.caphead-2 {
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
	text-transform: uppercase;
	margin-bottom:10px;
}
.text-pink {
	color:#EF626C;
}
.btn-pink {
	background:#EF626C;
	color:#ffffff;
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	font-size: 14px;
	text-transform:uppercase;
}
.btn-pink:hover {
	background:#F27D85;
	color:#ffffff;
}
.btn-outline {
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	font-size: 14px;
	text-transform:uppercase;
}
.btn-grey {
	background:#E5EAF1;
	color:#212529;
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	font-size: 14px;
	text-transform:uppercase;
}
.btn-grey:hover {
	background:#eaeef3;
	color:#212529;
}
.text-green {
	color:#42626c;
}
.border-green {
	border: solid 1px #7099a6;
}
.border-sub {
	border: solid 1px #E5EAF1;
}
.letter-wide {
	letter-spacing: 0.1em;
}
.footer {
	background:#E5EAF1;
}
.covered {
  position:relative; /* make a new "render context", so absolute positioning is relative to this parent container */

  padding:30px; /* only needed for this demo */
}

.covered-img {
  background:url('../img/the-brando.png');
  opacity: .25;

  background-size:cover; /* cover will scale the image so that the smallest dimension = the widest dimension of the box */
  background-position:center; /* vs the top-left that is default */
  
  position:absolute; /* take me out of the render context! let me define my own positioning */
  top:0;bottom:0;left:0;right:0; /* this could also work with width:100%; height:100%;, but is simpler */
}