/*!
Styles for full screen background video demo
*/
/* =============================================================================
  RESETS
============================================================================= */
html,
body,
div,
h1,
p,
a,
video {
  margin: 0;
  padding: 0;
}

input {
    border-radius: 0;
    -webkit-appearance: none;
}

a,img,div,span,input,html,body{
	-webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
	user-drag: none;
	-webkit-touch-callout: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

/* =============================================================================
  HTML, BODY
============================================================================= */
html,
body {
  height: 100%;
  font-family: 'robotoregular';
  font-size: 2vh;
}

#section{
	background: #fff;
	color: rgb(62, 62, 62);
	padding: 10vh;
}

a{
	color: rgb(82, 82, 82);
	text-decoration: none;
}

a:hover{
	color: rgb(246,62,47);
}

div, input{
	transition: all 0.5s ease;
}


.hidden{
	opacity: 0;
}

.logo_pn{
	text-align: center;
	position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.logo_pn img{
	max-width: 100%;
}


#header{
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	z-index: 99;
}

#header .index_title{
	font-family: 'Dala Floda Roman';
	font-size: 12vh;
	color: rgb(246,62,47);
	position: absolute;
	top: 8vh;
	left: 10vh;
	line-height: 13vh;
	z-index: 2;
}

#header .index_title_small{
	font-size: 6vh;
	line-height: 6vh;
	cursor: pointer;
}


#menu{
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	background: #fff;
	height: 15vh;
}

#mobile_menu{
	display: none;
}

#index{
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background-image: url(../../img/index.jpg);
	background-position: center;
	background-size: cover;
	background-color: #fff8c7;	
	color: #ffffff;
}

#index .index_container{
	top: 14vh;
	bottom: 120px;
	left: 10vh;
	right: 40vh;
	position: absolute;
	/* min-width: 50vw; */
	/* max-width: 50vh; */
	/* transform: translateX(-50%); */
}





#index .text{
	position: absolute;
	left: 0;
	bottom: 0;
	right: 0;
	font-size: 3vh;
	color: #484848;
	font-weight: bold;
	line-height: 4.5vh;
}


#index .enter{
	background-color: #fff;
	color: #747474;
	padding: 1.4vh;
	margin-top: 4vh;
	display: inline-block;
}



#menu .menu_container{
	float: right;
	display: inline-block;
	margin-top: 6.5vh;
	margin-right: 10vh;
}

#menu .menu_container .menu_title{
	color: rgb(246,62,47);
	font-family: 'Dala Floda Roman';
	font-size: 6vh;
}

#menu .menu_container .menu_items{
	/* position: absolute; */
	/* left: 0; */
	/* bottom: 0; */
}

#menu .menu_container a{
	font-size: 2.8vh;
	display: block;
	text-decoration: none;
	color: rgb(82, 82, 82);
	margin-bottom: 1vh;
	font-weight: bold;

}

#menu .menu_container a:hover{
	color: rgb(246,62,47);
}


#menu .menu-item{
	display: inline-block;
	text-transform: uppercase;
	font-size: 2vh;
	font-weight: bold;
	color: #615f5f;
	/* margin-left: 1vh; */
	padding: 3vh;
	padding-bottom: 0;
	background-color: #fff;
	cursor:  pointer;
	vertical-align: top;
	position: relative;
}

#menu .menu-item:hover{
	color: rgb(246,62,47);
}


#menu .submenu{
	/* margin-top: 2vh; */
	background-color: #fff;
	/* padding: 3vh; */
	display: none;
	position: absolute;
	padding: 3vh;
	left: 0;
	white-space: nowrap;
	opacity: 0;
	z-index: 99;
}

.submenu_right{
	/* margin-top: 2vh; */
	left: auto !important;
	right: 0;
	text-align: right;
	max-width: 35vh;
}

#menu .submenu_shown{
	opacity: 1;

	
}

#menu .submenu-item{
	display: block;
	font-size: 1.7vh;
	max-width: 100%;
	text-overflow: ellipsis;
	overflow: hidden;
}


.content_header_gap{
	height: 15vh;
	border-bottom: 4px solid rgb(62, 62, 62);
}

.content_header_title{
	font-family: 'Dala Floda Roman';
	font-size: 9vh;
	margin-top: 1vh;
}

.section_content{
	margin-top:8vh
}

.section_content_line{
	border-top: 1px solid rgb(62, 62, 62);
	margin-top: -0.7vh;
}

.section_content_item{
	/* margin: 3vh; */
	display:  inline-block;
	width: 29%;
	/* padding-bottom: 33%; */
	border-right: 1px solid rgb(62, 62, 62);
	padding-right: 3%;
}

.section_content .section_content_center{
	padding-left: 3%;
}

