/* 
###########################################################################
Main styles for lese-fair.de 2013

FileName:   main.css
Author:		Barbara Völk, www.voelkwerbung.de
Version:    2013.04.04  
###########################################################################
*/


/***********************************************/
/* COLOURS */

/*
brown: #8A493A #8a493a  rgba(138,73,58,1)
green: #6AAB9E #6aab9e rgba(106,171,158,1)
green 30%: #D2E6E2 #d2e6e2 rgba(210,230,226,1)

grey: #D3D4D3 #d3d4d3  rgba(211,212,211,1)
voelk-grey:  #434d52 rgba(67,77,82,1) 
*/

/*
bg: #ffffff or offwhite #F4EFEA???
logo-blue: #A0B2E2 (or #879CC3 from pdf)
logo-grey: #4D4D4C

l-blue: #BDC6DB (50% logo-blue)

*/

/*
Type Druck: Myriad roman, condensed, bold 
font-family: Myriad, Frutiger, Helvetica, Arial, sans-serif;
*/

/***********************************************/


/***********************************************/
/* MAIN SETUP RESET */
/***********************************************/

html, body, div, a, p, img, ul, li, h1, h2, h3, h4, span, time, hr, hgroup, a img, footer, header, section, aside, nav, form, input, article, label, textarea, small {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
  	text-decoration:none;
}
footer, section, article, header, aside, nav { 
    display:block;
}
:focus {
    outline:none; 
}
::-moz-selection, ::selection { 
   color:#ffffff;
   background: #BDC6DB; /* logo-blue #879CC3;  l-blue: #BDC6DB */
}

h1, h2, h3, h4 {
    font-weight:normal;
}

ul {
    /*list-style:none; list-style-type: square;*/list-style-type: none;
}


/* Set up for stiles for links + hover effects for desktop + mobile (which don't use :hover) */
a:link {
	color: #8a493a;  /*#8a493a brown */
	color: #879CC3; /* logo-blue #879CC3;  l-blue: #BDC6DB */
	text-decoration: none;
}
a:visited {
	color: #8a493a;  /*#8a493a brown */
	color: #879CC3; /* logo-blue #879CC3;  */
	text-decoration: none;
}
a:hover, a:active, a:focus { 
	color: #8a493a;  /*#8a493a brown  or other color ????*/
	text-decoration: underline;
}
  
/********************************************************************/
/* MAIN SETUP BASIC ELEMENTS */
/********************************************************************/

html {
   height:101%; /* make scrollbar visible all the time */
   border-top:solid 2px #4D4D4C;/*border-bottom:solid 2px #4D4D4C;*/
   background: url("../images/bg.png") center top repeat-y;
}
   
body {
   font-size:20px; font-size: 12px; font-size: 0.750rem;
   color:#434d52;
   /*font-family: Frutiger, Helvetica, Arial, sans-serif;
   font-family:MinionPro, Georgia, Times new roman, serif;*/
   font-family: Myriad, Frutiger, Helvetica, Arial, sans-serif;
   font-weight:lighter;
   -webkit-text-size-adjust:100%;
   line-height:1.3em; 
   background: url("../images/bg.png") left top no-repeat fixed;background: url("../images/bg.png") center top no-repeat fixed; background: #ffffff url("../images/bg.png") center top repeat-y;
   /*border-bottom:solid 8px #4D4D4C;*/
}


/********************************************************************/
/* MAIN WRAPPERS + MAIN LAYOUT ELEMENT + TAG SELECTORS */
/********************************************************************/

.innerWrap {
  width:96%;
  max-width:1200px;max-width:1000px;
  margin:0 auto; background: transparent;
}

.innerWrapOverflow {
  width:96%;
  max-width:1200px;
  margin:0 auto;
  overflow:auto;
}
   

/***********************************************/
/* HEADER */
/***********************************************/

.topWrap {
    width:100%;
    padding: 14px 0;/*background: url("../images/bg.png") left top no-repeat; *//*overflow:auto; height: auto;*/
} 
	
#outerWrap {
    width:100%;
    padding:145px 0;
	background: url("../images/bg.png") left top no-repeat;background: url("../images/bg.png") left top repeat-y;
} 

.topWrap h1 {
  width:100%;
  text-align:center;
  font-family: Myriad, Frutiger, Helvetica, Arial, sans-serif;
  font-size:2.2em;
  line-height:1em;
  letter-spacing:1px;margin-top:40px;
}
  
