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

.image {
	margin:40px;
	
	float: right;
width:300px;
	
	  
}
.c:hover{
	background-color: beige;
}


.mtxt{
	margin-left:15px;
    color: rgb(0, 0, 0);
    font-family:  Poppins;
    padding: 20px;
    
    letter-spacing: 0px;
    font-weight: 500px;
    font-size: 40px;
    
}
.minitxt{
	margin-left:15px;
	padding: 15px;
	color:rgb(0, 0, 0);
	font-family:openSans;
	font-size:2vh;
 
	
}

.hr{
	width:20%;
	background-color:rgb(0, 0, 0);
	margin-left: 30px;
	height:4px;
	
}
.shopcollection{
	background-color:black;
	
	
	border-radius:0px;
margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 30px;
	
}


.box {
    background: none repeat scroll 0% 0% rgb(255, 255, 255);
    padding: 1px 35px;
    box-shadow: 0px 3px 3px 3px rgba(0, 0, 0,0);
 
}
.box:hover {
    box-shadow: 0px 10px 30px 0px rgba(209, 209, 209, 0.8);
	
}
.box3 {
    background: none repeat scroll 0% 0% rgb(255, 255, 255);
    
    box-shadow: 0px 3px 3px 3px rgba(0, 0, 0,0);
	box-sizing: 1000px;
 
}
.box3:hover {
    box-shadow: 0px 10px 30px 0px rgba(213, 214, 209, 0.8);
	box-sizing: border-box;
}
.box1{
 
height:180px;
 padding-left: 15px;
    padding-right: 20px;
background-color:white;
box-shadow:0px 0px 0px 0px grey;
}
.box1:hover{
 box-shadow:0px 0px 0px 0px grey;

}

.history{
	font-family: 'm';
font-size: 80px;
font-weight: normal;
line-height: 1;
text-align: center;	
}
.history1{
	font-family: 'm';
font-size: 30px;
font-weight: normal;
line-height: 1;
text-align: center;		
}
.box2image{float:left;
	margin-top: 10px;
	
}
.box2text{
	padding-top: 30px;
	text-align: center;
}
.box2 {
	height:120px;
	width:95%;
	border:0px solid grey;
	position:absolute;
    box-sizing: border-box;
    padding-left: 15px;
    padding-right: 15px;
	background-color:whitesmoke;
	box-shadow:0px 3px 3px 0px grey;
	
}
.box2:hover{
 box-shadow:0px 10px 30px 0px grey;
}
.littlestory{
	font-size:20px;
	font-weight:10px;
	color:gainsboro;
	font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
	text-align: center;	
}
.caption{
	font-size:20px;
	font-weight:20px;
	color:black;
	font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
	
}
.nam{
	font-size:20px;
	
	color:grey;
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	
}
.img{
	height: 650px;
	border:1px solid black;
}

.img1{
	height: 300px;
	
}
.border1{
	border:1px solid black;
}
.feature{
height:auto;
	width:100%;
}
.plant{
	width:100%;
	height:270px;
}
.plant1{
	
	width:100%;
	height:auto;
	
	
}
 .fa-rocket {
	
	color:#abd373;
	font-size: 80px;
	 padding-left: 20px;
	  margin-bottom:10px;
	 margin-top:20px;
}

.fa-rocket:hover{
  -webkit-animation-name: rotate; 
    -webkit-animation-duration: 2s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
}
@-webkit-keyframes rotate{
    from {-webkit-transform:rotate;}
    to {-webkit-transform:rotate;}
}
.fa-phone-square{
	color:#abd373;
	font-size: 80px;
	 padding-left: 20px;
	  margin-bottom:1px;
	 margin-top:20px;
}
.fa-phone-square:hover{
	 -webkit-animation-name: zoomIn; 
    -webkit-animation-duration:1s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
}
@-webkit-keyframes zoomIn{
    from {-webkit-transform: zoomIn; }
    to {-webkit-transform: zoomIn ;}
}

