#fade, #faderoll, #fadesqueeze, #fadeturn, #fadeshake, #fadepeelafter, #fadewipe, #fadegrasptap, #fadetap {
  display: none;
  position: fixed;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  background-color: black;
  z-index: 1001;
  -moz-opacity: 0.8;
  opacity: .80;
  filter: alpha(opacity=80);
}

#light, #lightroll, #lightsqueeze, #lightturn, #lightshake, #lightpeelafter, #lightwipe, #lightgrasptap, #lighttap{
  display: none;
  position: absolute;
  top: 5%; 
  left: 16%; 
  max-width: 800px;
  max-height: 450px;
  /*margin-left: -300px;
  margin-top: -180px;*/
  /*border: 2px solid #FFF;*/
  background: #FFF;
  z-index: 1002;
  overflow: visible;
}

#boxclose, #boxcloseroll, #boxclosesqueeze, #boxcloseturn, #boxcloseshake, #boxclosepeelafter, #boxclosewipe, #boxclosegrasptap, #boxclosetap {
  float: right;
  cursor: -moz-zoom-out;
  cursor: -webkit-zoom-out;
  cursor: zoom-out; 
  color: #fff;

}

#fade:hover ~ #boxclose {
  display:none;
}

.test:hover ~ .test2 {
  display: none;
}

/*EXTRA*/
#fadegrasptap:hover ~ #boxclosegrasptap{
  display:none;
}

#fadetap:hover ~ #boxclosetap{
  display:none;
}

#faderoll:hover ~ #boxcloseroll{
  display:none;
}

#fadesqueeze:hover ~ #boxclosesqueeze{
  display:none;
}

#fadeturn:hover ~ #boxcloseturn{
  display:none;
}

#fadeshake:hover ~ #boxcloseshake{
  display:none;
}

#fadepeelafter:hover ~ #boxclosepeelafter{
  display:none;
}

#fadewipe:hover ~ #boxclosewipe{
  display:none;
}


	@media only screen and (min-width: 480px) and (max-width: 767px) {
		#light, #lightroll, #lightsqueeze, #lightturn, #lightshake, #lightpeelafter, #lightwipe, #lightgrasptap, #lighttap{
		  display: none;
		  position: absolute;
		  top: 0%; 
		  left: 5%; 
		  width: 400px;
		  height: 225px;
		  /*margin-left: -300px;
		  margin-top: -180px;*/
		  /*border: 2px solid #FFF;*/
		  background: #FFF;
		  z-index: 1002;
		  overflow: visible;
		}
	}
	@media only screen and (max-width: 767px) {
		#light, #lightroll, #lightsqueeze, #lightturn, #lightshake, #lightpeelafter, #lightwipe, #lightgrasptap, #lighttap{
		  display: none;
		  position: absolute;
		  top: 10%; 
		  left: 5%; 
		  width: 90%;
		  /*margin-left: -300px;
		  margin-top: -180px;*/
		  /*border: 2px solid #FFF;*/
		  background: #FFF;
		  z-index: 1002;
		  overflow: visible;
		}
	}
