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



/*__________deals_of_project_grid_end______________*/

.grid-container {
	display: grid;
	  grid-template-columns: auto auto auto auto auto auto;
	  grid-template-rows: auto auto auto auto auto auto;
	  grid-gap: 15px;
	  margin-top:5em;
  }
  
  .grid-container > div {
	background-color: rgba(255, 255, 255, 0.8);
	text-align: center;
	font-size: 30px;
  }
	  
  .item1 { 
	  grid-column-start: 1;
	  grid-column-end: 3;
	  grid-row-start: 1;
	  grid-row-end: 3;
	  transition:ease-in all 0.3s;
	  }
  .item2 { 
	  grid-column-start: 3;
	  grid-column-end: 4;
	  grid-row-start: 1;
	  grid-row-end: 4;
	  }
  .item3 {  
	  grid-column-start: 1;
	  grid-column-end: 3;
	  grid-row-start: 3;
	  grid-row-end: 6;
	      height:602px;	
	  }
  .item4 { 
	  grid-column-start: 3;
	  grid-column-end: 7;
	  grid-row-start: 4;
	  grid-row-end: 6;	
	      height: 450px;
	  }
  .item5 { 
	  grid-column-start: 4;
	  grid-column-end: 7;
	  grid-row-start: 1;
	  grid-row-end: 4;
	  }
  .grid-container img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block; 
  }



/*grid-end*/

.box-11{
	background-color: transparent;
    border-left: 10px solid rgb(255 255 255);
    border-bottom: 10px solid rgb(255 255 255);
    border-right: 10px solid rgb(255 255 255);
    height:80px;
    width: 50%;
    position: relative;
    z-index: 1;
    opacity: 1;
    top: -7em;
    left: 30%;
	transition:ease-in all 0.3s;
	}
.item1:hover .box-11{
	opacity:0;
	}	
	
.elleys{
	font-size:60px;
	position:relative;
	color: #FFFFFF;
    top: -22px;
    transition: ease-in all 0.3s;
    left: -11px;}	
.box-12{
	background-color: transparent;
    border-left: 10px solid rgba(255,255,255,1.00);
    border-bottom: 10px solid rgba(255,255,255,1.00);
    border-right: 10px solid rgba(255,255,255,1.00);
    height: 111px;
    width: 77%;
    position: relative;
    z-index: 1;
    opacity: 1;
    top: -9em;
    left: 12%;
	transition:ease-in all 0.3s;
	}
.item2:hover .box-12{
	opacity:0;
	}	
	
.fan-1{
	font-size:60px;
	position:relative;
	    color:#ffffff;
    top: -3px;
	transition:ease-in all 0.3s;}	

.box-13{
	background-color: transparent;
    border-top: 10px solid rgba(255,255,255,1.00);
    border-bottom: 10px solid rgba(255,255,255,1.00);
    border-right: 10px solid rgba(255,255,255,1.00);
    height: 111px;
    width: 77%;
    position: relative;
    z-index: 1;
    opacity: 1;
    top: -9em;
    left: 12%;
	transition:ease-in all 0.3s;
	}
.item5:hover .box-13{
	opacity:0;
	}	
	
.light{
	font-size:60px;
	position:relative;
	    color:#ffffff;
    top: -3px;
	transition:ease-in all 0.3s;}
	
.box-14{
	background-color: transparent;
    border-left: 10px solid rgb(0 0 0);
    border-bottom: 10px solid rgb(0 0 0);
    border-top: 10px solid rgb(0 0 0);
    height:200px;
    width: 50%;
    position: relative;
    z-index: 1;
    opacity: 1;
        top: -11em;
    left: 30%;
	transition:ease-in all 0.3s;
	}
.item3:hover .box-14{
	opacity:0;
	}	
	
.ceiling{
	font-size:60px;
	position:relative;
	    color: #db2a21;
    top: -7px;
	transition:ease-in all 0.3s;}
	
.box-15{
	background-color: transparent;
    border-top: 10px solid rgb(255 255 255);
    border-bottom: 10px solid rgb(255 255 255);
    border-right: 10px solid rgb(255 255 255);
    height:80px;
    width: 10%;
    position: relative;
    z-index: 1;
    opacity: 1;
    top: -7em;
    left: 7%;
	transition:ease-in all 0.3s;
	}
