.blue{color:#034bb8}.gold{color:#cca000}.s-title{margin-bottom:72px}#personality{position:relative;width:100dvw;overflow-x:hidden;background-color:#fff}#personality .path-animation{position:absolute}#personality .img-box{min-height:300px;min-width:300px}#personality #hero{background:linear-gradient(90deg,#E6E5FB,#D7EAF7);overflow:hidden;height:auto;min-height:max(700px,95dvh);padding:0;margin:auto;display:flex;position:relative}#personality #hero .ghost-div{z-index:1;position:absolute;width:45%;min-height:inherit}#personality #hero .video{z-index:2;position:absolute;right:0;width:55%;min-height:inherit}#personality #hero .video .landing-video{position:absolute;z-index:1;top:50%;left:50%;width:100%;height:100%;object-fit:cover;transform:translate(-50%,-50%)}#personality #hero .video:before{content:"";position:absolute;top:0;left:-1px;width:100%;height:100%;z-index:2;background:linear-gradient(90deg,black,transparent 30%)}#personality #hero .inner-section-wrapper{z-index:3;display:flex;align-items:center;max-width:none;width:1200px}#personality #hero .inner-section-wrapper .text-container{width:100%;flex-grow:1;color:#000}#personality #hero .inner-section-wrapper .text-container h1{font-size:48px;margin-top:2rem;margin-bottom:24px;line-height:normal}#personality #hero .inner-section-wrapper .text-container h1 span{color:#cca000}#personality #hero .inner-section-wrapper .text-container h1 span span{font-size:24px;vertical-align:text-top}#personality #hero .inner-section-wrapper .text-container p{font-size:18px}#personality #hero .inner-section-wrapper .text-container .cta-container{display:flex;justify-content:flex-start;flex-direction:column;row-gap:48px;margin-top:64px}#personality #hero .inner-section-wrapper .ghost-container{width:0}#personality #hero .hero-wrapper{max-width:1200px;display:flex}#personality #hero .hero-wrapper .text{flex-grow:1;width:50%;text-align:left;color:#fff}#personality #hero .hero-wrapper .text h1{position:relative;color:#fff;font-size:48px;margin-top:2rem;margin-bottom:24px;text-shadow:#000 0 1px 3px;line-height:60px}#personality #hero .hero-wrapper .text p{color:#fff;text-shadow:#000 0 1px 3px;font-size:18px}#personality #hero .hero-wrapper .text .cta-container{display:flex;justify-content:flex-start;flex-direction:column;row-gap:48px;margin-top:64px}#personality #hero .hero-wrapper .video-container{width:50%}#personality #ocean-explanation{position:relative}#personality #ocean-explanation #landing-path-1{height:100px;top:-50px}#personality #ocean-explanation .inner-section-wrapper .flex-grid{flex-direction:column;gap:141px}#personality #ocean-explanation .inner-section-wrapper .flex-grid .img-box picture{opacity:0;transition:opacity 1s ease-in-out}#personality #ocean-explanation .inner-section-wrapper .flex-grid .img-box picture.visible{opacity:1;pointer-events:auto}#personality #ocean-explanation .inner-section-wrapper .flex-grid .img-box picture img{position:absolute;width:auto;height:90%;left:50%;top:50%;transform:translateX(-50%) translateY(-50%);box-shadow:-1px -1px 10px rgba(0,0,0,.05);border-radius:24px}#personality #assessment-introduction .inner-section-wrapper .flex-grid{flex-direction:column;gap:141px}#personality #assessment-introduction .inner-section-wrapper .flex-grid .text{order:1}#personality #assessment-introduction .inner-section-wrapper .flex-grid .img-box{position:relative;order:2}#personality #assessment-introduction .inner-section-wrapper .flex-grid .img-box img{position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%);width:90%;padding:16px}#personality #assessment-introduction .inner-section-wrapper .flex-grid button{margin-top:24px}#personality #more-info{position:relative}#personality #more-info #landing-path-2{top:-10px;width:60%;right:0}#personality #more-info .inner-section-wrapper .main-content{margin-bottom:48px}#personality #more-info .inner-section-wrapper #tooltip{position:relative;display:inline-block;font-size:inherit}#personality #more-info .inner-section-wrapper #tooltip:hover .tooltip-text{opacity:1;visibility:visible}#personality #more-info .inner-section-wrapper #tooltip .tooltip-text{visibility:hidden;font-size:14px;min-width:400px;background-color:#606060;color:rgba(250,250,250,.87);box-shadow:0 2px 4px rgba(0,0,0,.3);text-align:center;padding:15px;border-radius:5px;position:absolute;z-index:1;bottom:110%;left:50%;transform:translateX(-50%);opacity:0;transition:opacity .5s}#personality #more-info .inner-section-wrapper #tooltip .tooltip-text:after{content:" ";position:absolute;top:100%;left:50%;margin-left:-5px;border:5px solid rgba(0,0,0,0);border-top-color:#606060}#personality #more-info .inner-section-wrapper .details{margin-top:48px}#personality #more-info .inner-section-wrapper .details .detail{margin-bottom:18px}#personality #more-info .inner-section-wrapper .details .detail:last-of-type{margin-bottom:0}#personality #more-info .inner-section-wrapper .details .detail .collapsible{position:relative;display:flex;justify-content:space-between;background-color:#f4f8ff;color:#000;cursor:pointer;padding:18px;width:100%;border:none;border-radius:12px;text-align:left;transition:all .65s}#personality #more-info .inner-section-wrapper .details .detail .collapsible.active,#personality #more-info .inner-section-wrapper .details .detail .collapsible:hover{background-color:#eaf1fd}#personality #more-info .inner-section-wrapper .details .detail .collapsible.active:after{content:"−"}#personality #more-info .inner-section-wrapper .details .detail .collapsible.active{border-radius:12px 12px 0 0;transition:border-radius .1s}#personality #more-info .inner-section-wrapper .details .detail .collapsible:after{content:"+";width:25px;color:#034bb8;font-weight:700;align-self:center;text-align:right}#personality #more-info .inner-section-wrapper .details .detail .answer{padding:0 18px;max-height:0;font-size:.9rem;overflow:hidden;transition:max-height .2s ease-out;background-color:#eaf1fd;border-radius:0 0 16px 16px}#personality #more-info .inner-section-wrapper .details .detail .answer p{margin:18px 0}#personality #stats{padding-top:40px}#personality #stats .inner-section-wrapper .flex-grid{flex-wrap:wrap;row-gap:48px}#personality #stats .inner-section-wrapper .flex-grid .stat{width:50%;text-align:center}#personality #stats .inner-section-wrapper .flex-grid .stat .number{font-size:56px;font-weight:700}#personality #stats .inner-section-wrapper .flex-grid .stat#taken-today .number{color:#14253e}#personality #stats .inner-section-wrapper .flex-grid .stat#animal-combinations .number{color:#b71e1e}#personality #stats .inner-section-wrapper .flex-grid .stat#total-taken .number{color:#034bb8}#personality #stats .inner-section-wrapper .flex-grid .stat#feedback-accuracy .number{color:#cca000}#personality #social .inner-section-wrapper{margin:0;padding:0;max-width:100dvw}#personality #social .inner-section-wrapper .text-container{margin:0 auto;padding:0 20px;text-align:center}#personality #social .inner-section-wrapper .carousel{overflow:hidden;width:100vw;margin:64px 0}#personality #social .inner-section-wrapper .carousel .flex-grid{padding:0 1px;display:flex;align-items:center;animation:scrollHorizontal 26s linear infinite;width:7200}@keyframes scrollHorizontal{0%{transform:translateX(0)}to{transform:translateX(-3600px)}}#personality #social .inner-section-wrapper .carousel .flex-grid .post{flex-shrink:0;padding:16px;width:360px}#personality #social .inner-section-wrapper .carousel .flex-grid .post .content-container{background-color:#fff;border-radius:5px;box-shadow:1px 0 5px rgba(0,0,0,.3);padding:16px;height:280px;overflow-y:hidden}#personality #social .inner-section-wrapper .carousel .flex-grid .post .content-container .profile-pic .picture{margin:auto;height:64px;width:64px;background-color:#f0f5fd;border-radius:100%;object-fit:cover;box-shadow:0 4px 4px rgba(0,0,0,.25)}#personality #social .inner-section-wrapper .carousel .flex-grid .post .content-container .handle{text-align:center;margin-bottom:16px;font-weight:700}#personality #social .inner-section-wrapper .carousel .flex-grid .post .content-container .comments{font-size:.8rem;overflow-y:hidden;text-overflow:ellipsis;height:107px}#personality #social .inner-section-wrapper .use-hashtag{display:flex;align-items:center}#personality #social .inner-section-wrapper .use-hashtag .text{text-align:center}#personality #social .inner-section-wrapper .use-hashtag .line{flex-grow:1;height:2px;background-color:#034bb8}#personality #social .inner-section-wrapper .use-hashtag .line.left{margin-right:8px}#personality #social .inner-section-wrapper .use-hashtag .line.right{margin-left:8px}@media screen and (min-width:768px){#personality .text-box{align-content:center}#personality h2{font-size:36px;margin-top:48px}#personality h2.large{text-align:center}#personality .l-text,#personality h2.large{width:50%;font-size:56px;margin:64px auto 0}#personality .l-text{font-weight:600}#personality .img-box{min-height:500px;min-width:500px}#personality #hero{background:none;background-color:#000;background-size:100%;height:100%;width:100%}#personality #hero .inner-section-wrapper .text-container{width:60%;color:#fff}#personality #hero .inner-section-wrapper .text-container h1{font-size:56px}#personality #hero .inner-section-wrapper .text-container .cta-container{column-gap:48px;flex-direction:row}#personality #hero .inner-section-wrapper .text-container .cta-container a{text-decoration:none}#personality #hero .inner-section-wrapper .text-container .cta-container .ax3-btn{width:auto}#personality #hero .inner-section-wrapper .ghost-container{width:40%}#personality #ocean-explanation #landing-path-1{height:auto}#personality #assessment-introduction .inner-section-wrapper .flex-grid,#personality #ocean-explanation .inner-section-wrapper .flex-grid{flex-direction:row}#personality #assessment-introduction .inner-section-wrapper .flex-grid .text-box{order:2;width:50%}#personality #assessment-introduction .inner-section-wrapper .flex-grid .text-box button{margin-top:48px}#personality #assessment-introduction .inner-section-wrapper .flex-grid .img-box{order:1;width:50%}#personality #assessment-introduction .inner-section-wrapper .flex-grid .img-box img{width:100%}#personality #more-info #landing-path-2{width:30%}#personality #more-info .inner-section-wrapper .s-title,#personality #more-info .inner-section-wrapper h4{text-align:center}#personality #stats .inner-section-wrapper .flex-grid{flex-direction:row;justify-content:space-evenly}#personality #stats .inner-section-wrapper .flex-grid .stat{width:auto}}