|
@ -1,4 +1,4 @@ |
|
|
nav { |
|
|
|
|
|
|
|
|
/*nav { |
|
|
overflow: hidden; |
|
|
overflow: hidden; |
|
|
padding: 0px 0px; |
|
|
padding: 0px 0px; |
|
|
background: #E7732F; |
|
|
background: #E7732F; |
|
@ -23,37 +23,41 @@ nav ul li a img { |
|
|
nav ul li a img:hover { |
|
|
nav ul li a img:hover { |
|
|
background: #ffffff; |
|
|
background: #ffffff; |
|
|
} |
|
|
} |
|
|
|
|
|
*/ |
|
|
|
|
|
|
|
|
#container { |
|
|
|
|
|
min-height: 100%; |
|
|
|
|
|
position: relative; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
#body { |
|
|
|
|
|
padding: 10px; |
|
|
|
|
|
padding-bottom: 2em; /* Height of the footer */ |
|
|
|
|
|
|
|
|
html, body { |
|
|
|
|
|
height: 100%; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
#footer { |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
bottom: 0; |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
height: 2em; /* Height of the footer */ |
|
|
|
|
|
|
|
|
body { |
|
|
|
|
|
display: flex; |
|
|
|
|
|
flex-direction: column; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.float-left { |
|
|
|
|
|
float: left; |
|
|
|
|
|
|
|
|
#wrapper { |
|
|
|
|
|
flex: 1 0 auto; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.float-right { |
|
|
|
|
|
float: right; |
|
|
|
|
|
|
|
|
#footer { |
|
|
|
|
|
flex-shrink: 0; |
|
|
|
|
|
padding: 0.5em; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.text-align-right { |
|
|
.text-align-right { |
|
|
text-align: right; |
|
|
text-align: right; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.pure-menu-link { |
|
|
|
|
|
|
|
|
.pure-menu-item a img { |
|
|
|
|
|
padding: .1em .2em; |
|
|
|
|
|
max-height: 2.4em; |
|
|
|
|
|
min-width: 2.4em; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/*body { |
|
|
|
|
|
padding: 0em; |
|
|
|
|
|
}*/ |
|
|
|
|
|
|
|
|
|
|
|
/*.pure-menu-link { |
|
|
color: #000000; |
|
|
color: #000000; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
@ -61,4 +65,169 @@ nav ul li a img:hover { |
|
|
.pure-menu-link:focus, |
|
|
.pure-menu-link:focus, |
|
|
.pure-menu-link:hover { |
|
|
.pure-menu-link:hover { |
|
|
background-color:#ffffff |
|
|
background-color:#ffffff |
|
|
|
|
|
}*/ |
|
|
|
|
|
|
|
|
|
|
|
.menu-wrapper { |
|
|
|
|
|
background-color: #E7732F; |
|
|
|
|
|
margin-bottom: 2.5em; |
|
|
|
|
|
white-space: nowrap; |
|
|
|
|
|
position: relative; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu { |
|
|
|
|
|
display: inline-block; |
|
|
|
|
|
width: auto; |
|
|
|
|
|
vertical-align: middle; |
|
|
|
|
|
-webkit-font-smoothing: antialiased; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu .pure-menu-link, |
|
|
|
|
|
.menu .pure-menu-heading { |
|
|
|
|
|
color: black; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu .pure-menu-link:hover, |
|
|
|
|
|
.menu .pure-menu-heading:hover { |
|
|
|
|
|
background-color: transparent; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-top { |
|
|
|
|
|
position: relative; |
|
|
|
|
|
padding-top: .5em; |
|
|
|
|
|
padding-bottom: .5em; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-brand { |
|
|
|
|
|
display: block; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
position: relative; |
|
|
|
|
|
color: black; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-toggle { |
|
|
|
|
|
width: 44px; |
|
|
|
|
|
height: 44px; |
|
|
|
|
|
display: block; |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
top: 3px; |
|
|
|
|
|
right: 0; |
|
|
|
|
|
display: none; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-toggle .bar { |
|
|
|
|
|
background-color: white; |
|
|
|
|
|
display: block; |
|
|
|
|
|
width: 20px; |
|
|
|
|
|
height: 2px; |
|
|
|
|
|
border-radius: 100px; |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
top: 22px; |
|
|
|
|
|
right: 12px; |
|
|
|
|
|
-webkit-transition: all 0.5s; |
|
|
|
|
|
-moz-transition: all 0.5s; |
|
|
|
|
|
-ms-transition: all 0.5s; |
|
|
|
|
|
transition: all 0.5s; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-toggle .bar:first-child { |
|
|
|
|
|
-webkit-transform: translateY(-6px); |
|
|
|
|
|
-moz-transform: translateY(-6px); |
|
|
|
|
|
-ms-transform: translateY(-6px); |
|
|
|
|
|
transform: translateY(-6px); |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-toggle.x .bar { |
|
|
|
|
|
-webkit-transform: rotate(45deg); |
|
|
|
|
|
-moz-transform: rotate(45deg); |
|
|
|
|
|
-ms-transform: rotate(45deg); |
|
|
|
|
|
transform: rotate(45deg); |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-toggle.x .bar:first-child { |
|
|
|
|
|
-webkit-transform: rotate(-45deg); |
|
|
|
|
|
-moz-transform: rotate(-45deg); |
|
|
|
|
|
-ms-transform: rotate(-45deg); |
|
|
|
|
|
transform: rotate(-45deg); |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-screen { |
|
|
|
|
|
background-color: #E7732F; |
|
|
|
|
|
-webkit-transition: all 0.5s; |
|
|
|
|
|
-moz-transition: all 0.5s; |
|
|
|
|
|
-ms-transition: all 0.5s; |
|
|
|
|
|
transition: all 0.5s; |
|
|
|
|
|
height: 3em; |
|
|
|
|
|
width: 70em; |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
top: 0; |
|
|
|
|
|
z-index: -1; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-tucked .menu-screen { |
|
|
|
|
|
-webkit-transform: translateY(-44px); |
|
|
|
|
|
-moz-transform: translateY(-44px); |
|
|
|
|
|
-ms-transform: translateY(-44px); |
|
|
|
|
|
transform: translateY(-44px); |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
@media (min-width: 62em) { |
|
|
|
|
|
.menu-screen { |
|
|
|
|
|
margin-top: 2.95em; |
|
|
|
|
|
z-index: 1; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
@media (max-width: 62em) { |
|
|
|
|
|
.menu { |
|
|
|
|
|
display: block; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-toggle { |
|
|
|
|
|
display: block; |
|
|
|
|
|
display: none\9; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-bottom { |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
border-top: 1px solid #E7732F; |
|
|
|
|
|
background-color: #808080\9; |
|
|
|
|
|
z-index: 100; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-bottom .pure-menu-link { |
|
|
|
|
|
opacity: 1; |
|
|
|
|
|
-webkit-transform: translateX(0); |
|
|
|
|
|
-moz-transform: translateX(0); |
|
|
|
|
|
-ms-transform: translateX(0); |
|
|
|
|
|
transform: translateX(0); |
|
|
|
|
|
-webkit-transition: all 0.5s; |
|
|
|
|
|
-moz-transition: all 0.5s; |
|
|
|
|
|
-ms-transition: all 0.5s; |
|
|
|
|
|
transition: all 0.5s; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-bottom.menu-tucked .pure-menu-link { |
|
|
|
|
|
-webkit-transform: translateX(-140px); |
|
|
|
|
|
-moz-transform: translateX(-140px); |
|
|
|
|
|
-ms-transform: translateX(-140px); |
|
|
|
|
|
transform: translateX(-140px); |
|
|
|
|
|
opacity: 0; |
|
|
|
|
|
opacity: 1\9; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.pure-menu-horizontal.menu-tucked { |
|
|
|
|
|
z-index: -1; |
|
|
|
|
|
top: 45px; |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
overflow: hidden; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.menu-untucked { |
|
|
|
|
|
height: 3.1em; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.pure-menu-horizontal.pure-menu-scrollable.menu-untucked { |
|
|
|
|
|
overflow-x: auto; |
|
|
|
|
|
} |
|
|
} |
|
|
} |