:root
{
    --jaysan_orange:#fb9f0c;
    --jaysan_orange_light:rgba(251, 159, 12, 0.75);
    --jaysan_dark_green:#297118;
    --jaysan_light_green:#2CAD0A;
    --saaral_green : #42a34c;
    --saaral_gray : #8f928f;
    
}

*{
    font-family: 'Roboto' ,  sans-serif ;
    box-sizing: border-box;
    
   
}
@media (min-width: 992px){
  

	.dropdown-menu .dropdown-toggle:after{
		border-top: .35em solid transparent;
	    border-right: 0;
	    border-bottom: .35em solid transparent;
	    border-left: .35em solid;
      position: absolute;
      left: 90%;
      top: 30%;
	}
	.dropdown-menu .dropdown-menu{
		margin-left:0; margin-right: 0;
	}
	.dropdown-menu li{
		position: relative;
	}
	.nav-item .submenu{ 
		display: none;
		position: absolute;
		left:100%; top:-7px;
	}
	.nav-item .submenu-left{ 
		right:100%; left:auto;
	}
	.dropdown-menu > li:hover{ background-color: #f1f1f1 }
	.dropdown-menu > li:hover > .submenu{
		display: block;
	}
}

/* mobile screen css */


 

  @media only screen and (min-width: 960px) {
    /* styles for browsers larger than 960px; */

    #features{
      position: relative;
      top: -15px;
   padding-right:5% ;
   padding-left:5% ;
     }

    
     #features i{
      font-size:x-large;
      color:var(--jaysan_dark_green);
      margin-right: 13px;
     
      }

      #about{
        padding: 30px;
        background-color: rgba(128, 128, 128, 0.03)
      }
      #about1 video{

        max-width: 790px;
          
         
                
        }


        #goals i{
          font-size: 3.5rem;
        margin-bottom: 20px;
          color: var(--jaysan_dark_green)
        }

       

}
@media only screen and (min-width: 1440px) {
    /* styles for browsers larger than 1440px; */
}
@media only screen and (min-width: 2000px) {
    /* for sumo sized (mac) screens */
}
@media only screen and (max-device-width: 480px) {
   /* styles for mobile browsers smaller than 480px; (iPhone) */

   .mobile_welcome{
    background-color:rgba(221, 219, 216, 0.5);
    color: #297118;
    font-weight: bold;
   }
  .main_top_sec .mobile_topbar {
    background-color: rgba(251, 251, 251,0);
    margin: 0;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 2px;
    padding-right: 2px;
      }

      .main_top_sec
      {
        padding: 0;
        margin: 0;
    
        
      }

.mobile_menu_bar{
  background-color: #2b8916;
  color: white;
}
.mobile_menu_bar i{
  font-size: x-large;
}

#jaysan_sidebar .offcanvas-body .active{
background-color:rgba(45, 173, 10, 0.2);
color: black;
border: solid 2px #fb9f0c;

}
#jaysan_sidebar{
  z-index: 5500;
  width: 75%;
  
}
 
#sidebar .offcanvas-header{
background-color: rgb(251, 159, 12);
color: white;
font-size: larger;
}
#sidebar .list-group-item{
  padding-top: 14px;
  padding-bottom: 14px;
  
}

#features{
 margin-top: 1px;
 width: 100%;
 }

#features .col-sm-4{
  padding: 13px;

       
            }

 



    
 
 


 #features .col-sm-4.one{
  background-color: #F6F9FF;
 
  border-top: 1px solid ;
     
          }

          #features i{
            font-size:xx-large;
            color:var(--jaysan_dark_green);
            margin-right: 20px;
           
            }

            #about1 video{

              max-width: 350px;
               
              }
              #goals i{
                font-size: 2rem;
              margin-bottom: 10px;
                color: var(--jaysan_dark_green)
              }

              #goals h5{
              font-size: small;
              }

#mobile_features .card{
  background-color: rgba(251, 159, 12, 0.281);
  
}

#mobile_features .card-title{
  background-color:#2CAD0A;
  color: white;
  
}



#mf_contact .card-title{
  background-color: #2CAD0A;
  color: white;


}

#mf_link .card-title{
  background-color: #fb9f0c;
  color: white;


}

#mf_link .card{
  background-color: rgba(136, 136, 136, 0.09);
}

#mf_link a{
  
  text-decoration: none;
display: block;
width: 100%;
background-color: transparent;
padding-top: 2px;
padding-bottom: 2px;
color: black;
}


