html, body, .container {
    height: ;
    margin: 0;
    padding: 0;
}

body {
    /*background: linear-gradient(to bottom, #0fb8ad 0%, #1fc8db 31%, #2cb5e8 75%)
    */
}
/*
.parallax {
  perspective: 1px;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}
*/
    
/* wrapper*/
.wrapper {
    width: 100%;
    height: 1000px;
    position: relative;
}

.section1{
  background-image: linear-gradient(#d9f1ff 70%, #bfe6ff 100%);
}
.section2{
  background-image: linear-gradient(#bfe6ff 70%, #8cd3ff 100%);
}
.section3{
  background-image: linear-gradient(#8cd3ff 70%, #59bfff 100%);
}
.section4{
  background-image: linear-gradient(#59bfff 70%, #26abff 100%);
}
.section5{
  background-image: linear-gradient(#26abff 70%, #009dff 100%);
}

.section6{
  background-image: linear-gradient(#009dff 70%, #3944bc 100%);
}

.fixed_text {
    font-family: 'Oswald', sans-serif;
    font-size: 10vw;
    line-height: 1;
    margin: 0;
    /* position fixed, not absolute 
    I also fixed it little bit to make it centered with position:fixed; */
    position: fixed;
    top: 15%;
    text-align: center;
    left:0;
    right:0;
    z-index: 9;
}

h2 {
    font-weight: 700;
    font-size: 40px;
    margin: 0;
}

h3 {
   font-weight: 500;
    font-size: 30px;
    margin: 0; 
}

.scrolling_text {
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    font-size: 24px;
    width: 70%;
    margin: 0;
    top: 350px;
    margin-top:100px;
    position: absolute;
    top: 42%;
    left: 46%;
    transform: translate(-50%, -50%);
    z-index: 999;
}

li{
    padding-bottom: 10px;
    /* space after list items*/
}

a {
    text-decoration: none;
}

.heading1 {
  writing-mode: vertical-rl; 
    font-family: 'Oswald', sans-serif;
    font-size: 22px;
    line-height: 1;
    margin: 0;
    position: fixed;
    top: 2%;
    text-align: center;
    right:10px;
    z-index: 999;
    color: white
}

.heading2 {
  writing-mode: vertical-rl; 
    font-family: 'Oswald', sans-serif;
    font-size: 22px;
    line-height: 1;
    margin: 0;
    position: fixed;
    top: 17%;
    text-align: center;
    right:10px;
    z-index: 999;
    color: white
}

.heading3 {
  writing-mode: vertical-rl; 
    font-family: 'Oswald', sans-serif;
    font-size: 22px;
    line-height: 1;
    margin: 0;
    position: fixed;
    top: 40.5%;
    text-align: center;
    right:10px;
    z-index: 999;
    color: white
}

.heading4 {
  writing-mode: vertical-rl; 
    font-family: 'Oswald', sans-serif;
    font-size: 22px;
    line-height: 1;
    margin: 0;
    position: fixed;
    top: 51.5%;
    text-align: center;
    right:10px;
    z-index: 999;
    color: white
}

.heading5 {
  writing-mode: vertical-rl; 
    font-family: 'Oswald', sans-serif;
    font-size: 22px;
    line-height: 1;
    margin: 0;
    position: fixed;
    top: 82%;
    text-align: center;
    right:10px;
    z-index: 999;
    color: white
}

.heading1:hover{
    color: black
}

.heading2:hover{
    color: black
}

.heading3:hover{
    color: black
}

.heading4:hover{
    color: black
}

.heading5:hover{
    color: black
}

.bubbles {
    top:60%;
    position: absolute;
    z-index: 99;
}

.handsanitizer {
    position: absolute;
    top: 5000px;
    left: 0px;
    z-index: 99;
}

.handwashingsteps{
    position: absolute;
    top: 3275px;
    left: 160px;
    z-index: 99;
}

.handbubbles{
    position: absolute;
    top: 4350px;
    right: 150px;
    z-index: 99; 
}

.hands_sink{
    position: absolute;
    top: 2400px;
    right: 100px;
    z-index: 99;     
}

.germs{
    top: 1300px;
    position: absolute;
    right: 0px;
    z-index: 99;
}

footer {
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    text-align: center;
    padding: 20px;
    z-index: 999;
    background-color: #3944bc;
    color:white
}


/* scrolling speed

.speed1 {
  transform: translateZ(-1px) scale(2);
}

.speed2 {
  transform: translateZ(-2px) scale(3);
}

.speed3 {
  transform: translateZ(-3px) scale(4);
}

.speed4 {
  transform: translateZ(-4px) scale(5);
}

.speed5 {
  transform: translateZ(-5px) scale(6);
}

.section1{
  margin-top: 200px;
}
.section2{
  margin-top: 200%;
}
.section3{
  margin-top: 300%;
}
.section4{
  margin-top: 400%;
}
.section5{
  margin-top: 500%;
}

*/