@charset "utf-8";

.aboutBackground {
	background-color: hsla(220,57%,42%,0.60);

}
.about {
	background-color: hsla(0,0%,100%,0.80);
	margin-top: 60px;
	margin-bottom: 60px;
	margin-left: 12%;
	margin-right: 12%;
	border-radius: 40px;
	padding: 40px;
}


.about h1 {
	color: hsla(137,65%,38%,1.00);
	margin: 0 0 10px;
	font-size: 40px;
}

.about h2 {
	color: hsla(226,50%,42%,1.00);
	margin-top: 0px;
	margin-bottom: 16px;
	font-size: 32px;
	font-family: annie-use-your-telescope;
	font-style: normal;
	font-weight: 700;
}

.about h3 {
	color: hsla(212,71%,37%,1.00);
	margin-top: 40px;
	margin-bottom: 40px;
	font-size: 40px;
}

.about h4 {
	color: hsla(219,95%,31%,1.00);
	margin-top: 0px;
	margin-bottom: 5px;
	font-size: 30px;
}

.about .leftColumn {
	float: left;
	clear: none;
	width: 66%;
}

.about .rightColumn {
	float: right;
	clear: none;
	width: 30%;
}

.about .rightColumn figure {
	width: 100%;
	height: auto;
	margin-bottom: 30px;
}

.about .rightColumn img {
	width: 100%;
	height: auto;
	border-radius: 40px;
}

.about .rightColumn .no_rounding img {
	border-radius: 0px;
	-webkit-box-shadow: 1px 1px 5px 1px hsla(0,0%,0%,0.20);
	box-shadow: 1px 1px 5px 1px hsla(0,0%,0%,0.20);
}



@media screen and (max-width:1800px){
.about {
	margin-left: 3%;
	margin-right: 3%;
}
.about .leftColumn {
	width: 60%;
}

.about .rightColumn {
	width: 36%;
}
}

@media screen and (max-width:1200px){

.about .leftColumn {
	width: 100%;
}

.about .rightColumn {
	visibility: hidden;
	width: 0%;
}
}

@media screen and (max-width:767px){
.about {
	margin: 0px;
	border-radius: 0px;
	padding: 20px;
}

.optionWrapper {
	padding: 20px;
}

.about h1 {
	font-size: 34px;
}

.about h2 {
	font-size: 30px;
}

.about h3 {
	font-size: 30px;
}

.about h4 {
	font-size: 24px;
}
}