@charset "utf-8";
/* CSS Document */


@media (max-width: 1400px) {
	.main-menu{
		position: absolute;
		display: none;
		right:0;
		top: 0;
		height: 100%;
		transition: left 0.3s ease, box-shadow 0.3s ease;
		z-index: 999;

	}

	.main-menu ul{
		list-style: none;
		margin: 0;
		padding: 2.5em 0 0;

		-webkit-box-shadow: -8px 0 8px rgba(0,0,0,.5);
		-moz-box-shadow: -8px 0 8px rgba(0,0,0,.5);
		box-shadow: -8px 0 8px rgba(0,0,0,.5);
		min-height: 100%;
		width: 170px;
		background: #1a1a1a;
		text-align:right;
		z-index:9;


	}

	.nav li {
		display: block;
		margin: 0 0 0 0px;
	}


	#navwrapper .sub_menu{
		visibility: hidden;
		position: absolute;
		z-index: 999;
		top: 0px!important;
		left: -350px;
		width: 200px;
		border-top: none;
		padding: 0;
		display:none;
	}

	#navwrapper .sub_menu li.first {
		margin: 0;
	}

	#navwrapper .fa-bars  {
		color: #fff;
		font-size: 18px;
		display: block;
		z-index: 9;
		width: 18px;
		height: 20px;
		padding: 20px;
		background: rgba(4, 30, 40, 0.7);
		position: fixed;
		top: 0!important;
		right: 0!important;
	}

	#topwrapper .fa{
		display:block;}


	#topwrapper #navwrapper .sub_menu li a {
		font-size: 14px;
		padding: .75em  5px;
	}

	#navwrapper .fa-bars{
		color:#fff;
		position:fixed;
		right:20px;
		top:25px;
		font-size:22px;
	}

	#navwrapper .fa-bars.scrolled{
		color:#fff;
		font-size:18px;
		display: block;
		z-index:9;
		width: 18px;
		height: 20px;
		padding: 20px;
		background:rgba(4,30,40,0.7);
		position:fixed;
		top:0;
		right:0;
	}



	.fa-close{
		font-size:22px;
	}

	#topwrapper #navwrapper .menu-toggle, #topwrapper #navwrapper .menu-close{
		display:block;
		padding:0;
	}

	#topwrapper  #navwrapper {
		width: 100%;
		float: none;
		text-align: left;
		margin:0;
	}

	#topwrapper  #navwrapper a {
		padding: 15px 0 0 0;
		font-size: 20px;
	}



	.main-menu li:first-child a {

	}

	.main-menu a:hover,
	.main-menu a:focus,
	{
		background: #333;
		text-decoration: none;
	}

	#topwrapper #navwrapper .main-menu a, #topwrapper #navwrapper .sub_menu li a{
		display: block;
		padding: .75em 15px;
		line-height: 15px;
		font-size: 15px;
		color: #fff;
		text-decoration: none;
		border-bottom: 1px solid #383838;
	}

	#topwrapper #navwrapper .sub_menu li, #topwrapper #navwrapper li{
		margin:0;
	}
	#topwrapper #navwrapper a.tel{
		display:none;
	}


	.main-menu .menu-close {
		position: absolute;
		right: 0;
		top: 0;
		border-bottom: none!important;
	}

	.main-menu:target, .main-menu[aria-expanded="true"]{
		display: block;
		right:0;
		outline: none;
		-moz-box-shadow: 3px 0 12px rgba(0,0,0,.25);
		-webkit-box-shadow: 3px 0 12px rgba(0,0,0,.25);
		box-shadow: 3px 0 12px rgba(0,0,0,.25);


	}

	.main-menu:target .menu-close, .main-menu[aria-expanded="true"] .menu-close{
		z-index: 1001;
	}

	.main-menu:target ul, .main-menu[aria-expanded="true"] ul, {
		position: relative;
		z-index: 1000;
	}

	.main-menu:target + .backdrop,
	.main-menu[aria-expanded="true"] + .backdrop{
		position: absolute;
		display: block;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		z-index: 998;
		background: #000;
		background: rgba(0,0,0,.85);
		cursor: default;

	}


	@supports (position: fixed) {
		.main-menu,
		.main-menu:target + .backdrop,
		.main-menu[aria-expanded="true"] + .backdrop {
			position: fixed;

		}
	}

	h1{
		margin:200px 0 0;
		font-size: 45px;
	}

	body, .text, .testimonials .par, #pages.about .left .par .text, #pages.services .desc, #pages.contact .info, #pages.admissions .item, #home .covid{
		font-size: 17px;
	}

	#home .services h3, .caps, #pages .caps.gold{
		font-size: 18px;
	}

	#home h1{
		font-size: 75px;
	}

	#home .wrapper{
		width:94%;
	}

	#home .about h2, #pages.about .left h2 {
		font-size: 60px;
	}

	#pages.about .left .par h2, #pages.services h2, #pages.services .name, #pages.admissions .overlay h2, #pages.contact h2{
		font-size: 40px;
	}

	#home .about h2{
		max-width: 450px;
		text-shadow: 0 0 15px rgb(255 255 255 / 80%);
	}

	#home .about .overlay{
		padding:230px 40px 40px;
	}

	#home .services h2{
		font-size: 30px;
	}

	.testimonials{
		padding:20px 0;
	}

	#pages.services li{
		font-size:15px;
	}

	#pages.amenities .label{
		font-size: 13px;
		letter-spacing:.3em;
	}

	#pages.admissions .wrapper {
		width: 94%;
	}

	#pages.admissions .overlay{
		top:60px;
	}

}

