
.MyMenuContainer {
 padding:0 1% 10% 1%; vertical-align:top;
 /*
 background: url(/Minerva/IMG/SYS/transparent.png) no-repeat center center fixed; -webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover; background-size:cover;
 */
}
.MyMenuGroupDiv {font-family:var(--skin-font-big); font-weight:500; font-size:1.3rem; color:var(--group-hdr-color); padding:1.5rem 0.375rem 0.375rem 0.375rem; vertical-align:middle;}
.MyMenuGroupDiv span {display:inline-block; line-height:2rem; vertical-align:middle;}
.MyMenuGroupOpr {font-size:1.25rem; margin-left:1rem; display:none; }
.MyMenuGroupOpr:hover {cursor:pointer;}
.MyMenuTilesDiv {position:relative;}

#ModulMenuCover {
 position: absolute; 
 padding: 10px; 
 background-color: var(--light-skin-bg);
}


/*
.MyMenuTile {height:12.5rem; margin:0.3rem; position:relative; display:inline-block; vertical-align:top; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px;
 box-shadow:0 0 6px rgba(148, 148, 148, 0.35); border:var(--skin-border); padding:0.8rem 0.96rem;
} 
.Tile1x1 {width:12.5rem;}
.Tile2x1 {width:25.62rem;}
.MyBgIcon  { float:right; clear:both; font-size:2.3rem; margin:0.7rem 0 0 0.7rem; color:var(--menu-tile-icon); -webkit-text-stroke:0;}
*/

@keyframes createBox {
  from {
    transform: scale(0);
  }
  to {
    transform: scale(1);
  }
}



.MyMenuTile, .ITMenuTile {
 margin:0.24rem; 
 position:relative; 
 display:inline-block; 
 vertical-align:top; 
 border-radius:4px; 
 -moz-border-radius:4px; 
 -webkit-border-radius:4px; 
 border:var(--skin-border); 
 padding:0.8rem 0.96rem;
 
 animation: createBox .25s;
 transition: 0.3s;
 
}
.MyMenuTile {height:10rem;}
.ITMenuTile {height:13.24rem;}
.Tile1x1 {width:17rem;}
.Tile2x1 {width:34.62rem;}
.TileIT1x1 {width:15.53rem;}
.TileIT2x1 {width:31.46rem;}

.MyBgIcon, .ITBgIcon  {float:right; clear:both; font-size:2.3rem; margin:0.7rem 0 0 0.7rem; color:var(--menu-tile-icon);}
 
.MyMenuTile:hover, .ITMenuTile:hover {
 cursor:pointer; 
 background-color:var(--hover-bg) !important;
}

.MyMenuTileWrap:before {content:''; display:block; float:right; height:5rem;}
.ITMenuTileWrap:before {content:''; display:block; float:right; height:8rem;}

.MyMenuItemOpr {font-size:1.25rem; color:var(--light-skin-text); display:none; position:absolute; bottom:0.5rem; left:0.5rem; z-index:auto;}
.MyMenuInf {font-size:1rem; color:var(--light-skin-text); padding:0.525rem 0.375rem 0.525rem 0.375rem;}

.MyClrHdr,.ITClrHdr { display:block; font-size:1.1rem; margin-bottom:0.4rem; color:var(--aux-hdr-color); font-weight:500; max-height:4rem; overflow:hidden; text-overflow:ellipsis; }
.MyClrSub,.ITClrSub { font-size:0.97rem; overflow:hidden; text-overflow:ellipsis; font-weight:400;}

/* Tile Content */
.InTileLine {display:block;}
.InTileHdr {display:inline-block;}
.InTileTxtXS {font-size:85%;}
.InTileTxtS {font-size:92%;}
.InTileTxtM {font-size:100%;}
.InTileTxtL {font-size:120%;}
.InTileTxtXL {font-size:140%;}
.InTileNum {display:inline-block; font-size:3rem; font-weight:500; letter-spacing: -3px;}
.InTileUnit {display:inline-block; font-size:1.1rem; font-weight:400; margin-left:0.3rem;}
.InTileTime {font-size:0.9rem; font-weight:400;}
.InTileTime i {margin-right:0.5rem; font-size:0.9rem;}

