@font-face {
    font-family: 'Open Sans';
	font-weight: 300 800;
    src: url('../fonts/OpenSans-VariableFont_wdth,wght.ttf') format('truetype');
    font-display: swap;
}

:root {
    --primary-color: #0056b3;
    --text-color: #212529;
    --bg-color: #f3f3f3;
    --white: #fff;
    --font-main: 'Open Sans', sans-serif;
}

* {margin: 0; padding: 0;}
a {text-decoration: none; color: unset;}

body {
	display: flex;
    flex-direction: column;
    min-height: 100vh;
	background-color: var(--bg-color);
	font-family: var(--font-main);
}

.container {margin: auto; max-width: 1000px;}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

h1, h2, h3 {
    font-weight: 700;
}

header {
	float: left;
	width: 100%;
	background-color: var(--bg-color);
	/* background-image: radial-gradient( circle farthest-corner at 17.6% 50.7%,  rgb(7 65 71) 0%, rgb(14, 20, 27) 90% ); */
}

main {
	float: left;
	width: 100%;
	flex: 1;
}

footer {
	float: left;
	width: 100%;
}