@font-face { font-family: Century; src: url('GOTHIC.ttf'); }


 .title {
  font-family: Arial;
  font-size: 24px;
  color:#FFF;
  position: fixed;
  top: 30px;
  left: 20px
}


 .itemtext {
  color:#FFF;
  font-family: Arial;

  font-size: 12px;
  position: relative;
  text-align:center;
  bottom:20px;
}

 .grayimage {
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
  filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */
 }

 .itemimage {
  text-align: center;
  vertical-align:middle;
  width:100%;
  height:100%;
  position: relative;




  opacity: 1;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  /* -webkit-user-select: none; */
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  /* user-select: none; */
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.8);
  -moz-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.8);
  -ms-box-shadow: 2px 4px 5px rgba(0, 0, 0, 0.8);
  -o-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.8);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.8);
  -webkit-transform: rotateY(0deg);
  -moz-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  -o-transform: rotateY(0deg);
  transform: rotateY(0deg);
}



.menu-img {
	top	:0;
	left:0;
	right:0;
	bottom:0;
	position:absolute;
	margin:auto;
	cursor: pointer;
	}




.maingroup{
  position: absolute;
  top: 5px;
  height:auto;
  min-width:800px;
  margin-left:5px;

}

.subgroup{
	float:left;
    width:204px;
    padding:0px;
	margin-right:5px;
    height:auto;
    display:table;
}

.tile{
    height:48px;
    width:48px;
    float:left;
    margin : 2px;
}
.tileMidium{
    width :100px;
    height:100px;
	cursor: pointer;
}

.tileLarge{
    width:204px;
    height:100px;
	cursor: pointer;
}

.tileXLarge{
	height:204px;
	width:204px;
	cursor: pointer;
}
.LightGreen{
    background:#99b433;
}

.Green{
    background:#6FA014; /*#656565; gray scale*/
}

.DarkGreen{
    background:#1e7145;
}

.Magenta{
    background:#BE213E;
}

.LightPurple{
    background:#9f00a7;
}

.Purple{
    background:#7e3878;
}

.DarkPurple{
    background:#603cba;
}

.Darken{
    background:#1d1d1d;
}

.Teal{
    background:#00aba9;
}

.LightBlue{
    background:#eff4ff;
}

.Blue{
    background:#2d89ef;
}

.DarkBlue{
    background:#2b5797;
}

.Yellow{
    background:#F29500;
}

.Orange{
    background:#e3a21a;
}

.DarkOrange{
    background:#da532c;
}

.Red{
    background:#ee1111;
}

.DarkRed{
    background:#b91d47;
}
.While{
    background:#ffffff;
}


.GrayScale{
    background:#656565; /*#656565; gray scale*/
}


.selection{
/*
	border-style : solid;
	border-width : 2px;
	border-color : #80bceb;
	margin : 2px;
  */

  -webkit-filter: grayscale(0);
  filter: none;

  z-index: 5;
   border: 0px solid rgba(255, 255, 255, 0.4);
   -webkit-transform: scale(1.04);
      -moz-transform: scale(1.04);
       -ms-transform: scale(1.04);
        -o-transform: scale(1.04);
           transform: scale(1.04);

}