/* nunito-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 200;
  src: url('/fonts/nunito-v26-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* nunito-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/nunito-v26-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* nunito-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 600;
  src: url('/fonts/nunito-v26-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* nunito-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/nunito-v26-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/montserrat-v29-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: url('/fonts/montserrat-v29-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* material symbols */


html {
  overflow-x: hidden !important;
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
  background-color: black;

}

body {
  overflow-y:auto;
  overflow-x: hidden !important;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
background-color: #0a0a17;
}


/* General */
* {
  box-sizing: border-box;
  font-family: 'Nunito', sans-serif;
  font-weight: 200;
  color: #FFFFFFFF;
  margin: 0;
  padding: 0;
}

.secHeaders {
  width: 100%;
  text-align: left;

}

h1 {
    font-family: 'Montserrat', sans-serif;

  margin-bottom: 2px;
  color: #FFFFFFFF;
  font-size: 23px;
  font-weight: 600;
  letter-spacing: 1px;

}

h2{
    font-family: 'Montserrat', sans-serif;

  width: 100%;
  margin-bottom: 30px;
  text-align: left;
  color: #FFFFFFFF;
  font-size: 34px;
  font-weight: 400;

}


button {

    cursor: pointer;

}


.nova {
    font-family: 'Montserrat', sans-serif;
  font-weight: 600;
letter-spacing: 1px;

}

button:focus {

    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25) !important;

}

a {
  text-decoration: none;
}

li {
  list-style: none;
}

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 0;
  font-size: 35px;
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
}

section {
  position: relative;
  width: 100%;
  height: auto;
  min-height: 100vh;
  display: flex;
  flex-direction: column;

  align-items: start;
  justify-content: center;
  text-align: center;
  overflow-x: hidden !important;
  padding-top: 65px;
  visibility: hidden;

}


section h1 {
margin-left: 20px;
margin-bottom: 10px;

}

.sectionHeader {
 
color: white;
border-left-style: none;
border-color: #C5E0F9;
padding-left: 12px;


  background: linear-gradient(to top, #C5E0F9 0 0) 
    left bottom 2.5px /
    5px var(--underline-height, 0%)
    no-repeat;
  color: white;
  display: inline-block;
  text-decoration: none;
  transition: background-size 0.5s;


margin-bottom: 10px !important;
padding-bottom: 0 !important;



}

.sectionHeader.active {
  --underline-height: 100%;


}







.content, #Page6 {
  width: calc(100% - 40px);
  max-width: 1000px;
  height: 100%;

    background-color: rgba(233, 232, 238, 0.1);

  padding: 20px 20px 20px 20px !important;


  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
margin-left: 20px !important;

margin-right: 20px !important;


}

.accordion-container {
  width: 100%;
}





/* Navigation Bar */
nav {
  position: fixed;
  top: 0;
  right: -200px;
  height: 100vh;
  width: 200px;
  z-index: 9;
  -webkit-transition: all 500ms ease;
  -ms-transition: all 500ms ease;
  transition: all 500ms ease;
}

nav.active {
  right: 0px;
}

nav.short {
  top: 49px;
  height: calc(100vh - 50px);
  padding-top: 0;
}

nav.short .nav-links {
  padding-top: 10px !important;
}

ul.nav-links {
  position: relative;
  height: 100%;
  width: 200px;
  margin-top: 0px !important;
  padding-top: 50px !important;
  display: flex;
  flex-direction: column;
  align-items: left;
  justify-content: left;
  font-size: 15px;
  overflow-y: auto;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  pointer-events: auto;
    transition: all 500ms ease 0s;

}

ul.nav-links.short{

  margin-top: 50px !important;
  padding-top: 0px !important;

}


ul.nav-links p {
  display: block;
  color: white;
  margin-top: 8px;
  margin-bottom: 8px;
  font-weight: 700 !important;
  width: fit-content;
      transition: all 0.25s ease;
  padding-left: 10px;
  font-family: "Montserrat";

  }

