/********************************************* base css *************************************************************/

div.cq_flex a {
    color: #454543;
}

div.inline_clear {
    clear: left;
}

div.clear {
    clear: both;
}

div.font-weight-bold {
    font-weight: bold;
}

table .margin-left-10px {
    margin: 0 0 0 10px;
}


/* part of pi8 template but may occurs in all kinds of different contexts */
/* see q_flex/Configuration/TypoScript/PageTsConfig/pageTsConfig.ts */
div.ob_header_title {
    margin: 0 0 15px 0;
    width: auto;
    height: 13px;
    padding: 5px 14px;
    background: #ECECED;
    color: #3B3C40;
    font-weight: bold;
    clear: both;
}

/******************************************* pi1 Großes Bild + Linkliste rechte Spalte *****************************/

div.cq_flex_pi1 {
    margin-bottom: 12px;
    width: 100%;
    color:#454543;
    padding-bottom: 15px;
}

div.cq_flex_pi1.grey {
    background-color: #E3E3E3;
}

div.cq_flex_pi1.green {
    background-color: #E2E6C3;
}

div.cq_flex_pi1 img {
   	background-color: #E3E3E3;
    padding-top: 3px;
}

div.cq_flex_pi1 div.title {
   margin: 10px 0 10px 12px;
}

div.cq_flex_pi1 div.title-noimage{
   padding: 15px 0 0 0;
   margin-top: 0;
}

div.cq_flex_pi1 div.text {
	margin: 0 0 0 10px;
	font-size: 0.9em;
}

div.cq_flex_pi1 div.text-noimage {
	padding: 0 0 10px 0;
}

/* 20170728: one remains of linklist-styling for cq_flex pi1 */
div.cq_flex_pi1 div.linklist {
    font-size: 12px;
    margin: 10px 0 10px 12px;
  	padding: 0 0 10px 0;
}


/******************************************* pi2 Kleines Bild + Text + Link rechte Spalte *****************************/

div.cq_flex_pi2 {
 	height: 112px;
    padding: 0 0 12px;
    width: 100%;
}

div.cq_flex_pi2 a {
    text-decoration: none;
}

div.cq_flex_pi2 div.title {
  	background-image: url("Images/box-header.jpg");
    background-repeat: no-repeat;
    height: 22px;
    color: #333333;
    font-size: 11px;
    text-transform: uppercase;
}

div.cq_flex_pi2 div.title h2 {
    padding: 6px 0 0 8px;
}

div.cq_flex_pi2 div.title .noimage {
  	padding-top: 10px;
}

div.cq_flex_pi2 div.content {
  	background-color: #FFFFFF;
    border-bottom: 1px solid #DADADA;
    float: left;
    font-size: smaller;
    height: 90px;
    overflow: hidden;
    padding: 0 0 0 12px;
    width: 50%;
}

div.cq_flex_pi2 div.content div.subtitle {
  	font-size: 11px;
  	font-weight: bold;
    line-height: 1.1;
    padding-bottom: 10px;
    padding-top: 4px;
}

div.cq_flex_pi2 img {
  	float: right;
    overflow: hidden;
}

/******************************************* pi3 Kleine Blöcke zweispaltig Bild mit Link *****************************/

div.cq_flex_pi3inline  {
    border-top: 1px solid #D5D5D5;
    color: #454543;
    height: 52px;
    padding: 8px 0;
    float: left;
    margin: 0 0 5px 0;
}

div.cq_flex_pi3inline.right {
	margin-left: 33px;
}

div.cq_flex_pi3 div.border {
	 border-bottom: 1px solid #D5D5D5;
}


div.cq_flex_pi3inline div.col_left {
	float: left;
	overflow: hidden;
    padding-right: 16px;
    width: 102px;
}

div.cq_flex_pi3inline div.col_right {
	float: left;
	overflow: hidden;
    width: 120px;
}

div.cq_flex_pi3inline div.col_right_full {
	float: left;
	overflow: hidden;
	width: 238px;
}

/****************************************** pi4 Textblöcke zweispaltig mit Text und Link  ****************************/

div.cq_flex_pi4 {
 	margin-bottom: 20px;
 	width: 100%;
}

