Skip to content
Snippets Groups Projects
a11y-navbar.styles.css 15.8 KiB
Newer Older
Brian Canini's avatar
Brian Canini committed
nav.a11y-navbar{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;font-family:"proximanova",Helvetica,Arial,sans-serif;display:block;position:relative;width:100%;overflow:visible}nav.a11y-navbar div,nav.a11y-navbar span,nav.a11y-navbar ul,nav.a11y-navbar ol,nav.a11y-navbar li,nav.a11y-navbar a,nav.a11y-navbar p{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}nav.a11y-navbar ul,nav.a11y-navbar ol,nav.a11y-navbar li{list-style:none}nav.a11y-navbar ul.a11y-navbar-menubar{background-color:#ededed;list-style-type:none}nav.a11y-navbar ul.a11y-navbar-menubar li{list-style-type:none;position:relative}nav.a11y-navbar ul.a11y-navbar-menubar li a[role=menuitem]{color:#2d2d2d;text-decoration:none;background-color:#ededed;line-height:1.5rem;padding:0 1rem 0 1rem;display:block;touch-action:manipulation}nav.a11y-navbar ul.a11y-navbar-menubar li a[role=menuitem]:focus,nav.a11y-navbar ul.a11y-navbar-menubar li a[role=menuitem]:hover{color:#ededed;background-color:#2d2d2d}nav.a11y-navbar ul.a11y-navbar-menubar li ul[role=menu]{opacity:0}nav.a11y-navbar ul.a11y-navbar-menubar li ul[role=menu].a11y-navbar-menu-open{display:block;width:10rem;position:absolute;opacity:1;transition:opacity 0.4s linear;z-index:9999}nav.a11y-navbar ul.a11y-navbar-menubar li ul[role=menu].a11y-navbar-menu-open li{display:block;width:100%}nav.a11y-navbar ul.a11y-navbar-menubar li ul[role=menu].a11y-navbar-menu-open li a[aria-haspopup=true]::after{content:'';width:0;height:0;border-top:0.25rem solid transparent;border-bottom:0.25rem solid transparent;border-left:0.25rem solid #2d2d2d;position:absolute;right:0.25rem;top:0.5rem}nav.a11y-navbar ul.a11y-navbar-menubar li ul[role=menu].a11y-navbar-menu-open li a[aria-haspopup=true]:hover::after,nav.a11y-navbar ul.a11y-navbar-menubar li ul[role=menu].a11y-navbar-menu-open li a[aria-haspopup=true]:focus::after{border-left:0.25rem solid #ededed}nav.a11y-navbar ul.a11y-navbar-menubar li ul[role=menu].a11y-navbar-menu-closed{border:0 !important;clip:rect(0 0 0 0) !important;height:1px !important;margin:-1px !important;overflow:hidden !important;padding:0 !important;position:absolute !important;width:1px !important}nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li{display:inline-block}nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem]{border-bottom:1px solid #666}nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem].a11y-navbar-menuitem{border-right:1px solid #666;border-bottom:none}nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem].a11y-navbar-menuitem[aria-haspopup=true]{padding-right:1.5rem}nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem].a11y-navbar-menuitem[aria-haspopup=true]::after{content:'';width:0;height:0;border-top:0.25rem solid #2d2d2d;border-right:0.25rem solid transparent;border-left:0.25rem solid transparent;position:absolute;right:0.25rem;top:0.5rem}nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem].a11y-navbar-menuitem[aria-haspopup=true]:hover::after,nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem].a11y-navbar-menuitem[aria-haspopup=true]:focus::after{border-top:0.25rem solid #ededed}nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu].a11y-navbar-menu-open{top:1.5rem;left:0}nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu].a11y-navbar-menu-open li ul[role=menu]{top:0rem;left:100%}nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical{width:10rem}nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical a[role=menuitem][aria-haspopup=true]::after{content:'';width:0;height:0;border-top:0.25rem solid transparent;border-bottom:0.25rem solid transparent;border-left:0.25rem solid #2d2d2d;position:absolute;right:0.25rem;top:0.5rem}nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li{border:1px solid #666;border-bottom:none}nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li:last-child{border-bottom:1px solid #666}nav.a11y-navbar ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu].a11y-navbar-menu-open{top:-1px;left:100%}nav.a11y-navbar.a11y-navbar-responsive div.a11y-navbar-instructions-show{border:0 !important;clip:rect(0 0 0 0) !important;height:1px !important;margin:-1px !important;overflow:hidden !important;padding:0 !important;position:absolute !important;width:1px !important}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical{width:auto}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li{border:none;display:block}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem],nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li a[role=menuitem]{border-bottom:1px solid #666}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem].a11y-navbar-menuitem,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li a[role=menuitem].a11y-navbar-menuitem{border-right:none;border-bottom:1px solid #666}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem]:focus,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem]:hover,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li a[role=menuitem]:focus,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li a[role=menuitem]:hover{color:#ededed;background-color:#2d2d2d}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem][aria-haspopup=true],nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li a[role=menuitem][aria-haspopup=true]{padding-right:1.5rem}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem][aria-haspopup=true]::after,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li a[role=menuitem][aria-haspopup=true]::after{content:'';width:0;height:0;border-top:0.25rem solid #2d2d2d;border-right:0.25rem solid transparent;border-left:0.25rem solid transparent;position:absolute;right:0.25rem;top:0.5rem}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem][aria-haspopup=true]:hover::after,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li a[role=menuitem][aria-haspopup=true]:focus::after,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li a[role=menuitem][aria-haspopup=true]:hover::after,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li a[role=menuitem][aria-haspopup=true]:focus::after{border-top:0.25rem solid #ededed}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu],nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu]{opacity:1;max-height:0;overflow:hidden;position:static;width:100%}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu].a11y-navbar-menu-open,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu].a11y-navbar-menu-open{max-height:9999px;transition:max-height 1s ease-in}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu] li a[role=menuitem],nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu] li a[role=menuitem]{background-color:#a1a1a1;color:#fff}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu] li a[role=menuitem]:focus,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu] li a[role=menuitem]:hover,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu] li a[role=menuitem]:focus,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu] li a[role=menuitem]:hover{color:#ededed;background-color:#2d2d2d}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu] li a[role=menuitem][aria-haspopup=true],nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu] li a[role=menuitem][aria-haspopup=true]{padding-right:1.5rem}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu] li a[role=menuitem][aria-haspopup=true]::after,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu] li a[role=menuitem][aria-haspopup=true]::after{content:'';width:0;height:0;border-top:0.25rem solid #2d2d2d;border-right:0.25rem solid transparent;border-left:0.25rem solid transparent;position:absolute;right:0.25rem;top:0.5rem}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu] li a[role=menuitem][aria-haspopup=true]:hover::after,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu] li a[role=menuitem][aria-haspopup=true]:focus::after,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu] li a[role=menuitem][aria-haspopup=true]:hover::after,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu] li a[role=menuitem][aria-haspopup=true]:focus::after{border-top:0.25rem solid #ededed}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu] li ul[role=menu] li a[role=menuitem],nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu] li ul[role=menu] li a[role=menuitem]{background-color:#545454;color:#fff}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu] li ul[role=menu] li a[role=menuitem]:focus,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu] li ul[role=menu] li a[role=menuitem]:hover,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu] li ul[role=menu] li a[role=menuitem]:focus,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu] li ul[role=menu] li a[role=menuitem]:hover{color:#ededed;background-color:#2d2d2d}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu] li ul[role=menu] li ul[role=menu] li a[role=menuitem],nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu] li ul[role=menu] li ul[role=menu] li a[role=menuitem]{background-color:#080808;color:#fff}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu] li ul[role=menu] li ul[role=menu] li a[role=menuitem]:focus,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li ul[role=menu] li ul[role=menu] li ul[role=menu] li a[role=menuitem]:hover,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu] li ul[role=menu] li ul[role=menu] li a[role=menuitem]:focus,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li ul[role=menu] li ul[role=menu] li ul[role=menu] li a[role=menuitem]:hover{color:#ededed;background-color:#2d2d2d}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li button.a11y-navbar-submenu-toggle,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li button.a11y-navbar-submenu-toggle{position:absolute;right:0;top:0;height:1.5rem;width:2rem;z-index:9999;touch-action:manipulation;box-shadow:none;border:none;border-radius:0;background-color:#2d2d2d;padding:0}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li button.a11y-navbar-submenu-toggle span,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li button.a11y-navbar-submenu-toggle span{border:0 !important;clip:rect(0 0 0 0) !important;height:1px !important;margin:-1px !important;overflow:hidden !important;padding:0 !important;position:absolute !important;width:1px !important}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li button.a11y-navbar-submenu-toggle::after,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li button.a11y-navbar-submenu-toggle::after{content:'';display:inline-block;border-right:2px solid #ededed;border-bottom:2px solid #ededed;width:10px;height:10px;background-color:transparent}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li button.a11y-navbar-submenu-toggle[aria-expanded=true]::after,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li button.a11y-navbar-submenu-toggle[aria-expanded=true]::after{transform:rotate(225deg)}nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-horizontal li button.a11y-navbar-submenu-toggle[aria-expanded=false]::after,nav.a11y-navbar.a11y-navbar-responsive ul.a11y-navbar-menubar.a11y-navbar-orientation-vertical li button.a11y-navbar-submenu-toggle[aria-expanded=false]::after{transform:rotate(45deg)}nav.a11y-navbar.a11y-navbar-closed{display:none}nav.a11y-navbar div.a11y-navbar-instructions{border:0 !important;clip:rect(0 0 0 0) !important;height:1px !important;margin:-1px !important;overflow:hidden !important;padding:0 !important;position:absolute !important;width:1px !important}button.a11y-navbar-toggle{padding:0;border:none;font:inherit;color:inherit;background-color:transparent;cursor:pointer;font-family:"proximanova",Helvetica,Arial,sans-serif;background-color:#2d2d2d;color:#ededed;width:100%;padding:0.5rem;text-align:left;position:relative;touch-action:manipulation}button.a11y-navbar-toggle:focus,button.a11y-navbar-toggle:hover{background-color:#ededed;color:#2d2d2d;outline-color:#2d2d2d}button.a11y-navbar-toggle:focus span,button.a11y-navbar-toggle:focus span::before,button.a11y-navbar-toggle:focus span::after,button.a11y-navbar-toggle:hover span,button.a11y-navbar-toggle:hover span::before,button.a11y-navbar-toggle:hover span::after{background:#2d2d2d}button.a11y-navbar-toggle span{position:absolute;right:1rem;top:40%}button.a11y-navbar-toggle span,button.a11y-navbar-toggle span::before,button.a11y-navbar-toggle span::after{cursor:pointer;border-radius:1px;height:3px;width:20px;background:#ededed;position:absolute;display:block;content:''}button.a11y-navbar-toggle span::before{top:-5px}button.a11y-navbar-toggle span::after{bottom:-5px}