/* adopted



Version: 1.0

(17.11.2024)



Screen layout: */
@font-face {
    font-family: LyonRegular;
    src: url(fonts/lyon-regular.ttf) format(truetype);
    font-weight: normal;
    font-style: normal;
}

body {

margin: 0;

padding: 0;

font-family: LyonRegular, Helvetica, sans-serif;

background: #ffffff url(bg.gif) top center repeat-y;


}



#wrap {

background: #ffffff;

color: #666666;

margin: 0 auto;

width: 100%;

max-width: 1280px;

}


#header {

clear: both;

margin: 0 0 0 0;

padding: 0;

height: 1px;

}



#header h2 {

width: 450px;

margin: 0 0 0 0;

float: left;

}



 /* Style the navigation menu */
.topnav {
  overflow: hidden;
  background-color: #000000;
  position: relative;
}

/* Hide the links inside the navigation menu (except for logo/home) */
.topnav #myLinks {
  display: none;
  margin: 20px 0px;
}

/* Style navigation menu links */
.topnav a {
  color: #ffffff;
  padding: 10px 10px;
  text-decoration: none;
  font-family: LyonRegular;
  font-size: 3.8em;
  display: block;
}

/* Style the hamburger menu */
.topnav a.icon {
  background: white;
  display: block;
  font-size: 12vw; /* Scale icon size based on the width of the viewport */
  color: #999999;
  padding: 3% 3% 2% 3%; /* Adjust padding to be more responsive */
  position: absolute;
  right: 0;
  top: 0;
  max-height: 100%; /* Ensure the height of the icon is limited by the parent container */
  height: auto; /* Allow the icon to scale based on content */
  width: auto; /* Ensure the width scales proportionally */
  box-sizing: border-box; /* Make sure padding is included in the element’s total width and height */
}

/* Add a grey background color on mouse-over */
.topnav a:hover {
  background-color: white;
  color: #990033;;
}

/* Style the active link (or home/logo) */
.active {
  background-color: #ffffff;
  color: white;
} 


@media (min-width: 1028px) {
	  /* Hide the hamburger icon on desktop */
  .topnav  {
    display: none;
  }
#content {

margin: 0 90px 20px 220px;

padding: 0 0 0 10px;

line-height: 1.4em;

text-align: left;

}

#gallery {

margin: 0 90px 20px 220px;

padding: 0 0 0 10px;

line-height: 1.2em;

text-align: left;

}
#content h1 {
	
line-height: 1.2em;

}

#content img {

padding: 0px;

display:inline;

background: #ffffff;

border: 0px solid #f0f0f0;

}

#content a:hover {

text-decoration:none;
color: #990033;
}
.footer-content {
img {
  width: 700px;
}
}
.footer-menu{
  float: right;
  font-size: 1.2em;
}
.topnav {

img {
  max-width: 900px;
}
}
}



#avmenu {

clear: left;

float: left;

width: 180px;

margin: 0 0 10px 0;

padding: 0;

font-size: 0.9em;


}



#avmenu ul {	

list-style: none;

width: 180px;

margin: 0 0 20px 30px;

padding: 0;

font-family: LyonRegular;

font-size: 1.0em;

}	



#avmenu dl {	

list-style: none;

width: 180px;

margin: 0 0 20px 0;

padding: 0;

font-size: 1.0em;

}	



#avmenu li {

margin-bottom: 4px;


}



#avmenu li a {

font-weight: normal;

font-size: 1.7em;

height: 26px;

text-decoration: none;

text-align: center;

color: #000000;

display: block;

margin: 4px 18px 0 0;

padding: 6px 0 0 0;

background: #ffffff;






}	

	

#avmenu li a:hover {



color: #990033;




}




.announce {

margin: 0px 0 0px 0;

padding: 8px;

width: 130px;

color: #660000;

background-color: #f4f4f4;

line-height: 1.3em;

border: 4px solid #990000;

}



.announce h2 {

font-size: 1.5em;

}



#extras {

float: right;

width: 50px;

margin: 0 0 10px 0;

padding: 0;

color: #505050;

background-color: #f4f4f4;

font-size: 0.9em;

