:root {
  --allpine_lightGray: #918E91;
  --allpine_darkGray: #727172;
  --allpine_black: #272826;
  --allpine_darkGreen: #596854;
  --allpine_creme: #EEE7DE;
  --allpine_cremeAccent: #F7F0E8;
  --allpine_brown: #A48F75;
  --allpine_red: #931b1e;
}

/* Add a black background color to the top navigation */
.topnav {
  background-color: var(--allpine_darkGreen);
  overflow: hidden;
}

/* Style the links inside the navigation bar */
.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

/* Add an active class to highlight the current page */
.active {
  background-color: var(--allpine_darkGray);
  color: var(allpine_creme);
}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
  display: none;
}

/* Dropdown container - needed to position the dropdown content */
.dropdown {
  float: left;
  overflow: hidden;
}

/* Style the dropdown button to fit inside the topnav */
.dropdown .dropbtn {
  font-size: 17px;
  border: none;
  outline: none;
  color: var(allpine_creme);
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

/* Style the dropdown content (hidden by default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Style the links inside the dropdown */
.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

/* Add a dark background on topnav links and the dropdown button on hover */
.topnav a:hover, .dropdown:hover .dropbtn {
  background-color: #555;
  color: var(allpine_creme);
}

/* Add a grey background to dropdown links on hover */
.dropdown-content a:hover {
  background-color: #ddd;
  color: black;
}

/* Show the dropdown menu when the user moves the mouse over the dropdown button */
.dropdown:hover .dropdown-content {
  display: block;
}

/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 600px) {
  .topnav a:not(:first-child), .dropdown .dropbtn {
    display: none;
  }
  .topnav a.icon {
    float: right;
    display: block;
  }
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 600px) {
  .topnav.responsive {
    position: relative;
  }
  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .topnav.responsive .dropdown {
    float: none;
  }
  .topnav.responsive .dropdown-content {
    position: relative;
  }
  .topnav.responsive .dropdown .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }
}







@font-face {
  font-family: "Rockwell Condensed Bold";
  src: url("modules/fonts/rockwell_condensedBold/webFonts/c77f2225063fd0a5185855499a1ed67e.eot");
  src: url("modules/fonts/rockwell_condensedBold/webFonts/c77f2225063fd0a5185855499a1ed67e.eot?#iefix")format("embedded-opentype"),
  url("../fonts/rockwell_condensedBold/webFonts/c77f2225063fd0a5185855499a1ed67e.woff")format("woff"),
  url("../fonts/rockwell_condensedBold/webFonts/c77f2225063fd0a5185855499a1ed67e.woff2")format("woff2"),
  url("../fonts/rockwell_condensedBold/webFonts/c77f2225063fd0a5185855499a1ed67e.ttf")format("truetype"),
  url("../fonts/rockwell_condensedBold/webFonts/c77f2225063fd0a5185855499a1ed67e.svg#Rockwell Condensed Bold")format("svg");
  font-weight:normal;
  font-style:normal;
  font-display:swap;
}
/* Google Icons */
.material-icons {
  font-family: 'Material Icons';
  font-weight: lighter;
  font-style: normal;
  font-size: 15px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 {
  font-family: "Rockwell Condensed Bold";
  text-shadow: 5px 5px 10px var(--allpine_lightGray);
  color: var(--allpine_darkGreen);
}
h4 {
  font-family: "Rockwell Condensed Bold";
}
a {
  color: var(--allpine_creme);
}
/*
Generalized rules above this point - custom settings below
 */
.allpineFooter {
  margin-top: 100px;
  background-color: var(--allpine_darkGreen);
  /* box-shadow: 0 0 10px 10px var(--allpine_lightGray); */
  padding-top: 50px;
  padding-bottom: 30px;
  color: var(--allpine_creme);
}
.allpineFooter a {
  color: var(--allpine_creme);
}
.allpineFooter .row {
  margin-bottom: 10px;
}

.allpineHeader {
  padding-left: 0px;
  padding-right: 0px;
}
.allpineHeader img {
  max-height: 150px;
  margin-left: 15px;
}
#priceEstimator_error {
  color: red;
  text-align: center;
}
#beamEstimator_result .headers {
  text-align: right;
  font-family: "Rockwell Condensed Bold";
}
#beamEstimator_result .modal-header {
  background-color: var(--allpine_darkGreen);
  color: var(--allpine_creme);
}
#beamEstimator_result .modal-body {
  background-color: var(--allpine_creme);
  color: var(--allpine_darkGreen);
}
.hyperlink_color_override {
  color: #007bff;
  text-decoration: underline;
}
.blur-bottom {
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 10%);
  mask-image: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 10%);
}
body {
  background-color: var(--allpine_creme);
}

