2 lines
4.3 KiB
CSS
2 lines
4.3 KiB
CSS
@import"https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap";.container[data-v-cdc56bea]{--default-color: #E6E6E6;--color1: #6AB971;--color3: #44A5D3;--color4: #F3AA21CF;--color2: #F58220;height:100%;display:flex;flex-direction:column;padding-inline:2rem}h1[data-v-cdc56bea]{text-align:center;padding-block:2rem;font-size:4.125rem;text-wrap:balance}h2[data-v-cdc56bea]{text-align:center;padding-block:1rem}main[data-v-cdc56bea]{margin-inline:5%;flex-grow:1;display:grid;grid-template-columns:2fr 3fr;align-items:end;height:100%}#circle[data-v-cdc56bea]{width:min(100%,80vh);height:auto;aspect-ratio:1/1;position:relative}#content[data-v-cdc56bea]{position:absolute;inset:15%;display:grid;grid-template-columns:repeat(2,1fr);gap:10px}#content[data-v-cdc56bea] div[data-v-cdc56bea]:nth-child(1){background:var(--default-color);border-radius:100% 0 0}#content[data-v-cdc56bea] div[data-v-cdc56bea]:nth-child(2){background:var(--default-color);border-radius:0 100% 0 0}#content[data-v-cdc56bea] div[data-v-cdc56bea]:nth-child(3){background:var(--default-color);border-radius:0 0 0 100%}#content[data-v-cdc56bea] div[data-v-cdc56bea]:nth-child(4){background:var(--default-color);border-radius:0 0 100%}#con[data-v-cdc56bea]{position:absolute;inset:20%;background-color:#fff;border-radius:100%;z-index:100}#text[data-v-cdc56bea]{width:100%;height:100%;z-index:110;line-height:1.5}#text[data-v-cdc56bea] div[data-v-cdc56bea]{height:70%;margin:15%;overflow:scroll}#text[data-v-cdc56bea] p[data-v-cdc56bea]{text-align:center}#text[data-v-cdc56bea] h2[data-v-cdc56bea]{font-size:1.625rem}#text div[data-v-cdc56bea]::-webkit-scrollbar{width:4px}#text div[data-v-cdc56bea]::-webkit-scrollbar-thumb{background:#ccc;border-radius:10px}.dot[data-v-cdc56bea]{position:absolute;display:flex;align-items:center;height:10%;z-index:150}.dot[data-v-cdc56bea] div[data-v-cdc56bea]{height:100%;border-radius:50%;aspect-ratio:1/1;background:var(--default-color);cursor:pointer}.dot[data-v-cdc56bea] span[data-v-cdc56bea]{font-size:1.625rem;font-weight:700}#dot1[data-v-cdc56bea],#dot4[data-v-cdc56bea]{left:25%;flex-direction:row-reverse;transform:translate(-100%)}:is(#dot1[data-v-cdc56bea],#dot4[data-v-cdc56bea]) div[data-v-cdc56bea]{margin-left:10px}#dot2[data-v-cdc56bea],#dot3[data-v-cdc56bea]{right:25%;flex-direction:row;transform:translate(100%)}:is(#dot2[data-v-cdc56bea],#dot3[data-v-cdc56bea]) div[data-v-cdc56bea]{margin-right:10px}#dot1[data-v-cdc56bea],#dot2[data-v-cdc56bea]{top:15%}#dot3[data-v-cdc56bea],#dot4[data-v-cdc56bea]{bottom:15%}.text[data-v-cdc56bea]{display:none}.bg-image-container[data-v-cdc56bea]{position:relative}.bg-image[data-v-cdc56bea]{position:fixed;bottom:0;left:5%;width:36%;height:auto;max-height:90vh;object-fit:contain}.dots[data-v-cdc56bea]{position:fixed;top:0;left:0;z-index:-1;transform:translate(-50%) translateY(-30%)}.logo[data-v-cdc56bea]{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.logo[data-v-cdc56bea] img[data-v-cdc56bea]{width:100%;object-fit:contain}#text~.logo[data-v-cdc56bea]{display:none}a[data-v-cdc56bea]{display:block;margin-bottom:2rem;font-weight:700;text-decoration:underline;color:#000;font-size:1.375rem}@media screen and (max-width:1440px){h1[data-v-cdc56bea]{font-size:3rem}.dot span[data-v-cdc56bea]{font-size:1.375rem}}@media screen and (max-width:999px){.offerUrl[data-v-cdc56bea]{display:none}.container[data-v-cdc56bea]{margin-inline:60px}h1[data-v-cdc56bea]{font-size:2.75rem}#text[data-v-cdc56bea],.bg-image-container[data-v-cdc56bea],.dots[data-v-cdc56bea]{display:none}main[data-v-cdc56bea]{grid-template-columns:1fr;flex-grow:0;height:auto;display:flex;flex-direction:column;align-items:center}#text~.logo[data-v-cdc56bea]{display:flex}.text[data-v-cdc56bea]{padding-bottom:2rem;display:block}.text[data-v-cdc56bea] h2[data-v-cdc56bea]{font-size:1.25rem}.text[data-v-cdc56bea] p[data-v-cdc56bea]{font-size:.875rem}a[data-v-cdc56bea]{font-size:1.25rem;text-align:center}}@media screen and (max-width:767px){h1[data-v-cdc56bea]{font-size:2rem}a[data-v-cdc56bea]{font-size:1.125rem}.container .dot span[data-v-cdc56bea]{font-size:1rem}}@media screen and (max-width:479px){a[data-v-cdc56bea]{font-size:1rem}.container .dot span[data-v-cdc56bea]{font-size:.875rem}}html{background-color:#f7f7f9}*{margin:0;padding:0}html,body{margin:0;padding:0;font-family:Roboto,sans-serif;min-height:100vh;height:100%}
|