li.nav-click {
  margin: 5px 15px;
  cursor: pointer;

    background: linear-gradient(to top, #C5E0F9 0 0) 
    left bottom 10px /
    5px var(--underline-height, 0%)
    no-repeat;
  text-decoration: none;
  transition: background-size 0.5s;
  padding-left: 5px;

}

li.nav-click:hover {
  opacity: 0.7;
}

li.nav-click.active {
  --underline-height: 25px;

  color: white;
}








.sectionHeader.active {


}












/* Top Bar */
.top-bar {
  position: fixed;
  top: -50px;
  left: 0;
  height: 50px;
  width: 100%;
  z-index: 1;
  -webkit-transition: all 500ms ease;
  -ms-transition: all 500ms ease;
  transition: all 500ms ease 0s;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

.top-bar.active {
  top: 0;
    transition: all 500ms ease 0;

}


/* Menu Button */
.hamburger {
  position: absolute;
  right: 15px;
  top: 15px;
  z-index: 1000000000000000;
  -webkit-transition: all 0.3s linear;
  -ms-transition: all 0.3s linear;
  transition:all 0.3s linear;
  visibility: hidden;
}

.hamburger.fixed, .hamburger.is-active {
  position: fixed;
  top: 0px;
}



.hamburger-box {
  margin-top: 2px;
}



/* Language Button */
#language-selector {

  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 200 200'><!-- Up Arrow -->  <polygon points='100,35 144,80 122.5,80 100,57.5 77.5,80 55,80' fill='white' />    <!-- Down Arrow -->  <polygon points='100,165 145,120 122.5,120 100,142.5 77.5,120 55,120' fill='white' /></svg>") no-repeat top 50% left 0%;
   -moz-appearance: none; 
    -webkit-appearance: none; 
    padding-left: 20px;
    appearance: none;
    height: 30px; 
    width: 45px;
      color: white;
  position: absolute;
  right: 80px;
  top: 15px;
height: 50px;
border: 2px solid transparent;

  visibility: visible;
  opacity: 1;
  transition: opacity 0.2s linear;
z-index: 1000;
visibility: hidden;
cursor: pointer;
  font-weight: 700;

  font-size: 12px;
}

#language-selector.fixed {
  position: fixed;
  top: 0;

}



#language-selector.is-active {
  position: fixed;
  top: 0;
  visibility: visible; !important;
  opacity: 1 !important;

}











/* Section 1 */

#Sec1 {
  flex-direction: column;
  height: auto;
    overflow: visible !important;

z-index: 0;
    height: calc-size(auto);

  min-height: 100svh;
  padding-top: 0;

}

#Page1 {
    overflow: visible !important;

  left: 0;
    height: calc-size(auto);
      min-height: 100svh;
  width: 100vw;
  margin-top: auto;

}


#contactLinks {

  display: flex;
    width: 100vw;
    top: calc(100vh - 90px);
    height: 60px;
  flex-direction: row;
  justify-content: center;
  align-items: flex-end;
visibility: hidden;
z-index: 1;
  position: absolute;
opacity: 1;
transition: opacity 0.5s ease-in-out;

}






.contactIcons {

  margin-left: 3px;
  margin-right: 3px;
display: flex;
flex-direction: row;


align-items: start;
justify-content: left;
  width: auto;
    max-width: 50px;


  height: 50px;
  border-radius: 30px;

    background-color: rgba(233, 232, 238, 0.1);


  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
overflow: hidden;


top: 0;


  border: solid 0px transparent;

transition: all 0.5s ease-in-out;

}


.contactIcons:hover {
  max-width: 250px;

  max-height: 90px;




} 



.teamTxtList ul li a {
  background: linear-gradient(currentColor 0 0) 
    bottom 7px left/
    var(--underline-width, 0%) 2px
    no-repeat;
  color: #C5E0F9;
  display: inline-block;
  padding-bottom: 0px;
  text-decoration: none;
  transition: background-size 0.5s;
}

.teamTxtList ul li a:hover {
  --underline-width: 100%;
}




.contactIcons a {
  display: flex;
  align-items: start;
  text-align: left;
  color: #2E5266FF;



z-index: 1;
cursor: pointer;
overflow: hidden;
margin-top: auto;
margin-right: 25px;

margin-bottom: auto;
max-height: 45px;

}





.contactIcons:hover .contactIconsPNG  {

}

.contactIconsPNG {
max-width: 50px;
max-width: 50px;
padding: 14px;

border-style: solid;
border-color: white;
border-width: 0px;


opacity: 1;

z-index: 0;

background-size: 30px 30px;
background-repeat: no-repeat;
   background-position: center; 

}




