main { background-color: slategray; }
header { background-color: silver; }
aside { background-color: #f5e8d7; }
body.America header.your_turn { background-color: skyblue; }
body.Britain header.your_turn { background-color: salmon; }
#role_Britain { background-color: salmon; }
#role_America { background-color: skyblue; }

#log > div { padding-left: 20px; text-indent: -12px; }

#log .h1 {
	background-color: tan;
	font-weight: bold;
	text-align: center;
	padding: 3px;
}

#log .h2 {
	background-color: tan;
	text-align: center;
	padding: 1px;
}

#log .h1, #log .h2 {
	border-top: 1px solid black;
	border-bottom: 1px solid black;
}

#log .h2.american { background-color: skyblue; }
#log .h2.british { background-color: salmon; }

#log .card_tip:hover { text-decoration: dotted underline; }

:root {
	--piece-shadow: 1px 1px 4px #0008;
}

aside {
	width: 230px;
}

#turn_info {
}

#turn_info {
	background-color: tan;
}

#turn_info .card {
	margin: 5px auto;
}

.hand {
	margin: 15px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	min-height: 370px;
	gap: 15px;
}

#tooltip {
	display: none;
	pointer-events: none;
	position: fixed;
	z-index: 600;
	right: 240px;
	top: 60px;
}

#tooltip.show {
	display: block;
}

@media (max-width: 800px) {
	#tooltip {
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
	}
}

/* CARD ACTION POPUP MENU */

#popup { max-width: 250px; }
#popup li.title { text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
#popup li.disabled { display: none }

/* MAP WITH MARKERS, CUs, LEADERS, AND SPACES */

/* 3300x5100 */
/* 1650x2550 */

#mapwrap {
	width: 1650px;
	height: 2550px;
}

#map {
	width: 1650px;
	height: 2550px;
	background-image: url(images/WWmap-3-75.webp);
	background-size: cover;
	box-shadow: 0 0 20px black;
}

#map.hide_markers > div {
	visibility: hidden;
}

.marker {
	position: absolute;
	background-size: cover;
}
.marker.turn {
	width: 56.5px;
	height: 56.5px;
	background-image: url('/washingtons-war/images/Marker_GameTurnRegulars.jpg');
	box-shadow: var(--piece-shadow);
}
.marker.turn.no-regulars {
	background-image: url('/washingtons-war/images/Marker_GameTurnNoRegulars.jpg');
}

.marker.french-alliance {
	width: 56.5px;
	height: 56.5px;
	background-image: url('/washingtons-war/images/Marker_FrenchAlliance.jpg');
	box-shadow: var(--piece-shadow);
}

.marker.french-alliance.european-war {
	background-image: url('/washingtons-war/images/Marker_EuropeanWar.jpg');
}

.marker.french-navy {
	width: 63px;
	height: 126px;
	background-image: url('/washingtons-war/images/Marker_FrenchNavy.jpg');
	box-shadow: var(--piece-shadow);
}

.marker.congress {
	width: 56.5px;
	height: 56.5px;
	background-image: url('/washingtons-war/images/Marker_ContinentalCongress.jpg');
	box-shadow: var(--piece-shadow);
}

.marker.control {
	width: 38px;
	height: 38px;
	box-shadow: var(--piece-shadow);
	visibility: hidden;
}

.marker.control.british {
	visibility: visible;
	border: 4px solid white;
	background-image: url('/washingtons-war/images/BR_ColonyControl.png');
}

.marker.control.american {
	visibility: visible;
	border: 4px solid #27b;
	background-image: url('/washingtons-war/images/AM_ColonyControl.png');
}

.pc {
	width: 67px;
	height: 58.5px;
}
.pc {
	transform: scale(1.25) translate(-3px,5px);
}
.pc.american { background-image: url('/washingtons-war/images/American-PC.png'); }
.pc.british { background-image: url('/washingtons-war/images/British-PC.png'); }

.cu {
	width: 55px;
	height: 61px;
	line-height: 50px;
	padding-left: 6px;
	font-size: 30px;
	color: white;
	text-shadow: 0px 0px 3px black;
	font-weight: bold;
	border-radius: 60px;
	box-shadow: var(--piece-shadow);
}
.cu.american { background-image: url('/washingtons-war/images/American-CU.png'); }
.cu.british { background-image: url('/washingtons-war/images/British-CU.png'); }
.cu.french { background-image: url('/washingtons-war/images/French-CU.png'); }

