/*
Theme Name: mtlacrosse
Theme URI: <THEME_URI>
Description: A Theme for WordPress with Bootstrap for styling.
Author: Metre, LLC
Author URI: https://metreagency.com/
Version: 1.0
*/
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css");

/*

Dark Navy #1B2D44
Navy #294161
Light Blue #b5daee
Off White #ECF3F3
Wine Red #722F37

*/

html {
  scroll-behavior: smooth;
}


body {
font-family: montserrat, sans-serif;
font-weight: 400;
font-style: normal;
}

/*
    TYPE STYLES
*/
h1, h2, h3, p {
  color: #1B2D44;
}
h1 {
  font-family: "bebas-neue", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 70px;
}
.wp-block-cover__background > h1 {
	color: #fff!important;
}
h2 {
  font-size: 37px;
  font-weight: 700;
  font-style: normal;
  margin-bottom: 32px;
}
h2.margin-bottom-fix {
	margin-bottom: 8px;
}
h3 {
  font-size: 22px;
  font-weight: 700;
  font-style: normal;
  color: #294161;
  margin-top: 12px;

}
p {
  font-size: 16px;
  font-weight: 400;
  font-style: normal;
  margin-bottom: 18px;
}
a {
  cursor: pointer;
  -webkit-transition-duration: 0.4s;
  -moz-transition-duration: 0.4s;
  -o-transition-duration: 0.4s;
  transition-duration: 0.4s;
  color: #337CA3;
  font-weight: 500;
  text-decoration: none;
}
a:hover {
  color: #337193;
}

hr:not([size]) {
    height: 0.5px;
}

.wp-block-separator {
    border: 0.5px solid black;
    border-right: none;
    border-left: none;
}
hr {
    margin: 1rem 0;
    color: inherit;
    background-color: currentColor;
    border: 0;
    opacity: 1;
}


/* CSS for h2 accent */
h2.accent-line {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
}
h2.accent-line:before,
h2.accent-line:after {
    content: '';
    border-top: 1px solid #4a5957;
    margin: 0 10px 0 0;
    flex: 1 0 20px;
}
h2.accent-line:after {
    margin: 0 0 0 10px;
}

blockquote{
  font-size: 1.4em;
  margin: 50px auto;
  font-style:italic;
  color: #555555;
  padding:1.2em 30px 1.2em 75px;
  border-left:8px solid #b5daee ;
  line-height:1.6;
  position: relative;
  background:#f5f5f5;
}

blockquote::before{
  content: "\201C";
  color:#b5daee;
  font-size:4em;
  position: absolute;
  left: 10px;
  top:-10px;
}

blockquote::after{
  content: '';
}

blockquote span{
  display:block;
  color: #333333;
  font-style: normal;
  font-weight: bold;
  margin-top:1em;
}

li {
  display: list-item;
  list-style-type: "◆";
  padding-inline: 1ch;
  margin-inline-end: 1ch;
  line-height: 1.6em;
}
li::marker {
  color: #b5daee;
}

div.wp-block-cover {
  margin-bottom: 32px;
}


div.wp-block-cover.alert-bar p {
  font-weight: 500;
  margin-bottom: 0;
  color: #fff!important;
}
div.wp-block-cover.announcement-bar p {
  font-weight: 500;
  margin-bottom: 0;
  color: #1B2D44!important;
}

div.wp-block-cover.alert-bar {
  margin-bottom: 52px;
}
div.wp-block-cover.alert-bar span {
  background-color: #d0342c!important;
}

div.wp-block-cover.announcement-bar {
  margin-bottom: 52px;
}
div.wp-block-cover.announcement-bar span {
  background-color: #b5daee!important;
}


.announcement-bar div div.mb-2 {
  margin: 0 auto!important;
}

/*
    HEADER
*/
.header-logo {
  width: 200px;
  height: auto;
}
ul.headerTop {
  list-style: none;
}
.wp-block-cover {
  margin-bottom: 18px;
}
/* Weather */
.owmw-now {
    float: right;
    position: relative;
    bottom: 36px;
}
.owmw-main-symbol.owmw-symbol-svg.climacon {

}
.owmw-now .owmw-main-symbol {
    width: 40px;
    height: 40px;
}
.owmw-now .owmw-main-temperature {

}
.climacon:before {
  font-size: 34px;
  position: relative;
  right: 40px;

}
div[id^='owm-weather-id'] {
  float: right;
  width: 40px;
  height: 0;
}
ul.utility-menu li {
  float: right;
}
a.trail-conditions {
  text-decoration: none;
  color: #fff;
}
.trail-conditions {
  float: right;
}
.trail-conditions::before {
  content: url(/wp-content/themes/mtlacrosse/svg/icon_trail-conditions.svg);
  display: block;
  width: 26px;
  height: 26px;
  float: left;
  clear: both;
}

/*
    NAV
*/
#utility-nav {
  width: 100%;
  background-color: #1B2D44;
  padding: 8px;
}
#utility-nav li {
  list-style: none;
  padding-inline: 0;
  margin-inline-end: 0;
  line-height: normal;
}
#primary-nav {
  position: absolute;
  width: 100%;
  z-index: 1000;
  background-color: rgba(255, 255, 255, 0.1);
  /*
  border-style: solid;
  border-width: 0px 0px 1px 0px;
  border-color: #D6E8F04D;
  */
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  padding: 0px 0px 0px 0px;
}

