@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro");

@font-face {
    font-family:'icons';
    /*src:url("/font/icons.eot");*/
    src:url("../font/icons.woff") format("woff");
    font-weight:normal;
    font-style:normal;
}

html,body {
    height: 100%;
}

body {
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 16pt;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.175em;
    background-color: #242424;
}

a {
    color: #fff;
    text-decoration: none;
    -moz-transition: background-color 0.25s ease-in-out, color 0.25s ease-in-out;
    -webkit-transition: background-color 0.25s ease-in-out, color 0.25s ease-in-out;
    -o-transition: background-color 0.25s ease-in-out, color 0.25s ease-in-out;
    -ms-transition: background-color 0.25s ease-in-out, color 0.25s ease-in-out;
    transition: background-color 0.25s ease-in-out, color 0.25s ease-in-out;
}

h1,h2,h3,h4,h5,h6 {
    text-transform: uppercase;
    letter-spacing: 0.25em;
    margin: 0 0 2em 0;
}

hr {
    position: relative;
    border: 0;
    display: block;
    width: 100%;
    height: 2.5em;
    border-top: solid 1px rgba(255,255,255,0.125);
    margin-top: 2.5em;
}

hr:before,hr:after {
    content: '';
    height: 9px;
    width: 1px;
    background: rgba(255,255,255,0.125);
    position: absolute;
    top: -5px;
}

hr:before {
    left: -1px;
}

hr:after {
    right: -1px;
}

p {
    margin: 0 0 2em 0;
    text-transform: none;
}

.avatar{
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: url('../img/avatar.jpg');
    background-size: cover;
    position: relative;
    margin-bottom: 8px;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 1px 2px rgba(0,0,0,0.62);
    border: solid white 2px;
    width: 200px;
    height: 200px;
}

.button {
    display: inline-block;
    border-radius: 6px;
    line-height: 2.75em;
    text-indent: 0.125em;
    border: solid 1px #fff;
    padding: 0 1.5em;
}

.button:hover {
    background-color: rgba(255,255,255,0.075);
}

.icon {
    text-decoration: none;
}

