@charset "UTF-8";

/*
 * CGB.CSS
 * Atemo Internet Agentur 
 * www.atemo.de
 * (c) 2012
 * **********************
 *  Farbpalette
 * **********************
 * 	Flaeche:
 *   hellGrau : e9e9e9
 *   dunkel Blau : 005BAA
 *  Schrift:
 *   hellGrau (Schrift): 999999
 *   dunkelGrau: 666666
 *   link-blau: 005baa
 * 	 rot: eb1d2b
 */ 

/*============================================
	Typographie
=============================================*/

html, body, td, p, li, label { 
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size:11px;
	
}

p, .text {
	line-height:17px;
	margin: 0 0 10px 0;
}

h1 {
	font-weight: normal;
	font-size: 17px;
	color:#999999;
	margin:0;
	padding: 10px 0 9px 0px;
	line-height: 24px;
	height:23px;
}



h2,h2 a {
	padding:0; margin:0;
	font-size:14px;
	font-weight:bold;
	color:#666666;
	font-family:Arial, Helvetica, sans-serif;
	line-height:20px;
}
h2 a:hover {
	text-decoration:none;
}

h3 {
	font-weight: bold;
	font-size: 1.0em;
	padding: 5px 0 5px 0px;
} 
a {	text-decoration:none; 	color:#005baa }
a:hover {text-decoration:underline;}
table { border-spacing:0;  border-collapse:collapse; }
tr, td { vertical-align: top;  margin:0; padding:0; line-height:17px;}

.bold { font-weight:bold; }


#main ul {
	list-style:none;
	margin:0 0 11px 0;
	padding:0;
}
#main li {
	line-height: 160%;
	margin-left:10px;
	padding-left:14px;
}
#main ul li {
	margin-top:4px;
	background:url(images/li_bg.png) left -3px no-repeat;
}
#main .ce_text h2 { margin: 4px 0 8px 0; } 

.unterTitel {
	font-size:10px;
}


/*============================================
	Layout
=============================================*/
#header { background:url(images/header_bg.png) repeat-x; }
#header .inside {
	padding-top:11px;
	width:100%;
	overflow:hidden;
	height:74px;
}

#logo {  width: 373px; float:right; }
#container { }
#left .inside { padding: 42px 40px 0 0; }
#right .inside { padding: 42px 0 0 40px;}
#main .inside { }
#subContainer {
	
	height:20px;
	padding-bottom:2px;
	width:100%;
}
#igel a { 
	position:relative; top:-18px;
	background:url(images/igel.png);
	height:40px;
	width:70px;	
	display:block;
}
#igel a:hover {
	background-position: 0 -40px;
	
}
.printInfoWrapper { display:none;}
/*============================================
	Navigation
=============================================*/
#Navigation { 
	padding-bottom:80px;
}
#Navigation a { 
	color:#666666;
	display:block;
	padding: 8px 0;
	 
}
#Navigation a:hover {
	color:#005baa;
	text-decoration:none;
} 
#Navigation a.active,#Navigation a.trail  { 
	color:#005baa;
	font-weight:bold;	
}
#Navigation a.trail, #Navigation a.submenu.active {
	padding-bottom:3px;
}
#Navigation .level_1 li {
	border-top:1px #cccccc solid;
}
#Navigation li.last {
	border-bottom:1px #cccccc solid;
}

#Navigation .level_2 li {
	border:none;
	

}
#Navigation .level_2 li a {
	height:15px; 
	padding:3px 0;
}
#Navigation .level_2 li.last a  {
	margin-bottom: 5px;
	
	
}
#Navigation ul {
	list-style:none;
	margin:0;
	padding:0;
}
#Navigation ul.level_2 {
	padding: 0 0 0 13px;
}
#Navigation ul li {
	margin:0;
}
#Navigation ul.level_3 {
	display:none;	 
}
#footer ul.level_3 {
	display:none;	 
}
/* Suchfeld */

