fcc-challenges/random-quote-machine/src/QuoteBox.css

54 lines
881 B
CSS

.QuoteBox {
background-color: white;
text-align: center;
max-width: 80%;
max-height: 60vh;
width: 500px;
height: 500px;
border-radius: 10px;
box-shadow: 4px 3px black;
}
.red-complimentary-background {
background-color: #0080ff;
color: white;
}
.blue-complimentary-background {
background-color: #7fff00;
color: white;
}
.yellow-complimentary-background {
background-color: #8000ff;
color: black;
}
.quote-box-top {
height: 70%;
display: flex;
flex-direction: column;
justify-content: space-around;
}
.quote-box-bottom {
height: 30%;
display: flex;
flex-direction: row;
justify-content: flex-start;
}
.quote-box-bottom-left {
width: 50%;
display: flex;
flex-direction: row;
justify-content: space-around;
}
.quote-box-bottom-right {
width: 50%;
display: flex;
flex-direction: row;
justify-content: space-around;
}