body
{
 font-family:arial, serif;
 color:#666;
 font-size:14px;
 margin:0;
 padding:0;
 background:#EEE; 
}

#header
{
 height:400px; 
 width:100%; 
 background:url(help_header.jpg) center no-repeat; 
 background-size:cover; 
 padding-top:50px; 
 z-index:500;   
}

.scrollup
{
 width:50px;
 height:50px;
 background:#710E7B url(scrollup.png) center no-repeat;
 background-size:80% 80%;
 color:#FFF;
 position:fixed;
 bottom:16%;
 right:5%;
 display:none;
 cursor:pointer;
}

#popup_close
{
 float:right; 
 height:30px;
 width:30px;  
 background: url(close.png) center no-repeat;  
 cursor:pointer; 
}


#overlay 
{
 position:fixed;
 top: 0;
 left: 0;
 bottom: 0;
 right: 0;
 width: auto;
 height: auto;
 margin:auto;
 background: #111;
 opacity:0.8;
 z-index:700;
}  

#popup 
{
 position: fixed;
 top: 0;
 left: 0;
 bottom: 0;
 right: 0;
 width: 52%;
 height: 52%;
 margin: auto;
 padding:20px;
 background:#FFF;
 overflow-y:auto;
 line-height:24px;
 color:#333;
 z-index:1000;
} 

#pg_container  
{  
 clear:both;   
 margin: 20px auto;
 position: relative;
 text-align:center;
}  
   
.pg_default 
{  
 display:inline-block;   
 background:#710E7B; 
 padding:10px; 
 color:#FFF;
 font-size:18px;  
 text-align:center;
 margin:0 20px 20px 0;
 cursor:pointer;
} 

.pg_default a
{
 color:#FFF;
 text-decoration: none;   
}

.pg_current
{  
 display:inline-block;   
 background:#FFF; 
 padding:10px; 
 color:#999;
 font-size:18px;  
 text-align:center;
 margin:0 20px 20px 0;
} 

.pg_disabled
{  
 display:inline-block;   
 width:16px; 
 height:16px; 
 background:#DDD; 
 padding:12px; 
 color:#333;
 font-size:16px;  
 text-align:center;
 margin:0 20px 20px 0;
 /*cursor:pointer;*/
 border:1px solid #DDD;
} 

/*DSGVO*/
#dsgvo_once
{
 position:fixed;
 left:100px;
 bottom:150px;
 width:400px;
 color:#FFF;
 font-size:14px;
 line-height:24px;
 background-color:#333;
 padding:20px;
 z-index:99999;
}

#dsgvo_button, #decline_button 
{
 width: 90px; /*S*/
 height: 22px;
 margin:20px 0 0 20px;/*S*/ 
 padding:8px; 
 color:#FFF;
 float:right;
 text-align:center; 
 background:#710E7B;
 cursor: pointer;
}
/**/

.button
{
 background:#710E7B; 
 padding:8px; 
 color:#FFF; 
 width:150px; 
 margin:20px 0;
 font-size:16px;
 letter-spacing:1px;
 text-align:center;
 text-transform:uppercase;
 cursor:pointer; 
}

.button a
{
 color:#FFF;
 text-decoration:none;
} 

.chkoff
{
 /*display:block;*/  
 margin:0 0 20px 0;
 background:url(chkoff.png) center left no-repeat;
 background-size:25px 25px;
 color:#888;
 padding:10px 0 0 30px;
 height:30px;
 font-size:18px;
 appearance: none;
 cursor:pointer; 
}

.chkon
{
 /*display:block;*/  
 margin:0 0 20px 0;
 background:url(chkon.png) center left no-repeat;
 background-size:25px 25px;
 color:#888;
 padding:10px 0 0 30px;
 height:30px;
 font-size:18px;
 appearance: none;
 cursor:pointer; 
} 
#alpha
{
 width:80%; 
 text-align:center; 
 line-height:50px; 
 /*border-top:1px solid #710E7B; 
 border-bottom:1px solid #710E7B;*/ 
 margin:50px auto; 
 padding:50px 0   
}

.alpha
{
 margin:auto 10px; 
 font-size:20px; 
 text-decoration:none; 
 background:#FFF; 
 padding:6px 10px; 
}

