body {
	margin: 0;
	font-family: 'Montserrat', sans-serif;
	scroll-behavior: smooth;
}

a, a:visited {
	color: #1C5A7C;
}

.lang {
	display: inline-block;
	position: absolute;
	z-index: 3;
	float: right;
	margin-top: 35px;
	right: 3%;
}

.lang a {
	color: #ffff;
}

.bg-lang,
.en-lang {
	color: #ffff;
	text-decoration: none;
	cursor: pointer;
	border: 1px solid #fff;
	border-radius: 50%;
	padding: 8.5px 7px 8.5px 7px;
}

.bg-lang:hover,
.en-lang:hover {
	color: #000;
	background: #fff;
}

.bg-lang {
	margin-right: 5px;
}

.en-lang {
	margin-left: 5px;
}

.active {
	border-radius: 100%;
    padding-top: 13px;
    padding-bottom: 13px;
    padding-left: 5.2px;
    padding-right: 5px;
    border: 1px solid #868686;
    text-align: center;
}

.active1 {
	border-radius: 100%;
    padding-top: 13px;
    padding-bottom: 13px;
    padding-left: 5.2px;
    padding-right: 5px;
    border: 1px solid #fff;
    text-align: center;
}

.screens {
	margin: 0;
	padding: 0;
}

.iframe-link {
	text-decoration: none;
}

.screen1 {
	width: 100%;
	position: relative;
	overflow: hidden;
}

.screen1 #background {
	display: block;
	margin: 0 auto;
	width: 100%;
}

.screen1 h1 {
	text-transform: none;
}

.right .welcome {
	font-size: 32px;
	margin-top: 2.5%;
	margin-bottom: 3%;
	color: #fff;
}

