.bandlien
{
   position : fixed;
   opacity: 0.9;
   position : absolute;
}

ul.img-listcmd {
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-align: center;
}
 
ul.img-listcmd li {
  display: inline-block;
  height: 270px;
  margin: 0 1em 1em 0;
  position: relative;
  width: 290px;
}
span.text-contentcmd {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 270px;
  left: 0;
  position: absolute;
  top: 0;
  width: 290px;
}
 
span.text-contentcmd span {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
span.text-contentcmd {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 270px;
  left: 0;
  position: absolute;
  top: 0;
  width: 290px;
  opacity: 0;
}
 
ul.img-listcmd li:hover span.text-contentcmd {
  opacity: 1;
}
span.text-contentcmd {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 270px;
  left: 0;
  position: absolute;
  top: 0;
  width: 290px;
  opacity: 0;
  -webkit-transition: opacity 500ms;
  -moz-transition: opacity 500ms;
  -o-transition: opacity 500ms;
  transition: opacity 500ms;
}



ul.img-listhtml li:hover span.text-contenthtml {
  opacity: 1;
}
span.text-contenthtml {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 270px;
  left: 0;
  position: absolute;
  top: 0;
  width: 400px;
  opacity: 0;
  -webkit-transition: opacity 500ms;
  -moz-transition: opacity 500ms;
  -o-transition: opacity 500ms;
  transition: opacity 500ms;
}

ul.img-listhtml {
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-align: center;
}
 
ul.img-listhtml li {
  display: inline-block;
  height: 270px;
  margin: 0 1em 1em 0;
  position: relative;
  width: 400px;
}
span.text-contenthtml {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 270px;
  left: 0;
  position: absolute;
  top: 0;
  width: 400px;
}
 
span.text-contenthtml span {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
span.text-contenthtml {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 270px;
  left: 0;
  position: absolute;
  top: 0;
  width: 400px;
  opacity: 0;
}




ul.img-listjs li:hover span.text-contentjs {
  opacity: 1;
}
span.text-contentjs {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 270px;
  left: 0;
  position: absolute;
  top: 0;
  width: 400px;
  opacity: 0;
  -webkit-transition: opacity 500ms;
  -moz-transition: opacity 500ms;
  -o-transition: opacity 500ms;
  transition: opacity 500ms;
}

ul.img-listjs {
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-align: center;
}
 
ul.img-listjs li {
  display: inline-block;
  height: 270px;
  margin: 0 1em 1em 0;
  position: relative;
  width: 400px;
}
span.text-contentjs {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 270px;
  left: 0;
  position: absolute;
  top: 0;
  width: 400px;
}
 
span.text-contentjs span {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
span.text-contentjs {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 270px;
  left: 0;
  position: absolute;
  top: 0;
  width: 400px;
  opacity: 0;
}
 
ul.img-listjs li:hover span.text-contentjs {
  opacity: 1;
}
span.text-contentjs {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 270px;
  left: 0;
  position: absolute;
  top: 0;
  width: 400px;
  opacity: 0;
  -webkit-transition: opacity 500ms;
  -moz-transition: opacity 500ms;
  -o-transition: opacity 500ms;
  transition: opacity 500ms;
}




.bandlien
{
   position : fixed;
   opacity: 0.9;
   position : absolute;
   z-index: 70;
}




ul.img-listchat li:hover span.text-contentchat {
  opacity: 1;
}
span.text-contentchat {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 400px;
  left: 0;
  position: absolute;
  top: 0;
  width: 400px;
  opacity: 0;
  -webkit-transition: opacity 500ms;
  -moz-transition: opacity 500ms;
  -o-transition: opacity 500ms;
  transition: opacity 500ms;
}

ul.img-listchat {
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-align: center;
}
 
ul.img-listchat li {
  display: inline-block;
  height: 400px;
  margin: 0 1em 1em 0;
  position: relative;
  width: 400px;
}
span.text-contentchat {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 400px;
  left: 0;
  position: absolute;
  top: 0;
  width: 400px;
}
 
span.text-contentchat span {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
span.text-contentchat {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 400px;
  left: 0;
  position: absolute;
  top: 0;
  width: 400px;
  opacity: 0;
}
 
ul.img-listchat li:hover span.text-contentchat {
  opacity: 1;
}
span.text-contentchat {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: table;
  height: 400px;
  left: 0;
  position: absolute;
  top: 0;
  width: 400px;
  opacity: 0;
  -webkit-transition: opacity 500ms;
  -moz-transition: opacity 500ms;
  -o-transition: opacity 500ms;
  transition: opacity 500ms;
}