/*Veranstaltungen*/


#okveranst {
    font-family: Tahoma, Arial, sans-serif;
    font-size: 110.00%; 
    line-height: 1.5em;
    color: #6c6f6e;
    /*background: url(../common/chalk_bg_tafel.jpg) repeat scroll 0 0 #000000;*/

  } 
  
#okveranst .ym-gbox {
    padding-right: 10px;
}

#okveranst .ym-g67 {
    width: 67.5%;
}

#okveranst .g76{
	 width:76.5%;
}

#okveranst .preview h2 {font-size: 24px;font-weight:normal;margin-bottom: 15px; }

#okveranst .veranst {border-bottom:1px #107baf solid; /*padding-bottom:2em;*/ position:relative; padding-bottom:3em; padding-top: 1em;}
#okveranst .veranst .ticket {position:absolute; bottom:6px; right:0px}
#okveranst .veranst .title {font-weight:bold; margin-bottom:0.5em}

#okveranst .veranst .veranstdetails .title {font-size:1.1em; color:#107baf}
#okveranst .veranst .veranstcat {padding:0px; text-align:right}


#okveranst .veranstimg img{ 
    width:100%;
    /*max-width: 179px;*/ max-width: 100%; /*damit die Bilder im IE8 sich verkleinern, http://www.seelbach-online.de/seelbach/veranstaltungskalender/index.php?navanchor=2110022*/
    height: auto;
}

