/* File Name : style1.css
				   Description : Style File */
 

body{
    width: 100%;
    height: auto;
    margin: 0px; /*Space from this element (entire page) and others*/
    padding : 0px; /*space from content and border*/
    font-family:verdana;
    background-color:#f9fef6;
    display:block;
    box-sizing: border-box;
    position:relative;
    overflow-y : auto;	
}

/* FULL PAGE LOADER */
 
/* FULL SCREEN LOADER */
#page-loader{
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);

    display: flex;
    align-items: center;
    justify-content: center;

    z-index: 999999;

    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease;
}

#page-loader.show{
    opacity: 1;
    visibility: visible;
}

/* LOGO WRAPPER (STATIC) */
.logo-ring{
    position: relative;
    width: 90px;
    height: 90px;

    display: flex;
    align-items: center;
    justify-content: center;
}

/* ROTATING RING ONLY */
.logo-ring::before{
    content: "";
    position: absolute;
    inset: 0;

    border-radius: 50%;
    border: 4px solid #cfe8a9;
    border-top-color: #2f7d32;

    animation: ring-spin 1s linear infinite;
}

/* LOGO – FIXED (NEVER ROTATES) */
.logo-center{
    width: 65px;
    height: 65px;
    object-fit: contain;
    z-index: 1;
}

/* RING ROTATION */
@keyframes ring-spin{
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

 
/* Mobile menu icon fix */
#show_filter,
#hide_filter {
  z-index: 9999 !important;
}

@media (max-width: 768px) {
  #show_filter,
  #hide_filter {
    top: 66px !important;
    z-index: 9999 !important;
  }
}

/*------------------  Header - Css -------------- */
		
.header {
 position : fixed;
 top:0px;
 left:0px;
 right:100px;
  background-image :linear-gradient(315deg, #b7e176 30%, #225902 70%); 
  /*background-image: url('header.jpg');
  background-repeat: no-repeat;
  background-size:cover;*/
}


/* LEFT → RIGHT SOFT ANIMATION */
/* ===============================
   HEADER BOTTOM ANIMATED LINE
================================ */

.header-animated-line {
  position: fixed;
  width: 100%;
  height: 2px;
  background: rgba(47, 93, 20, 0.15); /* soft base shadow */
  overflow: hidden;
  top:100px;
}

/* MOVING LINE */
.header-animated-line::before {
  content: "";
  position: absolute;
  top: 0;
  left: -40%;
  width: 40%;
  height: 100%;

  background: linear-gradient(
    90deg,
    transparent,
    #7fbf2f,
    #2f5d14,
    #7fbf2f,
    transparent
  );

  animation: headerLineMove 3s linear infinite;
}

/* ANIMATION */
@keyframes headerLineMove {
  from {
    left: -40%;
  }
  to {
    left: 100%;
  }
}


			/* Footer */
div.footer{
  position: absolute;
  color:navy;
  text-align:left;
  padding:5px;
  bottom:5px;
  width:auto; 
  right:4px;
  left:4px;
  height: 60px;
  font-size: 13px;
  background-color:skyblue;
} 


		/* UL basic Style */ 
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;  
 }
.icon{
    font-size:24px;
}
li {
  float: left;
  display:inline-block;
  font-size:14px;
}

li a {
  display: block;
  color: black;
  text-align: center;
  padding: 0px 3px;
  text-decoration: none;
}

.sel_menu
{
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
   padding : 2px;
   background-color: #053c72;
}

.menu1
{
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
   border-bottom-left-radius: 5px;
   border-bottom-right-radius: 5px;
   padding:2px;
}

/*------------------  Divison (2) - Css -------------- */

.div2 {
 width:auto;
 height: auto;
 text-align:center;
 display: flex;
 align-items: center;
 justify-content: center;
 /*background-color: #aed85f1f;*/
 background-image: url('png/div2_bg.png');
 background-repeat: no-repeat;
 background-size:cover;
 margin-top:30px;
 padding-left:30px;
 padding-right:30px;
}

.signin_div {
 text-align:center;
 /*background-color: #aed85f1f;*/
 /*background-image: url('png/div2_bg.png');
 background-repeat: no-repeat;
 background-size:cover;*/
 width:auto;
 margin:5px;
 display: flex;
 align-items: center;
 justify-content: center;
  }

.div2_next {
 width:auto;
 height: auto;
 text-align:center;
 /*background-color: #aed85f1f;*/
 background-image: url('png/div2_bg.png');
 background-repeat: no-repeat;
 background-size:cover;
 margin-top:30px;
 padding-left:30px;
 padding-right:20px;
 padding-top:20px;
 padding-bottom:20px;
}

.div2_top_deal {
 width:auto;
 height: auto;
 text-align:center;
 /*background-color: #aed85f1f;*/
 background-color: #f9fef6;
 /*background-image: url('png/div2_bg.png');
 background-repeat: no-repeat;
 background-size:cover;*/
 margin-top:30px;
 padding-left:30px;
 padding-right:30px;
 padding-bottom:5px;
box-shadow: rgb(95, 145, 50) 0px 3px 10px;
}

.out_border
{
   background-color:#aed85f61;
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
   padding : 5px;
}

.div2_ul
{
  list-style-type: none;
  overflow: hidden;  
  padding : 5px;
 
}

.div2_ul li
{
	text-align:left;
	 
}

.div2_ul li a
{
	text-decoration: none;
}

.label_small_txt
{
	font-size:14px;
	margin-left:5px;
	color:navy;
}

.label_head_txt
{
	font-size:14px;
	font-weight:bold;
	color:black;
}

.div2_slide_inner_div
{
	background-color:#ffffff96;
	max-width:850px;
	min-height:250px;
}

#tb_inner_div2{
  border-collapse: collapse;
  font-size:14px;
  color:black;
   
  margin-left:33px;
  margin-right:33px;
  
}

#tb_inner_div2 td
{
  font-size:14px;
  color:black;
}
 
#tb_inner_div2 th {
  padding-top: 6px;
  padding-bottom:6px;
  text-align: center;
  background-color: #99b5ff;
  color:black;
  font-size:13px;
  /*max-width:750px;
  min-width:750px;*/
  
}	

/*----- Slide Menu ----*/

.slide_menu {
  overflow: hidden;
  color:black;
  font-size:13px;
  font-weight:bold;
  margin:5px;
  height:50px;
  padding-top:10px;
  margin-left:30px;
}

.slide_menu a {
  float: left;
  color: black;
  text-align: center;
  padding: 7px 9px;
  text-decoration: none;
  font-size: 14px;
}

.slide_menu a:hover {
  color: blue; 
}

.slide_menu a.active {
  color: black;
  border-bottom:3px solid Navy;
}



/*------------------  Divison (3) - Css -------------- */

.div3 {
 width:auto;
 height:auto;
 text-align:center;
 background-image: url('div3_bg.png');
 background-size:cover; 
 padding-left:30px;
 padding-right:30px;
 margin-top:20px;
 
}

/*------------------  Divison (4) - Css -------------- */

.div4 {
 width:auto;
 height:auto;
 text-align:center;
 background-color :#68874645;
 padding-left:30px;
 padding-right:30px;
 margin-top:20px;
 
}

/*------------------  Divison (5) - Css -------------- */

.div5 {
 width:auto;
 height:auto;
 text-align:center;
 /*background-color : #add85f47;*/
 background-color:#f9fef6;
 padding-left:5px;
 padding-right:5px;
 /*margin-top:20px;*/
 padding-top:5px;
 padding-bottom:15px;
}

/* ------------------------------ div6 -------------------------------------- */
.div6{
 width: 100%;
 /*background-image: url('png/footer_bg.png');
 background-repeat: no-repeat;
 background-size:cover;*/
 /*background-image :linear-gradient(315deg, #01143e 30%, #0870af 70%); */
 text-align:center;			 
}

/* ------------------------------ div6 -------------------------------------- */
.div6_footer{
 width: 100%;
 height:200px; 
 position:absolute;
 bottom:0px;
 left:0px;
 right : 0px;
 background-image: url('png/footer_bg.png');
 background-repeat: no-repeat;
 background-size:cover;
 /*background-image :linear-gradient(315deg, #01143e 30%, #0870af 70%); */
 text-align:center;			 
}
	

ul#tmenu li {
    display:block;
    float: right;
 
}

ul#tmenu li a {
    color: #477b1f;
    padding: 0px 1px 0px 1px;
    font-size: 26px;
    text-decoration: none;
    /*vertical-align: 1px;*/
    border-radius: 10px 10px;
}

ul#tmenu li a:hover {
    /*color: #8cf4ff;*/
     color:darkgreen;
     cursor:pointer;
}

ul#tmenu1{
 height:60px;
 width:400px;
}
ul#tmenu1 li {
     float: left;
}

ul#tmenu1 li a {
    color: #477b1f;
    padding: 0px 1px 0px 1px;
    font-size: 26px;
    text-decoration: none;
    /*vertical-align: 1px;*/
    border-radius: 10px 10px;
}

ul#tmenu1 li a:hover {
    /*color: #8cf4ff;*/
     color:darkgreen;
     cursor:pointer;
}


#navbar {
	overflow: hidden;
	/*padding: 5px 10px;*/
	transition: 0.4s;
	position: fixed;
	left : 0;
	right:100px;
	top: 0;
	 /* z-index: 1000;*/
        height:30px;
	background-image :linear-gradient(315deg, #b1f04fb8 30%, #225902 70%); 
}

#navbar a {
	float: left;
	/*color: #00839d;*/
	 
	text-align: center;
	padding: 3px 5px;
	text-decoration: none; 
	line-height: 25px;
	border-radius: 4px;
}
 
.topnav_menu {
	overflow: hidden;
	margin-top:10px;
        float:right;
        margin-right:10px;

}

.topnav_menu a {
	float: left;
	display: block;
	color: darkgreen;
	text-align: center;
	padding: 8px 10px;
	text-decoration: none;
	font-size: 14px;
	border-bottom: 3px solid transparent;
}

.topnav_menu a:hover {
	border-bottom: 3px solid darkgreen;
}

.topnav_menu a.active {
	border-bottom: 3px solid #97ce41;
}

.topnav_menu1 {
	overflow: hidden;
	margin-top:10px;
        float:right;
        margin-right:10px;

}

.topnav_menu1 a {
	float: left;
	display: block;
	/*color: #477b1f;*/
	color: #477b1f;
	text-align: center;
	padding: 8px 10px;
	text-decoration: none;
	font-size: 14px;
	border-bottom: 3px solid transparent;
	margin-top:3px;
}

