TeleQom.org/css/utils/base.css

185 lines
3.3 KiB
CSS

/* FONTS IMPORT */
@font-face {
font-family: NeverMind;
src: url("/media/fonts/NeverMindRounded-Regular.woff2");
font-display: swap;
}
@font-face {
font-family: NeverMind-Bold;
src: url("/media/fonts/NeverMindRounded-Bold.woff2");
font-display: swap;
}
/* RESET */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
border: none;
text-decoration: none;
font-family: NeverMind, sans-serif;
scroll-behavior: smooth;
}
:root {
/* Display Sizes */
--mobile-size: 500px;
--tablet-size: 900px;
--desktop-size: 1920px;
--max-display-size: 1920px;
/* Background Colors */
--background-color-1: #1f1f2a;
--background-color-2: #1e222b;
--background-color-3: #333947;
--background-color-success-1: #1dad24;
--background-color-success-2: #16851c;
--background-color-warning-1: #a4a700;
--background-color-warning-2: #898b00;
--background-color-danger-1: #c90c0c;
--background-color-danger-2: #960b0b;
/* Item Colors */
--item-color-1: #689af8;
--item-color-2: #3c64ad;
--item-color-3: #333947;
/* Text Colors */
--text-color-1: #eee;
--text-color-2: var(--item-color-1);
/* btn Color */
--btn-color-1: #5791FF;
--btn-color-1-hover: #3c64ad;
--btn-color-2: unset;
--btn-color-2-hover: #5791FF;
--btn-disabled: #3d414b;
/* Boxes */
--box-shadow: #0c0e11;
--border-radius: 0.5rem;
/* Custom */
--nav-height: 5rem;
}
html {
color: var(--text-color-1);
background-color: var(--background-color-1);
scroll-padding-top: var(--nav-height);
}
body {
max-width: var(--max-display-size);
margin: 0 auto;
text-align: center;
}
a {
color: var(--text-color-1);
text-decoration: none;
}
strong {
font-family: NeverMind-Bold, sans-serif;
}
h1 {
font-family: NeverMind-Bold, sans-serif;
font-size: 3rem;
}
h2 {
font-family: NeverMind-Bold, sans-serif;
font-size: 2.5rem;
}
h3 {
font-family: NeverMind-Bold, sans-serif;
font-size: 2rem;
}
h4 {
font-family: NeverMind-Bold, sans-serif;
font-size: 1.5rem;
}
h5 {
font-family: NeverMind-Bold, sans-serif;
font-size: 1.4rem;
}
p {
line-height: 1.5rem;
font-size: 1.3rem;
}
/* SECTIONS */
section {
padding: 5rem 0 5rem 0;
}
/* CUSTOM */
span.in-blk {
font-family: NeverMind-Bold, sans-serif;
display: inline-block;
}
span.q {
color: var(--item-color-1);
font-family: NeverMind-Bold, sans-serif;
}
h1 .q {
height: 3rem !important;
width: 3rem !important;
margin: 0 0.1rem -0.1rem 0.1rem !important;
}
h2 .q {
height: 2.5rem !important;
width: 2.5rem !important;
margin: 0 0.1rem -0.1rem 0.1rem !important;
}
h3 .q {
height: 2rem !important;
width: 2rem !important;
margin: 0 0.1rem -0.1rem 0.1rem !important;
}
h4 .q {
height: 1.5rem !important;
width: 1.5rem !important;
margin: 0 0.1rem -0.1rem 0.1rem !important;
}
h5 .q {
height: 1.3rem !important;
width: 1.3rem !important;
margin: 0 0.1rem -0.1rem 0.1rem !important;
}
p .q {
height: 1.2rem !important;
width: 1.2rem !important;
margin: 0 0.1rem -0.075rem 0.1rem !important;
}
.link {
text-decoration: underline;
color: var(--text-color-2);
}
a.btn {
font-family: NeverMind-Bold, sans-serif;
}