.sharka {
    background-image: linear-gradient(175deg, rgb(164, 211, 160) 0%, rgb(164, 211, 160) 22%, rgb(141, 190, 127) 22%, rgb(141, 190, 127) 61%, rgb(117, 169, 93) 61%, rgb(117, 169, 93) 68%, rgb(94, 147, 60) 68%, rgb(94, 147, 60) 92%, rgb(70, 126, 26) 92%, rgb(70, 126, 26) 100%), linear-gradient(310deg, rgb(164, 211, 160) 0%, rgb(164, 211, 160) 22%, rgb(141, 190, 127) 22%, rgb(141, 190, 127) 61%, rgb(117, 169, 93) 61%, rgb(117, 169, 93) 68%, rgb(94, 147, 60) 68%, rgb(94, 147, 60) 92%, rgb(70, 126, 26) 92%, rgb(70, 126, 26) 100%), linear-gradient(265deg, rgb(164, 211, 160) 0%, rgb(164, 211, 160) 22%, rgb(141, 190, 127) 22%, rgb(141, 190, 127) 61%, rgb(117, 169, 93) 61%, rgb(117, 169, 93) 68%, rgb(94, 147, 60) 68%, rgb(94, 147, 60) 92%, rgb(70, 126, 26) 92%, rgb(70, 126, 26) 100%), linear-gradient(265deg, rgb(255, 159, 173), rgb(82, 81, 20));
    background-blend-mode: overlay, overlay, overlay, normal;
}

.sharka1 {
    background-image: linear-gradient(135deg, transparent 0%, transparent 38%, rgba(202, 214, 80, 0.5) 38%, rgba(202, 214, 80, 0.5) 62%, transparent 62%, transparent 64%, rgba(161, 197, 63, 0.5) 64%, rgba(161, 197, 63, 0.5) 100%), linear-gradient(45deg, transparent 0%, transparent 56%, rgb(202, 214, 80) 56%, rgb(202, 214, 80) 64%, rgb(154, 189, 108) 64%, rgb(154, 189, 108) 91%, transparent 91%, transparent 100%), linear-gradient(90deg, rgb(237, 245, 234), rgb(237, 245, 234));
}

.sharka2 {
    background-image: linear-gradient(112.5deg, rgb(64, 64, 64) 0%, rgb(64, 64, 64) 63%, rgb(78, 78, 78) 63%, rgb(78, 78, 78) 78%, rgb(92, 92, 92) 78%, rgb(92, 92, 92) 80%, rgb(106, 106, 106) 80%, rgb(106, 106, 106) 83%, rgb(119, 119, 119) 83%, rgb(119, 119, 119) 86%, rgb(133, 133, 133) 86%, rgb(133, 133, 133) 96%, rgb(147, 147, 147) 96%, rgb(147, 147, 147) 100%), linear-gradient(260deg, rgb(64, 64, 64) 0%, rgb(64, 64, 64) 63%, rgb(78, 78, 78) 63%, rgb(78, 78, 78) 78%, rgb(92, 92, 92) 78%, rgb(92, 92, 92) 80%, rgb(106, 106, 106) 80%, rgb(106, 106, 106) 83%, rgb(119, 119, 119) 83%, rgb(119, 119, 119) 86%, rgb(133, 133, 133) 86%, rgb(133, 133, 133) 96%, rgb(147, 147, 147) 96%, rgb(147, 147, 147) 100%), linear-gradient(157.5deg, rgb(64, 64, 64) 0%, rgb(64, 64, 64) 63%, rgb(78, 78, 78) 63%, rgb(78, 78, 78) 78%, rgb(92, 92, 92) 78%, rgb(92, 92, 92) 80%, rgb(106, 106, 106) 80%, rgb(106, 106, 106) 83%, rgb(119, 119, 119) 83%, rgb(119, 119, 119) 86%, rgb(133, 133, 133) 86%, rgb(133, 133, 133) 96%, rgb(147, 147, 147) 96%, rgb(147, 147, 147) 100%), linear-gradient(260deg, rgb(202, 202, 202), rgb(187, 187, 187));
    background-blend-mode: overlay, overlay, overlay, normal;
}

.image-container {
    /* background-image: url("2022.jpg"); */
    /* The image used - important! */
    background-size: cover;
    position: relative;
    /* Needed to position the cutout text in the middle of the image */
    /* height: 24rem; */
    /* Some height */
}

.text {
    /* background-color: white; */
    color: black;
    font-size: 8vw;
    /* Responsive font size */
    font-weight: bold;
    margin: 0 auto;
    /* Center the text container */
    padding: 10px;
    /* width: 50%; */
    text-align: center;
    /* Center text */
    position: absolute;
    /* Position text */
    top: 50%;
    /* Position text in the middle */
    left: 50%;
    /* Position text in the middle */
    transform: translate(-50%, -50%);
    /* Position text in the middle */
    mix-blend-mode: screen;
    /* This makes the cutout text possible */
}

.center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}

/* 3d shadow text */
.hit-the-floor {
    /* color: #fff; */
    /* font-size: 12em; */
    font-weight: bold;
    /* font-family: Helvetica; */
    text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9,
        0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1),
        0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2),
        0 5px 10px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.2),
        0 20px 20px rgba(0, 0, 0, 0.15);
}

/* .hit-the-floor {
    text-align: center;
} */

/* Сменя текст */
.Iam {
    padding: 2em 5em;
    /* font: normal 40px/50px Montserrat, sans-serif; */
    color: #999;
}
.Iam p {
    /* height: auto; */
    /* float: left; */
    margin-right: 0.3em;
}
.Iam b {
    float: left;
    overflow: hidden;
    position: relative;
    height: 50px;
    width: auto;
    /* top: 40px; */
}
.Iam .innerIam {
    display: inline-block;
    color: #e74c3c;
    position: relative;
    white-space: nowrap;
    top: 0;
    left: 0;

    /*animation*/
    -webkit-animation: move 5s;
    -moz-animation: move 5s;
    -ms-animation: move 5s;
    -o-animation: move 5s;
    animation: move 5s;
    /*animation-iteration-count*/
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -ms-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    /*animation-delay*/
    -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    -ms-animation-delay: 1s;
    -o-animation-delay: 1s;
    animation-delay: 1s;
}
@keyframes move {
    0% {
        top: 0px;
    }
    20% {
        top: -50px;
    }
    40% {
        top: -100px;
    }
    60% {
        top: -150px;
    }
    80% {
        top: -200px;
    }
}

@-webkit-keyframes move {
    0% {
        top: 0px;
    }
    20% {
        top: -50px;
    }
    40% {
        top: -100px;
    }
    60% {
        top: -150px;
    }
    80% {
        top: -200px;
    }
}
@-moz-keyframes move {
    0% {
        top: 0px;
    }
    20% {
        top: -50px;
    }
    40% {
        top: -100px;
    }
    60% {
        top: -150px;
    }
    80% {
        top: -200px;
    }
}
@-o-keyframes move {
    0% {
        top: 0px;
    }
    20% {
        top: -50px;
    }
    40% {
        top: -100px;
    }
    60% {
        top: -150px;
    }
    80% {
        top: -200px;
    }
}
@keyframes move {
    0% {
        top: 0px;
    }
    20% {
        top: -50px;
    }
    40% {
        top: -100px;
    }
    60% {
        top: -150px;
    }
    80% {
        top: -200px;
    }
}
