* { 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: 3rem; font-weight: bold; } h3 { font-size: 2rem; font-weight: bold; } } 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#apropos { padding: 40px 50px; * { text-align: center; } .columns { margin-top: 50px; embed, iframe { margin-top: 10px; height: 600px; width: 500px; border: 1px solid lightgray; } address { background: white; padding: 10px; margin: 0 auto; font-size: 0.8rem; text-align: left; border: 1px solid lightgray; max-width: 500px; position: relative; top: -10px; } img.is-quarter { width: 25%; } } } section#activites { height: 200vh; padding: 0; margin: 0; .sub-section { position: relative; transition: all 2s; &.slide { &:not(.animation-inversed) { transform: translateX(40%); } &.animation-inversed { transform: translateX(-40%); } } &:not(.animation-inversed) { div.content { left: -40%; } } &.animation-inversed { div.content { right: - 40%; } } div.content { position: absolute; padding: 25px; } div.headline { margin-top: 75px; padding: 25px; transition: all 0.25s; position: absolute; color: white; &:not(.is-headline-inversed) { left: 50px; } &.is-headline-inversed { right: 100px; } } div.headline.toggle-visibility { display: none; } .bg-img { position: absolute; transition: all 2s; &.gala-img { background-image: url('../img/gala.jpg'); } &.mtlgj-img { background-image: url('../img/mtlgj.jpg'); } } } } section#partenaires { padding-bottom: 4.5rem; h2 { margin: 0 auto; text-align: center; max-width: 300px; } .border-seperator { margin: 10px auto 50px auto; border-top: 5px solid #848484; max-width: 200px; border-radius: 20px; } } footer { padding: 15px 0; p { text-align: center; } }