Proper divs set up with a more logical and flexible framework for future animations.
This commit is contained in:
parent
5cd193a4b5
commit
41247ac4aa
1 changed files with 8 additions and 12 deletions
|
@ -19,12 +19,16 @@ body {
|
||||||
}
|
}
|
||||||
|
|
||||||
#hero-section {
|
#hero-section {
|
||||||
width: 95dvw;
|
width: 100dvw;
|
||||||
height: 100dvh;
|
height: 100dvh;
|
||||||
vertical-align: middle;
|
|
||||||
align-content: center;
|
align-content: center;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
/* position: absolute;
|
||||||
|
left:0;
|
||||||
|
right: 0; */
|
||||||
|
transition: 3s ease-in;
|
||||||
|
transition-property: opacity;
|
||||||
}
|
}
|
||||||
|
|
||||||
#hero {
|
#hero {
|
||||||
|
@ -34,22 +38,14 @@ body {
|
||||||
font-variant-caps: petite-caps;
|
font-variant-caps: petite-caps;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
top: 45dvh;
|
top: 45dvh;
|
||||||
width: 98dvw;
|
width: 100%;
|
||||||
transition: 3s ease-in;
|
|
||||||
transition-property: opacity;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#hero-titles {
|
#hero-titles {
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 2em;
|
font-size: 2em;
|
||||||
font-variant-caps: all-petite-caps;
|
font-variant-caps: all-petite-caps;
|
||||||
transition: 0.2s ease-in-out;
|
width: 100%;
|
||||||
position: absolute;
|
|
||||||
top: 55dvh;
|
|
||||||
/*left: 50vh; */
|
|
||||||
width: 98dvw;
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue