2022-06-08 00:38:13 +02:00
|
|
|
@font-face {
|
|
|
|
font-family: 'Nanum'; /*a name to be used later*/
|
|
|
|
src: url('/fonts/NanumGothic-Regular.ttf'); /*URL to font*/
|
|
|
|
}
|
|
|
|
|
|
|
|
* {
|
|
|
|
font-family: 'Nanum';
|
|
|
|
}
|
2022-06-12 13:50:06 +02:00
|
|
|
|
2022-06-12 19:27:57 +02:00
|
|
|
// Breakpoints
|
|
|
|
$bp-small: 48em; // 768px
|
|
|
|
$bp-medium: 64em; // 1024px
|
|
|
|
$bp-large: 85.375em; // 1366px
|
|
|
|
$bp-xlarge: 120em; // 1920px
|
|
|
|
$bp-xxlarge: 160em; // 2560px
|
2022-06-12 13:50:06 +02:00
|
|
|
|
2022-06-12 19:27:57 +02:00
|
|
|
// Media Queries
|
|
|
|
$mq-small: "(min-width: #{$bp-small})";
|
|
|
|
$mq-medium: "(min-width: #{$bp-medium})";
|
|
|
|
$mq-large: "(min-width: #{$bp-large})";
|
|
|
|
$mq-xlarge: "(min-width: #{$bp-xlarge})";
|
|
|
|
$mq-xxlarge: "(min-width: #{$bp-xxlarge})";
|
|
|
|
$mq-retina: "(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi)";
|
2022-06-12 13:50:06 +02:00
|
|
|
|
2022-06-12 19:27:57 +02:00
|
|
|
// Font-Size
|
|
|
|
$base-font-size: .8em;
|
2022-06-12 13:50:06 +02:00
|
|
|
|
2022-06-12 19:27:57 +02:00
|
|
|
// Line-Height
|
|
|
|
$base-line-height: 1.5;
|
|
|
|
$header-line-height: 1.25;
|
2022-06-12 13:50:06 +02:00
|
|
|
|
2022-06-12 19:27:57 +02:00
|
|
|
body {
|
|
|
|
font-size: $base-font-size;
|
|
|
|
line-height: $base-line-height;
|
|
|
|
|
|
|
|
@media #{$mq-medium} {
|
|
|
|
font-size: $base-font-size*1.2;
|
|
|
|
line-height: $base-line-height*1.2;
|
|
|
|
}
|
|
|
|
|
|
|
|
@media #{$mq-large} {
|
|
|
|
font-size: $base-font-size*1.3;
|
|
|
|
}
|
|
|
|
|
|
|
|
@media #{$mq-xlarge} {
|
|
|
|
font-size: $base-font-size*1.4;
|
|
|
|
}
|
2022-06-12 13:50:06 +02:00
|
|
|
|
2022-06-12 19:27:57 +02:00
|
|
|
@media #{$mq-xxlarge} {
|
|
|
|
font-size: $base-font-size*1.6;
|
|
|
|
}
|
2022-06-12 13:50:06 +02:00
|
|
|
}
|