@font-face {
  font-family:'urbane';
  font-style:normal;
  font-weight:300;
  src:url('urbane_condensed_light.woff2') format('woff2');
}
@font-face {
  font-family:'urbane';
  font-style:normal;
  font-weight:normal;
  src:url('urbane_condensed_medium.woff2') format('woff2');
}
@font-face {
  font-family:'urbane';
  font-style:normal;
  font-weight:bold;
  src:url('urbane_condensed_bold.woff2') format('woff2');
}

body {
	--skewfactor:0;
	--default-font-family:urbane;
	--default-font-size:12px;
	
	--rank-font-size:19px;
	--boatname-font-size:13px;
	--boatname-text-transform:uppercase;
	--skippername-font-size:12px;
	--blockmark-height:0px;
	--tclormode-height:45px;
}

#dates {
	align-items:flex-start;
	padding-left:10px;
}
#startdate, 
#reportdate {
  font-size:16px;
  font-weight:normal;
}
#dates .group {
	align-items:flex-start;
}
#reportswitch .button:hover,
#report.classic #reportswitch .button.switch[rel='classic'],
#report.shrink #reportswitch .button.switch[rel='shrink'],
#report.small #reportswitch .button.switch[rel='small'],
#report.mixed #reportswitch .button.switch[rel='mixed'] {
  color:#E0E621;
  stroke:#E0E621;
  fill:#E0E621;
}
#reportswitch .button[rel="mixed"] {
	display:none;
}

#reportlist .row .rank {
	justify-content:flex-start;
	padding-top:7px;
}
#reportlist .row .rank:after {
	position:absolute;
	top:auto;
	bottom:7px;
	font-size:16px;
}
#reportlist .row .rank.up:after,
#reportlist .row .rank.down:after {
	transform:translateX(-50%);
}
#boatclasseslist .boatclass {
	text-transform:uppercase;
	font-size:14px;
}
#reportlist .row .fav svg {
	fill-opacity:0;
}
#reportlist .row .infos {
	font-size:12px;
}
#report.mixed #reportlist .row .rank,
#report.small #reportlist .row .rank {
  justify-content:center;
  padding-top:0;
	font-size:12px;
}

#dashboard header .row .rank {
	justify-content:flex-start;
	padding-top:7px;
}
#dashboard header .row .rank:after {
	position:absolute;
	top:auto;
	bottom:7px;
	font-size:16px;
}

#boatcard header .rank {
	justify-content:flex-start;
	padding-top:7px;
}
#boatcard header .rank::after {
	position:absolute;
	top:auto;
	bottom:7px;
	font-size:16px;
}
#boatcard header .rank.up:after,
#boatcard header .rank.down:after {
	transform:translateX(-50%);
}

#forecasts {
	--hour-width:42px;
	clip-path:none;
}
#forecasts .variables .var {
  width:95px;
}
#forecasts .variables .var[rel="tempair"],
#forecasts .variables .var[rel="tempwater"],
#forecasts .variables .var[rel="clouds"] {
	display:none !important;
}
#forecasts .variables .var label {
  display:block;
	text-transform:uppercase;
	font-weight:normal;
	font-size:13px;
}
#forecasts .currentdate {
	width:60px;
}
body.TCLOR_MODE_STANDARD #forecasts .variables .var:not([rel='wind']) {
	display:none;
}
/*body.TCLOR_MODE_STANDARD #forecasts .variables {
	display:none;
}
body.TCLOR_MODE_STANDARD #forecasts .advert {
	position:absolute;
	left:0;
	transform:translateX(-100%);
	top:0;
	height:var(--hour-height);
}*/

#tools .iconbutton.fullscreen {
	display:none !important;
}
#display {
	bottom:calc(var(--time-height) + var(--tclormode-height));
}
#display>.button {
	border-radius:50% 0 0 50%;
}

