/* Lesson 6 Example 1 */
.container {
background-color: lightgrey;
border: 2px solid #264653;
max-width: 1000px;
height:700px;
margin: 0 auto;
margin-bottom: 20px;
}

.green {
background-color: #2a9d8f;
font-size: 20px;
text-align: center;
align-content: center;
}

.yellow {
background-color: #e9c46a;
font-size: 20px;
text-align: center;
align-content: center;
}

.dark-orange {
background-color: #e76f51;
font-size: 20px;
text-align: center;
align-content: center;
}

.light-orange {
background-color: #f4a261;
font-size: 20px;
text-align: center;
align-content: center;
}

h1 {
text-align: center;
padding: 15px;
font-size: 30px;
}

/* Lesson 6 Example 2 */
.container2 {
background-color: lightgrey;
border: 2px solid #264653;
max-width: 1000px;
height:700px;
margin: 0 auto;
margin-bottom: 20px;
display: flex;
}

.green2 {
background-color: #2a9d8f;
font-size: 20px;
text-align: center;
align-content: center;
}

.yellow2 {
background-color: #e9c46a;
font-size: 20px;
text-align: center;
align-content: center;
}

.dark-orange2 {
background-color: #e76f51;
font-size: 20px;
text-align: center;
align-content: center;
}

.light-orange2 {
background-color: #f4a261;
font-size: 20px;
text-align: center;
align-content: center;
}

h2 {
text-align: center;
padding: 15px;
font-size: 30px;
}

/* Lesson 6 Example 3 */
.container3 {
background-color: lightgrey;
border: 2px solid #264653;
max-width: 1000px;
height:700px;
margin: 0 auto;
margin-bottom: 20px;
display: flex;
flex-direction: row;
}

.green3 {
background-color: #2a9d8f;
font-size: 20px;
text-align: center;
align-content: center;
}

.yellow3 {
background-color: #e9c46a;
font-size: 20px;
text-align: center;
align-content: center;
}

.dark-orange3 {
background-color: #e76f51;
font-size: 20px;
text-align: center;
align-content: center;
}

.light-orange3 {
background-color: #f4a261;
font-size: 20px;
text-align: center;
align-content: center;
}

h3 {
text-align: center;
padding: 15px;
font-size: 30px;
}

/* Lesson 6 Example 4 */
.container4 {
background-color: lightgrey;
border: 2px solid #264653;
max-width: 1000px;
height:700px;
margin: 0 auto;
margin-bottom: 20px;
display: flex;
flex-direction: row-reverse;
}

.green4 {
background-color: #2a9d8f;
font-size: 20px;
text-align: center;
align-content: center;
}

.yellow4 {
background-color: #e9c46a;
font-size: 20px;
text-align: center;
align-content: center;
}

.dark-orange4 {
background-color: #e76f51;
font-size: 20px;
text-align: center;
align-content: center;
}

.light-orange4 {
background-color: #f4a261;
font-size: 20px;
text-align: center;
align-content: center;
}

h4 {
text-align: center;
padding: 15px;
font-size: 30px;
}

/* Lesson 6 Example 5 */
.container5 {
background-color: lightgrey;
border: 2px solid #264653;
max-width: 1000px;
height:700px;
margin: 0 auto;
margin-bottom: 20px;
display: flex;
flex-direction: column;
}
.green5 {
background-color: #2a9d8f;
font-size: 20px;
text-align: center;
align-content: center;
}
.yellow5 {
background-color: #e9c46a;
font-size: 20px;
text-align: center;
align-content: center;
}

.dark-orange5 {
background-color: #e76f51;
font-size: 20px;
text-align: center;
align-content: center;
}

.light-orange5 {
background-color: #f4a261;
font-size: 20px;
text-align: center;
align-content: center;
}

h5 {
text-align: center;
padding: 15px;
font-size: 30px;
}

/* Lesson 6 Example 6 */
.container6 {
background-color: lightgrey;
border: 2px solid #264653;
max-width: 1000px;
height:700px;
margin: 0 auto;
margin-bottom: 20px;
display: flex;
flex-direction: column-reverse;
}

.green6 {
background-color: #2a9d8f;
font-size: 20px;
text-align: center;
align-content: center;
}

.yellow6 {
background-color: #e9c46a;
font-size: 20px;
text-align: center;
align-content: center;
}

.dark-orange6 {
background-color: #e76f51;
font-size: 20px;
text-align: center;
align-content: center;
}

.light-orange6 {
background-color: #f4a261;
font-size: 20px;
text-align: center;
align-content: center;
}

h6 {
text-align: center;
padding: 15px;
font-size: 30px;
}