.topnav_menu1 a:hover {
	color:#629434;
}

.topnav_menu1 a.active {
	color:darkgreen;
}
 

 	


#icon{
	background-color :  #97ce41;
	color :  darkgreen;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	font-size : 16px;
	padding:4px;
	 
}
			
#icon:hover
{
	/*background-color :  #aed85fc4;
	color :  darkgreen;*/
	background-color : #58941e;
	color:white;

}

#icon_invisible{
	background-color :  #97ce41;
	color :  darkgreen;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	font-size : 16px;
	padding:4px;
	 
}

#icon1{
	background-color : #58941e;
	color:white;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	font-size : 20px;
	padding : 7px;
}
			
#icon1:hover
{
	background-color :  #aed85fc4;
	color :  darkgreen;
}
		
.sm_navbar {
  width: 100%;
  overflow: auto; background-color: white;
  display: flex;
 align-items: center;
 justify-content: center;
  margin-top:20px;
}

.sm_navbar a {
  float: left;
  padding: 12px;
  width:100px;
  color: white;
  text-decoration: none;
  font-size: 17px;
  margin-left : 5px;
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
  border-bottom-left-radius: 25px;
  border-bottom-right-radius: 25px;
    background-color:#ccc;
}

.sm_navbar a:hover {
  background-color: green;
}

.sm_active {
  background-color: #04AA6D;
}

.zoom_sml {
  padding: 2px;
  background-color: #e7f5cc99;
  transition: transform .2s;
  width: 50px;
  height: 50px;
 
  border : 2px solid #aed85fc4;
  border-top-left-radius: 7px;
  border-top-right-radius: 7px;
  border-bottom-left-radius: 7px;
  border-bottom-right-radius: 7px;
}		

.zoom {
  padding: 20px;
  background-color: #e7f5cc99;
  transition: transform .2s;
  width: 170px;
  height: 170px;
  margin: 20px;
  border : 7px solid #aed85fc4;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
}

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

.zoom2 {
  padding: 8px;
  background-color: #e7f5cc99;
  transition: transform .2s;
  width: 80px;
  height: 80px;
  margin: 10px;
  border : 3px solid #aed85fc4;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
}

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


.sprod_zoom {
  padding: 2px;
  background-color: #e7f5cc99;
  transition: transform .2s;
  width: 120px;
  height: 183px;
  margin: 5px;
  border :2px solid #aed85fc4;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
}

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

.sprod_zoom1 {
  padding: 2px;
  background-color: #e7f5cc99;
  transition: transform .2s;
  width: 500px;
  height: 50px;
  margin: 5px;
  border :2px solid #aed85fc4;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
  
.zoom1 {
  padding: 5px;
  /*background-color: #add85f4f;*/
  /*background-color:#f3fde6;*/
  background-color:#cfe4828f;
  transition: transform .2s;
  max-width: 150px;
  /*width:250px;*/
  height: auto;
  margin: 10px;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  margin-left:5px;
}

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

#mySidenav a {
  position: fixed;
  left: -100px;
  transition: 0.3s;
  padding: 10px; 
  padding-right:10px;
  width: 120px;
  text-decoration: none;
  font-size: 18px;
  color: white;
  border-radius: 0 5px 5px 0; 
  background-color: #77b912;
  font-family:verdana;
  display: block;
  text-align: right; 
  transition: all 0.3s ease;
  color: white;
  font-size: 16px;
}

#mySidenav a:hover {
  left: 0;
  background-color: #579418;
  color:white;
  font-weight:bold;
  text-align:left;
}

#home {
  top: 110px;
  //background-color:aliceblue;
}	
#home:hover:after 
{
  left: 0;
  background-color: #579418;
  color:white;
  font-weight:bold;
  content : "Home";
  text-align:center;
  margin-left:10px;
}

#ev_about {
  top: 160px;
  //background-color:aliceblue;
}	
#ev_about:hover:after 
{
  left: 0;
  background-color: #579418;
  color:white;
  font-weight:bold;
  content : "About";
  text-align:center;
  margin-left:10px;
}

#product {
  top: 210px;
  //background-color:aliceblue;
}	
#product:hover:after 
{
  left: 0;
  background-color: #579418;
  color:white;
  font-weight:bold;
  content : "Products";
  text-align:center;
  margin-left:10px;
}


#search {
  top: 260px;
  //background-color:aliceblue;
}	
#search:hover:after 
{
  left: 0;
  background-color:#579418;
  color:white;
  font-weight:bold;
  content : "Search";
  text-align:center;
  margin-left:10px;
}

#shop {
  top: 310px;
  //background-color:aliceblue;
}	
#shop:hover:after 
{
  left: 0;
  background-color:#579418;
  color:white;
  font-weight:bold;
  content : "Check OUT";
  text-align:center;
  margin-left:10px;
}

#fav {
	top: 360px;
	//background-color:aliceblue;
}	
#fav:hover:after 
{
  left: 0;
  background-color:#579418;
  color:white;
  font-weight:bold;
  content : "Favorites";
  text-align:center;
  margin-left:10px;
}
#hlp {
  top: 410px;
  //background-color:aliceblue;
}	
#hlp:hover:after 
{
  left: 0;
  background-color:#579418;
  color:white;
  font-weight:bold;
  content : "Help";
  text-align:center;
  margin-left:10px;
}

#sout {
  top: 460px;
  //background-color:aliceblue;
}	
#sout:hover:after 
{
  left: 0;
  background-color:#579418;
  color:white;
  font-weight:bold;
  content : "Sign Out";
  text-align:center;
  margin-left:10px;
}

 
/* Form Validation */
 
/*input[type=email], input[type=password], input[type=text] {
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: none;

  border-bottom:1px solid silver;
  background-color:#d6f2b300;
  box-sizing: border-box;
  outline: none;
  font-size:15px;
  width:350px;
}*/
 
button#sign_in {
  background-color: #85bf2c;
  color: white;
  padding: 6px 12px;
  margin: 5px 0;

  border: none;
  cursor: pointer;
  width: 100%;
  border-radius:10px;
  font-size:17px;
  width:250px;
  font-weight:bold;
}

button#sign_in:hover {
  background-color:darkgreen;
  font-weight:normal;
}


button#org_btn {
  background-color: #f1af39;
  color: white;
  padding: 6px 12px;
  margin: 5px 0;

  border: none;
  cursor: pointer;
  width: 100%;
  border-radius:10px;
  font-size:17px;
  width:250px;
  font-weight:bold;
}

button#org_btn:hover {
  background-color:#d38f17;
  font-weight:normal;
}


button#save {
  background-color: #85bf2c;
  color: white;
  padding: 4px 8px;
  margin: 5px 0;

  border: none;
  cursor: pointer;
  width: 100px;
  border-radius:10px;
  font-size:17px;
  
  font-weight:bold;
}

button#save:hover {
  background-color:darkgreen;
  font-weight:normal;
}


span.psw {
  float: right;
  padding-top: 16px;
}

/* Error Message Container */

.container1 {
  padding: 16px;
  background-color: #f4cccc;
  border: 1px solid tomato;
  margin:auto;
 position: absolute;
 max-width:300px;
 max-height:200px;
 top: 20%;
 left: 10%;
 right: 10%;
width:auto;
border-radius:10px;
}


#button_err {
  background-color: tomato;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  cursor: pointer;
  width: 50%;
  border-radius:20px;
  font-size:15px;
}


#button_err:hover {
  opacity: 0.8;
}

/* Message Container */

.container2 {
  padding: 16px;
  background-color: #ffe3a2;
  border: 2px solid #ffb200;
  margin:auto;
  position: absolute;
  max-width:350px;
  top: 10%;
  left: 10%;
  right: 10%;
  width:auto;
  border-radius : 15px;
  display: flex;
  align-items: center;
  justify-content: center;

}


#button_msg {
  background-color: #ffb200;
  color: black;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  cursor: pointer;
  width: 50%;
  border-radius:20px;
  font-size:15px;
  font-weight:bold;
   

}


#button_msg:hover {
  opacity: 0.8;
}

/* User Dtail Container */

.user_container {
  padding: 5px;
  background-color: #f3f9e9;
  border: 2px solid #acd76d;
  margin:auto;
  position: fixed;
  width:280px;
  top:28px;
  right:100px;
  box-shadow: 0px 3px 6px #5f9132;
  border-radius : 15px;
  min-height:125px;
}

#sout_btn { 
  padding:2px;
  margin:5px;
  border: none;
  cursor: pointer;
  width: 25px;
  height:25px;
  border-radius:5px;
  font-size:13px;
  font-weight:bold;
  background-color: #477b1f;
  color:#afd970;
}

#sout_btn:hover {
  background-color: red;
  /*color:#f0ff05;*/
  color:white;
}

#switch_btn { 
  padding:2px;
  margin:5px;
  border: none;
  cursor: pointer;
  width: 24px;
  height:24px;
  border-radius:5px;
  font-size:13px;
  font-weight:bold;
  background-color: #477b1f;
  color:#afd970;

}

#switch_btn:hover {
  background-color: orange;
  /*color:#f0ff05;*/
  color:black;
}

 
		/* UL Style - Low Level u -  */
/*Begin ---------------------------------------------*/
		
ul#m{   /*id : 'm' indicates menu */
  list-style-type: none;
  padding-left:4px;
  overflow: hidden;  
  height:24px;
  margin-left:3px;
  margin-right:3px;
  background-color : #b4e36a73;
  padding:0px;
  
}

ul#m li {
  float: left;
}

ul#m li a {
  display: block;
  color: black;
  text-align: center;
  padding: 2px 10px;
  text-decoration: none;
}

ul#m li a:hover{
	background-color: gray;
	border-top-left-radius: 10px;
   border-top-right-radius: 10px;
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
}
ul#m li button:hover{
cursor:pointer;
}
ul#m li .icon{
    text-align: center;
}

form.example{
	width:350px;
}
form.example input[type=text] {
  
  font-size: 14px;
  border: none;
  float: left;
  width: 80%;
  background: #e4f1cd;
  height:29px;
  outline:none;
  padding-left:10px;
 
}

form.example .exbut {
  float: left;
  width: 10%;
 
  /*background:#417904;*/
  /*background : #97ce41;*/
  background:#c8e19d;
  color: darkgreen;
  font-size: 17px;
  
  border-left: none;
  cursor: pointer;
   height:29px;
  

 font-weight:bold;
 outline:none;
 border:none;
 border-top:none;
}

