/**
 * @author:	Emmanuel SMITH <hey@emmanuel-smith.me>
 * project:	ets2-dashboard-skin
 * file: 	test.scss
 * Date: 	01/05/2020
 * Time: 	17:40
 */

@import "~bourbon/core/bourbon";

.scania {
	
	.wrapper-area {
		display: flex;
		justify-content: center;
		align-items: center;
		
		> span {
			line-height: inherit;
			//margin-top: .5rem;
		}
	}
	
	.dashboard {
		position: absolute;
		background: url("../assets/img/bg-on.jpg") top left no-repeat;
		transform-origin: top left;
		left: 50%;
		top: 50%;
	}
	
	.truck-speedRounded {
		color: #B4C3D1;
		font-family: Courier New, Courier, monospace;
		font-weight: bold;
		font-size: 70px;
		position: absolute;
		left: 907px;
		top: 755px;
		width: 190px;
		height: 66px;
		text-align: center;
	}
	.truck-speed[data-type="meter"] {
		visibility: visible;
		position: absolute;
		left: 1580px;
		top: 180px;
		width: 79px;
		height: 299px;
		background-image: url("../assets/img/gauge-arrow.png");
		-webkit-transform: rotate(-114deg);
		-moz-transform: rotate(-114deg);
		-ms-transform: rotate(-114deg);
		-o-transform: rotate(-114deg);
		transform: rotate(-114deg);
		-webkit-transform-origin: 50% 247px;
		-moz-transform-origin: 50% 247px;
		-ms-transform-origin: 50% 247px;
		-o-transform-origin: 50% 247px;
		transform-origin: 50% 247px;
	}
	.truck-engineRpm {
		position: absolute;
		left: 360px;
		top: 180px;
		width: 79px;
		height: 299px;
		background-image: url("../assets/img/gauge-arrow.png");
		-webkit-transform: rotate(-97deg);
		-moz-transform: rotate(-97deg);
		-ms-transform: rotate(-97deg);
		-o-transform: rotate(-97deg);
		transform: rotate(-97deg);
		-webkit-transform-origin: 50% 247px;
		-moz-transform-origin: 50% 247px;
		-ms-transform-origin: 50% 247px;
		-o-transform-origin: 50% 247px;
		transform-origin: 50% 247px;
	}
	.truck-fuel {
		position: absolute;
		left: 1501px;
		top: 790px;
		width: 62px;
		height: 171px;
		background-image: url("../assets/img/gauge-arrow-s.png");
		-webkit-transform: rotate(-96deg);
		-moz-transform: rotate(-96deg);
		-ms-transform: rotate(-96deg);
		-o-transform: rotate(-96deg);
		transform: rotate(-96deg);
		-webkit-transform-origin: 50% 141px;
		-moz-transform-origin: 50% 141px;
		-ms-transform-origin: 50% 141px;
		-o-transform-origin: 50% 141px;
		transform-origin: 50% 141px;
	}
	.truck-waterTemperature {
		position: absolute;
		left: 457px;
		top: 790px;
		width: 62px;
		height: 171px;
		background-image: url("../assets/img/gauge-arrow-s.png");
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
		-webkit-transform-origin: 50% 141px;
		-moz-transform-origin: 50% 141px;
		-ms-transform-origin: 50% 141px;
		-o-transform-origin: 50% 141px;
		transform-origin: 50% 141px;
	}
	.truck-oilPressure {
		position: absolute;
		left: 1580px;
		top: 535px;
		width: 69px;
		height: 170px;
		background-image: url("../assets/img/gauge-arrow-s2.png");
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
		-webkit-transform-origin: 50% 133px;
		-moz-transform-origin: 50% 133px;
		-ms-transform-origin: 50% 133px;
		-o-transform-origin: 50% 133px;
		transform-origin: 50% 133px;
	}
	.truck-gear {
		color: #F3F3F3;
		font-family: Courier New, Courier, monospace;
		font-weight: bold;
		font-size: 40px;
		position: absolute;
		left: 1104px;
		top: 149px;
		width: 120px;
		height: 60px;
		text-align: center;
	}
	.truck-gear[data-value="N"] {
		color: #F3F3F3;
	}
	.truck-gear[data-value="R"] {
		color: #F3F3F3;
	}
	.truck-odometer {
		color: #F3F3F3;
		font-family: Courier New, Courier, monospace;
		font-weight: bold;
		font-size: 33px;
		position: absolute;
		left: 802px;
		top: 895px;
		width: 185px;
		height: 40px;
		text-align: right;
	}
	.truck-blinkerLeftOn {
		background-image: url("../assets/img/blinker-left-off.png");
		position: absolute;
		left: 591px;
		top: 72px;
		width: 137px;
		height: 136px;
	}
	.truck-blinkerLeftOn.yes {
		background-image: url("../assets/img/blinker-left-on.png");
	}
	.truck-blinkerRightOn {
		background-image: url("../assets/img/blinker-right-off.png");
		position: absolute;
		left: 1285px;
		top: 70px;
		width: 137px;
		height: 136px;
	}
	.truck-blinkerRightOn.yes {
		background-image: url("../assets/img/blinker-right-on.png");
	}
	.truck-cruiseControlOn.yes {
		background-image: url("../assets/img/cruise-on.png");
	}
	.truck-lightsBeamHighOn {
		background-image: url("../assets/img/highbeam-off.png");
		position: absolute;
		left: 628px;
		top: 199px;
		width: 100px;
		height: 70px;
	}
	.truck-lightsBeamHighOn.yes {
		background-image: url("../assets/img/highbeam-on.png");
	}
	.truck-lightsBeamLowOn {
		background-image: url("../assets/img/lowbeam-off.png");
		position: absolute;
		left: 267px;
		top: 742px;
		width: 90px;
		height: 70px;
	}
	.truck-lightsBeamLowOn.yes {
		background-image: url("../assets/img/lowbeam-on.png");
	}
	.truck-lightsParkingOn {
		background-image: url("../assets/img/parklights-off.png");
		position: absolute;
		left: 172px;
		top: 742px;
		width: 90px;
		height: 70px;
	}
	.truck-lightsParkingOn.yes {
		background-image: url("../assets/img/parklights-on.png");
	}
	/*.trailer-attached {
		background-image: url("../assets/img/trailer-off.png");
		position: absolute;
		left: 1726px;
		top: 922px;
		width: 278px;
		height: 152px;
	}
	.trailer-attached.yes {
		background-image: url("../assets/img/trailer-on.png");
	}*/
	.trailer-mass {
		color: #B4C3D1;
		font-family: Courier New, Courier, monospace;
		font-weight: bold;
		position: absolute;
		left: 1058px;
		top: 888px;
		/* background: #000; */
		width: 170px;
		height: 50px;
		text-align: center;
		font-size: 32px;
	}
	.game-time {
		color: #F5F9F8;
		font-family: Arial, Tahoma;
		font-size: 40px;
		font-weight: bold;
		position: absolute;
		left: 787px;
		top: 149px;
		width: 312px;
		height: 60px;
		text-align: center;
		overflow: hidden;
	}
	.truck-parkBrakeOn {
		background-image: url("../assets/img/handbrake-off.png");
		position: absolute;
		left: 1305px;
		top: 680px;
		width: 75px;
		height: 55px;
	}
	.truck-parkBrakeOn.yes {
		background-image: url("../assets/img/handbrake.png");
	}
	.truck-airPressureEmergencyOn {
		background-image: url("../assets/img/warning-off.png");
		position: absolute;
		left: 631px;
		top: 678px;
		width: 75px;
		height: 55px;
	}
	.truck-airPressureEmergencyOn.yes {
		background-image: url("../assets/img/warning.png");
	}
	.truck-airPressureEmergencyOn {
		background-image: url("../assets/img/warning-off.png");
		position: absolute;
		left: 631px;
		top: 678px;
		width: 75px;
		height: 55px;
	}
	.truck-fuelWarningOn.yes {
		background-image: url("../assets/img/fuel-warning.png");
	}
	.truck-fuelWarningOn {
		background-image: url("../assets/img/fuel-warning-off.png");
		position: absolute;
		left: 1412px;
		top: 887px;
		width: 40px;
		height: 45px;
	}
	.job-remainingTime {
		color: #54d9a8;
	}
	.truck-gear,
	.truck-odometer,
	.truck-speed,
	.trailer-mass,
	.trailer-name,
	.job-remainingTime,
	._jobSource,
	._jobDestionation {
		visibility: hidden;
	}
	.dashboard.game-connected.yes .truck-gear,
	.dashboard.game-connected.yes .truck-odometer,
	.dashboard.game-connected.yes .truck-speed {
		visibility: visible;
	}
	.hasJob.yes .trailer-mass,
	.hasJob.yes .trailer-name,
	.hasJob.yes .job-remainingTime,
	.hasJob.yes ._jobSource,
	.hasJob.yes ._jobDestionation {
		visibility: visible;
	}
	table._job {
		border-collapse: collapse;
		font-family: Courier New, Courier, monospace;
		font-size: 40px;
		position: absolute;
		left: 40px;
		top: 850px;
		width: 1300px;
		height: 280px;
	}
	table._job th {
		color: #aaa;
		width: 260px;
		text-align: right;
	}
	table._job td {
		padding-left: 20px;
		text-align: left;
	}
	._jobSource,
	._jobDestionation {
		color: #efbd3a;
	}
	.statusMessage {
		color: coral;
	}
}