html

html{
  scroll-behavior:smooth;
  }
  

ul{
list-style:none;
margin:auto;
background:black;
}

ul li{
display:inline-block;
position:relative;

}

ul li a{
display:block;
border-radius:25px;
padding:15px;
color:white;
text-decoration:none;
text-align:center;
font-size:20px;

}

ul li ul.dropdown li{
display:block;

}

ul li ul.dropdown{
width:200%;
position:absolute;
z-index:1;
display:none;
opacity:0.60;

}


ul li a:hover{
background:teal;
}

ul li:hover ul.dropdown{
display:block;
}

#zz{
  width:100%;
  margin:auto;
  position: fixed;
  z-index: 3;
}



{
*{transition:0.60s;}
}

p{
  text-align:justify;
  font-size:20px;
  font-family:Arial, Helvetica, sans-serif;
  color:black;
  text-indent:100px;
  
}
  
p{
  width:100%
}


//div{border:1px black solid;}


nav{

width:100%;

border:1px black solid;
padding:10px;
margin:auto;
margin:3% 5% 10px  5%;
margin-top:5px;

}

#logo{
width:20%;
height:200px;
border:1px black solid;
}

#banner
{
width:100%;
height:100px;
}



#leftbar{
 width:80%;
padding:30px;
transform:rotate(-8);

}


#leftbar
{
width:85%;
padding:10px;
position:fixed;
top:77%;
text-align:right;
cursor:pointer;
transition:1s;
animation:fadout 1s ease-in ;
}



#leftbar:hover
{
opacity:0.99;
}


#main1{ 
  width:100%;
 padding:15px;
 margin:auto;
 height:auto;
 flex-direction:column;
 
 
 }

#middlebar{ 
 width:100%;
padding:5px;



}

footer
{

display:flex;
width:100%;
background:black;
color:white;
height: 500px;;
margin:auto;
justify-content:space-between;

}
#mcopy{
width:50%;
padding:20px;
height:300px;
}

#sitemap
{
width:50%;
padding:20px;
height:300px;
}


#socialmedia{
width:30%;
padding:20px;
height:300px;

}





#mask
{
background:black;
width:90%;
margin:auto;
margin-top:10px ;
height:100px;
box-shadow:10px 10px 10px gray;
overflow:hidden;
box-shadow:10px 10px 10px gray ;
}

@keyframes ani1
{
from{margin-left:0px;}
to{margin-left:-690%}
}

#news
{
color:white;
width:800%;
height:100px;
font-family:arial black;
font-size:60px;
padding:10px;
transition:2s;
z-index:-1;
animation:ani1 40s linear infinite;
}





#divpic
{
width:100%;
display:flex;
justify-content:center;
justify-content:start;
align-items:center;
padding:-100px;
margin:auto;
}

.picstyle
{
width:100px;
height:80px;
border-radius:13px;
box-shadow:4px 7px 7px 0px gray;
cursor:pointer;
margin:10px;
transition:400ms;
}

.picstyle:hover{
transform:scale(1.90)rotateY(29deg);
filter: blur(0.50);
}




#body{
  overflow-x: hidden;
}

.header-content{

margin-bottom:150px;
color:white;

text-align:center;

}


.header-content h2 {

font-size:50px ;

}

