@CHARSET "ISO-8859-1";

@media print {
	@page {
	    size: auto;
	}

	.previewButtons{
		visibility: hidden;
	}
	
	body{
		background: none;
	}
	
	.printArea{
        width: 100%;
        height: 100%;
	}
	
	.printArea * {
 		font-family: "Verdana", cursive;
 		font-size: var(--print-font);
		line-height: 1.3;
		overflow: hidden;
		visibility: visible;
		widows: 4;
		orphans: 4;
	}
}

.previewArea {
	display: none;
	position: relative;
	width: 101%;
	min-height: 100vh;
	background: var(--background-info);
	padding-bottom: 50px;
	z-index: 100;
}

.previewButtons{
	display: none;
	min-height: var(--print-row-height-large);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    background: white;
    padding-bottom: .5vw;
    padding-right: .5vw;
}

.printArea {
    transform: scale(var(--print-preview-transform-scale));
	transform-origin: center top;
	font-family: "Garamond", "Calibri", "Times New Roman";
	position: relative;
	margin-left: 1vw;
	margin-right: 1vw; 
}

.printTitle{
	width: 100%;
	font-size: var(--font-12);
	text-align: center;
}

.printPlayerName{
	font-size: var(--font-12);
	text-align: center;
}

.printGlobalStatsRow {
	font-size: var(--font-10);
	width: 100%;

	display: grid;
	grid-template-columns: 
		auto 
		calc(3 * var(--print-cell-info-width)) 
		calc(3 * var(--print-cell-info-width))
		calc(3 * var(--print-cell-info-width)) 
		calc(3 * var(--print-cell-info-width))
        calc(3 * var(--print-cell-info-width));
    grid-template-rows:  calc(2 * var(--print-cell-info-height));
    grid-template-areas: "cell0 cell1 cell2 cell3 cell4 cell5";
}

.printGlobalStatsCell>.img{
	width: 40%;
}

.printGlobalOptionsTabelRow {
	font-size: var(--font-10);
	width: 100%;

	display: grid;
	grid-template-columns: 
		calc(2.5 * var(--print-cell-info-width)) 
		calc(2.5 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width))
        auto;
    grid-template-rows:  auto;
    grid-template-areas: "cell0 cell1 cell2 cell3 cell4";
}

.printGlobalOptionsTableCell.cell0>.img{
	width: 20%;
}

.printGlobalOptionsTableCell.cell0>.img:last-child{
	display: none;
}

.printFleetTabelRow {
	font-size: var(--font-10);
	width: 100%;

	display: grid;
	grid-template-columns: 
		calc(1 * var(--print-cell-info-width)) 
		calc(2.5 * var(--print-cell-info-width)) 
		calc(2.5 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width))
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width))
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width))
		calc(0.7 * var(--print-cell-info-width))
		calc(0.7 * var(--print-cell-info-width))
		calc(0.7 * var(--print-cell-info-width)) 
        auto;
    grid-template-rows:  auto;
    grid-template-areas: "cell0 cell1 cell2 cell3 cell4 cell5 cell6 cell7 cell8 cell9 cell10 cell11 cell12 cell13";
}

.printFleetTableCell>.img{
	width: 60%;
}

.printFleetTableCell.cell0>.img{
	width: 30%;
}

.printFleetTableCell.cell1{
	display: inline-block;
}

.printFleetTableCell.cell1>.unitPicImg{
	display: inline;
	width: 80%;
}

.printFleetTableCell.cell1>.unitFlagImg{
	display: inline;
    margin-right: -2vw;
    margin-bottom: 2vw;
	width: calc(1.5 * var(--pic-small-brigade));
    height: calc(0.9 * var(--pic-small-brigade));
}

.printFortsTabelRow {
	font-size: var(--font-10);
	width: 100%;

	display: grid;
	grid-template-columns: 
		calc(3 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width))
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width))
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width))
        auto;
    grid-template-rows:  auto;
    grid-template-areas: "cell0 cell1 cell2 cell3 cell4 cell5 cell6 cell7 cell8";
}

.printFortsTableCell>.img{
	width: 60%;
}

.printCannonsRow {
	font-size: var(--font-10);
	width: 100%;

	display: grid;
	grid-template-columns: 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(1.2 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width)) 
		calc(0.7 * var(--print-cell-info-width));
    grid-template-rows: calc(2*var(--print-cell-info-height));
    grid-template-areas: "cell0 cell1 cell2 cell3 cell4 cell5 cell6 cell7 cell8 cell9 cell10 cell11 cell12";
}

.printCannonsCell>.img{
	width: calc(0.3 * var(--print-cell-info-width));
}
.printCannonsCell>.cell
.printRulesTableRow {
	font-size: var(--font-10);
	width: 100%;

	display: grid;
	grid-template-columns: 
		calc(3 * var(--print-cell-info-width)) 
        auto;
    grid-template-rows:  auto;
    grid-template-areas: "cell0 cell1";
}

.printRulesTableCell.cell0{
	font-weight: var(--font-weight-bold);
}


.section{
	border-top: var(--print-border-section-separator);
	padding-top: var(--print-section-padding);
	padding-bottom: var(--print-section-padding);
}

.cell{
	padding: var(--print-cell-padding);
	border-bottom: var(--border);
	border-right: var(--border);
	text-align: center;
}

