html,
body {
  width: 100%;
  height: 100vh;
}

body {
  font-family: 'Muli', 'Helvetica', 'Arial', 'sans-serif';
  position: relative;
  width: 100%;
  color: white;
  background: url("/_inc/img/bg-pattern.png"), #c4c0b5;
  background: url("/_inc/img/bg-pattern.png"), -webkit-gradient(linear, right top, left top, from(#c4c0b5), to(#b89f80));
  background: url("/_inc/img/bg-pattern.png"), linear-gradient(to left, #c4c0b5, #b89f80);
}

.header {
	height:20vh;
}
.header h1 {
	margin-top:2vh;
	text-align:center;
}

@media (max-width: 992px) { 
	h1 {
		font-size:12px;
	}
}

.content, #admin_content {
	height:80vh;
}


#buttonbereich button {
	margin-top:2vh;
	width:100%;
	border:0.2vh solid white;
	border-radius:1vh;
	padding:1vh;
}

.right {
	text-align:right;
}
.float_right {
	float:right;
}

.center {
	text-align:center;
}

.logo {
	max-height:16vh;
	margin:2vh;
	max-width:100%;
}

.start {
	float:left;
	background-color:#353535;
	border:1vh solid white;
	border-radius:2vh;
	font-size:10vh;
	line-height:12vh;
	padding:5vh 5vw;
	height:68vh;
	max-width:45%;
}

#restart {
	display:block;
	background-color:#353535;
	border:0.2vh solid white;
	border-radius:1vh;
	font-size:2vh;
	line-height:3vh;
	padding:1vh;
	margin-top:2vh;
	width:100%;
}

#videobereich {
	position:relative;
	margin-left:auto;
	margin-right:auto;
	max-width:90vw;
	color:white;
}        

#videobereich a {
	color:white;
}

#videobereich a:hover, #restart:hover {
	color:white;
	text-decoration:none;
}
.camera {
	position:relative;
}
.videoplayer {
	background-color:#353535;
	border:1vh solid white;
	border-radius:2vh;
	height:70vh;
	width:105vh;

}
.video_weiter, .video_neu, .fruehstueckswahl{
	position:absolute;
	bottom:2vh;
	left:50%;
	width:30vh;
	background-color:#353535;
	border:0.2vh solid white;
	border-radius:2vh;
	padding:2vh;
	color:white;
	font-size:2vh;
}
.video_weiter {
	background-color:#28a745;
}
.video_neu, .fruehstueck_nein{
		left:auto;
		right:50%;
}
.fruehstueck_nein {
	background-color:red;
}
.fruehstueck_ja {
	background-color:green;
}
#startbutton {
	position:absolute;
	bottom:2vh;
	left:50%;
	border:0.2vh solid white;
	border-radius:2vh;
	padding:2vh;
	color:white;
	font-size:2vh;
}
.kontrollfoto {
	max-height: 60vh;
/*	transform: rotate(180deg);*/
	
}
#photo {
	display:none;
}

video {
	max-height: 60vh;
}

#admin_modal .modal-dialog {
	min-width:70%;
}
.modal {
	color:black;
}
#tuercode_container {
	font-size: 4em;
	color:blue;
	font-weight:bold;
}
#tuercode_timer {
	font-size:1.5em;
	color:red;
	font-weight:bold;
}
#zimmernummer_container {
	font-size: 4em;
	color:green;
	font-weight:bold;
}

.buchung_new {
	z-index:2000;
}

#schnappschuss, .output {
	display:none;
}

.btn_flag {
	max-height:3vh;
	margin-right:1vh;
}

.start_flag {
	max-height:10vh;
	display:block;
	margin-left: auto;
	margin-right: auto;
}

.frage_an_gast {
	margin-bottom:20vh;
}