/*
 Theme Name:   Littleton, Colorado
 Description:  Theme for Littleton, Colorado
 Author:       The Zimmerman Agency
 Author URI:   https://zimmerman.com
 Template:     bootscore-main
 Version:      5.2.0.0
 Text Domain:  bootscore
*/

/* 
All style editing is done via scss/_bscore_custom.scss
*/

p {
  font-family: Barlow;
  font-size: 17px;
  font-weight: 300;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.41;
  letter-spacing: normal;
  text-align: left;
  color: #002855;
}

.white-f {
  color: white !important;
}

.padding-d {
  padding: 4rem 0rem;
}

.hero-title {
  font-family: Montserrat;
  font-size: 68px;
  font-weight: 300;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.09;
  letter-spacing: normal;
  text-align: left;
}

.hero-info {
  display: flex;
  align-items: center;
  padding-left: 5rem;
}

.hero-border {
  border-top: 2px dotted white;
}

p.hero-copy {
  font-family: Barlow;
  font-size: 20px;
  font-weight: 300;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.41;
  letter-spacing: normal;
  text-align: left;
  color: #fff;
}
div.carousel-img > p {
  color: white !important;
}

div.carousel-img > p,
div.carousel-img > h2,
div.carousel-img > hr,
div.carousel-img > button {
  margin-left: 30rem;
}

.indicator-carousel {
  margin-left: 0.25rem !important;
  border: 1px solid #36a38a !important;
}
.slider-indicators > * {
  background-color: #36a38a !important;
}
.carousel-title {
  font-family: Montserrat;
  font-size: 50px;
  font-weight: 300;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.09;
  letter-spacing: normal;
}
.nf-form-content input:not([type="button"]),
#nf-field-3 {
  border: none !important;
  border-radius: 8px !important;
}

#nf-field-4 {
  border-radius: 25px !important;
  background-color: transparent;
  color: #002855;
  border-color: #002855 !important;
  border-style: solid !important;
  text-transform: uppercase;
  font-family: Barlow;
  font-size: 17px;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.41;
  letter-spacing: 0.85px;
  text-align: left;
}
#nf-form-title-1,
.nf-form-fields-required {
  display: none;
}
.nf-form-content label {
  font-family: Barlow;
  font-weight: 500 !important;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.41 !important;
  letter-spacing: normal;
  text-align: left;
  color: #002855;
}

#footer-menu li a {
  padding: 1.5px;
}

.rotate-270 {
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
}

.masonry-row {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  grid-template-rows: repeat(4, 1fr);
  grid-column-gap: 10px;
  grid-row-gap: 10px;
}

.div1 {
  grid-area: 1 / 1 / 5 / 5;
}
.div2 {
  grid-area: 1 / 5 / 3 / 7;
}
.div3 {
  grid-area: 1 / 7 / 3 / 9;
}
.div4 {
  grid-area: 3 / 5 / 5 / 7;
}
.div5 {
  grid-area: 3 / 7 / 5 / 9;
}

.ttd-title {
  font-family: Montserrat;
  font-size: 38px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.08;
  letter-spacing: normal;
  text-align: left;
  color: #002855;
}

.event-title-home {
  font-family: Montserrat;
  font-size: 48px;
  font-weight: 300;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.08;
  letter-spacing: normal;
  text-align: left;
  color: #002855;
}

.facetwp-facet-accommodation_search {
  margin: 0px !important;
}

.accommodation-facet-search {
  margin: auto;
  display: flex;
  align-items: flex-end;
  margin-left: 3rem;
}

.facetwp-facet-accommodation {
  margin: auto !important;
}

.facetwp-facet {
  margin: auto !important;
}

.accommodation-facet {
  display: inline-flex;
}

.accommodation-facet div {
  width: -webkit-fill-available;
  margin: auto;
}

.facetwp-facet input,
.facetwp-dropdown,
.accommodation-price {
  border: 1px solid #002855;
  border-radius: 25px;
  padding: 0.5rem;
  color: #002855;
  background-color: transparent;
  font-weight: 300;
}

.facetwp-dropdown {
  border-width: 1px 1px 1px 1px;
  border-color: #002855 !important;
  border-radius: 0px;
}
.bg-light {
  --bs-bg-opacity: 0.9 !important;
}
.page-id-2 .bg-light {
  opacity: 0.85 !important;
}
.facetwp-pager {
  text-align: center;
  font-size: larger;
}

.facetwp-pager a {
  color: #002855 !important;
}

.btn {
  border-style: none;
}

.map-container {
  text-align: center;
}

span.simple-weather__day {
  font-size: 16px;
  color: #36a38a;
  color: #002855;
}

#bootscore-navbar {
  font-size: medium;
  margin: auto;
}

.navbar-nav li {
  cursor: pointer;
}

.nav-link {
  /*
	padding-left:.25rem !important;
	padding-right:.25rem !important;
*/
}

.carousel-button-container {
  display: flex;
  justify-content: space-evenly;
  width: 100px !important;
  height: 28px;
}

.hero-cta {
  background-color: transparent;
  border-radius: 25px;
  padding: 0.5rem 1rem;
  font-family: Barlow;
  font-size: 20px;
  font-weight: 300;
  font-stretch: normal;
  line-height: 1.41;
  letter-spacing: 0.85px;
  color: #fff;
  border: solid 1px #fff;
}

.hero-cta a {
  color: #fff !important;
  text-decoration: none;
}

