<style>
* {
    box-sizing: border-box;
}

.row::after {
    content:"";
    clear: both;
    display: table;
}

[class*="col-"] {
    float: left;
    padding: 15px;
}

html {
    margin: 0;
    font-family: 'Hind', sans-serif;
}

[class*="col-"] {
    float: left;
    padding: 15px;
}

.container {
    float: center;
    padding-top: 20px;
    padding-left: 50px;
    padding-right: 50px;
    text-align: center;
}

article {
    float: left;
    padding: 10px;
    width: 100%;
    background-color: #491000;
    color: white;
}

section:after {
    content: "";
    display: table;
    clear: both;
}

footer {
    background-color: #dfd9ab;
    padding: 10px;
    text-align: center;
    color: #191312;
}

/* Multiplatform Functions */
    /* Mobile version: */
    [class*="col-"] {
        width: 100%;
    }
    
        /* Mobile Navagation Hamburger Menu */
        .navbar #myLinks {
          display: none;
        }

    /* Tablet version: */
    @media only screen and (min-width: 600 px) {
        .col-s-1 {width 8.33%;}
        .col-s-2 {width: 16.66%;}
        .col-s-3 {width: 25%;}
        .col-s-4 {width: 33.33%;}
        .col-s-5 {width: 41.66%;}
        .col-s-6 {width: 50%;}
        .col-s-7 {width: 58.33%;}
        .col-s-8 {width: 66.66%;}
        .col-s-9 {width: 75%;}
        .col-s-10 {width: 83.33%;}
        .col-s-11 {width: 91.66%;}
        .col-s-12 {width: 100%;}
    }

    /* Desktop version: */
    @media only screen and (min-width: 768px) {
        .col-1 {width: 8.33%;}
        .col-2 {width: 16.66%;}
        .col-3 {width: 25%;}
        .col-4 {width: 33.33%;}
        .col-5 {width: 41.66%;}
        .col-6 {width: 50%;}
        .col-7 {width: 58.33%;}
        .col-8 {width: 66.66%;}
        .col-9 {width: 75%;}
        .col-10 {width: 83.33%;}
        .col-11 {width: 91.66%;}
        .col-12 {width:100%;}
    }

/* Header Layout */
    .header {
        height: 250px;
        background-color: #dfd9ab;
        box-shadow: 1px 1px 4px 0 rgba(0,0,0,.1);
    }

    .header img {
        float: left;
        width: 250px;
        height: 250px;
        background: #555;
        display: inline-block;
    }

    .header h1 {
        position: relative;
        text-align: center;
        top: 35px;
        height: auto;
        margin-bottom: 20px;
        font-family: 'Bitter', sans-serif;
        color: #491000;
        font-weight: 700;
        font-style: normal;
    } 

/* Navigation Bar Colors/Settings */
    /* Background Colors and Settings */
    .bg-custom{
        background-color: #7e0000;
        float: left;
        width: 100%;
    }
    
    /* Text Color (Sitemap button) */
    a.navbar-brand {
        color: white;
        padding: 8px 8px;
        font-family: 'Hind', sans-serif;
    }

    .navbar-brand:hover{
        background-color: #dfd9ab;
        color: #191312;
        float: center;
    }

    /* Nav Bar Buttons Text */
    a.nav-link {
        color: white;
        padding: 6px 6px;
        text-align: center;
        display: block;
    }

    /* Nav Bar Buttons Hover Color */
    .nav-link:hover, .nav .menu-btn:hover {
        background-color: #dfd9ab;
        color: #191312;
        padding: 6px 8px;
    }

    .nav ul {
        list-style-type: none;
        padding: 0;
        float: center;
        overflow: hidden;
    }

    .nav .navbar {
        clear: both;
        max-height: 0;
        transition: max-height .2s ease-out;
    }

    .nav .navbar-icon {
        cursor: pointer;
        display: inline-block;
        float: right;
        padding: 28px 20px;
        position: relative;
        user-select: none;
    }

    .nav .navbar-icon .navicon {
        background: #333;
        display: block;
        height: 2px;
        position: relative;
        transition: background .2s ease-out;
        width: 18px;
    }

    .nav .navbar-icon .navicon:before, .nav .navbar-icon .navicon:after {
        background: #333;
        content: '';
        display: block;
        height: 100%;
        position: absolute;
        transition: all .2s ease-out;
        width: 100%;
    }

    .nav .navbar-icon .navicon:before {
        top:-5px;
    }

    .nav .navbar-icon .navicon:after {
        top: -5px;
    }

    .nav .navbar-btn {
        display: none;
    }

    .nav .navbar-btn:checked ~ .navbar {
        max-height: 240px;
    }

    .nav .navbar-btn:checked ~ .navbar-icon .navicon {
        background: transparent;
    }

    .nav .navbar-btn:checked ~ .navbar-icon .navicon:before {
        transform: rotate(-45deg);
    }

    .nav .navbar-btn:checked ~ .navbar-icon .navicon:after {
        transform: rotate(45deg);
    }

    .nav .navbar-btn:checked ~ navbar-icon:not(.steps) .navicon:before, .nav .navbar-btn:checked ~ .navbar-icon:not(.steps) .navicon:after {
        top: 0;
    }

    @media (min-width: 48em) {
        .nav-link {
            float: left;
        }

        a.nav-link {
            padding: 20px 30px;
        }

        .nav .navbar {
            clear: none;
            float: right;
            max-height: none;
        }

        .nav .navbar-icon {
            display: none;
        }
    }

