Thiemoo.at_outdated/css/style.css

128 lines
2.0 KiB
CSS
Raw Normal View History

2021-03-15 17:56:02 +00:00
/* Global Secion */
body {
background: #233142;
}
a {
text-decoration: none;
}
.align-center {
text-align: center;
align: center;
}
/* Avatar Secion */
.avatar {
text-align: center;
margin-top: 5%;
}
.avatar-img {
width: 200px;
height: auto;
border-radius: 50%;
margin-top: 1%;
animation-name: avatar-picture-fadein;
animation-duration: 1.5s;
}
.avatar-text {
color: #7996b9;
font-family: 'Trebuchet MS', sans-serif;
animation-name: fadeIn;
animation-duration: 1.5s;
}
.avatar-subtext {
color: #7996b9;
font-family: 'Trebuchet MS', sans-serif;
animation-name: fadeIn;
animation-duration: 1.5s;
}
/* links Secion */
.links {
text-align: center;
margin-top: -2%;
}
.block {
display: inline-block;
vertical-align: top;
padding: 5%;
font-size: 38px;
color: #bfbfbf;
max-width: 14%;
opacity: 0;
}
2021-03-15 18:06:38 +00:00
@media only screen and (max-width: 968px) {
2021-03-15 17:56:02 +00:00
.block {
display: block;
text-align: center;
transform: translate(50%, 3%);
max-width: 40%;
}
}
.block-subtext {
font-size: 0.5em;
color: #7996b9;
font-family: 'Trebuchet MS', sans-serif;
}
.block-1{
animation-name: fadeIn;
animation-duration: 1.5s;
animation-delay: 0.2s;
animation-fill-mode:forwards;
}
.block-2{
animation-name: fadeIn;
animation-duration: 1.5s;
animation-delay: 0.5s;
animation-fill-mode:forwards;
}
.block-3 {
animation-name: fadeIn;
animation-duration: 1.5s;
animation-delay: 0.8s;
animation-fill-mode:forwards;
}
.button {
border: 0;
background: #354a64;
color: #bfbfbf;
width: 110px;
height: 40px;
margin: 20px auto;
border-radius: 5px;
display: block;
text-decoration: none;
text-align: center;
font-family: 'Trebuchet MS', sans-serif;
font-size: 0.6em;
transition-duration: 0.4s;
}
.button:hover {
background-color: #006080;
}
/* Footer section */
.footer {
text-align: center;
margin-top: -2%;
color: #7996b9;
font-family: 'Trebuchet MS', sans-serif;
animation-name: fadeIn;
animation-duration: 1.5s;
}
.footer-heart {
color: red;
}