/* Main CSS - Complete Bootstrap Theme from Reference Project */

/* Font Face Definitions */
@font-face {
    font-family: 'AvenirNextLTPro-Regular';
    src: url('https://code.ionicframework.com/assets/fonts/28882F_0_0.eot');
    src: url('https://code.ionicframework.com/assets/fonts/28882F_0_0.eot?#iefix') format('embedded-opentype'),
         url('https://code.ionicframework.com/assets/fonts/28882F_0_0.woff') format('woff'),
         url('https://code.ionicframework.com/assets/fonts/28882F_0_0.ttf') format('truetype');
}

@font-face {
    font-family: 'BPreplayRegular';
    src: url('../type/BPreplay-webfont.eot');
    src: url('../type/BPreplay-webfont.eot?#iefix') format('embedded-opentype'),
         url('../type/BPreplay-webfont.woff') format('woff'),
         url('../type/BPreplay-webfont.ttf') format('truetype'),
         url('../type/BPreplay-webfont.svg#BPreplayRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Reset and Body Layout */
* {
    box-sizing: border-box;
}

html, body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    width: 100%;
}

body {
    background-color: white;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

main {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.album {
    flex: 1;
}



/* Bootstrap Placeholder Images */
.bd-placeholder-img {
    font-size: 1.125rem;
    text-anchor: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

@media (min-width: 768px) {
    .bd-placeholder-img-lg {
        font-size: 3.5rem;
    }
}


/* Loading Spinner */
.loading-spinner {
    display: none;
}

.loading-spinner.active {
    display: block;
}

/* Breadcrumb */
.breadcrumb-item a {
    text-decoration: none;
}

/* Badge Colors */
.badge.bg-success {
    background-color: #2ecc71 !important;
}

.badge.bg-primary {
    background-color: #2980b9 !important;
}

.badge.bg-secondary {
    background-color: #95a5a6 !important;
}

/* Checkpoint Banner */
.checkpoint-banner img:hover {
    opacity: 0.8;
}



/* Footer Container */
.footer-container {
    background-color: white !important;
    text-align: center;
    padding: 50px 0;
}







/* Utility Classes */
.pointer {
    cursor: pointer;
}