Update 'assets/styles/site.css'

ciclostile
lo_bo 2017-11-02 21:03:03 +01:00
parent 937d38f883
commit 91c1ad55b7
1 changed files with 234 additions and 6 deletions

View File

@ -19,11 +19,23 @@ html {
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
body {
width: 20rem;
margin: auto;
padding: 2rem 0.5rem;
}
.main-container
{
width:46rem;
font-weight: normal;
margin: auto;
}
.main-container.home
{
width:20rem;
margin: auto;
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* HEADER *
@ -62,7 +74,7 @@ nav > ul {
nav > ul > li {
display: inline-block;
margin-right: 0.8rem;
color: #004405;
color: #378ab4;
}
nav > ul > li:before {
@ -83,6 +95,16 @@ h1 {
font-size: 4rem;
}
h2
{
font-size:1.35rem;
color: #ffffff;
background: #378ab4;
display:inline-block;
font-weight:400;
margin: 1rem 0;
}
p, li {
font-size: 1.3rem;
}
@ -105,14 +127,13 @@ a:hover {
font-weight: bold;
}
p > a {
p > a{
color: #ffffff;
background: #004405;
background: #378ab4;
padding-bottom: 0.1rem;
}
p > strong {
p > strong, li > strong {
background: #000000;
color: #ffffff;
margin: 0;
@ -120,3 +141,210 @@ p > strong {
font-weight: normal;
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* ASCII *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.letterhead
{
margin-bottom: 2rem;
display:table;
width:100% !important;
font-size:1.1rem;
}
.letterhead > span.ascii, span.ascii
{
white-space: pre-wrap;
background: #000000;
color: #ffffff;
font-weight:700;
/*outline: 3px solid #000000;*/
position: relative;
line-height: 1;
color: #fff;
display: inline;
border: 0 solid #000;
border-width: 0.15em 0; /* 0.25em is roughly equal to one space character. */
}
.letterhead > span.ascii:after, span.ascii:after{
background-color: #000;
}
.letterhead > span.ascii:after, span.ascii:after
{
content: "";
position: absolute;
top: -0.1em;
right: 100%;
bottom: -0.1em;
width: 0.1em;
}
.letterhead > span.ascii.shadow, span.ascii.shadow
{
text-shadow:
0 1px #378ab4,
1px 0 #5dabcd,
1px 2px #378ab4,
2px 1px #5dabcd,
2px 3px #378ab4,
3px 2px #5dabcd,
3px 4px #378ab4,
4px 3px #5dabcd,
4px 5px #378ab4,
5px 4px #5dabcd,
5px 6px #378ab4,
6px 5px #5dabcd,
6px 7px #378ab4,
7px 6px #5dabcd,
7px 8px #378ab4,
8px 7px #5dabcd;
/*outline: 12px solid #000000;*/
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* COLUMNS FESTIVAL *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
p.festival
{
font-size:0.9rem;
margin-bottom:1rem;
}
p.festival > strong
{
font-size:1rem;
text-align:center;
}
.col-pagination p
{
font-size:0.9rem;
margin-bottom:1rem;
}
.col-pagination p.room
{
font-size:0.9rem;
margin:0.5rem 0;
}
.col-pagination li
{
font-size:0.9rem;
margin-bottom:0.3rem;
}
.col-pagination li > strong
{
font-size:1rem;
text-align:center;
}
.col-pagination
{
display:flex;
display: -webkit-flex;
}
.col
{
-webkit-flex: 1;
flex: 1;
padding-right: 5%;
}
.col.last{
padding-right: 0;
}
.col p.room span.ascii
{
margin-right:10px;
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* FOOTER *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
footer {
font-weight: normal;
text-align:left;
margin-top: -3.5rem;
}
footer > img,
footer > h1 {
display: inline-block;
vertical-align: middle;
}
footer > h1, footer a {
font-size:2rem;
}
footer > img {
width: 2.5rem;
margin-right: 0;
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* MEDIA QUERY *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
@media(max-width:768px){
.main-container{
width:98% !important;
padding:0 2%;
}
.main-container.home
{
width:20rem !important;
}
.letterhead
{
font-size:0.9rem;
}
}
@media(max-width:635px){
.col-pagination
{
display:block;
}
.col
{
width:100% !important;
padding: 0;
}
.letterhead
{
font-size:0.45rem;
}
footer {
margin-top: 2rem;
}
}