html{font-size:1vh}body{--background-color: white;--main-color: black;--secondary-color: lightgrey;--day-color: white;--night-color: grey;--now-color: red;display:flex;flex-direction:column;background-color:var(--background-color);color:var(--secondary-color);width:100vw;height:100vh;font-size:3rem;margin:0;-webkit-user-select:none;user-select:none}.RomanSunclock{display:flex;align-items:center;justify-content:center;height:100%;overflow:hidden;perspective:100rem;transform-style:preserve-3d}.RomanSunclock__Container{text-align:center;backface-visibility:hidden;border:.2rem solid var(--secondary-color);padding:4rem;height:50rem;width:min(80vw,34rem);position:absolute;transition:transform 1s;display:inline-flex;align-items:center;justify-content:center}.RomanSunclock__Container--front{transform:rotateY(0)}.RomanSunclock__Container--back{transform:rotateY(180deg)}.RomanSunclock__Container--back .RomanSunclock__Description,.RomanSunclock__Container--back .RomanSunclock__Version{color:transparent;transition:color 1s}.RomanSunclock--flipped .RomanSunclock__Container--front{transform:rotateY(-180deg)}.RomanSunclock--flipped .RomanSunclock__Container--back{transform:rotateY(0)}.RomanSunclock--flipped .RomanSunclock__Container--back .RomanSunclock__Description{color:var(--main-color)}.RomanSunclock--flipped .RomanSunclock__Container--back .RomanSunclock__Version{color:var(--secondary-color)}.RomanSunclock__Container__Content{display:inline-flex;flex-direction:column;align-items:center}.RomanSunclock--loading .RomanSunclock__LoadingDetails{display:block}.RomanSunclock--loading .RomanSunclock__Details,.RomanSunclock__LoadingDetails{display:none}.RomanSunclock__Details{display:flex;align-items:center;flex-direction:column;justify-content:center}.RomanSunclock__Description{font-size:2.7rem;margin:0 0 3rem}.RomanSunclock__ClockImage{height:30rem;width:30rem;margin:3rem 0 2rem;font-size:25px;display:flex;justify-content:center}.RomanSunclock__ClockImage svg{height:30rem;width:30rem}.RomanSunclock__Version{font-size:2rem;text-align:center}.RomanSunclock__Version a{text-decoration:none;color:inherit}.RomanSunclock__Logo{height:1.5rem;position:absolute;bottom:-9.75rem;width:calc(100% - 8rem)}.RomanSunclock__Logo svg{position:relative;height:3rem;width:3rem;bottom:9.5rem;background:var(--background-color);fill:var(--secondary-color);padding:0 1rem}@media (prefers-color-scheme: dark){body{--background-color: black;--main-color: white;--secondary-color: grey;--night-color: grey}}