@charset "UTF-8";
/* CSS Document */

a {transition: background-image 1s ease-in-out;}

a.cinemas:hover{background: #333 !important; color: #fff !important;}

@media screen and (min-width: 900px) {
	
    .room{
	background: url(../images/home/home-bg.jpg) no-repeat center top;
	height: 860px;
	position:relative;
	}
	
	#bcandme{
	position: absolute;
	bottom: 20px;
	right: 5%;
	width: 250px;
	height: 250px;
	background:url(../images/home/bcandme-bg.png) no-repeat;
	z-index: 1000;
	}
.fade {
   opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
   }

   .fade:hover {
      opacity: 0.5;
      }
	
	
	
	#sig{
	position: absolute;
	top: 10px;
	left: 27%;
	width: 185px;
	height: 106px;
	background:url(../images/home/sig.png) no-repeat;
	z-index: 10;
	}
	
	#mirror{
	position: absolute;
	top: 210px;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	width: 250px;
	height: 196px;
	z-index: 6;
	}
	
	#mirror a{display: block; background: url(../images/home/tour.png) no-repeat; height: 236px; width: 249px; }
	#mirror a:hover{background: url(../images/home/tour-hover.png) no-repeat;}

	
	#desk{
	position: absolute;
	bottom: 7%;
	left: 32%;
	width: 614px;
	height: 491px;
	background:url(../images/home/desk.png) no-repeat;
	z-index: 2;
	}
	
	#desk a{display: block; background: url(../images/home/film-tv.png) no-repeat; height: 151px; width: 202px; float: right; margin: 20px 40px 0 0; }
	#desk a:hover{background: url(../images/home/film-tv-hover.png) no-repeat;}
	
	#billy{
	position: absolute;
	bottom: 0;
	left: 3%;
	width: 469px;
	height: 504px;
	background:url(../images/home/billy-connolly.png) no-repeat;
	z-index: 10;
	}
	
	#billy a{display: block; background: url(../images/home/blog.png) no-repeat; height: 72px; width: 140px; margin: 210px 0 0 325px; }
	#billy a:hover{background: url(../images/home/blog-hover.png) no-repeat;}
	
	#books{
	position: absolute;
	top: 230px;
	left: 2%;
	width: 305px;
	height: 128px;
	background:url(../images/home/books.png) no-repeat;
	z-index: 9;
	}
	
	#books a{display: block; background: url(../images/home/store.png) no-repeat; height: 128px; width: 305px; }
	#books a:hover{background: url(../images/home/store-hover.png) no-repeat;}
	
	#case{
	position: absolute;
	bottom: 15px;
	left: 45%;
	width: 212px;
	height: 200px;
	background:url(../images/home/case.png) no-repeat;
	z-index: 8;
	}
	
	#case a{display: block; background: url(../images/home/latest.png) no-repeat; height: 111px; width: 162px; margin: 45px 50px 0 0; }
	#case a:hover{background: url(../images/home/latest-hover.png) no-repeat;}
	
	#table{
	position: absolute;
	bottom: -30px;
	right: 2%;
	width: 371px;
	height: 410px;
	background:url(../images/home/table.png) no-repeat;
	z-index: 7;
	}
	
	#table a{display: block; background: url(../images/home/news.png) no-repeat; height: 80px; width: 217px; margin: 0 0 0 154px; }
	#table a:hover{background: url(../images/home/news-hover.png) no-repeat;}	
	
	#tv{
	position: absolute;
	top: 280px;
	right: 18%;
	width: 219px;
	height: 192px;
	background:url(../images/tv.png) no-repeat;
	z-index: 12;
	}
	
	
#picture{
	position: absolute;
	top: 160px;
	right: 2%;
	width: 160px;
	height: 162px;
	background:url(../images/home/picture.png) no-repeat;
	z-index: 1;
	}
	
	#picture a{display: block; background: url(../images/home/photos.png) no-repeat; height: 162px; width: 160px; }
	#picture a:hover{background: url(../images/home/photos-hover.png) no-repeat;}


/*		#picture{
	position: absolute;
	top: 170px;
	left: 75%;
	width: 120px;
	height: 122px;
	background:url(../images/home/picture2.png) no-repeat;
	z-index: 1;
	}
	
	#picture a{display: block; background: url(../images/home/photos2.png) no-repeat; height: 122px; width: 120px; }
	#picture a:hover{background: url(../images/home/photos2-hover.png) no-repeat;}
*/


	#callout{
	position: absolute;
	top: 190px;
	left: 86%;
	width: 120px;
	height: 122px;
	background:url(../images/home/callout.png) no-repeat;
	z-index: 1;
	}
	
	#callout a{display: block; background: url(../images/home/callout-text1.png) no-repeat; height: 122px; width: 120px; }
	#callout a:hover{background: url(../images/home/callout-text2.png) no-repeat;}
	
}