form.example .exbut:hover {
  background: #477c1f;
  color:white;
  border:1px solid #88bc38;
}

form.example .exbutcl {
  float: left;
  width: 10%;
 
  /*background:#417904;*/
  /*background : #97ce41;*/
  background:#c8e19d;
  color: red;
  font-size: 17px;
  
  border-left: none;
  cursor: pointer;
   height:29px;
  

 font-weight:bold;
 outline:none;
 border:none;
 border-top:none;
}

form.example .exbutcl:hover {
  background: #ff5b5b;
  color:white;
  border:1px solid #88bc38;
}

form.example .exbut1 {
  float: left;
  width: 10%;
 
  /*background:#417904;*/
  /*background : #97ce41;*/
  background:#c8e19d;
  color: darkgreen;
  font-size: 15px;
  
  border-left: none;
  cursor: pointer;
   height:29px;
  

 font-weight:bold;
 outline:none;
 border:none;
 border-top:none;
}

form.example .exbut1:hover {
  background: #c8e19d;
  cursor:auto;
}

form.example::after {
  content: "";
  clear: both;
  display: table;
}


/* Mobile View*/
form.example1{
	width:210px;
	height:45px;
}
form.example1 input[type=text] {
  
  font-size: 14px;
  border: none;
  float: left;
  width: 80%;
  background: #e4f1cd;
  height:29px;
  outline:none;
  padding-left:10px;
 
}

form.example1 .exbut {
  float: left;
  width: 10%;
 
  /*background:#417904;*/
  /*background : #97ce41;*/
  /*background:#abc77a;*/
  background-color: #b7e176;
  color: darkgreen;
  font-size: 15px;
  
  border-left: none;
  cursor: pointer;
   height:29px;
  

 font-weight:bold;
 outline:none;
 border:none;
 border-top:none;
}

form.example1 .exbut:hover {
  background: #477c1f;
  color:white;
  border:1px solid #88bc38;
}

form.example1 .exbutcl {
  float: left;
  width: 10%;
 
  background-color: #b7e176;
  color: red;
  font-size: 25px;
  
  border-left: none;
  cursor: pointer;
   height:29px;
  

 font-weight:bold;
 outline:none;
 border:none;
 border-top:none;
}

form.example1 .exbutcl:hover {
  background: #ff5b5b;
  color:white;
  border:1px solid #88bc38;
}

/*form.example1 .exbut1 {
  float: left;
  width: 10%;

  background:#c8e19d;
  color: darkgreen;
  font-size: 17px;
  
  border-left: none;
  cursor: pointer;
   height:29px;
  

 font-weight:bold;
 outline:none;
 border:none;
 border-top:none;
}

form.example1 .exbut1:hover {
  background: #c8e19d;
  cursor:auto;
}*/

form.example1::after {
  content: "";
  clear: both;
  display: table;
}


.button1 {
  background-color: #fb560096;
  color: white;
  padding: 10px 20px;
  margin: 8px 0;
  border: none;
  cursor: pointer;
  width: 100%;
  border-radius:20px;
  font-size:17px;
  width:250px;
  
}

.button2 {
  background-color: #85bf2c;
  color: white;
  padding: 10px 20px;
  margin: 8px 0;
  border: none;
  cursor: pointer;
  width: 100%;
  border-radius:20px;
  font-size:17px;
  width:250px;
  
}

#part_sec2 {
	position: absolute;
	overflow-Y :auto;
	width : auto;
	height:auto;
	top : 60px;
	bottom:0px;
	right:0px;	
	left:264px;
	padding:5px;
	margin-left:3px;
	margin-right:3px;
	margin-bottom:2px;
	/*border-left:1px solid silver;*/
	border-right:1px solid silver;
	border-bottom:1px solid silver;
	font-size: 14px;
	text-align: left;
	 
}

#part_sec1 {
	position:fixed;
	width: 250px;
	height:auto;
        /*max-height:500px;*/
	top : 56px;
	bottom:0px;
	right:3px;	
	left:0px;
	padding:5px;
	margin-left:3px;
	margin-right:3px;
	margin-bottom:2px;
	border-left:1px solid silver;
	/*border-right:1px solid silver;*/
	border-bottom:1px solid silver;
	font-size: 14px;
	text-align: left;
        overflow: auto;
	background-color:#f3f9e9;
	margin-top:50px;
     z-index: 1;   /* VERY IMPORTANT */
}

#part_sec3 {
	position:absolute;
	width: 270px;
	height:545px;
        /*max-height:500px;*/
	top : 60px;
	bottom:0px;
	right:3px;	
	left:0px;
	padding:5px;
	margin-left:3px;
	margin-right:3px;
	margin-bottom:2px;
	border-left:1px solid silver;
	/*border-right:1px solid silver;*/
	border-bottom:1px solid silver;
	font-size: 14px;
	text-align: left;
        overflow: auto;
	background-color:#f3f9e9;
	box-shadow: 0px 3px 10px #5f9132;
        
}


#prod_list_filter {
	position:absolute;
	width: 250px;
	height:auto;
	top : 56px;
	bottom:0px;
	right:3px;	
	left:0px;
	padding:5px;
	margin-left:3px;
	margin-right:3px;
	margin-bottom:2px;
	border-left:1px solid silver;
	/*border-right:1px solid silver;*/
	border-bottom:1px solid silver;
	font-size: 14px;
	text-align: left;
        overflow: auto;
	background-color:#f3f9e9;
        padding-top:10px;
}

#prod_list_inner_filter {
	width: 250px;
	height:auto;
	top : 56px;
	bottom:0px;
	right:3px;	
	left:0px;
	padding:5px;
	margin-left:3px;
	margin-right:3px;
	margin-bottom:2px;
	 
	font-size: 14px;
	text-align: left;
        overflow: auto;
	background-color:#f3f9e9;
        
}

#help_part {
	position:fixed;
	width: 300px;
	height:auto;
	top : 95px;
	bottom:100px;
	right:20px;	
	 
	padding:5px;
	margin-left:3px;
	margin-right:3px;
	margin-bottom:2px;
	border-left:1px solid silver;
	/*border-right:1px solid silver;*/
	border-bottom:1px solid silver;
	font-size: 14px;
	text-align: left;
        overflow: auto;
	background-color:#fbfff3;
        padding-top:10px;
	  box-shadow:2px 2px 6px #5f9132;
        border-radius:10px;
}


table#men1{
	border-collapse:collapse;
	font-size:14px;
	font-weight:bold;
}
table#men1 tr,table#men1 td,table#men1 th{
	padding:5px;
}
table#men1 th{
	text-align:left;
	font-size:12px;
}
table#men1 td{
	text-align:left;
	font-size:15px;
}
	
table#men2{
	border-collapse:collapse;
	 font-family:verdana;
	
	
}
table#men2 tr,table#men2 td,table#men2 th{
	padding:7px;
}
table#men2 th{
	text-align:left;
	font-size:11.5px;
        color:grey;
}
table#men2 td{
	text-align:left;
	font-size:13px;
	font-weight:bold;
}

		
table#men{
	border-collapse:collapse;
	font-size:14px;
	font-weight:bold;
}
table#men tr,table#men td,table#men th{
	padding:8px;
}
table#men th{
	text-align:left;
	font-size:12px;
}
table#men td{
	text-align:left;
	font-size:14px;
}

table#small_table{
	border-collapse:collapse;
	font-size:14px;
}
table#small_table tr,table#small_table td,table#small_table th{
	padding:5px;
}
table#small_table th{
	text-align:left;
	font-size:13px;
        font-weight:normal;
}
table#small_table td{
	text-align:left;
	font-size:14px;
}


.sel_menu1
{
	   border-top-left-radius: 10px;
	   border-top-right-radius: 10px;
	   border-bottom-left-radius: 10px;
	   border-bottom-right-radius: 10px;
	   background-color:#c5ff7b47; 
}

.button3 {
	  background-color: #f2ffe270;
	  border-color :  #407906;
	  color:black;
	  font-size: 14px;
         border-radius : 5px
}

.button3:hover {
	background-color: #407906;
	color:white;
	cursor:pointer;
}

.badge {
	/*position: absolute;*/
	 /*top: 27px;
	 right: 295px;*/
         top:35px;
	right:120px;
	padding: 2px 6px 4px 6px;
	 border-radius: 50%;
	 background-color: red;
	 color: white;
	font-size:10px;
	font-weight:bold;
        margin-left:4px;


}

/*.badge {
	 position: absolute;
	 top: 22px;
	 right: 298px;
	 padding: 2px 4px;
	 border-radius: 50%;

	 background-color: red;
	 color: white;
	 font-size:10px;
	font-weight:bold;
        margin-left:4px;
}*/



.sm_scr_badge {
	 position: absolute;
	 top: 25px;
	 right: 135px;
	 padding: 2px 4px;
	 border-radius: 50%;
	 background-color: red;
	 color: white;
	 font-size:11px;
}

.icon_badge
{
	position: absolute;
	 top: 25px;
	 right: 135px;
	 padding: 2px 4px;
	 border-radius: 50%;
	 background-color: red;
	 color: white;
	 font-size:11px;
}

.box_css {
			  width: 70px;
			  padding:3px;
			  margin: 8px 0;
			  box-sizing: border-box;
			  background-color:#b4e36a24;
			  border-radius: 10px;
			  font-weight:bold; 
			
			}
			
			table#lar_table{
				border-collapse:collapse;
				border-radius: 15px;
				border:1px solid #ccc;
			}
						 
			table#lar_table th{
				background-color:#376e0d14;
					color: black;
					padding: 15px;
					font-size:16px;
					/*text-transform: uppercase;*/
					font-weight:normal;
			}

			table#lar_table td{
				text-align: left;
				padding: 8px;
				font-size:14px;
			}

			table#lar_table3{
				border-collapse:collapse;
				border-radius: 15px;
				border:1px solid #ccc; 
			}
						 
			table#lar_table3 th{
				background-color:#376e0d24;
				color: black;
				padding: 5px;
				font-size:14px;
				/*text-transform: uppercase;*/
				font-weight:normal;
			}

			table#lar_table3 td{
				text-align: left;
				padding: 5px;
				font-size:14px;
			}
			
			table#lar_table3_orange{
				border-collapse:collapse;
				border-radius: 15px;
				/*border:1px solid #ccc; */
			}
						 
			table#lar_table3_orange th{
				background-color:#f585052b;
				color: black;
				padding: 5px;
				font-size:14px;
				/*text-transform: uppercase;*/
				font-weight:normal;
			}

			table#lar_table3_orange td{
				text-align: left;
				padding: 5px;
				font-size:14px;
			}
			
			table#lar_table3_yellow{
				border-collapse:collapse;
				border-radius: 15px;
				/*border:1px solid #ccc; */
			}
						 
			table#lar_table3_yellow th{
				background-color:#f5e7052b;
				color: black;
				padding: 5px;
				font-size:14px;
				/*text-transform: uppercase;*/
				font-weight:normal;
			}

			table#lar_table3_yellow td{
				text-align: left;
				padding: 5px;
				font-size:14px;
			}