.hero-cta:hover {
  background-color: #fff !important;
  border-color: #002855 !important;
}

.hero-cta:hover a {
  color: #002855 !important;
  text-shadow: none !important;
}

.body-cta {
  background-color: transparent;
  border-radius: 25px;
  padding: 0.5rem 1rem;
  font-family: Barlow;
  font-size: 20px;
  font-weight: 300;
  font-stretch: normal;
  line-height: 1.41;
  letter-spacing: 0.85px;
  width: auto;
  border: solid 1px #002855;
}

.body-cta a {
  color: #002855 !important;
}

.body-cta:hover {
  background-color: #002855 !important;
  border-color: #fff !important;
}

.body-cta:hover a {
  color: #fff !important;
}

.hero-cta a:hover,
.body-cta a:hover {
  text-decoration: none !important;
}

a:hover {
  text-decoration: underline !important;
}

.social-body-icon {
  --initial-color: #36a38a;
}

:root {
  --initial-hue: 157; /* Initial color's hue (in degrees) */
  --target-hue: 199; /* Target color's hue (in degrees) */
}

img.social-body-icon:hover {
  filter: hue-rotate(calc(var(--target-hue) - var(--initial-hue))) !important;
}

.facetwp-icon:before {
  background-position: 0px 75% !important;
}

.label-padding {
  padding-right: 1rem;
}

.weather-container div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.page-id-2 .home-style-events {
  background-image: linear-gradient(
    to bottom,
    rgba(239, 244, 245, 1) 5.5rem,
    white 5.5rem
  ) !important;
}

.page-id-2 .home-style-fad,
.page-id-2 .home-style-ttd {
  background-image: linear-gradient(
    to bottom,
    white 7.3rem,
    rgba(239, 244, 245, 1) 7.3rem
  ) !important;
}
body.page-id-95 .event-facet .gradient-text > p {
  font-size: 2rem !important;
}
@media only screen and (max-width: 1100px) {
  div.carousel-img > p,
  div.carousel-img > h2,
  div.carousel-img > hr,
  div.carousel-img > button {
    margin-left: 15rem;
  }
}
@media (min-width:992px) and (max-width:1199px){
	header.site-header .bg-light{
		max-width: 94%;
	}
	header.site-header nav.navbar > .container{
		max-width:100%;
	}
	header.site-header .navbar a.navbar-brand{
		margin-right:.5rem;
		max-width:80px;
	}
	header.site-header #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link{
		padding:0 5px;
	}
}
@media only screen and (max-width: 991px) {
  div.carousel-img > p,
  div.carousel-img > h2,
  div.carousel-img > hr,
  div.carousel-img > button {
    margin-left: 0rem;
  }
}
.mega-menu-link {
  font-size: medium !important;
}

@media only screen and (min-width: 767px) {
  .v-guide {
    padding-top: 10rem;
  }
  .content-header {
    white-space: nowrap;
    font-size: 80px;
    text-align: center;
  }
  .visitor-img {
    top: -5rem;
    position: relative;
    width: 95% !important;
  }
  .mobile {
    display: none;
  }

  #weather_status .box-content {
    display: flex;
    justify-content: space-around;
  }

  .status-container div span {
    color: white !important;
    font-size: xx-large;
  }

  .See-full-forecast {
    font-family: Barlow;
    font-size: xx-large;
    /*		font-weight: 600;*/
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.8px;
    text-align: left;
    color: #c5faee;
  }
  .img-text img {
    width: 65%;
  }

  .content-copy-container {
    font-family: Montserrat;
    font-size: 68px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.09;
    letter-spacing: normal;
    text-align: left;
    color: #36a38a;
  }
}

@media only screen and (max-width: 767px) {
  .carousel-title {
    font-size: xxx-large;
  }

  .slider-indicators {
    display: flex !important;
  }
  .img-text img {
    width: 85%;
  }
  .content-header {
    font-size: 7vw !important;
    text-align: center !important;
    padding-bottom: 1rem !important;
  }
  .content-copy-container {
    font-family: Montserrat;
    padding: 0rem 1rem;
    font-size: 45px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.09;
    letter-spacing: normal;
    text-align: left;
    color: #36a38a;
  }
  .padding-m {
    padding: 4rem 1rem;
  }
  .contact-header {
    text-align: center;
    font-size: 70px;
  }
  .gradient-text {
    font-size: 45px !important;
  }
  .mobile {
    display: block !important;
  }
  .desktop {
    display: none !important;
  }
  .hero-image {
    padding: 0rem 1rem !important;
  }
  .hero-title {
    font-size: 40px;
  }
  .status-container div span {
    color: white !important;
    font-size: x-large;
  }
  .See-full-forecast {
    font-family: Barlow;
    font-size: x-large;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.8px;
    text-align: left;
    color: #c5faee;
  }
  #weather_status .box-content {
    padding-left: 1rem;
  }
  .weather-container {
    padding-left: 2rem;
  }
  .img-text {
    text-align-last: left;
  }
  #simple-weather--18eaa470bc714ed802384d2804b3ab2d span.simple-weather__day {
    font-size: 12pt;
    color: #36a38a;
  }

  .navbar-brand {
    max-width: 27%;
  }
  #footer-menu {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 10px;
    padding: 1rem;
  }
  .footer-contact,
  .bootscore-info {
    padding: 0rem 1.6rem !important;
  }
  .bootscore-info div.container {
    text-align: left;
    padding: 0px;
  }
}