/* Your custom styles */
body {
    color: #212121;
    background-color: #fcf7ef;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: -apple-system, BlinkMacSystemFont,"Acme", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}
.doprint {
    display: none !important;
    visibility: hidden !important;
}

.toonitem {
    display: none !important;
}

.doshadow {
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black !important;
}

small {
    font-size: 80%;
}

smaller {
    font-size: 60%;
}
.textarea-height {
height:auto !important}

.md-form label.activefix {
    -webkit-transform: translateY(-5%) ;
    -ms-transform: translateY(-5%) ;
    transform: translateY(-5%) !important;
}

.md-form label.active {
    -webkit-transform: translateY(-30%);
    -ms-transform: translateY(-30%);
    transform: translateY(-30%);
}
.kids-header {
    color: #0275d8;
}

.not, .not:hover {
    color: inherit;
    text-decoration: none;
}

.light {
    color: #757575;
}

.kids-select {
    display:inline !important;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 16px;
    line-height: 24px;
    padding: 0px 20px 0px 15px;
    color: #777;
    background-color: #fff;
    border: 1px solid #e5e5e5;
    width: 100%;
    border-radius: 0;
    outline: none;
    -webkit-appearance: none;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border-radius: 8px;
    height: 32px;
    margin: 0;
}
.kids-input {
    border-bottom: 0px !important;
    width: 90% !important;
    font-size: 14px;
    margin-left: 5px;
    padding-left: 5px;
}
#myBtn {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed/sticky position */
    bottom: 100px; /* Place the button at the bottom of the page */
    right: 20px; /* Place the button 30px from the right */
    z-index: 99; /* Make sure it does not overlap */
    border: none; /* Remove borders */
    outline: none; /* Remove outline */
    /*background-color: red;  Set a background color */
    color: orange; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    padding: 10px; /* Some padding */
    border-radius: 10px; /* Rounded corners */
    font-size: 42px; /* Increase font size */
}

    #myBtn:hover {
        color: #8bc34a; /* Add a dark-grey background on hover */
    }
.card img {
    width: 100%;
}
.card .cal img {
    width: auto !important;
}
.divcenter ul {
    display: table;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 0px;
    color: #757575;
}

.navbar-brand:before {
    position: absolute;
    content: '';
    background: url(../img/logo.png) no-repeat;
    top: 0;
    left: 2.0rem;
    width: 99px;
    height: 100px;
    z-index: -1;
}

.navbar-brand {
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
    margin-right: 1.5rem;
    margin-left: 1rem;
    font-size: 2.5rem;
    font-family: -apple-system, BlinkMacSystemFont,"Acme", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    line-height: 2.00rem;
}
.footer-brand {
    padding-top: 1.0rem;
    padding-bottom: 0.1rem;
    margin-right: 1.5rem;
    margin-left: 1rem;
    font-size: 1.5rem;
    font-family: -apple-system, BlinkMacSystemFont,"Acme", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    line-height: 1.50rem;
}
.footer-copyright {
    overflow:inherit !important;
    height:inherit !important;
}

.list-group-hover a {
    color: inherit
}

.list-group-hover:hover {
    background-color: #ffbb33;
}

.list-group-hover a:hover {
    color: white;
}
.w100 {
    width:100%}
.maxheight {
    max-height:400px;
    width:auto;
    }
.page {
    overflow: hidden;
    min-height: 500px;
}

.lt-ie9 .page {
    min-width: 1200px;
}

.center-block {
    display: table; /* Instead of display:block */
    margin-left: auto;
    margin-right: auto;
}
.bc-icons .breadcrumb-item + .breadcrumb-item::before {
    content: none; 
}
li.breadcrumb-item {
    font-size: 0.8em;
}
/* TEMPLATE STYLES */
/* Necessary for full page carousel*/
html,
body {
    height: 100%;
}
/* Navigation*/

.navbar {
    background-color: transparent;
    font-weight: bolder;
}

.top-nav-collapse {
    background-color: #FF8910;
}

@media only screen and (max-width: 768px) {
    .navbar {
        background-color: #FF8910;
    }
}

@media only screen and (min-width: 1199px) {
    .container-fluid {
    max-width: 80%;
    } 

}

footer.page-footer {
    background-color: #304a74;
}