.InTileABTxt1 {font-size: 95%; padding-bottom: 0.3rem;}
.InTileABTxt2 {font-size: 84%; padding: 0 0 0 0;}
.InTileABLineBarCov {display: block; width: 100%; position: relative; height: 0.4rem;}
.InTileABLineBar {display: block; height: 0.3rem; position: absolute; top: 0;}
.InTileABBgBase {background-color: #eeeeee;}
.InTileABBgRed {background-color: var(--red);}
.InTileABBgBlue {background-color: var(--blue);}
.InTileABBgGreen {background-color: var(--green);}
.InTileABBgYellow {background-color: var(--yellow);}
.InTileABBgPurple {background-color: var(--purple);}

.MyPicHdr {position:absolute; background-color:rgba(0, 0, 0, 0.6); bottom:0; left:0; width:fit-content; width:-webkit-fill-available; color:#ffffff;
 text-align:center; text-shadow:-1px 0 #222222, 0 1px #222222, 1px 0 #222222, 0 -1px #222222; font-size:1.12rem; padding:0.5rem; min-height:4rem;
}
.MyPicSub { position:relative; display:block; font-size:0.95rem; padding:0.6rem 0 0.8rem 0; }
.MyBgImg, .ITBgImg  { float:right; clear:both; width:3.0rem; margin:0.7rem 0 0 0.8rem;}

/*
.___myIcon { font-family:"Font Awesome 5 Pro"; }
.___myIcon:before { content:"\f007"; }
.myIcon::before { font-family:"Font Awesome 5 Solid";   content:"\f007"; }
*/

.IfMenuGroupDiv {font-family:var(--skin-font-big); font-weight:500; font-size:1.2rem; color:var(--group-hdr-color); padding:1.2rem 0.375rem 0.1rem 0.375rem; vertical-align:middle;}
.IfMenuGroupDiv span {display:inline-block; line-height:2rem; vertical-align:middle;}
.IfMenuTilesDiv {position:relative;}
.IfMenuTile {height:5rem; margin:0.3rem; position:relative; display:inline-block; vertical-align:top; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; border:var(--skin-border); padding:0.8rem 0.96rem;}
.IfMenuTile:hover {cursor:pointer; background-color:var(--hover-bg) !important;}
.IfMenuTileWrap:before {content:''; display:block; float:right; height:1.36rem;}
.IfClrHdr { display:block; font-size:1.09rem; margin-bottom:0.5rem; color:var(--aux-hdr-color); font-weight:500;}
.IfClrSub { font-size:0.96rem; overflow:hidden; text-overflow:ellipsis; font-weight:200;}
.IfBgIcon  {float:right; clear:both; font-size:1.8rem; margin:0 0 0 0.7rem; color:var(--menu-tile-icon);}

.MyMenuParam {
 position:absolute; z-order:1000; top:0; left:0; border:var(--skin-border); color:var(--skin-text); font-size:1rem;
 background-color:var(--skin-bg); border-radius:3px; -moz-border-radius:3px; -web3kit-border-radius:3px; padding:3px;
}
.MyMenuParam table {}
.MyMenuParam td {padding:0.64rem 0.64rem 0 0.64rem;}
.MyMenuParam td  span {padding:0 0 0 0; vertical-align:middle;}
.MyMenuParam i {color:var(--skin-icon); font-size:1.1rem; vertical-align: middle; padding:0 0.64rem 0 0;}
.MyMenuParam th  {text-align:center; font-size:1.06rem; background-color:var(--light-skin-bg); padding:0.5rem;}
.MyMenuParam td:hover {cursor:pointer; text-shadow:0.02em 0 0 currentColor;}

.MdlMnCover {padding:1.6rem;}   
/* 250x167*/
.MdlMnImg {display:inline-block; background-position:center center; background-repeat:no-repeat; background-size:cover; -moz-background-size:cover; -webkit-background-size:cover; 
 height:7.143rem; width:10.693rem; margin-right:1.6rem;}   
.MdlMnSide { display:inline-block; vertical-align:top; } 
.MdlMnSideHdr {font-family:var(--skin-font-big); font-weight:500; display:block; font-size:1.6rem; margin-bottom:1.3rem; color:var(--group-hdr-color);}
.MdlMnSideBtn { display:block; }
.MdlMnSideBtn button {margin-right:0.3rem; min-height:2.1rem;}
.MdlMnSideInf { display:block; font-size:0.9rem; margin-top:0.7rem;}

.MyMenuTileCnt,.ITMenuTileCnt {display:table-row;}   /*My Menu Tile Content Line*/


/*
@media screen and (max-width:640px) {
.Tile1x1, .Tile2x1, .TileIT1x1 {
  transform: scale(0.9, 0.9);
  -ms-transform: scale(0.9, 0.9);
  -webkit-transform: scale(0.9, 0.9);
  -o-transform: scale(0.9, 0.9);
  -moz-transform: scale(0.9, 0.9);
}   
@media screen and (max-width:640px) {
.Tile1x1 {width:99%;}
.Tile2x1 {width:97%;}
.TileIT1x1 {width:98%;}
.MyClrSub, .IfClrSub {display:none;}
.MyPicSub, .IfPicSub {display:none;}
.MyBgIcon, .IfBgIcon  {top: 0.5rem; left: 0.5rem; position: absolute; font-size:1.3rem; margin:0;}
.MyBgImg  {display:none;}
.MyMenuTile, .IfMenuTile, .ITMenuTile {height:auto; max-height:2.7rem; padding:0.6rem 0.5rem 0.6rem 2.8rem;}
.MyMenuGroupDiv, .IfMenuGroupDiv {padding:0.5rem 0.375rem 0.5rem 0.375rem;}
.MyClrHdr, .IfClrHdr {overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.MyPicHdr {position:relative; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; background-color:transparent; text-shadow:-1px 0 #222222, 0 1px #222222, 1px 0 #222222, 0 -1px #222222; padding:0;}
#MyToolsGrupDiv { display:block !important;}
#MyToolsTilesDiv { display:block !important;}
.MdlMnCover { padding:0.5rem; }   
.MdlMnImg {display:none;}
.MyMenuContainer {padding:0 1.5% 10% 1.5%;}
.MdlMnSideHdr {font-size:1.4rem;}
#ModulMenuCover {padding:0px;}
.MyMenuTileCnt {display:none;}
}
@media screen and (min-width:641px) and (max-width:1024px) {
.Tile1x1 {max-width:30rem; width:99%;}
.Tile2x1 {max-width:30rem; width:99%;}
.MyBgImg  {display:none;}
.MyMenuGroupDiv, .IfMenuGroupDiv {padding:0.55rem 0.375rem 0.55rem 0.375rem;}
.MyClrHdr, .IfClrHdr {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width: 11rem; }
.MyPicHdr {position:relative; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; background-color:transparent; text-shadow:-1px 0 #222222, 0 1px #222222, 1px 0 #222222, 0 -1px #222222; padding:0;}
}
*/

@media screen and (max-width:640px) {
 .TileIT1x1, .TileIT2x1  {
  transform: scale(0.86); 
  -ms-transform: scale(0.86); 
  -webkit-transform: scale(0.86); 
  -o-transform: scale(0.86); 
  -moz-transform: scale(0.86); 
  margin: -3%; 
 }   
 .Tile1x1 {width:99%;}
 .Tile2x1 {width:97%;}
 .MyClrSub, .IfClrSub {display:none;}
 .MyPicSub, .IfPicSub {display:none;}
 .MyBgIcon, .IfBgIcon  {top: 0.5rem; left: 0.5rem; position: absolute; font-size:1.3rem; margin:0;}
 .MyBgImg  {display:none;}
 .MyMenuTile, .IfMenuTile, .___ITMenuTile {height:auto; max-height:2.7rem; padding:0.6rem 0.5rem 0.6rem 2.8rem;}
 .MyMenuGroupDiv, .IfMenuGroupDiv {padding:0.5rem 0.375rem 0.5rem 0.375rem;}
 .MyClrHdr, .IfClrHdr {overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
 .___MyPicHdr {position:relative; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; background-color:transparent; text-shadow:-1px 0 #222222, 0 1px #222222, 1px 0 #222222, 0 -1px #222222; padding:0;}
 #MyToolsGrupDiv { display:block !important;}
 #MyToolsTilesDiv { display:block !important;}
 .MdlMnCover { padding:0.5rem; }   
 .MdlMnImg {display:none;}
 .MyMenuContainer {padding:0 2% 10% 1%;}
 .MdlMnSideHdr {font-size:1.4rem;}
 #ModulMenuCover {padding:0px;}
 .MyMenuTileCnt {display:none;}
}

@media screen and (min-width:641px) and (max-width:1024px) {
 .Tile1x1 {max-width:30rem; width:99%;}
 .Tile2x1 {max-width:30rem; width:99%;}
 .MyBgImg  {display:none;}
 .MyMenuGroupDiv, .IfMenuGroupDiv {padding:0.55rem 0.375rem 0.55rem 0.375rem;}
 .MyClrHdr, .IfClrHdr {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; __max-width: 11rem; }
 .MyPicHdr {position:relative; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; background-color:transparent; text-shadow:-1px 0 #222222, 0 1px #222222, 1px 0 #222222, 0 -1px #222222; padding:0;}
}


