@import "reset.css";

body 	{
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: .8em;
	background: #19010F url('../images/background.jpg') top center repeat-x;
	text-align: center;
	line-height: 1.7em;
	color: #fff;
  } 
p {
	margin: 0 0 10px 0;
	font-size: 1em;
	}
h1 {
  color: #FFCC2B;
  margin: 0 0 20px 0;
	font-size: 2em;
	font-weight: normal;
	}
h2 {
  color: #FFCC2B;
  margin: 0 0 20px 0;
	font-size: 1.5em;
	font-weight: normal;
	}
h3 {
  color: #FFF;
  margin: 0 0 15px 0;
	font-size: 1.3em;
	font-weight: bold;
	}
a {
	color: #b0719b;
	text-decoration: underline;
	}
a:hover {
	color: #b0719b;
	text-decoration: none;
	}
dt {
	font-weight: bold;
	padding-top:0.4em;
  }
dd {
  margin-left: 2em;
  }

/* LAYOUT
------------------------------*/

#all {
  z-index: 1;
  width: 960px;
  text-align: left;
  margin: 0 auto 0 auto;
  position: relative;
  }

/* LOGO
------------------------------*/

#head {
  width: 960px;
  height: 295px;
  overflow: hidden;
  position: relative;
	background: url('../images/header.jpg') no-repeat;
  }
#head h1 {
  display: block;
  position: absolute;
  top: 98px;
  left: 421px;
  width: 415px;
  height: 115px;
  font-size: 3em;
  line-height: 1em;
  color: #FFCC2B;
  text-align: center;
  padding-top: 60px;
	background: url('../images/andrew-companion.jpg') no-repeat;
  }
#head a {
  display: block;
  color: #FFCC2B;
  text-decoration: none;
  }
#head a:hover {
  color: #000;
  text-decoration: none;
  }
#head h1 a span {
  position: absolute;
  top: 0;
  left: 0;
  width: 415px;
  height: 175px;
  z-index: 3;
  cursor: pointer;
	background: url('../images/andrew-companion.jpg') no-repeat;
  }
#head h2 {
  display: block;
  position: absolute;
  top: 50px;
  left: 421px;
  width: 415px;
  height: 48px;
  font-size: 2em;
  line-height: 1em;
  color: #fff;
  text-align: center;
  }
#head h2 span {
  visibility: hidden;
  }

/* MENU
------------------------------*/
#menu {
  width: 960px;
  height: 123px;
  color: #FFCC2B;
  position: relative;
  z-index: 2;
	background: url('../images/menu.jpg') no-repeat;
}
#menu ul {
  width: 960px;
  height: 66px;
  position: absolute;
  top: 0;
  left: 0;
}
#menu ul li {
  display: block;
  position: absolute;
  height: 66px;
  text-align: center;
  top: 0;
  list-style-type: none;
  font-weight: bold;
  overflow: hidden;
  }
#menu ul li.m1 {
  width: 181px;
  left: 120px;
}
#menu ul li.m2 {
  width: 179px;
  left: 301px;
}
#menu ul li.m3 {
  width: 178px;
  left: 480px;
}
#menu ul li.m4 {
  width: 172px;
  left: 658px;
}
#menu ul li a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 46px;
  color: #FFCC2B;
  text-decoration: none;
  text-align: center;
  font-size: 1.3em;
  padding-top: 20px;
  }
#menu ul li a span {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 66px;
  z-index: 3;
  cursor: pointer;
  }
#menu ul li a:hover {
  color: #fff;
  text-decoration: underline;
}  

#menu ul.en li.m1 a span {
	background: url('../images/menu-welcome.jpg') no-repeat;
} 
#menu ul.en li.m2 a span {
	background: url('../images/menu-about-me.jpg') no-repeat;
} 
#menu ul.en li.m3 a span {
	background: url('../images/menu-details.jpg') no-repeat;
} 
#menu ul.en li.m4 a span {
	background: url('../images/menu-contact.jpg') no-repeat;
} 

