/*
CSS für bdcon.de
(c) BDCON Frank Bitzer, 2006 - 4.2016
*/

/* Reset*/

* { margin: 0; padding: 0; }
html { overflow-y: scroll;}


body.mybody  {
  background-color:#f3f3f3; /*#FEFDF4; */
  text-align:center;
  font-size:20px; line-height:22px;
  font-family: Calibri , Verdana , Arial, Helvetica ,  sans-serif;
  margin:0; padding:0;	
}
 


@media (max-width: 480px  ) {
.mybody {font-size: 20px; line-height:22px; }
 }



/* setting margins */
.main {
  padding:0px;
  margin-left:20px;
  max-width:900px;
  text-align:left;
  display: block; 
  margin: auto;
  
}


/*  is set in print css  */
.printheader { display:none; }



.bodycontent {
  padding:0; margin:0;
  height:100%;
  font-size: 1.0em;
  display:block;
  /*overflow:auto;*/
  color:#545458;  /*drkblue #566078*/
}


.bodycontent  h1{
background:#FFF; 
color:#800000;
font-size:1.4em;font-weight:bold;
padding: 10px 0px 10px 0px ;
border-bottom:1px solid #ccc;
}



.bodycontent  h3{
font-size:1.2em;font-weight:bold;
color:#976B01; /*#DE9E04 */
padding:  0px 0px 5px 0px ;
}



.bodycontent  a {
color:#800000;
font-weight: normal;
text-decoration:underline;
}

.bodycontent  a:hover {
color:#000;
text-decoration:underline;
}


ul.widelist {line-height:40px;}
ul.widelist li {display:block; line-height:40px;}



/*   ------------------- Header Bereich ------------------------*/
 