.link{

  color: white;
  font-size: 13px;
  width: auto;
transition: all 0.25s ease;

text-align: left;
max-height: fit-content;
visibility: visible;
white-space:nowrap;
opacity: 1;
font-weight: 600;

  background: linear-gradient(#C5E0F9 0 0) 
    bottom 0px left/
    var(--underline-width, 0%) 2px
    no-repeat;
  display: inline-block;
  padding-bottom: 0px;
  text-decoration: none;
  transition: background-size 0.5s;

}



 .link:hover {
  --underline-width: 100%;
}






#developmentBanner {
  margin-left: 20px;
  padding-top: 60px;


justify-content: center;

padding-left: 20px;
padding-right: 20px;
display: flex;
flex-direction: row;
    width: calc(100% - 40px);
  max-width: 1000px;
  align-items: start;
margin-right: 20px;
}


#developmentContainer {
  position: relative;
  width: calc(100% - 135px - 40px);
}


#developmentIconContainer {

  height: 135px;
  width: 135px;


  background-color: transparent;
  border-style: solid;
  border-color: white;
  border-width: 1.5px;
  border-radius: 100px;
  display: flex;
  justify-content: center;
  text-align: center;
  vertical-align: middle;
  overflow: hidden;
 
  background-image: url("/icons/construction.png");
background-size: 75px 75px;
background-repeat: no-repeat;
   background-position: center; 
   margin-right: 30px;

 }

#developmentIconContainer .material-symbols-outlined {
  margin-right: 2px;
  font-size: 90px;
  margin-top: 27px;
  height: 100px;
  color: white;

   }





#novaSec {
  width: 100%;
  color: #2E5266FF;
  overflow-y: hidden;
  overflow-x: hidden !important;
    height: auto;
    min-height: initial;
    display: flex;
    flex-direction: column;
    align-items: start;
    border-style: solid;
    border-color: green;
    border-width: 5px;

}



#novaPage {
  flex-direction: column;


 




  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
border-style: solid;
border-color: transparent;
  border-radius: 15px;

visibility: hidden;

  font-size: 20px;
  overflow: visible;


}

#novaPage h2 {


}

#novaTxt
{
  text-align: justify;
    font-size: 18px;
        width: 100%;
          margin-bottom: 25px;

}


#teamFotoAllContainer {
  width: 100%;
  height: 400px;
  left: 30px;
  border-style: solid;
  border-color: #A6B8CA;
  border-width: 3px;
  border-radius: 20px;
  overflow: hidden;
  background-color: black;
margin-bottom: 30px;
visibility: hidden;
background: url(team.jpg);
  background-position:  center top; /* Center the image */
    background-size: cover; /* Resize the background image to cover the entire container */
display: none;
}

.teamFotoAll {
  width: 100%;
    display: block;
  margin: auto;
  transform: translateX(-40px);

}



/* Section 2 */
#Sec2 {
  width: 100%;
  color: #2E5266FF;
  overflow-y: hidden;
  overflow-x: hidden !important;
}

#Page2 {
  flex-direction: column;
  font-size: 20px;
  overflow: visible;


}

.teamMember {
  top: 0px;
  width: auto;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: column;
  justify-content: left;
  align-items: start;
  text-align: left;
  font-size: 25px;
    visibility: hidden;
      -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
border-style: solid;
border-color: transparent;
  border-radius: 15px;
  margin-left: 20px;
  margin-right: 20px;
padding-left: 20px;
background-color: rgba(233, 232, 238, 0.1);
padding-top: 20px;
padding-right: 20px;
}

 .teamName {
position: relative;
text-align: left;
margin-bottom: 0;
width: fit-content;
 }



.teamPosition {

font-size: 14pt;
width: fit-content;
margin-bottom: 30px;
}



.teamAbout {
  top: 0px;
  width: 100%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 15px;
  display: flex;
  flex-direction: row-reverse;
  justify-content: left;
  align-items: start;
  text-align: justify;
  font-size: 25px;
}





.teamTxt {
  width: auto;

  padding-left: 30px;
  font-size: 17px;
  color: #FFFFFFFF;
  display: flex;
  flex-direction: column;
align-items: start;
  justify-content: center;
  margin-top: 10px;

}

