/* screens: desktops + laptops */


/* head */
.head {
	width: 100%;
	height: 4rem;
	position: fixed;
  top: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	background: var(--head-bg);
	border-bottom: 1px solid var(--border);
}

.head_container {
	width: calc(100% - 2rem);
	max-width: calc(72rem - 2rem);
	height: 100%;
	margin: 0 1rem;
	display: flex;
	justify-content: space-between;
}


/* head: left */
.head_top_left {
	width: fit-content;
	display: flex;
	flex-direction: row;
	align-items: center;
}

.head_top_left a {
	color: var(--head-logo);
	font-size: 1.5em;
	font-weight: bold;
	font-family: "caviar-dreams-bold";
}

.head_top_left a:hover {
	color: var(--head-logo-hover);
}


/* head: right */
.head_top_right {
	width: fit-content;
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	align-items: center;
}

.head_top_right ul {
	display: flex;
	align-items: center;
}

.head_top_right ul:last-child {
	display: none;
}

#button-menu {
	color: var(--head-link);
  	cursor: pointer;
}

#button-menu:hover {
  	color: var(--head-link-hover);	
}

.head_top_right ul li {
	margin: 0 2rem;
	display: inline-flex;
	font-size: 0.875em;
	font-weight: 400;
	cursor: pointer;
}

.head_top_right ul li:first-child {
	margin: 0 2rem 0 0;
}

.head_top_right ul li:last-child {
	margin: 0 0 0 2rem;
}

.head_top_right ul:last-child li:last-child {
  margin: 0;
}

.head_top_right ul li a {
	color: var(--head-link);
	font-weight: 400;
}

.head_top_right ul:last-child li:hover,
.head_top_right ul:last-child li:focus,
.head_top_right ul li a:hover {
	color: var(--head-link-hover);
}


/* head: menu page */
.head_menu_page {
  width: 100%;
  height: calc(100vh - 0rem);
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  background-color: var(--black-transparent);
  color: var(--white);
  border: 1px solid var(--white);
}


/* screens: tablets */
@media only screen and (max-width: 959px) {


	/* head: right */
	.head_top_right ul:first-child {
		display: none;
	}

	.head_top_right ul:last-child {
		display: flex;
	}

	.head_top_right ul li:last-child {
		padding: 0;
	}


	/* head: menu list */
	.head_menu_list {
		width: calc(100% - 0rem);
		height: calc(100% - 10rem);
	}

	.head_menu_list ul {
	  width: 100%;
	  height: 100%;
	  display: flex;
	  flex-direction: column;
	}

	.head_menu_list ul li {
	  width: calc(100% - 2rem);
	  height: calc(4rem - 0rem);
	  margin: 0;
	  padding: 0 1rem;
	  display: flex;
	  justify-content: center;
	  align-items: center;
	}

	.head_menu_list ul li:first-child {
	  justify-content: end;
	  font-size: 2em;
	  font-weight: 300;
	  cursor: pointer;
	}

	.head_menu_list ul li a {
		color: var(--head-link-menu);
		font-size: 1.5em;
		font-weight: 300;
	}

	.head_menu_list ul li:first-child:hover,
	.head_menu_list ul li:first-child:focus,
	.head_menu_list ul li a:hover {
		color: var(--head-link-hover);
	}


	/* head: menu company */
	.head_menu_company {
		width: calc(100% - 0rem);
		height: 9rem;
	}

	.head_menu_company img {
		height: 3rem;
		margin: 0 auto 1rem;
		display: block;
	}

	.head_menu_company a {
		height: 4rem;
		margin: 0 auto 2rem;
		display: block;
		color: var(--white);
		font-size: 2em;
		font-weight: bold;
		font-family: "caviar-dreams-bold";
		text-align: center;
	}

	.head_menu_company a:hover {
		color: var(--head-logo-hover);
	}


}


/* screens: smartphones */
@media only screen and (max-width: 480px) {


	/* head: left */
	.head_top_left a {
		font-size: 1.25em;
	}


	/* head: right */
	.head_top_right ul li a {
		font-size: 1em;
	}


	/* head: menu list */
	.head_menu_list ul li a {
		font-size: 1.25em;
	}


	/* head: menu company */
	.head_menu_company a {
		font-size: 1.5em;
	}


}