superflux/style.less

252 lines
2.9 KiB
Plaintext
Raw Normal View History

2019-06-24 19:34:44 +02:00
2019-12-07 12:08:09 +01:00
.gallerie {
2019-06-24 19:34:44 +02:00
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
/* grid-row-gap: 50px; */
grid-auto-flow: dense;
max-width: 100%;
grid-row-gap: 80px;
}
2019-12-07 12:08:09 +01:00
nav {
display: flex;
flex-direction: row;
justify-content: space-around;
& a {
text-decoration: none;
& div {
border: 2px solid white;
border-radius: 30px;
padding: 14px;
&:hover {
background-color: white;
color: black;
}
}
}
}
2019-06-24 19:34:44 +02:00
.nomElementDossier {
margin-top: 20px;
}
2019-10-15 15:25:39 +02:00
.source {
text-align: right;
margin-top: 8px;
}
2019-06-24 19:34:44 +02:00
.paysage {
grid-column-end: span 2;
max-width: 100%;
}
2019-10-15 15:18:04 +02:00
footer {
color: grey;
font-size: 18px;
transition: color 0.3s;
2019-10-15 15:25:39 +02:00
2019-10-15 15:18:04 +02:00
& a:link {
color: grey;
text-decoration: underline;
transition: color 0.3s;
font-size: 20px;
}
&:hover, &:hover a:link {
color: white;
}
}
2019-06-24 19:34:44 +02:00
2019-10-15 15:18:04 +02:00
.presentation {
text-align: justify;
margin-left: 15%;
margin-right: 15%;
@media (max-width: 1300px) {
margin-left: 8%;
margin-right: 8%;
}
@media (max-width: 500px) {
margin-left: 6%;
margin-right: 6%;
}
}
blockquote {
background-color: #4d4e52;
padding: 30px;
border-radius: 20px;
@media (max-width: 500px) {
padding: 25px;
2019-10-15 15:42:18 +02:00
margin-left: 0px;
margin-right: 0px;
2019-10-15 15:18:04 +02:00
}
}
.contPremiereImage {
text-align: center;
margin-bottom: 15px;
}
.premiereImage {
border: 2px white solid;
border-radius: 8px;
}
2019-06-24 19:34:44 +02:00
html {
background-color: #2D2F34;
color: white;
text-align: center;
}
.dossier img {
2019-10-15 15:18:04 +02:00
border: 2px white solid;
border-radius: 8px;
2019-06-24 19:34:44 +02:00
}
.element a {
color: white;
font-size: 1.4em;
text-decoration: none;
}
body {
2019-10-15 15:36:56 +02:00
font-family: "Ubuntu", sans-serif;
2019-10-15 15:18:04 +02:00
font-size: 26px;
line-height: 1.3;
2019-06-24 19:34:44 +02:00
}
h6 a, h5 a, h4 a, h3 a, h2 a, h1 a {
font-family: Times New Roman;
2019-10-15 15:18:04 +02:00
text-decoration: none;
2019-06-24 19:34:44 +02:00
}
a {
color: white;
}
h1, h2, h3, h4, h5, h6 {
padding-bottom: 30px;
margin: 0px;
}
h1 {
font-size: 100px;
padding-top: 30px;
}
h2 {
font-size: 60px;
}
h3 {
font-size: 30px;
}
h4 {
font-size: 20px;
}
header {
text-align: center;
2019-12-07 12:08:09 +01:00
display: flex;
flex-direction: column;
justify-content: center;
}
main {
margin-top: 32px;
2019-06-24 19:34:44 +02:00
}
2019-12-07 12:08:09 +01:00
.pageAux {
margin-left: 10%;
margin-right: 10%;
}
2019-06-24 19:34:44 +02:00
@media (max-width: 1700px) {
main {
grid-template-columns: 1fr 1fr 1fr;
}
}
@media (max-width: 1300px) {
main {
grid-template-columns: 1fr 1fr;
2019-10-15 15:18:04 +02:00
}
2019-06-24 19:34:44 +02:00
2019-10-15 15:18:04 +02:00
h1 {
font-size: 100px;
2019-06-24 19:34:44 +02:00
}
2019-10-15 15:18:04 +02:00
}
2019-06-24 19:34:44 +02:00
2019-10-15 15:18:04 +02:00
@media (max-width: 1000px) {
h1 {
font-size: 80px;
}
2019-06-24 19:34:44 +02:00
}
@media (max-width: 500px) {
.paysage img {
grid-column-end: span 1;
width: 100%;
max-width: 100%;
}
.paysage {
grid-column-end: span 1;
width: 400px;
}
main {
grid-template-columns: 1fr;
}
.portrait img {
width: 200px;
max-width: 200px;
}
.element {
max-width: 100% !important;
}
h1 {
font-size: 60px;
}
h2 {
font-size: 40px;
}
h3 {
font-size: 25px;
}
h4 {
font-size: 18px;
}
}