Advertisement
Guest User

header

a guest
Jan 26th, 2017
177
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 20.48 KB | None | 0 0
  1. /*----------------------------------------------------------------------
  2.  
  3. [-----*** TABLE OF CONTENT ***-----]
  4.  
  5. 1. Header - Topbar
  6. #2. Header - Search
  7. 3. Header - Navbar
  8. 4. Header - Responsive Navbar Style
  9. 5. Header - Submenu
  10. 6. Header - Mega Menu
  11. 7. Header - Fixed
  12. 8. Header Boxed Layout
  13. 9. Header Theme Color
  14.  
  15. -----------------------------------------------------------------------*/
  16.  
  17.  
  18. /* --------------------------------------------------
  19.     [1. Header - Topbar blog]
  20. ---------------------------------------------------- */
  21. .blog-topbar {
  22.     background: #111;
  23. }
  24. .blog-topbar .container,
  25. .blog-topbar .container-fluid {
  26.   padding-top: 5px;
  27.   padding-bottom: 5px;
  28. }
  29.  
  30. /* Topbar List */
  31. .topbar-list {
  32.     padding-left: 0;
  33.     list-style: none;
  34.     margin-bottom: 0;
  35.     float: left;
  36. }
  37. .topbar-list > li {
  38.     color: #eee;
  39.     font-size: 10px;
  40.     padding: 7px 12px;
  41.     position: relative;
  42.     letter-spacing: 1px;
  43.     display: inline-block;
  44.     text-transform: uppercase;
  45. }
  46. .topbar-list > li:before {
  47.     top: 11px;
  48.     left: -3px;
  49.     width: 1px;
  50.     height: 9px;
  51.     content: ' ';
  52.     background: #eee;
  53.     position: absolute;
  54. }
  55. .topbar-list li:last-child {
  56.     padding-right: 0;
  57. }
  58. .topbar-list li a {
  59.     color: #eee;
  60. }
  61. .topbar-list li a:hover {
  62.     color: #fff;
  63.     text-decoration: none;
  64. }
  65. .topbar-log_reg li.home:before {
  66.     display: none;
  67. }
  68.  
  69. /* Topbar Dropdown */
  70. .topbar-list .topbar-dropdown {
  71.     top: 23px;
  72.     left: -3px;
  73.     z-index: 1;
  74.     display: none;
  75.     padding: 7px 0;
  76.     list-style: none;
  77.     min-width: 125px;
  78.     background: #151515;
  79.     position: absolute;
  80. }
  81. @media (min-width: 769px) {
  82.     .topbar-list li:hover .topbar-dropdown {
  83.         display: block;
  84.     }
  85. }
  86.  
  87. .topbar-list .topbar-dropdown li a {
  88.     color: #eee;
  89.     display: block;
  90.     font-size: 10px;
  91.     padding: 5px 15px;
  92.     margin-bottom: 1px;
  93.     text-transform: uppercase;
  94. }
  95. .topbar-list .topbar-dropdown li a:hover,
  96. .topbar-list .topbar-dropdown li.active a {
  97.     color: #fff;
  98. }
  99. .topbar-list .topbar-dropdown li a:hover {
  100.     text-decoration: none;
  101. }
  102.  
  103. /* Topbar Submenu */
  104. .topbar-list .topbar-submenu {
  105.   position: relative;
  106. }
  107. .topbar-list .topbar-submenu > a:after {
  108.   top: 8px;
  109.   right: 9px;
  110.   font-size: 11px;
  111.   content: "\f105";
  112.   position: absolute;
  113.   font-weight: normal;
  114.   display: inline-block;
  115.   font-family: FontAwesome;
  116. }
  117. .topbar-list .topbar-submenu:hover > .topbar-submenu-in {
  118.   display: block;
  119. }
  120. .topbar-list .topbar-submenu > .topbar-submenu-in {
  121.     top: 0;
  122.     left: 100%;
  123.     float: left;
  124.     z-index: 1000;
  125.     display: none;
  126.     padding: 7px 0;
  127.     font-size: 10px;
  128.     min-width: 125px;
  129.     text-align: left;
  130.     list-style: none;
  131.   background: #151515;
  132.   position: absolute;
  133.     text-transform: uppercase;
  134. }
  135. .topbar-list .topbar-submenu li:before {
  136.     display: none;
  137. }
  138.  
  139. .topbar-time {
  140.     color: #fff;
  141.     text-transform: uppercase;
  142.     font-size: 10px;
  143.     letter-spacing: 1px;
  144.   padding: 7px 12px 7px 0;
  145.   float: left;
  146. }
  147.  
  148. .topbar-toggler {
  149.     color: #fff;
  150.     cursor: pointer;
  151.     font-size: 16px;
  152.     float: left;
  153.     display: none;
  154.     padding-top: 1px;
  155. }
  156.  
  157. @media (max-width: 768px) {
  158.     .topbar-toggler {
  159.         display: block;
  160.     }
  161.     .topbar-menu {
  162.         display: none;
  163.     }
  164.     .topbar-menu {
  165.         clear: both;
  166.         float: none;
  167.         padding: 0 0 5px;
  168.     }
  169.     .topbar-menu li {
  170.         display: block;
  171.         padding: 7px 0;
  172.     }
  173.     .topbar-menu li:before {
  174.         display: none;
  175.     }
  176.     .topbar-menu strong {
  177.         font-weight: normal;
  178.         opacity: 0.5;
  179.     }
  180.     .topbar-list .topbar-dropdown {
  181.         background: none;
  182.         top: 0;
  183.         left: 10px;
  184.         position: relative;
  185.         min-width: auto;
  186.         padding: 7px 0 0;
  187.     }
  188.     .topbar-list .topbar-submenu > .topbar-submenu-in {
  189.         float: none;
  190.       background: none;
  191.       top: 0;
  192.       left: 10px;
  193.       position: relative;
  194.       min-width: auto;
  195.       display: block;
  196.       padding: 7px 0 0;
  197.     }
  198.     .topbar-list .topbar-dropdown li {
  199.         padding: 7px 0;
  200.     }
  201.     .topbar-list .topbar-dropdown li:last-child {
  202.         padding-bottom: 0;
  203.     }
  204.     .topbar-list .topbar-dropdown li a {
  205.         padding: 0;
  206.     }
  207.     .topbar-list .topbar-submenu > a:after {
  208.         display: none;
  209.     }
  210. }
  211.  
  212. /*Bug fixed in v1.9*/
  213. @media (min-width: 769px) {
  214.     .topbar-menu {
  215.         display: block !important;
  216.     }
  217. }
  218.  
  219. /* Search Box */
  220. .blog-topbar .search-btn {
  221.     color: #fff;
  222.     cursor: pointer;
  223.     font-size: 14px;
  224.     padding: 7px 0 0 10px;
  225. }
  226. .blog-topbar .search-btn:hover {
  227.     color: #bbb;
  228. }
  229.  
  230. .topbar-search-block {
  231.     top: 0;
  232.   left: 0;
  233.     width: 100%;
  234.     display: none;
  235.   background: #333;
  236. }
  237. .topbar-search-block .container {
  238.   padding-top: 0;
  239.   padding-bottom: 0;
  240. }
  241. .topbar-search-block form {
  242.     position: relative;
  243. }
  244. .topbar-search-block .search-close {
  245.   top: 10px;
  246.   right: 0;
  247.   color: #fff;
  248.   cursor: pointer;
  249.   position: absolute;
  250. }
  251. .topbar-search-block .form-control {
  252.   padding: 0;
  253.   color: #eee;
  254.   border: none;
  255.   min-height: 35px;
  256.   font-weight: 200;
  257.   background: #333;
  258. }
  259. .topbar-search-block .form-control:focus {
  260.     box-shadow: none;
  261. }
  262. .topbar-search-block .form-control::-moz-placeholder {
  263.   color: #eee;
  264.   font-weight: 200;
  265. }
  266. .topbar-search-block .form-control:-ms-input-placeholder {
  267.   color: #eee;
  268.   font-weight: 200;
  269. }
  270. .topbar-search-block .form-control::-webkit-input-placeholder {
  271.   color: #eee;
  272.   font-weight: 200;
  273. }
  274.  
  275. /*--------------------------------------------------
  276.     [3. Header - Navbar]
  277. ----------------------------------------------------*/
  278.  
  279. /*Navbar*/
  280. .header-v8 {
  281.     background: #fff;
  282.     position: relative;
  283.     box-shadow: 0 0 5px #bbb;
  284. }
  285.  
  286. @media (max-width: 991px) {
  287.     .header-v8 {
  288.         position: static;
  289.     }
  290. }
  291.  
  292. /*Containers
  293. ------------------------------------*/
  294. @media (min-width: 768px) and (max-width: 991px) {
  295.     .header-v8 .res-container {
  296.         /*width: 750px;*/
  297.     }
  298. }
  299.  
  300. @media (max-width: 991px) {
  301.     .header-v8 .res-container:before,
  302.     .header-v8 .res-container:after {
  303.         content: " ";
  304.         display: table;
  305.     }
  306.  
  307.     .header-v8 .res-container:after {
  308.         clear: both;
  309.     }
  310.  
  311.   /*  .header-v8 .res-container {
  312.         margin-left: auto;
  313.         margin-right: auto;
  314.         padding-left: 15px;
  315.         padding-right: 15px;
  316.     }
  317.  
  318.     .header-v8 > .navbar > .container {
  319.         width: inherit;
  320.         margin-left: 0;
  321.         margin-right: 0;
  322.         padding-left: 0;
  323.         padding-right: 0;
  324.     }*/
  325.  
  326.     .header-v8 > .navbar > .container > .navbar-header,
  327.     .header-v8 > .navbar > .container > .navbar-collapse {
  328.         margin-left: 0;
  329.         margin-right: 0;
  330.     }
  331. }
  332.  
  333. /*Navbar*/
  334. .header-v8 .navbar {
  335.     border: none;
  336.     margin-bottom: 0;
  337. }
  338.  
  339. /*Navbar Brand*/
  340. .header-v8 .navbar-brand {
  341.     height: 84px;
  342.     max-height: 84px;
  343.     line-height: 60px;
  344. }
  345.  
  346. .header-v8 .navbar-brand img {
  347.     width: auto;
  348.     height: auto;
  349.     max-width: 100%;
  350.     max-height: 100%;
  351.     display: inline-block;
  352.     vertical-align: middle;
  353. }
  354.  
  355. /*Media Queries*/
  356. @media (max-width: 991px) {
  357.     .header-v8 .navbar-brand {
  358.         padding-top: 20px;
  359.         line-height: 45px;
  360.     }
  361. }
  362.  
  363. @media (min-width: 992px) {
  364.     .header-v8 .navbar-nav {
  365.         float: right;
  366.     }
  367. }
  368. @media (max-width: 768px) {
  369.     .header-v8 .navbar-brand {
  370.         padding-left: 0;
  371.     }
  372. }
  373.  
  374. /*Navbar Toggle*/
  375. .header-v8 .navbar-toggle {
  376.     border: none;
  377.     padding: 9px 0;
  378.     margin: 26px 0 0;
  379. }
  380.  
  381. .header-v8 .navbar-toggle .icon-bar {
  382.     height: 1px;
  383.     width: 30px;
  384.     font-size: 20px;
  385.     background: #333;
  386.     margin-bottom: 7px;
  387. }
  388.  
  389. .header-v8 .navbar-toggle .icon-bar:last-child {
  390.     margin-bottom: 0;
  391. }
  392.  
  393. .header-v8 .navbar-toggle,
  394. .header-v8 .navbar-toggle:hover,
  395. .header-v8 .navbar-toggle:focus {
  396.     background: inherit;
  397. }
  398.  
  399. /*Navbar Collapse*/
  400. .header-v8 .navbar-collapse {
  401.     position: relative;
  402. }
  403.  
  404. /*Navbar Menu*/
  405. .header-v8 .navbar-nav > li > a {
  406.     color: #fff;
  407.     font-size: 14px;
  408.     font-weight: 600;
  409.     letter-spacing: 1px;
  410.     text-transform: uppercase;
  411. }
  412.  
  413. .header-v8 .nav > li > a:hover,
  414. .header-v8 .nav > li > a:focus {
  415.     background: inherit;
  416. }
  417.  
  418.  
  419. /*--------------------------------------------------
  420.     [4. Header - Responsive Navbar Style]
  421. ----------------------------------------------------*/
  422.  
  423. /*Responsive Navbar*/
  424. @media (max-width: 991px) {
  425.     /*Responsive code for max-width: 991px*/
  426.     .header-v8 .navbar-header {
  427.         float: none;
  428.     }
  429.  
  430.     .header-v8 .navbar-toggle {
  431.         display: block;
  432.     }
  433.  
  434.     .header-v8 .navbar-collapse {
  435.         background: #fff;
  436.         border-color: #eee;
  437.         border-bottom: 1px solid #eee;
  438.     }
  439.  
  440.     .header-v8 .navbar-collapse.collapse {
  441.         display: none !important;
  442.     }
  443.  
  444.     .header-v8 .navbar-collapse.collapse.in {
  445.         display: block !important;
  446.         overflow-y: auto !important;
  447.     }
  448.  
  449.     .header-v8 .navbar-nav {
  450.         margin: 10px 0;
  451.         float: none !important;
  452.     }
  453.  
  454.     .header-v8 .navbar-nav > li {
  455.         float: none;
  456.     }
  457.  
  458.     .header-v8 .navbar-nav > li > a {
  459.         padding-top: 30px;
  460.         padding-bottom: 40px;
  461.     }
  462.  
  463.     /*Navbar Nav*/
  464.     .header-v8 .navbar-nav > li > a {
  465.         color: #444;
  466.     }
  467.  
  468.     /*Pull Right*/
  469.     .header-v8 .dropdown-menu.pull-right {
  470.         float: none !important;
  471.     }
  472.  
  473.     /*Navbar*/
  474.     .header-v8 .navbar-nav .open > a:focus,
  475.     .header-v8 .navbar-nav .open > a:hover {
  476.         border-color: #eee;
  477.     }
  478.  
  479.     /*Dropdown Menu Slide Down Effect*/
  480.     .header-v8 .navbar-nav .open .dropdown-menu {
  481.         border: 0;
  482.         float: none;
  483.         width: auto;
  484.         margin-top: 0;
  485.         position: static;
  486.         box-shadow: none;
  487.         background-color: transparent;
  488.     }
  489.  
  490.     .header-v8 .navbar-nav .open .dropdown-menu > li > a,
  491.     .header-v8 .navbar-nav .open .dropdown-menu .dropdown-header {
  492.         padding: 5px 15px 5px 25px;
  493.     }
  494.  
  495.     .header-v8 .navbar-nav .open .dropdown-menu > li > a {
  496.         line-height: 20px;
  497.     }
  498.  
  499.     .header-v8 .navbar-nav .open .dropdown-menu > li > a:hover,
  500.     .header-v8 .navbar-nav .open .dropdown-menu > li > a:focus {
  501.         background-image: none;
  502.     }
  503.  
  504.     .header-v8 .navbar-nav .open .dropdown-menu > li > a {
  505.         color: #777;
  506.     }
  507.  
  508.     .header-v8 .navbar-nav .open .dropdown-menu > li > a:hover,
  509.     .header-v8 .navbar-nav .open .dropdown-menu > li > a:focus {
  510.         background-color: transparent;
  511.     }
  512.  
  513.     .header-v8 .navbar-nav .open .dropdown-menu > .active > a,
  514.     .header-v8 .navbar-nav .open .dropdown-menu > .active > a:hover,
  515.     .header-v8 .navbar-nav .open .dropdown-menu > .active > a:focus {
  516.         background-color: transparent;
  517.     }
  518.  
  519.     .header-v8 .navbar-nav .open .dropdown-menu > .disabled > a,
  520.     .header-v8 .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  521.     .header-v8 .navbar-nav .open .dropdown-menu > .disabled > a:focus {
  522.         background-color: transparent;
  523.     }
  524.  
  525.     .header-v8 .dropdown-menu.no-bottom-space {
  526.         padding-bottom: 0;
  527.     }
  528.  
  529.     /*Design for max-width: 991px*/
  530.     .header-v8 .navbar-collapse,
  531.     .header-v8 .navbar-collapse .container {
  532.         padding-left: 0 !important;
  533.         padding-right: 0 !important;
  534.         margin-left: 0;
  535.         margin-right: 0;
  536.     }
  537.  
  538.     .header-v8 .navbar-nav > li > a {
  539.         font-size: 14px;
  540.         padding: 10px 5px;
  541.     }
  542.  
  543.     .header-v8 .navbar-nav > li a {
  544.         border-bottom: none;
  545.         border-top: 1px solid #eee;
  546.     }
  547.  
  548.     .header-v8 .navbar-nav > li:first-child > a {
  549.         border-top: transparent;
  550.     }
  551.  
  552.     .header-v8 .navbar-nav > .open > a,
  553.     .header-v8 .navbar-nav > .open > a:hover,
  554.     .header-v8 .navbar-nav > .open > a:focus {
  555.         color: #555;
  556.         background: inherit;
  557.     }
  558.  
  559.     .header-v8 .navbar-nav > .active > a,
  560.     .header-v8 .navbar-nav > .active > a:hover,
  561.     .header-v8 .navbar-nav > .active > a:focus {
  562.         background: inherit;
  563.     }
  564.  
  565.     .header-v8 .dropdown .dropdown-submenu > a {
  566.         font-size: 13px;
  567.         color: #555 !important;
  568.         text-transform: uppercase;
  569.     }
  570. }
  571.  
  572. @media (min-width: 992px) {
  573.     /*Navbar Collapse*/
  574.     .header-v8 .navbar-collapse {
  575.         padding: 0;
  576.     }
  577.  
  578.     /*Navbar*/
  579.     .header-v8 .navbar {
  580.         min-height: 40px !important;
  581.     }
  582.  
  583.     .header-v8 .container > .navbar-header,
  584.     .header-v8 .container-fluid > .navbar-header,
  585.     .header-v8 .container > .navbar-collapse,
  586.     .header-v8 .container-fluid > .navbar-collapse {
  587.         margin-bottom: -10px;
  588.     }
  589.  
  590.     .header-v8 .navbar-nav {
  591.         top: 2px;
  592.         position: relative;
  593.     }
  594.  
  595.     .header-v8 .navbar-nav > li > a {
  596.         padding: 20px;
  597.         line-height: 54px;
  598.     }
  599.  
  600.     .header-v8 .navbar-nav > li:last-child > a {
  601.         padding-right: 0;
  602.     }
  603.  
  604.     .header-v8 .navbar-nav > li.home > a {
  605.         padding-left: 0;
  606.     }
  607.  
  608.     .header-v8 .navbar-nav > li > a,
  609.     .header-v8 .navbar-nav > li > a:hover,
  610.     .header-v8 .navbar-nav > li > a:focus,
  611.     .header-v8 .navbar-nav > .active > a,
  612.     .header-v8 .navbar-nav > .active > a:hover,
  613.     .header-v8 .navbar-nav > .active > a:focus {
  614.         color: #333;
  615.         background: none;
  616.     }
  617.  
  618.     .header-v8 .navbar-nav > .open > a,
  619.     .header-v8 .navbar-nav > .open > a:hover,
  620.     .header-v8 .navbar-nav > .open > a:focus {
  621.         color: #333;
  622.     }
  623.  
  624.     /*Dropdown Menu*/
  625.     .header-v8 .dropdown-menu {
  626.         border: none;
  627.         padding: 15px 0;
  628.         min-width: 230px;
  629.         border-radius: 0;
  630.         background: #fff;
  631.         z-index: 9999 !important;
  632.     }
  633.  
  634.     .header-v8 .dropdown-menu > li > a {
  635.         color: #777;
  636.         font-size: 13px;
  637.         font-weight: 400;
  638.         padding: 6px 25px;
  639.     }
  640.  
  641.     .header-v8 .dropdown-menu .active > a,
  642.     .header-v8 .dropdown-menu li > a:hover {
  643.         background: inherit;
  644.         filter: none !important;
  645.         -webkit-transition: all 0.1s ease-in-out;
  646.         -moz-transition: all 0.1s ease-in-out;
  647.         -o-transition: all 0.1s ease-in-out;
  648.         transition: all 0.1s ease-in-out;
  649.     }
  650.  
  651.     .header-v8 .dropdown-menu li > a:focus {
  652.         background: none;
  653.         filter: none !important;
  654.     }
  655.  
  656.     .header-v8 .navbar-nav > li.dropdown:hover > .dropdown-menu {
  657.         display: block;
  658.     }
  659.  
  660.     .header-v8 .open > .dropdown-menu {
  661.         display: none;
  662.     }
  663. }
  664.  
  665.  
  666. /*--------------------------------------------------
  667.     [5. Header - Submenu]
  668. ----------------------------------------------------*/
  669.  
  670. /*Dropdown Submenu for BS3
  671. ------------------------------------*/
  672. .header-v8 .dropdown-submenu {
  673.    position: relative;
  674. }
  675.  
  676. .header-v8 .dropdown-submenu > a:after {
  677.     top: 9px;
  678.     right: 15px;
  679.     font-size: 11px;
  680.     content: "\f105";
  681.     position: absolute;
  682.     font-weight: normal;
  683.     display: inline-block;
  684.     font-family: FontAwesome;
  685. }
  686.  
  687. @media (max-width: 991px) {
  688.     .header-v8 .dropdown-submenu > a:after {
  689.         content: " ";
  690.     }
  691. }
  692.  
  693. .header-v8 .dropdown-submenu > .dropdown-menu {
  694.     top: -20px;
  695.     left: 100%;
  696.     margin-left: 0px;
  697. }
  698.  
  699. /*Submenu comes from LEFT side*/
  700. .header-v8 .dropdown-submenu > .dropdown-menu.submenu-left {
  701.     left: -100%;
  702. }
  703.  
  704. .header-v8 .dropdown-submenu:hover > .dropdown-menu {
  705.     display: block;
  706. }
  707.  
  708. @media (max-width: 991px) {
  709.     .header-v8 .dropdown-submenu > .dropdown-menu {
  710.         display: block;
  711.         margin-left: 15px;
  712.     }
  713. }
  714.  
  715. .header-v8 .dropdown-submenu.pull-left {
  716.     float: none;
  717. }
  718.  
  719. .header-v8 .dropdown-submenu.pull-left > .dropdown-menu {
  720.     left: -100%;
  721.     margin-left: 10px;
  722. }
  723.  
  724. .header-v8 .dropdown-menu li [class^="fa-"],
  725. .header-v8 .dropdown-menu li [class*=" fa-"] {
  726.     left: -3px;
  727.     width: 1.25em;
  728.     margin-right: 1px;
  729.     position: relative;
  730.     text-align: center;
  731.     display: inline-block;
  732. }
  733. .header-v8 .dropdown-menu li [class^="fa-"].fa-lg,
  734. .header-v8 .dropdown-menu li [class*=" fa-"].fa-lg {
  735.     /* increased font size for fa-lg */
  736.     width: 1.5625em;
  737. }
  738.  
  739.  
  740. /*--------------------------------------------------
  741.     [6. Header - Mega Menu]
  742. ----------------------------------------------------*/
  743.  
  744. /*Mega Menu
  745. ------------------------------------*/
  746. .header-v8 .mega-menu .nav,
  747. .header-v8 .mega-menu .dropup,
  748. .header-v8 .mega-menu .dropdown,
  749. .header-v8 .mega-menu .collapse {
  750.     position: static;
  751. }
  752.  
  753. .header-v8 .mega-menu .navbar-inner,
  754. .header-v8 .mega-menu .container {
  755.     position: relative;
  756. }
  757.  
  758. .header-v8 .mega-menu .dropdown-menu {
  759.     left: auto;
  760. }
  761.  
  762. .header-v8 .mega-menu .dropdown-menu > li {
  763.     display: block;
  764. }
  765.  
  766. .header-v8 .mega-menu .dropdown-submenu .dropdown-menu {
  767.     left: 100%;
  768. }
  769.  
  770. .header-v8 .mega-menu .nav.pull-right .dropdown-menu {
  771.     right: 0;
  772. }
  773.  
  774. .header-v8 .mega-menu .mega-menu-content {
  775.     *zoom: 1;
  776.     padding: 0;
  777. }
  778.  
  779. .header-v8 .mega-menu .mega-menu-content:before,
  780. .header-v8 .mega-menu .mega-menu-content:after {
  781.     content: "";
  782.     display: table;
  783.     line-height: 0;
  784. }
  785.  
  786. .header-v8 .mega-menu .mega-menu-content:after {
  787.     clear: both;
  788. }
  789.  
  790. .header-v8 .mega-menu.navbar .nav > li > .dropdown-menu:after,
  791. .header-v8 .mega-menu.navbar .nav > li > .dropdown-menu:before {
  792.     display: none;
  793. }
  794.  
  795. .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-menu {
  796.     left: 0;
  797.     right: 0;
  798.     overflow: hidden;
  799. }
  800.  
  801. /*Dropdown Menu*/
  802. .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-menu li a {
  803.     padding: 0;
  804. }
  805.  
  806. .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-menu li h2 {
  807.     color: #333;
  808.     margin: 0 0 5px;
  809.     font-size: 15px;
  810.     font-weight: 400;
  811.     text-transform: uppercase;
  812. }
  813.  
  814. /*Dropdown Link List*/
  815. .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-link-list {
  816.     padding-left: 0;
  817.     list-style: none;
  818.     margin-bottom: 0;
  819. }
  820.  
  821. .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-link-list li {
  822.     display: block;
  823. }
  824.  
  825. .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-link-list li a {
  826.     color: #777;
  827.     display: block;
  828.     padding: 8px 0;
  829.     font-size: 13px;
  830.     font-weight: 400;
  831.     border-bottom: solid 1px #eee;
  832. }
  833.  
  834. .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-link-list li a:hover {
  835.     text-decoration: none;
  836. }
  837.  
  838. /*Responsive Mega Menu Content*/
  839. @media (min-width: 768px) {
  840.     .header-v8 .mega-menu .mega-menu-fullwidth .mega-menu-content .row {
  841.         margin-right: 15px;
  842.     }
  843. }
  844.  
  845. @media (max-width: 991px) {
  846.     /*Dropdown Menu*/
  847.     .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-menu {
  848.         width: auto;
  849.     }
  850.  
  851.     .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-menu > li > ul {
  852.         display: block;
  853.     }
  854.  
  855.     .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-menu li h2 {
  856.         font-size: 13px;
  857.         padding-left: 10px;
  858.     }
  859.  
  860.     .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-menu li a {
  861.         border-top: none;
  862.     }
  863.  
  864.     /*Dropdown Link List*/
  865.     .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-link-list > li > a {
  866.         padding-left: 15px;
  867.     }
  868. }
  869.  
  870. @media (min-width: 992px) {
  871.     .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-menu {
  872.         padding-top: 25px;
  873.         margin-left: 15px;
  874.         margin-right: 15px;
  875.         padding-bottom: 25px;
  876.     }
  877. }
  878.  
  879.  
  880. /*--------------------------------------------------
  881.     [7. Header - Fixed]
  882. ----------------------------------------------------*/
  883.  
  884. /*Header*/
  885. .header-fixed .header-v8.header-sticky {
  886.     top: 0;
  887.     left: 0;
  888.     width: 100%;
  889.     height: auto;
  890.     z-index: 999;
  891.     position: fixed;
  892. }
  893.  
  894. /*Media Queries*/
  895. @media (max-width: 991px) {
  896.     .header-fixed .header-v8.header-sticky {
  897.         position: static;
  898.     }
  899. }
  900.  
  901. @media (min-width: 992px) {
  902.     /*Topbar v2*/
  903.     .header-fixed .header-v8.header-fixed-shrink .blog-topbar {
  904.         margin-top: -40px;
  905.     }
  906.  
  907.     /*Navbar Brand*/
  908.     .header-fixed .header-v8.header-fixed-shrink .navbar-brand {
  909.         height: 70px;
  910.         max-height: 70px;
  911.         line-height: 36px;
  912.     }
  913.  
  914.     /*Navbar Nav*/
  915.     .header-fixed .header-v8.header-fixed-shrink .navbar-nav > li > a {
  916.         line-height: 30px;
  917.     }
  918.  
  919.     /*Transition*/
  920.     .header-v8 .blog-topbar,
  921.     .header-v8 .navbar-brand,
  922.     .header-v8 .navbar-nav > li > a,
  923.     .header-fixed .header-v8.header-fixed-shrink .blog-topbar,
  924.     .header-fixed .header-v8.header-fixed-shrink .navbar-brand,
  925.     .header-fixed .header-v8.header-fixed-shrink .navbar-nav > li > a {
  926.         -webkit-transition: all 0.3s cubic-bezier(0.5, 1, 0.7, 1);
  927.         transition: all 0.3s cubic-bezier(0.5, 1, 0.7, 1);
  928.     }
  929. }
  930.  
  931.  
  932. /*--------------------------------------------------
  933. [8. Header Boxed Layout]
  934. ----------------------------------------------------*/
  935.  
  936. .boxed-layout.header-fixed .header-v8.header-sticky {
  937.     left: inherit;
  938.     width: inherit;
  939. }
  940.  
  941. .boxed-layout-space.header-fixed .header-v8.header-sticky {
  942.     top: 40px;
  943. }
  944.  
  945. @media(max-width:767px){
  946.     .boxed-layout-space.header-fixed .header-v8.header-sticky {
  947.         top: 0;
  948.     }
  949. }
  950.  
  951.  
  952. /*--------------------------------------------------
  953. [9. Header Theme Color]
  954. ----------------------------------------------------*/
  955. .header-v8 .dropdown-menu {
  956.     border-top: solid 3px #72c02c;
  957. }
  958. .header-v8 .dropdown-menu .active > a,
  959. .header-v8 .dropdown-menu li > a:hover {
  960.     color: #72c02c;
  961. }
  962. .header-v8 .navbar-nav .open .dropdown-menu > li > a:hover,
  963. .header-v8 .navbar-nav .open .dropdown-menu > li > a:focus {
  964.     color: #72c02c;
  965. }
  966. .header-v8 .navbar-nav .open .dropdown-menu > .active > a,
  967. .header-v8 .navbar-nav .open .dropdown-menu > .active > a:hover,
  968. .header-v8 .navbar-nav .open .dropdown-menu > .active > a:focus {
  969.     color: #72c02c;
  970. }
  971.  
  972. .header-v8 .navbar-nav .open .dropdown-menu > .disabled > a,
  973. .header-v8 .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  974. .header-v8 .navbar-nav .open .dropdown-menu > .disabled > a:focus {
  975.     color: #72c02c;
  976. }
  977. .header-v8 .navbar-nav > li > a:hover {
  978.     color: #72c02c;
  979. }
  980. .header-v8 .navbar-nav > .active > a,
  981. .header-v8 .navbar-nav > .active > a:hover,
  982. .header-v8 .navbar-nav > .active > a:focus {
  983.     color: #72c02c !important;
  984. }
  985. .header-v8 .mega-menu .mega-menu-fullwidth .dropdown-link-list li a:hover {
  986.     color: #72c02c;
  987. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement