Files
LucasVbr/styles/style.css
T
LucasVbr aceb3402f2 Update
2021-08-31 13:51:15 +02:00

100 lines
1.6 KiB
CSS

:root {
scroll-behavior: smooth;
}
/* Hide scroll bar */
*::-webkit-scrollbar { display: none; }
body {
width: 100wh;
margin: 0;
padding: 0;
}
/* Tool box */
.center {
position: absolute;
text-align: center;
vertical-align: middle;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
/***** Navigation Top Bar *****/
nav {
width: 100%;
z-index: 999;
float: top;
position: fixed;
background-color: #fff3;
}
nav li {
text-decoration: none;
display: inline-block;
}
nav a {
padding: 16px 0;
margin: 0 25px;
text-decoration: none;
color: white;
}
/***** End Navigation Top Bar *****/
section {
padding: 0 calc(100vw / 10);
min-height: 100vh;
margin-left: auto;
margin-right: auto;
}
#accueil {
background: center no-repeat url("../images/accueil-bg.jpg") #ef476f;
background-size: cover;
}
/***** Scroll *****/
.scroll {
left: 50%;
transform: translateX(calc(50% - 24px));
}
.scroll circle {
-webkit-animation-duration: 1.5s;
animation-duration: 1.5s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-name: scroll;
animation-name: scroll;
}
/* Animation */
@-webkit-keyframes scroll {
0% {
opacity: 1;
}
100% {
opacity: 0;
transform: translateY(40px);
}
}
@keyframes scroll {
0% {
opacity: 1;
}
100% {
opacity: 0;
transform: translateY(40px);
}
}
/***** End Scroll *****/
#a_propos {background-color: #ffd166}
#projets {background-color: #06d6a0}
#contact {background-color: #118ab2}