.html, body{
 	font-family: Roboto, Arial !important;
 }
 *{
 	margin: 0;
 	padding: 0;
 	box-sizing: border-box;
 }

.bc1{ border:1px solid red; }
.bc2{ border:1px solid green; }
.bc3{ border:1px solid orange; }
.bc4{ border:1px solid blue; }
.bc5{ border:1px solid black; }
.row{
	margin: 0px;
	padding: 0px;
}
.top-strip{
	background:#fff;
	color:#212121;
}

.nav2{
	background:#f7f7f7;
}
 
.nav3{
   		background-color: #248232 !important;
   		color: white !important;
}

.nav3 ul{
   		margin-left: 40px;
   		margin-right: 20px;
}
 

.nav3 ul{
	margin-left: 80px;
	height: 40px;
	line-height: 40px; 
	float: left;
}
 
.navbar-brand #logo{
	width:150px;
}
.nav3 ul nav-navbar nav-item a:hover{
	color: white;
}

.pic{
	width:40px;
	height:40px;
	border-radius:50%;
}

.overlay {
  height: 550px;
  width: 0; 
  z-index: 1000 !important;
  background-color: white;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 0px;
  position: relative;
}

.overlay a {

  text-decoration: none;
  font-size: 20px;
  color: black;
  display: block;
  transition: 0.3s;
  margin-top: 2px;
  display: block;
  background-color: #f7f7f7;
  text-align: center;
  overflow-x: visible;
  z-index: 1000 !important;
  position: relative;
}

.overlay a:hover {
  scroll-behavior: initial;
  background-color: #248232;
  color: white !important;
  text-align: center;
  z-index: 1000 !important;
  overflow-x: visible;
  position: relative;

}

.overlay .closebtn {
  
  top: 0;
  right: 25px;
  font-size: 20px;
  margin-left: 60px;
}

.nav3 ul ul li a{
	color: white !important;
	margin-left: 10px;
	margin-right: 10px;
	padding-bottom: 10px;
	line-height: 30px;
	font-size: 17px;
}

.nav3 ul ul li a:hover{
	background-color: white;
	color: #248232 !important;
	
}
.nav3 ul ul .navbar-nav{
	margin-left: 100px;
	position: absolute;
	padding: 0px !important;
}
 .nav3 ul ul li nav-item:hover{
 	color: black;
 	background-color: black !important;
 	margin: 0px;
 	padding: 0px;
 	height: 100%;
 }
.nav3 .navbar-nav .dropdown .dropdown-menu a{
	color: black !important;
}
.nav3 .navbar-nav .dropdown .dropdown-menu a:hover{
	color: white !important;
	background-color: #248232 !important;
	margin: 0px;
}
@media only screen and (min-width: 992px) {
	.search-box{
		width:300px!important;
		border-right:0;
		border-top-right-radius:0;
		border-bottom-right-radius:0;
	}
}

@media only screen and (max-width: 576px) {
	.search-box{
		width:200px!important;
		border-right:0;
		border-top-right-radius:0;
		border-bottom-right-radius:0;
	}

	
}


@media only screen and (max-width: 991px) {
	.navbar-nav .dropdown-menu {
		position: absolute;
		/*width:100%;*/
		float: none;
	}
	
	.dropdown-menu-right {
		left: auto;
		right: 0
	}
}



.search-btn{
	border: 1px solid #ced4da;
	border-top-left-radius:0;
	border-bottom-left-radius:0;
	border-left:0;
}

 
.lappi .navbar{
	padding: 0;
}

.offers{
	margin-top: 120px;
}
.offers .row{
	
 }
 .offers .row .col{
 	font-size: 20px;
 	font-weight: 400;
 	background-color: #248232;
 	color: white;
 	border-style: hidden;
    border-radius: 2px;
    
 }
 
 
 
 .offers .row .col .row .col-3{
 	margin-top: 0;
 	padding-top: 0;
 	padding-bottom: 0;
 }
 .offers .row .col .row .col-9{
 	margin-top: 10px;
 	padding-top: 0;
 	padding-bottom: 0;
 	margin-bottom: 0px;
 }
 .br{
	border-radius: 2px;
	border-color: black;
    border-style: groove;
}
.mga{
	margin-left: 20px;
	margin-right: 20px;
}
.row .col-9 .marquee{
	background-color: red;
	color: black;
}

.ct{
	background-color: #f7f7f7;
	margin top: 0px;
	margin-bottom: 70px; 
}
.container-category{
	background-color: #f7f7f7;
	margin-left: 0px;
	margin-bottom: 40px;
	margin-top: 20px;
}
.row .col-3{

}
 
.container-category .col-3 .row{
 	display: block;
 	background-color: white;
 	color: #248232;
 	font-size: 18px;
 	font-weight: 400;
 	margin-left: 40px;
 	line-height: 40px;
 	padding: 0;
 	margin-bottom: 3px;
 	text-align: center;

 }
 .container-category .col-3 .row .clr{
    background-color: #2BA84A;
    color: white;
}
 .container-category .col-3 .row a{
 	display: block;
 	background-color: white;
 	color: #248232;
 	font-size: 18px;
 	font-weight: 400;
 	margin-left: 40px;
 	line-height: 40px;
 	padding: 0;
 	margin-bottom: 3px;
 	text-align: center;
 	text-decoration: none;

 }
 .container-category .col-3 .row:hover{
 	background-color: #248232;
 	color: white;
 }
 .container-category .col-3 .row a:hover{
 	background-color: #248232;
 	color: white;
 }
 

  
 .container-category img{
    margin-bottom: 20px;
    margin-top: 20px;
 }
 .container-category .col-9 .row .col{
 	background-color: white;
    height: 400px;
 	border-color: ;
 	border-width: 1px;
 	border-style: hidden;
    margin-left: 5px;
    margin-right: 5px;
    font-size: 15px;
    text-align: center;
    align-items: center;
    font-weight: 500;
 }
  .container-category .col-12 .row .col{
 
    height: 350px;
 	border-color: ;
 	border-width: 1px;
 	border-style: hidden;
    margin-left: 5px;
    margin-right: 5px;
    font-size: 15px;
    text-align: center;
    align-items: center;
    font-weight: 500;
    margin-bottom: 20px;
 }
 .container-category .col-9 .row .col .details{
   height: 180px;
 }
 .container-category .col-12 .row .col .details{
   height: 170px;
   font-size: 15px;
 }
 .container-category .col-12 .row .col .name{
 	height: 80px;
 	font-weight: bold;
 	font-size: 15px !important;

 }
  .container-category .col-9 .row .col:hover .name{
  	background-color: white;
  	
  }
  .container-category .col-12 .row .col:hover .name{
  	background-color: ;
  	 
  }
