html[data-theme="light"]{--bg: #b3bdbf;--color: #f0f9fb;--linkColor: #829091;--linkColorUnderline: #fcfa2b}html[data-theme="light"] #night{display:none}html[data-theme="dark"]{--bg: #051622;--color: #e6e6e6;--linkColor: #fd9400;--linkColorUnderline: #f33717}html[data-theme="dark"] #day{display:none}html.transition,html.transition *,html.transition *:before,html.transition *:after{-webkit-transition:all 750ms !important;transition:all 750ms !important;-webkit-transition-delay:0 !important;transition-delay:0 !important}body{background-color:var(--bg);color:var(--color);font-family:"futura", Arial, Helvetica, sans-serif;font-weight:lighter;margin:0px}.infoAnimation{text-align:center;margin:0 auto;-webkit-transition:2.5s;transition:2.5s;-webkit-transform:translateY(0px);transform:translateY(0px)}.infoAnimation span{border-bottom-left-radius:10px;border-bottom-right-radius:10px;background-color:var(--linkColor);padding:5px 20px;color:var(--color)}.popOut{-webkit-transform:translateY(-40px);transform:translateY(-40px)}.main{margin-top:12%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding-left:12vw;padding-right:12vw}.projects{text-align:center;margin-top:12%}#heading{height:80px}h1{font-size:4em;margin:0 0;font-weight:normal}p{font-size:1.6em;display:block;margin-top:1em;margin-bottom:1em;-webkit-animation:fadeIn 4s;animation:fadeIn 4s}#backToHomepage{padding:5px}a{color:var(--linkColor);text-decoration:none;position:relative}a:after{background-color:var(--linkColorUnderline);content:"";position:absolute;z-index:-1;top:90%;left:-0.1em;right:-0.1em;bottom:0%;-webkit-transition:top 0.2s cubic-bezier(0, 0.8, 0.13, 1);transition:top 0.2s cubic-bezier(0, 0.8, 0.13, 1);border-radius:5px;-webkit-animation:fadeIn 1s;animation:fadeIn 1s}a:hover:after{top:10%}input[type="checkbox"]{height:0;width:0;visibility:hidden}label{margin:2rem;cursor:pointer;text-indent:-9999px;width:52px;height:27px;background:var(--linkColor);float:right;border-radius:100px;position:relative}label:after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;background:#fff;border-radius:90px;-webkit-transition:0.3s;transition:0.3s}input:checked+label:after{left:calc(100% - 5px);-webkit-transform:translateX(-100%);transform:translateX(-100%)}label:active:after{width:45px}hr{width:40%;border-radius:5px;border:1px solid var(--color)}#projectName{margin-top:2rem}@-webkit-keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@-webkit-keyframes cloudMovesRight{from{-webkit-transform:translateX(0px);transform:translateX(0px)}to{-webkit-transform:translateX(30px);transform:translateX(30px)}}@keyframes cloudMovesRight{from{-webkit-transform:translateX(0px);transform:translateX(0px)}to{-webkit-transform:translateX(30px);transform:translateX(30px)}}@-webkit-keyframes cloudMovesLeft{from{-webkit-transform:translateX(0px);transform:translateX(0px)}to{-webkit-transform:translateX(-30px);transform:translateX(-30px)}}@keyframes cloudMovesLeft{from{-webkit-transform:translateX(0px);transform:translateX(0px)}to{-webkit-transform:translateX(-30px);transform:translateX(-30px)}}@-webkit-keyframes birdsMovesTop{0%{-webkit-transform:translateX(0px) translateY(0px);transform:translateX(0px) translateY(0px)}30%{opacity:0.9}40%{opacity:0.8}50%{opacity:0.7}60%{opacity:0.6}70%{opacity:0.5}80%{opacity:0.3}90%{opacity:0.1}100%{-webkit-transform:translateX(-80px) translateY(-80px);transform:translateX(-80px) translateY(-80px);opacity:0}}@keyframes birdsMovesTop{0%{-webkit-transform:translateX(0px) translateY(0px);transform:translateX(0px) translateY(0px)}30%{opacity:0.9}40%{opacity:0.8}50%{opacity:0.7}60%{opacity:0.6}70%{opacity:0.5}80%{opacity:0.3}90%{opacity:0.1}100%{-webkit-transform:translateX(-80px) translateY(-80px);transform:translateX(-80px) translateY(-80px);opacity:0}}@-webkit-keyframes bird1{0%{-webkit-transform:translateX(50px) translateY(50px);transform:translateX(50px) translateY(50px)}10%{opacity:1}100%{-webkit-transform:translateX(-200px) translateY(-200px);transform:translateX(-200px) translateY(-200px);opacity:0}}@keyframes bird1{0%{-webkit-transform:translateX(50px) translateY(50px);transform:translateX(50px) translateY(50px)}10%{opacity:1}100%{-webkit-transform:translateX(-200px) translateY(-200px);transform:translateX(-200px) translateY(-200px);opacity:0}}@-webkit-keyframes bird2{0%{-webkit-transform:translateX(100px) translateY(100px);transform:translateX(100px) translateY(100px);opacity:0.2}10%{opacity:0.5}20%{opacity:1}80%{opacity:0.5}90%{opacity:0.2}100%{-webkit-transform:translateX(-110px) translateY(-110px);transform:translateX(-110px) translateY(-110px);opacity:0}}@keyframes bird2{0%{-webkit-transform:translateX(100px) translateY(100px);transform:translateX(100px) translateY(100px);opacity:0.2}10%{opacity:0.5}20%{opacity:1}80%{opacity:0.5}90%{opacity:0.2}100%{-webkit-transform:translateX(-110px) translateY(-110px);transform:translateX(-110px) translateY(-110px);opacity:0}}#Cloud_1,#Cloud_3{-webkit-animation:cloudMovesRight 3s ease-in-out infinite alternate;animation:cloudMovesRight 3s ease-in-out infinite alternate;opacity:0.8}#Cloud_2{-webkit-animation:cloudMovesLeft 3s ease-in-out infinite alternate;animation:cloudMovesLeft 3s ease-in-out infinite alternate;opacity:0.8}#bird_2{opacity:0;-webkit-animation:bird1 5s infinite ease-in-out;animation:bird1 5s infinite ease-in-out}#bird_4{opacity:0;-webkit-animation:bird1 6s infinite ease-in-out;animation:bird1 6s infinite ease-in-out}#bird_6{opacity:0;-webkit-animation:bird2 7s infinite ease-in-out;animation:bird2 7s infinite ease-in-out}#bird_8{opacity:0;-webkit-animation:bird2 8s infinite ease-in-out;animation:bird2 8s infinite ease-in-out}#bird_10{opacity:0;-webkit-animation:bird2 9s infinite ease-in-out;animation:bird2 9s infinite ease-in-out}@-webkit-keyframes moveLantern1{0%{-webkit-transform:translateX(160px) translateY(160px);transform:translateX(160px) translateY(160px)}10%{opacity:1}80%{opacity:0.9}to{-webkit-transform:translateX(-60px) translateY(-60px);transform:translateX(-60px) translateY(-60px);opacity:0}}@keyframes moveLantern1{0%{-webkit-transform:translateX(160px) translateY(160px);transform:translateX(160px) translateY(160px)}10%{opacity:1}80%{opacity:0.9}to{-webkit-transform:translateX(-60px) translateY(-60px);transform:translateX(-60px) translateY(-60px);opacity:0}}@-webkit-keyframes moveLantern2{0%{-webkit-transform:translateX(110px) translateY(110px);transform:translateX(110px) translateY(110px)}10%{opacity:1}80%{opacity:0.9}100%{-webkit-transform:translateX(-90px) translateY(-90px);transform:translateX(-90px) translateY(-90px);opacity:0}}@keyframes moveLantern2{0%{-webkit-transform:translateX(110px) translateY(110px);transform:translateX(110px) translateY(110px)}10%{opacity:1}80%{opacity:0.9}100%{-webkit-transform:translateX(-90px) translateY(-90px);transform:translateX(-90px) translateY(-90px);opacity:0}}@-webkit-keyframes moveLantern3{0%{-webkit-transform:translateX(110px) translateY(110px);transform:translateX(110px) translateY(110px)}10%{opacity:1}80%{opacity:0.9}to{-webkit-transform:translateX(-110px) translateY(-110px);transform:translateX(-110px) translateY(-110px)}}@keyframes moveLantern3{0%{-webkit-transform:translateX(110px) translateY(110px);transform:translateX(110px) translateY(110px)}10%{opacity:1}80%{opacity:0.9}to{-webkit-transform:translateX(-110px) translateY(-110px);transform:translateX(-110px) translateY(-110px)}}@-webkit-keyframes moveLantern4{0%{-webkit-transform:translateX(0px) translateY(0px);transform:translateX(0px) translateY(0px)}10%{opacity:1}80%{opacity:0.9}to{-webkit-transform:translateX(-230px) translateY(-230px);transform:translateX(-230px) translateY(-230px)}}@keyframes moveLantern4{0%{-webkit-transform:translateX(0px) translateY(0px);transform:translateX(0px) translateY(0px)}10%{opacity:1}80%{opacity:0.9}to{-webkit-transform:translateX(-230px) translateY(-230px);transform:translateX(-230px) translateY(-230px)}}@-webkit-keyframes moveLantern6{0%{-webkit-transform:translateX(30px) translateY(30px);transform:translateX(30px) translateY(30px)}10%{opacity:1}80%{opacity:0.9}to{-webkit-transform:translateX(-170px) translateY(-170px);transform:translateX(-170px) translateY(-170px);opacity:0}}@keyframes moveLantern6{0%{-webkit-transform:translateX(30px) translateY(30px);transform:translateX(30px) translateY(30px)}10%{opacity:1}80%{opacity:0.9}to{-webkit-transform:translateX(-170px) translateY(-170px);transform:translateX(-170px) translateY(-170px);opacity:0}}@-webkit-keyframes moveLantern7{0%{-webkit-transform:translateX(10px) translateY(10px);transform:translateX(10px) translateY(10px)}10%{opacity:1}80%{opacity:0.9}to{-webkit-transform:translateX(-190px) translateY(-190px);transform:translateX(-190px) translateY(-190px);opacity:0}}@keyframes moveLantern7{0%{-webkit-transform:translateX(10px) translateY(10px);transform:translateX(10px) translateY(10px)}10%{opacity:1}80%{opacity:0.9}to{-webkit-transform:translateX(-190px) translateY(-190px);transform:translateX(-190px) translateY(-190px);opacity:0}}#Lantern{opacity:0;-webkit-animation:moveLantern1 7s infinite ease-in-out;animation:moveLantern1 7s infinite ease-in-out}#Lantern_2{opacity:0;-webkit-animation:moveLantern4 8s infinite ease-in-out;animation:moveLantern4 8s infinite ease-in-out}#Lantern_3{opacity:0;-webkit-animation:moveLantern3 9s infinite ease-in-out;animation:moveLantern3 9s infinite ease-in-out}#Lantern_4{opacity:0;-webkit-animation:moveLantern2 10s infinite ease-in-out;animation:moveLantern2 10s infinite ease-in-out}#Lantern_5{opacity:0;-webkit-animation:moveLantern7 11s infinite ease-in-out;animation:moveLantern7 11s infinite ease-in-out}#Lantern_6{opacity:0;-webkit-animation:moveLantern6 12s infinite ease-in-out;animation:moveLantern6 12s infinite ease-in-out}@media only screen and (max-width: 1800px){.main{margin-top:10%}}@media only screen and (max-width: 1428px){#day{display:none}#night{display:none}.main{padding-right:2vw}}@media only screen and (max-width: 1023px){body{font-size:0.8rem}#heading{height:50px}h1{font-size:3em}p{font-size:1.5em}.main{margin-top:8%}}@media only screen and (max-width: 773px){.main{margin-top:2%}label{margin:0.5rem;width:35px;height:15px}label:after{width:10px;height:10px}input:checked+label:after{left:calc(90% - 5px);-webkit-transform:translateX(-50%);transform:translateX(-50%)}label:active:after{width:20px}}@media only screen and (max-width: 320px){.main{padding:1rem}.projects{font-size:0.9rem}}
