Added the css Files to VCS
TODO Selector configuration for easier implementation
This commit is contained in:
@@ -0,0 +1,189 @@
|
||||
/* Simons SCSS Framework */
|
||||
@CHARSET "ISO-8859-1";
|
||||
/* RESET
|
||||
|
||||
SOURCE:
|
||||
http://meyerweb.com/eric/tools/css/reset/
|
||||
v2.0 | 20110126
|
||||
License: none (public domain)
|
||||
|
||||
*/
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||
article, aside, canvas, details, embed,
|
||||
figure, figcaption, footer, header, hgroup,
|
||||
menu, nav, output, ruby, section, summary,
|
||||
time, mark, audio, video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline; }
|
||||
|
||||
/* HTML5 display-role reset for older browsers */
|
||||
article, aside, details, figcaption, figure,
|
||||
footer, header, hgroup, menu, nav, section {
|
||||
display: block; }
|
||||
|
||||
ol, ul {
|
||||
list-style: none; }
|
||||
|
||||
blockquote, q {
|
||||
quotes: none; }
|
||||
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {
|
||||
content: '';
|
||||
content: none; }
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0 !important; }
|
||||
|
||||
.content {
|
||||
padding: 10px 0 0 20px;
|
||||
background-color: #6ac88e;
|
||||
border-bottom: solid 40px #c86350;
|
||||
/* Absolute Positioning */
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0; }
|
||||
.content .wrap {
|
||||
/*BASIC LAYOUT*/
|
||||
/* Positioning */
|
||||
position: relative;
|
||||
display: inline-table;
|
||||
/* Sizing */
|
||||
box-sizing: border-box;
|
||||
width: 25%;
|
||||
/* Gutters */
|
||||
margin: 0 -4px 0 0 !important;
|
||||
padding: 0 20px 20px 0 !important;
|
||||
border: none !important;
|
||||
/* Typography */
|
||||
letter-spacing: 0;
|
||||
/* Remove last border */ }
|
||||
.content .wrap:nth-of-type(4) {
|
||||
border-right: none; }
|
||||
.content .wrap > * {
|
||||
/* Wrapper inside Element needed
|
||||
because of gutter >* */
|
||||
max-width: 100%;
|
||||
box-sizing: border-box; }
|
||||
.content .wrap .inner {
|
||||
background-color: #ffffff;
|
||||
padding: 20px 20px 40px 20px !important;
|
||||
box-shadow: 15px 15px 15px rgba(0, 0, 0, 0.4); }
|
||||
.content .wrap .inner .head {
|
||||
font-family: sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 18px;
|
||||
line-height: 24px;
|
||||
padding: 10px 0;
|
||||
color: #c86350; }
|
||||
.content .wrap .inner .img-wrapper {
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden; }
|
||||
.content .wrap .inner .img-wrapper img {
|
||||
width: 100%; }
|
||||
.content .wrap.focus {
|
||||
/*FOCUS EFFECT*/ }
|
||||
.content .wrap.focus .head {
|
||||
/* Camera Focus Effect */
|
||||
-webkit-transition-property: all;
|
||||
transition-property: all;
|
||||
-webkit-transition-duration: 0.5s;
|
||||
transition-duration: 0.5s;
|
||||
-webkit-transition-timing-function: ease;
|
||||
transition-timing-function: ease; }
|
||||
.content .wrap.focus .head:hover {
|
||||
-webkit-filter: blur(10px);
|
||||
filter: blur(10px); }
|
||||
.content .wrap.focus img {
|
||||
/* Camera Focus Effect */
|
||||
-webkit-transition-property: all;
|
||||
transition-property: all;
|
||||
-webkit-transition-duration: 0.5s;
|
||||
transition-duration: 0.5s;
|
||||
-webkit-transition-timing-function: ease;
|
||||
transition-timing-function: ease; }
|
||||
.content .wrap.focus img:hover {
|
||||
-webkit-filter: blur(10px);
|
||||
filter: blur(10px); }
|
||||
.content .wrap.zoom {
|
||||
/*ZOOM EFFECT*/ }
|
||||
.content .wrap.zoom .head {
|
||||
-webkit-transition-property: all;
|
||||
transition-property: all;
|
||||
-webkit-transition-duration: 0.5s;
|
||||
transition-duration: 0.5s;
|
||||
-webkit-transition-timing-function: ease;
|
||||
transition-timing-function: ease; }
|
||||
.content .wrap.zoom .head:hover {
|
||||
-webkit-transform: rotate(0deg) scale(1.5) translate(0px, 0px);
|
||||
transform: rotate(0deg) scale(1.5) translate(0px, 0px); }
|
||||
.content .wrap.zoom img {
|
||||
-webkit-transition-property: all;
|
||||
transition-property: all;
|
||||
-webkit-transition-duration: 0.5s;
|
||||
transition-duration: 0.5s;
|
||||
-webkit-transition-timing-function: ease;
|
||||
transition-timing-function: ease; }
|
||||
.content .wrap.zoom img:hover {
|
||||
-webkit-transform: rotate(0deg) scale(1.5) translate(0px, 0px);
|
||||
transform: rotate(0deg) scale(1.5) translate(0px, 0px); }
|
||||
.content .wrap.shake {
|
||||
/*SHAKE EFFECT*/ }
|
||||
.content .wrap.shake .head {
|
||||
-webkit-transition-property: all;
|
||||
transition-property: all;
|
||||
-webkit-transition-duration: 0.5s;
|
||||
transition-duration: 0.5s;
|
||||
-webkit-transition-timing-function: ease;
|
||||
transition-timing-function: ease; }
|
||||
.content .wrap.shake .head:hover {
|
||||
-webkit-transform: rotate(5deg) scale(1.5) translate(0px, 0px);
|
||||
transform: rotate(5deg) scale(1.5) translate(0px, 0px); }
|
||||
.content .wrap.shake img {
|
||||
-webkit-transition-property: all;
|
||||
transition-property: all;
|
||||
-webkit-transition-duration: 0.5s;
|
||||
transition-duration: 0.5s;
|
||||
-webkit-transition-timing-function: ease;
|
||||
transition-timing-function: ease; }
|
||||
.content .wrap.shake img:hover {
|
||||
-webkit-transform: rotate(5deg) scale(1.5) translate(0px, 0px);
|
||||
transform: rotate(5deg) scale(1.5) translate(0px, 0px); }
|
||||
.content .wrap.all {
|
||||
/*ALL EFFECTS*/ }
|
||||
.content .wrap.all .head {
|
||||
/* Camera Focus Effect */
|
||||
-webkit-transition-property: all;
|
||||
transition-property: all;
|
||||
-webkit-transition-duration: 1s;
|
||||
transition-duration: 1s; }
|
||||
.content .wrap.all .head:hover {
|
||||
-webkit-filter: blur(0.4px);
|
||||
filter: blur(0.4px); }
|
||||
.content .wrap.all img {
|
||||
/* Camera Focus Effect */
|
||||
-webkit-transition-property: all;
|
||||
transition-property: all;
|
||||
-webkit-transition-duration: 1s;
|
||||
transition-duration: 1s; }
|
||||
.content .wrap.all img:hover {
|
||||
-webkit-filter: blur(0.5px);
|
||||
filter: blur(0.5px); }
|
||||
|
||||
/*# sourceMappingURL=camera.css.map */
|
||||
@@ -0,0 +1,232 @@
|
||||
/* Simons SCSS Framework */
|
||||
@CHARSET "ISO-8859-1";
|
||||
/* RESET
|
||||
|
||||
SOURCE:
|
||||
http://meyerweb.com/eric/tools/css/reset/
|
||||
v2.0 | 20110126
|
||||
License: none (public domain)
|
||||
|
||||
*/
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||
article, aside, canvas, details, embed,
|
||||
figure, figcaption, footer, header, hgroup,
|
||||
menu, nav, output, ruby, section, summary,
|
||||
time, mark, audio, video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline; }
|
||||
|
||||
/* HTML5 display-role reset for older browsers */
|
||||
article, aside, details, figcaption, figure,
|
||||
footer, header, hgroup, menu, nav, section {
|
||||
display: block; }
|
||||
|
||||
ol, ul {
|
||||
list-style: none; }
|
||||
|
||||
blockquote, q {
|
||||
quotes: none; }
|
||||
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {
|
||||
content: '';
|
||||
content: none; }
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0 !important; }
|
||||
|
||||
body {
|
||||
background-color: #d9ffd9;
|
||||
font-family: Calibri, sans-serif; }
|
||||
body .header #navcheck {
|
||||
display: none;
|
||||
/* tablet */ }
|
||||
body .header #navcheck + .navbar {
|
||||
display: none; }
|
||||
@media (max-width: 979px) {
|
||||
body .header #navcheck + .navbar {
|
||||
position: fixed;
|
||||
z-index: 10000;
|
||||
display: block;
|
||||
padding: 14.28571px;
|
||||
background-color: #ffd9d9;
|
||||
box-sizing: border-box; }
|
||||
body .header #navcheck + .navbar span {
|
||||
display: block;
|
||||
margin-bottom: 14.28571px;
|
||||
width: 71.42857px;
|
||||
height: 14.28571px;
|
||||
background-color: #806c80;
|
||||
box-sizing: border-box; }
|
||||
body .header #navcheck + .navbar span:last-of-type {
|
||||
margin-bottom: 0; }
|
||||
body .header #navcheck + .navbar + ul {
|
||||
display: none; }
|
||||
body .header #navcheck:checked + .navbar + ul {
|
||||
/* Absolute Positioning */
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
padding-top: 100px;
|
||||
list-style: none;
|
||||
display: block;
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
overflow: scroll;
|
||||
background-color: #806c80; }
|
||||
body .header #navcheck:checked + .navbar + ul li {
|
||||
position: relative;
|
||||
display: block;
|
||||
background-color: #806c80;
|
||||
color: #d9ffd9;
|
||||
width: 100%;
|
||||
text-transform: uppercase; }
|
||||
body .header #navcheck:checked + .navbar + ul li a {
|
||||
display: block;
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
text-decoration: none;
|
||||
color: #d9ffd9;
|
||||
box-sizing: border-box; }
|
||||
body .header #navcheck:checked + .navbar + ul li ul {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 100%; }
|
||||
body .header #navcheck:checked + .navbar + ul li ul li {
|
||||
color: #d9ffd9;
|
||||
text-transform: none; }
|
||||
body .header #navcheck:checked + .navbar + ul li ul li a {
|
||||
padding-left: 40px;
|
||||
color: #d9ffd9; }
|
||||
body .header #navcheck:checked + .navbar + ul li ul li ul {
|
||||
position: relative;
|
||||
display: block;
|
||||
left: auto;
|
||||
top: auto; }
|
||||
body .header #navcheck:checked + .navbar + ul li ul li ul li {
|
||||
position: relative;
|
||||
color: #d9ffd9;
|
||||
font-weight: 300; }
|
||||
body .header #navcheck:checked + .navbar + ul li ul li ul li a {
|
||||
padding-left: 60px;
|
||||
color: #d9ffd9; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover {
|
||||
background-color: #ffd9d9;
|
||||
color: #6c8080; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover a {
|
||||
color: #6c8080; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul {
|
||||
display: block; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li {
|
||||
display: block;
|
||||
color: #d9ffd9; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li a {
|
||||
color: #d9ffd9; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li ul {
|
||||
display: block; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover {
|
||||
color: #6c8080; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover a {
|
||||
color: #6c8080; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover ul {
|
||||
display: block; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover ul li {
|
||||
color: #d9ffd9; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover ul li a {
|
||||
color: #d9ffd9; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover ul li:hover {
|
||||
color: #6c8080; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover ul li:hover a {
|
||||
color: #6c8080; }
|
||||
body .header #navcheck:checked + .navbar + ul li:last-of-type ul li ul {
|
||||
right: auto;
|
||||
left: auto; } }
|
||||
body .header .nav {
|
||||
font-weight: 700;
|
||||
letter-spacing: 1px;
|
||||
font-size: 20px;
|
||||
position: relative;
|
||||
list-style: none;
|
||||
display: table;
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
background-color: #806c80; }
|
||||
body .header .nav li {
|
||||
position: relative;
|
||||
display: table-cell;
|
||||
background-color: #806c80;
|
||||
color: #d9ffd9;
|
||||
width: 100%; }
|
||||
body .header .nav li a {
|
||||
display: block;
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
text-decoration: none;
|
||||
color: #d9ffd9;
|
||||
box-sizing: border-box; }
|
||||
body .header .nav li ul {
|
||||
display: none;
|
||||
position: absolute;
|
||||
width: 100%; }
|
||||
body .header .nav li ul li {
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li ul li a {
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li ul li ul {
|
||||
position: absolute;
|
||||
display: none;
|
||||
left: 100%;
|
||||
top: 0; }
|
||||
body .header .nav li ul li ul li {
|
||||
position: relative;
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li ul li ul li a {
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li:hover {
|
||||
background-color: #ffd9d9;
|
||||
color: #6c8080; }
|
||||
body .header .nav li:hover a {
|
||||
color: #6c8080; }
|
||||
body .header .nav li:hover ul {
|
||||
display: block; }
|
||||
body .header .nav li:hover ul li {
|
||||
display: block;
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li:hover ul li a {
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li:hover ul li ul {
|
||||
display: none; }
|
||||
body .header .nav li:hover ul li:hover {
|
||||
color: #6c8080; }
|
||||
body .header .nav li:hover ul li:hover a {
|
||||
color: #6c8080; }
|
||||
body .header .nav li:hover ul li:hover ul {
|
||||
display: block; }
|
||||
body .header .nav li:hover ul li:hover ul li {
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li:hover ul li:hover ul li a {
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li:hover ul li:hover ul li:hover {
|
||||
color: #6c8080; }
|
||||
body .header .nav li:hover ul li:hover ul li:hover a {
|
||||
color: #6c8080; }
|
||||
body .header .nav li:last-of-type ul li ul {
|
||||
right: 100%;
|
||||
left: auto; }
|
||||
|
||||
/*# sourceMappingURL=horizontal.css.map */
|
||||
@@ -0,0 +1,233 @@
|
||||
/* Simons SCSS Framework */
|
||||
@CHARSET "ISO-8859-1";
|
||||
/* RESET
|
||||
|
||||
SOURCE:
|
||||
http://meyerweb.com/eric/tools/css/reset/
|
||||
v2.0 | 20110126
|
||||
License: none (public domain)
|
||||
|
||||
*/
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||
article, aside, canvas, details, embed,
|
||||
figure, figcaption, footer, header, hgroup,
|
||||
menu, nav, output, ruby, section, summary,
|
||||
time, mark, audio, video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline; }
|
||||
|
||||
/* HTML5 display-role reset for older browsers */
|
||||
article, aside, details, figcaption, figure,
|
||||
footer, header, hgroup, menu, nav, section {
|
||||
display: block; }
|
||||
|
||||
ol, ul {
|
||||
list-style: none; }
|
||||
|
||||
blockquote, q {
|
||||
quotes: none; }
|
||||
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {
|
||||
content: '';
|
||||
content: none; }
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0 !important; }
|
||||
|
||||
body {
|
||||
background-color: #d9ffd9;
|
||||
font-family: Calibri, sans-serif; }
|
||||
body .header #navcheck {
|
||||
display: none;
|
||||
/* tablet */ }
|
||||
body .header #navcheck + .navbar {
|
||||
display: none; }
|
||||
@media (max-width: 979px) {
|
||||
body .header #navcheck + .navbar {
|
||||
position: fixed;
|
||||
z-index: 10000;
|
||||
display: block;
|
||||
padding: 14.28571px;
|
||||
background-color: #ffd9d9;
|
||||
box-sizing: border-box; }
|
||||
body .header #navcheck + .navbar span {
|
||||
display: block;
|
||||
margin-bottom: 14.28571px;
|
||||
width: 71.42857px;
|
||||
height: 14.28571px;
|
||||
background-color: #806c80;
|
||||
box-sizing: border-box; }
|
||||
body .header #navcheck + .navbar span:last-of-type {
|
||||
margin-bottom: 0; }
|
||||
body .header #navcheck + .navbar + ul {
|
||||
display: none; }
|
||||
body .header #navcheck:checked + .navbar + ul {
|
||||
/* Absolute Positioning */
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
padding-top: 100px;
|
||||
list-style: none;
|
||||
display: block;
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
overflow: scroll;
|
||||
background-color: #806c80; }
|
||||
body .header #navcheck:checked + .navbar + ul li {
|
||||
position: relative;
|
||||
display: block;
|
||||
background-color: #806c80;
|
||||
color: #d9ffd9;
|
||||
width: 100%;
|
||||
text-transform: uppercase; }
|
||||
body .header #navcheck:checked + .navbar + ul li a {
|
||||
display: block;
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
text-decoration: none;
|
||||
color: #d9ffd9;
|
||||
box-sizing: border-box; }
|
||||
body .header #navcheck:checked + .navbar + ul li ul {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 100%; }
|
||||
body .header #navcheck:checked + .navbar + ul li ul li {
|
||||
color: #d9ffd9;
|
||||
text-transform: none; }
|
||||
body .header #navcheck:checked + .navbar + ul li ul li a {
|
||||
padding-left: 40px;
|
||||
color: #d9ffd9; }
|
||||
body .header #navcheck:checked + .navbar + ul li ul li ul {
|
||||
position: relative;
|
||||
display: block;
|
||||
left: auto;
|
||||
top: auto; }
|
||||
body .header #navcheck:checked + .navbar + ul li ul li ul li {
|
||||
position: relative;
|
||||
color: #d9ffd9;
|
||||
font-weight: 300; }
|
||||
body .header #navcheck:checked + .navbar + ul li ul li ul li a {
|
||||
padding-left: 60px;
|
||||
color: #d9ffd9; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover {
|
||||
background-color: #ffd9d9;
|
||||
color: #6c8080; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover a {
|
||||
color: #6c8080; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul {
|
||||
display: block; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li {
|
||||
display: block;
|
||||
color: #d9ffd9; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li a {
|
||||
color: #d9ffd9; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li ul {
|
||||
display: block; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover {
|
||||
color: #6c8080; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover a {
|
||||
color: #6c8080; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover ul {
|
||||
display: block; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover ul li {
|
||||
color: #d9ffd9; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover ul li a {
|
||||
color: #d9ffd9; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover ul li:hover {
|
||||
color: #6c8080; }
|
||||
body .header #navcheck:checked + .navbar + ul li:hover ul li:hover ul li:hover a {
|
||||
color: #6c8080; }
|
||||
body .header #navcheck:checked + .navbar + ul li:last-of-type ul li ul {
|
||||
right: auto;
|
||||
left: auto; } }
|
||||
body .header .nav {
|
||||
font-weight: 700;
|
||||
letter-spacing: 1px;
|
||||
font-size: 20px;
|
||||
position: relative;
|
||||
list-style: none;
|
||||
display: block;
|
||||
width: 200px;
|
||||
background-color: #806c80;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0; }
|
||||
body .header .nav li {
|
||||
position: relative;
|
||||
display: block;
|
||||
background-color: #806c80;
|
||||
color: #d9ffd9;
|
||||
width: auto; }
|
||||
body .header .nav li a {
|
||||
display: block;
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
text-decoration: none;
|
||||
color: #d9ffd9;
|
||||
box-sizing: border-box; }
|
||||
body .header .nav li ul {
|
||||
display: none;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
left: 100%;
|
||||
top: 0; }
|
||||
body .header .nav li ul li {
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li ul li a {
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li ul li ul {
|
||||
position: absolute;
|
||||
display: none;
|
||||
left: 100%;
|
||||
top: 0; }
|
||||
body .header .nav li ul li ul li {
|
||||
position: relative;
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li ul li ul li a {
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li:hover {
|
||||
background-color: #ffd9d9;
|
||||
color: #6c8080; }
|
||||
body .header .nav li:hover a {
|
||||
color: #6c8080; }
|
||||
body .header .nav li:hover ul {
|
||||
display: block; }
|
||||
body .header .nav li:hover ul li {
|
||||
display: block;
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li:hover ul li a {
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li:hover ul li ul {
|
||||
display: none; }
|
||||
body .header .nav li:hover ul li:hover {
|
||||
color: #6c8080; }
|
||||
body .header .nav li:hover ul li:hover a {
|
||||
color: #6c8080; }
|
||||
body .header .nav li:hover ul li:hover ul {
|
||||
display: block; }
|
||||
body .header .nav li:hover ul li:hover ul li {
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li:hover ul li:hover ul li a {
|
||||
color: #d9ffd9; }
|
||||
body .header .nav li:hover ul li:hover ul li:hover {
|
||||
color: #6c8080; }
|
||||
body .header .nav li:hover ul li:hover ul li:hover a {
|
||||
color: #6c8080; }
|
||||
|
||||
/*# sourceMappingURL=vertical.css.map */
|
||||
Reference in New Issue
Block a user