/* Bootstrap 4.5.3 */
/* One Page Wonder (https://startbootstrap.com/theme/one-page-wonder) */
/* Copyright 2013-2020 Start Bootstrap */
/* Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-one-page-wonder/blob/master/LICENSE) */
/*  */
/* accessibility: support dynamic type on apple devices */
/* accessibility: code fails powermapper but passes w3c css */
@supports (font: -apple-system-body) {
    html {
        font: -apple-system-body;
    }
}

/* accessibility: absolute root font size not specified */
body {
    padding-top: 0rem;
    font-size: 1.3rem;
}

/* accessibility: hint box */
.hint-box {
    background-color: #c8e6c9;
    padding-left: 1rem;
    padding-right: .5rem;
    padding-top: .5rem;
}

/* headings */
h1 {
    font-size: 3.3rem;
    font-weight: 400 !important;
}

h2 {
    font-size: 2.3rem;
    font-weight: 400 !important;
    text-align: center;
    padding-top: 1rem;
    padding-bottom: .5rem;
}

h3 {
    font-size: 2rem;
    font-weight: 400 !important;
    color: #ffffff;
}

h4 {
    font-size: 2rem;
    font-weight: 400 !important;
}

/* navbar */
.navbar-custom {
    background-color: #10243f;
    text-decoration: none;
}

.navbar-custom .navbar-brand {
    font-size: 1.5rem;
    letter-spacing: 0.2rem;
    font-weight: 600;
    color: #fff000;
    text-decoration: none;
}

.navbar-custom .navbar-brand:hover {
    border-bottom: 3px solid white;
}

.navbar-custom .navbar-nav .nav-item .nav-link {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.1rem;
    color: #ffffff;
    text-decoration: none;
}

.navbar-custom .navbar-nav .nav-item .nav-link:hover {
    border-bottom: 3px solid white;
}

/* accessibility: focus navbar brand */
.navbar-custom .navbar-brand:focus {
    border-bottom: 3px solid white;
}

/* accessibility: focus navbar link */
.navbar-custom .navbar-nav .nav-item .nav-link:focus {
    border-bottom: 3px solid white;

    /* outline: none; */
    /* border: 5px solid white; */
    /* border-radius: 5px; */
}

/* header home page */
header.masthead {
    position: relative;
    overflow: hidden;
    padding-top: calc(7rem + 72px);
    padding-bottom: 7rem;
    background-color: #10243f;
    background-image: url('../images/back2.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: scroll;
    background-size: cover;
    color: white;
}

header.masthead .masthead-content {
    z-index: 1;
    position: relative;
}

/* header other pages */
header.masthead2 {
    position: relative;
    overflow: hidden;
    padding-top: calc(3rem + 72px);
    padding-bottom: 3rem;
    background-color: #10243f;
    background-image: url('../images/back3.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: scroll;
    background-size: cover;
}

header.masthead2 .masthead2-content {
    z-index: 1;
    position: relative;
}

/* backgrounds */
.bg-black {
    background-color: #000 !important;
}

.bg-primary {
    background-color: #ee0979 !important;
}

/* links */
a {
    color: #bf360c;
    text-decoration: underline;
}

a:visited {
    color: #bf360c;
    text-decoration: underline;
}

a:hover {
    color: #000000;
    border-bottom: 3px solid black;
}

a:active {
    color: #bf360c;
    text-decoration: underline;
}

/* accessibility: focus keyboard */
a:focus {
    color: #000000;
    border-bottom: 3px solid black;
    outline: none;
}

btn-primary {
    background-color: #ee0979;
    border-color: #ee0979;
}
.btn-primary:active,
.btn-primary:focus,
.btn-primary:hover {
    background-color: #bd0760 !important;
    border-color: #bd0760 !important;
}
.btn-primary:focus {
    box-shadow: 0 0 0 0.2rem rgba(238, 9, 121, 0.5);
}
.btn-secondary {
    background-color: #ff6a00;
    border-color: #ff6a00;
}
.btn-secondary:active,
.btn-secondary:focus,
.btn-secondary:hover {
    background-color: #cc5500 !important;
    border-color: #cc5500 !important;
}
.btn-secondary:focus {
    box-shadow: 0 0 0 0.2rem rgba(255, 106, 0, 0.5);
} */
.btn-xl {
    text-transform: uppercase;
    padding: 1.5rem 3rem;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.1rem;
}

/* button */
.rounded-pill {
    border-radius: 5rem;
}

/* accessibility: focus button */
.btn:active,
.btn:focus {
    border: 10px dotted white;

    /* border: 10px solid #8e78fc; */
}

/* accessibility: skip to main content */
a.skip-main {
    left: -999px;
    position: absolute;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
    z-index: -999;
}

a.skip-main:focus,
a.skip-main:active {
    color: white;
    background-color: #000;
    left: auto;
    top: auto;
    width: 30%;
    height: auto;
    overflow: auto;
    margin: 100px 35%;
    padding: 5px;
    border-radius: 15px;
    border: 4px solid yellow;
    text-align: center;
    font-size: 1.2rem;
    z-index: 999;
}

/* hamburger */
.navbar-toggler {
    border-color: #ffffff;
    background-color: transparent;
    color: #ffffff;
}

/* hamburger bars */
.navbar .navbar-toggler-icon {
    background-image: url("../images/hamburger-bars.gif");
}

/* footer */
footer {
    background-color: #000000;
    color: #ffffff;
}

footer a {
    color: #EDE275;
    text-decoration: none;
}

footer a:visited {
    color: #EDE275;
    text-decoration: none;
}

footer a:hover {
    color: #ffffff;
    border-bottom: 3px solid white;
    text-decoration: none;
    font-weight: bold;
}

footer a:active {
    color: #EDE275;
    text-decoration: none;
}

footer h2 {
    color: #ffffff;
}

/* accessibility: focus footer links */
footer a:focus {
    color: #ffffff;
    border-bottom: 3px solid white;
    font-weight: bold;
    text-decoration: none;

    /* outline: none; */
    /* background-color: #8e78fc; */
    /* border-color: #ff0000; */
}

.display-4 {
    font-size: 2.5rem;
    font-weight: 300;
    line-height: 1.2;
}

/* -------- media query 768 -------- */
@media (max-width: 768px) {
    header.masthead {
        padding-top: calc(5rem + 55px);
        padding-bottom: 2rem;
    }

    header.masthead .masthead-content .masthead-heading {
        font-size: 4rem;
    }

    header.masthead .masthead-content .masthead-subheading {
        font-size: 3rem;
    }
	
    body {
        font-size: 0.9em;
    }

    p {
        font-size: 0.9em;
    }
	
	h1 {
        font-size: 2.0em;
        font-style: ;
    }

    h2 {
        font-size: 0.8em;
    }

    h3 {
        font-size: 0.8em;
    }

    h4 {
        font-size: 0.8em;
    }
	
	.display-4 {
    font-size: 1.5rem;
    font-weight: 300;
    line-height: 1.2;
}
}