#suchfeld { float:left; margin:13px 0 0 0; height:25px;}
.mod_search { position:relative; }
.mod_search input { margin:0}
.mod_search input.text { color:#999999; border:1px #cccccc solid; border-right:0; height:17px; width:151px; font-size:10px; padding: 2px 0 1px 5px;  display:block;}
.mod_search input.submit.hover {
	background-position: 0 -22px;
}
.mod_search input.submit {   
  cursor:pointer;
  background: url(images/submit_suche.png) no-repeat;
  width:28px; 
  height:22px; 
  text-indent:-10000px; 
  color:#fff; 
  border:0; 
  position:absolute; 
  left:157px; 
  top:0px; 
  /*color: transparent;*/
  display:block;
  text-transform: capitalize;  /* This is the IE hack   */
  line-height: 999px; /* Set it higher than your image height */
  overflow: hidden; /* Hide the text */
 font-size: 0; /* FF2 doesn’t like the above */

}
/*============================================
	Footer
=============================================*/
#footer {
	border-top:2px #eb1d2a solid;
	padding-bottom:20px;
}
#footer .inside { 
	padding:3px 6px;
	margin-top:2px;
	background:#e9e9e9;
}
#footer ul {
	margin:0;
	padding:0;
	list-style:none;
	
}
#footer a { color:#545454; text-transform:uppercase;   font-size:11px; }
#footer a:hover,#footer ul.level_2 a:hover  { text-decoration:none; color:#383838 }
#footer li {  padding-right:26px;  font-weight:bold; float:left;  }
#footer ul.level_1 { width:100%; }
#footer ul .last { padding-right:0;}

#footer ul.level_2 { padding-top:5px;}
#footer ul.level_2 a  { color:#696969;  font-size: 10px; line-height:18px;  }
#footer .level_2 li { float:none; font-weight:normal; }

#footer li.last .level_2 { display:none; }


/*============================================
	Inhaltselemente
=============================================*/

.image_container { margin:0;}
.horizontalerStrich { width:100%; border-bottom: 1px solid #CCCCCC; margin-top:10px; }



#main p { color:#000 }
#right p { margin-top:0; }
#right .ce_image{ padding: 11px 0 9px 0; }
#right .ce_text { padding: 8px 0 8px 0;}
#right .ce_image,#right .ce_text, #right .mod_newsmenu    
{  border-top:1px #cccccc solid; }
#main h1.ce_headline, #main .trenner {
	border-bottom: 1px solid #CCCCCC;
	
}
#main h2.ce_headline {
	padding:10px 0 8px;
}
#main .ce_text {
	padding: 6px 0 10px;
} 
#container .mod_article .block { margin-right:0;}
#main .ce_text figure.float_left { margin:4px 11px 0 0 ; }
#main .ce_text figure.float_right { margin:4px 0 0 11px ; }
#main .abstand { margin-top:11px;}
#main .ce_download { margin: 1px 0;}
#main .ce_download.abstand { margin-top:15px;}
#main .ce_download img { float:left; }
#main .ce_download a.text { margin: 4px 0 1px 22px; display:block; }
#main .pagination p { margin: 17px 0 0 0; float:left;}
#main .pagination ul { margin: 17px 0 0 0; float:right;}
#main .pagination li { background:none; float:left; margin:0; }
#main .pagination .last,#main .pagination .first  { display:none;}
/*============================================
	Startseite
=============================================*/
#aktuelles .mod_newslist h2 { margin: 8px 0;}
.news_startseite { margin: 0 0 10px 0; padding: 0 0 0 10px; 
	background:url(images/li_bg.png) left -3px no-repeat;
	}
