﻿@media (min-width:901px) {
body.DASHBOARD #reportlist .row .open {
	visibility:hidden;
	width:0;
	right:0px;
	pointer-events:none;
}

#timekeeper:empty {
  display:none;
}
#timekeeper:empty+.break+#refresh {
  padding:0 10px;
}
#timekeeper:empty+.break+#refresh:before {
  clip-path:none;
}

body.RACE.DASHBOARD #dashboard {
	display:flex;
}
body.RACE.DASHBOARD.DASHBOARD_IN #dashboard {
	left:0;
	bottom:var(--time-height);
	top: calc(var(--viewer-top-margin) + var(--blockmark-height) + var(--dates-height) + var(--report-mixed-height));
	border-left-width:0px;
}

body.RECORD #dashboard {
	display:flex;
	top:calc(var(--blockmark-height) + var(--dates-height));
	bottom:var(--time-height);
	left:0;
	width:var(--report-width);
  height:auto !important;
}
body.RECORD #dashboard .summary {
  display:none !important;
}

body.PANEL_CLOSED:not(.PANEL_FLOATING) #report {
  top:var(--blockmark-height);
  bottom:auto;
  height:0px;
}
body.PANEL_CLOSED:not(.PANEL_FLOATING) #reportswitch {
	width:var(--reportswitch-height);
	border-top:0;
	align-items:flex-start;
	padding:0 calc(var(--skewval) + 5px) 0 5px;
  box-sizing:content-box;
	clip-path: polygon(0 0, 100% 0, calc(100% - var(--skewval)) 100%, 0 100%);
}
body.PANEL_CLOSED:not(.PANEL_FLOATING) #reportswitch .button {
	width:auto;
	align-items:flex-start;
}
body.PANEL_CLOSED:not(.PANEL_FLOATING) #dashboard {
  --dashboard-margin:0px;
}
body.PANEL_CLOSED.PANEL_FLOATING #dates,
body.PANEL_CLOSED.PANEL_FLOATING #report,
body.PANEL_CLOSED.PANEL_FLOATING #dashboard {
	opacity:0.8;
}
body.PANEL_CLOSED:not(.PANEL_FLOATING) #reportswitch .button .label,
body.PANEL_CLOSED:not(.PANEL_FLOATING) #reportswitch .button:not([rel='floating']),
body.PANEL_CLOSED #reportswitch .button[rel='floating'] .label b,
body.PANEL_CLOSED:not(.PANEL_FLOATING) #dates,
body.PANEL_CLOSED:not(.PANEL_FLOATING) #reportlist,
body.PANEL_CLOSED:not(.PANEL_FLOATING) #boatclasseslist,
body.PANEL_CLOSED:not(.PANEL_FLOATING) #dashboard {
	display:none;
}
body.PANEL_CLOSED #reportswitch .button[rel='floating'] .label i {
	display:block;
}
body.PANEL_CLOSED #reportswitch .button[rel='floating'] svg {
	transform:rotate(45deg);
}
body.PANEL_CLOSED #sig {
	left:0;
}

#boatcard .group.small {
  display:none;
}
#display .content .group.hidden,
#display .content .button.hidden .iconbutton .icon {
	display:none !important;
}

}


@media (max-width:900px) {
body {
  --is_small_screen:1;
  --blockmark-width:auto;
  --blockmark-height:45px;
  --title-height:45px;
  --report-height:40px;
  --reportline-height:75px;
  --time-height:75px;
  --timekeeper-height:30px;
  --timeline-height:45px;
  --vr-height:var(--title-height);
  --vr-width:58px;
  --display-button-size:42px;
  --dates-buttons-width:42px;
  --dates-height:40px;
  --dashboard-summary-height:40px;
}

body.STANDALONE {
  padding-bottom:20px;
}
/*body.MULTICLASS {
  --panelslider-height:calc(var(--reportline-shrink-height) + var(--boatclasslist-line-height));
}*/
#blockmark {
  padding-right:10px;
  padding-left:10px;
}
  
