@font-face { font-family: 'FontAwesome'; src: url('https://cdn.bootcss.com/font-awesome/4.2.0/fonts/fontawesome-webfont.eot?v=4.2.0'); src: url('https://cdn.bootcss.com/font-awesome/4.2.0/fonts/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('https://cdn.bootcss.com/font-awesome/4.2.0/fonts/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('https://cdn.bootcss.com/font-awesome/4.2.0/fonts/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('https://cdn.bootcss.com/font-awesome/4.2.0/fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal; } .rc-menu { outline: none; margin-bottom: 0; padding-left: 0; list-style: none; z-index: 99999; border: 1px solid #d9d9d9; box-shadow: 0 0 4px #d9d9d9; border-radius: 3px; color: #666; } .rc-menu-hidden { display: none; } .rc-menu-collapse { overflow: hidden; } .rc-menu-collapse-active { transition: height 0.3s ease-out; } .rc-menu-item-group-list { margin: 0; padding: 0; } .rc-menu-item-group-title { color: #999; line-height: 1.5; padding: 8px 10px; border-bottom: 1px solid #dedede; } .rc-menu-item-active, .rc-menu-submenu-active > .rc-menu-submenu-title { background-color: #eaf8fe; } .rc-menu-item-selected { background-color: #eaf8fe; -webkit-transform: translateZ(0); transform: translateZ(0); } .rc-menu-submenu-selected { background-color: #eaf8fe; } .rc-menu > li.rc-menu-submenu { padding: 0; } .rc-menu-submenu-horizontal > .rc-menu { top: 100%; left: 0; position: absolute; min-width: 160px; margin-top: 4px; } .rc-menu-submenu-vertical > .rc-menu { top: 0; left: 100%; position: absolute; min-width: 160px; margin-left: 4px; } .rc-menu-item, .rc-menu-submenu-title { margin: 0; position: relative; display: block; padding: 7px 7px 7px 16px; white-space: nowrap; } .rc-menu-item.rc-menu-item-disabled, .rc-menu-submenu-title.rc-menu-item-disabled, .rc-menu-item.rc-menu-submenu-disabled, .rc-menu-submenu-title.rc-menu-submenu-disabled { color: #777 !important; } .rc-menu > .rc-menu-item-divider { height: 1px; margin: 1px 0; overflow: hidden; padding: 0; line-height: 0; background-color: #e5e5e5; } .rc-menu-submenu { position: relative; } .rc-menu-submenu > .rc-menu { background-color: #fff; } .rc-menu .rc-menu-submenu-title .anticon, .rc-menu .rc-menu-item .anticon { width: 14px; height: 14px; margin-right: 8px; top: -1px; } .rc-menu-horizontal { background-color: #F3F5F7; border: none; border-bottom: 1px solid transparent; border-bottom: 1px solid #d9d9d9; box-shadow: none; } .rc-menu-horizontal > .rc-menu-item, .rc-menu-horizontal > .rc-menu-submenu > .rc-menu-submenu-title { padding: 15px 20px; } .rc-menu-horizontal > .rc-menu-submenu, .rc-menu-horizontal > .rc-menu-item { float: left; border-bottom: 2px solid transparent; } .rc-menu-horizontal > .rc-menu-submenu-active, .rc-menu-horizontal > .rc-menu-item-active { border-bottom: 2px solid #2db7f5; background-color: #F3F5F7; color: #2baee9; } .rc-menu-horizontal:after { content: "\20"; display: block; height: 0; clear: both; } .rc-menu-vertical, .rc-menu-inline { padding: 12px 0; } .rc-menu-vertical > .rc-menu-item, .rc-menu-inline > .rc-menu-item, .rc-menu-vertical > .rc-menu-submenu > .rc-menu-submenu-title, .rc-menu-inline > .rc-menu-submenu > .rc-menu-submenu-title { padding: 12px 8px 12px 24px; } .rc-menu-vertical .rc-menu-submenu-arrow, .rc-menu-inline .rc-menu-submenu-arrow { display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; vertical-align: baseline; text-align: center; text-transform: none; text-rendering: auto; position: absolute; right: 16px; line-height: 1.5em; } .rc-menu-vertical .rc-menu-submenu-arrow:before, .rc-menu-inline .rc-menu-submenu-arrow:before { content: "\f0da"; } .rc-menu-inline .rc-menu-submenu-arrow { -webkit-transform: rotate(90deg); transform: rotate(90deg); transition: -webkit-transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s; } .rc-menu-inline .rc-menu-submenu-open > .rc-menu-submenu-title .rc-menu-submenu-arrow { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } .rc-menu-vertical.rc-menu-sub { padding: 0; } .rc-menu-sub.rc-menu-inline { padding: 0; border: none; border-radius: 0; box-shadow: none; } .rc-menu-sub.rc-menu-inline > .rc-menu-item, .rc-menu-sub.rc-menu-inline > .rc-menu-submenu > .rc-menu-submenu-title { padding-top: 8px; padding-bottom: 8px; padding-right: 0; } .rc-menu-open-slide-up-enter, .rc-menu-open-slide-up-appear { -webkit-animation-duration: .3s; animation-duration: .3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-transform-origin: 0 0; transform-origin: 0 0; opacity: 0; -webkit-animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1); animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1); -webkit-animation-play-state: paused; animation-play-state: paused; } .rc-menu-open-slide-up-leave { -webkit-animation-duration: .3s; animation-duration: .3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-transform-origin: 0 0; transform-origin: 0 0; opacity: 1; -webkit-animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34); animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34); -webkit-animation-play-state: paused; animation-play-state: paused; } .rc-menu-open-slide-up-enter.rc-menu-open-slide-up-enter-active, .rc-menu-open-slide-up-appear.rc-menu-open-slide-up-appear-active { -webkit-animation-name: rcMenuOpenSlideUpIn; animation-name: rcMenuOpenSlideUpIn; -webkit-animation-play-state: running; animation-play-state: running; } .rc-menu-open-slide-up-leave.rc-menu-open-slide-up-leave-active { -webkit-animation-name: rcMenuOpenSlideUpOut; animation-name: rcMenuOpenSlideUpOut; -webkit-animation-play-state: running; animation-play-state: running; } @-webkit-keyframes rcMenuOpenSlideUpIn { 0% { opacity: 0; -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleY(0); transform: scaleY(0); } 100% { opacity: 1; -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleY(1); transform: scaleY(1); } } @keyframes rcMenuOpenSlideUpIn { 0% { opacity: 0; -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleY(0); transform: scaleY(0); } 100% { opacity: 1; -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleY(1); transform: scaleY(1); } } @-webkit-keyframes rcMenuOpenSlideUpOut { 0% { opacity: 1; -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleY(1); transform: scaleY(1); } 100% { opacity: 0; -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleY(0); transform: scaleY(0); } } @keyframes rcMenuOpenSlideUpOut { 0% { opacity: 1; -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleY(1); transform: scaleY(1); } 100% { opacity: 0; -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleY(0); transform: scaleY(0); } } .rc-menu-open-zoom-enter, .rc-menu-open-zoom-appear { opacity: 0; -webkit-animation-duration: .3s; animation-duration: .3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1); animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1); -webkit-animation-play-state: paused; animation-play-state: paused; } .rc-menu-open-zoom-leave { -webkit-animation-duration: .3s; animation-duration: .3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34); animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34); -webkit-animation-play-state: paused; animation-play-state: paused; } .rc-menu-open-zoom-enter.rc-menu-open-zoom-enter-active, .rc-menu-open-zoom-appear.rc-menu-open-zoom-appear-active { -webkit-animation-name: rcMenuOpenZoomIn; animation-name: rcMenuOpenZoomIn; -webkit-animation-play-state: running; animation-play-state: running; } .rc-menu-open-zoom-leave.rc-menu-open-zoom-leave-active { -webkit-animation-name: rcMenuOpenZoomOut; animation-name: rcMenuOpenZoomOut; -webkit-animation-play-state: running; animation-play-state: running; } @-webkit-keyframes rcMenuOpenZoomIn { 0% { opacity: 0; -webkit-transform: scale(0, 0); transform: scale(0, 0); } 100% { opacity: 1; -webkit-transform: scale(1, 1); transform: scale(1, 1); } } @keyframes rcMenuOpenZoomIn { 0% { opacity: 0; -webkit-transform: scale(0, 0); transform: scale(0, 0); } 100% { opacity: 1; -webkit-transform: scale(1, 1); transform: scale(1, 1); } } @-webkit-keyframes rcMenuOpenZoomOut { 0% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 100% { opacity: 0; -webkit-transform: scale(0, 0); transform: scale(0, 0); } } @keyframes rcMenuOpenZoomOut { 0% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 100% { opacity: 0; -webkit-transform: scale(0, 0); transform: scale(0, 0); } }