/* center the whole page in the middle */
#xpagecontainer * {margin:0;}
body  {text-align:center;font-family:Arial,Sans-Serif; white-space:normal;}
#pagecontainer { margin:0 auto;text-align:left; vertical-align:top; white-space:normal;}

 @media only screen  and (max-width :600px) {
	.appicon {width:50px!important; height:50px!important; }
	.gapR {margin-right: 0.5em !important; }
	.gridM { grid-template-columns: 1fr !important; }
	.gx2 { grid-column: unset !important; }
}

.flexC {
	display: flex;
	align-items: center;
	flex-direction: row;
	justify-content: flex-start;
	flex-wrap: wrap;
}

.flexR { 
	flex-wrap: nowrap;
	justify-content: flex-end;
	flex: 1;
}

.fx {
	display: flex;
	align-items:center;
}

.fxC {
	display: inline;
	align-items: center;
	text-align: center;
}

.gridM {
	display: grid;
	grid-template-columns: 3fr 9fr;
}

.gridL {
	display: grid;
    grid-template-columns: minmax(50px,auto) 12fr;
}

.fx {
	display: flex;
    align-items: center;
}

.gx {
	padding-left: 0.5em;
	display:inline-table;
}

.gx2 {
	grid-column: span 2;
}

.gapR { margin-right:1.5em;}
.clear{ clear:both; grid-column: 1; }

h2 {
	margin-block-start: 0.5em;
	margin-block-end: 0.25em;
}

.xi {
	margin-block-start: 0.5em;
	margin-block-end: 0.25em;
}

.mono {font-family: monospace; font-size:larger; }

.centerwrap { margin:0px auto;text-align:center; display: inline-block;}
.centerblock{ margin:0px auto;display: inline-block;}
.centered { margin:0px auto;text-align:center;}

/* large subtitles - hide the . in a list */
.subtitle {white-space:nowrap;vertical-align:middle;}
ul.subtitle li {  list-style: none; padding: 3px 30px 3px 10px; margin: 5px; }

.submenu {white-space:nowrap;vertical-align:middle;}
ul.submenu li {  list-style: none; margin: 2px;  }


/* force new centered area */
.centeredclear{ text-align:center;clear:both;}

/* default link colors */
a:link{color:blue;}
a:visited{color:blue;}
a:hover{color:red;}

/* horizontal list with border */
ul.horizontal_list {
    margin: 0 auto;
    padding: 0;
}
ul.horizontal_list li{
    text-align: left;
    float: left;
    list-style: none;
    padding: 3px 10px 3px 10px;
    margin: 5px;
    border: 1px solid #CCC;
}

/* button lookalike */
.button {
    text-align: center;
    padding: 3px 10px 3px 10px;
    margin: 10px 15px 10px 10px;
    border: 1px solid #0B0B0B;
    background-color:ButtonFace;
    color:ButtonText;
    text-decoration:none;
    overflow:hidden;
	font-size:120%;
	vertical-align:center;
    width:150px;
}

.button a:active{ color:ButtonText;}

/* images */
img {border-style:none; margin:4px;}
.appicon {width:75px; height: 75px; }
.img_screen    {max-width:max(100px,min(100%,250px));margin:0;}
.img_screenbig {max-width:max(100px,min(100%,250px));margin:0;}
.img_menu_main {max-width:max(100px,min(100%,250px));margin:0;}
.img_menu_more {max-width:max(100px,min(100%,250px));margin:0;}
.img_dialog    {max-width:max(100px,min(100%,250px));margin:0;}
.img_inline {max-height:24px;margin:0; display:inline;vertical-align:middle;}
.img_fixedline {max-height:30px;}
.img_fixedlinebig {max-height:50px;}
.img_fixedlinelarge {max-height:70px;}
.icon {width:32px;height:32px; margin-right:0.3em;}
.line {height:1px; background-color:Gray; line-height:0px; vertical-align:middle; }
.line2 {height:2px; background-color:Gray; line-height:0px; vertical-align:middle;}
.lineLight {height:1px; line-height:0px; vertical-align:middle; background-color:Silver; }
.small {}
.smaller {font-size:80%;}

/* general styles */
th {text-align:left;}
.ul {list-style-type:none;list-style-position:inside;margin-left:5px;padding-left:0px; display:list-item;}
.right {text-align:right; white-space:nowrap;}
.vcw {white-space:nowrap; vertical-align:middle;}
.vt {vertical-align:top; }
.vb {vertical-align:bottom; }
.vc {vertical-align:middle; align-self:center;}
ul table {display:inline-table;}
.indent {list-style-type:circle; list-style-position:inside;vertical-align:middle;}
.fixedline {max-height:40px;padding:5px; display:inline;vertical-align:middle;}
.input {width:90%;}
.actionbutton{text-align:center; padding-left:5px; padding-right:5px;}
.max{max-width:20%;}

.w100X {width:50px;}
.tdindentX { padding-left:50px;vertical-align:top; }
.tdindentX p {padding-bottom:2px;}
.expandcol{width:25%;}
.fullwidthX{width:100%;}
.halfwidthX{width:50%;}
.halfindentX { padding-left:50px;}
.mobindentX {vertical-align:top; }
.mobindent2X {padding-left:5px;}
.hiddentext { background-color:White; color:White;}
.min50X {min-width:50%;}