@charset "utf-8";
/* CSS Document */
body{
	background-color: yellowgreen;
	font-family: 'Poppins', sans-serif !important;
	overflow-x: hidden;
}
body a {
	cursor: pointer;
	color:#0054A6;
}
body a:hover{
	color: #692C90 !important;
}
body a:visited{
	color:#EC2028;
}
p{
	font-size: 16pt;
	font-weight: 400;
}
h1{
	font-size: 26pt !important;
	font-weight: 700 !important;
}
h2{
	font-size: 24pt !important;
	font-weight: 700 !important;
}
h3{
	font-weight: 600 !important;
	font-size: 22pt !important;
}
h4{
	font-weight: 500 !important;
	font-size: 20pt !important;
}
hr{
	background-color: #692C90 !important;
}

.background {
	width: 100%;
	height: auto;
	position: absolute;
	background-image: url("img/bg.jpg");
	background-size: auto 110vh;
	background-repeat: no-repeat;
	background-attachment: fixed;
}
.foreground {
	position: relative;
	z-index: 100;
}
.bg-cloudy {
	background-color: rgba(255,255,255, .85);
}
.top {
	border-radius: 5px 5px 0 0;
}
.bottom {
	border-radius: 0 0 5px 5px;
	overflow: hidden;
}
.foot{
	width: 100%;
	padding: 1em;
}

.menu{
	top: 0;
	position: sticky;
}
.nav {
	font-size: 1.3rem;
	border-radius: 7px;
	box-shadow: 0px 1px 4px 2px rgba(0,0,0,.5);
}
.active-item a{
	color: white !important;
	background-color: #0054A6 !important;
}
.nav-item.active-item a:hover{
	color: #FFF200 !important;
}
.inactive-item a {
	color: inherit !important;
}
.inactive-item a:hover{
	color: #EC2028 !important;
}
.dancing a{
	animation: dancingbutton ease-in-out 1.5s infinite;
}
.dancing a:hover {
	color: yellow !important;
}
.sponsor{
	max-width: 65% !important;
}
.sponsor-large{
	width: 65%;
}	
.sponsor-flat{
	width: 90%;
}
.sponsor-soelbergs{
	width: 85%;
}
@keyframes dancingbutton{
	0% {background-color: red; color: white;}
	50% {background-color: purple; color: white;}
	100% {background-color: red; color: white;}
}
@supports (-webkit-touch-callout: inherit) {
	.background {
  		background-attachment: scroll;
	  	background-size: cover;
		background-position: center center;
  }
}
@media screen and (min-width: 576px){
	.sponsor{
		width: 75% !important;
	}
	.sponsor-large{
		width: 45%;
	}
	.sponsor-soelbergs{
		width: 45%;
	}
	p{
		font-size: 1.3rem;
		font-weight: 400;
}
	h1{
		font-size: 2.25rem !important;
		font-weight: 700 !important;
}
	h3{
		font-weight: 600 !important;
		font-size: 1.75em !important;
}
}
@media screen and (min-width: 1200px){
	.background {
		width: 100%;
		height: auto;
		background-size: 110vw auto;
		background-attachment: fixed;
	}
}