.right .btn-360 {
	display: block;
	margin: 0 auto;
	color: #000;
	text-decoration: none;
	background: #fff;
	width: 40%;
	text-align: center;
	padding-top: 0.5%;
	padding-bottom: 0.5%;
	font-size: 20px;
	border-radius: 43px;
	background-image: linear-gradient(0deg, #aceaf8 0%, #ffffff 100%);
	box-shadow: 0px 0px 53px 7px rgb(37, 61, 95);
}

.right .btn-360:hover {
	background-image: linear-gradient(0deg, #90d4ee 0%, #ffffff 100%);
}

.right {
	display: block;
	margin: 0 auto;
	text-align: center;
	float: right;
	position: absolute;
	left: 10.5%;
	right: 0%;
	top: 67%;
	z-index: 1;
}

.right h2 {
	text-transform: uppercase;
	color: #fff;
	font-size: 32px;
	font-weight: 300;
	margin-top: 7%;
	text-align: right;
}

.icon {
	vertical-align: middle;
}

.screen2 {
	width: 100%;
	min-height: 640px;	
	position: relative;
}

.nav {
	width: 10%;
	height: 100%;
	position: fixed;
	z-index: 2;
	float: left;
	border-right: 1px solid #D6D6D6;
	padding-top: 33px;
}
	

.logo {
	display: block;
	margin: 0 auto;
}

.nav-list {
	display: block;
	margin: 0 auto;
	width: 50%;
	height: 100%;
	color: #868686;
	top: 15%;
	-ms-transform: translateY(15%);
	transform: translateY(15%);
}

.nav-list a {
	display: block;
	margin: 0 auto;
	width: 25px;
	text-align: center;
	position: relative;
	z-index: 10;
	color: #868686;
	text-decoration: none;
	cursor: pointer;
	margin-bottom: 25px;
}

.active1,
.active2,
.active3,
.active4,
.active5 {
	display: none;
	border-radius: 100%;
	padding-top: 13px;
	padding-bottom: 13px;
	padding-left: 5.2px;
	padding-right: 5px;
	border: 1px solid #868686;
	text-align: center;
}

.active1 {
	border: 1px solid #fff;
}


.point {
	display: block;
	margin: 0 auto;
	height: 8px;
	width: 8px;
	background-color: #fff;
	border-radius: 50%;
}

.dot {
	display: block;
	margin: 0 auto;
	height: 8px;
	width: 8px;
	background-color: #868686;
	border-radius: 50%;
}

.nav-list a:hover {
	color: #000;
}

.nav-list .white {
	color: #fff;
}

.screen2 {
	width: 100%;
	height: 100%;
	position: relative;
	overflow-y: auto;
	overflow-x: hidden;
	background: #EDEDED;
}

.screen2 h2, .screen4 h2 {
	font-size: 29px;
    color: #000000;
    font-weight: 300;
    text-transform: uppercase;
    line-height: 30px;    
}

p.text {
	width: 90%;
	line-height: 23px;
	font-size: 20px;
	margin: 5% 0;
}

.list-video {
	width: 100%;
	position: relative;
	overflow: 
}

.iframe-box {
	display: block;
	width: 90%;
	position: relative;
	float: right;
	right: -4.7%;
}

.video-box {
	display: inline-block;
	width: 43%;
	position: relative;
}

.video-box .img-video {
	width: 100%;
}

.video-box .title {
	font-size: 22px;
}

.videos #video-1,
.videos #video-3 {
	margin-right: 8%;
}

.iframe-box .text-iframe {
	width: 90%;
	line-height: 23px;
	font-size: 20px;
}

.iframe-box .title-iframe {
	width: 90%;
	margin-top: 5%;
	line-height: 26px;
	text-transform: none;
}

.iframe {
	width: 90%;
	height: 60vh;
	margin-bottom: 5%;
	border: none;
	box-shadow: 0 0 98px rgba(0, 0, 0, 0.11);
}

.video-box {
	padding-bottom: 50px;
}

.video-box .title { 
	width: 90%;
}

.video-box video {
	width: 75%;
	height: auto;
	/*margin: 0 auto 0 7.5%;*/
	margin: 1% 0 0 0;
	border: none;
	box-shadow: 0 0 98px rgba(0, 0, 0, 0.11);
	position: static;
}

.people {
	box-sizing: border-box;
	position: relative;
	overflow: hidden;
	padding-left: 15%;
	padding-bottom: 12%;
}

.thumbnail .caption {
	margin-left: 5%;
}

h1 {
	font-size: 29px;
	color: #000000;
	font-weight: 300;
	text-transform: uppercase;
	margin-top: 5%;
	margin-bottom: 5%;
	line-height: 30px;
}

.thumbnail .caption h3 {
	font-size: 16px;
	line-height: 23px;
	font-weight: 400;
}

.thumbnail .caption p {
	font-size: 13px;
	font-weight: 300;
	line-height: 23px;
}

.thumbnail {
	display: inline-block;
	width: 28%;
	margin-right: 4.7%;
	box-shadow: 0 0 98px rgba(0, 0, 0, 0.11);
}

.thumbnail .img {
	width: 100%;
}

.thumbnail .caption h3 {
	height: 50px;
}

.thumbnail .caption .text {
	height: 150px;
}

.btn {
	width: 100%;
	cursor: pointer;
}

.arrow-right {
	width: 12%;
	display: inline-block;
	vertical-align: middle;
	margin-right: 5%;
}

.btn a {
	text-decoration: none;
	color: #000;
}

.bg {
	width: 100%;
	height: 40%;
	position: absolute;
	background-image: linear-gradient(180deg, #b4b4b459 59%, rgba(180, 180, 180, 0) 100%);
	z-index: 1;
}

.icons {
	display: block;
	width: 100%;
	position: relative;
	overflow: hidden;
	z-index: 1;
	margin-top: 65%;
}

.ic {
	width: 76px;
	float: right;
}

.icons .sound {
	width: 76px;
	height: 76px;
	border-radius: 100px;
	margin-bottom: 25%;
	background: #fff;
	cursor: pointer;
}

.icons #sound {
	display: none;
}

.icons #mute {
	display: block;
}

.icons .sound .snd {
	display: block;
	margin: 0 auto;
	padding-top: 18px;
}

.icons .arr {
	display: block;
	margin: 0 auto;
	width: 36px;
	height: 36px;
	cursor: pointer;
}

.icons .arrow-down {
	width: 100%;
}

.pop {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000000bf;
	z-index: 4;
	overflow: auto;
}