.icon:before {
    font-family: 'icons';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon>span {
    display: none;
}

/** icons **/
.icon-address-book:before { content: "\f100"; }
.icon-alert:before { content: "\f101"; }
.icon-align-center:before { content: "\f102"; }
.icon-align-justify:before { content: "\f103"; }
.icon-align-left:before { content: "\f104"; }
.icon-align-right:before { content: "\f105"; }
.icon-anchor:before { content: "\f106"; }
.icon-annotate:before { content: "\f107"; }
.icon-archive:before { content: "\f108"; }
.icon-arrow-down:before { content: "\f109"; }
.icon-arrow-left:before { content: "\f10a"; }
.icon-arrow-right:before { content: "\f10b"; }
.icon-arrow-up:before { content: "\f10c"; }
.icon-arrows-compress:before { content: "\f10d"; }
.icon-arrows-expand:before { content: "\f10e"; }
.icon-arrows-in:before { content: "\f10f"; }
.icon-arrows-out:before { content: "\f110"; }
.icon-asl:before { content: "\f111"; }
.icon-asterisk:before { content: "\f112"; }
.icon-at-sign:before { content: "\f113"; }
.icon-background-color:before { content: "\f114"; }
.icon-battery-empty:before { content: "\f115"; }
.icon-battery-full:before { content: "\f116"; }
.icon-battery-half:before { content: "\f117"; }
.icon-bitcoin-circle:before { content: "\f118"; }
.icon-bitcoin:before { content: "\f119"; }
.icon-blind:before { content: "\f11a"; }
.icon-bluetooth:before { content: "\f11b"; }
.icon-bold:before { content: "\f11c"; }
.icon-book-bookmark:before { content: "\f11d"; }
.icon-book:before { content: "\f11e"; }
.icon-bookmark:before { content: "\f11f"; }
.icon-braille:before { content: "\f120"; }
.icon-burst-new:before { content: "\f121"; }
.icon-burst-sale:before { content: "\f122"; }
.icon-burst:before { content: "\f123"; }
.icon-calendar:before { content: "\f124"; }
.icon-camera:before { content: "\f125"; }
.icon-check:before { content: "\f126"; }
.icon-checkbox:before { content: "\f127"; }
.icon-clipboard-notes:before { content: "\f128"; }
.icon-clipboard-pencil:before { content: "\f129"; }
.icon-clipboard:before { content: "\f12a"; }
.icon-clock:before { content: "\f12b"; }
.icon-closed-caption:before { content: "\f12c"; }
.icon-cloud:before { content: "\f12d"; }
.icon-comment-minus:before { content: "\f12e"; }
.icon-comment-quotes:before { content: "\f12f"; }
.icon-comment-video:before { content: "\f130"; }
.icon-comment:before { content: "\f131"; }
.icon-comments:before { content: "\f132"; }
.icon-compass:before { content: "\f133"; }
.icon-contrast:before { content: "\f134"; }
.icon-credit-card:before { content: "\f135"; }
.icon-crop:before { content: "\f136"; }
.icon-crown:before { content: "\f137"; }
.icon-css3:before { content: "\f138"; }
.icon-database:before { content: "\f139"; }
.icon-die-five:before { content: "\f13a"; }
.icon-die-four:before { content: "\f13b"; }
.icon-die-one:before { content: "\f13c"; }
.icon-die-six:before { content: "\f13d"; }
.icon-die-three:before { content: "\f13e"; }
.icon-die-two:before { content: "\f13f"; }
.icon-dislike:before { content: "\f140"; }
.icon-dollar-bill:before { content: "\f141"; }
.icon-dollar:before { content: "\f142"; }
.icon-download:before { content: "\f143"; }
.icon-eject:before { content: "\f144"; }
.icon-elevator:before { content: "\f145"; }
.icon-euro:before { content: "\f146"; }
.icon-eye:before { content: "\f147"; }
.icon-fast-forward:before { content: "\f148"; }
.icon-female-symbol:before { content: "\f149"; }
.icon-female:before { content: "\f14a"; }
.icon-filter:before { content: "\f14b"; }
.icon-first-aid:before { content: "\f14c"; }
.icon-flag:before { content: "\f14d"; }
.icon-folder-add:before { content: "\f14e"; }
.icon-folder-lock:before { content: "\f14f"; }
.icon-folder:before { content: "\f150"; }
.icon-foot:before { content: "\f151"; }
.icon-foundation:before { content: "\f152"; }
.icon-graph-bar:before { content: "\f153"; }
.icon-graph-horizontal:before { content: "\f154"; }
.icon-graph-pie:before { content: "\f155"; }
.icon-graph-trend:before { content: "\f156"; }
.icon-guide-dog:before { content: "\f157"; }
.icon-hearing-aid:before { content: "\f158"; }
.icon-heart:before { content: "\f159"; }
.icon-home:before { content: "\f15a"; }
.icon-html5:before { content: "\f15b"; }
.icon-indent-less:before { content: "\f15c"; }
.icon-indent-more:before { content: "\f15d"; }
.icon-info:before { content: "\f15e"; }
.icon-italic:before { content: "\f15f"; }
.icon-key:before { content: "\f160"; }
.icon-laptop:before { content: "\f161"; }
.icon-layout:before { content: "\f162"; }
.icon-lightbulb:before { content: "\f163"; }
.icon-like:before { content: "\f164"; }
.icon-link:before { content: "\f165"; }
.icon-list-bullet:before { content: "\f166"; }
.icon-list-number:before { content: "\f167"; }
.icon-list-thumbnails:before { content: "\f168"; }
.icon-list:before { content: "\f169"; }
.icon-lock:before { content: "\f16a"; }
.icon-loop:before { content: "\f16b"; }
.icon-magnifying-glass:before { content: "\f16c"; }
.icon-mail:before { content: "\f16d"; }
.icon-male-female:before { content: "\f16e"; }
.icon-male-symbol:before { content: "\f16f"; }
.icon-male:before { content: "\f170"; }
.icon-map:before { content: "\f171"; }
.icon-marker:before { content: "\f172"; }
.icon-megaphone:before { content: "\f173"; }
.icon-microphone:before { content: "\f174"; }
.icon-minus-circle:before { content: "\f175"; }
.icon-minus:before { content: "\f176"; }
.icon-mobile-signal:before { content: "\f177"; }
.icon-mobile:before { content: "\f178"; }
.icon-monitor:before { content: "\f179"; }
.icon-mountains:before { content: "\f17a"; }
.icon-music:before { content: "\f17b"; }
.icon-next:before { content: "\f17c"; }
.icon-no-dogs:before { content: "\f17d"; }
.icon-no-smoking:before { content: "\f17e"; }
.icon-page-add:before { content: "\f17f"; }
.icon-page-copy:before { content: "\f180"; }
.icon-page-csv:before { content: "\f181"; }
.icon-page-delete:before { content: "\f182"; }
.icon-page-doc:before { content: "\f183"; }
.icon-page-edit:before { content: "\f184"; }
.icon-page-export-csv:before { content: "\f185"; }
.icon-page-export-doc:before { content: "\f186"; }
.icon-page-export-pdf:before { content: "\f187"; }
.icon-page-export:before { content: "\f188"; }
.icon-page-filled:before { content: "\f189"; }
.icon-page-multiple:before { content: "\f18a"; }
.icon-page-pdf:before { content: "\f18b"; }
.icon-page-remove:before { content: "\f18c"; }
.icon-page-search:before { content: "\f18d"; }
.icon-page:before { content: "\f18e"; }
.icon-paint-bucket:before { content: "\f18f"; }
.icon-paperclip:before { content: "\f190"; }
.icon-pause:before { content: "\f191"; }
.icon-paw:before { content: "\f192"; }
.icon-paypal:before { content: "\f193"; }
.icon-pencil:before { content: "\f194"; }
.icon-photo:before { content: "\f195"; }
.icon-play-circle:before { content: "\f196"; }
.icon-play-video:before { content: "\f197"; }
.icon-play:before { content: "\f198"; }
.icon-plus:before { content: "\f199"; }
.icon-pound:before { content: "\f19a"; }
.icon-power:before { content: "\f19b"; }
.icon-previous:before { content: "\f19c"; }
.icon-price-tag:before { content: "\f19d"; }
.icon-pricetag-multiple:before { content: "\f19e"; }
.icon-print:before { content: "\f19f"; }
.icon-prohibited:before { content: "\f1a0"; }
.icon-projection-screen:before { content: "\f1a1"; }
.icon-puzzle:before { content: "\f1a2"; }
.icon-quote:before { content: "\f1a3"; }
.icon-record:before { content: "\f1a4"; }
.icon-refresh:before { content: "\f1a5"; }
.icon-results-demographics:before { content: "\f1a6"; }
.icon-results:before { content: "\f1a7"; }
.icon-rewind-ten:before { content: "\f1a8"; }
.icon-rewind:before { content: "\f1a9"; }
.icon-rss:before { content: "\f1aa"; }
.icon-safety-cone:before { content: "\f1ab"; }
.icon-save:before { content: "\f1ac"; }
.icon-share:before { content: "\f1ad"; }
.icon-sheriff-badge:before { content: "\f1ae"; }
.icon-shield:before { content: "\f1af"; }
.icon-shopping-bag:before { content: "\f1b0"; }
.icon-shopping-cart:before { content: "\f1b1"; }
.icon-shuffle:before { content: "\f1b2"; }
.icon-skull:before { content: "\f1b3"; }
.icon-social-500px:before { content: "\f1b4"; }
.icon-social-adobe:before { content: "\f1b5"; }
.icon-social-amazon:before { content: "\f1b6"; }
.icon-social-android:before { content: "\f1b7"; }
.icon-social-apple:before { content: "\f1b8"; }
.icon-social-behance:before { content: "\f1b9"; }
.icon-social-bing:before { content: "\f1ba"; }
.icon-social-blogger:before { content: "\f1bb"; }
.icon-social-delicious:before { content: "\f1bc"; }
.icon-social-designer-news:before { content: "\f1bd"; }
.icon-social-deviant-art:before { content: "\f1be"; }
.icon-social-digg:before { content: "\f1bf"; }
.icon-social-dribbble:before { content: "\f1c0"; }
.icon-social-drive:before { content: "\f1c1"; }
.icon-social-dropbox:before { content: "\f1c2"; }
.icon-social-evernote:before { content: "\f1c3"; }
.icon-social-facebook:before { content: "\f1c4"; }
.icon-social-flickr:before { content: "\f1c5"; }
.icon-social-forrst:before { content: "\f1c6"; }
.icon-social-foursquare:before { content: "\f1c7"; }
.icon-social-game-center:before { content: "\f1c8"; }
.icon-social-github:before { content: "\f1c9"; }
.icon-social-google-plus:before { content: "\f1ca"; }
.icon-social-hacker-news:before { content: "\f1cb"; }
.icon-social-hi5:before { content: "\f1cc"; }
.icon-social-instagram:before { content: "\f1cd"; }
.icon-social-joomla:before { content: "\f1ce"; }
.icon-social-lastfm:before { content: "\f1cf"; }
.icon-social-linkedin:before { content: "\f1d0"; }
.icon-social-medium:before { content: "\f1d1"; }
.icon-social-myspace:before { content: "\f1d2"; }
.icon-social-orkut:before { content: "\f1d3"; }
.icon-social-path:before { content: "\f1d4"; }
.icon-social-picasa:before { content: "\f1d5"; }
.icon-social-pinterest:before { content: "\f1d6"; }
.icon-social-rdio:before { content: "\f1d7"; }
.icon-social-reddit:before { content: "\f1d8"; }
.icon-social-skillshare:before { content: "\f1d9"; }
.icon-social-skype:before { content: "\f1da"; }
.icon-social-smashing-mag:before { content: "\f1db"; }
.icon-social-snapchat:before { content: "\f1dc"; }
.icon-social-spotify:before { content: "\f1dd"; }
.icon-social-squidoo:before { content: "\f1de"; }
.icon-social-stack-overflow:before { content: "\f1df"; }
.icon-social-steam:before { content: "\f1e0"; }
.icon-social-stumbleupon:before { content: "\f1e1"; }
.icon-social-treehouse:before { content: "\f1e2"; }
.icon-social-tumblr:before { content: "\f1e3"; }
.icon-social-twitter:before { content: "\f1e4"; }
.icon-social-vimeo:before { content: "\f1e5"; }
.icon-social-windows:before { content: "\f1e6"; }
.icon-social-xbox:before { content: "\f1e7"; }
.icon-social-yahoo:before { content: "\f1e8"; }
.icon-social-yelp:before { content: "\f1e9"; }
.icon-social-youtube:before { content: "\f1ea"; }
.icon-social-zerply:before { content: "\f1eb"; }
.icon-social-zurb:before { content: "\f1ec"; }
.icon-sound:before { content: "\f1ed"; }
.icon-star:before { content: "\f1ee"; }
.icon-stop:before { content: "\f1ef"; }
.icon-strikethrough:before { content: "\f1f0"; }
.icon-subscript:before { content: "\f1f1"; }
.icon-superscript:before { content: "\f1f2"; }
.icon-tablet-landscape:before { content: "\f1f3"; }
.icon-tablet-portrait:before { content: "\f1f4"; }
.icon-target-two:before { content: "\f1f5"; }
.icon-target:before { content: "\f1f6"; }
.icon-telephone-accessible:before { content: "\f1f7"; }
.icon-telephone:before { content: "\f1f8"; }
.icon-text-color:before { content: "\f1f9"; }
.icon-thumbnails:before { content: "\f1fa"; }
.icon-ticket:before { content: "\f1fb"; }
.icon-torso-business:before { content: "\f1fc"; }
.icon-torso-female:before { content: "\f1fd"; }
.icon-torso:before { content: "\f1fe"; }
.icon-torsos-all-female:before { content: "\f1ff"; }
.icon-torsos-all:before { content: "\f200"; }
.icon-torsos-female-male:before { content: "\f201"; }
.icon-torsos-male-female:before { content: "\f202"; }
.icon-torsos:before { content: "\f203"; }
.icon-trash:before { content: "\f204"; }
.icon-trees:before { content: "\f205"; }
.icon-trophy:before { content: "\f206"; }
.icon-underline:before { content: "\f207"; }
.icon-universal-access:before { content: "\f208"; }
.icon-unlink:before { content: "\f209"; }
.icon-unlock:before { content: "\f20a"; }
.icon-upload-cloud:before { content: "\f20b"; }
.icon-upload:before { content: "\f20c"; }
.icon-usb:before { content: "\f20d"; }
.icon-video:before { content: "\f20e"; }
.icon-volume-none:before { content: "\f20f"; }
.icon-volume-strike:before { content: "\f210"; }
.icon-volume:before { content: "\f211"; }
.icon-web:before { content: "\f212"; }
.icon-wheelchair:before { content: "\f213"; }
.icon-widget:before { content: "\f214"; }
.icon-wrench:before { content: "\f215"; }
.icon-x-circle:before { content: "\f216"; }
.icon-x:before { content: "\f217"; }
.icon-yen:before { content: "\f218"; }
.icon-zoom-in:before { content: "\f219"; }
.icon-zoom-out:before { content: "\f21a"; }
/**********/
ul.actions li {
    display: inline-block;
}

ul.icons {
    cursor: default;
}

ul.icons li {
    display: inline-block;
    font-size: 1.75em;
    margin: 0 0.1em;
}

ul.icons li a {
    width: 1.85em;
    height: 1.85em;
    line-height: 2em;
    letter-spacing: 0;
    display: inline-block;
    border-radius: 100%;
}

ul.icons li a:focus {
    outline:0;
}

ul.icons li a:hover {
    background-color: rgba(255,255,255,0.075);
}

ul.links li {
    display: inline-block;
    line-height: 2.5em;
    text-transform: none;
}

ul.links li .icon {
    font-size: 1.35em;
    line-height: 1.85em;
    padding: 0 0.85em;
    text-indent: 0;
}

ul.links li .icon:before {
    position: relative;
    top: 0.1em;
    left: 0.125em;
}

ul.links li a {
    display: inline-block;
    padding: 0 1em;
    border-radius: 6px;
    line-height: 2.5em;
    text-indent: 0.125em;
}

ul.links li a:hover {
    background-color: rgba(255,255,255,0.075);
}

#footer {
    padding: 2em 0;
    font-size: 0.8em;
    color: rgba(255,255,255,0.5);
}