#subtitle {
  left:auto;
  right:0;
  padding:0 calc(var(--skewval) * 2 + var(--title-height)) 0 calc(var(--skewval) * 2);
  clip-path:polygon(var(--skewval) 0, 100% 0, 100% 100%, 0 100%);
  font-size:22px;
}
body.MONOLEG #subtitle {
  padding-left:calc(var(--skewval) * 2);
  padding-right:calc(var(--skewval) * 2);
}
  
#nav.on {
  width:100%;
  height:100%;
  -webkit-backdrop-filter:blur(20px);
          backdrop-filter:blur(20px);
}
#nav a.on {
  display:none;
}
#nav.on a.on,
#nav.on a:last-of-type {
  margin-right:7px;
}
#nav.on a {
  --size:51px;
  display:flex;
  vertical-align:middle;
  text-align:center;
  margin:7px;
  padding:0 calc(var(--skewval) * 2 + 15px) 0 calc(var(--skewval) + 15px);
  clip-path: polygon(var(--skewval) 0, 100% 0, calc(100% - var(--skewval)) 100%, 0 100%);
}
#nav.on .content {
  position:absolute;
  display:block;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  min-width:50%;
  padding-right:0;
}
#nav .burger .line {
	width:15px;
  height:2px;
}
#nav .burger .line:before {
	top:-5px;
	width:15px;
  height:2px;
}
#nav .burger .line:after {
	bottom:-5px;
	width:15px;
  height:2px;
}

#vr {
  --right-on-smallscreen:0px;
  --left:auto;
	top:0;
  right:var(--right-on-smallscreen);
}
#vr a {
    height:50%;
  }

#dates {
  width:calc(100% - var(--panelslider-width));
}
#dates #frequency {
  display:none;
}

#sig {
  left:0;
  top:calc(var(--viewer-top-margin) + var(--blockmark-height) + var(--report-height));
  bottom:var(--time-height);
}
body.RECORD #sig {
  top:calc(var(--blockmark-height) + var(--dashboard-summary-height));
}
#zoomwindow {
	top:5vmin;
}
body.WEATHER #zoomwindow {
	top:90px;
}

#display {
  bottom:var(--time-height);
}
#display.on {
  top:calc(var(--blockmark-height) + var(--report-height));
}
#display .content {
  max-width:100vw;
  max-height:100%;
}
#display.keep .content {
	padding:0px 62px 8px 6px;
}
#display.keep .content .group.kept {
  height:34px;
}
#display.keep .content .button.kept {
  height:34px;
  width:34px;
}
#display.keep .content .button.kept .iconbutton {
  height:34px;
  width:34px;
}
  
#tools {
  display:none;
}
#coords {
  left:0;
  transform:none;
}

#gridlines {
	--vertical-align:top;
}  
body.WEATHER #gridlines .lng {
	transform:translateY(90px);
}  

#time {
  flex-wrap:wrap;
  justify-content:center;
}
#timekeeper,
#chrono {
  flex:auto;
}
#timekeeper {
  justify-content:flex-end;
}
#timekeeper:empty {
  display:flex;
  padding:0;
}
#refresh svg {
width:26px;
height:26px;
}
#chrono {
    clip-path:none;
    padding-right:0;
    justify-content: flex-start;
  }
#chrono+.break {
  display:block;
  width:100%;
}
#replay .buttons {
}
#replay .gauge {
}
#datetime .day {
	grid-column: 1 / 2;
  grid-row: 1 / 2;
	font-size:20px;
	padding-right:7px;
	line-height:0.8;
	min-width:45px;
}
#datetime .date {
	grid-column: 2 / 3;
  grid-row: 1 / 2;
}
#datetime .hour {
	grid-column: 3 / 4;
  grid-row: 1 / 2;
}
#datetime .date,
#datetime .hour {
	font-size:16px;
	text-align:right;
	min-width:75px;
}

#panelslider {
  display:block;
}
body.MULTICLASS #panelslider {
	top: calc(var(--viewer-top-margin) + var(--blockmark-height) + var(--boatclasslist-line-height));
}
body.MULTICLASS #panelslider.open {
	top: calc(var(--viewer-top-margin) + var(--blockmark-height));
}

