﻿#contbg
 { margin:0px;
  background-image:url('images/wccc_bg.jpg');
  background-repeat:no-repeat;
  background-position: center center;  
  background-attachment:fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#cont2 { background-color:rgba(250,250,250,0.85); position:fixed; padding:0px; left:50%; right:auto; top:150px; bottom:10px; width:70%; } 
#cont2i { overflow: auto; position:absolute; left:0px; padding:0px; margin:0px; bottom:0px; top:0px; right:0; font-size:20px; font-weight:bold; color:#666; line-height:140%;}
#cont3 { overflow:auto; padding-left:40px; padding-bottom:30px; padding-right: 40px; width:auto; font-weight:normal; line-height:160%; }
#cont4 { overflow:auto; padding-top:20px; font-weight:normal; line-height:160%; overflow: hidden;}
#lineb { overflow:auto; padding-top:20px; padding-bottom:0px; width:100%; font-weight:normal; text-align: center; line-height:80%; }

#Home, #Coaching, #Counseling, #Consulting, #Wozu, #Wer, #Wie, #contact {font-size: 36px; margin-left:40px; margin-bottom: 10px; width:80%; line-height:110%;}
#logo {overflow: hidden; left:0px; position:absolute; right:auto; top:0px; width:500px; height:550px; margin-top:20px; background-image: url('images/Logo_wccc.png'); background-repeat: no-repeat;}

#footer    { background-color: #ffffff; bottom:0px; margin:0px; padding-top: 20px; z-index: 3; font-size: 16px; }
#footerI   { padding-left:40px; }
.fIb   { margin-bottom: 10px; }

.link {width: 500px; height: 120px; }

#ImgBox {margin:0px; margin-left: 30px; padding: 0px; float:right; border-left: 2px solid rgb(181, 0, 57); line-height:0; }
#FootBox {margin:0px; display: inline-block;}

  /*Startseite Position regeln*/
#bg, #bgL, #bgP {
  width: 100%;
  height: 100%;
  position: relative;
  }
    
  @media (orientation: landscape) { 
  #bgP {visibility:hidden; 
  }
   }
  
    /*Logo Start Position regeln*/
  @media screen and (min-width:000px) and (max-width:999px) and (min-height:399px)  {
  #logos {left:10px;z-index: 1;width: 50%; }
  .snb {font-size:40px; }  
  }
  @media screen and (min-width:000px) and (max-width:999px) and (max-height:400px)  {
  #logos {left:10px;z-index: 1;width: 35%; }
  .snb {font-size:50px}  
  }
  @media screen and (min-width:1000px) {
  #logos {
  left:10px;
  z-index: 1;
  width: 35%; }
  .snb {font-size:60px}  
  }
  
  /*Claim Position regeln*/
  @media screen and (min-width:000px) and (max-width:999px) and (min-height:399px) {
  #claim {right:40px;z-index: 1;width: 60%
  }
  }
  @media screen and (min-width:000px) and (max-width:999px) and (max-height:400px) {
  #claim {right:40px;z-index: 1;width: 40%
  }
  }
  @media screen and (min-width:1000px) {
  #claim {
  right:40px;
  z-index: 1;
  width: 40%;
  }
  }
  
/*Logo Position regeln*/
@media screen and (min-width:000px) and (max-width:599px) {
  #logo {left:-42px; width: 370px; background-image:url('images/Logo_wcccII.png');}
  }
@media screen and (min-width:600px) and (max-width:999px) {
  #logo {left:-42px;  background-image:url('images/Logo_wcccII.png');}
  }
@media screen and (min-width:1000px) and (max-width:1249px)  {
  #logo {left:-128px; background-image:url('images/Logo_wcccI.png');}
  }
 @media screen and (min-width:1250px) and (max-width:1599px)  {
   #logo {left:-182px; }
  }
@media screen and (min-width:1600px) {
   #logo {left:-187px; }
  }
            
#contbg {position:fixed; padding:0px; left:50%; right:auto; top:150px; bottom:0px; margin-left:-50%; width:100%;}

/*@media (orientation: portrait) {
  #contbg {top:80px; }
  #logo {left:-42px; width: 250px; margin-top: -50px; }
}*/
@media (min-aspect-ratio: 5/2) and (max-width:1000px) or (max-height: 400px) {
  #contbg {top:60px; }
  #cont2 { top:60px; } 
  #logo {left: 0px; margin-top: 18px; width:250px; background-image:url('images/Logo_wcccIII.png'); }
  .link {width: 210px; height: 27px; }
}

/*Position linker Rand regeln*/
@media screen and (min-width:000px) and (max-width:999px) {
  #contbg {margin-left:-50%;}
  #cont1 {margin-left:-45%}
  #cont2 {margin-left:-45%; min-width:90%; max-width:1200px}
}
@media screen and (min-width:1000px) {
  #contbg {margin-left:-36%;}
  #cont1 {margin-left:-35%}
  #cont2 {margin-left:-35%; min-width:750px; max-width:1200px}
  }

@media (max-height: 400px) and (min-width:599px)  {
  #contbg {top:60px; }
  #cont2 { top:60px; } 
  #logo {left: 0px; margin-top: 18px; width:250px;  background-image:url('images/Logo_wcccIII.png'); }
  .link {width: 210px; height: 27px; }

  #contbg {margin-left:-50%;}
  #cont1 {margin-left:-45%}
  #cont2 {margin-left:-45%; min-width:90%; max-width:1200px}
} 
  
#ListBox {margin:0px 0px 40px 0px; width:75%; background-color:rgba(255, 255, 255, 0.50); float:left; border-left: 2px solid rgb(181, 0, 57) ;line-height:150%;}

@media screen and (min-width:000px) and (max-width:499px) {
  #contbg {top:60px; }
  #cont2 { top:60px; } 
  #logo {left: 0px; margin-top: 18px; width:250px; background-image:url('images/Logo_wcccIII.png'); }
  .link {width: 210px; height: 27px; }

  #ListBox {width:95%; }
  #cont3 { padding-left:20px; padding-right: 20px;}
  #Home, #Coaching, #Counseling, #Consulting, #Wozu, #Wer, #Wie, #contact {margin-left:20px; }
  #footerI   { padding-left:20px; }
  #ImgBox {float:left; margin-left: 0px; }
  }
@media screen and (min-width:500px) and (max-width:799px) {
  #ListBox {width:80%; }
  }
@media screen and (min-width:800px) {
  #ListBox {width:45%; }
  }

ul { list-style-type:square; font-size: 20px; font-weight: normal; color: #333333; margin:0px; margin-left: -20px; line-height:150%; }	

a  { text-decoration: none; font-family: Tahoma, Verdana, arial, helvetica, sans-serif; color: #000000; font-weight: bold }



body	{ padding:0px; margin:0px;   
        background-attachment: fixed;
        scroll-behavior: smooth; 
        overflow-x: hidden;
        font-family : Tahoma, Verdana, arial, helvetica, sans-serif;
}
::-webkit-scrollbar {  width: 8px;}
::-webkit-scrollbar-track {  background: #ffffff00; }  /* Track */
::-webkit-scrollbar-thumb { background:  rgba(255, 255, 255, 0); }  /* Handle */
::-webkit-scrollbar-thumb:hover {  background: rgb(181, 0, 57); }  /* Handle on hover */

#header    { height:50px; width: 100%; clear: both; position:fixed; top:0; left:0; margin: 0 auto; display: block; z-index: 3; }

img { border:0px; margin:0px; padding: 0px;}