#okveranst .veranstdetail .button {
	color: #555;
    padding: 4px 20px 4px 15px;
    /*background:url(../common/bg_button_grey2.jpg) repeat-x top left;*/
    background-size:20px 80px;
    background-color: #b6b6b6;    
    background: -moz-linear-gradient(
        top,
        #d4d4d4 0%,
        #b6b6b6);
    background: -webkit-gradient(
        linear, left top, left bottom, 
        from(#d4d4d4),
        to(#b6b6b6));
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    -moz-box-shadow:
        0px 0px 0px rgba(000,000,000,0),
        inset 0px 0px 2px rgba(255,255,255,1);
    -webkit-box-shadow:
        0px 0px 0px rgba(000,000,000,0),
        inset 0px 0px 2px rgba(255,255,255,1);}
        
        
#okveranst .veranstdetail .ticketbutton { background-size: auto;}
#okveranst .veranstdetail .button {position:relative; margin-top:1em; padding: 4px 20px 4px 10px;}
#okveranst .veranstdetail .firstbutton {margin-top:0em}
#okveranst .veranstdetail .button a {color: #555;}
#okveranst .veranstdetail .details .ym-gbox {padding-left:0px}
#okveranst .veranstdetail .button img {position:absolute; right:0px; top:9px; padding-right: 0.7em;}
#okveranst .veranstdetail .buttoncontent {padding:10px; background:#eaeaea; font-size:0.9em; position:relative}
#okveranst .veranstdetail .buttoncontent a {text-decoration:underline}
#okveranst .veranstdetail .ticketbutton {color:#fff; background:#107BAF url(img/tickets.png) no-repeat 5px 4px; padding-left:45px; border:0px}
#okveranst .veranstdetail .ticketbutton a, .veranstdetail .buytickets a {color:#fff!important}
#okveranst .veranstdetail .buytickets {color:#fff; background:#107BAF; padding:2px 8px; bottom:10px; position: absolute; right:10px; font-size: 0.9em;}
#okveranst .veranstdetail .buytickets a {text-decoration:none}
#okveranst .veranstdetail .ticketbuttoncontent {padding:6px}
#okveranst .quelle-netmuseum {font-weight:bold; margin-top:25px;}
#okveranst .veranstdetail .navlink-container {max-width:350px; margin: auto;}
#okveranst .veranstdetail .navlink-container .navlink {margin-top:30px;}
#okveranst .veranstdetail .navlink-container .navlink-uebersicht {text-align:center;}
#okveranst .veranstdetail .navlink-container .navlink-next {text-align:right;}
#okveranst .veranstdetail .video-box-container {margin-top:20px;}
#okveranst .veranstdetail .video-box-container .navlink  {text-align:left; font-size:13px; margin-bottom: 0px;}


/* PAGER */

.okpager{
    width: 100%;
}

.okpagernav {
    margin: auto;
    text-align: center;
   /* width: 300px;*/
    font-size: 16px;
}

.okpagernav img {
    height: 10px;
    margin: 0 5px;
    width: 13px;
}

.okpagernav  a.browse {
    /*background: url("../../icons/hori_large.png") no-repeat;*/
    display:block;
    width:30px;
    height:30px;
    float:left;
    margin:40px 10px;
    cursor:pointer;
    font-size:1px;
}

.okpager .footerHome{
    float: right;
}

/* right */
.okpagernav a.right { background-position: 0 -30px; clear:right; margin-right: 0px; margin-top: 9px;}
.okpagernav a.right:hover { background-position:-31px -30px; }
.okpagernav a.right:active { background-position:-61px -30px; }
/* left */
.okpagernav a.left { margin-left: 0px; margin-top: 10px;}
.okpagernav a.left:hover { background-position:-31px 0; }
.okpagernav a.left:active { background-position:-61px 0; }

.pagenumber {
    color: #107BAF;
    float: left;
    font-size: 16px;
    margin: 13px 0 0 4px;
}






.more {position:absolute; bottom:2em; right:0px; }
.more a{text-decoration: underline;}

.wco_error, .wco_succ{
    border: 1px solid;
    display: none;
    font-weight: bold;
    margin-bottom: 10px;
    padding: 5px;
    text-align: center;
    width: auto;
}
.wco_error{
    color: #D5908E;
}
.wco_succ{
    color: #8FDA8E;
}
/* ---  VERANSTALTUNGEN ----*/

.wco_accordeon {
 /* display: none;*/
  background-color: #EEEEEE;
  padding: 6px;
}
   
p.navlink {
    font-size: 16px;
    text-align: center;
}

.wco_sitelinks {
    color: #107BAF;
    float: left;
    font-family: verdana;
    font-size: 10px;
    margin: 15px 2px 5px;
    width: 100%;
}

.wco_sitelinks a{
    text-decoration: underline;
    padding: 0 3px;
}

.wco_sitelinks a:hover{
    color: #D2916C;
}

.wco_event_back{
    float: right;
    margin: 10px 15px 0px
}

.veranstimg img{ 
    width:100%;
    /*max-width: 179px;*/ max-width: 100%; /*damit die Bilder im IE8 sich verkleinern, http://www.seelbach-online.de/seelbach/veranstaltungskalender/index.php?navanchor=2110022*/
    height: auto;
}

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

#sponsors {
    font-weight: bold;
    text-decoration: underline;
    margin: 15px 0;
}

#sponsors a{ color: #6C6F6E;}

  
  /*Button Links*/
#okveranst .button a {display:block; font-size:1em; color:#107BAF; background:transparent; font-weight:bold; text-decoration:none}
#okveranst .suche .button a {display: inline;}
#okveranst .button a:focus,
#okveranst .button a:hover,
#okveranst .button a:active {color:#907BAF; background-color: transparent; text-decoration:none;}

#okveranst .button {
    overflow: hidden;
    width: auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight:bold;
	color: #107aaf;
	padding: 4px 20px 4px 10px;
	/*background:url(../common/bg_button_grey.jpg) repeat-x top left;*/
	background: -moz-linear-gradient(
		top,
		#d0d0d0 0%,
		#ffffff);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#d0d0d0),
		to(#ffffff));
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	background-color: #eee;
	border: 1px solid #d6d6d6;
	-moz-box-shadow:
		0px 0px 0px rgba(000,000,000,0),
		inset 0px 0px 2px rgba(255,255,255,1);
	-webkit-box-shadow:
		0px 0px 0px rgba(000,000,000,0),
		inset 0px 0px 2px rgba(255,255,255,1);
}
 
#okveranst .button img {padding-right:1em}


/*ohne Abstand wenn kein Formularfeld davor*/
#okveranst input.senden_ohne {   width: auto; border: 1px #555 solid;    background: #fff;	color: #555; margin: 0;height: 2.08333333em;}
#okveranst input.back:hover {background:#afafaf; cursor:pointer}
#okveranst input.abbrechen {   width: auto;	border: 1px #d90000 solid;    background: #fff;	padding: 3px;	color: #d90000; }
#okveranst #abstand_form {margin: 0.50em 0 0.50em 0;}
#okveranst input.ok_suchen {width:100%;height:100%; float: left;} /* height: 18px; entfernt, masc 08.10 */
#okveranst input.button_r,#okveranst input.button_r:focus,#okveranst input.button_r:active,#okveranst input.button_r:hover{margin: 0px; /*background:transparent url(../../assets/common/grey_arrow.png) no-repeat 0px 0px; */border:0px; outline-style:none; padding:0.2em 2.2em; color:#107BAF; font-weight:bold;width: auto; height: auto!important;}
#okveranst a.button_r {padding: 1px 0px 1px 12%; color:#107baf; font-weight:bold; /*background:transparent url(../../css10/common/weiter.gif) no-repeat 0px 0px;*/ border:0px; outline-style:none;}

#okveranst input, textarea, select {
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
    font-size: 12px;
    background: -moz-linear-gradient(top,#d0d0d0 0,#fff);
    background: -webkit-gradient(linear,left top,left bottom,from(#d0d0d0),to(#fff));
    font-family: Arial,Tahoma,sans-serif;
    width: auto;
    border: 1px solid #d6d6d6;
    padding: .4em;
    color: #555;
}

#okveranst #suchen_rahmen {
	position: relative;
	top: 0px;
	left: 0px;
    background-color: transparent;
    height: 20px;
    z-index: 5;
    color: #555;
    font-weight: normal;
    padding: 0px;
}

#okveranst .error {color:#FF0000; padding: 0.5em 0; font-weight: bold;}

#okveranst .preview .cb-veranstaltung-item-img .veranstimg img{
	max-width: 179px;
}

#okveranst .highlights .cb-veranstaltung-item-img .veranstimg img{
	max-width: 675px;
}
 
#okveranst .highlights .cb-veranstaltung-heading a{
	font-weight: bold;
	text-decoration: none;
}

/* 
root element for scrollable items. Must be absolutely positioned
and it should have a extremely large width to accommodate scrollable
items.  it's enough that you set width and height for the root element
and not for this element.
*/
.scrollable .items {
  /* this cannot be too large */
  width:20000em;
  position:absolute;home_rubrik_link
}
 
/*
a single item. must be floated in horizontal scrolling.  typically,
this element is the one that *you* will style the most.
*/
.items div {
  float:left;
}

#okveranst .veranstslider {
    width: 99%;
}
#okveranst .imagebild {
    font-family: Arial;
    color: #fff;
    font-size: 1.2em;
    z-index: 1;
}
#okveranst .imagebild .ym-wrapper {
    background: #107baf;
}

