Last active
January 11, 2019 23:43
-
-
Save muks999/fdaa230ea3844905cf4b1d25921e410f to your computer and use it in GitHub Desktop.
DIVI "hacks" style
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <style id="divi-hack"> | |
| /** @import Custom Fonts - Keep at top of this style **/ | |
| @import url('https://fonts.googleapis.com/css?family=Indie+Flower'); | |
| /** Body Overall Font Weight **/ | |
| body { | |
| font-weight: 800} | |
| /** Menu Animation Accent Color **/ | |
| .divi-hacks-animenu-1 #top-menu > li:before, | |
| .divi-hacks-animenu-2 #top-menu li.current_page_item > a, | |
| .divi-hacks-animenu-2 .et-fixed-header #top-menu li.current_page_item > a, | |
| .divi-hacks-animenu-3 #top-menu > li.page_item::before { | |
| border-color: inherit; | |
| } | |
| .divi-hacks-animenu-2 #top-menu li:not(.menu-item-has-children):not(.current_page_item):hover a { | |
| box-shadow:0px 5px 0px 0px inherit; | |
| } | |
| /** Main Header Menu Bar Link Hover Styles **/ | |
| .is-desktop #main-header #top-menu > li > a:hover { | |
| opacity:1; } | |
| /** Main Header Dropdown Link Hover Styles **/ | |
| .is-desktop #main-header #top-menu > li:not(.module-in-menu) > ul > li a:hover { | |
| opacity:1; } | |
| /** Top Header Menu Bar Link Hover Styles **/ | |
| .is-desktop #top-header #et-secondary-nav > li > a:hover { | |
| opacity:1; } | |
| /** Top Header Dropdown Link Hover Styles **/ | |
| .is-desktop #top-header #et-secondary-nav > li:not(.module-in-menu) > ul > li a:hover { | |
| opacity:1; } | |
| /** Custom Heading Font Family **/ | |
| .divi-hacks-heading-fonts h1, .divi-hacks-heading-fonts h1 a { | |
| color: #3e09a0; | |
| font-family:inherit; | |
| } | |
| .divi-hacks-heading-fonts h2, .divi-hacks-heading-fonts h2 a { | |
| color: inherit; | |
| font-family:inherit; } | |
| .divi-hacks-heading-fonts div:not(.et-fb-form__toggle-title):not(.et-fb-module-settings):not(.et-fb-export-file-name-field):not(.et-fb-upload-file-container):not(.et-fb-import-options-field):not(. et-core-modal-header):not(.et_pb_gallery_title) > h3, .divi-hacks-heading-fonts h3 a { | |
| color: inherit; | |
| font-family:inherit; } | |
| .divi-hacks-heading-fonts h4, .divi-hacks-heading-fonts h4 a { | |
| color: inherit; | |
| font-family:inherit; } | |
| .divi-hacks-heading-fonts h5, .divi-hacks-heading-fonts h5 a { | |
| color: inherit; | |
| font-family:inherit; } | |
| .divi-hacks-heading-fonts h6, .divi-hacks-heading-fonts h6 a { | |
| color: inherit; | |
| font-family:inherit; } | |
| /** Logo Styles **/ | |
| #logo { | |
| } | |
| /** Primary Nav Font Awesome Icon Size **/ | |
| .divi-hacks-font-awesome-icons #main-header .fab > a:before, | |
| .divi-hacks-font-awesome-icons #main-header .far > a:before, | |
| .divi-hacks-font-awesome-icons #main-header .fas > a:before, | |
| .divi-hacks-font-awesome-icons #main-header .fal > a:before, | |
| .divi-hacks-font-awesome-icons #main-header .fa > a:before { | |
| font-size: 1em } | |
| /** Secondary Nav Font Awesome Icon Size **/ | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .fab > a:before, | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .far > a:before, | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .fas > a:before, | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .fal > a:before, | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .fa > a:before { | |
| font-size: 1em } | |
| /** Nav Font Awesome Icon colors **/ | |
| .divi-hacks-font-awesome-icons .fa > a:before, | |
| .divi-hacks-font-awesome-icons .fas > a:before, | |
| .divi-hacks-font-awesome-icons .far > a:before, | |
| .divi-hacks-font-awesome-icons .fab > a:before, | |
| .divi-hacks-font-awesome-icons .fal > a:before { | |
| color: inherit; | |
| } | |
| .divi-hacks-font-awesome-icons .sub-menu .fa > a:before, | |
| .divi-hacks-font-awesome-icons .sub-menu .fas > a:before, | |
| .divi-hacks-font-awesome-icons .sub-menu .far > a:before, | |
| .divi-hacks-font-awesome-icons .sub-menu .fab > a:before, | |
| .divi-hacks-font-awesome-icons .sub-menu .fal > a:before { | |
| color: inherit; | |
| align-self: center; | |
| } | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .fa > a:before, | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .fas > a:before, | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .far > a:before, | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .fab > a:before, | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .fal > a:before { | |
| color: inherit; | |
| } | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .sub-menu .fa > a:before, | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .sub-menu .fas > a:before, | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .sub-menu .far > a:before, | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .sub-menu .fab > a:before, | |
| .divi-hacks-font-awesome-icons #et-secondary-nav .sub-menu .fal > a:before { | |
| color: inherit; | |
| } | |
| /** Primary Nav Dropdown Column Left & Right Padding **/ | |
| .is-desktop.divi-hacks-nav-columns #top-menu > li.nav-columns:not(.module-in-menu) > ul > li { | |
| padding-left: 0px !important; | |
| padding-right: 0px !important; | |
| } | |
| /** Secondary Nav Dropdown Column Left & Right Padding **/ | |
| .is-desktop.divi-hacks-nav-columns #et-secondary-nav > li.nav-columns:not(.module-in-menu) > ul > li { | |
| padding-left: 0px !important; | |
| padding-right: 0px !important; | |
| } | |
| /** Primary Dropdown Child Elements Line Height **/ | |
| .divi-hacks-nav-columns.is-desktop li.nav-columns:not(.module-in-menu) ul li a, | |
| .divi-hacks-nav-columns.is-desktop #main-header .nav li ul li a { | |
| line-height: 2em; | |
| } | |
| /** Secondary Nav Dropdown Child Elements Line Height **/ | |
| .divi-hacks-nav-columns.is-desktop #et-secondary-nav.menu li:not(.module-in-menu) ul li a { | |
| line-height: 2em; | |
| } | |
| /** Primary Nav Dropdown Text Align **/ | |
| .is-desktop li.nav-columns:not(.module-in-menu) ul li a, | |
| .is-desktop #main-header .nav li:not(.module-in-menu) ul li a { | |
| justify-content: flex-start; | |
| } | |
| /** Secondary Nav Dropdown Text Align **/ | |
| .is-desktop #et-secondary-nav.menu li:not(.module-in-menu) ul li a { | |
| display: -webkit-box; | |
| display: -moz-box; | |
| display: -ms-flexbox; | |
| display: -webkit-flex; | |
| display: flex; | |
| justify-content: flex-start; | |
| } | |
| /** Secondary Nav Current Page Item Text Color **/ | |
| #et-secondary-nav li.current_page_item > a, | |
| #et-secondary-nav li.current-menu-item > a:before { | |
| color: inherit !important; | |
| } | |
| /** Main Header Nav Dropdown Parent Styles **/ | |
| .divi-hacks-nav-columns.is-desktop #main-header li.nav-columns:not(.module-in-menu) > ul > li > a { | |
| font-weight:bold; text-transform:uppercase; border-bottom:1px solid; padding-bottom:10px; margin-bottom:10px; } | |
| /** Top Header Nav Dropdown Parent Styles **/ | |
| .divi-hacks-nav-columns.is-desktop #et-secondary-nav li.nav-columns:not(.module-in-menu) > ul > li > a { | |
| font-weight:bold; text-transform:uppercase; border-bottom:1px solid; padding-bottom:10px; margin-bottom:10px; } | |
| /** Main Header Current Item Styles **/ | |
| #main-header li.current_page_item > a { | |
| } | |
| /** Top Header Current Item Styles **/ | |
| #et-secondary-nav li.current_page_item > a { | |
| } | |
| /** Primary Dropdown Width **/ | |
| .is-desktop #top-menu li:not(.module-in-menu):not(.nav-columns) ul.sub-menu { | |
| width: 240px; | |
| } | |
| .is-desktop #top-menu li:not(.module-in-menu):not(.nav-columns) ul.sub-menu a { | |
| width: calc(240px - 40px); | |
| } | |
| /** Primary Dropdown Link Color **/ | |
| .is-desktop #top-menu li:not(.module-in-menu):not(.nav-columns) ul.sub-menu a { | |
| color: inherit !important; | |
| } | |
| /** Primary Dropdown Line Height **/ | |
| .is-desktop #top-menu li:not(.module-in-menu):not(.nav-columns) ul.sub-menu a { | |
| line-height: 1.2em !important; | |
| } | |
| /** Secondary Dropdown Width **/ | |
| .is-desktop #et-secondary-nav li:not(.module-in-menu):not(.nav-columns) ul.sub-menu { | |
| width: 220px; | |
| } | |
| .is-desktop #et-secondary-nav li:not(.module-in-menu):not(.nav-columns) ul.sub-menu a { | |
| width: calc(220px - 2em); | |
| margin-left: -1em; | |
| } | |
| /** Secondary Dropdown Link Color **/ | |
| .is-desktop #et-secondary-nav li:not(.module-in-menu):not(.nav-columns) ul.sub-menu a { | |
| color: inherit !important; | |
| } | |
| /** Secondary Dropdown Line Height **/ | |
| .is-desktop #et-secondary-nav li:not(.module-in-menu):not(.nav-columns) ul.sub-menu a { | |
| line-height: 1.2em !important; | |
| } | |
| /** Primary Nav Columns Width **/ | |
| .divi-hacks-nav-columns.is-desktop #main-header li.nav-columns:not(.module-in-menu) ul li a { | |
| width: 120px !important; | |
| } | |
| /** Secondary Nav Columns Width **/ | |
| .divi-hacks-nav-columns.is-desktop #et-secondary-nav li.nav-columns:not(.module-in-menu) ul li a { | |
| width: 120px !important; | |
| } | |
| /** MOBILE MENU **/ | |
| .divi-hacks-mobile-menu-fullscreen.is-mobile #main-header .et-cart-info span:before, | |
| .divi-hacks-mobile-menu-slide-in.is-mobile #main-header .et-cart-info span:before { | |
| color: #1b1d1e; | |
| } | |
| .divi-hacks-mobile-menu-slide-in.is-mobile #main-header .et_mobile_menu li a, | |
| .divi-hacks-mobile-menu-fullscreen.is-mobile #main-header .et_mobile_menu li a { | |
| color: #ffffff; | |
| } | |
| .divi-hacks-mobile-menu-slide-in.is-mobile #main-header .mobile_nav.opened .mobile_menu_bar_toggle::before, | |
| .divi-hacks-mobile-menu-fullscreen.is-mobile #main-header .mobile_nav.opened .mobile_menu_bar_toggle::before { | |
| color: #1b1d1e; | |
| } | |
| .divi-hacks-mobile-menu-slide-in.is-mobile #main-header .mobile_nav.closed .mobile_menu_bar_toggle::before, | |
| .divi-hacks-mobile-menu-fullscreen.is-mobile #main-header .mobile_nav.closed .mobile_menu_bar_toggle::before { | |
| color: #1b1d1e; | |
| } | |
| .divi-hacks-mobile-menu-fullscreen.is-mobile #main-header #mobile_menu .current_page_item > a, | |
| .divi-hacks-mobile-menu-slide-in.is-mobile #main-header #mobile_menu .current_page_item > a { | |
| color: #247BA0; | |
| } | |
| .divi-hacks-mobile-menu-fullscreen.is-mobile #main-header .et_mobile_menu > li > ul.sub-menu, | |
| .divi-hacks-mobile-menu-slide-in.is-mobile #main-header .et_mobile_menu > li > ul.sub-menu li.menu-item a { | |
| background-color: rgba(0,0,0,0.1); | |
| } | |
| .divi-hacks-mobile-menu-fullscreen.is-mobile #main-header .et_mobile_menu li a, | |
| .divi-hacks-mobile-menu-slide-in.is-mobile #main-header .et_mobile_menu li a { | |
| letter-spacing: 6px; | |
| } | |
| .divi-hacks-mobile-menu-fullscreen.is-mobile #main-header .et_mobile_menu .et_mobile_menu > li > a, | |
| .divi-hacks-mobile-menu-slide-in.is-mobile #main-header .et_mobile_menu .et_mobile_menu > li > a { | |
| line-height: 1.0em; | |
| } | |
| .divi-hacks-mobile-menu-fullscreen.is-mobile #main-header .et_mobile_menu .sub-menu > li > a, | |
| .divi-hacks-mobile-menu-slide-in.is-mobile #main-header .et_mobile_menu .sub-menu > li > a { | |
| line-height: 0.8em; | |
| } | |
| /* HEADER */ | |
| #top-header { | |
| background-image: url('') ; | |
| background-size: cover; | |
| background-repeat: no-repeat; | |
| background-position: center; | |
| } | |
| #main-header { | |
| background-image: url('') ; | |
| background-size: cover; | |
| background-repeat: no-repeat; | |
| background-position: center; | |
| } | |
| /* FOOTER */ | |
| div#footer-bottom { | |
| position: relative; | |
| z-index:1; | |
| align-items: center; | |
| display: flex; | |
| } | |
| /** Secondary Nav Current Page Item Text Color **/ | |
| #main-footer li.current_page_item > a, | |
| #main-footer li.current-menu-item > a:before { | |
| color: inherit !important; | |
| } | |
| /** Secondary Nav Font Awesome Icon Size **/ | |
| .divi-hacks-font-awesome-icons #main-footer .fab > a:before, | |
| .divi-hacks-font-awesome-icons #main-footer .far > a:before, | |
| .divi-hacks-font-awesome-icons #main-footer .fas > a:before, | |
| .divi-hacks-font-awesome-icons #main-footer .fal > a:before, | |
| .divi-hacks-font-awesome-icons #main-footer .fa > a:before { | |
| font-size: 1em } | |
| /** Secondary Nav Font Awesome Icon Color **/ | |
| .divi-hacks-font-awesome-icons #main-footer .fa > a:before, | |
| .divi-hacks-font-awesome-icons #main-footer .fas > a:before, | |
| .divi-hacks-font-awesome-icons #main-footer .far > a:before, | |
| .divi-hacks-font-awesome-icons #main-footer .fab > a:before, | |
| .divi-hacks-font-awesome-icons #main-footer .fal > a:before { | |
| color: #8300e9; | |
| } | |
| /** Main Footer Background **/ | |
| #main-footer { | |
| background-image: url('') ; | |
| background-size: cover; | |
| background-repeat: no-repeat; | |
| background-position: center; | |
| } | |
| /** DH Footer Copyright **/ | |
| .dh-footer-copyright { display: inline; } | |
| /* CUSTOM CSS */ | |
| @media only screen and (max-width:767px) { | |
| } | |
| @media only screen and (max-width:980px) { | |
| } | |
| @media only screen and (min-width:480px) and (max-width:981px) { | |
| } | |
| @media only screen and (min-width:981px) { | |
| } | |
| /** Login Form Error Messages **/ | |
| </style> | |
| /*===========================================================================================================*/ | |
| <style> | |
| .divi-hacks-mobile-menu-fullscreen.is-mobile #main-header .et_mobile_menu, | |
| .divi-hacks-mobile-menu-slide-in.is-mobile #mobile_menu { | |
| background: rgba(0,0,0,0.8); | |
| background: -moz-linear-gradient(left, #d2ff52 0%, #91e842 100%); | |
| background: -webkit-linear-gradient(left, #d2ff52 0%,#91e842 100%); | |
| background: -ms-linear-gradient(left, #d2ff52 0%,#91e842 100%); | |
| filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#91e842',GradientType=1 ); | |
| } | |
| </style> | |
| /*===========================================================================================================*/ | |
| <style> | |
| #main-header:before { | |
| background-image: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 100%) !important; | |
| background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 100%) !important; | |
| background: -ms-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 100%) !important; | |
| filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(0,0,0,0)', endColorstr='rgba(0,0,0,0)',GradientType=1 ) !important; | |
| position:absolute; | |
| top:0; | |
| bottom:0; | |
| left:0; | |
| width:100%; | |
| height:100%; | |
| content:''; | |
| z-index:1; | |
| } | |
| </style> | |
| /*===========================================================================================================*/ | |
| <style> | |
| #top-header:before { | |
| background-image: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 100%) !important; | |
| background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 100%) !important; | |
| background: -ms-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 100%) !important; | |
| filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(0,0,0,0)', endColorstr='rgba(0,0,0,0)',GradientType=1 ) !important; | |
| position:absolute; | |
| top:0; | |
| bottom:0; | |
| width:100%; | |
| height:100%; | |
| content:''; | |
| z-index:1; | |
| } | |
| #top-header .container { | |
| z-index: 2; | |
| } | |
| </style> | |
| /*===========================================================================================================*/ | |
| <style> | |
| #main-footer:before { | |
| background-image: -moz-linear-gradient(left, #e02b20 0%, rgba(12,113,195,0.99) 100%) !important; | |
| background: -webkit-linear-gradient(left, #e02b20 0%,rgba(12,113,195,0.99) 100%) !important; | |
| background: -ms-linear-gradient(left, #e02b20 0%,rgba(12,113,195,0.99) 100%) !important; | |
| filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e02b20', endColorstr='rgba(12,113,195,0.99)',GradientType=1 ) !important; | |
| position:absolute; | |
| top:0; | |
| bottom:0; | |
| left:0; | |
| width:100%; | |
| height:100%; | |
| content:''; | |
| z-index:1; | |
| } | |
| #main-footer { | |
| position:relative; | |
| } | |
| #main-footer .container { | |
| z-index: 2; | |
| } | |
| </style> | |
| /*===========================================================================================================*/ | |
| /*===========================================================================================================*/ | |
| /*===========================================================================================================*/ | |
| /*===========================================================================================================*/ | |
| /*===========================================================================================================*/ | |
| /*===========================================================================================================*/ | |
| /*===========================================================================================================*/ | |
| /*===========================================================================================================*/ | |
| /*===========================================================================================================*/ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
https://github.com/muks999/DIVI-hacks-code