/******************************************/
/** General                              **/
/******************************************/

:root {
   --primary: #015397;
   --secondary: #5B6670;
   --headline: #003F74;
   --text: #6C7680;
   --breadcrumbs: #485E73;
   --link: #B6C7DB;
   --link-active: #DCE4EE;
   --complementary: #FEFCF9;
   --gray-blue: #F8FAFC;
   
   --history: #EC661B;
   --sports: #FFAE00;
   --visit: #965C02;
   --nature: #A8BF00;
   --food: #9CCB44;
   --events: #9300E2;
   --library: #E73B33;
   
   --black: #000000;
   --gray: #555555;
   --light: #F9F8F5;
   --white: #ffffff;
}

*, *::before, *::after {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
}

html, body {
   min-height: 100vh;
   min-height: 100dvh;
   color: var(--text);
   background-color: var(--white);
   font-family: "Lexend Deca", sans-serif;
}

/******************************************/
/** Helpers                              **/
/******************************************/

/* Colors */

.text-primary {color: var(--primary) !important;}
.text-secondary {color: var(--secondary) !important;}
.text-headline {color: var(--headline) !important;}
.text-link {color: var(--link) !important;}
.text-link-active {color: var(--link-active) !important;}
.text-library {color: var(--library) !important;}
.text-nature {color: var(--nature) !important;}
.text-text {color: var(--text) !important;}

.hover\:text-primary:hover {color: var(--primary) !important;}
.hover\:text-white:hover {color: var(--white) !important;}

.shadow{
   box-shadow: 0 0.2rem 0.5rem rgba(55, 55, 55, 0.2) !important;
}
.shadow:hover, .card:hover{
   box-shadow: 0 0.1rem 0.3rem rgba(55, 55, 55, 0.1)  !important;
}
.shadow:hover .plusHover, .card:hover .plusHover, .home-category-card:hover .plusHover{
   transition: all linear .2s;
   transform: rotate(90deg) scale(1.2) !important;
}


a{
   text-decoration:none !important; 
   color:var(--primary) !important;
}



.bg-primary {background-color: var(--primary) !important;}
.bg-headline {background-color: var(--headline) !important;}
.bg-history {background-color: var(--history) !important;}
.bg-sports {background-color: var(--sports) !important;}
.bg-visit {background-color: var(--visit) !important;}
.bg-food {background-color: var(--food) !important;}
.bg-events {background-color: var(--events) !important;}
.bg-library {background-color: var(--library) !important;}
.bg-complementary {background-color: var(--complementary) !important;}
.bg-gray-blue {background-color: var(--gray-blue) !important;}
.bg-light {background-color: var(--light) !important;}

.hover\:bg-primary:hover {background-color: var(--primary) !important;}

.border-primary {border-color: var(--primary) !important;}

/* Fonts */

.fs-7 {font-size: .95rem;}
.fs-8 {font-size: .8rem;}
.fs-9 {font-size: .7rem;}




/* Sizes */

.button {padding: 15px 25px;}

.w-fit {width: fit-content;}
.w-screen {width: 100vw; width: 100dvw;}
.h-screen {height: 100vh; height: 100dvh;}

/* Components */

.icon-md {
   width: 30px;
   height: 30px;
   min-width: 30px;
   min-height: 30px;
}

.icon-lg {
   width: 40px;
   height: 40px;
   min-width: 40px;
   min-height: 40px;
}

/* Animations */

.transition-03 {
   transition: all linear .3s;
   -o-transition: all linear .3s;
   -moz-transition: all linear .3s;
   -webkit-transition: all linear .3s;
}

.shadow:hover .imgZoom, .shadow-sm:hover .imgZoom, .imgZoom:hover {
   transform: scale(1.05);
   transition: all linear .3s;
   -o-transition: all linear .3s;
   -moz-transition: all linear .3s;
   -webkit-transition: all linear .3s;
}

/******************************************/
/** Navbar                               **/
/******************************************/

#navbar.navbar-shrink {
   padding: 0.8rem 0 !important;
   box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);
   background-color: var(--headline) !important;
}

#navbar.navbar-shrink.alt {background-color: var(--white) !important;}

#navbar.navbar-shrink .logo {width: 150px;}

/* Submenus */

.nav-item.submenu .submenu-content {
   left: 50%;
   display: none;
   width: max-content;
   transform: translateX(-50%);
}

.nav-item.submenu:hover .submenu-content {display: block;}
.nav-item .nav-link.active {
   color:var(--primary) !important;
}


.offcanvas{
   background: var(--primary) !important;
}


@media (max-width: 1023.98px){
   /* #navbar.navbar {background: var(--primary) !important;} */
   #navbar.navbar a, #navbar.navbar span {color: var(--white) !important;}
   #navbar.navbar svg,  #navbar.navbar svg path {fill: var(--white) !important;}
   #navbar.navbar .btnClose{
      border-color: #003F74 !important;
   }
   #navbar.navbar .btnClose svg, #navbar.navbar .btnClose svg path {fill: var(--primary) !important;}
}