/*
.printTitle>.printNation{
	font-size: var(--print-font-title);
	text-align: center;	
	padding-top: 2vw;
}

.printTitle>.printPlayerName{
	font-size: var(--print-font-title);
	width: 100%;
    position:  absolute;
}

.printTitle>.printPlayerName>input{
	position: relative;
	text-align: center;
    display: block;
    margin : 0 auto;	
	width: 40%;
    height: var(--print-row-height);
    font-size: var(--print-font-title);
}

.printGlobalStats{
    display: grid;
    grid-template-columns: calc(2 * var(--print-cell-info-width)) calc(2 * var(--print-cell-info-width))
                           calc(2 * var(--print-cell-info-width)) calc(2 * var(--print-cell-info-width))
                           calc(2 * var(--print-cell-info-width));
    grid-template-rows:  auto auto auto;
    grid-template-areas: "cell1 cell2 cell3 cell4 cell5"
                         "cell6 cell7 cell8 cell9 cell10"
                         "cell11 cell12 cell13 cell14 cell15";
    
    margin-bottom: var(--print-info-margin);
}

.printGlobalInfo{
    display: grid;
    grid-template-columns: var(--print-cell-info-width) var(--print-cell-info-width) 
                           var(--print-cell-info-width) var(--print-cell-info-width) 
                           var(--print-cell-info-width) var(--print-cell-info-width) 
                           var(--print-cell-info-width) var(--print-cell-info-width) 
                           var(--print-cell-info-width) var(--print-cell-info-width) 
                           var(--print-cell-info-width) var(--print-cell-info-width);
    grid-template-rows:  auto auto;
    grid-template-areas: "cell1 cell2 cell3 cell4 cell5 cell6 cell7 cell8 cell9 cell10 cell11 cell12"
                         "cell13 cell14 cell15 cell16 cell17 cell18 cell19 cell20 cell21 cell22 cell23 cell24";
    
    margin-bottom: var(--print-info-margin);
}

.printGlobalOptionRow,
.printCorpsRow,
.printDivisionRow,
.printCommanderRow,
.printBrigadeHeader,
.printBrigadeRow{
	display: grid;
	grid-template-columns: var(--print-cell-width-img) var(--print-cell-width-img) var(--print-cell-width-img) var(--print-cell-width-img) auto var(--print-cell-width-img-double) var(--print-cell-width-img-double) var(--print-cell-width-img-double) var(--print-cell-width-img-double) var(--print-cell-width) var(--print-cell-width) var(--print-cell-width) var(--print-cell-width) var(--print-cell-width) var(--print-cell-width) var(--print-cell-width);
	grid-template-rows:  auto;
	grid-template-areas: "cell1 cell2 cell3 cell4 cell5 cell6 cell7 cell8 cell9 cell10 cell11 cell12 cell13 cell14 cell15 cell16";
	
	border-bottom: var(--border);
}

.printTable {
    margin-bottom: var(--print-info-margin);
}

.printBrigadeHeader{
	background: #cccccc;
}

.printCorpsRow{
	background: #dddddd;
	min-height: var(--print-row-height);
}

.printDivisionRow{
	background: #efefef;
	min-height: var(--print-row-height);
}

.printCommanderRow,
.printBrigadeHeader{
	min-height: var(--print-row-height-large-margin);
}

.printBrigadeRow,
.printCommanderRow{
	min-height: var(--print-row-height-large-margin);
}

.cellStat,
.cellInfo{
    border-right: var(--border);
    border-bottom: var(--border);
    font-size: var(--print-font);
    text-align: center;
    
    overflow: hidden;
    display: inline-block;
    text-overflow: ellipsis;
}
.cellStat.headerInfo,
.cellInfo.headerInfo {
	background: #cccccc;
}

.cellStat.headerInfo.cell5,
.cellStat.cell10,
.cellStat.cell15{
    border-left: var(--border-separator);
}
	
.cell{
	border-right: var(--border);
	font-size: var(--print-font);
	text-align: center;
	
	overflow: hidden;
  	display: inline-block;
  	text-overflow: ellipsis;
}

.cellSize>img,
.cellLevel>img,
.cellWeapon>img,
.cellOption>img,
.cellCmdOption>img,
.cellGlobalOptionSymbol>img,
.cellRule>img{
	width: var(--print-img-width);
}

.cellSymbol>img{
	width: var(--print-img-width-large);
	padding: var(--print-cell-padding);
}

.cellArmyCmdSymbol>img,
.cellCorpsCmdSymbol>img,
.cellDivisionCmdSymbol>img {
	width: var(--print-row-height-large);
	padding: var(--print-cell-padding);
}

.printRulesTables{

}
.printRulesTable{
    font-size: var(--font-medium);
    padding-bottom: var(--print-text-margin-tail);
}

.printRuleTable{
    display: grid;
    grid-template-columns: var(--print-brigade-rule-name-tail) auto;
    grid-template-rows: auto;
    grid-template-areas: "name text";
}

.printProperties>.propertyText{
	font-size: var(--print-font);
	min-height: var(--print-row-height);
}

.printTextBox {
	margin-top: var(--margin-element);
	font-size: var(--font-smaller);
    width: calc(1.9 * var(--print-cell-width-img));
	text-align: center;
	border-top: 0px white solid;
	border-left: 0px white solid;
	border-right: 0px white solid;
	border-bottom: 1px gray solid;
} */