/* layout19.css */

.holiday-menu-item {
    color: #ffffff;
    padding: 5px 10px;
    background-color: crimson;
}


/* General Purpose, overriding bootstrap, some new key styles. */
html
{
    font-size: 100%;            /* Restore default font-size (16px), from bootstrap 10px. This will let rem units work as expected. */
}

body
{
    font-family: "Open Sans",Arial,sans-serif;
}

/* Our white links with a slight blur hover. */
a.white
{
    color: #ffffff;
    text-decoration: none;
}

a.white:hover
{
    text-decoration: none;
    text-shadow: #ffffff 0 0 20px;      /* Blur effect on hover, larger radius is a softer effect. Alternative to a blue or gray hover color. */
}

button.btn-link.white, .navbar-default button.btn-link.white, .navbar-default a.btn-link.white
{
    color: #ffffff;
}
button.btn-link.white:hover, .navbar-default button.btn-link.white:hover, .navbar-default a.btn-link.white:hover
{
    text-shadow: #ffffff 0 0 20px;      /* Blur effect on hover, larger radius is a softer effect. Alternative to a blue or gray hover color. */
}

/* Mobile xs */
@media (min-width: 480px)
{
    .form-inline .form-group        /* Keep inline forms inline, until down to xs. Bootstrap breaks at sm. */
    {
        display: inline-block;
        margin-bottom: 0;
        vertical-align: middle;
    }
}

.containerFullWidth
{
    padding: 0;
}

/* Layout. */

/* Main content width, and original white bg. */
.layoutMain
{
    background-color: #ffffff;
    margin: 0 auto;
    max-width: 1200px;
    min-height: 500px;
    padding-bottom: 10px;
    position: relative;
    width: 100%;
}

/*
    Added clearfix styles to prevent margin collapse with page content. This is in every page, so easier to add the styles here than adding to every page.
    This is a parent/child collapse, so padding trick doesn't work.
    stackoverflow.com/questions/19718634/how-to-disable-margin-collapsing/25137269#25137269
*/
.layoutMain:before,
.layoutMain:after
{
  content: " ";
  display: table;
}

.layoutMain:after
{
  clear: both;
}

.layoutCenterContent
{
    margin: 0 auto;
    width: 1200px;
}

/* Bootstrap extension. */

/* 5 columns. stackoverflow.com/questions/10387740/five-equal-columns-in-twitter-bootstrap/22799354#22799354 */
.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths
{
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-xs-5ths
{
    width: 20%;
    float: left;
}

@media (min-width: 768px)
{
    .col-sm-5ths
    {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px)
{
    .col-md-5ths
    {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px)
{
    .col-lg-5ths
    {
        width: 20%;
        float: left;
    }
}