.pop-box {
	display: block;
	margin: 0 auto;
	width: 50%;
	position: relative;
	z-index: 3;
	box-sizing: border-box;
	position: relative;
	background: #fff;
	cursor: pointer;
	padding-bottom: 3%;
	height: 100%;
	overflow: auto;
}

.pop-box img {
	width: 100%;
}

.pop-box .h3 {
	display: block;
	margin: 0 auto;
	width: 90%;
	margin-top: 3%;
	height: 100%;
	font-size: 17px;
}

.pop-box .text-popUp {
	display: block;
	margin: 0 auto;
	width: 90%;
	font-size: 15px;
}

.pop-box .pop_img {
	width: 100%;
}

.screen3 {
	width: 100%;
	height: 100%;
	position: relative;
	overflow-y: auto;
	overflow-x: hidden;
	background: #fff;
}

.screen4 {
	width: 100%;
	height: 100vh;
	min-height: 940px;	
	position: relative;
	overflow-y: auto;
	overflow-x: hidden;
	background: #EDEDED;
}

.videos {
	box-sizing: border-box;
	position: relative;
	overflow: hidden;
	padding-left: 15%;
	padding-top: 2%;
}

.videos .video-box {
	background: transparent;
	box-shadow: none;
	cursor: pointer;
}

.videos .pop-box, .videos .pop_video {
	overflow: hidden;
}

.playBtn {
	display: block;
	margin: 0 auto;
	width: 10%;
	position: absolute;
	margin-left: 45%;
	margin-top: 20%;
	z-index: 3;
}

.videos .video-box .caption {
	margin-top: -2%;
}

.videos .video-box .caption .h3-s {
	color: #000;
	display: block;
	height: 50px;
	width: 100%;
	font-size: 18px;
}

.videos .video-box .caption {
	width: 100%;
	margin-left: 0;
	box-sizing: border-box;
	overflow: hidden;
}

.nav3 {
	border-right: 1px solid #BABABA;
}

.video_pop {
	width: 100%;
	position: absolute;
}

.pop-box-video {
	width: 100% !important;
	background: transparent;
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: auto;
	text-align: center;
}

.video-wrapper {
  position: relative;
}

.video-wrapper object,
.video-wrapper embed,
.video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.video-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
}


.cancel {
	width: 5%;
	border: none;
	float: right;
	position: relative;
	z-index: 2;
	background: transparent;
	left: 10%;
	margin-top: -3%;
	cursor: pointer;
}

.cancel:focus {
	outline: none;
}

.cancelBtn {
	width: 100%;
}

.more_info {
	display: block;
	margin: 0 auto;
	width: 35%;
	padding-top: 1.5%;
	padding-bottom: 1.5%;
	border: none;
	border-radius: 100px;
	background: #2A2A2A;
	color: #fff;
	text-align: center;
	text-decoration: none;
	margin-bottom: 10%;
	cursor: pointer;
	font-size: 15px;
	padding-left: 2.5%;
	padding-right: 2.5%;
	margin-left: 35.5%;
	font-size: 20px;
}

.more_info:focus {
	outline: none;
}

.screen4 .video-box {
	padding-bottom: 1%;
}

.screen4 .video-3,
.screen4 .video-4 {
	padding-bottom: 0;
}