div.cq_flex_pi4inline  {
	
    border-top: 1px solid #D5D5D5;
    color: #454543;
    float: left;
   
    padding: 11px 0;
    width: 238px;
    font-size: 11px;
}

div.cq_flex_pi4 div.border {
	 border-bottom: 1px solid #D5D5D5;
}

div.cq_flex_pi4inline.right  {
	margin-left: 33px;
}

div.cq_flex_pi4inline div.title {
	padding-bottom: 7px;
	font-weight: bold;
}

div.cq_flex_pi4inline div.text {

}

/******************************************* pi5 Großer Block mit Bild, Text und Link ********************************/

div.cq_flex_pi5 {
    margin-bottom: 20px;
}

div.cq_flex_pi5inline {
	border-bottom: 1px solid #DADADA;
    color: #454543;
    float: left;
    margin-bottom: 7px;
    padding: 0 0 7px;
    width: 100%;
}

div.cq_flex_pi5inline div.col_left {
	width: auto;
	float:left;
	
}

div.cq_flex_pi5inline div.col_left img {
	height: 95px;
    padding-right: 22px;
    width: 155px;
}

div.cq_flex_pi5inline div.col_right {
	float: none;
    overflow: hidden;
    width: auto;
    padding-top: 15px;
	
}

div.cq_flex_pi5inline div.col_right div.title {
	font-size: 17px;
	line-height: 1;
    font-weight: bold;
    padding-bottom: 11px;
	
}

/******************************************** pi6 Dreierblock Bild mit Text und Link **********************************/

div.cq_flex_pi6 a {
    text-decoration:none;
}

div.cq_flex_pi6 {
	width: 550px;
}

div.cq_flex_pi6inline {
	float: left;
  	width: 155px;
  	background-color: #E8E8E8;
    overflow: hidden;
    margin: 0 22px 20px 0;
}

div.cq_flex_pi6inline img{
	overflow: hidden;
    width: 100%;
    height: 100%;
}

div.cq_flex_pi6inline div.text{
	font-size: 11px;
    margin: 8px;
    overflow: hidden;
}


/******************************************** pi7 Weitere Infos zum Thema *******************************************/

div.cq_flex_pi7 {
    color: #454543;
    list-style: none outside none;
    margin-bottom: 20px;
    overflow: hidden;
}

div.cq_flex_pi7 div.header {
	border: 1px solid #dadada;
	border-left: 0;
	border-right: 0;
	padding: 5px 0 6px 10px;
	width: 99.9%;
	
}

div.cq_flex_pi7 div.content {
	background-color: #F0F4F7;
    float: left;
    padding: 5px 0 0 10px;
    width: 100%;
}

div.cq_flex_pi7 div.content div.title {
	color: #626262;
    position: relative;
    font-weight: bold;
}



/******************************************** pi8 OB Galerielinkliste *******************************************/
/* -------------- same styling for standard-pages and OB-pages (only ever occurs on OB-pages though) ----------- */

/* look at:  http://hamm.de/ob/persoenlich.html */
div.cq_flex_pi8 div.box-right{
    padding-left: 84px;
}

div.cq_flex_pi8 div.box-right div.title{
   margin-bottom: 0.6em;
}

div.cq_flex_pi8 div.content {
	padding: 0 10px 10px 14px;
}

div.cq_flex_pi8 div.header {
	width: auto;
	height: 13px;
	padding: 5px 14px;
	background: #ECECED;
	color: #3B3C40;
	font-weight: bold;
	clear: both;
	margin-bottom: 5px;
    float: none;
}

div.cq_flex_pi8inline {
	border-bottom: 1px solid #DADADA;
	width: 235px;
	height: 52px;
	margin: 5px 0;
	float:left;
	padding: 4px 0 4px;
}


div.col2 div.cq_flex_pi8inline:nth-child(-n+2) {
	border-top: 1px solid #DADADA;
}
div.col3 div.cq_flex_pi8inline:nth-child(-n+1) {
    border-top: 1px solid #DADADA;
}

div.cq_flex_pi8 div.cq_flex_pi8inline:last-child {
	margin-bottom: 20px;
}

div.cq_flex_pi8inline.right {
	float: right;
}

