﻿/*
Theme Name: Einfach.com
Author: Anonymous
Author URI:
Version: 1
Description: Einfach.com theme for Wordpress
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: Einfach.com
Tags: one-column, two-columns
Theme URI:
*/

.bg-img {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-color: rgba(255, 255, 255, 0);
}

.textcontainer {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

u,
.u {
    text-decoration: none;
    position: relative;
    padding: 0 8px 12px;
    display: inline-block;
    vertical-align: top;
}

.block-center {
    min-height: 300px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.block-center:after {
    content: "";
    min-height: inherit;
}

[data-words] {
    overflow: hidden;
}

    [data-words]:after {
        display: none !important;
    }

.anim-line {
    position: absolute;
    width: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 8px;
    margin: 0 auto;
    border-radius: 5px;
    background: #ee7000;
    -webkit-transition: opacity .3s linear, width .3s .4s;
    transition: opacity .3s linear, width .3s .4s;
}

    .anim-line.line-active {
        opacity: 1;
    }

.text-anim-item {
    white-space: nowrap;
    position: absolute;
    left: 50%;
    top: 0;
    -webkit-transform: translate3d(0, -120%, 0);
    transform: translate3d(0, -120%, 0);
}

    .text-anim-item.anim-in {
        -webkit-transform: translate3d(-50%, -120%, 0);
        transform: translate3d(-50%, -120%, 0);
        -webkit-animation: textAnimInCenter .6s .3s forwards;
        animation: textAnimInCenter .6s .3s forwards;
    }

    .text-anim-item.anim-out {
        -webkit-transform: translate3d(-50%, 0%, 0);
        transform: translate3d(-50%, 0%, 0);
        -webkit-animation: textAnimOutCenter .6s forwards;
        animation: textAnimOutCenter .6s forwards;
    }

#main-text {
    font-size: 6rem;
}

@media (min-width: 768px) {
    .block-center {
        min-height: 465px;
    }

    .anim-line {
        left: auto;
    }

    .text-anim-item {
        right: 0;
        left: auto;
    }

        .text-anim-item.anim-in {
            -webkit-transform: translate3d(0, -120%, 0);
            transform: translate3d(0, -120%, 0);
            -webkit-animation: textAnimIn 0.6s .3s forwards;
            /* animation: textAnimIn .6s .3s forwards; */
        }

        .text-anim-item.anim-out {
            /* -webkit-transform: translate3d(0, 0%, 0); */
            /* transform: translate3d(0, 0%, 0); */
            /* -webkit-animation: textAnimOut .6s  forwards; */
            animation: textAnimOut 0.6s forwards;
        }

    .desc-text {
        text-align: right;
    }
}

@-webkit-keyframes textAnimIn {
    0% {
        -webkit-transform: translate3d(0, -120%, 0);
        transform: translate3d(0, -120%, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0%, 0);
        transform: translate3d(0, 0%, 0);
    }
}

@keyframes textAnimIn {
    0% {
        -webkit-transform: translate3d(0, -120%, 0);
        transform: translate3d(0, -120%, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0%, 0);
        transform: translate3d(0, 0%, 0);
    }
}

@-webkit-keyframes textAnimOut {
    0% {
        -webkit-transform: translate3d(0, 0%, 0);
        transform: translate3d(0, 0%, 0);
    }

    50% {
        -webkit-transform: translate3d(0, -20%, 0);
        transform: translate3d(0, -20%, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 120%, 0);
        transform: translate3d(0, 120%, 0);
    }
}

@keyframes textAnimOut {
    0% {
        -webkit-transform: translate3d(0, 0%, 0);
        transform: translate3d(0, 0%, 0);
    }

    50% {
        -webkit-transform: translate3d(0, -20%, 0);
        transform: translate3d(0, -20%, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 120%, 0);
        transform: translate3d(0, 120%, 0);
    }
}

@-webkit-keyframes textAnimInCenter {
    0% {
        -webkit-transform: translate3d(-50%, -120%, 0);
        transform: translate3d(-50%, -120%, 0);
    }

    100% {
        -webkit-transform: translate3d(-50%, 10%, 0);
        transform: translate3d(-50%, 10%, 0);
    }
}

@keyframes textAnimInCenter {
    0% {
        -webkit-transform: translate3d(-50%, -120%, 0);
        transform: translate3d(-50%, -120%, 0);
    }

    100% {
        -webkit-transform: translate3d(-50%, 10%, 0);
        transform: translate3d(-50%, 10%, 0);
    }
}

@-webkit-keyframes textAnimOutCenter {
    0% {
        -webkit-transform: translate3d(-50%, 0%, 0);
        transform: translate3d(-50%, 0%, 0);
    }

    50% {
        -webkit-transform: translate3d(-50%, -20%, 0);
        transform: translate3d(-50%, -20%, 0);
    }

    100% {
        -webkit-transform: translate3d(-50%, 120%, 0);
        transform: translate3d(-50%, 120%, 0);
    }
}

@keyframes textAnimOutCenter {
    0% {
        -webkit-transform: translate3d(-50%, 0%, 0);
        transform: translate3d(-50%, 0%, 0);
    }

    50% {
        -webkit-transform: translate3d(-50%, -20%, 0);
        transform: translate3d(-50%, -20%, 0);
    }

    100% {
        -webkit-transform: translate3d(-50%, 120%, 0);
        transform: translate3d(-50%, 120%, 0);
    }
}

@media (max-width:768px) {
    #main-text {
        font-size: 3.5rem;
    }
}

.textcontainer a, .textcontainer a:hover, .textcontainer a:visited, .textcontainer h1, .textcontainer p{
    color: black;
    text-decoration: none;
    text-shadow: #5dc8e5 0 0 10px; /* Свечение голубого цвета */
}