#okveranst .veranstslider .picture div img {
    margin: auto 0;
    text-align: center;
    vertical-align: middle;
    width: auto !important;
}

#okveranst .veranstslider .picture .align {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 98%;
}

/* --- SUCHE --- */


#okveranst #searchform .button ul li{    
    border-top: 1px dotted #107AAF;
    font-size: 10px;
    font-weight: bold;
    list-style-type: none;
    margin-left: -15px;
    margin-top: 5px;
    width: 140px;
  /*  float: left;*/
    padding-top: 3px;
}

#okveranst #searchform .button #okFestivals li{
    width: 300px;
}

#okveranst #searchform .button ul .groupCategorys li{
    font-weight: normal;
    border: none;
    font-size: 10px;
}

#okveranst #searchform .button #okCategories li{  
    width: 165px;
}

#okveranst #veranstCategorys{
    display: none;
    margin-left: 5px;
}

#okveranst #searchform .button li input{ 
    margin-right: 5px;
    vertical-align: middle;
}

#okveranst #searchform  .groupCategorys{
    display: none;
    margin-left: 5px;
    clear: both;
}

#okveranst #searchform .start_search_div{
    padding-top: 4px;
}

#okveranst #searchform .start_search:hover{
    cursor: pointer;
}
    
#okveranst #searchform .button li:hover{
    text-decoration: underline; 
    cursor: pointer;
    background-color: #d0dbde; }

#okveranst #okLocations, #okPlaces{
    clear: both;
}

#okveranst #okLocationSearch,#okCategorySearch  {display: inline}

#okveranst #locationRangeSlider {
    margin-top: 5px;
}

#okveranst #locationRangeDisplay {
    background-color: #E0E0E0;
    border-bottom: 1px solid #107AAF;
    border-top: 1px solid #107AAF;
    font-size: 9.5px;
    margin-bottom: 10px;
    margin-left: -4px;
    margin-top: 10px;
    padding: 5px 5px 12px;
    /*width: 127px;*/
    width: 95%;
}

#okveranst #locationRangeDisplay span{
    font-size: 11px;
}

#okveranst .filterSymbolClose{
    width: 15px;
    height: 20px;
    float: left;
    /*background: url("../../assets/common/blue_arrow_right.png") no-repeat;*/
}

#okveranst .filterSymbolOpen{
    width: 15px;
    height: 20px;
    float: left;
    /*background: url("../../assets/common/blue_arrow_down.png") no-repeat scroll 0 5px;*/
}

#okveranst .filterSymbolReset{
    cursor: pointer;
    width: 20px;
    height: 20px;
    float: right;
    margin-top: -2px;
    margin-right: -17px;
    /*background: url("../../assets/common/blue_arrow_cross.png") no-repeat scroll 0 5px;*/
}