table#lar_table3_rfd{
				border-collapse:collapse;
				border-radius: 15px;
				/*border:1px solid #ccc; */
			}
						 
			table#lar_table3_rfd th{
				background-color:#f505da2b;
				color: black;
				padding: 5px;
				font-size:14px;
				/*text-transform: uppercase;*/
				font-weight:normal;
			}

			table#lar_table3_rfd td{
				text-align: left;
				padding: 5px;
				font-size:14px;
			}



table#lar_table1{
	border-collapse:collapse;
}
 

table#lar_table1 td{
	text-align: left;
	padding: 5px;
	font-size:13.5px;
}
 
table#lar_table1 th{
	background-color: #c1e496;
        color: #225902;
        padding: 3px;
        font-size:13px;
}

table#lar_table1_orange{
	border-collapse:collapse;
	background-color:#fff9ea;
}	
 

table#lar_table1_orange td{
	text-align: left;
	padding: 5px;
	font-size:13.5px;
}
 
table#lar_table1_orange th{
	background-color: #f9d49b;
        color: black;
        padding: 3px;
        font-size:13px;
}


table#lar_table1_col{
	border-collapse:collapse;
}
 

table#lar_table1_col td{
	text-align: left;
	padding: 5px;
	font-size:13.5px;
}
 
table#lar_table1_col th{
	background-color: #c1e496;
        color: #225902;
        padding: 3px;
        font-size:13px;
}
#lar_table1_col tr:nth-child(even){background-color: #afc69330;}
 



table#lar_table2{
	border-collapse:collapse;
}
 

table#lar_table2 td{
	text-align: left;
	padding: 1px;
	font-size:13.5px;
}
#lar_table2 tr:nth-child(even){background-color: #afc69330;}
 
#lar_table2 tr:hover {background-color: #97ce4157;}
		

table#lar_table2 th{
	background-color: #c1e496;
        color: #225902;
        padding: 3px;
        font-size:13px;
}

/* ---------------------------- Small Table ---------------------- */
table#sm_table{
	border-collapse:collapse;
}
 

table#sm_table td{
       text-align: left;
       padding: 2px;
       font-size:13px;
       font-weight:normal;
}
 
table#sm_table th{
        color: grey;
        padding: 2px;
        font-size:12px;
	font-weight:bold;
	text-align:left;
}


			
			.link{
				color:darkgreen;
				text-decoration:none;
			}
			.link:hover
			{
				color:blue;
				text-decoration:underline;
                                cursor:pointer;
			}
			.link1{
				color:darkgreen;
				text-decoration:none;
			}
			.link1:hover
			{
				color:red;
				text-decoration:underline;
                                cursor:pointer;
			}
	
			.button4 {
			  background-color: #b5e071e6;
			  color: black;
			  padding: 5px 10px;
  			  margin: 3px 0;
  			  border: none;
 			 cursor: pointer;
 			 border-radius:10px;
 			 font-size:14px;
 			 width:200px;
  			text-align:center;

			}
			/*.button4:hover
			{
			    background-color:#57892b;
			    color:white;
			}*/
		.cancel_order {
			  background-color: #ff000063;
			  color: black;
			  padding: 5px 10px;
  			  margin: 3px 0;
  			  border: none;
 			 cursor: pointer;
 			 border-radius:10px;
 			 font-size:14px;
 			 width:200px;
  			text-align:center;
			border:1px solid #ff0000a8;
			}
		.cancel_order:hover
			{
			    background-color:red;
			    color:white;
			}

		.button_next_toprocess {
			  background-color: #edc27e7a;
			  color: grey;
			  padding: 5px 10px;
  			  margin: 3px 0;
  			  border: none;
 			 cursor: pointer;
 			 border-radius:10px;
 			 font-size:14px;
 			 width:200px;
  			text-align:center;

			}
		.button_waiting {
			  background-color: #ccccccc9;
			  color: grey;
			  padding: 5px 10px;
  			  margin: 3px 0;
  			  border: none;
 			 cursor: pointer;
 			 border-radius:10px;
 			 font-size:14px;
 			 width:200px;
  			text-align:center;

			}



ul#help
{
	display : block;
	margin-left:-20px;
}

ul#help li
{
	width:250px;
	height:80px;
	border-radius : 10px;
	border : 1px solid darkgreen;
	font-size:18px;
	color : #200185;
	font-weight:bold;
        margin-left:20px;
	display: flex;
	align-items: center;
 	justify-content: center;
	margin-top:20px;
	cursor:pointer;
	/*background-color:#7cce4124;*/


}

ul#help li i
{
	color:#200185;
}

ul#help li:hover
{
	background-color:#7cce4124;
	color:darkgreen;
}
/*.sidebar a.active {
	background-color: #4e00b0;
	color: white;
}
.sidebar a {
	display: block;
	padding: 5px;
	text-decoration: none;
	color: white;
	width: 160px;
	color: navy;
}*/
.breaking-news-headline {
  display: block;
  position: absolute;
  font-family: arial;
  font-size: 14px;
  top:0px;
  right : 0px;
  color: white;
}

.breaking-news-left {
  display: block;
  position: absolute;
  font-family: arial;
  font-size: 14px;
  top:0px;
  left : 0px;
  color: white;
  margin-left:130px;
}


.breaking-news-title {
  background-color: #97ce41;
  display: block;
  height: 30px;  
  width: 95px;
  font-family: arial;
  font-size: 11px;
  position: absolute; 
  top: 0px;
  margin-top: 0px;
  margin-left: 9px;
  padding-top: 10px;
  padding-left: 10px;
  font-weight:bold;
  z-index: 3;
  &:before {
	content:"";
	position: absolute;
	display: block;
	width: 0px;
	height: 0px;
	top: 0;
	left: -12px;
	border-left:12px solid transparent;
	border-right: 0px solid transparent;
	/*border-bottom: 30px solid #FFEA00;*/
  }
  &:after {
	content:"";
	position: absolute;
	display: block;
	width: 0px;
	height: 0px;
	right: -12px;
	top: 0;
	border-right:12px solid transparent;
	border-left: 0px solid transparent;
	/*border-top: 30px solid #FFEA00;*/
  }
}

#breaking-news-colour {
  height: 30px;
  width: 100%;
  margin-right:100px;
  background-color: #c8e19d;
}

#breaking-news-container {
  height: 30px;
  width: 100%;
  margin-right:100px;
  overflow: hidden;
  position: absolute;
  &:before {
	content: "";
	width: 30px;
	height: 30px;
	background-color: #c8e19d;
	position: absolute;
	z-index: 2;
  }
}

.center_img {
			   
			  opacity:0.2;
			  width:500px;height:300px;
			  text-align: center; 
				 position: absolute;
				top: 0;
				bottom: 0;
				margin: auto;
			}
			
						.gooicon_css{
	 
	box-sizing: border-box;
	border: 1px solid #ccc;
	border-radius: 10px;
	font-size: 13px;
	/*background-color: #f1ffdd;*/
	background-color: #3f80003d;
	text-align:center;
	margin:20px;
	/*margin-left:95px;margin-right:80px;*/
	margin:0 auto;
	width:270px;
	color:darkgreen;

        
}
			
