@charset "utf-8";
/* CSS Document */

@font-face {
  font-family: 'box-text';
  src: url("../../fonts/Inder.woff");
  font-display: swap;
}
@font-face {
  font-family: 'header-big';
  src: url('../../fonts/Magistral-Book.woff');
  font-display: swap;
}
@font-face {
  font-family: 'moreless';
  src: url('../../fonts/Dosis-Bold.woff');
  font-display: swap;
}
@font-face {
  font-family: 'parallax-text';
  src: url("../../fonts/Blinker.woff");
  font-display: swap;
}


html {
  height:100%;
}
body {
  height:100%;
	animation: fadeIn 1s;
}
@keyframes fadeIn{
	0% {opacity:0;background-color:#000;}
	90% {opacity:0;}
	100% {opacity:1;background-color:#fff;}
}

body,  p, h1, h2, h3, img {
	margin:0; padding: 0;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
}
a {
	text-decoration:none;
}
* {
  box-sizing: border-box;
}
iframe {
	border: none; overflow: hidden;
	outline: none;
}
.hidden-br {
	display:none;
}

/* LNG CHOICE MENU --START-- */
.pill-nav {
  position:relative; display:flex; 
  flex-wrap: nowrap; flex-direction:row; justify-content:center;
  margin:15px 6px 0px;
}
.pill-nav a {
	display:inline-block; width:225px;
  padding: 6px 0px 0px; margin:10px 10px;
  font-family: 'header-big';text-align: center;
	font-weight:bold; font-size: 13pt; letter-spacing: 1px;
	text-decoration: none; text-transform: uppercase; 
  border-radius: 8px;
}
.pill-nav-lng {
  font-size: 19pt; letter-spacing: 2px;
}
.pill-nav #learn-language {
	background-color: white; color: gray;
  border:solid medium gray;
}
.pill-nav #learn-language:hover {
  background-color: grey; color: white;
  border:solid medium gray;
}
.pill-nav #learn-german {
	background-color: white; color: green;
  border:solid medium green;
}
.pill-nav #learn-german:hover {
  background-color: green; color: white;
  border:solid medium green;
}
.pill-nav #learn-english {
	background-color: white; color: red;
  border:solid medium red;
}
.pill-nav #learn-english:hover {
  background-color: red; color: white;
  border:solid medium red;
}
.pill-nav .active-nav-language {
  background-color: grey!important; color: white!important;
  border:solid medium grey!important;
}
.pill-nav .active-nav-german {
  background-color: green!important; color: white!important;
  border:solid medium green!important;
}
.pill-nav .active-nav-english {
  background-color: red!important; color: white!important;
  border:solid medium red!important;
}
.pill-nav .flag {
	width:35%;
}
/* LNG CHOICE MENU --END-- */


/* HEADER LNG --START-- */
.header-lng {
	display:flex; flex-direction: row; flex-wrap:nowrap; 
	justify-content: center; align-content: center; align-items: center;
	position: relative; width:175px;
	margin: 0px 25px 5px auto!important;
	z-index:100;
}
.header-lng a {
	height:35px; width: 80px; display: inline-block;
	font-size: 12pt; line-height: 2; font-family: "Verdana", "sans-serif";
	font-weight: bold; text-align: center;
  color: black; text-decoration: none;
  margin: 0px auto 0px auto!important; padding:auto 4px;
  border-radius: 8px; border:solid 2px black;
}.header-lng a:first-child {
	margin-left:0px!important;
}.header-lng a:last-child {
	margin-right:0px!important;
}
.header-lng a.active-btn {
  background-color: black; color: white;
}
.header-lng a:hover {
  background-color: black; color: white;
}
/* HEADER LNG --END-- */

#main-div {
	position: relative!important; display:block;
	background-color: white;
	margin-top:95px!important; margin-bottom:20px;
	padding:0px 25px;
	z-index: 99;
}

