@charset "utf-8";
 
	.closebtn{
		position: absolute;
	}
	.product{
		
		display:none;
	}
	
	.display_product{
		
		display:block;
	}
	.header{
		background-color: #F8F4F4;
		
	}

	.align{
		margin-left:100px;
	}
	.product_opacity{
		opacity:0.5;
	}
    .product_opacity1{
		opacity:1.0;
	}
    .top{
		margin-top: 20px;
	}
	.logo{
		width:150px;
		height:80px;
	}
	a{
		color:#da1c5c;
	}
	.pad{
		padding-top: 60px;
	}
	p{
	  color:#8F8F8F;
	}
	.car{
		width:100%; 
		height:800px !important;
	}
li a {
		color:#da1c5c !important;
	}
	.align1{
		margin-right: 100px;
		margin-left: 100px;
	}
	 

	.x{
		display: none;
		
	  background: rgba(247, 103, 108, 0.6);
		
	}
	.nav1:hover .x{
		display: block;
		}
	.x a{
		color: azure !important;
		
	}
	.x a:hover{
		background-color:lightgrey!important;
	}
	.fix{
		position:absolute;
		z-index:1;
		width:200px;
	}
	.x p{
		padding-top: 10px;
	}
	
	.image {
  opacity: 1;
  display: block;
 
  height: auto;
  transition: .5s ease;
 
}

.middle {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.t:hover .image {
  opacity: 0.3;
}

.t:hover .middle {
  opacity: 1;
}

.text {
   background: rgba(247, 103, 108, 0.6);
  color: white;
  font-size: 16px;
  padding: 16px 32px;
}
	.cursor{
		cursor: pointer;
	}	

	

.overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(247, 103, 108, 0.6);
  overflow:hidden;
  width:0;
  height: 100%;
  transition: .5s ease;
}

.con:hover .overlay {
  width:220px;
  height: 250px;
}

.text1 {
  color: white;
  font-size: 17px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
}