.gooicon_css:hover
{
    background-color: #3f80002b;
    color:darkgreen;
}

				
			.h1 {
			  display: flex;
			  flex-direction: row;
			  font-size : 14px;
			  color:darkgreen;
			}
			.h1 {
  display: flex;
  flex-direction: row;
  font-size : 13px;
  color:darkgreen;
}
.h1:before, .h1:after{
  content: "";
  flex: 1 1;
  border-bottom: 1px solid;
  margin:auto;
  margin-left: 20px;
  margin-right: 40px;
}
.h1:before {
  margin-right: 10px;
}
.h1:after {
  margin-left: 10px;
}


			.address_container
			{
				padding: 16px;
				background-color: #abdc553d;
				border: 2px solid #86bd2d5e;
				margin:5px;
				min-height:320px;
				border-radius: 15px;
			}
			
			/* Sign IN and Sign OUT CSS */
			.div_outer
			{ 
				/*width: 100vw;*/
				height: auto;
				background-color:white;
				margin-top:30px;
				padding-left:20px;
				padding-right:20px;
				display: flex;align-items: center;justify-content: center;
			}
			
			.div_inner
			{
				position:absolute;
				top:70px;
				left:10px;
				right:10px;
				 
				display: flex;align-items: center;justify-content: center;
				display: block;
				width:auto;
				height: auto;
				background-color: #abdc553d;
				border: 2px solid #86bd2d5e;
				border-radius: 10px;
			}
			
			.div_inner_container  /*Sign IN and Sign OUT Detail Division */
			{
				padding: 16px;
				display: block;
				padding-left:0px;
			} 
			
			.center_align
			{ 
				display: flex;align-items: center;justify-content: center;

			}
			 
			
			/* On screens that are 1600px wide or less */
			@media screen and (max-width: 1600px) {
			   .div_inner_container
				{
					width:550px; 
					margin-right:40px;
				}
			}
			 
			/* On screens that are 600px wide or less */
			@media screen and (max-width: 600px) {
			  .div_inner_container
				{
					width:380px; 
					height:auto;
				}
			}
		 
			
			/* On screens that are 992px wide or less, the background color is blue */
			@media screen and (max-width: 1600px) {
			   .div_inner_imglist
				{
					width:550px; 
					height:620px;
					margin-left:40px;
					bottom:10px;
				}
			}
			 
			/* On screens that are 600px wide or less, the background color is red */
			@media screen and (max-width: 700px) {
			  .div_inner_imglist
				{
					width:380px; 
					margin-left:0px;
					height:450px;
				}
			}
			
			#txt_underline
			{
				color:black;
				cursor:pointer;
				text-decoration:none;
			}
			#txt_underline:hover
			{ 
				text-decoration:underline;
				color:blue;
				cursor:pointer;
			}
			
			#txt_underline_grey
			{
				color:grey;
				cursor:pointer;
				text-decoration:none;
			}
			#txt_underline_grey:hover
			{ 
				text-decoration:underline;
				color:blue;
				cursor:pointer;
			}

			
			
			/*evaravu Logo Css */
			@media screen and (max-width: 1600px) {
				 
				 
				/*Main Page Left and Right Icon */
				.icon_left
				{
					position:absolute;
					left:15px;
				}
				
				.icon_right
				{
					position:absolute;
					right:15px;
				}

				.licon_left
				{
					position:absolute;
					left:15px;
				}
				
				.licon_right
				{
					position:absolute;
					right:15px;
				}
				
				.tvicon_left
				{
					position:absolute;
					left:25px;
				}
				
				.tvicon_right
				{
					position:absolute;
					right:25px;
				}

				.psicon_left
				{
					margin-left:30px;
					margin-right:20px;
				}
				
				.psicon_right
				{
					position:absolute;
					right:15px;
				}

			}
			
			@media screen and (max-width: 1200px) {
				 
				.icon_left
				{
					position:absolute;
					left:8px;
					top:70px;
				}
				
				.icon_right
				{
					position:absolute;
					right:8px;
					top:70px;

				}

				.licon_left
				{
					position:absolute;
					left:8px;
					top:130px;
				}
				
				.licon_right
				{
					position:absolute;
					right:8px;
					top:130px;

				}
				.tvicon_left
				{
					position:absolute;
					left:10px;
					 
				}
				
				.tvicon_right
				{
					position:absolute;
					right:10px;
					 
				}

				.psicon_left
				{
					position:absolute;
					left:-25px;
					top:250px;

				}
				
				.psicon_right
				{
					position:absolute;
					right:8px;
					top:250px;
				}


			}
			 
			@media screen and (max-width: 1200px) {
				.tvicon_left
				{
					position:absolute;
					left:8px;
					top:120px;
				}
				
				.tvicon_right
				{
					position:absolute;
					right:8px;
					top:120px;

				}
			}
			@media screen and (max-width: 900px) {
				.icon_left
				{
					position:absolute;
					left:6px;
					top:250px;
				}
				
				.icon_right
				{
					position:absolute;
					right:6px;
					top:250px;

				} 

				.licon_left
				{
					position:absolute;
					left:6px;
					top:130px;
				}
				
				.licon_right
				{
					position:absolute;
					right:6px;
					top:130px;

				} 
				.psicon_left
				{
					position:absolute;
					left:-25px;
					top:340px;

				}
				
				.psicon_right
				{
					position:absolute;
					right:0px;
					top:340px;
				}

			}

			 @media screen and (max-width: 700px) {
				 

				.licon_left
				{
					position:absolute;
					left:6px;
					top:200px;
				}
				
				.licon_right
				{
					position:absolute;
					right:6px;
					top:200px;

				} 
			 }
			.show_list_btn
			{
			  display: inline-block;
			  border-radius: 4px;
			  background-color: #9ed40a;
			  border: none;
			  color: #FFFFFF;
			  text-align: center;
			  font-size: 15px;
			  padding: 5px;
			  width: 140px;
			  transition: all 0.5s;
			  cursor: pointer;
			  margin: 5px;
			}
			
			.show_list_btn span {
			  cursor: pointer;
			  display: inline-block;
			  position: relative;
			  transition: 0.5s;
			}

			.show_list_btn span:after {
			  content: '\00bb';
			  position: absolute;
			  opacity: 0;
			  top: 0;
			  right: -20px;
			  transition: 0.5s;
			 
			}

			.show_list_btn:hover span {
			  padding-right: 25px;
			}

			.show_list_btn:hover span:after {
			  opacity: 1;
			  right: 0;
			}

			.show_list_btn:hover
			{
			   background-color:#477c1f;
			}
			
			.show_list_btn_sm
			{
			  display: inline-block;
			  border-radius: 4px;
			  background-color: #9ed40a;
			  border: none;
			  color: #FFFFFF;
			  text-align: center;
			  font-size: 13px;
			  padding: 4px;
			  width: 130px;
			  transition: all 0.5s;
			  cursor: pointer;
			  margin: 4px;
			}
			
			.show_list_btn_sm span {
			  cursor: pointer;
			  display: inline-block;
			  position: relative;
			  transition: 0.5s;
			}

			.show_list_btn_sm span:after {
			  content: '\00bb';
			  position: absolute;
			  opacity: 0;
			  top: 0;
			  right: -20px;
			  transition: 0.5s;
			 
			}

			.show_list_btn_sm:hover span {
			  padding-right: 25px;
			}

			.show_list_btn_sm:hover span:after {
			  opacity: 1;
			  right: 0;
			}

			.show_list_btn_sm:hover
			{
			   background-color:#477c1f;
			}

			/*Meter Tag */
			ul#meter
			{
				/*padding-left:0px;
				margin-left:-25px;*/
			}

			/* On screens that are 1600px wide or less */
			@media screen and (max-width: 1600px) {
			   #qorder_css
				{
					height:40px;
				}
			}
			 
			/* On screens that are 600px wide or less */
			@media screen and (max-width: 600px) {
			  #qorder_css
				{
					height:60px;
				}
			}

/* Product View Css */
.pview_css {  
  margin : 9px;
  /*background-color: #add85f4f;*/
  background-color:#c6dc681c;
  transition: transform .2s;
  width: 280px;
  height:365px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  border:1px solid #c6dc684a;
  box-shadow:2px 2px 6px #5f9132;
}

.pview_css:hover {
 -ms-transform: scale(1.1); /* IE 9 */
 -webkit-transform: scale(1.1); /* Safari 3-8 */
 transform: scale(1.05); 
 cursor:pointer; 
 border:1px solid #add85f4f;
 background-color:#add85f3d;
box-shadow:0px 2px 6px #5f9132;
}

.pview_css_dull
{
	margin : 9px;
  /*background-color: #add85f4f;*/
  background-color:#c6dc681c;
  transition: transform .2s;
  width: 280px;
  height:365px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  border:1px solid #c6dc684a;
  box-shadow:2px 2px 6px #5f9132;
       opacity:0.5;
}
/*.pview_css_dull:hover
{
   opacity:1;
   -ms-transform: scale(1.1); 
 -webkit-transform: scale(1.1);  
 transform: scale(1.05); 
 cursor:pointer; 
 border:1px solid #add85f4f;
 background-color:#add85f3d;
box-shadow:0px 2px 6px #5f9132;
}*/
 
.pimg_view {
  /*background-color: #add85f4f;*/
  background-color:#c4e683d1;
  border:3px solid #98bf4d;
  transition: transform .2s;
  max-width: 560px;
  width:350px;
  height: 350px;
  padding:5px;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
}

.pgroup_view
{
	height:150px;
	width:400px;
	text-align:left;
	background-color:#cce07836;
	border:3px solid #b8d34282;
	padding:5px;
	margin:5px;
	border-radius : 10px;
}

.pgroup_view_dull
{
	height:150px;
	width:400px;
	text-align:left;
	background-color:#cce07836;
	border:3px solid #b8d34282;
	padding:5px;
	margin:5px;
	border-radius : 10px;
       opacity:0.5;
}
.pgroup_view_dull:hover
{
   opacity:1;
}

.pgroup_view_sm
{
	height:100px;
	width:335px;
	text-align:left;
	background-color:#cce07836;
	border:3px solid #b8d34282;
	padding:5px;
	margin:5px;
	border-radius : 10px;
}
.pgroup_view_sm_dull
{
	height:100px;
	width:330px;
	text-align:left;
	background-color:#cce07836;
	border:3px solid #b8d34282;
	padding:5px;
	margin:5px;
	border-radius : 10px;
	opacity:0.5;
}
.pgroup_view_sm_dull:hover
{
   opacity:1;
}


#general_txt{
	box-sizing: border-box;
	border:none;
	border-bottom: 2px solid #ccc;
	border-radius: 4px;
	font-size: 14px;
	/*padding: 12px 25px 12px 20px;  */
        padding:5px; 
	outline:none;
	width:200px;
	background-color:#fafafa00;
        cursor:pointer;
}

.sm_buy {
  background:none;
  color: darkgreen;
  padding: 4px 8px;
  margin: 5px 0;
  border: none;
  cursor: pointer;
   
  border-radius:5px;
  font-size:14px;
  width:50px;
}
.sm_buy:hover
{
    color: green;

}

.sm_fav {
  background:none;
  color: red;
  padding: 4px 8px;
  margin: 5px 0;
  border: none;
  cursor: pointer;
   
  border-radius:5px;
  font-size:14px;
  width:50px;
}
.sm_fav:hover
{
    color: green;

}


.buy_now {
  /*background-color: #417a04;*/
  background-color: #85bf2c;
  color: white;
  padding: 6px 12px;
  margin: 5px 0;
  border: none;
  cursor: pointer;
  border-radius:10px;
  font-size:14px;
  width:80px;
  
}

.buy_now:hover
{
   background-color:#417a04;
}

.sfl_btn {
 background-color: #f1af39;
  color: white;
  padding: 6px 12px;
  margin: 5px 0;
  border: none;
  cursor: pointer;
  border-radius:10px;
  font-size:14px;
  width:80px;
}

.sfl_btn:hover
{
   color:black;
}

.add_cart {
  /*background-color: #84a21070;*/
  background : none;
  color: darkgreen;
  padding: 3px;
  margin: 2px;
  border: none;
  cursor: pointer;
  border-radius:10px;
  font-size:15px;
  width:70px;
   
}

.add_cart:hover{
   
  /*background-color: #84a210;*/
  color: darkgreen;

}

.add_fav {
  /*background-color: #84a21070;*/
  background : none;
  color: red;
  padding: 3px;
  margin: 2px;
  border: none;
  cursor: pointer;
  border-radius:10px;
  font-size:15px;
  width:70px;
   
}

.add_favim:hover{
   
  /*background-color: #84a210;*/
  color: #84a210;

}



.sm_add_cart {
  background-color: #84a210;
  color: white;
  padding: 6px 10px;
  margin: 8px 0;
  border: none;
  cursor: pointer;
  border-radius:5px;
  font-size:13px;
  width:90px;
  
}


