body {
    border:50px solid rgb(171, 1, 1);
}

section {
background-color: rgba(107, 107, 107, 0.646);   
font-family: sans-serif;
padding: 15%
}

#intro {
    
    background-color: #122;
    color: rgb(230, 230, 230);
    font-family: 'VT323', monospace;
    border-bottom:5px solid #000;

}   

#intro h1 {
    line-height: 10px;
    letter-spacing: 10px;
    text-shadow: 1px 2px 3px #000;
    text-transform: uppercase;
    font-family: 'Press Start 2P', cursive;
}

#intro p {
    font-size: 20px;
}

#camet {
    background-image: url("gridlines.png");
    background-size:400px;
    background-blend-mode:overlay;
    font-family: 'VT323', monospace;
    font-size: 22px;
    font-weight:400;
    border-bottom:5px solid #000;
    padding-top:100px;
}

#camet img {
    padding-bottom:20px;
}

#camet .imgContainer {
    float:left;
    margin-right: 33px;
}

#camet img:hover {
    animation:jump 1s;
    animation-iteration-count: infinite;
}

#camet h1 {
    padding-top:20px;
    font-family: 'Press Start 2P', cursive;
    font-weight:normal;
    font-size: 30px;
}

#camet button {
    background-color: #fdb9e9;
    border: none;
    color: black;
    width:95px;
    height:36px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-family: 'VT323', monospace;
    border-radius: 8px;
}

#cleopolar {
    background-image: url("gridlines.png");
    background-size:400px;
    background-blend-mode:overlay;
    font-family: 'VT323', monospace;
    font-size: 22px;
    font-weight:400;
    border-bottom:5px solid #000;
    padding-top:100px;
}

#cleopolar .imgContainer {
    float:left;
    margin-right: 33px;
}

#cleopolar img {
    padding-bottom:20px;
}

#cleopolar img:hover {
    animation:jump 1s;
    animation-iteration-count: infinite;
}

#cleopolar h1 {
    padding-top:20px;
    font-family: 'Press Start 2P', cursive;
    font-weight:normal;
    font-size: 30px;
}

#cleopolar button {
    background-color: #ab9842;
    border: none;
    color: black;
    width:95px;
    height:36px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-family: 'VT323', monospace;
    border-radius: 8px;
}

#cleopolar .buttontwo {
    background-color: #51c4e7;
    border: none;
    color: black;
    width:95px;
    height:36px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-family: 'VT323', monospace;
    border-radius: 8px;
}

#magbaa {
    background-image: url("gridlines.png");
    background-size:400px;
    background-blend-mode:overlay;
    font-family: 'VT323', monospace;
    font-size: 22px;
    font-weight:400;
    border-bottom:5px solid #000;
    padding-top:100px;
}

#magbaa .imgContainer {
    float:left;
    margin-right: 33px;
}

#magbaa img {
   padding-bottom:20px;
}

#magbaa img:hover {
    animation:jump 1s;
    animation-iteration-count: infinite;
}

#magbaa h1 {
    padding-top:20px;
    font-family: 'Press Start 2P', cursive;
    font-weight:normal;
    font-size: 30px;
}

#magbaa button {
    background-color:  #fd7d24;
    border: none;
    color: white;
    width:95px;
    height:36px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-family: 'VT323', monospace;
    border-radius: 8px;
}

#mau {
    background-image: url("gridlines.png");
    background-size:400px;
    background-blend-mode:overlay;
    font-family: 'VT323', monospace;
    font-size: 22px;
    font-weight:400;
    border-bottom:5px solid #000;
    padding-top:100px;
}

#mau .imgContainer {
    float:left;
    margin-right: 33px;
}

#mau img {
    padding-bottom:20px;
}

#mau img:hover {
    animation:jump 1s;
    animation-iteration-count: infinite;
}

#mau h1 {
    padding-top:20px;
    font-family: 'Press Start 2P', cursive;
    font-weight:normal;
    font-size: 30px;
}

#mau button {
    background-color: #7b62a3 ;
    border: none;
    color: white;
    width:95px;
    height:36px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-family: 'VT323', monospace;
    border-radius: 8px;
}

