/* TRISITE CSS 4.0  */
/* (C) 2023 TRISITE */
/* Initialize       */

@import "https://trisite.net/services/css/v4.0/basic.css";
@import "https://trisite.net/services/css/v4.0/header.css";
@import "https://trisite.net/services/css/v4.0/grid.css";
@import "https://trisite.net/services/css/v4.0/button.css";
@import "https://trisite.net/services/css/v4.0/table.css";
@import "https://trisite.net/services/css/v4.0/form.css";
@import "https://trisite.net/services/css/v4.0/pageing.css";

:root {
    --width-limit: 1400px;
	--section-space: 100px;
	--margin: 40px;
	--padding: 20px;
	--input-width: 260px;

	--radius: 4px;
	--radius-inner: 0;

	--font-size: 14px;
	--step: 1.12;
	--line-height: 1.8;
	--transition: 0.4s;
	--small: 0.6em;
	--large: 1.4em;

	--brightness: 1.1;
	--outline: 1px;

	--trigger-size: 50px;
	--trigger-bar: 4px;

	--gap: 20px;
	--header-offset: 0;

	--color-light-glass:rgba(255, 254, 254,0.3);
	--color-dark-glass:rgba(38, 32, 32,0.4);

	--color-super-white: #fff;
	--color-white: #fafafa;
	--color-blue: rgb(0,104,151);
	--color-skyblue: rgb(40,155,222);
	--color-red: rgb(191,84,94);
	--color-green: rgb(134,176,112);
	--color-yellow: rgb(219,225,67);
	--color-orange: rgb(234,190,59);
	--color-gray: rgb(165,167,154);
	--color-lightgray: rgb(243, 240, 240);
	--color-black: #222;

	--shadow: 0px 0px 10px -6px rgba(0,104,151, 0.5) , 0px 0px 5px -2px rgba(165,167,154, 0.2);
	--shadow-light: 3px 3px 5px -1px hsl(190 60% 30% / 30%);


	--color-body: var(--color-white);
	--color-text: var(--color-black);
	--color-border: var(--color-black);
	--color-table: var(--color-white);
	--color-table-odd: var(--color-lightgray);

	--color-agree-bg: var(--color-super-white);
	--color-agree-fr: var(--color-text);
	--color-disagree-bg: var(--color-red);
	--color-disagree-fr: var(--color-white);
	--color-cancel-bg: var(--color-lightgray);
	--color-cancel-fr: var(--color-black);

	--color-trigger-bg: var(--color-ohp-magenta);
	--color-trigger-fr: var(--color-white);

	--color-outline: var(--color-gray);
	--color-outline-focus: var(--color-blue);
	--color-outline-text: var(--color-black);
	--color-outline-focus-text: var(--color-white);
	--color-link: var(--color-blue);
	--color-hover: var(--color-ohp-magenta);
	--color-form: var(--color-white);
}

@media (width <= 920px) {
	:root {
		--section-space: 60px;
		--padding: 20px;
		--gap: 20px 40px;
	}
}
@media (width <= 520px) {
	:root {
		--section-space: 40px;
		--step: 1.12;
		--gap:20px;
	}
}