@charset "utf-8";
/* CSS Document */
@keyframes mousewheel {
	0% { bottom: 22px; background-color: #000;}
	50% { bottom: 27px; background-color: #f00;}
	100% { bottom: 22px; background-color: #000;}
}
@-webkit-keyframes mousewheel {
	0% { bottom: 22px; background-color: #000;}
	50% { bottom: 27px; background-color: #f00;}
	100% { bottom: 22px; background-color: #000;}
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	text-decoration: none;
	-webkit-transition:all .7s;
	-moz-transition:all .7s;
	transition:	all .7s;
}
html{
	height:100%;
}
body{
	height:100%;
	font-family: 'Roboto', sans-serif;
	font-size:16px;
	font-weight:300;
	color:#333333;
	background-color: #fff;
	text-align:left;
}
a{
	color:#ff6600;
	text-decoration:none;
	-webkit-transition:all .7s;
	-moz-transition:all .7s;
	transition:	all .7s;
}
a:hover{color:#000;}
.s9{height:9px;}
.s18{height:18px;}
.s27{height:27px;}
.s36{height:36px;}
.s45{height:45px;}
.s60{height:60px;}
.s90{height:90px;}
.clr{clear:both;}
.center{ text-align:center;}
.right{ text-align:right;}
.left{ text-align:left;}
.justify{ text-align:justify;}
.table{display:table;}
.row{display:table-row;}
.cell{display:table-cell;}
.hide{display: none;}
.show{display: block;}
h1{
	font-size:36px;
	line-height: 42px;
	font-weight:300;
	text-align: center;
	color: #19B2FF;
	text-transform:uppercase;
}
h2{
	font-size:60px;
	line-height: 48px;
	font-weight:100;
}
h3{
	font-size:30px;
	font-weight:300;
}
.contener{
  overflow-x: hidden;
  display: flex;
  height: 100%;
}
.section {
  min-width: 1600px;
  height: 100%;
  overflow: hidden;
}

.room{
	position: relative;
	width: 100%;
	height: 100%;
	background-position: center;
}
.section:nth-child(5n+1) .room{
	background-image: url(../images/wall1.jpg);
}
.section:nth-child(5n+2) .room{
	background-image: url(../images/wall2.jpg);
}
.section:nth-child(5n+3) .room{
	background-image: url(../images/wall1.jpg);
}
.section:nth-child(5n+4) .room{
	background-image: url(../images/wall4.jpg);
}
.section:nth-child(5n+5) .room{
	background-image: url(../images/wall5.jpg);
}
.logo, .roomend, .mainshadow, .floor, .content, .partition, .partitionstart, .partitionend, .plantleft, .plantright, .hanging, .furniture{
	position: absolute;
	height: 100%;
	width: 100%;
	left: 0;
	top: 0;
}
.logo{
	top: 45px;
	left: 98px;
}
.roomend{
	width: 5px;
	left: auto;
	right: 0;
	background: linear-gradient(270deg, rgba(0, 0, 0, 0.54) 0%, rgba(0, 0, 0, 0.18) 100%);
}
.partition{
	background-image: url(../images/partitionlines.png), url(../images/partition1.png);
}
.section:nth-child(5n+1) .room .partition{
	width: 450px;
}
.section:nth-child(5n+2) .room .partition{
	width: 132px;
}
.section:nth-child(5n+3) .room .partition{
	width: 1600px;
}
.section:nth-child(5n+4) .room .partition{
	width: 132px;
}
.section:nth-child(5n+5) .room .partition{
	width: 450px;
}
.partitionstart{
	width: 100px;
}
.section:nth-child(5n+1) .room .partitionstart{
	left: 450px;
	background: linear-gradient(90deg, #482612 -7.25%, rgba(72, 38, 18, 0.47) 6.7%, rgba(194, 150, 97, 0.00) 100%);
}
.section:nth-child(5n+2) .room .partitionstart{
	left: 132px;
	background: linear-gradient(90deg, rgba(26, 26, 26, 0.36) -7.25%, rgba(113, 113, 113, 0.00) 100%);
}
.section:nth-child(5n+4) .room .partitionstart{
	left: 132px;
	background: linear-gradient(90deg, rgba(0, 0, 0, 0.27) -7.25%, rgba(122, 185, 199, 0.00) 100%);
}
.section:nth-child(5n+5) .room .partitionstart{
	left: 450px;
	background: linear-gradient(90deg, rgba(26, 26, 26, 0.36) -7.25%, rgba(113, 113, 113, 0.00) 100%);
}
.partitionend{
	width: 100px;
	left: auto;
	right: 5px;
}
.section:nth-child(5n+1) .room .partitionend{
	background: linear-gradient(90deg, rgba(194, 150, 97, 0.00) -7.25%, rgba(170, 61, 0, 0.27) 100%);
}
.section:nth-child(5n+2) .room .partitionend{
	background: linear-gradient(90deg, rgba(124, 124, 124, 0.00) -7.25%, rgba(0, 0, 0, 0.27) 100%);
}
.section:nth-child(5n+4) .room .partitionend{
	background: linear-gradient(90deg, rgba(122, 185, 199, 0.00) -7.25%, rgba(76, 150, 167, 0.27) 100%);
}
.section:nth-child(5n+5) .room .partitionend{
	background: linear-gradient(90deg, rgba(124, 124, 124, 0.00) -7.25%, rgba(0, 0, 0, 0.27) 100%);
}
.mainshadow{
	background: linear-gradient(84deg, rgba(0, 0, 0, 0.36) 0%, rgba(255, 255, 255, 0.45) 100%);
	mix-blend-mode: overlay;
}
.floor{
	height: 90px;
	top: auto;
	bottom: 0;
	background-color: #E4E3E1;
}
.plantleft, .plantright{
	width: 203px;
	height: 323px;
	top: auto;
	bottom: 20px;
	left: -53px;
}
.plantright{
	left: auto;
	right: -150px;
}
.section:nth-child(5n+1) .room .plantleft, .section:nth-child(5n+5) .room .plantright, .section:nth-child(5n+4) .room .plantleft, .section:nth-child(5n+3) .room .plantright{
	background-image: url(../images/plant1.png);
}
.section:nth-child(5n+2) .room .plantleft, .section:nth-child(5n+1) .room .plantright{
	width: 246px;
	height: 293px;
	left: -100px;
	bottom: 30px;
	background-image: url(../images/plant2.png);
}
.section:nth-child(5n+1) .room .plantright{
	left: auto;
	right: -146px;
}
.section:nth-child(5n+3) .room .plantleft, .section:nth-child(5n+2) .room .plantright, .section:nth-child(5n+5) .room .plantleft, .section:nth-child(5n+4) .room .plantright{
	width: 229px;
	height: 278px;
	left: -90px;
	bottom: 30px;
	background-image: url(../images/plant3.png);
}
.section:nth-child(5n+2) .room .plantright, .section:nth-child(5n+4) .room .plantright{
	left: auto;
	right: -139px;
}
.hanging{
	background-repeat: no-repeat;
}
.section:nth-child(5n+1) .room .hanging{
	background-image: url(../images/plant4.png);
	background-position: right 0;
}
.section:nth-child(5n+2) .room .hanging{
	background-image: url(../images/plant4.png);
	background-position: right 0;
}
.section:nth-child(5n+3) .room .hanging{
	background-image: url(../images/plant4.png);
	background-position: 150px 0;
}
.section:nth-child(5n+4) .room .hanging{
	background-image: url(../images/plant4.png);
	background-position: right 0;
}
.section:nth-child(5n+5) .room .hanging{
	background-image: url(../images/plant4.png);
	background-position: right 0;
}
.furniture{
	background-repeat: no-repeat;
}
.section:nth-child(5n+1) .room .furniture{
	background-image: url(../images/furniture2.png);
	background-position: 700px bottom;
}
.section:nth-child(5n+2) .room .furniture{
	background-image: url(../images/furniture3.png);
	background-position: 810px bottom;
}
.section:nth-child(5n+3) .room .furniture{
	background-image: url(../images/furniture1.png);
	background-position: 150px bottom;
}
.section:nth-child(5n+4) .room .furniture{
	background-image: url(../images/furniture4.png), url(../images/furniture6.png);
	background-position: 1200px bottom, 800px bottom;
}
.section:nth-child(5n+5) .room .furniture{
	background-image: url(../images/furniture5.png);
	background-position: 1050px bottom;
}
.content{
	width: 50%;
	height: auto;
	right: 0;
	top: 10%;
	margin: 0 auto;
}
.frame{
	position: absolute;
}
.frame img{
	border: 1px solid rgba(0, 0, 0, .5);
	width: 360px;
	height: auto;
	box-shadow: 0 9px 18px rgba(0, 0, 0, .5);
	display: block;
}
.detailsbox{
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 118px;
	overflow: hidden;
}
.details{
	position: absolute;
	width: calc(100% - 54px);
	height: 100px;
	padding: 100px 27px 0;
	bottom: -200px;
	background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
	color: #fff;
	font-size: 18px;
}
.frame:hover .details{
	bottom: 0;
	padding: 12px 27px 0;
}
.section:nth-child(5n+1) .room .frame{
	top: 10%;
	left: 45px;
}
.section:nth-child(5n+2) .room .frame{
	top: 10%;
	left: 430px;
}
.section:nth-child(5n+3) .room .frame{
	top: 10%;
	left: 1050px;
}
.section:nth-child(5n+4) .room .frame{
	top: 10%;
	left: 430px;
}
.section:nth-child(5n+5) .room .frame{
	top: 10%;
	left: 600px;
}
.price{
	position: absolute;
	width: 100px;
	padding: 22px 0 9px 18px;
	top: 10%;
	right: -130px;
	background: linear-gradient(to right,  #ecc769 0%,#ff8e26 100%); 
	border-radius: 5px 12px 12px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .27);
	font-size: 14px;
	font-weight: 500;
	color: #904805;
}
.price b{
	font-size: 22px;
	font-weight: 700;
	color: #904805;
}
.price::before {
	position: absolute;
	left: -9px;
	top: 15px;
	width: 9px;
	height: 18px;
  content: "";
  background-image: url(../images/pricearrow.png);
}
.price .mrp{
	position: absolute;
	left: 18px;
	top: 9px;
  content: "₹";
  font-size: 12px;
	font-weight: 400;
	color: #545454;
	text-decoration: line-through;
}
.mouseani{
	position: absolute;
	max-width: 300px;
	left: 550px;
	bottom: 180px;
	padding: 60px 0 0;
	text-align: center;
	background-image: url(../images/arrow.png);
	background-repeat: no-repeat;
	background-position: center 22px;
	font-size: 12px;
}
.mouse, .mousewheel{
	position: absolute;
	width: 30px;
	height: 48px;
	left: 0;
	right: 0;
	top: 0;
	margin: 0 auto;
	border-radius: 27px;
	border: 2px solid #000;
}
.mousewheel{
	top: auto;
	width: 6px;
	height: 16px;
	border-radius: 5px;
	border: none;
	animation: mousewheel 1s linear infinite;
	-webkit-animation: mousewheel 1s linear infinite;
}


@media screen and (max-width: 800px) {
	.contener{
	  overflow-x:auto;
	}
}

@media screen and (max-height: 630px) {
	.floor{
		height: 60px;
	}
	.section:nth-child(5n+1) .room .furniture{
		background-size: 40%;
	}
	.section:nth-child(5n+2) .room .furniture{
		background-size: 40%;
	}
	.section:nth-child(5n+3) .room .furniture{
		background-size: 40%;
	}
	.section:nth-child(5n+4) .room .furniture{
		background-size: 40% , 20%;
	}
	.section:nth-child(5n+5) .room .furniture{
		background-size: 40%;
	}
}