Advertisement
Guenni007

menu

Mar 3rd, 2022
940
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 9.05 KB | None | 0 0
  1. /* ======================================================================================================================================================
  2. SUBMENU
  3. ====================================================================================================================================================== */
  4.  
  5. #top .sticky_placeholder    { height:51px; position: relative; clear:both; }
  6. #top .av-submenu-container  { min-height:52px; position: relative; width:100%; border-bottom-style: solid; border-bottom-width: 1px; -webkit-perspective: 1000px; -webkit-backface-visibility: hidden; font-size: 13px; line-height: 1.65em;}
  7. #top .av-submenu-container.av-sticky-submenu{position: absolute;}
  8.  
  9. #top .av-submenu-container .container{padding:0 !important;}
  10. #top .av-subnav-menu      { margin:0; }
  11. #top .av-subnav-menu   li {position: relative; display: block; margin:0;}
  12. #top .av-subnav-menu > li {padding:15px 0; display: inline-block;}
  13. #top .av-subnav-menu > li > a{padding:0px 10px 0px 12px; display: block; border-left-style:solid; border-left-width:1px;}
  14. #top .av-subnav-menu > li:first-child a{border-left:none;}
  15. #top .av-subnav-menu > li ul{visibility:hidden; position: absolute; width:200px; top:50px; left: 0; text-align: left; border-style: solid; border-width:1px; margin:0; opacity: 0;
  16. -webkit-transition: all 0.3s ease-in-out; transition:all 0.3s ease-in-out;
  17. }
  18. #top .av-subnav-menu > li ul a{line-height: 23px; padding: 8px 15px; width:100%; display: block; }
  19. #top .av-subnav-menu > li ul ul{left:198px;top:-1px;}
  20.  
  21. #top .av-subnav-menu li a{text-decoration: none;}
  22. #top .av-subnav-menu li:hover > ul{visibility:visible; opacity: 1;}
  23. #top .av-subnav-menu li > ul.av-visible-mobile-sublist{visibility:visible; opacity: 1;}
  24.  
  25. #top .av-subnav-menu .avia-bullet{display:none;}
  26. #top .av-subnav-menu .av-menu-button > a{padding: 0; border:none;}
  27.  
  28. #top .av-submenu-pos-left{text-align: left;}
  29. #top .av-submenu-pos-center{text-align: center;}
  30. #top .av-submenu-pos-right{text-align: right;}
  31. #top .av-submenu-pos-right > .av-subnav-menu > li ul ul{left:-200px;}
  32.  
  33. #top .av-submenu-container .avia-menu-fx{display:none;}
  34.  
  35. #top .mobile_menu_toggle{
  36. display: none;
  37. height: 46px; min-width: 46px; line-height: 46px; padding:0px 20px;
  38. text-decoration: none; text-align: center;
  39. margin:0 3px; z-index: 10000;
  40. border-style:solid;
  41. border-width: 1px;
  42. border-top:none;
  43. border-bottom:none;
  44. font-size: 30px;
  45. position: relative;
  46. }
  47.  
  48. #top .mobile_menu_toggle .av-current-placeholder{font-size: 14px; vertical-align: bottom; display: inline-block; margin-left:20px;}
  49. #top .av-subnav-menu li:hover > ul { z-index: 10; }
  50. #top .av-submenu-container:hover {
  51.     z-index: 400 !important;
  52. }
  53.  
  54.  
  55.  
  56.  
  57. @media only screen and (max-width: 989px)
  58. {
  59.     .responsive #top .av-switch-990 .sticky_placeholder{max-height:0px; }
  60.     /***** this setting top and position is changed to not !important rules **********/
  61.     .responsive #top .av-switch-990.av-submenu-container{top: auto; position: relative; height:auto; min-height:0; margin-bottom: -1px;}
  62.    
  63.     /*.responsive #top .av-switch-990 .av-menu-mobile-active {text-align: center; }*/
  64.     .responsive #top .av-switch-990 .av-menu-mobile-active .mobile_menu_toggle{display: inline-block;}
  65.     .responsive #top .av-switch-990 .av-menu-mobile-active .av-subnav-menu{display:none;}
  66.    
  67.     .responsive #top #wrap_all .av-switch-990 .av-menu-mobile-active.container {width:100%; max-width: 100%;}
  68.     .responsive #top .av-switch-990 .av-menu-mobile-active .av-open-submenu.av-subnav-menu{display:block;}
  69.     .responsive #top .av-switch-990 .av-menu-mobile-active .av-subnav-menu > li:first-child{margin-top:-1px;}
  70.     .responsive #top .av-switch-990 .av-menu-mobile-active .av-subnav-menu  li{display:block; border-top-style: solid; border-top-width: 1px; padding:0;}
  71.     .responsive #top .av-switch-990 .av-menu-mobile-active .av-subnav-menu > li > a{border-left:none; padding:15px 15%; text-align: left;}
  72.     .responsive #top .av-switch-990 .av-menu-mobile-active .av-subnav-menu > li a:before{content: "\25BA"; position: absolute; top: 15px; margin-left: -10px; font-family: 'entypo-fontello'; font-size: 7px;}
  73.     .responsive #top .av-switch-990 .av-menu-mobile-active .av-subnav-menu li > ul{visibility:visible; opacity: 1; top:0; left:0; position: relative; width:100%; border:none;}
  74.     .responsive #top .av-switch-990 .av-menu-mobile-active.av-submenu-hidden .av-subnav-menu li > ul{display: none;}
  75.     .responsive #top .av-switch-990 .av-menu-mobile-active.av-submenu-hidden .av-subnav-menu li > ul.av-visible-sublist{display: block;}
  76.    
  77.     .responsive #top .av-switch-990 .av-menu-mobile-active .av-subnav-menu li > ul a{padding:15px 19%;}
  78.     .responsive #top .av-switch-990 .av-menu-mobile-active .av-subnav-menu li li > ul a{padding:15px 24%;}
  79.     .responsive #top .av-switch-990 .av-menu-mobile-active .av-subnav-menu li li li > ul a{padding:15px 29%;}
  80. }
  81.  
  82. @media only screen and (max-width: 767px)
  83. {
  84.     .responsive #top .av-switch-768 .sticky_placeholder{max-height:0px; }
  85.     /***** this setting top and position is changed to not !important rules **********/
  86.     .responsive #top .av-switch-768.av-submenu-container{top: auto; position: relative; height:auto; min-height:0; margin-bottom: -1px;}
  87.    
  88.     /*.responsive #top .av-switch-768 .av-menu-mobile-active {text-align: center; }*/
  89.     .responsive #top .av-switch-768 .av-menu-mobile-active .mobile_menu_toggle{display: inline-block;}
  90.     .responsive #top .av-switch-768 .av-menu-mobile-active .av-subnav-menu{display:none;}
  91.    
  92.     .responsive #top #wrap_all .av-switch-768 .av-menu-mobile-active.container {width:100%; max-width: 100%;}
  93.     .responsive #top .av-switch-768 .av-menu-mobile-active .av-open-submenu.av-subnav-menu{display:block;}
  94.     .responsive #top .av-switch-768 .av-menu-mobile-active .av-subnav-menu > li:first-child{margin-top:-1px;}
  95.     .responsive #top .av-switch-768 .av-menu-mobile-active .av-subnav-menu  li{display:block; border-top-style: solid; border-top-width: 1px; padding:0;}
  96.     .responsive #top .av-switch-768 .av-menu-mobile-active .av-subnav-menu > li > a{border-left:none; padding:15px 15%; text-align: left;}
  97.     .responsive #top .av-switch-768 .av-menu-mobile-active .av-subnav-menu > li a:before{content: "\25BA"; position: absolute; top: 15px; margin-left: -10px; font-family: 'entypo-fontello'; font-size: 7px;}
  98.     .responsive #top .av-switch-768 .av-menu-mobile-active .av-subnav-menu li > ul{visibility:visible; opacity: 1; top:0; left:0; position: relative; width:100%; border:none;}
  99.     .responsive #top .av-switch-768 .av-menu-mobile-active.av-submenu-hidden .av-subnav-menu li > ul{display: none;}
  100.     .responsive #top .av-switch-768 .av-menu-mobile-active.av-submenu-hidden .av-subnav-menu li > ul.av-visible-sublist{display: block;}
  101.    
  102.     .responsive #top .av-switch-768 .av-menu-mobile-active .av-subnav-menu li > ul a{padding:15px 19%;}
  103.     .responsive #top .av-switch-768 .av-menu-mobile-active .av-subnav-menu li li > ul a{padding:15px 24%;}
  104.     .responsive #top .av-switch-768 .av-menu-mobile-active .av-subnav-menu li li li > ul a{padding:15px 29%;}
  105. }
  106.  
  107. @media only screen and (max-width: 479px)
  108. {
  109.     .responsive #top .av-switch-480 .sticky_placeholder{max-height:0px; }
  110.     /***** this setting top and position is changed to not !important rules **********/
  111.     .responsive #top .av-switch-480.av-submenu-container{top: auto; position: relative; height:auto; min-height:0; margin-bottom: -1px;}
  112.    
  113.     /*.responsive #top .av-switch-480 .av-menu-mobile-active {text-align: center; }*/
  114.     .responsive #top .av-switch-480 .av-menu-mobile-active .mobile_menu_toggle{display: inline-block;}
  115.     .responsive #top .av-switch-480 .av-menu-mobile-active .av-subnav-menu{display:none;}
  116.    
  117.     .responsive #top #wrap_all .av-switch-480 .av-menu-mobile-active.container {width:100%; max-width: 100%;}
  118.     .responsive #top .av-switch-480 .av-menu-mobile-active .av-open-submenu.av-subnav-menu{display:block;}
  119.     .responsive #top .av-switch-480 .av-menu-mobile-active .av-subnav-menu > li:first-child{margin-top:-1px;}
  120.     .responsive #top .av-switch-480 .av-menu-mobile-active .av-subnav-menu  li{display:block; border-top-style: solid; border-top-width: 1px; padding:0;}
  121.     .responsive #top .av-switch-480 .av-menu-mobile-active .av-subnav-menu > li > a{border-left:none; padding:15px 15%; text-align: left;}
  122.     .responsive #top .av-switch-480 .av-menu-mobile-active .av-subnav-menu > li a:before{content: "\25BA"; position: absolute; top: 15px; margin-left: -10px; font-family: 'entypo-fontello'; font-size: 7px;}
  123.     .responsive #top .av-switch-480 .av-menu-mobile-active .av-subnav-menu li > ul{visibility:visible; opacity: 1; top:0; left:0; position: relative; width:100%; border:none;}
  124.     .responsive #top .av-switch-480 .av-menu-mobile-active.av-submenu-hidden .av-subnav-menu li > ul{display: none;}
  125.     .responsive #top .av-switch-480 .av-menu-mobile-active.av-submenu-hidden .av-subnav-menu li > ul.av-visible-sublist{display: block;}
  126.    
  127.     .responsive #top .av-switch-480 .av-menu-mobile-active .av-subnav-menu li > ul a{padding:15px 19%;}
  128.     .responsive #top .av-switch-480 .av-menu-mobile-active .av-subnav-menu li li > ul a{padding:15px 24%;}
  129.     .responsive #top .av-switch-480 .av-menu-mobile-active .av-subnav-menu li li li > ul a{padding:15px 29%;}
  130. }
  131.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement