#page.calendarlistview .archiv {display:none; }

.jBox-closeButton-box .jBox-closeButton {top: 10px;
right: 10px;
width: 22px;
height: 22px;
background: #fff;
border-radius: 0;

background: #AD0539;
background:#4F5355;
  background-position-x: 0%;
  background-position-y: 0%;
  background-repeat: repeat;
  background-image: none;
  background-size: auto;

background-image: url('../images/icons/menu-schliessen.svg');
background-repeat: no-repeat;
background-size: auto 20px;
background-position: center center;

}
.jBox-closeButton svg {display:none; }

.calendar_item {background-color:#fff; margin-bottom:4px;
border-left: 4px solid #87878D; padding:0px 0px 0px 8px; display:block; clear:both;}


.calendar_item span.calendar_content {display:block;float:left; width:calc(100% - 10px); height:78px; padding:10px 0px 10px 8px;  padding:10px 0px 10px 4px;}


.calendar_item  span.calendar_icon {display:block;float:left; width:10px; height:78px; }


.calendar_item  span.calendar_icon > span {display:block; width:10px; height:26px;float:none; }
.calendar_item  span.calendar_icon.element1 > span   {height:78px;}
.calendar_item  span.calendar_icon.element2 > span   {height:52px;}
.calendar_item  span.calendar_icon.element3 > span   {height:26px;}



span.petrol {background-color:#0B6273;}
span.rot { background-color:#AD0539;}
span.gelb {background-color:#EFD80B; }


.calendar_item  span.calendar_content span {font-size:14px; line-height:18px;line-height:20px;width:100%; display:block; padding: 0px 0px 2px 0px;}




.rightcol .calendar_item span.calendar_content span {font-size:14px; line-height:40px;width:auto; display:block;float:left; padding: 0px 0px 0px 0px;white-space: nowrap; position:relative;}


.rightcol .calendar_item span.calendar_content span.eventinfo_icons {  width:100%; display:block; padding: 0px 4px 0px 0px; position:relative;}


.rightcol .calendar_item span.calendar_content span.eventinfo_date { padding: 0px 2px 2px 26px; margin-top:-4px; 
white-space: nowrap;
text-overflow: ellipsis;
width: 122px;
}
.rightcol .calendar_item span.calendar_content span.eventinfo_ort { padding: 0px 16px 2px 20px; margin-top:-4px;  

padding: 0px 5px 2px 20px;white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 95px;}


.rightcol .calendar_item span.calendar_content span.eventinfo_format { padding: 0px 0px 2px 20px; margin-top:-4px;  position:absolute; right:4px;}

.rcol .rightcol .calendar_item span.calendar_content span.title {margin-top:-12px;  padding: 0px 4px 2px 0px; width:calc(100% - 25px);}
 .rightcol .calendar_item span.calendar_content { padding: 10px 0px 10px 0px;}
 

.calendar_item  span.date, .calendar_item  span.ort {text-transform:uppercase;white-space: nowrap;}



 .calendar_item  span.calendar_content span.title { 
 	width:200px;width:90vw;
 	white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;}



.calendar_item  span.calendar_content span.title { width:90vw; width: calc(100vw - 80px);}
.rcol .calendar_item  span.calendar_content span.title { width:90vw;width: calc(100vw - 80px);}
 	




.calendar_minilist {background-color: #F5F5F5;}
.rcol .calendar_minilist {padding:20px;}
.rcol .calendar_minilist  h4{color: #4F5355;}

#footer_right .calendar_minilist {overflow-y:scroll;}



.block.hellgrau .newslist {padding: 0px 20px 0px 20px;}

.newslist {background-color: #F5F5F5; width:100%; margin:0px auto 0px auto; }
.newslist .listcontainer {margin:20px 0px 20px 0px; }
.newslist .calendar_item  span.calendar_content span.dateblock {text-transform: uppercase; width: 120px; float:left; }

.newslist .calendar_item  span.calendar_content span.dateblock .days {font-size:20px; width:100%; display:block; }

.newslist .calendar_item  span.calendar_content span.textblock {  width: calc(100% - 120px); float:left; position:relative;  }


.newslist .calendar_item  span.calendar_content span.ort{width:100%; display:block; text-transform: uppercase; background-image:url('../images/icons/calendar-place.svg');white-space:nowrap; background-repeat:no-repeat;
background-size: 16px auto;
background-position: left top;
padding: 8px 0px 5px 25px;}

.newslist .calendar_item  span.calendar_content span.ort.nobg {background-image:none; } 


 .newslist .calendar_item  span.calendar_content span.title {width:100% !important;  width: calc(100% - 50px) !important; 
 display:block;text-transform: none;font-size:20px ;padding-right:55px;}
 
 
 

.newslist .calendar_item  span.calendar_content span.eventinfo_icons {position:absolute; right: 5px; top: 50%; margin-top:-20px;margin-top:-15px;

 width:40px; height: 40px; }

.newslist .eventinfo_icons span {width:40px; height: 40px;background-size: 21px auto;}


/*******************************Calendar Top Navigation*********************************/
div#calendar{
  margin:0px auto;
  padding:0px;
  width: 602px;width:100%;
  
}

#eventinfo_target {display:block;width:100%; z-index:1000;height:0px;

}

#wrapper {-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;}
 
div#calendar div.box{
/*    position:relative;
    top:0px;
   float:right;
    width:280px;
    height:40px;margin-right: 5px;
    background-color:   #0B6273 ; */
    position:relative;
    width:100%; background:transparent; height:140px;     
}


div#calendar div.box span {display:inline-block; }
 

div#calendar div.header{
    line-height:30px;  
    vertical-align:middle;
  margin:15px 0px 15px 0px;position: relative;
   width: 190px;   width: 290px;
    height:40px;  
/*    border:1px solid #0B6273;
    border-radius:3px;*/
   
}

 
div#calendar div.header a.prev,div#calendar div.header a.next,
 div#calendar div.header a.calendar, div#calendar div.header a.list { 
    position:absolute;
    top:0px;   
    height: 40px; width:32px;
    display:block;
    cursor:pointer;
    text-decoration:none;
    color:#FFF;
    
    background-repeat:no-repeat ;
  background-color:#0B6273;
background-size:20px auto ;


}
 
div#calendar div.header span.title{
    color:#FFF;    position:absolute;left:43px;left:143px;
    font-size:16px;
    width:104px; 
    text-align:center;line-height:40px; background-color:#0B6273;
}
 
 
 
 div#calendar div.header a.calendar {
left:0px;
 border:1px solid #87878D80;

background-color:#fff;
background-image:url('../images/icons/Icon_Cal_View_deact.svg') ;
background-position: center center; 
width:40px;
border-top-left-radius:4px;
border-bottom-left-radius:4px;
background-size:27px auto ;
}
div#calendar div.header a.calendar.active { border:1px solid #0B6273;background-image:url('../images/icons/Icon_Cal_View_act.svg') ;}



