@font-face{
	font-family: 'KoPubDotum-medium';
	src: url('../fonts/kopubdotum_pro_medium-webfont.eot');
	src: url('../fonts/kopubdotum_pro_medium-webfont.eot?#iefix') format('embedded-opentype'),
	     url('../fonts/kopubdotum_pro_medium-webfont.woff') format('woff'),
	     url('../fonts/kopubdotum_pro_medium-webfont.ttf') format('truetype'),
       url('../fonts/kopubdotum_pro_medium-webfont.svg#webfont') format('svg');
}
@font-face{
	font-family: 'KoPubDotum-light';
	src: url('../fonts/kopubdotum_pro_light-webfont.eot');
	src: url('../fonts/kopubdotum_pro_light-webfont.eot?#iefix') format('embedded-opentype'),
	     url('../fonts/kopubdotum_pro_light-webfont.woff') format('woff'),
	     url('../fonts/kopubdotum_pro_light-webfont.ttf') format('truetype'),
       url('../fonts/kopubdotum_pro_light-webfont.svg#webfont') format('svg');
}
@font-face{
	font-family: 'KoPubDotum-bold';
	src: url('../fonts/kopubdotum_pro_bold-webfont.eot');
	src: url('../fonts/kopubdotum_pro_bold-webfont.eot?#iefix') format('embedded-opentype'),
	     url('../fonts/kopubdotum_pro_bold-webfont.woff') format('woff'),
	     url('../fonts/kopubdotum_pro_bold-webfont.ttf') format('truetype'),
       url('../fonts/kopubdotum_pro_bold-webfont.svg#webfont') format('svg');
}

/* * {box-sizing: border-box;} */
.logo-header {
  width: auto;
}
.img-comp-container {
  position: relative;
  width: 100vw;
 /*should be the same height as the images*/
	max-height: 85vh;
	height: 900px;
	transition: 500ms all;
}
.text-container {
  display: block;
  text-align: center;
  position: absolute;
  left: 0;
  height: 100%;
  width: 100vw;

  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;

  font-family: "KoPubDotum-medium", sans-serif;
  font-size: 2.1vw;
  text-shadow: -0.9px 5.9px 9px rgba(0, 0, 0, 0.25);
}
.text-container#text-cont-overlay {
  text-shadow: 0px 4px 20px rgba(255, 255, 255, 0.15);
}

.text-container .ko-bold {
  font-family: "KoPubDotum-bold", sans-serif;
}
.text-container * {
  white-space: nowrap;
  line-height: 1;
}
.text-container .main-title {
  font-size:5.5vw;
  text-shadow: -0.9px 5.9px 9px rgba(0, 0, 0, 0.25);
}
.text-container#text-cont-overlay .main-title {
  text-shadow: 0px 4px 20px rgba(255, 255, 255, 0.15);
}
.text-container .pre-title {
  padding-top: 15vh;
}
.main-title {
  margin-bottom: 4vh;
}
@media(max-width: 767px) {
  .text-container{
    font-size: 3.15vw;
  }
  .text-container .main-title {
    font-size: 8.25vw;
  }
}
@media(max-width: 500px) {
  .text-container{
    font-size: 3.78vw;
  }
  .text-container .main-title {
    font-size: 9.9vw;
  }
}

.text-container#text-cont {
  color: white;
}
.text-container#text-cont-overlay {
  color: black;
}
.img-comp-overlay {

}
.img-comp-img {
  position: absolute;
	top: 0;
  width: auto;
  height: auto;
  overflow:hidden;
  display: flex;
  /* justify-content: center; */
  align-items: center;
}
.img-comp-img:first-child {

}
.btn.slide-btn {
  background: white;
  color: black;
  padding: 20px 40px;
  border: none;
  font-family: "Poppins", sans-serif;
  text-transform: uppercase;
  font-stretch: expanded;
  letter-spacing: 3.0px;
  font-size: 16px;
}
#text-cont-overlay .btn.slide-btn {
  color: white;
  background: black;

}
.img-comp-img img {
  display:block;
  vertical-align:middle;
}

.img-comp-slider {
  position: relative;
  z-index:11;
  cursor: ew-resize;
  /*set the appearance of the slider:*/
  width: 2px;
	height: 100%;
	background: black;
}
.img-comp-slider::before{
	top: 20%;
  font-family: "FontAwesome"; font-weight: 400; font-size: 3rem;content: "\f0d9";
  text-shadow: 1px 1px 1px grey;
  position: absolute;
  left: -16px;
}
.img-comp-slider::after {
	top: 20%;
  font-family: "FontAwesome"; font-weight: 400; font-size: 3rem;content: "\f0da";
  text-shadow: 1px 1px 1px grey;
  position: absolute;
  right: -16px;
}

/* Content */
.roboto {
	font-family: "Roboto", sans-serif;
}
.pf {
	font-family: 'Playfair Display', sans-serif;
}
.bold {
	font-weight: bold;
}
.regular {
	font-weight: normal;
}
.figure-subtitle {
	font-size: 14px;
}
.map-info > div {
	margin-bottom: 16px;
}


@media (max-width: 767px) {
	.figure-subtitle {
		/* margin: 40px; */
	}
	#gmap {
		 max-height: 50vh;
		 max-width: 90%;
		 margin: 10% auto 0 auto;
	}
}
@media (max-width: 600px) {
		.directory-section {
			text-align: center;
		}
}


@media only screen and (max-width: 991px){
  .is-fixed .header-nav .nav {
    height: auto;
  }
}