/*### VARS ###*/
	body {
		--reportline-shrink-height:44px;
		--blockmark-width:450px;
		--report-width:450px;
		--dashboard-margin:0px;
		--dashboard-min-width:400px;
		--dashboard-width-factor:2;
		--tools-width:40px;

		--rdr-margins:5px;
		--rdr-timebackground-height:0px;
		--rdr-toolbar-height:60px;
		--rdr-stories-height:0px;
		--rdr-dashboard-line_opacity:0.2;
		--rdr-dashboard-is-one-column:0;

	}
	body.RDR.WITH_STORIES {
		--rdr-stories-height:56px;
	}



/*### COMMON ###*/
@media screen	{
	#logo {
		display:none;
	}
	
	#blockmark {
		left:var(--rdr-margins);
		top:var(--rdr-margins);
		border-radius:10px 0;
		background-color:rgba(11,50,81,0.8);
		backdrop-filter:blur(8px);
	}
	#blockmark .logo {
		display:flex;
		align-items:center;
		justify-content:center;
	}
	#blockmark .logo a {
		display:block;
		background-size:contain;
		background-repeat: no-repeat;
		background-position: center center;
	}
	#blockmark #rdrlogos {
		width:50%;
		height:100%;
		display:flex;
		flex-direction:row;
		align-items:center;
		justify-content:center;
	}
	#blockmark #rdrlogos .logo {
		height:100%;
		width:50%;
	}
	#blockmark #rdrlogos .logo a {
		width:80%;
		aspect-ratio:1;
		margin:7px;
	}
	#blockmark #rdrlogos .logorace {
		justify-content:flex-end;
	}
	#blockmark #rdrlogos .logobretagne {
		justify-content:flex-start;
	}

	#dates {
		display:none;
	}

	#vr {
		top:7px !important;
		left:auto;
		right:7px;
		border-radius:7px;
	}
	#vr a {
		display:flex;
		align-items:center;
		justify-content:center;
	}

	#forecasts .variables {
		background:linear-gradient(to right,#6EAFB5,#134163);
	}
	#forecasts .variables .var {
		background-color:transparent;
	}
	#forecasts .variables .var:hover {
		background-color:transparent;
		color:#FEED00;
		fill:#FEED00;
		stroke:#FEED00;
	}
	#forecasts .variables .var label {
		font-size:12px;
	}
	#forecasts .hours > div {
		font-size:12px;
	}
	#forecasts .options label {
		font-size:10px;
	}
	#tools {
		--button-width:34px;
		--button-height:34px;
	}

	#zoom {
		height:116px;
	}
	#zoom .button .edges {
		display:none;
	}
	#zoom .button {
		border-radius:17px !important;
	}

	#brackets {
		display:none;
	}
	#replay .gauge .backward, 
	#replay .gauge .forward {
		background-color: rgba(9,43,71,0.3);
	}
	#replay .gauge .bar {
		background-color:#092B47;
	}
	#replay .cursor {
		background-color:#092B47;
		width:11px;
		height:11px;
	}

	#timeline .button {
	border:1px solid #FFFFFF;
	}
	#timeline .button .face {
		background-color:#F2E200;
		clip-path: polygon(7px 4px, 17px 10px, 7px 16px);
	}
	#timeline .bar {
		height:8px;
		border-radius:4px;
	}
	#timeline .backbar {
		height:4px;
		border:1px solid rgba(9,43,71,0.3);
		border-radius:3px;
	}
	#datetime, 
	#chrono {
		font-size:14px;
		font-weight:400;
	}
	#datetime {
		width:120px;
	}
	#credits {
		bottom:var(--rdr-margins);
		right:var(--rdr-margins);
	}
	#credits .geovoile{
		overflow: hidden;
		border-radius:12px 0;
	}

	#display {
		bottom:calc(var(--geovoile-height) + var(--rdr-timebackground-height) + var(--rdr-margins) * 2);
		right:0;
	}
	#display .content {
		position:relative;
		margin-right:var(--rdr-margins);
		border-radius:13px 0;
	}
	#display .detect {
		right:10px;
	}
	#display > .button {
		border-radius:10px 0;
		right:var(--rdr-margins);
	}
	#display>.button>svg {
		width:34px;
		height:34px;
	}
	#display .preferences {
		right:10px;
		border-radius:11px 0;
		margin:2px;
	}
	body.TOUCHSCREEN #display.on .preferences {
		--margin:3px;
		width: calc(100% - var(--display-button-size) - var(--margin) * 5);
	}
	#display .group > label {
		font-size:12px;
		font-family:inherit;
		font-weight:800;
		text-transform:uppercase;
	}
	#display .content .button label {
		font-size:12px;
		line-height:1;
	}
	
	#report {
		left:var(--rdr-margins);
		top:calc(var(--blockmark-height) + var(--rdr-toolbar-height) + var(--rdr-stories-height) + var(--rdr-margins) * 3);
		background-image:none;
		background-color:rgba(11,50,81, 0.8);
		border-radius:10px;
		backdrop-filter:blur(8px);
	}
	body.RDR.WITH_STORIES #report {
		top:calc(var(--blockmark-height) + var(--rdr-toolbar-height) + var(--rdr-stories-height) + var(--rdr-margins) * 4);
	}

	#reportlist .row {
		position:relative;
		background-color:transparent;
		border-width:0;
	}
	#reportlist .row  * {
		position:relative;
	}
	#reportlist .row::before {
		content:'';
		position:absolute;
		top:0;
		left:25px;
		height:100%;
		right:0;
		background:
							url('report_row_bkg.svg') center / cover no-repeat,
							linear-gradient(to right, #407697, #1D3F66);
		border-radius:0 0 10px 0;
		overflow:hidden;
	}
	#reportlist .row:hover::before {
		background:
		          url('report_row_bkg.svg') center / cover no-repeat,
		          linear-gradient(to right, #4A8AB0, #255283);
	}
	#reportlist .row .rank {
		mask-image:url('rank_bkg.svg');
		mask-repeat:no-repeat;
		mask-position:center;
		mask-size:contain;
		width:60px;
		background-color:#FFFFFF;
		aspect-ratio:1;
		align-self:flex-end;
		margin:0;
		padding-left:5px;
	}
	#reportlist .row.on .rank {
		background-color:#FFFFFF;
	}
	#reportlist .row .rank .scratch {
		display:none;
	}
	body.RDRSCRATCH #reportlist .row .rank .scratch {
		display:block;
	}
	body.RDRSCRATCH #reportlist .row .rank .normal {
		display:none;
	}

	#reportlist .row .photos {
		--img-size:75px;
		margin:0px;
		height:100%;
		width:var(--img-size);
		margin:auto 5px;
		display:flex;
		align-items:center;
	}
	#reportlist .row .photos .img {
		border-radius:50%;
		align-items:center;
		width:var(--img-size);
		height:var(--img-size);
		pointer-events:none;
	}
	body.RDR #reportlist .row.story .photos .img {
		background: linear-gradient(to right, #5EBFBF, #FAF051);
		pointer-events:inherit;
	}
	#reportlist .row .photos img {
		border-radius:50%;
		width:calc(100% - 6px);
		height:calc(100% - 6px);
	}
	#reportlist .row .boat {
		white-space:normal;
		padding-right:28px;
	}
	body.RDRSCRATCH #reportlist .row.ghost:not(.hidden) {	
		display:grid !important;
	}
	#reportlist .row .infos .latedate,
	#reportlist .row.on .infos .latedate {
		color:#FFFFFF;
	}
	
	#reportswitch {
		background-color:transparent;
	}

	#dashboard {
		--aboard-width-factor:0.75;
	}
	#dashboard header {
		padding:0;
	}
	#dashboard section {
		min-width:var(--dashboard-min-width);
	}
	#dashboard section legend {
		font-size:14px;
		font-weight:600;
	}
	#dashboard section tt {
		display:none;
	}
	#dashboard .content .group {
		background-color:transparent;
	}
	#dashboard .dial.heading .lines {
		stroke-opacity:1;
		stroke:#08E7F9;
	}
	#dashboard .dial.heading .lines .main {
		stroke-opacity:1;
	}
	#dashboard .dial.heading .lines .inter {
		stroke-opacity:0.7;
	}
	#dashboard .dial.heading .lines .small {
		stroke-opacity:0.5;
	}
	#dashboard .dials text {
		opacity:1;
	}
	#dashboard .distances .tosecond, 
	#dashboard .splittime .gap.ahead {
		font-weight:800;
	}
	#dashboard.km .distances .overs .value {
		min-width:55px;
	}
	#dashboard header:not(.RAC) .buttons {
		display:none;
	}

	#boatcard {
		border-radius:10px 0;
		background: linear-gradient(to right, #5DBFC0, #39778C);
	}
	#boatcard header {
		grid-template-rows: 22px 20px;
	}
	#boatcard .infos .group {
		margin-top:0px;
		padding:3px 0;
	}
	#boatcard .infos .var {
		width:114px;
	}
	#boatcard.RAC .infos .value {
		width:33px;
	}
	#boatcard.STA article {
		min-width:0px;
	}

	#areasLayer path.zpc {
		fill:rgba(79,135,152,0.3);
		stroke:#4F8798;
	}

}



