/*
    FONTS

    Cabin: https://fonts.google.com/specimen/Cabin?sidebar.open=true&selection.family=Cabin:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500
    Regular 400
    Regular 400 italic
    Medium 500
    Medium 500 italic
    Semi-bold 600
    Bold 700
    
*/
@import url('https://fonts.googleapis.com/css2?family=Cabin:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&display=swap');

:root {
    --color-green: #46655c;
    --color-lightGreen: #748c85;
    --color-darkGreen: #354d46;
    --color-orange: #f7931e;
    --color-default-text: #4e4e4e;
    --color-white-overlay: rgba( 255, 255, 255, 0.8 );
    --color-blue: #233950;
    --color-grey: #808080;
    --color-lightGrey: #bbbbbb;
    --color-navy: #233950;

    --font-cabin: 'Cabin', sans-serif;
    --font-cabin-weight-regular: 400;
    --font-cabin-weight-medium: 500;
    --font-cabin-weight-semiBold: 600;
    --font-cabin-weight-bold: 700;

    --aspect-16x9: 56.25%;
}


/* HTML */

a, a:link, a:active, a:visited {
    color: var( --color-orange );
    text-decoration: underline;
}

a:hover {
    color: #f3d0a8;
}

body {
    font-family: 'Cabin', sans-serif;
    font-size: 1rem;
    color: var( --color-default-text );
    background-color: #fff;
    background-image: url( "../img/background.jpg" );
    background-attachment: fixed;
    background-position: top center;
    background-size: cover;
    min-height:100vh;
}

h1, h2, h3, h4, h5, h6 {
    color: #000;
}

h1 a, h1 a:link, h1 a:active, h1 a:visited {
    color: inherit;
    text-decoration: none;
}


h1 {
    font-size: 3rem;
    margin-bottom: 20px;
    text-align: center;
}

h2 {
    color: #000;
    font-size: 1.5rem;
    margin-bottom: 20px;
}

img {
    max-width:100%;
}

/* Generic / Utility Classes */

.text-white {
    color: #fff !important;
}

.text-black {
    color: #000 !important;
}

.text-shadow {
    text-shadow: 1px 1px 5px #000, 0px 0px 3px #000;
}

.text-shadow-dark {
    text-shadow: 1px 1px 5px #000, 0px 0px 3px #000, 0px 0px 19px #000, 0px 0px 30px #000;
}

.main-overlay {
    background-color: var( --color-white-overlay );
    padding-top: 20px;
    padding-bottom: 20px;
}

.inner-shadow-bottom {
    box-shadow: inset 0px -5px 0px 0px rgba(0,0,0,0.50);
}

.inner-shadow-y {
    box-shadow: inset 0px -5px 0px 0px rgba(0,0,0,0.25), 
        inset 0px 5px 0px 0px rgba(0,0,0,0.25);
    z-index: 10;
    position: relative;
}

.outer-shadow-top {
    box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.50);
}

.outer-shadow-y {
    box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.25), 
        0px 5px 0px 0px rgba(0,0,0,0.25);
    z-index: 10;
    position: relative;
}


.pre {
    color: #a6a6a6;
    font-size: 1.875rem;
    text-align: center;
}

/* Primary Navigation Bar */

.main-navbar {
    background-color: var( --color-green );
    color: #e3e3e3;
    border-bottom: 5px solid var( --color-lightGreen );
    padding: 0.25rem 1.rem;
    box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.35);
    z-index: 10;
}

.main-navbar .navbar-brand {
    padding: 0px;
}

.main-navbar .navbar-brand img {
    height: 40px;
}

.main-navbar .container {
    max-width: 100%;
}

.main-top .navbar-nav .dropdown-menu {
    background-color: rgba( 0, 0, 0, 0.95 );
}

.main-top .navbar-nav a {
    text-decoration: none;
}

.main-spacer {
    background-color: var( --color-green );
    color: #fff;
    border-top: 5px solid rgba( 0, 0, 0, 0.25 );
    border-bottom: 5px solid rgba( 0, 0, 0, 0.25 );
}

.main-spacer h2 {
    color: #fff;
    margin-bottom: 0px;
}


/* View container */

.main-view {}


/* Bottom Section (under content/before footer) */

.main-bottom {
    background-color: var( --color-green );
    color: #fff;
    font-size: 1.5rem;
}


/* Footer */

.main-footer {
    background-color: var( --color-white-overlay );
}

.main-footer-social i {  
    margin-right: 5px;
    color: var( --color-lightGreen );
    font-size:2.0em;
}

.main-footer-social img {
    max-width:35px;
    max-height:35px;
}

.main-footer-ad {
    margin:0px auto 0px auto;
}

.main-footer-ad > iframe {
    max-width:100%;
}

.main-footer-minor {
    font-size: 0.75rem;
}

.main-footer-navigation {
    text-align: center;
}



.main-image-frame {
    padding: 10px;
    border: 1px solid #d8d8d8;
    border-radius: 2px;
    background-color: #fff;
}


/* Utility Classes */


/* Bootsrap Overrides */

.lead {
    color: #a6a6a6;
    font-size: 1.5rem;
    margin-bottom: 40px;
    margin-top: -10px;
    text-align: center;
}

.navbar-brand { 
    cursor: pointer;
}

.navbar-dark .navbar-nav .nav-link-cta {
    color: var( --color-orange );
}