.teamTxtTable {
width: auto;
display: flex;
  flex-direction: row;


}


.teamTxtTitle h1 {
width: 120px !important;  
font-family: "Nunito";
}


.teamTxtList {
    width: 100%;
    font-size: 16px;
    margin-left: 25px;
     padding-right: 20px;

  }
  .teamTxtList ul {
 margin-bottom: 12px;
  }

  


  .teamTxtList ul li {
 margin-bottom: 7px;
  }

.teamTxt h1 {
font-size: 17px;
}


.teamTxt p {
padding-bottom: 10px;
}



.teamMember:not(:last-of-type) {

margin-bottom: 30px;
}


.teamMemberTitle {
display:inline-block;
width: fit-content;
margin-left: 0;
}





  .teamFotoContainer {
  width: 250px;
  height: 250px;
  margin-top: 10px;
  border-style: solid;
border-color: white;
  border-width: 3px;
  border-radius: 20px;


  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
  vertical-align: middle;
  overflow: hidden;
  box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;

margin-bottom: 25px;

 }

#fotoMI {


background: url("/images/mi9991111.png"), linear-gradient(45deg, white, #C5E0F9, #C5E0F9, #C5E0F9, #C5E0F9, #C5E0F9, white);
  background-position:  center; /* Center the image */
    background-size: cover; /* Resize the background image to cover the entire container */

}


#fotoMT {


background: url("/images/foto_mt.png"), linear-gradient(45deg, white, #C5E0F9, #C5E0F9, #C5E0F9, #C5E0F9, #C5E0F9, white);
background-position: center, center center;


    background-size: cover; /* Resize the background image to cover the entire container */
  background-color: #A6B8CA;

}


#fotoTV {


background: url("/images/tv.png"), linear-gradient(45deg, white, #C5E0F9, #C5E0F9, #C5E0F9, #C5E0F9, #C5E0F9, white);
background-position: center;


    background-size: cover; /* Resize the background image to cover the entire container */
  background-color: #A6B8CA;

}



   .servicesFotoContainer {
  width: 100px;
  height: 100px;
  background-color: white;
  margin-top: 20px;
  margin-left: 20px;
  border-style: solid;
  border-color: #A6B8CA;
  border-width: 3px;
  border-radius: 100px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
  vertical-align: middle;
  overflow: hidden;
  box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;

 }



.teamFotoContainer .material-symbols-outlined {
  font-size: 100px;
  margin-top: 45px;
  height: 100px;
  color: white;

   }

.teamFoto {
  position: relative;
  width: 100%;
  height: 100%;
  display: none;
}




/* Section 3 */
#Sec3 {
  color: #2E5266;
  align-items: stretch;
display: none;
}

#Page3 {
  flex-direction: column;
background-color: transparent;
}




.servicesIcon {
  height: auto;
  width: 100%;
  display: flex;
  flex-direction: row;
  text-align: left;
  align-items: end;
}

.accordionServices {
  position: relative;
  width: 550px;
  margin-bottom: 30px;
  display: flex;
  flex-direction: column;
  text-align: left;
      background-color: rgba(233, 232, 238, 0.1);




  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  color: #3A3B3C;
  font-size: 22px;
  outline: none;
  border-style: solid;
  border-radius: 10px;
  border-color: transparent;
  transition: width 0.3s ease-out 0.5s, background-color 0.2s linear;
  visibility: hidden;
}



.accordionServices.active, .accordionServices.active:hover {

  width: 100%;
  transition: width 0.3s ease-out 0s, background-color 0.15s linear;
}

.accordionServices:hover  {

}


.accordionServices p {
  width: 510px;
  margin-top: 30px;
  padding-left: 15px;
  font-size: 18px;
}

.accordionServices h2 {
  width: calc(100% - 140px);
  margin-bottom: 12px;
    margin-left: 20px;

  color: white;
  font-size: clamp(18px, 5vw, 24px);
  font-weight: 700;
}

.accordionServices .material-symbols-outlined {
  margin-top: 20px;
  margin-right: 10px;
  margin-bottom: 15px;
  padding-left: 8px;
  color: rgb(58, 59, 60);
  font-size: 66px;
}

