@charset "UTF-8";
/* CSS Document */

body{
	background-image: url("images/gradient.png"), url("images/logobar.png");
	background-repeat: no-repeat, no-repeat;
	background-position: center top, center top;
	background-color: rgba(89,37,21,0.80);
	background-size: auto, auto;
	margin: 0;
	
}
div.wrapper {width:1140px; margin:0px auto;}
div.wrapper2 {padding: 0 15px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-around; gap:1rem}
div.img {width:100%; max-width: 400px; object-fit: cover; vertical-align: middle}
div.about {flex: 1; background-color: rgba(230,128,80,0.50); padding: 25px; border-radius: 8px}

div.header {
	background-color: #99C4C1}
div.header{height: 225px}	
div.header{font-family: bodoni 72 oldstyle}

div.header ul{
	float:right;
	margin-right:35px
}

div.header li{
	display: inline-block;
	margin: 55px 25px 25px;
}


div.header a{
	display: inline-block;
	font-family: bondoni 72 oldstyle;
	font-size: 30px;
	text-decoration: none;
	color: rgba(255,255,255,1.00)}


div.content{}

div.peaceful {background-color: rgba(230,128,80,0.50); padding: 10px; flex: 0 0 30%; box-sizing: border-box; margin: 3% 0 3%; border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0. 0.2); transition: transform 0.2s ease-in-out; hover transform: translateY(-5px)}

div.peaceful:hover {transform: translateY(-5px)}

div.spacious {background-color: rgba(230,128,80,0.50); padding: 10px; flex: 0 0 30%; box-sizing: border-box; margin: 3% 0 3%;border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0. 0.2); transition: transform 0.2s ease-in-out; hover transform: translateY(-5px)}

div.spacious:hover {transform: translateY(-5px)}

div.friendly {background-color: rgba(230,128,80,0.50); padding: 10px; flex: 0 0 30%; box-sizing: border-box; margin: 3% 0 3%; border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0. 0.2); transition: transform 0.2s ease-in-out; hover transform: translateY(-5px)}

div.friendly:hover {transform: translateY(-5px)}

div.quotes{ display: flex; justify-content: space-around; flex-wrap: wrap;}

div.feb {background-color: rgba(230,128,80,0.50); padding: 1px; flex: 0 0 30%; box-sizing: border-box; margin: 2% 0 2%;}

h1 {color: rgba(255,255,255,1.00); font-size: 20pt; font-family:bodoni 72 oldstyle bold}
h2 {color: rgba(255,255,255,1.00); font-size: 20pt; font-family: bodoni 72 oldstyle bold}
h3 {color: rgba(255,255,255,1.00); font-size: 20pt; font-family:bodoni 72 oldstyle bold}

p {font-size: 18pt; font-family: Snell Roundhand; color: rgba(89,37,21,1.00)}
p2 {font-family: bodoni 72 oldstyle bold; color: #592515; font-size: 16pt}
p3 {font-family: bodoni 72 oldstyle bold; font-size: 16pt; color: black; margin: 0 0 0 50px;}
p4 {color: white; Font-size: 15pt; font-family:bodoni 72 oldstyle bold}
p5 {font-size: 15pt; font-family: bodoni 72 oldstyle; color:rgba(89,37,21,1.00) ; text-align: center;}

table {background-color:rgba(230,128,80,0.50) ; font-size: 12pt; color:rgba(89,37,21,1.00); text-align: center; padding: 20px; margin: 0px 225x; border: 2px; border-color: rgba(89,37,21,1.00); border-radius: 8px}
table td{border:2px solid white; padding: 3px 40px;}
table tr{margin:195px}


h4 {font-family: Snell Roundhand; font-size: 40pt; color: rgba(89,37,21,1.00); text-align: center; margin: 20px 0}
h5 {font-family: Snell Roundhand; color: white; font-size: 35pt; text-align: center;}
h6 {font-family: Snell Roundhand; font-size: 30pt; color: rgba(89,37,21,1.00); text-align: center; margin: 20px 0}
h7 {font-family: Snell Roundhand bold; font-size: 35pt; color: white; text-align: center; margin: 20px 0}

div.cta {text-align: center;}
.ctabutton {background-color: rgba(230,128,80,0.98); color: white; padding:5px 15px; font-size: 13pt; border: none; border-radius: 5px; cursor: pointer; font-family: bodoni 72 oldstyle bold; text-decoration: none; margin: 10px}
.ctabutton:hover {background-color: #592515}

div.instructor1 {background-color: rgba(230,128,80,0.50); padding: 10px; flex: 0 0 30%; box-sizing: border-box; margin: 3% 0 3%; border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0. 0.2); transition: transform 0.2s ease-in-out; hover transform: translateY(-5px)}

div.instructor1:hover {transform: translateY(-5px)}

div.aboutpage{background-color: rgba(230,128,80,0.50); padding: 5px; flex: 10%; box-sizing: border-box; margin: 10px; border-radius: 10px; box-shadow: 0 4px 8px rgba(0, 0, 0. 0.2); transition: transform 0.2s ease-in-out; hover transform: translateY(-5px)}




div.footer{
}