.plview_css {  
  margin : 5px;
  /*background-color: #add85f4f;*/
  background-color:#c6dc681c;
  transition: transform .2s;
  max-width: 850px;
  height:auto;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  border:1px solid #c6dc684a;
  padding:5px;
  box-shadow: 2px 2px 6px #5f9132;
}

.plview_css_dull {  
  margin : 5px;
  /*background-color: #add85f4f;*/
  background-color:#c6dc681c;
  transition: transform .2s;
  max-width: 850px;
  height:auto;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  border:1px solid #c6dc684a;
  padding:5px;
  box-shadow: 2px 2px 6px #5f9132;
  opacity: 0.5;
}


.plview_css:hover {
 -ms-transform: scale(1.1); /* IE 9 */
 -webkit-transform: scale(1.1); /* Safari 3-8 */
 transform: scale(1.0); 
 cursor:pointer; 
 border:1px solid #add85f4f;
 background-color:#add85f3d;
}

.input_box	
{
  margin: 4px 0;
  display: inline-block;
  border: none;
  border-bottom:1px solid #00640052;
  box-sizing: border-box;
  outline: none;
  font-size:13.5px;
  width: 100%;
  background-color: #eefddb00;
  width:250px;	
  font-family:verdana;
}	


.field_required
{
   border-bottom:1px solid darkgreen;
}

/* Left Side Menu */
.sty_icon{
color: silver;
} 

.left_menu_color
{
   color:darkgreen;
   font-weight:normal;
}
 
tr#left_menu td:hover
{
  background-color: #97ce4129;
}
tr#left_menu td:hover .sty_icon
{
  color:navy;
  cursor:pointer;
}

tr#left_menu td:hover .left_menu_color
{
  color:blue;
  cursor:pointer;
  font-weight:bold;
}


/* Form */
.container_big {
 
  /*background-color: #abdc553d;*/
  /*background-color: #ecf8d7;*/
  /*border: 2px solid #86bd2d5e;*/
  margin:0px;
  min-height:420px;
  border-radius: 15px;
  animation: blink;
  width : fit-content;
  display: flex;
 align-items: center;
 justify-content: center;

}

/* Form */
.container {

 /*background-color: #abdc553d;
  border: 2px solid #86bd2d5e;*/
  
  margin:auto;
  border-radius: 15px;
  animation: blink;
 
}

.inner_div
{ 
	/*background:#cfe89f; */
	background:#e8f9c8;
        width:96%;
	 
}

.inner_div1
{
	background:#cfe89f;
	min-height:300px;
        margin-left:-5px;
        padding:20px;
       
}

.blinking-icon {
      animation: blink 1s 5; /* Name, duration, and iteration count */
    }

/* Animation */
@keyframes blink{
0%{opacity: 0;}
50%{opacity: .5;}
100%{opacity: 1;}
}

					/* Tab Menu*/
/* Begin ----------------------------------  	*/		

ul#topTab {
  display: block;
  list-style-type: none;
  /*width: 100%;*/
  height: 40px;
  font-size: 14px;
  position:absolute;
  margin-top:2px;
}
 
.tab:hover
{
background-color:yellowgreen;	
}

.tab1{
  display: block;
  margin: 0 5px 0 10px;
  height: 20px;
  width:100px;
  /*background-color : #f3e6c4;*/
  background-color:#efddaf;
  border-top-left-radius: 17px;
  border-top-right-radius: 17px;
  color:#6a6868;
}
.tab1:hover
{
background-color:#e8c46e;
color:black;	
}


/*ul#topTab li:hover{
background-color:yellowgreen;}*/


ul#topTab li a {
  display: block;
  text-align :center;
  text-decoration: none;
  color:white;
}

ul#topTab li a .selected {
    background: green;
    color:black;
}
ul#topTab li a.right {
  padding-right: 30px;
}

/*ul#topTab li a:hover {
  background-color: yellowgreen;
}*/

 /* Background - color for tab */
#backcolor
{
	background-color :#e8f9c8;
    color:black;
}
/*#backcolor:hover{
	background-color : #b4de6f; ;
}*/
 

/* Input Box */

.input_type {
  padding: 10px 3px;
  margin: 8px 0;
  display: inline-block;
  border: none;
  border-bottom:1px solid #b2ce84;
  box-sizing: border-box;
  outline: none;
  font-size:13.5px;
 width: 300px;
 background-color: #eefddb00;
 color:darkgreen;
 font-family:verdana;
}

.sign_btn
{
  background-color: #70a132;
  color: white;
  padding: 4px 8px;
  margin: 5px 0;
  border: none;
  cursor: pointer;
  border-radius:10px;
  font-size:15px;
  width:150px;
  text-align:center;
}

.sign_btn:hover
{
	opacity:0.8;
}

.sign_btn li{
 font-size: 15px;
}
div.appear {
    width: 300px; 
    border: #c2e28b 2px solid;
    /*background:#F8F8F8;*/
     background:#e8fbc9;
    position: relative;
    top: 0px;
    left:260px;
    display:none;
    padding: 0 0px 20px 0px;
    z-index: 1000000;
 
}
div.hover  {
    cursor:pointer;
    width: 250px;
}
div.hover:hover div.appear {
    display:block;
}

.image {
  max-width: 340px;
  
}

.image img {
  max-width: 100%;
}
 
		 

.filter_invisible
{
	opacity : 0.3;
}

.filter_invisible:hover
{
	opacity : 1;
}


/* Add a green text color and a checkmark when the requirements are right */
div.meter{
 /* position: fixed;
  bottom:100px;
  left : 12px;*/
}
div.st_mes{
  /*position: fixed;
  left:320px;
  bottom: 100px;
  width:auto;*/
  font-size: 13px;
}


		/* Meter Style */
		
meter#red::-webkit-meter-optimum-value  {
    background: red; /* Green */
}
meter#yellow::-webkit-meter-optimum-value  {
    background: yellow; /* Green */
}
meter#yellowgreen::-webkit-meter-optimum-value  {
    background: #ADFF2F; /* Green */
}
meter#forestgreen::-webkit-meter-optimum-value  {
    background: #228B22 /* Green */
}
meter#orange::-webkit-meter-optimum-value  {
    background: orange; /* Green */
}
meter#lightgreen::-webkit-meter-optimum-value  {
    background: MediumSeaGreen; /* Green */
}
meter#green::-webkit-meter-optimum-value  {
    background: green; /* green */
}
meter#plum::-webkit-meter-optimum-value  {
    background: plum; /* Yellow */
}

meter{
	width : 250px;
height : 30px;}

/* Password Strength */
#message {
  display:none;
  color: #000;
  position: relative;

}

#message p {
  font-size: 13px;
  position : static;
  
}


.hyber_link{
				color:darkgreen;
				text-decoration:none;
                                font-weight:normal;
				font-size:13px;
			}
			.hyber_link:hover
			{
				color:darkgreen;
				text-decoration:underline;
                                cursor:pointer;
                                font-weight:bold;
 				font-size:12.5px;

			}

.blue_underline
{
   color:blue;
   text-decoration:none;
   font-weight:normal;
   font-size:14px;

}

.blue_underline:hover
{
   color:blue;
   text-decoration:underline;
   cursor:pointer;
   font-weight:bold;
   font-size:13px;

}
//--------------------------- Scroolable Table ------------------------------------
  table.scrolldown {
            
            /* border-collapse: collapse; */
            border-spacing: 0;
            border: 2px solid black;
        }

        /* To display the block as level element */
        table.scrolldown tbody,
        table.scrolldown thead {
            display: block;
        }

        thead tr th {
            height: 25px;
             
        }

        table.scrolldown tbody {

            /* Set the height of table body */
            height: 352px;

            /* Set vertical scroll */
            overflow-y: auto;

            /* Hide the horizontal scroll */
            overflow-x: hidden;
        }

/*---------------------- Material Icons -------------------------------------------*/
.material-icons.delete::before{
			content:"delete"; 
			font-family: 'Material Symbols Outlined';
			font-size:20px;color:red; 
		}

		.material-icons.delete:hover::before{
			content:"delete"; 
			font-family: 'Material Icons';font-size:20px;color:red;font-weight:normal;
		}

.material-icons.sm_delete::before{
			content:"delete"; 
			font-family: 'Material Symbols Outlined';
			font-size:18px;color:red; 
		}

		.material-icons.sm_delete:hover::before{
			content:"delete"; 
			font-family: 'Material Icons';font-size:18px;color:red;font-weight:normal;
		}