.bounce:hover {
  animation: bounce 1.5s infinite;
  //other browsers
  -webkit-animation: bounce 1.5s infinite;
  //webkit browsers
  -moz-animation: bounce 1.5s infinite;
  //firefox
  -o-animation: bounce 1.5s infinite;
  //opera
}
.btn_on_green .btn-outline-primary {
  color: var(--allpine_creme);
  border-color: var(--allpine_creme);
}
.btn_on_green .btn-outline-primary.focus, .btn-outline-primary:focus {
  box-shadow: 0 0 0 0.2rem var(--allpine_creme);
}
.btn_on_green .btn-outline-primary:hover {
  color: var(--allpine_darkGreen);
  background-color: var(--allpine_creme);
  border-color: var(--allpine_creme);
}

.btn-outline-primary {
  color: var(--allpine_darkGreen);
  border-color: var(--allpine_darkGreen);
}
.btn-outline-primary.focus, .btn-outline-primary:focus {
  box-shadow: 0 0 0 0.2rem var(--allpine_darkGreen);
}
.btn-outline-primary:hover {
  color: var(--allpine_creme);
  background-color: var(--allpine_darkGreen);
  border-color: var(--allpine_darkGreen);
}

.carousel-inner {
  position: relative;
  width: 100%;
  overflow: hidden;
  background-color: var(--allpine_darkGreen);
  border-radius: 1.25em;
  box-shadow: 5px 5px 10px var(--allpine_lightGray);
}
.center {
  margin-left: auto;
  margin-right: auto;
}
#copyrightTag {
  color: var(--allpine_lightGray);
  text-align: center;
  position: relative;
  bottom: -35px;
}
#DYI_guide {
  margin-left: -40px;
  margin-top: 20px;
}
#DYI_guide li {
  margin-bottom: 15px;
}
.firewoodPrices td {
  vertical-align: middle;
}
.firewoodPrices th {
  vertical-align: middle;
}
.firewoodPrices thead th {
  vertical-align: middle;
  border-bottom: 2px solid #dee2e6;
}
.form-control {
  display: block;
  width: 100%;
  height: calc(1.5em + 0.75rem + 2px);
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #495057;
  background-color: var(--allpine_creme);
  background-clip: padding-box;
  border: 1px solid var(--allpine_lightGray);
  border-radius: 0.25rem;
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
#footerIMG {
  position: relative;
  top: 7px;
  float: right;
  width: 30%;
  margin-right: 15px;
  /* box-shadow: 2px 2px 16px var(--allpine_lightGray); */
  border-radius: 1.25em;
}
.footer-names {
  text-align: right;
  font-family: "Rockwell Condensed Bold";
}
.footer-headlines {
  text-align: left;
  font-family: "Rockwell Condensed Bold";
  font-size: 26px;
}
.form-control:focus {
  color: var(--allpine_lightGray);
  background-color: #fff;
  border-color: var(--allpine_darkGreen);
  outline: 0;
  box-shadow: 0 0 0 0.2rem var(--allpine_darkGreen);
}

.greenLine {
  backgroud-color: var(--allpine_darkGreen);
  max-height: 15px;
}

#headerIMG {
  -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0));
}
#headerLOGO {
  position: absolute;
  margin: auto;
  left: 0;
  right: 0;
  text-align: center;
  z-index: 1;
  filter: drop-shadow(15px 20px 10px var(--allpine_darkGray));
}

#header_info {
  text-align: right;
  margin-top: -139px;
  margin-right: 22px;
}

#header_info a {
  color: var(--allpine_darkGreen);
}
#header_info2 a {
  color: var(--allpine_darkGreen);
}
#header_info2 {
  text-align: right;
  margin-top: -25px;
  margin-right: 22px;
}

.home_cards a {
  color: var(--allpine_darkGreen);
}
.home_cards .card {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid rgba(0,0,0,.125);
  /* border-radius: 1.25rem; */
  border-radius: .25em;
  margin-bottom: 12px;
  margin-top: 12px;
  box-shadow: 5px 5px 10px var(--allpine_lightGray);
  border-style: solid;
  border-color: var(--allpine_darkGreen);
}
.home_cards .card-img-top {
  /* border-top-left-radius: calc(1.25rem - 1px); */
  /* border-top-right-radius: calc(1.25rem - 1px); */
}

