/* qwikka-modell - QRab 
 * @copyright       Copyright 2012, Qwikka
 * @link            http://www.qwikka.de
 * @package         qwikka
 * @version         v1.0.0
 * @lastmodified    $Date: 2012-07-10 19:15:48 +0100 (So, 04 Mrz 2012) $
 * @modified by		qwikka
 * @global items	background: #ffffff
 *		            color/navi-buttons: #888888
 *					background/navi-buttons: #66666;
 *                  box-shadow: #444444 
 *					border/input/buttons: #aaaaaa;
 *					border/input/buttons:hover: #666666;
 *					background/buttons: #666666;
 *					background/buttons:hover: #aaaaaa;
*/

@media all{
  html {
  	height: 100.3%;
  	font-size: 62.5%;
  }
  body {
  	text-align: center;
  	font: 1.2em/1.8em Verdana, sans-serif;
  }
  
  * {margin: 0px; padding: 0px; border: 0px;}
  
  h1, h2, h3, h4, h5, h6 {
  	font-family: "Century Gothic", sans-serif; 
  	margin: 0em 0em 0.5em 0em; 
  	color: #666666;
  }
  h1 {
  	font-size: 2.2em; 
  	border-bottom: 1px dashed #004A7F; 
  	padding-bottom: 0.4em;
  	font-weight: normal;
  }
  div#header h1 {border: 0px;}
  h2 {font-size: 2.0em;}
  h3 {font-size: 1.8em;}
  h4 {font-size: 1.6em;}
  h5 {font-size: 1.4em;}
  h6 {font-size: 1.2em;}
  
  a {color: #666666; text-decoration: none;}
  a:link {}
  a:visited {}
  a:hover {}
  a:active {}
  
  div#wrapper {
  	/* width: 760px; */
  	min-width: 400px; 
      /* margin: 20px auto; */
      margin: 0px 40px; 
  	/* margin: 0px 40px; */
  	text-align: left;
  	background: #fafafa;
      box-shadow: #444444 1.5em 0.0em 1.5em;
      padding-right: 0.5em;
  }

  div#header {
      margin: 0em 0em 1.0em 0em;
      padding: 2.0em 0em 2.0em 1.5em; 
      height: 6em;
  	line-height: 5.5em;
      vertical-align: middle;
      color: #ffffff;
  
      box-shadow: #444444 1.5em 0.0em 1.5em;
  
      background: #888888;
        /* - farbverlauf beginn - */
  	    /* browser: safari, google chrome */
           background: -webkit-gradient(linear, 0 0, 0 100%, from(#888888), to(#ffffff));
           /* browser: mozilla */
           background: -moz-linear-gradient(top, #888888, #ffffff);
           /* browser: Presto (Opera, etc.) */
           background: -o-linear-gradient(top, #888888, #ffffff);
           /* browser: ie5.5 bis ie7 */
           filter: progid:DXImageTransform.Microsoft.gradient
  	    (startColorstr=#888888, endColorstr=#ffffff);
  	     /* browser: ie8 */
  	    -ms-filter: progid:DXImageTransform.Microsoft.gradient
  	    (startColorstr=#888888, endColorstr=#ffffff);
  
  		-webkit-border-radius: 0.5em;
  		-moz-border-radius: 0.5em;
  		-khtml-border-radius: 0.5em;
  		border-radius: 0.5em;    
  }
  div#header p {
      color: #ffffff;
      font-size: 3.5em;
      font-weight: bold; 
      text-shadow: 2px 2px #444444;
  }
  div#nav {
  	padding: 2.5em;
      background: #666666;
      color: #ffffff;
      letter-spacing: 0.1em;    
      -webkit-border-radius: .5em;
      -moz-border-radius: .5em;
      -khtml-border-radius: 0.5em;
      border-radius: 0.5em;
      margin-bottom: 1em;
  }
  div#nav li {
  	display: inline; 
  	margin-left: 10px;
  }
  div#nav a {
      padding: 0.5em;
      color:#ddd;
  	font-size:1.8em;
  	text-decoration: none; 
  	font-weight: bold; 
  	text-transform: uppercase; 
      border-top: 0.2em transparent solid;
      border-bottom: 0.2em transparent solid;
  }
  div#nav a:hover, 
  body#home li.navhome a,
  body#meeting li.navcard a,
  body#team li.navteam a,
  body#produkte li.navprodukte a,
  body#service li.navservice a,
  body#kontakt li.navkontakt a {
      background:#66666;
      background: rgba(255,255,255,.25);
      color: #FFFFFF;
      -webkit-border-radius: 0.5em;
      -moz-border-radius: 0.5em;
      -khtml-border-radius: 0.5em;
      border-radius: 0.5em;
  	border-top: 4px solid #FFFFFF;
  }
  
  div#wrap_content { 
      border: 1px #666666 solid;
      -webkit-border-radius: 0.5em;
      -moz-border-radius: 0.5em;
      -khtml-border-radius: 0.5em;
      border-radius: 0.5em; 
  }
  div#col1, div#maintext,
  div#maintext_vcard {
  padding: 20px 10px;
      -webkit-border-radius: 0.5em;
      -moz-border-radius: 0.5em;
      -khtml-border-radius: 0.5em;
      border-radius: 0.5em; 
  }
  div#col1 {
  	float: left;
  	width: 180px;
  	background: #EBEBEB;
  }