h4
{
 color:#666;
 height:22px;
 position:fixed;
 background:#FFF;
 width:52%; 
 padding:20px 0;
 text-align:left;
 font-size:22px; 
 margin:-20px 0 0 0;
 letter-spacing:2px;
 text-transform: uppercase;
 border-bottom:1px solid #999;
}

.main_container
{
 width:100%; 
 min-height:600px; 
}

.main_center
{
 margin:0 auto; 
 width:1100px; 
 height:auto; 
 padding:50px 30px; 
}

.topic
{
 margin:0 0 80px 0; 
 font-size:32px; 
 color:#666;
 line-height:40px;
 text-align:center;
 letter-spacing:3.0px; 
 text-transform:uppercase;
}

a
{
 color:#710E7B;    
}

p
{
 color:#666;
 font-size:16px;   
 text-align:center;
 line-height:32px;  
 margin:20px 0 20px 0;  
}

.cat_box
{
 float:left; 
 width:300px;
 margin:0 15px 50px 40px;   
 cursor: pointer;
 border-radius:0 0 4px 4px;
}

.cat_name
{
 padding:10px 20px; 
 color:#FFF; 
 min-height:34px;
 max-height:34px;
 font-size:14px;
 font-weight:normal;
 background:#333;
 line-height:18px;
 letter-spacing:1px;  
 overflow:hidden;  
}

.cat_name a
{
 color: #FFF;   
 cursor: pointer; 
 display: block;
 text-decoration: none;  
}

.cat_desc
{
 padding:20px; 
 font-size:14px; 
 line-height:25px; 
 min-height:100px !important;
 max-height:100px !important;
 overflow:hidden;   
}

.cat_img
{
 height:180px;
}

.cat_box .cat_img
{
 transition: all 1s; 
}

.cat_box:hover .cat_img
{
 transform:scale(1.2);
}

.cat_box .cat_desc
{
 background:#FFF; 
}

.zhover
{
 overflow:hidden;    
}

.flink, .clink
{
 color:#999;
 font-size:14px;  
}   
 
.flink a, .clink a
{
 color:#EEE;  
} 

textarea
{
 font-family:arial, serif;
 width:60%; 
 height:250px; 
 font-size:16px; 
 padding:8px; 
 margin:0 auto 20px auto;
 color:#666; 
 border: 1px solid #CCC; 
}

input
{
 width:60%;
 font-size:16px; 
 padding:8px; 
 margin:0 auto 20px auto;
 color:#666; 
 border: 1px solid #CCC;   
} 

@media only screen and (max-width: 1024px) 
{
 
 .main_center
 {
  width:100%;
  padding:0 0 30px 0;  
 }

 .scrollup
 {
  width:45px;
  height:45px;
 }

 #header
 {
  height:250px; 
  padding-top:20px;
 }
 
 .topic
 {
  font-size:20px; 
  line-height:26px;
  margin:30px 3% 20px 3%; 
 }

 .cat_box
 {
  width:88%;
  margin:6%; 
 }

 .cat_img
 {
  height:200px;   
 }
 
 .cat_desc
 {
  min-height:10px !important;  
 }

 #dsgvo_once
 {
  position:fixed;
  left:1%;
  bottom:1%;
  width:88%;
 }

 .chkoff
 {
  padding:12px 0 0 30px;
  margin:0 0 20px 40px;
  background-size:22px 22px;
 }

 .chkon
 {
  padding:12px 0 0 30px;
  margin:0 0 20px 40px;
  background-size:22px 22px;
 }

 #alpha
 {
  width:88%; 
  line-height:50px; 
  margin:40px auto; 
  padding:40px 0   
 }

 #popup
 {
  width:85%;
  height:88%;
  padding:20px;
 }

 #popup_close 
 {
  height:24px;
  width:24px;  
 }

 h4
 {
  width:85%;   
  font-size:20px; 
  /*margin:-20px 0 20px 0;*/
 }

 p
 {
  line-height:30px;  
  margin:20px 5%;  
 }
 
 .non_responsive
 {
  display:none;  
 }
 
 .flink, .clink
 {
  font-size:12px;  
 }   

 textarea
 {
  width:92%; 
  height:200px; 
 }

 input
 {
  width:92%;
 }
 
}