/******** Home Layout ********/
html, body {
    background: #00467F;
    height: 100%;
}
footer {background-color: rgba(0,70,127,.75);}
#page {
    background-image: url("../images/banners/HeroBackground.jpg"); 
    background-position: center; -webkit-background-size: cover; -moz-background-size: cover;  -o-background-size: cover; background-size: cover;
    width: 100%;
    min-height: 0px;
}
.motto {display: none;}
.footer-curve {
	position: absolute;
    background-color: rgba(0,70,127,.75);
    clip-path: ellipse(55% 100% at 49% 100%);
	height: 20px;
	width: 100%;
	bottom: 0;
	z-index: 50;
}
.w-top {
    top: -20px;
}

/******** Homepage Slideshow Overrides ********/
.carousel-item .container {
	height: 50vh;
}
.carousel-caption {
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
	top: 50%;
	bottom: auto;
	transform: translateY(-50%);
}
.carousel-caption h1 {
    font-size: 44px;
}
.carousel-indicators li {
	width: 15px;
	height: 15px;
	border-radius: 50%;
}
.carousel-control-next, .carousel-control-prev {opacity: .75;}
.carousel-control-next:focus, .carousel-control-next:hover, .carousel-control-prev:focus, .carousel-control-prev:hover {opacity: 1; cursor: grab;}
/******** Overrides ********/

.card {
    background-color: rgba(0,70,127,.75);
    border: 0;
    border-radius: 0;
    color: white;
    font-size: 90%;
}
.card-header {
    background-color: none;
    border: 0;
    padding: 0 .25rem;
    text-align: center;
}
.card a, .card a:hover {
    color: white;
}
.card .card-header .btn {
    padding: 0 0 .5rem;
    font-size: 1.2rem;
}
.card-header .btn-link {
    color: white;
    text-decoration: none;
    text-align: center;
    text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
}
.card-header .btn-link:hover {
    color: white;
    text-decoration: underline;
}  
.card  .list-group-item {
    border-bottom: 1px dotted rgba(255,255,255,.5);
}
.card  .list-group-item img {
    width: 100px;
    height: auto;
}

/**************** handheld definitions ****************/
@media (min-width: 768px) {
    #page {
        height: 100%;
    }
    footer {
        position: fixed;
        width: 100%;
         bottom: 0;
    }
    #accordionHome {    
        position: fixed;
        right: 0;
        bottom: 75px;
        left: 0;
        z-index: 1030;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    #accordionHome {bottom: 103px;   }
    .card-body {
        font-size: 90%;
    }
}

@media (max-width: 767px) {
    #page {
        height: auto;
    }
    .carousel-item .container {
/*        height: 300px;*/
    }
    .card {
        border-top: 1px solid #023151;
    }
    .card .col-inner {
        display: none;
    }
    .card .card-header .btn {
        padding: .375rem .75rem;
    }
    .carousel-caption h1 {
        font-size: 25px;
    }
    .carousel-caption p {
        font-size: 1rem;
    }
}