@font-face{font-family:'Brandon_Grotesque_Medium';src:url('/static/matchapp/fonts/Brandon_Grotesque_Bold.otf?14bd093c2371') format('opentype')}@font-face{font-family:'Brandon_Grotesque_Regular';src:url('/static/matchapp/fonts/HvDTrial_Brandon_Grotesque_regular-BF64a625c9311e1.otf?14bd093c2371') format('opentype')}@font-face{font-family:'Brandon_Grotesque_Regular_Italic';src:url('/static/matchapp/fonts/HvDTrial_Brandon_Grotesque_regular_italic-BF64a625c94445e.otf?14bd093c2371') format('opentype')}*{font-size:62.5%;width:auto;height:auto;box-sizing:border-box}body{margin:0;width:100%;background-color:#fafafa;color:#121d27}body.noscroll{overflow:hidden;height:100vh}.opaque{z-index:1;position:fixed;width:50%;left:25%;right:25%;top:40%;height:20%;display:flex;flex-direction:column;align-items:center;font-size:25px;font-family:'Brandon_Grotesque_Regular';text-align:center}.match_status{font-family:'Brandon_Grotesque_Medium';font-size:20px;letter-spacing:0.5px}.hint_container{display:flex;flex-direction:row;gap:10px}@media only screen and (max-width:500px){.opaque{width:80%;left:10%;right:10%}.match_status{width:80%}.hint_container{flex-direction:column;width:80%;gap:0}.hint_title{margin:25px auto -10px auto}}.hint_title{font-size:15px;letter-spacing:0.5px;font-family:'Brandon_Grotesque_Medium'}.hint{font-size:15px;letter-spacing:0.5px}.opaque_hr{width:30%;border:0.5px solid #121d27}.spinner{transform:translate(-50%,-50%);animation:spin 2.5s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}main{min-height:100vh;display:flex;flex-direction:column}.second_colour_band{background-color:#121d27;height:300px;width:100%;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center}.logo_container{display:flex;justify-content:center;align-items:center;width:100%;background-color:#121d27;height:fit-content;position:relative;margin-bottom:20px;margin-top:-25px}.account{background-color:#121d27;position:absolute;display:flex;flex-direction:row;left:0;top:0}.account_slideout{width:150px;max-width:200px;height:300px;background-color:#f1f1f1;position:absolute;z-index:2;display:flex;flex-direction:column;justify-content:left;align-items:left;transition:left 0.3s ease;left:-300%}#account_graphic{max-width:75px;position:relative;z-index:1;align-self:flex-start;top:50px;transition:left 0.3s ease;left:20px}#account_graphic:hover{cursor:pointer}.account_nav{width:100%;background-color:#f1f1f1;display:flex;flex-direction:column;position:relative;padding:0 20px 20px 20px;border-radius:20px;gap:5px}.account_nav>*{background-color:#f1f1f1}.no_account_nav{width:100%;background-color:#f1f1f1;display:flex;flex-direction:column;position:relative;padding:0 20px 20px 20px;border-radius:20px;gap:5px}.no_account_nav>*{background-color:#f1f1f1}.nav_title{font-family:'Brandon_Grotesque_Medium';font-size:clamp(15px,15em,20px);letter-spacing:1px}.nav_text{font-size:14px;font-family:'Brandon_Grotesque_Regular';margin:5px auto 5px 0}.nav_link{font-family:'Brandon_Grotesque_Regular';font-size:clamp(14px,15em,16px);color:#121d27;text-decoration:none}.chevron{transform:translateX(-10px);transition:transform 0.5s ease}.hide_container{display:flex;justify-content:center;text-align:center;height:100%;background-color:#f1f1f1;z-index:-1}.hide{font-family:'Brandon_Grotesque_Regular';font-size:clamp(14px,15em,16px);color:#121d27;background-color:#f1f1f1;z-index:3;justify-self:flex-end;align-self:flex-end}.hide:hover{cursor:pointer;text-decoration:underline}@media only screen and (max-width:480px){.account{flex-direction:colum}#account_graphic{max-width:60px;height:auto}}.logo_caption{font-family:'Brandon_Grotesque_Medium';color:#fafafa;background-color:#121d27;font-size:18px;letter-spacing:1px;padding-top:10px;margin-inline:auto;text-align:center}.wrapper{display:flex;flex-direction:column;align-items:stretch;margin:40px auto 0 auto;width:55%;max-width:900px;word-wrap:break-word;background-color:#fafafa;align-items:flex-start}#top_wrapper{position:relative;display:flex;flex-direction:column;width:100%;align-items:center;justify-content:flex-start}.main_section_header{display:flex;position:relative;max-height:60px;justify-content:space-between;font-size:30px;letter-spacing:2px;align-items:center;font-family:'Brandon_Grotesque_Medium';width:100%}.main_section_header_text{width:800px}.main_hr{height:1px;background-color:#121d27;width:100%;position:relative}.third_color_band{width:100%;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;flex-grow:1}#input_wrapper{position:relative;display:flex;flex-direction:column;width:100%;align-items:center;justify-content:flex-start}.img_input_outer{width:95%;max-width:600px;height:225px;background-color:#f1f1f1;position:relative;display:flex;justify-content:center;align-items:center;border-radius:25px;flex-direction:column}.img_input_inner{width:95%;height:80%;background-color:#fafafa;border:3px solid #121d27;position:relative;display:flex;justify-content:center;border-radius:25px;flex-direction:column;justify-content:center;align-items:center;gap:10px;font-size:20px;font-family:'Brandon_Grotesque_Regular';letter-spacing:1px;position:relative}.img_input_inner:hover{cursor:pointer}.colour_picker_pointer{width:14px;height:14px;background-color:#121d27;border:2px solid #f1f1f1;border-radius:50%;position:absolute;pointer-events:none;display:none;z-index:10}.file_upload_text{font-size:18px;text-align:center}.file_upload_paste_text{font-size:14px;margin-top:-15px;text-align:center}#file_upload{display:none}.plus_img{width:10%;max-width:50px;min-width:35px;height:auto;margin-bottom:-20px}.user_image{position:relative;width:95%;max-width:760px;max-height:760px;height:auto;border:3px solid #121d27;border-radius:25px}canvas{touch-action:none}.file_error{display:flex;text-align:center;justify-content:center;margin-inline:auto;font-size:24px;font-family:'Brandon_Grotesque_Regular';color:red;letter-spacing:0.5px}#colour_sample_container{display:none}.colour_sample_container{background-color:#f1f1f1;color:#121d27;height:100px;width:90%;max-width:400px;display:flex;flex-direction:column;border-radius:15px;margin-top:20px;justify-content:center;align-items:center;text-align:center}.colour_sample{height:50px;width:200px;background-color:#fafafa;border-radius:13px;margin-top:10px;border:3px solid #121d27}.sample_text_container{display:flex;flex-direction:row;font-size:23px;font-family:'Brandon_Grotesque_Regular';letter-spacing:1px}.selected_colour{margin-right:5px}.colour_code{margin-left:5px}#colour_form{width:100%}.code_input{height:150px;width:80%;max-width:500px;background-color:#f1f1f1;border-radius:25px;position:relative;display:flex;justify-content:center;align-items:center;font-size:20px;font-family:'Brandon_Grotesque_Regular';margin:30px auto 30px auto;flex-direction:column;color:#121d27;text-align:center}.hex_input{height:50px;width:90%;max-width:400px;font-family:'Brandon_Grotesque_Regular';text-align:center;border:3px solid #121d27;border-radius:25px;letter-spacing:1px;font-size:15px}.hex_input::placeholder{font-size:16px;!important}.hex_input:focus{outline:none}.code_input_text{font-size:14px;letter-spacing:0.5px;text-align:center;position:relative}#input_buttons{transition:transform 0.5s ease}.submit{height:50px;width:20%;max-width:150px;min-width:100px;background-color:#121d27;color:#fafafa;display:flex;justify-content:center;align-items:center;text-align:center;border-radius:15px;font-family:'Brandon_Grotesque_Regular';font-size:15px;letter-spacing:1px;margin:0 auto;border:none;cursor:pointer}.terms>*{font-size:14px;font-family:'Brandon_Grotesque_Regular'}.terms{margin:auto}.terms_link{font-size:14px}.terms_link:link{color:#121d27}.terms_link:visited{color:#121d27}#tips_wrapper{position:relative;display:flex;flex-direction:column;width:100%;align-items:center;justify-content:flex-start;padding:20px}#tips_hr{width:100%}.main_section_header{width:100%;position:relative;display:flex;flex-direction:row;color:#121d27;font-size:28px;letter-spacing:1px;margin-top:20px}.main_header_button{height:50px;width:125px;background-color:#121d27;color:#fafafa;border-radius:20px;text-align:center;justify-content:center;line-height:50px;font-size:23px;letter-spacing:1px;margin-top:-10px}.main_header_button_text{text-decoration:none}#examples_button_text{font-family:'Brandon_Grotesque_Regular'}.main_section_header>a:link{text-decoration:none}.second_colour_band_2{min-height:300px;display:block;position:relative;min-width:100%;background-color:#fafafa}.tips_gallery{position:relative;display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;width:50%;max-width:850px;margin:40px auto 40px auto;gap:100px;height:auto;padding-bottom:20px}.gallery_button{background-color:#121d27;color:#f1f1f1;font-size:18px;vertical-align:text-top;text-align:center;align-items:center;border-radius:200px;justify-content:center;position:sticky;display:none}.gallery_button:hover{cursor:pointer}#left_button{z-index:1}#right_button{z-index:1}.tips_image{width:70%;align-self:flex-start}@media only screen and (max-width:1000px){.gallery_button{display:flex}.tips_image{max-width:70%;scroll-snap-align:center}.tips_gallery{width:80%;gap:80px;justify-content:left;overflow-x:scroll;flex-wrap:nowrap;position:relative;scroll-snap-type:x mandatory;scroll-behavior:smooth;align-items:top}.gallery_button{align-items:center;vertical-align:text-top}#left_button{position:sticky;left:30px;padding:5px}#right_button{position:sticky;right:30px;padding:5px}.image_caption_text{text-wrap:pretty}}@media only screen and (max-width:480px){.gallery_button{display:flex}.tips_image{max-width:60%;scroll-snap-align:center}.tips_gallery{width:100%;gap:80px;justify-content:left;overflow-x:scroll;flex-wrap:nowrap;position:relative;scroll-snap-type:x mandatory;scroll-behavior:smooth}.gallery_button{align-items:center}#left_button{position:sticky;left:30px;padding:5px}#right_button{position:sticky;right:30px;padding:5px}.image_caption_text{text-wrap:pretty}}.image_hr{max-width:200px;height:1px;background-color:#121d27}img{max-width:200px;height:auto}.image_title{font-size:17px;letter-spacing:1px;font-family:'Brandon_Grotesque_Medium'}.image_caption_text{text-align:left;max-width:200px;font-size:14px;font-family:'Brandon_Grotesque_Regular';height:fit-content}.examples_hr{width:80%;height:1px;background-color:#121d27}.examples{display:flex;position:relative;color:#121d27;flex-direction:column;margin:auto;text-align:center;align-items:center;font-family:'Brandon_Grotesque_Medium';font-size:28px;letter-spacing:1px;margin-bottom:50px}.examples>p{margin-inline:20px}.input_link{text-decoration:none}.examples_link{display:flex;height:50px;width:125px;background-color:#121d27;color:#fafafa;border-radius:15px;font-size:14px;font-family:'Brandon_Grotesque_Regular';text-align:center;align-items:center;justify-content:center}.cookies_bar>*{background-color:#000000}.cookies_bar{position:fixed;bottom:0;display:flex;flex-direction:row;background-color:#000000;color:#f1f1f1;height:60px;width:100%;justify-content:space-between;padding-inline:10%;align-items:center;z-index:1;font-family:'Brandon_Grotesque_Medium';font-size:30px;letter-spacing:1px;transform:translateY(0);transition:transform 10s ease}.cookies_bar p a{background-color:#000000;color:#f1f1f1;font-size:clamp(1rem,1.5vw,1.9rem);text-wrap:break-word;width:70%}.cookies_bar>p{width:70%;font-size:clamp(1rem,1.5vw,1.9rem)}.font_correct{font-family:,'Brandon_Grotesque_Regular';color:#fafafa;background-color:#000000}.cookies_bar p a:hover{color:grey}.cookies_button{display:flex;background-color:#f1f1f1;color:#000000;width:fit-content;height:fit-content;padding:12px;border-radius:25px;align-items:center;text-align:center;justify-content:center;transition:transform 0.3s ease;font-family:'Brandon_Grotesque_Regular';font-size:clamp(1rem,1.5vw,1.9rem)}.cookies_button:hover{cursor:pointer}.cookies_button:link{text-decoration:none}.footer_hr{background-color:#fafafa;width:20%}footer>*{background-color:#121d27}.footer{width:100%;background-color:#121d27;color:#fafafa;text-align:center;font-family:'Brandon_Grotesque_regular';padding-top:20px}.footer_logo{outline:none}.footer_logo>img{width:150px;aspect-ratio:16/9;background-color:#121d27;margin-bottom:-20px}.footer_links{display:flex;box-sizing:border-box;flex-direction:row;flex-wrap:wrap;letter-spacing:1px;justify-content:center;max-width:800px;background-color:#121d27;margin:0 auto;padding-bottom:15px}.footer_links>a{background-color:#121d27}.footer_link{margin:0 30px 0 30px;background-color:#121d27;color:#fafafa;font-size:14px}.footer_links a:link{color:#fafafa;text-decoration:none}.footer_link:hover{color:grey}.footer_signoff{font-size:9px;letter-spacing:1px;padding:5px 0px 5px 0px;background-color:#121d27}