.nav-bar          { display: none; }
header nav        { background-color: #555;z-index: 1000;width: 100%;margin: auto;border-radius:3px;}
header nav ul     { list-style: none;margin-top:-10px;}
header nav ul li  { float: left; position: relative;border-left:0px solid #fff;}
header nav:after  { content: ""; display: block;clear: both;}
header nav ul li a{ color: #fff; display: block; padding: 13px; text-decoration: none; font-size: 14px;font-family: tahoma;font-family:Verdana,Tahoma}
header nav ul li:hover { background-color: #777; }
header nav ul li a:hover { color: #fff; }
header nav ul li i  { margin-right: 10px;}
header nav ul li:hover .children { display: block; }
header nav ul li .children       { display: none;background-color:#555;position: absolute;width: 200%;z-index: 1000;}
header nav ul li .children span  { display: none;}
header nav ul li .children li    { display: block;width:100%;height:45px;border-bottom: 1px solid #666;}


@media all and (max-width: 767px) 
{
.nav-bar      { float:right; display: block;overflow:hidden;border:0px solid red}
.nav-bar .bars { display: block; padding:1px;color: #555;overflow: hidden;font-size: 27px;font-weight: bold;text-decoration: none;}
header nav      { background-color: #fff;width: 100%;height:100%;position: fixed;top:0; right: 100%;overflow: hidden;}
header nav ul li  { display: block;border-bottom:1px solid #f1f1f1; width: 80%;border-left:0;}
header nav ul li a    { display: block;color: #333;font-size:13px;text-transform:uppercase}
header nav ul li .children        { width: 100%; position: relative;overflow: hidden;display: none;background-color:#fff;}
header nav ul li:hover .children  { display: none; }
header nav ul li ul li:first-child{ border-top: 1px solid #ecebeb; }
header nav ul li .children span   { display: inline-block; margin-right: 10px;}
header nav ul li .children a      { margin-left: 20px;padding: 10px 0;background-color:#fffefe;font-size:12px;font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif}
header nav ul li .children li     { border-bottom: 1px solid #eceece;}
.kapat { position:absolute;top:140px;right:15px; }
.menualti {position:absolute; bottom:180px;left:5%;}
}