.home_cards .card-title {
  text-align: center;
}
.home_cards img {
  min-width: 100%;
  min-height: 140px;
  max-height: 140px;
}

.home_jumbotron {
  background-color: var(--allpine_darkGreen);
  /* border-radius: 1.25em; */
  border-radius: .25em;
  margin-bottom: 12px;
  margin-top: 12px;
  color: var(--allpine_creme);
  box-shadow: 5px 5px 10px var(--allpine_lightGray);
  padding-top: 40px;
  padding-bottom: 40px;
}
.home_jumbotron a {
  color: var(--allpine_creme);
}
.home_jumbotron h1 {
  color: var(--allpine_creme);
}
.home_jumbotron h3 {
  color: var(--allpine_creme);
}
.home_jumbotron img {
  box-shadow: 5px 5px 20px black;
  border-style: solid;
  border-color: var(--allpine_creme);
}
#home_moreInfo a {
  text-decoration: underline;
}
hr {
  margin-top: 1rem;
  margin-bottom: 1rem;
  border: 0;
  border-top: 1px solid var(--allpine_creme);
}
.jumbotron_creme {
  background-color: var(--allpine_creme);
  /* border-radius: 1.25em; */
  border-radius: .25em;
  margin-bottom: 12px;
  margin-top: 12px;
  color: black;
  box-shadow: 5px 5px 10px var(--allpine_lightGray);
  padding: 15px;
  padding-top: 20px;
  padding-bottom: 20px;
}
.jumbotron_creme a {
  color: var(--allpine_darkGreen);
}
.jumbotron_creme h1 {
  color: var(--allpine_darkGreen);

}
.jumbotron_creme h3 {
  color: var(--allpine_darkGreen);
}
.jumbotron_creme img {
  box-shadow: 5px 5px 20px black;
  border-style: solid;
  border-color: var(--allpine_lightGray);
}
.jumbotron_creme p {}
#LandingPage_home_info li h4 {
  margin-top: 12px;
}
.image_whiteBorder {
  box-shadow: 5px 5px 20px black;
  border-style: solid;
  border-color: var(--allpine_creme);
}
#loadOverlay {
  display: none;
  position: fixed;
  z-index: 1100;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba( 255, 255, 255, .8 )
  50% 50%
  no-repeat;
}
#loadOverlay div {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -50px;
  margin-left: -50px;
  width: 100px;
  height: 100px;
}

.logSize {
  font-style: italic;
}
.menu {
  top: 13px;
  width: 300px;
  min-height: 600px;
  position: fixed;
  /* background-color: var(--allpine_creme); */
  background-color: white;
  z-index: 99;
  right: 0px;
  border-style: solid;
  border-color: var(--allpine_darkGreen);
  border-top-left-radius: 1.25em;
  border-bottom-left-radius: 1.25em;
  box-shadow: -3px 6px 14px var(--allpine_darkGray);
  /* display: none; */
  padding: 30px;
  color: var(--allpine_black);
  background-image: url(../img/woodBackground-menu.png);

  /* filter: grayscale(100%); */
  /* opacity: 90%; */
  /* transform: rotate(30deg); */
  /* background-size: 150px; */

}
.menu_AllpineMenu {
  display: none;
}
.menu #bkg-img {
  width: 100%;
  height: 100%;
  /*  background-image: url(../img/woodBackground-menu@15%.png); */
}
.menu a {
  color: var(--allpine_black);
  font-family: 'Rockwell Condensed Bold';
  font-size: larger;
}
.menu a:hover {
  color: var(--allpine_creme);
}
.menu_button img {
  position: fixed;
  right: 0px;
  z-index: 100;
  max-height: 75px;
  top: 144px;
  box-shadow: 0px 4px 13px var(--allpine_lightGray);
  border-bottom-left-radius: 3em;
  border-top-left-radius: 3em;
}
.menu_list {
  position: relative;
}
.menu_list ul {
  position: relative;
}
.menu_list ul li {
  position: relative;
  left: 0;
  color: var(--allpine_black);
  list-style: none;
  margin: 4px 0;
  border-left: 2px solid var(--allpine_darkGreen);
  transition: 0.5s;
  cursor: pointer;
}
.menu_list ul li:hover {
  left: 10px;
}
.menu_list ul li span {
  position: relative;
  padding: 8px;
  padding-left: 12px;
  display: inline-block;
  z-index: 1;
  transition: 0.5s;
}
.menu_list ul li:hover span {
  color: var(--allpine_creme);
}
.menu_list ul li:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: var(--allpine_darkGreen);
  transform: scaleX(0);
  transform-origin: left;
  transition: 0.5s;
}
.menu_list ul li:hover:before {
  transform: scaleX(1);
}
.menu_overlay {
  min-width: 100%;
  height: 100%;
  position: fixed;
  background-color: var(--allpine_lightGray);
  z-index: 80;
  opacity: 90%;
  /* display: none; */
}
.myCollapse {
  display: none;
  margin: -34px 25px 0px;
  background-color: #fff;
  border-bottom-left-radius: 25px;
  border-bottom-right-radius: 25px;
  padding: 34px 15px 10px;


}
.myCollapse_toggle {}

