CollinMarino (Talk | contribs) |
CollinMarino (Talk | contribs) |
||
Line 98: | Line 98: | ||
#scrollCheckpoint{ | #scrollCheckpoint{ | ||
position: absolute; | position: absolute; | ||
− | top: calc(min(96vh - 1.3vw,57vw)); | + | top: calc(min(96vh - 1.3vw - 16px,57vw - 16px)); |
transform: translateY(100%) | transform: translateY(100%) | ||
} | } |
Revision as of 05:14, 18 October 2020
.mainContainer{
background-image: url(""); background-repeat: repeat round; background-size: 30%; background-color: white;
}
.mainContainer2{
background-image: url(""); background-repeat: repeat round; background-size: 30%; background-color: #F2F2F2; color: white;
}
.videoholder{
height: 100vh; max-height: 57vw; overflow: hidden; margin: auto; background-color: white; transform: translateY(calc(0px - 1.3vw - 4vh)); -ms-transform: translateY(calc(0px - 1.3vw - 4vh)); -webkit-transform: translateY(calc(0px - 1.3vw - 4vh)); -moz-transform: translateY(calc(0px - 1.3vw - 4vh)); border-width: 2vh;
}
.mainvideo{
position: relative; top: 0; left: 50%; height: 100vh; max-height: 57vw; transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%);
}
.downScrollHolder{
position: relative; bottom: 0px; transform: translateY(-100%); -ms-transform: translateY(-100%); -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); display: flex; justify-content: center; width: 100%; padding-bottom: 3%;
}
.scrollDown{
cursor: pointer; opacity: 0.58; transition: 0.3s;
}
.scrollDown:hover{
opacity: 1
}
.downText{
width: 100%; font-family: THICCCBOI; font-size: 2vw; font-weight: lighter; text-align: center; color: transparent; visibility: hidden;
}
@keyframes show {
from {visibility: transparent;} to {visibility: white;}
}
.textAppear{
visibility: visible; color: white; animation-name: show; animation-duration: 1s;
}
.downArrow {
height: 5vh; max-height: 2.85vw; width: 5vh; max-width: 2.85vw; border: solid white; border-width: 0 0.4vw 0.4vw 0; display: inline-block; transform: rotate(45deg); -webkit-transform: rotate(45deg);
}
- scrollCheckpoint{
position: absolute; top: calc(min(96vh - 1.3vw - 16px,57vw - 16px)); transform: translateY(100%)
}