.doodle {
    position: absolute;
}

.doodle img {
    width: 100%;
}

.doodle.one {
    position: absolute;
    right: 10vh;
    top: 7vh;
    width: 16vw;
}

.doodle.two {
    position: absolute;
    top: 70vh;
    left: 10vh;
    width: 9vw;
}

.albumleftSection {
    position: absolute;
    margin-top: 31.8vh;
    display: none;
}

.doodle.four {
    position: absolute;
    top: 106vh;
    width: 15vw;
    left: 90vh;
    top: 28%;
    width: 15vw;
    left: 47%;
    z-index: -1;
}

.doodle.three {
    position: absolute;
    top: 120vh;
    width: 10vw;
    left: 13vh;
    top: 32%;
    width: 10vw;
    left: 8%;
}

.doodle.five {
    position: absolute;
    top: 110vh;
    width: 13vw;
    right: 10vh;
    top: 28%;
    width: 13vw;
    right: 5%;
}

.doodle.six {
    position: absolute;
    top: 157vh;
    width: 11vw;
    left: 15vh;
    top: 40%;
    width: 11vw;
    left: 8%;
}

.doodle.eight {
    position: absolute;
    top: 202vh;
    width: 13vw;
    left: 16vh;
    top: 52%;
    width: 13vw;
    left: 9%;
}

.doodle.seven {
    position: absolute;
    top: 172vh;
    width: 20vw;
    right: 10vh;
    z-index: 1;
    transform: rotate(-90deg);
    bottom: auto;
    top: 46%;
    width: 20vw;
    right: 6%;
}

.doodle.nine {
    position: absolute;
    top: 219vh;
    width: 15vw;
    right: 10vh;
    z-index: 1;
    top: 56%;
    width: 15vw;
    right: 5%;
}

.doodle.ten {
    position: absolute;
    top: 300vh;
    width: 15vw;
    left: 26vh;
    top: 78%;
    width: 15vw;
    left: 12%;
}

.doodle.eleven {
    position: absolute;
    top: 298vh;
    width: 10vw;
    right: 16vh;
    top: 78%;
    width: 10vw;
    right: 6%;
}

.doodle.twelve {
    position: absolute;
    top: 334vh;
    width: 13vw;
    right: 85vh;
    top: 86%;
    width: 13vw;
    right: 40%;
}

.doodle.thirteen {
    position: absolute;
    bottom: 4vh;
    width: 46vw;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: -1;
}

@media only screen and (min-width: 768px) and (max-width: 1200px) and (orientation: landscape) {
    body.touch-device .doodle.four {
        top: 85vh;
        left: 63vh;
    }
    body.touch-device .doodle.five {
        top: 93vh;
        right: 10vh;
    }
    body.touch-device .doodle.three {
        top: 101vh;
        left: 13vh;
    }
    body.touch-device .doodle.six {
        top: 125vh;
        left: 13vh;
    }
    body.touch-device .doodle.seven {
        top: 135vh;
    }
    body.touch-device .doodle.eight {
        top: 155vh;
        left: 9vh;
    }
    body.touch-device .doodle.nine {
        top: 170vh;
    }
    body.touch-device .doodle.ten {
        top: 217vh;
        width: 16vw;
        left: 20vh;
    }
    body.touch-device .doodle.eleven {
        top: 215vh;
        width: 10vw;
        right: 11vh;
    }
    body.touch-device .doodle.twelve {
        top: 242vh;
        width: 15vw;
        right: 53vh;
    }
}