/*### RDRTIMEKEEPER ###*/
@media screen	{
	#rdrtimebackground {
		display:none;
	}
	#rdrtimekeeper {
		position:absolute;
		top:var(--rdr-margins);
		left:calc(var(--blockmark-width) / 2);
		width:calc(var(--blockmark-width) / 2);
		height:var(--blockmark-height);
		display:flex;
		flex-direction:column;
		align-items:center;
		justify-content:center;
		color:#FFFFFF;
	}
	#rdrtimekeeper .logo {
		width:80%;
		display:flex;
		justify-content:center;
	}
	#rdrtimekeeper .logo a {
		display: block;
		width:80%;
		aspect-ratio:25 / 9;
		background-size:contain;
		background-repeat:no-repeat;
		background-position: center center;
	}
	#rdrtimekeeper .chrono {
		font-weight:800;
		font-size:13px;
	}
	#rdrtimekeeper .chrono span {
		display:inline-block;
		position:relative;
		padding:0 6px;
	}
	#rdrtimekeeper .chrono span:nth-child(n+2)::before {
		content:'';
		position:absolute;
		left:-3px;
		top:50%;
		height:80%;
		transform:translateY(-50%);
		width:2px;
		background-color:rgba(255,255,255,0.4); 
	}
	#rdrtimekeeper .chrono .days::after {
		content:'J';
	}
	#rdrtimekeeper .chrono .hours::after {
		content:'H';
	}
	#rdrtimekeeper .chrono .minutes::after {
		content:'MIN';
	}
	#rdrtimekeeper .chrono .seconds::after {
		content:'SEC';
	}
}



/*### RDRTOOLBAR ###*/
@media screen	{
	#rdrtoolbar {
		position:absolute;
		left:var(--rdr-margins);
		top:calc(var(--blockmark-height) + var(--rdr-margins) * 2);
		width:var(--blockmark-width);
		height:var(--rdr-toolbar-height);
		background-color:rgba(11,50,81, 0.8);
		border-radius:10px 0;
		display:flex;
		align-items:center;
		backdrop-filter:blur(8px);
	}
	#rdrtoolbar .langs {
		display:flex;
		align-items:center;
		justify-content:center;
		background-color:#FFFFFF;
		height:32px;
		border-radius:7px;
		padding:7px;
		box-sizing: border-box;
		margin-left:7px;
	}
	#rdrtoolbar .langs .onoff {
		--pad:0px;
		--width-factor:2;
		margin:0 7px;
	}
	#rdrtoolbar .langs .onoff::before,
	#rdrtoolbar .langs .onoff.on::before {
		background-color: rgba(0,0,0,0.1);
	}
	#rdrtoolbar .langs .onoff::after,
	#rdrtoolbar .langs .onoff.on::after {
		background-color:rgba(0,0,0,0.7);
	}
	#rdrtoolbar .langs .onoff:hover::after,
	#rdrtoolbar .langs .onoff.on:hover::after {
		background-color:rgba(0,0,0,1);
	}

	#rdrtoolbar .langs .lang {
		display:flex;
		flex-direction:column;
		align-items:center;
		font-size:9px;
	}
	#rdrtoolbar .langs .lang svg {
		width:12px;
		aspect-ratio:6 / 4;
	}
	#rdrtoolbar .search {
		flex:auto;
		background-color:#FFFFFF;
		border-radius:16px;
		height:32px;
		margin:7px;
		padding:0 7px 0 16px;
		display:flex;
		box-sizing: border-box;
	}
	#rdrtoolbar .search input {
		flex:auto;
		border:0px;
		height:30px;
	}
	#rdrtoolbar .search .glass {
		width:20px;
		aspect-ratio:1;
		cursor:pointer;
	}
	#rdrtoolbar .search .glass .state {
		display:none;
	}
	#rdrtoolbar .search .glass .state.off {
		display:block;
	}
	#rdrtoolbar .search .glass.on .state.off {
		display:none;
	}
	#rdrtoolbar .search .glass.on .state.on {
		display:block;
	}
	#rdrtoolbar .recap {
		position:relative;
		color:#FFFFFF;
		margin:7px 10px;
		padding-left:12px;
		display:none;
		flex-direction:column;
		align-items:center;
		box-sizing: border-box;
		cursor:pointer;
	}
	body.RDR #rdrtoolbar .recap {
		display:flex;
	}
	#rdrtoolbar .recap::before {
		content:'';
		position:absolute;
		top:0;
		left:0;
		width:1px;
		height:100%;
		background-color:rgba(255,255,255,0.2);
	}
	#rdrtoolbar .recap .button {
		background-color:#FFED00;
		border-radius:5px;
		width:25px;
		aspect-ratio:1;
		display:flex;
		align-items:center;
		justify-content:center;
	}
	#rdrtoolbar .recap .button svg {
		width:80%;
		aspect-ratio:1;
	}
}