.general {
	position: absolute;
	width: 63px;
	height: 126px;
	background-size: cover;
	outline: 1px solid black;
	box-shadow: var(--piece-shadow);
}
.general.offmap {
	display: none;
}
.general.enabled {
	cursor: pointer;
}
.general.british.enabled, .general.british.selected { box-shadow: 0 0 5px 5px white; }
.general.american.enabled, .general.american.selected { box-shadow: 0 0 5px 5px white; }
.general.french.enabled, .general.french.selected { box-shadow: 0 0 5px 5px white; }

.general:hover { z-index: 1; }
.general.selected { z-index: 2; }
.marker.congress { z-index: 3 }
.cu { z-index: 4; }
.space { z-index: 5; }

.general.Arnold { background-image: url('/washingtons-war/images/AM_General_Arnold.jpg'); }
.general.Gates { background-image: url('/washingtons-war/images/AM_General_Gates.jpg'); }
.general.Greene { background-image: url('/washingtons-war/images/AM_General_Greene.jpg'); }
.general.Lafayette { background-image: url('/washingtons-war/images/AM_General_Lafayette.jpg'); }
.general.Lee { background-image: url('/washingtons-war/images/AM_General_Lee.jpg'); }
.general.Lincoln { background-image: url('/washingtons-war/images/AM_General_Lincoln.jpg'); }
.general.Rochambeau { background-image: url('/washingtons-war/images/AM_General_Rochambeau.jpg'); }
.general.Washington { background-image: url('/washingtons-war/images/AM_General_Washington.jpg'); }
.general.Burgoyne { background-image: url('/washingtons-war/images/BR_General_Burgoyne.jpg'); }
.general.Carleton { background-image: url('/washingtons-war/images/BR_General_Carleton.jpg'); }
.general.Clinton { background-image: url('/washingtons-war/images/BR_General_Clinton.jpg'); }
.general.Cornwallis { background-image: url('/washingtons-war/images/BR_General_Cornwallis.jpg'); }
.general.Howe { background-image: url('/washingtons-war/images/BR_General_Howe.jpg'); }

.space {
	position: absolute;
	border: 7px solid transparent;
	display: none;
}
.space.enabled {
	display: block;
	cursor: pointer;
	border: 7px solid transparent;
	box-shadow: 0 0 0 4px white, inset 0 0 0 2px white;
}
.space.regular-space {
	border-radius: 100px;
}
.space.fortified-port {
	transform: rotate(45deg);
}
.space.blockade {
	border-radius: 15px;
	border: 7px solid white;
	box-shadow: none;
}
.space.highlight {
	cursor: pointer;
	display: block;
}

/* CARDS */

.card {
	background-position: -1px -1px;
	background-size: 188.5px 264px;
	width: 186px;
	height: 262px;
	border-radius: 10px;
	box-shadow: var(--piece-shadow);
	display: none;
}

.card.show {
	display: block;
}

#tooltip.card {
	background-position: center;
	background-size: 377px 528px;
	width: 372px;
	height: 524px;
	border-radius: 20px;
}

.shift .hand .card:hover, .shift .hand .card.selected {
	transform: scale(1.5) translate(0,-30px);
	z-index: 10;
}

#war_ends {
	left:1074px;
	top:1647px;
	position:absolute;
	width: 186px;
	height: 262px;
	transform: rotate(90deg);
	background-position: -1px -1px;
	background-size: 188.5px 264px;
	border-radius: 10px;
	box-shadow: 2px -2px 8px rgba(0,0,0,0.5);
	display: none;
}
#war_ends.year_1779 {
	background-image:url('/washingtons-war/images/Card_71.jpg');
	display: block;
}
#war_ends.year_1780 {
	background-image:url('/washingtons-war/images/Card_72.jpg');
	display: block;
}
#war_ends.year_1781 {
	background-image:url('/washingtons-war/images/Card_73.jpg');
	display: block;
}
#war_ends.year_1782 {
	background-image:url('/washingtons-war/images/Card_74.jpg');
	display: block;
}
#war_ends.year_1783 {
	background-image:url('/washingtons-war/images/Card_75.jpg');
	display: block;
}

#played_british_reinforcements { left: 911px; }
#played_american_reinforcements_1 { left: 1144px; }
#played_american_reinforcements_2 { left: 1376px; }
.reinforcements {
	position:absolute;
	top: 1922px;
	width: 186px;
	height: 262px;
	background-position: -1px -1px;
	background-size: 188.5px 264px;
	border-radius: 10px;
	box-shadow: 2px 2px 8px rgba(0,0,0,0.5);
	display: none;
}
.reinforcements.ops_1 {
	background-image:url('/washingtons-war/images/Card_45-66.jpg');
	display: block;
}
.reinforcements.ops_2 {
	background-image:url('/washingtons-war/images/Card_23-44.jpg');
	display: block;
}
.reinforcements.ops_3 {
	background-image:url('/washingtons-war/images/Card_1-22.jpg');
	display: block;
}

