:root {
	--cremaAgria: #eae9e5;
	--cremaAgriaLighter: #f1f1f0;
	--cremaAgriaLighterLighter: #fbfbfb;
	--cremaAgriaTrans: #eae9e5cc;
	--cremaAgriaTransLighter: #f4f4f4cc;
	--deepBlue: #293c65;
	--deepBlueOpaque: #293c65c4;
	--mutedBlue: #5d7a8f;
	--foamBlue: #cbd8e0;
	--foamBlueLighter: #e1ebf1;
	--lightBlue: #d4e1e9;
	--seaGreen: #659282;
	--tealHighlight: #2f9a9a;
	--tealHighlightTrans: #2f9a9a38;
	--seaGray: #aab3b9;
	--sandGray: #d0d1d3;
	--mochaDark: #444240;
	--mochaMed: #6d675f;
	--cafeLeche: #a18465;
}
.atfContainer-fluid.topBanner {
	height: 25px;
	padding: 0 16px;
	position: fixed;
	top:0;
	left: 0;
	background-color: var(--mochaDark);
	z-index: 1500;
}
nav.navbar {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 1030;
	padding-top: 0;
	max-width: 100vw;
}
nav.navbar.brandLeft {
	height: 60px;
	padding-left: 16px;
	margin-right: 0;
}
nav.navbar.brandCenter {
	top: 25px;
	padding-left: 0;
}
nav .navbar-brand {
	position: absolute;
	top: 0;
	left: 16px;
	background-image: url("../imgs/nav-logo-bg.jpg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	padding: 8px;
	z-index: 20;
}
nav.brandLeft .navbar-brand.bgTransparent {
	background-image: none;
	background-color: transparent;
	padding: 8px 0;
}
nav .navbar-brand img {
	width: auto;
	height: 55px ;
	transition: height .3s ease-out;
}
nav .navbar-brand.shrink {
	padding: 8px;
	border-bottom-left-radius: 15px;
	left: 0;
	transition: left .3s ease-out;
}
nav .navbar-brand img.smaller {
	height: 44px;
}
nav.brandLeft .navbar-brand img {
	height: 44px;
	width: auto;
}
button.navbar-toggler {
	border: 1px solid transparent;
	border-radius: 0;
	padding-right: 0;
}
button.navbar-toggler:focus {
	box-shadow: 0 0 transparent;
}
.atfContainer {
	width: 100%;
	margin: 0 16px;
}
.navbar > .atfContainer {
	display: flex;
	flex-wrap: inherit;
	align-items: flex-start;
	justify-content: end;
	padding-top: 10px;
}
nav.navbar.brandLeft > .atfContainer {
	border-bottom-left-radius: 15px;
}
nav.navbar .atfContainer.navOutter {
	height: 60px;
	position: relative;
	background-color: var(--cremaAgriaLighter);
	border-bottom-right-radius: 15px;
	transition: height .3s ease-out, border-bottom-left-radius .3s ease-out, padding-left .3s ease-out;
}
nav.navbar .atfContainer.navOutter.roundBottomLeft {
	padding-left: 0;
	border-bottom-left-radius: 15px;
}

nav ul.navbar-nav {
	margin-bottom: 8px;
}
nav ul.navbar-nav .nav-item {
	margin-bottom: 16px;
}
nav ul.navbar-nav .nav-link {
	font-size: 17px;
	font-family: boldSerif;
	color: var(--deepBlue);
	border-bottom: 1px solid transparent;
	transition: color .3s, border-bottom .3s;
}
nav .navbar-collapse {
	margin-left: -16px;
	margin-right: -16px;
	padding: 40px 16px 32px 32px;
	z-index: -5;
	width: 100%;
	background-color: var(--cremaAgriaLighter);
}
nav .navbar-collapse a.navPhone {
	font-size: 18px;
	font-family: boldSerif;
	color: var(--deepBlue);
	text-decoration: none;
}
nav ul.navbar-nav .nav-link.active {
	color: var(--seaGreen);
}
nav ul.navbar-nav .dropdown-menu {
	margin-top: 0;
	border: 0 solid transparent;
	border-radius: 0;
	padding-top: 0;
	padding-bottom: 0;
	backdrop-filter: blur(6px);
	box-shadow: 0 0 rgba(0,0,0,0);
}
.topBanner .navContacts {
	display: flex;
	justify-content: end;
	align-items: center;
}
.topBanner .navContacts .navPhone {
	font-family: boldSerif;
	font-size: 18px;
	color: var(--cafeLeche);
	text-decoration: none;
}
.navSocials {
	display: flex;
}
.navSocials span {
	width: 25px;
	height: 25px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding-bottom: 5px;
	border-radius: 50%;
	background-color: var(--deepBlue);
	transition: background-color .3s ease-out;
}
.navSocials span:hover {
	background-color: var(--seaGreen);
}
.navSocials span {
	margin-right: 8px;
}
.navSocials span:last-of-type {
	margin-right: 0;
}
.navSocials span img {
	height: 15px;
}
.topBanner .navSocials span {
	width: 20px;
	height: 20px;
	background-color: var(--cafeLeche);
}
.topBanner .navSocials span img {
	height: 13px;
}
.dropdownTitle {
	display: flex;
	flex-direction: column;
	width: 100%;
}
.dropdownTitle p {
	font-size: 48px;
	font-family: boldSerif;
	color: var(--cafeLeche);
	float:left;
	margin-right: 32px;
	margin-bottom: 0px;
}
.dropdownTitle span {
	margin-bottom: 8px;
}
nav ul.navbar-nav li.dropdown .dropdown-item {
	font-size: 16px;
	font-family: boldSerif;
	color: var(--deepBlue);
	transition: color .3s, background-color .3s;
}
nav ul.navbar-nav .dropdown-menu ul {
	list-style-type: none;
	padding-left: 0;
}
nav ul.navbar-nav .dropdown-menu ul li {
  display: inline-block;
  width: calc(50% - 16px);
}
nav ul.navbar-nav .dropdown-menu ul li a.dropdown-item {
	padding: 8px;
}
nav ul.navbar-nav .dropdown-menu ul li img {
	width: 100%;
	height: auto;
}
nav ul.navbar-nav .nav-link:hover {
	color: var(--seaGreen);
	border-bottom: 1px solid var(--seaGreen);
}
nav.tealHighlight ul.navbar-nav .nav-link:hover {
	color: var(--tealHighlight);
	border-bottom: 1px solid var(--tealHighlight);
}
nav.tealHighlight ul.navbar-nav .nav-link:hover, nav.tealHighlight ul.navbar-nav li.dropdown .dropdown-item:hover {
	color: var(--tealHighlight);
}
.tealHighlight nav .navSocials span:hover {
	background-color: var(--tealHighlight);
}
nav ul.navbar-nav li.dropdown .dropdown-item:hover {
	color: var(--seaGreen);
}

nav ul.navbar-nav .dropdown-menu {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  display: block;
  left: 0;
  background-color: var(--cremaAgriaLighterLighter);
  transition: max-height .4s ease-out, opacity 0.5s ease-out;
}

 nav ul.navbar-nav .dropdown-menu.show {
  max-height: 500px;
  opacity: 1;
  transition: max-height .4s ease-out, opacity 0.5s ease-out;
}


/**
 * 
 * UTILITIES
 * 
 */
.bgCremaAgria {
	background-color: var(--cremaAgria);
}
.bgCremaAgriaTrans {
	background-color: var(--cremaAgriaTrans)!important;
}

@media (min-width: 768px) {
	nav .navbar-brand {
		left: 0;
	}
	nav .navbar-brand img {
		width: 125px;
		height: 62px;
	}
	nav .atfContainer.navOutter {
		height: 50px;
		padding-left: 0;
		border-bottom-right-radius: 15px;
	}

	nav ul.navbar-nav li.dropdown {
		position: static;
	}

}


@media (min-width: 992px) {
	.atfContainer.topBanner {
		padding: 0 32px;
	}
	nav.navbar.brandLeft {
		padding-left: 16px;
		padding-right: 16px;
	}
	nav.navbar.brandCenter {
		top: 25px;
	}
	nav .navbar-collapse {
		max-width: calc(100% - 141px);
		justify-content: space-between;
		padding: 0;
		margin: 0;
		z-index: 0;
	}
	.navbar > .atfContainer {
		min-width: 100%;
		max-width: 100%;
		align-items: center;
		padding-top: 0;
		margin: 0;
		box-shadow: 0 2px 4px rgba(0,0,0,0.07);
	}
	nav.navbar.brandLeft > .atfContainer {
		padding-left: 16px;
	}
	nav.navbar.brandLeft .navbar-brand {
		position: relative;
	}
	nav.navbar.brandLeft .navbar-collapse {
		max-width: unset;
	}
	nav ul.navbar-nav {
		flex-grow: 1;
		justify-content: center;
		margin-left: 8px;
		margin-bottom: 0;
	}
	nav ul.navbar-nav .nav-item {
		margin-bottom: 0;
	}
	nav ul.navbar-nav .nav-item .nav-link {
		font-size: 15px;
		padding: 8px 6px;
		margin-right: 16px;
	}
	nav.navbar.brandCenter ul.navbar-nav{
		justify-content: space-around!important;
	}
	nav ul.navbar-nav.rightNav .nav-item:first-of-type {
		margin-left: 8px;
	}
	nav.navbar.brandLeft ul.navbar-nav .nav-item .nav-link {
		font-size: 14px;
	}
	nav .navbar-collapse a.navPhone {
		font-size: 18px;
	}
	.navContacts, .navSocials {
		display: flex;
		align-items: center;
	}
	.navPhone {
		margin-right: 16px;
	}
	nav ul.navbar-nav .dropdown-menu {
		width: 100%;
		max-width: 100%;
		margin-top: -16px;
		background-color: var(--cremaAgriaTransLighter);
		border-bottom-right-radius: 15px!important;
		padding-right: 32px!important;
		padding-left: 32px!important;
		z-index: -5;
	}
	nav ul.navbar-nav .dropdown-menu ul {
		list-style-type: none;
	}
	nav ul.navbar-nav .dropdown-menu ul li {
	  display: inline-block;
	}
	.dropdownTitle {
		display: flex;
		flex-direction: row;
		width: 100%;
		height: 64px;
  		align-items: center;
	}
	.dropdownTitle p {
		font-size: 48px;
		font-family: boldSerif;
		color: var(--cafeLeche);
		float:left;
		margin-right: 32px;
		margin-bottom: 16px;
	}
	.dropdownTitle span {
		width: 100%;
		float: none;
		overflow: hidden;
		text-align: right;
		border-bottom: 1px solid var(--seaGray);
	}
	nav ul.navbar-nav .dropdown-menu ul {
		padding-left: 0;
	}
	nav ul.navbar-nav .dropdown-menu ul li {
		width: calc(25% - 16px);
		margin-right: 8px;
	}
	nav ul.navbar-nav .dropdown-menu ul li a img{
		width: 100%;
		height: auto;
		margin-bottom: 8px;
	}
	a.dropdown-item:has(img) {
		padding: 8px;
		margin-right: 8px;
	}
	a.dropdown-item:last-of-type {
		margin-right: 0;
	}
	nav ul.navbar-nav .dropdown-menu {
	  transition: max-height .4s ease-out, opacity 0.5s ease-out, box-shadow .5s ease-out;
	}
	nav ul.navbar-nav .dropdown-menu.show {
	  max-height: 500px;
	  box-shadow: 0 8px 6px rgba(0,0,0,0.3);
		padding-top: 64px !important;
    padding-bottom: 16px;
	  transition: max-height .4s ease-out, opacity 0.5s ease-out, box-shadow .5s ease-out;
	}
}


@media (min-width: 1200px) {
	.topBanner .navContacts {
		max-width: 1170px;
		margin-left: auto;
		margin-right: auto;
	}

	nav.navbar.brandLeft .atfContainer {
		max-width: 1170px;
		padding-left: 32px;
		padding-right: 32px;
	}
	.navbar > .atfContainer {
		min-width: unset;
		max-width: 1140px;
		margin: 0 auto;
	}
	nav ul.navbar-nav {
		margin-left: 32px;
	}
	nav ul.navbar-nav .nav-item .nav-link {
		font-size: 16px;
		padding: 8px;
		margin-right: 24px;
	}
	nav.navbar.brandLeft ul.navbar-nav .nav-item .nav-link {
    font-size: 16px;
  }
	nav .navbar-collapse a.navPhone {
		font-size: 20px;
	}
}


@media (min-width: 1440px) {
	.navbar > .atfContainer {
		max-width: 1320px;
	}
	nav ul.navbar-nav .nav-item .nav-link {
		font-size: 17px;
	}
	.atfCol-xxl-4 {
    	flex: 0 0 auto;
    	width: 33.33333333%;
	}
	.atfOffset-xxl-2 {
    	margin-left: 16.66666667%;
	}
}


@media (min-width: 1920px) {
	nav.navbar.brandLeft ul.navbar-nav .nav-item .nav-link {
    font-size: 17px;
  }
}