/*### RDRSTORIES ###*/
@media screen	{
	#rdrstories {
		position:absolute;
		left:var(--rdr-margins);
		top:calc(var(--blockmark-height) + var(--rdr-toolbar-height) + var(--rdr-margins) * 3);
		width:var(--blockmark-width);
		height:var(--rdr-stories-height);
		display:none;
		align-items:center;
		color:#FFFFFF;
		background-color:rgba(11,50,81, 0.8);
		border-radius:10px 0;
		backdrop-filter:blur(8px);
	}
	body.RDR.WITH_STORIES #rdrstories {
		display:flex;
	}

	#rdrstories .text {
		padding:0 9px 0 7px;
		font-size:11px;
	}
	#rdrstories .stories {
		flex:auto;
		overflow-x:auto;
		overflow-y:hidden;
		scroll-behavior:smooth;
		scrollbar-width:none;
		white-space:nowrap;
	}
	#rdrstories .stories::-webkit-scrollbar {
		width:0px;
	}
	#rdrstories .story {
		display:inline-flex;
		align-items:center;
		justify-content:center;
		background: linear-gradient(to right, #5EBFBF, #FAF051);
		border-radius:50%;
		aspect-ratio:1;
		width:38px;
		margin:0 3px 0 2px;
	}
	#rdrstories .story .image {
		background-color:#FFFFFF;
		border-radius:50%;
		aspect-ratio:1;
		width:36px;
		overflow:hidden;
		cursor:pointer;
	}
	#rdrstories .story .image img {
		height:100%;
		width:100%;
	}
	#rdrstories .arrow {
		display:flex;
		align-items:center;
		justify-content:center;
		height:100%;
		cursor:pointer;
	}
	#rdrstories .arrow.off {
		visibility:hidden;
	}
	#rdrstories .arrow svg {
		width:10px;
		aspect-ratio:1;
		margin:3px;
		stroke:#FFFFFF;
		stroke-width:2;
		fill:none;
	}
}



/*### RDRRANKINGTYPE ###*/
@media screen	{
	#rdrrankingtype {
		display:flex;
		flex-direction:column;
		align-items:center;
		justify-content: space-evenly;
		padding:0 5px;
		color:#FFFFFF;
		font-size:11px;
	}
	#rdrrankingtype .switch {
		display:flex;
		align-items:center;
	}
	#rdrrankingtype .switch .onoff {
		--height:14px;
		--pad:0px;
		--width-factor:2;
		margin:0 7px;
	}
	#rdrrankingtype .switch .onoff::before {
		background-color:#5DBFC0;
	}
	#rdrrankingtype .switch .onoff::after {
		background-color:#FFFFFF;
	}
	#rdrrankingtype .switch .onoff:hover::after {
		background-color:#FFFFFF;
	}

}