.header-content h1 {

    font-size:60px ;
    margin-top:50px;
    margin-bottom:30px;
 }

 .cl{
   padding:15px 20px;
   background:black;
   border-radius:10px;
   color:white;
 }

 .cl:hover{
  transform:scale(1.80);
  filter:grayscale(1);
  }

 @keyframes showadd
 {
 0% {background-image:url(https://5.imimg.com/data5/SELLER/Default/2023/9/347422967/RZ/YE/GW/191501654/11.jpg); }
 10% {background-image:url(https://5.imimg.com/data5/SELLER/Default/2023/9/347422967/RZ/YE/GW/191501654/11.jpg); }
 20% {background-image:url(https://5.imimg.com/data5/SELLER/Default/2023/9/347422967/RZ/YE/GW/191501654/11.jpg); }
 30% {background-image:url(https://5.imimg.com/data5/SELLER/Default/2023/9/347422967/RZ/YE/GW/191501654/11.jpg); }
 40% {background-image:url(https://5.imimg.com/data5/SELLER/Default/2023/9/347422967/RZ/YE/GW/191501654/11.jpg); }
 50% {background-image:url(https://5.imimg.com/data5/SELLER/Default/2023/9/347422967/RZ/YE/GW/191501654/11.jpg); }
 60% {background-image:url(images/7.jpg); }
 70% {background-image:url(images/1.jpg); }
 90% {background-image:url(images/2.png); }
 100% {background-image:url(images/3.jpg); }
 }
 
 
 
 #banner2
 {
 width:80%;
 height:500px;
 top:10%;
 margin:auto;
 background-image:url(https://5.imimg.com/data5/SELLER/Default/2023/9/347422967/RZ/YE/GW/191501654/11.jpg);
 background-size:100% 100%;
 animation:showadd 29s infinite;
 }
 
 #topad
 {
 color:green;
 font-size:40px;
 font-family:arial black ;
 text-transform:uppercase ;
 box-shadow:10px 10px 10px black ;
 animation:multicolor 12s infinite ;
 }
 
 #About

 {
 margin:auto;
 width:90%;
 height:auto;

 
 }
 
 #slider{
  display:block;
  margin:auto;
  transition: all ease-in-out;
  
}

#pi{
  width:400px;
  height:400px;
  box-shadow:1px 1px 1px gray;
  display:block;
  margin:auto;
  margin-right:25%;
}



 .pic{
  box-shadow: 5px 5px 5px dashed black;
  color:white;
  margin:40px;
 cursor: pointer;
 width: 100px;
 height:100px;
 padding:5px;
 background: gray;
 transition: 1s ease-in-out;

}

.pic:hover{
transform: scale(1.70)rotate(-8deg);
}


#inner-box{
  width: 100%;
  height:auto;
  display: flex;
  flex-wrap: wrap;
  border-radius: 10px;
  border:2px solid black;
}

.text
{
display: flex;
flex-wrap: wrap;
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;  
box-shadow:2px 3px 2px gray;
margin: auto;
height:100px;

}

.author-info{
width:70% ;
border-radius: 10px;
border:2px solid black;
display: block;
text-align: center;
flex-wrap: wrap;
margin: auto;

}

.wow{
display:flex;
justify-content:center;
background-image: url(https://i.pinimg.com/236x/46/8d/07/468d0766b26b2c4a8e3a7a250c1d6f68.jpg);
background-size: cover;
background-repeat: no-repeat;

}

.car9{
  width:270px;
  height:300px;
  margin:10px;
  background-size: cover;
  border-radius: 10px;
  text-align: center;
  }



.car{
background:black;
width:270px;
height:300px;
margin:10px;
background-image: url(https://canadianfoodfocus.org/wp-content/uploads/2020/04/plant-vegetable-garden.jpg);
background-size: cover;
border-radius: 50px;
text-align: center;
color: honeydew;
}

.car-img{
text-align: center;
justify-content:center;
height:200px;
margin-bottom: 15px;
background-size: cover;
border-radius: 50px;
}



.car-1{
  background-image: url(https://canadianfoodfocus.org/wp-content/uploads/2020/04/plant-vegetable-garden.jpg);
}

.car-2{
  background-image: url(https://static1.backyardbossimages.com/wordpress/wp-content/uploads/2023/12/family-planting-vegetable-garden-together.jpg);
}

.car-3{
  background-image: url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTtvnl2sv5X4obBx-BwQ02N2poTbquZENJQYRR6k-DeY2nMyQ8da-aTuJs4Wb92Jek7t8E&usqp=CAU);
}

.car-4{
  background-image: url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQlI0T_4FfaIVhAilzffvw0h-_HungfLKoA_nLfI7IzYibWDBjevhCIMEyFb-TJuL7c_VA&usqp=CAU);
}


.car-5{
  background-image: url(https://homesandstylekc.com/wp-content/uploads/2019/03/GroundFloorChamp.jpg);
}


.car a{
  background-color:skyblue;
  color:white;
  padding:15px;
  display:block;
  text-align: center;

}

.car:hover{

  background-color: bisque;
  color: black;
  cursor:pointer;
  transform:scale(1.03) rotate(-10deg);
  transition: all 1s ease;

}





.car3{
  background:aqua;
  width:270px;
  height:100px;
  margin:10px;
  background-size: cover;
  border-radius: 10px;
  text-align: center;
  }
  
  
  
  .car3 a{
    background-color: black;
    color:white;
    padding:15px;
    display:block;
    text-align: center;
  
  }
  
  .car3:hover{
  
    background-color:blanchedalmond;
    color: green;
    cursor:pointer;
    transform:scale(1.03);
    transition: all 1s ease;
  
  }
  
  .wow3{
  display:flex;
  justify-content:center;
  flex-wrap: wrap;
  
  }



@keyframes ani2
{
from{transform:rotateY(360deg)}
to{transform:rotateY(0deg)}
}

@keyframes ani2
{
from{tranform:rotateY(360deg) }
to{transform:rotateY(0deg) }
}

@keyframes myzoom
{
from{transform:perspective(400px);}
to{transform:perspective(10px);}
}




 .footer{
    background-color:black;
    border-radius: 10px;
    padding: 0px 0;
    background-image: url(images/footer-bg.jpg);
  
  }
  .footer-col
  {
    width:25%;
    padding: 0 15px;
    
    
  
  }
  
  .footer-col h1{
    font-size: 20px;
    color: antiquewhite;
    text-transform: capitalize;
    margin-bottom: 35px;
    font-weight: 500;
    position: relative;
    text-align: center;
    
    
  
  }
  
  .footer-col h4::before{
    position: absolute;
    left: 0;
    bottom: -10px;
    background-color: #e91e63;
    height: 2px;
    box-sizing: border-box;
    width: 50px;
  
  }
  
  .footer-col ul li:not(:last-child)
  {
   margin-bottom: 10px;
  
  }
  
  .footer-col ul li a{
    font-size: 17px;
    text-transform: capitalize;
    color: black;
    text-decoration: none;
    font-weight: 300;
    color:rgb(255, 68, 47);
    display: block;
    transition: all 0.3s ease-in-out;
    
  }
  
  .footer-col ul li a:hover
  {
    color:white;
    padding-left: 8px;
  
  }

  .footer-col .social a
  {
   
    transition: all 0.3s;
    text-transform: capitalize;
    color: black;
    text-decoration: none;
    font-weight: 300;
    color:rgb(255, 68, 47);
    display: block;
    transition: all 0.3s ease-in-out;
    
    
  
  }


.cont{
  max-width: 1170px;
  margin: auto;
}

.ro
{
  display: flex;
  flex-wrap: wrap;
}
  
  .footer-col .social a:hover
  {
  color:#24262b;
  background-color: #bbbbbb;
  padding-left: 8px;
  
  }


  
@media(max-width: 767px){
  .footer-col{
      width: 50%;
      padding: 0 15px;
      margin-bottom: 30px;
      
  }
}


@media(max-width: 574px){
  .footer-col{
      width:100%;
     
      
  }
}


#box{
width:500px;
height:400px;
margin:auto;
perspective:300px;
}

#one{
width:200px;
height:250px;
text-align:center;
color:black;
position:relative;
left:150px;
top:50px;
animation-fill-mode:forwards;
animation:ani2 6s linear infinite;
background-image:url(images/.jpg);
}


#two{
text-align:center;
color:black;
position:relative;
left:150px;
top:-200px;
animation-fill-mode:forwards;
animation:ani2 6s linear infinite;
background-size:cover;
width:270px;
height:300px;
background-image: url(images/pngwing.com\ \(1\).png);

color: honeydew;
}



.wo{
  display:flex;
  justify-content:center;
  background-size: cover;
  background-repeat: no-repeat;
  padding: auto;
  
  }
  .wo h5,h2{
    text-align: center;
    margin: auto;
    margin-top: auto;
  }
  

  
  .ca{
  background:slategray;
  width:270px;
  height:300px;
  margin:10px;
  background-size: cover;
  border-radius: 50px;
  text-align: center;
  color: honeydew;
  }
  
  .ca-img{
  text-align: center;
  justify-content:center;
  height:200px;
  margin-bottom: 15px;
  background-size: cover;
  border-radius: 50px;
  }
  
  
  
  .ca-1{
    background-image: url(https://homesandstylekc.com/wp-content/uploads/2019/03/GroundFloorChamp.jpg);
  }
  
  .ca-2{
    background-image: url(https://www.realestate.com.au/news-image/w_2000,h_1333/v1659870480/news-lifestyle-content-assets/wp-content/production/gardeing-in-iso.jpeg?_i=AA);
  }
  
  .ca-3{
    background-image: url(https://img.freepik.com/premium-photo/plant-flowers-garden_73944-17340.jpg?w=360);
  }
  
  .ca-4{
    background-image: url(https://img.freepik.com/premium-photo/child-plants-flower-garden-selective-focus_73944-13304.jpg?w=360);
  }
  
  
  .ca-5{
    background-image: url(https://img.freepik.com/premium-photo/child-mother-plant-flowers-garden-selective-focus_73944-13355.jpg?w=360);
  }
  
  
  .ca a{
    background-color:skyblue;
    color:white;
    padding:15px;
    display:block;
    text-align: center;
  
  }
  
  .ca:hover{
  
    background-color: bisque;
    color:skyblue;
    cursor:pointer;
    transform:scale(1.03);
    transition: all 1s ease;
  
  }