@media only screen and (max-width: 1023px),
only screen and (max-width: 1023px) and (orientation: landscape) {
    body.touch-device .doodle.one {
        position: absolute;
        right: 10px;
        top: 10px;
        width: 80px;
    }
    body.touch-device .doodle.four {
        position: absolute;
        top: 100vh;
        width: 200px;
        left: auto;
        right: 0;
        top: 33%;
    }
    body.touch-device .doodle.two {
        position: absolute;
        top: 9%;
        left: 1%;
        width: 160px;
        /* top: 26vh;
        left: 1vh; */
    }
    body.touch-device .doodle.three {
        position: absolute;
        top: 99vh;
        width: 130px;
        left: 2vh;
        top: 34%;
        width: 130px;
        left: 2%;
    }
    body.touch-device .doodle.six {
        position: absolute;
        top: 165vh;
        width: 200px;
        left: 3vh;
        top: 56%;
        width: 200px;
        left: 2%;
    }
    body.touch-device .doodle.seven {
        position: absolute;
        top: 165vh;
        width: 230px;
        right: 0;
        z-index: 1;
        transform: rotate(-90deg);
        bottom: auto;
        top: 57%;
    }
    body.touch-device .doodle.five {
        position: absolute;
        top: 168vh;
        width: 150px;
        right: 23vh;
        top: 56%;
        width: 150px;
        right: 38%;
    }
    body.touch-device .doodle.eight {
        position: absolute;
        top: 193vh;
        width: 150px;
        left: 2vh;
        top: 67%;
        width: 150px;
        left: 2%;
    }
    body.touch-device .doodle.nine {
        position: absolute;
        top: 236vh;
        width: 200px;
        right: 4vh;
        z-index: 1;
        top: 79%;
        width: 200px;
        right: 3%;
    }
    body.touch-device .doodle.ten {
        position: absolute;
        top: 250vh;
        width: 200px;
        left: 4vh;
        top: 83%;
        width: 200px;
        left: 3%;
    }
    body.touch-device .doodle.eleven {
        position: absolute;
        top: 255vh;
        width: 150px;
        right: 10vh;
        top: 85%;
        width: 150px;
        right: 9%;
    }
    body.touch-device .doodle.twelve {
        position: absolute;
        top: 270vh;
        width: 150px;
        right: auto;
        left: 25vh;
        top: 91%;
        width: 150px;
        right: auto;
        left: 35%;
    }
    .albumleftSection {
        margin-top: 0;
    }
}

@media only screen and (max-width: 767px) and (orientation: portrait) {
    .storeButtons {
        margin-bottom: 30px;
    }
    body.touch-device .doodle.thirteen {
        position: absolute;
        bottom: 100px;
        width: 90%;
        left: 0;
        right: 0;
        margin: 0 auto;
        z-index: -1;
    }
    body.touch-device .doodle.two {
        width: 130px;
        top: 10%;
        left: -3%;
        display: none;
    }
    body.touch-device .doodle.three {
        position: absolute;
        top: 40%;
        width: 130px;
        left: 1%;
    }
    body.touch-device .doodle.four {
        top: 30%;
        width: 175px;
    }
    body.touch-device .doodle.six {
        position: absolute;
        top: 43%;
        width: 95px;
        left: 18%;
    }
    body.touch-device .doodle.five {
        position: absolute;
        top: 43%;
        width: 100px;
        right: 1%;
    }
    body.touch-device .doodle.seven {
        position: absolute;
        top: 56%;
        width: 188px;
        right: -11%;
        z-index: 1;
        transform: rotate(-90deg);
        bottom: auto;
    }
    body.touch-device .doodle.eight {
        position: absolute;
        top: 54%;
        width: 100px;
        left: 2%;
    }
    body.touch-device .doodle.twelve {
        position: absolute;
        top: 90%;
        width: 150px;
        right: auto;
        left: 24%;
    }
    body.touch-device .doodle.eleven {
        position: absolute;
        top: 84%;
        width: 120px;
        right: 4%;
    }
    body.touch-device .doodle.ten {
        position: absolute;
        top: 79%;
        width: 140px;
        left: 4%;
    }
    body.touch-device .doodle.nine {
        position: absolute;
        top: 65%;
        width: 150px;
        right: 20%;
        z-index: 1;
    }
}

@media only screen and (min-width: 767px) and (max-width: 1023px) and (orientation: portrait) {
    .albumleftSection .logo {
        margin-top: 7vw;
    }
}