body{
    background-color: darkgreen;
    text-align: center;

}

h1 {
    color: yellow;
    font-size: 80pt;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
}

h3 {
    color: hotpink;
    font-size: 60pt;
    font-family: Georgia, 'Times New Roman', Times, serif;
}

h6 {
    color: cyan;
    font-size: 20pt;
    font-family: monospace;
    text-align: center;
}

#angcat {
    position: relative;
    margin-top: 70px;
    border: 5pt blueviolet ridge;
    align-items: center;
}

#biscat {
    position: relative;
    margin-top: 70px;
    border: 5pt rgb(226, 103, 119) ridge;
    align-items: center;
}

#checat {
    position: relative;
    margin-top: 70px;
    border: 5pt rgb(201, 201, 24) ridge;
    align-items: center; 
}

#coolcat {
    position: relative;
    margin-top: 70px;
    border: 5pt rgb(5, 150, 223) ridge;
    align-items: center; 
}

#craycat {
    position: relative;
    margin-top: 70px;
    border: 5pt rgb(245, 60, 189) ridge;
    align-items: center; 
}

#flycat {
    position: relative;
    margin-top: 70px;
    border: 5pt rgb(160, 255, 112) ridge;
    align-items: center; 
}

#huhcat {
    position: relative;
    margin-top: 70px;
    border: 5pt rgb(255, 0, 0) ridge;
    align-items: center; 
    background-color: rgb(202, 79, 255);
}

#morcat {
    position: relative;
    margin-top: 70px;
    border: 5pt rgb(179, 21, 163) ridge;
    align-items: center; 
}

#shocat {
    position: relative;
    margin-top: 70px;
    border: 5pt rgb(66, 12, 227) ridge;
    align-items: center; 
}

#napcat {
    position: relative;
    margin-top: 70px;
    border: 5pt rgb(8, 211, 65) ridge;
    align-items: center; 
}

#suscat {
    position: relative;
    margin-top: 70px;
    border: 5pt rgb(233, 243, 47) ridge;
    align-items: center; 
}

#tinycat {
    position: relative;
    margin-top: 70px;
    border: 5pt rgb(255, 129, 10) ridge;
    align-items: center; 
}

.carter-one-regular {
  font-family: "carter1", system-ui;
  font-weight: 400;
  font-style: normal;
}

#catsdiv1 {
    display: inline-flex;
    padding-left: 10%;
    padding-right: 10%;
    overflow: auto;
}

#catsdiv2 {
    display: inline-flex;
    padding-left: 10%;
    padding-right: 10%;
    overflow: auto;
}

#catsdiv3 {
    display: inline-flex;
    padding-left: 10%;
    padding-right: 10%;
    overflow: auto;
}

#cat1 {
    width: 300px;
}

#cat2 {
    width: 300px;
}

#cat3 {
    width: 300px;
}

#cat4 {
    width: 300px;
}

#cat5 {
    width: 300px;
}

#cat6 {
    width: 300px;
}

#cat7 {
    width: 300px;
}

#cat8 {
    width: 300px;
}

#cat9 {
    width: 300px;
}

#cat10 {
    width: 300px;
}

#cat11 {
    width: 300px;
}

#cat12 {
    width: 300px;
}

#losebody {
    background-color: red;
}

#loss {
    color: black;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    font-size: 100pt;
    padding-left: 15%;
    padding-right: 15%;
    padding-bottom: 15%;
    padding-top: 10%;
}

#winbody {
    background-color: rgb(1, 255, 1);
}

#win {
    color: rgb(6, 126, 38);
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    font-size: 100pt;
    padding-left: 15%;
    padding-right: 15%;
    padding-bottom: 15%;
    padding-top: 10%;
}

#back {
    align-items: left;
}