* {margin:0; padding:0; box-sizing:border-box;}
html {font-size:62.5%; scroll-behavior:smooth;}
body {font-family:"Raleway", sans-serif; font-size:1.6rem; color:#333; background-color:#F2F2F2; animation:opening 1s ease-in-out}
@keyframes opening {from {opacity:0;} to {opacity:1;}}
h1 {width:45%; margin:auto; font-size:3.5rem; font-weight:400; color:#c7ac74; line-height:4rem; padding:1.8rem 0rem;}
h2 {width:45%; margin:auto;	font-size:2.2rem; color:#000; font-weight:300; line-height:3.2rem; padding:3rem 0rem 1rem 0rem;	text-align: left;}
h3 {width:45%; margin:auto;	font-size:1.89rem;color:#000;  font-weight:300; line-height:3.2rem; padding:1rem 0rem;}
h4 {width:45%; margin:auto;	font-size:1.5rem; color:#000; font-weight:300; line-height:1.8rem; padding:0.5rem 0rem;}
h5 {width:45%; margin:auto;	font-size:2.2rem; color:#c7ac74; font-weight:300; line-height:3.2rem; padding:3rem 0rem 1rem 0rem;	text-align: center;}
h6 {font-size:1rem; font-weight:300; color:#999; line-height:1rem; padding:0rem;}

.page {width:90%; margin:auto; background-color:#FFF; position:relative; padding-bottom:9rem;}
header {width:100%;	position:absolute; top:1px;	left:1px; z-index:10; padding:3rem 4rem 0rem 10rem;}
.hero {width:100%; height:auto;}
.logo {fill: #000000; object-fit:cover;}
.logo-white {fill: #FFFFFF; object-fit:cover;}
.overlay {height:100%; width:0; position:fixed; z-index:30; left:0; top:0; background-color:rgba(255,255,255, 1); overflow-x:hidden; transition:0.5s;}
.overlay-content {position:relative; top:10rem; width:100vw; height:100vh; text-align:center; margin-top:5rem; z-index:40;}
.overlay a {padding:1rem; text-decoration:none; font-size:3rem; font-weight:400; color:#c7ac74; line-height:3rem; display:block; transition:0.3s;}
.overlay a:hover, .overlay a:focus {color:#000;}
.overlay .closebtn { position:absolute; top:6.7rem; right:16.95rem; font-size:8rem;}
.icon {font-size:3.4rem; display:inline; position:absolute; right:11rem; top:7.5rem; cursor:pointer; float:right;}
.icon-white {color:#FFF; font-size:3.4rem; display:inline; position:absolute; right:11rem; top:7.5rem; cursor:pointer; float:right;}

#intro {width:50%; height:14%; background-image:url(../files/images/img/balloon-450.png); background-repeat:no-repeat; position:absolute; top:26rem;left:7rem; padding:0rem;}
#intro .text {padding:10rem 2rem 0rem 8rem; font-size:17px;}
#intro a {text-decoration:none; color:#5454A9;}
#intro1 {display:none; width:100%; margin:auto; padding: 3rem 0rem;}
#intro1 h3 {width:75%; margin:auto;}
#intro1 a {color:#c7ac74; text-decoration:none;}
#intro1 a:visited {color:#c7ac74;text-decoration:none;}

.content {padding:5rem 0rem 8rem 0rem;}
.content p {width:45%; margin:auto;	line-height:2.7rem;	padding:1.3rem 0rem;}
.content a {width:45%; margin:auto;	color:#4c59d5;	text-decoration:none; line-height:2.7rem; padding:1.3rem 0rem;}
/*.content a:visited {color:#868dd1;}*/
.content-icon {font-size:2rem; color:#c7ac74;}
hr.line {width:45%; margin:auto; border-bottom: 1px solid #E0E0E0;}
.gray {font-size:1rem; font-weight:300; color:#999; line-height:1rem; padding:0rem;}
.gray a {font-size:1rem; font-weight:300; color:#999; line-height:1rem; padding:0rem;}

#breadcrumbs {width:45%; margin:auto; font-size:1.2rem;	color:#999; line-height:1rem; padding:0rem 0rem 3rem 0rem;}
#breadcrumbs a{text-decoration:underline; color:#999;}

.gallery {width:80%; margin:auto; display:flex;	flex-wrap:wrap;	flex-direction:column; flex-justify:center;	flex-align:center; padding-top:3rem;}
.gallery60 {width:60%; margin:auto; display:flex; flex-wrap:wrap; flex-direction:column; flex-justify:center; flex-align:center; padding-top:3rem;}
.gallery40 {width:40%; margin:auto; display:flex; flex-wrap:wrap; flex-direction:column; flex-justify:center; flex-align:center; padding-top:3rem;}
.gallery20 {width:20%; margin:auto; display:flex; flex-wrap:wrap; flex-direction:column; flex-justify:center; flex-align:center; padding-top:3rem;}
.gallery-2 {width:80%; margin:auto; display:flex; flex-wrap:wrap; flex-direction:row; flex-justify:space-between; flex-align:center; padding-top:3rem;}
.gallery-3 {width:100%; margin:auto; display:flex; flex-wrap:wrap; flex-direction:row; flex-justify:space-between; flex-align:center; padding-top:3rem;}
.large {width:100%;	height:100%; margin:auto; padding-bottom: 2rem; justify:1 1 40px;}
.medium {width:50%;	height:50%; padding-bottom: 2rem; padding-right:2rem; justify:1 1 40px;}
.small {width:33%;	height:30%; padding-bottom: 1rem; padding-left:1rem; justify:1 1 40px;}
.gallery-2col {width:80%; margin:auto; display:flex; flex-wrap:wrap; flex-direction:row; flex-justify:center; flex-align:space-between; padding-top:3rem;}
.video {overflow:hidden; position:relative; width:100%; margin:1.5rem 0rem 3rem 0rem; animation:opening 1s ease-in-out forwards;}
.video::after {padding-top:56.25%; display:block; content:'';}
.video iframe {position:absolute; top:0; left:0; width:100%; height:100%; border-width: 0px;}

.folio {width:85%; margin:auto; padding:15rem 0rem 1rem 0rem;}
.folio h1 {width:100%; margin:auto; font-size:2.2rem; color:#000; font-weight:300; line-height:3.2rem; padding:3rem 0rem;}
.folio p {width:100%; margin:auto; line-height:2.7rem; padding:1.3rem 0rem;}
.folio a {color:#4c59d5; text-decoration:none; line-height:2.7rem; padding:1.3rem 0rem; text-align: left;}
.row {margin: 3rem -1rem 3rem -1rem;}
.row,.row>.column {padding: 1rem 0rem 0rem 0rem;}
.column-3 {float: left; width: 33.33%; display: none;}
.column-3 p {width:90%; font-size:1.5rem;line-height:1.7rem; padding:0.5rem 0rem 0.5rem 1rem;}}
.column-3 h2 {width:100%; font-size 2.2rem;line-height:3.2rem; padding:2rem 0rem 1rem -5rem;} 
.column-2 {float: left; width: 50%; display: none;}
.row:after {content: ""; display: table; clear: both;}
.item {padding: 0rem 1rem;}
.item .large {padding:0rem 0rem 0.5rem 0rem;}
.item a {line-height:1rem;}
.item p {font-size: 1.2rem; line-height:1.5rem; padding:1rem 0rem 4rem 0rem;}
 
.show {display: block;}
.btn {background-color:white; color:#999; border: none; outline: none; padding: 0rem 0rem 1rem 0rem; cursor: pointer;}
.btn:hover {color: #000;}
.btn.active {color: #000; cursor:text}

.prev-next {width:80%; margin:auto;	display:flex; flex-direction:row; justify-content:space-between; min-height:10vh; padding-bottom:2rem;}
.prev {flex:1 1 40rem; text-align:left;}
.prev-subtitle {padding-left:2rem; font-size:1.1rem; color:#999; margin-bottom:1rem;}
.prev-link a {font-weight:600; color:#000; text-decoration:none;}
.next {text-align:right; flex:1 1 40rem;}
.next-subtitle {padding-right:2rem;	font-size:1.1rem; color:#999; margin-bottom:1rem;}
.next-link a {font-weight:600; color:#000; text-decoration:none;}
 
.social {width:80%;	margin:auto; margin-top:4rem; border-top:solid thin #CCC; padding:2rem 0rem 4rem 0rem; background-color:#FFF;}
.copy {width:30%; padding-top:1.4rem; float:left; font-size:1.2rem; color:#000; flex:1 1 10rem; color:#999;}
.social ul {display:flex; flex-direction:row; flex-justify:space-between; list-style:none; float:right;}
.social li{	flex:1 1 10rem; padding:1rem 1rem;}
.social a {color:#000; font-size:1.2rem; text-decoration:none;}
 
@media screen and (max-width:1290px) {
	header {padding:3rem 0rem 0rem 8.2rem;}
	.icon {right:9rem; top:7.5rem;}
	.icon-white {right:9rem; top:7.5rem;}
	.overlay .closebtn {position:absolute; top:6.7rem; right:13.5rem;}	
	#intro {width:50%; height:14%; top:21rem;left:4rem; z-index:30; padding:0rem;}
	#intro .text {padding:10rem 2rem 0rem 8rem; font-size:17px;}
}

@media screen and (max-width:1190px) {
	header {padding:3rem 0rem 0rem 8rem;}
	.icon {right:9rem; top:7.6rem;}
	.icon-white {right:9rem; top:7.6rem;}
	.overlay .closebtn {position:absolute; top:6.6rem; right:13.3rem;}
	#intro {width:45%; height:14%; top:18rem;left:4rem; z-index:30; background-image:url(../files/images/img/balloon-400.png);}
	#intro .text {padding:9rem 2rem 0rem 7rem; font-size:15px;}
	
}

@media screen and (max-width:1024px) {
	body {font-size:1.7rem;}
	h1 {font-size:3.3rem; width:75%; margin:auto; line-height:4.5rem; padding:1.8rem 0rem;}
	h2 {width:75%; margin:auto;	font-size:2.3rem; color:#000; font-weight:300; line-height:3rem; padding:2rem 0rem;}
	h4 {width:75%; font-size:1.5rem;  padding:0.5rem 0rem;}
	.page {width:100%;}
	
	header {padding:3rem 0rem 0rem 7.5rem;}
	.overlay a {font-size:2.7rem; line-height:3.5rem;}
	.overlay .closebtn {position:absolute; top:6.5rem; right:6.5rem;}
	.icon {right:8rem; top:7.6rem;}
	.icon-white {right:8rem; top:7.6rem;}
	
	#breadcrumbs {width:75%; font-size:1.3rem;	color:#999; line-height:1rem; padding:0rem 0rem 3rem 0rem;}
		
	#intro {width:45%; height:7%; top:17rem;left:2rem; z-index:30; background-image:url(../files/images/img/balloon-400.png);}
	#intro .text {padding:8.5rem 2rem 0rem 7rem; font-size:15px;}
	
	.content {padding:5rem 0rem 6rem 0rem;}
	.content p {width:75%; line-height:2.6rem; padding:1rem 0rem;}
	.content a {width:75%; line-height:2.5rem; padding:1rem 0rem;}
	.content-index {padding:5rem 0rem 5rem 0rem;}
	.content-index p {width:75%; line-height:2.6rem; padding:1rem 0rem;}
	.content-index a {width:75%; line-height:2.5rem; padding:1rem 0rem;}	
	.gallery {width:100%; padding-top:3rem;}
	.gallery60 {width:80%; padding-top:3rem;}
	.gallery40 {width:80%; padding-top:3rem;}
	.gallery20 {width:30%; padding-top:3rem;}
	.gallery-2 {width:80%; padding-top:3rem;}
	.medium {width:50%;	height:50%; padding-bottom: 2rem;}
	.large {margin:auto; padding-bottom:1rem;}
	 	
	.column-3 {width: 50%;}
			
	.prev-next {width:75%; padding-bottom:3rem;}
	 prev-subtitle {padding-left:2rem; margin-bottom:1rem;}
	.next-subtitle {padding-right:2rem;	margin-bottom:1rem;}
	.social {width:85%; margin-top:0rem; padding-top:1rem;}
	.copy {width:30%; font-size:1.3rem; color:#999; flex:1 1 10rem;}
	.social li{flex:1 1 10rem; padding:2rem 2rem;}
	.social a {font-size:1.5rem;}
}

@media screen and (max-width:920px) {
	header {padding:3rem 0rem 0rem 7rem;}
	.overlay .closebtn {position:absolute; top:5.7rem; right:5.8rem;}
	.icon {right:7.2rem; top:7.1rem;}
	.icon-white {right:7.2rem; top:7.1rem;}
	#intro {width:45%; height:7%; top:15rem;left:2rem; z-index:30; background-image:url(../files/images/img/balloon-350.png);}
	#intro .text {padding:8rem 2rem 0rem 6rem; font-size:13px;}
	#breadcrumbs {width:75%; font-size:1.2rem; line-height:1rem; padding:0rem 0rem 3rem 0rem;}
	#breadcrumbs a{font-size:1.2rem;}
}


@media screen and (max-width:790px) {
	body {font-size:1.7rem;}
	h1 {font-size:3.3rem; width:75%; margin:auto; line-height:4.5rem; padding:1.8rem 0rem;}
	h2 {width:75%; margin:auto;	font-size:2.3rem; color:#000; font-weight:300; line-height:3rem; padding:2rem 0rem;}
	h4 {width:75%; font-size:1.5rem;}
	.page {width:100%; padding-bottom:1rem;}
	
	header {padding:3rem 0rem 0rem 6rem;}
	.overlay a {font-size:2.7rem; line-height:3.5rem;}
	.overlay .closebtn {position:absolute; top:6.2rem; right:5.8rem;}
	.icon {right:6.2rem; top:7.6rem;}
	.icon-white {right:6.2rem; top:7.6rem;}
	
	#intro {width:50%; height:3%; top:13rem;left:1rem; z-index:30; background-image:url(../files/images/img/balloon-350.png);}
	#intro .text {padding:8rem 2rem 0rem 6rem; font-size:13px;}
		
	.content {padding:5rem 0rem 5rem 0rem;}
	.content p {width:75%; line-height:2.6rem; padding:1.8rem 0rem;}
	.content a {width:75%; line-height:2.5rem; padding:1.8rem 0rem;}
	.content-index {padding:5rem 0rem 5rem 0rem;}
	.content-index p {width:75%; line-height:2.6rem; padding:1.8rem 0rem;}
	.content-index a {width:75%; line-height:2.5rem; padding:1.8rem 0rem;}
	
	.gallery {width:100%; padding-top:3rem;}
	.gallery60 {width:80%; padding-top:3rem;}
	.gallery40 {width:80%; padding-top:3rem;}
	.gallery20 {width:50%; padding-top:3rem;}
	.gallery-2 {width:40%; padding-top:3rem;}
	.medium {width:100%; height:100%; padding-bottom: 1rem;}
	.large {margin:auto; padding-bottom:1rem;}
		
	.folio h1 {width:100%; margin:auto; font-size:2.2rem; color:#000; font-weight:300; line-height:3.2rem; padding:3rem 0rem;}
	.column-3 {width: 100%;}
	.column-2 {width: 100%;}
	.btn {padding: 0rem 0rem 1rem 0rem;}
		
	.prev-next {width:75%;}
	 prev-subtitle {padding-left:2rem; font-size:1.1rem; margin-bottom:1rem;}
	.next-subtitle {padding-right:2rem; font-size:1.1rem; margin-bottom:1rem;}
	.social {width:85%; margin-top:0rem 0rem 7rem 0rem;;}
	.copy {width:100%; padding:2rem 0rem; font-size:1.3rem; flex:1 1 10rem; text-align:center; color:#999;}
	.social ul {width: 60%; margin:auto; flex-justify:space-between; float:none;}
	.social li{flex:1 1 5rem; padding:2rem 1rem;}
	.social a {font-size:1.5rem;}
}

@media screen and (max-width:750px) {
	header {padding:3rem 0rem 0rem 5rem;}
	.content-index {padding:33rem 0rem 15rem 0rem;}
	.overlay .closebtn {position:absolute; top:6.8rem; right:4.4rem;}
	.icon {right:6rem; top:7.5rem;}
	.icon-white {right:6rem; top:7.5rem;}
	.btn {font-size:1.3rem; padding: 0rem 0rem 0rem 0rem;}
	#intro {display:none;}
	#intro1 {display:block;}
	.social {width:85%; margin-top:0rem; padding:2rem 0rem 9rem 0rem;}
	#breadcrumbs {width:75%; font-size:1.1rem; line-height:2.5rem; padding:0rem 0rem 1rem 0rem;}
	#breadcrumbs a{font-size:1.1rem;}
}

@media screen and (max-width:550px) {
	header {padding:1rem 0rem 0rem 4rem;}
	.content-index {padding:35rem 0rem 15rem 0rem;}
	.overlay .closebtn {position:absolute; top:4.8rem; right:3.4rem;}
	.icon {right:5rem; top:5.5rem;}
	.icon-white {right:5rem; top:5.5rem;}
	.btn {font-size:1.3rem; padding: 0rem 0rem 0rem 0rem;}
}

@media screen and (max-width:440px) {
	.page {width:100%; padding-bottom:4rem;}
	 h1 {font-size:2.8rem; width:80%; margin:auto; line-height:3.5rem; padding:1.8rem 0rem;}
	 h2 {width:80%; font-size:2rem; color:#000; font-weight:300; line-height:3rem; padding:2rem 0rem;}
	 h4 {width:80%; font-size:1.5rem;}
	
	 header {padding:0rem 0rem 0rem 0rem;}
	 .hero {width:100%; margin-top: 11rem; }
	 .logo {padding: 2rem 1rem;}
	 .logo-white {fill:black; padding: 2rem 1rem; }
	 .overlay-content {top:1.5rem; width:100vw; height:100vh; margin-top:8rem; z-index:40;}
	 .overlay a {font-size:2rem; line-height:3rem;}
	 .overlay .closebtn {position:absolute; font-size:6rem; top:3rem; right:1.5rem;}
	 .icon {font-size:2.5rem; right:3rem; top:4.4rem;}
	 .icon-white {color:black; font-size:2.5rem; right:3rem; top:4.4rem;}
	 
	 .content {padding:3rem 0rem 5rem 0rem;}
	 .content p {width:80%; font-size:1.5rem; line-height:2.4rem; padding:1rem 0rem;}
	 .content a {width:80%; font-size:1.5rem; line-height:2.4rem; padding:1rem 0rem;}
	 .gray {font-size:1rem;}
	 .gray a {font-size:1rem;}
	 #breadcrumbs {width:80%; font-size:1.1rem; line-height:2.5rem; padding:0rem 0rem 1rem 0rem;}
	 .gallery {width:100%; padding-top:2rem;}
	 .gallery60 {width:80%; padding-top:2rem;}
	 .gallery40 {width:80%; padding-top:2rem;}
	 .gallery20 {width:80%; padding-top:2rem;}
	 .gallery-2 {width:80%; padding-top:2rem;}
	 .medium {width:100%; height:100%; padding-bottom: 1rem;}
	 .large {margin:auto; padding-bottom:1rem;}
	 .folio {width:85%; margin:auto; padding:12rem 0rem 2rem 0rem;}	
	 .folio h1 {width:100%; margin:auto; font-size:2rem; color:#000; font-weight:300; line-height:3.2rem; padding:1rem 0rem;}
	 .column-3 {width: 100%;}
	 .column-2 {width: 100%;}
	 .btn {font-size: 1.1rem; padding: 0rem 0rem 0rem 0rem;}
	
	.prev-next {width:80%; margin:auto;	display:flex; flex-direction:column;}
	.prev {flex:1 1 8rem; text-align:center;}
	.prev-subtitle {font-size:1.1rem; color:#999; margin-bottom:1rem; padding-leftt:0rem;}
	.prev-link a {font-weight:600; color:#000; text-decoration:none;}
	.next {text-align:center; flex:1 1 8rem;}
	.next-subtitle {font-size:1.1rem; color:#999; margin-bottom:1rem; padding-right:0rem;}
	.next-link a {font-weight:600; color:#000; text-decoration:none;}

	.social {width:75%;	margin:auto; margin-top:0rem; padding:2rem 0rem 10rem 0rem;}
	.copy {width:100%; padding-top:2rem 0rem; text-align:center; font-size:1.1rem; color:#999;}
	.social ul {width: 90%; margin:auto; display:flex; flex-direction:row; flex-justify:space-between; list-style:none; float:none;}
	.social li{	flex:1 1 3rem; padding:1rem 1rem;}
	.social a {font-size:1.1rem;}
	
}