/* Variables */
/* Secondary Colours */
/* Site CSS */
/* ========== main css ========== */
html {
  scroll-behavior: smooth;
}

body {
  font-family: "Geomanist-regular", sans-serif;
}

html, body {
  height: 100%;
}

/* ========== MTC logo ========== */
#logo {
  width: 110px;
  /*margin-top: 18px;*/
}

/* ========== Top bar ========== */
.top-bar-container {
  background-color: #EDEDED;
  font-size: 11px;
  padding-top: 3px;
  padding-bottom: 3px;
}

.top-bar {
  text-transform: uppercase;
  color: #C6C6C6;
}

.top-bar a:link {
  color: #404040;
  text-decoration: none;
}

.top-bar a:visited {
  color: #404040;
  text-decoration: none;
}

.top-bar a:hover {
  color: #318390;
  text-decoration: none;
}

.top-bar a:active {
  color: #404040;
  text-decoration: none;
}

.divider:last-child {
  display: none;
}

/* ========== Default Links ========== */
a:link {
  color: #404040;
  text-decoration: none !important;
  transition: color 250ms ease-in-out;
}

a:hover {
  color: #318390;
  text-decoration: none !important;
}

a:visited {
  color: #404040;
  text-decoration: none !important;
}

a:active {
  color: #318390;
  text-decoration: none !important;
}

/* ========== New Button ========== */
.btn-mtc {
  border-color: #318390;
  background-color: #318390;
  color: #ffffff !important;
  text-transform: uppercase;
  border-radius: 0;
}

.btn-mtc:hover {
  border-color: #404040;
  background-color: #404040;
  color: #ffffff !important;
  text-transform: uppercase;
  border-radius: 0;
}

.btn-mtc:visited {
  border-color: #318390;
  background-color: #318390;
  color: #ffffff !important;
  text-transform: uppercase;
  border-radius: 0;
}

.btn-mtc:active {
  border-color: #404040;
  background-color: #404040;
  color: #ffffff !important;
  text-transform: uppercase;
  border-radius: 0;
}

/* ========= Homepage Vision Text ========= */
.homepage-vision {
  background-color: #318390;
}

@media only screen and (min-width: 320px) {
  .homepage-vision-text {
    font-family: "geomanist-light", "arial", sans-serif !important;
    font-size: 20px !important;
    color: #ffffff !important;
    margin-top: 30px;
    margin-bottom: 30px;
    text-transform: uppercase;
    line-height: 28px;
  }
}
@media only screen and (min-width: 480px) {
  .homepage-vision-text {
    font-family: "geomanist-light", "arial", sans-serif !important;
    font-size: 24px !important;
    color: #ffffff !important;
    margin-top: 30px;
    margin-bottom: 30px;
    text-transform: uppercase;
    line-height: 32px;
  }
}
@media only screen and (min-width: 767px) {
  .homepage-vision-text {
    font-family: "geomanist-light", "arial", sans-serif !important;
    font-size: 32px !important;
    color: #ffffff !important;
    margin-top: 30px;
    margin-bottom: 30px;
    text-transform: uppercase;
    line-height: 34px;
  }
}
@media only screen and (min-width: 979px) {
  .homepage-vision-text {
    font-family: "geomanist-light", "arial", sans-serif !important;
    font-size: 36px !important;
    color: #ffffff !important;
    margin-top: 30px;
    margin-bottom: 30px;
    text-transform: uppercase;
    line-height: 38px;
  }
}
@media only screen and (min-width: 1200px) {
  .homepage-vision-text {
    font-family: "geomanist-light", "arial", sans-serif !important;
    font-size: 40px !important;
    color: #ffffff !important;
    margin-top: 30px;
    margin-bottom: 30px;
    text-transform: uppercase;
    line-height: 42px;
  }
}
/* ========== Homepage Market Panels ========== */
.homepage-market-panels {
  margin-top: 100px;
}

/* ========== Overlay Panels ========== */
.overlay-panel-div {
  position: relative;
}

.overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(64, 64, 64);
  background: -moz-linear-gradient(69deg, rgba(64, 64, 64, 0.8) 0%, rgba(42, 110, 120, 0.8) 35%, rgba(0, 212, 255, 0.8) 100%);
  background: -webkit-linear-gradient(69deg, rgba(64, 64, 64, 0.8) 0%, rgba(42, 110, 120, 0.8) 35%, rgba(0, 212, 255, 0.8) 100%);
  background: linear-gradient(69deg, rgba(64, 64, 64, 0.8) 0%, rgba(42, 110, 120, 0.8) 35%, rgba(0, 212, 255, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#404040",endColorstr="#00d4ff",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.overlay-panel-div:hover .overlay-panel {
  height: 100%;
}

.overlay-panel-div:hover .overlay-image {
  filter: grayscale(100%);
}

.overlay-panel-footer-title {
  background-color: #318390;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.overlay-panel-content {
  padding: 15px;
}

.overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.overlay-panel-readmore {
  padding-bottom: 20px;
}

.nopadding {
  padding: 0 !important;
  margin: 0 !important;
}

/* ============ Market Nav Buttons =========== */
.btn-landing-nav {
  color: #ffffff !important;
  background-color: #318390;
  border-color: #318390;
  text-transform: uppercase;
  padding: 10px;
  margin-bottom: 20px;
}

.btn-landing-nav:link {
  color: #ffffff !important;
  background-color: #318390;
  border-color: #318390;
  text-transform: uppercase;
  padding: 10px;
}

.btn-landing-nav:hover {
  color: #ffffff !important;
  background-color: #404040;
  border-color: #404040;
  text-transform: uppercase;
  padding: 10px;
}

.btn-landing-nav:visited {
  color: #ffffff !important;
  background-color: #318390;
  border-color: #318390;
  text-transform: uppercase;
  padding: 10px;
}

.btn-landing-nav:active {
  color: #ffffff !important;
  background-color: #404040;
  border-color: #404040;
  text-transform: uppercase;
  padding: 10px;
}

/* ========== Footer ========== */
.footer {
  margin-top: 40px;
  padding: 40px 0 40px 0;
  background-color: #318390;
  background: -webkit-linear-gradient(#318390 0%, #1E4950 100%);
  background: -o-linear-gradient(#318390 0%, #1E4950 100%);
  background: linear-gradient(#318390 0%, #1E4950 100%);
  color: #ffffff;
}

.sm-icon {
  margin-left: 3px;
  margin-right: 3px;
}

.footer-logo {
  width: 120px !important;
  margin-bottom: 30px;
}

.footer a:link {
  color: #ffffff !important;
}

.footer a:hover {
  color: #C6C6C6 !important;
}

.footer a:visited {
  color: #ffffff !important;
}

.footer a:active {
  color: #C6C6C6 !important;
}

.site-footer-logo {
  margin-bottom: 30px;
}

.footer-padding {
  padding-bottom: 20px;
}

/* ========== Footer list ========== */
.latest-opportunities-footer-list {
  margin-left: -22px;
}

/* ========== Footer Nav ========== */
.footer-nav {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.footer-nav-item {
  font-family: "geomanist-medium", sans-serif;
  line-height: 20pt;
}

.footer-back-to-top {
  margin-top: 40px;
}

/* ========== Copyright Bar ========== */
.copyright-bar {
  font-size: 12px;
  background-color: #000000;
  color: #6F6F6F !important;
  padding: 16px 0 14px 0;
}

/* ========== MQ ========== */
@media only screen and (min-width: 320px) {
  .copyright-menu ul {
    text-align: center !important;
    font-size: 14px;
  }
  .copyright-menu li {
    display: block;
  }
}
@media only screen and (min-width: 480px) {
  .copyright-menu ul {
    text-align: center !important;
    font-size: 14px;
  }
  .copyright-menu li {
    display: block;
  }
}
@media only screen and (min-width: 767px) {
  .copyright-menu ul {
    text-align: center !important;
    font-size: 14px;
  }
  .copyright-menu li {
    display: block;
  }
}
@media only screen and (min-width: 979px) {
  .copyright-menu ul {
    margin: 0;
    padding-left: -15px !important;
    margin-left: -15px !important;
    list-style-type: none !important;
    font-size: 12px;
  }
  .copyright-menu li {
    display: inline;
    padding-right: 15px;
  }
}
@media only screen and (min-width: 1200px) {
  .copyright-menu ul {
    margin: 0;
    padding-left: -15px !important;
    margin-left: -15px !important;
    list-style-type: none !important;
    font-size: 12px;
  }
  .copyright-menu li {
    display: inline;
    padding-right: 15px;
  }
}
.copyright-menu a:link {
  color: #6F6F6F !important;
}

.copyright-menu a:hover {
  text-decoration: none;
  color: #ffffff !important;
}

.copyright-menu a:visited {
  color: #6F6F6F !important;
}

.copyright-menu a:active {
  text-decoration: none;
  color: #ffffff !important;
}

.inner-padding {
  padding: 15px !important;
}

.htdl-link:link {
  color: #6F6F6F !important;
  text-decoration: none;
}

.htdl-link:visited {
  color: #6F6F6F !important;
  text-decoration: none;
}

.htdl-link:hover {
  color: #EDEDED !important;
  text-decoration: none;
}

.htdl-link:active {
  color: #EDEDED !important;
  text-decoration: none;
}

/* ========== MTC Text Styles ========== */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  line-height: 1.35;
}

h1 {
  font-family: "geomanist-bold", "arial", sans-serif !important;
  font-size: 40px;
  text-transform: uppercase;
  color: #404040;
}

h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
  color: #6F6F6F !important;
}

h2 {
  font-family: "geomanist-regular", "arial", sans-serif !important;
  text-transform: uppercase !important;
  font-size: 30px !important;
  color: #318390;
}

h3 {
  font-family: "geomanist-medium", "arial", sans-serif !important;
  color: #404040;
}

/*
.lead::first-letter {
  -webkit-initial-letter: 2;
  initial-letter: 2;
  color: $mtcLightGreen;
  float: left;
  line-height: 60px;
  font-size: 3em;
  margin: 0 0.1em 0 0; }
*/
.lead {
  color: #404040 !important;
  text-transform: none;
}

strong {
  font-family: "geomanist-medium", "arial", sans-serif;
}

blockquote {
  border-left: 5px solid #318390;
  background-color: #EDEDED;
}

.quotecitation {
  color: #318390;
  font-family: "geomanist-medium", "arial", sans-serif;
}

.breadcrumb {
  background-color: #EDEDED !important;
  border-radius: 0 !important;
}

.landing-page-title-block {
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.landing-page-section-button:link, .landing-page-section-button:visited {
  display: block;
  font-size: 20px;
  color: #ffffff !important;
  background-color: #318390;
  text-transform: uppercase;
  border: 10px solid #ffffff;
  text-decoration: none;
  padding: 10px 0px 10px 0px;
  border-radius: 3px !important;
  border-collapse: separate;
}

.landing-page-section-button:hover, .landing-page-section-button:active {
  display: block;
  font-size: 20px;
  color: #ffffff !important;
  background-color: #404040;
  text-transform: uppercase;
  border: 10px solid #ffffff;
  text-decoration: none;
  border-radius: 3px !important;
  border-collapse: separate;
}

@media only screen and (min-width: 320px) {
  .landing-page-title {
    display: block;
    font-family: "geomanist-black", sans-serif;
    text-transform: uppercase;
    color: #ffffff !important;
    font-size: 40px;
    line-height: 40pt;
    border-top: 2px solid #318390;
    border-bottom: 2px solid #318390;
    padding-top: 40px;
    padding-bottom: 40px;
    text-align: center;
    width: 280px;
  }
  .landing-page-more-button a:link {
    font-family: "geomanist-regular", sans-serif;
    text-transform: uppercase;
    position: absolute;
    display: block;
    margin-top: 20px;
    color: #ffffff !important;
    font-size: 20px;
    background-color: #318390;
    padding: 15px 30px 15px 30px;
    text-align: center;
    left: 50%;
    top: 140%;
    transform: translate(-50%, -50%);
    text-decoration: none;
    border-radius: 3px;
    width: 100%;
  }
  .landing-page-more-button a:visited {
    color: #ffffff !important;
  }
  .landing-page-more-button a:hover {
    color: #ffffff !important;
    background-color: #404040;
  }
  .landing-page-more-button a:active {
    color: #ffffff !important;
    background-color: #404040;
  }
}
@media only screen and (min-width: 1200px) {
  .landing-page-title {
    display: block;
    font-family: "geomanist-black", sans-serif;
    text-transform: uppercase;
    color: #ffffff !important;
    font-size: 64px;
    width: 800px !important;
    line-height: 50pt;
    border-top: 2px solid #318390;
    border-bottom: 2px solid #318390;
    padding-top: 40px;
    padding-bottom: 40px;
    text-align: center;
  }
  .landing-page-more-button a:link {
    font-family: "geomanist-regular", sans-serif;
    text-transform: uppercase;
    position: absolute;
    display: block;
    margin-top: 20px;
    color: #ffffff !important;
    font-size: 20px;
    background-color: #318390;
    padding: 15px 30px 15px 30px;
    text-align: center;
    left: 50%;
    top: 140%;
    transform: translate(-50%, -50%);
    text-decoration: none;
    border-radius: 3px;
    width: 40%;
  }
  .landing-page-more-button a:visited {
    color: #ffffff !important;
  }
  .landing-page-more-button a:hover {
    color: #ffffff !important;
    background-color: #404040;
  }
  .landing-page-more-button a:active {
    color: #ffffff !important;
    background-color: #404040;
  }
}
/* ========== DocType Controls ========== */
/* ========== Embeds (Video etc) ========= */
.embed-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.embed-container iframe, .embed-container object, .embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* ========== Sidebar quotes ========== */
.sidebarquote {
  margin-top: 30px;
  margin-bottom: 30px;
}

.sidebarquote-left-quote {
  color: #318390;
}

.sidebarquote-right-quote {
  color: #318390;
}

.sidebarquote-text {
  color: #318390;
  font-family: "geomanist-light", "arial", sans-serif;
  font-size: 24px;
}

.sidebarquote-citation {
  color: #404040;
  font-family: "geomanist-medium", sans-serif;
  font-size: 18px;
}

/* ========== Accordion Panels ========== */
.panel-mtc {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.panel-mtc > .panel-heading {
  color: #ffffff !important;
  text-transform: uppercase !important;
  background-color: #318390 !important;
  border-radius: 0 !important;
}

.panel-mtc > .panel-heading:hover {
  color: #ffffff !important;
  text-transform: uppercase !important;
  background-color: #404040 !important;
  border-radius: 0 !important;
}

/* ========== Link Panels ========== */
.page-title {
  /*margin-bottom:20px;*/
}

/* ========== Attachments & Links ========= */
.filesize {
  color: #404040;
}

.attachmentlinks {
  list-style: none;
  margin-left: -40px;
}

a.link-icon:before,
a.link-icon.link-file[href]:before {
  color: #318390;
  content: "\f016";
  /* generic file icon */
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
  width: 20px;
  text-align: right;
  margin-right: 10px;
}

a[href$=".txt"].link-icon:before,
a.link-icon.link-text[href]:before {
  content: "\f0f6";
  /*Text*/
}

a[href$=".pdf"].link-icon:before,
a.link-icon.link-pdf[href]:before {
  content: "\f1c1";
  /*PDF*/
}

a[href$=".doc"].link-icon:before,
a[href$=".docx"].link-icon:before,
a.link-icon.link-word[href]:before {
  content: "\f1c2";
  /*Word*/
}

a[href$=".xls"].link-icon:before,
a[href$=".xlsx"].link-icon:before,
a.link-icon.link-excel[href]:before {
  content: "\f1c3";
  /*Excel*/
}

a[href$=".ppt"].link-icon:before,
a[href$=".pptx"].link-icon:before,
a.link-icon.link-powerpoint[href]:before {
  content: "\f1c4";
  /*Powerpoint*/
}

a[href$=".gif"].link-icon:before,
a[href$=".jpg"].link-icon:before,
a[href$=".jpeg"].link-icon:before,
a[href$=".png"].link-icon:before,
a[href$=".bmp"].link-icon:before,
a[href$=".tif"].link-icon:before,
a.link-icon.link-image[href]:before {
  content: "\f1c5";
  /*Image*/
}

a[href$=".zip"].link-icon:before,
a[href$=".zipx"].link-icon:before,
a[href$=".rar"].link-icon:before,
a[href$=".tar"].link-icon:before,
a[href$=".gz"].link-icon:before,
a[href$=".dmg"].link-icon:before,
a[href$=".iso"].link-icon:before,
a.link-icon.link-archive[href]:before {
  content: "\f1c6";
  /*Archive*/
}

a[href$=".wav"].link-icon:before,
a[href$=".mp3"].link-icon:before,
a[href$=".fla"].link-icon:before,
a[href$=".flac"].link-icon:before,
a[href$=".ra"].link-icon:before,
a[href$=".rma"].link-icon:before,
a[href$=".aif"].link-icon:before,
a[href$=".aiff"].link-icon:before,
a[href$=".aa"].link-icon:before,
a[href$=".aac"].link-icon:before,
a[href$=".aax"].link-icon:before,
a[href$=".ac3"].link-icon:before,
a[href$=".au"].link-icon:before,
a[href$=".ogg"].link-icon:before,
a[href$=".avr"].link-icon:before,
a[href$=".3ga"].link-icon:before,
a[href$=".flac"].link-icon:before,
a[href$=".mid"].link-icon:before,
a[href$=".midi"].link-icon:before,
a[href$=".m4a"].link-icon:before,
a[href$=".mp4a"].link-icon:before,
a[href$=".amz"].link-icon:before,
a[href$=".mka"].link-icon:before,
a[href$=".asx"].link-icon:before,
a[href$=".pcm"].link-icon:before,
a[href$=".m3u"].link-icon:before,
a[href$=".wma"].link-icon:before,
a[href$=".xwma"].link-icon:before,
a.link-icon.link-audio[href]:before {
  content: "\f1c7";
  /*Audio*/
}

a[href$=".avi"].link-icon:before,
a[href$=".mpg"].link-icon:before,
a[href$=".mp4"].link-icon:before,
a[href$=".mkv"].link-icon:before,
a[href$=".mov"].link-icon:before,
a[href$=".wmv"].link-icon:before,
a[href$=".vp6"].link-icon:before,
a[href$=".264"].link-icon:before,
a[href$=".vid"].link-icon:before,
a[href$=".rv"].link-icon:before,
a[href$=".webm"].link-icon:before,
a[href$=".swf"].link-icon:before,
a[href$=".h264"].link-icon:before,
a[href$=".flv"].link-icon:before,
a[href$=".mk3d"].link-icon:before,
a[href$=".gifv"].link-icon:before,
a[href$=".oggv"].link-icon:before,
a[href$=".3gp"].link-icon:before,
a[href$=".m4v"].link-icon:before,
a[href$=".movie"].link-icon:before,
a[href$=".divx"].link-icon:before,
a.link-icon.link-video[href]:before {
  content: "\f1c8";
  /*Video*/
}

a[href$=".css"].link-icon:before,
a[href$=".js"].link-icon:before,
a[href$=".py"].link-icon:before,
a[href$=".git"].link-icon:before,
a[href$=".py"].link-icon:before,
a[href$=".cpp"].link-icon:before,
a[href$=".h"].link-icon:before,
a[href$=".ini"].link-icon:before,
a[href$=".config"].link-icon:before,
a.link-icon.link-code[href]:before {
  content: "\f1c9";
  /*code*/
}

a[href$=".exe"].link-icon:before,
a[href$=".jar"].link-icon:before,
a[href$=".dll"].link-icon:before,
a[href$=".bat"].link-icon:before,
a[href$=".pl"].link-icon:before,
a[href$=".scr"].link-icon:before,
a[href$=".msi"].link-icon:before,
a[href$=".app"].link-icon:before,
a[href$=".deb"].link-icon:before,
a[href$=".apk"].link-icon:before,
a[href$=".jar"].link-icon:before,
a[href$=".vb"].link-icon:before,
a[href$=".prg"].link-icon:before,
a[href$=".sh"].link-icon:before,
a.link-icon.link-exe[href]:before {
  content: "\f085";
  /*Executable*/
}

a[href$=".com"].link-icon:before,
a[href$=".net"].link-icon:before,
a[href$=".org"].link-icon:before,
a[href$=".edu"].link-icon:before,
a[href$=".gov"].link-icon:before,
a[href$=".mil"].link-icon:before,
a[href$="/"].link-icon:before,
a[href$=".html"].link-icon:before,
a[href$=".htm"].link-icon:before,
a[href$=".xhtml"].link-icon:before,
a[href$=".jhtml"].link-icon:before,
a[href$=".php"].link-icon:before,
a[href$=".php3"].link-icon:before,
a[href$=".php4"].link-icon:before,
a[href$=".php5"].link-icon:before,
a[href$=".phtml"].link-icon:before,
a[href$=".asp"].link-icon:before,
a[href$=".aspx"].link-icon:before,
a[href$=".cfm"].link-icon:before,
a[href*="?"].link-icon:before,
a[href*="#"].link-icon:before,
a.link-icon:not([href*="."]):before,
a.link-icon.link[href]:before {
  content: "\f0c1";
  /*link*/
}

/* ========== Button Group ========== */
.btn-mtc-group {
  background-color: #318390;
  border-radius: 0;
  border: 2px solid white;
  display: block;
  text-transform: uppercase;
}

.btn-mtc-group:link {
  color: white;
  background-color: #318390;
  border-radius: 0;
  border: 2px solid white;
  display: block;
  text-transform: uppercase;
}

.btn-mtc-group:hover {
  background-color: #404040;
  border-radius: 0;
  border: 2px solid white;
  display: block;
  text-transform: uppercase;
}

/* ========== MTC Tables ========== */
.mtc-table {
  border-collapse: collapse;
}

.mtc-table th {
  /* bold */
  background-color: #318390;
  color: #ffffff !important;
  font-family: "geomanist-medium", sans-serif;
  padding: 5px;
  border: 1px solid #404040;
}

.mtc-table tr {
  padding: 5px;
}

.mtc-table td {
  padding: 5px;
  border: 1px solid #404040;
}

.mtc-table tr:nth-child(even) {
  background-color: #EDEDED;
}

.mtc-table tr:nth-child(odd) {
  background-color: #ffffff;
}

/* ========== Tab Panels ========== */
.tab-panel-content {
  padding: 10px;
}

.nav-tabs {
  border-bottom: 1px solid #404040;
  text-transform: uppercase;
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
  color: #404040;
  cursor: default;
  background-color: #ffffff;
  border: 1px solid #404040;
  border-bottom-color: transparent;
}

/* ========== Zoom Image Rollovers ========== */
.zoom-image-preview {
  position: relative;
  width: 100%;
  margin-bottom: 20px;
}

.zoom-image-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: 0.5s ease;
  background-color: rgba(0, 0, 0, 0.5);
}

.zoom-image-preview:hover .zoom-image-overlay {
  opacity: 1;
}

.zoom-image-text {
  text-transform: uppercase;
  color: #ffffff;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

/* ========== Sub Navigation ========== */
.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
  color: #318390;
  background-color: #EDEDED;
}

.nav-pills > li > a {
  border-radius: 0;
}

/* ========== Home latest news carousel ========== */
.home-latest-news {
  margin-top: 60px;
  padding-top: 30px;
  padding-bottom: 30px;
  border-top: 4px solid #38919D;
}

.news-category-title {
  font-family: "geomanist-bold", "arial", sans-serif !important;
  text-transform: uppercase !important;
  font-size: 24px !important;
  margin-bottom: 30px;
}

.news-category-title a:link {
  color: #404040 !important;
}

.news-category-title a:hover {
  color: #318390 !important;
}

.news-category-title a:visited {
  color: #404040 !important;
}

.news-category-title a:active {
  color: #318390 !important;
}

.home-news-date {
  padding-top: 5px;
  color: #404040;
}

.members-news-date {
  padding-top: 5px;
  color: #404040;
}

.home-news-image {
  /* filter: grayscale(100%); */
}

.home-news-image:hover {
  /* filter: none; */
}

.members-news-image {
  /* filter: grayscale(100%); */
}

.members-news-image:hover {
  /* filter: none; */
}

/* ========== Breadcrumbs ========== */
.pagination > li > a, .pagination > li > span {
  color: #318390;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid #404040;
}

.pagination > li > a:hover, .pagination > li > span {
  color: #ffffff;
  text-decoration: none;
  background-color: #404040;
  border: 1px solid #404040;
}

.page-navigation {
  margin-top: 30px;
  margin-bottom: 30px;
}

/* ========== Macro (article) Views ========== */
.article-block {
  margin-bottom: 30px;
}

.article-date {
  margin-top: 5px;
}

.article-img-container {
  overflow: hidden;
}

.article-img {
  transition: 0.2s;
}

.article-img:hover {
  transform: scale(1.3);
  -ms-transform: scale(1.3); /* IE 9 */
  -moz-transform: scale(1.3); /* Firefox */
  -webkit-transform: scale(1.3); /* Safari and Chrome */
  -o-transform: scale(1.3); /* Opera */
}

/* ========== Macro (article) Views ========== */
.opportunities-filter {
  margin-top: 20px;
  margin-bottom: 30px;
}

.button-padding {
  margin: 3px;
}

/* ========== Collapse Wells ========== */
.well {
  border-radius: 0;
  background-color: #EDEDED !important;
}

/* ========== Tags ========== */
.tags {
  display: inline !important;
  list-style-type: none !important;
}

.tag-item {
  float: left;
  padding: 5px !important;
  margin: 3px;
  background-color: #318390 !important;
  color: #ffffff !important;
}

.tag-link {
  color: #ffffff !important;
}

.tag-link:hover {
  color: #404040 !important;
}

.tag-link:visited {
  color: #ffffff !important;
}

.tag-link:active {
  color: #404040 !important;
}

/* ========== Homepage Case Study Carousel ========== */
.case-study-category-title {
  font-family: "geomanist-bold", "arial", sans-serif !important;
  text-transform: uppercase !important;
  font-size: 24px !important;
  margin-bottom: 30px;
}

.home-case-study-carousel {
  margin-top: 60px;
  padding-top: 30px;
  padding-bottom: 30px;
  border-top: 4px solid #318390;
  background-color: #EDEDED;
}

.home-case-study-image {
  filter: grayscale(100%);
}

.home-case-study-image:hover {
  filter: none;
}

/* ========== MTC Forms ========== */
.label {
  color: #1E4950 !important;
  font-weight: 800;
  font-size: 14px;
}

.umbracoForms-Indicator {
  color: #C41E1E !important;
}

.field-validation-error {
  color: #C41E1E !important;
}

/* ========== Halo ========== */
.form-control {
  border-radius: 0px !important;
}

.form-control:focus {
  border-color: #404040;
  box-shadow: 0px 1px 1px rgb(237, 237, 237) inset, 0px 0px 8px #318390;
}

/* ========== Home industry events carousel ========== */
.home-industry-events-carousel {
  /*margin-top: 60px; */
  padding-top: 30px;
  padding-bottom: 30px;
  border-top: 4px solid #38919D;
}

.industry-events-category-title {
  font-family: "geomanist-bold", "arial", sans-serif !important;
  text-transform: uppercase !important;
  font-size: 24px !important;
  margin-bottom: 30px;
}

.home-industrial-event-title a:link {
  color: #404040 !important;
}

.home-industrial-event-title a:hover {
  color: #318390 !important;
}

.home-industrial-event-title a:visited {
  color: #404040 !important;
}

.home-industrial-event-title a:active {
  color: #318390 !important;
}

.home-industrial-event-date {
  color: #404040;
}

/* ========== Executive Team Member Detail ========== */
.exec-team-member {
  margin-bottom: 30px;
}

.board-member {
  margin-bottom: 30px;
}

/* ========== Background panel colours ========== */
.bg-light-green {
  background-color: #318390;
  padding: 10px;
  margin-top: 5px;
}

.bg-light-blue {
  background-color: #D5ECF4;
  padding: 10px;
  margin-top: 5px;
}

.bg-light-grey-30 {
  background-color: #C6C6C6;
  padding: 10px;
  margin-top: 5px;
}

.bg-light-grey {
  background-color: #EDEDED;
  padding: 10px;
  margin-top: 5px;
}

/* ========== Quote Carousel ========== */
.quote-carousel h3 {
  font-family: "geomanist-light", "arial", sans-serif !important;
  font-size: 34px !important;
  color: #38919D;
}

.quote-carousel p {
  font-family: "geomanist-medium", "arial", sans-serif !important;
  font-size: 18px !important;
  color: #404040;
}

.quote-carousel {
  margin-top: 30px;
  border-top: 2px solid #38919D;
}

video {
  margin-bottom: -5px !important;
}

/* =========== Nav updates ========= */
@media (min-width: 768px) {
  .navbar-collapse.collapse {
    margin-top: 35px;
  }
}
@media (min-width: 768px) {
  .navbar-right {
    margin-right: -30px;
    /* Change value to -30px */
  }
}
/* ========== Rollover Overlay Panels (Green) ========== */
.green-overlay-panel-div {
  position: relative;
}

.green-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.green-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(64, 64, 64);
  background: -moz-linear-gradient(69deg, rgba(64, 64, 64, 0.8) 0%, rgba(42, 110, 120, 0.8) 35%, rgba(0, 212, 255, 0.8) 100%);
  background: -webkit-linear-gradient(69deg, rgba(64, 64, 64, 0.8) 0%, rgba(42, 110, 120, 0.8) 35%, rgba(0, 212, 255, 0.8) 100%);
  background: linear-gradient(69deg, rgba(64, 64, 64, 0.8) 0%, rgba(42, 110, 120, 0.8) 35%, rgba(0, 212, 255, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#404040",endColorstr="#00d4ff",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.green-overlay-panel-div:hover .green-overlay-panel {
  height: 100%;
}

.green-overlay-panel-div:hover .green-overlay-image {
  filter: grayscale(100%);
}

.green-overlay-panel-footer-title {
  background-color: #318390;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.green-overlay-panel-content {
  padding: 15px;
}

.green-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.green-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.green-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Orange) ========== */
.orange-overlay-panel-div {
  position: relative;
}

.orange-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.orange-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(64, 64, 64);
  background: -moz-linear-gradient(90deg, rgba(64, 64, 64, 0.8) 0%, rgba(237, 107, 6, 0.8) 35%, rgba(237, 107, 6, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(64, 64, 64, 0.8) 0%, rgba(237, 107, 6, 0.8) 35%, rgba(237, 107, 6, 0.8) 100%);
  background: linear-gradient(90deg, rgba(64, 64, 64, 0.8) 0%, rgba(237, 107, 6, 0.8) 35%, rgba(237, 107, 6, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#404040",endColorstr="#ed6b06",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.orange-overlay-panel-div:hover .orange-overlay-panel {
  height: 100%;
}

.orange-overlay-panel-div:hover .orange-overlay-image {
  filter: grayscale(100%);
}

.orange-overlay-panel-footer-title {
  background-color: #ff6900;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.orange-overlay-panel-content {
  padding: 15px;
}

.orange-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.orange-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.orange-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Purple) ========== */
.purple-overlay-panel-div {
  position: relative;
}

.purple-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.purple-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(64, 64, 64);
  background: -moz-linear-gradient(90deg, rgba(64, 64, 64, 0.8) 0%, rgba(152, 119, 175, 0.8) 35%, rgba(152, 119, 175, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(64, 64, 64, 0.8) 0%, rgba(152, 119, 175, 0.8) 35%, rgba(152, 119, 175, 0.8) 100%);
  background: linear-gradient(90deg, rgba(64, 64, 64, 0.8) 0%, rgba(152, 119, 175, 0.8) 35%, rgba(152, 119, 175, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#404040",endColorstr="#9877af",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.purple-overlay-panel-div:hover .purple-overlay-panel {
  height: 100%;
}

.purple-overlay-panel-div:hover .purple-overlay-image {
  filter: grayscale(100%);
}

.purple-overlay-panel-footer-title {
  background-color: #9877AF;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.purple-overlay-panel-content {
  padding: 15px;
}

.purple-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.purple-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.purple-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Dark Grey) ========== */
.dark-grey-overlay-panel-div {
  position: relative;
}

.dark-grey-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.dark-grey-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(64, 64, 64, 0.8) 35%, rgba(64, 64, 64, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(64, 64, 64, 0.8) 35%, rgba(64, 64, 64, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(64, 64, 64, 0.8) 35%, rgba(64, 64, 64, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#404040",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.dark-grey-overlay-panel-div:hover .dark-grey-overlay-panel {
  height: 100%;
}

.dark-grey-overlay-panel-div:hover .dark-grey-overlay-image {
  filter: grayscale(100%);
}

.dark-grey-overlay-panel-footer-title {
  background-color: #404040;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.dark-grey-overlay-panel-content {
  padding: 15px;
}

.dark-grey-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.dark-grey-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.dark-grey-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Green) ========== */
.secondary-green-overlay-panel-div {
  position: relative;
}

.secondary-green-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-green-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 112, 65, 0.8) 35%, rgba(0, 112, 65, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 112, 65, 0.8) 35%, rgba(0, 112, 65, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 112, 65, 0.8) 35%, rgba(0, 112, 65, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#007041",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-green-overlay-panel-div:hover .secondary-green-overlay-panel {
  height: 100%;
}

.secondary-green-overlay-panel-div:hover .secondary-green-overlay-image {
  filter: grayscale(100%);
}

.secondary-green-overlay-panel-footer-title {
  background-color: #007041;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-green-overlay-panel-content {
  padding: 15px;
}

.secondary-green-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-green-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-green-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Green Dark) ========== */
.secondary-green-dark-overlay-panel-div {
  position: relative;
}

.secondary-green-dark-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-green-dark-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(54, 87, 59, 0.8) 35%, rgba(54, 87, 59, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(54, 87, 59, 0.8) 35%, rgba(54, 87, 59, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(54, 87, 59, 0.8) 35%, rgba(54, 87, 59, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#36573B",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-green-dark-overlay-panel-div:hover .secondary-green-dark-overlay-panel {
  height: 100%;
}

.secondary-green-dark-overlay-panel-div:hover .secondary-green-dark-overlay-image {
  filter: grayscale(100%);
}

.secondary-green-dark-overlay-panel-footer-title {
  background-color: #36573B;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-green-dark-overlay-panel-content {
  padding: 15px;
}

.secondary-green-dark-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-green-dark-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-green-dark-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Green Light) ========== */
.secondary-green-light-overlay-panel-div {
  position: relative;
}

.secondary-green-light-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-green-light-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(34, 136, 72, 0.8) 35%, rgba(34, 136, 72, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(34, 136, 72, 0.8) 35%, rgba(34, 136, 72, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(34, 136, 72, 0.8) 35%, rgba(34, 136, 72, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#228848",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-green-light-overlay-panel-div:hover .secondary-green-light-overlay-panel {
  height: 100%;
}

.secondary-green-light-overlay-panel-div:hover .secondary-green-light-overlay-image {
  filter: grayscale(100%);
}

.secondary-green-light-overlay-panel-footer-title {
  background-color: #228848;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-green-light-overlay-panel-content {
  padding: 15px;
}

.secondary-green-light-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-green-light-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-green-light-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Sunglow) ========== */
.secondary-sunglow-overlay-panel-div {
  position: relative;
}

.secondary-sunglow-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-sunglow-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(255, 199, 44, 0.8) 35%, rgba(255, 199, 44, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(255, 199, 44, 0.8) 35%, rgba(255, 199, 44, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(255, 199, 44, 0.8) 35%, rgba(255, 199, 44, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#FFC72C",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-sunglow-overlay-panel-div:hover .secondary-sunglow-overlay-panel {
  height: 100%;
}

.secondary-sunglow-overlay-panel-div:hover .secondary-sunglow-overlay-image {
  filter: grayscale(100%);
}

.secondary-sunglow-overlay-panel-footer-title {
  background-color: #FFC72C;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-sunglow-overlay-panel-content {
  padding: 15px;
}

.secondary-sunglow-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-sunglow-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-sunglow-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Bronze) ========== */
.secondary-bronze-overlay-panel-div {
  position: relative;
}

.secondary-bronze-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-bronze-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(181, 133, 0, 0.8) 35%, rgba(181, 133, 0, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(181, 133, 0, 0.8) 35%, rgba(181, 133, 0, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(181, 133, 0, 0.8) 35%, rgba(181, 133, 0, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#B58500",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-bronze-overlay-panel-div:hover .secondary-bronze-overlay-panel {
  height: 100%;
}

.secondary-bronze-overlay-panel-div:hover .secondary-bronze-overlay-image {
  filter: grayscale(100%);
}

.secondary-bronze-overlay-panel-footer-title {
  background-color: #B58500;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-bronze-overlay-panel-content {
  padding: 15px;
}

.secondary-bronze-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-bronze-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-bronze-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Tango) ========== */
.secondary-tango-overlay-panel-div {
  position: relative;
}

.secondary-tango-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-tango-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(232, 119, 34, 0.8) 35%, rgba(232, 119, 34, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(232, 119, 34, 0.8) 35%, rgba(232, 119, 34, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(232, 119, 34, 0.8) 35%, rgba(232, 119, 34, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#E87722",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-tango-overlay-panel-div:hover .secondary-tango-overlay-panel {
  height: 100%;
}

.secondary-tango-overlay-panel-div:hover .secondary-tango-overlay-image {
  filter: grayscale(100%);
}

.secondary-tango-overlay-panel-footer-title {
  background-color: #E87722;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-tango-overlay-panel-content {
  padding: 15px;
}

.secondary-tango-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-tango-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-tango-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Beige) ========== */
.secondary-beige-overlay-panel-div {
  position: relative;
}

.secondary-beige-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-beige-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(236, 161, 84, 0.8) 35%, rgba(236, 161, 84, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(236, 161, 84, 0.8) 35%, rgba(236, 161, 84, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(236, 161, 84, 0.8) 35%, rgba(236, 161, 84, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#ECA154",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-beige-overlay-panel-div:hover .secondary-beige-overlay-panel {
  height: 100%;
}

.secondary-beige-overlay-panel-div:hover .secondary-beige-overlay-image {
  filter: grayscale(100%);
}

.secondary-beige-overlay-panel-footer-title {
  background-color: #ECA154;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-beige-overlay-panel-content {
  padding: 15px;
}

.secondary-beige-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-beige-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-beige-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Crimson) ========== */
.secondary-crimson-overlay-panel-div {
  position: relative;
}

.secondary-crimson-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-crimson-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(171, 35, 40, 0.8) 35%, rgba(171, 35, 40, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(171, 35, 40, 0.8) 35%, rgba(171, 35, 40, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(171, 35, 40, 0.8) 35%, rgba(171, 35, 40, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#AB2328",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-crimson-overlay-panel-div:hover .secondary-crimson-overlay-panel {
  height: 100%;
}

.secondary-crimson-overlay-panel-div:hover .secondary-crimson-overlay-image {
  filter: grayscale(100%);
}

.secondary-crimson-overlay-panel-footer-title {
  background-color: #AB2328;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-crimson-overlay-panel-content {
  padding: 15px;
}

.secondary-crimson-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-crimson-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-crimson-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Burnt Umber) ========== */
.secondary-burnt-umber-overlay-panel-div {
  position: relative;
}

.secondary-burnt-umber-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-burnt-umber-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(138, 42, 43, 0.8) 35%, rgba(138, 42, 43, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(138, 42, 43, 0.8) 35%, rgba(138, 42, 43, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(138, 42, 43, 0.8) 35%, rgba(138, 42, 43, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#8A2A2B",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-burnt-umber-overlay-panel-div:hover .secondary-burnt-umber-overlay-panel {
  height: 100%;
}

.secondary-burnt-umber-overlay-panel-div:hover .secondary-burnt-umber-overlay-image {
  filter: grayscale(100%);
}

.secondary-burnt-umber-overlay-panel-footer-title {
  background-color: #8A2A2B;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-burnt-umber-overlay-panel-content {
  padding: 15px;
}

.secondary-burnt-umber-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-burnt-umber-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-burnt-umber-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Purple) ========== */
.secondary-purple-overlay-panel-div {
  position: relative;
}

.secondary-purple-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-purple-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(111, 80, 145, 0.8) 35%, rgba(111, 80, 145, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(111, 80, 145, 0.8) 35%, rgba(111, 80, 145, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(111, 80, 145, 0.8) 35%, rgba(111, 80, 145, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#6F5091",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-purple-overlay-panel-div:hover .secondary-purple-overlay-panel {
  height: 100%;
}

.secondary-purple-overlay-panel-div:hover .secondary-purple-overlay-image {
  filter: grayscale(100%);
}

.secondary-purple-overlay-panel-footer-title {
  background-color: #6F5091;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-purple-overlay-panel-content {
  padding: 15px;
}

.secondary-purple-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-purple-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-purple-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Dark Purple) ========== */
.secondary-dark-purple-overlay-panel-div {
  position: relative;
}

.secondary-dark-purple-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-dark-purple-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(86, 61, 130, 0.8) 35%, rgba(86, 61, 130, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(86, 61, 130, 0.8) 35%, rgba(86, 61, 130, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(86, 61, 130, 0.8) 35%, rgba(86, 61, 130, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#563D82",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-dark-purple-overlay-panel-div:hover .secondary-dark-purple-overlay-panel {
  height: 100%;
}

.secondary-dark-purple-overlay-panel-div:hover .secondary-dark-purple-overlay-image {
  filter: grayscale(100%);
}

.secondary-dark-purple-overlay-panel-footer-title {
  background-color: #563D82;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-dark-purple-overlay-panel-content {
  padding: 15px;
}

.secondary-dark-purple-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-dark-purple-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-dark-purple-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Light Purple) ========== */
.secondary-light-purple-overlay-panel-div {
  position: relative;
}

.secondary-light-purple-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-light-purple-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(117, 102, 160, 0.8) 35%, rgba(117, 102, 160, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(117, 102, 160, 0.8) 35%, rgba(117, 102, 160, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(117, 102, 160, 0.8) 35%, rgba(117, 102, 160, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#7566A0",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-light-purple-overlay-panel-div:hover .secondary-light-purple-overlay-panel {
  height: 100%;
}

.secondary-light-purple-overlay-panel-div:hover .secondary-light-purple-overlay-image {
  filter: grayscale(100%);
}

.secondary-light-purple-overlay-panel-footer-title {
  background-color: #7566A0;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-light-purple-overlay-panel-content {
  padding: 15px;
}

.secondary-light-purple-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-light-purple-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-light-purple-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Bahana Blue) ========== */
.secondary-bahana-blue-overlay-panel-div {
  position: relative;
}

.secondary-bahana-blue-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-bahana-blue-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 98, 152, 0.8) 35%, rgba(0, 98, 152, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 98, 152, 0.8) 35%, rgba(0, 98, 152, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 98, 152, 0.8) 35%, rgba(0, 98, 152, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#006298",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-bahana-blue-overlay-panel-div:hover .secondary-bahana-blue-overlay-panel {
  height: 100%;
}

.secondary-bahana-blue-overlay-panel-div:hover .secondary-bahana-blue-overlay-image {
  filter: grayscale(100%);
}

.secondary-bahana-blue-overlay-panel-footer-title {
  background-color: #006298;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-bahana-blue-overlay-panel-content {
  padding: 15px;
}

.secondary-bahana-blue-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-bahana-blue-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-bahana-blue-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Regal Blue) ========== */
.secondary-regal-blue-overlay-panel-div {
  position: relative;
}

.secondary-regal-blue-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-regal-blue-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 73, 118, 0.8) 35%, rgba(0, 73, 118, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 73, 118, 0.8) 35%, rgba(0, 73, 118, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 73, 118, 0.8) 35%, rgba(0, 73, 118, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#004976",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-regal-blue-overlay-panel-div:hover .secondary-regal-blue-overlay-panel {
  height: 100%;
}

.secondary-regal-blue-overlay-panel-div:hover .secondary-regal-blue-overlay-image {
  filter: grayscale(100%);
}

.secondary-regal-blue-overlay-panel-footer-title {
  background-color: #004976;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-regal-blue-overlay-panel-content {
  padding: 15px;
}

.secondary-regal-blue-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-regal-blue-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-regal-blue-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Deep Cerulean) ========== */
.secondary-deep-cerulean-overlay-panel-div {
  position: relative;
}

.secondary-deep-cerulean-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-deep-cerulean-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 73, 118, 0.8) 35%, rgba(0, 73, 118, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 73, 118, 0.8) 35%, rgba(0, 73, 118, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 73, 118, 0.8) 35%, rgba(0, 73, 118, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#0076A8",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-deep-cerulean-overlay-panel-div:hover .secondary-deep-cerulean-overlay-panel {
  height: 100%;
}

.secondary-deep-cerulean-overlay-panel-div:hover .secondary-deep-cerulean-overlay-image {
  filter: grayscale(100%);
}

.secondary-deep-cerulean-overlay-panel-footer-title {
  background-color: #0076A8;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-deep-cerulean-overlay-panel-content {
  padding: 15px;
}

.secondary-deep-cerulean-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-deep-cerulean-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-deep-cerulean-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Regal Blue Dull) ========== */
.secondary-regal-blue-dull-overlay-panel-div {
  position: relative;
}

.secondary-regal-blue-dull-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-regal-blue-dull-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 79, 113, 0.8) 35%, rgba(0, 79, 113, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 79, 113, 0.8) 35%, rgba(0, 79, 113, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 79, 113, 0.8) 35%, rgba(0, 79, 113, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#004F71",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-regal-blue-dull-overlay-panel-div:hover .secondary-regal-blue-dull-overlay-panel {
  height: 100%;
}

.secondary-regal-blue-dull-overlay-panel-div:hover .secondary-regal-blue-dull-overlay-image {
  filter: grayscale(100%);
}

.secondary-regal-blue-dull-overlay-panel-footer-title {
  background-color: #004F71;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-regal-blue-dull-overlay-panel-content {
  padding: 15px;
}

.secondary-regal-blue-dull-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-regal-blue-dull-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-regal-blue-dull-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Cerulean) ========== */
.secondary-cerulean-overlay-panel-div {
  position: relative;
}

.secondary-cerulean-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-cerulean-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 169, 224, 0.8) 35%, rgba(0, 169, 224, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 169, 224, 0.8) 35%, rgba(0, 169, 224, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 169, 224, 0.8) 35%, rgba(0, 169, 224, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#00A9E0",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-cerulean-overlay-panel-div:hover .secondary-cerulean-overlay-panel {
  height: 100%;
}

.secondary-cerulean-overlay-panel-div:hover .secondary-cerulean-overlay-image {
  filter: grayscale(100%);
}

.secondary-cerulean-overlay-panel-footer-title {
  background-color: #00A9E0;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-cerulean-overlay-panel-content {
  padding: 15px;
}

.secondary-cerulean-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-cerulean-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-cerulean-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* ========== Rollover Overlay Panels (Secondary Black) ========== */
.secondary-black-overlay-panel-div {
  position: relative;
}

.secondary-black-overlay-image {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.secondary-black-overlay-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0,0,0,0.80);*/
  /*background-color: rgba(42,110,120,0.90);*/
  /* https://cssgradient.io/ */
  background: rgb(0, 0, 0);
  background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.8) 35%, rgba(0, 0, 0, 0.8) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.8) 35%, rgba(0, 0, 0, 0.8) 100%);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.8) 35%, rgba(0, 0, 0, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.7s ease-in-out;
}

.secondary-black-overlay-panel-div:hover .secondary-black-overlay-panel {
  height: 100%;
}

.secondary-black-overlay-panel-div:hover .secondary-black-overlay-image {
  filter: grayscale(100%);
}

.secondary-black-overlay-panel-footer-title {
  background-color: #000000;
  color: #ffffff;
  font-size: 16px;
  text-transform: uppercase;
  padding: 10px;
}

.secondary-black-overlay-panel-content {
  padding: 15px;
}

.secondary-black-overlay-panel-title {
  color: #ffffff;
  font-size: 18px;
  text-transform: uppercase;
}

.secondary-black-overlay-panel-description {
  color: #ffffff;
  font-size: 9pt;
  padding-bottom: 5px;
}

.secondary-black-overlay-panel-readmore {
  padding-bottom: 20px;
}

/* ========== */
/* Light or Dark text in DocTypes */
.light {
  color: #ffffff !important;
}

a:link .light {
  color: #ffffff !important;
}

a:visited .light {
  color: #ffffff !important;
}

a:hover .light {
  color: #ffffff !important;
}

a:active .light {
  color: #ffffff !important;
}

.dark {
  color: #404040 !important;
}

a:link .dark {
  color: #404040 !important;
}

a:visited .dark {
  color: #404040 !important;
}

a:hover .dark {
  color: #404040 !important;
}

a:active .dark {
  color: #404040 !important;
}

/* Padding for coloured panels if required */
.padding-5 {
  padding: 5px;
}

.padding-10 {
  padding: 10px;
}

.padding-15 {
  padding: 15px;
}

.padding-20 {
  padding: 20px;
}

.padding-25 {
  padding: 25px;
}

.padding-30 {
  padding: 30px;
}

/* Members twitter feed */
.members-twitterfeed {
  margin-top: 30px;
}

.timeline-Tweet-Text {
  font-size: 20px !important;
  line-height: 1.35 !important;
}

/* Umbraco Forms */
.label {
  display: inline-block;
  padding-left: 0;
  padding-bottom: 10px;
}

.larger {
  font-size: larger;
}

.bolder {
  font-weight: bolder;
}

fieldset {
  margin-bottom: 30px !important;
}