.news_startseite p { margin:0; }
#main .news_startseite p.info,#main .news_startseite p.info a { color:#666666; font-size:10px;}
/*============================================
	News / Pressemitteilungen
=============================================*/
.mitteilungKurzform .image_container {
	padding: 4px 11px 0 0;
	height:100px;
	width:100px;
	overflow:hidden;
	float:left;
	
}
.mitteilungKurzform .newsInhalt {
	
	margin-left:111px;
}
.mitteilungKurzform p  {
	margin:0;
	
}
.mitteilungKurzform p.info {
	font-size:10px;
	margin:2px 0 0 0;
}
.mitteilungKurzform { border-top: 1px solid #CCCCCC; padding: 6px 0 10px 0; clear:left;}

#main .mod_newslist h2 { margin:4px 0;  }
#main .mod_newslist .mitteilungKurzform h2 { margin:0; width:375px; padding:0;}
#main .mod_newslist .neu { background:url('images/neu.gif') right 11px no-repeat;}
#main .mod_newslist .last { border-bottom: 1px solid #CCCCCC; }
/* Leseansicht einer Nachricht */
#main .mod_newsreader { margin: 11px 0 0 0; }
#main .mod_newsreader h2 {margin: 0 0 3px 0;}
#main .mod_newsreader .image_container { width:100px; float:left; padding:4px 11px 11px 0;}

#right .mod_newsreader p { margin:0; }
#right .mod_newsreader .back { display:none; }
#right .newsImage { text-align:center;}


.cgbIntern .image_container { margin-top:2px;}
.cgbIntern a { text-decoration:underline;}
.cgbIntern a:hover { text-decoration:none; }

.roteSchrift {
	color:#eb1d2b;
	text-decoration:none;
}


/*============================================
	Such / Suchergebnisse
=============================================*/
#main .mod_search form {
	display:none;
}
#main .mod_search h3 { 
	margin-bottom:0;
	padding-bottom:0;
}
#suche .formbody {
	 
}
#suche p.header { padding-top:6px; }
#suche .url { display:none; }
#suche .odd,#suche .even { 
	border-bottom:1px #cccccc solid;
	padding-bottom:20px;
	} 
	
/*============================================
	Die Downloadseite
=============================================*/
.ce_download .mime_icon {
	position:relative;
	top:3px;
} 
/*============================================
	Bundesvorstand
=============================================*/ 
.ansprechpartnerListe .ansprechpartner { margin:11px 4px 11px 0; width:262px; float:left; position:relative;}
.ansprechpartnerListe .ansprechpartner img { float:left;}
.ansprechpartnerListe .ansprechpartner div.info {	margin-left:110px; } 
.ansprechpartnerListe .ansprechpartner a.kurzbiographie { position:absolute; top:107px; left:111px}

/*============================================
	Das Kontaktformular
=============================================*/

.ce_form h2 {margin-bottom:13px; }

/*------------------------------------------------------------------------------------------------------
* Label & Input untereinander
------------------------------------------------------------------------------------------------------*/

/*     --wrapper
------------------------------------------------- */
.input-wrapper {margin-bottom: 10px;}

/*     --fieldset
------------------------------------------------- */
fieldset {margin-bottom: 25px;}

/*     --rahmen
------------------------------------------------- */
input, select, textarea {border: 1px solid #ccc;}

/*     --felder
------------------------------------------------- */
input {padding: 5px; width: 200px; margin: 0 0 10px 0;}
label {float: left; width: 100%; }
select {width: 212px; height: 24px; margin-bottom:10px;}
textarea {width: 200px; height: 108px; margin-bottom:10px; padding:5px;}
legend {display: none;}


.ce_form input.text{ line-height:normal; height:13px; }
 
/*     --submit-button
------------------------------------------------- */

.submit_container input {cursor: pointer;  width: 211px; }

/*     --radio-buttons
------------------------------------------------- */
.radio_container span {display: block; margin-bottom: 5px;}
.radio_container label {float: none;}
.radio_container input {width: 20px; border: none;}
label.radio-button {float: none; display: block; margin-bottom: 10px;}

/*     --checkboxes
------------------------------------------------- */
.checkbox_container span {display: block; margin-bottom: 5px;}
.checkbox_container label {float: none;}
.checkbox_container input {width: 20px; border: none;}
label.checkbox {float: none; display: block; margin-bottom: 10px;}


/*------------------------------------------------------------------------------------------------------
* Label & Input Felder nebeneinander
* formular muss die CSS-Klasse "columnar" in Contao hinzugefŸgt werden
------------------------------------------------------------------------------------------------------*/

/*     --labels
------------------------------------------------- */
.columnar label {width: 120px; }
.columnar label.radio-button {display: inline; float: left;}
.columnar input.captcha {  width:50px; }

/*     --radio-buttons
------------------------------------------------- */
.columnar .radio_container {margin-left: 120px;}
.columnar .radio_container, .columnar .checkbox_container {margin-top: 1px;}

/*     --checkboxes
------------------------------------------------- */
.columnar label.checkbox {display: inline; float: left;}
.columnar .checkbox_container {margin-left: 120px;}

/*     --submit-button
------------------------------------------------- */

.captcha_text { font-size:90%; display:block; }

.columnar .submit_container input {margin-left: 120px;}

 
/*============================================
	Buchstaben ABC
=============================================*/	

#main .zweiDrittelRechts, #left .zweiDrittelRechts  { width: 290px; float:right;}
#abc {}

.begriffListe { width:150px;  float:left; }
.begriffListe a {display:block; }
#ABCtexte { margin-left:150px; padding-left:10px; }
#buchstabenListe { padding:0 10px; height:50px;	}
#buchstabenListe a { text-align:center;  color:#404040; display:block;  width: 18px;  float:left; line-height:51px;}
#buchstabenListe a {}
#buchstabenListe a.inactive { color:#999999 }
#buchstabenListe a.active { font-size:20px;}
#buchstabenListe a:hover {
	 
}

