:root{width:100%;height:100%}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}#root{--standard-padding: 10px;--standard-margin: 20px;text-align:center;display:flex;min-width:100%;min-height:100vh;color:var(--text-colour-1);font-family:Arial,Helvetica,sans-serif;word-wrap:break-word;transition:background-color .5s ease-out}[data-theme=dark]{--background-colour-1: rgb(30, 30, 30);--background-colour-2: rgba(40, 40, 40, 1);--background-colour-3: rgba(40, 40, 40, .1);--gradient-colour-1: rgba(40, 40, 40, .8);--text-colour-1: rgb(235, 235, 235);--text-colour-2: rgb(125, 125, 125);--button-colour-1: rgb(55, 175, 255);--button-colour-2: rgb(30, 30, 30);--track-colour: rgb(235, 235, 235);--border-colour-1: rgb(255, 255, 255);--border-colour-2: rgb(55, 175, 255);--hover-colour-1: rgb(55, 175, 255);--active-colour-1: rgb(55, 175, 255);--active-colour-2: rgb(200, 200, 200);--shadow-colour:rgb(0, 0, 0)}[data-theme=light]{--background-colour-1: rgba(182, 182, 182, 1);--background-colour-2: rgba(240, 240, 240, 1);--background-colour-3: rgba(240, 240, 240, .1);--gradient-colour-1: rgba(240,240,240, .8);--text-colour-1: rgb(50, 50, 50);--text-colour-2: rgb(125, 125, 125);--button-colour-1: rgb(30, 86, 163);--button-colour-2: rgb(151, 151, 151);--track-colour: rgb(50, 50, 50);--border-colour-1: rgba(0, 0, 0, 1);--border-colour-2: rgb(30, 86, 163);--hover-colour-1: rgb(30, 86, 163);--active-colour-1: rgb(30, 86, 163, 1);--active-colour-2: rgb(200, 200, 200);--shadow-colour:rgb(0, 0, 0)}.main-container{display:flex;flex-direction:column;align-items:center;justify-content:space-between;min-width:100%;background-color:var(--background-colour-1);transition:background-color .5s ease-out}.main-content-container{display:flex;flex-direction:column;justify-content:flex-start;background-color:var(--background-colour-3);height:100%;width:100%;max-width:1680px;transition:background-color .5s ease-out;background-image:linear-gradient(var(--gradient-colour-1),var(--gradient-colour-1)),url(/motion-demo/assets/background-HoDzsLXM.png);background-size:cover}.content-container{border-left:1px solid;border-right:1px solid;border-color:var(--border-colour-1);box-shadow:0 0 50px 10px var(--shadow-colour);height:100%}.card{background-color:purple}.header-container,.footer-container{display:flex;gap:10px;align-items:center;position:relative;background-color:var(--background-colour-2);min-width:100%;border-color:var(--border-colour-1);transition:background-color .5s ease-out}.header-container{border-bottom:1px solid}.header-logo-container{margin-left:var(--standard-margin)}.header-logo-container .header-logo{max-height:64px}.header-right-container{margin-right:var(--standard-margin)}.menu-container{position:absolute;background-color:var(--background-colour-2);border:1px solid;border-color:var(--border-colour-1);border-radius:5px;width:250px;min-height:70px}.menu-container ul{padding:0 var(--standard-padding)}.menu-container li{display:flex;flex-direction:row;align-items:center;justify-content:space-between}.menu-separator{max-height:100px;max-width:500px;object-fit:contain;align-self:center;transform:translateY(-15px)}.socials-container{flex-basis:20%}.socials-div{display:flex;justify-content:end;padding:var(--standard-padding);fill:#fff;gap:10px}.svg-icon{height:32px;width:32px;fill:var(--text-colour-1);transition:.5s ease-in-out}.svg-icon:hover{fill:var(--hover-colour-1)}.footer-container{justify-content:space-between;border-top:1px solid}.footer-left{flex-basis:20%}.footer-middle{flex-basis:60%}.theme-switch-container{flex-basis:20%}.toggle-container{display:flex;background-color:#0000;border-radius:50px;border:1px solid;border-color:var(--border-colour-1);cursor:pointer;width:60px;padding:3px}.toggle-handle{display:flex;padding:3px;border-radius:50%;background-color:var(--button-colour-2);border:1px solid;border-color:var(--border-colour-1)}.navBar-div{display:flex;font-size:x-large;width:100%;padding:var(--standard-padding)}.navBar-div a{color:inherit;text-decoration:none;transition:.2s ease-in-out}.navBar-div .tabsContainer{display:flex;list-style-type:none;margin:0;padding:0}.navBar-div .tab{padding-left:var(--standard-padding);padding-right:var(--standard-padding)}.navBar-div .tab-underline{margin-top:5px;background-color:var(--active-colour-1);height:2px}.home-page-container{height:100%}.slideshow-container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%}.slideshow-container .slide-images-container{display:flex;flex-direction:column;align-items:center;padding:2% 0%;max-width:100%;overflow:hidden}.slideshow-container .slides-selector-container{display:flex;gap:2px;justify-content:center;align-items:center}.slideshow-container .caption-container{padding:var(--standard-padding);margin-left:15%;margin-right:15%;height:100px}.slideshow-container ul{display:flex;list-style:none;justify-content:center;align-items:center;height:100%;width:100%;padding:0}.slideshow-container ul img{object-fit:fill;border:1px solid;border-color:var(--border-colour-1);border-radius:10px;cursor:pointer}.slideshow-container li{list-style-type:none}.slideshow-container .previous-slide{transform:translate(50%)}.slideshow-container .next-slide{transform:translate(-50%)}.slideshow-container .main-slide{z-index:1}.slideshow-container .previous-img{-webkit-mask-image:linear-gradient(to left,black 0%,transparent 100%);mask-image:linear-gradient(to left,black 0%,transparent 100%);position:relative}.slideshow-container .next-img{-webkit-mask-image:linear-gradient(to right,black 0%,transparent 100%);mask-image:linear-gradient(to right,black 0%,transparent 100%);position:relative}.slideshow-container button{cursor:pointer;background-color:#0000;border:none}.slideshow-container .flip-icon{transform:rotate(180deg)}.slideshow-container .svg-icon{fill:var(--text-colour-2)}.slideshow-container .svg-icon :hover{fill:var(--hover-colour-1)}.slideshow-container .active{fill:var(--active-colour-1)}.slideshow-container .thumbnail-buttons{height:48px;width:48px}.character-page-content-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}.character-container{display:flex;justify-content:space-evenly;height:100%;width:100%}.character-menu-container{display:flex;flex-direction:column}.character-menu-icons{display:flex;align-self:center;gap:5px;max-width:50%;flex-wrap:wrap;padding:var(--standard-padding)}.character-menu-icons button{cursor:pointer;border:1px solid;border-color:var(--border-colour-1);border-radius:5px;background-color:#0000;color:inherit;padding:0}.character-menu-icons .active{border-color:var(--active-colour-1)}.character-menu-icons img{height:24px;width:40px;object-fit:cover}.character-image-container{display:flex;flex-direction:column;align-self:center;justify-content:center;position:relative;height:100%;width:50%;max-width:50%}.character-image-container .background-emblem{opacity:.5;z-index:1;margin:auto;max-height:90%;max-width:90%;-webkit-mask-image:radial-gradient(black 50%,transparent 100%);mask-image:radial-gradient(black 50%,transparent 100%)}.character-image-container .character-image{position:absolute;object-fit:contain;height:auto;max-height:850px;width:100%;max-width:100%;-webkit-mask-image:radial-gradient(black 50%,transparent 100%);mask-image:radial-gradient(black 50%,transparent 100%);z-index:5}.character-info-container{display:flex;flex-direction:column;width:50%;max-width:50%;text-align:left;padding:var(--standard-padding)}.character-info-container h1{font-size:1.5em}.character-info-container ::-webkit-scrollbar{width:10px}.character-info-container ::-webkit-scrollbar-track{background:var(--background-colour-1);border-radius:5px}.character-info-container ::-webkit-scrollbar-thumb{background:var(--track-colour);border-radius:5px}.character-info-container ::-webkit-scrollbar-thumb:hover{background:#adff2f}.character-info-separator{max-height:100px;max-width:500px;object-fit:contain;align-self:center}.character-name-div{padding:2% 2% 0%;font-size:2em}.scrollable-div{overflow:auto;overflow-wrap:break-word;padding:0 2% 2%;max-height:65vh;flex-grow:1}.about-container{height:100%;padding:var(--standard-padding)}.loading-container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:200px;border:1px solid;border-radius:5px;padding:var(--standard-padding)}.loading-container .dots-container{display:flex;gap:15px;padding:var(--standard-padding)}.loading-container .loading-dot{width:20px;height:20px;border-radius:50%;background-color:var(--active-colour-1)}.loading-container span{padding:var(--standard-padding)}