Your Name
4 years ago
2 changed files with 266 additions and 9 deletions
@ -0,0 +1,256 @@ |
|||||
|
@import 'fonts.css'; |
||||
|
|
||||
|
body{ |
||||
|
margin:2em auto; |
||||
|
min-width: 1080px; |
||||
|
max-width: 950px; |
||||
|
font-family: 'Basker'; |
||||
|
font-size: 14pt; |
||||
|
line-height: 1.7; |
||||
|
letter-spacing: 0.25pt; |
||||
|
color: rgba(40,40,40,1); |
||||
|
/*background-color: #d0bba0;*/ |
||||
|
background-color: #ecddcb; |
||||
|
} |
||||
|
h1, h2, h3, h4, h5, h6{ |
||||
|
font-family: 'Belgika-reg'; |
||||
|
margin-top:1.5em; |
||||
|
} |
||||
|
header#banner{ |
||||
|
width: 100%; |
||||
|
text-align: center; |
||||
|
} |
||||
|
header#banner h1{ |
||||
|
font-family: 'Syne'; |
||||
|
font-size: 7.5vw; |
||||
|
line-height:1.25; |
||||
|
margin: 0.7em 0; |
||||
|
} |
||||
|
header#banner h1 a{ |
||||
|
text-decoration: none; |
||||
|
color: darkgoldenrod !important; |
||||
|
} |
||||
|
nav#menu{ |
||||
|
width: calc(100% + 20em); |
||||
|
text-align: center; |
||||
|
margin:0 0 0 -11em; |
||||
|
} |
||||
|
nav#menu li{ |
||||
|
width: 10vw; |
||||
|
height:10vw; |
||||
|
margin:1em 0; |
||||
|
padding:1em; |
||||
|
font-size: 75%; |
||||
|
line-height: 1.4; |
||||
|
color: rgba(40,40,40,1); |
||||
|
border:1px solid; |
||||
|
border-radius: 1em; |
||||
|
list-style: none; |
||||
|
display: inline-block; |
||||
|
vertical-align: middle; |
||||
|
} |
||||
|
nav#menu li.active{ |
||||
|
background-color: #95d1e6; |
||||
|
} |
||||
|
nav#menu li.pagelink{ |
||||
|
height: 2.5em; |
||||
|
} |
||||
|
nav#menu a{ |
||||
|
text-decoration: none; |
||||
|
} |
||||
|
|
||||
|
section#content{ |
||||
|
margin: 4em; |
||||
|
} |
||||
|
article{ |
||||
|
margin: 3em 0 2em 0; |
||||
|
padding: 2em 3em 0; |
||||
|
border-top: 1px solid; |
||||
|
} |
||||
|
article:first-child{ |
||||
|
background-color: #95d1e6; |
||||
|
padding-bottom: 3em; |
||||
|
margin-bottom: -3em; |
||||
|
} |
||||
|
/* start button */ |
||||
|
article button { |
||||
|
width: auto; |
||||
|
top:1em; |
||||
|
margin:1.5em auto; |
||||
|
padding:1.5em 3em; |
||||
|
background-color: rgba(40,40,40,1); |
||||
|
border:1px solid rgba(40,40,40,1); |
||||
|
border-radius: 0.5em; |
||||
|
} |
||||
|
article a button{ |
||||
|
font-family: 'Belgika-reg'; |
||||
|
text-decoration: none !important; |
||||
|
color: white !important; |
||||
|
font-size: 16px; |
||||
|
letter-spacing: 0.1em; |
||||
|
} |
||||
|
article a button:hover{ |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
article h2.page-title a{ |
||||
|
text-decoration: none; |
||||
|
} |
||||
|
|
||||
|
/* big boxes for the section titles */ |
||||
|
h1.category{ |
||||
|
width: calc(100% - 4em); |
||||
|
background-color: rgba(40,40,40,1); |
||||
|
color:white; |
||||
|
border-radius: 1em; |
||||
|
padding: 2em 2em 3em 2em; |
||||
|
margin: 2em 0; |
||||
|
font-family: "Basker"; |
||||
|
font-size: 32px; |
||||
|
text-align: center; |
||||
|
font-weight: normal; |
||||
|
} |
||||
|
|
||||
|
/* next & prev buttons */ |
||||
|
ul.navprevnext{ |
||||
|
position: relative; |
||||
|
display: inline-block; |
||||
|
width: calc(100% - 4em); |
||||
|
margin:3em 0 0; |
||||
|
} |
||||
|
ul.navprevnext li.prev, |
||||
|
ul.navprevnext li.next, |
||||
|
ul.navprevnext li.done, |
||||
|
ul.navprevnext li.none{ |
||||
|
position: relative; |
||||
|
width: calc(50% - 17em); |
||||
|
height: 150px; |
||||
|
top:0; |
||||
|
background-color: #95d1e6; |
||||
|
border-radius: 1em; |
||||
|
padding:1em 3em; |
||||
|
font-size: 9pt; |
||||
|
line-height: 1.4; |
||||
|
list-style: none; |
||||
|
border:1px solid black; |
||||
|
} |
||||
|
ul.navprevnext a{ |
||||
|
text-decoration: none; |
||||
|
} |
||||
|
ul.navprevnext li.prev:before, |
||||
|
ul.navprevnext li.next:before{ |
||||
|
display: block; |
||||
|
font-style:italic; |
||||
|
margin:0 0 1em 0; |
||||
|
} |
||||
|
ul.navprevnext li.prev:before{ |
||||
|
content:'←\00a0\00a0\00a0Go to the previous page'; |
||||
|
margin-left:-1.75em; |
||||
|
} |
||||
|
ul.navprevnext li.next:before{ |
||||
|
content:'Go to the next page\00a0\00a0\00a0→'; |
||||
|
margin-right:-2em; |
||||
|
text-align: right; |
||||
|
} |
||||
|
ul.navprevnext li.none, |
||||
|
ul.navprevnext li.prev{ |
||||
|
float: left; |
||||
|
left:-9.5em; |
||||
|
} |
||||
|
ul.navprevnext li.next, |
||||
|
ul.navprevnext li.done{ |
||||
|
float: right; |
||||
|
right: -9.5em; |
||||
|
} |
||||
|
/* you finished this section */ |
||||
|
ul.navprevnext li.done{ |
||||
|
background-color: rgba(40,40,40,1); |
||||
|
color: white; |
||||
|
} |
||||
|
ul.navprevnext li.none{ |
||||
|
background-color: transparent; |
||||
|
color: transparent; |
||||
|
border:0; |
||||
|
} |
||||
|
|
||||
|
.footnote{ |
||||
|
font-size: smaller; |
||||
|
} |
||||
|
footer{ |
||||
|
font-style: normal; |
||||
|
font-size: smaller; |
||||
|
clear: both; |
||||
|
} |
||||
|
|
||||
|
/* general elements */ |
||||
|
a, |
||||
|
a:visited, |
||||
|
a:hover, |
||||
|
a:active{ |
||||
|
color: rgba(40,40,40,1); |
||||
|
} |
||||
|
a.nounderline{ |
||||
|
text-decoration: none; |
||||
|
} |
||||
|
|
||||
|
hr{ |
||||
|
width: 100%; |
||||
|
border:0; |
||||
|
border-bottom:1px solid rgba(40,40,40,1); |
||||
|
margin:3em auto; |
||||
|
} |
||||
|
sup{ |
||||
|
line-height: 0; |
||||
|
font-size: 75%; |
||||
|
padding-left: 0.2em; |
||||
|
} |
||||
|
img, |
||||
|
video{ |
||||
|
width: calc(100% + 6em); |
||||
|
margin: 2em 0 2em -3em; |
||||
|
} |
||||
|
blockquote{ |
||||
|
font-style: italic; |
||||
|
font-size: 125%; |
||||
|
line-height: 1.9; |
||||
|
} |
||||
|
pre, |
||||
|
code{ |
||||
|
color: #c600c6; |
||||
|
} |
||||
|
|
||||
|
.lastupdate{ |
||||
|
font-size: smaller; |
||||
|
margin:4em 0; |
||||
|
} |
||||
|
|
||||
|
p { |
||||
|
word-break: break-word; |
||||
|
} |
||||
|
|
||||
|
/* @media (max-width:770px) { |
||||
|
nav#menu li { |
||||
|
width: 50vw; |
||||
|
height: 24vw; |
||||
|
font-size: 2em; |
||||
|
margin: 1em 0.1em; |
||||
|
} |
||||
|
|
||||
|
header#banner h1 { |
||||
|
font-size: 10vw; |
||||
|
} |
||||
|
|
||||
|
body{ |
||||
|
margin-left: 9.4vw; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
@media (max-width:1024px) { |
||||
|
body { |
||||
|
margin-left: 13vw; |
||||
|
} |
||||
|
|
||||
|
nav#menu li { |
||||
|
height: 14vw; |
||||
|
} |
||||
|
} */ |
Loading…
Reference in new issue