@charset "UTF-8";
/* CSS Document */

:root{
	--bg-color: #009;
	--second-bg-color: #006;
	--second-bg-darkcolor: #003;
	--accent-color: #f09;
	--table-color: #fcf;
	--font-color: #fff;
	--navbar-shallow-color: #ccc;

	--ff-primary: 'Montserrat', sans-serif;
	--ff-body: var(--ff-primary);
	--ff-header: var(--ff-primary);
}

.container{
	--max-width: 1110px;
}

/* Utility classes */
.visually-hidden{
	position: absolute;
	display: none;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap; /* added line */
	border: 0;
} 

/* Box sizing rules */
*,
*::before,
*::after{
	box-sizing: border-box;
}

/* Remove default margin */
*,
body{
	margin: 0;
	padding: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role="list"],
ol[role="list"]{
	list-style: none;
}

html{
	overflow-x: hidden;
}

/* Set core root defaults */
html:focus-within{
	scroll-behavior: smooth;
}

/* Set core body defaults */
body{
	font-family: 'Montserrat', sans-serif;
	background-color: var(--bg-color);
	color: var(--font-color);
	text-rendering: optimizeSpeed;
	line-height: 1;
	border: none;
	outline: none;
}
ul{
	list-style: none;
}
a{
	color: var(--font-color);
	font-size: 1rem;
	text-decoration: none; 
}

/* A elements that don´t have a class get default styles */
a:not([class]){
	text-decoration-skip-ink: auto;
}

/* Make images easy to work with */
img,
picture,
svg{
	max-width: 100%;
	display: block;
}
.flex{
	display: flex;
}
.grid{
	display: grid;
	gap: var(--gap, 1rem);
}
.spaceleft{
	display: flex;
}
.spaceright{
	display: flex;
}

/* Remove all animations,transitions and smooth scroll for people that prefer not to see them */
@media (prefers-reduced-motion: reduce){
	html:focus-within {
		scroll-behavior: auto;
	}

*,
*::before,
	*::after{
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}