#menu ul.de li.m1 a span {
	background: url('../images/menu-willkommen.jpg') no-repeat;
} 
#menu ul.de li.m2 a span {
	background: url('../images/menu-ueber-mich.jpg') no-repeat;
} 
#menu ul.de li.m3 a span {
	background: url('../images/menu-preistarif.jpg') no-repeat;
} 
#menu ul.de li.m4 a span {
	background: url('../images/menu-ansprache.jpg') no-repeat;
} 

#menu ul.it li.m1 a span {
	background: url('../images/menu-benvenuto.jpg') no-repeat;
} 
#menu ul.it li.m2 a span {
	background: url('../images/menu-di-me.jpg') no-repeat;
} 
#menu ul.it li.m3 a span {
	background: url('../images/menu-listino.jpg') no-repeat;
} 
#menu ul.it li.m4 a span {
	background: url('../images/menu-contatto.jpg') no-repeat;
} 

p.langs {
  position: absolute;
  top: 63px;
  left: 130px;
  color: #b0719b;
  font-size: 9pt;
  width: 300px;
}
p.links {
  position: absolute;
  top: 63px;
  left: 623px;
  text-align: right;
  width: 200px;
  color: #b0719b;
  font-size: 9pt;
  }
p.langs a,
p.links a {
  color: #b0719b;
  text-decoration: none;
  padding: 0 3px;
}
p.langs a:hover,
p.links a:hover {
  color: #b0719b;
  text-decoration: underline;
}
  
/* CONTENT
------------------------------*/

#content {
  width: 960px;
	position: relative;
  }
#content.normal {
	background: url('../images/content.jpg') no-repeat;
	height: 595px;
  }
#content.longer {
	background: url('../images/content2.jpg') no-repeat;
	height: 921px;
  }

.welcome {
  top: 0;
  left: 0;
  position: absolute;
  width: 370px;
	height: 470px;
  padding: 25px 480px 100px 110px;
	background: url('../images/img-welcome.jpg') 360px 0 no-repeat;
}  
.about-me {
  top: 0;
  left: 0;
  position: absolute;
  width: 720px;
	height: 606px;
  padding: 215px 130px 100px 110px;
}  
.details {
  top: 0;
  left: 0;
  position: absolute;
  width: 380px;
	height: 470px;
  padding: 25px 160px 100px 420px;
	background: url('../images/img-details.jpg') 61px 0 no-repeat;
}  
.contact {
  top: 0;
  left: 0;
  position: absolute;
  width: 330px;
	height: 470px;
  padding: 25px 500px 100px 130px;
  background: url('../images/img-contact.jpg') 499px 0 no-repeat;
} 
div.links {
  top: 0;
  left: 0;
  position: absolute;
  width: 760px;
	height: 796px;
  padding: 25px 10px 100px 130px;
}   
div.links2 {
  overflow-y: scroll;
	height: 760px;
	width: 700px;
}


  
/* FOOTER
------------------------------*/

#footer {
  font-size: 9pt;
  height: 90px;
  color: #3d112a;
  width: 960px;
  text-align: center;
}
#footer a {
  color: #3d112a;
  text-decoration: underline;
}
#footer a:hover {
  color: #fff;
  text-decoration: none;
}

/* CLASSES
------------------------------*/


.button-see-more-photos {
  display: block;
  position: absolute;
  text-align: center;
  font-weight: bold;
  overflow: hidden;
  width: 194px;
  height: 40px;
  top: 443px;
  left: 509px;
  padding-top: 5px;
}
.button-contact-me {
  display: block;
  position: absolute;
  text-align: center;
  font-weight: bold;
  overflow: hidden;
  width: 141px;
  height: 40px;
  top: 443px;
  left: 703px;
  padding-top: 5px;
}
.button-contact-me2 {
  display: block;
  position: absolute;
  text-align: center;
  font-weight: bold;
  overflow: hidden;
  width: 141px;
  height: 34px;
  top: 443px;
  left: 663px;
  padding-top: 5px;
}

.button-see-more-photos a,
.button-contact-me a,
.button-contact-me2 a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 50px;
}
.button-see-more-photos a span,
.button-contact-me a span,
.button-contact-me2 a span {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 50px;
  z-index: 3;
  cursor: pointer;
  }
