/* Global Styles */

@import url(https://fonts.googleapis.com/css?family=Montserrat:400,700);


body { font-family: Montserrat; background-color: var(--main-bg-color); color: var(--main-font-color); overflow-x: hidden; margin:0;}
.dropdown-content li { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: normal; align-content: normal; transition: filter 0.3s ease; background-color: var(--nav-bg-color); }
.dropdown-content li:hover { filter: var(--lumen); }
.dropdown-content { display: none; position: absolute; background-color: var(--nav-bg-color); box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.9); z-index: 1; min-width: 100%; }
.flag { width: 24px; height: 16px; margin-right: 3px; display: none; border-radius: 2.5px; }
.flags-container { display: flex; position: absolute; right: 50px; top: 50%; transform: translateY(-50%); overflow: hidden; width: 0; transition: width 0.5s ease; }
.flags-container.active .flag { display: block; }
.flags-container.active { width: calc(26px * 4 + 3px * 3); }
@font-face { font-family: DDG; src: url(lukarne/font/DDG__.ttf); font-weight: bold; }
@font-face { font-family: Micro; src: url(lukarne/font/MicroExtendFLF-Bold.ttf); font-weight: bold; }
@font-face { font-family: Micro; src: url(lukarne/font/MicroExtendFLF.ttf); }
main h2 {padding-left:20px; font-size: 20px; text-align: left; font-family: Montserrat; margin-bottom: 20px; font-weight: bold; color: var(--main-font-color); }
.header { display: flex; justify-content: space-between; align-items: center; padding: 3px; position: relative; }
#language-btn { cursor: pointer; }
.logo b { vertical-align: top; font-size: 28px; font-stretch: ultra-expanded; font-family: Micro; letter-spacing: 2px; }
.logo { display: flex; align-items: center; }
.logo-text { margin-left: 0px; margin-top:-30px; text-align: center; }
main { text-align: left; margin: 10px; box-sizing:border-box;   flex: 1; }
.menu-icon .bar { display: block; width: 25px; height: 3px; margin: 5px auto; background-color: var(--main-font-color); }
.menu-icon { display: none; cursor: pointer; position: fixed; top: 10px; background-color: var(--main-bg-color); opacity: 65%; padding:0 5px 0 5px;border-radius:5px;border:var(--main-font-color)  solid 1px;}
nav a { color: var(--nav-font-color); white-space:nowrap; width:100%;}
nav ul li a { text-decoration: none; padding: 10px 20px; display: block; filter: none; }
nav ul li { position: relative; width: 100%; text-align: center; z-index:11; border-radius: 0 0 5px 5px; }
nav ul { list-style: none; padding: 0; margin: 2px 10px 0 10px; display: flex; justify-content: space-around; background-color: var(--nav-bg-color); z-index:11; border-radius: 5px; }
.submit-button { background-color: var(--nav-bg-color); color: var(--nav-font-color); font-family: Montserrat; padding: 10px; border: none; border-radius: 5px; cursor: pointer; font-size: 16px; width: 100%; transition: background-color 0.3s ease; }
.submit-button:hover { filter: var(--lumen); }
.tagline { display: block; font-family:Micro; font-size: 14px; font-weight:normal; text-align: center; margin-top:-5px; }
#titolo{ color:var(--main-font-color); }
.wrapper {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  width:100%;
    box-sizing:border-box;

}
 
.site-footer {

  background-color: var(--nav-bg-color);
  color: var(--nav-font-color);
  padding: 0;
  margin: 0;
  width: 100%;
  font-size: 14px;
     box-sizing:border-box;


}

.footer-section {

    display: grid;
  grid-template-columns:repeat(3, 1fr); /* 3 colonne di larghezza uguale */

}

.footer-columns {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 20px;
  width: 100%;
   
  box-sizing:border-box;

}

.footer-c {

  min-width: 200px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
 

}


.footer-c h2 {
  margin-bottom: 4px;
  font-size: 16px;
  color: var(--nav-font-color);
}

.footer-c a {
  color: var(--nav-font-color);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 6px;
}

.footer-c a:hover {
  text-decoration: underline;
}

.footer-bottom {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-top: 3px;
  border-top: 1px solid #444;
  padding: 10px 0;
  font-size: 12px;
  color: var(--nav-font-color);
}

.footer-bottom img {
  height: 12px;
  width: auto;
  object-fit: contain;
}
.footer-bottom img{    height: 15px; border-radius: 1px;
  object-fit: cover;}
@media (max-width: 768px) {
nav{position:fixed; top: 72px;width: 100%; z-index:5;}
nav.open ul { display: flex; flex-direction: column; position:relative; margin: 10px; }
nav.open ul li { text-align: left; }
nav > ul { display: none; flex-direction: column;padding:0; max-width:calc(100% - 40px);}
nav > ul  ul {box-sizing:border-box; left: -10px;display: none; flex-direction: column; max-width:calc(100% - 40px); }

nav ul li{ flex-direction: column; margin-right: 100px; }
nav ul li { text-align: left; }
h2 { font-family: Arial; }
.tagline { font-size: 10px; margin-top: 2px; }
.menu-icon { display: block; position: fixed; top: 20px; left: 20px; z-index: 1000; }
.logo-text { margin-left: 0px; }
.logo b { vertical-align: top; font-size: 20px; font-stretch: ultra-expanded; font-family: Micro; letter-spacing: 2px; }
.flags-container { top: 80%; right: 50px; }
.footer-section {
  display: flex;
flex-direction:column;


}
.footer-columns {

  justify-content:  flex-start;
  padding-left:20px;


}
.site-footer {

  padding: 0;
  margin: 0px;
  max-width: 100%;
  font-size: 12px;


}
}