@media screen and (min-width:901px) {
	#reportlistlabels table td small {
		display:none;
	}
  #bt_weather {
    visibility:visible !important;
  }
  #bt_route {
    visibility:visible !important;
  }
  #chrono>span>s {
    display:inline-block;
    width:auto !important;
  }
  #chrono>span>s>u {
    display:inline-block;
    width:22px !important;
    text-align:center;
  }
  #chrono>span>s:first-of-type>u {
    width:32px !important;
  }
  #chrono>span>s>i {
    display:inline-block;
    width:10px !important;
    text-align:center;
  }
	#coords {
		right:120px;
	}
	
}


@media screen and (max-height:915px) {
	.iconbutton {
		width:30px;
		height:30px;
		margin-bottom:5px;
	}
  #buttons .group svg {
	  width:24px;
	  height:24px;
	  margin:3px 3px;
  }

	.iconbutton svg {
	}
}

@media screen and (max-height:760px) {
    #sig {
      bottom:120px;
    }
    #time {
      top:auto;
      bottom:120px;
    }
    #reportlistlabels {
      top:auto;
      bottom:90px;
      height:30px;
    }
    #report {
      top:auto;
      height:90px;
    }
			  #reportList .row {
				  min-height:30px !important;
			  }
    #graphics {
      display:none !important;
    }
    #bt_graphics {
      display:none !important;
      visibility:hidden !important;
    }
    #reportList div input {
      display:none !important;
    }

    
}

@media screen and (max-height:575px) {
    #sig {
      bottom:60px;
    }
    #time {
      top:auto;
      bottom:60px;
    }
        #datetime {
          font-size:16px;
        }
            #datetime big {
              display:none;
            }
            #datetime small {
              display:inline-block;
            }
        #chrono + td {
          padding: 0 3px;
        }
        #replay svg {
          transform:scale(1, 1);
          margin-left:0px;
          margin-right:0px;
        }

    #reportlistlabels {
      top:auto;
      bottom:30px;
      height:30px;
    }
    #report {
      top:auto;
      height:30px;
      min-height:30px !important;
    }
}

@media screen and (max-height:500px) {
    #sig {
      bottom:0px;
    }
    #time {
      top:auto;
      bottom:0px;
    }
    #reportlistlabels {
      display:none;
    }
    #report {
      display:none;
    }
}

@media screen and (max-height:450px) {
  #bt_route,
  #bt_gridlines,
  #bt_labels {
    display:none;
  }
}



@media screen and (max-width:900px) {
	#reportlistlabels table td big {
		display:none;
	}
	#reportlistlabels table td small {
		display:block;
	}
  #coords {
    display:none;
  }
  #chrono {
    display:none;
  }
  #reportlistlabels td.status,
  #reportlistlabels td.vmc,
  #reportList td.status,
  #reportList td.vmc {
    display:none;
  }
  #vormenu {
	  top: 10px;
	  right: 10px;
  }

  #forecasts {
    transform:none;
    left:80px;
  }

  #zoomwindow {
	  top:95px;
	  right:50px;
  }

}

@media screen and (max-width:700px) {
  #reportlistlabels td.course,
  #reportlistlabels td.gain,
  #reportList td.course,
  #reportList td.gain {
    display:none;
  }
  #graphics {
    display:none !important;
  }
  #bt_graphics {
    display:none !important;
    visibility:hidden !important;
  }
  #reportList div input {
    display:none !important;
  }
}

@media screen and (max-width:675px) {
  #sig {
    top:40px;
  }
  #buttons {
    top:40px;
  }
  #vormenu {
    left:0;
    top:0;
    right:0;
    width:auto;
    height:auto;
  }
      #vormenu.open {
        width:auto;
        animation-name: none;
      }
      #vormenu.close {
        width:auto;
        animation-name: none;
      }
      #vormenu header {
        padding:0 0 0 25px;
        line-height:40px;
        height:40px;
      }
          #vormenu header tt {
            bottom:0px;
            transform:rotate(-90deg);
          }
          #vormenu header h1 {
            display:inline-block;
            font-size:18px;
          }
          #vormenu header h2 {
            display:inline-block;
            font-size:14px;
          }
  #vormenu main {
    font-size:12px;
    height:0;
    transform:none;
    top:40px;
    left:0;
    right:0;
  }
    #vormenu main.open {
      width:100%;
      height:130px;
    }
      @keyframes leglinks_open {
        from {height: 0px;}
        to {height: 130px}
      }
      @keyframes leglinks_close {
        from {height: 130px;}
        to {height: 0px;}
      }
      #vormenu main u {
        display:inline-block;
      }
      #vormenu main i {
        display:inline-block;
      }
      #vormenu main td {
        padding: 6px 5px;
        font-size:16px !important;
      }
  #forecasts {
    top:40px;
    left:50%;
    transform:translateX(-50%);
  }

  #boatcard {
    top:10px !important;
    left:60px !important;
    right:10px !important;
    z-index:1000;
    pointer-events:inherit;
    filter:none;
  }
  #main.WEATHER #boatcard {
    top:36px !important;
  }
      #boatcard article {
        width:100% !important;
        box-sizing:border-box;
        border:0 !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;
    }
  
    #zoomwindow {
	    top:25px;
    }

}

@media screen and (max-width:600px) {
  #replay {
    display:none !important;
  }
  #datetime big {
    display:none !important;
  }
  #datetime small {
    display:inline-block !important;
  }
  #chrono+td {
    display:none !important;
  }
}

@media screen and (max-width:500px) {
  #reportlistlabels td.dtf,
  #reportList td.dtf {
    display:none;
  }
}

@media screen and (max-width:460px) {
  #reportlistlabels td.speed,
  #reportList td.speed {
    display:none;
  }
  
}

@media screen and (max-width:355px) {
  #vormenu h2 {
    display:none !important;
  }

}

@media screen and (max-width:675px) and (max-height:600px) {
  #bt_route,
  #bt_gridlines,
  #bt_labels {
    display:none;
  }
}