.testIcon {
  margin-top: 10px;
  border-radius: 25%;
  width: 65px;
  height: 65px;

  transition: opacity 0.5s;
display: none;

}

.testIconstatic {
  margin-top: 10px;
  border-radius: 25%;
  width: 65px;
  height: 65px;
display: block;

  transition: opacity 0.5s;
position: absolute;
}

.accordionServices.animate .testIcon {

display: block;

}

.accordionServices.animate .testIconstatic {

display: none;

}


.static {
  position: absolute;
  background: white;
    transition: opacity 0.3s;
    transition-delay: 0.75s;

 }



.accordionServices:hover .testIcon.static {

  opacity: 0;


}

.accordionServices.active:hover .testIcon.static {

  opacity: 1;


}

.panelServices {
  max-height: 0px;
  text-align: left;
  font-size: 20px;
  transition: max-height 0.5s ease-out 0s;
  overflow: hidden;

}

.accordionServices.active .panelServices {
  transition: max-height 0.5s ease-out 0.3s;

}

.panelServices p {
  width: calc(100% - 15px);
  padding-left: 15px;
  padding-bottom: 10px;
  margin-top: 5px;
  font-size: 18px;
}

.accordionServices .arrowContainer {
  border: none;
  background-color: transparent;
width: fit-content;
  text-align: center;
  width: 100%;
  padding-right: auto;
  padding-left: auto;
display: flex;
flex-direction: column;
height: auto;
justify-content: center;
align-items: center;
}

.arrowContainer p {
width: fit-content !important;

font-size: 12px;
font-weight: 700;
display:inline;
padding-left: 0;
margin-top: 20px;
  transition: all 0.25s ease, opacity 0.25s ease 0.3s;

border-bottom: 2px solid transparent;


}

.arrowContainer:hover p {


border-bottom: 2px solid rgba(194, 221, 228,0.7);;


}


.accordionServices .arrow {
  width: 15px;
  height: 15px;
  margin-bottom: 15px;


  display: inline-block;
  border-top: 3px solid rgba(194, 221, 228,0.7);
  border-right: 3px solid rgba(194, 221, 228,0.7);
  transform: rotate(135deg);
  transition: all 0.5s ease;
  overflow: visible;
}

.accordionServices.active .arrow {
  margin-top: 10px;
  transform: rotate(-45deg);
  transition: all 0.5s ease 0.3s;
}

.readMore {
      opacity:1;

    transition: all 0.25s ease 0.5s;

}

.accordionServices.active .readMore {
        transition: opacity 0.25s ease;


}


/* Section 4 */
#Sec4 {
  align-items: start;
}

#Page4 {
  height: 100%;
  flex-direction: column;
}


/* Section 5 */
#Sec5 {
  height: auto;
    min-height: initial;
    display: none;


}

#Page5 {
  flex-direction: column;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
border-style: solid;
border-color: transparent;
  border-radius: 15px;



}




#faqAccordion {

    visibility: hidden;

}

.accordion {
  position: relative;
  width: 100%;
  border: none;
  outline: none;
  background-color: transparent;
  border-top: 1px solid rgba(194, 221, 228,0.7);
  display: flex;
  flex-direction: row;
  text-align: left;
  color: #3A3B3C;
  font-size: 1.25em;
  cursor: pointer;
  transition: 0.4s;
}

.accordion.active, .accordion:hover {
  background-color: #2E5266FF;
}

.accordion p {
  margin-top: 10px;
  margin-bottom: 10px;
}

.accordion.active p, .accordion:hover p {
  color: white;
}

.accordion .arrow {
  height: 15px;
  width: 15px;
  margin: 25px;
  display: inline-block;
  border-top: 2px solid rgba(194, 221, 228,0.7);
  border-right: 2px solid rgba(194, 221, 228,0.7);
  transform: rotate(135deg);
  transition: all 0.5s ease;
  overflow: visible;
}

.accordion:hover .arrow{
  border-color: white;
}

.accordion div.active .arrow {
  border-color: white;
  transform: rotate(-45deg);
}

.panel {
  max-height: 0px;
  text-align: left;
  font-size: 1.1em;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.panel p {
  padding-left: 65px;
  padding-top: 10px;
  padding-bottom: 10px;
  color: #FFFFFFFF;
}







#contactSec {

min-height: 0;


}

