/* default.css 

 Cascaded stylesheet for the-guesthouse.ch
 
 Author and copyright: Joerg Hau <joerg.hau(at)the-guesthouse.ch>
 All rights reserved.
 
*/

body	{
	font-family: Helvetica,Geneva,Arial,sans-serif;
	font-style:normal;
	color: #111111;
	margin: 3em;
	}

h1,h2 {
	font-family: Palatino,serif;
	color: white;
	font-weight:bold;
	margin-top:1.1em;
	padding-top:0.4em;	
	padding-bottom:0.3em;
	}

h1 {
	border-bottom: solid 1px #d52b1e; 
	}

h1:before { content:url(./swissflag-20.png) " " ; }

h2	{
	background-color: #d52b1e;  
	background-color: rgba(213, 43, 30, .8);
	text-align:left;
    padding-left:10px;
	}

h3	{
  	padding-left:5px;
	border-top: solid 1px silver;
	border-left: solid 1px silver;
	background-color: #silver;  
	background-color: rgba(192,192,192,.5);
	text-align:left;
	margin-top:0em;
	padding-right:1em;	
	}
	
/* main stuff: indented */
.main {
	margin-left: 150px;
	margin-right: 150px;  
	}

/* anything that is fully on the left */
.left 	{
  	float:left;
  	clear:left;
	margin-right:1em;
	margin-left: -175px;
	}
	
/* The language "navigation" items */
.lang	{ 
	position:absolute; 
	top:3em; 
	right:3em; 
	}
 
.client  {
    /* border: solid gray 1px; */
    padding:0.5em;
    background-color:#e8e8e8;
 	}
 	 
/* style for quotes */<img src="de.png" alt="" /><img src="de.png" alt="" />
blockquote {
	/* border-left: 10px solid #ccc; */
	font-style:italic;
	font-size:100%;
	color:#555555;
	margin: 0.5em 10px;
  	padding: 0.5em 5px;
  	quotes: "\201C""\201D""\2018""\2019";
	width: 80%;
	}

blockquote:before {
  	color: #778899;
  	content: open-quote;
  	font-size: 3em;
  	line-height: 0.1em;
  	margin-right: 0.25em;
  	vertical-align: -0.4em;
 	}
 	
blockquote:after {
  	color: #778899;
  	content: close-quote;
  	font-size: 3em;
  	line-height: 0.2em;
  	vertical-align: -0.5em;
 	}

/* styles for forms */

fieldset {
  border:1px solid silver;
  }
label, input {
  display: inline-block;
  }
label {
  width:15%;
  text-align:right; 
  float:left;
  margin-right:0.5em;
  }
.label2 {
  margin-left:15%;
  width:70%;
  text-align:left; 
  }    
legend {
  padding: 0.1em 0.5em;
  margin:1em;
  border:1px solid silver;
  color:darkgray;
  font-size:85%;
  text-align:right;
  }


/* emphasis text color */
.cc {
	color:#d52b1e;
	font-weight:bold;
	}

/* red border left */	
.rbl {
	border-left: solid 1px #d52b1e;
	padding-left: 1em;
	}

/* begin CSS for definition list and bullet list */
dl,ul
	{
	margin: 1em 0;
	padding: 0;
	}
dt	/* definition title */
	{ 
	margin-left: 0;
	margin-top: 0.7em;
	margin-bottom: 0.3em;
	font-weight: bold; 
	}
dd	/* definition item */
	{
	border-left: 2px solid #f00000;
	width: 85%;
	margin: 0 0 0 3em;
	padding: 0 0 .5em .5em;
	}
li	/* list item, same style as dd  */
	{
	list-style-type: none;	/* hide bullet, replace by red bar */
	border-left: 2px solid #d52b1e;
	width: 85%;
	margin: 0 0 0 3em;
	padding: 0 0 .5em .5em;
	}
/* end CSS for definition list and bullet list */

tt,pre 	{
	font-family: monospace, helvetica-Narrow, arial-Narrow, courier-new, courier;
	color:#20b2aa;
	font-size:0.9em;
	}

.footer	{
	clear: both;	
	color: #333333;
	vertical-align: top;
	text-align:left;
	font-style:normal;
	font-size:0.8em;
	padding-top:3em;
	padding-bottom:1em;
	}

a.ext:before {
	content:url("./off.png");
	}

a.mail:before {
	content:url("./mail.png");
	}

.ext.before	{
	content:url("./off.png");
	}

.int:before	{
	content:url("./home.png"); 
	}

.pdf:before {
	content:url("./pdf.png");
	}

.reg:before {
	content:url("./register.png");
	}

img { 
	border: none; 
    max-width: 100%;
    height: auto;
    width: auto\9; /* ie8 */
	}

img.hdr {
	background-color: #ffffff;
	border:none;
	}
	
p.warn {
  	font-weight:bold;
   	color:#d52b1e;
    border: solid #d52b1e 1px;
    padding:0.5em;
  	}


a[href^="mailto"]:hover:after { content: " > " attr(title); }
.floatleft { float: left; text-align: left; }
.floatright { float: right; text-align: right; }

a:link 	{ color: blue; text-decoration:none }
a:visited { color: marine; text-decoration:none }
a:hover	{ color: #d52b1e; background-color:#dddddd; text-decoration:underline }

/* minimalist table style */
.minimal
	{
	font-size:0.90em;
	border-collapse:collapse;
	text-align:center;
	margin-top:1em;
	margin-bottom:2em;
	}
.minimal th
	{
	font-weight: bold;
	color: #555555;
	padding: 5px 4px;
	border-bottom: 2px solid silver;
	border-top: 2px solid silver;
	}
.minimal td
{
	border-bottom: 1px solid silver;
	color: #555555;
	padding: 3px 4px;
}
.minimal tbody tr:hover td
	{
	color: black;
	background-color:#eeeeee
	}
.td-left 
	{ 
	text-align:left; 
	}

/* credit: https://css-tricks.com/perfect-full-page-background-image/ */
img.bg {
  /* Set rules to fill background */
  min-height: 100%;
  min-width: 1024px;
	
  /* Set up proportionate scaling */
  width: 100%;
  height: auto;
	
  /* Set up positioning */
  position: fixed;
  top: 0;
  left: 0;
  
  opacity:0.45;
  z-index: -1;
}

@media screen and (max-width: 1024px) { /* Specific to this particular image */
  img.bg {
    left: 50%;
    margin-left: -512px;   /* 50% */
    z-index: -1;
  }
}