Файловый менеджер - Редактировать - /var/www/sturrock/social-hub/css/style.css
Назад
@import url('https://fonts.googleapis.com/css?family=Passion+One|PT+Sans'); @font-face { font-family: klavika; src: url(../fonts/klavika.woff); } body { background: #1d1d1d; color: #fff; font-family: klavika, 'Passion One', cursive; } .app { display: flex; flex-direction: column; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; } header { height: 100px; border-bottom: 0.5px solid rgba(255,255,255,0.2); display: flex; justify-content: center; align-items: center; } footer { height: 60px; background: #000; display: flex; justify-content: center; align-items: center; font-family: 'klavika', sans-serif; } footer a { color: #fff; } section { flex: 1; display: flex; overflow: auto; } section .left { flex:1; display: flex; justify-content: center; align-items: center; } section .right { flex:1; display: flex; justify-content: flex-start; align-items: center; text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25); font-size: 5vw; } section .right .text { } header img { height: 55px; } .container { max-width: 1000px; margin: auto; font-family: 'PT Sans', sans-serif; padding: 50px 0px; } .button { height: 40px; background-color: #0080e6; background: linear-gradient(110deg, #107ace, #2196F3); color: #fff; display: flex; justify-content: center; align-items: center; border-radius: 25px; flex: 1; max-width: 300px; font-size: 20px; min-width: 200px; border: 3px solid #ffffff; box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.22); margin-top: 30px; text-decoration: none; } .pulse_loader img { min-height: 100%; display: flex; align-items: center; justify-content: center; min-width: 100%; height: 100%; object-fit: cover; width: 100%; border-radius: 50%; position: absolute; } .pulse_load { margin: 150px auto; width: 150px; height: 150px; text-align: left; border: 2px solid #fff; box-shadow: 0px 0px 20px rgba(0,0,0,0.2); background-color: #000; border-radius: 150px; position:relative; animation: pulse 2000ms linear infinite; -webkit-animation: pulse 2000ms linear infinite; -moz-animation: pulse 2000ms linear infinite; } .pulse_load i{ position:absolute; top:28px; left:24%; color:white; text-shadow:-1px -1px #333; } .pulse_load:after, .pulse_load:before { display: inline-block; margin: auto; position: absolute; content: ""; width: 150px; height: 150px; border-radius: 150px; background-color: #fff; } .pulse_load:after { z-index: -100; -webkit-animation: outer-ripple 2000ms linear infinite; -moz-animation: outer-ripple 2000ms linear infinite; animation: outer-ripple 2000ms linear infinite; } .pulse_load:before { z-index: -200; -webkit-animation: inner-ripple 2000ms linear infinite; -moz-animation: inner-ripple 2000ms linear infinite; animation: inner-ripple 2000ms linear infinite; } @keyframes pulse{ 0% { transform: scale(0.8); filter: alpha(opacity=50); opacity: 0.5; } 10% { transform: scale(1.1); filter: alpha(opacity=1); opacity: 1; } 20% { transform: scale(0.9); filter: alpha(opacity=1); opacity: 1; } 100% { transform: scale(0.8); filter: alpha(opacity=50); opacity: 0.5; } } @-moz-keyframes pulse{ 0% { transform: scale(0.8); filter: alpha(opacity=50); opacity: 0.5; } 10% { transform: scale(1.1); filter: alpha(opacity=1); opacity: 1; } 20% { transform: scale(0.9); filter: alpha(opacity=1); opacity: 1; } 100% { transform: scale(0.8); filter: alpha(opacity=50); opacity: 0.5; } } @-webkit-keyframes pulse{ 0% { transform: scale(0.8); filter: alpha(opacity=50); opacity: 0.5; } 10% { transform: scale(1.1); filter: alpha(opacity=1); opacity: 1; } 20% { transform: scale(0.9); filter: alpha(opacity=1); opacity: 1; } 100% { transform: scale(0.8); filter: alpha(opacity=50); opacity: 0.5; } } @keyframes outer-ripple { 0% { transform: scale(1); filter: alpha(opacity=50); opacity: 0.5; } 80% { transform: scale(3.5); filter: alpha(opacity=0); opacity: 0; } 100% { transform: scale(3.5); filter: alpha(opacity=0); opacity: 0; } } @-webkit-keyframes outer-ripple { 0% { transform: scale(1); filter: alpha(opacity=50); opacity: 0.5; } 80% { transform: scale(3.5); filter: alpha(opacity=0); opacity: 0; } 100% { transform: scale(3.5); filter: alpha(opacity=0); opacity: 0; } } @-moz-keyframes outer-ripple { 0% { transform: scale(1); filter: alpha(opacity=50); opacity: 0.5; } 80% { transform: scale(3.5); filter: alpha(opacity=0); opacity: 0; } 100% { transform: scale(3.5); filter: alpha(opacity=0); opacity: 0; } } /* inner ripple */ @keyframes inner-ripple { 0% { transform: scale(1); filter: alpha(opacity=50); opacity: 0.5; } 30% { transform: scale(1); filter: alpha(opacity=50); opacity: 0.5; } 100% { transform: scale(2.5); filter: alpha(opacity=0); opacity: 0; } } @-webkit-keyframes inner-ripple { 0% { transform: scale(1); filter: alpha(opacity=50); opacity: 0.5; } 30% { transform: scale(1); filter: alpha(opacity=50); opacity: 0.5; } 100% { transform: scale(2.5); filter: alpha(opacity=0); opacity: 0; } } @-moz-keyframes inner-ripple { 0% { transform: scale(1); filter: alpha(opacity=50); opacity: 0.5; } 30% { transform: scale(1); filter: alpha(opacity=50); opacity: 0.5; } 100% { transform: scale(2.5); filter: alpha(opacity=0); opacity: 0; } } @media screen and (max-device-width: 400px) { header { height: 60px; } header img { height: 35px; } footer { height: 60px; font-size: 9px; } section { flex-direction: column; } section .left { flex: 2; } section .right { font-size: 10vw; text-align: center; justify-content: center; align-items: flex-start; } .pulse_load { margin: 150px auto; width: 100px; height: 100px; } .pulse_load:after, .pulse_load:before { width: 100px; height: 100px; border-radius: 100px; } }
| ver. 1.4 |
Github
|
.
| PHP 7.0.33-0ubuntu0.16.04.16 | Генерация страницы: 0 |
proxy
|
phpinfo
|
Настройка