/* Joy English */
.About-JoyEnglish{
	.About-wrap{
		width:65%;

		.con{
			p{
				font-size:var(--md);
				color:var(--gray-500);
			}
		}

	}
}

/* Who You Are */
.About-Who{
	margin-bottom: 5rem;

	.Who-wrap{
		align-items:flex-end;
		
		.photo{
			width:38%;
		}

		.con{
			background:var(--red-500);
			width:62%;
			overflow: hidden;
			margin-top: 5rem;
			padding: 3.5rem 10rem 2.5rem 4rem;

			h2{
				padding-bottom: 2.2rem;
			}

			p{
				font-size:var(--md);
			}

			img{
				width:30%;
				opacity: .3;
				top:-5rem;
				right:-5rem;
			}
		}
	}
}

/* Awards */
.About-Awards{
	margin-bottom: 5rem;

	.swiper {
		width: 100%;
		height: auto;
	  }
  
	  .swiper-slide {
		background-size: cover;
		background-position: center;
	  }
  
	  .mySwiper2 {	
		background:var(--red-100);	
		height: 80%;
		width: 100%;

		.swiper-wrapper{
			display:flex;
			margin:auto;
		}
	
		.slide-wrap{
			display:flex;
			flex-wrap:wrap;
			width:65%;
			margin:0 auto;

			h3{
				border-bottom:1px solid var(--white);
			}

			.photo{
				width:50%;
			}
		}
		
	  }
  
	  .mySwiper {
		width:65%;
		height: 20%;
		box-sizing: border-box;
		padding: 30px 31px 10px 31px;

		.swiper-button-next, .swiper-button-prev{
			width:2rem;
			height:2rem;

			&:after{
				background:var(--red-500);
				border-radius:50%;
				padding: .5rem .7rem;
			}
		}
	  }
  
	  .mySwiper .swiper-slide {
		text-align:center;
		width: 25%;
		height: 100%;
		opacity: 0.4;

		p{
			font-family:'EB Garamond', Arial, serif;
			font-size: var(--2lg);
			font-weight:700;
			margin-bottom:0;
		}
	  }
  
	  .mySwiper .swiper-slide-thumb-active {
		opacity: 1;
	  }
  
	  .swiper-slide img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
	  }
}

@media screen and (min-width:1920px){
	/* Who You Are */
	.About-Who{
		.Who-wrap{
			.con{
				padding: 6rem 17rem 5rem 4rem
			}
		}
	}
}


@media screen and (min-width:1800px) and (max-width:1919px){
	/* Who You Are */
	.About-Who{
		.Who-wrap{
			.con{
				padding: 5rem 15rem 4rem 4rem;
			}
		}
	}

}

@media screen and (min-width:1400px) and (max-width:1599px){
	/* Joy English */
	.About-JoyEnglish{
		.About-wrap{
			width:75%;
		}
	}

	/* Who You Are */
	.About-Who{
		.Who-wrap{
			.photo{
				width:45%;
			}

			.con{
				width:55%;
				padding: 2rem 10rem 2rem 3rem;
			}
		}
	}
	
	/* Awards */
	.About-Awards{
		.swiper {
			.slide-wrap{
				width:75%;
			}
		}

		.mySwiper {
			width:75%;
		}
	}
}

@media screen and (min-width:1200px) and (max-width:1399px){
	/* Joy English */
	.About-JoyEnglish{
		.About-wrap{
			width:80%;
		}
	}

	/* Who You Are */
	.About-Who{
		
		.Who-wrap{
			.photo{
				width:50%;
			}

			.con{
				width:50%;
				padding: 2rem 3em 2rem 2.5rem;

				h2{
					padding-bottom: 1.5rem;
				}

				img{
					top:-4rem;
					right:-4rem;
				}
			}
		}
	}

	/* Awards */
	.About-Awards{
		.swiper {
			.slide-wrap{
				width:80%;
			}
		}

		.mySwiper {
			width:80%;
		}
	}
}

@media screen and (min-width:1024px) and (max-width:1199px){
	/* Joy English */
	.About-JoyEnglish{
		.About-wrap{
			width:90%;
		}
	}

	/* Who You Are */
	.About-Who{
		.Who-wrap{
			.photo{
				width:50%;
			}

			.con{
				width:50%;
				padding: 1rem 1.2em 1rem 1.5rem;

				h2{
					padding-bottom: .5rem;
				}

				img{
					width:30%;
					top:-3rem;
					right:-3rem;
				}
			}
		}
	}

	/* Awards */
	.About-Awards{
		.swiper {
			.slide-wrap{
				width:90%;
			}
		}

		.mySwiper {
			width:90%;
		}
	}
}

@media screen and (min-width:992px) and (max-width:1023px){
	/* Joy English */
	.About-JoyEnglish{
		.About-wrap{
			width:90%;
		}
	}

	/* Who You Are */
	.About-Who{
		.Who-wrap{
			.photo{
				width:50%;
			}

			.con{
				width:50%;
				padding: 1rem 1.2em 1rem 1.5rem;

				h2{
					padding-bottom: .5rem;
				}

				img{
					width:30%;
					top:-3rem;
					right:-3rem;
				}
			}
		}
	}

	/* Awards */
	.About-Awards{
		.swiper {
			.slide-wrap{
				width:90%;
			}
		}

		.mySwiper {
			width:90%;
		}
	}
}

@media screen and (max-width:991px){
	/* Joy English */
	.About-JoyEnglish{
		.About-wrap{
			width:90%;
		}
	}

	/* Who You Are */
	.About-Who{
		.Who-wrap{
			.photo{
				width:100%;
			}

			.con{
				width:100%;
				margin-top: 0;
			}
		}
	}

	/* Awards */
	.About-Awards{
		.swiper {
			.slide-wrap{
				width:90%;
			}
		}

		.mySwiper {
			width:90%;
		}
	}
}

@media screen and (min-width:768px) and (max-width:991px){
	/* Who You Are */
	.About-Who{
		.Who-wrap{

			.con{
				padding: 3rem 2.5rem;

				h2{
					padding-bottom: .5rem;
				}

				img{
					width:30%;
					top:-3rem;
					right:-3rem;
				}
			}
		}
	}
}

@media screen and (min-width:648px) and (max-width:767px){
	/* Who You Are */
	.About-Who{
		.Who-wrap{

			.con{
				padding: 3rem 2rem;

				h2{
					padding-bottom: .5rem;
				}

				img{
					width:30%;
					top:-3rem;
					right:-3rem;
				}
			}
		}
	}
}

@media screen and (min-width:576px) and (max-width:647px){
	/* Who You Are */
	.About-Who{
		.Who-wrap{

			.con{
				padding: 3rem 2rem;

				h2{
					padding-bottom: .5rem;
				}

				img{
					width:30%;
					top:-3rem;
					right:-3rem;
				}
			}
		}
	}
}

@media screen and (min-width:425px) and (max-width:575px){
	/* Who You Are */
	.About-Who{
		.Who-wrap{

			.con{
				padding: 3rem 1.5rem;

				h2{
					padding-bottom: .5rem;
				}

				img{
					width:40%;
					top:-3rem;
					right:-3rem;
				}
			}
		}
	}
}

@media screen and (max-width:424px){
	/* Who You Are */
	.About-Who{
		.Who-wrap{

			.con{
				padding: 3rem 1.5rem;

				h2{
					padding-bottom: .5rem;
				}

				img{
					width:40%;
					top:-3rem;
					right:-3rem;
				}
			}
		}
	}
}