html, body{height: 100%; margin: 0; min-width: 1200px; padding: 0; font-family: Arial,sans-serif; font-size: 14px; color: #1b1b1b;}

input, select, button{font-size: 12px;}
.ui-widget{font-size: 12px !important;}
p{margin: 0 0 15px 0;}
th{text-align: left;}

h1, h2, h3{margin-top: 0;}

a{color: #0072c6; text-decoration: none;}
#content a:hover{text-decoration: underline;}
a.button:hover{text-decoration: none !important;}

.infoMessage, #infoMessage, .red{color: red !important;}
.grey{color: #8d8d8d;}
.hidden{display: none;}

#dialog{display: none;}

#breadcrumb{height: 30px; padding: 0 20px; line-height: 30px; background-color: #e1e1e1; border-bottom: 1px solid #ccc;}
#breadcrumbSearch{display: inline-block; float: right;}
#breadcrumbSearch input, #breadcrumbSearch select{width:100px;}

#content{padding: 20px;}
	
.dialog form span{width: 80px; display: inline-block;}
.dialog form .dateinput{width: 90px;}
.dialog input[type="submit"]{float: right;}
.dialog textarea{width: 300px; height: 60px;}

.contentContainer {
	margin: 20px auto;
	background-color: rgba(255, 255, 255, 0.85);
	box-shadow: 0 2px 6px rgba(0, 0, 0, .2);
	-webkit-background-clip: padding;
	-moz-background-clip: padding;     
	background-clip: padding-box;
	border: 10px solid rgba(0, 114, 198, 0.5);
	outline: none;
}	

/* settings */
#css{height: 190px;}

/* stars */
span.stars, span.stars span {display: inline-block; background: url(../images/stars.png) 0 -16px repeat-x; width: 80px;height: 16px;}
span.stars span {background-position: 0 0;}

/* guest list */
#dataTable_length select{width: 70px;} 

/* forms */
input[type="text"], input[type="password"],  select{width: 230px;}
#date{width: 90px;}
#time{width: 90px;}
#count{width: 90px;}
textarea{width: 400px; height: 60px; font-family: Arial,sans-serif; font-size: 12px; color: #1b1b1b; vertical-align: top;}

/* reservation form */
#reservationForm form p > span{display: inline-block; width: 90px;}
#reservationForm form p .small{display: inline-block; font-size: 11px; width: 500px; margin-left: 94px;}
#reservationForm .smallInfo{font-size: 11px; width: 200px;}
#reservationForm label{display: block; margin-bottom: 10px;}
#reservationForm #table{width: 350px;}
#reservationForm #smoke{position: absolute; margin: -1px 0 0 10px;}
#reservationForm span#noSMSCreditsInfo{margin-left: 94px; color: red; display: inline-block; font-size: 11px; width: 500px; !important}
#noSMSCreditsInfo a{color: red; text-decoration: underline;}

/* edit user form */
#oeffnungszeiten input[type="text"]{width: 60px;}
#disabledDaysTableCont{height: 120px; width: 250px; overflow-y: scroll;}	
#rightColumn{position: absolute; margin-left: 450px;}
.small{font-size: 12px; color: #727272;}

/* header and navigation */
#header{height: 60px; width: 100%; font-size: 14px; background-color: #f0f0f0; border-bottom: 1px solid #e1e1e1;}

	#logoIcon{position: absolute; margin: 5px 0 0 30px;}

	#loginInfo{display: inline-block; line-height: 60px; float: right; margin-right: 20px;}
	


/* dashboard left */
#dashboardLeft{width: 280px; position: absolute; padding-right: 10px; overflow-y: scroll;}
	#searchInput{margin: 0; margin: 0 0 5px 0; width: 200px;}
	#sortedBy{margin: 0 0 5px 0;}
	.searchBtn{width: 206px;}
	#refresh{position: absolute; margin: 2px 0 0 12px;}
	.greyHeadline{background-color: #f0f0f0; border-top: 1px solid #e1e1e1; font-weight: bold; padding: 3px 10px;}
	.eingang{}
	.inboxElement{cursor: pointer; font-size: 12px; display: block; text-decoration: none; padding: 10px 0 10px 10px; border-bottom: 1px solid #e1e1e1; color: #1b1b1b;}
		.inboxElement:hover:not(.activeInboxElement){background: #e6f2fa; text-decoration: none !important;}
		.activeInboxElement{background: #cde6f7;}
		#dashboardLeft .today{background: #e6f2fa;}
		
	#search{margin-bottom: 15px;}
	
/* dashboard right */
#dashboardRight{margin-left: 310px;}

	#dashboardRight .navigation{margin: 0 0 20px 0;}
		#openNewReservationForm{position: absolute;}

	#DateNavContainer{display: inline-block; margin-left: 300px;}
		#dateInfo{position: absolute; width: 200px; display: inline-block; margin: -17px 0 0 0; font-size: 12px;}
			#dateInfo .redcolor{color: red;}
			#currentDate input{font-weight: bold; font-size: 14px;}
			
		#navigationDateForm{display: inline-block;}
		.dateinput{width: 90px !important;}
	
	.tableColumn{width: 250px; margin-right: 20px; float: left;}
		.tableColumnHeadline{font-weight: bold; margin-bottom: 20px;}

	.tischElement{margin-bottom: 20px; padding: 10px 15px; border: 1px solid #e1e1e1;}
		#dashboardRight .green{background: #e0ffe2 url(../images/free.png) no-repeat center 50px;}
		#dashboardRight .red{background: #ffe0e0 url(../images/notfree.png) no-repeat center 50px;}
		#dashboardRight .yellow{background: #ffff7d url(../images/notfree.png) no-repeat center 50px;}
		.tischElement a.button{width: 100%;}
		
		.tischElement .reservations{margin-top: 85px;}
		.tischElement .reservations p{margin-bottom: 5px;}
			.tischElement .reservations .ui-button{text-align: left;}
			.tischElement a.active{border-color: red;}
			.openReservationForm .ui-button-text{font-size: 12px;}

/* fuer gastronomen */
.jms-slideshow h1{color: #0072c6; margin: 73px 0 20px 80px; font-size: 23px; font-weight: normal;}
.jms-slideshow h2{color: #0072c6; font-size: 23px; margin-top: 0; font-weight: normal;}
.jms-slideshow li{font-size: 18px; line-height: 28px;}
.jms-content{width: 800px; margin-top: -140px !important;}
.screenshot{position: absolute; margin: -100px 0 0 -50px;}
.screenshotDesc{position: absolute !important; margin: -130px 0 0 -50px !important; font-size: 18px !important; color: #0072c6 !important;}
.jms-content .ui-widget{font-weight: bold; font-size: 18px !important;}
.jms-content .next{margin-left: 280px;}

	
/* home */
#home{width: 840px; text-align: center; padding: 50px 0 0 0;}
#home select, #home input{font-size: 16px;}
#homeSearchBox{background-color: #e1e1e1; padding: 20px; margin: 30px;}
#home .searchFormBtn{font-size: 14px !important;}
#footer{font-size: 11px; padding: 0 20px 20px 20px;}

/* restaurants search */
#restaurantsContainer td{vertical-align: top;}
#restaurantsSearchBox{background-color: #f0f0f0; height: 40px; line-height: 40px; width: 50%; margin: 1px 0 4px 0; width: 100%; border-top: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1;}
#restaurantsSearchBox select, #restaurantsSearchBox input{font-size: 14px;}
#restaurantsSearchBox select{margin-left: 8px;}

/* restaurant detail */
#restaurantDetail{width: 1100px; padding: 20px; text-align: left;}
.restaurantImage{width: 515px;}
.restaurantDetailTable td{width: 50%; vertical-align: top;}
.detailForm{border: 1px solid red;}
.form{display: none; background: #fff; padding: 10px; border: 1px solid #ccc; margin-bottom: 20px;}
.bxslider div{margin-left: 60px;}
#speisenTable td{width: auto; padding-right: 20px;}
.ratingCont{display: none;}
.filesTable{width: 800px; background: #fff; border-collapse: collapse; margin-bottom: 20px;}
.filesTable th{border-bottom: 2px solid #ccc;}
.filesTable td{border-bottom: 1px solid #ccc;}
.box{background: #fff; padding: 20px; margin-bottom: 20px; border: 1px solid #ccc;}
.floatRight{float: right; width: 51%;}
.reducedWidth{width: 43%;}
.border{border: 1px solid #ccc;}
#werbeFlaeche{width: 557px; height: 840px; background: #fff url(../images/restaurantDetail/werbung.jpg) no-repeat 0 0;}
#werbeFlaeche div{position: absolute; margin: 490px 0 0 220px; }

/* navigation */
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #menu-button {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  line-height: 1;
  display: block;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#cssmenu:after,
#cssmenu > ul:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
#cssmenu #menu-button {
  display: none;
}
#cssmenu {
  width: auto;
  background: #0072c6;
  background: -moz-linear-gradient(top, #0072c6 0%, #1b8de0 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #0072c6), color-stop(100%, #1b8de0));
  background: -webkit-linear-gradient(top, #0072c6 0%, #1b8de0 100%);
  background: -o-linear-gradient(top, #0072c6 0%, #1b8de0 100%);
  background: -ms-linear-gradient(top, #0072c6 0%, #1b8de0 100%);
  background: linear-gradient(to bottom, #0072c6 0%, #1b8de0 100%);
}
#cssmenu > ul {
  box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.05);
}
#cssmenu.align-right > ul > li {
  float: right;
}
#cssmenu > ul > li {
  float: left;
  display: inline-block;
}
#cssmenu.align-center > ul {
  float: none;
  text-align: center;
}
#cssmenu.align-center > ul > li {
  float: none;
}
#cssmenu.align-center ul ul {
  text-align: left;
}
#cssmenu > ul > li > a {
  padding: 18px 18px 21px 18px;
  border-right: 1px solid rgba(80, 80, 80, 0.30);
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 1px;
}
#cssmenu > ul > li:hover > a,
#cssmenu > ul > li > a:hover,
#cssmenu > ul > li > a.active {
  color: #ffffff;
  background: #0072c6;
  background: rgba(0, 0, 0, 0.1);
}
#cssmenu > ul > li.has-sub > a {
  padding-right: 45px;
}
#cssmenu > ul > li.has-sub > a::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-top-color: #fff;
  right: 17px;
  top: 22px;
}
#cssmenu > ul > li.has-sub.active > a::after,
#cssmenu > ul > li.has-sub:hover > a {
  border-top-color: #ffffff;
}
#cssmenu ul ul {
  position: absolute;
  left: -9999px;
  top: 60px;
  padding-top: 6px;
  font-size: 13px;
  opacity: 0;
  -webkit-transition: top 0.2s ease, opacity 0.2s ease-in;
  -moz-transition: top 0.2s ease, opacity 0.2s ease-in;
  -ms-transition: top 0.2s ease, opacity 0.2s ease-in;
  -o-transition: top 0.2s ease, opacity 0.2s ease-in;
  transition: top 0.2s ease, opacity 0.2s ease-in;
}
#cssmenu.align-right ul ul {
  text-align: right;
}
#cssmenu > ul > li > ul::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-bottom-color: #ffffff;
  top: -4px;
  left: 20px;
}
#cssmenu.align-right > ul > li > ul::after {
  left: auto;
  right: 20px;
}
#cssmenu ul ul ul::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-right-color: #ffffff;
  top: 11px;
  left: -4px;
}
#cssmenu.align-right ul ul ul::after {
  border-right-color: transparent;
  border-left-color: #ffffff;
  left: auto;
  right: -4px;
}
#cssmenu > ul > li > ul {
  top: 120px;
}
#cssmenu > ul > li:hover > ul {
  top: 52px;
  left: 0;
  opacity: 1;
}
#cssmenu.align-right > ul > li:hover > ul {
  left: auto;
  right: 0;
}
#cssmenu ul ul ul {
  padding-top: 0;
  padding-left: 6px;
}
#cssmenu.align-right ul ul ul {
  padding-right: 6px;
}
#cssmenu ul ul > li:hover > ul {
  left: 180px;
  top: 0;
  opacity: 1;
}
#cssmenu.align-right ul ul > li:hover > ul {
  left: auto;
  right: 100%;
  opacity: 1;
}
#cssmenu ul ul li a {
  text-decoration: none;
  font-weight: 400;
  padding: 11px 25px;
  width: 180px;
  color: #777777;
  background: #ffffff;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1), 1px 1px 1px rgba(0, 0, 0, 0.1), -1px 1px 1px rgba(0, 0, 0, 0.1);
}
#cssmenu ul ul li:hover > a,
#cssmenu ul ul li.active > a {
  color: #333333;
}
#cssmenu ul ul li:first-child > a {
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
#cssmenu ul ul li:last-child > a {
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
}
#cssmenu > ul > li > ul::after {
  position: absolute;
  display: block;
}
#cssmenu ul ul li.has-sub > a::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border: 4px solid transparent;
  border-left-color: #777777;
  right: 17px;
  top: 14px;
}
#cssmenu.align-right ul ul li.has-sub > a::after {
  border-left-color: transparent;
  border-right-color: #777777;
  right: auto;
  left: 17px;
}
#cssmenu ul ul li.has-sub.active > a::after,
#cssmenu ul ul li.has-sub:hover > a::after {
  border-left-color: #333333;
}
#cssmenu.align-right ul ul li.has-sub.active > a::after,
#cssmenu.align-right ul ul li.has-sub:hover > a::after {
  border-right-color: #333333;
  border-left-color: transparent;
}
@media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
  #cssmenu {
    background: #0072c6;
  }
  #cssmenu > ul {
    display: none;
  }
  #cssmenu > ul.open {
    display: block;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
  }
  #cssmenu.align-right > ul {
    float: none;
  }
  #cssmenu.align-center > ul {
    text-align: left;
  }
  #cssmenu > ul > li,
  #cssmenu.align-right > ul > li {
    float: none;
    display: block;
  }
  #cssmenu > ul > li > a {
    padding: 18px 25px 18px 25px;
    border-right: 0;
  }
  #cssmenu > ul > li:hover > a,
  #cssmenu > ul > li.active > a {
    background: rgba(0, 0, 0, 0.1);
  }
  #cssmenu #menu-button {
    display: block;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    padding: 19px;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
  }
  #cssmenu ul ul,
  #cssmenu ul li:hover > ul,
  #cssmenu > ul > li > ul,
  #cssmenu ul ul ul,
  #cssmenu ul ul li:hover > ul,
  #cssmenu.align-right ul ul,
  #cssmenu.align-right ul li:hover > ul,
  #cssmenu.align-right > ul > li > ul,
  #cssmenu.align-right ul ul ul,
  #cssmenu.align-right ul ul li:hover > ul {
    left: 0;
    right: auto;
    top: auto;
    opacity: 1;
    width: 100%;
    padding: 0;
    position: relative;
    text-align: left;
  }
  #cssmenu ul ul li {
    width: 100%;
  }
  #cssmenu ul ul li a {
    width: 100%;
    box-shadow: none;
    padding-left: 35px;
  }
  #cssmenu ul ul ul li a {
    padding-left: 45px;
  }
  #cssmenu ul ul li:first-child > a,
  #cssmenu ul ul li:last-child > a {
    border-radius: 0;
  }
  #cssmenu #menu-button::after {
    display: block;
    content: '';
    position: absolute;
    height: 3px;
    width: 22px;
    border-top: 2px solid #fff;
    border-bottom: 2px solid #fff;
    right: 25px;
    top: 18px;
  }
  #cssmenu #menu-button::before {
    display: block;
    content: '';
    position: absolute;
    height: 3px;
    width: 22px;
    border-top: 2px solid #fff;
    right: 25px;
    top: 28px;
  }
  #cssmenu > ul > li.has-sub > a::after,
  #cssmenu ul ul li.has-sub > a::after {
    display: none;
  }
}