/*### RDRDASHBOARD ###*/
@media screen	{
	#rdrdbheader {
		--img-size:75px;
		display:flex;
		flex-direction:column;
	}
	#rdrdbheader .board {
		display:flex;
		align-items:center;
		border-bottom:1px solid rgba(255,255,255, var(--rdr-dashboard-line_opacity));
	}
	#rdrdbheader .title {
		text-transform:uppercase;
		padding-left:0.5em;
		font-size:14px;
		font-weight:600;
	}
	#rdrdbheader .date {
		text-transform:uppercase;
		padding-left:0.5em;
		font-size:12px;
		font-weight:600;
		border-left:1px solid rgba(255,255,255, var(--rdr-dashboard-line_opacity));
		margin:0 10px;
	}
	#rdrdbheader .identity {
		display:flex;
		margin:15px;
	}
	#dashboard header:not(.RAC) #rdrdbheader .identity {
		flex-direction: column;
	}
	#rdrdbheader .identity .skipper {
		display:grid;
		grid-template-columns:90px auto;
	}
	#dashboard header.RAC #rdrdbheader .identity .skipper {
		width:50%;
	}
	#rdrdbheader .identity .skipper .photo {
		grid-column:1;
		grid-row:1 / 3;
	}
	#rdrdbheader .identity .skipper .photo .img {
		display:flex;
		justify-content:center;
		overflow:hidden;
		border-radius:50%;
		align-items:center;
		width:var(--img-size);
		height:var(--img-size);
		pointer-events:none;
	}
	body.RDR #dashboard.story #rdrdbheader .identity .skipper .photo .img {
		background:linear-gradient(to right, #5EBFBF, #FAF051);
		cursor:pointer;
		pointer-events: initial;
	}
	#rdrdbheader .identity .skipper .photo .img img {
		border-radius:50%;
		width:calc(100% - 4px);
		height:calc(100% - 4px);
	}
	#rdrdbheader .identity .skipper .name {
		grid-column:2;
		grid-row:1;
		font-size:18px;
		font-weight:var(--skippername-font-weight);
		display:flex;
	}
	#rdrdbheader .identity .skipper .name .lastname {
		text-transform:uppercase;
	}
	#rdrdbheader .identity .skipper .link {
		grid-column:2;
		grid-row:2;
	}
	#rdrdbheader .identity .skipper .link span {
		display:inline-flex;
		align-items:center;
		background-color:#FEED00;
		color:#092B47;
		padding:3px 9px;
		border-radius:7px 0;
		cursor:pointer;
	}
	#rdrdbheader .identity .skipper .link svg {
		height:12px;
		width:12px;
		stroke-width:2px;
		fill:none;
		stroke:#092B47;
		stroke-linecap:round;
		stroke-linejoin:round;
	}
	#rdrdbheader .identity .boat {
		display:flex;
	}
	#dashboard header.RAC #rdrdbheader .identity .boat {
		width:50%;
	}
	#dashboard header:not(.RAC) #rdrdbheader .identity .boat {
		margin-top:7px;
	}
	#rdrdbheader .identity .boat .photo {
		margin-right:5px;
	}
	#rdrdbheader .identity .boat .name {
		font-size:14px;
		font-weight:var(--boatname-font-weight);
	}
	#rdrdbheader .buttons {
		position:relative;
		display:flex;
		justify-content:center;
		background-color:#0A1447;
	}
	#rdrdbheader .buttons .switchnmkm {
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		left:10px;
		display:flex;
		align-items:center;
	}
	#rdrdbheader .buttons .switchnmkm .onoff {
		--height:14px;
		--pad:0px;
		--width-factor:2;
		margin:0 7px;
	}
	#rdrdbheader .buttons .switchnmkm .onoff::before {
		background-color:#5DBFC0;
	}
	#rdrdbheader .buttons .switchnmkm .onoff::after {
		background-color:#FFFFFF;
	}
	#rdrdbheader .buttons .switchnmkm .onoff:hover::after {
		background-color:#FFFFFF;
	}
	#rdrdbheader .buttons .tab {
		width:110px;
		background-color:#15355C;
		border-radius:7px 0;
		text-align:center;
		line-height:25px;
		margin:5px;
		cursor:pointer;
	}
	#dashboard.perf #rdrdbheader .buttons .tab[data-type="perf"],
	#dashboard.aboard #rdrdbheader .buttons .tab[data-type="aboard"] {
		background-color:#5DBFC0;
	}
	#dashboard:not(.perf) #rdrdbheader .buttons .tab[data-type="perf"]:hover,
	#dashboard:not(.aboard) #rdrdbheader .buttons .tab[data-type="aboard"]:hover {
		background-color:rgba(93,191,192, 0.4);
	}
	body:not(.RDR) #dashboard #rdrdbheader .buttons .tab[data-type="aboard"] {
		display:none !important;
	}
	.rdrgroup {
		position:relative;
	}
	.rdrgroup.aboard {
		display:none;
	}
	.rdrgroup:first-of-type::after {
		content:'';
		position:absolute;
		right:0;
		top:50%;
		transform:translateY(-50%);
		width:1px;
		height:90%;
		border-left:1px solid rgba(255,255,255, var(--rdr-dashboard-line_opacity));
	}
	.rdrgroup section.distances {
		border-top:1px solid rgba(255,255,255, var(--rdr-dashboard-line_opacity));
		border-top-width:1px !important;
	}
	.rdrgroup section.distances.rdrspeeds {
		border-top-width:0px !important;
	}
	.rdrgroup section.statistics {
		display:flex;
		justify-content: center;
	}
	.rdrgroup section.statistics legend {
		display: block !important;
		text-align:center;
		background-color:transparent;
	}
	.rdrgroup section.statistics .tabs {
		display:flex;
		justify-content:center;
	}
	.rdrgroup section.statistics .tabs .tab {
		line-height:20px;
		border-radius:10px;
		border:1px solid #5DBFC0;
		color:#5DBFC0;
		width:49px;
		text-align:center;
		margin:0 6px;
	}
	.rdrgroup section.statistics .speeds {
		display:none;
		justify-content:center;
		margin:30px 0;
	}
	#dashboard.statsh4 .rdrgroup section.statistics .speeds.h4,
	#dashboard.statsh24 .rdrgroup section.statistics .speeds.h24,
	#dashboard.statsh48 .rdrgroup section.statistics .speeds.h48,
	#dashboard.statstot .rdrgroup section.statistics .speeds.tot {
		display:flex;
	}
	#dashboard.statsh4 .rdrgroup section.statistics .tabs .tab[data-val="h4"],
	#dashboard.statsh24 .rdrgroup section.statistics .tabs .tab[data-val="h24"],
	#dashboard.statsh48 .rdrgroup section.statistics .tabs .tab[data-val="h48"],
	#dashboard.statstot .rdrgroup section.statistics .tabs .tab[data-val="tot"] {
		background-color:#5DBFC0;
		color:#FFFFFF;
	}
	#dashboard:not(.statsh4) .rdrgroup section.statistics .tabs .tab[data-val="h4"]:hover,
	#dashboard:not(.statsh24) .rdrgroup section.statistics .tabs .tab[data-val="h24"]:hover,
	#dashboard:not(.statsh48) .rdrgroup section.statistics .tabs .tab[data-val="h48"]:hover,
	#dashboard:not(.statstot) .rdrgroup section.statistics .tabs .tab[data-val="tot"]:hover {
		background-color:rgba(93,191,192, 0.4);
	}
	.rdrgroup section.statistics .speeds .label {
		font-size: 15px;
		text-transform:uppercase;
	}
	.rdrgroup section.statistics .speeds .data {
		display:flex;
		flex-direction:column;
		align-items:center;
		width:45%;
	}
	.rdrgroup section.statistics .speeds .data .var {
		display:flex;
		align-items:center;
		margin:15px 0;
	}
	.rdrgroup section.statistics .speeds .data .var .value {
		font-size:24px;
		font-weight:600;
		padding-right:5px;
	}
	.rdrgroup section.statistics .speeds .data .var .unit {
		font-size:16px;
	}

	.rdrgroup section.aboard {
		width:calc(var(--dashboard-min-width) * 2 + 10px);
	}
	.rdrgroup section.aboard.waiting {
		display:block;
	}
	.rdrgroup section.aboard .content {
		--visual-height:150;
		--max-height:300;
		--gap:5;
		font-size:0;
		flex-shrink:0;
		display:flex;
		justify-content:center;
	}
	.rdrgroup section.aboard .content .gallery {
		display:flex;
		flex-wrap:wrap;
		gap:calc(var(--gap) * 1px);
	}
	.rdrgroup section.aboard .content .gallery img {
		display: block;
		flex-shrink: 0;
		cursor:zoom-in;
	}
	#dashboard.aboard .rdrgroup.perf {
		display:none;
	}
	#dashboard.aboard .rdrgroup.aboard {
		display:block;
	}
	#dashboard.aboard .switchnmkm,
	#dashboard.nm .nmkm.km,
	#dashboard.km .nmkm.nm {
		display:none !important;
	}

}



