@import url('https://fonts.googleapis.com/css2?family=Strichpunkt+Sans:wght@400..900&display=swap');


html, body, div, span, applet, object,
iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, a, abbr, acronym, address, big, cite,
code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b,
u, i, center, dl, dt, dd, ol, ul, li, fieldset,
form, label, legend, table, caption, tbody,
tfoot, thead, tr, th, td, article, aside,
canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, ruby,
section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;

 font-family: "Strichpunkt Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;

}


h1{font-size: 3em; font-weight: 700; line-height: 3.5em; margin-top: 30px;}
p{font-size: 1.2em; color: black; line-height: 1.5em;}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;}


#bkg{width: 100vw; height: 100vh; background: url(../../images/bg.jpg); background-size: cover; position: fixed; z-index: -1; top: 0;}

#wrapper{height: 100vh; display: flex;     justify-content: center;    align-items: center;}

#inner{max-width: 980px; margin: 0 40px; text-align: center;}
#inner img{width: 100%; height: auto;}

.links{display: flex; gap: 10px; justify-content: center; margin-top: 30px;}
.links a{text-decoration: none; display: inline-block; padding: 10px 15px; font-size: 1.2em; border: 2px solid  #0d6fb6; color: #0d6fb6;; font-weight: 500;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-ms-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;

}
.links a:hover{background: white; color: #0d6fb6; border-color: white;}


.sp{display: flex; aspect-ratio: 4/1; margin-top: 40px; gap: 20px;}
.sp a{display: flex; aspect-ratio: 2/1; background-size: contain;}
.sp a img{width: 100%; height: auto;}

footer{margin-top: 50px; font-size: 0.9em;}
footer a{text-decoration: none; color: black; opacity: 0.4;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-ms-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;}
footer a:hover{opacity: 1.0;}


.marqwrap ul{display: inline-flex;}

.marqwrap .customMarquee{overflow: hidden; margin-top: 40px;}
.marqwrap .customMarquee ul{list-style: none; margin:0; display: inline-flex; white-space: nowrap; padding: 5px 0; width: 100%; gap: 30px;}
.marqwrap .customMarquee ul li{ display: flex; vertical-align: center;}
.marqwrap .customMarquee ul li img{height: 85px; width: auto;}


@media (max-width: 700px) {
h1{font-size: 2.5em; line-height: 1.2em; margin-bottom: 30px;}
.links{    flex-wrap: wrap;}
}