/*
FILE				style_hp_akh_header.css

DATE-CREATION	2023-11-04
LAST MODIFIED 	2023-12-04 

PURPOSE			
					css-file for HTML pages in www.khelil.de
					only specific features for the header wrapper
*/

a {
	cursor: pointer;
}


header, footer{

	background-color 	: rgba(0,0,0,0); 			/* black opacity = 0*/ 
	color					: rgba(46,139,86,1.0);	/* seagreen #2E 8B 57 = 46 139 86 opacity 1 */

	box-shadow			: 0 0.5em 1.0em rgba(0,0,0,0.2); /**/

	padding				: 0.0em 0.0em;
	display				: flex;
	align-items			: center;
	justify-content	: space-between;

	font-size			: 1.1em;
	z-index				: 1000;

	height				: 5.0em;
	width					: 90%:

	/*
	color					: rgba(4,91,98,1.0);		 Google-Green #4 5B 62 = 04 91 98 opacity 1 
	*/
}

header {

	height				: 3.0em;
	top:0; left: 0; right: 0;

	/*	position			: fixed; würde einen Teil des Textes überdecken!!*/
}


/*--------------------------------------------------------*/
/* main manu bar style header + footer */
/*--------------------------------------------------------*/
.nav-bar ul {

	transition			: all ease 0.5s;
	list-style			: none inside;
/*
	list-style			: none ;

	margin				: 0;
	padding				: 0;
	align-items			: center;
	text-align			: center;
	display				: flex;

	position				: absolute;
	left					: 0;
	display				: none;
	display				: inline-block;

	vertical-align		: middle;
	opacity				: 0;
	z-index				: -999; 
*/

}

.nav-bar ul li {

	float					: left;
	margin				: 0.0em 2.0em 0 0 ;
	padding				: 0.5em 0.0em;

	display				: block;
	position				: relative;

	/*
	background-color	: mediumseagreen ;
	height			: 3.0em;
	width				: 12.0em;
	list-style		: none;
	*/
}


.nav-bar ul li:last-child {
	margin-right: 2.0em;
}


.nav-bar ul li a {

	text-decoration 	: none;
	color					: rgba(46,139,86,1.0);	/* seagreen #2E 8B 57 = 46 139 86 opacity 1 */

	display				: block;
/*
	font-size:;
	width					: 8.0em;
	line-height:;
	transition			: all 0.3s;
	padding				: 1.0em 1.0em 1.0em 0.5em ;
*/
}

.nav-bar ul li a:hover {

	font-weight			: bold;
	color					: white;
	background-color	: rgba(46,139,86,1.0);	/* seagreen #2E 8B 57 = 46 139 86 opacity 1 */
/* 
	background-color	: rgba(4,91,98,1);	Google-Green #4 5B 62 = 04 91 98 opacity 1 

*/

}

.nav-bar ul li ul {
	position          : absolute;
	background-color	: white ;
	left           	: 0; 
	width					: 19.0em;
	margin-top			: 0.1em;
	margin-left			: 0.0em;
	display				: none;
}


.nav-bar ul li ul li {
/* smaller fonts for sub menu items */
		font-size	: 100%;  
		width			: 100%;
		border-top	: 0.1em solid rgba(0,0,0,0.1); /* */
}



.nav-bar ul li ul li ul {

	left : 100%;
	top	: 0;
}



.nav-bar ul li:focus-within > ul, 
.nav-bar ul li:hover > ul {

	display: initial ;

}


.hero_sec{

	display:flex;
	justify-content: center;
	align-items: center;
}

/*--------------------------------------------------------*/
/* logo style */
/*--------------------------------------------------------*/

.hf-logo {
 

	height			: 3.0em;
	width				:;
	padding			: 0 0 0 0;
	display			: inline;
	float				: left;

/*
  	background-position: center;

	vertical-align	:middle;
	margin-right	: 0;
	margin-top		: 0;

  	background-repeat: no-repeat;
	background-size: contain;

	transition		: all 0.3s;
*/

}


.hf-logo:hover {

	height			: 5.0em;
/*
	width		: 150%;
	height	: 150%;
*/
}



/* END OF FILE */