API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Jan 19th, 2020
128
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 13.13 KB | None | 0 0
raw download clone embed print report
  1. .middle-header-navigation .btn.focus,.middle-header-navigation .btn:focus {
  2.     outline: 0;
  3.     -webkit-box-shadow: none;
  4.             box-shadow: none;
  5. }
  6. .middle-header-navigation .middle-header-navigation {
  7.   background-color:transparent !important;
  8. }
  9. .middle-header-navigation .nav-link {
  10.     padding: 0;
  11. }
  12. .middle-header-navigation .container-middle-menu {
  13.   width: 90%;
  14.     display: -webkit-box;
  15.     display: -ms-flexbox;
  16.     display: flex;
  17.     -ms-flex-wrap: nowrap;
  18.         flex-wrap: nowrap;
  19.     -webkit-box-align: center;
  20.         -ms-flex-align: center;
  21.             align-items: center;
  22.     margin: auto;
  23.     -webkit-box-pack: justify;
  24.         -ms-flex-pack: justify;
  25.             justify-content: space-between;
  26. }
  27. .middle-header-navigation ul#menu-menu-middle li,
  28. .middle-header-navigation ul#menu-menu-middle li a {
  29.   color:#fff;
  30.   list-style:none;
  31.   text-transform:uppercase;
  32.   -webkit-transition:all 500ms ease;
  33.   transition:all 500ms ease;
  34.   cursor: pointer;
  35. }
  36. .middle-header-navigation ul#menu-menu-middle li > ul.sub-menu.sub-menu-primary > li > a {
  37.   color:#d7af64;
  38.   padding: 5px 30px;
  39.   font-size:20px;
  40. }
  41. .middle-dekstop-menu ul.sub-menu.sub-menu-primary > li > ul.sub-menu-second .nav-link {
  42.   padding: 2px 5px;
  43.   font-size:14px;
  44. }
  45. .middle-dekstop-menu ul.sub-menu.sub-menu-primary > li > ul.sub-menu-second {
  46.   padding: 0 25px;
  47.   max-height: 175px;
  48.   overflow: auto;
  49. }
  50. .middle-header-navigation .middle-dekstop-menu ul#menu-menu-middle li:hover > a {
  51.   color: #8e774c;
  52.   -webkit-transition:all 500ms ease;
  53.   transition:all 500ms ease;
  54. }
  55. .middle-header-navigation .middle-dekstop-menu{
  56.   margin-left: auto!important;
  57. }
  58. /*.menu-menu-middle-container {
  59.   margin-left: auto!important;
  60. }*/
  61. /* .menu-menu-middle-container ul#menu-menu-middle > li,
  62. .middle-header-navigation ul#menu-menu-middle.navbar-search {
  63.  padding-right:10%;
  64. } */
  65. .middle-header-navigation .middle-dekstop-menu ul#menu-menu-middle > li {
  66.  /*padding-right:10%;*/
  67.   padding-right: 70px;
  68.   width: 100%;
  69. }
  70. .middle-header-navigation .middle-dekstop-menu ul.sub-menu.sub-menu-primary {
  71.   opacity: 0;
  72.   visibility: hidden;
  73.   width: 100%;
  74.   height: auto;
  75.   position: absolute;
  76.   left: 0;
  77.   background: #313131;
  78.   display:-webkit-box;
  79.   display:-ms-flexbox;
  80.   display:flex;
  81.   top:0;
  82.   z-index:-1;
  83.   padding: 10% 5% 100px;
  84.   -webkit-transition:all 300ms ease;
  85.   transition:all 300ms ease;
  86. }
  87. .middle-header-navigation .middle-dekstop-menu ul.sub-menu.sub-menu-primary > li {
  88.   -webkit-box-flex:25%;
  89.       -ms-flex:25%;
  90.           flex:25%;
  91. }
  92. .middle-header-navigation .middle-dekstop-menu li.menu-item-has-children:hover ul.sub-menu.sub-menu-primary {
  93.    opacity: 1;
  94.   visibility: visible;
  95. }
  96. .middle-header-navigation .middle-dekstop-menu li.menu-item-has-children ul.sub-menu.sub-menu-primary li .bg-sub-menu-primary {
  97.   display: block;
  98.   position: relative;
  99.   height: 220px;
  100.   width: 100%;
  101.   padding: 10px;
  102. }
  103. .middle-header-navigation .middle-dekstop-menu li.menu-item-has-children ul.sub-menu.sub-menu-primary li .bg-sub-menu-primary img {
  104.   height: 100%;
  105.     width: 100%;
  106.     -o-object-fit: cover;
  107.        object-fit: cover;
  108. }
  109.  
  110. .middle-header-navigation #menu-item-search {
  111.   position:relative;
  112. }
  113. .middle-header-navigation #menu-menu-middle .search-middle-menu {
  114.     opacity: 0;
  115.     position: absolute;
  116.     left:0;
  117.      visibility: hidden;
  118.   -webkit-transform: translateX(-80%);
  119.           transform: translateX(-80%);
  120.       width: 250px;
  121.     padding: 15px 0 15px 25px;
  122.     background: rgb(20,21,17,0.9);
  123.     -webkit-transition: all 500ms ease;
  124.     transition: all 500ms ease;
  125. }
  126. .middle-header-navigation .search-middle-menu form button i {
  127.   color:#fff;
  128. }
  129.  
  130. .middle-header-navigation .search-middle-menu form input.input-search {
  131.   border:none;
  132.   border-bottom:1px solid #fff;
  133.   background:rgb(20,21,17,0.1);
  134.   outline:none;
  135.   color:#fff;
  136.   -webkit-transition: all 500ms ease;
  137.   transition: all 500ms ease;
  138. }
  139. .middle-header-navigation #menu-menu-middle > li:hover .search-middle-menu {
  140.     opacity: 1;
  141.     display: block;
  142.     position: absolute;
  143.     left:0;
  144.     visibility: visible;
  145. }
  146.  
  147. /*LOGO*/
  148. .middle-header-navigation .nav-logo.stay-header img {
  149.   height:50px;
  150.   -webkit-transition:all 500ms ease;
  151.   transition:all 500ms ease;
  152. }
  153. .middle-header-navigation .nav-logo img {
  154.   height:80px;
  155.   -webkit-transition:all 500ms ease;
  156.   transition:all 500ms ease;
  157. }
  158.  
  159.  
  160. .middle-header-navigation .middle-mobile-menu {
  161.     display: none;
  162.   }
  163. /*END LOGO*/
  164.  
  165. @media(max-width: 992px){
  166.   .middle-header-navigation a,.middle-header-navigation  li {
  167.     text-transform: uppercase;
  168.   }
  169. /*NAVBAR*/
  170.   .middle-header-navigation .middle-mobile-menu {
  171.     display: block;
  172.     width: 100%;
  173.     overflow: auto;
  174.   }
  175.   .middle-header-navigation .middle-dekstop-menu {
  176.     display: none;
  177.   }
  178. .middle-header-navigation .navbar {
  179.      padding: 0;
  180. }
  181. .middle-header-navigation .container-middle-menu {
  182.     width: 100%;
  183.     padding: 0 20px;
  184. }
  185. .middle-header-navigation .container-middle-menu.mobile-bg {
  186.   background: rgba(53,49,46,0.8);
  187. }
  188. /*END NAVBAR*/
  189.  
  190. /*OVERLAY*/
  191.   .middle-header-navigation .middle-dekstop-menu {
  192.     display: none;
  193.   }
  194.  
  195.   .middle-header-navigation .middle-mobile-menu {
  196.     opacity: 0;
  197.     visibility: hidden;
  198.   }
  199.   .middle-header-navigation .middle-mobile-menu.overlay-active {
  200.     opacity: 1;
  201.     visibility: visible;
  202.   }
  203.   .middle-header-navigation .middle-mobile-menu ul#menu-menu-middle-1 > li.nav-item > a {
  204.     color: #fff;
  205.     font-size: 22px;
  206.   }
  207. /*END OVERLAY*/
  208. .middle-header-navigation #menu-item-search .mobile-wrap{
  209.     display:inline-block;
  210.     height:20px;
  211.     width:25px;
  212.     cursor:pointer;
  213.   }
  214. .middle-header-navigation #menu-item-search .mobile-wrap .nav-icon-middle {
  215.   position: relative;
  216.   margin: 0;
  217.   -webkit-transform: rotate(0deg);
  218.       transform: rotate(0deg);
  219.   -webkit-transition: .5s ease-in-out;
  220.   transition: .5s ease-in-out;
  221.   cursor: pointer;
  222. }
  223. .middle-header-navigation #menu-item-search .mobile-wrap .nav-icon-middle  span {
  224.   display: block;
  225.   position: absolute;
  226.   height: 2px;
  227.   width: 100%;
  228.   background: #fff;
  229.   border-radius: 9px;
  230.   opacity: 1;
  231.   left: 0;
  232.   -webkit-transform: rotate(0deg);
  233.       transform: rotate(0deg);
  234.   -webkit-transition: .25s ease-in-out;
  235.   transition: .25s ease-in-out;
  236. }
  237.  
  238. .middle-header-navigation #menu-item-search .mobile-wrap .nav-icon-middle span:nth-child(1) {
  239.   top: 7px;
  240.   -webkit-transform-origin: left center;
  241.       transform-origin: left center;
  242. }
  243.  
  244. .middle-header-navigation #menu-item-search .mobile-wrap .nav-icon-middle span:nth-child(2) {
  245.   top: 14px;
  246.   -webkit-transform-origin: left center;
  247.       transform-origin: left center;
  248. }
  249.  
  250. .middle-header-navigation #menu-item-search .mobile-wrap .nav-icon-middle span:nth-child(3) {
  251.   top: 21px;
  252.   -webkit-transform-origin: left center;
  253.       transform-origin: left center;
  254. }
  255.  
  256. .middle-header-navigation #menu-item-search .mobile-wrap .nav-icon-middle.open span:nth-child(1) {
  257.   -webkit-transform: rotate(45deg);
  258.       transform: rotate(45deg);
  259.   top: 4px;
  260.   left: 4px;
  261. }
  262.  
  263. .middle-header-navigation #menu-item-search .mobile-wrap .nav-icon-middle.open span:nth-child(2) {
  264.   width: 0%;
  265.   opacity: 0;
  266. }
  267.  
  268. .middle-header-navigation #menu-item-search .mobile-wrap .nav-icon-middle.open span:nth-child(3) {
  269.   -webkit-transform: rotate(-45deg);
  270.       transform: rotate(-45deg);
  271.   top: 22px;
  272.   left: 4px;
  273. }
  274.  
  275.   .middle-header-navigation #menu-menu-middle.navbar-search {
  276.     -webkit-box-orient: horizontal;
  277.     -webkit-box-direction: normal;
  278.         -ms-flex-direction: row;
  279.             flex-direction: row;
  280.     -webkit-box-align: center;
  281.         -ms-flex-align: center;
  282.             align-items: center;
  283.   }
  284.   .middle-header-navigation #menu-menu-middle.navbar-search > li {
  285.     padding: 0 10px;
  286.   }
  287.   .middle-header-navigation .menu-item-search .nav-link {
  288.     display: block;
  289.     padding: 5px;
  290.   }
  291.  
  292. /*PERMAK*/
  293.   .middle-header-navigation .bg-sub-menu-primary {
  294.     height: 100px;
  295.     width: 100%;
  296.     max-width: 200px;
  297.     margin: 15px 0 20px 0;
  298.   }
  299.  .middle-header-navigation .bg-sub-menu-primary img {
  300.     height: 100px;
  301.     width: 100%;
  302.     -o-object-fit: cover;
  303.        object-fit: cover;
  304.   }
  305.   .middle-header-navigation .sub-menu {
  306.     position: relative;
  307.     opacity: 0;
  308.     visibility: hidden;
  309.     height:0;
  310.   }
  311.   .middle-header-navigation .sub-menu.active {
  312.     position: relative;
  313.     opacity: 1;
  314.     visibility: visible;
  315.     height: 100%;
  316.     list-style: none;
  317.     padding: 20px 0 0 0;
  318.   }
  319.   .middle-header-navigation .middle-mobile-menu {
  320.     position:absolute;
  321.     top:0;
  322.     left:0;
  323.     z-index:-1;
  324.     background:#313131;
  325.     height: 100vh;
  326.   }
  327.   .middle-header-navigation .middle-mobile-menu .menu-menu-middle-container {
  328.     margin-top:90px;
  329.     padding:30px;
  330.     overflow: auto;
  331.     height: 100%;
  332.   }
  333.   .middle-header-navigation .middle-mobile-menu .hide-mobile-menu {
  334.     opacity: 0;
  335.     visibility: hidden;
  336.   }
  337.   .middle-header-navigation .middle-mobile-menu .hide-mobile-menu.active-sub {
  338.     opacity: 1;
  339.     visibility: visible;
  340.     position: absolute;
  341.     top: 15%;
  342. }
  343.  
  344. .middle-header-navigation .middle-mobile-menu.overlay-active ul.navbar-nav {
  345.   /*z-index: 30;*/
  346. }
  347.  
  348.  
  349. /*NEW ANIMATE*/
  350. .middle-header-navigation .middle-mobile-menu.overlay-active ul.navbar-nav,
  351. .middle-header-navigation .middle-mobile-menu .navbar-nav {
  352.     width: 100%;
  353.     display: -webkit-box;
  354.     display: -ms-flexbox;
  355.     display: flex;
  356.     -webkit-box-align: center;
  357.         -ms-flex-align: center;
  358.             align-items: center;
  359.     text-align: center;
  360.     height: 100%;
  361.   }
  362.  
  363.  
  364.   .middle-header-navigation .hide-mobile-menu-second {
  365.     opacity:0;
  366.     visibility:hidden;
  367.   }
  368.   .middle-header-navigation .hide-mobile-menu-second.active-second {
  369.     opacity:1;
  370.     visibility:visible;
  371.     position:absolute;
  372.     top:10%;
  373.   }
  374.  
  375.    .middle-header-navigation .sub-menu.active .sub-menu.sub-menu-second.active-second {
  376.     position: relative;
  377.     opacity: 1;
  378.     visibility: visible;
  379.     height: 100%;
  380.     list-style:none;
  381.     padding:0;
  382.      top:0;
  383.      -webkit-transition: all 500ms ease;
  384.      transition: all 500ms ease;
  385.   }
  386.   .middle-header-navigation .nav-link.active-second {
  387.     color:#d7af64 !important;
  388.     font-size:22px;
  389.   }
  390.   .middle-header-navigation .sub-menu.active .sub-menu.sub-menu-second.active-second li a.nav-link {
  391.     color:#fff;
  392.   }
  393.   .middle-header-navigation .sub-menu.active li a.nav-link {
  394.     color:#d7af64;
  395.     padding-bottom: 10px;
  396.   }
  397.   .middle-header-navigation .middle-mobile-menu li.nav-item,
  398.   .middle-header-navigation .middle-mobile-menu.overlay-active li.nav-item {
  399.     padding:10px;
  400.     height: 65px;
  401.   }
  402.   .middle-header-navigation .middle-icon {
  403.     color: #fff;
  404.     padding: 10px;
  405.     font-size: 20px;
  406.   }
  407.  
  408.   .middle-header-navigation li.menu-item.menu-item-has-children > a:after {
  409.     content: "\f054";
  410.     font-family: 'Font Awesome\ 5 Free';
  411.     font-weight:900;
  412.     position:relative;
  413.     left:10px;
  414.     -webkit-transition: all 300ms ease;
  415.     transition: all 300ms ease;
  416.   }
  417.  
  418.   .middle-header-navigation .sub-menu.sub-menu-primary {
  419.     position: relative;
  420.     opacity: 1;
  421.     visibility: visible;
  422.     height:0;
  423.     left:0;
  424.     -webkit-transform: translateX(-200%);
  425.             transform: translateX(-200%);
  426.     -webkit-transition:all 500ms ease;
  427.     transition:all 500ms ease;
  428.     top:0;
  429.   }
  430.   .middle-header-navigation .sub-menu.sub-menu-primary.active {
  431.     /* position: relative;
  432.     opacity: 1;
  433.     visibility: visible;
  434.     height: 100%;
  435.     list-style: none;
  436.     padding: 20px 0 0 0;
  437.     transform: translateX(-50%);
  438.     left: 50%;
  439.     transition:all 500ms ease; */
  440.     -webkit-transform: translateX(-50%);
  441.             transform: translateX(-50%);
  442.     left:50%;
  443.     top:0;
  444.     -webkit-transition: all 500ms ease;
  445.     transition: all 500ms ease;
  446.   }
  447.  
  448.   .middle-header-navigation .main-sub-menu a.active:before {
  449.     -webkit-transform: rotate;
  450.             transform: rotate;
  451.     content: "\f053";
  452.     font-family: 'Font Awesome\ 5 Free';
  453.     font-weight: 900;
  454.     padding:10px;
  455.   }
  456.   .middle-header-navigation .main-sub-menu a.active:after {
  457.     content:"" !important;
  458.   }
  459.  
  460.   .middle-header-navigation .second-sub-menu a.nav-link.active-second:after {
  461.     content: "\f054";
  462.     font-family: 'Font Awesome\ 5 Free';
  463.     font-weight: 900;
  464.     /*padding:10px;*/
  465.     display: inline-block;
  466.   -webkit-transform: rotate(90deg);
  467.           transform: rotate(90deg);
  468.   -webkit-transition: all 300ms ease;
  469.   }
  470. /*END ANIMATE*/
  471.   .middle-header-navigation .navbar-light .navbar-nav .nav-link:focus, .middle-header-navigation .navbar-light .navbar-nav .nav-link:hover {
  472.     color: #d7af64;
  473.   }
  474.   .middle-header-navigation .middle-mobile-menu {
  475.     -webkit-transition:all 500ms ease;
  476.     transition:all 500ms ease;
  477.   }
  478.  
  479. /**/
  480. }
  481.  
  482. @media(min-width: 1440px){
  483.   .middle-header-navigation ul.sub-menu.sub-menu-primary {
  484.     padding: 15% 5% 100px;
  485.   }
  486. }
  487.  
  488. @media(max-width: 767px){
  489.   .middle-header-navigation .navbar-light .navbar-nav .nav-link:focus,
  490.   .middle-header-navigation .navbar-light .navbar-nav .nav-link:hover {
  491.     color: #d7af64;
  492.   }
  493. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!