You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
179 lines
3.3 KiB
CSS
179 lines
3.3 KiB
CSS
body{
|
|
/*background-color:rgb(212, 210, 251);*/
|
|
margin: 0;
|
|
padding: 0;
|
|
font-size: 14px;
|
|
line-height: 24px;
|
|
}
|
|
|
|
/* header, footer, future */
|
|
header, .issue.future, footer{
|
|
font-family: 'sans-serif';
|
|
}
|
|
header, footer{
|
|
width: auto;
|
|
margin: 0;
|
|
padding: 10px 20px;
|
|
}
|
|
header{
|
|
margin:27px;
|
|
}
|
|
.issue.future .issue-title{
|
|
font-size: 14px;
|
|
margin-left: 20px;
|
|
}
|
|
.issue.future .issue-title:after, .issue.future .issue-abstract:after, .issue.future .issue-date:after{
|
|
content: '...';
|
|
}
|
|
|
|
/* custom rules per issue */
|
|
.issue#special-issue-1{
|
|
font-family: 'special-issue-1';
|
|
font-size: 110%;
|
|
letter-spacing: 0.2px;
|
|
}
|
|
.issue#special-issue-2{
|
|
font-family: 'special-issue-2';
|
|
font-size: 170%;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
.issue#special-issue-3{
|
|
font-family: 'special-issue-3';
|
|
font-size: 120%;
|
|
letter-spacing: 2.8px;
|
|
}
|
|
.issue#special-issue-4{
|
|
font-family: 'special-issue-4';
|
|
font-size: 90%;
|
|
}
|
|
|
|
/* rules for the general structural elements */
|
|
section{
|
|
display: flex;
|
|
flex-direction: columns;
|
|
flex-wrap: wrap;
|
|
margin:0 12px;
|
|
}
|
|
div.background img{
|
|
position: fixed;
|
|
width: 100vw;
|
|
height: auto;
|
|
-webkit-filter: blur(25px);
|
|
opacity: 0.85;
|
|
z-index: -1;
|
|
display: none;
|
|
}
|
|
.issue{
|
|
flex:3 3 auto;
|
|
display: inline-block;
|
|
width: calc(33.3% - 30px);
|
|
vertical-align: top;
|
|
margin:0 0 80px;
|
|
padding:50px 15px;
|
|
color:rgb(40,40,40);
|
|
}
|
|
.issue-title{
|
|
height: 160px;
|
|
font-size: 350%;
|
|
line-height: 55px;
|
|
margin-left: 15px;
|
|
}
|
|
.issue-abstract, .issue-nr, .issue-date{
|
|
font-size: smaller;
|
|
line-height: 16px;
|
|
margin-left:20px;
|
|
}
|
|
.issue-nr{
|
|
/*margin-left:0;
|
|
border:1px solid;
|
|
border-right:1px solid rgba(120,120,120,.5);
|
|
border-bottom:1px solid rgba(120,120,120,.5);
|
|
border-radius: 15px 15px 0 0;
|
|
padding:10px 10px 10px 20px;
|
|
margin-bottom:15px;*/
|
|
}
|
|
.issue-date{
|
|
margin-bottom:15px;
|
|
}
|
|
.issue-img img{
|
|
width: 100%;
|
|
}
|
|
.issue-text{
|
|
margin:13px 10px 0 20px;
|
|
}
|
|
p{
|
|
margin:12px 0;
|
|
}
|
|
|
|
/* other */
|
|
a, a:active, a:visited{
|
|
color:inherit;
|
|
text-decoration: none;
|
|
}
|
|
a:hover{
|
|
opacity: 0.5;
|
|
}
|
|
|
|
/* smaller screens */
|
|
@media (max-width: 1024px) {
|
|
body{
|
|
font-size: 20px;
|
|
line-height: 32px;
|
|
}
|
|
.issue{
|
|
width: 100%;
|
|
margin: 0;
|
|
}
|
|
.issue-abstract, .issue-date, .issue-text, .issue-nr, .issue.future .issue-title{
|
|
margin-left: 100px;
|
|
margin-right: 40px;
|
|
}
|
|
.issue-title{
|
|
max-width: 500px;
|
|
height: auto;
|
|
font-size: 300%;
|
|
line-height: 70px;
|
|
margin-left:90px;
|
|
margin-top:20px;
|
|
margin-bottom:15px;
|
|
}
|
|
.issue-img img{
|
|
width: 100%;
|
|
max-width: 600px;
|
|
}
|
|
.issue-text{
|
|
max-width: 600px;
|
|
}
|
|
}
|
|
|
|
@font-face{
|
|
font-family:'special-issue-1';
|
|
src:url('fonts/GT-Cinetype-Bold.otf');
|
|
}
|
|
@font-face{
|
|
font-family:'special-issue-2';
|
|
src:url('fonts/Gidugu.ttf');
|
|
}
|
|
@font-face{
|
|
font-family:'special-issue-3';
|
|
src:url('fonts/dashness.ttf');
|
|
}
|
|
@font-face {
|
|
font-family: 'special-issue-4';
|
|
src: url('LibreBaskerville-Regular.eot?#iefix') format('embedded-opentype'), url('LibreBaskerville-Regular.woff') format('woff'), url('LibreBaskerville-Regular.ttf') format('truetype'), url('LibreBaskerville-Regular.svg#LibreBaskerville-Regular') format('svg');
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
@font-face{
|
|
font-family:'default';
|
|
src:url('fonts/NotCourierSans.ttf');
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
@font-face{
|
|
font-family:'default';
|
|
src:url('fonts/NotCourierSans-Bold.ttf');
|
|
font-weight: bold;
|
|
font-style: normal;
|
|
} |