.container-category .col-9 .row .col img{
	width: 120px; 
	height: 120px;
	margin-bottom: 10px;
}
  .container-category .col-md-12 .col-6 {
  	height: 400px;
  	margin-bottom: 20px !important;
  }
h2:hover{
	font-weight:;
}
 .p-4{
 	padding: 0 !important;
 	padding-left: 1.0rem !important;
 	padding-top: 0.5rem !important;
 }
 pos-f-t{
 	margin-bottom: 10px !important;
 }


.offers i{
	 
	width: 50px;
	height: 50px;
}
 
.offers p{
	float: right;
	text-align: right;
} 
.container-category .col-9 .row .col{
    height: 320px;
     
}
.container-category .col-9 .row .col .details{
	height: 160px;

}
.container-category .col-9 .row .col .name{
	height: 60px;

}
.container-category .col-9 .row .col label{

}
/*   ***************************************************************   responsive  *******************************************************************  */




@media only screen and (max-width: 800px){
    html,body{
    	width: 100%;
    	min-height: 100%;
    	margin: 0px;
    	padding: 0px;
    	overflow-x: hidden;
    }
	.lappi{
		visibility: collapse;
		height: 0px;
	}
	.phone{
		visibility: all;
	}
	.mq{
		visibility: collapse;
		height: 0px;
	}
	.phone .navbar-nav .nav-item{
		float: left;
	}
	#wowslider-container{
		float: all;
		margin-top: 25px;
	}
	.container-category{
		margin-left: -10px !important;
	}
	.container-category .row .col-3{
		display: none;
      
	}
	.ph{
		visibility: all;
		background-color: #f7f7f7;
		margin-bottom: 0px !important;
	} 
	.ph .navbar{
		width: 98vw !important;
	}
	.ph .navbar p{
		margin-bottom: 0 !important;
		font-size: 15px;
	}
	.ph .navbar-toggler{
		border-color: #248232 !important;
	}
	 .dropdown-menu {
	 	
        width: 0; 
        z-index: 10000;
        background-color: white;
        overflow-x: hidden;
        transition: 0.5s;
        padding-top: 0px;
        width: 50%;

	 }
	 .dropdown-menu a{
	 	 text-decoration: none;
         font-size: 30px;
         color: black;
         width: 100%;
         display: block;
         transition: 0.3s;
         margin-top: 2px;
         display: block;
         background-color: #f7f7f7;
         text-align: center;
         overflow-x: visible;
	 }
	 .dropdown-menu a:hover{
	 	 scroll-behavior: initial;
         background-color: #248232;
         color: white;
         text-align: center;
         overflow-x: visible;
	 }
	 .container-category .row .col-12 .row .col{
	 	height: 400px;
	 }
	
	.container-category .row .col-12 .row .col .details{
		height: 200px;
		margin-bottom: 10px;
	}
	.container-category .row .col-12 .row .col .name{
		height: 80px;
		font-weight: 550;
		margin-bottom: 9px;
	}
	.container-category .row .col-12 .row .col .name:hover{
		font-weight: 900;
	}


	.path{
		margin: 0px !important;
		padding: 10px !important;
	  }
	.product{
        margin-left: 10px !important;
        margin-right: 10px !important;
        padding: 0px !important;
	}
	.pd1{

	}	
	.ic{
		position: relative;
		top: 4px;
		color: grey;
		left: 330px;
	} 
	.on{
		float: right !important;
		right: 0px;
	}
	.mg2{
		margin-top: 10px;
	}
	.contact{
		margin: 0 !important;
		padding: 0 !important;
	}
	.path{
		margin: 0 !important;
		padding: 0 !important;
	}
	.mg3{
		padding-top: 22px;
	}
	.mp{
		padding-left: 2px;
		padding-right: 0px;
	}
	.ma{
		padding-left: 2px !important;
	}
	.wd1{
		width: 250px !important;
	}
}
@media only screen and (min-width: 800px){
	.phone{
		visibility: collapse;
		display: none;
	}
	.lappi{
		visibility: all;
	}
	.ph{
		display: none;
	}
	.ic{
	position: relative; 
	left: 245px; 
	top: 4px; 
	color: grey;
}
}

@media only screen and (max-width: 800px){
	.offers .row .col {
		margin: 5px;	}
	.offers .row .col .row .col-9 .col-sm-6{
		float: right;
		margin-right: 0px;
	}	
	
}


#wowslider-container{
	width: 100% !important;
	max-width: 100% !important;
	max-height: 410px;
 }
#wowslider-container .ws_bullets{
 	margin-bottom: 40px !important;
 	top: 460px !important;
 	left: 48%;
 	display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
    vertical-align: middle;
 }