@font-face {
    font-family: 'Droid Sans Mono';
    font-weight: 400;
    font-style: normal;
    src: local('Droid Sans Mono'), local('DroidSansMono'), url(/fonts/droidsansmono.v4.woff) format('woff');
}
@font-face {
    font-family: 'Playfair Display SC';
    font-weight: 400;
    font-style: normal;
    src: local('Playfair Display SC'), local('PlayfairDisplaySC-Regular'), url(/fonts/PlayfairDisplaySC.woff) format('woff');
}
@font-face {
    font-family: 'Open Sans';
    font-weight: 400;
    font-style: normal;
    src: local('Open Sans'), local('OpenSans'), url(/fonts/OpenSans.woff) format('woff');
}
body {
    background-color: #191E1E;
    font-family: 'Helvetica Neue', Helvetica, Arial, Tahoma, Verdana, sans-serif;
    text-align: left;
    color: #000000;
    margin: 0;
}
html {
    overflow-x: hidden;
}
body.preload * {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
}
a { text-decoration: none; color: inherit; }
div.nav {
    position: fixed;
    z-index: 9998;
    top: 0px; left: 0px;
    width: 100%;
    cursor: default;
    color: #A0522D;
    background-color: #800000;
    font-family: 'Playfair Display SC', 'Times New Roman';
    font-size: 1em;
    line-height: 3.0em;
    padding-top: 5px;
    -webkit-box-shadow: 0px 0px 5px 5px #800000;
    box-shadow:  0px 0px 5px 5px #800000;
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=180, Color='#800000');
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=180, Color='#800000')";
}
div.nav a#nav-home {
    font-size: 1.2em;
    height: 1.0em;
}
div.nav a {
    display: inherit;
    padding: 0 1.1em;
    color: #C0724D;
    text-shadow: 1px 0px 0px rgba(0, 0, 0, 0.2), 0px 1px 0px rgba(0, 0, 0, 0.3);
    transition: text-shadow 1.1s, filter 1.1s, color 1.1s;
    -moz-transition: text-shadow 1.1s linear, filter 1.1s linear, color 1.1s linear;
    -webkit-transition: text-shadow 1.1s, filter 1.1s, color 1.1s;
}
div.nav a:hover {
    transition: text-shadow 0.4s, filter 0.4s, color 0.4s;
    -moz-transition: text-shadow 0.4s linear, filter 0.4s linear, color 0.4s linear;
    -webkit-transition: text-shadow 0.4s, filter 0.4s, color 0.4s;
    color: #F0A27D;
    text-shadow: 1px 0px 0px rgba(0, 0, 0, 0.1), 0px 1px 0px rgba(0, 0, 0, 0.2);
    filter: glow(color=#F0B29D, strength=5);
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Color='#F0B29D', Strength=5)";
    text-shadow: 0 0 0.5em rgba(196, 180, 143, 1.0), #D0825D 0 0 0.5em, #B0422D 0 0 0.5em;
}
div.nav div.links {
    float: left;
    display: inline;
    white-space: nowrap;
}
div.nav div.controls {
    position: absolute;
    top: 0px; right: 0px;
    padding-top: 0.3em;
    white-space: nowrap;
}
div.nav div.controls a#nav-menu {
    margin: 0 0.3em 0;
}
div.nav div.controls a#nav-menu:hover,
div.nav div.menu a.menuitem:hover {
    cursor: pointer;
}
div.nav div.controls a#nav-menu span {
    font-family: 'Helvetica Neue', Helvetica, Arial, Tahoma, Verdana, sans-serif;
}
div.menu {
    display: none;
    position: fixed;
    top: 3.5em; right: 0px;
    width: 200px;
    font-family: 'Playfair Display SC', 'Times New Roman';
    font-weight: 180;
    color: #A0522D;
    background-color: rgba(140, 0, 0, 0.8); /*rgba(99, 0, 3, 1.0);*/
    text-align: center;
    border: 0.04em solid #A0522D;
}
div.nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
div.nav ul li a {
    cursor: pointer;
}
div.nav ul li.link {
    float: left;
}
div.nav ul li.control {
    float: right;
}
div.menu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
div.menu ul li a {
    display: block;
    cursor: pointer;
    padding: 1em;
}
div.menu ul li {
    border-bottom: 1px solid #A0522D;
}
div.menu ul li:last-child {
    border-bottom: none;
    margin-bottom: 0px;
}
div#music {
    position: fixed;
    top: 0px; left: 0px;
}
form.input {
    width: 100%;
}
table {
    border: 0px;
    border-spacing: 0px;
    margin-right: 1em;
}
td, th {
    padding: 0px;
}
input,input[type=text],input[type=email],input[type=password] {
    border: none;
    float: right;
    width: 100%;
    outline-width: 0px;
    outline-style: none;
    font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, Tahoma, Verdana, sans-serif;
    font-weight: 200;
    letter-spacing: 0.05em;
    font-size: 1em;
    height: inherit;
    line-height: normal;
    padding: 0px;
    margin-top: -1px;
    margin-left: 0px;
    color: #99aaaa;
    background-color: #191E1E;
    overflow: hidden;
}
input.password {
    display: none;
}
div.input label {
    font-size: 1em;
    font-weight: normal;
    line-height: normal;
    white-space: nowrap;
}
label.password {
    display: none;
}
input[type=text]:hover,input[type=email]:hover,input[type=password]:hover {
    background-color: #191E1E;
}
input[type=text]:focus,input[type=email]:focus,input[type=password]:focus {
    background-color: #191E1E;
}
div.display {
    margin: 0 1em;
    font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, Tahoma, Verdana, sans-serif;
    font-weight: 200;
    letter-spacing: 0.05em;
    font-size: 1.2em;
    line-height: 1.4em;
    color: #99aaaa;
    white-space: pre-line;
    word-wrap: break-word; /* IE 5+ */
    overflow: hidden;
}
div.space {
    padding-bottom: 5em;
}
a.display { text-decoration: none; color: dodgerblue; }
a.display:hover { text-decoration: underline; }
a.direction { cursor: pointer; }
div.markdown {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
div.markdown pre {
    border: 1px solid #494E4E;
    border-radius: 7px;
    background-color: #393E3E;
    padding: 1em;
    white-space: pre-wrap;
    word-wrap: break-word;
}
div.markdown a {
    color: dodgerblue;
    text-decoration: underline;
    text-decoration-color: dodgerblue;
}
.hidden {
    display: none;
}
object#ytplayer {
    position: absolute;
    top: -120px;
    right: 0px;
    height: 25px;
    width: 240px;
}

