﻿/*### GEOVOILE ###*/
@media screen	{

	body {
		--skewfactor:0;
		--blockmark-width:0px;
		--blockmark-height:0px;
		--block-margin:5px;
		--rank-font-size:34px;
		--display-button-size:38px;
	}

	#blockmark,
	#report,
	#refresh,
	#datetime,
	#chrono,
	#coords {
		display:none !important;
	}
	#brackets {
		visibility:hidden;
		padding:0;
	}
	#brackets * {
		display:none;
	}

	#tools .iconbutton .icon {
		border-radius:0;
	}
	#zoom .button {
		height:36px;
		width:36px;
	}
	#zoom .button.plus,
	#zoom .button.minus {
		border-radius:0;
	}
	#zoom .button.plus,
	#zoom .button.minus {
		border-radius:0;
	}
	#zoom .button .edges {
		display:none;
	}
	#display>.button {
		clip-path:none;
		padding-left:0;
		bottom:7px;
	  right:7px;
	}
	#display .preferences {
		--margin:7px;
		--height:var(--display-button-size);
		left:var(--margin);
		bottom:var(--margin);
		height:var(--height);
		width:calc(100% - var(--margin) * 2);
		padding-right:5px;
		clip-path:none;
	}
	#display .content .button .iconbutton .icon {
		 border-radius:0;
	}
	#display .button.weather {
		display:none;
	}
	#boatcard .identity {
	  padding:0 var(--rank-width) 0 0;
	}
	#timeline .button {
		--size:14px;
		border:3px solid #141415;
	}
	#timeline .bar, 
	#timeline .backbar, 
	#timeline .interval {
		height:2px;
	}

	#dashboard section.attempt * {
		color:#F7EA07;
	}
	#dashboard section.attempt .clock.chrono {
		display:none !important;
	}
	#dashboard section.attempt .clock {
		font-family:oswald;
		font-size:16px;
	}
	#dashboard section.attempt .clock b:after {
		content:'J';
	}
	#dashboard section.attempt .clock u:after {
		content:'H';
	}
	#dashboard section.attempt .clock i:after {
		content:'M';
	}
	#dashboard section.attempt .clock s:after {
		content:'S';
	}

	#boatcard header .skippers {
		display:none;
	}
}


/*### SOEDEBO ###*/
@media screen	{
	body {
		--progressline-height:65px;
	}

	.iconbutton.weather {
		position:absolute;
		top:auto;
		bottom:102px;
		left:auto;
		right:7px;
	  width:38px;
		transform:none;
	}
	.iconbutton.weather .icon {
	  background-color:#FFFFFF;
	  fill:#0A384B;
	  stroke:#0A384B;
	}
	.iconbutton.weather:before {
		height:38px;
		line-height:38px;
	  background-color:#FFFFFF;
	  color:#0A384B;
	}
	.iconbutton.weather.on .icon,
	.iconbutton.weather.on:before {
	  background-color:#F7EA07;
	  fill:#1D1D1B;
	  stroke:#1D1D1B;
	  color:#1D1D1B;
	}

	body>header {
		padding:0 20px;
	}
	#sodebo_line {
		position:relative;
		height:var(--progressline-height);
		display:flex;
		align-items:center;
		width:100%;
	}
	#sodebo_line .axis {
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		width:100%;
		height:0px;
		border-bottom:3px dotted #838383;
	}
	#sodebo_line .progress {
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		width:0%;
		height:3px;
		background-color:#F7EA07;
	}
	#sodebo_line .points {
		position:relative;
		width:100%;
		height:100%;
	}
	#sodebo_line .point {
		position:absolute;
		display:flex;
		height:100%;
		width:100%;
	}
	#sodebo_line .point label {
		position:absolute;
		color:#FFFFFF;
		left:0;
		top:50%;
		transform:translate(-2px, -20px);
		white-space:nowrap;
		font-size:12px;
		line-height:0.8;
	}
	#sodebo_line .point b {
		position:absolute;
		top:50%;
		left:0;
		transform:translate(-5px, -50%);
		width:8px;
		min-width:8px;
		height:8px;
		border-radius:50%;
		background-color:#FFFFFF;
	}
	#sodebo_line .point b.on {
		background-color:#F7EA07;
	}
	#sodebo_line .point s {
		position:absolute;
		height:100%;
		width:1px;
		background-color:#F7EA07;
	}
	#sodebo_line .boat {
		position:absolute;
		top:26px;
		width:8px;
		transform:translateX(-50%);
		aspect-ratio:1;
		background-color:#F7EA07;
		border:3px solid #03131C;
		border-radius:50%;
	}

	#sodebo_line .point.ouessant1 b {
		background-color:#F07F33;
	}
	#sodebo_line .point.ouessant2 label {
		left:auto;
		top:50%;
		transform:translate(calc(-100% + 2px), -20px);
	}
	#sodebo_line .point.goodhope label {
		transform:translate(calc(-100% + 2px), -28px);
		text-align:right;
	}
	#sodebo_line .point.agulha label,
	#sodebo_line .point.tasmania label {
		transform:translate(-2px, 8px);
	}

	#sodebo_closedashboard {
		position:absolute;
		top:0;
		left:var(--report-width);
		width:18px;
		height:36px;
		display:flex;
		align-items:center;
		justify-content:center;
		background-color:#f7ea07;
		cursor:pointer;
	}
	body.SODEBO_NODASHBOARD #sodebo_closedashboard {
		transform:rotate(180deg);
	}
		body.SODEBO_NODASHBOARD {
			--report-width:0px;
		}

}


