2019-06-20 11:31:56 -04:00

147 lines
2.3 KiB
SCSS

* {
font-family: Roboto, SansSerif;
}
a {
outline: none !important;
}
header.logo-container {
position: fixed;
top: -15px;
max-width: 500px;
max-height: 135px;
overflow: hidden;
z-index: 1000;
img {
width: 100%;
}
}
.full-height {
height: 100vh;
}
.full-width {
width: 100vw;
}
.bg-img {
background-size: cover;
-webkit-filter: brightness(60%);
filter: brightness(60%);
}
section {
h2 {
font-size: 3.5rem;
}
}
section#splashscreen {
padding: 0 !important;
.bg-img {
background-image: url('../img/splashscreen.jpg');
}
.splashscreen-text-container {
position: absolute;
top: 60%;
text-align: center;
color: white;
font-size: 4.5rem;
h1 {
font-weight: bold;
}
.border-seperator {
margin-top: 10px;
margin-left: auto;
margin-right: auto;
border-top: 5px solid white;
max-width: 900px;
border-radius: 20px;
}
}
}
section#activites {
height: 200vh;
padding: 0;
margin: 0;
div {
position: relative;
}
div:nth-of-type(2) {
margin-top: 25px;
}
div.content {
position: absolute;
padding: 25px;
transition: all 2s;
&:not(.animation-inversed) {
left: -40%;
}
&.animation-inversed {
right: - 40%;
}
}
div.content.slide, div.bg-img.slide {
&:not(.animation-inversed) {
transform: translateX(40%);
}
&.animation-inversed {
transform: translateX(-40%);
}
}
div.headline {
margin-top: 50px;
padding: 25px;
transition: all 0.25s;
position: absolute;
&:not(.is-headline-inversed) {
left: 50px;
}
&.is-headline-inversed {
right: 100px;
}
}
div.headline.toggle-visibility {
display: none;
}
div.bg-img {
position: absolute;
transition: all 2s;
&.gala-img {
background-image: url('../img/gala.jpg');
}
&.mtlgj-img {
background-image: url('../img/mtlgj.jpg');
}
}
}
footer {
padding: 15px 0;
p {
text-align: center;
}
}