/*PHP file core*/
/*maintenance_mode.css*/
/*V1.0.0*/
/*MSCRATCH*/
/*MMXXV*/

* {
box-sizing: border-box;
padding: 0;
margin: 0;
}

/*root*/

:root {
font-size: 62.5%; /*10PX*/

--body_bg_color: #202020;
--body_font_family: Inter, ui-sans-serif, system-ui, sans-serif;
--body_font_color: #9c9c9c;
--body_line_height: 1.65;

/*wrapper*/

--wrapper_border_color: #414141;
--wrapper_bg_color: #2b2b2b;

--wrapper_font_size: 1.3rem;
--wrapper_font_weight: 400;
--wrapper_font_color: #9c9c9c;

--wrapper_title_bg_color: #353535;
--wrapper_title_font_size: 1.3rem;
--wrapper_title_font_color: #d8d8d8;
--wrapper_title_font_weight: 600;

--wrapper_box_shadow: 0 0 80px 30px rgba(170, 170, 170, 0.12), 0 0 160px 70px rgba(170, 170, 170, 0.05);

/*wrapper*/

/*links*/

--default_link_font_size: 1.3rem;
--default_link_font_weight: 500;
--default_link_color: #9c9c9c;
--default_link_hover_color: #ffffff;

/*links*/

/*flash_message*/

--flash_message_bg_color: #262626;
--flash_message_border_color: #414141;

--flash_message_font_size: 1.3rem;
--flash_message_font_color: #c5c5c5;
--flash_message_font_weight: 400;

/*flash_message*/

/*margin*/

--mt: 1.5rem;
--mb: 1.5rem;

/*margin*/

}

/*root*/

/*body*/

body {
background: var(--body_bg_color);
font-family: var(--body_font_family);
color: var(--body_font_color);
line-height: var(--body_line_height);
background-image: url("../images/texture_background.png");
background-position: center top;
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
}

body::before {
content: "";
position: fixed;
inset: 0;
background: url("../images/noise_overlay.png") repeat;
background-size: 300px 300px;
pointer-events: none;
z-index: 1500;
}

/*body*/

/*wrapper*/

.main_wrapper {
width: 100%;
margin-top: 15rem;
margin-bottom: 5rem;
}

.wrapper {
max-width: 750px;
width: 100%;
margin: 0 auto;
border: 1px solid var(--wrapper_border_color);
background-color: var(--wrapper_bg_color);
font-size: var(--wrapper_font_size);
font-weight: var(--wrapper_font_weight);
text-align: left;
color: var(--wrapper_font_color);
box-shadow: var(--wrapper_box_shadow);
}

.wrapper_title {
padding: 1.4rem 1.6rem;
border-bottom: 1px solid var(--wrapper_border_color);
background-color: var(--wrapper_title_bg_color);
font-size: var(--wrapper_title_font_size);
font-weight: var(--wrapper_title_font_weight);
color: var(--wrapper_title_font_color);
}

.wrapper_content {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 1rem;
padding: 1.5rem;
}

/*wrapper*/

/*links*/

a.default_link {
text-decoration: underline;
font-size: var(--default_link_font_size);
font-weight: var(--default_link_font_weight);
color: var(--default_link_color);
transition: color 0.2s ease-in-out;
}

a.default_link:hover {
color: var(--default_link_hover_color);
}

/*links*/

/*flash_message*/

.flash_message {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 1150;
background-color: var(--flash_message_bg_color);
border-bottom: 1px solid var(--flash_message_border_color);
transform: translateY(-100%);
transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

.flash_message_content {
padding: 2rem;
font-size: var(--flash_message_font_size);
font-weight: var(--flash_message_font_weight);
text-align: left;
text-decoration: underline;
color: var(--flash_message_font_color);
}

.flash_message.show {
transform: translateY(0);
}

/*flash_message*/

/*margins*/

.mt {
margin-top: var(--mt);
}

.mb {
margin-bottom: var(--mb);
}

/*margins*/

/*responsive elements*/

@media only screen and (max-width: 800px) {

.main_wrapper {
margin: 15rem 1.5rem 5rem 1.5rem;
width: auto;
}

}

/*responsive elements*/

/*fonts*/

/* inter-100 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Inter';
font-style: normal;
font-weight: 100;
src: url('../fonts/inter-v20-latin-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-200 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Inter';
font-style: normal;
font-weight: 200;
src: url('../fonts/inter-v20-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-300 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Inter';
font-style: normal;
font-weight: 300;
src: url('../fonts/inter-v20-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-regular - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Inter';
font-style: normal;
font-weight: 400;
src: url('../fonts/inter-v20-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-500 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Inter';
font-style: normal;
font-weight: 500;
src: url('../fonts/inter-v20-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-600 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Inter';
font-style: normal;
font-weight: 600;
src: url('../fonts/inter-v20-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-700 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Inter';
font-style: normal;
font-weight: 700;
src: url('../fonts/inter-v20-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/*fonts*/