#mf_link i{
  
  font-size: small;
  color: #fb9f0c


}


#mf_about .card-title{
  background-color:#297118;
  color: white;


}

.he{
  max-height: 65vh;

  overflow:hidden; 
}


.he1{
  max-height: 35vh;
  margin: auto;
 
}

.he2{
  max-height: 15vh;
 
}
.work_class{
  max-height:45vh;
 overflow-y: scroll;
}

#product_fea >.col-6 {


margin-top: 50px;
}

.web_card{
  width: 35vh !important;
  
 }
  
 .web_card > img{
  height: 40vh !important;
   
 }
  


}

@media only screen and (device-width: 768px) {
   /* default iPad screens */
}
/* different techniques for iPad screening */
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  /* For portrait layouts only */
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
  /* For landscape layouts only */
}


.web_card{
  width: 30vh !important;
  
 }
  
 .web_card > img{
  height: 30vh !important;
   
 }

 .web_card1{
  width:14rem !important;
  
 }
  
 .web_card1 > img{

  height: 14rem;
 }
.blink {
  animation: blinker 1s linear infinite;
}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}
/*------------------------------------------ topbar----------------------- */
#topbar{
   background-color: var(--saaral_green);
  
   padding : 2px 0 2px 0;
   
}
#topbar  p
{
   margin-top: auto;
   margin-bottom: auto;
   font-size: small;
    margin-left: 10px;
   
    
}



.ui-autocomplete {

  width: fit-content;
  color: whitesmoke;
  background-color:var(--saaral_green)
}

.ui-menu-item .ui-menu-item-wrapper:hover
{
    border: none !important;
    background-color:yellowgreen;
    color: #F6F9FF;
}

#social i:hover{
    color: #f3495a;
   
    
}

#social a{
  color: rgb(249, 244, 245);
 
  
}

.phone_social a{
  color: rgb(249, 244, 245);
 
  
}


/* ---------------------------------------maintopbar--------------------------------------- */



.main_top_sec img{
   
    height: 60px;
    

}

.search{
    position: relative;
    
      
    }

    .search input{

     height: 50px;
     text-indent: 25px;
     border: 2px solid var(--jaysan_light_green);
     border-radius: 30px;

    }


    .search input:focus{

     box-shadow: none;
     border: 2px solid var(--jaysan_dark_green);


    }

    .search .fa-search{

     position: absolute;
     top: 20px;
     left: 16px;

    }

    .search button{

     position: absolute;
     top: 5px;
     right: 5px;
     height: 40px;
     width: 100px;
     background: var(--saaral_gray);
     border-radius: 30px;

    }

    .search button:hover
    {
        background-color: var(--jaysan_light_green);
    }

   
      .user_login{
        z-index:5000 ;
       
      }


      .user_login i{
        font-size: larger;
       
      }

  
    option {
      background:#fff;
      color:#000;
      z-index: 100;
    }
    
    
  
     
    body {
        top: 0px !important;
    }

      /*---------------- navigation bar--------------------------------------------------------------------- */

    
      .mrequired:after {
        content: "  *";
          color: red;
          font-weight: bolder;
          margin-left: 5px;
      }

      .login_style{
        background-color: rgba(135, 207, 235, 0.4);
    }
    
    .silder{
        
        overflow:auto;
        
        
    }

    .slick-prev {
        left: -2% !important;
        z-index: 1;
      }
      .slick-next {
        right: -2% !important;
        z-index: 1;
      }
      
      .slick-prev:before, .slick-next:before {
        color: var(--jaysan_dark_green) !important;
      }
      
      .saaral_contact {
        
         
    background: url('images/saaral.jpg') ;
   background-repeat: no-repeat;
   background-size: cover;

   background-position: center;
    z-index:-1;
    height: 250px;
      }
      


      .jaysan_slider{
        box-sizing: border-box;
         
    background: url('images/saaral_slider_back.avif') repeat;
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
    z-index:-1;
    height: 420px;
      }

      .jaysan_slider img{

        height: 380px;
        margin:auto;
        
      }

     

      #demo_video_sec .demo_video_div{

        z-index: 1200;
       
       }
     



        
     
       

      















@-webkit-keyframes pulsate1 {
  0% {
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
    opacity: 1;
    box-shadow: inset 0px 0px 25px 3px rgba(255, 255, 255, 0.75), 0px 0px 25px 10px rgba(255, 255, 255, 0.75);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0;
    box-shadow: none;

  }
}