@media screen and (max-width: 1100px) {
	#case{
	bottom: 15px;
	left: 48%;
	}
	#billy{
	bottom: 0;
	left: 4%;
	}
	#tv{
	top: 280px;
	right: 15%;
	}
	#sig{
	top: 20px;
	left: 21%;
	}
}

@media screen and (max-width: 970px) {
	#case{
	bottom: 15px;
	left: 48%;
	}
	#tv{
	top: 280px;
	right: 13%;
	}
	#books{
	position: absolute;
	top: 230px;
	left: -1%;
	}
	#billy{
	bottom: 0;
	left: 1%;
	}
	#bcandme{
	position: absolute;
	bottom: 20px;
	right: 5%;
	width: 175px;
	height: 175px;
	background:url(../images/home/bcandme-bg.png) no-repeat;
	background-size: contain;
	z-index: 1000;
	}
}

@media screen and (max-width: 899px) {
	.room{
	background: url(../images/home/home-bg900.jpg) no-repeat center top;
	height: 645px;
	position:relative;
	}
	
	#desk{
	position: absolute;
	bottom: 7%;
	left: 34%;
	width: 461px;
	height: 369px;
	background:url(../images/home/desk2.png) no-repeat;
	z-index: 2;
	}
	
	
	#desk a{display: block; background: url(../images/home/film-tv2.png) no-repeat; height:101px; width: 132px; float: right; margin: 20px 40px 0 0; }
	#desk a:hover{background: url(../images/home/film-tv2-hover.png) no-repeat;}
	
	#sig{
	position: absolute;
	top: 10px;
	left: 26%;
	width: 185px;
	height: 106px;
	background:url(../images/home/sig2.png) no-repeat;
	z-index: 10;
	}
	#billy{
	position: absolute;
	bottom: 0;
	left: 5%;
	width: 352px;
	height: 378px;
	background:url(../images/home/billy-connolly2.png) no-repeat;
	z-index: 10;
	}
	
	#billy a{display: block; background: url(../images/home/blog2.png) no-repeat; height: 90px; width: 305px; margin: 150px 0 0 240px; }
	#billy a:hover{background: url(../images/home/blog2-hover.png) no-repeat;}
	
	#books{
	position: absolute;
	top: 170px;
	left: 2%;
	width: 267px;
	height: 120px;
	background:url(../images/home/books2.png) no-repeat;
	z-index: 9;
	}
	
	#books a{display: block; background: url(../images/home/store2.png) no-repeat; height: 90px; width: 305px; }
	#books a:hover{background: url(../images/home/store2-hover.png) no-repeat;}
	
	#case{
	position: absolute;
	bottom: 4%;
	left: 48%;
	width: 160px;
	height: 151px;
	background:url(../images/home/case2.png) no-repeat;
	z-index: 8;
	}
	
	#case a{display: block; background: url(../images/home/latest2.png) no-repeat; height: 78px; width: 111px; margin: 40px 0 0 8px; }
	#case a:hover{background: url(../images/home/latest2-hover.png) no-repeat;}
	
	#table{
	position: absolute;
	bottom: -30px;
	right: 3%;
	width: 278px;
	height: 307px;
	background:url(../images/home/table2.png) no-repeat;
	z-index: 7;
	}
	
	#table a{display: block; background: url(../images/home/news2.png) no-repeat; height: 61px; width: 163px; margin: 0 0 0 116px; }
	#table a:hover{background: url(../images/home/news2-hover.png) no-repeat;}	
	
	#mirror{
	position: absolute;
	top: 145px;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	width: 185px;
	height: 175px;
	/* background:url(../images/home/mirror2.jpg) no-repeat; */
	z-index: 10;
	}
	
	#mirror a{display: block; background: url(../images/home/tour2.png) no-repeat; height: 185px; width: 175px; }
	#mirror a:hover{background: url(../images/home/tour2-hover.png) no-repeat;}
	
	#tv{
	position: absolute;
	top: 210px;
	right: 18%;
	width: 164px;
	height: 144px;
	background:url(../images/tv2.png) no-repeat;
	z-index: 8;
	}
	#picture{
	position: absolute;
	top: 105px;
	right:7%;
	width: 120px;
	height: 122px;
	background:url(../images/home/picture2.png) no-repeat;
	z-index: 1;
	}
	
	#picture a{display: block; background: url(../images/home/photos2.png) no-repeat; height: 122px; width: 120px; }
	#picture a:hover{background: url(../images/home/photos2-hover.png) no-repeat;}
	
	#callout{
	position: absolute;
	top: 140px;
	left: 86%;
	width: 120px;
	height: 122px;
	background:url(../images/home/callout.png) no-repeat;
	z-index: 15;
	}
	
	#callout a{display: block; background: url(../images/home/callout-text1.png) no-repeat; height: 122px; width: 120px; }
	#callout a:hover{background: url(../images/home/callout-text2.png) no-repeat;}
	
}

@media screen and (max-width: 768px) {
	.room{display: none;}
}