body{margin:0;padding:0;background-color:black;}
#home {background: url(../images/home.jpg) 50% 0 no-repeat fixed;height: 1000px;  margin: 0 auto; width: 100%; max-width: 1920px; position: relative;}
#about {background-color:#B998C5;height: auto;margin: 0 auto; width: 100%; max-width: 1920px; position: relative;}
#away {background: url(../images/about.jpg) 50% 0 no-repeat fixed;height: 1000px;margin: 0 auto;width: 100%;max-width: 1920px;position: relative;}
#home article { text-align:center; float:left;margin:0 auto;width: 100%; color:white;font:bold 16px "museo-slab", sans-serif;font-family: "brandon-grotesque",sans-serif;}
#home p { font-size:150px;}
#about article {  max-width:900px;padding:90px 30px;height:auto;margin:0 auto;color:white;font:100 20px/36px "museo-slab",sans-serif;}
#about a:link, #about a:visited, footer a:link, footer a:visited {color:#fff;transition: all 0.5s ease;text-decoration: none;border-bottom:1px solid white;}
#about a:hover, #about a:active, footer a:hover, footer a:active {opacity:.5;}
#away article {text-indent: -9999px;}
footer{position:absolute;bottom:20px;right:20px;}
footer p{font:100 12px/12px "museo-slab", sans-serif;color:white;}
.arrow {display:block;animation: zing 2s infinite;-webkit-animation: zing 2s infinite; margin-top:400px;margin-left:0;/* Safari and Chrome */}
@keyframes zing
{0%   {opacity: .2;}
50%   {opacity: 1;}
100% {opacity: .2;}}
@-webkit-keyframes zing /* Safari and Chrome */
{0%   {opacity: .2;}
50%   {opacity: 1;}
100% {opacity: .2;}}

/* media queries for handheld
-------------------------------------------------*/
@media only screen and (max-width: 500px) {
    #home article, #away article {display:none;}
    #home {background: url(../images/m-home.jpg);height:100px;float:left;display:inline;}
    #about {float:left;diaplay:inline;font-size:24px;}
    #away {background: url(../images/m-about.jpg);height:100px;float:left;display:inline;}
}