.material-icons.sm_edit::before{
			content:"edit"; 
			font-family: 'Material Symbols Outlined';
			font-size:18px;color:blue; 
		}

		.material-icons.sm_edit:hover::before{
			content:"edit"; 
			font-family: 'Material Icons';font-size:18px;color:blue;font-weight:normal;
		}


		
		.material-icons.sfl::before{
			content:"library_add_check"; 
			font-family: 'Material Symbols Outlined';
			font-size:20px;color:darkgreen; 
		}

		.material-icons.sfl:hover::before{
			content:"library_add_check"; 
			font-family: 'Material Icons';font-size:20px;color:darkgreen;font-weight:normal;
		}
		
		.material-icons.cart::before{
			content:"shopping_cart"; 
			font-family: 'Material Symbols Outlined';
			font-size:20px;color:darkgreen; 
		}

		.material-icons.cart:hover::before{
			content:"shopping_cart"; 
			font-family: 'Material Icons';font-size:20px;color:darkgreen;font-weight:normal;
		}
		.material-icons.wish_list::before{
			content:"diagnosis"; 
			font-family: 'Material Symbols Outlined';
			font-size:20px;color:darkgreen; 
		}

		.material-icons.wish_list:hover::before{
			content:"diagnosis"; 
			font-family: 'Material Symbols Outlined';font-size:20px;color:darkgreen;font-weight:bold;
		}

 		.material-icons.big_cart::before{
			content:"shopping_cart"; 
			font-family: 'Material Symbols Outlined';
			font-size:28px;color:darkgreen;font-weight:bold; 
		}

		.material-icons.big_cart:hover::before{
			content:"shopping_cart"; 
			font-family: 'Material Icons';font-size:28px;color:darkgreen;font-weight:normal;
		}
		.material-icons.nor_cart::before{
			content:"shopping_cart"; 
			font-family: 'Material Symbols Outlined';
			font-size:23px;color:darkgreen;font-weight:bold; 
		}

		.material-icons.nor_cart:hover::before{
			content:"shopping_cart"; 
			font-family: 'Material Icons';font-size:23px;color:darkgreen;font-weight:normal;
		}

		.material-icons.nor_cart1::before{
			content:"shopping_cart"; 
			font-family: 'Material Symbols Outlined';
			font-size:25px;color:darkgreen;font-weight:bold;
		}

		.material-icons.nor_cart1:hover::before{
			content:"shopping_cart"; 
			font-family: 'Material Icons';font-size:25px;color:darkgreen;font-weight:normal;
		}


		.material-icons.big_fav::before{
			content:"favorite"; 
			font-family: 'Material Symbols Outlined';
			font-size:28px;color:red;font-weight:bold; 
		}

		.material-icons.big_fav:hover::before{
			content:"favorite"; 
			font-family: 'Material Icons';font-size:28px;color:red;font-weight:normal;
		}
		.material-icons.nor_fav::before{
			content:"favorite"; 
			font-family: 'Material Symbols Outlined';
			font-size:23px;color:red;font-weight:bold; 
		}

		.material-icons.nor_fav:hover::before{
			content:"favorite"; 
			font-family: 'Material Icons';font-size:23px;color:red;font-weight:normal;
		}

		.material-icons.nor_fav1::before{
			content:"favorite"; 
			font-family: 'Material Symbols Outlined';
			font-size:25px;color:red;font-weight:bold; 
		}

		.material-icons.nor_fav1:hover::before{
			content:"favorite"; 
			font-family: 'Material Icons';font-size:25px;color:red;font-weight:normal;
		}



		.material-icons.fav::before{
			content:"favorite"; 
			font-family: 'Material Symbols Outlined';
			font-size:20px;color:red;font-weight:bold; 
		}
		
		

		.material-icons.fav:hover::before{
			content:"favorite"; 
			font-family: 'Material Icons';font-size:20px;color:red;font-weight:normal;
		}
		
		.material-icons.rfav::before{
			content:"favorite"; 
			font-family: 'Material Icons';
			font-size:20px;color:red; 
		}

		.material-icons.rfav:hover::before{
			content:"close"; 
			font-family: 'Material Icons';font-size:20px;color:red;font-weight:bold;
		}


		.material-icons.add::before{
			content:"add"; 
			font-family: 'Material Symbols Outlined';
			font-size:18px;color:black; 
		}

		.material-icons.add:hover::before{
			content:"add"; 
			font-family: 'Material Icons';
			font-size:18px;color:darkgreen;font-weight:bold;
		}

		.material-icons.minus::before{
			content:"horizontal_rule"; 
			font-family: 'Material Symbols Outlined';
			font-size:18px;color:black; 
		}

		.material-icons.minus:hover::before{
			content:"horizontal_rule"; 
			font-family: 'Material Icons';
			font-size:18px;color:darkgreen;font-weight:bold;
		}

		.material-icons.undo_minus::before{
			content:"horizontal_rule"; 
			font-family: 'Material Symbols Outlined';
			font-size:18px;color:black; 
			opacity:0.3;
		}

		.material-icons.undo_minus:hover::before{
			content:"close"; 
			font-family: 'Material Icons';
			font-size:18px;color:red;font-weight:normal;opacity:1;
		}


		.material-icons.close::before{
			content:"close"; 
			font-family: 'Material Symbols Outlined';
			font-size:18px;color:red; 
		}

		.material-icons.close:hover::before{
			content:"cancel"; 
			font-family: 'Material Icons';
			font-size:18px;color:red; 
		}
		.material-icons.add::before{
			content:"add"; 
			font-family: 'Material Icons';
			font-size:17px;color:darkgreen; 
		}

		.material-icons.add:hover::before{
			content:"add"; 
			font-family: 'Material Icons';
			font-size:17px;color:darkgreen;font-weight:bold;cursor:pointer;
		}


table#green_men1{
	border-collapse:collapse;
	 font-family:verdana;
	color:darkgreen;
}
table#green_men1 tr,table#green_men1 td,table#green_men1 th{
	padding:5px;
}
table#green_men1 th{
	text-align:left;
	font-size:12.2px;
        color:#567556;
        font-weight:normal;
}
table#green_men1 td{
	text-align:left;
	font-size:13.5px;
	font-weight:bold;
}

table#green_men2{
	border-collapse:collapse;
	 font-family:verdana;
	color:darkgreen;
}
table#green_men2 tr,table#green_men2 td,table#green_men2 th{
	padding:8px;
}
table#green_men2 th{
	text-align:left;
	font-size:12.2px;
        color:#567556;
        font-weight:normal;
}
table#green_men2 td{
	text-align:left;
	font-size:13px;
	font-weight:bold;
}


 
.icon_color
{
    color:black;font-size:24px;
}

.icon_color:onhover{
  color:darkgreen;font-size:24px;
}

/* Toggle Button */
.toggle {
  position: relative;
  display: inline-block;
  width: 35px;
  height: 16px;
}

.toggle input {
  display: none;
}

.slider1 {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right:-1px;
  bottom: 0;
  /*background-color: #efbc00;*/
  background-color:#80808091;
  transition: 0.4s;
  border-radius: 20px;
}

.slider1:before {
  position: absolute;
  content: "";
  height: 10px;
  width: 10px;
  left: 3px;
  bottom: 3.2px;
  
  background-color: #FFF;
  transition: 0.4s;
  border-radius: 50%;
}

input:checked + .slider1 {
  background-color: #060;  

}

input:checked + .slider1:before {
  transform: translateX(19px);
}

.hori_line
{
	border-left: 2px solid #86bd2d5e;height:430px;margin-left:20px;width:30px;
}

.vert_line{
	border-top: 2px solid #86bd2d5e;height:20px;margin-top:20px;
}

@media screen and (max-width: 1600px) {
	 
	#ev_content
				{
					margin-top:25px; 
  					margin-left:2px;
					font-size:12px;
				}
	.logo_css{
		margin-top:12px;
	}
	
	.center_cimg{
		margin-top:25px;
	}
	.hori_line{display:block;}
	.vert_line{width:420px;display:none;}
	
	.signin_div{
		margin-top:20px; margin-bottom:20px;}

	.logo_size{
		width:430px;height:430px;
	}
	.container{width:525px;min-height:350px;}

	/* Input Box */

.input_type {
  padding: 10px 3px;
  margin: 8px 0;
  display: inline-block;
  border: none;
  border-bottom:1px solid #b2ce84;
  box-sizing: border-box;
  outline: none;
  font-size:13.5px;
 width: 300px;
 background-color: #eefddb00;
 color:darkgreen;
 font-family:verdana;
}
.sminput_type {
  padding: 10px 3px;
  margin: 8px 0;
  display: inline-block;
  border: none;
  border-bottom:1px solid #b2ce84;
  box-sizing: border-box;
  outline: none;
  font-size:13.5px;
 width: 200px;
 background-color: #eefddb00;
 color:darkgreen;
 font-family:verdana; 
}



.container_big {
	padding:20px;
}
.inner_div{
		height:330px;padding:20px;margin-left:-5px;

	}

.tab{
  display: block;
  margin: 0 5px 0 10px;
  height: 20px;
  width:100px;
  /*background-color : #b7d48b;*/
   background-color : #cce4a7;
  border-top-left-radius: 17px;
  border-top-right-radius: 17px;
  color:white;
}
.div_head{
	font-size:20;font-weight:bold;color:darkgreen;float:left
}

#topTab{
		margin-left:-15px;
	}

}

@media screen and (max-width: 1200px) {

	#ev_content
				{
					margin-top:0px; 
  					margin-left:0px;
					font-size:12px;
				}
	.logo_css{
		margin-top:12px;margin-left:5px;
	}
	
	.center_cimg{
		margin-top:60px;
	}


	
}
 

@media screen and (max-width: 940px) {
	 
	#ev_content
				{
					margin-top:5px; 
  					margin-left:0px;
					font-size:12px;
				}
	.logo_css{
		margin-top:12px;margin-left:5px;

	}
	
	.center_cimg{
		margin-top:70px;
	}

	.signin_div{
	margin-top:20px;
	margin-bottom:20px;}

	.logo_size{
		width:350px;height:350px;padding-left:30px;
	}

	.container{width:420px;min-height:350px;}

	/* Input Box */

.input_type {
  padding: 10px 3px;
  margin: 8px 0;
  display: inline-block;
  border: none;
  border-bottom:1px solid #b2ce84;
  box-sizing: border-box;
  outline: none;
  font-size:13.5px;
 width: 300px;
 background-color: #eefddb00;
 color:darkgreen;
 font-family:verdana;
}

.sminput_type {
  padding: 10px 3px;
  margin: 8px 0;
  display: inline-block;
  border: none;
  border-bottom:1px solid #b2ce84;
  box-sizing: border-box;
  outline: none;
  font-size:13.5px;
 width: 180px;
 background-color: #eefddb00;
 color:darkgreen;
 font-family:verdana; 
}

.tab{
  display: block;
  margin: 0 5px 0 10px;
  height: 20px;
  width:100px;
  /*background-color : #b7d48b;*/
    background-color : #b7d48b;
  border-top-left-radius: 17px;
  border-top-right-radius: 17px;
  color:white;
}


.container_big {
	padding:20px;
}
.inner_div{
		height:330px;padding:20px; 

	}
.div_head{
	font-size:20px;font-weight:bold;color:darkgreen;float:left
}
#topTab{
		margin-left:-10px;
	}


}	


@media screen and (max-width: 700px) {
	#ev_content
				{
					margin-top:0px; 
  					margin-left:0px;
					font-size:10px;
				}
	.logo_css{
		margin-top:50px;margin-left:5px;
	}
	
.center_cimg{
		margin-top:80px;
	}

 	 

	.hori_line{display:none;}
	.vert_line{width:420px;display:block;}
 	
 .signin_div{
	margin-top:20px;
	margin-bottom:20px;}
	
	.logo_size{
		width:350px;height:350px;
		padding-left:35px;
	}

	.container{width:440px;min-height:400px;}
	
	/* Input Box */

.input_type {
  padding: 10px 3px;
  margin: 8px 0;
  display: inline-block;
  border: none;
  border-bottom:1px solid #b2ce84;
  box-sizing: border-box;
  outline: none;
  font-size:13.5px;
 width: 300px;
 background-color: #eefddb00;
 color:darkgreen;
 font-family:verdana;
}





.sminput_type {
  padding: 10px 3px;
  margin: 8px 0;
  display: inline-block;
  border: none;
  border-bottom:1px solid #b2ce84;
  box-sizing: border-box;
  outline: none;
  font-size:13.5px;
 width: 170px;
 background-color: #eefddb00;
 color:darkgreen;
 font-family:verdana; 
}

.tab{
  display: block;
  margin: 0 5px 0 10px;
  height: 20px;
  width:100px;
  /*background-color : #b7d48b;*/
   background-color : #b7d48b;
  border-top-left-radius: 17px;
  border-top-right-radius: 17px;
  color:white;
}

.container_big {
	padding:10px;
}

.inner_div{
		height:330px;padding:20px;

	}
.div_head{
	font-size:18px;font-weight:bold;color:darkgreen;float:left
}

#topTab{
		margin-left:-10px;
	}


}

