 <!----***********header start**************------->
<style>
body {
  font-family: "Lato", sans-serif;
  background:#FFFFFF;
}

.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #111;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
}

.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.sidenav a:hover {
  color: #f1f1f1;
}

.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}
@import url(https://fonts.googleapis.com/css?family=Lato:100,300,400,700);
@import url(https://raw.github.com/FortAwesome/Font-Awesome/master/docs/assets/css/font-awesome.min.css);

body {
	font-size: 15px;
}
/*#wrap {
  margin: 50px 100px;
  display: inline-block;
  position: relative;
  height: 60px;
  float: right;
  padding: 0;
  position: relative;
}

input[type="text"] {
  height: 32px;
  font-size: 20px;
  display: inline-block;
  font-weight: 100;
  border: none;
  outline: none;
  color: #000;
  padding: 3px;
  padding-right: 60px;
  width: 0px;
  position: absolute;
  top: 0;
  right: 0;
  background: none;
  z-index: 3;
  transition: width .4s cubic-bezier(0.000, 0.795, 0.000, 1.000);
  cursor: pointer;
}

input[type="text"]:focus:hover {
  border-bottom: 1px solid #BBB;
}

input[type="text"]:focus {
  width: 400px;

  z-index: 1;
  border-bottom: 1px solid #BBB;
  cursor: text;
}
input[type="submit"] {
  height: 35px;
  width: 35px; 
  display: inline-block;
  color:red;
  float: right;
  background: url(assets/img/icon-new.png) center center no-repeat;
  text-indent: -10000px;
  border: none;
  background-color:#fff;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  cursor: pointer;
  opacity: 0.4;
  cursor: pointer;
  transition: opacity .4s ease;
}

input[type="submit"]:hover {
  opacity: 0.8;
}*/





</style>
<div id="mySidenav" class="sidenav">
  <a href="javascript:void(0)" class="closebtn" onClick="closeNav()">&times;</a>

  <a href="https://homeofretailer.com/blog/own-your-style:-wear-different-with-loft-outfits" style="font-size:15px;" class="">Life Style</a>
  <a href="https://homeofretailer.com/blog/top-foremost-effective-driven-trending-outfits" style="font-size:15px;" class="">Fashion</a>
  <a href="https://homeofretailer.com/category/index.php?blgview=Beauty" style="font-size:15px;" class="">Beauty</a>
  <a href="https://homeofretailer.com/blog/find-out-budget-friendly-vocation-places-on-booking" style="font-size:15px;" class="d-lg-none">Budget</a>
  <a href="https://homeofretailer.com/blog/track-down-the-unique-rental-experiences-with-airbnb" style="font-size:15px;" class="d-lg-none">Travel</a>
  <a href="https://homeofretailer.com/blog/craft-like-a-pro:-unlock-your-creative-potential-with-cricut" style="font-size:15px;" class="d-lg-none">Furniture</a>
 
  
  

  
</div>

<nav class="navbar navbar-expand-lg  navbar-light col-12 bg-light m-auto pt-2 pl-0" >
   <div class="col-3 pt-2" style="background-color:none; color: #000;">
       <a href="<?php echo $basepath; ?>">
       <img src="<?php echo $basepath; ?>assets/img/retaillogo.png" />
       </a>
       </div>
     <span style="font-size:30px;cursor:pointer" class="d-lg-none" onClick="openNav()">&#9776;</span>
<div class="col-6 text-center bg-none d-none d-lg-block ">
<!-- <a href="<?php echo $basepath; ?>" class="p-3 mt-1" style="color: #000; font-size:16px; text-decoration: none;"><font face="Poppins">Trending</font></a>-->
<a href="<?php echo $basepath; ?>blog" class="p-3 mt-1" style="color: #000; font-size:16px; text-decoration: none;"><font face="Poppins">Blogs Post</font></a>
<a href="<?php echo $basepath; ?>promos" class="p-3 mt-1" style="color: #000; font-size:16px; text-decoration: none;"><font face="Poppins">Brands</font></a>
<a href="https://homeofretailer.com/category/index.php?blgview=CLOTHING" class="p-3 mt-1" style="color: #000; font-size:16px; text-decoration: none;"><font face="Poppins">Fashion</font></a>
<a href="https://homeofretailer.com/category/index.php?blgview=Beauty" class="p-3 mt-1" style="color: #000; font-size:16px; text-decoration: none;"><font face="Poppins">Beauty</font></a>
<a href="https://homeofretailer.com/category/index.php?blgview=Furniture" class="p-3 mt-1" style="color: #000; font-size:16px; text-decoration: none;"><font face="Poppins">Home Decor</font></a>

<!--<a href="#" class="p-3" style="color: #000; font-size:14px; text-decoration: none;"><font face="Poppins"><b>Faviourte</b></font></a>-->
<!-- Example single danger button -->


  </div>
  <div class="col-sm-2 text-right  mr-4 d-none d-lg-block" >
      
      
 <div class="btn-group" style="background-color: #ff3ab2; border-radius: 20px; color: #fff; ">
  <button type="button" class="btn btn-white dropdown-toggle"  data-toggle="dropdown"  style="color:#fff; font-size:16px;" aria-haspopup="true" aria-expanded="false">
 <font face="Poppins">Categories</font>
  </button>
  <div class="dropdown-menu p-0 m-0">
    <a class="dropdown-item p-0 m-0" href="#"><?php  echo $view->masterCategory2();  ?></a>  
    
  </div>
</div>   
      
   
<!--<div class="btn-group" style="background-color: #ff3ab2; border-radius: 20px; color: #fff; ">
  <button type="button" class="btn btn-white dropdown-toggle"  data-toggle="dropdown"  style="color:#fff; font-size:16px;" aria-haspopup="true" aria-expanded="false">
 <font face="Poppins">Categories</font>
  </button>
  <div class="dropdown-menu p-0 m-0">
    <a class="dropdown-item p-0 m-0" href="#"><?php  //echo $view->masterCategory();  ?></a>  
    
  </div>
</div><!--button end--->


  <!--<form action="" autocomplete="on">
  <input id="search" name="search" type="text" style="font-size:25px;" placeholder="Serach Store..."><input id="search_submit" value="Rechercher" type="submit">
  </form>-->
  </div><!--col-3-->
   <span style="font-size:30px;cursor:pointer" class="d-none d-lg-block" onClick="openNav()">&#9776;</span>
  
</nav>

<script>
function openNav() {
  document.getElementById("mySidenav").style.width = "250px";
}

function closeNav() {
  document.getElementById("mySidenav").style.width = "0";
}
</script>
   <!---*****************header end**************----->
   