/* 
    Created on : 13.07.2021, 11:17:31
    Author     : wolfgramm

    Alleima:
    Steel Blue: 0f232e
    Orange: ff5532
    Iron Red: 872823
*/

.menu-space {
    height: 0px;
    background: #0f232e;
    position: fixed;
    top: 0px;
    width:100%;
    z-index: 100;
}

.main-menu {
    position: fixed;
    padding-top: 0px;
    width: 100%;
    min-height: 48px;
    z-index: 200;
    background: #0f232e;
    float: right;
    font-family: Arial;
    font-size: 1.35em;
}


/*Style for dropdown links*/
.main-menu li:hover ul a {
	background: var(--alleima_blue);
	color: #ffffff;
	height: 40px;
	line-height: 40px;
}

.main-menu li ul {
	display: none;
	visibility: hidden;
}

.sub-menu {
    position: relative;
}

.sub-menu  ul {
    float: right;
    position: relative;
    left: 0px;
    top: 0;
}

.sub-menu  ul li {
	display: none !important;
	visibility: hidden !important;
	opacity: 0;
	transition: all 0.5;
}

.main-menu li ul li:hover ul li {
    display: block !important;
	visibility: visible !important;
	opacity:1;
}



.main-menu li:hover ul {
	display: block !important;
	visibility: visible !important;
}


/*Hover state for dropdown links*/
.main-menu li:hover ul a:hover {
	background: #ff5532;
	color: #ffffff;
}

.mobile-logo {
    display: none;
    width: 100%;
    float: left;
    height:53px;
   
    text-align: left;
    background:  var(--alleima_blue);
    
}

.mobile-logo img {
    /*width: 100%;*/
    max-height: 30px;
    position: relative;
    top: auto;
    margin: 12px 15px;
}


.nav-header {
    position: relative;
    min-height: 50px;
    background: #0f232e;
    width: 100%;
    z-index: 100;
}

.nav-background {
    display: none;
    position: relative;
    top: 0;
    width: 100%;
    min-height: 50px;
    background: #0f232e;
    z-index: 99;
}

/*Strip the ul of padding and list styling*/
.main-menu ul {
	list-style-type:none;
	margin:0;
	padding:0;
    z-index: 1;
}

/*Create a horizontal list with spacing*/
.main-menu li {
	display:block;
	float: left;
	margin-right: 1px;
}

/*Style for menu links*/
.main-menu li a {
	display:block;
	height: 50px;
    padding: 0 20px;
	text-align: center;
	line-height: 50px;
	color: #fff;
	text-decoration: none;
    transition: all 0.8s;
}

/*Hover state for top level links*/
.main-menu li:hover a {
	background: #ff5532;
	color: #ffffff;
	transition: all 0.1s;
	box-shadow: 0 2px 4px #000;
	border-radius: 1px;
}

.main-menu li:active a {
	box-shadow: 0 1px 2px #000;
}



/*Hide dropdown links until they are needed*/
.main-menu li ul {
	display: none;
    position: absolute;
    min-width:275px;
}


/*Make dropdown links vertical*/
.main-menu li ul li {
	float: none;
	display: none;
}
.main-menu li:hover ul li {
	display: block;
}


/*Prevent text wrapping*/
.main-menu li ul li a {
	width: auto;
	padding: 0 20px;
}

/*Display the dropdown on hover*/
/* .main-menu ul li a:hover + .hidden, .hidden:hover { 
.main-menu ul li a:hover + .hidden, .hidden:hover {
	display: block;
}*/


/*Style 'show menu' label button and hide it by default*/
.show-menu {
	text-decoration: none;
	color: var(--alleima_orange);
	background: var(--alleima_blue);
	text-align: right;
	padding: 9px 15px 9px 0;
	display: none;
}

/*Hide checkbox*/
.main-menu input[type=checkbox]{
    display: none;
}

/*Show menu when invisible checkbox is checked*/
.main-menu input[type=checkbox]:checked ~ #menu{
    display: block;
}


.active {
  background: #ff5532  !important;
  border-bottom: 0px solid white;
  box-shadow: 0 2px 4px #000;
  border-radius: 1px;
}

.main-menu li a.active {
    color: #ffffff;
}

.main-menu i {
    padding-left: 10px;
}


ul.footer-nav {
    list-style-type: none;
    margin: 0;
    padding: 0;
    margin-top: -0.55em;
    line-height: 2.0em;
}

ul.footer-nav li a {
    color: #000099;
    text-decoration: none;   
    transition: all 0.5s;
}
ul.footer-nav li a:hover {
    color: #009900;
    text-decoration: underline;   
}

/*Responsive Styles*/

@media screen and (max-width : 780px){
    body {
        padding-top: 40px !important;
    }
    
    .main-menu {
        right: 0;
        width: 50%;
        z-index: 200;
        float: right;
    }
    
    .sub-menu  ul {
        left: 0;
    }
    
    .mobile-logo {
        display: block;
        padding-left: 0;
    }
    
    .logo-menu {
    	display: none;
    }
    
    .btn-login {
    	display: none;
    }
              
	/*Make dropdown links appear inline*/
	.main-menu ul {
		position: static;
		display: none;
	}
	/*Create vertical spacing*/
	.main-menu li {
		margin-bottom: 1px;
	}
    .main-menu li:hover a {
    	background: #ff5532;
		color: #fff;
	}


	/*Make dropdown links vertical*/
	.main-menu li ul li {
		float: none;
		display: block;
	}
	.main-menu li:hover ul li {
		display: table;
	}
	
	
	.main-menu li:hover ul {
		display: table;
		width: 100%;
		visibility: inherit;
	}


	

	/*Make all menu links full width*/
	.main-menu ul li, li a {
		width: 100%;
	}
	/*Display 'show menu' link*/
	.show-menu {
		display:block;
	}
	
	.main-menu li ul {
        position: relative;
    }
        
    .main-menu li a {
        display:block;
        height: 50px;
        padding: 0;
        margin: 0 auto;
        color: white;
        background: var(--alleima_blue);
	}
	
    .nav-background {
        display: none;
        visibility: hidden;
        background: var(--alleima_blue);
    }
    
    .nav-header {
        position: fixed;
        width: 100%;
        top: 0;
        background:transparent;
    }
    
}