@keyframes pulsate1 {
  0% {
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
    opacity: 1;
    box-shadow: inset 0px 0px 25px 3px rgba(255, 255, 255, 0.75), 0px 0px 25px 10px rgba(255, 255, 255, 0.75);
  }
  100% {
    -webkit-transform: scale(1, 1);
    transform: scale(1);
    opacity: 0;
    box-shadow: none;

  }
}













 #fade {
  display: block;
  position: fixed;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  background-color: black;
  z-index: 1001;
  -moz-opacity: 0.8;
  opacity: .80;
  filter: alpha(opacity=80);
}


.title_bg
{
  background-color: #2CAD0A;
  color: white;

}


.zoom {
 
  transition: transform .1s;
 
}

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





.slick-slide {
  margin: 0 10px;

}


.he{
  max-height: 70vh;

  overflow:hidden; 
}


.he1{
  max-height: 50vh;
  margin: auto;
 
}

.he2{
  max-height: 15vh;
 
}


.box{
  box-sizing: border-box;
}


.mhi{
max-height: 90px;
}




.port-image
{
    width: 100%;
}

.gallery_product
{
    margin-bottom: 30px;
}

#videos img{
 max-height: 30vh;
  width: 100%;
  border: solid 0.3px rgba(128, 128, 128, 0.4);
  padding: 4px;
  border-radius: 5px;
}
.crop-text-3 {
  -webkit-line-clamp: 3;
  overflow : hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}

#product{
  background-color: rgba(136, 136, 136, 0.1);
}

#saaral_product {
  margin-top: 25px;
  margin-bottom: 25px;

}
#saaral_product .news_title{
  background-color:#2CAD0A;
  color: white;

}

#saaral_product .content{
  background-color: rgba(128, 128, 128, 0.79);
}

#saaral_product img {

height: 150px;
}

.saaral_utractor img {

  height: 120px;
  }
#saaral_testimonial {
  margin-top: 25px;
  margin-bottom: 25px;

}
#saaral_testimonial .news_title{
  background-color:#2CAD0A;
  color: white;

}

#saaral_testimonial .content{
  background-color: rgba(128, 128, 128, 0.79);
}

#saaral_testimonial img {

height: 250px;
}


#testimonial {
  margin-top: 25px;
  margin-bottom: 25px;

}
#testimonial .news_title{
  background-color:var(--jaysan_orange);
  color: white;

}

#testimonial .content{
  background-color: rgba(128, 128, 128, 0.79);
}

#testimonial img {

height: 230px;
}



  #make_india{
    margin-top: 20px;

  background-color: rgba(238, 151, 12, 0.555);


  }


  #make_india .card-body{
    padding-top: 20px;
    text-align:center
  }

  #make_india h5 ,
  #make_india h6,
  #make_india p{
    font-weight: bold;
    margin-bottom: 10px;
  }

  #make_india p{
    font-size: medium;
  }

  #make_india button{
    text-decoration: underline;
   
  }

#phone{
  background-color: #2CAD0A;
}
  #phone  i{
    font-size: 1.9rem;
  margin-bottom: 10px;
    color: var(--jaysan_orange)
  }
  

 .hover-underline-animation {
  display: inline-block;
  position: relative;
  color:black
}

.hover-underline-animation::after {
  content: '';
  position: absolute;

  width: 100%;
  transform: scaleX(0);
  height: 1.5px;
  bottom: 0;
  left: 0;
  background-color:var(--jaysan_light_green);
  transform-origin: bottom right;
  transition: transform 0.25s ease-out;
}

.hover-underline-animation:hover::after {
  transform: scaleX(1);
  transform-origin: bottom left;
}
  
  #footer{
background-color:rgba(211, 211, 211, 0.15);
  padding-top: 15px;
 

}


  
#footer .col-sm-3:not(:last-child){
 border-right: solid 1px rgba(0, 0, 0, 0.3);

}


#footer .col-sm-3{

 padding-left: auto;
 padding-right: auto;

 }

#footer a{

 color: var(--jaysan_orange);
 text-decoration: none;

}

#footer a:hover {

font-weight: bold;

color: var(--jaysan_orange);

 }
 
 


#footer .card{
  border: none;
 align-items: center;
