:root{
	--header1_bk_color:#fff;
	--header2_bk_color:#000;
	--logo_text_color:#25ccf7;
	--call_color:#25ccf7;
	--menu_text_color:#fff;
	--menu_hover_color:#25ccf7;
	--fa_bars_color:#fff;
	--social_color:#fff;
	--social_hover_color:#25ccf7;

	/*--menu_hover_color:#069c54;
	--social_color:#ffffff;
	--social_hover_color:#069c54;


	--r1:#0b9d8a;
	--r2:#069c54;
	--r3:#048654;*/
}

#header .header_1{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	background-color:var(--header1_bk_color);
	padding: 1rem 2rem;
	border-bottom: .1rem solid #25CCF7;
}
#header .header_1 .logo{
	font-size: 2.5rem;
	font-weight: bold;
	color: var(--logo_text_color);
	height: 3.5rem;
	width: 7rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
#header .header_1 .logo img{
	margin-right: .5rem;
	height: 100%;
	width: 100%;
}
#header .header_1 .call{
	font-size: 2rem;
	font-weight: 300;
	color: var(--call_color);
}
#header .header_1 .fa-mobile{
	margin-right: 0.5rem;
}

header .header_2{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	background: var(--header2_bk_color);
	padding: .5rem;
	position: relative;
	z-index: 1000;
}
header .header_2 .navbar ul{
	display: flex;
	align-items: center;
	justify-content: space-between;
	list-style: none;
}
header .header_2 .navbar ul li{
	margin: 1rem;
}
header .header_2 .navbar ul li a{
	font-size: 2rem;
	color: var(--menu_text_color);
}
/*header .header_2 .navbar ul li a.active,*/
header .header_2 .navbar ul li a:hover{
	color: var(--menu_hover_color);
}
header .header_2 .social a{
	font-size: 2rem;
	color: var(--social_color);
	margin: 1rem;
}
header .header_2 .social a:hover{
	color: var(--social_hover_color);
}
header .header_2 #menu{
	font-size: 3rem;
	color: var(--fa_bars_color);
	cursor: pointer;
	display: none;
	margin: 1rem;
}
header .header_2.header-active{
	position: fixed;
	top: 0;
	left: 0;
	box-shadow: 0 .1rem .3rem rgba(0,0,0,0.5);
}
/*==media==*/
@media(max-width: 768px){
	html{
		font-size: 55%;
	}
	header .header_2 #menu{
		display: block;
	}
	header .header_2 .navbar{
		position: absolute;
		top: 100%;
		left: -120%;
	}
	header .header_2 .navbar ul{
		flex-flow: column;
		justify-content: center;
		min-height: calc(100vh-6rem);
		padding-bottom: 6rem;
		background: #000000;
		width: 35rem;
	}
	header .header_2 .navbar ul li{
		width: 100%;
		text-align: center;

	}
	header .header_2 . ul li a{
		font-size: 2.5rem;
		display: block;
	}
	header .header_2 .fa-times{
		transform: rotate(180deg);
	}

	header .header_2 .nav-toggle{
		left: 0;
	}
}

@media(max-width: 400px){
	html{
		font-size: 50%;
	}
	header .header_1{
		flex-flow: column;
	}
	header .header_1 .logo{
		padding-bottom: 1rem;
	}
	header .header_2 .navbar ul{
		width: 100vw;
	}
}