2013-10-09 12:30:53 +02:00
|
|
|
.navigation {
|
|
|
|
@include padding-leader;
|
|
|
|
background: $color-background;
|
2013-02-09 04:10:33 +01:00
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
li {
|
|
|
|
@include trailer(.5);
|
2013-02-09 04:10:33 +01:00
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
&:last-child { margin-bottom: 0; }
|
2013-02-09 04:10:33 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
a {
|
2013-10-09 12:30:53 +02:00
|
|
|
@include padding-leader(.5);
|
|
|
|
@include padding-trailer(.5);
|
|
|
|
display: block;
|
|
|
|
padding: {
|
|
|
|
right: $gutter-width;
|
|
|
|
left: $gutter-width;
|
|
|
|
}
|
|
|
|
background: mix($color-background, $color-background-shade);
|
2012-11-28 12:09:54 +01:00
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
&:hover,
|
|
|
|
&:focus { background: $color-background-shade; }
|
|
|
|
}
|
2012-11-28 17:23:08 +01:00
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
@include at-breakpoint($tablet-small) {
|
|
|
|
margin: {
|
|
|
|
right: 0;
|
|
|
|
left: 0;
|
2012-11-28 17:23:08 +01:00
|
|
|
}
|
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
ul { @extend %clear-fix-tablet-small; }
|
|
|
|
|
2012-11-28 17:23:08 +01:00
|
|
|
li {
|
2013-10-09 12:30:53 +02:00
|
|
|
float: left;
|
|
|
|
width: 50%;
|
2012-11-28 17:23:08 +01:00
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
&:nth-child(odd) {
|
|
|
|
clear: both;
|
|
|
|
padding-right: $gutter-width / 2;
|
|
|
|
}
|
2012-11-28 17:23:08 +01:00
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
&:nth-child(even) { padding-left: $gutter-width / 2; }
|
2012-11-28 17:23:08 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
@include at-breakpoint($tablet-large) {
|
2013-10-10 20:20:39 +02:00
|
|
|
@extend %table-layout-cell-tablet-large;
|
2013-10-09 12:30:53 +02:00
|
|
|
margin: 0;
|
|
|
|
padding: 0;
|
|
|
|
text-align: right;
|
|
|
|
background: none;
|
2012-11-28 17:23:08 +01:00
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
&.collapse { display: table-cell !important; }
|
2013-02-09 04:10:33 +01:00
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
ul {
|
|
|
|
display: inline-block;
|
|
|
|
margin: 0 #{-$gutter-width} 0 $gutter-width;
|
2013-02-24 07:04:16 +01:00
|
|
|
}
|
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
li {
|
2013-02-24 07:04:16 +01:00
|
|
|
margin: {
|
2013-10-09 12:30:53 +02:00
|
|
|
right: $gutter-width;
|
|
|
|
bottom: 0;
|
2013-02-24 07:04:16 +01:00
|
|
|
}
|
2013-10-09 12:30:53 +02:00
|
|
|
width: auto;
|
2012-11-28 17:23:08 +01:00
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
&:nth-child(odd) {
|
|
|
|
clear: none;
|
|
|
|
padding-right: 0;
|
2012-11-29 18:33:08 +01:00
|
|
|
}
|
2013-02-11 03:39:30 +01:00
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
&:nth-child(even) { padding-left: 0; }
|
2013-02-11 03:39:30 +01:00
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
&:last-child { margin-right: 0; }
|
|
|
|
}
|
2013-02-11 03:39:30 +01:00
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
a {
|
|
|
|
background: none;
|
2013-02-11 03:39:30 +01:00
|
|
|
|
2013-10-09 12:30:53 +02:00
|
|
|
&:hover,
|
|
|
|
&:focus { background: $color-background-shade; }
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|