/*
* Não me questione ou pergunte o "POR QUÊÊ", mas eu fiz css interno e externo. Então aqui não tem tudo, lá não tem tudo, fique contente com isso.
*/
body{
    overflow-y:hidden;
}
main{
    height:100vh;
    display:flex;
    align-items:center;
}
.left,.right{
    width:30vw;
}
.mid{
    width:40vw;
}
.left img,.right img{
    height:30vw;
}
.mid h1{
    text-align:center;
    font-size:calc(8vw - 4vh);
    animation-name:rgbtext;
    animation-duration:10s;
    animation-iteration-count:infinite;
    animation-direction:linear;
    font-family:'Open Sans'
}
@media (max-width:800px){
    .mid h1{font-size:40px;}
}
@keyframes rgbtext {
    0%   { color: rgb(255, 0, 0); }     /* vermelho */
    6%   { color: rgb(255, 128, 0); }   /* laranja */
    12%  { color: rgb(255, 255, 0); }   /* amarelo */
    18%  { color: rgb(128, 255, 0); }   /* verde-limão */
    25%  { color: rgb(0, 255, 0); }     /* verde */
    31%  { color: rgb(0, 255, 128); }   /* verde-água */
    37%  { color: rgb(0, 255, 255); }   /* ciano */
    43%  { color: rgb(0, 128, 255); }   /* azul-claro */
    50%  { color: rgb(0, 0, 255); }     /* azul */
    56%  { color: rgb(128, 0, 255); }   /* roxo */
    62%  { color: rgb(255, 0, 255); }   /* magenta */
    68%  { color: rgb(255, 0, 128); }   /* rosa */
    75%  { color: rgb(255, 64, 64); }   /* vermelho claro */
    81%  { color: rgb(255, 128, 128); } /* rosa claro */
    87%  { color: rgb(255, 128, 64); }    /* mexi nesse tb */
    100% { color: rgb(255, 128, 0); }     /* mexi */
}