#app > .Component_Calendar{/* Any screen dimension */
	> ._body{
		> .calendar{
			> .date{
				> ._title-full,
				> ._title-short{
					border-color:var(--color--green-0);
					border-style:solid;
					color:var(--color--green-0);
					> ._inner{
						background:var(--color--white-0);
						border-color:var(--color--green-0);
						border-style:solid;
					}
				}
				>.geolocations{
					> .geolocation{
						> ._title-full{
							background:   var(--color--white-0);
							border-color: var(--color--bordeaux-0);
							border-style: solid;
							color:var(--color--bordeaux-0);
							font-weight:bold;
						}
						> ._title-short{
							> .marker{
								cursor:pointer;
							}
						}
						> .activities{
							> .activity{
								border-color: var(--color--grey-0);
								border-style: solid;
								> ._title{
									font-weight:bold;
									color:var(--color--black-0);
								}
								> .timelapses{
									> .timetable{
										border-collapse:collapse;
										> tbody{
											> tr.timetable__minutes{
												td{
													
													border-color: var(--color--grey-0);
													border-style: solid;
												}
												td.active{
													border-color: var(--color--orange-0);
													border-style: solid;
												}
											}
											> tr.timetable_hour{
												td{
													color:var(--color--black-0);
												}
												td.active{
													color:var(--color--black-0);
												}
											}
										}
										
									}
								}
								> .activitytypes{
									.UI_I18n{display:none}
								}
								> .organisation{
									> ._title{
										font-weight:bold;
										color:var(--color--black-0);
									}
								}
								> .summary{
									color:var(--color--black-0);
								}
								> .summary{
									color:var(--color--black-0);
								}
							} 
						}
					}
				}
			}
		}
	}
}
#app > .Component_Calendar{ /* Custom screen dimension */
	> ._body{
		> .calendar{
			> .date{
				display:grid;
				grid-template-areas:   var(--SCR__DATE__grid-template-areas);
				grid-template-columns: var(--SCR__DATE__grid-template-columns);
				gap:                   var(--SCR__DATE__gap);
				position: relative;
				> ._title-short{grid-area:short;
					position:relative;
					> ._inner{
						z-index:50;
						position:sticky;
						top:0;
					}
					.year{
						display:none;
					}
					> ._inner{
						display:grid;
						grid-template-areas:   var(--SCR__DATE__TITLE__INNER__grid-template-areas);
						grid-template-columns: var(--SCR__DATE__TITLE__INNER__grid-template-columns);
						gap:                   var(--SCR__DATE__TITLE__INNER__gap);
					}
				}
				> ._title-short,
				> ._title-full{
					border-width:0 2px;
					font-size:16px;
					> ._inner{
						border-width:2px 0;
						padding:5px;
						
						
						.day:after{
							content:'/';
						}
						.year:before{
							content:'/';
						}
						
					}
				}
				> .geolocations{
					> .geolocation{
						display:grid;
						grid-template-areas:var(--SCR__GEOLOCATION__grid-template-areas);
						grid-template-columns:max-content 1fr;
						> ._title-short,
						> ._title-full{
							border-width:2px;
							padding:5px 8px 5px 2px;
							margin-bottom:10px;
							font-size:16px;
						}
						> ._title-short{grid-area:short;
							position:relative;
							margin-left:-62px;
							> .marker{
								top:40px;
								position:sticky;
								margin-left:20px;
								margin-top:-2px;
							}
						}
						> ._title-full{grid-area:full;
							display:grid;
							margin-top:2px;
							padding:6px 6px;
							grid-template-columns: min-content 1fr ;
							grid-template-areas: "number street" "city city";
							align-items: center;
							gap:0 5px;
							> .housenumber{grid-area:number;}
							> .street{grid-area:street;}
							> .city{grid-area:city;text-align:right;}
						}
						> .activities{
							> .activity{
								gap:10px;
								padding:8px 8px;
								margin-bottom:8px;
								border-width:2px;
								display:grid;
								grid-template-areas:  var(--SCR__ACTIVITY__grid-template-areas);
								grid-template-columns:var(--SCR__ACTIVITY__grid-template-columns);
								grid-template-rows:   var(--SCR__ACTIVITY__grid-template-rows);
								> ._title{       grid-area:title;
									font-size:16px;
								}
								> .timelapses{   grid-area:timelapses;
									> .timetable{
										table-layout: fixed;width:200px;
										td{}
										> thead{
											td{padding:5px;}
										}
										> tbody{
											
											>.timetable__minutes{
												td.active{
													
												}
											}
											>.timetable__hours{
												td{
													font-size:10px;
												}
											}
										}
									}
								}
								> .activitytypes{grid-area:activitytypes;
									display:flex;
									font-size:15px;
									flex-direction: var(--SCR__ACTIVITYTYPES__flex-direction);
									gap:            var(--SCR__ACTIVITYTYPES__gap);
								}
								> .organisation{ grid-area:organisation;
									> ._title{
										font-size:15px;
									}
								}
								> .summary{      grid-area:summary;
									font-size:15px;
								}
								> .conditions{   grid-area:conditions;
									font-size:15px;
								}
								> ._tooibar{   grid-area:toolbar;
									font-size:15px;
								}
							} 
						}
					}
				}
			}
		}
	}
}