.weiter { }

	
/*============================================
	Archiv
=============================================*/

#archivliste p.info { margin:0; float:left; display:block; width:85px; }
#archivliste h3 { float:left; width:382px; margin:2px 0 0 0; padding:0; font-weight:normal; }
#archivliste h3 a,#archivliste h3 a:hover { text-decoration:none; color:#666; }
#archivliste h3 a:hover { color: #000; }
#archivliste .more { margin-left:486px;}  
#archivliste .last  { border-bottom: 1px solid #CCCCCC; }


#right ul {
	list-style:none;
	margin:0;
	padding:0;
}
#right li {
	line-height: 160%;
	width:100%; 
	
}
#right .mod_newsmenu { padding:9px 0 11px 0;}
#right .mod_newsmenu h3 {margin:0;}
#right .mod_newsmenu li a, #right .mod_newsmenu li span { display:block; padding: 2px 0 0 8px; }
#right .mod_newsmenu .year { padding:0 0 8px 0;}

#cgbinternArchiv .jahr { width:50%; float:left; height:320px; }
	
/*============================================
	Sonstige Unterseiten
=============================================*/

#einzelgewerkschaften { }
.gewerkschaft { margin:0 0 40px 0; }
.gewerkschaft h3 { 	padding:0; 	margin:20px 0 5px 0; 	 }
.gewerkschaft table {	padding:0;	}

.gewerkschaft table .first { 	width:80px;}
.gewerkschaftslogo { width:95px; float:left; }
.gewerkschaftslogo img { margin-top:6px;}
.gewerkschaft .adresse {	width:160px; float:left; }

#cgb-service-club table { width:228px; }
#cgb-service-club table td:first-child {width:30%; }

#downloads h3 { margin-bottom:0;}
#rechtliches .size {display:none;}
#broschueren .size {display:none;}

#main div.biograhpieText { padding-top:7px;}

#podiumsdikussion h3 { margin-top:0; padding-top:0; line-height:17px; color:#666; }				
#presse .size, #grussworte .size { display:none; }				
				
/*-----------------------------------------------------------------------------------------------*/
/*                                         TOOLTIP STYLES                                        */
/*-----------------------------------------------------------------------------------------------*/

.tip {
	width: 212px;
	padding-top: 32px;
	padding-left: 4px;
	overflow: hidden;
	display: none;
	position: absolute;
	z-index: 500;
	background: transparent url(images/tipTop7.png) no-repeat top;
	background-position:4px 0px;
	}
.tipMid {background: transparent url(images/tipMid7.png) repeat-y; padding: 0 10px 0px 10px;}
.tipBtm {background: transparent url(images/tipBtm7.png) no-repeat bottom; height: 32px;}
.tipMid p { position:relative; top: -20px; margin:0; padding:0;}