@media only screen and (max-width: 319px) {
	.screen1,
	.screen2,
	.screen3,
	.screen4 {
		height: 100%;
	}

	.bg-lang,
	.en-lang {
		padding: 6.5px 5px 6.5px 5px;
		font-size: 11px;
	}
	
	.videos .video-box .caption .h3-s {
		font-size: 16px;
		height: 100%;
	}

	.video-box {
		display: block;
		width: 94%;
	}

	.screen1{
		height: 100%;
	}

	.iframe {
		height: 35vh;
	}

	.more_info {
		width: 65%;
		font-size: 16px;
	}
	.iframe-box .text-iframe {
		font-size: 14px;
	}
	.right {
		top: 69%;
	}
	.right .welcome {
		font-size: 11px;
		margin-top: 0;
		margin-bottom: 0;
	}
	.right .btn-360 {
		width: 45%;
		margin-top: 2.5%;
		font-size: 9px;
	}
	.icon {
		width: 12%;
	}
	.nav-list {
		display: none;
	}
	.pop-box-video {
		width: 90%;
	}

	.playBtn {
		display: block;
	    margin: 0 auto;
	    width: 10%;
	    position: absolute;
	    margin-left: 47%;
	    margin-top: 20%;
	}

	.pop-box {
		width: 70%;
		height: 100%;
	}

	.pop-box .h3 {
		display: block;
		margin: 0 auto;
		width: 90%;
		height: 100%;
		margin-top: 3%;
		font-size: 14px;
	}
	.pop-box .text-popUp {
		display: block;
		margin: 0 auto;
		width: 90%;
		font-size: 10px;
	}

	.nav-list {
		font-size: 35px;
		top: 40%;
		-ms-transform: translateY(40%);
		transform: translateY(40%);
	}
	.first {
		top: 8%;
		-ms-transform: translateY(8%);
		transform: translateY(8%);
	}
	.right h2 {
		font-size: 16px;
		margin-top: 0;
	}
	.timer {
		display: block;
		float: inherit;
	}
	#timer {
		display: block;
		float: none;
	}
	#timer span {
		font-size: 16px;
		margin: 0 3px 0 26px;
	}
	#timer span:first-child {
		margin: 16px;
	}
	.text-timer {
		display: block;
		float: inherit;
	}
	.text-timer span {
		font-size: 10px;
		margin-right: 6px;
	}
	.icons {
		margin-top: 25%;
	}
	.ic {
		width: 100%;
		margin-top: 7%;
	}
	.icons .sound {
		display: inline-block;
		width: 10%;
		height: auto;
		margin-bottom: 0;
		float: right;
	}
	.icons .sound .snd {
		width: 40%;
		padding-top: 33%;
		padding-bottom: 33%;
	}
	.icons .arr {
		display: inline-block;
		width: 10%;
		float: right;
		margin-right: 10%;
	}

	.logo {
		width: 100%;
	}

	h1 {
		font-size: 20px;
	}
	.thumbnail {
		width: 94%;
		margin-bottom: 10%;
	}
	.thumbnail:last-child {
		margin-bottom: 0;
	}
}

@media only screen and (min-width: 320px) and (max-width: 450px) {
	.screen1,
	.screen2,
	.screen3,
	.screen4 {
		height: 100%;
	}

	.videos .video-box .caption .h3-s {
		font-size: 17px;
		height: 100%;
	}

	.video-box {
		display: block;
		width: 94%;
	}

	.iframe {
		height: 40vh;
	}

	.more_info {
		width: 65%;
		margin-left: 23%;
		font-size: 15px;
	}
	.iframe-box .text-iframe {
		font-size: 14px;
	}
	.right {
		top: 68.5%;
	}
	.right .welcome {
		font-size: 12px;
		margin-top: 0;
		margin-bottom: 0;
	}
	.right .btn-360 {
		width: 45%;
		margin-top: 1%;
		font-size: 10px;
	}
	.icon {
		width: 12%;
	}
	.nav-list {
		
		display: none;
	}
	.pop-box-video {
		width: 90%;
	}

	.playBtn {
		display: block;
	    margin: 0 auto;
	    width: 10%;
	    position: absolute;
	    margin-left: 47%;
	    margin-top: 20%;
	}

	.pop-box {
		width: 70%;
		height: 100%;
	}

	.pop-box .h3 {
		display: block;
		margin: 0 auto;
		width: 90%;
		height: 100%;
		margin-top: 3%;
		font-size: 14px;
	}

	.pop-box .text-popUp {
		display: block;
		margin: 0 auto;
		width: 90%;
		font-size: 10px;
	}

	.nav-list {
		font-size: 35px;
		top: 40%;
		-ms-transform: translateY(40%);
		transform: translateY(40%);
	}
	.first {
		top: 8%;
		-ms-transform: translateY(8%);
		transform: translateY(8%);
	}
	.right h2 {
		font-size: 16px;
		margin-top: 0;
	}
	.timer {
		display: block;
		float: inherit;
	}
	#timer {
		display: block;
		float: none;
	}
	#timer span {
		font-size: 16px;
		margin: 0 3px 0 26px;
	}
	#timer span:first-child {
		margin: 16px;
	}
	.text-timer {
		display: block;
		float: inherit;
	}
	.text-timer span {
		font-size: 10px;
		margin-right: 6px;
	}
	.icons {
		margin-top: 25%;
	}
	.ic {
		width: 100%;
		margin-top: 7%;
	}
	.icons .sound {
		display: inline-block;
		width: 10%;
		height: auto;
		margin-bottom: 0;
		float: right;
	}
	.icons .sound .snd {
		width: 40%;
		padding-top: 33%;
		padding-bottom: 33%;
	}
	.icons .arr {
		display: inline-block;
		width: 10%;
		float: right;
		margin-right: 10%;
	}
	.logo {
		width: 100%;
	}
	h1 {
		font-size: 20px;
	}
	.thumbnail {
		width: 94%;
		margin-bottom: 10%;
	}
	.thumbnail:last-child {
		margin-bottom: 0;
	}
}