.fa-refresh{
	color:#abd373;
	font-size: 80px;
	 padding-left: 20px;
	  margin-bottom:10px;
	margin-top:20px;
}
.fa-refresh:hover{
	 -webkit-animation-name: rotate; 
    -webkit-animation-duration: 2s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
}
@-webkit-keyframes rotate {
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}

.tabletop {
    position: relative;
   
}

.text-block {
    position: absolute;
  top:50%;
	left:50%;
	transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
    background-color: White;
    color: #abd373;
    padding-left: 20px;
    padding-right: 20px;
	width:160px;
	height:60px;
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	
}


  .tabletop:hover .text-block{
	position: absolute;
    top:50%;
	left:50%;
	transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
    background-color:#abd373;
    color: white;
    padding-left: 20px;
    padding-right: 20px;
	width:160px;
	height:60px;
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	}


.text-block1{
    position: absolute;
  top:50%;
	left:50%;
	transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
    background-color: White;
    color: #abd373;
	
	
    padding-left: 20px;
    padding-right: 20px;
	width:160px;
	height:60px;
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	
}


  .tabletop:hover .text-block1{
	position: absolute;
  top:50%;
	left:50%;
	transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
    background-color:#abd373;
    color: white;
    padding-left: 20px;
    padding-right: 20px;
	width:160px;
	height:60px;
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	}

.imagetop {
    position: relative;
	
   
}
.symbol{
	position: absolute;
	background-color: white;
    top:30%;
    
    transform: translate(-50%, -50%);
	-ms-transform: translate(-50%,-50%);
	opacity:0;
	width:100px;
	height:30px;
	padding-left: 20px;
    padding-right: 20px;
}



.imagetop:hover .symbol{
	position: absolute;
	background-color: white;
    top:30%;
    left: 50%;
    transform: translate(-50%, -50%);
	-ms-transform: translate(-50%,-50%);
	opacity:1;
	width:100px;
	height:20px;
	
}
.p1{
	opacity:1;
}
.imagetop:hover .p1{
	opacity:0;
}
.imagetop:hover .addtocart{
	position: absolute;
	color:black;
	top:98%;
    left: 50%;
	transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	
}
.home{
	color:greenyellow;
	font-size: 30px;
	float:left;
	margin-right: 15px;
}


.mail{
	color:greenyellow;
	font-size: 25px;
	float:left;
	margin-right: 15px;
}
.phone{
	color:greenyellow;
	font-size: 30px;
	float:left;
	margin-right: 15px;
}
.footer{
	 background-color: black;
	

}

.overlay {
  position: absolute; 
  bottom: 0; 
  background: rgb(0, 0, 0);
  background: rgba(222, 242, 171,1); /* Black see-through */
  color: #f1f1f1; 
  width: 100%;
  transition: .5s ease;
  opacity:0;
  color: black;
  font-size: 20px;
  padding: 20px;
  text-align: center;
}


.imagetop:hover .overlay {
  opacity: 1;
}
.imagetop:hover a{
color:#abd373;
	text-decoration: none;
}
#myBtn {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed/sticky position */
    bottom: 20px; /* Place the button at the bottom of the page */
    right: 30px; /* Place the button 30px from the right */
    z-index: 90; /* Make sure it does not overlap */
    border: none; /* Remove borders */
    outline: none; /* Remove outline */
    background-color: #abd373; /* Set a background color */
    color: white; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    padding: 15px; /* Some padding */
    border-radius: 10px; /* Rounded corners */
    font-size: 18px; /* Increase font size */
}

#myBtn:hover {
    background-color: #555; /* Add a dark-grey background on hover */
}
.zoom {
    padding: 20px;
   
    transition: transform .2s;
   
    margin: 0 auto;
}

.zoom:hover {
    -ms-transform: scale(1.5); /* IE 9 */
    -webkit-transform: scale(1.5); /* Safari 3-8 */
    transform: scale(1.1);
	 padding: 20px;
}