#contactPage {
  width: calc(100% - 40px);
  max-width: 610px;



  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
border-style: solid;
border-color: transparent;
  border-radius: 15px;
  flex-direction: column;
  margin-bottom: 30px;
  margin-right: auto;

visibility: hidden;

}


#contactPage iframe{

height: 515px;
width: 100%;
max-width: 600px;
  border: none;
  overflow-x: hidden !important;
margin-right: auto;
}

#content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;


align-items: start;
justify-content: left;
}























/* Section 6 */
#Sec6 {
  height: auto;
  min-height: 0;


   color: white;
  z-index: 1;
       background-color: rgba(5, 8, 17, 0.5);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
margin-top: 50px;
padding-top: 30px;
padding-left: 20px !important;
  padding-right: 20px !important;
  visibility: visible !important;
  justify-content: center;
  align-items: center;
}

#Page6 {
  width: 100%;
  max-width: 1000px;
  height: auto;
  margin-top: 0;
  margin-bottom: 0;

margin-left: auto;
margin-right: auto;

  flex-direction: column;
  justify-content: left;
  text-align: left;
  color: white;
  z-index: 1;
    flex-direction: row;
    flex-wrap: wrap;
       background-color: transparent;
visibility: visible;


}

#Page6 h1 {
  width: 100%;
  margin-bottom: 15px;
  margin-left: 0 !important;
  color: white;
}

#Page6 h2 {
  width: 100%;
  margin-bottom: 15px;
  color: white;
  font-size: 20px;
  font-weight: 400;
}

#Page6 p, #Page6 a {
  height: auto;
  width: auto;
  margin-right: auto;
  align-items: center;
  color: white;
  font-size: 13px;
  font-weight: 400;
  z-index: 1;
}

#Page6 a p {
  height: auto;
  align-items: center;
  z-index: 1;

}

#footerOthers, #footerLinks {
margin-top: 20px;
  flex-basis: 100%;
  width: 100%;
}

#footerLinks a {

text-decoration: underline;

}

#footerContacts {

margin-left: 30px;
}
#footerContacts p {
  color: white;
font-size: 13px;
  border-bottom: 2px solid transparent;
  transition: all 0.25s ease;

}

#footerContacts a .contactIconsPNG {
position: relative;
margin-top: 10px;
top: 0;

margin-bottom: 10px;
margin-right: 10px;
margin-left: 0 !important;
}




#footerContacts a {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
height: 45px;


}


#footerContacts a p {

  background: linear-gradient(#C5E0F9 0 0) 
    bottom left/
    var(--underline-width, 0%) 2px
    no-repeat;
  color: white;
  display: inline-block;
  padding-bottom: 3px;
  text-decoration: none;
  transition: background-size 0.5s;

}

#footerContacts a:hover p {
  --underline-width: 100%;


}





#footerLogoContainer {
  top: 75px;
  width: 120px;
margin-left: 20px;
  text-align: left;
  vertical-align: top;
margin-top: 2px;
margin-bottom: 2px;


}


#footerLogo {
  height: 100px;
          filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.5));

}

#footerLogo:hover {
   animation: glow 1.5s ease-in-out infinite;

}




@keyframes glow {
  0% {
    filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.5));
  }
  50% {
    filter: drop-shadow(0 0 15px rgba(255, 255, 255, 0.7));
  }
  100% {
    filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.5));
  }
}


/* Entry animations */
.animate__animated {
  animation-name: zoomIn; /* referring directly to the animation's @keyframe declaration */
  animation-duration: 1.2s; /* don't forget to set a duration! */
}

nav.animate__animated, #hamburger.animate__animated, #language-selector.animate__animated {
  animation-name: fadeInDown; /* referring directly to the animation's @keyframe declaration */
  animation-duration: 0.5s; /* don't forget to set a duration! */
  animation-delay: 1.3s;
}


#contactLinks {
  animation-name: fadeInUp; /* referring directly to the animation's @keyframe declaration */
  animation-duration: 0.5s; /* don't forget to set a duration! */
  animation-delay: 1.3s;
}
































/* Background animation */
#canvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-image: radial-gradient(farthest-side, #0b1f3a, #050811);
}

