| Current Path : /home/kamilrogam/poligon/PLANY/ARTY/optymaizacja/ |
| Current File : /home/kamilrogam/poligon/PLANY/ARTY/optymaizacja/template.css |
* {
padding: 0px;
margin: 0px;
outline: none;
}
body {
font-family: 'Didact Gothic', sans-serif;
font-size: 20px;
line-height: 25px;
color: #00293c;
width: 100%;
background: #fff;
position: relative;
word-wrap: break-word;
text-align: justify;
-webkit-font-smoothing: antialiased!important;
font-smoothing: antialiased!important;
-moz-osx-font-smoothing: grayscale!important;
font-smooth: always!important;
}
img {
border: none;
max-width: 100%;
height: auto;
}
.width {
width: 1170px;
margin: 0px auto;
position: relative;
}
.fix {
position: fixed;
width: 100%;
bottom: 44px;
left: 0px;
}
.egg-c {
left: 50%;
margin-left: -94.5px;
position: absolute;
top: 0px;
height: 100%;
width: 100%;
z-index: 9;
}
.egg {
line-height: 0px;
position: absolute;
left: 0px;
bottom: 0px;
z-index: 8;
}
.egg-top {
z-index: 10px;
}
.grass {
background: url('../images/grass.png')center center repeat-x;
height: 100px;
}
.grass-bg {
background: #5aa911;
height: 30px;
bottom: 0px;
}
.grass-bg, .grass {
position: absolute;
width: 100%;
left: 0px;
}
.grass.back {
bottom: 30px;
z-index: 7;
background-position-x: 5px;
}
.grass.front {
bottom: 0px;
z-index: 12;
}
.crack {
line-height: 0px;
height: 1px;
background: #000;
border-bottom: 1px solid #ccc;
position: absolute;
z-index: 9;
}
.cr1 {
width: 15px;
top: 169px;
left: 2px;
}
.cr2 {
width: 11px;
top: 173px;
left: 14px;
-webkit-transform: rotate(50deg);
-moz-transform: rotate(50deg);
-ms-transform: rotate(50deg);
-o-transform: rotate(50deg);
transform: rotate(50deg);
}
.cr3 {
width: 15px;
top: 172px;
left: 21px;
-webkit-transform: rotate(-38deg);
-moz-transform: rotate(-38deg);
transform: rotate(-38deg);
transform: rotate(-38deg);
transform: rotate(-38deg);
}
.cr4 {
width: 13px;
top: 175px;
left: 27px;
-webkit-transform: rotate(26deg);
-moz-transform: rotate(26deg);
transform: rotate(26deg);
transform: rotate(26deg);
transform: rotate(26deg);
}
.cr5 {
width: 30px;
top: 191px;
left: 149px;
-webkit-transform: rotate(42deg);
-moz-transform: rotate(42deg);
-ms-transform: rotate(42deg);
-o-transform: rotate(42deg);
transform: rotate(42deg);
}
.cr6 {
width: 19px;
top: 173px;
left: 140px;
-webkit-transform: rotate(65deg);
-moz-transform: rotate(65deg);
-ms-transform: rotate(65deg);
-o-transform: rotate(65deg);
transform: rotate(65deg);
}
.cr7 {
width: 25px;
top: 183px;
left: 130px;
-webkit-transform: rotate(-1deg);
-moz-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
-o-transform: rotate(-1deg);
transform: rotate(-1deg);
}
.cr8 {
width: 10px;
top: 180px;
left: 132px;
-webkit-transform: rotate(35deg);
-moz-transform: rotate(35deg);
-ms-transform: rotate(35deg);
-o-transform: rotate(35deg);
transform: rotate(35deg);
}
.cr9 {
width: 15px;
top: 172px;
left: 135px;
-webkit-transform: rotate(8deg);
-moz-transform: rotate(8deg);
-ms-transform: rotate(8deg);
-o-transform: rotate(8deg);
transform: rotate(8deg);
}
.txt {
width: 100%;
position: fixed;
left: 0;
bottom: -500px;
text-align: center;
}
.txt img{
max-width: 100px;
}
.txt-animation{
-webkit-animation: txt-animation 3s ease-in-out 8.5s 1 normal forwards;
-moz-animation: txt-animation 3s ease-in-out 8.5s 1 normal forwards;
-o-animation: txt-animation 3s ease-in-out 8.5s 1 normal forwards;
animation: txt-animation 3s ease-in-out 8.5s 1 normal forwards;
}
.fly {
-webkit-animation: fly 1s ease-in-out 8s 1 normal forwards;
-moz-animation: fly 1s ease-in-out 8s 1 normal forwards;
-o-animation: fly 1s ease-in-out 8s 1 normal forwards;
animation: fly 1s ease-in-out 8s 1 normal forwards;
}
.shake {
-webkit-animation: shake 1s cubic-bezier(0.36, 0.07, 0.19, 0.97) 3s 5;
-moz-animation: shake 1s cubic-bezier(0.36, 0.07, 0.19, 0.97) 3s 5;
-o-animation: shake 1s cubic-bezier(0.36, 0.07, 0.19, 0.97) 3s 5;
animation: shake 1s cubic-bezier(0.36, 0.07, 0.19, 0.97) 3s 5;
-webkit-transform: translate3d(0px, 0px, 0px);
-moz-transform: translate3d(0px, 0px, 0px);
-o-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
}
@-webkit-keyframes shake {
0% {
-webkit-transform: translate3d(0px, 0px, 0px);
-moz-transform: translate3d(0px, 0px, 0px);
-ms-transform: translate3d(0px, 0px, 0px);
-o-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
}
20%, 90% {
-webkit-transform: translate3d(-1px, 0px, 0px);
-moz-transform: translate3d(-1px, 0px, 0px);
-ms-transform: translate3d(-1px, 0px, 0px);
-o-transform: translate3d(-1px, 0px, 0px);
transform: translate3d(-1px, 0px, 0px);
}
30%, 80% {
-webkit-transform: translate3d(2px, 0px, 0px);
-moz-transform: translate3d(2px, 0px, 0px);
-ms-transform: translate3d(2px, 0px, 0px);
-o-transform: translate3d(2px, 0px, 0px);
transform: translate3d(2px, 0px, 0px);
}
40%, 50%, 70% {
-webkit-transform: translate3d(-4px, 0px, 0px);
-moz-transform: translate3d(-4px, 0px, 0px);
-ms-transform: translate3d(-4px, 0px, 0px);
-o-transform: translate3d(-4px, 0px, 0px);
transform: translate3d(-4px, 0px, 0px);
}
45%, 60% {
-webkit-transform: translate3d(4px, 0px, 0px);
-moz-transform: translate3d(4px, 0px, 0px);
-ms-transform: translate3d(4px, 0px, 0px);
-o-transform: translate3d(4px, 0px, 0px);
transform: translate3d(4px, 0px, 0px);
}
}
@-moz-keyframes shake {
0% {
-webkit-transform: translate3d(0px, 0px, 0px);
-moz-transform: translate3d(0px, 0px, 0px);
-ms-transform: translate3d(0px, 0px, 0px);
-o-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
}
20%, 90% {
-webkit-transform: translate3d(-1px, 0px, 0px);
-moz-transform: translate3d(-1px, 0px, 0px);
-ms-transform: translate3d(-1px, 0px, 0px);
-o-transform: translate3d(-1px, 0px, 0px);
transform: translate3d(-1px, 0px, 0px);
}
30%, 80% {
-webkit-transform: translate3d(2px, 0px, 0px);
-moz-transform: translate3d(2px, 0px, 0px);
-ms-transform: translate3d(2px, 0px, 0px);
-o-transform: translate3d(2px, 0px, 0px);
transform: translate3d(2px, 0px, 0px);
}
40%, 50%, 70% {
-webkit-transform: translate3d(-4px, 0px, 0px);
-moz-transform: translate3d(-4px, 0px, 0px);
-ms-transform: translate3d(-4px, 0px, 0px);
-o-transform: translate3d(-4px, 0px, 0px);
transform: translate3d(-4px, 0px, 0px);
}
45%, 60% {
-webkit-transform: translate3d(4px, 0px, 0px);
-moz-transform: translate3d(4px, 0px, 0px);
-ms-transform: translate3d(4px, 0px, 0px);
-o-transform: translate3d(4px, 0px, 0px);
transform: translate3d(4px, 0px, 0px);
}
}
@-o-keyframes shake {
0% {
-webkit-transform: translate3d(0px, 0px, 0px);
-moz-transform: translate3d(0px, 0px, 0px);
-ms-transform: translate3d(0px, 0px, 0px);
-o-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
}
20%, 90% {
-webkit-transform: translate3d(-1px, 0px, 0px);
-moz-transform: translate3d(-1px, 0px, 0px);
-ms-transform: translate3d(-1px, 0px, 0px);
-o-transform: translate3d(-1px, 0px, 0px);
transform: translate3d(-1px, 0px, 0px);
}
30%, 80% {
-webkit-transform: translate3d(2px, 0px, 0px);
-moz-transform: translate3d(2px, 0px, 0px);
-ms-transform: translate3d(2px, 0px, 0px);
-o-transform: translate3d(2px, 0px, 0px);
transform: translate3d(2px, 0px, 0px);
}
40%, 50%, 70% {
-webkit-transform: translate3d(-4px, 0px, 0px);
-moz-transform: translate3d(-4px, 0px, 0px);
-ms-transform: translate3d(-4px, 0px, 0px);
-o-transform: translate3d(-4px, 0px, 0px);
transform: translate3d(-4px, 0px, 0px);
}
45%, 60% {
-webkit-transform: translate3d(4px, 0px, 0px);
-moz-transform: translate3d(4px, 0px, 0px);
-ms-transform: translate3d(4px, 0px, 0px);
-o-transform: translate3d(4px, 0px, 0px);
transform: translate3d(4px, 0px, 0px);
}
}
@keyframes shake {
0% {
-webkit-transform: translate3d(0px, 0px, 0px);
-moz-transform: translate3d(0px, 0px, 0px);
-ms-transform: translate3d(0px, 0px, 0px);
-o-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
}
20%, 90% {
-webkit-transform: translate3d(-1px, 0px, 0px);
-moz-transform: translate3d(-1px, 0px, 0px);
-ms-transform: translate3d(-1px, 0px, 0px);
-o-transform: translate3d(-1px, 0px, 0px);
transform: translate3d(-1px, 0px, 0px);
}
30%, 80% {
-webkit-transform: translate3d(2px, 0px, 0px);
-moz-transform: translate3d(2px, 0px, 0px);
-ms-transform: translate3d(2px, 0px, 0px);
-o-transform: translate3d(2px, 0px, 0px);
transform: translate3d(2px, 0px, 0px);
}
40%, 50%, 70% {
-webkit-transform: translate3d(-4px, 0px, 0px);
-moz-transform: translate3d(-4px, 0px, 0px);
-ms-transform: translate3d(-4px, 0px, 0px);
-o-transform: translate3d(-4px, 0px, 0px);
transform: translate3d(-4px, 0px, 0px);
}
45%, 60% {
-webkit-transform: translate3d(4px, 0px, 0px);
-moz-transform: translate3d(4px, 0px, 0px);
-ms-transform: translate3d(4px, 0px, 0px);
-o-transform: translate3d(4px, 0px, 0px);
transform: translate3d(4px, 0px, 0px);
}
}
@-webkit-keyframes fly {
0% {
bottom: 0px;
left: 0px;
}
50% {
bottom: 400px;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
100% {
bottom: 0px;
left: 250px;
-webkit-transform: rotate(160deg);
-moz-transform: rotate(160deg);
-ms-transform: rotate(160deg);
-o-transform: rotate(160deg);
transform: rotate(160deg);
}
}
@-moz-keyframes fly {
0% {
bottom: 0px;
left: 0px;
}
50% {
bottom: 400px;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
100% {
bottom: 0px;
left: 250px;
-webkit-transform: rotate(160deg);
-moz-transform: rotate(160deg);
-ms-transform: rotate(160deg);
-o-transform: rotate(160deg);
transform: rotate(160deg);
}
}
@-o-keyframes fly {
0% {
bottom: 0px;
left: 0px;
}
50% {
bottom: 400px;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
100% {
bottom: 0px;
left: 250px;
-webkit-transform: rotate(160deg);
-moz-transform: rotate(160deg);
-ms-transform: rotate(160deg);
-o-transform: rotate(160deg);
transform: rotate(160deg);
}
}
@keyframes fly {
0% {
bottom: 0px;
left: 0px;
}
50% {
bottom: 400px;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
100% {
bottom: 0px;
left: 250px;
-webkit-transform: rotate(160deg);
-moz-transform: rotate(160deg);
-ms-transform: rotate(160deg);
-o-transform: rotate(160deg);
transform: rotate(160deg);
}
}
@-webkit-keyframes txt-animation {
0% {
bottom: -500px;
}
100% {
bottom: 0px;
}
}
@-moz-keyframes txt-animation {
0% {
bottom: -500px;
}
100% {
bottom: 0px;
}
}
@-o-keyframes txt-animation {
0% {
bottom: -500px;
}
100% {
bottom: 0px;
}
}
@keyframes txt-animation {
0% {
bottom: -500px;
}
100% {
bottom: 0px;
}
}
.author {
-webkit-transition: all 0.7s ease-out;
-moz-transition: all 0.7s ease-out;
-o-transition: all 0.7s ease-out;
transition: all 0.7s ease-out;
}
.author {
padding: 5px 5%;
z-index: 9;
position: fixed;
bottom: 0px;
width: 90%;
background: #eee;
font-size: 13px;
line-height: 15px;
border-top: 1px solid #ccc;
height: 33px;
}
.author p {
margin: 0px;
}
.author p: nth-child(1) {
margin: 0 0 2.5px;
}