/* --------------------------------
   css for andreas-wahler.com
   2008-04-02; v1
   joachim wahler
   -------------------------------- */

body{
   margin: 0;
   padding: 0;
   background-color: #B0B0B0;
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   font-size: 0.8em;
   line-height: 1.4em;
}

#mainwrapper{
   min-width: 910px;
   min-height:100%;
   background-color: #F1F1F1;

}


#header{
   padding: 10px 0 15px 30px;
   color: #333;
   background-color: #F1F1F1;
   margin-bottom:2px;
	height:78px;
}

#header h1{
   margin-top:14px;
   font-size: 1.8em;
   margin-bottom:0.2em;
}

.sub{
   font-size: 1.4em;
   display:block;
   padding-bottom: 3px;
}

#headnav, #footer1{
   background-color: #b3b3b3;
   background-image: url(../img/gen/nav_bg.jpg);
   background-repeat: repeat-y;
   background-position: right;
   padding: 0.2em 0 0.3em 0;
}

#footer1{
	height:23px;
   margin-top:2px;
}


#headnav ul{
   padding-left: 0;
   margin: 0;
   list-style: none;
}

#headnav ul li{
   display: inline;
   padding: 0 2.3em 0 0;
}

#headnav ul li a{
   color: #e6eaff;
   font-weight:bold;
}


#maincont{

   padding: 10px 0 0 0;
	background-color: #F8F8F8;
   margin:2px 0;

}

#maincont h3{
   margin-top: 0;
}

.lcont{
   float:left;
   width: 400px;
   min-height: 400px;
   margin-top: 10px;
}

.sleft{
   margin-left: 30px;
}

#index .lcont{
   float:left;
   width: 400px;
   margin-top:11px;
   min-height: 400px;
}

.rcont{
   float:left;
   width:450px;
   margin-top: 11px;
   margin-left: 25px;

}

#kontakt .rcont{

   float:left;
   width:460px;
   margin-top: 11px;
   margin-left: 25px;

}

#index .rcont{

   float:left;
   background-repeat: no-repeat;
   background-position: left top;
   width:480px;
   height: 510px;

   margin-left: 15px;
}

.cbox{
   background-color: #dfdfdf;
   height: 8.2em;
   margin-bottom: 6px;
   padding: 5px 5px 5px 0;
   background-image: url(../img/gen/bg_box.jpg);
   background-repeat: repeat-y;
   background-position: right;
   width:410px;
}


.cbox strong{
   font-size: 1.2em;
}

#index .inl{
   float:left;
   width: 200px;
   padding: 20px 15px 0 30px;
}

.inr{
   float:left;
   padding: 0 10px 0 0;
}


.cclear{
   clear:both;
}

#headnav, #footer1, #footer2{
   padding-left: 30px;
}

#footer2{
   padding: 0.4em 0 0.4em 30px;
   color: #333;
   background-color: #F1F1F1;
}

#footer1{
   padding-left:0;
}

#footer1 object{
   margin:0;
   padding:0;
}

a{
   text-decoration: none;
   color: #555;
}

a:hover{
   text-decoration: underline;
}

.lcont a, .rcont a{
   text-decoration: underline;
}

#header a{
   color: #333;
}

#all{
   position:absolute;
   padding: 0 6px 6px 6px;
   left:50%;
   margin-left: -470px;
   width: 930px;
   height:99%;
   background-image: url(../img/gen/mBg.png);
   background-position: bottom right;
   background-repeat: repeat-y;
}

a img{
   border:0;
}

.ltitle{
   font-weight:bold;
}

#headnav ul li a.alink {
   color: #333;
}


/* flash object*/

html object{
   width:880px;
   height:24px;
}

.headr{
   width: 360px;
   height: 67px;
   float:right;

}

.headl{
   float:left;
	padding-top:12px;
}

#header, #header a{
   color: #333;
}

#map{
   width: 504px;
   height: 380px;
}

.hint{
   display:block;
   margin-bottom:15px;
}

.valid{
   margin-top: 40px;
}


h3{
   font-size: 16px;
}


.shortlink {
   box-sizing: border-box;
   background-color: #dfdfdf;
}

.shortlink {
   margin-bottom: 15px;
}

.shortlink img {
   margin: 0;
   line-height: 0;
   vertical-align: top;
}

.shortlink a {
   text-decoration: none;
   display: block;
}

.shortlink h5 {
   font-size: 16px;
   margin: 0;
   line-height: 1.3;
}

.shortlink h5 + p {
   margin: 5px 0 0;
   font-size: 14px;
}

.shortlink__text {
   float: left;
   width: 255px;
   padding: 15px 10px 15px 30px;
}

.shortlink__image {
   float: right;
   width: 141px;
   margin: 15px 15px 15px 0;
}

.rcont--home {
   float: right !important;
   width: 440px !important;
   height: 614px !important;
   overflow: hidden;
}

.lcont--home {
   width: 470px !important;
}

.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
    *zoom: 1;
}

.cards {
   display: flex;
   justify-content: space-between;
   margin: 20px 30px;
   padding-bottom: 40px;
}

.card {
   background-color: #dfdfdf;
   flex: 1 1 30%;
   max-width: 275px;
   padding: 20px 20px 15px;
   box-sizing: border-box;
}

.card__image img {
   width: 100%;
}

.card__text h2 {
   line-height: 125%;
}

.card__text p {
  font-size: 16px;
   line-height: 125%;
}

.letter {
   margin: 0 30px 20px;
   padding-bottom: 20px;
   font-family: Arial, Helvetica, sans-serif;
}

.letter h1 {
   margin: 60px 0 40px 0;
   text-align: center;
   font-size: 28px;
   line-height: 26px;
}

.letter h2 {
   margin: 10px 0 10px 0;
   text-align: center;
   font-size: 28px;
   line-height: 26px;

}

.letter h3 {
   margin: 10px 0 10px 0;
   text-align: center;
   font-size: 22px;
   line-height: 26px;
}

.letter p {
  font-size: 18px;
   line-height: 26px;
}

.letter__image {
   float: left;
   padding: 7px 40px 10px 0;
}

.letter__image img {
   width: 275px;
}

.letter__content {
   margin-top: 40px;
}

#countdown {
   font-size: 50px;
   text-align: center;
   margin: 50px 0;
   color: #888;
}


.imgContainer {
   display: flex;
   margin: 24px 0;
   justify-content: space-between;
}

.imgContainer div {
   width: 420px;
}

.dl {
   margin: 60px 0 22px;
   font-size: 18px;
   line-height: 26px;
}

.dl a {
   font-size: 18px;
   line-height: 26px;
}