.item4:hover .box-15{
	opacity:0;
	}
	
	
.bed{
	font-size:60px;
	position:relative;
	    color: rgb(255 255 255);
    top: -20px;
	transition:ease-in all 0.3s;}
	
.pro_code{
	color: #000000;
    margin-left: 5em;
    font-size: 10px;}	
	
	
@media (max-width:575px){
	.pro_code{
		margin-left:0em;}
	.grid-container{
		grid-gap:3px;}
    .box-11{
    border-left: 6px solid rgb(255 255 255);
    border-bottom: 6px solid rgb(255 255 255);
    border-right: 6px solid rgb(255 255 255);
    height: 35px;
    width: 81%;
    top: -3em;
    left: 7%;
	}
	.elleys{
	font-size: 20px;
    top: 3px;
    font-weight: 600;
    color: #ebe5c5;
    left: -4px;}
    .box-12{
    border-left: 6px solid rgba(255,255,255,1.00);
    border-bottom: 6px solid rgba(255,255,255,1.00);
    border-right: 6px solid rgba(255,255,255,1.00);
    height: 100px;
    width: 80%;
    top: -6em;
    left: 13%;
    writing-mode: vertical-rl;
	}
	.fan-1{
	font-size:20px;
    top: 4px;
	font-weight: 600;
	left: 7px;}
    .box-13{
    border-top: 6px solid rgb(235 229 197);
    border-bottom: 6px solid rgb(235 229 197);
    border-right: 6px solid rgb(235 229 197);
    height: 40px;
    width: 40%;
    top: -5em;
    left: 1%;
	}
	.light{
	font-size:20px;
    top: -3px;
	font-weight: 600;}
	.box-14{
    border-left: 6px solid rgb(100 154 112);
    border-bottom: 6px solid rgb(100 154 112);
    border-top: 6px solid rgb(100 154 112);
    height:170px;
    width: 50%;
    top: -11em;
    left: 30%;
	writing-mode: vertical-rl;
	}
	.ceiling{
	font-size:20px;
    top: 6px;
	color: #000000e3;
    font-weight: 600;}
	.box-15{
    border-top: 6px solid rgb(255 255 255);
    border-bottom: 6px solid rgb(255 255 255);
    border-right: 6px solid rgb(255 255 255);
    height: 37px;
    width: 51%;
    top: -6em;
    left: 17%;
	}
	.bed{
	font-size:20px;
    top: -5px;
    font-weight: 600;}
	
	}
