﻿

@font-face
{
    font-family:handwriting1;
    src:url("Fonts/handwriting1.TTF");
}

#CoverBody 
{
    margin:0;
}

/*---------------------------------------*/

.HomeCover
{
    width:100%;
    height:100vh;
    color:White;
    background-color:#FF5572;
    text-align:center;
    display:table;
}


    .HomeCover .LogoPart
    {
        height: 20vh;
        width: 25vw;
        margin: 0 auto;
        margin-top: 35vh;
        background-image: url("ImageLogo/SiteLogo-White.png");
        background-repeat: no-repeat;
        background-origin: content-box;
        background-size: contain;

        animation-name:LogoMove;
        animation-duration:1s;
        animation-timing-function:linear;
        animation-play-state:running;
    }


    .HomeCover .TextPart
    {
        font-family: 'handwriting1';
        font-size: 2.5vw;
        word-spacing: 0.3vw;
        display:inline-block;
        clear:both;

        animation-name:TextMove;
        animation-duration:1s;
        animation-timing-function:linear;
        animation-play-state:running;
    }


    .HomeCover .ArrowPart
    {
        text-decoration: none;
        border: none;
    }

        .HomeCover .ArrowPart img
        {
            width:40px;
            height:auto;
            animation-name:arrowMove;
            animation-duration:1.1s;
            animation-iteration-count:infinite;
        }


/*------------------- animations --------------------*/

@keyframes LogoMove
{
    0% {transform:translateX(-100px)}
}

@keyframes TextMove
{
    0% {transform:translateX(+100px)}
}

@keyframes arrowMove
{
    50% { transform:translateY(5px);}
    100% { transform:translateY(-5px);}
}
        
/*----------------------------------------- Tablet --------------------------------------*/
@media only screen and (min-width:481px) and (max-width: 768px)
{
    .HomeCover .LogoPart
    {
        height: 10vh;
        width: 50vw;
        margin: 0 auto;
        margin-top: 35vh;
    }

    .HomeCover .TextPart
    {
        font-size: 4vh;
        word-spacing: 0.3vh;
    }
}

/*------------------------------------------- Mobile ------------------------------------*/
@media only screen and (max-width: 480px)
{
    .HomeCover .LogoPart
    {
        height: 10vh;
        width: 50vw;
        margin: 0 auto;
        margin-top: 40vh;
    }

    .HomeCover .TextPart
    {
		width: 80vw;
        font-size: 4vh;
        word-spacing: 0.3vh;
    }
}