/******************************************/
/** Footer                               **/
/******************************************/

footer .two-columns {
   column-count: 2;
   column-gap: 2rem;
}

/******************************************/
/** Banner                               **/
/******************************************/

.banner {
   height: 300px;
}
.bannerPages {
   height: 450px;
}

.banner > .overlay {
   mix-blend-mode: hard-light;
   background: linear-gradient(0deg, #FEFCF9 0%, #F8FAFC 100%);
}

/* Breadcrumbs */

.breadcrumb-wrapper {--bs-breadcrumb-divider: '>';}

/******************************************/
/** Home                                 **/
/******************************************/

#hero {
   height: 74vh;
   height: 74dvh;
}

#hero .overlay {background: linear-gradient(360deg, rgba(1, 40, 73, 0.2) 0%, rgba(1, 40, 73, 0.6) 100%);}

#hero .splide__arrows.splide__arrows--ltr {
   height: 100%;
   display: flex;
   align-items: center;
   justify-content: flex-end;
}

#hero .splide__arrow {
   left: 0;
   right: 0;
   width: 50px;
   height: 50px;
   position: relative;
   margin: 0 1rem 5rem 0;
}

@media (min-width: 1199.98px){
   #hero .splide__slide .fs-1 {font-size:3.2rem !important;
      line-height: 3.4rem !important;
   }
}



/* Category cards */

.home-category-card:hover .overlay {opacity: .5 !important;}

/* Service cards */

.home-service-card .overlay {background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 63, 116, 0.4) 100%);
}

/* News grid */

/* .home-news-grid {
   display: grid;
   grid-row-gap: 1rem;
   grid-column-gap: 1rem;
   grid-template-rows: repeat(3, 1fr);
   grid-template-columns: repeat(2, 1fr);
}

.home-news-grid > .main { grid-area: 1 / 1 / 4 / 2; }
.home-news-grid > .destaqueOne { grid-area: 1 / 2 / 2 / 3; }
.home-news-grid > .destaqueTwo { grid-area: 2 / 2 / 3 / 3; }
.home-news-grid > .destaqueThree { grid-area: 3 / 2 / 4 / 3; } */

/* Bottom columns */

.home-bottom-column .content {padding-left: 6rem !important;}

.home-bottom-column .animation-link {
   opacity: 0;
   transition: all linear .3s;
   transform: translateY(-5px);
}

.home-bottom-column:hover .animation-link {
   opacity: 1;
   transform: translateY(0);
}

/******************************************/
/** Cidade                               **/
/******************************************/

.population-container {margin-top: -100px;}
@media (min-width: 1365.99px){
   .cidade-columns {
      column-count: 2;
      column-gap: 2rem;
   }
}

/******************************************/
/** Conhecer                             **/
/******************************************/

#conhecerMainCarousel .splide__slide {height: 450px;}

#conhecerThumbsCarousel .splide__slide {
   opacity: .6;
   height: 80px;
   cursor: pointer;
   transition: opacity .3s ease;
}

#conhecerThumbsCarousel .splide__slide.is-active {opacity: 1;}
#conhecerThumbsCarousel .splide__slide:hover {opacity: 0.8;}

#conhecerThumbsCarousel .splide__track--nav > .splide__list > .splide__slide.is-active {border: 3px solid var(--primary);}

#visitarMap {height: 400px;}

/******************************************/
/** Contactos                            **/
/******************************************/

.contacts-grid {
   display: grid;
   grid-row-gap: 20px;
   grid-column-gap: 20px;
   grid-template-rows: repeat(3, 1fr);
   grid-template-columns: repeat(4, 1fr);
}

.contacts-grid > .junta {grid-area: 1 / 1 / 2 / 2;}
.contacts-grid > .contacts {grid-area: 2 / 1 / 3 / 2;}
.contacts-grid > .schedule {grid-area: 1 / 2 / 3 / 3;}
.contacts-grid > .emails {grid-area: 3 / 1 / 4 / 3;}
.contacts-grid > .image {grid-area: 1 / 3 / 4 / 5;}

#contactsMap {height: 400px;}

/******************************************/
/** Forms                                **/
/******************************************/

.form-select,
.form-control,
.input-group {
   border-radius: 8px;
   border: 1px solid #D9D9D9;
}

.input-group:active,
.input-group:focus,
.input-group:focus-within,
.form-select:active,
.form-select:focus,
.form-control:active,
.form-control:focus {
   box-shadow: none;
   border-color: var(--primary);
   background-color: transparent;
}

.input-group.disabled,
.form-control:disabled,
.form-select:disabled {
   border-color: #D9D9D9 !important;
   background-color: #D9D9D9 !important;
}

.form-check-input {
   min-width: 1em !important;
   min-height: 1em !important;
}

.form-check-input:checked {
   border-color: var(--primary) !important;
   background-color: var(--primary) !important;
}

.form-check-input:focus {
   box-shadow: none;
   border-color: #D9D9D9 !important;
}

::placeholder {
   opacity: 1;
   color: var(--gray) !important;
}
::-ms-input-placeholder {color: var(--gray) !important;}