*,::after,::before,body,html{padding:0;margin:0}
h2{margin-top:10px}
.font-style button,.font-style span{font-variant-caps:all-small-caps;letter-spacing:1px}
#font-style-text,body{font-weight:400;font-family:sans-serif}
body,h2{font-family:sans-serif}
*,::after,::before{-webkit-box-sizing:border-box;box-sizing:border-box;outline:0;scroll-behavior:smooth}
body,html{height:100%;line-height:1.5}
body{background:#fff}
h2{font-weight:300}
.font-style:hover p{color:#1d2671}
.font-style-text{box-shadow:1px 2px 4px 0 rgba(0,0,0,.21)}
h2{text-align:left}
.font-style-text .clear:hover,h2{color:#000}
.fixedtop,.font-stylelist,.font-stylemain,h2,main{width:100%}
main{margin-top:25px}
.container{max-width:1100px;margin:0 auto}
h2{margin-bottom:5px}
.font-style-text{padding:5px;margin-bottom:10px;display:table;width:100%;position:relative;background:#f4f5f7;z-index:99!important;border-radius:5px}
.fixedtop{position:sticky}
.font-style-text .clear{position:absolute;right:10px;color:#de0707;font-size:20px;padding:5px 15px;line-height:1.5;background:0 0;border:none;z-index:999;cursor:pointer;top:10px;outline:0}
.font-style-text:hover{box-shadow:0 12px 16px 0 rgba(0,0,0,.24),0 17px 50px 0 rgba(0,0,0,.19)}
.fixedtop{top:0;z-index:999}
.font-stylelist{display:block;text-align:left;overflow:hidden;position:relative}
.font-stylelist h2{margin-left:6px;margin-top:25px!important;margin-bottom:5px}
.font-style{width:49%;overflow:hidden;cursor:pointer;position:relative;text-align:center;margin:.5%;border-radius:0 10px;background-color:#f4f5f7;box-shadow:0 4px 6px -1px rgb(0 0 0/10%),0 2px 4px -1px rgb(0 0 0/6%);float:left}
.font-style span{position:absolute;right:10px;bottom:3px;color:#000;font-weight:600;z-index:9;font-size:12px}
.font-style:hover{background:#f9ebf0}
.font-style:hover span{display:block}
.font-style p{background:linear-gradient(359deg,#f2fbfa 0,#01dfba 50% 50%);margin:0;font-size:20px;padding:16px 12px;color:#000;width:100%;text-decoration:none;cursor:pointer;position:relative;float:right;border-radius:5px;box-shadow:0 1px 3px -1px rgba(0,0,0,.5);border:1px solid #dadada;transition:.2s ease-in-out;font-family:-apple-system,BlinkMacSystemFont,sans-serif}
.font-style:hover{background-color:#0602ee;transform:scale(1.03);box-shadow:0 10px 23px 0 rgba(218,201,201,0.3);z-index:9}
#load-more{font-size:18px;padding:10px 50px;border:1px solid #1d2671;color:#fff;margin:30px 0 5px;cursor:pointer;background:#0a1ed4;outline:0;border-radius:10px}
#load-more:hover{background-color:#7bc45f;transform:scale(1.03);box-shadow:0 10px 23px 0 rgba(218,201,201,0.3);z-index:9}
.font-style button{position:absolute;top:15px;right:10px;background:#fff;border:1px solid #1d2671;color:#2034e9;font-size:12px;padding:2px 10px;border-radius:50px;-webkit-transition:margin-right .3s cubic-bezier(.23,1,.32,1);-o-transition:margin-right .3s cubic-bezier(.23,1,.32,1);transition:margin-right .3s cubic-bezier(.23,1,.32,1)}
#font-style-text{text-align:center}
#font-style-text{width:100%;padding:.6em 0;outline:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:3px solid #1c31ec;letter-spacing:.02em;line-height:1.4;margin-bottom:0;display:block;font-size:22px;letter-spacing:1px;border-radius:5px;background:#fff}
#font-style-text::placeholder{color:#999;font-size:18px}
@media only screen and (max-width:970px){.font-style-text .clear{padding:4px 15px}.container{max-width:100%}.font-stylelist p{font-size:18px}}
@media only screen and (max-width:600px){.font-style span{display:block;bottom:2px;right:10px;font-size:10px}main .font-stylemain{padding:2px}.font-stylelist{padding:7px}.font-style{width:100%;margin:1.2% 0}.font-style p{font-size:17px;padding:12px 0 20px}.container{width:100%}#font-style-text{font-size:18px;line-height:1.2}.fontstylelist h2{font-size:18px;margin-left:0;margin-bottom:10px;margin-top:15px;color:#000;font-weight:700}main{margin-top:18px}}
#scroll{display:none;position:fixed;bottom:20%;right:10px;background:#fff;z-index:99;color:#777;font-size:20px;border:none;outline:none;cursor:pointer;padding:12px 14px;box-shadow:1px 2px 4px 0 rgba(0,0,0,.21);border-radius:5px}
#scroll:hover{box-shadow:#7bc45f;background:#0609f0}
nav{display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;padding:2px;align-items:center;background:#00000012}
nav a,#menusec a,.floatmenu a{scroll-snap-align:start;display:inline-block;white-space:nowrap;padding:8px 12px;border-radius:999px;text-decoration:none;background:#fff;color:#000;transition:transform .12s ease,background .12s ease,box-shadow .12s ease;box-shadow:0 2px 6px rgba(2,6,23,0.06);font-size:1rem}
nav a:hover,.active-link,#menusec a:hover,.floatmenu a:hover{transform:translateY(-2px);background:rgb(13,34,228);box-shadow:0 8px 20px rgba(2,6,23,0.12);color:#fff}
.share-section{position:relative;display:flex;justify-content:flex-end;align-items:center}
.share-section span{color:#0b0edd;margin-right:5px;text-transform:uppercase;font-size:13px}
.share-options{display:flex;gap:4px;flex-wrap:wrap}
.share-options button{border-radius:30%;margin:2px;height:35px;width:35px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.share-options button:hover{background:#09c1ce}
.copy-modal{display:none}
.modal-onclick{display:block}
.modal-none{display:none}