.section_content .section_content_center_1{
	padding-left: 3%;
}


.section_content .section_content_right{
	padding-left: 3%;
	padding-right: 0;
	border-right: none;
}

.section_content .section_content_center_2{
	padding-left: 3%;
	padding-right: 0;
	border-right: none;
}


.section_content_item_img{
	width: 100%;
	padding-bottom: 100%;
	background-color:#c0c0c0;
	margin-top: 5vh;
	background-size: cover;
    
}

.section_content_item_text{
	margin-top: 2vh;
	margin-bottom: 2vh;
	text-transform: uppercase;
	font-size: 2vh;
	font-weight: bold;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	height: 2.3vh;
	
}

.image_item{
	display: inline-block;
	vertical-align:top;
	width: 30vw;
	cursor: pointer;
	margin-top: 3vh;
	position: relative;
	text-align: center;
}

.image_item_carousel{
	cursor: pointer;
}

.slick-track{
	transition: none;
	padding-bottom: 10vh;
}

.image_item_text{
	max-width: 55vw;
	display: inline-block;
}

.image_item_container{
	max-width: 15vw;
	display: inline-block;
	margin: auto;
	position: relative;	
}

.image_item_container img{
	width: 100%;
}

.image_list{


	margin-top: 4vh;
	margin-bottom: 4vh;
}



.pic_item{
	display: inline-block;
	vertical-align: top;
	width: 48%;
	position: relative;	
	cursor: pointer;
}

.pic_item img{
	width: 100%;	
	
}

.img_zoom_icon{
	position: absolute;
	top: 0;
	right: 1vh;
	top: -1.4vh;
	width: 1.2vh;
	height: 1.2vh;
}

.img_zoom_icon img{
	width: 100%;
	height: 100%;
}


.pic_footer{
	float: left;
	margin-left: -30%;
	margin-top: 1vh;
	width: 20%;
	color: #909090;
	font-size: 1vh;
}


.left{
	float: left;
}

.right{
	float: right;
}

#carousel{
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 999;
	top: 0;
	left: 0;
}

.carousel_overlay{
	background-color: #000;
	opacity: 0.9;
	position: absolute;
	top: 0; 
	left: 0;
	right: 0;
	bottom: 0;
}

.carousel_slick{
	position: absolute;
	top: 45%;
	left: 50%;	
	width: 50vw;
	height: 80vh;
	z-index: 2;
	transform: translate(-50%, -50%);
}

#carousel .image_title{
	text-align: center;
	color: #fff;
	position: absolute;
	bottom: -90px;
	left: 50%;
	transform: translatex(-50%);
	height: 75px;
}

.image_title_person{
	bottom: 8vh !important;
	top: auto !important;
	height: auto !important;
}

.carousel_item{	
	height: 83vh;
	position: relative;
	text-align: center;
}

.carousel_item img{
	max-width: 50vw;
	max-height: 85vh;	
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	
}








.active{
	color: rgb(246,62,47) !important;
}

.selected{
	color: rgb(246,62,47) !important;
}


.close{
	width: 3vh;
	height: 3vh;
	position: fixed;
	top 0;
	
	cursor: pointer;
	right: 10vh;
	top: 10vh;
}

.close img{
	width: 100%
}

.mobile_menu_icon{
	display: none;
}

.unscroll_icon{
	position: fixed;
	bottom: 50px;
	right: 50px;
	z-index: -1;
	opacity: 0;
	cursor: pointer;	
}

.unscroll_icon img{
	width: 50px;
}


.opacity_1{
	opacity: 1;
		z-index: 99;
}

.text_img{
	max-width: 100%;
}

#overlay{
	display: none;
}

#overlay_menu{
	display: none;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	opacity: 0.5;
	background: #000;

}

.overlay_show{
	display: block !important;
	z-index: 200;
}

.menu_show{
	opacity: 1 !important;
	display: block !important;
	right: 0px !important;
}

.back_action{
	cursor: pointer;
}


	
	
	
	
	
	
@media (max-aspect-ratio: 3/2) {
	#header .index_title {


    font-size: 8vh;
    line-height: 8vh;


	}
	
	#menu .menu-item {

		font-size: 1.7vh;
		padding: 1.5vh;

	}
	
	#menu{
		height: 12vh;
	}
	
	#header .index_title_small {
		font-size: 5vh;
		line-height: 5vh;
	}
	
	.content_header_gap {
			height: 11vh;
			border-bottom: 2px solid rgb(62, 62, 62);
	}
	.content_header_title { 
		font-size: 7vh;
		margin-top: 0.5vh;
	}
	
	.section_content {

		margin-top: 5vh;

	}
	
	.section_content_item {

		padding-right: 2.9%;
	}
	
	.section_content .section_content_center_2 {

		padding-left: 2.9%;
 
	}
	
	.image_item_text {

		max-width: 50vw;
    

	}
	
	#index .text {

		font-size: 2.5vh;
		line-height: 3.5vh;

	}
	
	
	
}