#okveranst #form_start_search{
    cursor: pointer;
    margin-left: 40px;
}

#okveranst #ok_form_suche{/*width: 185px;*/
    width: 98%;
    }

#okveranst #ui-datepicker-div{
    z-index: 99;
}

#okveranst .datepicker {
    width: 100px;
    font-size: 11px;
    margin: 5px 0px;
}

#okveranst #okTimeEntrys{
    margin-top: 13px;
    width: 130px;
}

#okveranst #okTimeEntrys div {
    float: left;
    font-size: 10px;    
    width: 73px;
}

#okveranst #okTimeEntrys div input{
    vertical-align: middle;
}

#okveranst #okMapEntrys{
    display: none;
    position: absolute;
    left: 268px;
    bottom: 18px;
    height: 560px;   
    padding: 20px 0 0 16px;
    width: 490px;  
    background: -moz-linear-gradient(center top , #D5D5D5 0%, #FFFFFF) repeat scroll 0 0 rgba(0, 0, 0, 0);  margin-top: 20px;
/*     background-color: #107BAF;*/
    border-radius: 6px;
}

#okveranst #okMapEntrys div{ 
   /* position: absolute;*/    
    border-radius: 4px;
}


#okveranst .filterInfos{display: none}

#searchMore{
    position: absolute;
    right: 5px;
    bottom: 5px;
}

#searchform .content #moreSearchOptions{
    display: none;
    margin-top: 20px;
    padding-bottom: 10px;   
}

#moreSearchOptions input{
    vertical-align: middle;
}

#moreSearchOptions input{
    margin-right: 10px;
}

#okveranst .suchetrenner {
    /*background-image: url("../../common/suchetrenner.png");*/
    height: 96px;
    position: absolute;
    right: 447px;
    top: 13px;
    width: 5px;
}

    /* Suche Links 
 #okveranst .suche a { font-size:0.85em; color: #fff; background:transparent; font-weight: normal; text-decoration:underline;}
 #okveranst .suche a:focus,
 #okveranst .suche a:hover,
 #okveranst .suche a:active {color: #fff; background-color: transparent; text-decoration:underline;}
  */
#okveranst .content{
	width: 100%;	
}


  
#okveranst .preview .cb-veranstaltung-item-contentbox{
	margin-top: -3px;
	/*max-width: 865px; verkleinert bzgl. umbruch (#4517)*/
	max-width: 530px;
}

#okveranst .highlights .cb-veranstaltung-heading{
	font-size: 11px;
}

#okveranst .highlights .cb-veranstaltung-item-datum a{
	text-decoration: none;
}

/*  
#okveranst #locationRangeDisplay{
	display: none;
}*/

#okveranst #inner-content-div p{width: 250px;}

#okLocations {
    max-height: 250px;
    width: 110%;
}

#okveranst .scrollableContent {
	margin-left: 15px;
}

#okveranst .pager-active-page{
	font-weight: bold;
}

#okveranst .close{
	display: none;
}

#ui-datepicker-div{
	z-index: 99;
}



.teaserbox{
	z-index: 2;
}

.ui-datepicker-div{
	z-index: 9;
}

.headerslider  .linearize-level-1 {
    display: block;
}

#okveranst .veranstdetail .owl-carousel{
	display: block;
}


#okveranst .veranstdetail .owl-controls{
	margin-top: -40px;
}

#okveranst .veranstdetail .owl-controls span{
	opacity: 0.7;
	background-color: white;
}

#okveranst .veranstdetail .owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span {
    opacity: 0.9;
}

.main #okveranst .imagebild .ym-wrapper{
	height: 328px;
}

@media screen and ( max-width: 950px ){
	#okveranst .scrollable img {
	    max-width: 640px !important;
	    max-height: 255px !important;
	    width: auto;
	    height: auto;
	}
	.main #okveranst .ym-g67, #okveranst .g76{	
		width: auto;
	}
}


@media screen and ( max-width: 740px ) {
	#okveranst .scrollable img {
		height: auto;
		max-height: 185px !important;
		max-width: 408px !important;
		width: auto;
		
	}
	
	.main #okveranst .scrollable .linearize-level-1 {
		float:left;
		width: 100%; /*alter Wert: auto;*/
		
	}
	#okveranst .veranst .ticket {
		left: 0;
	}

}
/*
@media screen and ( max-width: 640px) {
	#okveranst .scrollable img {
	    max-width: 640px !important;
	    max-height: 255px !important;
	    width: auto;
	    height: auto;
	}
}
	
*/