@CHARSET "ISO-8859-1";

.unitCmd1:hover,
.unitAlt1:hover,
.unitCav3:hover,
.unitCav6:hover,
.unitCav9:hover,
.unitInf3:hover,
.unitInf6:hover,
.unitInf9:hover,
.unitInf12:hover,
.unitInf15:hover,
.unitInf18:hover,
.unitInf21:hover {
	border: 3px solid #986F12;
	border-radius: 10px;
}

.unitNameText {
	grid-area: unit_text;
	text-transform: capitalize;
}

.quota {
	grid-area: quota;
	width: 15px;
	height: 15px;
}

.imgQuota {
	display: none;
}

.unitCmd1 {
	display: grid;
	grid-template-columns: 30px 30px 30px auto;
	grid-template-rows: 35px 35px 35px auto;
	grid-template-areas: "unit_pic1 unit_pic1 unit_pic1 unit_options1"
		"unit_pic1 unit_pic1 unit_pic1 unit_options2"
		"order_pic2 order_pic1 order_pic3 unit_options3"
		"unit_name unit_name unit_name quota";
	max-width: 120px;
	border: 3px solid transparent;
}

.unitAlt1 {
	display: grid;
	grid-template-columns: 70px auto;
	grid-template-rows: 35px 35px 35px auto;
	grid-template-areas: "unit_pic1 unit_options1" "unit_pic1 unit_options2"
		"unit_pic1 unit_options3" "unit_name unit_name";
	max-width: 100px;
	border: 3px solid transparent;
}

.unitCav3 {
	display: grid;
	grid-template-columns: 70px auto;
	grid-template-rows: 35px 35px 35px auto;
	grid-template-areas: "unit_pic1 unit_options1" "unit_pic2 unit_options2"
		"unit_pic3 unit_options3" "unit_name unit_name";
	max-width: 100px;
	border: 3px solid transparent;
}

.unitCav6 {
	display: grid;
	grid-template-columns: 70px 70px auto;
	grid-template-rows: 35px 35px 35px auto;
	grid-template-areas: "unit_pic1 unit_pic2 unit_options1"
		"unit_pic3 unit_pic4 unit_options2"
		"unit_pic5 unit_pic6 unit_options3" "unit_name unit_name unit_name";
	max-width: 170px;
	border: 3px solid transparent;
}

.unitCav9 {
	display: grid;
	grid-template-columns: 70px 70px 70px auto;
	grid-template-rows: 35px 35px 35px auto;
	grid-template-areas: "unit_pic1 unit_pic2 unit_pic3 unit_options1"
		"unit_pic4 unit_pic5 unit_pic6 unit_options2"
		"unit_pic7 unit_pic8 unit_pic9 unit_options3"
		"unit_name unit_name unit_name unit_name";
	max-width: 240px;
	border: 3px solid transparent;
}

.unitInf3 {
	display: grid;
	grid-template-columns: 70px auto;
	grid-template-rows: 35px 35px 35px auto;
	grid-template-areas: "unit_pic1 unit_options1" "unit_pic2 unit_options2"
		"unit_pic3 unit_options3" "unit_name unit_name";
	max-width: 100px;
	border: 3px solid transparent;
}

.unitInf6 {
	display: grid;
	grid-template-columns: 70px 70px auto;
	grid-template-rows: 35px 35px 35px auto;
	grid-template-areas: "unit_pic1 unit_pic2 unit_options1"
		"unit_pic3 unit_pic4 unit_options2"
		"unit_pic5 unit_pic6 unit_options3" "unit_name unit_name unit_name";
	max-width: 170px;
	border: 3px solid transparent;
}

.unitInf9 {
	display: grid;
	grid-template-columns: 70px 70px 70px auto;
	grid-template-rows: 35px 35px 35px auto;
	grid-template-areas: "unit_pic1 unit_pic2 unit_pic3 unit_options1"
		"unit_pic4 unit_pic5 unit_pic6 unit_options2"
		"unit_pic7 unit_pic8 unit_pic9 unit_options3"
		"unit_name unit_name unit_name unit_name";
	max-width: 240px;
	border: 3px solid transparent;
}

