#menu {border-bottom: 1px solid rgba(255, 255, 255, .3); min-height: auto; height: auto;  position: fixed; width: 100%; background: rgba(255, 255, 255, .1);}
#nav {text-align: center; margin: 0 auto; padding: 0; width: auto; max-width: 1200px;}
#nav.white-menu {border-bottom: 3px solid #c32e92; background: #fff;}

#nav ul {float: none; padding: 10px 20px; display: flex; max-width: 1200px; margin: 0 auto; justify-content: center; list-style-type: none; color: rgba(255, 255, 255, 1);}
#nav ul li {float: left; padding: 10px 20px;}
#nav ul li a {text-decoration: none; font-size: 1.2rem; color: rgba(255, 255, 255, .6);
-o-transition: all .2s ease; -ms-transition: all .2s ease; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; transition: all .2s ease;}

#nav ul li a.active {color: rgba(255, 255, 255, 1);}

#nav ul li a:hover {color: rgba(255, 255, 255, .8);}

#nav.white-menu ul li a {opacity: 1;}
#nav.white-menu ul li a:hover {color: #c32e92; opacity: 1;}
#nav.white-menu ul li a.active {color: #c32e92; opacity: 1;}

.menu-hide {border-bottom: 3px solid #c32e92; transform: translateY(-80px); position: absolute;}

#nav-tools {float: left; padding: 18px 5px 17px 5px;}

#nav #menu-tools a, #menu #menu-tools a:active, #menu #menu-tools a:focus {text-decoration: none; font-size: 90%; color: #fff; background: #959595; padding: 8px 9px;
-webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;
-o-transition: all .2s linear; -ms-transition: all .2s linear; -moz-transition: all .2s linear; -webkit-transition: all .2s linear; transition: all .2s linear;}

#nav #menu-tools a:hover {background: #c32e92;}

#nav #menu-tools a.linked, #menu #menu-tools a.newsletter {display: none;}

.hu #nav #menu-tools a.lang:before {content: "EN";}
.hu #nav #menu-tools a.linked:before {content: "";}
.hu #nav #menu-tools a.newsletter:before {content: "";}

.en #nav #menu-tools a.lang:before {content: "HU";}
.en #nav #menu-tools a.linked:before {content: "";}
.en #nav #menu-tools a.newsletter:before {content: "";}

#nav #event-logo {color: #fff; height: 56px; width: 170px;  padding: 0;
background: url(../images/general/akc-logom.png) no-repeat center center;
-o-transition: all .2s linear; -ms-transition: all .2s linear; -moz-transition: all .2s linear; -webkit-transition: all .2s linear; transition: all .2s linear;} 

#nav.white-menu #event-logo {} 
#nav:hover #event-logo {opacity: .8;}
#nav.white-menu:hover #event-logo {}

#event-logo strong {font-weight: 400;}
#event-logo-mobile {float: left; width: 100%; text-align: center; display: none; text-indent: -9999px;
background: url(../images/ictf/header.jpg) no-repeat center center; background-size: cover; font-size: 210%; color: #fff; padding: 15px 0;}
#event-logo-mobile:after {float: left; width: 100%; height: 60px; content: "";
background: url(../images/ictf/menulogow.svg) no-repeat center center; background-size: 90% 40px;}

@media screen and (max-width: 1024px) {

#nav #menu-tools {display: block;}
#nav #menu-tools {width: 100%; background: #c32e92; padding: 14px 12px 18px 12px; text-align: center;}

#nav #menu-tools a, #menu #menu-tools a:active, #menu #menu-tools a:focus {
text-decoration: uppercase;
font-size: 100%; color: #fff; background: none; width: auto; height: auto; padding: 12px 25px 11px 25px; border: 2px solid #fff; margin: 0 5px; display: inline-block;}

#nav #menu-tools a {float: right;}
#nav #menu-tools a.lang {float: left;}

#nav #menu-tools a:hover {background: #cf58a8;}

#nav #menu-tools a.linked, #menu #menu-tools a.newsletter {display: block;}

.hu #nav #menu-tools a.lang:before {content: "ENGLISH";}
.hu #nav #menu-tools a.linked:before {content: "LINKEDIN";}
.hu #nav #menu-tools a.newsletter:before {content: "H\00CDRLEV\00C9L";}

.en #nav #menu-tools a.lang:before {content: "MAGYAR";}
.en #nav #menu-tools a.linked:before {content: "LINKEDIN";}
.en #nav #menu-tools a.newsletter:before {content: "NEWSLETTER";}

#nav ul {width: 100%; float: right;}

#nav ul li {width: 100%; text-align: center; padding: 10px;}
#nav ul li a:hover, #menu.white-menu ul li a:hover {color: #c32e92;}

.menu-hide {transform: translateY(0px);}
#event-logo {display: none;}
#event-logo-mobile {display: none;}
}

@media screen and (max-width: 768px) {
#menu {bottom: 0;}
}