/* width */
::-webkit-scrollbar {
	width: 4px;
	height: 4px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
	visibility: hidden;
	box-shadow: inset 0 0 5px grey; 
	border-radius: 10px;
  }
   
  /* Handle */
  ::-webkit-scrollbar-thumb {
	background: rgb(149, 146, 146); 
	border-radius: 56px;
  }
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
	background: #f16a03; 
  }




*{
}

.noscroll{
	overflow: hidden;
	min-height: 100vh
}

.navbar-container{
	top: 0;
	background-color: #fff;
	width: 100%;
	height: auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	box-shadow: rgba(0, 0, 0, 0.24) 0px .5px .5px;
	position: fixed;
	z-index: 999;
	transition: .3s ease;
}

.navbar-logo{
	width: auto;
	height: 5.5rem;
	padding: 4px;
	margin-left: 3rem;
}

.navbar-logo img{
	height: 100%;
	object-fit: cover;
}

.nav-links-container{
	padding: 0 3rem;
	height: auto;
}

.nav-links{
	height: auto;
	margin: 0;
	padding: 0;
	list-style: none;
	position: relative;
	
}



.nav-link-item{
	display: inline-block;
	margin: 0 1rem;
	height: auto;
	
	
	
}


.nav-link-item a{
	text-decoration: none;
	display: inline-block;
	height: 100%;
	padding: 2rem 0;
	margin: 0 1rem;
	color: #000;
	font-family: "Archivo", sans-serif;
	font-size: 18px;
	
}

.nav-link-item a:hover{
	cursor: pointer;
}



.nav-link-branches{
	position: absolute;
	list-style: none;
	margin: 0;
	padding: 0;
	width: auto;
	height: auto;
	opacity: 0;
	transform: translateY(-2rem);
	transition: .3s ease;
	display: none;

}

.nav-branch-link{
	width: 100%;
	background-color: #fff;
}

.nav-link-branches li{
	margin: 0;
	padding: 0;
	overflow: hidden;
	
}

.nav-branch-link a{
	text-decoration: none;
	padding: .8rem 0 ;
	width: 100%;
	font-size: 18px;
	
}

.nav-link-branches li:hover a,
.nav-link-branches li:hover{
	color: #fff;
	background-color: #f87605;
}


.nav-branch-link{
	background-color: #fff;
	border-bottom: 1px solid #cbcaca;
	border-left: 1px solid #cbcaca;
	border-right: 1px solid #cbcaca;
	
}

.material-symbols-outlined{
	vertical-align: middle;
	transition: .3s ease;
}

.nav-link-item:hover .material-symbols-outlined {
	transform: rotate(-180deg);
}

.nav-link-item:hover .nav-link-branches{
	display: block;
	opacity: 1;
	transform: translateY(0);
}

.nav-header-2{
	display: none;
}

.nav-close-button{
	background-color: transparent;
}

.nav-close-button i{
	font-size: 48px;
	font-weight: 500;
	
}

.nav-close-button i:hover{
	cursor: pointer;
	
}

.navbar-logo-2{
	width: auto;
	height: 4.5rem;
	
}

.navbar-logo-2 img{
	object-fit: cover;
	height: 100%;
	
}

.nav-open-button{
	margin-right: 2rem;
	display: none;
}

.nav-open-button i{
	font-size: 48px;
}

.nav-open-button i:hover{
	cursor: pointer;
}

.material-symbols-outlined{
	transform: rotate(0);
}

.block-li{
	background-color: #fff;
	width: 100%;
	height: 6rem;
	display: none;
	z-index: 6;
}


@media (max-width: 1311px){

	.block-li{
		background-color: #fff;
		width: 100%;
		height: 6rem;
		display: unset;
	}
	

	.nav-open-button{
		margin-right: 2rem;
		display: block;
	}

	.nav-header-2{
		margin: 1rem .5rem 1rem .5rem;
		display: flex;
		justify-content: space-between;
		align-items: center;
		
	}

	.navbar-container{
		transition: .3s ease;
	}

	.navbar-container.off{
		min-height: 100vh; 
		width: 100vw;
		background-color: rgba(0, 0, 0, 0.4);

	}

	.navbar-container.off > .navbar-logo{
		display: none;
	}

	.navbar-container.off > .nav-open-button {
		display: none;
	}
	

	.navbar-container.off{
		overflow: hidden;
		height: 0px;

	}


	.nav-links-container{
		width: 400px;
		position: absolute;
		height: 100%;
		right: -400px;
		top: 0;
		padding: 0 1rem;
		background-color: #fff;
		box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
		transition: .4s ease;
		overflow: scroll;
		position: fixed;
	}

	.nav-links-container.show{
		right: 0;
	}


	.nav-links{
		height: auto;
		margin: 0;
		padding: 0;
		list-style: none;
		display: flex;
		flex-direction: column;
		background-color: #fff;
	}
	
	.nav-link-item{
		position: relative;
		background-color: #fff;
	}

	.nav-link-item a{
		border-bottom: 1px solid #b8b8b8;	
		display: flex;
		padding: 1rem 0;
		margin: 1rem 0;
		justify-content: space-between;
		font-size: 18px;
	}

	.nav-link-branches{
		position: unset;
		list-style: none;
		margin: 0;
		padding: 0;
		width: auto;
		height: auto;
		opacity: 1;
		transform: translateY(0);
		transition: .3s ease;
		display: block;
	
	}

	.nav-link-branches li:hover a,
	.nav-link-branches li:hover{
		color: unset;
		background-color: unset;
	}

	
	.nav-link-branches{
		height: 0;
		overflow: hidden;
		transition: height .3s ease;
	}

	.nav-link-branches.show{
		
	}

	.nav-branch-link{
		background-color: #fff;
		border-bottom: 0 solid #cbcaca;
		border-left: 0 solid #cbcaca;
		border-right: 0 solid #cbcaca;
		
	}
	

	.nav-branch-link a{
		text-decoration: none;
		padding: .8rem 0 ;
		margin: .7rem 1rem;
		width: 100%;
		font-size: 15px;
		
	}

	.nav-link-item:hover .material-symbols-outlined{
		transform: rotate(0deg);
	}

	.material-symbols-outlined.open{
		transform: rotate(-180deg);
	}
	
}