/* Non-Retina */
@media screen and (-webkit-max-device-pixel-ratio: 1) {
}

/* Retina */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5) {
}

/* Retina portrait */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5),
only screen and (orientation:portrait) {
}

/* Samsung Galaxy S4 Active portrait */
@media screen and (max-device-width: 360px) and (orientation:portrait) and (-webkit-min-device-pixel-ratio: 3) and (device-aspect-ratio: 9/16) {
    @-viewport {
        width: 320px;
    }
    div.space {
        padding-bottom: 5em;
    }
    div.menu {
        position: fixed;
        top: 3.6em; right: 0px;
        width: 30%;
    }
}

/* Samsung Galaxy S4 Active landscape */
@media screen and (max-device-width: 360px) and (orientation:landscape) and (-webkit-min-device-pixel-ratio: 3) and (device-aspect-ratio: 9/16) {
    @-viewport {
        width: 320px;
    }
    div.nav {
        display: none;
    }
    div.space {
        padding-bottom: 1em;
    }
    div.menu {
        position: fixed;
        top: 3.6em; right: 0px;
        width: 30%;
    }
}

/* iPhone portrait */
@media screen and (max-device-width: 480px) and (orientation:portrait) {
    @-viewport {
        width: 320px;
    }
} 

/* iPhone landscape */
@media screen and (max-device-width: 480px) and (orientation:landscape) {
}

/* iPad portrait */
@media screen and (min-device-width: 481px) and (orientation:portrait) {
    @-viewport {
        width: 320px;
    }
}

/* iPad landscape */
@media screen and (min-device-width: 481px) and (orientation:landscape) {
}

@media (max-width: 699px) and (min-width: 520px) {
    @-viewport {
        width: 320px;
    }
}

@media (max-width: 519px) and (min-width: 320px) {
    @-viewport {
        width: 320px;
    }
}

/* Medium screens */
@media screen and (min-width: 980px) {
    @-viewport {
        width: 320px;
    }
}

/* Very large screens */
@media screen and (min-width: 1824px) {
    @-viewport {
        width: 320px;
    }
}