﻿/* Baan Arun "baan arun"

Datum: 30. Januar 2015
Autor: Baan Arun
Datei: styles.css */

/* =============================================================================

Farbschema:
bordeaux: rgb(128,42,42)  #802A2A
bordeaux hell: rgb(153,83,78)  #99534E
bordeaux pastell: rgb(192,149,149)  #C099595
grÃ¼n: rgb(8,74,49)  #084A31
beige: rgb(247,237,218)  #F7EDDA
pastellblau: rgb(232,236,248)  #E8ECF8

============================================================================= */

/* Schriften:
FlieÃŸtext: Istok Web (Google Fonts)
Headlines: Gentium Basic (Google Fonts)
Logo: Paytone One (Google Fonts)

============================================================================= */


/* Allgemeine Styles: */

* { padding: 0; margin: 0; }

html { overflow: scroll; }

h2, p, ul, ol blockquote { margin-bottom: 0.5em; }

ul ul, ul ol, ol ol, ol ul { margin-bottom: 0; }


body {
  color: black;
  background-color: rgb(247,237,218);
  font-family: "Istok Web", Arial, Helvetica, sans-serif;
  font-size: 62,5%;
  line-height: 1.5;
}

.textbold {
  font-size: 1.1em; 
  font-weight: 700;
  color: rgb(128,42,42);
  margin-top: 1.5em;
  margin-bottom: -0.2em;
}

h2 {
}

h4 {
  font-size: 1.2em;
  margin: 0.3em 0;
}

h5 {
  font-size: 1em;
  margin: 0.2em 0;
  line-height: 1.1;
}

.clearing {
	clear: both;
}

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	font-size: 0;
	height: 0;
	visibility: hidden;
}

/* Patch fÃ¼r IE7 */
*:first-child-html .clearfix { min-height: 0; }

/* Styles header-Bereich */

header {
  position: relative;
  background: url("pics/bgHeader.gif") top left repeat-x;
  width: 100%;
  height: 160px;
  margin: 0;
  padding: 0;
  display: table;
}

a.toggle-nav {
  display: none;
}

/* Styles fÃ¼r main */

main {
  -ms-box-sizing: border-box;
  -mz-box-sizing: border-box;
  box-sizing: border-box;
  display: table;
  position: relative;
  border: 2px solid rgb(128,42,42);
  margin: 0 auto;
  margin-top: 20px;
  width: 75%;
  height: 100%;
  min-width: 730px;
  max-width: 110em;
}

div#logo {
  position: absolute;
  background-color: rgb(128,42,42);
  top: -160px;
  left: 24px;
  width: 19%;
  height: 164px;
  padding: 0 20px;
  box-shadow: 0px 3px 10px black;
  z-index: 1000;
}

div#logo.thai {
  position: absolute;
  background-color: rgb(128,42,42);
  top: -160px;
  left: 24px;
  width: 19%;
  height: 164px;
  padding: 0 20px;
  box-shadow: 0px 3px 10px black;
  z-index: 1000;
}

div#logo h1 {
  font-weight: 700;
  font-size: 2.4em;
  color: white;
  padding-top: 20px;
  text-align: center;
  line-height: 1.1em;
}

div#logo h2 {
  font-weight: 700;
  font-size: 1.5em;
  color: white;
  text-align: center;
  line-height: 1.1em;
}  

div#main_inner {
  -ms-box-sizing: border-box;
  -mz-box-sizing: border-box;
  box-sizing: border-box;
  display: table;
  width: 100%;
  background-color: rgb(128,42,42);
  border: 2px solid rgb(247,237,218);
  background: -moz-linear-gradient(top,rgba(128,42,42,1),rgba(153,83,78,1));
  background: -webkit-linear-gradient(top,rgba(128,42,42,1),rgb(153,83,78,1));
  background: linear-gradient(top,rgba(128,42,42,1),rgba(153,83,78,1));
  margin: 0;
}

div#main_inhalt {
  -ms-box-sizing: border-box;
  -mz-box-sizing: border-box;
  box-sizing: border-box;
  float: right;
  background-color: rgb(247,237,218);
  margin-top: 20px;
  margin-right: 20px;
  padding: 2px;
  width: 70%;
}