h1 span {
    margin:0 0 0 0px;color: #ffffff;
}
h1 img {
    margin:0 0 0 0px;width: 356px; height: 134px;background: url("../images/logo.png") left top no-repeat;/**//*width: 458px; height: 143px;*/
}

header a, .subnav a, .subnav p a:hover, .subMenu a, article a:hover, footer a {
  color:#4D4D4C; /* logo-grey #4D4D4C */
}
header a:hover, .subnav a:hover, article a, .subnav p a, .subMenu a:hover, footer a:hover { 
    color:#879CC3; /*logo-blue: #A0B2E2 or #879CC3 */ text-decoration: none;
}
.menu {
  text-align:center;
  display:block;
  width:100%;
  padding:5px 0 0 0;
  font-size:0.9em; font-size:0.9rem;
}
.menu li {
  display:inline;
  padding:0 9px;
}
.menu a {
  display:inline-block;
}
  

.blockWrap {
  width:100%;
}

.wrapStyle {
 /* background:url(../images/texture.jpg) center top fixed;*/
} 


/***********************************************/
/* MAIN CONTENT */
/***********************************************/

#contentWrap {
}


/* .content not needed jet*/
.content {
	padding: 10px 0; padding: 0 8px 0 0; margin: 4px 0 0px 0;margin: 0px 0 0px 0;margin:0 auto;
	/*width: 740px;width:678px;width:460px; 
	float: right;*/
	background: transparent; z-index: 10;color: #8A493A;
	position: relative; top: -220px;border-bottom:solid 1px #434d52;
	width:90%;
	max-width:800px;
}
.content a:link, .content a:visited {
	color: #8A493A;
	text-decoration: none; 
	/*border-bottom: 1px solid #8A493A;*/
}

.phone, .fax {display:none;}
.copyright, .phone2, .fax2 { display: inline;}
.impressum {text-align:left; float:left;display: inline;margin: 0 0 0 20px;}

.mainImage {
  width:100%;
  /*height:auto; height:300px;*/
}
.mainImage2 {
  width:100%;
  max-width:1243px; 
  max-width:582px; 
  height: auto;
  /*height:auto; height:300px;*/
}



/***********************************************/
/* FOOTER */
/***********************************************/
footer { 
  width:100%;
  /*border-bottom:solid 8px #434d52; */border-top:solid 2px #434d52;
  background: #ffffff url("../images/bg.png") center top repeat-y;
  position:fixed; bottom: 0px; 
   }
footer small {
  width:100%;width:80%;/*width:700px;*/
  text-align:center;text-align: right;
  margin: 0;
  padding:10px 0px 10px 0px;
  display:block; /*overflow:hidden; background: #ddd;*/background:#ffffff;
   }
   
 
 
 /***********************************************/
/* MAIN CONTENT */
/***********************************************/  

article  {
  width:90%;
  max-width:800px;
  margin:0 auto;
  overflow:auto;
  padding:0 0 20px 0;
  }

section  {
  width:90%;
  max-width:800px;
  margin:0 auto;
  overflow:auto;
  padding:0 0 20px 0;
  }
  
article small { font-size:0.8em;
  width:100%;width:96%;
  text-align:center;text-align: right;margin: 0;
  /*padding:120px 0;padding:20px 0;padding:20px 20px 10px 0px;*/ padding-right: 40px;padding:8px 0px 8px 0px;
  display:block; /*overflow:hidden; background: #ddd;*/
   }
   

/* important or first article markup */
.important, .first {
  padding:30px 0 30px 0;padding:20px 0 20px 0;
  max-width:580px;/*max-width:540px;max-width:600px;*/
}

p.important {
	text-align:right; padding:20px 0 0px 0; border-bottom: #879CC3 solid 1px;
}

ul.important {
	text-align:right; padding:0px 0 0px 0; border-top: #879CC3 solid 1px;font-size:1.2em;
}



/*article h1, #contentWrap h1  {
   width:100%;width:94%;
   text-align:center;text-align:right;
   padding:80px 0;padding:40px 0;padding:40px 0px 40px 0;
   font-size:1.8em;
   line-height:1.3em;
   font-style:italic;
   text-transform: uppercase;
  } */
  
section h1, #contentWrap h1  {
   /*width:100%;width:94%;*/ width: 620px;
   text-align:center;text-align:right;
   padding:80px 0;padding:40px 0;padding:40px 0px 40px 0;
   font-size:1.8em;
   line-height:1.3em;
   font-style:italic;
   text-transform: uppercase;
  }

