@charset "utf-8";
body{ font-family: 'Bubbler One', sans-serif; font-weight: lighter; font-size: medium; }
h1 { color: #000000; text-align: center; font-size: x-large; }
#container { margin-right: auto; margin-left: auto; -webkit-box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.5); box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.5); text-align: center;}
#footer { text-align: center; margin-right: auto; margin-left: auto; margin-top: 1em; }
#footer {letter-spacing: 0.06em;}
#footer a{ text-decoration: none; color: #000; background-color: rgb(235,235,235); padding-right: 0.3em; padding-left: 0.3em; }
#footer a:hover{ color: #FFF; background-color: rgb(186,186,186); }
@media screen and (min-width: 980px) 
{#container { height:640px; max-width:1024px;margin-right:auto; margin-left:auto; }}
@media screen and (min-width: 769px) and (max-width: 979px) 
{#container { height:600px; width:100%; }}
@media screen and (min-width: 481px) and (max-width: 768px)
{#container { height:500px; width:100%; }}
@media screen and (min-width: 321px) and (max-width: 480px) 
{#container { height:400px; width:100%; }
h1 { color: #000000; text-align: center; border-top: thin solid #52BF9D; padding: 0px; margin-top: 0px; margin-bottom: 10px; font-size: large; }
#footer { text-align: center; margin-right: auto; margin-left: auto; margin-top: 10px; }}
@media screen and (max-width: 320px) 
{#container { height:300px; width:100%; }
h1 { color: #000000; text-align: center; border-top: thin solid #52BF9D; padding: 0px; margin-top: 0px; margin-bottom: 10px; font-size: large; }
#footer { text-align: center; margin-right: auto; margin-left: auto; margin-top: 10px; }}