line-height: 1.5em;

}



#content {

align-items: center;

font-family: LyonRegular;

padding: 0 10px 0 10px;

font-size: 1.6em;



}


#gallery {

align-items: center;

font-family: LyonRegular;

padding: 0 70px 0 70px;

font-size: 1.0em;


}

#content h1 {
	
font-weight: normal;

font-family: LyonRegular;

font-size: 2.0em;

margin: 0 0 0 0;

}


#content h2 {

font-weight: normal;

font-family: LyonRegular;

font-size: 2.0em;

margin: 0 0 0 0;

}



#content img {

padding: 0px;

display:inline;

background: #ffffff;

border: 0px solid #f0f0f0;

}



#content a:hover {

text-decoration:none;
color: #000000;
}


h3 {

font-size: 1.3em;

margin: 0 0 10px 0;

}



a {

text-decoration: none;

color: #990033;

}



a:hover {

text-decoration: none;

color: #000000;

}



a img {

border: 0;

}

footer{
    bottom: 0;
    left: 0;
    right: 0;
    background: #000;
    height: auto;
    width: 100%;
    padding-top: 40px;
    color: #fff;
}



footer a {

color: #808080;

text-decoration: none;

}



footer a:hover {

text-decoration:none;
color: #990033;
}

.footer-content{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}

.footer-content h4{
    font-size: 2.1em;
    font-weight: 500;
    text-transform: capitalize;
    line-height: 1em;
}

.footer-content p{
	font-family: LyonRegular;
    max-width: 600px;
    margin: 10px auto;
    line-height: 1.2em;
    font-size: 1.8em;
    color: #cacdd2;
}

.footer-bottom{
    background: #000;
    width: 98vw;
    padding-bottom: 10px;
    text-align: center;
}
.footer-bottom p{
	font-family: LyonRegular;
   float: left;
   font-size: 14px;
   word-spacing: 2px;
   text-transform: capitalize;
}
.footer-bottom p a{
  font-family: LyonRegular;
  color:#44bae8;
  font-size: 16px;
  text-decoration: none;
}
.footer-bottom span{
    text-transform: uppercase;
    opacity: .4;
    font-weight: 200;
}
.footer-menu{
  float: right;
}

.footer-menu ul{
  display: flex;
}

.footer-menu ul li{
padding-right: 10px;
display: block;
}

.footer-menu ul li a{
  font-family: LyonRegular;
  color: #cfd2d6;
  text-decoration: none;
  
  
}

.footer-menu ul li a:hover{
  color: #990033;
}

.left {

margin: 10px 10px 5px 0;

float: left;

}



.right {

margin: 10px 0 5px 10px;

float: right;

}



.textright {

text-align: right;

}



.center {

text-align: center;

}



.small {

font-size: 0.8em;

}



.bold {

font-weight: bold;

}



.hide {

display: none;

}


@media (max-width: 1027px) {
#avmenu { display: none; }

#body h2 {
	font-size: 0,8em;
}
#content { 

margin: 0 0px 20px 0px; 
padding: 0 20px 0 20px;
font-size: 2.8em;	
line-height: 1,6em;
table {
line-height: 1.2em;
}
}

#gallery { 

margin: 0 0px 0px 0px; 
padding: 0 5px 0 20px;
font-size: 2.5em;	
line-height: 1,6em;
}

#content a {

text-decoration:none;
color: #990033;

}
#content a:hover {

text-decoration:none;
color: #990033;
}
.footer-menu ul{
  display: flex;
  margin-top: 10px;
  margin-bottom: 20px;


}
.footer-content p{
	font-family: LyonRegular;
    margin: 10px auto;
    line-height: 1.4em;
    font-size: 3.2em;
    color: #cacdd2;

}
.footer-content h4{
    font-size: 3.8em;
    font-weight: 600;
    text-transform: capitalize;
    line-height: 1em;
	font-family: LyonRegular;
}

.footer-menu ul{
  display: flex;
  margin-top: 10px;
  margin-bottom: 20px;
  font-size: 2.8em;
}

.footer-menu ul li{
width: 100%;
align-items: center;
font-family: LyonRegular;
 
}

}