#header-4 {
  color:black;
	font-size: 26pt; font-family: 'header-big';
  letter-spacing: 0.5px; line-height: 1.20;
  text-transform: uppercase; text-align: center;
	margin:120px auto 0px;
}
#header-A {
  color:black;
	font-size: 26pt; font-family: 'header-big';
  letter-spacing: 0.5px; line-height: 1.25;
  text-transform: uppercase; text-align: center;
	margin:20px auto 0px;
}


/* OVERLAY QR --START-- */
.overlay {
  position: fixed;
  height: 0%; width: 100%;
  top: 0; left: 0;
  z-index: 200000!important;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
  overflow-y: hidden;
  transition: 0.5s;
}
.overlay-content {
  position: relative; width: 100%;
  top: 10%;
  text-align: center;
  margin-top: 25px;
}
.overlay a {
  display: block;
  padding: 8px;
  font-size: 30pt; text-decoration: none;
  color: white;
  transition: 0.3s;
}
.overlay a:hover, .overlay a:focus {
  color: #f1f1f1;
}
.closebtn {
  position: absolute;
  top: 20px; right: 45px;
  padding: 0px;
  font-size: 42pt!important; font-weight:bold;
  border:10px solid transparent!important;
  background-clip:padding-box!important;
}
#qr_wechat {
  width:45%;
  padding:3px;
}
#qr_qq {
  width:25%;
  padding:0px;
}
/* OVERLAY QR --END-- */


/* FOOTER --START-- */
.footer-div {
  position:relative; 
	display:inline-block; width:100%;
  background-color: white;
	border-top: solid 5px black; border-right: solid 2px black;
	border-top-right-radius: 30px;
}
.footer-line1 {
  display:flex; flex-direction:row; flex-wrap:wrap;
  align-items:center; justify-content: center;
  list-style-type: none;
  margin: 12px 0px 5px; padding:2px;
}
.footer-line1 li {
  margin:0px 20px;
	cursor:pointer;
 }
.footer-line1 .contact_img {
  width:130%;
}
.footer-line1 .contact_img:hover {
  transition: ease-in 0.2s;
  transform:scale(1.20);
  -webkit-transform:scale(1.20);
  -moz-transform:scale(1.20);
  -ms-transform:scale(1.20);
}
.footer-line2 {
  display:flex; flex-direction:row; flex-wrap:wrap;
  align-items:center; justify-content: center;
  list-style-type: none;
  margin:0px; padding:2px;
}
.footer-line2 li {
  margin:0px 30px;
	cursor:pointer;
 }
.footer-div li a {
  text-decoration: none;
  color:black;
}
.footer-text1 {
  font-size: 9pt; line-height: 10pt;
  text-align: right; vertical-align: middle;
}
.footer-text2 {
  font-family: 'box-text'!important;
  font-size: 9pt; line-height: 10pt;
  text-align: left; vertical-align: middle;
  margin-left:auto; margin-right: auto;
}
.footer-line2 a#beian:hover {
  text-decoration: none;
  background:#DDDDDD;
}
.footer-line2 a#icp:hover {
  text-decoration: none;
  background:#DDDDDD;
}
#icp-n {
  border-left: solid thin black;
  padding-left:7px;
}
#beian-n {
  border-right: solid thin black;
  padding-right:7px;
}
#police_logo {
  display:inline-block; width: 7%;
  margin:0px 0px 3px 2px;
  vertical-align: middle;
}
/* FOOTER --END-- */




@media screen and (max-width : 1100px ){
.header-lng {
	text-align: center;
	margin: 0px auto 10px auto!important;
}
}



@media screen and (max-width : 850px ){
/* PILL NAVIGATION MENU --START-- */
.pill-nav a {
	width:200px;
	margin:10px 6px; padding: 2px 0px;
}

#header-A {
	font-size: 23.5pt;
  letter-spacing: 0.5px; line-height: 1.25;
  margin:15px auto 10px;
}

/* PAGE MAIN STRUCTURE --START-- */
#main-div {
	background-color: white;
	min-width:300px;
}


/* OVERLAY QR --START-- */
#qr_wechat {
  width:65%;
}
#qr_qq {
  width:45%;
  padding:5px;
}
/* OVERLAY QR --END-- */


