
 @import url('https://fonts.googleapis.com/css?family=Muli&display=swap');
      @import url('https://fonts.googleapis.com/css?family=Quicksand&display=swap');
      *{margin: 0px auto; padding: 0px; box-sizing: border-box;}
      
}
      body {
        font-family: 'Muli', sans-serif;
        color: rgba(0, 0, 0, 0.8);
         }
      h1 {
        font-family: 'Quicksand', sans-serif;
        font-weight: 700;
        font-style: normal;
        font-size: 38px;
        line-height: 1.15;
        letter-spacing: -.02em;
        color: rgba(0, 0, 0, 0.8);
        -webkit-font-smoothing: antialiased;
      }

      .nav2{
      	position: fixed;
      	background-color: #fff;
      	width: 100%; 
      	height: auto; 
      	align-items: center;
      	display: inline-flex;
      	flex-direction: row;
      	padding: 8px 10px 5px 0px;
      	text-align: center;
      	box-shadow: 2px 2px 10px rgba(0,0,0,0.15);
            z-index: 4000;
      }
      nav img{
      	width: 230px;
      }
      .nav2 .navigation img{
      	display: flex;
      }
      .navigation-top{width: 100%; height: 50px; background-color: black;}
      #menu-image{
      	width: 30px; 
      	height: 30px;
      	display: none;
      }
      #menu-close{
      	display: none;
      }
      nav .navigation ul{
      	display: flex;
      	justify-content: flex-end;
      	align-items: center;
            padding-top: 15px;
      }
      nav .navigation ul li{
      	list-style:none;
      	margin-left: 30px;
      }
      nav .navigation ul li a{
      	text-decoration: none;
      	font-size: 16px;
      	font-weight: 500px;
      }
      #eq{
      	padding:10px; border: 0px solid rgba(0,0,0,0.15); padding: 10px; font-family: all; font-weight: bold;
      }
      #eq:hover{
            border:0px solid green; color: green; border-radius: 3px;
      }
      nav .navigation ul li a:hover{
      	color: grey;
      }
      #slider-warpper{
      	
      	width: 100%;
      	height: 100vh;
      	background-repeat: repeat-x;
      	background-size: cover;
      	background-position: center;
      	padding-top: 40px;
      	display: flex;
      	flex-direction: column;
      	justify-content: center;
      	align-items: center;
      	text-align: center;
            animation: animatedBackground 40s cubic-bezier(0.4, 0, 1, 1) infinite; 

      	
      }

      #slider-warpper h2{
      	color: #fff;
      	font-size: 4.2rem;
      	letter-spacing: 1px;
      }
      #slider-warpper p{
      	width: 50%;
      	color: #fff;
      	font-size: 2.0rem;
      	
      	letter-spacing: 1px;
      }
      #slider-warpper a{
      	text-decoration: none;
      	font-size: 0.9rem;
      	padding: 15px 35px;
      	background-color: #fff;
      	font-weight: 600;
      	border-radius: 2px;
      	margin-left: 10px;
      	color: #fff;
      }

      .test-slider{width: 100%; height: 100vh; position: absolute; animation: animate 15s ease-in-out infinite; background-size: cover;}
            .test-slider-outer{
                  position: absolute;
                  left: 0;
                  top: 0;
                  background-color: rgba(0,0,0,0.5);
                  height: 100vh;
                  width: 100%;
            }
            @keyframes animate {
                  0%,100%{
                        background-image:url("../images/pond.jpg");
                  }
                  25%{
                        background-image: url("../images/m3.jpeg");
                  }
                  50%{
                        background-image:url("../images/m2.jpeg");
                  }
                  75%{
                        background-image: url("../images/m1.jpg");
                  }
            }
            .test-slider-details{
                  position: absolute;
                  left: 50%;
                  top: 50%;
                  transform: translate(-50%,-50%);
                  text-align: center;
            }
            .test-slider-details h1{
                  color: white;
                  font-weight: bold;
            }
            .test-slider-details h2{
                  color: white;
                  font-weight: bold;
            }


      #slider-warpper .blue:hover{
      	background-color: green;
      	transition: 0.3s ease;
      }
      #slider-warpper .yellow:hover{
      	background-color: blue;
      	transition: 0.3s ease;
      }
      #slider-warpper .blue{
      	background-color: blue;
      }
      #slider-warpper .yellow{
      	background-color: green;
      }
      #slider-warpper-page{
                background-image: linear-gradient(65deg, #304d89, transparent),url("../images/makhana.jpg");
            
            width: 100%;
            height: 300px;
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center;
            padding-top: 80px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            text-align: center;
            animation: animatedBackground 70s cubic-bezier(0.4, 0, 1, 1) infinite; 
            
      }
      #slider-warpper-page h2{
            color: #fff;
            font-size: 4.2rem;
            letter-spacing: 1px;
      }
      #slider-warpper-page p{
            width: 50%;
            color: #fff;
            font-size: 2.0rem;
            
            letter-spacing: 1px;
      }
      #slider-warpper-page a{
            text-decoration: none;
            font-size: 0.9rem;
            padding: 15px 35px;
            background-color: #fff;
            font-weight: 600;
            border-radius: 2px;
            margin-left: 10px;
            color: #fff;
      }
      #slider-warpper-page .blue:hover{
            background-color: green;
            transition: 0.3s ease;
      }
      #slider-warpper-page .yellow:hover{
            background-color: blue;
            transition: 0.3s ease;
      }
      #slider-warpper-page .blue{
            background-color: blue;
      }
      #slider-warpper-page .yellow{
            background-color: green;
      }

      #aboutus-warpper{
      	width: 100%;
      	height: auto;
      	background-color: #fff;
      	padding: 20px 10px 40px 10px;
      }
      #aboutus-warpper p{
      	text-align: justify;
      }

      nav .navigation ul{
      	display: flex;
      	justify-content: flex-end;
      	align-items: center;
      }
      .makhana-image img{width: 100%; margin-top: 70px;}

      #keypoint{width: 100%; background-color: #304d89; height: auto; padding:30px 10px 50px 10px;}
      #keypoint h4{color: white;}
      #keypoint p{text-align: justify; font-size: 14px; color: whitesmoke;}
      #keypoints{padding: 1px 10px 0px 10px; }
      #keypoints ul{list-style-type: circle; padding: 20px;}
      #keypoints ul li{margin-top: 10px; font-family: all; color: whitesmoke; font-weight: 700; font-size: 15px;}
      #keypoints img{width: 80%;}
      .points{width: 10px; height: 10px; background-color: green; display: flex; }
      #about-us{width: 100%; padding: 50px 10px 50px 10px; height:auto; background-color: #fff;}
      .about-image img{width: 70%; border-radius: 50%;}
      #footer-warpper{
            width: 100%;
            height: auto;
            background-color:#304d89;
            padding: 30px 10px 0px 10px;
      }
      .footer-navigation{}
      .footer-navigation ul{list-style-type: none;}
      .footer-navigation ul li{padding: 10px;}
      .footer-navigation ul li a{color: #fff; font-size: 16px; text-decoration: none;}
      .footer-address{color: #fff; font-size: 16px;}


      .contact-us{border:0px solid grey; padding: 30px; box-shadow: 0px 0px 1px 0px grey;}


      .makhana-name{margin-top: 10px; border:0px solid grey;  min-height: 425px; width: 100%; box-shadow: 0px 0px 2px 0px grey;}
      .makhana-image1 img{width: 100%; height: 100px;  min-height: 200px;}
      .makhana-description{text-align: justify; padding: 2px;}
      .makhana-description h3{text-align: center; color: grey;}
      .makhana-name .btn{border-radius: 0px; padding: 4px; width: 50%; float: left;}
      .phool-name{border:0px solid grey; box-shadow: 0px 0px 0px 0px grey; padding: 10px; }
      .phool-name2{border:0px solid grey; box-shadow: 0px 0px 3px 0px grey; padding: 10px; background-color: #304d89; color: white;}
      #phool-img{width: 40%; border-radius: 50%;}
      .makhana-type img{border-radius: 50%; margin-top: 50px;}



/* Media Query Section Start Here ------------------*/
@media only screen and (max-width: 479px){


      .test-slider{width: 100%; height: 100vh; position: absolute; animation: animate 15s ease-in-out infinite; background-size: cover;}
            .test-slider-outer{
                  position: absolute;
                  left: 0;
                  top: 0;
                  background-color: rgba(0,0,0,0.5);
                  height: 100vh;
                  width: 100%;
            }
            @keyframes animate {
                  0%,100%{
                        background-image:url("../images/pond.jpg");
                        background-position: center;
                        background-size: auto;
                  }
                  25%{
                        background-image: url("../images/m3.jpeg");
                        background-position: center;
                        background-size: auto;
                  }
                  50%{
                        background-image:url("../images/m2.jpeg");
                        background-position: center;
                        background-size: auto;
                  }
                  75%{
                        background-image: url("../images/m1.jpg");
                        background-position: center;
                        background-size: auto;
                  }
            }
            .test-slider-details{
                  position: absolute;
                  left: 50%;
                  top: 50%;
                  transform: translate(-50%,-50%);
                  text-align: center;
            }
            .test-slider-details h1{
                  color: white;
                  font-weight: bold;
            }
            .test-slider-details h2{
                  color: white;
                  font-weight: bold;
            }



      #form-hide{display: none;}
      #phool-img{width: 100%;}
	.nav2 {
	    padding: 10px 15px;
	}
	
	#menu-image{
      	margin-left: 100px;
      	display: initial;
      }
      #menu-close{
      	display: initial;
      	padding:50px 0px 10px 0px;
      	color: white;
      	font-size: 20px;
      	float: left;
      	margin-right: 187px;

      }
      nav .navigation ul{
      	position: absolute;
      	width: 220px;
      	height: 100vh;
      	background-color: blue;
      	backdrop-filter:blue(24.5);
      	border:1px solid grey;
      	top: 0px;
      	right: -220px;
      	display: flex;
      	flex-direction: column;
      	justify-content: flex-start;
      	align-items: flex-start;
      	transition: 0.3s ease;
      }
      nav .navigation ul.active{
      	right: 0px;
      }
      nav .navigation ul li{
      	padding: 10px 0px 20px 40px;
      	margin-left: 0px; 
      }
      #eq{
      	 padding:10px; border: 0px solid rgba(0,0,0,0.15); padding: 10px;  font-family: all; font-weight: bold;
      }
      nav .navigation ul li a{
      	color: #fff;
      }
      #slider-warpper p {
	    width: 100%;
	    font-size: 1.1rem;
	}
	#slider-warpper {
	    padding: 0px;
	}
	#slider-warpper h2{
		font-size: 3.2rem;
	}



      #slider-warpper-page p {
          width: 100%;
          font-size: 1.1rem;
      }
      #slider-warpper-page {
          padding-top: 70px;
      }
      #slider-warpper-page h2{
            font-size: 3.2rem;
      }
      .makhana-image img{width: 100%; margin-top: 40px;}
      #keypoints img{width: 100%;}
      nav img {
       width: 190px;
       margin-right: 13px;
      }
      .about-image img{width: 100%; border-radius: 50%;}
      .text-slider-details h2{
            color: #fbf6f6;
            font-size: 10px;
      }
      .test-slider-details{width: 100%; text-align: center;}
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
	nav img {
       width: 190px;
       margin-right: 13px;
      }
}
@media only screen and (min-width: 639px) and (max-width: 767px) {
	
}
@media only screen and (min-width: 768px) and (max-width:1024px) {

      .test-slider{width: 100%; height: 100vh; position: absolute; animation: animate 15s ease-in-out infinite; background-size: cover;}
            .test-slider-outer{
                  position: absolute;
                  left: 0;
                  top: 0;
                  background-color: rgba(0,0,0,0.5);
                  height: 100vh;
                  width: 100%;
            }
            @keyframes animate {
                  0%,100%{
                        background-image:url("../images/pond.jpg");
                        background-position: center;
                        background-size: auto;
                  }
                  25%{
                        background-image: url("../images/m3.jpeg");
                        background-position: center;
                        background-size: auto;
                  }
                  50%{
                        background-image:url("../images/m2.jpeg");
                        background-position: center;
                        background-size: auto;
                  }
                  75%{
                        background-image: url("../images/m1.jpg");
                        background-position: center;
                        background-size: auto;
                  }
            }
            .test-slider-details{
                  position: absolute;
                  left: 50%;
                  top: 50%;
                  transform: translate(-50%,-50%);
                  text-align: center;
            }
            .test-slider-details h1{
                  color: white;
                  font-weight: bold;
            }
            .test-slider-details h2{
                  color: white;
                  font-weight: bold;
            }


      #form-hide{display: none;}
      #phool-img{width: 100%;}
	.nav2 {
	    padding: 10px 15px;
	}
	nav img {
   	 width: 190px;
   	 margin-right: 13px;
	}
	#menu-image{
      	margin-left: 240px;
      	display: initial;
      }
      #menu-close{
      	display: initial;
      	padding:50px 0px 10px 0px;
      	color: white;
      	font-size: 20px;
      	float: left;
      	margin-right: 187px;

      }
      nav .navigation ul{
      	position: absolute;
      	width: 220px;
      	height: 100vh;
      	background-color: rgba(17,20,104,0.45);
      	backdrop-filter:blue(4.5px;);
      	border:1px solid grey;
      	top: 0px;
      	right: -220px;
      	display: flex;
      	flex-direction: column;
      	justify-content: flex-start;
      	align-items: flex-start;
      	transition: 0.3s ease;
      }
      nav .navigation ul.active{
      	right: 0px;
      }
      nav .navigation ul li{
      	padding: 40px 0px 20px 40px;
      	margin-left: 0px; 
      }
      nav .navigation ul li a{
      	color: #fff;
      }
      #slider-warpper p {
	    width: 90%;
	}
	#slider-warpper {
	    padding: 0px;
	}

      #slider-warpper-page p {
          width: 100%;
          
      }
      .makhana-image img{width: 100%; margin-top: 40px;}
      #keypoints img{width: 100%;}
      .about-image img{width: 100%; border-radius: 50%;}
      .test-slider-details{width: 100%; text-align: center;}
      .test-slider-details h2{font-size: 12px;}
      .test-slider{background-size: cover;}
	
}
@media only screen and (min-width: 959px) and (max-width:1024px) {
	
}