/* Mobile View*/
@media screen and (max-width: 450px) {
	
	#ev_content
				{
					margin-top:-12px; 
  					margin-left:0px;
					font-size:10px;
					 
				}
	.ev_content1{display:none;}
	.logo_css{
		margin-top:90px;margin-left:5px;
	}
	
	.center_cimg{
		margin-top:100px;
	}


 
	.hori_line{display:none;}
	.vert_line{width:330px;display:block;}
 	
	.signin_div{
	margin-top:10px; 
	margin-bottom:10px;margin-left:0px;margin-right:0px;}
	
	.logo_size{
		width:250px;height:250px;
		padding-left:40px;
	}

	.container{width:360px;min-height:350px;}
	.inner_div{
		height:330px; padding:5px;padding-top:10px;padding-left:20px;margin-top:5px;margin-left:-10px;

	}
	.input_type {
  padding: 10px 3px;
  margin: 5px 0;
  display: inline-block;
  border: none;
  border-bottom:1px solid #b2ce84;
  box-sizing: border-box;
  outline: none;
  font-size:15px;
 width: 270px;
 background-color: #eefddb00;
 color:darkgreen;
 font-family:verdana;
}

.sminput_type {
  padding: 10px 3px;
  margin: 8px 0;
  display: inline-block;
  border: none;
  border-bottom:1px solid #b2ce84;
  box-sizing: border-box;
  outline: none;
  font-size:13.5px;
 width: 150px;
 background-color: #eefddb00;
 color:darkgreen;
 font-family:verdana; 
}

.container_big {
	padding:5px;
}
.tab{
  display: block;
  margin: 0 5px 0 8px;
  height: 20px;
  width:80px;
  /*background-color : #b7d48b;*/
   background-color : #b7d48b;
  border-top-left-radius: 17px;
  border-top-right-radius: 17px;
  color:white;
}

.div_head{
	font-size:17px;font-weight:bold;color:darkgreen;float:left;margin-left:5px;
}

#topTab{
		margin-left:-8px;
	}

}


/* Input Box */

.input_type1 { 
  padding:3px;
  display: inline-block;
  border: none;
  border-bottom:1px solid #b2ce84;
  box-sizing: border-box;
  outline: none;
  font-size:13.5px;
 width: 300px;
 background-color: #eefddb00;
 color:darkgreen;
 font-family:verdana;
}
 
.out-of-stock::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(129, 128, 128, 0.45);
  /*border-radius:5px;*/
  
  z-index: 9999;
}

/* text */
.overlay-text{
  position:absolute;
  top:50%;
  left:18%;
  /*transform:translate(-50%,-50%);*/
  background:#f62525;
  color:#fff;
  padding:8px 16px;
  border-radius:20px;
  font-weight:bold;
  font-size:15px;
  z-index:2;
}

.overlay-text1{
  position:absolute;
  top:50%;
  left:18%;
  /*transform:translate(-50%,-50%);*/
  background:#f62525;
  color:#fff;
  padding:5px 10px;
  border-radius:20px;
  font-weight:bold;
  font-size:14px;
  z-index:2;
}

/* disable clicks */
.out-of-stock{
  pointer-events:none;
}

/*Spinner*/
.overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  display:flex;
  justify-content:center;
  align-items:center;
  z-index:999;
}

/* compact card */
.loader-card.small{
  background:#fff;
  padding:18px 22px;
  border-radius:16px;
  text-align:center;
  width:300px;           /* reduced width */
  box-shadow:0 8px 25px rgba(0,0,0,.25);
}

/* title */
.loader-card.small h3{
  font-size:15px;
  margin-bottom:12px;
  font-weight:600;
}

/* progress bar */
.progress{
  height:6px;            /* thinner bar */
  background:#eee;
  border-radius:20px;
  overflow:hidden;
  margin:12px 0;
}

.progress span{
  display:block;
  height:100%;
  width:0;
  background:linear-gradient(90deg,#4285F4,#34A853);
  animation:load 5s linear forwards;
}

/* text */
.loader-card.small p{
  font-size:14px;
  color:#666;
  margin-top:6px;
}

/* animation */
@keyframes load{
  to{width:100%}
}
 

#prod_iview{
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
    /*gap: 20px;*/
    /*max-width: 1200px;*/
    margin: 0 auto;
}
 


/*end --------------------------------*/

/* ===============================
   PRODUCT GROUP CARD RESPONSIVE
   =============================== */
/* ===============================
   PRODUCT GROUP – 3 CARDS SINGLE ROW
   =============================== */

.pgroup_view,
.pgroup_view_dull {
    width: 32%;
    margin: 0.6%;
    float: left;
    box-sizing: border-box;
    min-height: 165px;
}

/* 16 inch, 15 inch, 14 inch laptops */
@media (min-width: 1024px) {
    .pgroup_view,
    .pgroup_view_dull {
        width: 28%;      /* exactly 3 cards per row */
    }
}

/* Tablet – move to next row automatically */
@media (max-width: 1023px) {
    .pgroup_view,
    .pgroup_view_dull {
        width: 48%;      /* 2 cards per row */
    }
}

@media (max-width: 860px) {
    .pgroup_view,
    .pgroup_view_dull {
        width: 70%;      /* 2 cards per row */
    }
}

/* Mobile */
@media (max-width: 600px) {
    .pgroup_view,
    .pgroup_view_dull {
        width: 96%;      /* 1 card per row */
        float: none;
        margin: 8px auto;
    }
}
  

.psgroup_view
{
	height:150px;
	width:400px;
	text-align:left;
	background-color:#cce07836;
	border:3px solid #b8d34282;
	padding:5px;
	margin:5px;
	border-radius : 10px;
}

.psgroup_view_dull
{
	height:150px;
	width:400px;
	text-align:left;
	background-color:#cce07836;
	border:3px solid #b8d34282;
	padding:5px;
	margin:5px;
	border-radius : 10px;
       opacity:0.5;
}
.psgroup_view_dull:hover
{
   opacity:1;
}


/* Footer container */
.filter-footer-modern{
    margin-top: 16px;
    padding: 8px 5px;
    background: #f7fbef;
    border-radius: 10px;
}

/* Button */
.btn-clear-modern{
    width: 100%;
    height: 35px;
    border: none;
    background-color: #85bf2c;
    color: white;
    border-radius: 15px;
    font-size: 14px;
    font-weight: 600;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;

    cursor: pointer;
    transition: all 0.2s ease;
}

/* Icon */
.btn-clear-modern .material-icons{
    font-size: 15px;
}

/* Hover / Active */
.btn-clear-modern:hover{
   background-color:#417a04;
}

.btn-clear-modern:active{
    transform: scale(0.97);
}

/* Mobile polish */
@media (max-width:768px){
    .btn-clear-modern{
        height: 40px;
        font-size: 16px;
    }
}


/* Search Message */
/* DARKER + BLUR overlay for highlight */
.toast-overlay-bg{
    position: fixed;
    inset: 0;
    background: rgba(161, 161, 161, 0.45);   /* darker dim */
    /*backdrop-filter: blur(2px);*/     /* soft blur */
    z-index: 9998;

    animation: overlayFade 3s ease-in-out forwards;
}

@keyframes overlayFade {
    0%   { opacity: 0; }
    10%  { opacity: 1; }
    85%  { opacity: 1; }
    100% { opacity: 0; visibility: hidden; }
}

/* Toast position */
.toast-overlay{
    position: fixed;
    top: 130px;
    left: 0;
    width: 100%;
    z-index: 9999;
    pointer-events: none;
}

/* HIGH ATTENTION MESSAGE */
.toast-msg{
    margin: auto;
    width: fit-content;
    background: #ffffff;
    border: 2px solid #6aa84f;
    color: #1f5f1f;
    padding: 14px 20px;
    border-radius: 30px;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.3px;

    box-shadow:
        0 10px 30px rgba(0,0,0,0.35),
        0 0 0 6px rgba(106,168,79,0.25); /* glow ring */

    animation: toastAnim 3s ease-in-out forwards;
}

@keyframes toastAnim {
    0%   { opacity: 0; transform: translateY(-18px) scale(0.95); }
    15%  { opacity: 1; transform: translateY(0) scale(1); }
    80%  { opacity: 1; }
    100% { opacity: 0; transform: translateY(-10px); }
}

.img-container{
position:relative;
overflow:hidden;
}

.zoom-img{
width:100%;
border-radius:10px;
transition:transform .3s ease;
cursor:zoom-in;
}

.product-img-wrap.zoom-active .zoom-img{
transform:scale(2);
cursor:zoom-in;
}

/* zoom active */
.product-img-wrap.zoom-active .zoom-lens {
  display: block;
}
 

.disabled-cart{
    cursor: not-allowed;
    opacity:0.4;
}

.disabled-cart *{
    pointer-events:none;
}


.example .exbut {
    
    pointer-events: none;
    cursor: not-allowed;
}

/* input empty இல்லனா enable */
.example input:valid ~ .exbut {
    opacity: 1;
    pointer-events: auto;
    cursor: pointer;
}

.example .exbut i {
    opacity: 0.3;
}

.example input:valid ~ .exbut i {
    opacity: 1;
}

.example1 .exbut1 {
    
    pointer-events: none;
    cursor: not-allowed;
}

/* input empty இல்லனா enable */
.example1 input:valid ~ .exbut1 {
    opacity: 1;
    pointer-events: auto;
    cursor: pointer;
}

.example1 .exbut1 i {
    opacity: 0.3;
}

.example1 input:valid ~ .exbut1 i {
    opacity: 1;
}


.scroll-text {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    animation: scroll-left 60s linear 3;
     
     color:black;font-size:13px;padding-top:7px;
  }
  @keyframes scroll-left {
    from { transform: translateX(100%); }
    to { transform: translateX(-100%); }
  }