/* Search Bar */
    .navbar-nav a.active {
        background-color: #dfd9ab;
        color: white;
    }

    .navbar-nav .search-container {
      float: right;
    }

    .navbar-nav input[type=text] {
      padding: 6px;
      margin-top: 8px;
      font-size: 17px;
      border: none;
    }

    .navbar-nav .search-container button {
      float: right;
      padding: 6px 10px;
      margin-top: 8px;
      margin-right: 16px;
      background: #ddd;
      font-size: 17px;
      border: none;
      cursor: pointer;
    }

    .navbar-nav .search-container button:hover {
      background: #dfd9ab;
    }

    @media screen and (max-width: 600px) {
      .navbar-nav .search-container {
        float: none;
      }
      .navbar-nav a, .navbar-nav input[type=text], .navbar-nav .search-container button {
        float: none;
        display: block;
        text-align: left;
        width: 100%;
        margin: 0;
        padding: 14px;
      }
      .navbar-nav input[type=text] {
        border: 1px solid #dfd9ab;  
      }
    }

/* Calender Settings */
    .month {
      padding: 70px 25px;
      width: 100%;
      background: #dfd9ab;
      text-align: center;
    }

    .month ul {
      margin: 0;
      padding: 0;
    }

    .month ul li {
      color: #191312;
      font-size: 20px;
      text-transform: uppercase;
      letter-spacing: 3px;
    }

    .month .prev {
      float: left;
      padding-top: 10px;
    }

    .month .next {
      float: right;
      padding-top: 10px;
    }

    .weekdays {
      margin: 0;
      padding: 10px 0;
      background-color: #883e24;
    }

    .weekdays li {
      display: inline-block;
      width: 13.6%;
      color: white;
      text-align: center;
    }

    .days {
      padding: 10px 0;
      background: #eee;
      margin: 0;
    }

    .days li {
      list-style-type: none;
      display: inline-block;
      width: 13.6%;
      text-align: center;
      margin-bottom: 5px;
      font-size:12px;
      color: #191312;
    }

    .days li .active {
      padding: 5px;
      background: #7e0000;
      color: white !important
    }

    /* Add media queries for smaller screens */
    @media screen and (max-width:720px) {
      .weekdays li, .days li {width: 13.1%;}
    }

    @media screen and (max-width: 420px) {
      .weekdays li, .days li {width: 12.5%;}
      .days li .active {padding: 2px;}
    }

    @media screen and (max-width: 290px) {
      .weekdays li, .days li {width: 12.2%;}
    }

/* Carousel Details */
  .carousel-inner > .item > img,
  .carousel-inner > .item > a > img {
    width: 70%;
    margin: auto;
    display: inline-block;
  }

    .column {
      float: left;
      width: 25%;
    }

/* Carousel Details */
.carousel .item {
  height: auto;
}
.carousel img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 500px;
}

/*Fake Buttons */
.button {
  background-color: #883e24;
  border: none;
  color: white;
  padding: 20px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}

.button1 {border-radius: 12px;}
.button2 {border-radius: 12px;}
.button3 {border-radius: 12px;}
.button4 {border-radius: 12px;}
.button5 {border-radius: 12px;}
.button6 {border-radius: 12px;}
.button7 {border-radius: 12px;}