.header .nav { font-size: 0; background-color: #204c97; color: #fff; } .header .nav li { display: inline-block; vertical-align: middle; background: url(../images/li_07.jpg) no-repeat right center; padding-right: 1px; } .header .nav li a { display: block; font-size: 16px; line-height: 70px; padding: 0 35px; color: #fff; } .header .nav li .arr { float: right; height: 40px; width: 40px; position: relative; display: none; } .header .nav li .arr:after { content: ''; border-top: 2px solid #ccc; border-left: 2px solid #ccc; box-sizing: content-box; display: block; width: 8px; height: 8px; margin: auto; position: absolute; top: 0; bottom: 0; -webkit-transform: rotate(135deg); transform: rotate(135deg); right: 15px; } .header .nav li.active a, .header .nav li.open a, .header .nav li a:hover { color: #fff; background-color: #dd0000; } .header .nav li.dropdown { position: relative; } .header .nav li.dropdown:before { content: ""; position: absolute; border: 4px solid transparent; border-bottom: 0; border-top-color: currentColor; top: 50%; margin-top: -2px; right: 15px; } .header .nav .dropdown-box { position: absolute; left: 0; min-width: 100%; top: 100%; display: none; z-index: 10; text-align: center; } .header .nav .dropdown-box p { margin: 0; } .header .nav .dropdown-box a { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 10px; font-size: 14px; background-color: rgba(0, 0, 0, 0.5) !important; line-height: 40px; border-bottom: 1px solid rgba(0, 0, 0, 0.2); } .header .nav .dropdown-box a:hover { background-color: #dd0000 !important; } .header .nav li.open .dropdown-box { display: block; }