@media (max-width: 631px){
	.nav-open-button{
		margin-right: 1rem;
		display: block;
	}

	.nav-header-2{
		margin: 1rem .5rem 1rem .5rem;
		display: flex;
		justify-content: space-between;
		align-items: center;
		
	}

	.navbar-container{
		transition: .3s ease;
	}

	.navbar-container.off{
		min-height: 100vh; 
		width: 100vw;
		background-color: rgba(0, 0, 0, 0.4);

	}

	.navbar-container.off > .navbar-logo{
		display: none;
	}

	.navbar-container.off > .nav-open-button {
		display: none;
	}
	

	.navbar-container.off{
		overflow: hidden;
		height: 0px;

	}

	.navbar-logo{
		width: auto;
		height: 4.5rem;
		padding: 4px;
		margin-left: 1rem;
	}
	
	.navbar-logo img{
		height: 100%;
		object-fit: cover;
	}


	.nav-links-container{
		width: 300px;
		position: absolute;
		height: 100vh;
		right: -400px;
		top: 0;
		padding: 0 1rem;
		background-color: #fff;
		box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
		transition: .4s ease;
		overflow: scroll;
		position: fixed;
	}

	.nav-links-container.show{
		right: 0;
	}


	.nav-links{
		margin: 0;
		padding: 0;
		padding-bottom: 6rem;
		list-style: none;
		display: flex;
		flex-direction: column;
		background-color: #fff;
	}
	
	.nav-link-item{
		position: relative;
	}

	.nav-link-item a{
		border-bottom: 1px solid #b8b8b8;	
		display: flex;
		padding: 1rem 0;
		margin: 1rem 0;
		justify-content: space-between;
		font-size: 18px;
	}

	.nav-link-branches{
		position: unset;
		list-style: none;
		margin: 0;
		padding: 0;
		width: auto;
		height: auto;
		opacity: 1;
		transform: translateY(0);
		transition: .3s ease;
	
	}

	.nav-link-branches li:hover a,
	.nav-link-branches li:hover{
		color: unset;
		background-color: unset;
	}

	
	.nav-link-branches{
		height: 0;
		overflow: hidden;
		transition: height .3s ease;
	}

	.nav-link-branches.show{
		
	}



	.nav-branch-link a{
		text-decoration: none;
		padding: .8rem 0 ;
		margin: .7rem 1rem;
		width: 100%;
		font-size: 15px;
		
	}

	.nav-link-item:hover .material-symbols-outlined{
		transform: rotate(0deg);
	}

	.material-symbols-outlined.open{
		transform: rotate(-180deg);
	}

}


