2020-10-21 20:52:40 +02:00
|
|
|
/* You can add global styles to this file, and also import other style files */
|
2020-10-21 22:15:34 +02:00
|
|
|
|
2020-10-26 10:29:22 +01:00
|
|
|
//@import url('https://fonts.googleapis.com/css2?family=Raleway&family=Reenie+Beanie&family=Staatliches&display=swap');
|
|
|
|
@import './_variables.scss';
|
|
|
|
|
|
|
|
@font-face{
|
|
|
|
font-family:"Swiss Bold";
|
|
|
|
src:url('assets/font/swissboldcondensed.woff2');
|
|
|
|
}
|
|
|
|
|
|
|
|
@font-face{
|
|
|
|
font-family:"Swiss Light";
|
|
|
|
src:url('assets/font/swisslight.woff2');
|
|
|
|
}
|
2020-10-21 22:15:34 +02:00
|
|
|
|
2020-10-26 11:24:35 +01:00
|
|
|
@font-face{
|
|
|
|
font-family:"Helvetica";
|
|
|
|
src:url('assets/font/HelvLight Regular.ttf');
|
|
|
|
}
|
|
|
|
|
|
|
|
@font-face {
|
|
|
|
font-family:"Helvetica Bold";
|
|
|
|
src:url('assets/font/HelveticaWorld-Bold.ttf');
|
|
|
|
}
|
|
|
|
|
|
|
|
@font-face{
|
|
|
|
font-family:"Frutiger";
|
|
|
|
src:url('assets/font/FrutigerLTStd-Cn.otf');
|
|
|
|
}
|
|
|
|
|
2020-10-21 22:15:34 +02:00
|
|
|
body {
|
|
|
|
margin:0;
|
|
|
|
padding:0;
|
2020-10-26 10:29:22 +01:00
|
|
|
background-color:$background-color;
|
|
|
|
cursor:crosshair;
|
2020-10-26 11:24:35 +01:00
|
|
|
font-family:"Frutiger";
|
2020-10-26 10:29:22 +01:00
|
|
|
}
|
|
|
|
|
2020-10-29 19:02:19 +01:00
|
|
|
*:focus{
|
|
|
|
outline: none;
|
|
|
|
}
|
|
|
|
|
2020-10-26 10:29:22 +01:00
|
|
|
h1 {
|
|
|
|
// font-family:"Staatliches",sans-serif;
|
|
|
|
text-transform:uppercase;
|
2020-10-26 11:24:35 +01:00
|
|
|
font-family:"Frutiger";
|
|
|
|
font-weight:100;
|
|
|
|
font-size:2vw;
|
|
|
|
// opacity:0.6;
|
2020-10-26 10:29:22 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
h2 {
|
|
|
|
font-size:3vw;
|
2020-10-26 11:24:35 +01:00
|
|
|
font-family:"Frutiger",serif;
|
|
|
|
}
|
|
|
|
|
|
|
|
h3 {
|
|
|
|
font-family:"Frutiger";
|
2020-10-26 10:29:22 +01:00
|
|
|
}
|
|
|
|
|
2020-10-29 19:02:19 +01:00
|
|
|
|
2020-10-26 10:29:22 +01:00
|
|
|
/* animations css */
|
|
|
|
|
|
|
|
@keyframes heartBeat {
|
|
|
|
0% {
|
|
|
|
transform: scale(none);
|
|
|
|
-webkit-transform: scale(none);
|
|
|
|
}
|
|
|
|
|
|
|
|
20% {
|
|
|
|
transform: scale(1.2);
|
|
|
|
-webkit-transform: scale(1.2);
|
|
|
|
}
|
|
|
|
|
|
|
|
30% {
|
|
|
|
transform: scale(1.05);
|
|
|
|
-webkit-transform: scale(1.05);
|
|
|
|
}
|
|
|
|
|
|
|
|
45% {
|
|
|
|
transform: scale(1.25);
|
|
|
|
-webkit-transform: scale(1.25);
|
|
|
|
}
|
|
|
|
|
|
|
|
50% {
|
|
|
|
transform: scale(none);
|
|
|
|
-webkit-transform: scale(none);
|
|
|
|
}
|
|
|
|
|
|
|
|
100% {
|
|
|
|
transform: scale(none);
|
|
|
|
-webkit-transform: scale(none);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@-webkit-keyframes heartBeat {
|
|
|
|
0% {
|
|
|
|
transform: scale(none);
|
|
|
|
-webkit-transform: scale(none);
|
|
|
|
}
|
|
|
|
|
|
|
|
20% {
|
|
|
|
transform: scale(1.2);
|
|
|
|
-webkit-transform: scale(1.2);
|
|
|
|
}
|
|
|
|
|
|
|
|
30% {
|
|
|
|
transform: scale(1.05);
|
|
|
|
-webkit-transform: scale(1.05);
|
|
|
|
}
|
|
|
|
|
|
|
|
45% {
|
|
|
|
transform: scale(1.25);
|
|
|
|
-webkit-transform: scale(1.25);
|
|
|
|
}
|
|
|
|
|
|
|
|
50% {
|
|
|
|
transform: scale(none);
|
|
|
|
-webkit-transform: scale(none);
|
|
|
|
}
|
|
|
|
|
|
|
|
100% {
|
|
|
|
transform: scale(none);
|
|
|
|
-webkit-transform: scale(none);
|
|
|
|
}
|
2020-10-21 22:15:34 +02:00
|
|
|
}
|