ul.mega-sub-menu li > a.mega-menu-link {
  border-bottom: 1px solid transparent!important;
}
ul.mega-sub-menu li > a.mega-menu-link:hover {
  border-bottom: 1px solid rgba(102, 102, 102, 0.267)!important;
}
ul.mega-sub-menu {
  border-left: 3px solid #b5daee!important;
}

/*
    TRAIL STATUS
*/
.map-key {
  text-align: center;
  margin: 0 auto;
}
td.trail-open {
  color: #fff;
  font-weight: 700;
  padding: 6px;
  background-color: green!important;
  text-align: center!important;
  text-transform: uppercase!important;
}
td.trail-closed {
  color: #000;
  font-weight: 700;
  padding: 6px;
  background-color: red!important;
  text-align: center!important;
  text-transform: uppercase!important;
}
figure.wp-block-flexible-table-block-table table tr td {
  text-align: center!important;
}
figure.wp-block-flexible-table-block-table table tbody tr {
  border-style : hidden!important;
}

/*
    FORMS
*/


/*
    BUTTONS
*/
.btn-secondary, .btn-primary {
  background-color: transparent!important;
  margin-bottom: 12px;
}
.btn-secondary a {
  background-color: #fff!important;
  border: 3px solid #722F37!important;
  color: #1B2D44!important;
  font-weight: 500;
}
.btn-secondary a:hover {
  background-color: #fff!important;
  border: 3px solid #1B2D44!important;
  color: #1B2D44!important;
}

a.btn.home-image-buttons.btn-secondary {
  padding: 0.667em 1.333em!important;
  border-radius: 28px!important;
  background-color: #fff!important;
  border: 3px solid #fff!important;
  color: #1B2D44!important;
  font-weight: 500!important;
}

a.btn.home-image-buttons.btn-secondary:hover {
  background-color: #cde3ee!important;
  border: 3px solid #cde3ee!important;
  color: #294161!important;
}



a.btn.btn-primary, body .gform_wrapper .gform_footer input[type=submit], .woocommerce ul.products li.product .button, .btn-primary a {
  padding: 0.667em 1.333em;
  background-color: #b5daee!important;
  border: 3px solid #b5daee!important;
  border-radius: 28px;
  color: #1B2D44!important;
  font-weight: 500;
  -webkit-transition-duration: 0.4s;
  -moz-transition-duration: 0.4s;
  -o-transition-duration: 0.4s;
  transition-duration: 0.4s;
}
a.btn.btn-primary:hover, body .gform_wrapper .gform_footer input[type=submit]:hover, .woocommerce ul.products li.product .button:hover, .btn-primary a:hover {
  background-color: #1B2D44!important;
  border: 3px solid #1B2D44!important;
  color: #fff!important;
}

/*
    WORDPRESS / BOOTSTRAP
*/
.wp-bootstrap-blocks-row {
  margin-bottom: 32px;
}
.wp-block-table {
  margin-bottom: 22px;
}
.l2-banner .wp-block-cover__inner-container {
  margin-top: 148px;
}

figure.wp-block-gallery.has-nested-images {
  margin-top: 28px;
  margin-bottom: 28px;
}

/*
  TABLES
*/
figure.wp-block-table {
  /*margin-bottom: 38px;*/
}
figcaption.wp-element-caption, figcaption.wp-element-caption strong {
  text-align: center;
  font-weight: 400;
}

/*
  DROPDOWN/ACCORDIONS
*/
p.wp-block-ub-content-toggle-accordion-title {
  font-size: 20px;
  font-weight: bold;
  padding-left: 8px!important;
}
.wp-block-ub-content-toggle-accordion-title-wrap .wp-block-ub-content-toggle-accordion-state-indicator {
  color: #b5daee!important;
}



/*
    FOOTER
*/
footer {
  width: 100%;
  background-color: #1B2D44;
  padding-top: 44px;
  margin-top: 48px;
}
.page-id-15 footer {
  margin-top: 0;
}
footer h1, footer h2, footer h3, footer p, footer a {
    color: #fff;
}
footer a {
  color: #b5daee;
}
footer a:hover {
  color: #fff;
}
.social-icons {
  filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(56deg) brightness(105%) contrast(102%);
  scale: 150%;
  margin-right: 10px;
}
a.footer-social-links {
  text-decoration: none;
}
div.social-col {
  text-align: left;
}


/*
    MEDIA QUERIES
*/
@media (max-width: 1400px) {

}
@media (max-width: 1200px) {

}

@media (max-width: 992px) {
  img.header-logo {
    width: 140px;
  }
  .footer-col {
    margin-top: 32px!important;
  }
}

@media (max-width: 768px) {
  .map-key {
  max-width: 200px;
  margin-top: 22px;
  }
  figure.mobile-image-width img {
    width: 100%!important;
  }
  div.social-col {
    margin-top: 32px;
  }
}

@media (max-width: 576px) {
  .n2-ss-layers-container {
    position: relative;
    top: 12px;
  }
  h2 {
    font-size: 30px;
  }

}