div#calendar div.header a.list {
left:45px;
border:1px solid  #87878D80;
background-color:#fff;
background-image:url('../images/icons/Icon_List_View_deact.svg') ;
background-position: center center; 
width:40px;
border-top-right-radius:4px;
border-bottom-right-radius:4px;
background-size:27px auto ;
}


 div#calendar div.header a.list.active { border:1px solid #0B6273;background-image:url('../images/icons/Icon_List_View_act.svg') ;}
 
 
 
 
 
div#calendar div.header a.prev{
left:101px;
 border-right:3px solid #fff;
background-image:url('../images/icons/arrow-calendar-left.svg') ;
background-position: center center; 
 width:40px;

border-top-left-radius:4px;
border-bottom-left-radius:4px;
}


 
div#calendar div.header a.next{
    right:0px;
    background-image:url('../images/icons/arrow-calendar-right.svg') ;

    border-left:3px solid #fff;
background-position: center center; 
    width:40px;
    
border-top-right-radius:4px;
border-bottom-right-radius:4px;
}
 
 
 
 
  
div#calendar div.daymenu{
margin: 0px;
padding: 8px 0px 0px 10px;
 
margin-right: 5px;
display:block;
width: 100%;
height: 112px; position:relative;
line-height: 56px;
vertical-align: middle;
text-align: center;
color: #fff;
font-size: 22px;
background-color: #0B6273;
}

  div#calendar div.daymenu div.dayheader {position:absolute; bottom:5px; width:100%; white-space:nowrap;}
 
  div#calendar div.daymenu div.monthlink,  div#calendar div.daymenu div.daynav {width:50%; float:left; display:block; }
 


 
 
 div#calendar div.daymenu div.monthlink span {  background:#fff;cursor:pointer; color: #0B6273; font-size: 16px; display:block; float:left;height:40px; line-height:40px; padding:0px 20px 0px 20px;
    border-radius:2px;}
 
 
 div#calendar div.daymenu div.daynav > div {float:right;display:block;  position: relative;
