﻿@media screen and (max-width:900px) {
  #inReducedMode {
   display:inline; 
  }
  #sig {
    left:0;
    top:66px;
    bottom:35px;
  }
    body.RECORD #sig {
      top:46px;
    }
    body.RACE.MULTICLASS #sig {
      top:96px;
    }
    body.FULLSCREEN #sig {
      top:60px;
    }
    body.RECORD.FULLSCREEN #sig {
      top:40px;
    }
    body.SPLITTIMES #sig {
      bottom:125px;
    }
    body.RECORD.SPLITTIMES #sig {
      bottom:110px;
    }
    body.FULLSCREEN.RACE.MULTICLASS #sig {
      top:90px;
    }

  #graphics {
    left:0;
    top:85px;
  }
    body.RECORD #graphics {
      top:75px;
    }
    body.RACE.MULTICLASS #graphics {
      top:96px;
    }

    body.FULLSCREEN #graphics {
      top:60px;
    }

    body.FULLSCREEN.RACE.MULTICLASS #graphics {
      top:90px;
    }
    #graphics .variables {
      *margin-right:0;
    }
    #graphics .variables:before,
    #graphics .variables:after {
      border-top-width:21px; 
    }
    #graphics .variables:after {
      *display:none;
    }
        #graphics .variables td {
          line-height:18px;
          font-size:12px;
          padding:0 2px;
        }

  #splittimes {
    left:0px;
    height:80px;
    bottom:35px;
  }


  #navionicsOption {
    top:auto;
    bottom:3px;
  }
  
  #progressline {
    left:0px;
    right:0px;
  }
      #progressline .startpoint, 
      #progressline .arrivalpoint {
        display:none;
      }
  #buttons {
    top:66px;
    bottom:35px;
  }
    body.RECORD #buttons {
      top:46px;
    }
    body.FULLSCREEN #buttons {
      top:60px;
    }
    body.RECORD.FULLSCREEN #buttons {
      top:40px;
    }
    body.RACE.MULTICLASS #buttons {
      top:96px;
    }
    body.FULLSCREEN.RACE.MULTICLASS #buttons {
      top:90px;
    }
    #buttons .group+.group {
      padding-top:0;
    }
  
  #zoom {
    right:2px;
    top:35px;
    bottom:-5px;
    height:auto;
    width:16px;
  }
    body.TRACKING #zoom {
      top:00px;
    }
    #zoom .bar {
      display:block;
    }
    #zoom>.button {
      display:none;
    }  
    #zoom .button {
      width:12px;
      height:12px;
    }
    #zoom .button .face {
      width:12px;
      height:12px;
    }

  #zoom .text {
    display:none;
  }  
  #time {
    left:0px;
    height:35px;
  }
    #refresh {
      padding:0px 2px;
    }
    #datetime,
    #chrono {
      padding:0 2px;
      font-size:14px;
      *font-weight:normal;
    }
    #chrono {
      display:none !important;
    }
    #chrono+td {
      padding:0 8px;
    }
    #datetime big {
      display:none;
    }
    #datetime small {
      display:inline;
    }
    #timeline {
      padding-left:4px;
      padding-right:28px;
    }
    #coords {
      display:none; 
    }
    #replay {
      display:none !important;
    }
    #replay {
      padding:0 10px;
    }
    #replay svg.buttons {
      width:26px;
      height:25px;
    }
    #replay svg.slow,
    #replay svg.fast {
      width:18px;
      height:18px;
    }
    #geovoile {
	    font-size:35px;
    }


  #report {
    top:6px;
    right:38px;
    width:auto;  
    height:60px;
    overflow:visible; 
    -webkit-transition: height 400ms;
       -moz-transition: height 400ms;
        -ms-transition: height 400ms;
         -o-transition: height 400ms;
            transition: height 400ms;
  }
    body.RACE.MULTICLASS #report {
      top:6px;
      height:90px;
    }
    
    #report.open {
      height:auto;
      bottom:35px;
    }
    #report.open #reportList .row:last-of-type {
      margin-bottom:40px;
    }
  
  #boatclassesList {
    height:30px;
  }
      #boatclassesList select {
        height:24px;
      }
      #boatclassesList option {
        font-size:16px;
      }
      #boatclassesList .name {
        font-size:16px;
        font-weight:bold;
      }
      #boatclassesList .arrow {
        top:8px;
      }
  

  #reportList {
    overflow:auto; 
    top:29px;
    z-index:300;
  }
    body.RACE.MULTICLASS #reportList {
      top:30px;
    }
    
      #reportList .row {
        height:60px;
        padding-left:85px;
        border-left-width:0;
      }
      #reportList .row.on {
        border-color:transparent;
      }
      #reportList .photo {
        left:0px;
        top:0px;
      }
      #reportList .identity img {
      }
      #boatcard .rank,
      #reportList .rank {
        font-size:16px;
        line-height:14px;
        width:2.4ex;
      }
      #reportList .rank {
        top:2px;
        left:64px;
      }
      #reportList .rank b:after,
      #reportList .rank up:after,
      #reportList .rank .down:after {
        top:14px;
        font-size:11px;
      }
      #reportList .names>p:nth-child(1) {
        font-size:16px;
        line-height:14px;
        font-weight:bold;
				white-space:nowrap;
    
      }
      #reportList .names>p:nth-child(2) {
        font-size:13px;
        line-height:13px;
				white-space:nowrap;
      }

      #reportList .infos {
        font-size:12px;
        line-height:12px;
        margin-top:2px;
      }
        
      #reportList .infos .dtl {
        margin-right:32px;
      }
      
  #dashboard {
    display:none;
    left:0px;
    right:38px;
    width:auto;
    top:6px;
    bottom:35px;
    overflow:auto;
  }
      #dashboard>div {
        padding-bottom:33px;
      }
      #dashboard h1 {
        font-size:1.3rem;
        height:25px;
        line-height:25px;
        font-weight:bold;
      }
      #dashboard big {
        font-size:1.4rem;
        line-height:1.4rem; 
        margin-bottom:0.1rem;
      }
      #dashboard small {
        font-size:0.9rem;  
        line-height:0.9rem; 
      }
      #dashboard header,
      #dashboard footer {
        padding:2px;
      }
    
  #dashboardsummary {
    display:block;
  }
  
#detailshandle {
  display:block;
}
  body.FULLSCREEN #detailshandle {
    top:0;
  }

  #boatcard {
    top:0 !important;
    left:0 !important;
    right:0 !important;
    z-index:1000;
    pointer-events:inherit;
    filter:none;
  }
  #main.WEATHER #boatcard {
    top:30px !important;
  }
      #boatcard article {
        width:100% !important;
        box-sizing:border-box;
        border:0 !important;
      }
      #boatcard .identity,
      #boatcard .rank {
        display:none !important;
      }
      #boatcard.GAME .rank,
      #boatcard.GAME .identity {
        display:block !important;
      }
      #boatcard .infos:before {
        opacity:1;
      }
      #boatcard .infos {
        /*height:120px !important;*/
        font-size:12px;
        line-height:16px;
        padding-right:24px;
      }
      #boatcard.GAME .infos {
        height:auto !important;
      }
      body.RECORD #boatcard .infos {
        height:100px !important;
      }     
      #boatcard article.qd1,
      #boatcard article.qd2,
      #boatcard article.qd3,
      #boatcard article.qd4,
      #boatcard article.qd5,
      #boatcard article.qd6,
      #boatcard article.qd7,
      #boatcard article.qd8 {
        left:0 !important;
        top:0 !important;
        transform:none !important;
      }
      #boatcard .infos fieldset.loc,
      #boatcard .infos fieldset.dist .dtf,
      #boatcard .infos fieldset.dist .dtl {
        display:none;
      }
      #boatcard .infos fieldset.dist .dtls {
        text-align:right;
        margin-right:15px;
      }
      #boatcard .infos .dist .dtlprogress {
        width:50px;
      }
      #boatcard .infos .dist .dtlprogress.pos:before,
      #boatcard .infos .dist .dtlprogress.neg:before {
        position:absolute;
        left:0;
        top:0;
      }
      #boatcard .infos table th {
        width:auto;
      }
      #boatcard .infos table.speeds {
        margin-top:5px;
      }
      #boatcard .infos.HLD .dist,
      #boatcard .infos.CLG .dist {
        display:none;
      }
      #boatcard .infos.RAC_N_LIVE fieldset.dist,
      #boatcard .infos.RAC_1_LIVE fieldset.dist,
      #boatcard .infos.RAC_N_LIVE_ARRIVAL fieldset.dist,
      #boatcard .infos.RAC_1_LIVE_ARRIVAL fieldset.dist,
      #boatcard .infos.RAC_N_LIVE p.lastreport,
      #boatcard .infos.RAC_1_LIVE p.lastreport,
      #boatcard .infos.RAC_N_LIVE_ARRIVAL p.lastreport,
      #boatcard .infos.RAC_1_LIVE_ARRIVAL p.lastreport,
      #boatcard .infos.RAC_N_LIVE table.speeds,
      #boatcard .infos.RAC_1_LIVE table.speeds,
      #boatcard .infos.RAC_N_LIVE_ARRIVAL table.speeds,
      #boatcard .infos.RAC_1_LIVE_ARRIVAL table.speeds {
        /*display:none;*/
      }
      
    #boatcard .cross {
      display:block;
    }

  #forecasts {
    top:66px;
    transform:translateX(-50%);
  }  
    #forecasts legend {
      display:none;
    }  
    #forecasts .advert {
      display:none;
    }  
    body.FULLSCREEN #forecasts {
    top:60px;
    }
    body.RECORD #forecasts {
      top:46px;
    }
    body.RACE.MULTICLASS #forecasts {
      top:96px;
    }
    body.FULLSCREEN.RACE.MULTICLASS #forecasts {
      top:90px;
    }

  a#vr {
    width:58px;
    height:40px;
    top:auto;
    bottom:5px;
  }


}