#mekura {
    background-image: url("gridlines.png");
    background-size:400px;
    background-blend-mode:overlay;
    font-family: 'VT323', monospace;
    font-size: 22px;
    font-weight:400;
    border-bottom:5px solid #000;
    padding-top:100px;
}

#mekura .imgContainer {
    float:left;
    margin-right: 33px;
}

#mekura img {
    padding-bottom:20px;
}

#mekura img:hover {
    animation:jump 1s;
    animation-iteration-count: infinite;
}

#mekura h1 {
    padding-top:20px;
    font-family: 'Press Start 2P', cursive;
    font-weight:normal;
    font-size: 30px;
}

#mekura button {
    background-color: #d56723;
    border: none;
    color: white;
    width:95px;
    height:36px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-family: 'VT323', monospace;
    border-radius: 8px;
}

#pandark {
    background-image: url("gridlines.png");
    background-size:400px;
    background-blend-mode:overlay;
    font-family: 'VT323', monospace;
    font-size: 22px;
    font-weight:400;
    border-bottom:5px solid #000;
    padding-top:100px;
}

#pandark .imgContainer {
    float:left;
    margin-right: 33px;
}

#pandark img {
    padding-bottom:20px;
}

#pandark img:hover {
    animation:jump 1s;
    animation-iteration-count: infinite;
}

#pandark h1 {
    padding-top:20px;
    font-family: 'Press Start 2P', cursive;
    font-weight:normal;
    font-size: 30px;
}

#pandark button {
    background-color: #707070;
    border: none;
    color: white;
    width:95px;
    height:36px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-family: 'VT323', monospace;
    border-radius: 8px;
}

#shrock {
    background-image: url("gridlines.png");
    background-size:400px;
    background-blend-mode:overlay;
    font-family: 'VT323', monospace;
    font-size: 22px;
    font-weight:400;
    border-bottom:5px solid #000;
    padding-top:100px;
}

#shrock .imgContainer {
    float:left;
    margin-right: 33px;
}

#shrock img {
    padding-bottom:20px;
}

#shrock img:hover {
    animation:jump 1s;
    animation-iteration-count: infinite;
}

#shrock h1 {
    padding-top:20px;
    font-family: 'Press Start 2P', cursive;
    font-weight:normal;
    font-size: 30px;
}

#shrock button {
    background-color: #eed535;
    border: none;
    color: black;
    width:95px;
    height:36px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-family: 'VT323', monospace;
    border-radius: 8px;
}

#shrock .buttontwo {
    background-color: #a38c21;
    border: none;
    color: white;
    width:95px;
    height:36px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-family: 'VT323', monospace;
    border-radius: 8px;
}

#skippy {
    background-image: url("gridlines.png");
    background-size:400px;
    background-blend-mode:overlay;
    font-family: 'VT323', monospace;
    font-size: 22px;
    font-weight:400;
    border-bottom:5px solid #000;
    padding-top:100px;
}

#skippy .imgContainer {
    float:left;
    margin-right: 33px;
}

#skippy img {
    padding-bottom:20px;
}

#skippy img:hover {
    animation:jump 1s;
    animation-iteration-count: infinite;
}

#skippy h1 {
    padding-top:20px;
    font-family: 'Press Start 2P', cursive;
    font-weight:normal;
    font-size: 30px;
}

#skippy button {
    background-color: #a4acaf;
    border: none;
    color: black;
    width:95px;
    height:36px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-family: 'VT323', monospace;
    border-radius: 8px;
}

#skippy .buttontwo {
    background-color: #d56723;
    border: none;
    color: white;
    width:95px;
    height:36px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-family: 'VT323', monospace;
    border-radius: 8px;
}

#outro {
    
    background-color: #122;
    color: rgb(230, 230, 230);
    font-family: 'VT323', monospace;

}   

#outro h1 {
    line-height: 10px;
    letter-spacing: 10px;
    text-shadow: 1px 2px 3px #000;
    text-transform: uppercase;
    font-family: 'Press Start 2P', cursive;
}

#outro p {
    font-size: 20px;
}

@keyframes jump{
    0% { transform: translateY(0) }
    25% { transform: translateY(5px) }
    50% { transform: translateY(-5px) }
    75% { transform: translateY(5px) }
    100% { transform: translateY(0) }
}