120 lines
2 KiB
Sass
120 lines
2 KiB
Sass
// @import url('https://manekit.now.sh/assets/css/manekit.min.css')
|
|
|
|
$instagram: #E4405F
|
|
$twitter: #1DA1F2
|
|
$twitch: #9146FF
|
|
|
|
@import url('https://fonts.googleapis.com/css2?family=Orbitron&display=swap');
|
|
*
|
|
margin: 0
|
|
padding: 0
|
|
|
|
/* Hide scrollbar for Chrome, Safari and Opera */
|
|
::-webkit-scrollbar
|
|
display: none;
|
|
|
|
|
|
// MAKE SVGS FILL WITH THEIR COLOR ON HOVER
|
|
|
|
body
|
|
background: #000
|
|
color: #fff
|
|
font-family: 'Orbitron', sans-serif;
|
|
-ms-overflow-style: none; /* IE and Edge */
|
|
scrollbar-width: none; /* Firefox */
|
|
|
|
|
|
.logo
|
|
width: 150px
|
|
text-align: center;
|
|
margin: auto;
|
|
justify-content: center;
|
|
display: flex
|
|
|
|
a
|
|
color: white
|
|
font-size: 2vw
|
|
text-decoration: none
|
|
&:hover
|
|
color: grey
|
|
|
|
|
|
.twitch svg:hover
|
|
fill: $twitch
|
|
.twitter svg:hover
|
|
fill: $twitter
|
|
.instagram svg:hover
|
|
fill: $instagram
|
|
svg
|
|
fill: white
|
|
padding: 0 10px
|
|
width: 50px
|
|
height: 50px
|
|
|
|
|
|
.sub-nav
|
|
text-align: center;
|
|
margin: auto;
|
|
justify-content: center;
|
|
display: flex
|
|
|
|
|
|
|
|
.bar
|
|
position: absolute
|
|
width: 99%
|
|
height: 20px
|
|
background-color: white
|
|
mix-blend-mode: difference;
|
|
color: black
|
|
font-size: 15px
|
|
margin: auto;
|
|
display: flex
|
|
padding-left: 1%
|
|
a
|
|
font-size: inherit
|
|
color: black
|
|
|
|
.top
|
|
top: 50px
|
|
|
|
.bottom
|
|
bottom: 50px
|
|
|
|
section
|
|
height: 100vh
|
|
width: 100vw
|
|
|
|
.music
|
|
display: flex
|
|
text-align: center;
|
|
margin: auto;
|
|
justify-content: space-between
|
|
padding-top: 5vh
|
|
margin: 0 100px
|
|
.title
|
|
font-size: 3vh
|
|
display: flex
|
|
text-align: left;
|
|
margin: auto;
|
|
justify-content: space-between
|
|
padding-top: 2vh
|
|
img
|
|
height: 30vh
|
|
|
|
|
|
@media screen and ( max-width: 1350px )
|
|
.music
|
|
display: table
|
|
margin: auto
|
|
.title
|
|
padding-bottom: 20px
|
|
img
|
|
height: 20vh
|
|
.top
|
|
top: 60px
|
|
.bottom
|
|
position: sticky
|
|
bottom: 0
|
|
|
|
|