.event i {
    text-align: center;
    font-size: 60px;
    line-height: 100px;
    margin-top: 0px;
    width: 100px;
    height: 120px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

@media (max-width: 576px) {
    .h-img {
        height: 350px;
    }
}
@media (max-width: 768) {
    .h-img {
        height: 350px;
    }
}
@media (max-width: 992px) {
    .h-img {
        height: 350px;
    }
}
@media (min-width: 992px) {
    .h-img {
        height: 300px;
    }
}



@media (max-width: 576px) {
    .mt-xs-5 {
        margin-top: 3rem !important;
    }

    .mt-xs-10 {
        margin-top: 6rem !important;
    }
}
    /* Carousel*/

    .carousel {
        height: 50%;
    }

    @media (max-width: 776px) {
        .carousel {
            height: 100%;
        }
    }

    .carousel-item,
    .active {
        height: 100%;
    }

    .carousel-inner {
        height: 100%;
    }
    /*Caption*/

    .flex-center {
        color: #fff;
    }

    .navbar .btn-group .dropdown-menu a:hover {
        color: #000 !important;
    }

    .navbar .btn-group .dropdown-menu a:active {
        color: #fff !important;
    }

    /*---  pager  ---*/
    .pagination .page-link {
        background-color: transparent;
        font-size: 0.8rem;
    }

    .pagination .active .page-link {
        border-radius: 2px;
        -webkit-transition: all 0.2s linear;
        transition: all 0.2s linear;
    }

        .pagination .active .page-link:hover {
            color: #fff;
        }

    .pagination.pagination-circle .page-link {
        border-radius: 50%;
        margin-left: 2px;
        margin-right: 2px;
    }

        .pagination.pagination-circle .page-link:hover {
            border-radius: 50%;
        }

    .pagination.pagination-circle .active .page-link {
        border-radius: 50%;
    }

    .pagination .page-link {
        border: 0;
        -webkit-transition: all 0.3s linear;
        transition: all 0.3s linear;
    }

        .pagination .page-link:hover {
            -webkit-transition: all 0.3s linear;
            transition: all 0.3s linear;
            background-color: #eee;
        }

        .pagination .page-link:focus {
            background-color: transparent;
        }

    .pagination.pg-blue .active .page-link {
        background-color: #4285F4;
    }

    .pagination.pg-red .active .page-link {
        background-color: #ff3547;
    }

    .pagination.pg-teal .active .page-link {
        background-color: #2BBBAD;
    }

    .pagination.pg-darkgrey .active .page-link {
        background-color: #37474F;
    }

    .pagination.pg-dark .active .page-link {
        background-color: #2E2E2E;
    }

    .pagination.pg-bluegrey .active .page-link {
        background-color: #3F729B;
    }

    .pagination.pg-amber .active .page-link {
        background-color: #ff6f00;
    }

    .pagination.pg-purple .active .page-link {
        background-color: #5e35b1;
    }



    /*Memory*/
    #picbox {
        margin: 0px auto;
        width: 640px;
    }

    #boxcard {
        z-index: 1;
        margin: 10px 0 0;
    }

        #boxcard div {
            float: left;
            width: 100px;
            height: 100px;
            margin: 5px;
            padding: 5px;
            border: 4px solid #EE872A;
            cursor: pointer;
            border-radius: 10px;
            box-shadow: 0 1px 5px rgba(0,0,0,.5);
            background: #B1B1B1;
            z-index: 2;
        }

            #boxcard div img {
                display: none;
                border-radius: 10px;
                z-index: 3;
            }

    #boxbuttons {
        text-align: center;
        margin: 20px;
        display: block;
    }

        #boxbuttons .button {
            text-transform: uppercase;
            background: #EE872A;
            padding: 5px 10px;
            margin: 5px;
            border-radius: 10px;
            cursor: pointer;
        }

            #boxbuttons .button:hover {
                background: #999;
            }


    .embed-responsive-9by16::before {
        padding-top: 177.77%;
    }

/* Container holding the image and the text */
.bannercontainer {
    position: relative;
    text-align: center;
}
.bannerheader { 
    font-size: 40px;
}

    /* Bottom left text */
    .bottom-left {
        position: absolute;
        bottom: 8px;
        left: 16px;
    }

    /* Top left text */
    .top-left {
        position: absolute;
        top: 8px;
        left: 16px;
    }

    /* Top right text */
    .top-right {
        position: absolute;
        top: 5%;
        right: 5%;
    }

    /* Bottom right text */
    .bottom-right {
        position: absolute;
        bottom: 8px;
        right: 16px;
    }

    /* Centered text */
    .centered {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

@media only screen and (min-width: 576px) {
    .bannerheader {
        font-size: 40px;
    }
}

@media (min-width: 768) {
    .bannerheader {
        font-size: 40px;
    }
}

@media (min-width: 992px) {
    .bannerheader {
        font-size: 80px;
    }
}

