MySign-Repo/styles.css
2024-10-18 21:50:43 -04:00

146 lines
No EOL
3.2 KiB
CSS

body{
margin: 0;
background: linear-gradient(to right, #5900ff, #8c32e0);
text-align: center;
background-filter: blur(10px);
}
p{
color:white
}
h3{
color:white
}
h2{
color:white
}
h1{
color:white
}
.float-on-hover {
display: inline-block;
vertical-align: middle;
-webkit-transform: perspective(1px) translateZ(0);
transform: perspective(1px) translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-property: transform;
transition-property: transform;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
}
.float-on-hover:hover, .float-on-hover:focus, .float-on-hover:active {
-webkit-transform: translateY(-1.5px);
transform: translateY(-1.5px);
}
.topnav {
background-color: #000000;
overflow: hidden;
opacity: .8;
}
/* Style the links inside the navigation bar */
.topnav a {
float: left;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
-moz-transition: all .5s ease-in;
-o-transition: all .5s ease-in;
-webkit-transition: all .5s ease-in;
transition: all .5s ease-in;
background: #000000;
padding: 20px;
}
/* Change the color of links on hover */
.topnav a:hover {
background-color: #ddd;
color: black;
}
/* Add a color to the active/current link */
.topnav a.active {
background-color: #04AA6D;
color: white;
}
.social-bar {
display: flex;
justify-content: center;
align-items: center;
}
.social-bar a {
display: inline;
text-align: center;
padding: 15px;
transition: all 0.3s ease;
color: white;
font-size: 20px;
border-radius: 50%;
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(25px);
}
.social-bar a:hover {
background-color: rgb(6, 1, 1);
}
.twitter {
background: #11bcff;
margin: 20px;
}
.youtube {
background: red;
margin: 20px;
}
.github {
background: rgb(140, 0, 255);
margin: 20px;
}
.reddit {
background: rgb(255, 69, 0);
margin: 20px;
}
.twitch {
background: rgb(169, 112, 255);
margin: 20px;
}
.esign {
background-color: rgb(58, 183, 233)
}
.discord {
margin: 8px;
padding: 15px;
}
.tele {
background-color: rgb(55, 175, 223)
}
.transparent {
background-color: rgba(0, 0, 0, 0.486);
margin: 8.5px;
}
.discord-btn:hover {
color: #fff;
}