This widget is specially made for mobile devices in this mobile first world. It will give you better idea when you visit this in your mobile device. 
			Go to https://elementor.theplusaddons.com/widgets/mobile-menu/ on your mobile browser or scan the QR code.		
							<figure  >
								<img width="200" height="200" src="https://mobdi3.sa/wp-content/uploads/2020/04/Mobile-Menu.png" alt="" srcset="https://mobdi3.sa/wp-content/uploads/2020/04/Mobile-Menu.png 200w, https://mobdi3.sa/wp-content/uploads/2020/04/Mobile-Menu-150x150.png 150w, https://mobdi3.sa/wp-content/uploads/2020/04/Mobile-Menu-100x100.png 100w, https://mobdi3.sa/wp-content/uploads/2020/04/Mobile-Menu-75x75.png 75w" sizes="100vw" />								
							</figure>
			Note: We also have some extra options such as Fixed Bottom and Offset for Visibility, Which we couldn't demonstrate on our page but you can do that using our options. 		
			 <h2    data-hover="Layout 1">Layout 1  </h2><h3> Extra Toggle +Active Border + Active Dot + Style 2 </h3>		
			 <h2    data-hover="Layout 2">Layout 2  </h2><h3> Extra Toggle + Style 2 </h3>		
			 <h2    data-hover="Layout 3">Layout 3  </h2><h3>  Active Icon Color + Style 1 </br> Fixed Bottom Center Menu </h3>		
			 <h2    data-hover="Layout 4">Layout 4  </h2><h3> Extra Toggle + Style 2 </h3>		
			 <h2    data-hover="Layout 5">Layout 5  </h2><h3> Swiper Menu </h3>		
			 <h2    data-hover="Layout 6">Layout 6  </h2><h3> Active Bottom Border + Position Fixed +  Style 1  </h3>		
			 <h2    data-hover="Layout 7">Layout 7  </h2><h3> Swiper Menu </h3>		
			 <h2    data-hover="Facebook">Facebook  </h2><h3> Pin + Extra Toggle +Active color + Style 1 </h3>		
			<ul><li><a style="cursor:pointer;"></a></li><li><a  href="#"   >Linkedin</a></li><li><a  href="#"   >Twitter</a></li><li><a  href="tel:77788809"   >Phone</a></li><li><a  href="#"   >Instagram</a></li></ul><style>.circle_menu5ea638c997829 .plus-circle-menu{margin: 0 auto !important;margin-top:auto !important;bottom:auto;left:auto;right:24%;}.circle_menu5ea638c997829 .plus-circle-menu{top: auto;}.circle_menu5ea638c997829.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(2), .circle_menu5ea638c997829.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(2){
												bottom: 55px;
											}.circle_menu5ea638c997829.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(3), .circle_menu5ea638c997829.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(3){
												bottom: 110px;
											}.circle_menu5ea638c997829.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(4), .circle_menu5ea638c997829.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(4){
												bottom: 165px;
											}.circle_menu5ea638c997829.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(5), .circle_menu5ea638c997829.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(5){
												bottom: 220px;
											}</style>		
			 <h2    data-hover="Circle Mobile Menu">Circle Mobile Menu  </h2>		
			<ul><li><a style="cursor:pointer;"></a></li><li><a  href="tel:77788809"   >Phone</a></li><li><a  href="#"   >Twitter</a></li><li><a  href="#"   >Instagram</a></li><li><a  href="#"   >Linkedin</a></li></ul><style>.circle_menu5ea638c99ad0a .plus-circle-menu{margin: 0 auto !important;margin-top:auto !important;bottom:auto;left:20%;right:auto;}.circle_menu5ea638c99ad0a .plus-circle-menu{top: auto;}.circle_menu5ea638c99ad0a.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(2), .circle_menu5ea638c99ad0a.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(2){
												bottom: 55px;
											}.circle_menu5ea638c99ad0a.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(3), .circle_menu5ea638c99ad0a.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(3){
												bottom: 110px;
											}.circle_menu5ea638c99ad0a.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(4), .circle_menu5ea638c99ad0a.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(4){
												bottom: 165px;
											}.circle_menu5ea638c99ad0a.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(5), .circle_menu5ea638c99ad0a.plus-circle-menu-wrapper.layout-straight .plus-circle-menu.circleMenu-open.menu-direction-top .plus-circle-menu-list:not(.plus-circle-main-menu-list):nth-child(5){
												bottom: 220px;
											}</style>		
			 <h2    data-hover="Off Canvas Mobile Menu">Off Canvas Mobile Menu  </h2>		
			Quick Menu