/*### RDRABOARDPHOTO ###*/
@media screen	{
	#rdraboardphoto {
		position:fixed;
		top:0;
		left:0;
		bottom:0;
		right:0;
		display:none;
		flex-direction:column;
		justify-content:center;
		align-items:center;
		background-color:rgba(9,43,71,0.3);
		backdrop-filter:blur(20px);
		z-index:10000;
	}
	#rdraboardphoto.on {
		display:flex;
	}
	#rdraboardphoto img {
		max-width:85%;
		max-height:85%;
		cursor:zoom-out;
	}
	#rdraboardphoto .caption {
		color:#FFFFFF;
		margin:5px;
	}
	#rdraboardphoto .credit {
		color:#FFFFFF;
		margin:5px;
	}
}



/*### ONBOARDING ###*/
@media screen	{
	#onboarding {
		position:absolute;
		top:0;
		left:0;
		right:0;
		bottom:0;
		z-index:20000;
		overflow:hidden;
		display:flex;
		flex-direction:column;
		align-items:center;
		justify-content:center;
		visibility:hidden;
	}
	#onboarding.on {
		visibility:visible;
	}
	#onboarding .mask {
		position:absolute;
		top:0;
		left:0;
		right:0;
		bottom:0;
	}
	#onboarding .mask svg {
		position:relative;
		width:100%;
		height:100%;
	}
	#onboarding .mask svg path.dark {
		fill:rgba(0,0,32,0.8);
	}
	#onboarding .mask svg path.link {
		stroke:#FFFEEC;
		stroke-width:3;
		fill:none;
	}
	#onboarding .content {
		display:flex;
		flex-direction:column;
		align-items:center;
		justify-content:center;
		max-width:50%;
		height:100%;
		font-size:max(12px, min(20px, 1.6vw));
	}
	#onboarding .content>* {
		position:relative;
		flex:1 1 0;
		display:flex;
		flex-direction:column;
		align-items:center;
	}

	#onboarding .message {
		justify-content:flex-end;
		margin-bottom:1vw;
		          	}
	#onboarding .text {
		position:relative;
		padding:1em;
		border-radius:1em;
		background-color:#4E546B;
		text-align:center;
		color:#FFFFFF;
	}
	#onboarding .buttons {
		justify-content:flex-start;
		color:#FFFFFF;
		stroke:#FFFFFF;
		font-size:smaller;
		line-height:2;
		cursor:pointer;
	}
	#onboarding .buttons>div {
		background-color:rgba(0,0,32,0.8);
		display:flex;
		flex-direction:column;
		align-items:center;
		justify-content:center;
		padding:0.5em;
	}
	
	body.ONBOARDING_forecast #forecasts {
		display:block;
	}
	body.ONBOARDING_forecast #vr {
		display:none;
	}
	body.ONBOARDING_display #display {
		display:block;
	}

	#rdrwelcome {
		display:none;
		position:absolute;
		top:0;
		left:0;
		right:0;
		bottom:0;
		background-color:rgba(0,0,32,0.8);
		display:flex;
		justify-content:center;
		align-items:center;
		visibility:hidden;
	}
	#rdrwelcome.on {
		visibility:visible;
	}
	#rdrwelcome .screen {
		position:relative;
		aspect-ratio:1000 / 656;
		width:75vw;
		max-width:800px;
		background-image:url(onboarding_welcome_screen.jpg);
		background-size: contain;
		border-radius:1vh;
	}
	#rdrwelcome .screen>a {
		position:absolute;
		top:46.5%;
		left:31%;
		width:12%;
		aspect-ratio:1;
		display:block;
		border-radius:50%;
		cursor:pointer;
	}
	#rdrwelcome .screen>a+a {
		left:59.4%;
	}

}



/*### RDRVERSIONS ###*/
@media screen	{
	#rdrversions {
		position:absolute;
		bottom:2px;
		left:calc(50vw + var(--report-width) / 2);
		transform:translateX(-50%);
		display:flex;
		align-items:center;
		background-color:#FFFFFF;
		color:#151A2E;
		border-radius:12px;
		height:22px;
		line-height:22px;
	}
	#rdrversions>a {
		padding:0 1px 0 1em;
		display:flex;
		align-items:center;
		height:calc(100% - 2px);
		cursor:pointer;
	}
	#rdrversions>a::after {
		content:'';
		display:inline-block;
		height:100%;
		aspect-ratio:1;
		border-radius:50%;
		margin-left:0.5ex;
		background-color:#5DBFC0;
	}
	#rdrversions>a.school::after {
		background-image:url(tymal_version.svg);
		background-size:contains;
	}
	#rdrversions>a.standard {
		pointer-events:none;
	}

	#lighthousesLayer,
	#lighthousesLayer * {
		pointer-events:none !important;
	}
}