@-moz-keyframes x-in {
    0% {
        opacity: 0;
        -moz-transform: scale(1.1);
        -webkit-transform: scale(1.1);
        -o-transform: scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        opacity: 1;
        -moz-transform: scale(1);
        -webkit-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes x-in {
    0% {
        opacity: 0;
        -moz-transform: scale(1.1);
        -webkit-transform: scale(1.1);
        -o-transform: scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        opacity: 1;
        -moz-transform: scale(1);
        -webkit-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@-o-keyframes x-in {
    0% {
        opacity: 0;
        -moz-transform: scale(1.1);
        -webkit-transform: scale(1.1);
        -o-transform: scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        opacity: 1;
        -moz-transform: scale(1);
        -webkit-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@-ms-keyframes x-in {
    0% {
        opacity: 0;
        -moz-transform: scale(1.1);
        -webkit-transform: scale(1.1);
        -o-transform: scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        opacity: 1;
        -moz-transform: scale(1);
        -webkit-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes x-in {
    0% {
        opacity: 0;
        -moz-transform: scale(1.1);
        -webkit-transform: scale(1.1);
        -o-transform: scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        opacity: 1;
        -moz-transform: scale(1);
        -webkit-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@-moz-keyframes y-in {
    0% {
        opacity: 0;
        -moz-transform: scale(0.9);
        -webkit-transform: scale(0.9);
        -o-transform: scale(0.9);
        -ms-transform: scale(0.9);
        transform: scale(0.9);
    }

    100% {
        opacity: 1;
        -moz-transform: scale(1);
        -webkit-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes y-in {
    0% {
        opacity: 0;
        -moz-transform: scale(0.9);
        -webkit-transform: scale(0.9);
        -o-transform: scale(0.9);
        -ms-transform: scale(0.9);
        transform: scale(0.9);
    }

    100% {
        opacity: 1;
        -moz-transform: scale(1);
        -webkit-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@-o-keyframes y-in {
    0% {
        opacity: 0;
        -moz-transform: scale(0.9);
        -webkit-transform: scale(0.9);
        -o-transform: scale(0.9);
        -ms-transform: scale(0.9);
        transform: scale(0.9);
    }

    100% {
        opacity: 1;
        -moz-transform: scale(1);
        -webkit-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@-ms-keyframes y-in {
    0% {
        opacity: 0;
        -moz-transform: scale(0.9);
        -webkit-transform: scale(0.9);
        -o-transform: scale(0.9);
        -ms-transform: scale(0.9);
        transform: scale(0.9);
    }

    100% {
        opacity: 1;
        -moz-transform: scale(1);
        -webkit-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes y-in {
    0% {
        opacity: 0;
        -moz-transform: scale(0.9);
        -webkit-transform: scale(0.9);
        -o-transform: scale(0.9);
        -ms-transform: scale(0.9);
        transform: scale(0.9);
    }

    100% {
        opacity: 1;
        -moz-transform: scale(1);
        -webkit-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@-moz-keyframes z-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes z-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes z-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-ms-keyframes z-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes z-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes bg-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes bg-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes bg-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-ms-keyframes bg-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes bg-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

body.landing {
    background-color: #242424;
    text-align: center;
}

body.landing:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

body.landing #bg {
    -moz-animation: bg-in 3s;
    -webkit-animation: bg-in 3s;
    -o-animation: bg-in 3s;
    -ms-animation: bg-in 3s;
    animation: bg-in 3s;
    -moz-animation-delay: 2s;
    -webkit-animation-delay: 2s;
    -o-animation-delay: 2s;
    -ms-animation-delay: 2s;
    animation-delay: 2s;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    background-image: url("../img/background.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    height: calc(100% + 20px);
    left: -10px;
    opacity: 0;
    position: fixed;
    top: -10px;
    width: calc(100% + 20px);
}

body.landing.is-touch {
    background-image: url("https://nstanke.at/background");
    background-size: cover;
    background-repeat: no-repeat;
}

body.landing.is-touch #bg {
    display: none;
}

body.landing #wrapper {
    cursor: default;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    width: 35em;
    z-index: 2;
}

body.landing #wrapper header h1 {
    text-decoration: none;
    -moz-animation: y-in 0.75s;
    -webkit-animation: y-in 0.75s;
    -o-animation: y-in 0.75s;
    -ms-animation: y-in 0.75s;
    animation: y-in 0.75s;
    -moz-animation-delay: 0.25s;
    -webkit-animation-delay: 0.25s;
    -o-animation-delay: 0.25s;
    -ms-animation-delay: 0.25s;
    animation-delay: 0.25s;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    font-size: 5em;
    left: 0;
    letter-spacing: 0;
    margin: 0;
    opacity: 0;
    position: relative;
    top: 0;
}

body.landing #wrapper header h1:before {
    content: "";
    font-family: 'icons';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body.landing #wrapper header h1>span {
    display: none;
}

body.landing #wrapper header h1>span {
    display: none;
}

body.landing #wrapper header p {
    -moz-animation: x-in 0.75s;
    -webkit-animation: x-in 0.75s;
    -o-animation: x-in 0.75s;
    -ms-animation: x-in 0.75s;
    animation: x-in 0.75s;
    -moz-animation-delay: 1s;
    -webkit-animation-delay: 1s;
    -o-animation-delay: 1s;
    -ms-animation-delay: 1s;
    animation-delay: 1s;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    font-size: 1em;
    left: 0;
    line-height: 2em;
    margin: 2em 0;
    opacity: 0;
    position: relative;
    top: 0;
}

body.landing #wrapper .icons {
    -moz-animation: x-in 0.75s;
    -webkit-animation: x-in 0.75s;
    -o-animation: x-in 0.75s;
    -ms-animation: x-in 0.75s;
    animation: x-in 0.75s;
    -moz-animation-delay: 1.125s;
    -webkit-animation-delay: 1.125s;
    -o-animation-delay: 1.125s;
    -ms-animation-delay: 1.125s;
    animation-delay: 1.125s;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    left: 0;
    opacity: 0;
    position: relative;
    top: 0;
}

body.landing #wrapper hr {
    -moz-animation: x-in 0.75s;
    -webkit-animation: x-in 0.75s;
    -o-animation: x-in 0.75s;
    -ms-animation: x-in 0.75s;
    animation: x-in 0.75s;
    -moz-animation-delay: 1.25s;
    -webkit-animation-delay: 1.25s;
    -o-animation-delay: 1.25s;
    -ms-animation-delay: 1.25s;
    animation-delay: 1.25s;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    left: 0;
    opacity: 0;
    position: relative;
    top: 0;
}

body.landing #wrapper .links {
    -moz-animation: x-in 0.5s;
    -webkit-animation: x-in 0.5s;
    -o-animation: x-in 0.5s;
    -ms-animation: x-in 0.5s;
    animation: x-in 0.5s;
    -moz-animation-delay: 1.375s;
    -webkit-animation-delay: 1.375s;
    -o-animation-delay: 1.375s;
    -ms-animation-delay: 1.375s;
    animation-delay: 1.375s;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    left: 0;
    margin: 0 auto;
    opacity: 0;
    position: relative;
    top: 0;
    width: 75%;
}

body.landing #wrapper .links a:not(.icon) {
    font-size: 0.8em;
}

body.landing #footer {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 1;
    text-align: center;
    width: 100%;
    opacity: 0;
    -moz-animation: z-in 3s;
    -webkit-animation: z-in 3s;
    -o-animation: z-in 3s;
    -ms-animation: z-in 3s;
    animation: z-in 3s;
    -moz-animation-delay: 2s;
    -webkit-animation-delay: 2s;
    -o-animation-delay: 2s;
    -ms-animation-delay: 2s;
    animation-delay: 2s;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

body.modal {
    text-align: center;
}

body.modal:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

body.modal #wrapper {
    cursor: default;
    display: inline-block;
    position: relative;
    vertical-align: middle;
}

body.modal #footer {
    position: absolute;
    left: 0;
    bottom: 0;
    text-align: center;
    width: 100%;
}