* { margin: 0 ; padding: 0 }
html { height: 100% ; }
body { height: 100% ; }

/* -------------------------------------------------------------------- */

#tabs {
    display: none ;
    position: absolute ; top: 5px ; bottom: 5px ; left: 5px ; right: 5px ;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#tabs-scenario {
    display: grid ; display: -ms-grid ;
    grid-template-rows: 2fr 3fr ; -ms-grid-rows: 2fr 3fr ;
    grid-template-columns: 25em 1fr ; -ms-grid-columns: 25em 1fr ;
}
#panel-scenario {
    height: 100% ;
    grid-row-start: 1 ; -ms-grid-row: 1 ;
    grid-row-end: 3 ; -ms-grid-row-span: 2 ;
}
#panel-vc {
    -ms-grid-row: 1 ; -ms-grid-column: 2 ;
}
#panel-ssr {
    height: 100% ;
    -ms-grid-row: 2 ; -ms-grid-column: 2 ;
}

#tabs-ob1, #tabs-ob2 {
    display: grid ; display: -ms-grid ;
    grid-template-rows: 10em 1fr ; -ms-grid-rows: 10em 1fr ;
    grid-template-columns: 1fr 1fr ; -ms-grid-columns: 1fr 1fr ;
}
#panel-obsetup1, #panel-obsetup2 {
    grid-row-start: 1 ; -ms-grid-row: 1 ;
    grid-column-start: 1 ; -ms-grid-row: 1 ;
}
#panel-obvehicles1, #panel-obvehicles2 {
    height: 100% ;
    grid-row-start: 1 ; -ms-grid-row: 1 ;
    grid-row-end: 3 ; -ms-grid-row-span: 2 ;
    -ms-grid-column: 2 ;
}
#panel-obordnance1, #panel-obordnance2 {
    height: 100% ;
    -ms-grid-row: 2 ; -ms-grid-column: 1 ;
}

#tabs-other {
    display: grid ; display: -ms-grid ;
    grid-template-rows: 1fr ; -ms-grid-rows: 1fr ;
    grid-template-columns: 1fr ; -ms-grid-columns: 1fr ;
}
#panel-other {
    height: 100% ;
}

fieldset { height: calc(100% - 30px) ; margin: 0 5px 5px 5px ; padding: 10px ; }
#tabs-other fieldset { border: none ; }
fieldset legend { padding: 0 0.2em 0 0.2em ; font-style: italic ; font-weight: bold ; }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.label { font-weight: bold ; }
input[type="text"] { margin-bottom: 0.25em ; }

#panel-scenario .form-grid {
    display: grid ; display: -ms-grid ;
    grid-template-columns: 5em 1fr ; -ms-grid-columns: 5em 1fr ;
}
#panel-scenario input[type="button"] { float: right ; }
/* FUDGE! IE hackamathon follows (nb: <label> doesn't work, we use <div> for labels instead :-/) */
#panel-scenario div[data-labelfor="scenario_name"] { -ms-grid-row: 1 ; -ms-grid-column: 1 ; }
#panel-scenario input[name="scenario_name"] { -ms-grid-row: 1 ; -ms-grid-column: 2 ; }
#panel-scenario div[data-labelfor="scenario_location"] { -ms-grid-row: 2 ; -ms-grid-column: 1 ; }
#panel-scenario input[name="scenario_location"] { -ms-grid-row: 2 ; -ms-grid-column: 2 ; }
#panel-scenario div[data-labelfor="scenario_date"] { -ms-grid-row: 3 ; -ms-grid-column: 1 ; }
#panel-scenario div.scenario_date { -ms-grid-row: 3 ; -ms-grid-column: 2 ; }

#panel-vc textarea[name="victory_conditions"] { width: calc(100% - 2px) ; height: calc(100% - 1.5em) ; resize: none ; }
#panel-vc input[type="button"] { float: right ; }

/* -------------------------------------------------------------------- */

.growl-title { display: none ; }
.growl ul { margin-left: 1em ; }