/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display: block;
}

ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}


body{
  font-family: 'Montserrat', sans-serif;
  color: #1a1a18;
  text-decoration: none;
  font-weight: 600;
  font-style: normal;
  font-size: 14px;
  line-height: 1.4;
  transition: opacity 0.5s ease-in-out;
  font-display: swap;
}

.page-wrapper{
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  flex-direction: column;
  min-height: 100vh;  
  gap: 0px;
}

.page-wrapper > *{

  width: 100%;
}

:root{
  --text: #1a1a18;
  --accent: #c21717;
  --grey: grey;
  --border: ;  
  --width: 1360px;
}


body, html {
  -ms-overflow-style: none;  /* Internet Explorer 10+ */
  scrollbar-width: none;  /* Firefox */
}
body::-webkit-scrollbar, html::-webkit-scrollbar { 
  display: none;  /* Safari and Chrome */
}
header{
  display: grid;
  grid-template:
  "left center right" auto / 1fr auto 1fr ;
  align-items: center;
  padding: 10px 30px;
  gap: 30px;
  padding-top: 28px;
}

a{
  color: var(--text);
  text-decoration: none;
  font-style: normal;
  font-weight: 600;
  transition: 300ms ease;
}

h1{
  font-size: 14px;
  line-height: 1.4;
  margin-bottom: 10px;
}

h2{
  font-size: 14px;
  line-height: 1.4;
  margin-bottom: 10px;
}

h3{
  font-size: 14px;
  line-height: 1.4;
  margin-bottom: 10px;
}

h4{
  font-size: 14px;
  line-height: 1.4;
  margin-bottom: 10px;
}

p{
  font-weight: 400;
}

p b{
  font-weight: 600;
}

a:hover{
  color: var(--accent);
  transition: 150ms ease;
  text-decoration: underline;
}


.logo img,
.logo svg{
  height: 80px;
  width: auto;
}

.logo svg .st0{
  fill-rule:evenodd;
  clip-rule:evenodd;
  fill:#1A1A18;
}
.logo.active svg .st0{
  fill: var(--accent);
  transition: all 600ms ease;
}
.logo:hover svg .st0{
  fill: var(--accent);
}
.logo{
  margin-right: 177px;
}

section{
  padding: 15px 0px 30px;
  max-width: var(--width);
  margin: 0 auto;
}
section.embla{
  padding: 0px;
}
section.embla{
  margin-top: 25px;
  margin-bottom: 40px; 
}
section.embla:not(.has-features){
  margin-bottom: 61px;
}
.logo-container a{
  display: inline-block;
}

.logo-container {
  text-align: right;
}

header .logo-container{
  display: grid;
  grid-area: left;
}

header .main-nav{
  display: grid;
  grid-area: center;
}

header .secondary-nav{
  display: grid;
  grid-area: right;
}


nav ul{
  display: flex;
  gap: 15px;
}

