Code:
header .mod_navigation ul li,
section#content .mod_navigation ul li,
footer .mod_navigation ul li,
header .mod_customnav ul li,
section#content .mod_customnav ul li,
footer .mod_customnav ul li {
position: relative;
}
header .mod_navigation ul li:hover > ul,
section#content .mod_navigation ul li:hover > ul,
footer .mod_navigation ul li:hover > ul,
header .mod_customnav ul li:hover > ul,
section#content .mod_customnav ul li:hover > ul,
footer .mod_customnav ul li:hover > ul {
opacity: 1;
visibility: visible;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
header .mod_navigation ul ul,
section#content .mod_navigation ul ul,
footer .mod_navigation ul ul,
header .mod_customnav ul ul,
section#content .mod_customnav ul ul,
footer .mod_customnav ul ul {
position: absolute;
opacity: 0;
visibility: hidden;
z-index: 300;
border: #dddddd;
background: #ffffff;
}
header .mod_navigation ul ul li,
section#content .mod_navigation ul ul li,
footer .mod_navigation ul ul li,
header .mod_customnav ul ul li,
section#content .mod_customnav ul ul li,
footer .mod_customnav ul ul li {
text-align: left;
}
header .mod_navigation ul ul li a,
section#content .mod_navigation ul ul li a,
footer .mod_navigation ul ul li a,
header .mod_customnav ul ul li a,
section#content .mod_customnav ul ul li a,
footer .mod_customnav ul ul li a,
header .mod_navigation ul ul li span,
section#content .mod_navigation ul ul li span,
footer .mod_navigation ul ul li span,
header .mod_customnav ul ul li span,
section#content .mod_customnav ul ul li span,
footer .mod_customnav ul ul li span {
min-width: 100px;
padding: 0.15em 0.6em;
margin: 0 0 0.15em;
background: transparent;
color: #333333;
}
header .mod_navigation ul ul li a.last,
section#content .mod_navigation ul ul li a.last,
footer .mod_navigation ul ul li a.last,
header .mod_customnav ul ul li a.last,
section#content .mod_customnav ul ul li a.last,
footer .mod_customnav ul ul li a.last,
header .mod_navigation ul ul li span.last,
section#content .mod_navigation ul ul li span.last,
footer .mod_navigation ul ul li span.last,
header .mod_customnav ul ul li span.last,
section#content .mod_customnav ul ul li span.last,
footer .mod_customnav ul ul li span.last {
margin: 0;
}
header .mod_navigation ul ul li:hover > a,
section#content .mod_navigation ul ul li:hover > a,
footer .mod_navigation ul ul li:hover > a,
header .mod_customnav ul ul li:hover > a,
section#content .mod_customnav ul ul li:hover > a,
footer .mod_customnav ul ul li:hover > a {
background: #f2f2f2;
color: #333333;
}
header .mod_navigation ul ul li span.active,
section#content .mod_navigation ul ul li span.active,
footer .mod_navigation ul ul li span.active,
header .mod_customnav ul ul li span.active,
section#content .mod_customnav ul ul li span.active,
footer .mod_customnav ul ul li span.active {
background: #f2f2f2;
color: #333333;
}
header .mod_navigation ul ul li span.forward,
section#content .mod_navigation ul ul li span.forward,
footer .mod_navigation ul ul li span.forward,
header .mod_customnav ul ul li span.forward,
section#content .mod_customnav ul ul li span.forward,
footer .mod_customnav ul ul li span.forward {
background: #f2f2f2;
color: #333333;
}
header .mod_navigation ul ul li a.trail,
section#content .mod_navigation ul ul li a.trail,
footer .mod_navigation ul ul li a.trail,
header .mod_customnav ul ul li a.trail,
section#content .mod_customnav ul ul li a.trail,
footer .mod_customnav ul ul li a.trail {
background: #f2f2f2;
color: #333333;
}
header .mod_navigation ul ul li.first:before,
section#content .mod_navigation ul ul li.first:before,
footer .mod_navigation ul ul li.first:before,
header .mod_customnav ul ul li.first:before,
section#content .mod_customnav ul ul li.first:before,
footer .mod_customnav ul ul li.first:before {
position: absolute;
content: '';
top: -6px;
left: 16px;
border: 6px solid transparent;
border-top-width: 0;
border-bottom-color: #ffffff;
z-index: 350;
}
header .mod_navigation ul ul li.first:hover:before,
section#content .mod_navigation ul ul li.first:hover:before,
footer .mod_navigation ul ul li.first:hover:before,
header .mod_customnav ul ul li.first:hover:before,
section#content .mod_customnav ul ul li.first:hover:before,
footer .mod_customnav ul ul li.first:hover:before {
border-bottom-color: #f2f2f2;
}
header .mod_navigation ul ul li.first.active:before,
section#content .mod_navigation ul ul li.first.active:before,
footer .mod_navigation ul ul li.first.active:before,
header .mod_customnav ul ul li.first.active:before,
section#content .mod_customnav ul ul li.first.active:before,
footer .mod_customnav ul ul li.first.active:before {
border-bottom-color: #f2f2f2;
}
header .mod_navigation ul ul li.first.forward:before,
section#content .mod_navigation ul ul li.first.forward:before,
footer .mod_navigation ul ul li.first.forward:before,
header .mod_customnav ul ul li.first.forward:before,
section#content .mod_customnav ul ul li.first.forward:before,
footer .mod_customnav ul ul li.first.forward:before {
border-bottom-color: #f2f2f2;
}
header .mod_navigation ul ul li.first.trail:before,
section#content .mod_navigation ul ul li.first.trail:before,
footer .mod_navigation ul ul li.first.trail:before,
header .mod_customnav ul ul li.first.trail:before,
section#content .mod_customnav ul ul li.first.trail:before,
footer .mod_customnav ul ul li.first.trail:before {
border-bottom-color: #f2f2f2;
}
header .mod_navigation ul ul li.first:after,
section#content .mod_navigation ul ul li.first:after,
footer .mod_navigation ul ul li.first:after,
header .mod_customnav ul ul li.first:after,
section#content .mod_customnav ul ul li.first:after,
footer .mod_customnav ul ul li.first:after {
position: absolute;
content: '';
top: -7px;
left: 15px;
border: 7px solid transparent;
border-top-width: 0;
border-bottom-color: #dddddd;
z-index: 300;
}
header .mod_navigation ul ul ul,
section#content .mod_navigation ul ul ul,
footer .mod_navigation ul ul ul,
header .mod_customnav ul ul ul,
section#content .mod_customnav ul ul ul,
footer .mod_customnav ul ul ul {
top: -1px;
left: 100%;
}
header .mod_navigation ul ul ul li.first:before,
section#content .mod_navigation ul ul ul li.first:before,
footer .mod_navigation ul ul ul li.first:before,
header .mod_customnav ul ul ul li.first:before,
section#content .mod_customnav ul ul ul li.first:before,
footer .mod_customnav ul ul ul li.first:before {
position: absolute;
content: '';
top: 50%;
left: -6px;
margin-top: -6px;
border: 6px solid transparent;
border-left-width: 0;
border-right-color: #ffffff;
z-index: 350;
}
header .mod_navigation ul ul ul li.first:hover:before,
section#content .mod_navigation ul ul ul li.first:hover:before,
footer .mod_navigation ul ul ul li.first:hover:before,
header .mod_customnav ul ul ul li.first:hover:before,
section#content .mod_customnav ul ul ul li.first:hover:before,
footer .mod_customnav ul ul ul li.first:hover:before {
border-right-color: #f2f2f2;
}
header .mod_navigation ul ul ul li.first.active:before,
section#content .mod_navigation ul ul ul li.first.active:before,
footer .mod_navigation ul ul ul li.first.active:before,
header .mod_customnav ul ul ul li.first.active:before,
section#content .mod_customnav ul ul ul li.first.active:before,
footer .mod_customnav ul ul ul li.first.active:before {
border-right-color: #f2f2f2;
}
header .mod_navigation ul ul ul li.first.forward:before,
section#content .mod_navigation ul ul ul li.first.forward:before,
footer .mod_navigation ul ul ul li.first.forward:before,
header .mod_customnav ul ul ul li.first.forward:before,
section#content .mod_customnav ul ul ul li.first.forward:before,
footer .mod_customnav ul ul ul li.first.forward:before {
border-right-color: #f2f2f2;
}
header .mod_navigation ul ul ul li.first.trail:before,
section#content .mod_navigation ul ul ul li.first.trail:before,
footer .mod_navigation ul ul ul li.first.trail:before,
header .mod_customnav ul ul ul li.first.trail:before,
section#content .mod_customnav ul ul ul li.first.trail:before,
footer .mod_customnav ul ul ul li.first.trail:before {
border-right-color: #f2f2f2;
}
header .mod_navigation ul ul ul li.first:hover:before,
section#content .mod_navigation ul ul ul li.first:hover:before,
footer .mod_navigation ul ul ul li.first:hover:before,
header .mod_customnav ul ul ul li.first:hover:before,
section#content .mod_customnav ul ul ul li.first:hover:before,
footer .mod_customnav ul ul ul li.first:hover:before,
header .mod_navigation ul ul ul li.first.active:before,
section#content .mod_navigation ul ul ul li.first.active:before,
footer .mod_navigation ul ul ul li.first.active:before,
header .mod_customnav ul ul ul li.first.active:before,
section#content .mod_customnav ul ul ul li.first.active:before,
footer .mod_customnav ul ul ul li.first.active:before,
header .mod_navigation ul ul ul li.first.forward:before,
section#content .mod_navigation ul ul ul li.first.forward:before,
footer .mod_navigation ul ul ul li.first.forward:before,
header .mod_customnav ul ul ul li.first.forward:before,
section#content .mod_customnav ul ul ul li.first.forward:before,
footer .mod_customnav ul ul ul li.first.forward:before,
header .mod_navigation ul ul ul li.first.trail:before,
section#content .mod_navigation ul ul ul li.first.trail:before,
footer .mod_navigation ul ul ul li.first.trail:before,
header .mod_customnav ul ul ul li.first.trail:before,
section#content .mod_customnav ul ul ul li.first.trail:before,
footer .mod_customnav ul ul ul li.first.trail:before {
border-bottom-color: transparent;
}
header .mod_navigation ul ul ul li.first:after,
section#content .mod_navigation ul ul ul li.first:after,
footer .mod_navigation ul ul ul li.first:after,
header .mod_customnav ul ul ul li.first:after,
section#content .mod_customnav ul ul ul li.first:after,
footer .mod_customnav ul ul ul li.first:after {
position: absolute;
content: '';
top: 50%;
left: -7px;
margin-top: -7px;
border: 7px solid transparent;
border-left-width: 0;
border-right-color: #dddddd;
z-index: 300;
}
header .mod_navigation > ul > li.last > ul,
section#content .mod_navigation > ul > li.last > ul,
footer .mod_navigation > ul > li.last > ul,
header .mod_customnav > ul > li.last > ul,
section#content .mod_customnav > ul > li.last > ul,
footer .mod_customnav > ul > li.last > ul {
right: 0;
}
header .mod_navigation > ul > li.last > ul > li.first:before,
section#content .mod_navigation > ul > li.last > ul > li.first:before,
footer .mod_navigation > ul > li.last > ul > li.first:before,
header .mod_customnav > ul > li.last > ul > li.first:before,
section#content .mod_customnav > ul > li.last > ul > li.first:before,
footer .mod_customnav > ul > li.last > ul > li.first:before {
right: 16px;
left: auto;
}
header .mod_navigation > ul > li.last > ul > li.first:after,
section#content .mod_navigation > ul > li.last > ul > li.first:after,
footer .mod_navigation > ul > li.last > ul > li.first:after,
header .mod_customnav > ul > li.last > ul > li.first:after,
section#content .mod_customnav > ul > li.last > ul > li.first:after,
footer .mod_customnav > ul > li.last > ul > li.first:after {
right: 15px;
left: auto;
}
header .mod_navigation > ul > li.last > ul ul,
section#content .mod_navigation > ul > li.last > ul ul,
footer .mod_navigation > ul > li.last > ul ul,
header .mod_customnav > ul > li.last > ul ul,
section#content .mod_customnav > ul > li.last > ul ul,
footer .mod_customnav > ul > li.last > ul ul {
right: 100%;
left: auto;
}
header .mod_navigation > ul > li.last > ul ul li.first:before,
section#content .mod_navigation > ul > li.last > ul ul li.first:before,
footer .mod_navigation > ul > li.last > ul ul li.first:before,
header .mod_customnav > ul > li.last > ul ul li.first:before,
section#content .mod_customnav > ul > li.last > ul ul li.first:before,
footer .mod_customnav > ul > li.last > ul ul li.first:before {
right: -6px;
left: auto;
border: 6px solid transparent;
border-right-width: 0;
border-left-color: #ffffff;
}
header .mod_navigation > ul > li.last > ul ul li.first:hover:before,
section#content .mod_navigation > ul > li.last > ul ul li.first:hover:before,
footer .mod_navigation > ul > li.last > ul ul li.first:hover:before,
header .mod_customnav > ul > li.last > ul ul li.first:hover:before,
section#content .mod_customnav > ul > li.last > ul ul li.first:hover:before,
footer .mod_customnav > ul > li.last > ul ul li.first:hover:before {
border-left-color: #f2f2f2;
}
header .mod_navigation > ul > li.last > ul ul li.first.active:before,
section#content .mod_navigation > ul > li.last > ul ul li.first.active:before,
footer .mod_navigation > ul > li.last > ul ul li.first.active:before,
header .mod_customnav > ul > li.last > ul ul li.first.active:before,
section#content .mod_customnav > ul > li.last > ul ul li.first.active:before,
footer .mod_customnav > ul > li.last > ul ul li.first.active:before {
border-left-color: #f2f2f2;
}
header .mod_navigation > ul > li.last > ul ul li.first.forward:before,
section#content .mod_navigation > ul > li.last > ul ul li.first.forward:before,
footer .mod_navigation > ul > li.last > ul ul li.first.forward:before,
header .mod_customnav > ul > li.last > ul ul li.first.forward:before,
section#content .mod_customnav > ul > li.last > ul ul li.first.forward:before,
footer .mod_customnav > ul > li.last > ul ul li.first.forward:before {
border-left-color: #f2f2f2;
}
header .mod_navigation > ul > li.last > ul ul li.first.trail:before,
section#content .mod_navigation > ul > li.last > ul ul li.first.trail:before,
footer .mod_navigation > ul > li.last > ul ul li.first.trail:before,
header .mod_customnav > ul > li.last > ul ul li.first.trail:before,
section#content .mod_customnav > ul > li.last > ul ul li.first.trail:before,
footer .mod_customnav > ul > li.last > ul ul li.first.trail:before {
border-left-color: #f2f2f2;
}
header .mod_navigation > ul > li.last > ul ul li.first:after,
section#content .mod_navigation > ul > li.last > ul ul li.first:after,
footer .mod_navigation > ul > li.last > ul ul li.first:after,
header .mod_customnav > ul > li.last > ul ul li.first:after,
section#content .mod_customnav > ul > li.last > ul ul li.first:after,
footer .mod_customnav > ul > li.last > ul ul li.first:after {
right: -7px;
left: auto;
border: 7px solid transparent;
border-right-width: 0;
border-left-color: #dddddd;
}
Lesezeichen