الواقع

#dbmenu {position: relative;margin: 0;background: #444;} .dbmenu {display: block;margin:0px;padding:0px;} .dbmenu li {display: inline-block;position: relative;z-index: 100;padding:0px;margin:0px;text-align:right;font-size:14px;} .dbmenu li a {text-decoration: none;padding:15px;margin:0px;display: block;color: #fff;} .dbmenu li a:hover,.dbmenu li:hover>a {color: #fff;background:#e8102d;} .dbmenu ul {visibility: hidden;opacity: 0;margin: 0;padding: 0;width: 150px;position: absolute;right: 0px;background: #fff;z-index: 99;} .dbmenu ul li {display: block;float: none;background: none;margin: 0;padding: 0;} .dbmenu ul li a {font-size: 12px;font-weight: normal;display: block;color: #797979;background: #fff;} .dbmenu ul li a:hover,.dbmenu ul li:hover>a {background: #e8102d;color: #fff;} .dbmenu li:hover>ul {visibility: visible;opacity: 1;} .dbmenu ul ul {right: 149px;top: 0px;visibility: hidden;opacity: 0;} .dbmenu li>ul ul:hover {visibility: visible;opacity: 1;} .responsive-dbmenu {display: none;max-width: 100%;padding:15px;background: #4d90fe;color: #fff;} a.responsive-dbmenu {color:#fff;} @media screen and (max-width:600px) { nav {margin: 0 15px;background: none;overflow:hidden} .dbmenu {display: none;} .responsive-dbmenu {display: block;} .dbmenu li {display: block;margin: 0px;} .dbmenu li a {background: #fff;color: #797979;} .dbmenu li a:hover,.dbmenu li:hover>a {background: #e8102d;color: #fff;} .dbmenu ul {visibility: hidden;opacity: 0;top: 0;right: 25px;width: 100%;} .dbmenu li:hover>ul {visibility: visible;opacity: 1;position: relative;} .dbmenu ul ul {right: 50px;} }