@media screen and (max-width:750px) {
  #reportList {
    border-width:0 !important;  
  }
}


@media screen and (max-width:500px) {
  #forecasts .scroll {
    width:245px;
  }
  #forecasts .hours,
  #forecasts .cursor,
  #forecasts .wait {
    left:105px;
  }
  body.RECORD #splittimes {
    height:65px;
  }
  body.RECORD #splittimes .lines {
    line-height:18px;
    font-size:14px;
  }
  body.RECORD.SPLITTIMES #sig {
    bottom:100px;
  }

}


@media screen and (max-width:600px) {
  #geoblog {
    left:5px;
    right:5px;
    top:auto;
    bottom:5px;
    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;
  }
  #forecasts .wait {
    right:190px;
  }
    
}


@media screen and (max-width:420px) {
  #forecasts .scroll {
    width:175px;
  }
  #forecasts .hours,
  #forecasts .cursor,
  #forecasts .wait {
    left:70px;
  }
}


@media screen and (max-width:400px) {
  #forecasts .first,
  #forecasts .play,
  #forecasts .last {
    display:none;
  }
}


@media screen and (max-width:350px) {
  #forecasts .scroll {
    width:105px;
  }
  #forecasts .hours,
  #forecasts .cursor,
  #forecasts .wait {
    left:35px;
  }
}


@media screen and (max-width:360px) {
  #chrono {
    display:none;
  }
}


@media screen and (max-width:280px) {
  #chrono {
    display:none;
  }
  #boatcard .infos table.speeds td:first-of-type+td {
    display:none;
  }
  
}


@media screen and (max-height:670px) {
  #buttons .group + .group {
	  padding-top:0;
  }

}


@media screen and (max-height:510px) {
  #bt_labels,
  #bt_rule,
  #bt_zoomtop3,
  #bt_gridlines {
    display:none;
  }
  body.FULLSCREEN #bt_labels {
    height:32px;
  }
}