|
|
| Line 443: |
Line 443: |
| | box-shadow: -5px 0 0 0 #83af9b; | | box-shadow: -5px 0 0 0 #83af9b; |
| | } | | } |
| − | .slider-holder
| |
| − | {
| |
| − | width: 100vw;
| |
| − | height: 98vh;
| |
| − | background-color: ;
| |
| − | margin-left: auto;
| |
| − | margin-right: auto;
| |
| − | margin-top: 0px;
| |
| − | text-align: center;
| |
| − | overflow: hidden;
| |
| − | position: absolute;
| |
| − | right: 0;
| |
| − | }
| |
| − |
| |
| − | .image-holder
| |
| − | {
| |
| − | width: 300vw;
| |
| − | background-color: #3498db;
| |
| − | height: 98vh;
| |
| − | clear: both;
| |
| − | position: relative;
| |
| − |
| |
| − | -webkit-transition: right 1s;
| |
| − | -moz-transition: right 1s;
| |
| − | -o-transition: right 1s;
| |
| − | transition: right 1s;
| |
| − | }
| |
| − |
| |
| − | .slider-holder.marginFix {
| |
| − | height: 100vh;
| |
| − | }
| |
| | | | |
| − | .image-holder.marginFix {
| + | .mainVideo{ |
| − | height: 100vh;
| + | height: 100vh; |
| − | } | + | position: absolute; |
| − | | + | top: 0; |
| − | .slider-image
| + | right: 0; |
| − | {
| + | } |
| − | float: left;
| + | |
| − | margin: 0px;
| + | |
| − | padding: 0px;
| + | |
| − | position: relative;
| + | |
| − | width: 100vw;
| + | |
| − | } | + | |
| − | | + | |
| − | #video_resize {
| + | |
| − | height: 100vh;
| + | |
| − | }
| + | |
| − | | + | |
| − | #gif_resize{
| + | |
| − | height: 90vh;
| + | |
| − | }
| + | |
| − | | + | |
| − | .slider_1, .slider_2, .slider_3{
| + | |
| − | background-color: black;
| + | |
| − | }
| + | |
| − | | + | |
| − | .slider_1.active{
| + | |
| − | background-color: white;
| + | |
| − | }
| + | |
| − | | + | |
| − | .slider_2.active{
| + | |
| − | background-color: white;
| + | |
| − | }
| + | |
| − | | + | |
| − | .slider_3.active{
| + | |
| − | background-color: white;
| + | |
| − | }
| + | |
| − |
| + | |
| − | #slider-image-1, #slider-image-2, #slider-image-3{
| + | |
| − | top:0;
| + | |
| − | } | + | |
| − | | + | |
| − | #slider-image-1:target ~ .image-holder
| + | |
| − | {
| + | |
| − | right: 1px;
| + | |
| − | }
| + | |
| − |
| + | |
| − | #slider-image-2:target ~ .image-holder
| + | |
| − | {
| + | |
| − | right: 100vw;
| + | |
| − | }
| + | |
| − |
| + | |
| − | #slider-image-3:target ~ .image-holder
| + | |
| − | {
| + | |
| − | right: 200vw;
| + | |
| − | }
| + | |
| − |
| + | |
| − | #slider-image-3{
| + | |
| − | top: 0;
| + | |
| − | }
| + | |
| − | | + | |
| − | .button-holder
| + | |
| − | {
| + | |
| − | position: absolute;
| + | |
| − | bottom: 20px;
| + | |
| − | right: 10px;
| + | |
| − | z-index: 4;
| + | |
| − | }
| + | |
| − |
| + | |
| − | .button-holder.marginFix{
| + | |
| − | bottom: 25px;
| + | |
| − | }
| + | |
| − | .button-holder.hover{
| + | |
| − | display: none;
| + | |
| − | }
| + | |
| − | .slider-change
| + | |
| − | {
| + | |
| − | display: inline-block;
| + | |
| − | height: 10px;
| + | |
| − | width: 10px;
| + | |
| − | border-radius: 5px;
| + | |
| − | background-color: grey;
| + | |
| − | }
| + | |
| | } | | } |
| | | | |
