@charset "utf-8";
/* -------------------------------------------------------*/
/* Main Menu Seting */
.gray-bg {
	background: #cccccc;
	background: -webkit-linear-gradient(left, #eaeaea , #dddddd);
	background: -o-linear-gradient(right, #eaeaea , #dddddd);
	background: -moz-linear-gradient(right, #eaeaea , #dddddd);
	background: linear-gradient(to right, #eaeaea , #fafafa);
	border-bottom: 1px solid #e3e3e3;
}
.main-menu {
	text-align: left;
	height:40px; /* default:35px*/
}
/* The container <div> - needed to position the dropdown content */
.main-menu .dropdown {
  position: relative;
  display: inline-block;
	/*max-width: 7.8%;*/
}

.main-menu .dropbtn {
  /*background-color: #4CAF50;
  color: white;
  padding: 16px;
  font-size: 16px;*/
	background: hsla(0,0%,100%,0.00);
	padding: 10px 10px 3px 10px;
	min-width: 7.5%;
  border: none;
	line-height: 150%;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.main-menu .dropdown:hover .dropbtn {
	/*background-color: #9d0e35;*/
	border-bottom: 4px solid #9d0e35;

}
/* Dropdown Content (Hidden by Default) */
.main-menu .dropdown-content {
  display: none;
  position: absolute;
	top:40px;
	left: 0px;
  background-color: hsla(0,0%,100%,0.91);
  min-width: 180px;
	width: max-content;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.main-menu .dropdown-content a {
  color: black;
  padding: 0px 10px;
  text-decoration: none;
  display: block;
	line-height: 200%;
	border-bottom: 2px solid hsla(0,0%,100%,0.00);

}

/* Change color of dropdown links on hover */
.main-menu .dropdown-content a:hover {
	background-color: hsla(0,0%,85%,1.00);
	border-bottom: 2px solid hsla(344,84%,34%,1.00);
}

/* Show the dropdown menu on hover */
.main-menu .dropdown:hover .dropdown-content {display: block;}

	@media screen and (max-width: 1100px)	{
		.main-menu .dropbtn {
			padding: 10px 6px 4px 6px;
			font-size: 95%;
		}
	}

	@media screen and (max-width: 950px)	{
		.main-menu .dropbtn {
			padding: 11px 4px 5px 4px;
			font-size: 90%;
		}
	}
	@media screen and (max-width: 850px)	{
		.main-menu .dropbtn {
			padding: 12px 1px 6px 1px;
			font-size: 85%;
		}
	}
/* -------------------------------------------------------*/
/* page menu  	*/
.page-menu {
	width: 100%;
		height: auto;
}
.page-menu .dropdown {
  position: relative;
  display: inline-block;
	width: 100%;
	height: auto;

}

/* Change the background color of the dropdown button when the dropdown content is shown */
.page-menu .dropdown .dropbtn  {
	border-bottom: 3px solid hsla(0,0%,100%,0.00);
}
.page-menu .dropdown .dropbtn a {
	/*background-color: #9d0e35;*/
	font-size: 120%;
	font-weight: bold;
	border-bottom: 3px solid hsla(344,84%,34%,1.00);
}

.page-menu .dropdown .dropbtn a:hover {
	/*background-color: #9d0e35;*/
	color: hsla(0,0%,18%,1.00);
}
.page-menu .dropdown-content {
  position: relative;
	top: 20px;
	left: 0px;
  min-width: 200px;
	width: 75%;
  background-color: hsla(0,0%,100%,0.91);
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
	margin-bottom: 40px;
}

/* Links inside the dropdown */
.page-menu .dropdown-content li {
  display: block;
	border-bottom: 1px solid hsla(0,0%,90%,0.90);
}
.page-menu .dropdown-content a {
  padding: 6px 10px;
  text-decoration: none;
  display: block;
	font-size: 100% !important;
	font-weight: normal !important;
	border-bottom: 0px !important;
	line-height: 150%;
}

/* Change color of dropdown links on hover */
.page-menu .dropdown-content a:hover {
	background-color: hsla(0,0%,83%,0.92);
	border-bottom: 1px solid #9d0e35;
}

/* Show the dropdown menu on hover 
.page-menu .dropdown:hover .dropdown-content {display: block;}*/

	@media screen and (max-width: 990px)	{
		.page-menu .dropdown .dropbtn {
			border-bottom: 0px;

		}
		.page-menu .dropdown .dropbtn a {
			/*background-color: #9d0e35;*/
			font-size: 100%;
			font-weight: bold;
			border-bottom: 3px solid #9d0e35;
		}
		.page-menu .dropdown-content {
			position: relative;
			top: 10px;
			left: 00px;
			width: 99%;
			background-color: hsla(0,0%,100%,0.00);
			box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.00);
		}	
		.page-menu .dropdown-content li {
			font-size: 100%;
			float: left;
			background: #eee;
			/*border: solid 2px #fff;
			padding: 2px 4px ;*/
			margin: 2px;
			min-height: 28px;
			width: auto!important;
		}
		.page-menu .dropdown-content a {
		  padding: 4px 5px;
			font-size: 95% !important;
			font-weight: normal !important;
			border-bottom: 0px !important;
		}	
	}

	@media screen and (max-width: 950px)	{
		.page-menu .dropbtn {
			padding: 10px 5px 3px 5px;
			font-size: 90%;
		}
	}
	@media screen and (max-width: 800px)	{
		.page-menu .dropbtn {
			padding: 10px 4px 3px 4px;
		}
	}




/* -------------------------------------------------------*/
/* mobile menu  	*/
.mobile-menu {
	float: right;
	height: 60px;
	align-items: center;
	justify-content: center;
	padding: 20px 10px;
	text-align: right;
}
	@media screen and (max-width: 770px)	{
		.mobile-menu {
			height: 60px;
			padding: 10px;
		}
	}
	@media screen and (max-width: 440px)	{
		.mobile-menu {
			height: 60px;
			padding: 10px 0px;
			padding-right: 10px;
		}
	}