html, body, .container {
  height: 100%;
}
/*Reset*/
html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
  }
html, body, p, a, div, section {
  margin: 0;
  padding: 0;
  font-family: 'Roboto', Helvetica, sans-serif;
  font-size: 100%;
  color: #FFF;
  font: inherit;
}
/*basic style: min-1025 max-1440*/
h1 {margin: 0.5em 0;font-family: 'Finger Paint', cursive;color: #fff;line-height: 60px;font-size: 280%;font-weight: 100;text-shadow: 4px 4px 4px #aaa;}
#textblock blockquote {display: block;max-width: 25em;margin: 1.4em auto;padding: 0.1em 0.5em;background-color: rgba(0, 0, 0, 0.3);color: #fff;font-family: "Cantarell", sans-serif;font-weight: 300;line-height: 26px;font-size: 140%;}
.motto {font-family: 'Architects Daughter', cursive;font-weight: 100;text-align: right;font-size: 90%;font-style: italic;}
hr {margin-left: 30%;border: none;background-color: #eee;height: 1px;}
p {margin: 20px 0;}
/*Layout*/
.container {display: table;padding: 0px;width: 100%;}
.content {display: table-cell;padding: 0.8em 0 1.2em 0;vertical-align: top;text-align: center;}
.button {display: inline-block;margin: 0.4em 0 0;padding: 5px 30px;color: #fff;border-radius: 3px;font-family: 'Finger Paint', cursive;font-weight: 100;font-size: 160%;font-style: italic;text-decoration: none;text-align: center;background-color: #D37430;}
.button:hover,
.button:active {background-color: #5AA339;-webkit-transition: color 0.8s ease-in;transition: color 0.8s ease-in;}
* {margin: 0;padding: 0;}
* {-webkit-box-sizing: border-box;/*Sf, Chr*/-moz-box-sizing: border-box;/*Fx*/box-sizing: border-box; /*IE, Opera*/}
#menu {width: 16em;margin: 0 auto;text-align: center;}
ul {list-style:none;margin:0;padding:0;margin:0 auto;}
ul li label {background: #D37430;border-top: 0.1em solid #D37430;font-size: 120%;color: #FFF;text-shadow: 0 1px 1px #000;letter-spacing: 0.09em;background-color: rgba(0, 0, 0, 0.3);transition: all 0.8s ease;}
ul li label {display:block;padding:2px;}
ul li label:hover {
  background: #656565;
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#656565), to(#D37430));
  background: -webkit-linear-gradient(top, #656565, #D37430);
  background: -moz-linear-gradient(top, #656565, #D37430);
  background: -ms-linear-gradient(top, #656565, #D37430);
  background: -o-linear-gradient(top, #656565, #D37430);
}
ul li a {display:block;color:#FFF;text-decoration: none;}


@media only screen and (min-width: 90.063em) and (max-width: 120em) { 
/*min-1441 max-1920*/
h1 {margin: 0.6em 0;font-size: 320%;}
#textblock blockquote {margin: 1.0em auto;padding: 0.6em;font-size: 150%;}
.content {padding: 1.4em 0 1.0em 0;}
.button {margin: 0.5em 0 0.5em;font-size: 180%;}}
@media only screen and (min-width: 120.063em) { 
/*min-1921*/
h1 {margin: 0.6em 0;font-size: 320%;}
#textblock blockquote {margin: 1.0em auto;padding: 0.6em;font-size: 150%;}
.content {padding: 1.4em 0 1.0em 0;}
.button {margin: 0.5em 0 0.5em;font-size: 180%;}}