#backgroundtrans {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
background-color: black;


}

#backgroundtrans.fade {

  animation: mymove 1s ease-out forwards;
  animation-delay: 0.4s;

}

@keyframes mymove {
  from {opacity: 1;}
  to {opacity: 0;}
}




/* Responsive */

@media (max-width: 490px) {
  #Page6 {
    flex-direction: column;
justify-content: left;
  }

  #footerLogoContainer {
    margin-right: auto;
  }

  #footerContacts {
    margin-left: 0;
    margin-right: auto;
  }



}




@media (max-width: 500px) {

.teamTxtTable {

  flex-direction: column;


}

}


@media (max-width: 700px) {


.contactIcons:hover  {

    transition: all 0.5s;


}


.contactIconsPNG {

    transition: max-width 0.5s;

}



.contactIcons:hover .contactIconsPNG {

 max-width: 0;

}


.contactIcons a {

margin-right: 30px;

}


.teamTxtTitle h1 {
margin-left: 5px;
}



  /* Development Banner */
#developmentBanner {

display: flex;
flex-direction: column;

}

#developmentIconContainer {
position: initial;
  margin-left: auto;
margin-right: auto;
}

#developmentContainer {
  margin-top: 30px;
  width: 100%;
}




  /* Section 1 */



  /* Section 2 */
  


/* Section 2 */



.teamAbout {

flex-direction: column-reverse !important;

 }

 .teamTxt {

  width: 100% !important;
  padding-left: 0 !important;
    padding-right: 0 !important;

 }

#Page2  {

width: 100%;
 }


.teamMemberTitle  {

  margin-left: 0 !important;

 }


.teamFotoContainer {


margin-left: auto !important;
margin-right: auto !important;
margin-top: 10px;

margin-bottom: 10px;

}

.teamAbout {
  margin-bottom: 7px;
}


  #aboutHeader h2 {
    padding-right: 0;
  }

  #about {
    flex-direction: column-reverse;
    width: 100%;
    align-items: revert;
  }

  #aboutTxt {
    width: 100%;
    padding-right: 0;
  }

  .teamfotoContainer {
    margin-left: calc(50vw - 130px);
    margin-top: 20px;
    margin-bottom: 50px;
  }




  /* Section 3 */
  .accordionServices {
    width: 100%;
  }

  .accordionServices p {
    width: calc(100% - 15px);
  }

  .panelServices, .accordionServices.active .panelServices {
    transition: max-height 0.5s ease-in-out;
  }

  .accordionServices div.active .arrow {
    transition: all 0.5s ease 0s;
  }

  .accordionServices.active .arrow {
    transition: all 0.5s ease;
  }

}





#newsvg1 {
  position: absolute;
height: 50px;
width: 332.15px;
z-index: 2;

    left: calc(50vw - 166.075px) !important; /* Center horizontally */
top: calc(50vh - 25px);
}


#newsvg1.fixed {
      position: fixed;
top: calc(50svh - 25px) !important; /* Center vertically */



}


#newsvg1.fixed2 {
      position: fixed;

top: 0 !important;


}


#svg1 {
  position: absolute;
  top: 5px;
  left: calc(50% - 20px);
height: 40px;

        filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.5));

}

#svg1.entry {
  visibility: hidden;

  animation-duration: 1.2s;
  animation-delay: 0s;
  animation-name: animate-pop;
  animation-fill-mode: forwards; /* new line */
}

@keyframes animate-pop {
  0% {
        opacity: 0;
visibility: visible;

    transform: scale(0, 0);
  }

  60% {
        opacity: 1;

    transform: scale(1.5, 1.5);

  }

  100% {
            opacity: 1;
visibility: visible;

    transform: scale(1, 1);
  }
}


#svg1:hover {
    }


#svg2 {
  position: absolute;
  top: 25px;
  left: 2px;
height: 26px;
    transition: opacity 0.3s ease 0.5s;

}

#svg2.active {

  opacity: 0;
    transition: opacity 0.3s ease;

}

.magictime.puffIn{
animation-duration: 1s;
    animation-delay: 0.5s;


}


.magictime.spaceInDown {
    animation-delay: 2s;


}

.hidden {

  display: none !important;
}


#formButton
 {

width: auto;
height: auto;

}