/* FOOTER --START-- */
.footer-div {
  position:relative;
  width:100%;
  background-color: white;
  border-top: solid 5px black;
}
.footer-line1 {
  display:flex;
  flex-direction:row; flex-wrap:wrap;
  align-items:center; justify-content: center;
  list-style-type: none;
  padding:1px; margin-top:4px; margin-bottom:4px;
}
.footer-line1 li {
  margin-top:1px; margin-bottom:0px;
  margin-left:15px; margin-right:15px;
 }
 .footer-line1 .contact_img {
  width:120%;
}
.footer-line2 {
  display:flex;
  flex-direction:row; flex-wrap:wrap;
  align-items:center; justify-content: center;
  list-style-type: none;
  padding:2px; margin-top:4px; margin-bottom:4px;
}
.footer-line2 li {
  margin:3px 12px 0px 12px;
}
.footer-text1 {
  font-size: 9pt; text-align: center;
}
.footer-text2 {
  font-size: 8pt; line-height: 10pt; text-align: center;
}
/* FOOTER --END-- */
}


@media screen and (max-width: 690px ){

.hidden-br {
	display:inline-block;
}


/* LNG CHOICE MENU --START-- */
.pill-nav {
  flex-direction:column;
}
.pill-nav a {
  display:inline; width:250px;
	font-size: 14pt; letter-spacing: 1px; 
	padding: 6px 5px 0px!important; margin: 8px auto;
}
.pill-nav-lng {
  display:inline;
  font-size: 14pt; font-weight: bold; letter-spacing: 1.8px;
}
.pill-nav .removable-br {
  display:none;
}
/* LNG CHOICE MENU --END-- */


.pill-nav-header {
  display: none;
}

#header-4 {
  font-size: 23pt; letter-spacing: 0.25px; line-height: 1.1;
  margin:15px auto 20px; text-align: center;
}
#header-A {
  font-size: 22pt!important; letter-spacing: 0.25px; line-height: 1.1;
  margin:15px auto 20px;
}

#main-div {
	flex:100%;
	padding:0px 2px;
}


/* OVERLAY QR --START-- */
#qr_wechat {
  width:85%;
}
#qr_qq {
  width:45%;
  padding:3px;
}
/* OVERLAY QR --END-- */


/* FOOTER --START-- */
.footer-div {
 bottom:0;
}
.footer-line1 {
  padding:2px; margin-top:6px; margin-bottom:0px;
}
.footer-line1 li {
  margin:0px 12px;
}
.footer-line1 .contact_img {
  width:115%;
}
.footer-line2 {
  padding:0px 2px; margin-top:4px; margin-bottom:2px;
}
.footer-line2 li {
  margin-top:0px; margin-bottom:0px;
  margin-left:10px; margin-right:10px;
}
.footer-text2 {
  font-size: 8pt; line-height: 10pt;
  text-align: center;
}
/* FOOTER --END-- */

}

@media screen and (max-width: 450px) {
.overlay {
  overflow-y: auto;
}
.overlay a {
  font-size: 16pt;
}
.closebtn {
  top: 15px; right: 15px;
}
.footer-line1 {
  margin-top:1px; margin-bottom:0px; padding:2px;
}
.footer-line1 li {
	margin: 0px 10px;
 }
.footer-line1 .contact_img {
  width:120%;
}
.footer-line2 {
  margin-top:1px; margin-bottom:0px; padding:0px 2px;
}
.footer-line2 li {
  margin: 0px 10px;
}
}

@media screen and (max-width: 365px) {

#header-4 {
  font-size: 19pt; letter-spacing: 0px; line-height: 1.1;
  margin:15px auto 5px;
}
#header-A {
  font-size: 19pt; letter-spacing: 0px; line-height: 1.1;
  margin:10px auto 15px;
}
.footer-line1 .contact_img {
  width:100%!important;
}
.footer-line2 li {
  margin: 0px 8px!important;
}
}



@media screen and (max-height: 450px) {
.overlay {overflow-y: auto;}
.overlay a {font-size: 20px}
.overlay .closebtn {
  font-size: 30px;
  top: 15px;
  right: 35px;
}
}