.content{height:100vh;overflow:hidden;position:absolute;display:grid;grid-template-columns:[flag-cl-start balloon-l-start] 1fr [flag-cl-end balloon-l-end flag-l-start frame-start] 1fr [flag-l-end flag-r-start] 1fr [flag-r-end flag-cr-start balloon-r-start frame-end] 1fr [flag-cr-end balloon-r-end];grid-template-rows:30vh 70vh}.content>*{width:100%}@media only screen and (max-width: 800px){.content{grid-template-columns:[flag-l-start balloon-l-start frame-start] 1fr [balloon-l-end flag-l-end flag-r-start balloon-r-start] 1fr [flag-r-end balloon-r-end frame-end]}}.frame{grid-row:2/3;grid-column:frame-start/frame-end;display:none;opacity:0;flex-direction:column;justify-content:space-evenly;align-items:center;text-align:center}*,*::before,*::after{box-sizing:inherit;margin:0;padding:0}html{font-size:62.5%;box-sizing:border-box}@media(min-width: 1200px){html{font-size:70%}}body{color:#fff;font-family:"Courgette",cursive}.balloon{grid-row:1/-1;width:130%}.balloon--left{grid-column:balloon-l-start/balloon-l-end;-webkit-animation:balloon-move 4s linear 0s infinite;animation:balloon-move 4s linear 0s infinite}@media(max-width: 800px){.balloon--left{margin-left:-25%}}@media(max-width: 500px){.balloon--left{margin-left:-40%}}.balloon--right{grid-column:balloon-r-start/balloon-r-end;margin-left:-20%;animation:balloon-move 4s linear 0s infinite reverse}@media(max-width: 800px){.balloon--right{margin-left:25%}}@media(max-width: 800px){.balloon{width:100%}}@media(max-width: 500px){.balloon{width:120%}}.flag{grid-row:1/2;z-index:0}.flag--c-left{grid-column:flag-cl-start/flag-cl-end}@media(max-width: 800px){.flag--c-left{display:none}}.flag--c-right{grid-column:flag-cr-start/flag-cr-end}@media(max-width: 800px){.flag--c-right{display:none}}.flag--left{grid-column:flag-l-start/flag-l-end}.flag--right{grid-column:flag-r-start/flag-r-end}@media(max-width: 800px){.flag{transform:scale(1.2);margin-top:20%}}.img-back{position:relative;background-color:#ffa8dc;height:20rem;width:20rem;border-radius:50%}@media(max-width: 800px){.img-back{height:35rem;width:35rem}}@media(max-width: 500px){.img-back{height:20rem;width:20rem}}.bd-pic{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:83.33333333%;width:83.33333333%;overflow:hidden;border-color:#fff;border-style:dotted;border-radius:50%;background-image:url(../resources/img/Asset.png);background-position:top;background-repeat:no-repeat;background-size:cover}.cap{position:absolute;top:-15%;left:50%;transform:translate(0, 0);height:33.33333333%}.confetti{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:150%;width:150%}.cake{position:absolute;top:90%;left:50%;transform:translate(-50%, -50%);height:70%;width:70%}.HBD-text{width:90%}.HBD{font-size:2.4rem;padding:0}@media(max-width: 800px){.HBD{font-size:3.4rem}}@media(max-width: 500px){.HBD{font-size:3rem}}.nickname{font-size:3.2rem;padding:0}@media(max-width: 800px){.nickname{font-size:4.2rem}}@media(max-width: 500px){.nickname{font-size:3.8rem}}.scroll{position:relative;overflow-y:hidden;height:70%;width:80%;font-size:2.4rem}@media(max-width: 800px){.scroll{height:60%}}@media(max-width: 500px){.scroll{height:80%;font-size:2.2rem}}.scroll p{position:absolute;top:50%;left:0;transform:translate(0, 0)}.btn{position:absolute;top:60%;left:50%;transform:translate(0, -50%);display:none;overflow:hidden;height:15rem;width:15rem;background-repeat:no-repeat;background-size:contain;background-position:center;-webkit-animation:heart-beat 2s linear 0s infinite alternate;animation:heart-beat 2s linear 0s infinite alternate}.btn-ref{position:absolute;top:90%;left:50%;transform:translate(-50%, 0);text-align:center;color:#fff;display:none;font-size:1.8rem}.switch{background-image:url("../resources/img/bulb.svg")}.gift{background-image:url("../resources/img/gift.svg")}.door-in,.door-out{background-image:url("../resources/img/door.svg")}.darkroom,.flash,.giftroom,.empty-room,.hallway{text-align:center;position:absolute;height:100vh;width:100vw}.darkroom{background-color:#000}.flash{background-color:#fff}.giftroom,.empty-room{background-color:#141852}.hallway{background-image:radial-gradient(transparent, #000),url(../resources/img/Hallway.svg);background-position:center;background-repeat:no-repeat;background-size:cover;overflow:hidden}.empty-room,.giftroom,.content{background-image:radial-gradient(transparent, rgba(0, 0, 0, 0.65)),url(../resources/img/bedroom.svg);background-position:70%;background-repeat:no-repeat;background-size:cover}.bb-text,.gift-text,.hall-text,.room-text{position:absolute;top:20%;left:50%;transform:translate(-50%, -50%);display:inline-block;text-align:center;width:80vw;opacity:0;font-size:3.2rem}.velas{background:#fff;border-radius:.625rem;position:absolute;top:70%;left:50%;width:1.5%;height:12%;-webkit-backface-visibility:hidden;backface-visibility:hidden}.velas:after,.velas:before{background:rgba(255, 0, 0, 0.4);content:"";position:absolute;width:100%;height:5%}.velas:after{top:25%;left:0}.velas:before{top:45%;left:0}.fuego{border-radius:100%;position:absolute;top:-50%;left:60%;margin-left:-2.6px;width:100%;height:40%}.fuego:nth-child(1){-webkit-animation:fuego 2s 6.5s infinite;animation:fuego 2s 6.5s infinite}.fuego:nth-child(2){-webkit-animation:fuego 1.5s 6.5s infinite;animation:fuego 1.5s 6.5s infinite}.fuego:nth-child(3){-webkit-animation:fuego 1s 6.5s infinite;animation:fuego 1s 6.5s infinite}.fuego:nth-child(4){-webkit-animation:fuego .5s 6.5s infinite;animation:fuego .5s 6.5s infinite}.fuego:nth-child(5){-webkit-animation:fuego .2s 6.5s infinite;animation:fuego .2s 6.5s infinite}@-webkit-keyframes fuego{0%,100%{background:rgba(254, 248, 97, 0.5);box-shadow:0 0 250% 62.5% rgba(248, 233, 209, 0.2);transform:scale(1)}50%{background:rgba(255, 50, 0, 0.1);box-shadow:0 0 250% 125% rgba(248, 233, 209, 0.2);transform:scale(0)}}@keyframes fuego{0%,100%{background:rgba(254, 248, 97, 0.5);box-shadow:0 0 250% 62.5% rgba(248, 233, 209, 0.2);transform:scale(1)}50%{background:rgba(255, 50, 0, 0.1);box-shadow:0 0 250% 125% rgba(248, 233, 209, 0.2);transform:scale(0)}}@-webkit-keyframes in{to{transform:translateY(0)}}@keyframes in{to{transform:translateY(0)}}@-webkit-keyframes fade{0%{opacity:1}100%{opacity:0}}@keyframes fade{0%{opacity:1}100%{opacity:0}}@-webkit-keyframes read{0%{opacity:0}25%{opacity:1}75%{opacity:1}100%{opacity:0}}@keyframes read{0%{opacity:0}25%{opacity:1}75%{opacity:1}100%{opacity:0}}@-webkit-keyframes heart-beat{0%{transform:translate(-50%, -50%) scale(1, 1)}50%{transform:translate(-50%, -50%) scale(1.25, 1.25)}100%{transform:translate(-50%, -50%) scale(1, 1)}}@keyframes heart-beat{0%{transform:translate(-50%, -50%) scale(1, 1)}50%{transform:translate(-50%, -50%) scale(1.25, 1.25)}100%{transform:translate(-50%, -50%) scale(1, 1)}}@-webkit-keyframes balloon-move{0%{transform:translateY(0) rotate(0)}25%{transform:translateY(5%) rotate(3deg)}50%{transform:translateY(0) rotate(0)}75%{transform:translateY(-5%) rotate(-3deg)}100%{transform:translateY(0) rotate(0)}}@keyframes balloon-move{0%{transform:translateY(0) rotate(0)}25%{transform:translateY(5%) rotate(3deg)}50%{transform:translateY(0) rotate(0)}75%{transform:translateY(-5%) rotate(-3deg)}100%{transform:translateY(0) rotate(0)}}@-webkit-keyframes move-up{0%{transform:translateY(0)}100%{transform:translateY(-100%)}}@keyframes move-up{0%{transform:translateY(0)}100%{transform:translateY(-100%)}}.hidden{display:none}.fade-in{-webkit-animation:fade 2s ease-in 0s;animation:fade 2s ease-in 0s}.appear{animation:fade 2s linear 0s 1 reverse}.read{-webkit-animation:read 4s linear 0s;animation:read 4s linear 0s}.move-up{-webkit-animation:move-up 80s linear 3s;animation:move-up 80s linear 3s}/*# sourceMappingURL=style.css.map */