#report {
  top:calc(var(--viewer-top-margin) + var(--blockmark-height));
  right:0;
  width:auto;  
  height:var(--panelslider-height);
  min-height:var(--panelslider-height);
  overflow:visible; 
  transition:height 400ms;
}
body.MULTICLASS #report {
  height:calc(var(--boatclasslist-line-height) + var(--panelslider-height));
}
#report.open,
body.MULTICLASS #report.open {
  top:calc(var(--viewer-top-margin) + var(--blockmark-height) + var(--dates-height));
  height:calc(100% - var(--blockmark-height) - var(--time-height) - var(--dates-height));
}
#report.open #reportlist .row:last-of-type {
  margin-bottom:40px;
}
  
#boatclasseslist {
}
#report.open #boatclasseslist {
  display:flex;
}
#reportlist {
  padding-right:var(--panelslider-width);
  width:auto;
}
#report.open #reportlist {
  padding-right:0;
  width:auto;
}
#reportlist .row {
  display:none;
  width:100%;
}
#report.open #reportlist .row,
#reportlist .row.on {
  display:grid;
}
#reportlist .row.on {
  border:0px;
}
#reportlist .row .fav {
  display:none;
}
#report.open #reportlist .row .fav {
  display:block;
}
#reportlist .row.on .open {
	top:0px;
	height:var(--reportline-shrink-height);
	width:var(--reportline-shrink-height);
	right:0px;
	transition:none;
	border-radius:0;
}	
#reportlist .row .open svg path {
  transform:rotate(90deg);
}
#report.open #reportlist .row.on .open {
  display:none;
}
body.DASHBOARD #reportlist .row.on .open svg {
  transform:rotate(-180deg);
}

#report:not(.open).shrink #reportlist .row {
	height:var(--reportline-shrink-height);
  grid-template-columns:auto auto 1fr;
  grid-template-rows:40px;
}
#report:not(.open).shrink #reportlist .row.nophoto {
  grid-template-columns:auto 3px 1fr;
}
#report:not(.open).shrink #reportlist .row .rank {
  margin:0;
}
#report:not(.open).shrink #reportlist .row .photos {
	grid-column:2 / 3;
  grid-row:1 / 2;
  display:block;
  margin:0 5px 0 0;
  width:40px;
}
#report:not(.open).shrink #reportlist .row .boat {
	grid-column:3 / 4;
  grid-row:1 / 2;
  align-items:center;
  padding-top:0;
}
#report:not(.open).shrink #reportlist .row .infos,
#report:not(.open).shrink #reportlist .row .rank:after,
#report:not(.open).shrink #reportlist .row .skippers,
#report:not(.open).shrink #reportlist .row .icon {
	display:none;
} 

#reportswitch {
  display:none;
}
 #reportswitch .button.switch[rel="mixed"] {
  display:none !important;
}
#report.open #reportswitch {
  display:flex;
  border-width:0px;}

body.RECORD #panelslider {
  height:var(--dashboard-summary-height);
}
body.RECORD #panelslider svg {
  height:var(--dashboard-summary-height);
}

#boatcard {
	--margin:25px;
  padding:0px;
}
#boatcard header {
  grid-template-columns:auto 1fr;
  grid-template-rows:24px;
}
#boatcard header .rank {
	grid-column: 1 / 2;
	grid-row:1 / 2;
	font-size:16px;
}
#boatcard header .rank::after {
  display:none !important;
}
#boatcard header .boat {
	grid-column: 2 / 3;
	grid-row:1 / 2;
  align-items:center;
  padding-top:0;
}
#boatcard .infos .group {
  margin:0;
}
#boatcard .big {
  display:none !important;
}
#geoblog {
  left:50%;
}
#infopoint {
	left:50%;
	transform:translate(-50%, -50%);
  width:90%;
  max-height:90%;
}

#splittimesLayer .icon text {
	display:block;
}
#timeline .axis .dot {
	display:none;
}