background-color: transparent;
}

 #footer .card-title{
   font-weight: bold;

     }

     #footer h6,
     #footer h5{
      font-weight: bold;
  font-size: large;
     }

     #footer p{
      font-size: medium;
      padding: 0;
      margin: 0;
  
     }

     #footer .card-body{
     padding-left: 0;
     margin-top: 0;
     padding-top: 0 ;

background-color: transparent;
     }

     #footer .quick_links i{
margin-right: 10px;
    }


    #footer .product_footer i{
      margin-right: 10px;
    
          }


    #footer #link{
      margin-top: 3px;
      font-size: medium;
          
    }


    #footer .about_footer p{
text-align: justify;

    }

     #link i{
      font-size: x-small;
          
    }

    .button_footer .btn{
      margin-top: 15px;
      border-radius: 0;
      background-color: var(--jaysan_orange);
    }


    #info p{
      text-align: justify;
    }

    #info .container-fluid{
      padding-left: 20px;
      padding-right: 20px;
      border-bottom: 3px solid var(--jaysan_orange);
    }


    
    #md_msg img{
      max-height: 95vh;
      
    }


    .csr_info #csr_title{
      text-align: center;
    }

    .csr_info p{
   text-align: justify;
    }

    .csr_details .container-fluid{
      margin-bottom: 20px;
    }


    .csr_details .card{
      border: none;
    }

    .csr_details .card{
      border: none;

      
    }
    #his_video video{ 
     height: 400px;
     width: 100%;
      margin: 0;
      padding: 0;
    }

    #his_video .container-fluid{
      margin-bottom: 25px;
      width: 100%;

padding: 0;

    }

#recent_post ul {
  list-style: none;
}

.blog a {
text-decoration: none;
color: rgba(0, 0, 0, 0.822);
}


.blog_single_img{
  max-height: 50vh;
  
}

.blog_line{
  line-height: 1.6rem;
  word-spacing: 0.16rem;

}
#recent_post ul li::before {
  content: "\2022";
  color: red;
  font-weight: bold;
  display: inline-block; 
  width: 1em;
  margin-left: -1em;
}


#product_breif ul {
  list-style: none;
  line-height: 2rem;

}
#product_breif ul li:before {
  content: '✓';
  color: red;
  font-weight: bold;
  display: inline-block; 
  width: 1em;
  margin-left: -1em;
}



#about ul {
  list-style: none;
  line-height: 2rem;

}
#about ul li:before {
  content: '✓';
  color: red;
  font-weight: bold;
  display: inline-block; 
  width: 1em;
  margin-left: -1em;
}
    #profile p{
      text-align: justify;
    }

    #profile .card{
      border: none;

    }

  

 #vision img{
height: 35vh;
 }



 #vision p{
  text-align: justify;

 }


 #management > h4, 
 #management > h6{
  text-align: center;
 
 }
 #management h4{

 margin-bottom: 20px;
text-decoration: underline;
padding-bottom: 10px;
color: var(--jaysan_orange)
}

#management {

  margin-bottom: 20px;
 
 padding-bottom: 10px;

 }
 

#management .card img{
  width:150px;
  height:150px;
  border-radius: 50%;
margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
 }

 #management .card{
  margin-top: 20px;
border: none;
  box-shadow: 2px 2px 2px 2px rgba(136, 136, 136, 0.1);
 }

 #management .card-body{
text-align: center;


 }

 #management .card-body p{
  font-size: small;
margin-bottom: 5px;
   }

   #management .card-body a{
    font-size: xx-large;
  margin-right: 5px;
  margin-top: 15px;
  text-decoration: none;
 
  align-items: center;
  text-align: center;
     }
     #management .card-body i:hover {
    color: #fb9f0c;
     }

#infra img{
  max-height: 70vh;

}

     #blogs h5{
      text-align: center;
      text-decoration: underline;
      margin-bottom: 20px;
     }

     #blogs p{
      text-align: justify;
      margin-bottom: 15px;
     }


     #blogs img{
      width: 30vw;
    height: 100%;
    
    margin: auto;
     }
     #blogs .btitle{
      border-bottom: 0.5px solid;
      margin-bottom: 20px;
     }
     
     #blogs h6{
      margin-bottom: 25px;
      margin-top: 15px;
    
     }

     #blogs .card{
     border: none;
    
     }

     #blogs .card button{
     border: none;
      margin-left: 25px;
      background-color: white;
      color: var(--jaysan_orange);
    
      }

     #blogs .card-body p{
    text-align: justify;
    text-indent: 25px;

    
     }