height: 40px; width:90px; margin-right:8px;}
 
 div#calendar div.daymenu div.dayheader span{ 
 	display:inline-block; height:40px; line-height:40px;text-align: center;cursor:pointer;
color: #fff;font-size: 22px;}
 
div#calendar div.daymenu div.daynav > div > span {
position:absolute; top:0;
background-repeat:no-repeat ;
background-size:20px auto ; 
height: 40px; width:32px;
display:block; 
cursor:pointer;
text-decoration:none;
color:#0B6273;
background-color:#fff;
}


div#calendar div.daymenu div.daynav > div > span.prevday{
right:50px;right: 44px;
border-right:2px solid #0B6273;

border-top-left-radius:4px;
border-bottom-left-radius:4px;

background-image:url('../images/icons/calendar-day-prev.svg') ;
background-position: center center; 
width:40px;
}
div#calendar div.daymenu div.daynav > div > span.nextday{
right:0px;
background-image:url('../images/icons/calendar-day-next.svg') ;

border-left:2px solid #0B6273;

    border-top-right-radius:4px;
    border-bottom-right-radius:4px;

background-position: center center; 
width:40px;
}

 
 
 
 
 
/*******************************Calendar Content Cells*********************************/
div#calendar div.box-content{
/*    border:1px solid #787878 ;*/
    border-top:none;width:100%;
    
}
 
 
 
div#calendar div.label{
    float:left;
    margin: 0px;
    padding: 0px;
    margin-top:5px;
/*    margin-left: 5px;*/width:100%;
}
 
div#calendar div.label > div{
    margin:0px;
    padding:0px;
    margin-right:5px;  
    float:left;
  
    width:80px;width:calc(14.285% - 5px);
    height:56px;
    line-height:56px;
    vertical-align:middle;
    text-align:center;
    color:#fff;
    
    font-size: 23px;
    background-color: #0B6273;
}
 
 
div#calendar div.dates{
    float:left;
    margin: 0px;
    padding: 0px;
  /*  margin-left: 5px;*/
    margin-bottom: 5px; width:100%;
}
 
/** overall width = width+padding-right**/
div#calendar div.dates > div{
    margin:0px;
    padding:0px;
    margin-right:5px;
    margin-top: 5px;

 /*     line-height:80px;  vertical-align:middle;*/
    float:left;
    list-style-type:none;
    width:80px;width:calc(14.285% - 5px);
    
    background-color: #F5F5F5;
    color:#000;
    text-align:center; 

}
div#calendar div.dates > div > div{ 
position:relative;	padding-bottom:100%; width:100%;   background-color: transparent;
}

div#calendar div.dates > div > div > div.datenum{  width:100%; height:100%;  position:absolute; z-index:10 ;
 }
 