.newpaperColumns {
  column-count: 2;
  column-gap: 40px;
}
@media (max-width: 768px) {
  /*CSS that should be displayed if width is equal to or less than X px goes here*/
  /* NOTES:
  Small (sm) 576px and greater screen sizes use small breakpoints. ...
  Medium (md) 768px and greater screen sizes use the medium breakpoints. ...
  Large (lg) 992px and greater screen sizes use the large breakpoints. ...
  Extra-large (xl) 1200px and greater screen sizes use the extra-large breakpoints.
  */
  .newpaperColumns {
    column-count: 1;
    column-gap: 40px;
  }
}
.notificationSystem {
  box-shadow: 5px 5px 10px;
  display: none;
}
#notificationSystem_container {
  position: fixed;
  width: 100%;
  height: auto;
  top: 35px;
  z-index: 1060;
}
#priceEstimator .input-group-text {
  background-color: var(--allpine_darkGreen);
  color: var(--allpine_creme);
  border: 1px solid var(--allpine_brown);
}
#product_container {
  /* background-color: var(--allpine_creme); */
}
#quoteTable {
  color: var(--allpine_creme);
}
#quoteTable thead {
  color: var(--allpine_creme);
  font-family: 'Rockwell Condensed Bold';
}
#sawTexture {
  margin-bottom: 15px;
}
.Store_maxHeight {
  max-height: 500px;
  overflow-y: auto;
}
/* #searchForm {
  position: absolute;
  right: 8vw;
  top: 3vw;
  font-family: 'Rockwell Condensed Bold';
  color: var(--allpine_darkGreen);
  font-size: 3vw;
}

#searchForm a {
  color: var(--allpine_darkGreen);
}
 */



//CSS3 Bounce Animation
@-webkit-keyframes bounce {
  0%,
  100% {
    -webkit-transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-10px);
  }
}
@-moz-keyframes bounce {
  0%,
  100% {
    -moz-transform: translateY(0);
  }
  50% {
    -moz-transform: translateY(-10px);
  }
}
@-o-keyframes bounce {
  0%,
  100% {
    -o-transform: translateY(0);
  }
  50% {
    -o-transform: translateY(-10px);
  }
}
@keyframes bounce {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}




.DIY_guide_list {
  position: relative;
}
.DIY_guide_list img {
  position: relative;
  left: 10px;
  top: -5px;
}
.DIY_guide_list ul {
  position: relative;
  margin-left: -40px;
}
.DIY_guide_list strong {
  font-size: larger;
  /* font-family: 'Rockwell Condensed Bold'; */
}
.DIY_guide_list ul li {
  position: relative;
  left: 0;
  color: var(--allpine_creme);
  list-style: none;
  margin: 4px 0;
  border-left: 2px solid var(--allpine_creme);
  transition: 0.5s;
  cursor: pointer;
  margin-bottom: 20px;;
}
.DIY_guide_list ul li:hover {
  left: 10px;
}
.DIY_guide_list ul li span {
  position: relative;
  padding: 8px;
  padding-left: 12px;
  display: inline-block;
  z-index: 1;
  transition: 0.5s;
}
.DIY_guide_list ul li:hover span {
  color: var(--allpine_darkGreen);
}
.DIY_guide_list ul li:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: var(--allpine_creme);
  transform: scaleX(0);
  transform-origin: left;
  transition: 0.5s;
}
.DIY_guide_list ul li:hover:before {
  transform: scaleX(1);
}