Files
watchparty/website/styles/medium.css
T
2020-07-01 00:39:09 -04:00

114 lines
2.0 KiB
CSS

html {
font-size: 7.5px !important;
}
body {
font-size: 7.5px !important;
}
.features,
.supported {
max-width: 75%;
}
.link-button {
transition: all ease-in-out 0.2s !important;
border: 3px solid transparent;
}
.link-button:hover {
border: 3px solid var(--primary-text);
box-shadow: 0 0 10px var(--primary-text);
}
.logo {
font-size: 10rem;
transition: all ease-in-out 0.3s;
}
.logo.stickied {
font-size: 2rem;
letter-spacing: 0.8rem;
position: fixed;
background-color: var(--primary);
width: 100%;
left: 0;
top: 0;
padding: 3rem 10rem;
z-index: 999 !important;
}
.landing .link-button.stickied {
position: fixed;
right: 0rem;
top: 0;
border-radius: 0;
font-size: 2rem;
z-index: 1999 !important;
border: none !important;
box-shadow: none !important;
}
.feature-card {
background-color: var(--primary-medium);
z-index: 1;
width: 30rem;
height: 30rem;
margin: -1px;
display: inline-block;
padding: 3rem;
transition: all 0.3s ease-in;
position: relative;
}
.feature-icon {
z-index: 1;
background-position: center !important;
transition: all ease-out 0.3s;
border-radius: 100%;
width: 0;
margin: 0 auto;
height: 0;
background-size: cover !important;
padding: 5rem;
background-color: black;
position: absolute;
top: 13rem;
left: 13rem;
}
.feature-card .feature-text {
z-index: 1;
display: table;
line-height: 0;
opacity: 0;
text-align: center;
overflow: hidden;
}
.feature-card:hover {
background-color: var(--cta);
box-shadow: -5px 5px 100px #000000;
z-index: 100;
transform: scale(1.1);
}
.feature-card:hover .feature-text {
display: table;
color: var(--primary-light);
line-height: initial;
opacity: 1;
}
.feature-card:hover .feature-icon {
position: relative;
top: unset;
left: unset;
margin-bottom: 3rem;
}
footer {
padding-right: 45%;
}
footer .title {
font-size: 2rem;
}
footer .built-with {
display: block;
}
footer .link-button {
max-width: fit-content;
display: inline-table;
margin-right: 3rem;
padding: 0.8rem 3.375rem;
font-size: 2.5rem;
}