gnusocial.rocks/v2-src/assets/css/smol.css

350 lines
4.9 KiB
CSS
Raw Normal View History

2021-03-31 16:09:28 +01:00
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;800&family=Open+Sans&display=swap');
html
{
background: url("bg.jpg") no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
body
{
font-family: 'Open Sans', sans-serif;
color: #474350;
text-align: justify;
margin-top: 1.5em;
margin-right: 1.5em;
margin-left: 1.5em;
margin-bottom: 1.5em;
}
h1
{
font-family: 'Montserrat', sans-serif;
font-weight: 800;
font-size: 1.5em;
margin-top: 0;
}
input::-moz-focus-inner
{
border: 0;
}
a:link
{
color: #474350;
text-decoration: none;
outline: 0;
}
a:visited
{
color: #474350;
outline: 0;
}
h3
{
margin-bottom: 0;
padding: 0;
line-height: 1em;
font-weight: 500;
}
ul
{
text-decoration: none;
margin: 0;
padding: 0;
list-style: none;
}
/* CONTENT */
#logo-margin
{
margin-left: 0.2em;
}
.container
{
display: flex;
flex-wrap: wrap;
}
#sideways
{
order: 3;
position: absolute;
writing-mode: sideways-lr;
text-orientation: mixed;
margin-top: 10em;
margin-left: 0;
font-size: 1.2em;
}
.center
{
margin-top: 2em;
margin-left: auto;
margin-right: auto;
margin-bottom: 2em;
width: 100%;
order: 4;
}
.center a:link
{
color: #44344f;
font-weight: 900;
}
.center a:visited
{
color: #44344f;
font-weight: 900;
}
.social
{
align-self: flex-start;
order: 1;
}
.social ul li
{
position: relative;
}
.social ul li ul a
{
line-height: 1.8em;
}
.social ul li ul
{
display: none;
position: absolute;
left: 10%;
background-color: #F3EBEFEF;
padding: 0.8em 1.5em 1.5em 1.5em;
border-radius: 4px;
}
.social ul li:hover ul
{
display: block;
}
.social ul li ul a:hover
{
opacity: 0.6;
transition: all 0.5s ease;
}
.hover-effect:hover
{
opacity: 0.6;
transition: all 0.5s ease;
}
.gnu
{
margin-left: auto;
text-align: right;
order: 2;
}
.gnu ul li
{
position: relative;
}
.gnu ul li ul a
{
line-height: 1.8em;
}
.gnu ul li a:hover
{
opacity: 0.6;
transition: all 0.5s ease;
}
.gnu ul li ul
{
display: none;
position: absolute;
right: 10%;
background-color: #F3EBEFEF;
padding: 0.8em 1.5em 1.5em 1.5em;
border-radius: 4px;
}
.gnu ul li:hover ul
{
display: block;
}
#content-left
{
width: 100%;
align-self: flex-start;
order: 5;
}
#content-left a:link
{
color: #44344f;
font-weight: 900;
}
#content-left a:visited
{
color: #44344f;
font-weight: 900;
}
#content-right
{
margin-top: 2em;
margin-left: auto;
order: 6;
width: 100%;
}
#content-right a:link
{
color: #44344f;
font-weight: 900;
}
#content-right a:visited
{
color: #44344f;
font-weight: 900;
}
.emphasis
{
text-align: center;
}
/* BUTTON STUFF */
section
{
padding: 0;
margin-top: 0;
}
.buttons
{
text-align: center;
}
button
{
padding: 1.3em 0;
margin-top: 3em;
margin-bottom: 0;
margin-left: 1em;
text-transform: uppercase;
font-weight: bold;
font-family: 'Open Sans', sans-serif;
font-size: 0.8em;
text-align: center;
color: #474350;
letter-spacing: 1px;
border: none;
cursor: pointer;
width: 15em;
outline: none;
overflow: hidden;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.btn-1
{
overflow: hidden;
background-color: transparent;
border: 1px solid #474350;
border-radius: 4px;
transition: all 0.5s ease;
}
.btn-1:hover
{
background-color: rgba(216, 203, 223, 0.4);
color: #474350;
}
.btn-1:active
{
transform: scale(1.1)
}
/* TABLE STUFF */
#try
{
order:5;
width: 100%;
margin-left: auto;
margin-right: auto;
margin-bottom: 0;
margin-top: 0;
padding: 0;
}
.instances
{
order: 5;
margin-top: 2em;
margin-bottom: 2em;
width: 100%;
}
table {
width: 100%;
border-collapse: collapse;
overflow: hidden;
box-shadow: 0 0 40px rgba(216, 203, 223, 0.4);
}
th,
td {
padding: 15px;
background-color: rgba(243, 235, 239, 0.8);
}
th {
text-align: left;
}
thead th {
background-color: rgba(216, 203, 223, 0.4);
}
tbody tr:hover {
background-color: rgba(125, 125, 125, 0.2);
}
tbody td {
color: #474350;
position: relative;
}
tbody td:hover:before {
content: "";
position: absolute;
left: 0;
right: 0;
top: -9999px;
bottom: -9999px;
background-color: rgba(255, 255, 255, 0.2);
z-index: -1;
}
.md
{
order: 4;
width: 100%;
margin-left: auto;
margin-right: auto;
}
.md h1
{
margin-top: 2em;
}
#footer
{
text-align: center;
order: 66;
margin-top: 5em;
margin-left: auto;
margin-right: auto;
}