@media (max-width: 1200px) {

	.padding {
		padding: 60px 0;
	}

	#home .service, #home .service.two{
		width:48%;
		margin:1%;
		height:300px;
	}

	#pages.about .left{
		float:none;
		width:100%;
	}


	#pages.about .left h2{
		width: 100%;
		text-align: center;
		margin:0 0 40px;
	}

	#pages.about .left .image{
		width:100%;
		max-height: 600px;
		overflow: hidden;
		display: flex;
		align-items: center;
	}

	#pages.about .left .par{
		float:none;
		margin:-200px auto 20px;
		width:80%;
		max-width: 500px;
		padding:40px 5%;
	}

	#pages.about .right{
		display: none;
	}

	#pages.amenities .amenity{
		padding:0 0 28px;
	}

	#pages.amenities .label{
		bottom:0;
		left:0;
		right:0;
		padding:10px;
		line-height: 1.2;
	}

	#pages.admissions .bring{
		margin:0;
	}

	#pages.admissions .bring img{
		position: absolute;
		width: 100%;
		height: 100%;
		object-fit: cover;
		z-index: -1;
	}

	#pages.admissions .bring .overlay{
		position: static;
		padding:60px 0;
	}

	#pages.admissions .box, #pages.admissions .box.right{
		float:none;
		margin:0 auto 30px auto;
		padding:40px;
		width:auto;
		max-width: 600px;
	}

	#pages.tour .image{
		float:none;
		width:80%;
		margin:0 auto 10px auto;
	}

	#pages.tour .list {
		float:none;
		width: 66%;
		margin: 0 auto;
		text-align:center;
		padding: 40px 7%;
	}


	#footerwrapper .right{
		display:none;
	}

}

@media (max-width: 750px) {
	#topwrapper .logo{
		width:275px;
	}

	h1{
		margin:150px 0 0;
		font-size: 35px;
	}

	body, .text, .testimonials .par, #pages.about .left .par .text, #pages.services .desc, #pages.contact .info, #pages.admissions .item, #home .covid{
		font-size: 15px;
	}

	#home .services h3, .caps, #pages .caps.gold{
		font-size: 16px;
	}

	#home h1{
		font-size: 45px;
	}

	#home .about h2, #pages.about .left h2 {
		font-size: 40px;
	}

	#pages.about .left .par h2, #pages.services h2, #pages.services .name, #pages.admissions .overlay h2, #pages.contact h2{
		font-size: 30px;
	}

	.button, #pages.admissions .button, #pages.contact .button{
		font-size: 13px;
		padding:8px 18px;
	}

	#home .covid a{
		font-size: 12px;
	}

	#home .head{
		min-height: 500px;
	}

	#home .about h2{
		max-width: none;
		margin:0;
		text-align: center;
	}

	#home .about h2 br{
		display: none;
	}

	#home .about .overlay{
		padding:40px;
		margin:auto;
	}

	#home .about .content .pic{
		width:100%;
		top:120px;
		opacity: .6;
	}

	#home .service{
		height: 200px;
	}

	#home .services h2{
		left:5%;
		width:90%;
		font-size: 22px;
	}

	#home .services .service .button{
		bottom:20px;
		right:5%;
	}

	.testimonials{
		padding:0;
	}

	.testimonials .par{
		width:94%;
	}

	.testimonials .quote{
		width:70px;
	}

	.testimonials .quote.one{
		left: 0;
	}

	.testimonials .quote.two{
		right: 0;
	}

	#pages.services .service, #pages.services .service.right{
		width:100%;
		flaot:none;
		margin:0 0 30px;
	}

	#pages.services .image{
		max-height: 400px;
		overflow: hidden;
	}

	#pages.services .name{
		text-shadow:0 0 20px rgb(0 0 0 / 80%);
		bottom: 180px;
	}

	#pages.services .desc{
		width:80%;
		padding:40px 5%;
		margin:-160px auto 0;
	}

	#pages.services li{
		width:45%;
		font-size:14px;
	}

	#pages.amenities .amenity{
		width:48%;
	}

	#pages.amenities .label{
		font-size: 12px;
	}

	#pages.contact .flex{
		flex-direction: column;
		gap:20px;
	}

	#pages.contact .flex .logo{
		width:200px;
	}

	#pages.contact .form{
		padding:30px 4%;
	}

	#footerwrapper .footer{
		flex-direction: column;
		text-align: center;
		gap:30px;
	}

	#footerwrapper .logo, #footerwrapper .info{
		float:none;
		margin:auto;
	}

	.copy .left, .copy .right{
		float: none;
		width: 100%;
		text-align: center;
	}



}