article h2, #contentWrap h2 {
  margin:20px 0 20px 0;
  font-size:1.5em;
  font-style:bold;
   width:100%;width:94%;
   text-align:center;text-align:right;
   padding:80px 0;padding:40px 0;padding:40px 0px 40px 0;
   font-size:1.8em;
   font-style:italic;text-transform: uppercase;
  }
  
/*article h3, #contentWrap h3 {
  margin:20px 0 20px 0;
  font-size:1.5em;
  font-style:bold;
  } */
  
section h4, #contentWrap h3 {
  margin:20px 0 20px 0;
  font-size:1.5em;
  /*font-style:bold;font-style:normal;*/
  /*font-weight: bolder;*/font-weight: 500!important;
  line-height:1.3em;
  max-width:580px;width:580px;
  }
  
/* article h3 { font-weight: 500!important;font-style:normal;} */
  
article p, #contentWrap p {
  margin:0 0 10px 0;
  clear:both;
  line-height:1.5em;
  font-size:1.1em;
  word-spacing:1px;
  } 
  
article p.large {
  font-size:1.26em;font-size:1.26em;max-width:540px;
} 

article p.large {
  font-size:1.26em;font-size:1.26em;max-width:540px;
} 

/* for vorab page */
article.large1 {
  font-size:1.26em;font-size:1.26em;/*max-width:540px;*/
  border-left: #879CC3 solid 2px;
  padding:0 0 0px 0;
  margin:20px 0 20px 40px;
  max-width:580px;font-weight: bolder;
} 

article p.large1 {
  font-size:1.26em;font-size:1.26em;max-width:540px;
} 

article ul {
  font-size:1.1em;
  margin: 0 0 10px 0;padding: 0;
  line-height:1.5em;
  /*list-style-type: square; list-style-position:outside;*/ /*list-style-image: url(../images/square.png);*/
}
/*article ul li{margin: 0;padding:0 0 0 20px;
  list-style-type: square; list-style-position:outside;
  background: url("../images/square.png") -3px -3px no-repeat; background: url("../images/squareSm.png") left center no-repeat;background: url("../images/squareSm.png") 0px 3px no-repeat;overflow:hidden;
}*/

/* for vorab page */
article ul.large {
  /*font-size:1.1em;*/font-size:1.20em;
  margin: 0 0 10px 0;margin: 0 0 10px 20px;padding: 0;
  line-height:1.5em;
  /*list-style-type: square; list-style-position:outside;*/ /*list-style-image: url(../images/square.png);*/
  max-width:280px; float: left;
}

article ul.large2 {
  font-size:1.20em;
  margin: 0 0 10px 100px;padding: 0;
  line-height:1.5em;
  /*list-style-type: square; list-style-position:outside;*/ /*list-style-image: url(../images/square.png);*/
  max-width:280px; float: left;
}


/* subMenu not needed jet */

.subMenu {
    width:100%;
    float:left;
    padding:0 0 80px 0;
}
.subMenu li {
    width:33.33%;
    float:left;
    margin:0 0 60px 0;
    position:relative;
}
.subMenu img {
   width:100%;
   height:auto;
   float:left;
}
.subMenu img:hover {
   opacity:0.8;
}
.subMenu h2 {
  width:100%;
  text-align:center;
}  

/********************************************************************/
/* FORM ELEMENTS */
/********************************************************************/





 /***********************************************/
/* iPad SETTINGS */
/***********************************************/

@media (max-width: 1024px){
article  {
  max-width:600px;
  }
}

@media (max-width: 768px){
.topWrap {
    padding:80px 0; padding:40px 0;
    } 

section  {
  width:90%;width:95%;
  padding:0 0 0px 0;/*background: #ddd;*/
  }


section h1, #contentWrap h1  {
   /*width:100%;*/width:94%;
   text-align:center;text-align:right;
   padding:40px 0;padding:0px 0px 20px 0;
   font-size:1.8em;font-size:1.7em;
   line-height:1.3em; 
  }
  
.important, .first {
  padding:20px 0 20px 0;
}
.subMenu li {
    width:50%;
    }
footer small {
  padding:60px 0; padding:20px 40px 20px 0px;
   }

} 

 /***********************************************/
/* iPhone SETTINGS */
/***********************************************/

@media (max-width: 600px) {
 body { 
   font-size:18px;
 }
.topWrap {
    padding:40px 0;
  }
.topWrap h1 {
  font-size:2.2em;font-size:0.8em;
  }

section  {
  width:90%;width:95%;
  padding:0 0 0px 0;/*background: #ddd;*/
  }  
section h1, #contentWrap h1  {
   /*width:100%;*/width:94%;
   text-align:center;text-align:right;
   padding:40px 0;padding:0px 0px 20px 0;
   font-size:1.8em;font-size:1.7em;
   line-height:1.3em; 
  }