@media only screen and (min-width: 451px) and (max-width: 680px) {
	.screen1,
	.screen2,
	.screen3,
	.screen4 {
		height: 100%;
		
	} 

	.video-box {
		display: block;
		width: 94%;
	} 

	.videos .video-box .caption .h3-s {
		font-size: 18px;
		height: 100%;
	}

	.iframe {
		height: 45vh;
	}

	.more_info {
		width: 65%;
		margin-left: 23%;
		font-size: 16px;
	}
	.iframe-box .text-iframe {
		font-size: 16px;
	}
	.right {
		top: 70%;
	}
	.right .welcome {
		font-size: 16px;
		margin-top: 0;
		margin-bottom: 0;
	}
	.right .btn-360 {
		width: 50%;
		margin-top: 3%;
		font-size: 12px;
	}
	.icon {
		width: 12%;
	}
	.nav-list {
		display: none;
	}
	.pop-box-video {
		width: 80%;
		height: auto!important;
	}
	.cancel {
		width: 7%;
	}
	.playBtn {
		display: block;
	    margin: 0 auto;
	    width: 10%;
	    position: absolute;
	    margin-left: 47%;
	    margin-top: 20%;
	}

	.pop-box {
		width: 80%;
	}

	.pop-box .h3 {
		display: block;
		margin: 0 auto;
		width: 90%;
		margin-top: 3%;
		font-size: 14px;
	}

	.pop-box .text-popUp {
		display: block;
		margin: 0 auto;
		width: 90%;
		font-size: 10px;
	}

	.nav-list {
		font-size: 50px;
		top: 35%;
		-ms-transform: translateY(35%);
		transform: translateY(35%);
	}

	.first {
		top: 10%;
		-ms-transform: translateY(10%);
		transform: translateY(10%);
	}

	.right h2 {
		font-size: 20px;
		margin-top: 0;
	}

	.timer {
		display: block;
		float: inherit;
	}

	#timer {
		display: block;
		float: none;
	}

	#timer span {
		font-size: 25px;
		margin: 0 3px 0 26px;
	}

	.text-timer {
		display: block;
		float: inherit;
	}

	.text-timer span {
		font-size: 13px;
		margin-right: 6px;
	}

	.icons {
		margin-top: 30%;
	}

	.ic {
		width: 100%;
		margin-top: 4%;
	}

	.icons .sound {
		display: inline-block;
		width: 15%;
		height: auto;
		margin-bottom: 0;
		float: right;
	}

	.icons .sound .snd {
		width: 40%;
		padding-top: 33%;
		padding-bottom: 33%;
	}

	.icons .arr {
		display: inline-block;
		width: 15%;
		float: right;
		margin-right: 10%;
	}

	.thumbnail .caption {
		margin-left: 2%;
		margin-right: 1%;
	}

	.logo {
		width: 100%;
	}

	h1 {
		font-size: 20px;
	}
	.thumbnail {
		width: 94%;
		margin-bottom: 10%;
	}
	.thumbnail:last-child {
		margin-bottom: 0;
	}
	.thumbnail .caption .text {
		height: 85px;
	}
	.thumbnail .caption>h3 {
		height: 25px;
	}
}

