﻿@media (min-width:901px) {
	body {
		--reportline-height:var(--dubreuil-photo-height);
		--boatname-font-size:16px;
		--rank-font-size:16px;
	}
	#nav .buttons {
    top:var(--dubreuil-block-margin);
    right:var(--dubreuil-block-margin);
 }		
	#blockmark {
		top:var(--dubreuil-block-margin);
		left:var(--dubreuil-block-margin);
	}
	#dates {
		left:var(--dubreuil-block-margin);
		top:calc(var(--blockmark-height) + var(--dubreuil-block-margin) * 2);
	}
	#report {
		left:var(--dubreuil-block-margin);
		top:calc(var(--blockmark-height) + var(--dates-height) + var(--dubreuil-block-margin) * 2);
		bottom:calc(var(--time-height) + var(--dubreuil-block-margin));
	}
	#reportlist .row .photos {
		height:var(--dubreuil-photo-height);
	}
	#reportlist .row .photos .img {
		width:var(--dubreuil-photo-height);
	}
	#reportlist .row .photos.flip {
		width:var(--dubreuil-photo-height);
	}
	
	#sig {
		left:0;
	}
	#report {
		background:none;
	}
	#reportlist {
		margin-top:var(--dubreuil-block-margin);
	}
	#reportlist .row {
		margin-bottom:var(--dubreuil-block-margin);
		border-bottom:0px;
    grid-template-rows:33px 18px 29px;
	}
	#reportlist .row .boat {	
	align-items:center;
	}
  #reportlist .row .infos {
		line-height:0.9;
	}
	
	#datetime {
		width:308px;
		justify-content:center;
	}
	#dashboard {
		left:calc(var(--report-width) + var(--dubreuil-block-margin) * 2);
	}
	
	body.WITH_NAV #forecasts, 
	body.MULTILEGS #forecasts {
    top:var(--dubreuil-block-margin);
		right:75px;;
  }
	
}


@media (max-width:900px) {
	#timeline::after {
		height:48px;
	}	
	.photos {
		height:75px;;
	}
	
	#report:not(.open) #reportlist .row .rank {
		height:100%;
	}

	
}


@media (max-width:420px) {
	body {
		--boatname-font-size:12px;
		--skippername-font-size:12px;
	}
}