@media (max-width: 461px){
	.navbar-logo-2{
		width: auto;
		height: 4rem;
		
	}
	
	.navbar-logo-2 img{
		object-fit: cover;
		height: 100%;
		
	}
	
	.nav-open-button{
		margin-right: 2rem;
		display: none;
	}

	.nav-close-button i{
		font-size: 42px;
		font-weight: 500;
		
	}
	
	.nav-open-button i{
		font-size: 42px;
	}
	
	.nav-open-button i:hover{
		cursor: pointer;
	}

	.nav-open-button{
		margin-right: 1rem;
		display: block;
	}

	.nav-header-2{
		margin: 1rem .5rem 1rem .5rem;
		display: flex;
		justify-content: space-between;
		align-items: center;
		
	}

	.navbar-container{
		transition: color 1s ease;
	}

	.navbar-container.off{
		min-height: 100vh; 
		width: 100vw;
		background-color: rgba(0, 0, 0, 0.4);

	}

	.navbar-container.off > .navbar-logo{
		display: none;
	}

	.navbar-container.off > .nav-open-button {
		display: none;
	}
	

	.navbar-logo{
		width: auto;
		height: 4.5rem;
		padding: 4px;
		margin-left: 1rem;
	}
	
	.navbar-logo img{
		height: 100%;
		object-fit: cover;
	}


	.nav-links-container{
		width: 250px;
		position: absolute;
		height: 100vh;
		right: -400px;
		top: 0;
		padding: 0 1rem;
		background-color: #fff;
		box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
		transition: .4s ease;
		overflow: scroll;
		position: fixed;
	}

	.nav-links-container.show{
		right: 0;
	}

	.nav-links{
		margin: 0;
		padding: 0;
		padding-bottom: 15rem;
		list-style: none;
		display: flex;
		flex-direction: column;
		background-color: #fff;
	}
	
	.nav-link-item{
		position: relative;
	}

	.nav-link-item a{
		border-bottom: 1px solid #b8b8b8;	
		display: flex;
		padding: .5rem 0;
		margin: 1rem 0;
		justify-content: space-between;
		font-size: 14px;
	}

	.nav-link-branches{
		position: unset;
		list-style: none;
		margin: 0;
		padding: 0;
		width: auto;
		height: auto;
		opacity: 1;
		transform: translateY(0);
		transition: .3s ease;
	
	}

	.nav-link-branches li:hover a,
	.nav-link-branches li:hover{
		color: unset;
		background-color: unset;
	}

	
	.nav-link-branches{
		height: 0;
		overflow: hidden;
		opacity: 1;
		transition: all .3s ease;
	}

	.nav-link-branches.show{
		
	}



	.nav-branch-link a{
		text-decoration: none;
		padding: .8rem 0 ;
		margin: .7rem 1rem;
		width: 100%;
		font-size: 11px;
		
	}

	.nav-link-item:hover .material-symbols-outlined{
		transform: rotate(0deg);
	}

	.material-symbols-outlined.open{
		transform: rotate(-180deg);
	}

}

@media (max-width: 381px){
	.navbar-logo-2{
		width: auto;
		height: 4rem;
		
	}
	
	.navbar-logo-2 img{
		object-fit: cover;
		height: 100%;
		
	}
	
	.nav-open-button{
		margin-right: 2rem;
		display: none;
	}

	.nav-close-button i{
		font-size: 42px;
		font-weight: 500;
		
	}
	
	.nav-open-button i{
		font-size: 42px;
	}
	
	.nav-open-button i:hover{
		cursor: pointer;
	}

	.nav-open-button{
		margin-right: 1rem;
		display: block;
	}

	.nav-header-2{
		margin: 1rem .5rem 1rem .5rem;
		display: flex;
		justify-content: space-between;
		align-items: center;
		
	}

	.navbar-container{
		transition: color 1s ease;
	}

	.navbar-container.off{
		min-height: 100vh; 
		width: 100vw;
		background-color: rgba(0, 0, 0, 0.4);

	}

	.navbar-container.off > .navbar-logo{
		display: none;
	}

	.navbar-container.off > .nav-open-button {
		display: none;
	}
	

	.navbar-logo{
		width: auto;
		height: 4.5rem;
		padding: 4px;
		margin-left: 1rem;
	}
	
	.navbar-logo img{
		height: 100%;
		object-fit: cover;
	}


	.nav-links-container{
		width: 230px;
		position: absolute;
		height: 100vh;
		right: -400px;
		top: 0;
		padding: 0 1rem;
		background-color: #fff;
		box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
		transition: .4s ease;
		overflow: scroll;
		position: fixed;
	}

	.nav-links-container.show{
		right: 0;
	}

	.nav-links{
		margin: 0;
		padding: 0;
		padding-bottom: 15rem;
		list-style: none;
		display: flex;
		flex-direction: column;
		background-color: #fff;
	}
	
	.nav-link-item{
		position: relative;
	}

	.nav-link-item a{
		border-bottom: 1px solid #b8b8b8;	
		display: flex;
		padding: .5rem 0;
		margin: 1rem 0;
		justify-content: space-between;
		font-size: 14px;
	}

	.nav-link-branches{
		position: unset;
		list-style: none;
		margin: 0;
		padding: 0;
		width: auto;
		height: auto;
		opacity: 1;
		transform: translateY(0);
		transition: .3s ease;
	
	}

	.nav-link-branches li:hover a,
	.nav-link-branches li:hover{
		color: unset;
		background-color: unset;
	}

	
	.nav-link-branches{
		height: 0;
		overflow: hidden;
		opacity: 1;
		transition: all .3s ease;
	}

	.nav-link-branches.show{
		
	}



	.nav-branch-link a{
		text-decoration: none;
		padding: .8rem 0 ;
		margin: .7rem 1rem;
		width: 100%;
		font-size: 11px;
		
	}

	.nav-link-item:hover .material-symbols-outlined{
		transform: rotate(0deg);
	}

	.material-symbols-outlined.open{
		transform: rotate(-180deg);
	}

}