* {
	box-sizing: border-box;
}

html {
	width: 100%;
	height: 100%;
}

body {
	background: #002F4A;
	background: color(display-p3 0 0.1804 0.2824);
	height: 100%;
	margin: 0;
	padding: 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	/*background-image: url('../img/isar.webp');*/
	background-repeat: no-repeat;
	background-size: cover;
	background-position: left bottom;
	font-size: 16px;
	font-family: Mulish;
}

h1, h2, h6, figcaption {
	text-align: center;
	margin: 0;
	padding: 0;
	line-height: 1.25em;
}

header h1 {
	font-size: 48px;
	font-weight: 900;
	text-transform: uppercase;
}

header h2 {
	font-size: 16px;
	font-weight: 400;
}



figcaption {
	font-size: 16px;
	font-weight: 400;
}

a,a:visited,a:hover {
	color: inherit;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

.container {
	display: flex;
	box-sizing: border-box;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	flex: 1 1 auto;
	height: 100%;
	color: white;
}

header {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 64px 8px;
	box-sizing: border-box;
	flex-grow: 0;
}

footer {
	padding: 64px 8px 32px;
	flex-grow: 0;
}

main {
	color: #0FF;
	color: color(display-p3 0.0027 0.991 1);
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	width: 100%;
	padding: 0 30px;
	box-sizing: border-box;
	
	.wordcloud {
		display: flex;
		flex-grow: 1;

		
			.img-container {
				width: 100%;
				height: 100%;
				display: block;
				position: relative;
				
				img {
					position: absolute;
					top:0;
					left:0;
					width: 100%;
					height: 100%;
					object-fit: contain;
				}
			}



	}
	.h6 {
		flex-grow: 0;
	}

}

.grid {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 32px;
	margin-bottom: 16px;
}

.grid figure {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 8px;
	margin-block: 0;
	margin-inline: 0;
}
	
.grid figure .icon {
	width: 32px;
	height: 32px;
}

svg path {
	stroke:#01FDFF;
	stroke:color(display-p3 0.0027 0.9910 1.0000);
	stroke-opacity:1;
}

svg path {
	stroke:#ffffff;
	stroke-opacity:1;
}


.legal {
	margin-top: 40px;
	text-align: center;
	font-size: 14px;
	font-weight:400;
}

.img-h {display: none;}

.text-component {
	max-width: 600px;
	h1,h2 {
		text-align: left;
	}
}

@media (min-width: 640px) {
	
	
	header h1         { font-size: 72px }
	header h2         { font-size: 24px }
	figcaption { font-size: 18px }
	
	.grid figure .icon {
		width: 40px;
		height: 40px;
	}
	.img-v {display: none;}
	.img-h {display: inline;}
	
}

@media (min-width: 960px) {
	header h1         { font-size: 96px }
	header h2         { font-size: 32px }
	figcaption { font-size: 24px }
	
	.grid figure .icon {
		width: 40px;
		height: 40px;
	}
	
}