/* Tag Styles */
body{
    background-color: black;
    display: grid;
    justify-items: center;
    color: #4dff00;
    font-family: "Audiowide";
    padding: 1%;
}

h1{
    background-color: rgba(0, 0, 0, 0.504);
    font-family: "Rubik Glitch";
    font-size: 60px;
}

button{
    background-color: black;
    border-color: #4dff00;
    width: 200px;
    height: 100px;
    color: #4dff00;
    font-family: "Audiowide";
    font-size: medium;
}

img{
    border: 2px ridge;
    background-color: black;
}

p{
    margin-bottom: 30px;
}

a{
    background-color: rgba(0, 0, 0, 0.75);

}



/* Class Styles */
.textbox{
    background-color: rgba(0, 0, 0, 0.75);
    color: #4dff00;
    border: 2px ridge;
    padding: 25px;
    max-width: 650px;
    font-family: "Audiowide";
    display: grid;
    justify-items:center;
    justify-content: space-between;
    margin-bottom: 10px;
    
}

.charbox{
    border: 7px ridge #4dff00 ;
    padding: 2%;
    width: 28%;
    background-color: rgba(0, 0, 0, 0.845);
    display: grid;
    justify-items: center;
}

.battleScreen{
    display: grid;
    justify-items: center;
}

.battleBox{
    background-color: rgba(0, 0, 0, 0.5);
    border: 15px ridge #4dff00 ;
    width: 600px;
    height: 300px;
    padding: 25px;
    display: grid;
    justify-items: center;

}


/* ID Styles */
#index{
    background-image: url('../assets/wallpaperflare.com_wallpaper.jpg');
    background-repeat: no-repeat;
    background-size: 2500px 1000px;
}
#starter{
    background-image: url("../assets/dumbHacker.gif");
    background-size: 25%;
    border: 10px #4dff00;
}
#pickCharacter{
    display: flex;
    justify-content: space-between;
}

#battle1{
    background-image: url("../assets/battle1.png ");
}

#battle2{
    background-image: url("../assets/battle2.png ");
}

#battle3{
    background-image: url("../assets/battle3.png ");
}

#shop{
    background-image: url("../assets/cyberpunk_shop_interior.jpg");
}
#plaza{
    background-image: url("../assets/cyberpunk_plaza.png");
}
#downtown{
    background-image: url("../assets/cyberpunk_pixelated_cartoon.png");
}
#hideout{
    background-image: url("../assets/cyberpunkHideout.png");
}
#lockbox{
    background-image: url("../assets/lockbox_inside.png");
}
#mlcorp{
    background-image: url("../assets/MHCorp.png");
}
#victory1{
    background-image: url("../assets/win1.png");
}
#victory2{
    background-image: url("../assets/win2.png");
}
#victory3{
    background-image: url("../assets/win3.png");
}
#death{
    background-image: url("../assets/deathpage.png");
}