mooreyoga/site/css/main.css

104 lines
1.8 KiB
CSS

html, body {
padding: 0;
margin: 0;
border: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
nav {
position: fixed;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
z-index: 999;
margin-left: 45px;
height: 100vh;
width: 100px;
}
nav .menu {
margin: auto auto;
height: 75%;
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
nav .menu .box {
height: 100px;
width: 100%;
background-color: #fffdfdb4;
border-radius: 25px;
}
* {
scrollbar-width: auto;
scrollbar-color: #ff887a #e6e6e6;
}
/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
width: 16px;
}
*::-webkit-scrollbar-track {
background: #e6e6e6;
}
*::-webkit-scrollbar-thumb {
background-color: #ff887a;
border-radius: 10px;
border: 3px solid #e6e6e6;
}
section {
height: 100vh;
}
.hero {
background: #242828;
width: 100%;
}
.hero div {
position: absolute;
height: 100%;
width: 100%;
}
.hero .background {
background: #242828 url("/css/res/img/background.png") bottom no-repeat;
}
.hero .foreground {
background: url("/css/res/img/foreground.png") bottom no-repeat;
}
.hero .text {
position: fixed;
background: url("/css/res/img/text.png") center no-repeat;
}
.intro {
background: yellow;
}
/*# sourceMappingURL=main.css.map */