Skip to content

alkydy / final-project

Go to a project
Commit de0f1f3d by AlekefromKz
Options

COMMENT TO DESCRIBE THE INTENTION OF THE COMMIT

parent 41789cf8
Inline Side-by-side
Showing with 6372 additions and 0 deletions
css/animate.css 0 → 100644
@charset "UTF-8";
/*!
* animate.css -https://daneden.github.io/animate.css/
* Version - 3.7.2
* Licensed under the MIT license - http://opensource.org/licenses/MIT
*
* Copyright (c) 2019 Daniel Eden
*/
@-webkit-keyframes bounce {
from,
20%,
53%,
80%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
40%,
43% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
@keyframes bounce {
from,
20%,
53%,
80%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
40%,
43% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
.bounce {
-webkit-animation-name: bounce;
animation-name: bounce;
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
}
@-webkit-keyframes flash {
from,
50%,
to {
opacity: 1;
}
25%,
75% {
opacity: 0;
}
}
@keyframes flash {
from,
50%,
to {
opacity: 1;
}
25%,
75% {
opacity: 0;
}
}
.flash {
-webkit-animation-name: flash;
animation-name: flash;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes pulse {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes pulse {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.pulse {
-webkit-animation-name: pulse;
animation-name: pulse;
}
@-webkit-keyframes rubberBand {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(0.95, 1.05, 1);
transform: scale3d(0.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, 0.95, 1);
transform: scale3d(1.05, 0.95, 1);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes rubberBand {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(0.95, 1.05, 1);
transform: scale3d(0.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, 0.95, 1);
transform: scale3d(1.05, 0.95, 1);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.rubberBand {
-webkit-animation-name: rubberBand;
animation-name: rubberBand;
}
@-webkit-keyframes shake {
from,
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%,
30%,
50%,
70%,
90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%,
40%,
60%,
80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
@keyframes shake {
from,
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%,
30%,
50%,
70%,
90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%,
40%,
60%,
80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
.shake {
-webkit-animation-name: shake;
animation-name: shake;
}
@-webkit-keyframes headShake {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
6.5% {
-webkit-transform: translateX(-6px) rotateY(-9deg);
transform: translateX(-6px) rotateY(-9deg);
}
18.5% {
-webkit-transform: translateX(5px) rotateY(7deg);
transform: translateX(5px) rotateY(7deg);
}
31.5% {
-webkit-transform: translateX(-3px) rotateY(-5deg);
transform: translateX(-3px) rotateY(-5deg);
}
43.5% {
-webkit-transform: translateX(2px) rotateY(3deg);
transform: translateX(2px) rotateY(3deg);
}
50% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes headShake {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
6.5% {
-webkit-transform: translateX(-6px) rotateY(-9deg);
transform: translateX(-6px) rotateY(-9deg);
}
18.5% {
-webkit-transform: translateX(5px) rotateY(7deg);
transform: translateX(5px) rotateY(7deg);
}
31.5% {
-webkit-transform: translateX(-3px) rotateY(-5deg);
transform: translateX(-3px) rotateY(-5deg);
}
43.5% {
-webkit-transform: translateX(2px) rotateY(3deg);
transform: translateX(2px) rotateY(3deg);
}
50% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
.headShake {
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-name: headShake;
animation-name: headShake;
}
@-webkit-keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
to {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
@keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
to {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
.swing {
-webkit-transform-origin: top center;
transform-origin: top center;
-webkit-animation-name: swing;
animation-name: swing;
}
@-webkit-keyframes tada {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%,
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
}
30%,
50%,
70%,
90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%,
60%,
80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes tada {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%,
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
}
30%,
50%,
70%,
90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%,
60%,
80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.tada {
-webkit-animation-name: tada;
animation-name: tada;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes wobble {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes wobble {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.wobble {
-webkit-animation-name: wobble;
animation-name: wobble;
}
@-webkit-keyframes jello {
from,
11.1%,
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
22.2% {
-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
transform: skewX(-12.5deg) skewY(-12.5deg);
}
33.3% {
-webkit-transform: skewX(6.25deg) skewY(6.25deg);
transform: skewX(6.25deg) skewY(6.25deg);
}
44.4% {
-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
transform: skewX(-3.125deg) skewY(-3.125deg);
}
55.5% {
-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
transform: skewX(1.5625deg) skewY(1.5625deg);
}
66.6% {
-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
transform: skewX(-0.78125deg) skewY(-0.78125deg);
}
77.7% {
-webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
transform: skewX(0.390625deg) skewY(0.390625deg);
}
88.8% {
-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
}
}
@keyframes jello {
from,
11.1%,
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
22.2% {
-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
transform: skewX(-12.5deg) skewY(-12.5deg);
}
33.3% {
-webkit-transform: skewX(6.25deg) skewY(6.25deg);
transform: skewX(6.25deg) skewY(6.25deg);
}
44.4% {
-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
transform: skewX(-3.125deg) skewY(-3.125deg);
}
55.5% {
-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
transform: skewX(1.5625deg) skewY(1.5625deg);
}
66.6% {
-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
transform: skewX(-0.78125deg) skewY(-0.78125deg);
}
77.7% {
-webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
transform: skewX(0.390625deg) skewY(0.390625deg);
}
88.8% {
-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
}
}
.jello {
-webkit-animation-name: jello;
animation-name: jello;
-webkit-transform-origin: center;
transform-origin: center;
}
@-webkit-keyframes heartBeat {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
14% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
28% {
-webkit-transform: scale(1);
transform: scale(1);
}
42% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
70% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes heartBeat {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
14% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
28% {
-webkit-transform: scale(1);
transform: scale(1);
}
42% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
70% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
.heartBeat {
-webkit-animation-name: heartBeat;
animation-name: heartBeat;
-webkit-animation-duration: 1.3s;
animation-duration: 1.3s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
@-webkit-keyframes bounceIn {
from,
20%,
40%,
60%,
80%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(0.97, 0.97, 0.97);
transform: scale3d(0.97, 0.97, 0.97);
}
to {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes bounceIn {
from,
20%,
40%,
60%,
80%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(0.97, 0.97, 0.97);
transform: scale3d(0.97, 0.97, 0.97);
}
to {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.bounceIn {
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s;
-webkit-animation-name: bounceIn;
animation-name: bounceIn;
}
@-webkit-keyframes bounceInDown {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes bounceInDown {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.bounceInDown {
-webkit-animation-name: bounceInDown;
animation-name: bounceInDown;
}
@-webkit-keyframes bounceInLeft {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes bounceInLeft {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.bounceInLeft {
-webkit-animation-name: bounceInLeft;
animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInRight {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
from {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes bounceInRight {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
from {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.bounceInRight {
-webkit-animation-name: bounceInRight;
animation-name: bounceInRight;
}
@-webkit-keyframes bounceInUp {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
from {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes bounceInUp {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
from {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.bounceInUp {
-webkit-animation-name: bounceInUp;
animation-name: bounceInUp;
}
@-webkit-keyframes bounceOut {
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
50%,
55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
}
@keyframes bounceOut {
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
50%,
55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
}
.bounceOut {
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s;
-webkit-animation-name: bounceOut;
animation-name: bounceOut;
}
@-webkit-keyframes bounceOutDown {
20% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
40%,
45% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@keyframes bounceOutDown {
20% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
40%,
45% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
.bounceOutDown {
-webkit-animation-name: bounceOutDown;
animation-name: bounceOutDown;
}
@-webkit-keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
.bounceOutLeft {
-webkit-animation-name: bounceOutLeft;
animation-name: bounceOutLeft;
}
@-webkit-keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
.bounceOutRight {
-webkit-animation-name: bounceOutRight;
animation-name: bounceOutRight;
}
@-webkit-keyframes bounceOutUp {
20% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
40%,
45% {
opacity: 1;
-webkit-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@keyframes bounceOutUp {
20% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
40%,
45% {
opacity: 1;
-webkit-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
.bounceOutUp {
-webkit-animation-name: bounceOutUp;
animation-name: bounceOutUp;
}
@-webkit-keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.fadeIn {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
@-webkit-keyframes fadeInDown {
from {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInDown {
from {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInDown {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
}
@-webkit-keyframes fadeInDownBig {
from {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInDownBig {
from {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInDownBig {
-webkit-animation-name: fadeInDownBig;
animation-name: fadeInDownBig;
}
@-webkit-keyframes fadeInLeft {
from {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInLeft {
from {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInLeftBig {
from {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInLeftBig {
from {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInLeftBig {
-webkit-animation-name: fadeInLeftBig;
animation-name: fadeInLeftBig;
}
@-webkit-keyframes fadeInRight {
from {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInRight {
from {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInRight {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight;
}
@-webkit-keyframes fadeInRightBig {
from {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInRightBig {
from {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInRightBig {
-webkit-animation-name: fadeInRightBig;
animation-name: fadeInRightBig;
}
@-webkit-keyframes fadeInUp {
from {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInUp {
from {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUpBig {
from {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInUpBig {
from {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInUpBig {
-webkit-animation-name: fadeInUpBig;
animation-name: fadeInUpBig;
}
@-webkit-keyframes fadeOut {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes fadeOut {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
.fadeOut {
-webkit-animation-name: fadeOut;
animation-name: fadeOut;
}
@-webkit-keyframes fadeOutDown {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes fadeOutDown {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
.fadeOutDown {
-webkit-animation-name: fadeOutDown;
animation-name: fadeOutDown;
}
@-webkit-keyframes fadeOutDownBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@keyframes fadeOutDownBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
.fadeOutDownBig {
-webkit-animation-name: fadeOutDownBig;
animation-name: fadeOutDownBig;
}
@-webkit-keyframes fadeOutLeft {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes fadeOutLeft {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
.fadeOutLeft {
-webkit-animation-name: fadeOutLeft;
animation-name: fadeOutLeft;
}
@-webkit-keyframes fadeOutLeftBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@keyframes fadeOutLeftBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
.fadeOutLeftBig {
-webkit-animation-name: fadeOutLeftBig;
animation-name: fadeOutLeftBig;
}
@-webkit-keyframes fadeOutRight {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes fadeOutRight {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
.fadeOutRight {
-webkit-animation-name: fadeOutRight;
animation-name: fadeOutRight;
}
@-webkit-keyframes fadeOutRightBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@keyframes fadeOutRightBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
.fadeOutRightBig {
-webkit-animation-name: fadeOutRightBig;
animation-name: fadeOutRightBig;
}
@-webkit-keyframes fadeOutUp {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes fadeOutUp {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
.fadeOutUp {
-webkit-animation-name: fadeOutUp;
animation-name: fadeOutUp;
}
@-webkit-keyframes fadeOutUpBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@keyframes fadeOutUpBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
.fadeOutUpBig {
-webkit-animation-name: fadeOutUpBig;
animation-name: fadeOutUpBig;
}
@-webkit-keyframes flip {
from {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
rotate3d(0, 1, 0, -360deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -190deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -190deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -170deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -170deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
rotate3d(0, 1, 0, 0deg);
transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
rotate3d(0, 1, 0, 0deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
to {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
rotate3d(0, 1, 0, 0deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
@keyframes flip {
from {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
rotate3d(0, 1, 0, -360deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -190deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -190deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -170deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -170deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
rotate3d(0, 1, 0, 0deg);
transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
rotate3d(0, 1, 0, 0deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
to {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
rotate3d(0, 1, 0, 0deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
.animated.flip {
-webkit-backface-visibility: visible;
backface-visibility: visible;
-webkit-animation-name: flip;
animation-name: flip;
}
@-webkit-keyframes flipInX {
from {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes flipInX {
from {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
.flipInX {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInX;
animation-name: flipInX;
}
@-webkit-keyframes flipInY {
from {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes flipInY {
from {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
.flipInY {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInY;
animation-name: flipInY;
}
@-webkit-keyframes flipOutX {
from {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
opacity: 0;
}
}
@keyframes flipOutX {
from {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
opacity: 0;
}
}
.flipOutX {
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s;
-webkit-animation-name: flipOutX;
animation-name: flipOutX;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
}
@-webkit-keyframes flipOutY {
from {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
opacity: 0;
}
}
@keyframes flipOutY {
from {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
opacity: 0;
}
}
.flipOutY {
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipOutY;
animation-name: flipOutY;
}
@-webkit-keyframes lightSpeedIn {
from {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
transform: skewX(20deg);
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
transform: skewX(-5deg);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes lightSpeedIn {
from {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
transform: skewX(20deg);
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
transform: skewX(-5deg);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.lightSpeedIn {
-webkit-animation-name: lightSpeedIn;
animation-name: lightSpeedIn;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
@-webkit-keyframes lightSpeedOut {
from {
opacity: 1;
}
to {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
@keyframes lightSpeedOut {
from {
opacity: 1;
}
to {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
.lightSpeedOut {
-webkit-animation-name: lightSpeedOut;
animation-name: lightSpeedOut;
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
@-webkit-keyframes rotateIn {
from {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, -200deg);
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0;
}
to {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes rotateIn {
from {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, -200deg);
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0;
}
to {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
.rotateIn {
-webkit-animation-name: rotateIn;
animation-name: rotateIn;
}
@-webkit-keyframes rotateInDownLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes rotateInDownLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
.rotateInDownLeft {
-webkit-animation-name: rotateInDownLeft;
animation-name: rotateInDownLeft;
}
@-webkit-keyframes rotateInDownRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes rotateInDownRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
.rotateInDownRight {
-webkit-animation-name: rotateInDownRight;
animation-name: rotateInDownRight;
}
@-webkit-keyframes rotateInUpLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes rotateInUpLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
.rotateInUpLeft {
-webkit-animation-name: rotateInUpLeft;
animation-name: rotateInUpLeft;
}
@-webkit-keyframes rotateInUpRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes rotateInUpRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
.rotateInUpRight {
-webkit-animation-name: rotateInUpRight;
animation-name: rotateInUpRight;
}
@-webkit-keyframes rotateOut {
from {
-webkit-transform-origin: center;
transform-origin: center;
opacity: 1;
}
to {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, 200deg);
transform: rotate3d(0, 0, 1, 200deg);
opacity: 0;
}
}
@keyframes rotateOut {
from {
-webkit-transform-origin: center;
transform-origin: center;
opacity: 1;
}
to {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, 200deg);
transform: rotate3d(0, 0, 1, 200deg);
opacity: 0;
}
}
.rotateOut {
-webkit-animation-name: rotateOut;
animation-name: rotateOut;
}
@-webkit-keyframes rotateOutDownLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
}
@keyframes rotateOutDownLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
}
.rotateOutDownLeft {
-webkit-animation-name: rotateOutDownLeft;
animation-name: rotateOutDownLeft;
}
@-webkit-keyframes rotateOutDownRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
@keyframes rotateOutDownRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
.rotateOutDownRight {
-webkit-animation-name: rotateOutDownRight;
animation-name: rotateOutDownRight;
}
@-webkit-keyframes rotateOutUpLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
@keyframes rotateOutUpLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
.rotateOutUpLeft {
-webkit-animation-name: rotateOutUpLeft;
animation-name: rotateOutUpLeft;
}
@-webkit-keyframes rotateOutUpRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 90deg);
transform: rotate3d(0, 0, 1, 90deg);
opacity: 0;
}
}
@keyframes rotateOutUpRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 90deg);
transform: rotate3d(0, 0, 1, 90deg);
opacity: 0;
}
}
.rotateOutUpRight {
-webkit-animation-name: rotateOutUpRight;
animation-name: rotateOutUpRight;
}
@-webkit-keyframes hinge {
0% {
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%,
60% {
-webkit-transform: rotate3d(0, 0, 1, 80deg);
transform: rotate3d(0, 0, 1, 80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40%,
80% {
-webkit-transform: rotate3d(0, 0, 1, 60deg);
transform: rotate3d(0, 0, 1, 60deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
to {
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
@keyframes hinge {
0% {
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%,
60% {
-webkit-transform: rotate3d(0, 0, 1, 80deg);
transform: rotate3d(0, 0, 1, 80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40%,
80% {
-webkit-transform: rotate3d(0, 0, 1, 60deg);
transform: rotate3d(0, 0, 1, 60deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
to {
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
.hinge {
-webkit-animation-duration: 2s;
animation-duration: 2s;
-webkit-animation-name: hinge;
animation-name: hinge;
}
@-webkit-keyframes jackInTheBox {
from {
opacity: 0;
-webkit-transform: scale(0.1) rotate(30deg);
transform: scale(0.1) rotate(30deg);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
}
50% {
-webkit-transform: rotate(-10deg);
transform: rotate(-10deg);
}
70% {
-webkit-transform: rotate(3deg);
transform: rotate(3deg);
}
to {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes jackInTheBox {
from {
opacity: 0;
-webkit-transform: scale(0.1) rotate(30deg);
transform: scale(0.1) rotate(30deg);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
}
50% {
-webkit-transform: rotate(-10deg);
transform: rotate(-10deg);
}
70% {
-webkit-transform: rotate(3deg);
transform: rotate(3deg);
}
to {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
}
.jackInTheBox {
-webkit-animation-name: jackInTheBox;
animation-name: jackInTheBox;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollIn {
from {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes rollIn {
from {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.rollIn {
-webkit-animation-name: rollIn;
animation-name: rollIn;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollOut {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
}
}
@keyframes rollOut {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
}
}
.rollOut {
-webkit-animation-name: rollOut;
animation-name: rollOut;
}
@-webkit-keyframes zoomIn {
from {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50% {
opacity: 1;
}
}
@keyframes zoomIn {
from {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50% {
opacity: 1;
}
}
.zoomIn {
-webkit-animation-name: zoomIn;
animation-name: zoomIn;
}
@-webkit-keyframes zoomInDown {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInDown {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInDown {
-webkit-animation-name: zoomInDown;
animation-name: zoomInDown;
}
@-webkit-keyframes zoomInLeft {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInLeft {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInLeft {
-webkit-animation-name: zoomInLeft;
animation-name: zoomInLeft;
}
@-webkit-keyframes zoomInRight {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInRight {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInRight {
-webkit-animation-name: zoomInRight;
animation-name: zoomInRight;
}
@-webkit-keyframes zoomInUp {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInUp {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInUp {
-webkit-animation-name: zoomInUp;
animation-name: zoomInUp;
}
@-webkit-keyframes zoomOut {
from {
opacity: 1;
}
50% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
to {
opacity: 0;
}
}
@keyframes zoomOut {
from {
opacity: 1;
}
50% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
to {
opacity: 0;
}
}
.zoomOut {
-webkit-animation-name: zoomOut;
animation-name: zoomOut;
}
@-webkit-keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomOutDown {
-webkit-animation-name: zoomOutDown;
animation-name: zoomOutDown;
}
@-webkit-keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
transform: scale(0.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
transform-origin: left center;
}
}
@keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
transform: scale(0.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
transform-origin: left center;
}
}
.zoomOutLeft {
-webkit-animation-name: zoomOutLeft;
animation-name: zoomOutLeft;
}
@-webkit-keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
transform: scale(0.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
transform-origin: right center;
}
}
@keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
transform: scale(0.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
transform-origin: right center;
}
}
.zoomOutRight {
-webkit-animation-name: zoomOutRight;
animation-name: zoomOutRight;
}
@-webkit-keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomOutUp {
-webkit-animation-name: zoomOutUp;
animation-name: zoomOutUp;
}
@-webkit-keyframes slideInDown {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes slideInDown {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.slideInDown {
-webkit-animation-name: slideInDown;
animation-name: slideInDown;
}
@-webkit-keyframes slideInLeft {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes slideInLeft {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.slideInLeft {
-webkit-animation-name: slideInLeft;
animation-name: slideInLeft;
}
@-webkit-keyframes slideInRight {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes slideInRight {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.slideInRight {
-webkit-animation-name: slideInRight;
animation-name: slideInRight;
}
@-webkit-keyframes slideInUp {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes slideInUp {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.slideInUp {
-webkit-animation-name: slideInUp;
animation-name: slideInUp;
}
@-webkit-keyframes slideOutDown {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes slideOutDown {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
.slideOutDown {
-webkit-animation-name: slideOutDown;
animation-name: slideOutDown;
}
@-webkit-keyframes slideOutLeft {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes slideOutLeft {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
.slideOutLeft {
-webkit-animation-name: slideOutLeft;
animation-name: slideOutLeft;
}
@-webkit-keyframes slideOutRight {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes slideOutRight {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
.slideOutRight {
-webkit-animation-name: slideOutRight;
animation-name: slideOutRight;
}
@-webkit-keyframes slideOutUp {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes slideOutUp {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
.slideOutUp {
-webkit-animation-name: slideOutUp;
animation-name: slideOutUp;
}
.animated {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.animated.infinite {
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.animated.delay-1s {
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.animated.delay-2s {
-webkit-animation-delay: 2s;
animation-delay: 2s;
}
.animated.delay-3s {
-webkit-animation-delay: 3s;
animation-delay: 3s;
}
.animated.delay-4s {
-webkit-animation-delay: 4s;
animation-delay: 4s;
}
.animated.delay-5s {
-webkit-animation-delay: 5s;
animation-delay: 5s;
}
.animated.fast {
-webkit-animation-duration: 800ms;
animation-duration: 800ms;
}
.animated.faster {
-webkit-animation-duration: 500ms;
animation-duration: 500ms;
}
.animated.slow {
-webkit-animation-duration: 2s;
animation-duration: 2s;
}
.animated.slower {
-webkit-animation-duration: 3s;
animation-duration: 3s;
}
@media (print), (prefers-reduced-motion: reduce) {
.animated {
-webkit-animation-duration: 1ms !important;
animation-duration: 1ms !important;
-webkit-transition-duration: 1ms !important;
transition-duration: 1ms !important;
-webkit-animation-iteration-count: 1 !important;
animation-iteration-count: 1 !important;
}
}
css/normalize.css 0 → 100644
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/
html {
line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
}
/* Sections
========================================================================== */
/**
* Remove the margin in all browsers.
*/
body {
margin: 0;
}
/**
* Render the `main` element consistently in IE.
*/
main {
display: block;
}
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/* Grouping content
========================================================================== */
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/* Text-level semantics
========================================================================== */
/**
* Remove the gray background on active links in IE 10.
*/
a {
background-color: transparent;
}
/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none; /* 1 */
text-decoration: underline; /* 2 */
text-decoration: underline dotted; /* 2 */
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Remove the border on images inside links in IE 10.
*/
img {
border-style: none;
}
/* Forms
========================================================================== */
/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-size: 100%; /* 1 */
line-height: 1.15; /* 1 */
margin: 0; /* 2 */
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input { /* 1 */
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select { /* 1 */
text-transform: none;
}
/**
* Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Correct the padding in Firefox.
*/
fieldset {
padding: 0.35em 0.75em 0.625em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
box-sizing: border-box; /* 1 */
color: inherit; /* 2 */
display: table; /* 1 */
max-width: 100%; /* 1 */
padding: 0; /* 3 */
white-space: normal; /* 1 */
}
/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
vertical-align: baseline;
}
/**
* Remove the default vertical scrollbar in IE 10+.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/
[type="checkbox"],
[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type="search"] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}
/**
* Remove the inner padding in Chrome and Safari on macOS.
*/
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}
/* Interactive
========================================================================== */
/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/
details {
display: block;
}
/*
* Add the correct display in all browsers.
*/
summary {
display: list-item;
}
/* Misc
========================================================================== */
/**
* Add the correct display in IE 10+.
*/
template {
display: none;
}
/**
* Add the correct display in IE 10.
*/
[hidden] {
display: none;
}
css/style.css 0 → 100644
*{
box-sizing: border-box;
}
body{
font-family: "Roboto", sans-serif;
padding-top: 44px;
}
.container{
max-width: 1200px;
margin: auto;
}
header{
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 35px;
vertical-align: middle;
}
.input{
font-size: 16px;
line-height: 24px;
background: #FFFFFF;
border: 1px solid #D9D9D9;
padding: 8px;
padding-left: 35px;
background-repeat: no-repeat;
background-position: left 11px center;
border-radius: 2px;
}
.input-address{
flex: 0.8;
background-image: url(../images/home.svg);
}
.input-search{
width: 306px;
background-image: url(../images/search.svg);
margin-left: auto;
}
.button{
padding: 8px 16px;
background: #FFFFFF;
border: 1px solid #D9D9D9;
box-sizing: border-box;
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.0015);
border-radius: 2px;
color: #595959;
font-size: 16px;
line-height: 24px;
}
.button-primary{
background-color: #1890FF;
color:white;
border:1px solid 1890FF;
margin-right: 10px;
}
.card-buttons{
margin-top: 15px;
}
.button-icon{
margin-right: 6px;
vertical-align: middle;
}
.button-text{
vertical-align: middle;
}
.button-card-text{
margin-right: 10px;
}
.buttons{
display: flex;
align-items: center;
}
.welcome-message{
background-color: red;
display: flex;
}
.promo{
box-shadow: 0px 7px 12px rgba(158, 158, 163, 0.1);
background: #FFF1B8 url(../images/icon-blue.png) no-repeat top -110px right -70px / 600px;
border-radius: 10px;
padding: 67px 70px;
margin-bottom: 56px;
}
.promo-title{
font-style: normal;
font-weight: bold;
font-weight: bold;
font-size: 39px;
line-height: 46px;
color: #302C34;
}
.promo-text{
font-style: normal;
font-weight: normal;
max-width: 530px;
font-size: 24px;
line-height: 28px;
color: #302C34;
}
.section-header{
display: flex;
align-items: center;
margin-bottom: 44px;
}
.section-item{
font-style: normal;
font-weight: bold;
font-size: 36px;
line-height: 42px;
margin: 0;
}
.section-title{
margin-right: 30px;
}
.cards{
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: space-between;
}
.card{
background: #FFFFFF;
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.05);
border-radius: 7px;
overflow: hidden;
margin-bottom: 30px;
flex-basis: 32%;
text-decoration: none;
max-width: 384px;
max-height: 416px;
}
.card-image{
width: 384px;
height: 250px;
object-fit: cover; /*auticuting*/
}
.card-text{
padding: 20px 24px 35px 24px;
}
.card-header{
display: flex;
align-items: center;
justify-content: space-between;
}
.card-title{
margin: 0;
font-style: normal;
font-weight: bold;
font-size: 24px;
line-height: 32px;
}
.card-title-tag{
font-weight: 400;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.card-buttons{
display: flex;
align-items: center;
}
.card-info{
display: flex;
align-items: center;
flex-wrap: wrap;
}
.card-price{
font-weight: bold;
font-size: 20px;
line-height: 32px;
margin-left: 30px;
}
.rating{
margin-right: 26px;
font-style: normal;
font-weight: bold;
font-size: 18px;
line-height: 32px;
color: #FFC107;
}
.price,
.category{
font-style: normal;
font-weight: normal;
font-size: 18px;
line-height: 32px;
color: #8C8C8C;
}
.ingredients{
font-style: normal;
font-weight: normal;
font-size: 18px;
line-height: 21px;
color: #8C8C8C;
overflow: hidden;
text-overflow: ellipsis;
}
.category{
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
max-width: 150px;
}
.price{
margin-right: 10px;
}
.price::after{
content: "";
width: 5px;
height: 5px;
background-color: #8C8C8C;
display: inline-block;
vertical-align: middle;
border-radius: 50%;
margin-left: 10px;
}
.main{
background: linear-gradient(180deg, rgba(245, 245, 245, 0) 1.04%, #F5F5F5 100%);
}
footer{
padding: 60px 0;
}
.footer-block{
display: flex;
align-items: center;
justify-content: space-between;
}
.footer-link{
display: inline;
text-decoration: none;
font-size: 18px;
line-height: 21px;
color: #595959;
font-style: normal;
font-weight: normal;
}
.footer-link:not(:last-child){
margin-right: 15px;
}
.footer-nav{
margin-right: auto;
margin-left: 35px;
}
.social-links{
display: flex;
align-items: center;
}
.social-link:not(:last-child){
margin-right: 21px;
}
.login{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.4);
display: none;
}
.is-open{
display: flex;
}
.login-dialog{
width: 90%;
max-width: 480px;
background: #FFFFFF;
border-radius: 5px;
margin: auto;
padding: 40px 45px;
display: wrap;
}
.login-close-b{
max-width: 100%;
display: flex;
justify-content: flex-end;
}
.login-form{
display: flex;
justify-content: center;
align-items: center;
}
input[type="email"], textarea{
background-color: #F3EFF2;
font-size: medium;
}
input[type="password"], textarea{
background-color: #F3EFF2;
font-size: medium;
}
input[type="submit"], textarea{
background-color: #F3EFF2;
font-size: medium;
}
.register{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.4);
display: none;
}
.register-dialog{
width: 90%;
max-width: 480px;
background: #FFFFFF;
border-radius: 5px;
margin: auto;
padding: 40px 45px;
}
.is-close{
display: flex;
}
@media(max-width: 1366px){
.container{
max-width: 960px;
}
.promo{
background-size: 750px;
background-position: center right -200px;
padding: 50px;
}
.rating{
margin-right: 15px;
}
}
@media(max-width: 992px){
.container{
max-width: 750px;
}
.promo{
background-size: 500px;
background-position: center right -200px;
padding: 50px;
}
.promo-text{
font-size: 18px;
max-width: 400px;
}
.card{
flex-basis: 49%;
}
.footer-link{
font-size: 16px;
}
}
@media(max-width: 768px){
.container{
max-width: 560px;
}
.card .rating{
flex-basis: 100%;
}
.card-info{
flex-wrap: wrap;
}
.card-title{
font-size: 18px;
}
.promo{
background-size: 400px;
background-position: bottom 55px right -200px;
}
.promo-title{
font-size: 24px;
line-height: 1.4;
}
.promo-text{
margin-top: 0;
}
.button{
font-size: 12px;
line-height: 14px;
}
}
@media(max-width: 578px){
.button{
min-height: 40px;
text-align: center;
}
.basket{
margin-bottom: 20px;
}
.container{
max-width: 90%;
}
header{
flex-wrap: wrap;
}
.input-address{
order: 5;
margin-top: 15px;
flex: 1%;
/* flex-basis: 100%; */
}
.promo{
background-image: none;
}
.promo-title{
margin-bottom: 10px;
}
.section-title{
font-size: 20px;
}
.card{
flex-basis: 100%;
}
.card-image{
width: 100%;
}
.footer{
padding: 30px;
}
.footer-block{
align-items: flex-start;
}
.footer-nav{
order:0;
margin-left: 0;
display: flex;
flex-direction: column;
margin-right: 0;
}
.footer-logo{
order:1;
margin-right: 15px;
}
.social-links{
order:2;
}
}
@media(max-width: 480px){
.button-text{
display: none;
}
.button{
min-height: 40px;
}
.button-icon{
margin: 0;
}
.promo{
padding: 20px;
}
.section-header{
flex-wrap: wrap;
}
.footer-block{
flex-wrap: wrap;
flex-direction: column;
align-items: center;
}
.footer-logo{
order:0;
margin-bottom: 20px;
}
.footer-nav{
margin-bottom: 20px;
text-align: center;
}
.footer-link:not(:last-child){
margin-right: 0;
}
}
\ No newline at end of file
images/face.svg 0 → 100644
<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M22.8228 0.314819H4.07275C2.34932 0.314819 0.947754 1.71638 0.947754 3.43982V22.1898C0.947754 23.9133 2.34932 25.3148 4.07275 25.3148H22.8228C24.5462 25.3148 25.9478 23.9133 25.9478 22.1898V3.43982C25.9478 1.71638 24.5462 0.314819 22.8228 0.314819Z" fill="#1976D2"/>
<path d="M22.0415 12.8148H18.1353V9.68982C18.1353 8.82732 18.8353 8.90857 19.6978 8.90857H21.2603V5.00232H18.1353C15.5462 5.00232 13.4478 7.10076 13.4478 9.68982V12.8148H10.3228V16.7211H13.4478V25.3148H18.1353V16.7211H20.479L22.0415 12.8148Z" fill="#FAFAFA"/>
</svg>
images/home.svg 0 → 100644
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15.6377 7.87727L8.84548 1.0886L8.39021 0.633327C8.28648 0.530278 8.14619 0.472443 7.99997 0.472443C7.85376 0.472443 7.71347 0.530278 7.60974 0.633327L0.36228 7.87727C0.255987 7.98315 0.171982 8.10925 0.115223 8.24813C0.0584644 8.38701 0.0301024 8.53585 0.0318111 8.68587C0.0388424 9.30462 0.553881 9.79856 1.17263 9.79856H1.9197V15.5238H14.0802V9.79856H14.8431C15.1437 9.79856 15.4267 9.68079 15.6394 9.46809C15.7442 9.3637 15.8271 9.23957 15.8836 9.10288C15.94 8.9662 15.9687 8.81968 15.9681 8.6718C15.9681 8.37298 15.8504 8.08997 15.6377 7.87727V7.87727ZM8.98435 14.2581H7.0156V10.6722H8.98435V14.2581ZM12.8146 8.53294V14.2581H10.1093V10.2503C10.1093 9.86184 9.7947 9.54719 9.40622 9.54719H6.59372C6.20525 9.54719 5.8906 9.86184 5.8906 10.2503V14.2581H3.18533V8.53294H1.49783L8.00173 2.0343L8.40779 2.44036L14.5039 8.53294H12.8146Z" fill="#8C8C8C"/>
</svg>
images/inst.svg 0 → 100644
<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18.1353 0.314819H8.76025C4.44619 0.314819 0.947754 3.81326 0.947754 8.12732V17.5023C0.947754 21.8164 4.44619 25.3148 8.76025 25.3148H18.1353C22.4493 25.3148 25.9478 21.8164 25.9478 17.5023V8.12732C25.9478 3.81326 22.4493 0.314819 18.1353 0.314819ZM23.604 17.5023C23.604 20.5179 21.1509 22.9711 18.1353 22.9711H8.76025C5.74463 22.9711 3.2915 20.5179 3.2915 17.5023V8.12732C3.2915 5.11169 5.74463 2.65857 8.76025 2.65857H18.1353C21.1509 2.65857 23.604 5.11169 23.604 8.12732V17.5023Z" fill="url(#paint0_linear)"/>
<path d="M13.4478 6.56482C9.99619 6.56482 7.19775 9.36326 7.19775 12.8148C7.19775 16.2664 9.99619 19.0648 13.4478 19.0648C16.8993 19.0648 19.6978 16.2664 19.6978 12.8148C19.6978 9.36326 16.8993 6.56482 13.4478 6.56482ZM13.4478 16.7211C11.2946 16.7211 9.5415 14.9679 9.5415 12.8148C9.5415 10.6601 11.2946 8.90857 13.4478 8.90857C15.6009 8.90857 17.354 10.6601 17.354 12.8148C17.354 14.9679 15.6009 16.7211 13.4478 16.7211Z" fill="url(#paint1_linear)"/>
<path d="M20.1666 6.92892C20.6265 6.92892 20.9994 6.55606 20.9994 6.09611C20.9994 5.63617 20.6265 5.26331 20.1666 5.26331C19.7066 5.26331 19.3337 5.63617 19.3337 6.09611C19.3337 6.55606 19.7066 6.92892 20.1666 6.92892Z" fill="url(#paint2_linear)"/>
<defs>
<linearGradient id="paint0_linear" x1="3.23627" y1="23.0265" x2="23.6592" y2="2.60318" gradientUnits="userSpaceOnUse">
<stop stop-color="#FFC107"/>
<stop offset="0.507" stop-color="#F44336"/>
<stop offset="0.99" stop-color="#9C27B0"/>
</linearGradient>
<linearGradient id="paint1_linear" x1="9.02846" y1="17.2341" x2="17.8671" y2="8.39552" gradientUnits="userSpaceOnUse">
<stop stop-color="#FFC107"/>
<stop offset="0.507" stop-color="#F44336"/>
<stop offset="0.99" stop-color="#9C27B0"/>
</linearGradient>
<linearGradient id="paint2_linear" x1="19.5777" y1="6.6851" x2="20.7554" y2="5.50728" gradientUnits="userSpaceOnUse">
<stop stop-color="#FFC107"/>
<stop offset="0.507" stop-color="#F44336"/>
<stop offset="0.99" stop-color="#9C27B0"/>
</linearGradient>
</defs>
</svg>
images/ll.png 0 → 100644
<svg width="101" height="37" viewBox="0 0 101 37" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.2787 6.56271H10.1395V7.6323H12.2787V6.56271Z" fill="black"/>
<path d="M12.2787 8.70187H10.1395V9.77146H12.2787V8.70187Z" fill="black"/>
<path d="M12.2787 10.841H10.1395V11.9106H12.2787V10.841Z" fill="black"/>
<path d="M19.7658 7.0975H18.6962C18.6959 7.38107 18.5831 7.65293 18.3826 7.85344C18.1821 8.05396 17.9102 8.16675 17.6266 8.16709V9.23667C18.1938 9.23603 18.7375 9.01045 19.1386 8.60942C19.5396 8.20839 19.7652 7.66465 19.7658 7.0975Z" fill="black"/>
<path d="M22.4398 9.77146V8.70188C22.1563 8.70154 21.8844 8.58875 21.6839 8.38823C21.4834 8.18772 21.3706 7.91586 21.3702 7.63229H20.3007C20.3013 8.19944 20.5269 8.74318 20.9279 9.14421C21.3289 9.54524 21.8727 9.77082 22.4398 9.77146Z" fill="black"/>
<path d="M28.0545 33.0505C27.1517 33.2146 26.2308 33.2557 25.3169 33.1728L16.0182 32.3274C15.8687 32.3138 15.7303 32.2431 15.6316 32.13C15.5329 32.0169 15.4816 31.8701 15.4884 31.7202C15.4952 31.5703 15.5595 31.4287 15.6679 31.325C15.7764 31.2212 15.9207 31.1633 16.0707 31.1632H23.2419C23.5965 31.1626 23.9365 31.0214 24.1871 30.7705C24.4378 30.5196 24.5787 30.1796 24.5789 29.8249V29.8124C24.5783 29.5314 24.4871 29.2581 24.3189 29.033L23.0944 27.401C23.0168 27.2972 22.9748 27.1711 22.9745 27.0415V26.9497C22.9745 26.8311 23.0097 26.7152 23.0756 26.6166C23.1414 26.518 23.2351 26.4411 23.3447 26.3957C23.4542 26.3503 23.5748 26.3385 23.6911 26.3616C23.8075 26.3847 23.9143 26.4418 23.9982 26.5257L26.3399 28.8674C26.3896 28.917 26.4485 28.9564 26.5134 28.9833C26.5783 29.0102 26.6478 29.024 26.7181 29.024H32.6008V27.9544H26.9395L24.7546 25.7693C24.6996 25.7145 24.6409 25.6634 24.5789 25.6166V13.515C24.5789 13.3732 24.5225 13.2372 24.4223 13.1369C24.322 13.0366 24.1859 12.9802 24.0441 12.9802H23.5093V11.3759H24.3115C24.8079 11.3759 25.284 11.1787 25.635 10.8276C25.9861 10.4766 26.1833 10.0005 26.1833 9.50409C26.1833 9.00766 25.9861 8.53157 25.635 8.18054C25.284 7.82952 24.8079 7.63231 24.3115 7.63231H24.2562C24.524 7.31148 24.6616 6.90191 24.6421 6.48449C24.6225 6.06708 24.4471 5.67218 24.1505 5.37783C23.8539 5.08347 23.4576 4.91105 23.0401 4.89464C22.6225 4.87823 22.214 5.01902 21.8952 5.28919C21.8446 4.75947 21.5984 4.26763 21.2047 3.9097C20.8109 3.55176 20.2979 3.35343 19.7658 3.35343C19.2336 3.35343 18.7206 3.55176 18.3269 3.9097C17.9331 4.26763 17.6869 4.75947 17.6363 5.28919C17.3175 5.01902 16.909 4.87823 16.4914 4.89464C16.0739 4.91105 15.6777 5.08347 15.3811 5.37783C15.0845 5.67218 14.909 6.06708 14.8895 6.48449C14.8699 6.90191 15.0076 7.31148 15.2753 7.63231H15.22C14.9425 7.63206 14.6684 7.69389 14.4178 7.81327V5.49315C14.4178 4.64213 14.0798 3.82597 13.478 3.22422C12.8763 2.62246 12.0601 2.28439 11.2091 2.28439C10.3581 2.28439 9.54191 2.62246 8.94016 3.22422C8.3384 3.82597 8.00033 4.64213 8.00033 5.49315V12.9802H7.46554C7.32371 12.9802 7.18768 13.0366 7.08739 13.1369C6.98709 13.2372 6.93075 13.3732 6.93075 13.515V15.8666L4.05898 18.3282H0.513245V19.3977H4.25679C4.38444 19.3977 4.50788 19.3521 4.6048 19.269L7.70446 16.6121C8.02312 16.3392 8.42885 16.1891 8.84845 16.189C8.89225 16.189 8.93507 16.202 8.97149 16.2263C9.00791 16.2507 9.03629 16.2853 9.05305 16.3257C9.06981 16.3662 9.07419 16.4107 9.06564 16.4537C9.05709 16.4967 9.03599 16.5361 9.00501 16.5671L7.08738 18.4848C7.01258 18.5596 6.96164 18.6549 6.94101 18.7586C6.92037 18.8624 6.93096 18.9699 6.97144 19.0676C7.01192 19.1653 7.08047 19.2489 7.16842 19.3076C7.25637 19.3664 7.35977 19.3977 7.46554 19.3977H13.0809C13.1518 19.3977 13.2198 19.4259 13.2699 19.4761C13.3201 19.5262 13.3483 19.5942 13.3483 19.6651C13.3483 19.7361 13.3201 19.8041 13.2699 19.8542C13.2198 19.9044 13.1518 19.9325 13.0809 19.9325H9.06992C8.92808 19.9325 8.79206 19.9889 8.69176 20.0892C8.59147 20.1895 8.53513 20.3255 8.53513 20.4673C8.53513 20.6092 8.59147 20.7452 8.69176 20.8455C8.79206 20.9458 8.92808 21.0021 9.06992 21.0021H14.6852C14.7562 21.0021 14.8242 21.0303 14.8743 21.0804C14.9245 21.1306 14.9526 21.1986 14.9526 21.2695C14.9526 21.3404 14.9245 21.4084 14.8743 21.4586C14.8242 21.5087 14.7562 21.5369 14.6852 21.5369H9.06992C8.92808 21.5369 8.79206 21.5933 8.69176 21.6935C8.59147 21.7938 8.53513 21.9299 8.53513 22.0717C8.53513 22.2135 8.59147 22.3496 8.69176 22.4499C8.79206 22.5501 8.92808 22.6065 9.06992 22.6065H13.6157C13.6866 22.6065 13.7546 22.6347 13.8047 22.6848C13.8549 22.735 13.883 22.803 13.883 22.8739C13.883 22.9448 13.8549 23.0128 13.8047 23.063C13.7546 23.1131 13.6866 23.1413 13.6157 23.1413H9.06992C8.92808 23.1413 8.79206 23.1976 8.69176 23.2979C8.59147 23.3982 8.53513 23.5342 8.53513 23.6761C8.53513 23.8179 8.59147 23.9539 8.69176 24.0542C8.79206 24.1545 8.92808 24.2109 9.06992 24.2109H11.7105C11.7187 24.2113 11.7264 24.2147 11.7323 24.2205C11.7381 24.2263 11.7417 24.234 11.7422 24.2422C11.7427 24.2504 11.7401 24.2585 11.735 24.265C11.7299 24.2714 11.7226 24.2758 11.7145 24.2772L8.04218 24.7362L4.40386 23.6967C4.35603 23.683 4.30653 23.6761 4.25679 23.6761H0.513245V24.7457H4.18192L6.93075 25.5311V30.6284H6.93202C6.93151 30.6986 6.94496 30.7683 6.97158 30.8333C6.9982 30.8984 7.03745 30.9575 7.08708 31.0072C7.13671 31.0569 7.19571 31.0963 7.26068 31.1231C7.32564 31.1499 7.39528 31.1635 7.46554 31.1632H14.5248C14.4348 31.4014 14.4011 31.6573 14.4263 31.9107C14.4515 32.1642 14.535 32.4084 14.6702 32.6242C14.8055 32.8401 14.9887 33.0217 15.2058 33.155C15.4228 33.2883 15.6677 33.3696 15.9214 33.3926L25.22 34.2382C25.5584 34.2691 25.8973 34.2845 26.2367 34.2844C26.9105 34.2844 27.5829 34.2238 28.2458 34.1033L32.6964 33.294L32.5051 32.2417L28.0545 33.0505ZM13.3483 10.8411C13.3484 10.6993 13.4048 10.5633 13.5051 10.4631C13.6053 10.3628 13.7413 10.3064 13.883 10.3063H14.9526C15.5198 10.3069 16.0635 10.5325 16.4645 10.9335C16.8656 11.3346 17.0912 11.8783 17.0918 12.4454C17.0916 12.5872 17.0352 12.7232 16.935 12.8234C16.8347 12.9237 16.6988 12.9801 16.557 12.9802H15.4874C14.9203 12.9796 14.3765 12.754 13.9755 12.353C13.5745 11.952 13.3489 11.4082 13.3483 10.8411ZM15.22 8.7019H16.557C16.6628 8.7019 16.7662 8.67054 16.8541 8.61178C16.9421 8.55301 17.0106 8.46949 17.0511 8.37176C17.0916 8.27404 17.1022 8.16651 17.0815 8.06277C17.0609 7.95903 17.01 7.86373 16.9352 7.78894L16.133 6.98675C16.0773 6.93107 16.0331 6.86496 16.003 6.79221C15.9729 6.71946 15.9573 6.64148 15.9573 6.56273C15.9573 6.48398 15.9729 6.406 16.003 6.33325C16.0331 6.2605 16.0773 6.19439 16.133 6.13871C16.1887 6.08302 16.2548 6.03885 16.3275 6.00872C16.4003 5.97858 16.4783 5.96307 16.557 5.96307C16.6358 5.96307 16.7137 5.97858 16.7865 6.00872C16.8592 6.03885 16.9253 6.08302 16.981 6.13871L17.7832 6.94089C17.858 7.01569 17.9533 7.06663 18.057 7.08726C18.1608 7.1079 18.2683 7.09731 18.366 7.05683C18.4638 7.01635 18.5473 6.9478 18.6061 6.85985C18.6648 6.7719 18.6962 6.6685 18.6962 6.56273V5.49315C18.6962 5.20947 18.8089 4.93742 19.0094 4.73684C19.21 4.53625 19.4821 4.42356 19.7658 4.42356C20.0494 4.42356 20.3215 4.53625 20.5221 4.73684C20.7227 4.93742 20.8353 5.20947 20.8353 5.49315V6.56273C20.8353 6.6685 20.8667 6.7719 20.9255 6.85985C20.9842 6.9478 21.0678 7.01635 21.1655 7.05683C21.2632 7.09731 21.3707 7.1079 21.4745 7.08726C21.5782 7.06663 21.6735 7.01569 21.7483 6.94089L22.5505 6.13871C22.6062 6.08302 22.6723 6.03885 22.745 6.00872C22.8178 5.97858 22.8958 5.96307 22.9745 5.96307C23.0533 5.96307 23.1312 5.97858 23.204 6.00872C23.2767 6.03885 23.3428 6.08302 23.3985 6.13871C23.4542 6.19439 23.4984 6.2605 23.5285 6.33325C23.5587 6.406 23.5742 6.48398 23.5742 6.56273C23.5742 6.64148 23.5587 6.71946 23.5285 6.79221C23.4984 6.86496 23.4542 6.93107 23.3985 6.98675L22.5963 7.78894C22.5215 7.86373 22.4706 7.95903 22.45 8.06277C22.4293 8.16651 22.4399 8.27404 22.4804 8.37176C22.5209 8.46949 22.5894 8.55301 22.6774 8.61178C22.7653 8.67054 22.8687 8.7019 22.9745 8.7019H24.3115C24.5242 8.7019 24.7283 8.78641 24.8787 8.93685C25.0292 9.08729 25.1137 9.29133 25.1137 9.50409C25.1137 9.71684 25.0292 9.92088 24.8787 10.0713C24.7283 10.2218 24.5242 10.3063 24.3115 10.3063H22.9745C22.8327 10.3063 22.6966 10.3626 22.5964 10.4629C22.4961 10.5632 22.4397 10.6992 22.4397 10.8411V11.1259C21.8157 10.5655 20.9967 10.2723 20.1588 10.3094C19.3208 10.3466 18.531 10.711 17.959 11.3245C17.7298 10.7119 17.3192 10.1839 16.782 9.81081C16.2448 9.43776 15.6066 9.23747 14.9526 9.23669H14.4646C14.52 9.08049 14.6223 8.94524 14.7575 8.84949C14.8928 8.75374 15.0543 8.70218 15.22 8.7019ZM22.372 12.9802H18.2291C18.3475 12.5209 18.6153 12.1139 18.9903 11.8233C19.3652 11.5327 19.8262 11.375 20.3006 11.375C20.7749 11.375 21.2359 11.5327 21.6108 11.8233C21.9858 12.1139 22.2536 12.5209 22.372 12.9802ZM9.06992 5.49315C9.06992 4.9258 9.29529 4.3817 9.69647 3.98053C10.0976 3.57935 10.6417 3.35398 11.2091 3.35398C11.7764 3.35398 12.3205 3.57935 12.7217 3.98053C13.1229 4.3817 13.3483 4.9258 13.3483 5.49315V9.32867C13.0357 9.43958 12.7651 9.64448 12.5736 9.91525C12.3821 10.186 12.2791 10.5094 12.2787 10.8411C12.2781 11.6309 12.5701 12.393 13.0983 12.9802H9.06992V5.49315ZM10.1395 14.0498H11.2091V18.3282H10.1395V14.0498ZM8.84845 15.1194C8.56074 15.1195 8.27474 15.1636 8.00033 15.25V14.0498H9.06992V15.1398C8.99682 15.1267 8.92272 15.1198 8.84845 15.1194ZM9.06992 18.0149V18.3282H8.7566L9.06992 18.0149ZM10.1395 25.552L11.2091 25.4183V29.3372L10.1395 28.2676V25.552ZM8.06665 25.8111L9.06992 25.6857V28.2677L8.00033 29.3373V25.8152C8.0225 25.8152 8.04465 25.8138 8.06665 25.8111ZM8.7566 30.0936L9.60471 29.2455L10.4528 30.0936H8.7566ZM12.2787 25.1879C12.4415 25.09 12.5763 24.9516 12.67 24.7863C12.7637 24.6209 12.8131 24.4342 12.8135 24.2442C12.8135 24.233 12.8135 24.2219 12.8129 24.2107H13.6157C13.8157 24.2106 14.0131 24.1657 14.1935 24.0792C14.3738 23.9927 14.5325 23.8668 14.6578 23.7109C14.7831 23.5549 14.8718 23.3729 14.9174 23.1781C14.963 22.9834 14.9643 22.7809 14.9213 22.5855C15.2502 22.5265 15.545 22.3466 15.7478 22.0811C15.9506 21.8156 16.0467 21.4838 16.0171 21.151C15.9875 20.8182 15.8343 20.5086 15.5878 20.2831C15.3413 20.0576 15.0193 19.9325 14.6852 19.9325H14.3911C14.4306 19.7383 14.4264 19.5377 14.3789 19.3452C14.3313 19.1528 14.2416 18.9733 14.1162 18.8198C13.9909 18.6663 13.8329 18.5425 13.6539 18.4575C13.4748 18.3725 13.2791 18.3283 13.0809 18.3282H12.2787V14.0498H23.5093V25.2821C23.0784 25.2994 22.6708 25.4825 22.3718 25.7933C22.0728 26.1041 21.9055 26.5185 21.9049 26.9497V27.0415C21.9057 27.4026 22.0229 27.7538 22.2392 28.0431L23.4636 29.6748C23.4933 29.7146 23.5094 29.7628 23.5095 29.8124V29.8249C23.5096 29.896 23.4815 29.9642 23.4313 30.0146C23.3811 30.065 23.313 30.0934 23.2419 30.0936H12.2787V25.1879Z" fill="black"/>
<path d="M45.2378 14.2844V3.62033H48.248C49.1758 3.62033 49.9961 3.82541 50.709 4.23557C51.4219 4.64572 51.9712 5.22922 52.3569 5.98605C52.7476 6.74289 52.9453 7.61203 52.9502 8.59348V9.27463C52.9502 10.2805 52.7549 11.1618 52.3643 11.9187C51.9785 12.6755 51.4243 13.2566 50.7017 13.6618C49.9839 14.0671 49.1465 14.2746 48.1895 14.2844H45.2378ZM46.644 4.77756V13.1345H48.1235C49.2075 13.1345 50.0498 12.7976 50.6504 12.1237C51.2559 11.4499 51.5586 10.4904 51.5586 9.24533V8.62277C51.5586 7.41183 51.2729 6.47189 50.7017 5.80295C50.1353 5.12912 49.3296 4.78732 48.2847 4.77756H46.644ZM58.1577 14.4309C57.0835 14.4309 56.2095 14.0793 55.5356 13.3762C54.8618 12.6682 54.5249 11.7234 54.5249 10.5417V10.2927C54.5249 9.50656 54.6738 8.80588 54.9717 8.19064C55.2744 7.57053 55.6943 7.08713 56.2314 6.74045C56.7734 6.38889 57.3594 6.2131 57.9893 6.2131C59.0195 6.2131 59.8203 6.55246 60.3916 7.23117C60.9629 7.90988 61.2485 8.88156 61.2485 10.1462V10.7102H55.8799C55.8994 11.4914 56.1265 12.1237 56.561 12.6071C57.0005 13.0857 57.5571 13.3249 58.231 13.3249C58.7095 13.3249 59.1147 13.2273 59.4468 13.032C59.7788 12.8366 60.0693 12.5779 60.3184 12.2556L61.146 12.9001C60.4819 13.9206 59.4858 14.4309 58.1577 14.4309ZM57.9893 7.32639C57.4424 7.32639 56.9834 7.52658 56.6123 7.92697C56.2412 8.32248 56.0117 8.87912 55.9238 9.59689H59.8936V9.49435C59.8545 8.80588 59.6689 8.27365 59.3369 7.89767C59.0049 7.51682 58.5557 7.32639 57.9893 7.32639ZM64.2954 14.2844H62.9404V3.03439H64.2954V14.2844ZM67.9429 14.2844H66.5879V6.35959H67.9429V14.2844ZM66.478 4.25754C66.478 4.03781 66.5439 3.85226 66.6758 3.7009C66.8125 3.54953 67.0127 3.47385 67.2764 3.47385C67.54 3.47385 67.7402 3.54953 67.877 3.7009C68.0137 3.85226 68.082 4.03781 68.082 4.25754C68.082 4.47726 68.0137 4.66037 67.877 4.80685C67.7402 4.95334 67.54 5.02658 67.2764 5.02658C67.0127 5.02658 66.8125 4.95334 66.6758 4.80685C66.5439 4.66037 66.478 4.47726 66.478 4.25754ZM72.7329 12.446L74.6958 6.35959H76.0801L73.2383 14.2844H72.2056L69.3345 6.35959H70.7188L72.7329 12.446ZM80.5698 14.4309C79.4956 14.4309 78.6216 14.0793 77.9478 13.3762C77.2739 12.6682 76.937 11.7234 76.937 10.5417V10.2927C76.937 9.50656 77.0859 8.80588 77.3838 8.19064C77.6865 7.57053 78.1064 7.08713 78.6436 6.74045C79.1855 6.38889 79.7715 6.2131 80.4014 6.2131C81.4316 6.2131 82.2324 6.55246 82.8037 7.23117C83.375 7.90988 83.6606 8.88156 83.6606 10.1462V10.7102H78.292C78.3115 11.4914 78.5386 12.1237 78.9731 12.6071C79.4126 13.0857 79.9692 13.3249 80.6431 13.3249C81.1216 13.3249 81.5269 13.2273 81.8589 13.032C82.1909 12.8366 82.4814 12.5779 82.7305 12.2556L83.5581 12.9001C82.894 13.9206 81.8979 14.4309 80.5698 14.4309ZM80.4014 7.32639C79.8545 7.32639 79.3955 7.52658 79.0244 7.92697C78.6533 8.32248 78.4238 8.87912 78.3359 9.59689H82.3057V9.49435C82.2666 8.80588 82.0811 8.27365 81.749 7.89767C81.417 7.51682 80.9678 7.32639 80.4014 7.32639ZM89.0659 7.57541C88.8608 7.54123 88.6387 7.52414 88.3994 7.52414C87.5107 7.52414 86.9077 7.90256 86.5903 8.65939V14.2844H85.2354V6.35959H86.5537L86.5757 7.27512C87.02 6.56711 87.6499 6.2131 88.4653 6.2131C88.729 6.2131 88.9292 6.24728 89.0659 6.31564V7.57541ZM93.043 12.2995L94.8887 6.35959H96.3389L93.1528 15.5075C92.6597 16.8259 91.876 17.4851 90.8018 17.4851L90.5454 17.4631L90.04 17.3679V16.2693L90.4062 16.2986C90.8652 16.2986 91.2217 16.2058 91.4756 16.0202C91.7344 15.8347 91.9468 15.4953 92.1128 15.0022L92.4131 14.1965L89.5859 6.35959H91.0654L93.043 12.2995ZM51.1191 27.5749H46.644V32.2844H45.2378V21.6203H51.8442V22.7776H46.644V26.425H51.1191V27.5749ZM52.7964 28.2487C52.7964 27.4724 52.9478 26.7741 53.2505 26.154C53.5581 25.5339 53.9829 25.0554 54.5249 24.7185C55.0718 24.3816 55.6943 24.2131 56.3926 24.2131C57.4717 24.2131 58.3433 24.5866 59.0073 25.3337C59.6763 26.0808 60.0107 27.0744 60.0107 28.3147V28.4099C60.0107 29.1814 59.8618 29.8747 59.564 30.49C59.271 31.1003 58.8486 31.5764 58.2969 31.9182C57.75 32.26 57.1201 32.4309 56.4072 32.4309C55.333 32.4309 54.4614 32.0573 53.7925 31.3103C53.1284 30.5632 52.7964 29.5744 52.7964 28.344V28.2487ZM54.1587 28.4099C54.1587 29.2888 54.3613 29.9944 54.7666 30.5266C55.1768 31.0588 55.7236 31.3249 56.4072 31.3249C57.0957 31.3249 57.6426 31.0564 58.0479 30.5193C58.4531 29.9773 58.6558 29.2204 58.6558 28.2487C58.6558 27.3796 58.4482 26.6765 58.0332 26.1394C57.623 25.5974 57.0762 25.3264 56.3926 25.3264C55.7236 25.3264 55.1841 25.5925 54.7739 26.1247C54.3638 26.657 54.1587 27.4187 54.1587 28.4099ZM61.3511 28.2487C61.3511 27.4724 61.5024 26.7741 61.8052 26.154C62.1128 25.5339 62.5376 25.0554 63.0796 24.7185C63.6265 24.3816 64.249 24.2131 64.9473 24.2131C66.0264 24.2131 66.8979 24.5866 67.562 25.3337C68.231 26.0808 68.5654 27.0744 68.5654 28.3147V28.4099C68.5654 29.1814 68.4165 29.8747 68.1187 30.49C67.8257 31.1003 67.4033 31.5764 66.8516 31.9182C66.3047 32.26 65.6748 32.4309 64.9619 32.4309C63.8877 32.4309 63.0161 32.0573 62.3472 31.3103C61.6831 30.5632 61.3511 29.5744 61.3511 28.344V28.2487ZM62.7134 28.4099C62.7134 29.2888 62.916 29.9944 63.3213 30.5266C63.7314 31.0588 64.2783 31.3249 64.9619 31.3249C65.6504 31.3249 66.1973 31.0564 66.6025 30.5193C67.0078 29.9773 67.2104 29.2204 67.2104 28.2487C67.2104 27.3796 67.0029 26.6765 66.5879 26.1394C66.1777 25.5974 65.6309 25.3264 64.9473 25.3264C64.2783 25.3264 63.7388 25.5925 63.3286 26.1247C62.9185 26.657 62.7134 27.4187 62.7134 28.4099ZM69.9351 28.2561C69.9351 27.0403 70.2231 26.0637 70.7993 25.3264C71.3755 24.5842 72.1299 24.2131 73.0625 24.2131C73.9902 24.2131 74.7251 24.5305 75.2671 25.1653V21.0344H76.6221V32.2844H75.377L75.311 31.4348C74.769 32.0988 74.0146 32.4309 73.0479 32.4309C72.1299 32.4309 71.3804 32.0549 70.7993 31.3029C70.2231 30.551 69.9351 29.5695 69.9351 28.3586V28.2561ZM71.29 28.4099C71.29 29.3083 71.4756 30.0114 71.8467 30.5193C72.2178 31.0271 72.7305 31.281 73.3848 31.281C74.2441 31.281 74.8716 30.8952 75.2671 30.1237V26.4836C74.8618 25.7365 74.2393 25.363 73.3994 25.363C72.7354 25.363 72.2178 25.6194 71.8467 26.132C71.4756 26.6447 71.29 27.404 71.29 28.4099Z" fill="black"/>
</svg>
images/logo.svg 0 → 100644
<svg width="101" height="37" viewBox="0 0 101 37" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.2787 6.56271H10.1395V7.6323H12.2787V6.56271Z" fill="black"/>
<path d="M12.2787 8.70187H10.1395V9.77146H12.2787V8.70187Z" fill="black"/>
<path d="M12.2787 10.841H10.1395V11.9106H12.2787V10.841Z" fill="black"/>
<path d="M19.7658 7.0975H18.6962C18.6959 7.38107 18.5831 7.65293 18.3826 7.85344C18.1821 8.05396 17.9102 8.16675 17.6266 8.16709V9.23667C18.1938 9.23603 18.7375 9.01045 19.1386 8.60942C19.5396 8.20839 19.7652 7.66465 19.7658 7.0975Z" fill="black"/>
<path d="M22.4398 9.77146V8.70188C22.1563 8.70154 21.8844 8.58875 21.6839 8.38823C21.4834 8.18772 21.3706 7.91586 21.3702 7.63229H20.3007C20.3013 8.19944 20.5269 8.74318 20.9279 9.14421C21.3289 9.54524 21.8727 9.77082 22.4398 9.77146Z" fill="black"/>
<path d="M28.0545 33.0505C27.1517 33.2146 26.2308 33.2557 25.3169 33.1728L16.0182 32.3274C15.8687 32.3138 15.7303 32.2431 15.6316 32.13C15.5329 32.0169 15.4816 31.8701 15.4884 31.7202C15.4952 31.5703 15.5595 31.4287 15.6679 31.325C15.7764 31.2212 15.9207 31.1633 16.0707 31.1632H23.2419C23.5965 31.1626 23.9365 31.0214 24.1871 30.7705C24.4378 30.5196 24.5787 30.1796 24.5789 29.8249V29.8124C24.5783 29.5314 24.4871 29.2581 24.3189 29.033L23.0944 27.401C23.0168 27.2972 22.9748 27.1711 22.9745 27.0415V26.9497C22.9745 26.8311 23.0097 26.7152 23.0756 26.6166C23.1414 26.518 23.2351 26.4411 23.3447 26.3957C23.4542 26.3503 23.5748 26.3385 23.6911 26.3616C23.8075 26.3847 23.9143 26.4418 23.9982 26.5257L26.3399 28.8674C26.3896 28.917 26.4485 28.9564 26.5134 28.9833C26.5783 29.0102 26.6478 29.024 26.7181 29.024H32.6008V27.9544H26.9395L24.7546 25.7693C24.6996 25.7145 24.6409 25.6634 24.5789 25.6166V13.515C24.5789 13.3732 24.5225 13.2372 24.4223 13.1369C24.322 13.0366 24.1859 12.9802 24.0441 12.9802H23.5093V11.3759H24.3115C24.8079 11.3759 25.284 11.1787 25.635 10.8276C25.9861 10.4766 26.1833 10.0005 26.1833 9.50409C26.1833 9.00766 25.9861 8.53157 25.635 8.18054C25.284 7.82952 24.8079 7.63231 24.3115 7.63231H24.2562C24.524 7.31148 24.6616 6.90191 24.6421 6.48449C24.6225 6.06708 24.4471 5.67218 24.1505 5.37783C23.8539 5.08347 23.4576 4.91105 23.0401 4.89464C22.6225 4.87823 22.214 5.01902 21.8952 5.28919C21.8446 4.75947 21.5984 4.26763 21.2047 3.9097C20.8109 3.55176 20.2979 3.35343 19.7658 3.35343C19.2336 3.35343 18.7206 3.55176 18.3269 3.9097C17.9331 4.26763 17.6869 4.75947 17.6363 5.28919C17.3175 5.01902 16.909 4.87823 16.4914 4.89464C16.0739 4.91105 15.6777 5.08347 15.3811 5.37783C15.0845 5.67218 14.909 6.06708 14.8895 6.48449C14.8699 6.90191 15.0076 7.31148 15.2753 7.63231H15.22C14.9425 7.63206 14.6684 7.69389 14.4178 7.81327V5.49315C14.4178 4.64213 14.0798 3.82597 13.478 3.22422C12.8763 2.62246 12.0601 2.28439 11.2091 2.28439C10.3581 2.28439 9.54191 2.62246 8.94016 3.22422C8.3384 3.82597 8.00033 4.64213 8.00033 5.49315V12.9802H7.46554C7.32371 12.9802 7.18768 13.0366 7.08739 13.1369C6.98709 13.2372 6.93075 13.3732 6.93075 13.515V15.8666L4.05898 18.3282H0.513245V19.3977H4.25679C4.38444 19.3977 4.50788 19.3521 4.6048 19.269L7.70446 16.6121C8.02312 16.3392 8.42885 16.1891 8.84845 16.189C8.89225 16.189 8.93507 16.202 8.97149 16.2263C9.00791 16.2507 9.03629 16.2853 9.05305 16.3257C9.06981 16.3662 9.07419 16.4107 9.06564 16.4537C9.05709 16.4967 9.03599 16.5361 9.00501 16.5671L7.08738 18.4848C7.01258 18.5596 6.96164 18.6549 6.94101 18.7586C6.92037 18.8624 6.93096 18.9699 6.97144 19.0676C7.01192 19.1653 7.08047 19.2489 7.16842 19.3076C7.25637 19.3664 7.35977 19.3977 7.46554 19.3977H13.0809C13.1518 19.3977 13.2198 19.4259 13.2699 19.4761C13.3201 19.5262 13.3483 19.5942 13.3483 19.6651C13.3483 19.7361 13.3201 19.8041 13.2699 19.8542C13.2198 19.9044 13.1518 19.9325 13.0809 19.9325H9.06992C8.92808 19.9325 8.79206 19.9889 8.69176 20.0892C8.59147 20.1895 8.53513 20.3255 8.53513 20.4673C8.53513 20.6092 8.59147 20.7452 8.69176 20.8455C8.79206 20.9458 8.92808 21.0021 9.06992 21.0021H14.6852C14.7562 21.0021 14.8242 21.0303 14.8743 21.0804C14.9245 21.1306 14.9526 21.1986 14.9526 21.2695C14.9526 21.3404 14.9245 21.4084 14.8743 21.4586C14.8242 21.5087 14.7562 21.5369 14.6852 21.5369H9.06992C8.92808 21.5369 8.79206 21.5933 8.69176 21.6935C8.59147 21.7938 8.53513 21.9299 8.53513 22.0717C8.53513 22.2135 8.59147 22.3496 8.69176 22.4499C8.79206 22.5501 8.92808 22.6065 9.06992 22.6065H13.6157C13.6866 22.6065 13.7546 22.6347 13.8047 22.6848C13.8549 22.735 13.883 22.803 13.883 22.8739C13.883 22.9448 13.8549 23.0128 13.8047 23.063C13.7546 23.1131 13.6866 23.1413 13.6157 23.1413H9.06992C8.92808 23.1413 8.79206 23.1976 8.69176 23.2979C8.59147 23.3982 8.53513 23.5342 8.53513 23.6761C8.53513 23.8179 8.59147 23.9539 8.69176 24.0542C8.79206 24.1545 8.92808 24.2109 9.06992 24.2109H11.7105C11.7187 24.2113 11.7264 24.2147 11.7323 24.2205C11.7381 24.2263 11.7417 24.234 11.7422 24.2422C11.7427 24.2504 11.7401 24.2585 11.735 24.265C11.7299 24.2714 11.7226 24.2758 11.7145 24.2772L8.04218 24.7362L4.40386 23.6967C4.35603 23.683 4.30653 23.6761 4.25679 23.6761H0.513245V24.7457H4.18192L6.93075 25.5311V30.6284H6.93202C6.93151 30.6986 6.94496 30.7683 6.97158 30.8333C6.9982 30.8984 7.03745 30.9575 7.08708 31.0072C7.13671 31.0569 7.19571 31.0963 7.26068 31.1231C7.32564 31.1499 7.39528 31.1635 7.46554 31.1632H14.5248C14.4348 31.4014 14.4011 31.6573 14.4263 31.9107C14.4515 32.1642 14.535 32.4084 14.6702 32.6242C14.8055 32.8401 14.9887 33.0217 15.2058 33.155C15.4228 33.2883 15.6677 33.3696 15.9214 33.3926L25.22 34.2382C25.5584 34.2691 25.8973 34.2845 26.2367 34.2844C26.9105 34.2844 27.5829 34.2238 28.2458 34.1033L32.6964 33.294L32.5051 32.2417L28.0545 33.0505ZM13.3483 10.8411C13.3484 10.6993 13.4048 10.5633 13.5051 10.4631C13.6053 10.3628 13.7413 10.3064 13.883 10.3063H14.9526C15.5198 10.3069 16.0635 10.5325 16.4645 10.9335C16.8656 11.3346 17.0912 11.8783 17.0918 12.4454C17.0916 12.5872 17.0352 12.7232 16.935 12.8234C16.8347 12.9237 16.6988 12.9801 16.557 12.9802H15.4874C14.9203 12.9796 14.3765 12.754 13.9755 12.353C13.5745 11.952 13.3489 11.4082 13.3483 10.8411ZM15.22 8.7019H16.557C16.6628 8.7019 16.7662 8.67054 16.8541 8.61178C16.9421 8.55301 17.0106 8.46949 17.0511 8.37176C17.0916 8.27404 17.1022 8.16651 17.0815 8.06277C17.0609 7.95903 17.01 7.86373 16.9352 7.78894L16.133 6.98675C16.0773 6.93107 16.0331 6.86496 16.003 6.79221C15.9729 6.71946 15.9573 6.64148 15.9573 6.56273C15.9573 6.48398 15.9729 6.406 16.003 6.33325C16.0331 6.2605 16.0773 6.19439 16.133 6.13871C16.1887 6.08302 16.2548 6.03885 16.3275 6.00872C16.4003 5.97858 16.4783 5.96307 16.557 5.96307C16.6358 5.96307 16.7137 5.97858 16.7865 6.00872C16.8592 6.03885 16.9253 6.08302 16.981 6.13871L17.7832 6.94089C17.858 7.01569 17.9533 7.06663 18.057 7.08726C18.1608 7.1079 18.2683 7.09731 18.366 7.05683C18.4638 7.01635 18.5473 6.9478 18.6061 6.85985C18.6648 6.7719 18.6962 6.6685 18.6962 6.56273V5.49315C18.6962 5.20947 18.8089 4.93742 19.0094 4.73684C19.21 4.53625 19.4821 4.42356 19.7658 4.42356C20.0494 4.42356 20.3215 4.53625 20.5221 4.73684C20.7227 4.93742 20.8353 5.20947 20.8353 5.49315V6.56273C20.8353 6.6685 20.8667 6.7719 20.9255 6.85985C20.9842 6.9478 21.0678 7.01635 21.1655 7.05683C21.2632 7.09731 21.3707 7.1079 21.4745 7.08726C21.5782 7.06663 21.6735 7.01569 21.7483 6.94089L22.5505 6.13871C22.6062 6.08302 22.6723 6.03885 22.745 6.00872C22.8178 5.97858 22.8958 5.96307 22.9745 5.96307C23.0533 5.96307 23.1312 5.97858 23.204 6.00872C23.2767 6.03885 23.3428 6.08302 23.3985 6.13871C23.4542 6.19439 23.4984 6.2605 23.5285 6.33325C23.5587 6.406 23.5742 6.48398 23.5742 6.56273C23.5742 6.64148 23.5587 6.71946 23.5285 6.79221C23.4984 6.86496 23.4542 6.93107 23.3985 6.98675L22.5963 7.78894C22.5215 7.86373 22.4706 7.95903 22.45 8.06277C22.4293 8.16651 22.4399 8.27404 22.4804 8.37176C22.5209 8.46949 22.5894 8.55301 22.6774 8.61178C22.7653 8.67054 22.8687 8.7019 22.9745 8.7019H24.3115C24.5242 8.7019 24.7283 8.78641 24.8787 8.93685C25.0292 9.08729 25.1137 9.29133 25.1137 9.50409C25.1137 9.71684 25.0292 9.92088 24.8787 10.0713C24.7283 10.2218 24.5242 10.3063 24.3115 10.3063H22.9745C22.8327 10.3063 22.6966 10.3626 22.5964 10.4629C22.4961 10.5632 22.4397 10.6992 22.4397 10.8411V11.1259C21.8157 10.5655 20.9967 10.2723 20.1588 10.3094C19.3208 10.3466 18.531 10.711 17.959 11.3245C17.7298 10.7119 17.3192 10.1839 16.782 9.81081C16.2448 9.43776 15.6066 9.23747 14.9526 9.23669H14.4646C14.52 9.08049 14.6223 8.94524 14.7575 8.84949C14.8928 8.75374 15.0543 8.70218 15.22 8.7019ZM22.372 12.9802H18.2291C18.3475 12.5209 18.6153 12.1139 18.9903 11.8233C19.3652 11.5327 19.8262 11.375 20.3006 11.375C20.7749 11.375 21.2359 11.5327 21.6108 11.8233C21.9858 12.1139 22.2536 12.5209 22.372 12.9802ZM9.06992 5.49315C9.06992 4.9258 9.29529 4.3817 9.69647 3.98053C10.0976 3.57935 10.6417 3.35398 11.2091 3.35398C11.7764 3.35398 12.3205 3.57935 12.7217 3.98053C13.1229 4.3817 13.3483 4.9258 13.3483 5.49315V9.32867C13.0357 9.43958 12.7651 9.64448 12.5736 9.91525C12.3821 10.186 12.2791 10.5094 12.2787 10.8411C12.2781 11.6309 12.5701 12.393 13.0983 12.9802H9.06992V5.49315ZM10.1395 14.0498H11.2091V18.3282H10.1395V14.0498ZM8.84845 15.1194C8.56074 15.1195 8.27474 15.1636 8.00033 15.25V14.0498H9.06992V15.1398C8.99682 15.1267 8.92272 15.1198 8.84845 15.1194ZM9.06992 18.0149V18.3282H8.7566L9.06992 18.0149ZM10.1395 25.552L11.2091 25.4183V29.3372L10.1395 28.2676V25.552ZM8.06665 25.8111L9.06992 25.6857V28.2677L8.00033 29.3373V25.8152C8.0225 25.8152 8.04465 25.8138 8.06665 25.8111ZM8.7566 30.0936L9.60471 29.2455L10.4528 30.0936H8.7566ZM12.2787 25.1879C12.4415 25.09 12.5763 24.9516 12.67 24.7863C12.7637 24.6209 12.8131 24.4342 12.8135 24.2442C12.8135 24.233 12.8135 24.2219 12.8129 24.2107H13.6157C13.8157 24.2106 14.0131 24.1657 14.1935 24.0792C14.3738 23.9927 14.5325 23.8668 14.6578 23.7109C14.7831 23.5549 14.8718 23.3729 14.9174 23.1781C14.963 22.9834 14.9643 22.7809 14.9213 22.5855C15.2502 22.5265 15.545 22.3466 15.7478 22.0811C15.9506 21.8156 16.0467 21.4838 16.0171 21.151C15.9875 20.8182 15.8343 20.5086 15.5878 20.2831C15.3413 20.0576 15.0193 19.9325 14.6852 19.9325H14.3911C14.4306 19.7383 14.4264 19.5377 14.3789 19.3452C14.3313 19.1528 14.2416 18.9733 14.1162 18.8198C13.9909 18.6663 13.8329 18.5425 13.6539 18.4575C13.4748 18.3725 13.2791 18.3283 13.0809 18.3282H12.2787V14.0498H23.5093V25.2821C23.0784 25.2994 22.6708 25.4825 22.3718 25.7933C22.0728 26.1041 21.9055 26.5185 21.9049 26.9497V27.0415C21.9057 27.4026 22.0229 27.7538 22.2392 28.0431L23.4636 29.6748C23.4933 29.7146 23.5094 29.7628 23.5095 29.8124V29.8249C23.5096 29.896 23.4815 29.9642 23.4313 30.0146C23.3811 30.065 23.313 30.0934 23.2419 30.0936H12.2787V25.1879Z" fill="black"/>
<path d="M45.2378 14.2844V3.62033H48.248C49.1758 3.62033 49.9961 3.82541 50.709 4.23557C51.4219 4.64572 51.9712 5.22922 52.3569 5.98605C52.7476 6.74289 52.9453 7.61203 52.9502 8.59348V9.27463C52.9502 10.2805 52.7549 11.1618 52.3643 11.9187C51.9785 12.6755 51.4243 13.2566 50.7017 13.6618C49.9839 14.0671 49.1465 14.2746 48.1895 14.2844H45.2378ZM46.644 4.77756V13.1345H48.1235C49.2075 13.1345 50.0498 12.7976 50.6504 12.1237C51.2559 11.4499 51.5586 10.4904 51.5586 9.24533V8.62277C51.5586 7.41183 51.2729 6.47189 50.7017 5.80295C50.1353 5.12912 49.3296 4.78732 48.2847 4.77756H46.644ZM58.1577 14.4309C57.0835 14.4309 56.2095 14.0793 55.5356 13.3762C54.8618 12.6682 54.5249 11.7234 54.5249 10.5417V10.2927C54.5249 9.50656 54.6738 8.80588 54.9717 8.19064C55.2744 7.57053 55.6943 7.08713 56.2314 6.74045C56.7734 6.38889 57.3594 6.2131 57.9893 6.2131C59.0195 6.2131 59.8203 6.55246 60.3916 7.23117C60.9629 7.90988 61.2485 8.88156 61.2485 10.1462V10.7102H55.8799C55.8994 11.4914 56.1265 12.1237 56.561 12.6071C57.0005 13.0857 57.5571 13.3249 58.231 13.3249C58.7095 13.3249 59.1147 13.2273 59.4468 13.032C59.7788 12.8366 60.0693 12.5779 60.3184 12.2556L61.146 12.9001C60.4819 13.9206 59.4858 14.4309 58.1577 14.4309ZM57.9893 7.32639C57.4424 7.32639 56.9834 7.52658 56.6123 7.92697C56.2412 8.32248 56.0117 8.87912 55.9238 9.59689H59.8936V9.49435C59.8545 8.80588 59.6689 8.27365 59.3369 7.89767C59.0049 7.51682 58.5557 7.32639 57.9893 7.32639ZM64.2954 14.2844H62.9404V3.03439H64.2954V14.2844ZM67.9429 14.2844H66.5879V6.35959H67.9429V14.2844ZM66.478 4.25754C66.478 4.03781 66.5439 3.85226 66.6758 3.7009C66.8125 3.54953 67.0127 3.47385 67.2764 3.47385C67.54 3.47385 67.7402 3.54953 67.877 3.7009C68.0137 3.85226 68.082 4.03781 68.082 4.25754C68.082 4.47726 68.0137 4.66037 67.877 4.80685C67.7402 4.95334 67.54 5.02658 67.2764 5.02658C67.0127 5.02658 66.8125 4.95334 66.6758 4.80685C66.5439 4.66037 66.478 4.47726 66.478 4.25754ZM72.7329 12.446L74.6958 6.35959H76.0801L73.2383 14.2844H72.2056L69.3345 6.35959H70.7188L72.7329 12.446ZM80.5698 14.4309C79.4956 14.4309 78.6216 14.0793 77.9478 13.3762C77.2739 12.6682 76.937 11.7234 76.937 10.5417V10.2927C76.937 9.50656 77.0859 8.80588 77.3838 8.19064C77.6865 7.57053 78.1064 7.08713 78.6436 6.74045C79.1855 6.38889 79.7715 6.2131 80.4014 6.2131C81.4316 6.2131 82.2324 6.55246 82.8037 7.23117C83.375 7.90988 83.6606 8.88156 83.6606 10.1462V10.7102H78.292C78.3115 11.4914 78.5386 12.1237 78.9731 12.6071C79.4126 13.0857 79.9692 13.3249 80.6431 13.3249C81.1216 13.3249 81.5269 13.2273 81.8589 13.032C82.1909 12.8366 82.4814 12.5779 82.7305 12.2556L83.5581 12.9001C82.894 13.9206 81.8979 14.4309 80.5698 14.4309ZM80.4014 7.32639C79.8545 7.32639 79.3955 7.52658 79.0244 7.92697C78.6533 8.32248 78.4238 8.87912 78.3359 9.59689H82.3057V9.49435C82.2666 8.80588 82.0811 8.27365 81.749 7.89767C81.417 7.51682 80.9678 7.32639 80.4014 7.32639ZM89.0659 7.57541C88.8608 7.54123 88.6387 7.52414 88.3994 7.52414C87.5107 7.52414 86.9077 7.90256 86.5903 8.65939V14.2844H85.2354V6.35959H86.5537L86.5757 7.27512C87.02 6.56711 87.6499 6.2131 88.4653 6.2131C88.729 6.2131 88.9292 6.24728 89.0659 6.31564V7.57541ZM93.043 12.2995L94.8887 6.35959H96.3389L93.1528 15.5075C92.6597 16.8259 91.876 17.4851 90.8018 17.4851L90.5454 17.4631L90.04 17.3679V16.2693L90.4062 16.2986C90.8652 16.2986 91.2217 16.2058 91.4756 16.0202C91.7344 15.8347 91.9468 15.4953 92.1128 15.0022L92.4131 14.1965L89.5859 6.35959H91.0654L93.043 12.2995ZM51.1191 27.5749H46.644V32.2844H45.2378V21.6203H51.8442V22.7776H46.644V26.425H51.1191V27.5749ZM52.7964 28.2487C52.7964 27.4724 52.9478 26.7741 53.2505 26.154C53.5581 25.5339 53.9829 25.0554 54.5249 24.7185C55.0718 24.3816 55.6943 24.2131 56.3926 24.2131C57.4717 24.2131 58.3433 24.5866 59.0073 25.3337C59.6763 26.0808 60.0107 27.0744 60.0107 28.3147V28.4099C60.0107 29.1814 59.8618 29.8747 59.564 30.49C59.271 31.1003 58.8486 31.5764 58.2969 31.9182C57.75 32.26 57.1201 32.4309 56.4072 32.4309C55.333 32.4309 54.4614 32.0573 53.7925 31.3103C53.1284 30.5632 52.7964 29.5744 52.7964 28.344V28.2487ZM54.1587 28.4099C54.1587 29.2888 54.3613 29.9944 54.7666 30.5266C55.1768 31.0588 55.7236 31.3249 56.4072 31.3249C57.0957 31.3249 57.6426 31.0564 58.0479 30.5193C58.4531 29.9773 58.6558 29.2204 58.6558 28.2487C58.6558 27.3796 58.4482 26.6765 58.0332 26.1394C57.623 25.5974 57.0762 25.3264 56.3926 25.3264C55.7236 25.3264 55.1841 25.5925 54.7739 26.1247C54.3638 26.657 54.1587 27.4187 54.1587 28.4099ZM61.3511 28.2487C61.3511 27.4724 61.5024 26.7741 61.8052 26.154C62.1128 25.5339 62.5376 25.0554 63.0796 24.7185C63.6265 24.3816 64.249 24.2131 64.9473 24.2131C66.0264 24.2131 66.8979 24.5866 67.562 25.3337C68.231 26.0808 68.5654 27.0744 68.5654 28.3147V28.4099C68.5654 29.1814 68.4165 29.8747 68.1187 30.49C67.8257 31.1003 67.4033 31.5764 66.8516 31.9182C66.3047 32.26 65.6748 32.4309 64.9619 32.4309C63.8877 32.4309 63.0161 32.0573 62.3472 31.3103C61.6831 30.5632 61.3511 29.5744 61.3511 28.344V28.2487ZM62.7134 28.4099C62.7134 29.2888 62.916 29.9944 63.3213 30.5266C63.7314 31.0588 64.2783 31.3249 64.9619 31.3249C65.6504 31.3249 66.1973 31.0564 66.6025 30.5193C67.0078 29.9773 67.2104 29.2204 67.2104 28.2487C67.2104 27.3796 67.0029 26.6765 66.5879 26.1394C66.1777 25.5974 65.6309 25.3264 64.9473 25.3264C64.2783 25.3264 63.7388 25.5925 63.3286 26.1247C62.9185 26.657 62.7134 27.4187 62.7134 28.4099ZM69.9351 28.2561C69.9351 27.0403 70.2231 26.0637 70.7993 25.3264C71.3755 24.5842 72.1299 24.2131 73.0625 24.2131C73.9902 24.2131 74.7251 24.5305 75.2671 25.1653V21.0344H76.6221V32.2844H75.377L75.311 31.4348C74.769 32.0988 74.0146 32.4309 73.0479 32.4309C72.1299 32.4309 71.3804 32.0549 70.7993 31.3029C70.2231 30.551 69.9351 29.5695 69.9351 28.3586V28.2561ZM71.29 28.4099C71.29 29.3083 71.4756 30.0114 71.8467 30.5193C72.2178 31.0271 72.7305 31.281 73.3848 31.281C74.2441 31.281 74.8716 30.8952 75.2671 30.1237V26.4836C74.8618 25.7365 74.2393 25.363 73.3994 25.363C72.7354 25.363 72.2178 25.6194 71.8467 26.132C71.4756 26.6447 71.29 27.404 71.29 28.4099Z" fill="black"/>
</svg>
images/rating.svg 0 → 100644
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14.6515 6.24221C14.5553 5.94476 14.2915 5.7335 13.9793 5.70536L9.73947 5.32038L8.06292 1.39623C7.9393 1.10864 7.65776 0.922485 7.34495 0.922485C7.03215 0.922485 6.75061 1.10864 6.62699 1.39691L4.95043 5.32038L0.709893 5.70536C0.398319 5.73417 0.135163 5.94476 0.0384405 6.24221C-0.0582818 6.53966 0.0310434 6.86592 0.266741 7.07158L3.47158 9.88224L2.52655 14.0451C2.45739 14.3512 2.5762 14.6676 2.83016 14.8512C2.96667 14.9498 3.12638 15 3.28744 15C3.4263 15 3.56404 14.9626 3.68766 14.8886L7.34495 12.7028L11.0009 14.8886C11.2684 15.0495 11.6057 15.0349 11.8591 14.8512C12.1131 14.667 12.2318 14.3505 12.1627 14.0451L11.2177 9.88224L14.4225 7.07214C14.6582 6.86592 14.7482 6.54022 14.6515 6.24221V6.24221Z" fill="#FFC107"/>
</svg>
images/search.svg 0 → 100644
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15.9891 15.0205L11.424 10.4555C12.1324 9.53965 12.5156 8.41992 12.5156 7.24219C12.5156 5.83242 11.9654 4.51055 10.9705 3.51387C9.97559 2.51719 8.6502 1.96875 7.24219 1.96875C5.83418 1.96875 4.50879 2.51895 3.51387 3.51387C2.51719 4.50879 1.96875 5.83242 1.96875 7.24219C1.96875 8.6502 2.51895 9.97559 3.51387 10.9705C4.50879 11.9672 5.83242 12.5156 7.24219 12.5156C8.41992 12.5156 9.53789 12.1324 10.4537 11.4258L15.0188 15.9891C15.0321 16.0025 15.048 16.0131 15.0655 16.0203C15.083 16.0276 15.1018 16.0313 15.1207 16.0313C15.1396 16.0313 15.1584 16.0276 15.1759 16.0203C15.1934 16.0131 15.2093 16.0025 15.2227 15.9891L15.9891 15.2244C16.0025 15.211 16.0131 15.1951 16.0203 15.1776C16.0276 15.1601 16.0313 15.1414 16.0313 15.1225C16.0313 15.1035 16.0276 15.0848 16.0203 15.0673C16.0131 15.0498 16.0025 15.0339 15.9891 15.0205V15.0205ZM10.0266 10.0266C9.28125 10.7701 8.29336 11.1797 7.24219 11.1797C6.19102 11.1797 5.20313 10.7701 4.45781 10.0266C3.71426 9.28125 3.30469 8.29336 3.30469 7.24219C3.30469 6.19102 3.71426 5.20137 4.45781 4.45781C5.20313 3.71426 6.19102 3.30469 7.24219 3.30469C8.29336 3.30469 9.28301 3.7125 10.0266 4.45781C10.7701 5.20313 11.1797 6.19102 11.1797 7.24219C11.1797 8.29336 10.7701 9.28301 10.0266 10.0266Z" fill="#8C8C8C"/>
</svg>
images/shopping-cart.svg 0 → 100644
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14.4201 10.9672H5.11537L5.58256 10.0156L13.3451 10.0016C13.6076 10.0016 13.8326 9.81406 13.8794 9.55469L14.9544 3.5375C14.9826 3.37969 14.9404 3.21719 14.8372 3.09375C14.7863 3.033 14.7227 2.98407 14.6509 2.95034C14.5792 2.91661 14.5009 2.8989 14.4216 2.89844L4.54662 2.86562L4.46224 2.46875C4.40912 2.21562 4.18099 2.03125 3.92162 2.03125H1.50756C1.36127 2.03125 1.22098 2.08936 1.11754 2.1928C1.0141 2.29624 0.955994 2.43653 0.955994 2.58281C0.955994 2.7291 1.0141 2.86939 1.11754 2.97283C1.22098 3.07626 1.36127 3.13438 1.50756 3.13438H3.47474L3.84349 4.8875L4.75131 9.28281L3.58256 11.1906C3.52186 11.2725 3.4853 11.3698 3.47702 11.4714C3.46874 11.573 3.48906 11.675 3.53568 11.7656C3.62943 11.9516 3.81849 12.0688 4.02787 12.0688H5.00912C4.79993 12.3466 4.68694 12.685 4.68724 13.0328C4.68724 13.9172 5.40599 14.6359 6.29037 14.6359C7.17474 14.6359 7.89349 13.9172 7.89349 13.0328C7.89349 12.6844 7.77787 12.3453 7.57162 12.0688H10.0888C9.87962 12.3466 9.76662 12.685 9.76693 13.0328C9.76693 13.9172 10.4857 14.6359 11.3701 14.6359C12.2544 14.6359 12.9732 13.9172 12.9732 13.0328C12.9732 12.6844 12.8576 12.3453 12.6513 12.0688H14.4216C14.7247 12.0688 14.9732 11.8219 14.9732 11.5172C14.9723 11.3711 14.9136 11.2312 14.81 11.1282C14.7064 11.0251 14.5662 10.9673 14.4201 10.9672V10.9672ZM4.77631 3.95312L13.7732 3.98281L12.8919 8.91719L5.82474 8.92969L4.77631 3.95312ZM6.29037 13.5266C6.01849 13.5266 5.79662 13.3047 5.79662 13.0328C5.79662 12.7609 6.01849 12.5391 6.29037 12.5391C6.56224 12.5391 6.78412 12.7609 6.78412 13.0328C6.78412 13.1638 6.7321 13.2894 6.6395 13.3819C6.54691 13.4745 6.42132 13.5266 6.29037 13.5266V13.5266ZM11.3701 13.5266C11.0982 13.5266 10.8763 13.3047 10.8763 13.0328C10.8763 12.7609 11.0982 12.5391 11.3701 12.5391C11.6419 12.5391 11.8638 12.7609 11.8638 13.0328C11.8638 13.1638 11.8118 13.2894 11.7192 13.3819C11.6266 13.4745 11.501 13.5266 11.3701 13.5266V13.5266Z" fill="#8C8C8C"/>
</svg>
images/user.svg 0 → 100644
<svg width="16" height="24" viewBox="0 0 16 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M13.4145 15.9312C13.1197 15.2331 12.692 14.5989 12.1551 14.0641C11.6198 13.5277 10.9858 13.1 10.2879 12.8047C10.2817 12.8016 10.2754 12.8 10.2692 12.7969C11.2426 12.0938 11.8754 10.9484 11.8754 9.65625C11.8754 7.51562 10.141 5.78125 8.00041 5.78125C5.85978 5.78125 4.12541 7.51562 4.12541 9.65625C4.12541 10.9484 4.75822 12.0937 5.73166 12.7984C5.72541 12.8016 5.71916 12.8031 5.71291 12.8062C5.01291 13.1016 4.38478 13.525 3.84572 14.0656C3.30933 14.6009 2.88166 15.235 2.58634 15.9328C2.29622 16.616 2.13975 17.3485 2.12541 18.0906C2.12499 18.1073 2.12791 18.1239 2.13401 18.1394C2.1401 18.1549 2.14924 18.1691 2.16089 18.181C2.17254 18.193 2.18646 18.2025 2.20184 18.2089C2.21721 18.2154 2.23372 18.2188 2.25041 18.2188H3.18791C3.25666 18.2188 3.31134 18.1641 3.31291 18.0969C3.34416 16.8906 3.82853 15.7609 4.68478 14.9047C5.57072 14.0188 6.74728 13.5312 8.00041 13.5312C9.25353 13.5312 10.4301 14.0188 11.316 14.9047C12.1723 15.7609 12.6567 16.8906 12.6879 18.0969C12.6895 18.1656 12.7442 18.2188 12.8129 18.2188H13.7504C13.7671 18.2188 13.7836 18.2154 13.799 18.2089C13.8143 18.2025 13.8283 18.193 13.8399 18.181C13.8516 18.1691 13.8607 18.1549 13.8668 18.1394C13.8729 18.1239 13.8758 18.1073 13.8754 18.0906C13.8598 17.3437 13.7051 16.6172 13.4145 15.9312V15.9312ZM8.00041 12.3438C7.28322 12.3438 6.60822 12.0641 6.10041 11.5563C5.59259 11.0484 5.31291 10.3734 5.31291 9.65625C5.31291 8.93906 5.59259 8.26406 6.10041 7.75625C6.60822 7.24844 7.28322 6.96875 8.00041 6.96875C8.71759 6.96875 9.39259 7.24844 9.90041 7.75625C10.4082 8.26406 10.6879 8.93906 10.6879 9.65625C10.6879 10.3734 10.4082 11.0484 9.90041 11.5563C9.39259 12.0641 8.71759 12.3438 8.00041 12.3438Z" fill="white"/>
</svg>
images/vk.svg 0 → 100644
<svg width="36" height="21" viewBox="0 0 36 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18.0988 20.7306H20.1934C20.1934 20.7306 20.8266 20.6605 21.1486 20.3121C21.4466 19.9922 21.4356 19.3919 21.4356 19.3919C21.4356 19.3919 21.394 16.5809 22.6998 16.1669C23.9859 15.7593 25.6378 18.8836 27.3884 20.0864C28.7117 20.9957 29.7173 20.7963 29.7173 20.7963L34.3994 20.7306C34.3994 20.7306 36.8488 20.5794 35.6876 18.6536C35.5934 18.4958 35.0106 17.2295 32.2062 14.6266C29.2704 11.9011 29.6648 12.3437 33.2009 7.63099C35.3546 4.76087 36.2156 3.00813 35.9462 2.25883C35.6898 1.54458 34.1058 1.733 34.1058 1.733L28.8388 1.76368C28.8388 1.76368 28.4488 1.7111 28.1574 1.88418C27.8748 2.05507 27.6929 2.44944 27.6929 2.44944C27.6929 2.44944 26.8582 4.67104 25.7452 6.55962C23.3987 10.5449 22.4588 10.7553 22.0754 10.5077C21.1837 9.93147 21.4071 8.18968 21.4071 6.95399C21.4071 3.09138 21.9921 1.48105 20.2657 1.06477C19.6917 0.926742 19.271 0.834723 17.8053 0.819387C15.9254 0.799668 14.3326 0.82596 13.4322 1.26634C12.8318 1.55992 12.3696 2.21501 12.6522 2.25226C13.0005 2.29827 13.7893 2.46478 14.2078 3.03442C14.7489 3.76838 14.7292 5.42034 14.7292 5.42034C14.7292 5.42034 15.0403 9.96652 14.004 10.5318C13.2919 10.9196 12.317 10.1286 10.2246 6.51142C9.15328 4.66009 8.34263 2.61157 8.34263 2.61157C8.34263 2.61157 8.18708 2.23035 7.90883 2.02659C7.57142 1.77901 7.09818 1.70014 7.09818 1.70014L2.08972 1.73081C2.08972 1.73081 1.33823 1.75272 1.06217 2.07917C0.816787 2.37057 1.04245 2.97088 1.04245 2.97088C1.04245 2.97088 4.96422 12.1443 9.40304 16.7694C13.476 21.0088 18.0988 20.7306 18.0988 20.7306Z" fill="#1E88E5"/>
</svg>
index.php 0 → 100644
<?php
error_reporting(0);
?>
<!DOCTYPE html>
<html lang="RU">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Global Care New</title>
<link rel="stylesheet" href="<link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap&subset=cyrillic" rel="stylesheet"">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css\animate.css">
<link rel="stylesheet" href="css\normalize.css">
</head>
<body>
<div class="container">
<header>
<a class="logo" href="index.php"><img src="images/logo5.png" alt="logotype" class="new-logo"> </a>
<input type="text" class="input input-address" placeholder="Search">
<?php
if(!isset($_COOKIE['name']))
{ ?>
<div class="buttons">
<!-- ctrl / -->
<button class="button button-primary" id="login-button">
<img src="images\user.svg" alt="Log in" class="button-icon">
<span class="button-text">Log in</span>
</button>
<button class="button button-primary" id="register-button">
<img src="images\user.svg" class="button-icon"alt="Register">
<span class="button-text">Register</span>
</button>
</div>
<?php
}
else{ ?>
<span class="welcome-message"><?php echo $_COOKIE['name'] . " " . $_COOKIE['surname'];?></span>
<div class="buttons">
<a href="php/logout.php">
<button class="button button-primary" id="register-button">
<img src="images\user.svg" class="button-icon"alt="Register">
<span class="button-text">Log out</span>
</button>
</a>
</div>
<?php } ?>
</header>
<div class="main">
<section class="promo">
<h1 class="promo-title">Global Care<br>Be safe globally</h1>
<p class="promo-text">Buy different insurances without leaving home, save your time and be safe!</p>
</section>
<section class="restaurants">
<div class="section-header">
<h2 class="section-title">Insurance types</h2>
<input type="text" class="input input-search" placeholder="Search insurance types">
</div>
<div class="cards">
<a href="insurance_types\medical.php" class="card wow fadeInUp" data-wow-delay="0.2s">
<img src="images\ins_types\medical.png" alt="1st" class="card-image">
<div class="card-text">
<div class="card-header">
<h3 class="card-title">Health</h3>
</div>
<div class="card-info">
<div class="rating">
<img src="images\rating.svg" alt="rating" class="rating-star"></div>
<div class="price">Personal</div>
<div class="category">Family</div>
</div>
</div>
</a>
<a href="insurance_types\travelling.php" class="card wow fadeInUp" data-wow-delay="0.4s">
<img src="images\ins_types\travel.png" alt="1st" class="card-image">
<div class="card-text">
<div class="card-header">
<h3 class="card-title">Travelling</h3>
</div>
<div class="card-info">
<div class="rating"><img src="images\rating.svg" alt="rating" class="rating-star"></div>
<div class="price">Personal</div>
<div class="category">Group</div>
</div>
</div>
</a>
<a href="insurance_types\auto.php" class="card wow fadeInUp" data-wow-delay="0.6s">
<img src="images\ins_types\car.png" alt="1st" class="card-image">
<div class="card-text">
<div class="card-header">
<h3 class="card-title">Auto</h3>
</div>
<div class="card-info">
<div class="rating"><img src="images\rating.svg" alt="rating" class="rating-star"></div>
<div class="price">Car</div>
<div class="category">Motorbike</div>
</div>
</div>
</a>
<a href="insurance_types\life.php" class="card wow fadeInUp" data-wow-delay="0.2s">
<img src="images\ins_types\life.jfif" alt="1st" class="card-image">
<div class="card-text">
<div class="card-header">
<h3 class="card-title">Life</h3>
</div>
<div class="card-info">
<div class="rating"><img src="images\rating.svg" alt="rating" class="rating-star"></div>
<div class="price">Personal</div>
<div class="category">Family</div>
</div>
</div>
</a>
<a href="insurance_types\estate.php" class="card wow fadeInUp" data-wow-delay="0.4s">
<img src="images\ins_types\estate.png" alt="1st" class="card-image">
<div class="card-text">
<div class="card-header">
<h3 class="card-title">Estate</h3>
</div>
<div class="card-info">
<div class="rating"><img src="images\rating.svg" alt="rating" class="rating-star"></div>
<div class="price">House</div>
<div class="category">Other buildings</div>
</div>
</div>
</a>
<a href="insurance_types\gadgets.php" class="card wow fadeInUp" data-wow-delay="0.6s">
<img src="images\ins_types\gadgets.jfif" alt="1st" class="card-image">
<div class="card-text">
<div class="card-header">
<h3 class="card-title">Gadgets</h3>
</div>
<div class="card-info">
<div class="rating"><img src="images\rating.svg" alt="rating" class="rating-star"></div>
<div class="price">Personal</div>
<div class="category">Company</div>
</div>
</div>
</a>
</div>
</section>
</div>
<footer class="footer">
<div class="container">
<div class="footer-block">
<img class="footer-logo" src="images\logo5.png" alt="logo">
<nav class="footer-nav">
<a href="#" class="footer-link">Partnership</a>
<a href="#" class="footer-link">Awards</a>
<a href="#" class="footer-link">Offices</a>
<a href="#" class="footer-link">Contacts</a>
</nav>
<div class="social-links">
<a class="social-link" href="#"><img src="images\inst.svg" alt="instagram"></a>
<a class="social-link" href="#"><img src="images\face.svg" alt="facebook"></a>
<a class="social-link" href="#"><img src="images\vk.svg" alt="vk"></a>
</div>
</div>
</div>
</footer>
<div class="register">
<div class="register-dialog">
<div class="login-close-b">
<button class="register-close">&times;</button>
</div>
<div class="login-form">
<form id="login-form-process" action="php\register.php" method="POST">
<p><input type="text" placeholder="First name" name="fname" ></p>
<p><input type="text" placeholder="Last name" name="lname" ></p>
<p><input type="email" placeholder="Email" name="email" ></p>
<p><input type="password" placeholder="Password" name="password"></p>
<p><input type="submit" value = "Register" name="register"></p>
</form>
</div>
</div>
</div>
<div class="login">
<div class="login-dialog">
<div class="login-close-b">
<button class="login-close">&times;</button>
</div>
<div class="login-form">
<form id="login-form-process" action="php\login.php" method="POST">
<p><input type="email" placeholder="Email" name="email" ></p>
<p><input type="password" placeholder="Password" name="password"></p>
<p><input type="submit" value = "Login" name="login"></p>
<p id="question">Not registered? <a href="php/register-page.php">Create an account</a></p>
</form>
</div>
</div>
</div>
</div>
<script src="js/wow.min.js"></script>
<script src="js\register.js"></script>
<script src="js/login.js"></script>
</body>
</html>
\ No newline at end of file
insurance_types/additional/database/database_connection.php 0 → 100644
<?php
$connnection = mysqli_connect('127.0.0.1', 'root', '', 'globalcare');
?>
\ No newline at end of file
insurance_types/additional/errors/confirm.php 0 → 100644
<?php
if(!isset($data['confirm1'])){ $errors[] = 'All conditions have to be accepted!';}
if(!isset($data['confirm2'])){ $errors[] = 'All conditions have to be accepted!';}
if(!isset($data['confirm3'])){ $errors[] = 'All conditions have to be accepted!';}
?>
\ No newline at end of file
insurance_types/additional/errors/person.php 0 → 100644
<?php
if($Email == ''){ $errors[] = 'Enter your email!';}
elseif(mb_strlen($Email) < 3 || mb_strlen($Email) > 90){$errors[] = 'Minimum length for last name is 3 characters';}
if($FirstName == ''){ $errors[] = 'Enter your first name!';}
if($LastName == ''){ $errors[] = 'Enter your last name!';}
if($BirthDate == ''){ $errors[] = 'Enter your birthday!';}
if($BirthDate < 01-01-1900 or $BirthDate > date("Y-m-d")){$errors[] = "Not possible birthday!";}
if($Country == ''){ $errors[] = 'Enter your citizenship!';}
if($Passport == ''){ $errors[] = 'Enter your passport number!';}
if($Gender == ''){ $errors[] = 'Choose your gender!';}
?>
\ No newline at end of file
insurance_types/additional/errors/start-end.php 0 → 100644
<?php
if($StartDate == ''){ $errors[] = 'Enter start date!';}
if($EndDate == ''){ $errors[] = 'Enter end date!';}
if($StartDate < date("Y-m-d")){$errors[] = 'Start date can not be earlier than today!!!';}
if($StartDate > $EndDate){$errors[] = 'Start date can not be earlier than end date!';}
if($StartDate > 2030-01-01 or $EndDate > 2030-01-01){$errors[] = 'Dates have to be earlier than 2030-01-10';}
?>
\ No newline at end of file
insurance_types/additional/form-input/areas.php 0 → 100644
<select id="area" name="Area" value="<?php echo @$data['Area'];?>">
<option selected="selected" value="" disabled>Select an area</option>
<?php if (isset($Area)){ ?><option value = "<?php echo $Area;?>" selected = "selected"><?php echo $Area; }?></option>
<option value="Worldwide">Worldwide</option>
<option value="USA">USA</option>
<option value="Europe">Europe</option>
<option value="Asia">Asia</option>
<option value="Worldwide-USA">Worldwide excluding USA</option>
</select>
\ No newline at end of file
insurance_types/additional/form-input/car_year.php 0 → 100644
<select id="car_year" name="CarYear">
<?php for($i = 2000; $i < 2020; $i++){?>
<option value="<?php $i; ?>"><?php echo $i; ?></option>
<?php } ?>
</select>
insurance_types/additional/form-input/cars.php 0 → 100644
<select id="Car" name="Cars">
<option value="ASTON MARTIN">ASTON MARTIN</option>
<option value="AUDI">AUDI</option>
<option value="BENTLEY">BENTLEY</option>
<option value="BMW">BMW</option>
<option value="BUGATTI">BUGATTI</option>
<option value="FERRARI">FERRARI</option>
<option value="DAIMLERCHRYSLER">DAIMLERCHRYSLER</option>
<option value="FORD">FORD</option>
<option value="FUJI">FUJI</option>
<option value="GM">GM</option>
<option value="HONDA">HONDA</option>
<option value="HYUNDAI">HYUNDAI</option>
<option value="JAGUAR">JAGUAR</option>
<option value="KIA">KIA</option>
<option value="LAMBORGHINI">LAMBORGHINI</option>
<option value="LAND ROVER">LAND ROVER</option>
<option value="LOTUS">LOTUS</option>
<option value="MASERATI">MASERATI</option>
<option value="MAZDA">MAZDA</option>
<option value="MERCEDES">MERCEDES</option>
<option value="MITSUBISHI">MITSUBISHI</option>
<option value="NISSAN">NISSAN</option>
<option value="PORSCHE">PORSCHE</option>
<option value="ROLLS-ROYCE">ROLLS-ROYCE</option>
<option value="ROUSH">ROUSH</option>
<option value="SUZUKI">SUZUKI</option>
<option value="TOYOTA">TOYOTA</option>
<option value="VOLKSWAGEN">VOLKSWAGEN</option>
<option value="VOLVO">VOLVO</option>
</select>
\ No newline at end of file
insurance_types/additional/form-input/confirmation.php 0 → 100644
<div class="confirmation">
<input type="checkbox" name="confirm1" class="exception" <?php if(isset($data['confirm1'])) echo "checked";?>>
<label for="confirm1">I read, understand, and agree with the <a href="#">terms and conditions</a> and the <a href="#">product document</a> information as well as all legal documentation and correspondence is exclusively in English language.</label><br><br>
<input type="checkbox" name="confirm2" class="exception" <?php if(isset($data['confirm2'])) echo "checked";?>>
<label for="confirm2">I read, understand and agree to the fact that this plan is sold online without personal advice. I understand that if I require personal advice, I can contact Swisscare directly.</label><br><br>
<input type="checkbox" name="confirm3" class="exception" <?php if(isset($data['confirm3'])) echo "checked";?>>
<label for="confirm3">I read, understand and agree with <a href="#">legal information</a> and <a href="#">the data protection policy</a>.
</label>
</div>
\ No newline at end of file
insurance_types/additional/form-input/countries.php 0 → 100644
<select id="country" name="Countries" value="<?php echo @$data['Country'];?>">
<option selected="selected" value="" disabled>Select a country</option>
<?php if (isset($Country)){ ?><option value = "<?php echo $Country;?>" selected = "selected"><?php echo $Country; }?></option>
<option value="Afganistan">Afghanistan</option>
<option value="Albania">Albania</option>
<option value="Algeria">Algeria</option>
<option value="American Samoa">American Samoa</option>
<option value="Andorra">Andorra</option>
<option value="Angola">Angola</option>
<option value="Anguilla">Anguilla</option>
<option value="Antigua & Barbuda">Antigua & Barbuda</option>
<option value="Argentina">Argentina</option>
<option value="Armenia">Armenia</option>
<option value="Aruba">Aruba</option>
<option value="Australia">Australia</option>
<option value="Austria">Austria</option>
<option value="Azerbaijan">Azerbaijan</option>
<option value="Bahamas">Bahamas</option>
<option value="Bahrain">Bahrain</option>
<option value="Bangladesh">Bangladesh</option>
<option value="Barbados">Barbados</option>
<option value="Belarus">Belarus</option>
<option value="Belgium">Belgium</option>
<option value="Belize">Belize</option>
<option value="Benin">Benin</option>
<option value="Bermuda">Bermuda</option>
<option value="Bhutan">Bhutan</option>
<option value="Bolivia">Bolivia</option>
<option value="Bonaire">Bonaire</option>
<option value="Bosnia & Herzegovina">Bosnia & Herzegovina</option>
<option value="Botswana">Botswana</option>
<option value="Brazil">Brazil</option>
<option value="British Indian Ocean Ter">British Indian Ocean Ter</option>
<option value="Brunei">Brunei</option>
<option value="Bulgaria">Bulgaria</option>
<option value="Burkina Faso">Burkina Faso</option>
<option value="Burundi">Burundi</option>
<option value="Cambodia">Cambodia</option>
<option value="Cameroon">Cameroon</option>
<option value="Canada">Canada</option>
<option value="Canary Islands">Canary Islands</option>
<option value="Cape Verde">Cape Verde</option>
<option value="Cayman Islands">Cayman Islands</option>
<option value="Central African Republic">Central African Republic</option>
<option value="Chad">Chad</option>
<option value="Channel Islands">Channel Islands</option>
<option value="Chile">Chile</option>
<option value="China">China</option>
<option value="Christmas Island">Christmas Island</option>
<option value="Cocos Island">Cocos Island</option>
<option value="Colombia">Colombia</option>
<option value="Comoros">Comoros</option>
<option value="Congo">Congo</option>
<option value="Cook Islands">Cook Islands</option>
<option value="Costa Rica">Costa Rica</option>
<option value="Cote DIvoire">Cote DIvoire</option>
<option value="Croatia">Croatia</option>
<option value="Cuba">Cuba</option>
<option value="Curaco">Curacao</option>
<option value="Cyprus">Cyprus</option>
<option value="Czech Republic">Czech Republic</option>
<option value="Denmark">Denmark</option>
<option value="Djibouti">Djibouti</option>
<option value="Dominica">Dominica</option>
<option value="Dominican Republic">Dominican Republic</option>
<option value="East Timor">East Timor</option>
<option value="Ecuador">Ecuador</option>
<option value="Egypt">Egypt</option>
<option value="El Salvador">El Salvador</option>
<option value="Equatorial Guinea">Equatorial Guinea</option>
<option value="Eritrea">Eritrea</option>
<option value="Estonia">Estonia</option>
<option value="Ethiopia">Ethiopia</option>
<option value="Falkland Islands">Falkland Islands</option>
<option value="Faroe Islands">Faroe Islands</option>
<option value="Fiji">Fiji</option>
<option value="Finland">Finland</option>
<option value="France">France</option>
<option value="French Guiana">French Guiana</option>
<option value="French Polynesia">French Polynesia</option>
<option value="French Southern Ter">French Southern Ter</option>
<option value="Gabon">Gabon</option>
<option value="Gambia">Gambia</option>
<option value="Georgia">Georgia</option>
<option value="Germany">Germany</option>
<option value="Ghana">Ghana</option>
<option value="Gibraltar">Gibraltar</option>
<option value="Great Britain">Great Britain</option>
<option value="Greece">Greece</option>
<option value="Greenland">Greenland</option>
<option value="Grenada">Grenada</option>
<option value="Guadeloupe">Guadeloupe</option>
<option value="Guam">Guam</option>
<option value="Guatemala">Guatemala</option>
<option value="Guinea">Guinea</option>
<option value="Guyana">Guyana</option>
<option value="Haiti">Haiti</option>
<option value="Hawaii">Hawaii</option>
<option value="Honduras">Honduras</option>
<option value="Hong Kong">Hong Kong</option>
<option value="Hungary">Hungary</option>
<option value="Iceland">Iceland</option>
<option value="Indonesia">Indonesia</option>
<option value="India">India</option>
<option value="Iran">Iran</option>
<option value="Iraq">Iraq</option>
<option value="Ireland">Ireland</option>
<option value="Isle of Man">Isle of Man</option>
<option value="Israel">Israel</option>
<option value="Italy">Italy</option>
<option value="Jamaica">Jamaica</option>
<option value="Japan">Japan</option>
<option value="Jordan">Jordan</option>
<option value="Kazakhstan">Kazakhstan</option>
<option value="Kenya">Kenya</option>
<option value="Kiribati">Kiribati</option>
<option value="Korea North">Korea North</option>
<option value="Korea Sout">Korea South</option>
<option value="Kuwait">Kuwait</option>
<option value="Kyrgyzstan">Kyrgyzstan</option>
<option value="Laos">Laos</option>
<option value="Latvia">Latvia</option>
<option value="Lebanon">Lebanon</option>
<option value="Lesotho">Lesotho</option>
<option value="Liberia">Liberia</option>
<option value="Libya">Libya</option>
<option value="Liechtenstein">Liechtenstein</option>
<option value="Lithuania">Lithuania</option>
<option value="Luxembourg">Luxembourg</option>
<option value="Macau">Macau</option>
<option value="Macedonia">Macedonia</option>
<option value="Madagascar">Madagascar</option>
<option value="Malaysia">Malaysia</option>
<option value="Malawi">Malawi</option>
<option value="Maldives">Maldives</option>
<option value="Mali">Mali</option>
<option value="Malta">Malta</option>
<option value="Marshall Islands">Marshall Islands</option>
<option value="Martinique">Martinique</option>
<option value="Mauritania">Mauritania</option>
<option value="Mauritius">Mauritius</option>
<option value="Mayotte">Mayotte</option>
<option value="Mexico">Mexico</option>
<option value="Midway Islands">Midway Islands</option>
<option value="Moldova">Moldova</option>
<option value="Monaco">Monaco</option>
<option value="Mongolia">Mongolia</option>
<option value="Montserrat">Montserrat</option>
<option value="Morocco">Morocco</option>
<option value="Mozambique">Mozambique</option>
<option value="Myanmar">Myanmar</option>
<option value="Nambia">Nambia</option>
<option value="Nauru">Nauru</option>
<option value="Nepal">Nepal</option>
<option value="Netherland Antilles">Netherland Antilles</option>
<option value="Netherlands">Netherlands (Holland, Europe)</option>
<option value="Nevis">Nevis</option>
<option value="New Caledonia">New Caledonia</option>
<option value="New Zealand">New Zealand</option>
<option value="Nicaragua">Nicaragua</option>
<option value="Niger">Niger</option>
<option value="Nigeria">Nigeria</option>
<option value="Niue">Niue</option>
<option value="Norfolk Island">Norfolk Island</option>
<option value="Norway">Norway</option>
<option value="Oman">Oman</option>
<option value="Pakistan">Pakistan</option>
<option value="Palau Island">Palau Island</option>
<option value="Palestine">Palestine</option>
<option value="Panama">Panama</option>
<option value="Papua New Guinea">Papua New Guinea</option>
<option value="Paraguay">Paraguay</option>
<option value="Peru">Peru</option>
<option value="Phillipines">Philippines</option>
<option value="Pitcairn Island">Pitcairn Island</option>
<option value="Poland">Poland</option>
<option value="Portugal">Portugal</option>
<option value="Puerto Rico">Puerto Rico</option>
<option value="Qatar">Qatar</option>
<option value="Republic of Montenegro">Republic of Montenegro</option>
<option value="Republic of Serbia">Republic of Serbia</option>
<option value="Reunion">Reunion</option>
<option value="Romania">Romania</option>
<option value="Russia">Russia</option>
<option value="Rwanda">Rwanda</option>
<option value="St Barthelemy">St Barthelemy</option>
<option value="St Eustatius">St Eustatius</option>
<option value="St Helena">St Helena</option>
<option value="St Kitts-Nevis">St Kitts-Nevis</option>
<option value="St Lucia">St Lucia</option>
<option value="St Maarten">St Maarten</option>
<option value="St Pierre & Miquelon">St Pierre & Miquelon</option>
<option value="St Vincent & Grenadines">St Vincent & Grenadines</option>
<option value="Saipan">Saipan</option>
<option value="Samoa">Samoa</option>
<option value="Samoa American">Samoa American</option>
<option value="San Marino">San Marino</option>
<option value="Sao Tome & Principe">Sao Tome & Principe</option>
<option value="Saudi Arabia">Saudi Arabia</option>
<option value="Senegal">Senegal</option>
<option value="Seychelles">Seychelles</option>
<option value="Sierra Leone">Sierra Leone</option>
<option value="Singapore">Singapore</option>
<option value="Slovakia">Slovakia</option>
<option value="Slovenia">Slovenia</option>
<option value="Solomon Islands">Solomon Islands</option>
<option value="Somalia">Somalia</option>
<option value="South Africa">South Africa</option>
<option value="Spain">Spain</option>
<option value="Sri Lanka">Sri Lanka</option>
<option value="Sudan">Sudan</option>
<option value="Suriname">Suriname</option>
<option value="Swaziland">Swaziland</option>
<option value="Sweden">Sweden</option>
<option value="Switzerland">Switzerland</option>
<option value="Syria">Syria</option>
<option value="Tahiti">Tahiti</option>
<option value="Taiwan">Taiwan</option>
<option value="Tajikistan">Tajikistan</option>
<option value="Tanzania">Tanzania</option>
<option value="Thailand">Thailand</option>
<option value="Togo">Togo</option>
<option value="Tokelau">Tokelau</option>
<option value="Tonga">Tonga</option>
<option value="Trinidad & Tobago">Trinidad & Tobago</option>
<option value="Tunisia">Tunisia</option>
<option value="Turkey">Turkey</option>
<option value="Turkmenistan">Turkmenistan</option>
<option value="Turks & Caicos Is">Turks & Caicos Is</option>
<option value="Tuvalu">Tuvalu</option>
<option value="Uganda">Uganda</option>
<option value="United Kingdom">United Kingdom</option>
<option value="Ukraine">Ukraine</option>
<option value="United Arab Erimates">United Arab Emirates</option>
<option value="United States of America">United States of America</option>
<option value="Uraguay">Uruguay</option>
<option value="Uzbekistan">Uzbekistan</option>
<option value="Vanuatu">Vanuatu</option>
<option value="Vatican City State">Vatican City State</option>
<option value="Venezuela">Venezuela</option>
<option value="Vietnam">Vietnam</option>
<option value="Virgin Islands (Brit)">Virgin Islands (Brit)</option>
<option value="Virgin Islands (USA)">Virgin Islands (USA)</option>
<option value="Wake Island">Wake Island</option>
<option value="Wallis & Futana Is">Wallis & Futana Is</option>
<option value="Yemen">Yemen</option>
<option value="Zaire">Zaire</option>
<option value="Zambia">Zambia</option>
<option value="Zimbabwe">Zimbabwe</option>
</select>
\ No newline at end of file
insurance_types/additional/form-input/genders.php 0 → 100644
<input type="radio" name="Gender" value="Male" class="exception" <?php if ($Gender == "Male") echo "checked" ?> ><label for="Male">Male</label>
<input type="radio" name="Gender" value="Female" class="exception" <?php if ($Gender == "Female") echo "checked" ?>><label for="Female">Female</label>
<input type="radio" name="Gender" value="Other" class="exception" <?php if ($Gender == "Other") echo "checked" ?>><label for="Other">Other</label>
\ No newline at end of file
insurance_types/additional/form-input/person.php 0 → 100644
<div class="card person">
<h2>Insured Person</h2>
<label for="Email">Email:</label><br><input type="Email" name="Email" value = "
<?php if(@$data['Email'] == '')
{
echo$_COOKIE["email"];}
else
{
echo @$data['Email'];
}?>"><br><br>
<label for="FirstName">First name:</label><br><input type="text" name="FirstName" value="<?php echo @$data['FirstName'];?>"><br><br>
<label for="LastName">Last name:</label><br><input type="text" name="LastName" value="<?php echo @$data['LastName'];?>"><br><br>
<label for="Age">Birth date:</label><br><input type="date" name="BirthDate" value="<?php echo @$data['BirthDate'];?>"><br><br>
<label for="Countries">Citizenship:</label><br><?php require "countries.php"?><br><br>
<label for="Passport">Passport number:</label><br><input type="text" name="Passport" value="<?php echo @$data['Passport'];?>"><br><br>
<label for="Gender">Gender:</label><br><?php require "genders.php";?>
</div>
\ No newline at end of file
insurance_types/additional/html-parts/footer.php 0 → 100644
<footer class="footer">
<div class="container">
<div class="footer-block">
<img class="footer-logo" src="..\images\logo5.png" alt="logo">
<nav class="footer-nav">
<a href="#" class="footer-link">Partnership</a>
<a href="#" class="footer-link">Awards</a>
<a href="#" class="footer-link">Offices</a>
<a href="#" class="footer-link">Contacts</a>
</nav>
` <div class="social-links">
<a class="social-link" href="#"><img src="..\images\inst.svg" alt="instagram"></a>
<a class="social-link" href="#"><img src="..\images\face.svg" alt="facebook"></a>
<a class="social-link" href="#"><img src="..\images\vk.svg" alt="vk"></a>
</div>
</div>
</div>
</footer>
\ No newline at end of file
insurance_types/additional/html-parts/header.php 0 → 100644
<header>
<a class="logo animated fadeInRight delay-1s" href="../index.php"><img src="../images/logo5.png" alt="logotype" class="new-logo"> </a>
<input type="text" class="input input-address" placeholder="Search">
</header>
\ No newline at end of file
insurance_types/auto.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
</body>
</html>
\ No newline at end of file
insurance_types/css/style.css 0 → 100644
*{
box-sizing: border-box;
}
.mistakes{
background-color: rgb(255, 94, 0);
text-align: center;
font-size: 20px;
height: 60px;
vertical-align: middle;
border-radius: 5px;
margin: auto 100px;
padding: auto;
justify-content: flex;
flex-wrap: wrap;
margin-bottom: 20px;
}
.promo{
width: 1200px;
height: 300px;
box-shadow: 0px 7px 12px rgba(158, 158, 163, 0.1);
background: #FFF1B8 url(../../images/icon-blue.png) no-repeat center right;
border-radius: 10px;
margin-bottom: 40px;
}
.promo-title{
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 39px;
line-height: 46px;
padding-top: 70px;
padding-left: 70px;
margin: 0;
}
.promo-text{
padding-top: 25px;
margin: 0;
padding-left: 70px;
font-size: 25px;
}
.output{
padding-top: 20px;
}
body{
font-family: "Roboto", sans-serif;
padding-top: 44px;
}
.container{
max-width: 1200px;
margin: auto;
}
header{
display: flex;
align-items: center;
justify-content: left;
margin-bottom: 35px;
vertical-align: middle;
}
header .input{
margin-left: 100px;
font-size: 16px;
line-height: 24px;
background: #FFFFFF;
border: 1px solid #D9D9D9;
padding-left: 35px;
background-repeat: no-repeat;
background-position: left 11px center;
border-radius: 2px;
background-image: url(../../images/home.svg);
flex: 0.8;
}
.info{
text-align: center;
}
.submit-form{
border-radius: 5px;
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.05);
background-color: #CCE5EA;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: space-between;
vertical-align: middle;
border: 2px solid green;
}
.dates{
display: flex;
flex-wrap: wrap;
}
.date{
flex-basis: 48%;
}
input[type="submit"]{
border-radius: 5px;
}
div.submit-form input[type = "text"],
div.submit-form input[type = "email"],
div.submit-form input[type="date"],
select{
border-radius: 5px;
width: 250px;
padding-left: 5px;
height: 25px;
}
div.submit-form input[type = "radio"],
div.submit-form input[type = "checkbox"]{
height: 20px;
width: 20px;
}
div.submit-form input[type="radio"]:hover{
border: 3px solid rgb(53, 9, 31);
}
div.submit-form input[type = "text"]:hover,
div.submit-form input[type = "email"]:hover,
div.submit-form input[type="date"]:hover,
div.submit-form select:hover{
border: 2px bold blueviolet;
color: rgb(29, 6, 6);
vertical-align: middle;
font-size: large;
}
div.submit-form input:hover, textarea {
background-color : #d1d1d1;
border: 3px solid blue;
}
.card{
overflow: hidden;
flex-basis: 50%;
text-decoration: none;
height: 500px;
padding: 5px;
}
.person{
flex-basis: 46%;
}
.insurance{
flex-basis: 54%;
}
label{
padding-left: 5px;
}
#continue-button{
padding: 7px;
margin-left: 480px;
font-weight: bold;
}
footer{
padding: 60px 0;
margin-top: 30px;
}
.footer-block{
display: flex;
align-items: center;
justify-content: space-between;
}
.footer-link{
display: inline;
text-decoration: none;
font-size: 18px;
line-height: 21px;
color: #595959;
font-style: normal;
font-weight: normal;
}
.footer-link:not(:last-child){
margin-right: 15px;
}
.footer-nav{
margin-right: auto;
margin-left: 35px;
}
.social-links{
display: flex;
align-items: center;
}
.social-link:not(:last-child){
margin-right: 21px;
}
@media(max-width: 1366px){
.container{
max-width: 960px;
}
.promo{
background-size: 750px;
background-position: center right -200px;
padding: 50px;
}
.rating{
margin-right: 15px;
}
}
@media(max-width: 992px){
.container{
max-width: 750px;
}
.promo{
background-size: 500px;
background-position: center right -200px;
padding: 50px;
}
.promo-text{
font-size: 18px;
max-width: 400px;
}
.footer-link{
font-size: 16px;
}
}
@media(max-width: 768px){
.container{
max-width: 560px;
}
.card .rating{
flex-basis: 100%;
}
.card-info{
flex-wrap: wrap;
}
.card-title{
font-size: 18px;
}
.promo{
background-size: 400px;
background-position: bottom 55px right -200px;
}
.promo-title{
font-size: 24px;
line-height: 1.4;
}
.promo-text{
margin-top: 0;
}
.button{
font-size: 12px;
line-height: 14px;
}
}
@media(max-width: 578px){
.button{
min-height: 40px;
text-align: center;
}
.container{
max-width: 90%;
}
header{
flex-wrap: wrap;
}
.input-address{
order: 5;
margin-top: 15px;
flex: 1%;
/* flex-basis: 100%; */
}
.promo{
background-image: none;
}
.promo-title{
margin-bottom: 10px;
}
.section-title{
font-size: 20px;
}
.card{
flex-basis: 100%;
}
.card-image{
width: 100%;
}
.footer{
padding: 30px;
}
.footer-block{
align-items: flex-start;
}
.footer-nav{
order:0;
margin-left: 0;
display: flex;
flex-direction: column;
margin-right: 0;
}
.footer-logo{
order:1;
margin-right: 15px;
}
.social-links{
order:2;
}
}
@media(max-width: 480px){
.button-text{
display: none;
}
.button{
min-height: 40px;
}
.button-icon{
margin: 0;
}
.promo{
padding: 20px;
}
.section-header{
flex-wrap: wrap;
}
.footer-block{
flex-wrap: wrap;
flex-direction: column;
align-items: center;
}
.footer-logo{
order:0;
margin-bottom: 20px;
}
.footer-nav{
margin-bottom: 20px;
text-align: center;
}
.footer-link:not(:last-child){
margin-right: 0;
}
}
\ No newline at end of file
insurance_types/final/checkpoint.php 0 → 100644
<?php
session_start();
error_reporting(0);
$Email = $_SESSION['Email'];
$FirstName = $_SESSION['FirstName'];
$LastName = $_SESSION['LastName'];
$BirthDate = $_SESSION['BirthDate'];
$Country = $_SESSION['Country'];
$Passport = $_SESSION['Passport'];
$Gender = $_SESSION['Gender'];
$StartDate = $_SESSION['StartDate'];
$EndDate = $_SESSION['EndDate'];
$Area = $_SESSION['Area'];
//echo "You ordered it!";
//$query = "INSERT INTO `travelling-insurance` (`first-name`, `last-name`,
//`birth-date`, `citizenship`, `passport-number`, `gender`, `area`, `start-date`, `end-date`, `email`) VALUES ('$FirstName', '$LastName', '$BirthDate', '$Country', '$Passport', '$Gender', '$Area', '$StartDate', '$EndDate', '$Email')";
//$result = mysqli_query($connnection, $query);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Confirmation</title>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="../../css/normalize.css">
</head>
<body>
<div class="container">
<header>
<a class="logo animated fadeInRight delay-1s" href="../../index.php"><img src="../../images/logo5.png" alt="logotype" class="new-logo"> </a>
<input type="text" class="input input-address" placeholder="Search">
</header>
<section class="promo">
<h1 class="promo-title">Travelling insurance appliation<br>Step 3</h1>
<p class="promo-text">Please, check provided information and pay</p>
</section>
<div class="main-header">
<span class="main-header-text">Check once more provided information and finish your application process</span>
</div>
<div class="main-content">
<div class="main">
<div class="person">
<h3 class="personal-info">Personal Information</h3>
<ul>
<li>First name: &nbsp; <?php echo " " . $FirstName;?></li>
<li>Last name: &nbsp; <?php echo $LastName;?></li>
<li>Date of birth: &nbsp; <?php echo $BirthDate;?></li>
<li>Country: &nbsp; <?php echo $Country;?></li>
<li>Passport number: &nbsp; <?php echo $Passport;?></li>
<li>Gender: &nbsp; <?php echo $Gender;?></li>
<li>Email: &nbsp; <?php echo $Email;?></li>
</ul>
</div>
<div class="insurance">
<h3 class="insurance-info">Insurance Information</h3>
<ul>
<li>Duration: &nbsp; <?php echo $StartDate . " - " . $EndDate;?></li>
<li>Area: &nbsp; <?php echo $Area;?></li>
<li>Total price: &nbsp; <?php echo "50$"; ?> </li>
</ul>
</div>
</div>
<div class="finish">
<div class="back">
<button onclick="history.go(-1);">Go back</button>
</div>
<div class="pay">
<form action="end.php" method="POST">
<input type="submit" value="Pay and get insurance">
</div>
</div>
</div>
<footer class="footer">
<div class="container">
<div class="footer-block">
<img class="footer-logo" src="..\..\images\logo5.png" alt="logo">
<nav class="footer-nav">
<a href="#" class="footer-link">Partnership</a>
<a href="#" class="footer-link">Awards</a>
<a href="#" class="footer-link">Offices</a>
<a href="#" class="footer-link">Contacts</a>
</nav>
<div class="social-links">
<a class="social-link" href="#"><img src="..\..\images\inst.svg" alt="instagram"></a>
<a class="social-link" href="#"><img src="..\..\images\face.svg" alt="facebook"></a>
<a class="social-link" href="#"><img src="..\..\images\vk.svg" alt="vk"></a>
</div>
</div>
</footer>
<!-- basket -->
</body>
</html>
insurance_types/final/style.css 0 → 100644
*{
box-sizing: border-box;
}
.promo{
width: 1200px;
height: 300px;
box-shadow: 0px 7px 12px rgba(158, 158, 163, 0.1);
background: #FFF1B8 url(../../images/icon-blue.png) no-repeat center right;
border-radius: 10px;
margin-bottom: 40px;
}
.promo-title{
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 39px;
line-height: 46px;
padding-top: 70px;
padding-left: 70px;
margin: 0;
}
.promo-text{
padding-top: 25px;
margin: 0;
padding-left: 70px;
font-size: 25px;
}
.output{
padding-top: 20px;
}
body{
font-family: "Roboto", sans-serif;
padding-top: 44px;
}
.container{
max-width: 1200px;
margin: auto;
}
header{
display: flex;
align-items: center;
justify-content: left;
margin-bottom: 35px;
vertical-align: middle;
}
header .input{
margin-left: 100px;
font-size: 16px;
line-height: 24px;
background: #FFFFFF;
border: 1px solid #D9D9D9;
padding: 8px;
padding-left: 35px;
background-repeat: no-repeat;
background-position: left 11px center;
border-radius: 2px;
background-image: url(../../images/home.svg);
flex: 0.8;
}
.main-content{
background-color: #9DCA92;
border-radius: 5px;
padding: 20px;
}
.main{
display: flex;
justify-content: left;
max-width: 900px;
margin: auto;
font-size: larger;
}
.main-header{
text-align: center;
margin-bottom: 50px;
}
.insurance{
padding-left: 150px;
justify-content: right;
}
.person{
justify-content: right;
padding-left: 50px;
}
.main-header-text{
font-size: 30px;
}
ul{
list-style-type: none;
margin: 0;
padding: 0;
}
li{
margin-top: 10px;
}
.finish{
display: flex;
justify-content: space-between;
max-width: 800px;
padding-top: 30px;
margin: auto;
}
.pay{
margin-right: 130px;
}
footer{
padding: 60px 0;
margin-top: 30px;
}
.footer-block{
display: flex;
align-items: center;
justify-content: space-between;
}
.footer-link{
display: inline;
text-decoration: none;
font-size: 18px;
line-height: 21px;
color: #595959;
font-style: normal;
font-weight: normal;
}
.footer-link:not(:last-child){
margin-right: 15px;
}
.footer-nav{
margin-right: auto;
margin-left: 35px;
}
.social-links{
display: flex;
align-items: center;
}
.social-link:not(:last-child){
margin-right: 21px;
}
\ No newline at end of file
insurance_types/travelling.php 0 → 100644
<?php
session_start();
error_reporting(0);
$data = $_POST;
if(isset($data['submit']))
{
$Email = filter_var(trim($data['Email']), FILTER_SANITIZE_STRING);
$FirstName = filter_var(trim($data['FirstName']), FILTER_SANITIZE_STRING);
$LastName = filter_var(trim($data['LastName']), FILTER_SANITIZE_STRING);
$BirthDate = filter_var(trim($data['BirthDate']), FILTER_SANITIZE_STRING);
$Country = filter_var(trim($data['Countries']), FILTER_SANITIZE_STRING);
$Passport = filter_var(trim($data['Passport']), FILTER_SANITIZE_STRING);
$Gender = filter_var(trim($data['Gender']), FILTER_SANITIZE_STRING);
$StartDate = filter_var(trim($data['StartDate']), FILTER_SANITIZE_STRING);
$EndDate = filter_var(trim($data['EndDate']), FILTER_SANITIZE_STRING);
$Area = filter_var(trim($data['Area']), FILTER_SANITIZE_STRING);
require "additional/errors/person.php";
require "additional/errors/confirm.php";
require "additional/errors/start-end.php";
if($Area == '' || $Area == "Select an area"){ $errors[] = 'Choose area of your insurance!';}
if(empty($errors))
{
$_SESSION['Email'] = $Email;
$_SESSION['FirstName'] = $FirstName;
$_SESSION['LastName'] = $LastName;
$_SESSION['BirthDate'] = $BirthDate;
$_SESSION['Country'] = $Country;
$_SESSION['Passport'] = $Passport;
$_SESSION['Gender'] = $Gender;
$_SESSION['StartDate'] = $StartDate;
$_SESSION['EndDate'] = $EndDate;
$_SESSION['Area'] = $Area;
header('Location:final\checkpoint.php');
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Travelling insurance</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="../../css/normalize.css">
</head>
<body>
<div class="container">
<?php require "additional\html-parts\header.php";?>
<section class="promo">
<h1 class="promo-title">Travelling insurance appliation<br>Step 1</h1>
<p class="promo-text">Please, fill the form below in order to continue</p>
</section>
<section class="info">
<h3>Go to <a href="../index.php">main page</a> and login in order to save your infotmation to use it next time</h3>
</section>
<?php if(!empty($errors)) echo '<div class="mistakes">' . '<div class="output">' .array_shift($errors) . '</div>' . '</div>';?>
<div class="main">
<form action="travelling.php" method="POST">
<div class="submit-form">
<?php require "additional/form-input/person.php";?>
<div class="card insurance">
<h2>Insurance Information</h2>
<label for="Area">Area of Cover:</label><br><?php require "additional/form-input/areas.php"; ?><br><br>
<div class="dates">
<div class="date"></span><label for="StartDate">Start date:</label><br><input type="date" name="StartDate" value="<?php echo @$data['StartDate'];?>"></div>
<div class="date"><label for="EndDate">End date:</label><br><input type="date" name="EndDate" value="<?php echo @$data['EndDate'];?>"></div>
</div><br><br>
<?php require "additional/form-input/confirmation.php";?><br><br>
<input id="continue-button" type="submit" name="submit" value="continue">
</div>
</div>
</div>
<?php require "additional/html-parts/footer.php";?>
</div>
</body>
</html>
js/login.js 0 → 100644
const loginButton = document.querySelector('#login-button');
const login = document.querySelector(".login");
const loginClose = document.querySelector(".login-close");
loginButton.addEventListener('click', toggleModal);
loginClose.addEventListener('click', toggleModal);
function toggleModal(){
login.classList.toggle("is-open");
}
new WOW().init();
js/register.js 0 → 100644
const registerButton = document.querySelector('#register-button');
const register = document.querySelector(".register");
const registerClose = document.querySelector(".register-close");
registerButton.addEventListener('click', toggleRegister);
registerClose.addEventListener('click', toggleRegister);
function toggleRegister(){
register.classList.toggle("is-close");
}
js/wow.min.js 0 → 100644
/*! WOW - v1.1.3 - 2016-05-06
* Copyright (c) 2016 Matthieu Aussaguel;*/(function(){var a,b,c,d,e,f=function(a,b){return function(){return a.apply(b,arguments)}},g=[].indexOf||function(a){for(var b=0,c=this.length;c>b;b++)if(b in this&&this[b]===a)return b;return-1};b=function(){function a(){}return a.prototype.extend=function(a,b){var c,d;for(c in b)d=b[c],null==a[c]&&(a[c]=d);return a},a.prototype.isMobile=function(a){return/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(a)},a.prototype.createEvent=function(a,b,c,d){var e;return null==b&&(b=!1),null==c&&(c=!1),null==d&&(d=null),null!=document.createEvent?(e=document.createEvent("CustomEvent"),e.initCustomEvent(a,b,c,d)):null!=document.createEventObject?(e=document.createEventObject(),e.eventType=a):e.eventName=a,e},a.prototype.emitEvent=function(a,b){return null!=a.dispatchEvent?a.dispatchEvent(b):b in(null!=a)?a[b]():"on"+b in(null!=a)?a["on"+b]():void 0},a.prototype.addEvent=function(a,b,c){return null!=a.addEventListener?a.addEventListener(b,c,!1):null!=a.attachEvent?a.attachEvent("on"+b,c):a[b]=c},a.prototype.removeEvent=function(a,b,c){return null!=a.removeEventListener?a.removeEventListener(b,c,!1):null!=a.detachEvent?a.detachEvent("on"+b,c):delete a[b]},a.prototype.innerHeight=function(){return"innerHeight"in window?window.innerHeight:document.documentElement.clientHeight},a}(),c=this.WeakMap||this.MozWeakMap||(c=function(){function a(){this.keys=[],this.values=[]}return a.prototype.get=function(a){var b,c,d,e,f;for(f=this.keys,b=d=0,e=f.length;e>d;b=++d)if(c=f[b],c===a)return this.values[b]},a.prototype.set=function(a,b){var c,d,e,f,g;for(g=this.keys,c=e=0,f=g.length;f>e;c=++e)if(d=g[c],d===a)return void(this.values[c]=b);return this.keys.push(a),this.values.push(b)},a}()),a=this.MutationObserver||this.WebkitMutationObserver||this.MozMutationObserver||(a=function(){function a(){"undefined"!=typeof console&&null!==console&&console.warn("MutationObserver is not supported by your browser."),"undefined"!=typeof console&&null!==console&&console.warn("WOW.js cannot detect dom mutations, please call .sync() after loading new content.")}return a.notSupported=!0,a.prototype.observe=function(){},a}()),d=this.getComputedStyle||function(a,b){return this.getPropertyValue=function(b){var c;return"float"===b&&(b="styleFloat"),e.test(b)&&b.replace(e,function(a,b){return b.toUpperCase()}),(null!=(c=a.currentStyle)?c[b]:void 0)||null},this},e=/(\-([a-z]){1})/g,this.WOW=function(){function e(a){null==a&&(a={}),this.scrollCallback=f(this.scrollCallback,this),this.scrollHandler=f(this.scrollHandler,this),this.resetAnimation=f(this.resetAnimation,this),this.start=f(this.start,this),this.scrolled=!0,this.config=this.util().extend(a,this.defaults),null!=a.scrollContainer&&(this.config.scrollContainer=document.querySelector(a.scrollContainer)),this.animationNameCache=new c,this.wowEvent=this.util().createEvent(this.config.boxClass)}return e.prototype.defaults={boxClass:"wow",animateClass:"animated",offset:0,mobile:!0,live:!0,callback:null,scrollContainer:null},e.prototype.init=function(){var a;return this.element=window.document.documentElement,"interactive"===(a=document.readyState)||"complete"===a?this.start():this.util().addEvent(document,"DOMContentLoaded",this.start),this.finished=[]},e.prototype.start=function(){var b,c,d,e;if(this.stopped=!1,this.boxes=function(){var a,c,d,e;for(d=this.element.querySelectorAll("."+this.config.boxClass),e=[],a=0,c=d.length;c>a;a++)b=d[a],e.push(b);return e}.call(this),this.all=function(){var a,c,d,e;for(d=this.boxes,e=[],a=0,c=d.length;c>a;a++)b=d[a],e.push(b);return e}.call(this),this.boxes.length)if(this.disabled())this.resetStyle();else for(e=this.boxes,c=0,d=e.length;d>c;c++)b=e[c],this.applyStyle(b,!0);return this.disabled()||(this.util().addEvent(this.config.scrollContainer||window,"scroll",this.scrollHandler),this.util().addEvent(window,"resize",this.scrollHandler),this.interval=setInterval(this.scrollCallback,50)),this.config.live?new a(function(a){return function(b){var c,d,e,f,g;for(g=[],c=0,d=b.length;d>c;c++)f=b[c],g.push(function(){var a,b,c,d;for(c=f.addedNodes||[],d=[],a=0,b=c.length;b>a;a++)e=c[a],d.push(this.doSync(e));return d}.call(a));return g}}(this)).observe(document.body,{childList:!0,subtree:!0}):void 0},e.prototype.stop=function(){return this.stopped=!0,this.util().removeEvent(this.config.scrollContainer||window,"scroll",this.scrollHandler),this.util().removeEvent(window,"resize",this.scrollHandler),null!=this.interval?clearInterval(this.interval):void 0},e.prototype.sync=function(b){return a.notSupported?this.doSync(this.element):void 0},e.prototype.doSync=function(a){var b,c,d,e,f;if(null==a&&(a=this.element),1===a.nodeType){for(a=a.parentNode||a,e=a.querySelectorAll("."+this.config.boxClass),f=[],c=0,d=e.length;d>c;c++)b=e[c],g.call(this.all,b)<0?(this.boxes.push(b),this.all.push(b),this.stopped||this.disabled()?this.resetStyle():this.applyStyle(b,!0),f.push(this.scrolled=!0)):f.push(void 0);return f}},e.prototype.show=function(a){return this.applyStyle(a),a.className=a.className+" "+this.config.animateClass,null!=this.config.callback&&this.config.callback(a),this.util().emitEvent(a,this.wowEvent),this.util().addEvent(a,"animationend",this.resetAnimation),this.util().addEvent(a,"oanimationend",this.resetAnimation),this.util().addEvent(a,"webkitAnimationEnd",this.resetAnimation),this.util().addEvent(a,"MSAnimationEnd",this.resetAnimation),a},e.prototype.applyStyle=function(a,b){var c,d,e;return d=a.getAttribute("data-wow-duration"),c=a.getAttribute("data-wow-delay"),e=a.getAttribute("data-wow-iteration"),this.animate(function(f){return function(){return f.customStyle(a,b,d,c,e)}}(this))},e.prototype.animate=function(){return"requestAnimationFrame"in window?function(a){return window.requestAnimationFrame(a)}:function(a){return a()}}(),e.prototype.resetStyle=function(){var a,b,c,d,e;for(d=this.boxes,e=[],b=0,c=d.length;c>b;b++)a=d[b],e.push(a.style.visibility="visible");return e},e.prototype.resetAnimation=function(a){var b;return a.type.toLowerCase().indexOf("animationend")>=0?(b=a.target||a.srcElement,b.className=b.className.replace(this.config.animateClass,"").trim()):void 0},e.prototype.customStyle=function(a,b,c,d,e){return b&&this.cacheAnimationName(a),a.style.visibility=b?"hidden":"visible",c&&this.vendorSet(a.style,{animationDuration:c}),d&&this.vendorSet(a.style,{animationDelay:d}),e&&this.vendorSet(a.style,{animationIterationCount:e}),this.vendorSet(a.style,{animationName:b?"none":this.cachedAnimationName(a)}),a},e.prototype.vendors=["moz","webkit"],e.prototype.vendorSet=function(a,b){var c,d,e,f;d=[];for(c in b)e=b[c],a[""+c]=e,d.push(function(){var b,d,g,h;for(g=this.vendors,h=[],b=0,d=g.length;d>b;b++)f=g[b],h.push(a[""+f+c.charAt(0).toUpperCase()+c.substr(1)]=e);return h}.call(this));return d},e.prototype.vendorCSS=function(a,b){var c,e,f,g,h,i;for(h=d(a),g=h.getPropertyCSSValue(b),f=this.vendors,c=0,e=f.length;e>c;c++)i=f[c],g=g||h.getPropertyCSSValue("-"+i+"-"+b);return g},e.prototype.animationName=function(a){var b;try{b=this.vendorCSS(a,"animation-name").cssText}catch(c){b=d(a).getPropertyValue("animation-name")}return"none"===b?"":b},e.prototype.cacheAnimationName=function(a){return this.animationNameCache.set(a,this.animationName(a))},e.prototype.cachedAnimationName=function(a){return this.animationNameCache.get(a)},e.prototype.scrollHandler=function(){return this.scrolled=!0},e.prototype.scrollCallback=function(){var a;return!this.scrolled||(this.scrolled=!1,this.boxes=function(){var b,c,d,e;for(d=this.boxes,e=[],b=0,c=d.length;c>b;b++)a=d[b],a&&(this.isVisible(a)?this.show(a):e.push(a));return e}.call(this),this.boxes.length||this.config.live)?void 0:this.stop()},e.prototype.offsetTop=function(a){for(var b;void 0===a.offsetTop;)a=a.parentNode;for(b=a.offsetTop;a=a.offsetParent;)b+=a.offsetTop;return b},e.prototype.isVisible=function(a){var b,c,d,e,f;return c=a.getAttribute("data-wow-offset")||this.config.offset,f=this.config.scrollContainer&&this.config.scrollContainer.scrollTop||window.pageYOffset,e=f+Math.min(this.element.clientHeight,this.util().innerHeight())-c,d=this.offsetTop(a),b=d+a.clientHeight,e>=d&&b>=f},e.prototype.util=function(){return null!=this._util?this._util:this._util=new b},e.prototype.disabled=function(){return!this.config.mobile&&this.util().isMobile(navigator.userAgent)},e}()}).call(this);
\ No newline at end of file
php/css/login-page.css 0 → 100644
body{
text-align: center;
background-color: #74C35A;
}
#the_only_form{
display: inline-block;
position: relative;
top:200px;
background-color: white;
width: 400px;
height: 400px;
padding: 0 auto;
text-align: center;
}
#inner{
position: relative;
top:60px;
}
input[type="text"], textarea{
background-color: #F3EFF2;
width: 300px;
height: 50px;
font-size: 26px;
}
input[type="password"], textarea{
background-color: #F3EFF2;
width: 300px;
height: 50px;
font-size: 26px;
}
input[type="submit"], textarea{
background-color: #00B242;
width: 300px;
height: 50px;
}
#question{
padding-top: 20px;
color: black;
}
a{
color: #5E2691;
}
\ No newline at end of file
php/css/register-page.css 0 → 100644
body{
text-align: center;
background-color: #74C35A;
justify-content: center;
}
#content{
display: inline-block;
position: relative;
top:100px;
background-color: white;
width: 400px;
height: 540px;
padding: 0 auto;
text-align: center;
}
#content > input[type="text"], #content > input[type="Email"], #content > input[type="password"], textarea{
background-color: #F2F2F2;
width: 300px;
height: 30px;
font-size: 26px;
}
#mistakes{
color: blue;
}
input[type="submit"], textarea{
background-color: #00B242;
width: 300px;
height: 50px;
font-size: 26px;
}
\ No newline at end of file
php/database_connection.php 0 → 100644
<?php
$connnection = mysqli_connect('127.0.0.1', 'root', '', 'globalcare');
?>
\ No newline at end of file
php/login-page.php 0 → 100644
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/login-page.css">
<title>Authorization</title>
<meta charset="utf-8"/>
</head>
<body>
<?php
error_reporting(0);
if(isset($_POST['login'])){
$data = $_POST;
$login = $data['username'];
$password = md5($data['password']."AlmazKydyrminFromQazaqstan");
require_once "database_connection.php";
if($connnection == false)
{
echo 'something went wrong...';
echo mysql_connect_error();
exit();
}
else
{
$sql = "SELECT * FROM `users` WHERE `email` LIKE '$login' AND `password` LIKE '$password'";
$result = mysqli_query($connnection, $sql);
$user = mysqli_fetch_assoc($result);
if(count($user) == 0)
{
echo "<p style='text-align: center;'>User with such login and password is not found</p>";
}
else
{
echo "string";
setcookie('name', $user['name'], time() + 1000, "/");
setcookie('surname', $user['surname'], time() + 1000, "/");
$connnection->close();
header('Location:../index.php');
}
}
}
?>
<form id="the_only_form" action="login-page.php" method="POST">
<div id="inner">
<p><input type="text" placeholder="username" name="username" ></p>
<p><input id="aleke" type="password" placeholder="password" name="password" {font:small-caption;font-size:16px}></p>
<p><input type="submit" value = "LOGIN" name="login"></p>
<p id="question">Not registered? <a href="registration.php">Create an account</a></p>
<div>
</form>
</body>
\ No newline at end of file
php/login.php 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<?php
error_reporting(0);
if(isset($_POST['login'])){
$data = $_POST;
$login = $data['email'];
$password = md5($data['password']."AlmazKydyrminFromQazaqstan");
require_once "database_connection.php";
if($connnection == false)
{
echo 'something went wrong...';
echo mysql_connect_error();
exit();
}
else
{
$sql = "SELECT * FROM `users` WHERE `email` LIKE '$login' AND `password` LIKE '$password'";
$result = mysqli_query($connnection, $sql);
$user = mysqli_fetch_assoc($result);
if(count($user) == 0)
{
echo "<p style='text-align: center;'>User with such login and password is not found</p>";
}
else
{
echo "Works!";
setcookie('name', $user['name'], time() + 1000, "/");
setcookie('surname', $user['surname'], time() + 1000, "/");
setcookie('email', $user['email'], time() + 1000, "/");
$connnection->close();
header('Location:../index.php');
}
}
}
?>
</body>
</html>
\ No newline at end of file
php/logout.php 0 → 100644
<?php
setcookie('name','', time() - 3600, "/");
setcookie('surname','', time() - 3600, "/");
header('Location:../index.php'); // pereiti na glavnuyu
?>
\ No newline at end of file
php/register-page.php 0 → 100644
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/register-page.css">
<title>Registration</title>
<meta charset="utf-8"/>
</head>
<body>
<?php
error_reporting(0);
$data = $_POST;
if(isset($data['signup'])) // registration p-ss
{
$name = filter_var(trim($data['name']), FILTER_SANITIZE_STRING);
$Lname = filter_var(trim($data['Lname']), FILTER_SANITIZE_STRING);
$Email = filter_var(trim($data['Email']), FILTER_SANITIZE_STRING);
$password = filter_var(trim($data['password']), FILTER_SANITIZE_STRING);
if($name == ''){ $errors[] = 'Enter your name!';}
elseif(mb_strlen($name) < 3 || mb_strlen($name) > 90){$errors[] = 'Minimum length for name is 3 characters';}
if($Lname == ''){ $errors[] = 'Enter your last name!';}
elseif(mb_strlen($Lname) < 3 || mb_strlen($Lname) > 90){$errors[] = 'Minimum length for last name is 3 characters';}
if($Email == ''){ $errors[] = 'Enter your email!';}
elseif(mb_strlen($Email) < 7 || mb_strlen($Email) > 90){$errors[] = 'Minimum length for email is 7 characters';}
if($password == ''){ $errors[] = 'Enter your password!';}
elseif(mb_strlen($password) < 7 || mb_strlen($password) > 90){$errors[] = 'Minimum length for password is 7 characters';}
if(empty($errors))
{
require_once "database_connection.php";
$password = md5($password."AlmazKydyrminFromQazaqstan");
if($connnection == false)
{
echo 'something went wrong...';
echo mysql_connect_error();
exit();
}
else
{
$sql = "SELECT * FROM `users` WHERE `email` LIKE '$Email'";
$result_0 = mysqli_query($connnection, $sql);
$user = mysqli_fetch_assoc($result_0);
if(count($user) != 0)
{
echo "User with such email already exists";
}
else
{
$result = mysqli_query($connnection, "INSERT INTO `users` (`name`, `surname`,
`email`, `password`) VALUES ('$name', '$Lname', '$Email', '$password')");
echo "Congratulations! You are registered!";
$connnection->close();
header('Location:login-page.php');
}
}
}
else
{
echo '<div id="mistakes">' .array_shift($errors). '</div>';
}
}
?>
<form action="register-page.php" method="POST"> <!--form to be completed-->
<div id="content">
<p>
<p><strong>First Name:</strong></p>
<input type="text" name="name" value="<?php echo @$data['name'];?>">
</p>
<p>
<p><strong>Last Name:</strong></p>
<input type="text" name="Lname" value="<?php echo @$data['Lname'];?>">
</p>
<p>
<p><strong>Email:</strong></p>
<input type="Email" name="Email" value="<?php echo @$data['Email'];?>">
</p>
<p>
<p><strong>Password:</strong></p>
<input type="password" name="password" value="<?php echo @$data['password'];?>">
</p>
<p>
<input type="submit" name="signup" value="Register">
</p>
</div>
</form>
</body>
\ No newline at end of file
php/register.php 0 → 100644
<?php
error_reporting(0);
$data = $_POST;
$name = filter_var(trim($data['fname']), FILTER_SANITIZE_STRING);
$Lname = filter_var(trim($data['lname']), FILTER_SANITIZE_STRING);
$Email = filter_var(trim($data['email']), FILTER_SANITIZE_STRING);
$password = filter_var(trim($data['password']), FILTER_SANITIZE_STRING);
if($name == ''){ $errors[] = 'Enter your name!';}
elseif(mb_strlen($name) < 3 || mb_strlen($name) > 90){$errors[] = 'Minimum length for name is 3 characters';}
if($Lname == ''){ $errors[] = 'Enter your last name!';}
elseif(mb_strlen($Lname) < 3 || mb_strlen($Lname) > 90){$errors[] = 'Minimum length for last name is 3 characters';}
if($Email == ''){ $errors[] = 'Enter your email!';}
elseif(mb_strlen($Email) < 7 || mb_strlen($Email) > 90){$errors[] = 'Minimum length for email is 7 characters';}
if($password == ''){ $errors[] = 'Enter your password!';}
elseif(mb_strlen($password) < 7 || mb_strlen($password) > 90){$errors[] = 'Minimum length for password is 7 characters';}
if(empty($errors))
{
require_once "database_connection.php";
$password = md5($password."AlmazKydyrminFromQazaqstan");
if($connnection == false)
{
echo 'something went wrong...';
echo mysql_connect_error();
exit();
}
else
{
$sql = "SELECT * FROM `users` WHERE `email` LIKE '$Email'";
$result_0 = mysqli_query($connnection, $sql);
$user = mysqli_fetch_assoc($result_0);
if(count($user) != 0)
{
echo "User with such email already exists";
}
else
{
$result = mysqli_query($connnection, "INSERT INTO `users` (`name`, `surname`,
`email`, `password`) VALUES ('$name', '$Lname', '$Email', '$password')");
echo "Congratulations! You are registered!";
$connnection->close();
header('Location:login-page.php');
}
}
}
else
{
echo '<div id="mistakes">' .array_shift($errors). '</div>';
}
?>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment