@CHARSET "ISO-8859-1";

.corps{
	position: relative;
    width: var(--max-width-corps);
    min-height: var(--min-height-corps);

	border-left: var(--border-left);
	border-top: var(--border-top);
	border-bottom: var(--border-bottom);
	border-right: var(--border-right);
	box-shadow: var(--box-shadow);
	
	margin: var(--margin-element);
	padding: var(--padding-element-inside);
    
	display: grid;
	grid-template-columns: 
	   var(--pic-large-button) 
	   var(--pic-large-button) 
       calc(0.58 * var(--div-cmd-width))
       calc(0.5 * var(--div-cmd-width))
	   calc(0.5 * var(--div-cmd-width)) 
	   calc(0.5 * var(--div-cmd-width))
	   calc(0.5 * var(--div-cmd-width)) 
	   auto 
	   var(--pic-large-button)
	   var(--pic-large-button);
	grid-template-rows: 
	   var(--pic-large-button)
       var(--pic-large-button)
       var(--pic-large-button)
	   calc(2.7 * var(--pic-small-brigade) - 2 * var(--pic-large-button)) 
	   auto;
	grid-template-areas: 
	    "exclamation exclamation add no33 title title title owntitle no11 no11"
		"exclamation exclamation add cl1img cl2img cl3img cl4img  no no no"
		"points points add cl1amount cl2amount cl3amount cl4amount no no no"
        "validator validator add no22 no22 no22 no22 no no no"
		"content content content content content content content content content content";
}
		
.corps > .corpsValidatorPic{
	display: none;
	grid-area: exclamation;
}

.corps > .corpsName {
    grid-area: title;

    font-size: var(--font-08);
    font-weight: var(--font-weight-bold);
    padding-right: var(--padding-element-inside);
    padding-top: var(--padding-element-inside);
    text-align: right;
}

.corps > .corpsOwnName{
    grid-area: owntitle;
    display: flex;
}

.corps > .corpsOwnName > .corpsOwnNameInput{
    text-align: center;
    font-size: var(--font-07);
    background-color: transparent;
    outline: none;
    border: 0.1vw solid transparent;
    border-bottom: var(--border);
    width: var(--point-input-width);
    margin-left: var(--pic-small);
}
	
.corps > .corpsValidator {
    grid-area: validator;
    display: none;
}

.corpsValidator, .corpsValidatorInfo {
	font-size: var(--font-small);
	padding-left: var(--padding-error-left);
}

.corpsValidator >.templateValidatorRow > b {
	color: var(--color-error);	
}

.corps > .corpsPoints{
    grid-area: points;
    font-size: var(--font-10);
    font-weight: var(--font-weight-bold);
    text-align: center;
}

.corps > .unitAdd{
	grid-area: add;
}

.corps > .corpsContent{
	grid-area: content;
}

.fleettop>.corpsSelector{
    top: var(--info-offset-x);	
}

.corps > .divisionAdd > .divisionAddImg{
	width: var(--pic-medium);
}
	
.corps > .corpsValidatorPic > .corpsValidatorPicImg {
	width: var(--pic-small-medium);
}

.corps > .divisionAdd > .divisionAddImg:hover{
	background: var(--background-hover);
	border-radius: var(--border-radius-option);
}

.corpsSelector>.corpsSelectorItem:hover {
	background: var(--background-hover);
}

.corps>.corpsValidatorInfo{
    display: none;
    position: absolute;
    width: calc(1.5 * var(--flex-selector-width));
    
    padding: var(--padding-flex);
    border-left: var(--border-left);
    border-top: var(--border-top);
    border-bottom: var(--border-bottom);
    border-right: var(--border-right);
    box-shadow: var(--box-shadow);
    background-color: var(--background-info);
    z-index: 100;
}

 .corps > .corpsValidatorPic > .corpsValidatorPicImg:hover {
    background: var(--background-hover);
    border-radius: var(--border-radius-option);
}

.corpsClass1Icon,
.corpsClass2Icon,
.corpsClass3Icon,
.corpsClass4Icon{
    margin: auto;
}
.corpsClass1Icon{
	grid-area: cl1img;
}
.corpsClass2Icon{
	grid-area: cl2img;
}
.corpsClass3Icon{
	grid-area: cl3img;
}
.corpsClass4Icon{
	grid-area: cl4img;
}

.corpsClassIconImg{
    width: var(--pic-medium);
}

.corpsClass1Amount,
.corpsClass2Amount,
.corpsClass3Amount,
.corpsClass4Amount,
.corpsClass1FortAmount,
.corpsClass2FortAmount,
.corpsClass3FortAmount,
.corpsClass4FortAmount{
	padding: var(--padding-element-inside);
	text-align: center;
    font-size: var(--font-07);
    font-weight: var(--font-weight-bold);
    line-height: 0.8;
}
.corpsClass1Amount,
.corpsClass1FortAmount{
	grid-area: cl1amount;
}
.corpsClass2Amount,
.corpsClass2FortAmount{
	grid-area: cl2amount;
}
.corpsClass3Amount,
.corpsClass3FortAmount{
	grid-area: cl3amount;
}
.corpsClass4Amount,
.corpsClass4FortAmount{
	grid-area: cl4amount;
}
 
.unitAdd{
	position: relative;
    margin: var(--margin-element);
    background: url(../../../img/unit/unit-background.png);
    
    border-left: var(--border-left);
    border-top: var(--border-top);
    border-bottom: var(--border-bottom);
    border-right: var(--border-right);
    box-shadow: var(--box-shadow);
    
    float: left;
    padding: var(--padding-element-inside);
}
.unitAdd:hover{
    transform: scale(1.05, 1.05);
}

.unitAddImg{
	padding: var(--padding-element-inside);
}

.unitAddImg>.img{
    width: 100%;
}