@charset “UTF-8”;
//fonts @font-face {
font-family: 'aqua_grotesqueregular'; src: url('../assets/fonts/aqua/aqua-webfont.woff2') format('woff2'), url('../assets/fonts/aqua/aqua-webfont.woff') format('woff'); font-weight: normal; font-style: normal;
}
@font-face {
font-family: 'bikoregular'; src: url('../assets/fonts/biko/biko_regular-webfont.woff2') format('woff2'), url('../assets/fonts/biko/biko_regular-webfont.woff') format('woff'); font-weight: normal; font-style: normal;
}
@font-face {
font-family: 'chaseregular'; src: url('../assets/fonts/chase/chase-webfont.woff2') format('woff2'), url('../assets/fonts/chase/chase-webfont.woff') format('woff'); font-weight: normal; font-style: normal;
}
@font-face {
font-family: 'simplificasimplifica'; src: url('../assets/fonts/simplifica_typeface-webfont.woff2') format('woff2'), url('../assets/fonts/simplifica_typeface-webfont.woff') format('woff'); font-weight: normal; font-style: normal;
}
//variables
//font related $base-font-family: Calibri, Helvetica, Arial, sans-serif; $navigation: aqua_grotesqueregular, serif; $headlines: chaseregular, serif; $base-font-size: 1em; $big-font-size: $base-font-size * 2; $small-font-size: $base-font-size * 0.8;
//space related $center: 0 auto; $base-spacing: 1em; $base-sizing: 5em; $border-width: 0.3em;
//background related $grey-color: #828282; $grey-color-light: lighten($grey-color, 40%);
// Width of the content area $content-width: 1000px; $tablet-width: 600px; $small-laptop-width: 1100px; $phone-width: 404px;
//mixins @mixin laptop {
@media screen and (max-width: $small-laptop-width) { @content; }
}
@mixin small-laptop {
@media screen and (max-width: 845px) { @content; }
}
@mixin tablet {
@media screen and (max-width: $tablet-width) { @content; }
}
@mixin phone {
@media screen and (max-width: $phone-width) { @content; }
}
@import '_reset';
//main stuff html, body {
height: 100%; font-size: $base-font-size; font-family: $base-font-family; text-align: justify; background-color: $grey-color-light; background-image: url($background-image);
}
.wrapper {
min-height: 100%; position: relative;
}
.content-wrapper {
max-width: $content-width; margin: $center; padding-bottom: $base-sizing; overflow: auto;
}
//headlines h1 {
font-size: $big-font-size * 2; font-family: bikoregular, serif;
}
h2 {
font-family: $headlines; font-size: $big-font-size;
}
h3, h4, h5 {
font-family: simplificasimplifica, serif; font-size: $base-font-size; margin: $base-spacing, 0;
}
//links ul {
li { display: inline-block; } a { display: inline-block; }
}
a:focus, a:hover, a:active {
font-weight: bold;
}
img {
max-width: 100%; height: auto;
}
@import '_headandfoot'; @import '_menu';