#forecasts {
	--scroll-width:calc(var(--hour-width) * var(--visible-hours) * 2);
  top:calc(var(--viewer-top-margin) + var(--blockmark-height) + var(--report-height));
  width:100%;
  max-width:100%;
  clip-path:none;
}  
body.MULTICLASS #forecasts {
  top:calc(var(--viewer-top-margin) + var(--blockmark-height) + var(--report-height) + var(--boatclasslist-line-height));
}  
body.RECORD #forecasts {
  top:calc(var(--blockmark-height) + var(--dashboard-summary-height));
}  
#forecasts .dates {
  width:100%;
}  
#forecasts .scroll {
  width:100%;
}  
#forecasts .cursor, 
#forecasts .wait {
	left:50%;
}
#forecasts .hours {
	left:calc(50% - var(--current-index) * var(--hour-width));
}

body.RACE #dashboard {
	display:flex;
  top:calc(var(--viewer-top-margin) + var(--blockmark-height) + var(--report-height));
	left:0px;
  right:0px;
	width:auto;
	height:0px;
	bottom:var(--time-height);
  border:0px;
  transition:height var(--transition-duration);
  overflow:hidden;
}
body.RACE.MULTICLASS #dashboard {
  top:calc(var(--viewer-top-margin) + var(--blockmark-height) + var(--report-height) + var(--boatclasslist-line-height));
}
body.RACE #dashboard header {
  display:none;
}
body.RACE.DASHBOARD #dashboard {
  height:calc(100% - var(--blockmark-height) - var(--time-height) - var(--dates-height));
}
body.RACE.MULTICLASS.DASHBOARD #dashboard {
  height:calc(100% - var(--blockmark-height) - var(--time-height) - var(--dates-height) - var(--boatclasslist-line-height));
}
body.RECORD #dashboard {
	display:flex;
  top:var(--blockmark-height);
	left:0;
  right:0;
	height:var(--dashboard-summary-height);
	bottom:auto;
  transition:height 400ms;
}
body.RECORD #dashboard.open {
  height:calc(100% - var(--blockmark-height) - var(--time-height));
}
body.RECORD #dashboard .attempt {
  display:none !important;
}
body.RECORD #dashboard.open .attempt {
  display: block !important;
}
body.RECORD #dashboard.open .summary {
  display:none !important;
}

body.DASHBOARD #report {
  z-index:200;
}
body.DASHBOARD #reportswitch,
body.DASHBOARD #panelslider {
  z-index:201;
}

}


@media (max-width:750px) {
  #reportlist {
    border-width:0 !important;  
  }
}


@media (max-width:600px) {
  #geoblog {
    width:85%;
    min-width:initial;
    max-width:initial;
  }
  #geoblog article {
    max-height:initial;
      
  }
  #geoblog .hat {
    max-height:80px;
    overflow:auto;
  }
  #geoblog .content {
    max-height:150px;
    overflow:auto;
  }
  #geoblog #mediaVideo {
    min-width:initial;
  }
}


@media (max-width:500px) {
  body.RECORD #splittimes {
    height:65px;
  }
  body.RECORD #splittimes .lines {
    line-height:18px;
    font-size:14px;
  }
  body.RECORD.SPLITTIMES #sig {
    bottom:100px;
  }

  #replay,
  #brackets {
    display:none;
  }
  #datetime {
    flex:1;
  }
}


@media (max-width:450px) {

  #nav .burger .line {
	  width:15px;
	  height:2px;
	margin-top:2px;
  }
  #nav .burger .line:before {
	  top:-5px;
	  width:15px;
	  height:2px;
  }
  #nav .burger .line:after {
	  bottom:-5px;
	  width:15px;
	  height:2px;
  }

  #subtitle {
	  font-size:18px;
  }

  #forecasts .options {
    display:none;
  }
  #forecasts legend {
    width:100%;
  }

  #datetime, #chrono {
	  font-size:16px;
  }
}


@media (max-width:375px) {
  #forecasts .advert {
	  left:0;
    clip-path:none;
  }
  #forecasts legend {
	  max-width:inherit;
  }
  #forecasts .variables .var.on label {
    display:none;
  }
  #forecasts .variables .var.on {
    width:var(--var-width);
  }

}


@media (max-width:320px) {
  #chrono {
    display:none;
  }
}