section h4, #contentWrap h3 {
  margin:20px 0 20px 0;
  font-size:1.5em;
  line-height:1.2em;
  width:100%;
  }


/* for vorab page */
article.large1 {
  font-size:1.26em;font-size:1.26em;/*max-width:540px;*/
  border-left: #879CC3 solid 2px;
  padding:0 0 0px 0;
  margin:10px 0 10px 0px;
  max-width:90%;font-weight: normal;
} 


article ul.large {
  /*font-size:1.1em;*/font-size:1.0em;
  margin: 0 0 10px 0;margin: 0 0 10px 5px;padding: 0;
  line-height: 1.1em;
  /*list-style-type: square; list-style-position:outside;*/ /*list-style-image: url(../images/square.png);*/
  max-width:240px; float: left;
}

article ul.large2 {
  font-size:1.0em;
  margin: 0 0 10px 5px;padding: 0;
  line-height: 1em;
  /*list-style-type: square; list-style-position:outside;*/ /*list-style-image: url(../images/square.png);*/
  max-width:320px; float: left;
}

  
article  {
  padding:0 0 20px 0;
  }
  
.important {
  padding:10px 0 10px 0;
 }
article p.large {
  font-size:1.3em;
 } 
article p {
  font-size:1.3em;
  line-height:1.4em;
  margin:0 0 20px 0;
  }

article  {
  padding:0 0 0px 0;
  }
article h3 {
  line-height:1.4em;
  margin:10px 0 10px 0;
  }



.subMenu {
    padding:0 0 40px 0;
 }
.subMenu li {
    width:100%;
 }
article h1 {
  padding:40px 0;
 }
h3 {
  width:100%;
  /*text-align:center;*/
 }

.impressum {font-size:0.8em; margin: 0 0 0 0px;}
.phone {display:inline; display:block;}
span.phone {display:inline;}
/*.copyright, .phone2, .fax2 {display: none;}*/
.copyright {font-size:0.8em; /*text-aign:right;margin: 0;padding:0;background:#333;*/margin: 0 0 0 0px;padding: 0 0 0 0!important; display:none;}
.phone2, .fax2 {display: none;}
.fax {display:block;color:#434d52!important;}
article .fax {color:#434d52!important;}
article .fax a {color:#434d52!important;}

}


 /***********************************************/
/* MOBILE SETTINGS */
/***********************************************/

@media (max-width: 420px) {
.topWrap h1 {
  font-size:2em;width: 272px; height: 102px;margin-top:0px;
  }
  
h1 span {
    display: none;
  }
h1 img {
    /*width:100%; height: 100%;background: transparent;*/
	width: 147px; height: 134px;background: url("../images/logo-sm.png") left top no-repeat;
  }

section  {
  width:90%;width:95%;
  padding:0 0 0px 0;
  }
    
article  {
  padding:0 0 0px 0;
  }
article h3 {
  line-height:1.4em;
  margin:10px 0 10px 0;
  }
  

/* for vorab page */
article.large1 {
  font-size:1.26em;font-size:1.26em;/*max-width:540px;*/
  border-left: #879CC3 solid 2px;
  padding:0 0 0px 0;
  margin:10px 0 10px 0px;
  max-width:90%;font-weight: normal;
} 


article ul.large {
  /*font-size:1.1em;*/font-size:1.0em;font-size:0.9em;
  margin: 0 0 10px 0;margin: 0 0 10px 5px;padding: 0;
  line-height: 1em;
  /*list-style-type: square; list-style-position:outside;*/ /*list-style-image: url(../images/square.png);*/
  max-width:240px; float: left;
}

article ul.large2 {
  font-size:1.0em;font-size:0.9em;
  margin: 0 0 10px 5px;padding: 0;
  line-height: 1em;
  /*list-style-type: square; list-style-position:outside;*/ /*list-style-image: url(../images/square.png);*/
  max-width:290px; float: left;
}


/* article ul li{margin: 0;padding:0 0 0 20px;
  list-style-type: square; list-style-position:outside;background: transparent;
} */
.phone {display:inline; display:block;}
span.phone {display:inline;}
/*.copyright, .phone2, .fax2 {display: none;}*/
.phone2, .fax2 {display: none;}

.fax {display:block;color:#434d52!important;}
}

@media (-webkit-min-device-pixel-ratio : 1.5) {
  h1 span {
    display: none;
  }
}