div#calendar div.dates > div > div > div.datenum span{ 
position:absolute; top:50%; left:50%; font-size:18px; color: #0B6273;
transform: translate(-50%, -50%); z-index:10 ; 
 }
 
div#calendar div.dates > div > div > div.datenum.activedate{  background-color: #87878D;}
div#calendar div.dates > div > div > div.datenum.activedate  span{ color:#fff; }

div#calendar div.dates > div > div > div.dateblock  {position:absolute; top:0px;  background-color: transparent;  color:#fff;  width:100%;height:100%;z-index:12; }


.dateblock span {
line-height: 30px;height: 100%;
font-size: 14px;
padding-left: 4px;
display: block;}



.eventinfo, .eventinfo_mobile {display:none;}


.eventinfo {padding:0px;}

.eventinfo_mobile {padding: 0px; 

width:100vw;
width: calc(100vw - 40px);
margin: 0px auto 0px auto;
/*
box-shadow: 0px 5px 30px #00000026;*/

}


.eventinfo_mobile .eventinfoitem {    box-shadow: 0px 5px 30px #00000026; margin-bottom: 20px;
}




.eventinfo .infocontainer, .eventbox .infocontainer{padding: 20px 12px 20px 12px; min-height:350px}

.eventinfo_mobile .infocontainer{padding: 16px 12px;}

.eventinfo_icons {display:block; padding-bottom:24px;}

.eventinfo_icons span {
	display:inline-block;height:40px; line-height:40px; font-size:16px; text-transform:uppercase; 
background-repeat:no-repeat;
background-size: 16px auto;
background-position:left center; padding-left:26px; padding-right:40px;}

.eventinfo_icons span.eventinfo_date {background-image:url('../images/icons/calendar-icon-grau.svg');background-size: 20px auto; white-space:nowrap;}

.eventinfo_icons span.eventinfo_date.datesecondline
{height: auto;
line-height: 130%;
background-position: left top 0px;
padding-bottom: 10px;
}
.eventinfo_hinweis {margin-bottom:8px;}


.eventinfo_icons span.eventinfo_time {background-image:url('../images/icons/calendar-time.svg');background-size: 20px auto; white-space:nowrap;}

.eventinfo_icons span.eventinfo_ort {background-image:url('../images/icons/calendar-place.svg');white-space:nowrap;}


.eventinfo_icons span.praesenz {background-image:url('../images/icons/praesenz.svg');}
.eventinfo_icons span.virtuell {background-image:url('../images/icons/virtuell.svg');}
.eventinfo_icons span.hybrid {background-image:url('../images/icons/hybrid.svg');}
.eventinfo_icons span.on-demand {background-image:url('../images/icons/on-demand.svg');background-size: 21px auto;}



.eventinfo a, .eventinfo_mobile a , .eventbox a {display:inline-block; padding-right:24px;background-repeat:no-repeat;
background-size: 16px auto;
background-position:right center;background-image:url('../images/icons/kalender-detail-pfeil.svg');

}

.tooltip_icons, .showdesktop {display:none !important;}

.tooltipblock   {display:none !important; cursor:pointer;}
span.eventtitle   {display:none ; cursor:pointer;}



