@font-face {
    font-family: 'Vox_Round';
    src: local('Vox Round Semi bold'), local('Vox-Round-Semi-bold'),
        url('Assets/Fonts/VoxRound-Semibold.woff2') format('woff2'),
        url('Assets/Fonts/VoxRound-Semibold.woff') format('woff'),
        url('Assets/Fonts/VoxRound-Semibold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
  }

.Logo {
    
    width: 15vw;
    height: 15vw;


}

.text {
    color: aqua;
}

.Menu {
    color: black;
    float: right;
    padding-top: 5vw;
    padding-right: 3vw;
    text-decoration: none;
    font-size: 1.5vw;
    font-family: Vox_Round;
}

.container {
    position: fixed;
    top: 0;
    width: 100%;
    background-color:white;
    }

.parent {
    margin-top: 20vw;
    background-color: hsla(200, 100%, 20%);
    height: 40vw;
    width: 40vw;

}
.child {
    background-color: red;
    height: 50%;
    width: 50%;
    animation: left_to_right 2s ease-in-out forwards infinite alternate;    
    /* float: right; */
    /* transition: transform 0.5s cubic-bezier(.48,0,.42,1.01) 0.2s;       */
    /* transform ist die zeit wie lang die transition geht  cubic is die animations Kurve und 0.5s ist die zeit die vergeht bis die animation wieder gestartet werden kann*/
}

.parent:hover .child{
    animation-play-state: paused;

}
@keyframes left_to_right{
    /* 0%{
        height: 50%;
        width: 0%;
    }

    50%{
        height: 50%;
        width: 50%;
    }

    100%{
        height: 50%;
        width: 100%;
    } */
    0%{
        background-color: red;
        transform: translateX(0);
    }
    33%{
        transform: translateY(100%);
    }

    50%{
        background-color: blue;
    }
    66%{
        transform: translateX(100%) translateY(100%);
    }
    100%{
        background-color: green;
        transform: translateX(100%); 
    }
}

.Search_Gif{
    padding-top: 4.75vw;
    padding-right: 3vw;
    float: right;
    width: 2.5vw;
    height: 2.5vw;

}
.searchfield_animation{
    float: right;
    width: 7vw;
    height: 1vw;
    margin-top: 5.25vw;
    margin-right: 2vw;
    color: black;

}