/* =====================
    GERAL
===================== */

*{
    margin: 0;
    padding: 0;
}

html{
    width: 100%;
    height: 100%;
}

body{
    width: 100%;
    height: 100%;
    background: rgb(179, 179, 255);
}


/* =====================
    BACKGROUND
===================== */
#background {
    position: fixed;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    background-color: cover;
}

/* =====================
    FONTS
===================== */




/* =====================
    HEADER
===================== */

header{
    height: auto;
    overflow: hidden;
}


div.text{
    
    font-family: "Comic Sans MS", cursive, sans-serif;
    font-weight: bold;
    font-style: bold;
    font-size: 210px;
    margin: 100px;
    position: absolute;
    top: 50px;
    padding: 50px;
    animation: movimento 6s infinite;
    animation-direction: alternate;
}


div.text2{
    
    font-family: "Comic Sans MS", cursive, sans-serif;
    font-weight: bold;
    font-style: bold;
    font-size: 40px;
    margin: 100px;
    position: absolute;
    top: 100px;
    padding: -90px;
    margin-left: 30px;
    margin-top: 220px;
  
}

div.text3{
    
    font-family: "Comic Sans MS", cursive, sans-serif;
    font-weight: bold;
    font-style: bold;
    font-size: 40px;
    margin: 100px;
    position: absolute;
    top: 50px;
    padding: -150px;
    margin-left: 750px;
    margin-top: 5px;
  
}

div.text4{
    
    font-family: "Comic Sans MS", cursive, sans-serif;
    font-weight: bold;
    font-style: bold;
    font-size: 40px;
    margin: 100px;
    position: absolute;
    top: 100px;
    padding: -90px;
    margin-left: 1470px;
    margin-top: 220px;
  
}

div.text5{
    
    font-family: "Comic Sans MS", cursive, sans-serif;
    font-weight: bold;
    font-style: bold;
    font-size: 40px;
    margin: 100px;
    position: absolute;
    top: 100px;
    padding: -150px;
    margin-left: 750px;
    margin-top: 480px;
  
}


.div1{
    color: rgb(255, 4, 4);
    text-shadow: 5px 5px 20px rgb(255, 255, 255);
    animation-timing-function: linear;
   
}


.div2{
    color: rgb(29,80,221);
    text-shadow: 5px 5px 20px rgb(255, 255, 255);
    
   
}

.div3{
    color: rgb(255, 4, 4);
    text-shadow: 5px 5px 20px rgb(255, 255, 255);
    
   
}

.div4{
    color: rgb(29,80,221);
    text-shadow: 5px 5px 20px rgb(255, 255, 255);
    
   
}

.div5{
    color: rgb(255, 4, 4);
    text-shadow: 5px 5px 20px rgb(255, 255, 255);
    
   
}

@keyframes movimento{
    from{left: 0;}
    to{left: 600px;}
}