/* IMAGES */

.card_back{background-image:url('/washingtons-war/images/Card_Back.png')}
.card_1{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_2{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_3{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_4{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_5{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_6{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_7{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_8{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_9{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_10{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_11{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_12{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_13{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_14{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_15{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_16{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_17{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_18{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_19{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_20{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_21{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_22{background-image:url('/washingtons-war/images/Card_1-22.jpg')}
.card_23{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_24{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_25{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_26{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_27{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_28{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_29{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_30{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_31{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_32{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_33{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_34{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_35{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_36{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_37{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_38{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_39{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_40{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_41{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_42{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_43{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_44{background-image:url('/washingtons-war/images/Card_23-44.jpg')}
.card_45{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_46{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_47{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_48{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_49{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_50{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_51{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_52{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_53{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_54{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_55{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_56{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_57{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_58{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_59{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_60{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_61{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_62{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_63{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_64{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_65{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_66{background-image:url('/washingtons-war/images/Card_45-66.jpg')}
.card_67{background-image:url('/washingtons-war/images/Card_67-69.jpg')}
.card_68{background-image:url('/washingtons-war/images/Card_67-69.jpg')}
.card_69{background-image:url('/washingtons-war/images/Card_67-69.jpg')}
.card_70{background-image:url('/washingtons-war/images/Card_70.jpg')}
.card_71{background-image:url('/washingtons-war/images/Card_71.jpg')}
.card_72{background-image:url('/washingtons-war/images/Card_72.jpg')}
.card_73{background-image:url('/washingtons-war/images/Card_73.jpg')}
.card_74{background-image:url('/washingtons-war/images/Card_74.jpg')}
.card_75{background-image:url('/washingtons-war/images/Card_75.jpg')}
.card_76{background-image:url('/washingtons-war/images/Card_76.jpg')}
.card_77{background-image:url('/washingtons-war/images/Card_77.jpg')}
.card_78{background-image:url('/washingtons-war/images/Card_78.jpg')}
.card_79{background-image:url('/washingtons-war/images/Card_79.jpg')}
.card_80{background-image:url('/washingtons-war/images/Card_80.jpg')}
.card_81{background-image:url('/washingtons-war/images/Card_81.jpg')}
.card_82{background-image:url('/washingtons-war/images/Card_82.jpg')}
.card_83{background-image:url('/washingtons-war/images/Card_83.jpg')}
.card_84{background-image:url('/washingtons-war/images/Card_84.jpg')}
.card_85{background-image:url('/washingtons-war/images/Card_85.jpg')}
.card_86{background-image:url('/washingtons-war/images/Card_86.jpg')}
.card_87{background-image:url('/washingtons-war/images/Card_87.jpg')}
.card_88{background-image:url('/washingtons-war/images/Card_88.jpg')}
.card_89{background-image:url('/washingtons-war/images/Card_89.jpg')}
.card_90{background-image:url('/washingtons-war/images/Card_90.jpg')}
.card_91{background-image:url('/washingtons-war/images/Card_91.jpg')}
.card_92{background-image:url('/washingtons-war/images/Card_92.jpg')}
.card_93{background-image:url('/washingtons-war/images/Card_93.jpg')}
.card_94{background-image:url('/washingtons-war/images/Card_94.jpg')}
.card_95{background-image:url('/washingtons-war/images/Card_95.jpg')}
.card_96{background-image:url('/washingtons-war/images/Card_96.jpg')}
.card_97{background-image:url('/washingtons-war/images/Card_97.jpg')}
.card_98{background-image:url('/washingtons-war/images/Card_98.jpg')}
.card_99{background-image:url('/washingtons-war/images/Card_99.jpg')}
.card_100{background-image:url('/washingtons-war/images/Card_100.jpg')}
.card_101{background-image:url('/washingtons-war/images/Card_101.jpg')}
.card_102{background-image:url('/washingtons-war/images/Card_102.jpg')}
.card_103{background-image:url('/washingtons-war/images/Card_103.jpg')}
.card_104{background-image:url('/washingtons-war/images/Card_104.jpg')}
.card_105{background-image:url('/washingtons-war/images/Card_105.jpg')}
.card_106{background-image:url('/washingtons-war/images/Card_106.jpg')}
.card_107{background-image:url('/washingtons-war/images/Card_107.jpg')}
.card_108{background-image:url('/washingtons-war/images/Card_108.jpg')}
.card_109{background-image:url('/washingtons-war/images/Card_109.jpg')}
.card_110{background-image:url('/washingtons-war/images/Card_110.jpg')}