.background-holder{position:fixed;width:100%;height:100%;pointer-events:none}.background-holder .background{width:100%;height:100%;background-size:cover;background-position:bottom center;position:absolute}.fishes-container{width:100%;height:100%;position:absolute}.fish{position:absolute;width:100%;animation-iteration-count:infinite;-webkit-animation-iteration-count:infinite;animation-timing-function:linear;-webkit-animation-timing-function:linear}.fish.swim-right{animation-name:swim-right}.fish.swim-left{animation-name:swim-left}.fish-image{position:absolute;animation-name:bounce;animation-duration:2s;animation-iteration-count:infinite;-webkit-animation-iteration-count:infinite;animation-timing-function:linear;-webkit-animation-timing-function:linear}.fish.swim-right .fish-image{right:0}.background-fish{position:absolute;width:100%;animation-iteration-count:infinite;-webkit-animation-iteration-count:infinite;animation-timing-function:linear;-webkit-animation-timing-function:linear}.background-fish--holder{position:absolute;width:300px}.fish.swim-right .background-fish--holder{right:0}.background-fish .background-fish-image{-moz-animation:bounce 2s infinite;-webkit-animation:bounce 2s infinite;animation:bounce 2s infinite;position:absolute}.background-fish .background-fish-image:nth-child(1){animation-delay:.5s;-webkit-animation-delay:.5s;top:0;left:0}.background-fish .background-fish-image:nth-child(2){animation-delay:.4s;-webkit-animation-delay:.4s;top:0;left:100px}.background-fish .background-fish-image:nth-child(3){animation-delay:.2s;-webkit-animation-delay:.2s;top:60px;left:10px}.background-fish .background-fish-image:nth-child(4){animation-delay:0s;-webkit-animation-delay:0s;top:20px;left:50px}.background-fish .background-fish-image:nth-child(5){animation-delay:.1s;-webkit-animation-delay:.1s;top:30px;left:150px}.background-fish .background-fish-image:nth-child(6){animation-delay:.3s;-webkit-animation-delay:.3s;top:50px;left:120px}@keyframes swim-right{0%{transform:translate(-350px) scaleX(-1)}70%{transform:translate(100%) scaleX(-1)}to{transform:translate(100%) scaleX(-1)}}@keyframes swim-left{0%{transform:translate(100%)}70%{transform:translate(-350px)}to{transform:translate(-350px)}}@keyframes bounce{0%,50%,to{-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}25%{-moz-transform:translateY(-5px);-ms-transform:translateY(-5px);-webkit-transform:translateY(-5px);transform:translateY(-5px)}75%{-moz-transform:translateY(-3px);-ms-transform:translateY(-3px);-webkit-transform:translateY(-3px);transform:translateY(-3px)}}.breathing-area{justify-content:center;align-items:center;position:relative;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto;width:300px;margin:auto;text-align:center}.breathing-bubble-area{height:500px;width:80px;border:3px solid #2d6885;border-radius:100px;position:relative;margin:auto;grid-column:1 / span 2}.breathing-bubble{position:absolute;width:100%;padding-top:100%;border-radius:100%;bottom:0;line-height:0}.breathing-bubble img{width:100%}.breathing-text{margin-top:40px;margin-bottom:40px;font-size:40px;color:#fff;opacity:1;grid-column:1 / span 2;transition:opacity .4s}.breathing-timer{background-color:#555;margin:auto;color:#fff;border-radius:20px;padding:10px 0;width:90px;font-size:18px;font-weight:600}.breathing-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;padding:0;font:inherit;width:60px;cursor:pointer;background-color:#fff;border-radius:100%;line-height:0;margin:auto}.breathing-toggle img{width:100%}.breathing-toggle:focus-visible{outline:3px solid #24b99f;outline-offset:3px}.fade-enter{opacity:0}.fade-exit,.fade-enter-active{opacity:1}.fade-exit-active{opacity:0}.menu-panel-section{position:relative;z-index:9}.menu-opener.menu-opener--out-menu{width:200px;text-align:center;margin-left:auto}.settings-logo-container{padding-top:10px}.settings-logo-button,.menu-panel-section-btn,.background-selector__single{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;padding:0;font:inherit;color:inherit;cursor:pointer;text-align:left}.settings-logo-button:focus-visible,.menu-panel-section-btn:focus-visible,.background-selector__single:focus-visible{outline:3px solid #24b99f;outline-offset:2px}.settings-logo{width:50px;padding:30px}.menu-panel{height:100%;position:fixed;top:0;background-color:#555;width:200px;color:#fff;right:-200px;transition:all .5s;display:grid;grid-auto-rows:100px;justify-content:center;align-items:center;text-align:right}.menu-panel-section-duo{position:relative}.menu-panel-section-btn{padding:30px;font-size:20px;font-weight:500;display:block;width:100%}.menu-opener--in-menu{position:relative;top:0;text-align:center;overflow:hidden;height:100px;width:100px;margin:auto;padding:0 50px}.menu-opener--in-menu .settings-logo-container{position:absolute;transition:all .5s;right:200px;width:100%;height:100%;object-fit:contain}.menu-panel-section-reveal{position:absolute;top:30px;right:230px;width:400px;border-radius:5px;box-shadow:2px 2px 8px #555;opacity:0;transition:0s all;background-color:#fff;padding:20px 20px 30px;color:#555}.menu-panel-section-reveal--inactive{pointer-events:none}.menu-panel-section-reveal--active{opacity:1;top:-20px;transition:.5s all}.menu-panel--active,.menu-panel--active .menu-opener.menu-opener--in-menu .settings-logo-container{right:0}.menu-panel--inactive .menu-panel-section-reveal{display:none}.timer-selector .slide-title{margin-bottom:5px}.timer-selector .slide-value{margin-bottom:20px}.background-selector{display:flex;text-align:center}.background-selector .background-selector__single{margin:0 20px}.background-selector__single-title{margin-bottom:5px}.background-selector__single-img{width:100px;height:100px;background-size:cover}.slider{-webkit-appearance:none;width:100%;height:15px;border-radius:5px;background:#d3d3d3;outline:none;opacity:.7;-webkit-transition:.2s;transition:opacity .2s}.slider:hover{opacity:1}.slider:focus-visible{outline:3px solid #24b99f;outline-offset:3px}.slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:25px;height:25px;border-radius:50%;background:#24b99f;cursor:pointer}.slider::-moz-range-thumb{width:25px;height:25px;border-radius:50%;background:#24b99f;cursor:pointer}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}