@media only screen and (min-width: 651px) and (max-width: 800px) {
	.videos .video-box .caption .h3-s {
		font-size: 17px;
	}

	.nav-list {
		top: 10%;
	    -ms-transform: translateY(10%);
	    transform: translateY(10%);
	}	

	.more_info {
		width: 60%;
		margin-left: 23%;
		font-size: 18px;
	}
	.iframe-box .text-iframe {
		font-size: 17px;
	}
	.right {
		top: 70%;
	}
	.right .welcome {
		font-size: 20px;
		margin-top: 0;
		margin-bottom: 0;
	}
	.right .btn-360 {
		width: 55%;
		margin-top: 3%;
		font-size: 16px;
	}
	.icon {
		width: 14%;
	}
	.pop-box {
		width: 50%;
	}
	.pop-box .h3 {
		display: block;
		margin: 0 auto;
		width: 90%;
		margin-top: 3%;
		font-size: 14px;
	}
	.pop-box .text-popUp {
		display: block;
		margin: 0 auto;
		width: 90%;
		font-size: 10px;
	}
	.icons {
		margin-top: 30%;
	}
	.thumbnail .caption {
		margin-left: 0;
	}
	.thumbnail .caption>h3 {
		height: 70px;
		text-align: center;
	}
	.thumbnail .caption .text {
		height: 190px;
		text-align: center;
	}
	.btn {
		text-align: center;
	}
	
	.video-box video {
		width: 90%;
	}
}

@media only screen and (min-width: 801px) and (max-width: 950px) {

	.iframe-box .text-iframe {
		font-size: 17px;
	}

	.right {
		top: 65%;
	}
	.right .welcome {
		font-size: 25px;
		margin-bottom: 2.5%;
	}
	.right .btn-360 {
		width: 50%;
		font-size: 16px;
	}
	.pop-box {
		width: 50%;
	}
	.pop-box .h3 {
		display: block;
		margin: 0 auto;
		width: 90%;
		margin-top: 3%;
		font-size: 14px;
	}
	.pop-box .text-popUp {
		display: block;
		margin: 0 auto;
		width: 90%;
		font-size: 10px;
	}
	.icons {
		margin-top: 40%;
	}
	.thumbnail .caption {
		margin-left: 4%;
	}
	.thumbnail .caption>h3 {
		height: 60px;
	}
	.thumbnail .caption .text {
		height: 150px;
	}
}

@media only screen and (min-width: 951px) and (max-width: 1100px) {	
	.iframe-box .text-iframe{
		font-size: 18px;
	}

	.right .welcome {
		font-size: 27px;
		margin-bottom: 3.5%;
	}

	.pop-box {
		width: 50%;
	}

	.pop-box .h3 {
		display: block;
		margin: 0 auto;
		width: 90%;
		margin-top: 3%;
		font-size: 14px;
	}
	.pop-box .text-popUp {
		display: block;
		margin: 0 auto;
		width: 90%;
		font-size: 10px;
	}
	.icons {
		margin-top: 50%;
	}
	.thumbnail .caption {
		margin-left: 5%;
	}
	.thumbnail .caption>h3 {
		height: 50px;
	}
	.thumbnail .caption .text {
		height: 150px;
	}
}

@media only screen and (min-width: 1101px) and (max-width: 1200px) {
	.iframe-box .text-iframe {
		font-size: 18px;
	}

	.pop-box {
		width: 50%;
	}

	.pop-box .h3 {
		display: block;
		margin: 0 auto;
		width: 90%;
		margin-top: 3%;
		font-size: 14px;
	}
	.pop-box .text-popUp {
		display: block;
		margin: 0 auto;
		width: 90%;
		font-size: 10px;
	}
	.icons {
		margin-top: 55%;
	}
	.thumbnail .caption {
		margin-left: 5%;
	}
	.thumbnail .caption>h3 {
		height: 50px;
	}
	.thumbnail .caption .text {
		height: 150px;
	}
}