div#main_text {
  -ms-box-sizing: border-box;
  -mz-box-sizing: border-box;
  box-sizing: border-box;
  display: table;
  border: 2px solid rgb(128,42,42);
  padding: 20px;
  width: 100%;
}

div#main_text p, ul {
  font-size: 1em;
  line-height: 1.5;
  color: black;
}

div#main_text ul {
  list-style-type: none;
  margin: 0;
  margin-bottom: 0.5em;
  padding: 0;
}

div#main_text ul li {
  margin: 0;
  margin-bottom: 0.25em;
  padding: 0;
}

div#main_text ul.links {
  list-style-type: disc;
  margin-left: 1em;
}

div#galerie {
  float: left;
  width: 44%;
  margin-right: 20px;
  margin-bottom: 20px;
}

div#galerie img {
  margin-right: 10px;
  margin-bottom: 11px;
  border: 1px solid rgb(8,74,49);
  border-radius: 5px;
  box-shadow: 2px 2px 4px black;
  max-width: 100%;
}

div#main_text h1 {
  font-family: "Gentium Book Basic", "Times New Roman", Times, serif;
  font-weight: 700;
  font-style: italic;
  font-size: 1.7em;
  color: rgb(128,42,42);
  line-height: 1.1;
  margin-bottom: 0.5em;
}

div#main_text h1 span {
  font-weight: 400;
}

div#main_text h3 {
  font-family: "Gentium Book Basic", "Times New Roman", Times, serif;
  font-weight: 700;
  font-style: italic;
  font-size: 1.3em;
  color: rgb(128,42,42);
  line-height: 1.1;
  margin-bottom: 0.5em;
  margin-top: -0.5em;
  }

.adresse {
  font-family: "Gentium Book Basic", Times, "Times New Roman", serif;
  font-weight: 700;
  font-style: italic;
  font-size: 1.6em;
  color: rgb(128,42,42);
  margin-top: 0;
  margin-bottom: 0;
}

.textbold {
  font-weight: 700;
  color: black;
}


.fussnote {
  font-size: 0.7em;
  margin-top: 2em;
}


.texthinterlegt {
  font-size: 1em;
  font-weight: bold;
  margin-top: 2em;
  color: white;
  background: rgb(153,83,78);
  padding: 0.3em;
  border: 1px solid rgb(128,42,42);
  box-shadow: 2px 2px 4px black;
}

.agbs p, .agbs ul {
  font-size: 0.8em;
  line-height: 1.4;
}

.agbs p span {
  font-weight: bold;
}


/* Styles fÃ¼r Tabelle "Preise" */

table {
  width: 100%;
  box-shadow: 2px 2px 4px black;
  text-align: center;
  font-family: "Istok Web", Arial, Helvetica, sans-serif;
  font-size: 1em;
  border: 1px solid black;
  border-collapse: collapse;
  margin-top: 1em;
  margin-bottom: 2em;
}

thead {
  display: table-header-group;
}

tr {
  display: table-row;
  padding-bottom: 0;
  width: 100%;
}

th, td {
  padding: 0.5em 0.4em;
  float: none;
  display: table-cell;
  border: 1px solid black;
}

th {
  color: white;
  background: rgb(192,149,149);
  font-weight: 400;
}

th:first-child {
  text-align: left;
}

.tab_fett {
  text-align: left;
  font-weight: 700;
  background: rgb(153,83,78);
  color: white;
}

.tab_left {
  text-align: left;
}

.tab_absatzfett {
  font-weight: bold;
  margin-top: -0.5em;
  margin-bottom: 1em;
}

/*Styles fÃ¼r Formular Buchung */

form {
  font-size: 1em;
}

label {
  width: 6em;
  display: inline-block;
}

input, textarea, select {
  width: 30em;
  padding: 0.3em;
  margin-bottom: 0.5em;
}

input#plz {
  width: 4em;
}

input#ort {
  width: 19.7em;
}