/*
body#home.aepfel li.aepfel a {
	border-left: 8px solid #E3004F; 
	padding-left: 4px; 
	margin-left: -12px;
}*/

  div#maintext, div#maintext_vcard {
  /*	margin: 0px 10px 0px 210px; */
  	margin: 0px 10px 0px 10px; 
  	background: #ffffff;
 	overflow:auto;
  }
  div#maintext_vcard {
  	margin-left: 10px;
  }
  div#maintext a,
  div#maintext_vcard a {padding-bottom: 1px;}
  div#maintext a:link,
  div#maintext_vcard a:link {border-bottom: 1px solid #E3004F;}
  
  div#maintext_vcard {
/*  	 height: 65em; */
    text-align: center;
  }
  div#maintext_vcard h1 {
    margin-top: 0.5em;
  }
  div#maintext_vcard div#logo {
    margin-bottom: 1em;                 
    text-align: left;
  }

  div#maintext_vcard div#logo a {
		 border-bottom:none;
	}

/*ul#qrlist li{
   display:inline;
   margin: 2.0em 0.5m 2.0em 0.5em;
   padding: 0.0em;
	 font-size: 1.4em;
	 line-height:8em;
 }
 */
  div#qr_text {
  float:left; 
  margin: 2.0em;
  width: 25em;
  }
  div#qr_text p {
  text-align: left; 
 	 overflow:hidden;
   }
  div#qr {
  float:left; 
  width:30em;
  }
  div#qr img {
  width:20em;
  }

	 div#accordion_a {
	 width: 48%;
  min-width: 280px;
	/* float:left;
	 margin-right:1em;
	 width: 48%; 
	 min-width:30em;
	 max-width:50em;
	 */
	 }

	 div#accordion_b {
	 width: 48%;
	 min-width: 280px;
	 /*
	 float: right;
	 width: 48%;
	 min-width:30em;
	 max-width:50em;
	*/
	 }
	 
  ol {
     list-style-type: none;
     margin: 0.0em 0.0em 0.1em 0.1em;
     padding: 0.0em;
  }
  ol label {
     display: block;
  }

	 #details span {
	 	 color: #aaaaaa;
	 }
		
	 form.qr_form {
	 text-align:left; 
	 }
  form.qr_form_edit {
  margin-top:50em;
  text-align:center;
  }
  form sup { 
      color: #ff0000;
  }
  form input[type="text"] {
      margin: 0.0em 0.0em 1.0em 0.0em;
  /*    width: 50%; */
      height: 2em;
      border: 1px #aaaaaa solid;
      -webkit-border-radius: 0.5em;
      -moz-border-radius: 0.5em;
      -khtml-border-radius: 0.5em;
      border-radius: 0.5em;    
  }
  form input[type="text"]:required {
      background-color:#ffd2d2; 
  }
  form input[type="text"]:hover, 
  form input[type="text"]:focus {
      border: 1px #666666 solid;
      background-color: #ffffff; 
      box-shadow: #444444 0.0em 0.0em 0.5em;
  }
  form input[type="submit"] {
      margin: 2.0em 0.0em 1.0em 0.0em;
      padding: 1.0em;
  /*    width: 50%; */
      border: 1px #aaaaaa solid;
      -webkit-border-radius: 0.5em;
      -moz-border-radius: 0.5em;
      -khtml-border-radius: 0.5em;
      border-radius: 0.5em;    
  
      box-shadow: #444444 0.0em 0.0em 0.1em;
  
      background-color: #666666;
      color: #ffffff;
      font-weight: bold;
      letter-spacing: 0.1em;
  	text-transform: uppercase;
      cursor: pointer;
  }
  form input[type="submit"]:hover,
  form input[type="submit"]:focus,
  form input[type="submit"]:active {
      border: 1px #666666 solid;
      background-color: #aaaaaa;
      box-shadow: #444444 0.0em 0.0em 0.5em;
  }
 
  div#footer {
      margin-top: 0.5em;
  	padding: 2px auto 4px auto;
  	text-align: right;
  	background: #CCCCCC;
  }
  div#footer img {
     height: 1em;
  }

/*
 * MOBILE
 */

  div#data_role_header  {
  margin-top: 1.5em;
  }
  div#header_mobile {
  margin-bottom: 2em;
  } 
}
	
	@media all and (min-width: 650px){

	 div#accordion_a {
	 float: left;
	 width: 48%; 
	 }
	 div#accordion_b {
  margin-left: 50%;
	 }
	}

	@media all and (max-width: 650px){
  div#qr_text {
  width: 15em;
  }
  div#qr {
    width:10em;
  }
  div#qr img {
    width:10em;
  }
	
	}