@media (max-height: 700px){
	body{
		font-size: 14px;
	}
	
	#menu .menu-item {
		font-size: 12px;
		padding-left: 20px;
		padding-right: 20px;
		padding-top: 13px;
	}
	
	#menu {
		height: 80px;
	}
	
	
	#header .index_title {
		font-size: 50px;
		line-height: 50px;
		top: 55px;
		left: 50px;
	}

	
	#menu .menu_container {
		margin-top: 30px;
		margin-right: 50px;
	}
	
	#index .text {
		font-size: 18px;
		line-height: 22px;
	}
	
	#index .index_container {
		
		bottom: 110px;
		left: 50px;
		right: 50px;
		max-width: 700px;
		position: absolute;
	 
	}
	
	#header .index_title_small {
		font-size: 30px;
		line-height: 30px;
		top: 40px;
		cursor: pointer;
	}
	
	#section {
		padding: 50px;
	}
	
	.section_content_item_text {
		margin-top: 10px;
		margin-bottom: 10px;
		text-transform: uppercase;
		font-size: 12px;
		font-weight: bold;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
		height: 14px;
		margin-left: 10px;
	}
	
	.content_header_title {

		font-size: 50px;
		margin-top: 10px;
	}
	
	.content_header_gap {
		height: 75px;
		border-bottom: 2px solid rgb(62, 62, 62);
	}
	
	#menu .submenu-item {

		font-size: 12px;
	
	}
	
	#menu .submenu {
		padding: 25px;
	}
	
	#menu .menu_container a {
		margin-bottom: 5px;

	}
	
	.submenu_right {
    
		max-width: 250px;
	}
	

	
}


@media (max-width: 850px) {
	#header{
		position: fixed;
		height: 60px;
		background: #fff;		
	}
	#mobile_menu{
		display: block;
		float: right;
		margin-top: 20px;
		margin-right: 20px;
	}
	#menu{
		display: none;
		opacity: 0;
		right: -500px;
		position: fixed;
		z-index: 300;
		width: 90%;
		left: auto;
		top: 0;
		bottom: 0;
		height: auto;
	}
	
	#menu .menu_container{
		float: none;
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}
	
	#menu .menu-item{
		display: block;
	}
	
	#menu .submenu{
		position: relative;
	}
	
	.submenu_right{
		left: 0;
		right: auto;
		text-align: left;
	}
	
	#header .index_title{
		font-size: 50px;
		line-height: 50px;
		top: 35px;
		left: 20px;
	}
	
	#header .index_title_small{
		font-size: 25px;
		line-height: 25px;
		top: 6px;
	}
	
	#index .text{
		font-size: 15px;
		line-height: 20px;
	}
	
	#index .index_container{
		top: 0;
		bottom: 80px;
		left: 20px;
		right: 20px;
	}
	
	.content_header_gap{
		height: 0px;
		border: 0;
	}
	
	.content_header_title{
		font-size: 35px;
		line-height: 35px;
		margin-top: 10px;
	}
	
	#section{
		padding: 20px;
		padding-top: 70px;
	}
	
	.header_small{
		border-bottom: 1px solid #000;
	}
	
	.section_content_item{
		border: 0;
		padding: 0 !important;
		width: 100%;
	}
	
	.section_content_line{
		border: 0;
	}
	
	.section_content_item_text{
		margin-left: 10px;
		font-size: 12px;
	}
	
	.unscroll_icon img{
		width: 40px;
	}
	
	.section_content_item_img{
		margin-top: 30px;
	}
	
	.section_content {
		margin-top: 10px;
	}
	
	.image_item_text{
		max-width: none;
		display: block;
	}
	
	.image_item_text .section_content_item_text{
		margin-left: 0;
		margin-top: 20px;
		
	}
	
	.slick-prev, .slick-next{
		transform: translate(0, -50%) scaleX(1.5) scaleY(5);
		z-index: 200;
	}
	
	.carousel_slick{
		width: 80vw;
	}
	
	.carousel_item img{
		max-width: 80vw;
	}
	
	.close{
		width: 15px;
		height: 15px;
		right: 30px;
		top: 30px;
	}
	
	.slick-next{
		right: -30px;
	}
	
	.slick-prev{
		left: -30px;
	}
	
	#carousel .image_title{
		width: 70vw;
		bottom: -70px;
		height: auto;
	}
	
	.image_title_person{
		bottom: 7vh !important;
	}
	
	.image_item_container {
		max-width: 30vw;
	}
	
}