.headerf {
	position: sticky;
	align-self: flex_start;
	top: 0;
	right: 0;
	left: 0; 
	height: 75px;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
	padding: 0px 10px 0px 10px;
        border-radius: 10px 10px 0px 0px;
        background-image:  linear-gradient(var(--header-background-color), var(--header-background-color1));
}
.headerf-img {
	background-color: transparent;
	display: flex;
	align-items: center;
}

.headerf-sponsor-logo {
	max-width: 150px;
	max-height: 50px;
}
.headerf-sponsor-logo img{
	width: 100%;
	max-height: 50px;
}
.headerf-img img{
	width: 100%;
}
.headerf-title-box {
	display: flex;
	flex-direction: column;
	flex: 1;

}
.headerf-title {
	font-size: 30px;
	font-style: italic;
        color: var(--font-color-header);
 	text-shadow: 2px 2px 5px black;
        font-weight: bold;
}
.headerf-sponsor {
	font-size: 16px;
	color: var(--font-color-header);
 text-shadow: 2px 2px 5px black;
}

.headerm 
{
 height: fit-content;
 display: none;
 flex-direction: row;
 justify-content: center; 
 align-items: center;
 background: linear-gradient(var(--header-background-color), var(--header-background-color1)); 
 border-radius: 4px 4px 0px 0px;
 padding: 4px;
}

.headerm-img {
 background-color: transparent;
 display: flex;
 align-items: center;

}

.headerm-img img{width: 40px;}

.headerm-title-box {
	display: flex;
	flex-direction: row;
	flex: 1;
	gap: 5px;
justify-content: space-evenly;
align-items: center;
}





.headerm-title 
{
 font-size: 24px;
 color: var(--font-color-header);
 font-style: italic;
 text-shadow: 2px 2px 5px black;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
 padding: 0px 10px 0px 10px;
max-width: 90vw;
}

.headers-title 
{
 width: 80px;
}

.headerm-sponsor {
	font-size: 16px;
	color: var(--font-color-header);
 text-shadow: 2px 2px 5px black;
}

.header-menu-button-circle {
display: flex;
justify-content: space-evenly;
align-items: center;
background-color:black;
background-color: var(--header-background-color);
height: 100px;
width: 100px;
border-radius: 50px;
color: white;
border-top: 1px solid white;

position: fixed;
top: 25px;
margin-left: auto;
margin-right: auto;
z-index: 10000;
}

.header-menu-button-circle.v {
	flex-direction: column;
}


@media (max-width: 1000px)
{
 .headerm
 { 
  display:flex;
 }
 .headerf
 { 
  display:none;
  }
}