/*### RDRCLASSES ###*/
@media screen	{
	#rdrclasses {
		display:flex;
	}
	#boatclasseslist .boatclass,
	#rdrdbheader {
		--class-id:0;
	}
	#boatclasseslist {
		flex:auto;
	}
	#boatclasseslist .boatclass,
	#rdrdbheader .boatclass {
		--icon-size:30px;
		position:relative;
		display:flex;
		align-items:center;
		justify-content:center;
		padding:3px 0 0 7px;
		background-color:transparent;
		color:#FFFFFF;
		font-size:12px;
		font-weight:600;
		line-height:1;
		border-radius:7px 0 7px 0;
		box-sizing:border-box;
		height:40px;
	}
	#boatclasseslist .boatclass {
		--class-index:0;
		margin-left:-7px;
		z-index:calc(100 - var(--class-index));
	}
	#boatclasseslist .boatclass[data-index="0"],
	#rdrdbheader .boatclass[data-index="0"] {
		margin-left:0;
		padding:0 3px 0 4px;
	}
	body.RDRSCRATCH  #boatclasseslist .boatclass.on .text {
		display:none !important;
	}
	#boatclasseslist .boatclass::before,
	#rdrdbheader .boatclass::before {
		content:'';
		height:var(--icon-size);
		aspect-ratio:1;
		background-image:url(icons_classes.png);
		background-repeat:no-repeat;
		background-size:auto 100%;
		background-position-x:calc(var(--icon-size) * var(--class-index) * -1);
	}
	#boatclasseslist .boatclass .text,
	#rdrdbheader .boatclass .text {
		display:none;
		padding-right:5px;
		width:50px;
	}
	#boatclasseslist .boatclass.on,
	#rdrdbheader .boatclass.on {
		background-color:transparent;
	}
	#boatclasseslist .boatclass.on .text,
	#rdrdbheader .boatclass.on .text {
		display:block;
	}
	
	#boatclasseslist .boatclass[rel="2"],
	#rdrdbheader[data-class="2"] .boatclass,
	#rdrdbheader[data-class="2"] .skipper img,
	body.RDRSCRATCH #reportlist .row[alt="class2"] .rank,
	#reportlist .row[alt="class2"] .photos img,
	#rdrstories .story .image.class2 {
		--class-index:0;
		background-color:#659DBE !important;
		color:#FFFFFF;
	}
	
	#boatclasseslist .boatclass[rel="4"],
	#rdrdbheader[data-class="4"] .boatclass,
	#rdrdbheader[data-class="4"] .skipper img,
	body.RDRSCRATCH #reportlist .row[alt="class4"] .rank,
	#reportlist .row[alt="class4"] .photos img,
	#rdrstories .story .image.class4 {
		--class-index:1;
		background-color:#56BCF6;
		color:#FFFFFF;
	}
	
	#boatclasseslist .boatclass[rel="1"],
	#rdrdbheader[data-class="1"] .boatclass,
	#rdrdbheader[data-class="1"] .skipper img,
	body.RDRSCRATCH #reportlist .row[alt="class1"] .rank,
	#reportlist .row[alt="class1"] .photos img,
	#rdrstories .story .image.class1 {
		--class-index:2;
		background-color:#7894F7;
		color:#FFFFFF;
	}
	
	#boatclasseslist .boatclass[rel="3"],
	#rdrdbheader[data-class="3"] .boatclass,
	#rdrdbheader[data-class="3"] .skipper img,
	body.RDRSCRATCH #reportlist .row[alt="class3"] .rank,
	#reportlist .row[alt="class3"] .photos img,
	#rdrstories .story .image.class3 {
		--class-index:3;
		background-color:#5DBFC0;
		color:#FFFFFF;
	}
	
	#boatclasseslist .boatclass[rel="5"],
	#rdrdbheader[data-class="5"] .boatclass,
	#rdrdbheader[data-class="5"] .skipper img,
	body.RDRSCRATCH #reportlist .row[alt="class5"] .rank,
	#reportlist .row[alt="class5"] .photos img,
	#rdrstories .story .image.class5 {
		--class-index:4;
		background-color:#FCF150;
		color:#092b47;
	}
	
	#boatclasseslist .boatclass[rel="6"],
	#rdrdbheader[data-class="6"] .boatclass,
	#rdrdbheader[data-class="6"] .skipper img,
	body.RDRSCRATCH #reportlist .row[alt="class6"] .rank,
	#reportlist .row[alt="class6"] .photos img,
	#rdrstories .story .image.class6 {
		--class-index:5;
		background-color:#F19F39;
		color:#FFFFFF;
	}
}



@media (min-width:901px) {
	
	body {
		--vr-width:130px;
		--time-height:30px;
		--geovoile-height:54px;
		--display-button-size:45px;
		--reportline-height:95px;
	}

	#blockmark {
		justify-content:flex-start;
	}

	#sig {
		left:0;
		bottom:0;
	}
	
	body.WEATHER #vr {
		top:92px !important;
	}
	
	#report {
		bottom:0;
	}
	#reportlist {
		width:calc(var(--report-width) + var(--dashboard-link-width));
	}
	#reportlist .row {
		grid-template-columns: auto auto 1fr;
		grid-template-rows:25px 20px 40px;
		margin:0 20px 0px 4px;
		width:calc(var(--report-width) - var(--dashboard-link-width) - 8px);
	}
	#report.classic #reportlist .row.on {
		background-color:transparent;
	}
	#reportlist .row .open {
		top:50%;
		transform:translateY(-50%);
		height:80%;
		border-radius: 0 10px 10px 0;
	}
	#report.classic #reportlist .row {
		border-top:8px solid transparent;
	}	
	#report.shrink #reportlist .row,
	#report.small #reportlist .row {
		border-bottom:1px solid rgba(255,255,255,0.3);
		margin:0;
	}
	#report.shrink #reportlist .row::before,
	#report.small #reportlist .row::before {
		display:none;
	}
	#report.shrink #reportlist .row {
		grid-template-columns: auto auto 1fr;
		grid-template-rows:23px 21px;
	}
	#report.shrink #reportlist .row .rank {
		mask-image:none;
		width:auto;
		height:100%;
		grid-row:1 / 3;
	}
	body:not(.RDRSCRATCH)  #report.shrink #reportlist .row .rank {
		background-color:transparent;
		color:#FFFFFF;
	}
	#report.shrink #reportlist .row .photos {
		--img-size:35px;
		display:flex !important;
	}
	#report.shrink #reportlist .row .icon {
		display:none;
	}
	#report.small #reportlist .row {
		grid-template-columns:auto 1fr;
	}
	#report.small #reportlist .row .rank {
		mask-image:none;
		width:38px;
		padding-right:7px;
		height:100%;
		font-size:14px;
		align-items: flex-end;
	}
	body:not(.RDRSCRATCH)  #report.small #reportlist .row .rank {
		background-color:transparent;
		color:#FFFFFF;
	}
	#report.small #reportlist .row .boat {
		padding-left:1ex;
	}
	body.DASHBOARD #reportlist .row.on .open {
		visibility:visible; 
		width:50px;
		right:-51px;
		pointer-events:initial;
		border-radius:0px;
	}
	body.DASHBOARD #reportlist .row.on .open svg {
		transform:rotate(180deg);
	}
	
	#dashboard {
		left:calc(var(--report-width) + 25px);
		border-radius:12px 0;
		min-width:var(--dashboard-min-width);
		width:auto;
	}
	#dashboard section {
		min-width:var(--dashboard-min-width);
	}
	#dashboard header .close.active {
		display:none !important;
	}
	#dashboard header .close.on {
		display:none;
	}
	#dashboard article.RAC {
		flex-direction:row;
	}
	#rdrdbheader .date {
		min-width:200px;
	}
	
	#zoomwindow {
		top:75px;
		bottom:75px;
		left:calc(5vmin + var(--report-width));
	}
	body.DASHBOARD:not(.DASHBOARD_IN) #zoomwindow {
		left:calc(5vmin + var(--report-width) + var(--dashboard-min-width) + var(--dashboard-margin));
	}	
	body.DASHBOARD.RDR_DASHBOARD_LARGE:not(.DASHBOARD_IN) #zoomwindow {
		left: calc(5vmin + var(--report-width) + var(--dashboard-min-width) * 2 + var(--dashboard-margin));
	}	

	#time {
		--date-radius:10px;
		left:calc(var(--report-width) + 30px);
		right:0;
		bottom:20px;
		background-color:transparent;
	}
	#chrono {
		display:none;
	}
	#refresh {
		border-radius:var(--date-radius) 0 0 var(--date-radius);
	}
	#replay {
		background-color:#FFFFFF;
		margin-left:0px;
		border-radius:0 var(--date-radius) var(--date-radius) 0;
	}
	
	#tools {
		right:12px;
	}

	#forecasts {
		top:7px;
		right:7px;
		border-radius:7px;
		overflow:hidden;
	}
	#forecasts .cursor {
		border-radius:7px;
	}
	#forecasts .currentdate {
		border-radius:7px 0 0 7px;
	}
	#forecasts .variables .var.on {
		border-radius:7px;
	}
	#forecasts .variables .var.on:hover {
		background-color: #FEED00;
		color:#181D31;
		fill:#181D31;
		stroke:#181D31;
	}

	#rdrtimekeeper::before {
		content:'';
		position:absolute;
		left:0;
		top:50%;
		height:74px;
		transform:translateY(-50%);
		width:2px;
		background-color:rgba(255,255,255,0.4); 
	}

}



