
.blue {
    height: 100px;
    width: 100px;
    background-color: aqua;
}

.green {
    height: 100px;
    width: 100px;
    background-color: lawngreen;
}

.pink {
    height: 100px;
    width: 100px;
    background-color: hotpink;
}

.pic {
    opacity: 0.6;
}
.black {
    height: 130px;
    width: 300px;
    background-color: black;
    opacity: 0.50;
}
.circle {
    height: 475px;
    width: 475px;
    background-color: dodgerblue;
    border-radius: 50%;
    display: inline-block;
    position: relative;
}
.squareofdeath {
    height: 200px;
    width: 200px;
    background-color: red;
    display: inline-block;
    position: relative;
}
.circleoflife {
    height: 200px;
    width: 200px;
    background-color: white;
    border-radius: 50%;
    display: inline-block;
    position: relative;
}
.sector1 {
    height: 300px;
    width: 400px;
    background-color: white;
    opacity: 0.60;
    display: inline-block;
    position: relative;
}
.sector2 {
    height: 300px;
    width: 400px;
    background-color: black;
    opacity: 0.50;
    display: inline-block;
    position: relative;
}
h4:hover {
    background-color: red;
    width: 25%;
}
