:root{
   --main-color: rgba(0, 85, 139, 255);
   --text-color: rgb(0, 0, 0);
   --black-color: rgb(0, 0, 0);
   --white-color: rgb(255, 255, 255);
   
   --header-height: 122px;
   --footer-height: 102px;
}

.open-sans-regular{
   font-family: "Open Sans", sans-serif;
   font-optical-sizing: auto;
   font-weight: 400;
   font-style: normal;
   font-variation-settings: "wdth" 100;
}

.bg-main{
   background-color: var(--main-color);
}

.button-main{
   background-color: var(--main-color);
   color: var(--white-color);
   text-decoration: none;
   font-size: 16px;
   font-weight: 600;
   padding: 10px 20px;
   border-radius: 5px;
   border: none;
   cursor: pointer;
   transition: all 0.3s ease-in-out;
}

.button-main:hover{
   background-color: var(--black-color);
   color: var(--white-color);
}

.main-layout{
   display: flex;
   flex-direction: column;
   height: 100%;
   min-height: calc(100vh - var(--header-height));
}

.inner-header{
   height: var(--header-height);
   padding-top: 10px;
   padding-bottom: 10px;
}

.logo-page{
   max-width: 194px;
}

.nav-item{
   margin-right: 40px;
}

.custom-link{
   color: var(--text-color);
   transition: color 0.3s ease-in-out;
}

.custom-link i{
   font-size: 1.08rem;
}

.custom-link:hover{
   color: var(--main-color);
}

.title-container{
   margin-top: 90px;
   margin-bottom: 90px;
}

.title{
   font-size: 18px;
   font-weight: 300;
   color: var(--text-color);
   text-align: center;
   margin: 0;
   line-height: 1.7;
}

.animation-fade-in{
   opacity: 0;
   visibility: hidden;
   animation: 1s fadeIn 0.5s forwards;
}

.custom-gallery{
   margin-left: -15px;
   margin-right: -15px;
}

.custom-gallery .gallery-item{
   padding: 0 15px;
   margin-bottom: 0px;
}

.text-contact-container{
   margin-top: 90px;
   margin-bottom: 90px;
}

.text-contact{
   color: var(--text-color);
   font-size: 18px;
   font-weight: 300;
   margin-bottom: 0px;
   text-decoration: none;
   transition: color 0.3s ease-in-out;
}

.text-contact i {
   font-size: 0.8rem;
   transition: color 0.3s ease-in-out;
}

.text-contact:hover,
.text-contact:hover i{
   color: var(--main-color);
}

.text-important{
   font-weight: 600;
   font-size: 18px;
   margin-top: 30px;
   margin-bottom: 34px;
   color: var(--black-color);
   text-align: center;
   text-transform: uppercase;
}

.inner-footer{
   min-height: var(--footer-height);
   padding-top: 14px;
}

.text-footer{
   font-size: 16px;
   font-weight: 300;
   color: var(--white-color);
   text-align: center;
   line-height: 1.5;
}

.error-title{
   font-size: 80px;
   font-weight: 600;
   color: var(--text-color);
   text-align: center;
}

.error-subtitle{
   font-size: 20px;
   font-weight: 400;
   color: var(--text-color);
   text-align: center;
}

.btn-privacy-policy{
   font-size: 14px;
   font-weight: 300;
   color: var(--white-color);
   text-align: center;
   line-height: 1.5;
   background-color: transparent;
   border: none;
   text-decoration: none;
   transition: color .3s ease-in-out;
}

.btn-privacy-policy:hover{
   color: var(--black-color);
}

.btn-privacy-policy:focus,
.btn-privacy-policy:focus-visible{
   outline: none;
}

@keyframes fadeIn {
   0% {
      opacity: 0;
      visibility: hidden;
   }
   100% {
      opacity: 1;
      visibility: visible;
   }
}