.unitInf12 {
	display: grid;
	grid-template-columns: 70px 70px 70px 70px auto;
	grid-template-rows: 35px 35px 35px auto;
	grid-template-areas:
		"unit_pic1 unit_pic2 unit_pic3 unit_pic4 unit_options1"
		"unit_pic5 unit_pic6 unit_pic7 unit_pic8 unit_options2"
		"unit_pic9 unit_pic10 unit_pic11 unit_pic12 unit_options3"
		"unit_name unit_name unit_name unit_name unit_name";
	max-width: 310px;
	border: 3px solid transparent;
}

.unitInf15 {
	display: grid;
	grid-template-columns: 70px 70px 70px 70px 70px auto;
	grid-template-rows: 35px 35px 35px auto;
	grid-template-areas:
		"unit_pic1 unit_pic2 unit_pic3 unit_pic4 unit_pic5 unit_options1"
		"unit_pic6 unit_pic7 unit_pic8 unit_pic9 unit_pic10 unit_options2"
		"unit_pic11 unit_pic12 unit_pic13 unit_pic14 unit_pic15 unit_options3"
		"unit_name unit_name unit_name unit_name unit_name unit_name";
	max-width: 380px;
	border: 3px solid transparent;
}

.unitInf18 {
	display: grid;
	grid-template-columns: 70px 70px 70px 70px 70px 70px auto;
	grid-template-rows: 35px 35px 35px auto;
	grid-template-areas:
		"unit_pic1 unit_pic2 unit_pic3 unit_pic4 unit_pic5 unit_pic6 unit_options1"
		"unit_pic7 unit_pic8 unit_pic9 unit_pic10 unit_pic11 unit_pic12 unit_options2"
		"unit_pic13 unit_pic14 unit_pic15 unit_pic16 unit_pic17 unit_pic18 unit_options3"
		"unit_name unit_name unit_name unit_name unit_name unit_name unit_name";
	max-width: 450px;
	border: 3px solid transparent;
}

.unitInf21 {
    display: grid;
    grid-template-columns: 70px 70px 70px 70px 70px 70px 70px auto;
    grid-template-rows: 35px 35px 35px auto;
    grid-template-areas:
        "unit_pic1 unit_pic2 unit_pic3 unit_pic4 unit_pic5 unit_pic6 unit_pic7 unit_options1"
        "unit_pic8 unit_pic9 unit_pic10 unit_pic11 unit_pic12 unit_pic13 unit_pic14 unit_options2"
        "unit_pic15 unit_pic16 unit_pic17 unit_pic18 unit_pic19 unit_pic20 unit_pic21 unit_options3"
        "unit_name unit_name unit_name unit_name unit_name unit_name unit_name unit_name";
    max-width: 520px;
    border: 3px solid transparent;
}

.optionImg1 {
	display: none;
}

.optionImg2 {
	display: none;
}

.optionImgBoth {
	display: none;
}

.unitPic1 {
	grid-area: unit_pic1;
	justify-self: center;
	max-width: 70px;
	max-height: 70px;
}

.unitPic2 {
	grid-area: unit_pic2;
	justify-self: center;
}

.unitPic3 {
	grid-area: unit_pic3;
	justify-self: center;
}

.unitPic4 {
	grid-area: unit_pic4;
	justify-self: center;
}

.unitPic5 {
	grid-area: unit_pic5;
	justify-self: center;
}

.unitPic6 {
	grid-area: unit_pic6;
	justify-self: center;
}

.unitPic7 {
	grid-area: unit_pic7;
	justify-self: center;
}

.unitPic8 {
	grid-area: unit_pic8;
	justify-self: center;
}

.unitPic9 {
	grid-area: unit_pic9;
	justify-self: center;
}

.unitPic10 {
	grid-area: unit_pic10;
	justify-self: center;
}

.unitPic11 {
	grid-area: unit_pic11;
	justify-self: center;
}

.unitPic12 {
	grid-area: unit_pic12;
	justify-self: center;
}

.unitPic13 {
	grid-area: unit_pic13;
	justify-self: center;
}

.unitPic14 {
	grid-area: unit_pic14;
	justify-self: center;
}

.unitPic15 {
	grid-area: unit_pic15;
	justify-self: center;
}

.unitPic16 {
	grid-area: unit_pic16;
	justify-self: center;
}

.unitPic17 {
	grid-area: unit_pic17;
	justify-self: center;
}

.unitPic18 {
	grid-area: unit_pic18;
	justify-self: center;
}

.unitPic19 {
    grid-area: unit_pic19;
    justify-self: center;
}

.unitPic20 {
    grid-area: unit_pic20;
    justify-self: center;
}

