@font-face {
    /* To resolve this, add a mime-type mapping to the applications web.xml */
    font-family: 'librefranklin-light';
    src: url("/javax.faces.resource/LibreFranklin-Light.woff2.xhtml?ln=fonts");
}

@font-face {
    /* To resolve this, add a mime-type mapping to the applications web.xml */
    font-family: 'librefranklin-extralight';
    src: url("/javax.faces.resource/LibreFranklin-ExtraLight.woff2.xhtml?ln=fonts");
}

h1 {    
    margin-top: 2rem;
    margin-bottom: 2rem;
    
    font-family: 'arual';
    font-size: 3rem;
}

h2 {    
    margin-top: 2rem;
    margin-bottom: 2rem;

    font-family: 'librefranklin-extralight';
    font-size: 2rem;
}

main h1, main h2, main h3 {    
    font-family: 'librefranklin-light';
    font-size: 2rem;
}
    
main p, main li {    
    font-family: 'librefranklin-light';
}

main li::before {
    content: "•"; color: #e53935;
    display: inline-block; 
    width: 1em;
    margin-left: -1em
}

section {
    padding-top: 6em;
    padding-bottom: 6em;
}

#logo {
    animation-duration: 5s;
    animation-delay: 0.5s;
}






header .btn, header .btn-large {
    background-color: #ff9800;
}
header .btn:visited, header .btn-large:visited {
    /*background-color: #ff9800;*/
}
header .btn:hover, header .btn-large:hover {
    background-color: rgba(255, 255, 255, 0.0);
    border-radius: 2px;
    border: 1px solid #FFFFFF;
}
header .btn:active, header .btn-large:active {
    background-color: #ff9800;
}
header .btn:focus, header .btn-large:focus {
    background-color: #ff9800;
}






@media screen and (max-width: 992px) {
    .mobile-padding-required {
        /*
        padding-top: 6rem !important;
        padding-bottom: 6rem !important;
        */
    
        text-align: center;
    }
}

main .card-image {
    overflow: hidden; /* 16:9 Aspect Ratio */
    height: 0; /* 16:9 Aspect Ratio */
    padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
}