.button-see-more-photos-en a span {
	background: url('../images/button-see-more-photos.jpg') no-repeat;
}
.button-see-more-photos-de a span {
	background: url('../images/button-ueber-mich.jpg') no-repeat;
}
.button-see-more-photos-it a span {
	background: url('../images/button-di-me.jpg') no-repeat;
}
.button-contact-me-en a span,
.button-contact-me2-en a span { 
	background: url('../images/button-contact-me.jpg') no-repeat;
}
.button-contact-me-de a span,
.button-contact-me2-de a span { 
	background: url('../images/button-ansprache.jpg') no-repeat;
}
.button-contact-me-it a span,
.button-contact-me2-it a span { 
	background: url('../images/button-contatto.jpg') no-repeat;
}



.clear {
  clear: both;
  height: 1px;
  overflow: hidden;
  }
table {
	width: 100%;
  }
table td {
	vertical-align: top;
  }
.form .input {
	padding: 4px 4px 3px 4px;
	font-size: 1.1em;
	width: 100%;
	font-weight: bold;
	background: #5a3f50;
	border: 1px solid #5a3f50;
	color: #fff;
  }
.form select {
	padding: 4px 4px 3px 4px;
	font-size: 1.1em;
	width: 100%;
	font-weight: bold;
	background: #5a3f50;
	border: 1px solid #5a3f50;
	color: #fff;
}
.form .input:focus,
.form textarea:focus,
.form select:focus {
	border: 1px solid #fff;
  }
.form textarea {
	margin: 0 0 5px 0;
	padding: 4px 4px 4px 4px;
	font-family: Arial;
	font-size: 1em;
	width: 100%;
	height: 100px;
	line-height: 1.5em;
	background: #5a3f50;
	border: 1px solid #49283c;
	color: #fff;
  }

  
.contact-text {
  font-weight: bold;
  font-size: 15pt;
  font-family: Georgia;
  text-align: center;
  padding-bottom: 25px;
  margin-bottom: 35px;
  border-bottom: 1px solid #5a3f50;
}
  
.table-contact {
  width: 330px
}
.table-about-me {
  margin-top: 10px;
}
.table-details {
  margin-top: 20px;
}
.td-left {
  padding: 6px 12px;
  background: #2b0f21;
}
.td-left2 {
  padding: 6px 12px;
  background: #290c1e;
}
.td-left4 {
  text-align: left;
  padding: 6px 0;
}

.td-right {
  padding: 6px 12px;
  background: #341629;
}
.td-left3 {
  padding: 6px 12px;
  background: #2b0f21;
}
.td-right3 {
  padding: 6px 12px;
  background: #341629;
}
.td-right4 {
  text-align: right;
  padding: 5px 0;
  width: 200px;
  padding-right: 10px;
}
.td-right5 {
  padding: 2px 0 0 0;
}

.slideshow {
  background: #311426;
  position: absolute;
  top: 10px;
  width: 720px;
	height: 180px;
  left: 110px;
  overflow: hidden;
}
.slideshow .back {
  width: 29px;
  height: 27px;
  overflow: hidden;
  position: absolute;
  top: 50px;
  left: 25px;
}
.slideshow .next {
  width: 29px;
  height: 27px;
  overflow: hidden;
  position: absolute;
  top: 50px;
  left: 660px;
}
.wrapper {
  width: 540px;
  height: 140px;
  overflow: hidden;
  position: absolute;
  left: 90px;
  top: 20px;
}
.jcarousel li {
  border-right: 10px solid #311426;
  height: 140px;
  width: 100px;
}

.form label.error { 
  float:left;
  display: block;
	position:relative;
  left:0px;
  top:0px;
	color:red;
	font-size:0.7em;
	font-weight:bold;
	text-align: left;
}
.form input.error { 
	border: 1px solid red;
}
.now {
  position: relative;
  top: -15px;
  font-weight: bold;
  color: red;
  font-size: 1.3em;
}