﻿
@font-face {
    font-family: 'franchiseregular';
    src: url('https://cdn.ageofascent.net/assets/fonts/franchise-regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'franchiselight';
    src: url('https://cdn.ageofascent.net/assets/fonts/franchise-light.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'PT Sans';
    src: url('https://cdn.ageofascent.net/assets/fonts/pt_sans-web-regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html {
    margin: 0;
    background: url('https://cdn.ageofascent.net/assets/header_aoa_4.png') repeat-x;
    background-color: #020621;
}

html, body {
    margin: 0;
    padding: 0;
    color: ghostwhite;
    font-family: "PT Sans", Arial, Helvetica, sans-serif;
}

body {
    max-width: 940px;
    margin: auto;
    position: relative;
}

a {
    text-decoration: none;
    color: #378ad2;
    cursor: pointer;
}

a:hover {
    color: #74c7d6;
}

nav {
    font-family: franchiseregular;
    height: 51px;
}

nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    float: right;
    height: 51px;
}

nav li {
    float: left;
    padding-top: 8px;
    margin: 2px 10px 10px 10px;
    border-top: 4px solid transparent;
    font-size: 24px;
}

nav li a {
    color: ghostwhite;
}

nav li:hover {
    border-top: 4px solid #378ad2;
}

li.selected {
    border-top: 4px solid #0764b5;
}

footer {
    font-family: "PT Sans", Arial, Helvetica, sans-serif;
    padding: 4px;
    margin-bottom: 16px;
    clear:both;
    border-top: 1px solid #5A4328;
}

input:not([type]),
input[type="email"],
input[type="number"],
input[type="password"],
input[type="tel"],
input[type="url"],
input[type="text"] {
    background: #161c46;
    border: none;
    border-bottom: #F5A923 solid 1px;
    margin-bottom: 1px;
    border-radius: 3px;
    padding: 3px;
    color: white;
}

    input:not([type]):focus,
    input[type="email"]:focus,
    input[type="number"]:focus,
    input[type="password"]:focus,
    input[type="tel"]:focus,
    input[type="url"]:focus,
    input[type="text"]:focus {
        background: #000;
        border: none;
        border-bottom: #378ad2 solid 2px;
        margin-bottom: 0px;
        outline: none;
    }

button {
    font-family: franchiselight,'Arial Narrow', Arial, sans-serif;
    border: 1px solid rgba(255,255,255,0.5);
    height: 2.2rem;
    background: rgba(0,128,255,0.2);
    box-shadow: 0px 0px 4px 2px rgba(231, 166, 26,0.0);
    /*transition: ease-in-out 0.5s, box-shadow 0s;*/
    color: white;
    font-weight: bold;
    font-size: 1.75rem;
    width: 7rem;
    display: inline-block;
    text-decoration: none;
    cursor: url("https://cdn.ageofascent.net/assets/cursor/pointer.png") 0 0, pointer;
}
    button:hover {
        color: black;
        border: 1px solid rgba(255,255,255,0);
        background: radial-gradient(ellipse at center, rgba(237,226,173,1) 0%,rgba(227,159,20,1) 100%);
        box-shadow: 0px 0px 4px 2px rgba(231, 166, 26,0.75);
        /*transition: ease-in-out 0.5s, box-shadow 0s;*/
        cursor: url("https://cdn.ageofascent.net/assets/cursor/default.png") 0 0, default;
    }
h1, h2, h3, h4, h5 {
    font-family: franchiselight,'Arial Narrow', Arial, sans-serif;
    font-weight: normal;
    font-style: normal;
    color: white;
    margin: 0;
    padding: 0;
}
h1 {
    font-size: 3.5rem;
    padding-left: 5rem;
    height: 5rem;
    padding-top: .75rem;
    box-sizing: border-box;
    background: linear-gradient(to right, rgba(29, 78, 143, 0.01) 0, rgba(29, 78, 143, 0.4) 3.5rem, rgba(29, 78, 143, 0.4) 6.5rem, rgba(29, 143, 143, 0.4) 16rem, rgba(29, 78, 143, 0.01) 100%);
    background: linear-gradient(to right, rgba(29, 78, 143, 0.01) 0, rgba(29, 78, 143, 0.4) 3.5rem, rgba(29, 78, 143, 0.4) 6.5rem, rgba(29, 143, 143, 0.4) 16rem, rgba(29, 78, 143, 0.01) 100%);
    background-size: 100%;
    background-repeat: no-repeat;
    text-shadow: rgb(255, 255, 255) 0px 0px 5px, #66b9ff 0px 0px 10px, #66b9ff 0px 0px 15px, #66b9ff 0px 0px 20px;
}

h2 {
    color: #F5A923;
    border-bottom: 1px solid;
    min-height:31px;
}
h2.blog {
    border-bottom: 0px none;
}

h3 {
    margin: 0;
}

h4 {
    border-top: 1px solid #F5A923;
    border-bottom: 1px solid #F5A923;
    margin-left: 30%;
    margin-right: 30%;
    padding: 4px;
    text-align: center;
}

footer {
    font-family: "PT Sans", Arial, Helvetica, sans-serif;
    padding: 4px;
    margin-bottom: 16px;
    clear:both;
    border-top: 1px solid #5A4328;
}
/* QR code generator */
#qrCode {
    margin: 15px;
}
