/*

@website: 	Shangrila-Travel Website
@version: 	2018-05-20
@author: 	Oliver Heim

*/

@charset "utf-8";

* {
	margin:0;
	padding:0;
}

html body {
	overflow-x:hidden;
}

html,body {
	-webkit-text-size-adjust:100%;
	-ms-text-size-adjust:100%;
	height:100%;
}

body {
	height:auto;
	background-color: #f6f0ce;
	background-image: url(../images/bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	background-attachment: fixed;
	font-family: Arial,Helvetica,sans-serif;
	border: 0;
	color: #000;
	font-size: 14px;
}

h1 {
	font-size: 25px;
	margin: 25px 0 3px 0;
	line-height: 28px;
}
h2 {
	font-size: 22px;
	margin: 22px 0 3px 0;
	line-height: 25px;
}
h3 {
	font-size: 19px;
	margin: 19px 0 3px 0;
	line-height: 22px;
}
h4 {
	font-size: 16px;
	margin: 16px 0 3px 0;
	line-height: 19px;
}

@media
only screen and (-webkit-min-device-pixel-ratio: 1.5),only screen and (-o-min-device-pixel-ratio: 32),only screen and (min--moz-device-pixel-ratio: 1.5),only screen and (min-device-pixel-ratio: 1.5) {
	
}

img {
	max-width:100%;
	border:0;
	height:auto;
	width:auto\9;
/* ie8 */
}

#wrapper {
	width:100%;
	max-width:1000px;
	margin:20px auto;
	padding:0;
	position:relative!important;
}

#map {
	display:none;
}

/* Header */
header {
	width:100%;
	height:auto;
	display:inline-block;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	position:relative!important;
}

#h_l {
	width:47%;
	height:auto;
	margin-top:10px;
	margin-left:3%;
	display:inline-block;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	float:left;
	position:relative!important;
}

#h_r {
	width: 42%;
	height: auto;
	font-size: 20px;
	font-weight: 700;
	margin-right: 3%;
	margin-top: 20px;
	text-align: left;
	display: inline-block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float: right;
	position: relative !important;
}

/* Inhalt */
#left {
	width:47%;
	height:auto;
	margin-left:3%;
	margin-top:70px;
	display:inline-block;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	float:left;
	position:relative!important;
}

#left a {
	text-decoration:underline;
	color:#000;
}

#left a:hover {
	text-decoration:none;
	color:#e23e34;
}

#left_txt {
	width: 100%;
	height: 330px;
	font-size:16px;
	font-weight:700;
	padding:25px;
	background:url(../images/txt_bg.png) repeat left top;
	display:inline-block;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	position:relative!important;
}

#fullwidth_txt {
	width: 100%;
	font-size:13px;
	padding:25px;
	background:url(../images/txt_bg.png) repeat left top;
	display:inline-block;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	position:relative!important;
	top: 30px;
}

#hdl {
	font-size:20px;
}

.symbol {
	width:35px;
	height:auto;
	padding-right:10px;
	display:inline-block;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	float:left;
	position:relative!important;
}

.detail {
	width:auto;
	height:auto;
	float:left;
	position:relative!important;
}

.left_abstand {
	width:100%;
	height:10px;
	clear:left;
	position:relative!important;
}

#left_ab_2 {
	width:100%;
	height:20px;
	clear:left;
	position:relative!important;
}

#right {
	width:42%;
	height:auto;
	margin-left:5%;
	margin-right:3%;
	margin-top:70px;
	display:inline-block;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	float:left;
	position:relative!important;
}

ul {
	margin-left: 12px;
}

iframe {
	width:100%;
	height:330px;
	border:none;
}

.right_abstand {
	width:100%;
	height:30px;
	clear:left;
	position:relative!important;
}

#movie {
	width:42%;
	height:auto;
	margin-left:55%;
	margin-right:3%;
	margin-bottom:30px;
	display:inline-block;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	position:relative!important;
}

video {
	width:100%;
	border:none;
}

@media (max-width:860px) {
	#h_r {
		font-size:17px;
		margin-top:15px;
	}
}

@media (max-width:630px) {
	#h_r {
		font-size:16px;
		margin-top:12px;
	}
}

@media (max-width:600px) {
	body {
		background-image: url(../images/bg_mobile.jpg);
		background-position: center 150px;
	}
	
	#wrapper {
		width:100%;
		margin:0;
		padding:0;
		position:relative!important;
	}
	
	#h_l {
		width:94%;
		height:auto;
		margin-left:3%;
		margin-right:3%;
		margin-top:15px;
		text-align:center;
	}
	
	#h_r {
		width:97%;
		font-size:17px;
		margin-left:3%;
		margin-right:0;
		margin-top:5px;
		margin-bottom:10px;
		text-align:left;
	}
	
	#left {
		width: 100%;
		margin: 20px 0;
	}
	
	#left a:hover {
		text-decoration:underline;
		color:#000;
	}
	
	#left_txt {
		width:100%;
		font-size:15px;
	}
	
	#hdl {
		font-size:17px;
		font-weight:700;
	}
	
	.detail {
		width:auto;
		height:auto;
		float:left;
		position:relative!important;
	}
	
	#right {
		width:100%;
		height:auto;
		margin: 20px 0;
	}
	
	.right_abstand {
		height:0px;
	}
	
	#movie {
		width:100%;
		height:auto;
		margin-left:0;
		margin-right:0;
		margin-bottom:10px;
	}
	
	video {
		border-top:2px solid #000;
		border-bottom:2px solid #000;
		border-left:0;
		border-right:0;
	}
}