@media (min-width:576px) and (max-width:767px){
	
	.grid-container{
		grid-gap:3px;}
    .box-11{
    border-left: 6px solid rgb(255 255 255);
    border-bottom: 6px solid rgb(255 255 255);
    border-right: 6px solid rgb(255 255 255);
    height: 35px;
    width: 64%;
    top: -4em;
    left: 18%;
	}
	.elleys{
	font-size:20px;
    top: 1px;
	font-weight: 700;
    color: #ebe5c5;}
    .box-12{
    border-left: 6px solid rgba(255,255,255,1.00);
    border-bottom: 6px solid rgba(255,255,255,1.00);
    border-right: 6px solid rgba(255,255,255,1.00);
    height: 140px;
    width: 27%;
    top: -6em;
    left: 45%;
    writing-mode: vertical-rl;
	}
	.fan-1{
	font-size:20px;
    top: 4px;
	font-weight: 600;
	left: 13px;}
    .box-13{
    border-top: 6px solid rgb(235 229 197);
    border-bottom: 6px solid rgb(235 229 197);
    border-right: 6px solid rgb(235 229 197);
    height: 40px;
    width: 40%;
    top: -5em;
    left: 15%;
	}
	.light{
	font-size:20px;
    top: -3px;
	font-weight: 600;}
	.box-14{
      border-left: 6px solid rgb(100 154 112);
    border-bottom: 6px solid rgb(100 154 112);
    border-top: 6px solid rgb(100 154 112);
    height: 47px;
    width: 50%;
    top: -14em;
    left: 30%;
	}
	.ceiling{
	font-size:20px;
    top: 6px;
	color: #000000e3;
    font-weight: 600;}
	.box-15{
    border-top: 6px solid rgb(255 255 255);
    border-bottom: 6px solid rgb(255 255 255);
    border-right: 6px solid rgb(255 255 255);
    height: 37px;
    width: 30%;
    top: -6em;
    left: 17%;
	}
	.bed{
	font-size:20px;
    top: -5px;
    font-weight: 600;}
	
	
	}
@media (min-width:768px) and (max-width:991px){
	
		.grid-container{
		grid-gap:3px;}
    .box-11{
    border-left: 6px solid rgb(255 255 255);
    border-bottom: 6px solid rgb(255 255 255);
    border-right: 6px solid rgb(255 255 255);
    height: 35px;
    width: 64%;
    top: -4em;
    left: 18%;
	}
	.elleys{
	font-size:20px;
    top: 1px;
	font-weight: 700;
    color: #ebe5c5;}
    .box-12{
    border-left: 6px solid rgba(255,255,255,1.00);
    border-bottom: 6px solid rgba(255,255,255,1.00);
    border-right: 6px solid rgba(255,255,255,1.00);
    height: 140px;
    width: 27%;
    top: -6em;
    left: 45%;
    writing-mode: vertical-rl;
	}
	.fan-1{
	font-size:20px;
    top: 4px;
	font-weight: 600;
	left: 13px;}
    .box-13{
    border-top: 6px solid rgb(235 229 197);
    border-bottom: 6px solid rgb(235 229 197);
    border-right: 6px solid rgb(235 229 197);
    height: 40px;
    width: 40%;
    top: -6em;
    left: 18%;
	}
	.light{
	font-size:20px;
    top: -3px;
	font-weight: 600;}
	.box-14{
      border-left: 6px solid rgb(100 154 112);
    border-bottom: 6px solid rgb(100 154 112);
    border-top: 6px solid rgb(100 154 112);
    height: 47px;
    width: 50%;
    top: -14em;
    left: 30%;
	}
	.ceiling{
	font-size:20px;
    top: 6px;
	color: #000000e3;
    font-weight: 600;}
	.box-15{
    border-top: 6px solid rgb(255 255 255);
    border-bottom: 6px solid rgb(255 255 255);
    border-right: 6px solid rgb(255 255 255);
    height: 37px;
    width: 30%;
    top: -6em;
    left: 17%;
	}
	.bed{
	font-size:20px;
    top: -5px;
    font-weight: 600;}
	}
@media (min-width:992px) and (max-width:1199px){
	
			.grid-container{
		grid-gap:3px;}
    .box-11{
    border-left: 6px solid rgb(255 255 255);
    border-bottom: 6px solid rgb(255 255 255);
    border-right: 6px solid rgb(255 255 255);
    height: 35px;
    width: 32%;
    top: -5em;
    left: 35%;
	}
	.elleys{
	font-size:22px;
    top: 1px;
	font-weight: 700;
    color: #ebe5c5;}
    .box-12{
    border-left: 6px solid rgba(255,255,255,1.00);
    border-bottom: 6px solid rgba(255,255,255,1.00);
    border-right: 6px solid rgba(255,255,255,1.00);
    height: 140px;
    width: 27%;
    top: -6em;
    left: 45%;
    writing-mode: vertical-rl;
	}
	.fan-1{
	font-size:22px;
    top: 4px;
	font-weight: 600;
	left:3px;}
    .box-13{
    border-top: 6px solid rgb(235 229 197);
    border-bottom: 6px solid rgb(235 229 197);
    border-right: 6px solid rgb(235 229 197);
    height: 40px;
    width: 31%;
    top: -7em;
    left: 20%;
	}
	.light{
	font-size:20px;
    top: -3px;
	font-weight: 600;}
	.box-14{
      border-left: 6px solid rgb(100 154 112);
    border-bottom: 6px solid rgb(100 154 112);
    border-top: 6px solid rgb(100 154 112);
    height: 47px;
    width: 30%;
    top: -14em;
    left: 30%;
	}
	.ceiling{
	font-size:22px;
    top: 6px;
	color: #000000e3;
    font-weight: 700;}
	.box-15{
    border-top: 6px solid rgb(255 255 255);
    border-bottom: 6px solid rgb(255 255 255);
    border-right: 6px solid rgb(255 255 255);
    height: 37px;
    width: 25%;
    top: -5em;
    left: 24%;
	}
	.bed{
	font-size:22px;
    top: -5px;
    font-weight: 600;}
	
	}