.unitPic21 {
    grid-area: unit_pic21;
    justify-self: center;
}

.unitOptions1 {
	grid-area: unit_options1;
	justify-self: center;
	align-self: center;
}

.unitOptions2 {
	grid-area: unit_options2;
	justify-self: center;
	align-self: center;
}

.unitOptions3 {
	grid-area: unit_options3;
	justify-self: center;
	align-self: center;
}

.group {
	grid-area: unit_options3;
	justify-self: center;
	align-self: center;
	width: 30px;
}

.orderPic1 {
	grid-area: order_pic1;
	justify-self: center;
}

.orderPic2 {
	grid-area: order_pic2;
	justify-self: center;
}

.orderPic3 {
	grid-area: order_pic3;
	justify-self: center;
}

.orderPic4 {
	grid-area: order_pic4;
	justify-self: center;
}

.orderPic5 {
	grid-area: order_pic4;
	justify-self: center;
}

.add_slot {
	border-left: 3px solid #986F12;
	border-right: 3px solid #986F12;
	border-top: 3px solid transparent;
	border-bottom: 3px solid transparent;
	border-radius: 10px;
}

.add_option {
	border: 3px solid transparent;
	min-width: 25px;
}

.add_slot:hover {
	border: 3px solid #986F12;
	border-radius: 10px;
}

.add_option:hover {
	border: 3px solid #986F12;
	border-radius: 10px;
}

.unitName {
	font-size: 100%;
	grid-area: unit_name;
	text-align: center;
	line-height: 80%;
	max-height: 35px;
	display: grid;
	grid-template-columns: auto 15px;
	grid-template-rows: auto;
	grid-template-areas: "unit_text quota";
}

.unitCmdLevel {
	vertical-align: middle;
	width: 20px;
}

.reconToShowImg {
	width: 12px;
}

.supplyImg {
	width: 12px;
}

.unit {
	padding-left: 5px;
	padding-right: 5px;
}

.unit1 {
	grid-area: unit1;
}

.unit2 {
	grid-area: unit2;
}

.unit3 {
	grid-area: unit3;
}

.unit4 {
	grid-area: unit4;
}

.unit5 {
	grid-area: unit5;
}

.unit6 {
	grid-area: unit6;
}

.unit7 {
	grid-area: unit7;
}

.unit8 {
	grid-area: unit8;
}

.unit9 {
	grid-area: unit9;
}

.unit10 {
	grid-area: unit10;
}

.unit11 {
	grid-area: unit11;
}

.unit12 {
	grid-area: unit12;
}

.unit13 {
	grid-area: unit13;
}

.unit14 {
	grid-area: unit14;
}

.unit15 {
	grid-area: unit15;
}

.unit16 {
	grid-area: unit16;
}

.unit17 {
	grid-area: unit17;
}

.unit19 {
	grid-area: unit18;
}

.unit19 {
	grid-area: unit19;
}

.unit20 {
	grid-area: unit20;
}

.unit21 {
	grid-area: unit21;
}

.unit22 {
	grid-area: unit22;
}

.unit23 {
	grid-area: unit23;
}

.unit24 {
	grid-area: unit24;
}

.unit25 {
	grid-area: unit25;
}

.unit26 {
	grid-area: unit26;
}

.unit27 {
	grid-area: unit27;
}

.unit28 {
	grid-area: unit28;
}

.unit29 {
	grid-area: unit29;
}

.unit30 {
	grid-area: unit30;
}

.unit31 {
	grid-area: unit31;
}

.unit32 {
	grid-area: unit32;
}

.unit33 {
	grid-area: unit33;
}

.unit34 {
	grid-area: unit34;
}

.unit35 {
	grid-area: unit35;
}

.unit36 {
	grid-area: unit36;
}

.unit37 {
	grid-area: unit37;
}

.unit38 {
	grid-area: unit38;
}

.unit39 {
	grid-area: unit39;
}

.unit40 {
	grid-area: unit40;
}

.unit41 {
	grid-area: unit41;
}

.unit42 {
	grid-area: unit42;
}

.unit43 {
	grid-area: unit43;
}

.unit44 {
	grid-area: unit44;
}

.unit45 {
	grid-area: unit45;
}

.unit46 {
	grid-area: unit46;
}

.unit47 {
	grid-area: unit47;
}

.unit48 {
	grid-area: unit48;
}