/* * STYLE DEFAULT FOR LAYOUT * * * [Table of contents] * * [&. Content / #key] * [Let press Ctrl + f and type of paste the key, then press Enter to search the content ] * * Summary: * * * 1. VARIABLE * * 2. ROW SEPARATE * * 3. LAYOUT BOXED * * 4. xxxxxxxxx * * 5. LOAD AJAX * * 6. HEADER * - 6.1 Header default * - 6.2 Topbar * - 6.3 Main Header * - 6.4 Search * - 6.5 Main Menu * - 6.6 Sub Menu * - 6.7 Mega Menu * - 6.8 Header transparent * - 6.9 Header center * - 6.10 Header With Banner * - 6.11 Header Table * - 6.12 Header appexpo * - 6.13 Menu mobile * - 6.14 Menu mobile with topbar * - 6.14 Header center splitted * - 6.16 Header Box * * 7. FOOTER * - 7.1 Footer Default * - 7.2 Footer wrapper * - 7.3 Footer main * - 7.4 Footer Bottom * - 7.5 Footer custom * * 8. BLOG DETAIL * - 8.1. Blog Detail General * - 8.2. Blog Detail Related Post * - 8.3. Blog Detail Author * - 8.4. Blog Detail Tag Links * - 8.5. Blog Detail Block Comment * - 8.6. Blog Detail Recent Post * - 8.7. Blog Detail Share Link * - 8.8. Blog Detail Layout 1 * - 8.9. Blog Detail Layout 2 * - 8.10. Blog Detail Layout 3 * - 8.11. Blog Detail Layout 4 * - 8.12. Blog Detail Layout 5 * * RESBONSIVE * * */ /*============================================ = 1. VARIABLE = ============================================*/ body.fancy-open{ overflow: hidden; } .entry-content .slz-title-shortcode, .slz-title-shortcode { margin: 0 0 50px; text-transform: capitalize; font-size: 36px; line-height: 1.2; font-weight: 700; color: #18364a; } .sc-image img { margin: 0 auto; } #page-content .vc_row[data-vc-full-width] { overflow: visible; } header.setting-header-normal .slz-header-main { position: relative !important; } .slz-wrapper-content .slz_bg-parallax { background-size: cover !important; background-attachment: fixed; } /*========= End of Variable =============*/ /*============================================ = 2. ROW SEPARATE = ============================================*/ .slz-page-shortcode .vc_row { padding-bottom: 100px; //display: table; //width: calc(100% + 30px); position: relative; } .slz-page-shortcode .vc_row + .vc_row { padding-top: 100px; } .slz-page-shortcode .vc_row + .vc_row.vc_row-has-fill, .slz-page-shortcode .vc_row + .vc_row.vc_row-has-fill + .vc_row, .slz-page-shortcode .vc_row + .vc_row.vc_row-has-fill + .vc_row-full-width + .vc_row { padding-top: 65px; } .slz-page-shortcode .vc_row:last-child { padding-bottom: 0; } .slz-page-shortcode .vc_row:after{ content: ''; height: 1px; position: relative; bottom: -100px; width: 100%; background-image: linear-gradient(to right, rgba(0, 0, 0, 0.03), rgba(0, 0, 0, 0.15), rgba(6, 6, 6, 0.03)); } .slz-page-shortcode .vc_row:last-child:after{ content: " "; display: table; background-image: none; position: relative; height: auto; } .slz-page-shortcode .entry-content .vc_row .vc_custom_heading { margin-bottom: 70px; } .slz-page-shortcode .entry-content .vc_row .vc_custom_heading + .vc_empty_space { height: 0 !important; } .slz-menu-wrapper.feature-nav { background: #f7f7f7; padding: 40px 35px; box-shadow: inset 0 0 7px #e7e7e7; margin-top: 80px; } .slz-menu-wrapper.feature-nav, .slz-menu-wrapper.feature-nav > li, .slz-menu-wrapper.feature-nav > li > .sub-menu { float: none; } .slz-menu-wrapper.feature-nav > li > .sub-menu { padding-left: 0; } .slz-menu-wrapper.feature-nav > li > a { padding-left: 15px; line-height: 26px; margin-bottom: 20px; font-size: 16px; } .slz-menu-wrapper.feature-nav > li > a:hover { color: inherit; } .slz-menu-wrapper.feature-nav > li > a:after { content: ''; display: block; width: 30px; height: 1px; background-color: #444; } .slz-menu-wrapper.feature-nav .current-menu-item > a { } .slz-menu-wrapper.feature-nav > li > .sub-menu > li { width: 25%; float: left; } .slz-menu-wrapper.feature-nav > li > .sub-menu > li > a { display: none; } .slz-menu-wrapper.feature-nav > li > .sub-menu li { list-style: none; padding-left: 0; padding-bottom: 7px; } /*========= End of Row Separate =========*/ /*============================================ = 3. LAYOUT BOXED = ============================================*/ .slz-boxed-layout{ margin-left: auto; margin-right: auto; width: 1200px; } .slz-boxed-layout.layout-has-box-shadow{ -webkit-box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.4); box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.4); } .slz-boxed-layout.layout-has-border{ border:1px solid #ccc; } .slz-boxed-layout.layout-algin-left{ margin-left: 0px!important; margin-right: auto!important; } .slz-boxed-layout.layout-algin-right{ margin-right: 0px!important; margin-left: auto!important; } .slz-main-content { -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .slz-boxed-layout .slz-main-content { background-color: #fff; } /*========= End of Layout boxed ==========*/ /*============================================ = 5. LOAD AJAX = ============================================*/ .slz-shortcode { position: relative; z-index: 10; } .mask { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(255,255,255,0.5); z-index: 10; background-image: url(http://wp.solazu.net/starter-theme/wp-content/uploads/2016/11/ring-alt-1.gif); background-repeat: no-repeat; background-position: center center; } /*========= End of Load ajax =============*/ /*============================================ = 6. HEADER = ============================================*/ /*---------- 6.1 Header default ----------*/ .slz-header-main { top: 0; width: 100%; z-index: 100; background-color: #fff; box-shadow: 1px 2px 7px rgba(0, 0, 0, 0.1); } .slz-header-main .container { display: table; position: relative; } .slz-header-main .slz-logo-wrapper { position: relative; } .slz-header-main .slz-button-search { float: right; } .slz-logo-wrapper .logo { display: inline-block; vertical-align: top; font-size: 24px; font-weight: 700; text-transform: uppercase; color: #da0f32; line-height: 100px; height: 100px; min-width: 130px; } .slz-logo-wrapper .logo > span { color: #da0f32; } .slz-logo-wrapper .logo img { max-width: 130px; max-height: 70px; position: absolute; left: 0; top: 50%; transform: translate(0, -50%); -ms-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); } /*---------- 6.2 Topbar ------------------*/ .slz-header-topbar { line-height: 40px; background-color: #18364a; color: rgba(255, 255, 255, 0.7); border-bottom: 2px solid #fff; position: relative; z-index: 101; } .slz-header-topbar .social { display: inline-block; vertical-align: top; } .slz-header-topbar .slz-btn { margin-left: 30px; vertical-align: top; padding-top: 0; padding-bottom: 0; line-height: 40px; } .slz-header-topbar .social a { display: inline-block; vertical-align: top; margin: 0 12px; font-size: 14px; color: rgba(255, 255, 255, 0.7); } .slz-header-topbar .social a:hover { color: #fff; } .slz-header-topbar .social a:first-child { margin-left: 0; } .slz-header-topbar .social a:last-child { margin-right: 0; } .slz-header-topbar .social a i { color: inherit; margin-right: 0; } .navbar-topbar { margin: 0; padding: 0; } .navbar-topbar li { list-style: none; display: inline-block; vertical-align: top; margin: 0 15px; } .navbar-topbar li:first-child { margin-left: 0; } .navbar-topbar li:last-child { margin-right: 0; } .navbar-topbar a { color: rgba(255, 255, 255, 0.7); text-transform: capitalize; } .navbar-topbar a:hover { color: #fff; } .slz-topbar-list .item { display: inline-block; margin-right: 35px; } .slz-topbar-list .item:last-child { margin-right: 0; } .slz-topbar-list .link { margin-right: 10px; } .slz-topbar-list .link:last-child { margin-right: 0; } .slz-topbar-list i { color: inherit; font-size: 16px; line-height: 24px; display: inline-block; min-width: 25px; text-align: center; } .slz-topbar-list .text { font-size: 13px; color: rgba(255, 255, 255, 0.7); display: inline-block; vertical-align: top; margin: 0; } .slz-topbar-list .text .number-phone { color: #da0f32; font-weight: 700; font-size: 16px; } #lang_sel li, #lang_sel ul ul { width: 200px; } #lang_sel img.iclflag { margin-bottom: 0; } #lang_sel a:visited { border: 1px solid #ececec; } #lang_sel a.lang_sel_sel { padding: 5px 12px; } #lang_sel ul ul { top: 34px; } #lang_sel a.lang_sel_sel span { display: inline-block; vertical-align: middle; } #lang_sel ul ul a span { display: inline-block; vertical-align: middle; } .slz-topbar-list .social .share-facebook:hover { color: #365899; } .slz-topbar-list .social .share-twitter:hover { color: #1da1f2; } .slz-topbar-list .social .share-google-plus:hover, .slz-topbar-list .social .share-google:hover { color: #d73d32; } .slz-topbar-list .social .share-pinterest:hover { color: #bd081c; } .slz-topbar-list .social .share-vimeo:hover { color: #00adef; } .slz-topbar-list .social .share-skype:hover { color: #00aff0; } .slz-topbar-list .social .share-youtube:hover { color: #e62117; } .slz-topbar-list .social .share-rss:hover { color: #f36f24; } .slz-topbar-list .social .share-delicious:hover { color: #2a96ff; } .slz-topbar-list .social .share-flickr:hover { color: #ff0084; } .slz-topbar-list .social .share-lastfm:hover { color: #b90000; } .slz-topbar-list .social .share-linkedin:hover { color: #0077b5; } .slz-topbar-list .social .share-tumblr:hover { color: #36465d; } .slz-topbar-list .social .share-deviantart:hover { color: #05cc47; } .slz-topbar-list .social .share-git:hover { color: #f34f29; } .slz-topbar-list .social .share-instagram:hover { color: #895a4d; } .slz-topbar-list .social .share-soundcloud:hover { color: #ff5500; } .slz-topbar-list .social .share-stumbleupon:hover { color: #eb4924; } .slz-topbar-list .social .share-behance:hover { color: #005cff; } .slz-topbar-list .social .share-tripadvisor:hover { color: #589442; } .slz-topbar-list .social .share-vk:hover { color: #507299; } .slz-topbar-list .social .share-foursquare:hover { color: #f94877; } .slz-topbar-list .social .share-xing:hover { color: #add000; } .slz-topbar-list .social .share-weibo:hover { color: #e6162d; } .slz-topbar-list .social .share-odnoklassniki:hover { color: #f58220; } /*---------- 6.3 Main Header -------------*/ .slz-header-main { transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .slz-header-main .container { display: table; position: relative; } .slz-header-main .slz-button-search { transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .slz-header-main .float-l .slz-button-search { float: left; margin-left: 0; margin-right: 15px; } .slz-header-main .float-l .slz-menu-wrapper { float: right; } .slz-header-main .float-l .nav-search { right: auto; left: 0; } .slz-header-main .float-l .nav-search:before { left: 22px; right: auto; } .slz-header-main .float-l .nav-search-full .nav-search form input[type='text'] { padding-left: 45px; } .slz-header-main .float-r .slz-button-search { float: right; } .slz-header-main .float-r.slz-logo-wrapper { left: auto; right: 15px; } .slz-header-fixed { top: 0; left: 0; right: 0; position: fixed; z-index: 101; box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2); } .slz-header-fixed .slz-menu-wrapper > li > a, .slz-header-fixed .slz-button-search { line-height: 60px; } .slz-header-fixed .nav-search { top: 70px; } .slz-header-fixed .slz-logo-wrapper .logo { line-height: 60px; height: 60px; } .slz-header-fixed .slz-logo-wrapper .logo img { max-height: 50px; } /*.slz-hidden-menu { top: -150px !important; }*/ .slz-header-main.slz-header-fixed.slz-wpadminbar { top: 32px; } /*---------- 6.4 Search -----------------*/ .slz-button-search { display: inline-block; cursor: pointer; position: relative; z-index: 100; line-height: 100px; margin-left: 15px; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .slz-button-search .icons { color: #666c72; padding: 0 7px; top: -1px; min-width: 27px; position: relative; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .slz-button-search:hover .icons { color: #da0f32; } .slz-button-search.active .fa-search:before { content: "\f00d"; } .nav-search { padding: 20px; background-color: #fff; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2); position: absolute; right: 0; top: 110px; z-index: 100; } .nav-search:before { position: absolute; content: "\2666"; top: -14px; right: 22px; color: #fff; font-size: 30px; } .nav-search form { display: table; width: 100%; color: #666c72; height: 40px; border: 1px solid #f1f1f1; } .nav-search form > label { display: none; } .nav-search form input[type='text'], .nav-search form input[type='search'] { border: none; display: table-cell; width: 225px; height: 40px; padding: 0 20px; float: left; } .nav-search form .searchbutton, .nav-search form .search-submit { width: 40px; height: 40px; padding: 0; display: table-cell; border: none; box-shadow: none; background-color: #fff; text-align: center; vertical-align: middle; position: relative; } .nav-search form .search-submit { font-size: 0px; top: 0; float: left; position: relative; } .nav-search form .search-submit span { font-size: 0px; line-height: 40px; } .nav-search form .search-submit span:before { font-family: 'FontAwesome'; content: "\f002"; font-size: 14px; line-height: inherit; display: inline-block; } .nav-search form .search-submit:hover span { color: #da0f32; } .nav-search-full { position: absolute; background-color: #fff; } .nav-search-full.active { left: 0; right: 0; top: 0; bottom: 0; z-index: 1; } .nav-search-full .nav-search { top: 0; left: 0; width: 100%; height: 100%; padding: 0; box-shadow: none; } .nav-search-full .nav-search:before { content: none; } .nav-search-full .nav-search form { display: block; height: 100%; border: none; } .nav-search-full .nav-search form > label { display: none; } .nav-search-full .nav-search form input { display: block; width: 100%; height: 100%; font-size: 18px; } .nav-search-full .nav-search form input::-webkit-input-placeholder, .slz-main-menu-mobile .nav-search form input::-webkit-input-placeholder { color: rgba(255,255,255,0.8); } .nav-search-full .nav-search form input::-moz-placeholder, .slz-main-menu-mobile .nav-search form input::-moz-placeholder { color: rgba(255,255,255,0.8); } .nav-search-full .nav-search form input:-ms-input-placeholder, .slz-main-menu-mobile .nav-search form input:-ms-input-placeholder { color: rgba(255,255,255,0.8); } .nav-search-full .nav-search form input:-moz-placeholder, .slz-main-menu-mobile .nav-search form input:-moz-placeholder { color: rgba(255,255,255,0.8); } .nav-search-full .nav-search form .searchbutton, .nav-search-full .nav-search form .search-submit { display: none; } /*---------- 6.5 Main Menu ---------------*/ .slz-menu-wrapper > li { position: relative; } .slz-menu-wrapper > li > a { padding: 0 20px; line-height: 100px; color: #666c72; text-transform: uppercase; font-weight: 700; font-size: 14px; position: relative; cursor: pointer; } .slz-menu-wrapper li > a .label { display: inline-block; vertical-align: 3px; font-size: 11px; font-weight: 600; line-height: 1.4; margin-left: 10px; text-transform: uppercase; padding: 3px 5px 0px 5px; } .slz-menu-wrapper > li:first-child > a { padding-left: 0; } .slz-menu-wrapper > li:last-child > a { padding-right: 0; } .slz-menu-wrapper > li > a:focus { background-color: transparent; color: #da0f32; } .slz-menu-wrapper > li > a .icon-dropdown { display: none; width: 9px; text-align: center; } .slz-menu-wrapper > li:hover > a { background-color: transparent; color: #da0f32; } .slz-menu-wrapper .menu-item-has-children > a .text { margin-right: 10px; } .slz-menu-wrapper .menu-item-has-children > a .icon-dropdown { display: inline-block; } .slz-menu-wrapper .menu-item-has-mega-menu { position: static; } .slz-menu-wrapper .menu-item-has-mega-menu > a .text { margin-right: 10px; } .slz-menu-wrapper .menu-item-has-mega-menu > a .icon-dropdown { display: inline-block; } .slz-menu-wrapper .current-menu-item > a { background-color: transparent; color: #da0f32; } .slz-main-menu .slz-menu-wrapper > li.menu-item-has-icon > a { padding-left: 15px; } .slz-main-menu .slz-menu-wrapper > li.menu-item-has-icon > a .icon-dropdown { display: inline-block; margin-left: 5px; } .slz-main-menu .icon-dropdown-mobile { display: none; } .slz-main-menu .slz-megamenu-desc { padding: 15px; } /*---------- 6.6 Sub Menu ----------------*/ .slz-main-menu .sub-menu { opacity: 0; z-index: 1; top: 100%; padding: 0; width: 220px; text-align: left; position: absolute; visibility: hidden; background-color: #fff; border-top: 3px solid #da0f32; transition: all 0.15s ease; box-shadow: 1px 1px 15px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 1px 15px rgba(0, 0, 0, 0.1); -moz-box-shadow: 1px 1px 15px rgba(0, 0, 0, 0.1); transition-delay: 0.3s; -webkit-transition-delay: 0.3s; } .slz-main-menu .sub-menu > li { list-style: none; display: block; background-color: #fff; position: relative; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .slz-main-menu .sub-menu > li > a { width: 100%; padding: 10px 20px; line-height: 24px; font-weight: 500; display: inline-block; vertical-align: top; color: #666c72; } .slz-main-menu .sub-menu > li > a .icons { float: left; width: 25px; line-height: 24px; text-align: left; } .slz-main-menu .sub-menu > li > a .text { float: left; } .slz-main-menu .sub-menu > li > a .icon-dropdown { line-height: 24px; float: right; display: none; } .slz-main-menu .sub-menu.mega-menu-row > .menu-item-has-icon > a, .slz-main-menu .sub-menu.sub-menu-has-icons > li > a { padding-left: 35px; position: relative; } .slz-main-menu .sub-menu.mega-menu-row > .menu-item-has-icon > a .icon-dropdown, .slz-main-menu .sub-menu.sub-menu-has-icons > li > a .icon-dropdown { position: absolute; display: block; float: none; left: 15px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .slz-main-menu .sub-menu .menu-item-has-children > a { position: relative; } .slz-main-menu .sub-menu .menu-item-has-children > a:after { font-family: 'FontAwesome'; content: "\f105"; position: absolute; font-size: 14px; right: 15px; top: 50%; width: auto; line-height: 24px; color: #8c8f94; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .slz-main-menu .sub-menu.mega-menu-row .menu-item-has-children > a:after { content: none; } .slz-main-menu .sub-menu .menu-item-has-children:hover > a:after { color: #da0f32; } .slz-main-menu .sub-menu > li + li { border-top: 1px solid rgba(0, 0, 0, 0.1); } .slz-main-menu .sub-menu > li:hover { background-color: #f5f5f5; } .slz-main-menu .sub-menu > li:hover > a { color: #da0f32; } .slz-main-menu .sub-menu .menu-item-has-children > a > .icon-dropdown { display: block; } .slz-main-menu .sub-menu .sub-menu { left: 100%; top: -3px; z-index: 1; } .slz-main-menu .sub-menu .sub-menu.left { right: 100%; left: auto; } /*---------- 6.7 Mega Menu ---------------*/ .slz-main-menu .mega-menu { visibility: hidden; position: absolute; text-align: left; opacity: 0; z-index: 1; top: 100%; left: 15px; right: 15px; background-color: #fff; box-shadow: 1px 1px 15px rgba(0, 0, 0, 0.1); transition: all 0.15s ease; transition-delay: 0.3s; -webkit-transition-delay: 0.3s; -webkit-box-shadow: 1px 5px 15px rgba(0, 0, 0, 0.1); -moz-box-shadow: 1px 5px 15px rgba(0, 0, 0, 0.1); } .slz-main-menu .mega-menu .sub-menu { //opacity: 1; //visibility: visible; position: relative; } .slz-main-menu .mega-menu > .title { margin: 0; font-size: 15px; text-transform: uppercase; font-weight: 700; color: #da0f32; display: block; padding-bottom: 12px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .slz-main-menu .mega-menu .link { text-transform: capitalize; color: #666c72; font-size: 14px; display: block; line-height: 45px; font-weight: 500; padding-left: 10px; transition: all 0.2s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -o-transition: all 0.3s linear; } .slz-main-menu .mega-menu .link .icons { width: 25px; text-align: left; } .slz-main-menu .mega-menu .link:hover { color: #da0f32; background-color: #f5f5f5; } .mega-menu-row .mega-menu-col { list-style: none; padding-left: 15px; padding-right: 15px; display: inline-block; border: none; width: 25%; float: left; } .slz-main-menu .mega-menu-row .mega-menu-col:hover { background-color: transparent; } .slz-main-menu .mega-menu-row.sub-menu .mega-menu-col > a { font-size: 15px; text-transform: uppercase; font-weight: 700; color: #da0f32; display: block; background-color: #fff; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .slz-main-menu .mega-menu-row.sub-menu li > a { font-weight: 400; } .mega-menu-row .mega-menu-col > a:hover { background-color: #fafafa; } .mega-menu-row .mega-menu-col .sub-menu { width: 100%; display: table; padding: 0; //opacity: 1; //visibility: visible; position: relative; top: auto; left: 0 !important; right: auto !important; border-top: none; box-shadow: none; } .mega-menu-tablist { width: 200px; float: left; padding: 0 30px 0 0; } .mega-menu-tablist li { list-style: none; border-top: 1px solid rgba(0, 0, 0, 0.1); } .mega-menu-tablist li:last-child { border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .mega-menu-tablist li.active .link, .mega-menu-tablist li:hover .link { color: #da0f32; background-color: #fafafa; } .mega-menu-tab-content { width: calc(100% - 200px); float: left; } .slz-main-menu .sub-menu > li + li.mega-menu-col, .slz-main-menu .sub-menu > li.mega-menu-col + li.mega-menu-col{ border-top: none; } .slz-main-menu .sub-menu.mega-menu-row { //opacity: 1; //visibility: visible; position: relative; display: table; width: 100%; padding-bottom: 15px; padding-top: 15px; } .slz-main-menu .sub-menu.mega-menu-row:before{ content: ""; display: table; } .slz-main-menu .sub-menu.mega-menu-row:after{ content: ""; display: table; clear: both; } .mega-menu-row.slz-megamenu-col-1 .mega-menu-col { width: 100%; } .mega-menu-row.slz-megamenu-col-2 .mega-menu-col { width: 50%; } .mega-menu-row.slz-megamenu-col-3 .mega-menu-col { width: 33.33333%; } .mega-menu-row.slz-megamenu-col-4 .mega-menu-col { width: 25%; } /*---------- 6.8 Header transparent ------*/ .header-transparent{ position: absolute; top: 0; width:100%; left: 0; z-index: 101; } .header-transparent .logo img { opacity: 0; } .header-transparent .logo .logo-header-transparent { opacity: 1; } .header-transparent .slz-header-fixed .logo img { opacity: 1; } .header-transparent .slz-header-fixed .logo .logo-header-transparent { opacity: 0; } .header-transparent .slz-header-topbar { background-color: transparent; border-bottom: 1px solid rgba(255, 255, 255, 0.5); } .header-transparent .slz-header-main { background-color: transparent; box-shadow: none; } .header-transparent .slz-header-main.slz-header-fixed { background-color: #fff; box-shadow: 1px 2px 7px rgba(0, 0, 0, 0.1); } .header-transparent .slz-header-main:not(.slz-header-fixed) { color: #FFFFFF; } .header-transparent .slz-logo-wrapper .logo, .header-transparent .slz-menu-wrapper > li > a{ color: #fff; } .header-transparent .slz-menu-wrapper > .current-menu-item > a, .header-transparent .slz-menu-wrapper > li:hover > a{ color: #da0f32; } .header-transparent .slz-button-search .icons { color: #fff; } .header-transparent .slz-header-fixed .slz-logo-wrapper .logo { color: #da0f32; } .header-transparent .slz-header-fixed .slz-menu-wrapper > li > a, .header-transparent .slz-header-fixed .slz-button-search .icons { color: #18364a; } .header-transparent .slz-header-fixed .slz-menu-wrapper > .current-menu-item > a, .header-transparent .slz-header-fixed .slz-menu-wrapper > li:hover > a { color: #da0f32; } .header-transparent .slz-hamburger-menu .bar, .header-transparent .slz-hamburger-menu .bar:before, .header-transparent .slz-hamburger-menu .bar:after { background: #fff; } .header-transparent .slz-header-fixed .slz-hamburger-menu .bar, .header-transparent .slz-header-fixed .slz-hamburger-menu .bar:before, .header-transparent .slz-header-fixed .slz-hamburger-menu .bar:after { background: #da0f32; } .header-absolute{ padding-top: 100px; } /*---------- 6.9 Header center -----------*/ .slz-header-center .slz-logo-wrapper { float: none; position: relative; display: block; text-align: center; padding: 20px 0 10px 0; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); } .slz-header-center .slz-logo-wrapper .logo { line-height: 1; height: auto; //min-height: 35px; } .slz-header-center .slz-logo-wrapper .logo img { left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); } .slz-header-center .slz-main-menu { float: none; display: block; text-align: center; position: relative; } .slz-header-center .navbar-nav { float: none; display: inline-block; vertical-align: top; } .slz-header-center .slz-menu-wrapper > li > a { line-height: 60px; } .slz-header-center .slz-button-search { line-height: 60px; } .slz-header-center .nav-search { top: 70px; right: -15px; } .slz-main-menu .mega-menu { /*pointer-events: none;*/ } .slz-header-center .slz-header-fixed .slz-logo-wrapper { float: left; padding: 0; position: absolute; z-index: 10; } .slz-header-center .slz-header-fixed .slz-main-menu { float: right; width: 100%; text-align: right; } .slz-header-center .slz-header-fixed .slz-logo-wrapper .logo { line-height: 60px; height: 60px; } .slz-header-center .slz-header-fixed .slz-logo-wrapper .logo img { left: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); } .slz-header-center .slz-main-menu-mobile .nav-search { right: 0; } /*---------- 6.10 Header With Banner -----*/ .slz-header-with-banner .slz-banner-mobile { display: none; text-align: center; padding-bottom: 10px; padding-top: 10px; } .slz-header-with-banner .slz-header-main .slz-header-middle-wrapper { display: inline-block; vertical-align: top; width: 100%; } .slz-header-with-banner .slz-header-main .slz-logo-wrapper { float: left; z-index: 1; } .slz-header-with-banner .slz-header-main .slz-logo-wrapper .logo img { left: auto; } .slz-header-with-banner .slz-header-main .slz-banner-01 { float: right; text-align: right; padding: 10px 0; width: auto; } .slz-header-with-banner .slz-header-main .slz-weather-wrapper { padding-left: 15px; } .slz-header-with-banner .slz-header-fixed .slz-header-middle-wrapper { display: inline-block; width: auto; height: auto; vertical-align: top; } .slz-header-with-banner .slz-header-fixed .slz-banner-01 { display: none; } .slz-header-with-banner .slz-header-fixed .slz-main-menu { float: right; position: static; } .slz-header-with-banner .slz-header-fixed .slz-main-menu .mega-menu { margin: 0 15px; } .slz-header-with-banner .slz-header-fixed .nav-search { top: 80px; } .slz-header-with-banner .slz-header-fixed .nav-search:before { right: 10px; } .slz-header-with-banner .slz-header-fixed .slz-weather-wrapper .weather-icons i { font-size: 62px; line-height: 60px; } .slz-header-with-banner .slz-header-fixed .slz-weather-wrapper .weather-info { height: 60px; } .slz-header-with-banner .slz-main-menu { position: relative; } .slz-header-with-banner .slz-main-menu:before { position: absolute; width: 500%; height: 100%; content: ""; left: 50%; background-color: #fafafa; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); } .slz-header-with-banner.header-transparent .slz-main-menu:before { background-color: rgba(255, 255, 255, 0.05); } .slz-header-with-banner .slz-main-menu .mega-menu { left: 0; right: 0; } /*---------- 6.11 Header Table -----------*/ .slz-header-table { display: table; width: 100%; position: relative; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .slz-header-table .slz-header-table-cell-1 { display: table-cell; width: 380px; text-align: center; vertical-align: middle; position: relative; background-color: #da0f32; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .slz-header-table .slz-hamburger-menu .bar, .slz-header-table .slz-hamburger-menu .bar:before, .slz-header-table .slz-hamburger-menu .bar:after { background-color: #fff; } .slz-header-table .position-relative { position: relative; } .slz-header-table .slz-header-topbar { padding: 8px 30px; border: none; position: relative; } .slz-header-table .slz-header-topbar:after { content: ''; background-color: #161616; width: 1000px; height: 100%; top: 0; right: 0; position: absolute; transform: translateX(100%); -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); } .slz-header-table .slz-menu-wrapper > li > a, .slz-header-table .slz-button-search { line-height: 60px; } .slz-header-table .slz-header-main { padding: 0 30px; box-shadow: none; } .slz-header-table .slz-header-main:after { content: ''; background-color: #fff; width: 1000px; height: 60px; top: 42px; right: 0; position: absolute; transform: translateX(100%); -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); } .slz-header-table .slz-header-table-cell-2 { display: table-cell; } .slz-header-table .slz-logo-wrapper .logo { min-height: auto; min-width: auto; color: #fff; } .slz-header-table .slz-logo-wrapper .logo img { max-width: 170px; position: relative; top: auto; left: auto; transform: none; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; } .slz-header-table .slz-main-menu .mega-menu { max-width: 1140px; margin: 0 auto; } .slz-header-table.slz-header-fixed { top: 0; left: 0; right: 0; position: fixed; z-index: 101; } .slz-header-table.slz-header-fixed .slz-logo-wrapper .logo img { max-height: 60px; } .slz-header-table.header-transparent { background-color: transparent; position: absolute; } .slz-header-table.header-transparent.slz-header-fixed { position: fixed; } /*---------- 6.12 Header appexpo ---------*/ .slz-has-subheader .slz-main-menu { padding-right: 35px; } .slz-header-main .slz-menu-icon{ position: absolute; right: 15px; top: 50%; z-index: 10; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); -ms-transform: translate(0,-50%); -o-transform: translate(0,-50%); } .admin-bar .slz-sub-header .slz-navbar-wrapper .slz-menu-wrapper{ top: 32px; } .slz-sub-header .slz-navbar-wrapper .slz-menu-wrapper .slz-sub-menu .navbar-nav{ position: relative; top: 0; left: 0; bottom: auto; width: 100%; } .menu-body { padding: 30px; } .menu-body .slz-sub-menu> .navbar-nav { display: block; } .menu-body .slz-sub-menu> .navbar-nav > li { display: block; width: 100%; position: relative; background-color: rgba(255, 255, 255, 0.2); border-radius: 4px; -webkit-border-radius: 4px; margin-bottom: 25px; } .menu-body .slz-sub-menu> .navbar-nav > li > a { display: block; color: inherit; font-size: 12px; line-height: 1.5; font-weight: 500; background-color: rgba(255, 255, 255, 0.2); border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; margin: 0; padding: 8px 14px; text-transform: uppercase; } .menu-body .slz-sub-menu .mega-menu { padding: 0px; } .menu-body .slz-sub-menu .mega-menu-row { display: block; } .menu-body .slz-sub-menu .mega-menu-row >li:first-child:nth-last-child(1) { width: 100%; } .menu-body .slz-sub-menu .mega-menu-row >li:first-child:nth-last-child(2), .menu-body .slz-sub-menu .mega-menu-row >li:first-child:nth-last-child(2) ~ li { width: 50%; } .menu-body .slz-sub-menu .mega-menu-row >li:first-child:nth-last-child(3), .menu-body .slz-sub-menu .mega-menu-row >li:first-child:nth-last-child(3) ~ li { width: 50%; } .menu-body .slz-sub-menu .mega-menu-row >li:first-child:nth-last-child(4), .menu-body .slz-sub-menu .mega-menu-row >li:first-child:nth-last-child(4) ~ li { width: 50%; } .menu-body .slz-sub-menu .sub-menu > li > a .icon-dropdown{ line-height: 1.5; } .slz-sub-menu .sub-menu .sub-menu{ left: 0; top: 0; position: relative; box-shadow: none; -webkit-box-shadow: none; } .slz-main-menu .sub-menu .sub-menu .sub-menu{ padding: 0px; } .menu-body .slz-sub-menu .mega-menu-row .mega-menu-col { display: block; padding-left: 10px; padding-right: 10px; } .slz-main-menu .mega-menu-row.sub-menu .mega-menu-col > a{ background-color: transparent; font-size: 14px; font-weight: 400; border-bottom: none; margin-bottom: 10px; } .menu-body .slz-sub-menu .mega-menu-row .mega-menu-col .title { font-size: 14px; font-weight: 400; border-bottom: none; margin-bottom: 10px; } .menu-body .slz-sub-menu .mega-menu-row .list-link li { margin-bottom: 10px; } .menu-body .slz-sub-menu .mega-menu-row .list-link li a { color: inherit; } .menu-body .slz-sub-menu .mega-menu-row .list-link li a .icons { margin-right: 5px; display: none; } .menu-body .slz-sub-menu .sub-menu { display: block; padding: 20px; position: relative; width: 100%; opacity: 1; visibility: visible; background-color: transparent; border-top: none; } .menu-body .slz-sub-menu .mega-menu-row{ margin-left: -10px; margin-right: -10px; width: auto; } .menu-body .slz-sub-menu .sub-menu .sub-menu{ padding: 0px; } .menu-body .slz-sub-menu .sub-menu > li{ background-color: transparent; } .menu-body .slz-sub-menu .sub-menu li a{ padding: 0px; margin-bottom: 10px; line-height: 1.5; display: inline-block; } .menu-body .slz-sub-menu .sub-menu > li.menu-item { margin-bottom: 0px; border-top: none; } .menu-body .slz-sub-menu .sub-menu > li.menu-item:last-child{ margin-bottom: 0px; } .menu-body .slz-sub-menu .mega-menu{ position: relative; width: 100%; display: block; opacity: 1; visibility: visible; background-color: transparent; border-top: none; padding: 0px; left: 0; } .menu-body .slz-sub-menu-mobile{ display: none; } .subheader-mask{ position: fixed; width:100%; height: 100%; background-color: rgba(0,0,0,0.9); left: 0; top: 0; z-index: 999; color: #ffffff; display: none; } .subheader-mask.active{ display: block; } .subheader-mask:hover{ cursor: crosshair; } .slz-sub-header .contact{ position: fixed; background-color:rgba(0,0,0,0.5); height: 100%; top: 0px; width:inherit; z-index: 20; -moz-transform: translateX(400px); -webkit-transform: translateX(400px); -o-transform: translateX(400px); -ms-transform: translateX(400px); transform: translateX(400px); -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .slz-sub-header .contact.open{ -moz-transform: translateX(0px); -webkit-transform: translateX(0px); -o-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); } .admin-bar .slz-sub-header .contact{ top: 32px; } .slz-sub-header .slz-menu-icon{ position: absolute; right: 30px; top: 45px; } .slz-sub-header .btn-contact-toggle { background-color: transparent; border:none; border-radius: 50px; -webkit-border-radius: 50px; line-height: 1.5; font-weight: 400; font-size: 14px; padding: 6px 12px 6px 35px; height: auto; position: relative; color: #FFF; } .slz-sub-header .btn-contact-toggle:before{ font-family: 'Ionicons'; content: "\f423"; font-size: 24px; margin-right: 5px; display: inline-block; position: absolute; left: 10px; top: 5px; line-height: 1; } .slz-sub-header .btn-contact-toggle:hover{ } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top{ padding:40px 20px 0px; margin-bottom: 20px; position: relative; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top.inactive{ opacity: 0; } .slz-sub-header .contact .inner{ position: relative; height: calc(100% - 60px); padding-top: 60px; padding: 60px 30px 30px; overflow-y: auto; } .slz-sub-header .contact .inner::-webkit-scrollbar { width: 3px; } .slz-sub-header .contact .inner::-webkit-scrollbar-track { background-color: transparent; border-radius: 0px; } .slz-sub-header .contact .inner::-webkit-scrollbar-thumb { border-radius: 10px; background: rgba(255, 255, 255, 0.8); } .slz-sub-header .menu-body{ -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .slz-sub-header .menu-body.inactive{ opacity: 0; } .slz-close-contact { width: 22px; height: 22px; display: block; position: absolute; right: 20px; top: 20px; z-index: 30; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; } .slz-close-contact span { display: block; position: absolute; height: 1px; width: 100%; background-color: #FFF; border-radius: 0px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; } .slz-close-contact:hover span{ } .slz-close-contact span:nth-child(1) { top: 6px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; } .slz-close-contact span:nth-child(2) { top: 12px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; } .slz-close-contact span:nth-child(3) { top: 18px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; } .open .slz-close-contact span:nth-child(1) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); top: 3px; left: 3px; } .open .slz-close-contact span:nth-child(2) { width: 0%; opacity: 0; } .open .slz-close-contact span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); top: 18px; left: 3px; } header .slz-menu-icon{ position: relative; display: inline-block; width: 20px; margin-left: 15px; cursor: pointer; vertical-align: middle; z-index: 999; } header .slz-menu-icon span.line { position: relative; height: 1px; background-color: red; display: block; float: right; transition: width 0.3s ease; } header .slz-menu-icon span.line:nth-child(1) { width: 20px; margin-top: 0; } header .slz-menu-icon span.line:nth-child(2) { width: 15px; margin-top: 7px; } header .slz-menu-icon span.line:nth-child(3) { width: 10px; margin-top: 7px; } header .slz-menu-icon:hover span.line:nth-child(1) { width: 10px; } header .slz-menu-icon:hover span.line:nth-child(2) { width: 15px; } header .slz-menu-icon:hover span.line:nth-child(3) { width: 20px; } .slz-navbar-wrapper .slz-menu-wrapper { position: fixed; top: 0; right: -400px; bottom: 0; width: 400px; background: inherit; background-attachment: fixed; overflow: hidden; z-index: 999; transition: right 0.3s ease; } .slz-navbar-wrapper .slz-menu-wrapper .inner { height: 100%; position: relative; z-index: 10; overflow-y: auto; } .slz-navbar-wrapper .slz-menu-wrapper .inner::-webkit-scrollbar { width: 3px; } .slz-navbar-wrapper .slz-menu-wrapper .inner::-webkit-scrollbar-track { background-color: transparent; border-radius: 0px; } .slz-navbar-wrapper .slz-menu-wrapper .inner::-webkit-scrollbar-thumb { border-radius: 10px; background: rgba(255, 255, 255, 0.8); } .slz-navbar-wrapper .slz-menu-wrapper.open { right: 0; } .slz-navbar-wrapper .slz-menu-wrapper:before { content: ""; position: absolute; top: -20px; left: 0; width: 200%; height: 200%; background: inherit; background-attachment: fixed; -webkit-filter: blur(4px); filter: blur(4px); } .slz-navbar-wrapper .slz-menu-wrapper:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.9); } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading { position: relative; border-bottom: 1px solid rgba(255, 255, 255, 0.1); z-index: 1000; padding: 0px; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top { display: block; margin-bottom: 40px; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top:before { content: ""; display: table; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top:after { content: ""; display: table; clear: both; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top .slz-hambuger-menu { position: relative; display: inline-block; width: 20px; line-height: 40px; cursor: pointer; vertical-align: middle; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top .slz-hambuger-menu span.line { position: relative; height: 1px; background-color: #fff; display: block; transition: width 0.3s ease; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top .slz-hambuger-menu span.line:nth-child(1) { width: 20px; margin-top: 0; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top .slz-hambuger-menu span.line:nth-child(2) { width: 15px; margin-top: 7px; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top .slz-hambuger-menu span.line:nth-child(3) { width: 10px; margin-top: 7px; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top .slz-hambuger-menu:hover span.line:nth-child(1) { width: 10px; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top .slz-hambuger-menu:hover span.line:nth-child(2) { width: 15px; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top .slz-hambuger-menu:hover span.line:nth-child(3) { width: 20px; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top .slz-button-search-2 { line-height: inherit; display: inline-block; cursor: pointer; position: relative; margin-left: 15px; line-height: 40px; float: right; color: #fff; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; padding: 0px 10px; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top .slz-button-search-2:hover { color: #da0f32; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-top .slz-button-search-2 .icons { top: 0; padding: 0 7px; top: -5px; min-width: 27px; position: relative; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .app-post { display: table; width: 100%; overflow-x: hidden; position: relative; margin-bottom: 40px; padding: 0px 30px; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .app-post.inactive{ opacity: 0; } .app-post .block-title, .app-post .title, .app-post h2, .app-post h3, .app-post h4{ font-size: 18px!important; } .app-post *{ font-size: 14px!important; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .app-post .app-thumb { display: table-cell; width: 80px; padding: 0 20px 0 0; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .app-post .app-thumb img { width: 100%; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .app-post .app-info { position: relative; top: -4px; display: table-cell; width: auto; vertical-align: top; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .app-post .app-info .title { display: block; font-size: 18px; font-weight: 300; line-height: 1.3; color: #fff; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .app-post .app-info .author { font-size: 13px; font-weight: 400; color: #b4b4b4; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .app-post .app-info a.link { position: absolute; width: 100%; height: 100%; z-index: 3; left: 0; top: 0; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-bottom > a.btn-sign-in-up { color: #fff; padding: 0 40px; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-bottom > a.btn-sign-in-up:hover { color: #da0f32; } .slz-navbar-wrapper .slz-menu-wrapper .menu-heading .action-bottom > a.sign-up { padding: 0; } .slz-navbar-wrapper .slz-menu-wrapper .action-top { position: relative; } .slz-navbar-wrapper .slz-menu-wrapper .action-top .nav-search { position: relative; top: 0px; width: 100%; padding: 0; background-color: transparent; } .slz-navbar-wrapper .slz-menu-wrapper .action-top .nav-search:before { content: none; } .slz-navbar-wrapper .slz-menu-wrapper .action-top .nav-search form { border: none; } .slz-navbar-wrapper .slz-menu-wrapper .action-top .nav-search form input[type='text'], .slz-navbar-wrapper .slz-menu-wrapper .action-top .nav-search form input[type='search'] { width: 100%; padding-right: 40px; padding-left: 0px; color: #ffffff; background-color: transparent; border-color: transparent; border-bottom: 1px solid #c8c8c8; transition: all 0.4s ease; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; } .slz-navbar-wrapper .slz-menu-wrapper .action-top .nav-search form input[type='text']:focus, .slz-navbar-wrapper .slz-menu-wrapper .action-top .nav-search form input[type='search']:focus { border-bottom-color: #da0f32; } .slz-navbar-wrapper .slz-menu-wrapper .action-top .nav-search .btn-search-close { position: absolute; width: 40px; height: 40px; text-align: center; line-height: 40px; color: #c8c8c8; right: 0; top: 0; z-index: 5; cursor: pointer; } .slz-navbar-wrapper .slz-menu-wrapper .action-top .nav-search .btn-search-close:hover { color: #da0f32; } /*---------- 6.13 Menu mobile ------------*/ .slz-header-main.slz-unhidden-menu, .slz-header-table.slz-unhidden-menu { top: 0 !important; } .slz-hamburger-menu { display: none; position: absolute; left: 30px; top: 50%; padding: 10px 0; cursor: pointer; z-index: 101; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .slz-hamburger-menu .bar, .slz-hamburger-menu .bar:after, .slz-hamburger-menu .bar:before { width: 32px; height: 5px; } .slz-hamburger-menu .bar { position: relative; background-color: #da0f32; } .slz-hamburger-menu .bar.animate { background: rgba(255, 255, 255, 0) !important; } .slz-hamburger-menu .bar:before { content: ""; position: absolute; left: 0; bottom: 10px; background-color: #da0f32; transition: bottom 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1); transition: bottom 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms cubic-bezier(0.23, 1, 0.32, 1); transition: bottom 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1); } .slz-hamburger-menu .bar:after { content: ""; position: absolute; left: 0; top: 10px; background-color: #da0f32; transition: top 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1); transition: top 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms cubic-bezier(0.23, 1, 0.32, 1); transition: top 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1); } .slz-hamburger-menu .bar.animate:after { top: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); transition: top 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1); transition: top 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1); transition: top 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1); } .slz-hamburger-menu .bar.animate:before { bottom: 0; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); transition: bottom 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1); transition: bottom 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1); transition: bottom 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1); } .slz-main-menu-mobile { display: none; top: 100%; left: -100%; max-width: 480px; width: 100%; z-index: 101; position: absolute; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .slz-main-menu-mobile li { float: none; } .slz-main-menu-mobile.slz-open-menu-mobile { left: 0; } .slz-main-menu-mobile .slz-menu-wrapper { float: none; background-color: #da0f32; overflow: auto; margin: 0; height: calc(100vh - 110px); } .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 170px); } .slz-header-fixed .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 120px); } .slz-header-fixed .slz-main-menu-mobile .slz-menu-wrapper { height: calc(100vh - 60px); } .slz-main-menu-mobile .slz-menu-wrapper li { position: relative; width: 100%; list-style: none; cursor: pointer; border-top: 1px solid rgba(255, 255, 255, 0.05); } .slz-main-menu-mobile .slz-menu-wrapper li > a { line-height: 24px; display: inline-block; width: 100%; vertical-align: top; padding: 12px 20px; text-transform: uppercase; color: #ffffff; } .header-transparent .slz-header-fixed .slz-main-menu-mobile .slz-menu-wrapper > li > a { color: #ffffff; } .slz-main-menu-mobile .slz-menu-wrapper li > .icon-dropdown-mobile { line-height: 50px; position: absolute; z-index: 10; right: 0; width: 50px; height: 50px; color: #ffffff; text-align: center; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .slz-main-menu-mobile .slz-menu-wrapper li > a:hover, .slz-main-menu-mobile .slz-menu-wrapper li > a:focus { background-color: #da0f32; } .slz-main-menu-mobile .slz-menu-wrapper a .icons { float: left; width: 25px; line-height: 45px; text-align: left; } .slz-main-menu-mobile .slz-menu-wrapper .sub-menu { z-index: 1; overflow: hidden; width: 100%; max-height: 0; padding: 0; opacity: 0; background-color: rgba(255,255,255,0.1); transition: all 0.5s cubic-bezier(0.77, 0, 0.175, 1); } .slz-main-menu-mobile .slz-menu-wrapper .sub-menu li > a { padding-left: 40px; } .slz-main-menu-mobile .slz-menu-wrapper .sub-menu .mb-dropdown-open > a { background-color: #da0f32; } .slz-main-menu-mobile .slz-menu-wrapper .sub-menu .sub-menu li > a { padding-left: 60px; } .slz-main-menu-mobile .slz-menu-wrapper .mega-menu { z-index: 1; overflow: hidden; width: 100%; max-height: 0; padding: 0; opacity: 0; background-color: rgba(255,255,255,0.1); transition: all 0.5s cubic-bezier(0.77, 0, 0.175, 1); } .slz-main-menu-mobile .slz-menu-wrapper .mega-menu .mega-menu-row { display: block; overflow: auto; max-height: none; opacity: 1; } .slz-main-menu-mobile .slz-menu-wrapper .mega-menu .mega-menu-row .sub-menu { display: block; overflow: auto; max-height: none; opacity: 1; background-color: transparent; } .slz-main-menu-mobile .slz-menu-wrapper .mega-menu .mega-menu-row .sub-menu li a { text-transform: capitalize; padding-left: 20px; padding-right: 20px; } .slz-main-menu-mobile .slz-menu-wrapper .mega-menu .mega-menu-row .mega-menu-col { display: block; width: 100%; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .slz-main-menu-mobile .slz-menu-wrapper .mega-menu .mega-menu-row .mega-menu-col + .mega-menu-col { border-top: 1px solid rgba(255, 255, 255, 0.05); } .slz-main-menu-mobile .slz-menu-wrapper .mega-menu .mega-menu-row .mega-menu-col > a { color: #fff; border: none; padding-left: 20px; padding-right: 20px; } .slz-main-menu-mobile .slz-menu-wrapper .mega-menu .mega-menu-tablist { width: 100%; padding: 0; float: none; } .slz-main-menu-mobile .slz-menu-wrapper .mega-menu .mega-menu-tablist li.active .link, .slz-main-menu-mobile .slz-menu-wrapper .mega-menu .mega-menu-tablist li:hover .link { color: #fff; background-color: #da0f32; } .slz-main-menu-mobile .slz-menu-wrapper .mega-menu .mega-menu-tab-content { width: 100%; float: none; padding: 15px; color: #fff; } .slz-main-menu-mobile .slz-menu-wrapper .mb-dropdown-open > .sub-menu { opacity: 1; visibility: visible; max-height: 2000px; } .slz-main-menu-mobile .slz-menu-wrapper .mb-dropdown-open > .sub-menu .icon-dropdown-mobile { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); } .slz-main-menu-mobile .slz-menu-wrapper .mb-dropdown-open > .sub-menu > .mb-dropdown-open > .icon-dropdown-mobile { transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); } .slz-main-menu-mobile .slz-menu-wrapper .mb-dropdown-open .icon-dropdown-mobile { transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); } .slz-main-menu-mobile .slz-menu-wrapper .mb-dropdown-open > .mega-menu { opacity: 1; visibility: visible; max-height: 2000px; } .slz-sub-header .sub-menu .menu-item-has-children > a:after{ content: none; } .slz-main-menu-mobile .nav-search { position: relative; padding: 0; top: 0 !important; padding: 10px 15px; background-color: #da0f32; } .slz-main-menu-mobile .nav-search:before { content: none; } .slz-main-menu-mobile .nav-search .search-form { border: none; color: #fff; } .slz-main-menu-mobile .nav-search form input[type='text'], .slz-main-menu-mobile .nav-search form input[type='search'] { background-color: rgba(255,255,255,0.1); width: calc(100% - 40px); } .slz-main-menu-mobile .nav-search form .searchbutton, .slz-main-menu-mobile .nav-search form .search-submit { color: #fff; background-color: rgba(255,255,255,0.1); } .slz-main-menu-mobile .slz-menu-wrapper li.slz-megamenu-desc-col { background-color: #fff; padding: 15px; } /*---------- 6.14 Menu mobile with topbar ----------*/ .slz-header-mobile-topbar .slz-mobile-topbar { background-color: #da0f32; padding: 10px 15px; position: relative; } .slz-header-mobile-topbar .slz-mobile-topbar:before { position: absolute; content: ''; left: 0; bottom: 0; width: 100%; height: 1px; background-color: rgba(255, 255, 255, 0.05); } .slz-header-mobile-topbar .slz-mobile-topbar .slz-topbar-list { font-size: 0; } .slz-header-mobile-topbar .slz-mobile-topbar .social { display: inline-block; vertical-align: top; line-height: 40px; font-size: 14px; } .slz-header-mobile-topbar .slz-mobile-topbar .social + .slz-btn { margin-left: 10px; } .slz-header-mobile-topbar .slz-mobile-topbar .slz-btn { border-color: #fff; background-color: #fff; color: #da0f32; font-size: 0; margin-bottom: 0; padding: 0 14px; position: relative; } .slz-header-mobile-topbar .slz-mobile-topbar .slz-btn:before { position: absolute; content: '\f0e0'; font-family: 'FontAwesome'; font-size: 20px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .slz-header-mobile-topbar .slz-mobile-topbar .woo-account-wrapper .slz-btn:before { content: '\f007'; } .slz-header-mobile-topbar .slz-mobile-topbar .woo-account-wrapper .dropdown-menu { left: auto; width: 125px; } .slz-header-mobile-topbar .slz-main-menu-mobile .slz-menu-wrapper { height: calc(100vh - 110px); } .slz-header-mobile-topbar .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 170px); } .slz-header-mobile-topbar .slz-header-fixed .slz-main-menu-mobile .slz-menu-wrapper { height: calc(100vh - 60px); } .slz-header-mobile-topbar .slz-header-fixed .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 120px); } /*---------- 6.15 Header center splitted ----------*/ .slz-header-center.slz-header-left-right .slz-main-menu { font-size: 0; } .slz-header-center.slz-header-left-right .slz-logo-wrapper { display: inline-block; vertical-align: top; max-width: 200px; min-width: 130px; padding: 0; height: 100px; } .slz-header-center.slz-header-left-right .slz-logo-wrapper .logo { min-width: 0; line-height: 1.4; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .slz-header-center.slz-header-left-right .slz-menu-wrapper { width: calc(50% - 100px); font-size: 14px; } .slz-header-center.slz-header-left-right .slz-menu-wrapper > li { float: right; } .slz-header-center.slz-header-left-right .slz-logo-wrapper + .slz-menu-wrapper > li { float: left; } .slz-header-center.slz-header-left-right .slz-menu-wrapper > li > a { line-height: 100px; } .slz-header-center.slz-header-left-right .slz-menu-wrapper > li:last-child > a { padding-right: 25px; } .slz-header-center.slz-header-left-right .slz-button-search { line-height: 100px; float: none; font-size: 14px; } .slz-header-center.slz-header-left-right .nav-search { top: 115px; right: -5px; } .slz-header-center.slz-header-left-right .slz-mobile-logo { display: none; } .slz-header-center.slz-header-left-right .slz-header-fixed .slz-main-menu { text-align: center; } .slz-header-center.slz-header-left-right .slz-header-fixed .slz-logo-wrapper { float: none; height: 60px; position: relative; } .slz-header-center.slz-header-left-right .slz-header-fixed .slz-menu-wrapper > li > a { line-height: 60px; } .slz-header-center.slz-header-left-right .slz-header-fixed .slz-button-search { line-height: 60px; } .slz-header-center.slz-header-left-right .slz-header-fixed .nav-search { top: 75px; } .slz-header-center.slz-header-left-right .slz-main-menu-mobile .slz-mobile-logo { display: block; } .slz-header-center.slz-header-left-right .slz-main-menu-mobile .menu-to-join { display: none; } .slz-header-center.slz-header-left-right .slz-main-menu-mobile .slz-menu-wrapper { width: 100%; height: calc(100vh - 120px); } .slz-header-center.slz-header-left-right .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 180px); } .slz-header-center.slz-header-left-right .slz-main-menu-mobile .slz-menu-wrapper > li > a { line-height: 24px; } .slz-header-center.slz-header-left-right .slz-main-menu-mobile .nav-search { right: 0; } .slz-header-center.slz-header-left-right .slz-header-fixed .slz-main-menu-mobile .slz-menu-wrapper { height: calc(100vh - 60px); } .slz-header-center.slz-header-left-right .slz-header-fixed .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 120px); } /*---------- 6.16 Header Box ----------*/ header:before { content: ""; display: table; } header:after{ content: ""; display: table; clear: both; } .slz-header-box .slz-header-main { background-color: transparent; box-shadow: none; -webkit-box-shadow: none; } .slz-header-box .slz-header-main .container { z-index: 10; } .slz-header-box .slz-header-main .container:before { content: ""; display: block; position: absolute; width: calc(100% - 30px); left: 15px; top: 0; height: 100%; z-index: -1; background-color: #6EB804; } .slz-header-box .slz-header-main.slz-header-fixed .container:before { box-shadow: 1px 2px 7px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 2px 7px rgba(0, 0, 0, 0.1); } .slz-header-box .slz-header-main .slz-logo-wrapper { margin-left: 50px; } .slz-header-box .slz-header-main .float-r.slz-logo-wrapper { margin-left: 0px; margin-right: 50px; } .slz-header-box { position: relative; padding-bottom: 40px; background-color: #FFFFFF; } .slz-header-box .slz-header-main:not(.slz-header-fixed) { position: absolute; bottom: -40px; width: 100%; top: auto; left: 0; right: 0; } .slz-header-box .slz-header-main .float-l .slz-button-search, .slz-header-box .slz-header-main .float-r .slz-button-search{ min-width: 90px; text-align: center; background-color: #2C2C2C; color: #FFFFFF; } .slz-header-box .slz-button-search:hover .icons { color: #6EB804; } .slz-header-box .nav-search { right: 15px; } .slz-header-box .nav-search:before { right: 38px; } .slz-header-box .slz-header-main .float-l .nav-search { left: 15px; } .slz-header-box .slz-header-main .float-l .nav-search:before { left: 36px; } .slz-header-box.header-transparent { background-color: transparent; margin-top: 40px; } .slz-header-box.header-transparent .slz-header-topbar { border-bottom: none; color:#F5F5F5; } .slz-header-box.header-transparent .slz-header-topbar .container{ position: relative; z-index: 1; } .slz-header-box.header-transparent .slz-header-topbar .container:before{ display: block; width: calc(100% - 30px); height: 100%; left: 15px; top: 0; position: absolute; background-color: #2C2C2C; } .slz-header-box.header-transparent .slz-topbar-list { padding-left: 40px; padding-right: 40px; } .slz-header-box.header-transparent .slz-header-main .container:before{ background-color: #FFFFFF; } .slz-header-box.header-transparent .slz-menu-wrapper > li > a { color: #2C2C2C; } .slz-header-box.header-transparent .slz-menu-wrapper > li > a:before{ background-color: #6EB804; } .slz-header-box.header-transparent .slz-header-main .float-l .slz-button-search, .slz-header-box.header-transparent .slz-header-main .float-r .slz-button-search{ background-color: transparent; } .slz-header-box.header-transparent .slz-button-search .icons { color: #2C2C2C; } .slz-header-box.header-transparent .slz-menu-wrapper > li:hover > a , .slz-header-box.header-transparent .slz-button-search:hover .icons { color: #6EB804; } .slz-header-box.header-transparent .slz-header-main.slz-header-fixed { background-color: transparent; box-shadow: none; -webkit-box-shadow: none; } .slz-header-box.header-transparent .slz-header-main.slz-header-fixed .container:before { background-color: #6EB804; box-shadow: 1px 2px 7px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 2px 7px rgba(0, 0, 0, 0.1); } .slz-header-box.header-transparent .slz-header-main.slz-header-fixed .slz-menu-wrapper > li > a, .slz-header-box.header-transparent .slz-header-main.slz-header-fixed .slz-button-search .icons { color: #FFFFFF; } .slz-header-box.header-transparent .slz-header-main.slz-header-fixed .slz-menu-wrapper > li:hover > a, .slz-header-box.header-transparent .slz-header-main.slz-header-fixed .slz-button-search:hover .icons { color: #2C2C2C; } .slz-header-box.header-transparent .slz-header-main.slz-header-fixed .slz-menu-wrapper > li > a:before { background-color: #2C2C2C; } /*========= End of Header ================*/ /*============================================ = 7. FOOTER = ============================================*/ /*---------- 7.1 Footer Default ---------*/ .slz-footer-main { padding: 100px 0; background-color: #fff; } .slz-dark .slz-footer-main { background-color: #091b27; } .slz-footer-main .slz-logo { margin: 0 auto; font-size: 40px; font-weight: 700; margin-bottom: 40px; text-align: center; color: #fff; text-transform: uppercase; } .slz-footer-main .slz-logo > span { color: #337ab7; } .slz-footer-main .slz-name { text-align: center; margin: 20px 0 0 0; } .slz-footer-bottom .container{ position: relative; } .slz-footer-bottom .container:before{ content: ""; position: absolute; left: 0; top: -30px; width: 100%; height: 1px; background-color: transparent; } /*---------- 7.2 Footer wrapper ---------*/ .slz-wrapper-footer { position: relative; } .slz-wrapper-footer.bg-image .slz-footer-main, .slz-wrapper-footer.bg-image .slz-footer-bottom { background-color: transparent; } .slz-wrapper-footer.bg-image .slz-footer-bottom:before { position: absolute; content: ""; height: 1px; width: 100%; max-width: 1170px; background-color: rgba(255, 255, 255, 0.3); top: 0; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); } .bg-dark .slz-footer-main { background-color: #091b27; } .bg-dark .slz-footer-bottom, .bg-dark .slz-footer-top { background-color: #071621; } .slz-dark .slz-name { color: rgba(255, 255, 255, 0.7); } .slz-dark .footer-center .social a { background-color: rgba(255, 255, 255, 0.1); } .slz-dark .navbar-footer a { color: rgba(255, 255, 255, 0.7); } .slz-dark .navbar-footer a:hover { color: #fff; } .slz-dark .footer-center .slz-logo { color: #fff; } .slz-dark .footer-center .social a { color: #fff; } .slz-dark .footer-center .social a:hover { color: #337ab7; } /*---------- 7.3 Footer main ------------*/ .slz-footer-main .slz-widget { margin-top: 0; } .footer-center { text-align: center; } .footer-center .slz-logo { margin: 0 auto; margin-bottom: 40px; } .footer-center .social { margin: 20px 0 0 0; } .footer-center .social a { width: 40px; height: 40px; line-height: 40px; margin: 0 8px; text-align: center; border-radius: 50%; color: #666c72; background-color: rgba(0, 0, 0, 0.1); display: inline-block; vertical-align: top; } .footer-center .social a:hover { color: #337ab7; } .footer-center .slz-name { margin: 20px 0 0 0; } /*---------- 7.4 Footer Bottom ----------*/ .slz-footer-bottom { position: relative; background-color: #e6e6e6; } .slz-footer-bottom .slz-logo, .slz-footer-bottom .navbar-footer a { line-height: 80px; } .slz-footer-bottom .slz-logo { max-width: 130px; max-height: 50px; margin: 15px 0; } .slz-footer-bottom { padding: 30px 0; position: relative; background-color: #e6e6e6; } .navbar-footer { margin: 0 !important; padding: 0; } .navbar-footer li { list-style: none; display: inline-block; vertical-align: top; margin: 0 15px; } .navbar-footer li:first-child { margin-left: 0; } .navbar-footer li:last-child { margin-right: 0; } .navbar-footer a { color: #666c72; text-transform: capitalize; } .navbar-footer a:hover { color: #337ab7; } .slz-footer-bottom .social a { display: inline-block; vertical-align: top; margin: 0 12px; font-size: 14px; color: rgba(255, 255, 255, 0.7); } .slz-footer-bottom .social a:hover { color: #db0f31; } .slz-footer-bottom .social a:first-child { margin-left: 0; } .slz-footer-bottom .social a:last-child { margin-right: 0; } /*---------- 7.5 Footer custom ----------*/ .slz-footer-bottom .item-wrapper { display: table-cell; width: 1%; text-align: center; vertical-align: top; } .slz-footer-bottom .item-wrapper .item:not(:last-child ){ margin-bottom: 10px; } .slz-footer-bottom .item-wrapper:first-child { text-align: left; } .slz-footer-bottom .item-wrapper:last-child { text-align: right; } .slz-footer-bottom .item-wrapper:only-child { text-align: center; } .slz-footer-bottom .item-wrapper:only-child img { margin-left: auto; margin-right: auto; } /*---------- 7.6 Footer Top -------------*/ .slz-wrapper-footer .text-c .slz-widget .widget-title, .slz-wrapper-footer .text-c .slz-widget .title-widget { text-align: center; } .slz-wrapper-footer .text-l .slz-widget .widget-title, .slz-wrapper-footer .text-l .slz-widget .title-widget { text-align: left; } .slz-wrapper-footer .text-r .slz-widget .widget-title, .slz-wrapper-footer .text-r .slz-widget .title-widget { text-align: right; } .slz-wrapper-footer .text-c .slz-widget-contact-info .item { margin-left: auto; margin-right: auto; } .slz-wrapper-footer .text-r .slz-widget-contact-info .item { margin-left: auto; margin-right: 0; } .slz-wrapper-footer .text-c .slz-widget-about-us .slz-logo { left: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } /*========= End of Footer ================*/ /*============================================ = 8. BLOG DETAIL = ============================================*/ /*---------- 8.1. Blog Detail General ------------*/ .slz-blog-detail.slz-sidebar-left .slz-content-column { float: right; } .slz-blog-detail.slz-no-sidebar .slz-content-column { width: 100%; } .slz-blog-detail.slz-no-sidebar .slz-sidebar-column { display: none; } .slz-blog-detail > .title, .slz-blog-detail .blog-detail-wrapper > .title { font-weight: 700; line-height: 1.4; color: #213047; text-transform: uppercase; margin: 0; display: inline-block; font-family: inherit; } .slz-blog-detail .blog-detail-wrapper .block-info { padding: 0; } .blog-detail-wrapper .audio-wrapper { position: absolute; z-index: 10; bottom: 0; left: 0; padding: 10px; width: 100%; background-color: rgba(0, 0, 0, 0.5); } .blog-detail-wrapper .block-image.has-quote .link:after { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .blog-detail-wrapper .audio-wrapper .mejs-container { width: 100% !important; background: transparent; } .blog-detail-wrapper .mejs-container .mejs-controls { background: none; } .slz-blog-detail .slz-sidebar-column .slz-widget:first-child, .slz-blog-detail .slz-sidebar-column > div:first-child { margin-top: 0px; } .slz-post-single .entry-content p, .slz-post-single .entry-content img, .slz-post-single .entry-content ul, .slz-post-single .entry-content blockquote { margin-bottom: 25px; } .slz-post-single .entry-content p:last-child, .slz-post-single .entry-content img:last-child, .slz-post-single .entry-content ul:last-child, .slz-post-single .entry-content blockquote:last-child { margin-bottom: 0; } /*---------- 8.2. Blog Detail Related Post ----------*/ .slz-blog-detail .slz-blog-author + .slz-related-post { margin-top: 40px; } .slz-blog-detail .slz-related-post { padding-bottom: 40px; margin-left: 0; margin-right: 0; } .slz-blog-detail .slz-related-post .slz-carousel { margin-left: -15px; margin-right: -15px; } .slz-blog-detail .slz-related-post [class*="slz-block-item"] { font-size: 14px; box-shadow: none; } .slz-blog-detail .slz-related-post [class*="slz-block-item"] .block-info { font-size: 12px; } .slz-blog-detail .slz-related-post .related-title { margin-top: 0px; margin-bottom: 20px; font-size: 18px; font-weight: 700; text-transform: capitalize; } .slz-blog-detail .slz-related-post .slick-arrow { top: auto; bottom: 0; opacity: 1; font-size: 14px; visibility: visible; border-radius: 0px; -webkit-border-radius: 0px; } .slz-blog-detail .slz-related-post .btn-prev, .slz-blog-detail .slz-related-post:hover .btn-prev { left: calc(50% - 15px); transform: translate(-100%, 0); -ms-transform: translate(-100%, 0); -webkit-transform: translate(-100%, 0); } .slz-blog-detail .slz-related-post .btn-next, .slz-blog-detail .slz-related-post:hover .btn-next { right: calc(50% - 15px); transform: translate(100%, 0); -ms-transform: translate(100%, 0); -webkit-transform: translate(100%, 0); } .slz-blog-detail .slz-related-post .slick-arrow i + span, .slz-blog-detail .slz-related-post .slick-arrow span + i { margin-left: 5px; } /*---------- 8.3. Blog Detail Author ------------*/ .slz-blog-author { text-align: left; border: 1px solid #ececec; padding: 15px; } .slz-blog-author .media-left { width: 100px; padding: 0; vertical-align: middle; position: relative; z-index: 2; } .slz-blog-author .media-left .media-image { display: block; } .slz-blog-author .media-left .media-image img { width: 100%; } .slz-blog-author .media-right { padding: 0 0 0 15px; text-align: left; position: relative; } .slz-blog-author .media-right .author { font-size: 18px; color: #555; font-weight: 500; width: auto; float: none; margin-right: 0; } .slz-blog-author .media-right .des { margin-bottom: 0; margin-top: 10px; } .slz-blog-author .media-right .des + .social a { margin-top: 10px; } /*---------- 8.4. Blog Detail Tag Links --------------*/ .tags-links a:first-child { margin-left: 0px; } .tags-links .tags-title { display: none; } /*---------- 8.5. Blog Detail Block Comment -----------*/ .slz-blog-comments .comment-title { margin-top: 0; margin-bottom: 10px; font-size: 18px; font-weight: 700; text-transform: capitalize; } .blog-comment { margin-top: 80px; } .blog-comment .comment-list { margin: 0; padding: 0; } .blog-comment .comment-list > li:not(:first-child) { margin-top: 20px; padding-top: 20px; border-top: 2px solid #f1f6fd; } .blog-comment .comment-list .children { margin-left: 70px; list-style: none; padding: 0; } .blog-comment .comment-list .children > li { margin-top: 20px; padding-top: 20px; border-top: 2px solid #f1f6fd; } .comment-item { font-size: 14px; } .comment-item .comment-left { width: 55px; padding: 0; float: left; } .comment-item .comment-left .media-image { display: block; } .comment-item .comment-left .media-image img { width: 100%; } .comment-item .comment-right { padding-left: 70px; } .comment-item .meta { margin-bottom: 15px; } .comment-item p:last-child { margin-bottom: 0; } .comment-respond > .title { color: #213047; text-transform: uppercase; font-weight: 700; margin: 0 0 25px 0; } .comment-respond .main-form input { box-shadow: none; -webkit-box-shadow: none; border-radius: 0px; } .comment-respond .main-form input + input { margin-top: 15px; } .comment-respond .main-form input + textarea { margin-top: 15px; } .comment-respond .main-form textarea { border-radius: 0px; box-shadow: none; -webkit-box-shadow: none; } .comment-respond .main-form + button, .comment-respond .main-form + input[type="submit"] { margin-top: 15px; } .stars-rating .review:after { content: "\f005\f005\f005\f005\f005"; top: 0; position: absolute; left: 0; font-family: FontAwesome; color: #dadada; float: left; overflow: hidden; text-indent: 0; } .comment-form-rating { margin: 0 -15px; } .comment-form-rating .stars a, .stars-rating .review { width: 2em; position: relative; display: inline-block; text-indent: -999px; margin-right: 1em; border-right: 1px solid #EEE; } .stars-rating .review { border-right: none; margin-right: 0; } .comment-form-rating .stars a:before, .stars-rating .review:before { content: "\f006"; top: 0; position: absolute; left: 0; font-family: FontAwesome; color: #f9d116; float: left; overflow: hidden; text-indent: 0; z-index: 5; } .comment-form-rating .stars a.star-2, .stars-rating .review { width: 3em; } .comment-form-rating .stars a.star-3, .stars-rating .review.star-3 { width: 4em; } .comment-form-rating .stars a.star-4, .stars-rating .review.star-4 { width: 5em; } .comment-form-rating .stars a.star-5, .stars-rating .review.star-5 { width: 6em; border-right: none; margin-right: 0; } .comment-form-rating .stars a.star-2:before { content: "\f006\f006"; } .comment-form-rating .stars a.star-3:before { content: "\f006\f006\f006"; } .comment-form-rating .stars a.star-4:before { content: "\f006\f006\f006\f006"; } .comment-form-rating .stars a.star-5:before { content: "\f006\f006\f006\f006\f006"; } .comment-form-rating .stars a.star-1.active:before, .comment-form-rating .stars a.star-1:hover:before, .stars-rating .review.star-1:before { content: "\f005"; } .comment-form-rating .stars a.star-2.active:before, .comment-form-rating .stars a.star-2:hover:before, .stars-rating .review.star-2:before { content: "\f005\f005"; } .comment-form-rating .stars a.star-3.active:before, .comment-form-rating .stars a.star-3:hover:before, .stars-rating .review.star-3:before { content: "\f005\f005\f005"; } .comment-form-rating .stars a.star-4.active:before, .comment-form-rating .stars a.star-4:hover:before, .stars-rating .review.star-4:before { content: "\f005\f005\f005\f005"; } .comment-form-rating .stars a.star-5.active:before, .comment-form-rating .stars a.star-5:hover:before, .stars-rating .review.star-5:before { content: "\f005\f005\f005\f005\f005"; } /*---------- 8.6. Blog Detail Recent Post ------------*/ .recent-post-inner .media { padding: 15px 0; border-top: 1px solid #f2f2f2; margin-top: 0; } .recent-post-inner .media:first-child { padding-top: 0 !important; border-top: none; } .recent-post-inner .media:last-child { padding-bottom: 0 !important; } .recent-post-inner .media:hover .meta .icons { color: #337ab7; } .recent-post-inner .media:hover .wrapper-image:after { opacity: 1; visibility: visible; } .recent-post-inner .media.style-2 { padding: 20px 0; } .recent-post-inner .media.style-2 .media-left { padding-right: 10px; } .recent-post-inner .media.style-2 .meta { margin-bottom: 12px; } .recent-post-inner .media.style-2 .wrapper-image { width: 60px; } .recent-post-inner .media.style-2 .media-heading { font-size: 14px; } .recent-post-inner .media.style-3 .wrapper-image { width: 100px; } .recent-post-inner .media.style-3 .wrapper-image:before { padding-top: 70%; } .recent-post-inner .media.style-3 .meta { margin: 0; } .recent-post-inner .media.style-3 .meta-info { margin: 0 7px; } .recent-post-inner .media.style-3 .meta-info:first-child { margin-left: 0; } .recent-post-inner .media.style-3 .meta-info .link { padding-left: 3px; } .recent-post-inner .media.style-3 .meta-info + .meta-info { position: relative; } .recent-post-inner .media.style-3 .meta-info + .meta-info:before { position: absolute; content: '|'; top: 0; left: -9px; } .recent-post-inner .media-left { padding-right: 15px; } .recent-post-inner .media-right { padding-left: 0; } .recent-post-inner .wrapper-image { position: relative; width: 85px; display: block; overflow: hidden; } .recent-post-inner .wrapper-image:before { content: ""; display: block; padding-top: 100%; } .recent-post-inner .wrapper-image:after { position: absolute; content: ""; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; visibility: hidden; background-color: rgba(0, 0, 0, 0.4); transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .recent-post-inner .wrapper-image img { height: 100%; width: auto; max-width: none; position: absolute; top: 0; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); } .recent-post-inner .meta { margin-bottom: 8px; } .recent-post-inner .media-heading { font-size: 15px; color: #213047; display: block; text-transform: capitalize; } /*---------- 8.7. Blog Detail Share Link -------------*/ .slz-social-share { } .slz-social-share .title { margin-right: 15px; display: inline-block; vertical-align: top; } .slz-social-share .social { display: inline-block; vertical-align: top; } .slz-post-footer .meta-content { display: table; width: 100%; } .slz-post-footer .meta-content:before { content: ""; display: table; } .slz-post-footer .meta-content:after { content: ""; display: table; clear: both; } .slz-post-footer .meta-content .tags-links { display: inline-block; float: left; } /*---------- 8.8. Blog Detail Layout 1 ----------*/ .slz-blog-detail.layout-1 .blog-detail-wrapper .block-info { margin-top: 15px; } .slz-blog-detail.layout-1 .blog-detail-wrapper .block-info + .block-image { margin-top: 15px; } .slz-blog-detail.layout-1 .blog-detail-wrapper .title + .block-image { margin-top: 25px; } .slz-blog-detail.layout-1 .blog-detail-wrapper .block-image:before { padding-top: 50%; } .slz-blog-detail.layout-1 .block-image .img-full { width: 100%; height: auto; } .slz-blog-detail.layout-1 .blog-detail-wrapper .entry-content { margin-top: 25px; } /*---------- 8.9. Blog Detail Layout 2 ----------*/ .slz-blog-detail.layout-2 .blog-detail-wrapper .block-info { margin-top: 15px; } .slz-blog-detail.layout-2 .blog-detail-wrapper .block-info + .entry-content { margin-top: 15px; } .slz-blog-detail.layout-2 .blog-detail-wrapper .title + .entry-content { margin-top: 25px; } /*---------- 8.10. Blog Detail Layout 3 ----------*/ .slz-blog-detail.layout-3 > .block-image:before { padding-top: 50%; } .slz-blog-detail.layout-3 .block-image .img-full { width: 100%; height: auto; } .slz-blog-detail.layout-3 .row { margin-top: 30px; } .slz-blog-detail.layout-3 .blog-detail-wrapper .block-info { margin-top: 15px; } .slz-blog-detail.layout-3 .blog-detail-wrapper .block-info + .entry-content { margin-top: 15px; } .slz-blog-detail.layout-3 .blog-detail-wrapper .title + .entry-content { margin-top: 25px; } /*---------- 8.11. Blog Detail Layout 4 ----------*/ .slz-blog-detail.layout-4 > .block-image:before { padding-top: 50%; } .slz-blog-detail.layout-4 .block-image .img-full { width: 100%; height: auto; } .slz-blog-detail.layout-4 .title { margin-top: 25px; text-transform: capitalize; } .slz-blog-detail.layout-4 .block-info { margin-top: 15px; } .slz-blog-detail.layout-4 .row { margin-top: 30px; } /*---------- 8.12. Blog Detail Layout 5 ----------*/ .slz-blog-detail.layout-5 .blog-detail-wrapper > .block-image:before { padding-top: 50%; } .slz-blog-detail.layout-5 .block-image .img-full { width: 100%; height: auto; } .slz-blog-detail.layout-5 .blog-detail-wrapper .title { margin-top: 15px; } .slz-blog-detail.layout-5 .block-info { margin-top: 15px; } .slz-blog-detail.layout-5 .block-info + .entry-content { margin-top: 15px; } .slz-blog-detail.layout-5 .title + .entry-content { margin-top: 25px; } /*========= End of Blog detail ===========*/ /*============================================ = RESBONSIVE = ============================================*/ /*---------- min-width 1600px ----------*/ @media screen and (min-width: 1600px) {} /*---------- min-width 1025px ----------*/ @media screen and (min-width: 1025px) { /*---------- Header ----------*/ .menu-item-has-children:hover > .sub-menu, .menu-item-has-mega-menu:hover > .mega-menu { opacity: 1; z-index: 105; visibility: visible; transition-delay: 0.3s; -webkit-transition-delay: 0.3s; pointer-events: auto; } .slz-main-menu .menu-item-has-mega-menu:hover .sub-menu { opacity: 1; visibility: visible; } } /*---------- max-width 1024px ----------*/ @media screen and (max-width: 1024px) { .slz-wrapper-content .slz_col-md-12{ width: 100%; float: none; } .slz-wrapper-content .slz_bg-parallax { background-attachment: scroll; } /*---------- Header ----------*/ .slz-hamburger-menu, .slz-main-menu-mobile { display: block; } .slz-header-main { position: relative; } .slz-header-fixed { position: fixed; } .slz-header-main .container { position: initial; } .slz-header-main .slz-logo-wrapper, .slz-header-main .slz-logo-wrapper.float-l { position: relative; left: 50%; float: none; display: inline-block; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); } .slz-main-menu, .slz-header-center .slz-main-menu { display: none; } .nav-search{ box-shadow: none; -webkit-box-shadow: none; } .slz-logo-wrapper .logo { height: 70px; line-height: 70px; } .slz-logo-wrapper .logo img { max-height: 60px; } .icon-dropdown { display: none !important; } .slz-header-with-banner .slz-banner-mobile { display: block; } .slz-header-with-banner .slz-header-main .slz-banner-01 { display: none; } .slz-header-with-banner .slz-header-main .slz-header-middle-wrapper { position: relative; width: 100%; } .slz-header-table .slz-header-table-cell-2 { display: none; } .slz-header-table .slz-logo-wrapper .logo { min-height: 70px; line-height: 70px; position: relative; } .slz-header-table.slz-header-fixed .slz-logo-wrapper .logo { min-height: 60px; line-height: 60px; } .slz-header-table .slz-logo-wrapper .logo img { } .slz-header-table .slz-main-menu-mobile { text-align: left; } .slz-main-menu-mobile .slz-menu-wrapper li > .icon-dropdown-mobile { display: none; } .slz-main-menu-mobile .slz-menu-wrapper li.menu-item-has-children > .icon-dropdown-mobile, .slz-main-menu-mobile .slz-menu-wrapper li.menu-item-has-mega-menu > .icon-dropdown-mobile { display: inline-block; } .slz-main-menu-mobile .slz-menu-wrapper li .mega-menu .menu-item .icon-dropdown-mobile { display: none; } .slz-main-menu-mobile .slz-mobile-topbar { display: none; } .slz-header-center .slz-logo-wrapper { padding: 0; height: 70px; line-height: 70px; } .slz-header-center .slz-logo-wrapper .logo { line-height: inherit; } .slz-header-center .slz-header-fixed .slz-logo-wrapper { position: relative; float: none; height: 60px; line-height: 60px; } .slz-header-with-banner .slz-banner-mobile { display: none; } .slz-header-main.slz-header-table .slz-logo-wrapper { left: auto; -webkit-transform: none; -ms-transform: none; -o-transform: none; transform: none; } .slz-header-table .slz-main-menu-mobile .slz-mobile-topbar { display: block; } .slz-header-table.slz-header-mobile-topbar .slz-main-menu-mobile .slz-mobile-topbar + .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 190px); } .slz-header-table.slz-header-mobile-topbar .slz-main-menu-mobile .slz-mobile-topbar + .slz-menu-wrapper, .slz-header-table.slz-header-mobile-topbar .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 130px); } .slz-header-table.slz-header-mobile-topbar .slz-main-menu-mobile .slz-menu-wrapper { height: calc(100vh - 70px); } .slz-header-table.slz-header-mobile-topbar.slz-header-fixed .slz-main-menu-mobile .slz-mobile-topbar + .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 180px); } .slz-header-table.slz-header-mobile-topbar.slz-header-fixed .slz-main-menu-mobile .slz-mobile-topbar + .slz-menu-wrapper, .slz-header-table.slz-header-mobile-topbar.slz-header-fixed .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 120px); } .slz-header-table.slz-header-mobile-topbar.slz-header-fixed .slz-main-menu-mobile .slz-menu-wrapper { height: calc(100vh - 60px); } .slz-header-center.slz-header-left-right .slz-mobile-logo { display: block; } .slz-header-center.slz-header-left-right .slz-logo-wrapper { height: 70px; } .slz-header-box .slz-header-main:not(.slz-header-fixed) { position: relative; bottom: auto; } .slz-header-box .nav-search { right: 0px; } .slz-header-box { padding-bottom: 0px; margin-bottom: -40px; } .slz-header-box .slz-header-main .slz-logo-wrapper { margin-left: 0px; } } /*---------- max-width 768px -----------*/ @media screen and (max-width: 768px) { .slz-footer-main { font-size: 0; } .slz-footer-main .slz-widget { font-size: 14px; } .slz-footer-main .col-md-3.col-sm-6 { display: inline-block; vertical-align: top; float: none; margin-top: 60px; width: 50%; } .slz-footer-main .col-md-3.col-sm-6:nth-child(-n + 2) { margin-top: 0; } .slz-wrapper-content .slz_col-sm-12{ width: 100%; float: none; } /*---------- Header ----------*/ .slz-header-main.slz-header-fixed.slz-wpadminbar { top: 46px; } .slz-header-topbar .slz-topbar-list.float-r .slz-btn { font-size: 0; min-width: 0; padding: 0 9px; margin-left: 15px; } .slz-header-topbar .slz-topbar-list.float-r .slz-btn:before { all: initial; content: '\f0e0'; font-family: 'FontAwesome'; font-size: 20px; color: #fff; line-height: 40px; text-align: center; display: block; min-width: 20px; } .slz-header-topbar .woo-account-wrapper { margin-left: 0; } .slz-header-topbar .woo-account-wrapper ul.dropdown-menu { left: auto; right: 0; width: 100px; text-align: center; } .slz-header-topbar .slz-topbar-list.float-r .woo-account-wrapper .slz-btn:before { content: '\f007'; } } /*---------- max-width 767px -----------*/ @media screen and (max-width: 767px) { /*---------- Header ----------*/ .slz-logo-wrapper .logo { height: 60px; line-height: 60px; min-width: 130px; } .slz-hamburger-menu { left: 15px; } .slz-header-with-banner .slz-banner-mobile img { width: 100%; } .slz-header-mobile-topbar .slz-header-topbar { display: none; } .slz-mobile-topbar .navbar-topbar { display: none; } .slz-header-mobile-topbar .slz-main-menu-mobile .slz-mobile-topbar { display: block; } .slz-main-menu-mobile .slz-menu-wrapper { height: calc(100vh - 100px); } .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 160px); } .slz-header-mobile-topbar .slz-main-menu-mobile .slz-menu-wrapper, .slz-header-mobile-topbar .slz-header-fixed .slz-main-menu-mobile .slz-menu-wrapper { height: calc(100vh - 60px); } .slz-header-mobile-topbar .slz-main-menu-mobile .slz-mobile-topbar + .slz-menu-wrapper, .slz-header-mobile-topbar .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper, .slz-header-mobile-topbar .slz-header-fixed .slz-main-menu-mobile .slz-mobile-topbar + .slz-menu-wrapper, .slz-header-mobile-topbar .slz-header-fixed .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 120px); } .slz-header-mobile-topbar .slz-main-menu-mobile .slz-mobile-topbar + .nav-wrapper + .slz-menu-wrapper, .slz-header-mobile-topbar .slz-header-fixed .slz-main-menu-mobile .slz-mobile-topbar + .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 180px); } .slz-header-center .slz-logo-wrapper { height: 60px; line-height: 60px; } .slz-header-center.slz-header-left-right .slz-logo-wrapper { height: 60px; } .slz-header-table.slz-header-mobile-topbar .slz-main-menu-mobile .slz-mobile-topbar + .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 180px); } .slz-header-table.slz-header-mobile-topbar .slz-main-menu-mobile .slz-mobile-topbar + .slz-menu-wrapper, .slz-header-table.slz-header-mobile-topbar .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 120px); } .slz-header-table.slz-header-mobile-topbar .slz-main-menu-mobile .slz-menu-wrapper { height: calc(100vh - 60px); } .slz-header-center.slz-header-left-right .slz-main-menu-mobile .slz-menu-wrapper { height: calc(100vh - 110px); } .slz-header-center.slz-header-left-right .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 170px); } .slz-header-center.slz-header-left-right.slz-header-mobile-topbar .slz-main-menu-mobile .slz-menu-wrapper { height: calc(100vh - 60px); } .slz-header-center.slz-header-left-right.slz-header-mobile-topbar .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 120px); } .slz-header-center.slz-header-left-right.slz-header-mobile-topbar .slz-main-menu-mobile .slz-mobile-topbar + .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 220px); } .slz-header-box .slz-header-main { background-color: #6EB804; } .slz-header-box .slz-header-main.slz-header-fixed .container:before { content: none; } .slz-header-box .slz-header-main.slz-header-fixed { box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2); } } /*---------- max-width 600px ----------*/ @media screen and (max-width: 600px) { .slz-footer-main .col-md-3.col-sm-6 { width: 100%; margin-top: 40px; } .slz-footer-main .col-md-3.col-sm-6:nth-child(-n + 2) { margin-top: 40px; } .slz-footer-main .col-md-3.col-sm-6:first-child { margin-top: 0px; } .slz-footer-main .slz-widget-about-us .slz-logo { position: relative; left: auto; top: auto; -webkit-transform: none; -ms-transform: none; -o-transform: none; transform: none; } /*---------- Header ----------*/ .slz-header-topbar .float-r { float: left; width: 100%; } .slz-main-menu-mobile .slz-menu-wrapper { height: calc(100vh - 160px); } .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 200px); } } /*---------- max-width 480px ----------*/ @media screen and (max-width: 480px) { /*---------- Header ----------*/ .slz-header-main .container { margin-right: 0; } .slz-header-table .slz-logo-wrapper { text-align: right; padding-right: 10px; padding-left: 10px; } .slz-header-center.slz-header-left-right.slz-header-mobile-topbar .slz-main-menu-mobile .slz-mobile-topbar + .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 180px); } } /*---------- max-width 414px ----------*/ @media screen and (max-width: 414px) { /*---------- Header ----------*/ .slz-header-mobile-topbar .slz-main-menu-mobile .slz-topbar-list { display: block; width: 100%; } .slz-header-mobile-topbar .slz-main-menu-mobile .slz-mobile-topbar + .nav-wrapper + .slz-menu-wrapper, .slz-header-mobile-topbar .slz-header-fixed .slz-main-menu-mobile .slz-mobile-topbar + .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 220px); } .slz-header-mobile-topbar .slz-main-menu-mobile .slz-mobile-topbar + .slz-menu-wrapper, .slz-header-mobile-topbar .slz-header-fixed .slz-main-menu-mobile .slz-mobile-topbar + .slz-menu-wrapper { height: calc(100vh - 160px); } .slz-header-mobile-topbar .slz-main-menu-mobile .nav-wrapper + .slz-menu-wrapper { height: calc(100vh - 120px); } .slz-header-mobile-topbar .slz-main-menu-mobile .slz-menu-wrapper { height: calc(100vh - 60px); } } /*---------- max-width 380px ----------*/ @media screen and (max-width: 380px) { .slz-header-topbar .social a { margin: 0 6px; } } /*---------- max-width 320px ----------*/ @media screen and (max-width: 320px) {} /*========= End of RESPONSIVE ============*/