.navbar-dark .btn.dropdown-toggle {
    color: rgba( 255, 255, 255, 0.5 );
}

a.btn {
    text-decoration: none;
}

a.btn-danger {
    color: #fff;
}

.btn-primary, a.btn-primary {
    color:#fff;
    text-decoration: none;
    background-color:rgb(247,146,30);
    border-color: rgba( 255, 255, 255, 0.5);
}

.btn-primary:hover {
    background-color:#f59f3d;
    border-color: rgba( 255, 255, 255, 1);
}

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
    background-color:rgb(241, 137, 18);
    border-color: rgba( 255, 255, 255, 1);
}

.btn-primary.focus, .btn-primary:focus {
    box-shadow: 0 0 0 0.2rem rgba(255,255,255,.5);
}

.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(255,255,255,.5); 
}

.btn-secondary, a.btn-secondary {
    color:#fff;
    text-decoration: none;
    background-color:rgb(5,71,39);
    border-color: rgba( 255, 255, 255, 0.5);
}

.btn-secondary:hover {
    background-color:rgb(7,95,52);
    border-color: rgba( 255, 255, 255, 1);
}

.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show>.btn-secondary.dropdown-toggle {
    background-color:rgb(5,71,39);
    border-color: rgba( 255, 255, 255, 1);
}

.btn-secondary.focus, .btn-secondary:focus {
    box-shadow: 0 0 0 0.2rem rgba(255,255,255,.5);
}

.btn-secondary:not(:disabled):not(.disabled).active:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus, .show>.btn-secondary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(255,255,255,.5); 
}



.form-control:focus {
    border-color: rgba(247,146,30, 0.4);
    box-shadow: 0 0 0 0.2rem rgba(247,146,30, 0.1);
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder,
.form-control::-webkit-input-placeholder
{
    color: rgb(200, 200, 200); 
}

input::-moz-placeholder,
textarea::-moz-placeholder,
.form-control::-moz-placeholder
{
    color: rgb(224, 224, 224); 
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder,
.form-control::-ms-input-placeholder
{
    color: rgb(224, 224, 224);  
}

input::placeholder,
textarea::placeholder, 
.form-control::placeholder 
{
    color: rgb(200, 200, 200);  
}

.alert {
    margin-bottom:0px;
}

.alert > p:last-child {
    margin-bottom: 0px;
}


.alert-error {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

.alert-error a {
    color: #a94442;
}

.alert-success a {
    color: #064e2b;
}

.alert-warn {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
}

.alert-warn a {
    color: #856404;
}

.card-header {
    background-color: rgb(247,146,30);
    color: rgb( 255, 255, 255 );
}

.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6 {
    color: rgb( 255, 255, 255 );
    font-weight: bold;
}

.card-body {
    color: black;
}

.input-group-append > .fas {
    line-height: inherit;
}

.password-strength-progress .progress {
    background-color: #302423;
}

.card-seal {
    width: 100px;
}

/* SPECIAL MEMBERSHIP CARDS */

.card-nomad {}
.card-nomad .card-header {
    background-color: #6b6b6b;
}

.card-nomad .card-title {
    color: #6b6b6b;
}

.card-nomad .btn-primary, .card-nomad a.btn-primary {
    background-color: #6b6b6b;
}

.card-scout {}
.card-scout .card-header {
    background-color: #03572f;
}

.card-scout .card-title {
    color: #03572f;
}

.card-scout .btn-primary, .card-scout a.btn-primary {
    background-color: #03572f;
}

.card .list-group {}

.card .list-group .list-group-item {
    background-color: #6b6b6b;
    color: #fff;
}

.card-title-old {
    text-decoration: line-through;
    color: #6b6b6b
}

.card-camphost .card-title, .card-ranger .card-title {
    color: var( --color-orange );
}

/* Messagebox */

.cbox_messagebox {
    text-align: center;
}

/* Utilities */

.invert {
    filter: invert(1);
}

/* Video */
.video {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    margin-bottom: 2rem;
}

.video > iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {}

/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {

    .navbar-dark .navbar-nav .nav-link {
        text-decoration: none;
    }

    .main-overlay {
        box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.52);
        padding: 40px;
    }

    .main-image-frame {
        padding: 20px;
    }

    .card-seal {
        position: absolute;
        top:-20px;
        right: -20px;
        height: 90px;
        width: 90px;
        transform: rotate(-25deg); /* Equal to rotateZ(45deg) */
    }

}

/* Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {

    .main-navbar {
        max-height: 95px;
    }

    .main-navbar .navbar-brand img {
        height: 70px;
    }
    
    .main-content > .container {
        border-left: 3px solid rgb( 30,25,24 );
        border-right: 3px solid rgb( 30,25,24 );
    }

    .main-content > .container:first-child {
        min-height: 300px;
    }

    .alert {
        text-align: center;
        border-radius: 0px;
    }

    .main-cta {
        position:relative;
    }


    .main-cta .btn {
        box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
        position:relative;
        z-index:2;
    }

    .main-cta-text {
        display: inline-block;
    }
    
    .main-splash, .main-missout, .main-howitworks {
        padding-top: 56.25%;
        position:relative;
    }
    
    .main-splash-box {

    }

    .card-body {
        font-size: 0.875rem;
    }

    .card-seal {
        top:-20px;
        right: -30px;
    }


}

/* Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {}