label.rechts {
  width: 4em;
  text-align: right;
}

fieldset {
  -webkit-box-shadow: inset 2px 2px 2px rgb(247,237,218);
  -moz-box-shadow: inset 2px 2px 2px rgb(247,237,218);
  box-shadow: inset 2px 2px 2px rgb(247,237,218);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 1.3em; 
  margin-top: 1em;
}

legend {
  background: white;
  padding: 0.3em 1em;
  border: 1px solid lightgray;
  -webkit-box-shadow: inset 1px 1px 3px rgba(0,0,0,0.1);
  -moz-box-shadow: inset 1px 1px 3px rgba(0,0,0,0.1);
  box-shadow: inset 1px 1px 3px rgba(0,0,0,0.1);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

select {
  width: 30.7em; 
}

input[type="submit"], input[type="reset"] {
  width: 10em;
  padding: 0.7em;
  margin-top: 1em;
  color: white;
  font-weight: 700;
  background: rgb(128,42,42);
  border: 1px solid grey;
  -webkit-box-shadow: inset 2px 2px 2px rgba(0,0,0,0.2);
  -moz-box-shadow: inset 2px 2px 2px rgba(0,0,0,0.2);
  box-shadow: inset 2px 2px 2px rgba(0,0,0,0.2);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  cursor:pointer;
}

input[type="submit"] {
  margin-left: 1.3em;
  margin-right: 1em;
}

input[type="submit"]:hover, input[type="reset"]:hover {
  background: rgb(8,74,49);
  cursor: pointer;
}



/* Styles fÃ¼r nav */

nav {
  position: absolute;
	width: 23%;
	background-color: rgb(128,42,42);
	text-align: center;
	margin: 24px 20px 0 24px;
	padding: 0;
	box-shadow: 0px 3px 10px black;
	z-index: 999;
}

nav ul {
	list-style: none;
	margin-bottom: 15px;
	margin-left: 0;
	border-top: 1px solid rgb(247,237,218);
}

nav ul li a {
	font-family: "Gentium Book Basic", "Times New Roman", Times, serif;
	font-size: 1em;
	font-weight: 700; 
	color: rgb(247,237,218);
	text-decoration: none;
	display: block;
	width: 100%;
	height: 22px;
	border-bottom: 1px solid rgb(247,237,218);
	padding: 5px 0;
}

nav ul li a:hover {
	/*background: url(../images/bgNaviMain.gif) left top repeat-x;*/
	background-color: rgb(247,237,218);
	color: rgb(128,42,42);
}

nav ul li a.active {
	/*background: url(../images/bgNaviMain.gif) left -1px repeat-x;*/
	background: rgb(247,237,218);
	color: rgb(128,42,42);
}

nav ul li ul {
	background: rgb(192,149,149);
	border-bottom: 1px solid rgb(247,237,218);
	width: 100%;
	padding: 3px 0;
	margin: 0;
}

nav ul li:hover ul {
  left: auto;
  position: relative;
}

nav ul li ul li a {
	font-family: "Istok Web", Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-weight: 400;
	height: 20px;
	border: 0;
	padding: 0;
	margin: 3px 0;
	color: rgb(128,42,42);
}

nav ul li ul li a:hover {
	/*background: url(../images/bgNaviMain.gif) left -1px repeat-x;*/
	background: rgb(247,237,218);
}

.nav_o_link:hover {
  cursor: default;
  background: rgb(128,42,42);
  color: rgb(247,237,218);
}

/* Styles fÃ¼r footer */

footer {
  position: relative;
  clear: both;
	width: 100%;
	padding-top: 20px;
	margin-top: 50px;
	border-top: 1px solid #802a2a;
}

footer p.fliesstext {
  font-size: 1em;
}

footer a {
	text-decoration: none;
	color: rgb(128,42,42);
	font-weight: 400;
	font-size: 0.9em;
}

footer div.icons {
	float: left;
}

footer img {
	margin-right: 10px;
}

p.imp {
	float: right;
}

p.adr_footer {
  font-family: "Istok Web", Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 1em;
}