div.cq_flex_pi8inline div.image {
	float: left;
	width: 79px;
}

div.cq_flex_pi8inline div.date {
	color: #626262;
	float: left;
	width: 130px;
	margin: 0 0 0 5px;
	font-size: 10px;
}

div.cq_flex_pi8inline div.title {
	color: #454543;
	width: 130px;
	font-size: 11px;
	margin: 7px 0 0 0;
	font-weight: bold;
	height: 17px;
	text-align: left;
    line-height: 1em;
}

div.col3 div.cq_flex_pi8 div.content {
    padding: 0 10px 10px 11px;
}




/******************************************** pi9 Hinweisblock, Adressenblock, Bildnachweis *******************************************/

div.cq_flex_pi9 div.title-hinweisblock {
	background-color: #FFFFFF;
	border-bottom: 1px solid #DADADA;
	border-top: 1px solid #DADADA;
	font-weight: bold;
	padding: 0.5em 0.9em;
}

div.cq_flex_pi9 div.title-adressblock {
	font-weight: bold;
	background-color: #ededed;
	line-height: 24px;
	padding-left: 12px;
}

div.cq_flex_pi9 div.content {
   	background-color: #F0F4F7;
	margin-bottom: 10px;
	overflow: hidden;
	padding: 10px 12px;
	width: 486px;
}

div.cq_flex_pi9 div.content ul {
    line-height: 1.4em;
}

div#sidebar-right-inner div.cq_flex_pi9 div.content {
    background-color: #F0F4F7;
    margin-bottom: 10px;
    overflow: hidden;
    padding: 10px 12px;
    width: auto;
}

div.cq_flex_pi9 div.content div.text {
}

div.cq_flex_pi9 div.fulltext p{
    line-height: 1.3em;
    margin-top: 10px;

}

div.cq_flex_pi9 div.content div.image {
	float: right;
	max-width: 155px;
    margin: 0 0 0 20px;
}

div.cq_flex_pi9 div.content img {
	
}


div.cq_flex_pi9 div.imagelistheader {
	
}

div.cq_flex_pi9 div.imagelistheader span.label {
	background: url('Images/bild_schwarz.gif');
    background-repeat: no-repeat;
	background-position: 0 2px;
	color: #9b9b9b;	
	padding-left: 14px;
}

div.cq_flex_pi9 div.imagelistitems {
	color: #9B9B9B;
	margin: 5px 0 20px 0;	
}

div.cq_flex_pi9 span.imagelist_author {
    padding: 0 5px 0 0;
}

div.cq_flex_pi9 div.imagelistnotice{
    margin-top: 0.6rem;
}


/***************************** pi10 Template rechte Spalte ************************************************/

div.cq_flex_pi10 {
    min-height: 200px;
    padding-left: 10px;
    margin-bottom: 12px;
    padding-bottom: 8px;
}

div.cq_flex_pi10.orange{
    background-color: #e38b27;
}

div.cq_flex_pi10.blue{
    background-color: #022c50;
}

div.cq_flex_pi10.green{
    background-color: #c9d200;
}

div.cq_flex_pi10 .image{
    height: 150px;
    overflow: hidden;
}

div.cq_flex_pi10 .text{
    padding-top: 10px;
    font-size: 16px;
    padding-bottom: 10px;
    line-height: 1.1;
    font-weight: bold;
}

div.cq_flex_pi10 .textblock{
    padding-top: 160px;
}

div.cq_flex_pi10 .text.black{
    color: #000000;
}

div.cq_flex_pi10 .text.white{
    color: #FFFFFF;
}


/******************************************** pi13 Akkordeons *******************************************/

div.cq_flex_pi13 {
    color: #454543;
    list-style: none outside none;
    margin-bottom: 20px;
    overflow: hidden;
}

div.cq_flex_pi13 div.header {
    border: 1px solid #dadada;
    border-left: 0;
    border-right: 0;
    padding: 5px 0 6px 10px;
    width: 99.9%;

}

div.cq_flex_pi13 div.content {
    background-color: #F0F4F7;
    float: left;
    padding: 5px 0 0 10px;
    width: 100%;
}

div.cq_flex_pi13 div.content div.title {
    color: #626262;
    position: relative;
    font-weight: bold;
}