* {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
  
      /* OPTIONAL THEMING */
    .top-menu{
        min-width:100%;
    }

    .mobile-toggleable-menu {
        background-color: #f4f4f4;
        color: #808080;
        display: block;
        width: 100%;
        min-height: 105px;
    }

    .mobmenu-toggle {
        background-color: orange;
        color: #fff;
        font-size: 35px;
        text-decoration: none;
        text-align: center;
        font-weight: bold;
        height: 50px;
        line-height: 50px;
	}
	
    .mobile-toggleable-menu li {
        display: inline-block;
		position:relative;
        float:left;
        padding: 0;
        height: 100%;
        line-height: 40px;
	}
		
    .mobile-toggleable-menu > li a {
        height: 105px;
        width: 100%;
		display: inline-block;
		text-decoration: none;
        color: #808080;
		transition: all 0.1s linear;
		padding-top:35px;
		padding-right: 25px;
		padding-left: 25px;
     }
	
	  .mobile-toggleable-menu li ul a{
        height: 100%;
        width: 100%;
		display: inline-block;
		text-decoration: none;
        color: #808080;
		transition: all 0.1s linear;
		padding: 2px 10px 2px 10px;
	}
	
	  .mobile-toggleable-menu li ul a i.fa.fa-angle-right{
        float:right;
		margin-top: 13px;
	}
	
	/* .mobile-toggleable-menu li a:hover{ */
		/* color:white; */
        /* background-color: #007c90; */
	/* } */

	.mobile-toggleable-menu li ul li:hover > a, 
    .mobile-toggleable-menu li ul li:active > a{
		color:white;
        background-color: #007c90;
	}
	
    .mobmenu-toggle:hover, .mobmenu-toggle:active {
        background-color: darkOrange;
    }
	
	
	.mobile-toggleable-menu li ul{
        z-index: 999 !important;
		position:absolute; 
		top:99px; 
		left:0%;
		margin-top: 5px;
		padding: 1px; 
		box-shadow: 5px 5px 8px rgba(200,200,200, 1);
		background: rgba(255, 255, 255, 0.96);
		min-width: 200px;
		display:none;
	}
	
	.mobile-toggleable-menu li ul li{
		width:100%;
		white-space: nowrap;
	}
		
	.mobile-toggleable-menu li ul li ul{
		left: 100%;
		padding: 0 1px;
		width:auto;
		margin-top: -99px;
		margin-left: 0px;
		box-shadow: 5px 5px 8px rgba(200,200,200, 1);
		background: rgba(255, 255, 255, 0.96);
		display:none;
	}
		
	.mobile-toggleable-menu li:hover ul, .mobile-toggleable-menu li:active ul {display:block; }
	.mobile-toggleable-menu li:hover ul li ul,.mobile-toggleable-menu li:active ul li ul {display:none}
	.mobile-toggleable-menu li:hover ul li:hover ul, .mobile-toggleable-menu li:active ul li:active ul {display:block}
	
	
	.mobile-toggleable-menu .logo a img
	{
		/* width: 188px; */
		height: 69px;
		margin-left: 10px !important;
		margin-right: 10px !important;
		margin-top: -15px;
	}
	 
#login {
	margin-left: 25px;
	margin-top: 30px;
	height: 45px;
    background: linear-gradient(#FFC830, #FCA320);
	/* background-color: #4CAF50; /* Green */
    border: none;
	border-radius: 4px;
    color: #FFF;
    padding-top: 2px;
	padding-left: 10px;
	padding-right: 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
	border-radius: 4px;
}

@media screen and (max-width: 1300px) {
	.mobile-toggleable-menu .logo a img	{
		margin-left: 25px;
		margin-right: 25px;
	}
}

@media screen and (max-width: 1300px){
	.mobile-toggleable-menu > li a{
		padding-right: 25px;
		padding-left: 10px;
	}
}

@media screen and (max-width: 1275px){
	.mobile-toggleable-menu > li a{
		padding-right: 0px;
		padding-left: 25px;
	}
}

@media screen and (max-width: 1155px){
	.mobile-toggleable-menu > li a{
		margin-left: 5px;
	}
}

@media handheld, screen and (max-width: 1070px) {
        .mobile-menu-toggle-button:checked ~ .mobmenu-toggle {
            background: linear-gradient(#FFC830, #FCA320);
            color: white;
            -webkit-transform: rotate(-180deg);
        }
    }