ul{
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

.main-nav ul{
  justify-content: center;
}

.main-nav ul li span{
  font-weight: 600;
}

.secondary-nav ul{
  justify-content: flex-end;
}
.secondary-nav{
  display: flex;
  justify-content: flex-end;
}

.secondary-nav .column-nav ul{
  flex-direction: column;
  gap: 0px;
  justify-content: flex-end;
  align-items: flex-end;
}
.secondary-nav a{
  text-align: right;
}
nav ul a{
  font-size: 16px;
  transition: 300ms ease;
}


a.active{
  color: var(--accent);
}

.secondary-nav ul li a{
  font-weight: 400;
  font-size: 14px;
}


footer .footer-container{
  max-width: var(--width);
  margin: 0 auto;
  text-align: center;
  border-top: 1px solid var(--border);
  padding: 15px 15px;
}

.footer-container nav ul{
  justify-content: center;
}

.footer-container nav ul a,
.footer-container nav ul p{
  font-size: 14px;
  font-weight: 400;
}



.embla{
  position: relative;
  overflow: visible!important;
  max-width: var(--width);
}

.embla__viewport{
  overflow: hidden;
}

.embla .embla__button{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 999;
}

.embla .embla__button.embla__button--prev{
  left: -100px;
}


.embla .embla__button.embla__button--next{
  right: -100px;
}

.embla__slide .project-link{
  display: block;  
}

.embla__slide .project-link:not(:last-of-type){
  margin-bottom: 10px;
}

.embla__button__svg path{
  fill: var(--text);
}

.embla .embla__button{
  background-color: transparent;
}

.embla .embla__button:hover{
  transform: translateY(-50%) scale(1.2);
  background-color: transparent;
}


.embla__slide .project-link img{
  height: 200px;
  width: 100%;
  object-fit: cover;
  opacity: 0.8;
}

.project-feautures .feautures{
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 15px;
  justify-content: space-between;
}

.project-feautures .feautures p{
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2;

}

.project-feautures .feautures p.title{
  margin-bottom: 2px;
}

.project-feautures .feautures p.value{
  font-weight: 500;
}

.inline-btn{
  text-align: center;
}


a.content-trigger{
  font-size: 14px;
}

.ginner-container .gslide-inline{
  background: rgba(255,255,255,0.95);
}

.glightbox-clean .gslide-media{
  box-shadow: 0px 5px 30px rgba(0,0,0,0.2);
}

.goverlay{
  background: rgba(255,255,255,0.9)!important;

}
.glightbox-container.glightbox-clean{

}

.glightbox-clean .gclose path, .glightbox-clean .gnext path, .glightbox-clean .gprev path{
  fill: var(--text);
}

.glightbox-clean .gclose, .glightbox-clean .gnext, .glightbox-clean .gprev{
  background-color: transparent;
  transform: 150ms ease;
}

.glightbox-clean .gclose:hover, .glightbox-clean .gnext:hover, .glightbox-clean .gprev:hover{
  background-color: transparent;
  transform: scale(1.2);
}

section.about{
  max-width: var(--width);
}

.about-columns{

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.about-columns .column{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.about-columns .column:first-of-type{
  max-width: 550px;
}

.about-row{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 15px;
}

.about-row .title{
  max-width: 115px;
  width: 100%;
}

.about-row .title p{
  font-weight: 600;
}

.about-row .info{
  flex: 1;
}

.about-row .info{
  display: flex;
  flex-direction: column;
  gap: 14px;
  
}

.about-row .info p{
  font-size: 14px;
}

.about-row p{
  line-height: 1.6;
}

.page-content .inner-section{
  margin-bottom: 25px;
}
.page-content,
.about{
  padding-top: 25px; 
  min-height: 731px; 
}
.page-content ul{
  list-style-type: disc;
  padding-left: 20px;
  margin-top: 10px;
}

.page-content ul li{
  font-weight: 400;
}

.page-content ul li b,
.page-content ul li strong{
  font-weight: 600;
}

.page-content p a{
  font-weight: 400;
}

.embla__container{
  min-height: 645px;
}

.page-content{
  display: flex;
  justify-content: center;
  align-items: center;
}

.preloader{
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  visibility: hidden;
  height: 0px;
  width: 100%;
  opacity: 0;
  z-index: 9999999999;
  transition: 0ms;
}
.about p a{
  font-weight: 400;
}
.preloader img{
  height: 200px;
  width: auto;
  animation: fadeInOut 1800ms ease infinite;
}
body:has(.preloader.loading):has(.preloader.almost-done){
  overflow: hidden;
}
.preloader.loading{
  visibility: visible;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(255,255,255,1);
  opacity: 1;

  transition: 300ms ease;
}

.preloader.almost-done{
  background-color: rgba(255,255,255,1);
  opacity: 1;
  height: 100%;
  transition: 300ms ease;
}

.preloader.done{

 visibility: visible;
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;  
 height: 100%;  
 width: 100%;
 opacity: 0;
 background-color: rgba(255,255,255,1);
 transition: 300ms ease;
}


@keyframes fadeInOut{
  0%{
    opacity: 0.4;
  }

  70%{
    opacity: 1;
  }

  100%{
    opacity: 0.4;
  }

}


.embla__slide .project-link img{
  filter: grayscale(100%);
  transition: 300ms ease;
}


.embla__slide .project-link:hover img{
  filter: grayscale(0%);
  transition: 600ms ease;
  opacity: 1;
}


.not-found{
  text-align: center;
}
.not-found-logo img{
  height: 150px;
  opacity: 0.8;
}


.about.not-found-page{
  height: auto;
  min-height: auto;
}

@media screen and (max-width:1360px){
  .page-wrapper{
    padding: 0px 30px;
  }
}

@media screen and (max-width: 768px){
  header{

    grid-template:
    "left left right" 
    "center center center" ;
    grid-auto-rows: auto;
    gap: 10px;
    padding: 10px;
    align-items: start;

  }

  .logo{
    margin-right: 0px;
  }
  .logo-container{
    text-align: left;
  }

  .main-nav ul{
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
  }
  .secondary-nav .column-nav ul{
    gap: 5px;
  }


  .footer-container nav ul{
    flex-wrap: wrap;
    row-gap: 5px;
    column-gap: 10px;
  }
  .embla__viewport{
    padding-bottom: 50px;
  }

  .embla .embla__button{
    top: auto;
    bottom: 0;    
    transform: translateY(0) ;
  }

  .embla .embla__button.embla__button--next{


    right: 0px;
  }

  .embla .embla__button.embla__button--prev{

    left: 0px;
  }

  .embla{
    --slide-size: 100%;
    

  }
  section.embla{
    margin-bottom: 0px;
    margin-top: 15px;
  }
  .embla .embla__button:hover{
    transform: translateY(0);
  }

  .project-feautures .feautures{
    flex-wrap: wrap;
    row-gap: 5px;
    column-gap: 20px;
    
  }

  .project-feautures .feautures .feauture{
    flex: 33%;
  }

  .about-columns{
    flex-direction: column;
  }


  .about-row .title{
    max-width: 100px;
  }

  .about-row .title p{
    font-size: 14px;
  }



  .page-wrapper{
    padding: 0px 10px;
  }
  section.embla:not(.has-features){
    margin-bottom: 0px;
  }
}



 
.inner-section p{
  font-size: 14px;
}



@view-transition {
  navigation: auto;
}


body {
      transition: opacity 1s ease-in-out;
      opacity: 1; /* Default opacity */
    }
    .fade-out {
      opacity: 0; /* Set opacity to 0 when fading out */
    }



.img-header{
  
  max-width: var(--width);
  
  
  padding-top: 15px;
  text-align: center;
}

.img-header .left{
  text-align: left;
}

.img-header img{
max-width: 100%;

height: auto;

}

.img-header > div{
  flex: 1;
}

.img-header .right{
display: flex;
justify-content: space-between;
align-items: center;
gap: 30px;
}

header .secondary-nav li{
text-align: right;
}


.gov-info{
margin-top: 15px;
}
.gov-info > p{
   margin-bottom: 10px;
}
.stupid-links{
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;

}

.stupid-links .left{
text-align: right;
}

.stupid-links .right{
text-align: left;
}
.stupid-links .fourtwenty{
padding: 5px 15px;
border-radius: 0px 30px 30px 0px ;
background-color: #ffc20e;
color: white;
font-size: 19px ;
font-weight: 600;
font-style: italic;
}


@media screen and (max-width: 768px){
  .img-header img{
    max-height: 25px;
  }
  .img-header .right{
    gap: 15px;
  }

  .stupid-links .left{
text-align: center;
}
.stupid-links .right{
text-align: center;
}
}