synapse-templates/style.css

74 lines
1.4 KiB
CSS

html {
height: 100%;
}
body {
align-items: center;
background: rgb(255, 255, 230);
color: rgb(50, 50, 50);
display: flex;
flex-direction: column;
font-family: 'Lucida Console', 'Courier New', monospace;
hyphens: auto;
line-height: 1.8;
margin: 0;
margin: auto;
}
.mx_Header {
background-blend-mode: initial;
background-color: rgb(250, 220, 120);
background-image: url(https://cozy.town/home-header-optimized.svg);
background-position: center;
background-size: cover;
display: flex;
flex-direction: column;
height: 40vh;
justify-content: center;
text-align: center;
width: 100%;
}
.mx_Main {
max-width: 899px;
width: calc(100% - 4rem);
position: relative;
top: -30px;
background-color: rgb(250, 220, 120);
border-radius: 10px;
margin: 0px auto;
padding: 40px;
}
button {
display: flex;
margin: auto;
font-weight: bold;
padding: 10px 14px;
background: rgb(255, 255, 230);
border-radius: 5px;
box-shadow: rgba(0,0,0,0.1) 5px 5px 0px 0px;
transition: box-shadow .15s ease, transform .15s ease;
border: 0;
font-size: medium;
}
button:hover {
box-shadow: rgba(0,0,0,0.1) 2.5px 2.5px 0px 0px;
transform: translate(2.5px, 2.5px);
}
@media screen and (max-width: 1120px) {
body {
font-size: 20px;
}
h1 { font-size: 1rem; }
h2 { font-size: .9rem; }
h3 { font-size: .85rem; }
h4 { font-size: .8rem; }
}
.error {
color: red;
}