.tooltip_mobile {color:#fff;cursor:pointer; width:100%; height:100%; display:block;position:absolute; z-index:1000; }



.eventline_mobile span {display:block; float: left; width:33.333333%; height:5px;} 

.eventline_mobile span.width1 {width:100%;}
.eventline_mobile span.width2 {width:50%;}
.eventline_mobile span.width3 {width:33.333333%;}


.eventline_mobile span.zielgruppe1 {background-image:none; background-color:#0B6273;}
.eventline_mobile span.zielgruppe2 {background-image:none; background-color:#AD0539;}
.eventline_mobile span.zielgruppe3 {background-image:none; background-color:#EFD80B;}



.eventinfoitem.invers  {background-color:#87878D }
.eventinfoitem.invers .eventinfo_icons span.eventinfo_date {background-image:url('../images/icons/calendar-icon.svg');background-size: 20px auto;}
.eventinfoitem.invers .eventinfo_icons span.eventinfo_time {background-image:url('../images/icons/calendar-time-neg.svg');background-size: 20px auto;}

.eventinfoitem.invers .eventinfo_icons span.eventinfo_ort {background-image:url('../images/icons/calendar-place-neg.svg');}


.eventinfoitem.invers .eventinfo_icons span.praesenz {background-image:url('../images/icons/praesenz-white.svg');}
.eventinfoitem.invers .eventinfo_icons span.virtuell {background-image:url('../images/icons/virtuell-white.svg');}
.eventinfoitem.invers .eventinfo_icons span.hybrid {background-image:url('../images/icons/hybrid-white.svg');}
.eventinfoitem.invers .eventinfo_icons span.on-demand {background-image:url('../images/icons/on-demand-white.svg');background-size: 21px auto;}

 
.eventinfoitem.invers .infocontainer{padding: 16px 20px 16px 20px;}



.eventline0, .eventline1, .eventline2, .eventline3, .eventline4 {display:none; }
span.eventtitle.eventline0, span.eventtitle.eventline1, span.eventtitle.eventline2, span.eventtitle.eventline3, span.eventtitle.eventline4 {display:none; }



.opendayview {display:none;}

.eventbox {width:100%; display:block;
box-shadow: 0px 5px 30px #00000026;  
margin-bottom: 20px;
}

.day {margin-top:20px;}








@media all and (min-width: 380px){ 

.rightcol .calendar_item span.calendar_content span.eventinfo_icons {  padding: 0px 44px 0px 0px; }
.rightcol .calendar_item span.calendar_content span.eventinfo_date { width: 130px;}
.rightcol .calendar_item span.calendar_content span.eventinfo_ort { width: 130px;}

.rightcol .calendar_item span.calendar_content span.eventinfo_format { right:10px;}


.rightcol .calendar_item span.calendar_content span.title {margin-top:-12px;  padding: 0px 44px 2px 0px;  width:90vw;}

.rightcol .calendar_item span.calendar_content { padding: 10px 0px 10px 4px;}

}






@media all and (min-width: 480px){ 



div#calendar div.header{
    line-height:30px;  
    vertical-align:middle;
    position:absolute;
    right:5px;
    top:0px;
   width: 190px;   width: 290px;
    height:40px;   
    margin:0;
    /*background-color:#0B6273;
    border:1px solid #0B6273;
    border-radius:2px;*/
   
}

div#calendar div.box {
 
    height: 70px;
}


}

@media all and (min-width: 640px){ 
	
		
 div#calendar div.daymenu div.dayheader {position:relative; }	
 
 div#calendar div.daymenu div.dayheader,  div#calendar div.daymenu div.monthlink,  div#calendar div.daymenu div.daynav {width:33.333333%; float:left; display:block; }
	
	 
div#calendar div.daymenu{
height: 56px;
line-height: 56px;
}


	
	
	
	
	.day {
		
		width:100%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-direction: normal;
	-webkit-box-orient: horizontal;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	justify-content: space-between; 
	
	}
	
	.day div.eventbox {
	width: calc((100% / 2) - 10px);
	position: relative;
 margin-bottom: 20px;
	
	}
	
	
	
}


@media all and (min-width: 900px){ 
	

.block.hellgrau .newslist {padding: 0px 0px 0px 0px;}	

.newslist {  width:820px; margin:0px auto 0px auto; }

.newslist .calendar_item  span.calendar_content span.dateblock {  width: 120px;   }

.newslist .calendar_item  span.calendar_content span.textblock { width: 670px;  }

 .newslist .calendar_item  span.calendar_content span.title {padding-right:0px;}
	 
	
/*.eventbox {width:calc(33.333333% - 20px); margin-right:20px;background:#fff; }
*/ 	

.day div.eventbox {
	width: calc((100% / 3) - 15px);
	position: relative;

	
	}
 

/*.eventline0, .eventline1  {display:block; }	 
erst nur einen balken einblende*/
.eventline0   {display:block; }	 
span.eventtitle.eventline0   {display:block; }	

.opendayview {
background-repeat:no-repeat;
width:20px; height:20px; position:absolute; 

bottom:0px; right: 0px;
bottom: 8px;
right: 8px;
cursor:pointer;
background-size: 16px auto;
background-position:right bottom 2px;
background-image:url('../images/icons/calendar-more.svg');}


.opendayview.num3, .opendayview.num4, .opendayview.num5 {display:block;}
 
.calendar_item  span.calendar_content span.title { width:45vw;width: calc(45vw - 20px);} 

.rcol .calendar_item  span.calendar_content span.title { width:90vw;width: calc(100vw - 50px);}
 
.tooltip_icons  {display:block !important;}


/*.showdesktop  {display:block !important;}
.showmobile {display:none;}*/


.tooltip_icons{float: right;}

.tooltipblock  {display:block !important; }
.tooltip_mobile {display:none !important; }



div#calendar div.dates > div > div > div.datenum{ 
top:15px; right:15px; left:auto; font-size:20px; color: #0B6273;width: 20px;
height: 20px;
transform: none; 
 }
 
 div#calendar div.dates > div > div > div.datenum span {font-size:23px;font-weight:regular; color:#0B6273}

div#calendar div.dates > div > div > div.datenum.activedate  span { color:#0B6273}

 

div#calendar div.dates > div > div > div.dateblock  {position:absolute; top:40px; background: transparent; color:#fff;height:30px; width:calc(100% + 5px);padding-bottom:0;}
div#calendar div.dates > div > div > div.dateblock.single  {width:100%;}


div#calendar div.dates > div > div > div.datenum.activedate{background: transparent;}

.dateblock span {
line-height: 30px;height: 30px;
font-size: 14px;
padding-left: 4px;
display: block;}



span.eventtitle  { display:block; 
color:#fff;cursor:pointer;
line-height: 30px;height: 30px;
font-size: 14px;
padding-left: 4px;
position:absolute; top:0px; width:auto; background: transparent;
text-align: left; z-index:100;
width:10vw; 
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

span.eventtitle.day1 {width:9vw;}
span.eventtitle.day2 {width:20vw;}
span.eventtitle.day3 {width:30vw;}
span.eventtitle.day4 {width:40vw;}
span.eventtitle.day5 {width:50vw;}
span.eventtitle.day6 {width:60vw;}
span.eventtitle.day7 {width:70vw;}


span.eventtitle.day1.pad2 {width:calc(9vw - 10px);}
span.eventtitle.day2.pad2 {width:calc(20vw - 10px);}
span.eventtitle.day3.pad2 {width:calc(30vw - 10px);}
span.eventtitle.day4.pad2 {width:calc(40vw - 10px);}
span.eventtitle.day5.pad2 {width:calc(50vw - 10px);}
span.eventtitle.day6.pad2 {width:calc(60vw - 10px);}
span.eventtitle.day7.pad2 {width:calc(70vw - 10px);}


span.eventtitle.day1.pad3 {width:calc(9vw - 20px);}
span.eventtitle.day2.pad3 {width:calc(20vw - 20px);}
span.eventtitle.day3.pad3 {width:calc(30vw - 20px);}
span.eventtitle.day4.pad3 {width:calc(40vw - 20px);}
span.eventtitle.day5.pad3 {width:calc(50vw - 20px);}
span.eventtitle.day6.pad3 {width:calc(60vw - 20px);}
span.eventtitle.day7.pad3 {width:calc(70vw - 20px);}





.dateblock span.tooltipblock {position:relative; position:absolute; width:100%; height:30px; overflow:visible; cursor:pointer; background-color: #87878D;}

.dateblock span.tooltipblock.last {width:calc(100% - 5px);right:5px}


.dateblock span.tooltipblock {position:absolute; right:0px; }

.dateblock span.tooltip_icons span {float:left;width:10px;  
background-repeat:no-repeat;
background-size: auto 21px;
background-position:center center;
}

.dateblock span.tooltip_icons span.format {width:26px;}

.dateblock span.tooltip_icons span.praesenz {background-image:url('../images/icons/praesenz-white.svg');background-size:  auto 21px;}
.dateblock span.tooltip_icons span.virtuell {background-image:url('../images/icons/virtuell-white.svg');background-size: auto 21px ;}
.dateblock span.tooltip_icons span.hybrid {background-image:url('../images/icons/hybrid-white.svg');background-size: auto 21px ;}
.dateblock span.tooltip_icons span.on-demand {background-image:url('../images/icons/on-demand-white.svg');background-size: auto 18px ;}


.dateblock span.tooltip_icons span.zielgruppe1 {background-image:none; background-color:#0B6273;}
.dateblock span.tooltip_icons span.zielgruppe2 {background-image:none; background-color:#AD0539;}
.dateblock span.tooltip_icons span.zielgruppe3 {background-image:none; background-color:#EFD80B;}
 
}


@media all and (min-width: 1024px){ 
.showdesktop  {display:block !important;}
.showmobile {display:none;}

/* 	 zweiten balken einblende*/
.eventline1   {display:block; }	 

span.eventtitle.eventline1   {display:block; }	


}



@media all and (min-width: 1080px){ 
.opendayview.num4 {display:block;}
.opendayview.num3 {display:none;}
.opendayview.num2 {display:none;}
.opendayview.num1 {display:none;}

/*dritter Balken wird eingeblendet*/
 
.eventline2  {display:block; }	 
span.eventtitle.eventline2   {display:block; }	


/*nur wenn weniger als vier*/

.ne4 .eventline2  {display:none; }	 
.ne4  span.eventtitle.eventline2   {display:none; }	
 
}




@media all and (min-width: 1200px){ 
 

	
.calendar_item  span.calendar_content span.title { width:28vw;width: calc(28vw - 20px);}
.rcol .calendar_item  span.calendar_content span.title {  width: 20vw; width: calc(20vw - 20px);}




span.eventtitle.day1 {width:8vw;}
span.eventtitle.day2 {width:18vw;}
span.eventtitle.day3 {width:27vw;}
span.eventtitle.day4 {width:36vw;}
span.eventtitle.day5 {width:45vw;}
span.eventtitle.day6 {width:54vw;}
span.eventtitle.day7 {width:63vw;}

span.eventtitle.day1.pad2 {width:calc(8vw - 10px);}
span.eventtitle.day2.pad2 {width:calc(18vw- 10px);}
span.eventtitle.day3.pad2 {width:calc(27vw- 10px);}
span.eventtitle.day4.pad2 {width:calc(36vw- 10px);}
span.eventtitle.day5.pad2 {width:calc(45vw- 10px);}
span.eventtitle.day6.pad2 {width:calc(54vw- 10px);}
span.eventtitle.day7.pad2 {width:calc(63vw- 10px);}


span.eventtitle.day1.pad3 {width:calc(8vw - 20px);}
span.eventtitle.day2.pad3 {width:calc(18vw- 20px);}
span.eventtitle.day3.pad3 {width:calc(27vw- 20px);}
span.eventtitle.day4.pad3 {width:calc(36vw- 20px);}
span.eventtitle.day5.pad3 {width:calc(45vw- 20px);}
span.eventtitle.day6.pad3 {width:calc(54vw- 20px);}
span.eventtitle.day7.pad3 {width:calc(63vw- 20px);}
 
}


@media all and (min-width: 1200px) and (max-width: 1440px){ 

.rightcol .calendar_item span.calendar_content span.eventinfo_date { padding: 0px 2px 2px 26px; margin-top:-4px; 
white-space: nowrap;
text-overflow: ellipsis;
width: 122px;
}
.rightcol .calendar_item span.calendar_content span.eventinfo_ort { padding: 0px 16px 2px 20px; margin-top:-4px;  

padding: 0px 5px 2px 20px;white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 95px;}


.rightcol .calendar_item span.calendar_content span.eventinfo_format { padding: 0px 0px 2px 20px; margin-top:-4px;  position:absolute; right:4px;}

.rcol .rightcol .calendar_item span.calendar_content span.title {margin-top:-12px;  padding: 0px 4px 2px 0px; width:calc(100% - 25px);}

.rightcol .calendar_item span.calendar_content span.eventinfo_icons {  padding: 0px  4px 0px 0px; }
.rightcol .calendar_item span.calendar_content { padding: 10px 0px 10px 0px;}
 
}
 
 
 
 

@media all and (min-width: 1320px){ 
	
/*dritter balken bei vier gesamt einblenden*/

.ne4 .eventline2  {display:block; }	 
.ne4  span.eventtitle.eventline2   {display:block; }	


}



@media all and (min-width: 1440px){ 
	
.rightcol .calendar_item span.calendar_content span.eventinfo_icons {  padding: 0px 44px 0px 0px; }
.rightcol .calendar_item span.calendar_content span.eventinfo_date { width: 130px;}
.rightcol .calendar_item span.calendar_content span.eventinfo_ort { width: 130px;}

.rightcol .calendar_item span.calendar_content span.eventinfo_format { right:10px;}

.rightcol .calendar_item span.calendar_content span.title {margin-top:-12px;  padding: 0px 44px 2px 0px;  width:90vw;} 

	

.calendar_item  span.calendar_content span.title { width:380px;}
.rcol .calendar_item  span.calendar_content span.title { width:300px;}


/*vierter Balken wird eingeblendet*/
.eventline3 {display:block; }	

/*fünfter und sechster balken sind nie zu sehen */
 /*.eventline4,.eventline5 */

span.eventtitle.eventline3  {display:block; }
/*span.eventtitle.eventline4 ,span.eventtitle.eventline5  */	


/*nur wenn weniger als fünf*/

.ne5 .eventline3  {display:none; }	 
.ne5  span.eventtitle.eventline3   {display:none; }	




	
.opendayview.num5 {display:block;}
.opendayview.num4 {display:none;}

.opendayview.num3 {display:none;}
.opendayview.num2 {display:none;}


 
 span.eventtitle.day1 {width:7vw;width: 130px}
span.eventtitle.day2 {width:14vw;width: 310px}
span.eventtitle.day3 {width:23vw;width: 490px}
span.eventtitle.day4 {width:32vw;width: 670px}
span.eventtitle.day5 {width:40vw;}
span.eventtitle.day6 {width:48vw;}
span.eventtitle.day7 {width:56vw;}


span.eventtitle.day1.pad2 {width:7vw;width: 120px}
span.eventtitle.day2.pad2 {width:14vw;width: 300px}
span.eventtitle.day3.pad2 {width:23vw;width: 480px}
span.eventtitle.day4.pad2 {width:32vw;width: 660px}
span.eventtitle.day5.pad2 {width:40vw;}
span.eventtitle.day6.pad2 {width:48vw;}
span.eventtitle.day7.pad2 {width:56vw;}



span.eventtitle.day1.pad3 {width:7vw;width: 110px}
span.eventtitle.day2.pad3 {width:14vw;width: 290px}
span.eventtitle.day3.pad3 {width:23vw;width: 470px}
span.eventtitle.day4.pad3 {width:32vw;width: 650px}
span.eventtitle.day5.pad3 {width:40vw;}
span.eventtitle.day6.pad3 {width:48vw;}
span.eventtitle.day7.pad3 {width:56vw;}

}

 

@media all and (max-width: 900px){ 
div#calendar div.dates > div > div > div.dateblock  {margin-top:0px !important; }

 	


}
 
:focus{
    outline:none;
}
 
div.clear{
    clear:both;
}