@media (max-width:1400px) {
	body {
		--dashboard-min-width:310px;
	}
}



@media (max-width:1200px) {
	body {
		--dashboard-min-width:250px;
	}
	#dashboard .dial svg {
		width: 120px;
	}
	.rdrgroup section.statistics .speeds .label {
		font-size:12px;
	}
	.rdrgroup section.statistics .speeds .data .var .value {
		font-size:19px;
	}
	.rdrgroup section.statistics .speeds .data .var .unit {
		font-size:16px;
	}
	#rdrdbheader .skipper {
		grid-template-columns:0px auto;
	}
	#rdrdbheader .identity .skipper .photo {
		display:none;
	}
	#rdrdbheader .identity .skipper .name {
		font-size:13px;
	}
	#rdrdbheader .identity .skipper .link {
		display:none;
	}
}



@media (max-width:1100px) {
	#dashboard article.RAC {
		flex-direction:column;
	}
}



@media (max-width:900px) {
	#onboarding {
		display:none !important;
	}
	body {
		--blockmark-width:100px;
		--blockmark-height:50px;
		--rdr-toolbar-height:50px;
		--main-radius:7px;
		--time-height:52px;
		--timeline-height:52px;
		--timekeeper-height:24px;
		--geovoile-height:40px;
		--panelslider-height:30px;
		--panelslider-width:30px;
		--reportswitch-height:30px;
		--reportline-shrink-height:46px;

		--rdrtimekeeper-width:120px;
		--rdr-margins:4px;
		--rdr-timebackground-height:65px;
		--rdr-dashboard-is-one-column:1;
	}

	#vr,
	#rdrtoolbar .langs,
	#replay,
	#refresh {
		display:none !important;
	}

	#blockmark {
		width:calc(--blockmark-width);
		border-radius:var(--main-radius);
		padding:var(--rdr-margins);
		box-sizing:border-box;
	}
	#blockmark #rdrlogos {
		width:100%;
	}
	#blockmark #rdrlogos .logo a {
		margin:5px;
	}
	
	#rdrtoolbar {
		--left:calc(var(--blockmark-width) + var(--rdr-margins) * 2);
		left:var(--left);
		top:var(--rdr-margins);
		width:auto;
		right:var(--rdr-margins);
		border-radius:var(--main-radius);
	}
	
	#rdrstories {
		top:calc(var(--blockmark-height) + var(--rdr-margins) * 2);
		width:auto;
		right:var(--rdr-margins);
		border-radius:var(--main-radius);
	}
	
	#report {
		top:calc(var(--blockmark-height) + var(--rdr-stories-height) + var(--rdr-margins) * 2);
		right:var(--rdr-margins);
		background-color:transparent;
		backdrop-filter:none;
	}
	body.RDR #report {
		top:calc(var(--blockmark-height) + var(--rdr-stories-height) + var(--rdr-margins) * 3);
	}
	#report.open, body.MULTICLASS #report.open {
		height:calc(100% - 190px);
	}
	body.MULTICLASS #report {
		height:95px;
	}
	#report.open, 
	body.MULTICLASS #report.open {
		top:calc(var(--blockmark-height) + var(--rdr-stories-height) + var(--rdr-margins) * 2);
	}
	body.RDR #report.open, 
	body.RDR.MULTICLASS #report.open {
		top:calc(var(--blockmark-height) + var(--rdr-stories-height) + var(--rdr-margins) * 3);
	}
	#report.open #reportlist {
		background-color:rgba(11,50,81, 0.8);
		backdrop-filter:blur(8px);
		border-radius:5px;
	}
	#reportlist .row {
		margin:var(--rdr-margins) 0 0 0;
		width:100%;
		box-sizing:border-box;
	}
	#report.open #reportlist .row {
		margin: 8px 0px 0px 4px;
	}
	#report:not(.open).shrink .row::before {
		height:30px;
	}
	#reportlist .row.on, 
	#reportlist .row.on:hover {
		background-color:transparent;
	}
	#reportlist .row.on .open {
		top:auto;
		bottom:0;
		width:50px;
		height:16px;
		right:10px;
		border-radius:0 0 16px 16px;
	}
	#reportlist .row.on .open.on {
		border-radius:0;
	}
	#report:not(.open).shrink #reportlist .row {
		grid-template-rows: 30px 10px auto;
	}
	#report:not(.open).shrink #reportlist .row .rank, 
	#report:not(.open).shrink #reportlist .row.on .rank {
		width:40px;
		grid-row:1 / 3;
	}
	#report.open.small #reportlist .row,
	#report.open.shrink #reportlist .row {
		border-bottom:1px solid rgba(255,255,255,0.3) !important;
		margin:0;
	}
	#report.open.shrink #reportlist .row::before,
	#report.open.small #reportlist .row::before {
		display:none;
	}
	#report.open.shrink #reportlist .row {
		grid-template-columns: auto auto 1fr;
		grid-template-rows:23px 21px;
	}
	#report.open.shrink #reportlist .row .rank {
		mask-image:none;
		background-color:transparent;
		color:#FFFFFF;
		width:auto;
		height:100%;
		grid-row:1 / 3;
	}
	#report.open.shrink #reportlist .row .photos {
		--img-size:35px;
		display:flex !important;
	}
	#report.open.shrink #reportlist .row .icon {
		display:none;
	}
	#report.open.small #reportlist .row {
		grid-template-columns:auto 1fr;
	}
	#report.open.small #reportlist .row .rank {
		mask-image:none;
		background-color:transparent;
		color:#FFFFFF;
		width:38px;
		padding-right:7px;
		height:100%;
		font-size:14px;
		align-items: flex-end;
	}

	#rdrclasses {
		background-color:rgba(11,50,81, 0.8);
		border-radius:var(--main-radius);
		backdrop-filter:blur(8px);
	}
	
	#report.open #reportswitch {
		background-color:rgba(11,50,81,0.8);
		backdrop-filter:blur(8px);
		margin:var(--rdr-margins) 0;
		margin-left:calc(var(--panelslider-width) + var(--rdr-margins));
		border-radius:5px;
	}

	body.MULTICLASS #panelslider,
	body.MULTICLASS #panelslider.open {
		left:var(--rdr-margins);
		top:106px;
		border-radius:5px;
		background-color:rgba(11,50,81,0.8);
		backdrop-filter:blur(8px);
	}
	body.RDR.MULTICLASS #panelslider,
	body.RDR.MULTICLASS #panelslider.open {
		top:162px;
	}
	
	#dashboard {
		--aboard-width-factor:1;
	}
	body.RACE.DASHBOARD #dashboard,
	body.RACE.MULTICLASS #dashboard,
	body.RACE.MULTICLASS.DASHBOARD #dashboard {
		--top:154px;
		top:var(--top) !important;
		left:var(--rdr-margins);
		right:var(--rdr-margins);
		width:auto;
		border-radius:12px;
	}
	body.RDR.RACE.DASHBOARD #dashboard,
	body.RDR.RACE.MULTICLASS #dashboard,
	body.RDR.RACE.MULTICLASS.DASHBOARD #dashboard {
		--top:208px;
	}
	body.RACE.MULTICLASS.DASHBOARD #dashboard {
		height:calc(100% - var(--top) - 71px);
	}
	body.RACE #dashboard header {
		display:block;
	}
	#rdrdbheader .identity {
		margin:5px;
		flex-direction:row !important;
	}
	#rdrdbheader .skipper,
	#rdrdbheader .boat {
		position:relative;
		display:block;
		padding:5px;
		box-sizing:border-box;
	}
	#rdrdbheader .skipper::after {
		content:'';
		position:absolute;
		top:50%;
		height:100%;
		right:0;
		transform:translateY(-50%);
		border-left:1px solid rgba(255,255,255,0.3);
	}
	#rdrdbheader .identity .skipper .name {
		font-size:14px;
	}
	#rdrdbheader .identity .skipper .name small {
		text-transform:none;
	}
	#rdrdbheader .photo,
	#rdrdbheader .identity .skipper .link {
		display:none !important;
	}
	#rdrdbheader .buttons .switch {
		position: relative;
		top:auto;
		transform:none;
		left:auto;
		flex:auto;
		justify-content:center;
	}
	.rdrgroup section.aboard {
		width:auto;
	}
	.rdrgroup section.aboard .content {
		--visual-height:100;
		--max-height:200;
		--gap:3;
	}	
	#sig {
		top:0;
		bottom:0;
	}

	#rdrtimebackground {
		position:absolute;
		display:block;
		left:var(--rdr-margins);
		right:var(--rdr-margins);
		bottom:var(--rdr-margins);
		height:var(--rdr-timebackground-height);
		background-color:rgba(11,50,81, 0.8);
		border-radius:var(--main-radius);
		backdrop-filter:blur(8px);
	}


	#time {
		background-color:transparent;
		left:var(--rdr-margins);
		bottom:25px;
		right:var(--rdr-margins);
		padding-left:var(--rdrtimekeeper-width);
	}
	#chrono {
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		left:var(--rdr-margins);
		padding:4px;
		width:var(--rdrtimekeeper-width);
		border-radius:12px;
		box-sizing:border-box;
		background-color:#FFFFFF;
		color:#181d31;
		font-size:11px;
	}
	#chrono i {
		display:none;
	}
	#chrono u {
		font-weight:600;
		font-variant-numeric: tabular-nums;
	}
	#chrono u::after {
		font-weight:400;
		text-transform:uppercase;
	}
	#chrono>span>s:nth-child(1)>u::after{
		content:'j ';
	}
	#chrono>span>s:nth-child(2)>u::after{
		content:'h ';
	}
	#chrono>span>s:nth-child(3)>u::after{
		content:'m ';
	}
	#chrono>span>s:nth-child(4)>u::after{
		content:'s ';
	}
	#chrono + .break {
		display:none;
		width:0;
	}

	#datetime {
		position:absolute;
		top:5px;
		left:var(--rdr-margins);
		width:var(--rdrtimekeeper-width);
		transform:translateY(-100%);
		background-color:transparent;
		color:#FFFFFF;
		background-color:rgba(11,50,81, 0.8);
		border-radius:var(--main-radius);
		backdrop-filter:blur(8px);
		font-size:11px;
		padding:0;
		justify-content:center;
		font-variant-numeric: tabular-nums;
	}
	#time .geovoilespace {
		width:0;
	}	
	#credits .geovoile {
		background-color:transparent;
	}
	#credits .geovoile .link {
		background-color:transparent;
	}

	#display {
		bottom: calc(var(--rdr-timebackground-height) + var(--rdr-margins) * 2);
	}

	#rdrtimekeeper {
		display:flex;
		justify-content:center;
		align-items:center;
		top:auto;
		right:auto;
		bottom:0;
		left:17px;
		width:auto;
		height:34px;
		aspect-ratio:25 / 9;
	}
  #rdrtimekeeper .logo {
		 width:100%;
	}
	#rdrtimekeeper .logo a {
		width:100%;
	}
	#rdrtimekeeper .chrono {
		display:none;
	}
	#rdrtimekeeper .chrono span {
		padding:0 3px;
	}
	#rdrtimekeeper .chrono span:nth-child(n+2)::before {
		left:-3px;
		width:1px;
		background-color:rgba(24,29,49,0.4); 
	}

	#zoomwindow {
		top:170px;
		bottom:100px;
	}

	#rdrversions {
		left:50%;
		bottom:11px;
	}

}



@media (max-width:400px) {
	#rdrversions {
		left:calc(50% + 30px);
	}
}



@media (max-width:340px) {
	#rdrversions {
		display:none;
	}
}