{"html":"

\n \n\n

\n Marco\n

CEO

\n \n Italy\n

","css":".card * {\n box-sizing: border-box;\n}\n\n.card {\n --bc: #c97d60;\n --bc1: #904c31;\n --bc-al: #c97d6050;\n --clr: #f2e5d7;\n background-color: var(--bc);\n color: var(--clr);\n padding: 2rem 2.5rem;\n border-radius: 0.75rem;\n box-shadow: 0 10px 40px -1px var(--bc-al);\n outline: 2px solid var(--bc);\n outline-offset: 4px;\n max-width: 300px;\n max-height: 300px;\n transition: 0.3s ease-in-out;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 2rem;\n line-height: 1.3;\n}\n\n.card:hover {\n --bc: #904c31;\n}\n\n.img {\n max-width: 100%;\n width: 5rem;\n aspect-ratio: 1/1;\n border-radius: 50%;\n outline: 2px solid var(--clr);\n outline-offset: 4px;\n fill: var(--clr);\n}\n\n.text {\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n\n.heading {\n font-size: 1.5rem;\n font-weight: 700;\n}\n\n.info {\n font-size: 0.9rem;\n font-weight: 500;\n opacity: 0.7;\n}\n\n.country {\n display: flex;\n align-items: center;\n font-size: 1rem;\n gap: .2rem;\n}\n\n.svg-country {\n width: 1rem;\n height: 1rem;\n}\n\n.soc {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 2rem;\n list-style: none;\n margin-top: 0.5rem;\n padding-bottom: 0;\n margin-inline: auto;\n}\n\n.li-soc {\n display: flex;\n align-items: center;\n justify-content: center;\n text-decoration: none;\n color: var(--clr);\n width: 0.5rem;\n height: 0.5rem;\n padding: 0.5rem;\n}\n\n.li-soc:hover {\n opacity: 0.7;\n}"}

fluffy-zebra-10

👁 实时预览

📝 源代码