.header {background-color: #fff; height:70px; width:100%; }
.header_logo {float:left; height:72px; width:170px; }
.header_social {float:right;width:730px;}
#slogan {height:40px; width:729px; display:block; clear:both; margin:0px; padding:0px;}


@media (max-width: 900px ) {
	#slogan {width:640px; margin-top:5px;clear:both; }
	.header_social {float:left;width:120px;}
}
@media (max-width: 800px ) {
	#slogan {width:640px;}
}

@media (max-width: 640px ) {
	#slogan {display:none;}
	.header_social {float:left;width:160px;}
}

@media (max-width: 480px ) {
	#slogan {display:none;}
	.header_social {float:right;width:60px;}
}


 /*   -------------------   misc refdes  ------------------------*/

a { color: #733200; text-decoration:none;  font-weight: bold;}  
a:hover { color: #733200; text-decoration:underline;  }  
a.lkextern {
	display:inline; line-height: 30px;
	margin:0px;
	font-weight:bold;
	text-decoration:none;
	padding: 0px 5px 0px 15px;   background: url('/common/bdcon/lkextern.png')  no-repeat;  }


 
img {     max-width: 100%;     height: auto; }

#myLink {
width:10px; float:left; display:block; background-color:  #F00; 
background: url(lkextern.png) no-repeat;
}


 
 /*   -------------------   images. we need both   ------------------------*/

.topimg {width: 100%; display:block; margin:0px; padding: 10px 0px 2px 0px;  clear:both;  background:#fff; text-align:center;}
.scaleimg { margin: 0px 0px 20px 0px; max-width:100%; }
.scaleimg img { max-width: 100%; }


.lbreak {display:block; clear:both; }
.ctbreak {display:block; clear:both; margin: 20px 0px 20px  0px ;}





 /*   -------------------   Content Boxen   ------------------------*/
 
.cnt_left100 {display:block;  padding:  10px 10px 10px 10px ;margin:  20px 0px 20px 0px ; max-width:100%; background: #FFF;  border:1px solid #eee;}
.cnt_left100  h2{ font-size:1.2em;font-weight:bold;color:#335377; padding:  0px 0px 5px 0px ; margin-bottom:10px;}
.cnt_left100  ul ol {
list-style-position:outside; 
margin-left:25px;
}

.cnt_left80 {display:block;  padding:  20px 50px 20px 50px ;margin: 20px 0px 20px 0px ; max-width:100%; background: #FFF;  border:1px solid #eee; overflow:hidden;}
.cnt_left80  h2 { font-size:1.2em;font-weight:bold;color:#335377; padding:  0px 0px 5px 0px ; margin-bottom:10px;}
.cnt_left80  h3 { font-size:1.1em;font-weight:bold;color:#976B01; padding:  0px 0px 5px 0px ; margin:0px;}
.cnt_left80  h4  { font-size:1.1em;font-weight:bold; color:#976B01; padding:0px 0px 0px 20px;  ; margin: 0px;  background: url('/common/bdcon/check_blue2.png')  no-repeat; }
.cnt_left80  h4 a { font-size:1.1em;font-weight:bold; }


.cnt_left80  ul   {
	list-style-position:outside; 
	margin-left:45px;
}
.cnt_left80  ol {
	list-style-position:outside; 
	margin-left:25px;
}


@media (max-width: 480px ) {
.cnt_left80 {display:block;  padding:  5px 10px 10px 10px ;margin: 5px 0px 5px 0px ; max-width:100%; background: #FFF;  border:1px solid #eee; overflow:hidden;}
}





.cnt_left70 {display:block;  padding:  10px 10px 10px 10px ;margin:  20px 0px 20px 0px ; max-width:70%; background: #FFF;  border:1px solid #eee;}
.cnt_left70  h2{ font-size:1.4em;font-weight:bold;color:#335377; padding:  0px 0px 5px 0px ;}
.cnt_left70  ul {
list-style-position:outside; 
margin-left:15px;
}


.cnt_tx_full {display:block; width:100%; clear:both;  }
.cnt_tx_70le {display:block; width:70%;float:left;}
.cnt_tx_70le  h3 a {   font-size:1.1em;font-weight:bold;color:#976B01; padding:  0px ; margin:0px; }
.cnt_tx_70le .check {float:left; margin-right:10px;}


.cnt_tx_30re {display:block; width:26%;  padding:  5px 10px 10px 10px; float:right; background:#efefef;}
@media (max-width: 480px ) {
	.cnt_tx_70le {display:block; width:100%; }
	.cnt_tx_30re {display:block; width:100%;  background:#efefef;}
}


/*  frame mit 2 Spalte 70/30%  */
.cnt_full {display:block; margin: 20px  0px 10px  0px;  width:100%;  background: #FFF;  border:1px solid #f00; }
.cnt_full h2{ font-size:1.4em;font-weight:bold;color:#335377; padding:  0px 0px 5px 0px ;}

.cnt_full_left70 { width:70%; float:left;border:1px solid #0f0; }
.cnt_full_right30 {width:28%; float:right;border:1px solid #0f0; }

.cnt_full_left30 { width:28%; float:left;border:1px solid #0f0; }
.cnt_full_right70 {width:70%; float:right;border:1px solid #0f0; }
 
@media (max-width: 480px  ) {
.cnt_full_left70 {width:100%;  border:1px solid #0f0; display:block; clear:both;}
.cnt_full_right30 {width:100%;  ;border:1px solid #0f0;display:block; clear:both; }
.cnt_full_left30 {width:100%;  ;border:1px solid #0f0;display:block; clear:both; }
.cnt_full_right70 {width:100%;  border:1px solid #0f0; display:block; clear:both;}
 }


/*   blog 2 Spalte 70/30%  overflow:hidden = show the background in float sub divs*/




.cnt_blog {display:block;  padding:  10px 10px 10px 10px ;margin:  20px 0px 20px 0px ; max-width:100%; background: #FFF;  border:1px solid #eee; overflow:hidden;}
.cnt_blog  h2{ font-size:1.1em;font-weight:bold;color:#335377; padding:  0px 0px 5px 0px ;}
.cnt_blog  ul {
list-style-position:outside; 
margin-left:15px;
}

.cnt_blog_text { width:64%; float:left;  display:block;  }
.cnt_blog_info { width:24%; float:right; display:block;    padding:  0px 10px 10px 10px ; background: #f3f2e4;}


.blogidx {display:block;  padding:  10px 10px 10px 10px ;margin:  20px 0px 20px 0px ; max-width:100%; background: #FFF;  border:1px solid #eee; overflow:hidden; clear:both;}
.blogidxmore{display:block;  padding:  5px 10px 5px 10px ;  max-width:100%; background: #efefef;   overflow:hidden;}
.blogidx  h3{ font-size:1.1em;font-weight:bold;color:#335377; padding:  0px 0px 5px 0px ;}



.tagcloud {display:block; margin: 20px  0px 10px  0px; padding:  5px 10px 5px 10px ;   width:97%;  background: #fff;  border:1px solid #ccc; overflow:hidden;}
.tagcloud h2{ font-size:1.2em;font-weight:bold;color:#335377; padding:  0px 0px 5px 0px ; margin-bottom:10px;}
.tagcloud a {text-decoration:none; font-weight:normal;}
.tag_sbig {padding:  0px 5px 0px 5px ;  font-size:1.3em; }
.tag_big {padding:  0px 5px 0px 5px ;  font-size:1.1em; }
.tag_medium {padding:  0px 5px 0px 5px ;  font-size:1.0em; }
.tag_small {padding:  0px 5px 0px 5px ;  font-size:0.9em; }
.tag_tiny {padding:  0px 5px 0px 5px ;  font-size:0.8em; }





/*  ------------------    responsive menu  -------------------  */


.nav {  display: block;     background:#fff;     position: relative;    min-height:50px;   }
.nav, .nav a {  color: #000;   text-decoration: none; font-size:18px; }
.nav a {    display: block;   padding: 10px; }
.nav a.msel { background: #ddd;}
.nav a:hover {     background: #cdcdcd; }
.nav ul {     padding:0;      margin: 0; list-style: none; }
.nav ul li {     float:left;    display:inline;   width:170px;  position:relative;     background: #fff;  }
.nav ul li ul {     left:0;  top:100%; border : 1px solid #ccc; }
.nav ul li ul li {   width: 180px; border-top:1px solid #999; border-right: 1px solid #ccc; }
.nav ul ul {     display:none; }
.nav li:hover > ul {     display:block;     position:absolute;     z-index:1000;     width: 180px;  }
.nav ul ul li:hover > ul {     right: -120px;     top: 0;     left: auto; }

@media (max-width: 900px ) {
	.nav ul li {    float:left;    display:inline;   width:140px;  position:relative;     background: #fff;  font-size:16px; }
	.nav a {  font-size:16px;} 
 }

@media (max-width: 800px ) {
	.nav ul li {     float:left;    display:inline;   width:120px;  position:relative;     background: #fff; font-size:14px;  }
	.nav a {  font-size:14px;} 
 }

/*Hide checkbox and label by default */
.nav > input, .nav > label {   display: none; }

/*  do not use label for action */
.nav > label {   width: 100%;   float: left;   padding: 10px;   padding-right: 0;   cursor: pointer;
  -webkit-touch-callout: none;   -webkit-user-select: none;   -khtml-user-select: none;   -moz-user-select: none;
  -ms-user-select: none;   user-select: none; }



/*Media query small screen on phone . use hamburger menu */
@media (max-width: 640px ) {
	body {font-size:18px;}
    .nav > label, .nav ul li ul {   display: block;     } /*  aktivate items  with parent = nav */
    .nav > ul {         display: none; clear: both;  border: 0px;     }  /* hide menu items  */
    .nav > input:checked + ul {  display: block;  }  /*  toggle  function, show when click on ckeckbox */
	.nav ul li a {background:#efefef;  display:block;width:200px;}
	.nav ul li ul li a {background:#fff;  display:block;}
	.nav ul li a:before {  content:'= ';  display: inline;   }  /*  menu level 1 topics  */
    .nav ul ul li a:before { content:'- ';  display: inline;     }  /*  menu level 2 topics */
    .nav ul li {  float: none;   display: block;   border: 0px;   width:190px;       padding-left: 10px;     }
	.nav ul li ul {     left:0;     top:100%; border : 0px ; }
	.nav ul li ul li {   border:0px; display: block; width:200px; }
    .nav li:hover ul {   position: relative;    width: auto;     }
    .nav ul ul li:hover > ul {   right:auto;   top: auto;  left: auto;     }
	.nav a {  font-size:18px;} 
}
/*
 .nav ul li {     float:left;    display:inline;   width:180px;  position:relative;     background: #fff;  }
.nav ul li ul li {   border-top:1px solid #999; border-right: 1px solid #ccc; }
*/


 
 /* Footer */
.footer{ display: block;width: 100%; margin-top:30px; padding:25px 0px 0px 0px; min-height: 100px; clear: both; background-color:#DDD;text-align:left; }
.footer ul{display: block;list-style: none; width: 130px;float:left;text-align: left;}
.footer .headline {font-weight: bold;font-size:1.1em;text-decoration: none;padding-bottom:10px;}
.footer ul li {font-size: 0.9em;line-height: 16px;}
.footer a {text-decoration:none; color:#000;} 
.footer a:hover {text-decoration:underline;}