#datetime {
	box-sizing:border-box;
}
#datetime>span {
	position:relative;
	display:grid;
}
#datetime .day {
	grid-column: 1 / 2;
  grid-row: 1 / 3;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:43px;
	padding-right:7px;
	line-height:0.8;
	min-width:70px;
}
#datetime .date {
	grid-column: 2 / 3;
  grid-row: 1 / 2;
}
#datetime .hour {
	grid-column: 2 / 3;
  grid-row: 2 / 3;
}
#datetime .date,
#datetime .hour {
	font-size:18px;
	text-align:right;
	min-width:75px;
}
#replay .buttons {
	opacity:1; 
	width:26px;
	height:26px;
}
#replay.on .buttons {
	width:22px;
	height:22px;
}
#chrono {
	display:none;
}
#brackets {
	display:none;
}
#timeline .bar, 
#timeline .backbar, 
#timeline .interval {
	height:11px;
}
#timeline .button {
	--size: 27px;
}

#boatcard .infos .group.standby .var {
	width:auto;
}

#boatclasseslist .boatclass[rel="4"],
body.CLASS_CLASS40 #boatclasseslist .boatclass.on {
  background-color:#DFECFD;
  color:#001F5B;
}
#boatclasseslist .boatclass[rel="3"],
body.CLASS_IMOCA #boatclasseslist .boatclass.on {
  background-color:#EE6E75;
}
#boatclasseslist .boatclass[rel="2"],
body.CLASS_OCEAN_FIFTY #boatclasseslist .boatclass.on {
  background-color:#EBC5BB;
}
#boatclasseslist .boatclass[rel="1"],
body.CLASS_ULTIM #boatclasseslist .boatclass.on {
  background-color:#E0E621;
}
body.CLASS_CLASS40 #reportlist .row.on {
  background-color:#DFECFD;
}
body.CLASS_IMOCA #reportlist .row.on {
  background-color:#EE6E75;
}
body.CLASS_OCEAN_FIFTY #reportlist .row.on {
  background-color:#EBC5BB;
}
body.CLASS_ULTIM #reportlist .row.on {
  background-color:#E0E621;
}

#tclormode {
	position:absolute;
	bottom:var(--time-height);
	height:var(--tclormode-height);
	right:0;
	display:flex;
	align-items:center;
	background-color:#FFFFFF;
	color:#001F5B;
	padding:0 7px;
}
#tclormode label {
	padding:0 7px;
}
#tclormode label.standard {
	color:#E03B47;
}
body.TCLOR_MODE_EXPERT #tclormode label.expert {
	color:#E03B47;
}
body.TCLOR_MODE_EXPERT #tclormode label.standard {
	color:#001F5B;
}
#tclormode .onoff:before,
#tclormode .onoff.on:before {
  border-color:#DFECFD;
  background-color:#DFECFD;
}
#tclormode .onoff:after,
#tclormode .onoff.on:after {
  background-color:#001F5B;
}
#tclormode .onoff:hover:after {
  background-color:#001F5B;
}
#tclormode .infos {
	position:relative;
	padding-left:10px;
}
#tclormode .infos:before {
	content:'';
	position:absolute;
	left:0;
	top:50%;
	transform:translateY(-50%);
	height:75%;
	width:1px;
  background-color:#001F5B;
}
#tclormode .infos .icon {
	border-radius:50%;
	width:20px;
	aspect-ratio:1;
	border:1px solid #001F5B;
	display:flex;
	justify-content:center;
	align-items:center;
	cursor:pointer;
}
#tclormode .infos .icon svg {
	width:100%;
	aspect-ratio:1;
}
#tclormodedesc {
	position:fixed;
	display:none;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color: rgba(0,31,91,0.30);
	backdrop-filter: blur(20px);
	cursor:pointer;
	z-index:999999;
}
#tclormodedesc.on {
	display:flex;
	justify-content:center;
	align-items:center;
}
#tclormodedesc .content {
	background-color: #001F5B;
	border:1px solid rgba(255,255,255,0.6);
	color: #FFFFFF;
	width:300px;
	max-width:70%;
	padding: 2vmin 4vmin;
}
#tclormodedesc .content h1 {
	font-weight:bold;
	margin-top:10px;
}


#report.classic #reportlist .row[rel="51"] .skippers {
  font-size: 11px;
}
#report.classic #reportlist .row[rel="35"] .boat {
	font-size:11px;
}
#report.classic #reportlist .row[rel="35"] .fav {
  top:14px;
}