body {
    background-color: rgb(160, 248, 235);
    margin: 0;
    min-width: 100vh;
}
h1{
    color: brown;
    font-family: "Comic Sans MS", "Comic Sans", cursive;
    justify-content: center;
    display: flex;
    font-size: 100px;
}
#start img{
    height:800px;
    width: auto;
    border-radius: 50%;
    border: violet 10px dotted
}
#start h2 img{
    width: 300px;
    height: auto ;
    border: rgb(225, 48, 225) 5px solid;
}
#start{
    display:flex;
    align-items: center;
    justify-content: center;
}
#start h2{
    text-align: center;
    display: flex;
    font-size: 50px;
    flex-direction: column;
    align-items: center;
    animation-direction: alternate;
    border: double red 20px;
    font-family: "Comic Sans MS", "Comic Sans", cursive;
    position: relative;
    animation-name: socials;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    background-color: rgb(117, 248, 117);
    animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
    
}
@keyframes socials{
    0%   {color: red; translate: 0 -10vw;}
    25%  {color: yellow;}
    50%  {color: orange;}
    100% {color: magenta; translate: 0 12vw;}
}
main{
    display: grid;
    grid-template-columns: 2fr 4fr 2fr;
    grid-auto-rows: auto;
}
#one{
    font-size: 80px;
    color: black;
    font-family: "Comic Sans MS", "Comic Sans", cursive;
    grid-column-start: 1;
    grid-column-end: 4;
    display: flex;
    justify-content: center;
} 
#two{
    font-size: 70px;
    color: rgb(138, 0, 176);
    font-family: "Comic Sans MS", "Comic Sans", cursive;
    grid-column-start: 1;
    grid-column-end: 2;
    display: flex;
    justify-content: right;
    text-align: right;
}
#three{
    grid-column-start: 2;
    grid-column-end: 3;
    display: flex;
    justify-content: center;
    align-items: center;
}
#three img{
    height: 600px;
    width: auto;
}
#leave{
    display: flex;
    justify-content: left;
    font-size: 60px;
    color: red;
    grid-column-start: 3;
    grid-column-end: 4;
    text-align: left;
}
#proceed{
    grid-column-start: 1;
    grid-column-end: 4;
    color: rgb(200, 25, 25);
    font-size: 100px;
    font-family: 'Times New Roman', Times, serif;
    text-align: center;
    border: yellow 10px solid;
} 
#menu li aside, #menu ul{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: chocolate;
    text-shadow: 2cm;
    font-size: 40px;
    font-weight: bolder;
    font-style: italic;
    font-family: "Comic Sans MS", "Comic Sans", cursive;
}
#menu li aside img{
    height: 500px;
    width: auto;
    border: 5px black solid;
}
#menu{
    display: flex;
    align-items:normal;
    justify-content: space-around;
}
#menu div{
    background-color: antiquewhite;
    display: flex;
    flex-direction: column;
    align-items: center;
    height:fit-content;
}
#menu div img{
    width: 500px;
    height: 1200px;
}
#menu div p{
    color: blue;
    font-size: 80px;
}
#warn p{
    color: black;
    font-size: 120px;
    text-align: center;
}
#crimes{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#crimes div p{
    color: rgb(0, 234, 35);
    background-color: blue;
    text-align: center;
    text-decoration: underline;
    font-size: 50px;
    animation-name: warCrimesText;
    animation-duration: 5s;
    animation-iteration-count: infinite;
}
#crimes img{
    border: 10px solid red ;
    animation-name: warCrimes;
    animation-duration: 0.2s;
    animation-iteration-count: infinite;
    position: relative;
    animation-direction: alternate;

}
@keyframes warCrimes{
    from {border-color: red; border-radius: 10px;}
    to {border-color: orange; border-radius: 30px; translate: 0 -4vw;}
}
@keyframes warCrimesText{
    0% {rotate: 0deg;}
    50% {rotate: 180deg; scale: 25%;}
    100% {rotate: 360deg;}
}
#crimes div{
    display: flex;
    align-items: center;
    flex-direction: column;
}
footer{
    background-color: black;
    color: white;
    text-align: center;
    font-size: 60px;
    margin-bottom: 0px;
}
a:link, a:visited, a:hover, a:active{
  color: inherit;
  text-decoration: none;
}