/*----------------------------------------------------------------------------------- Theme Name: Massive Dynamic Theme URI: http://themeforest.net/user/PixFlow Description: Massive Dynamic, a product powered by WordPress, brings you amazing features that just haven't been possible before. Author: PixFlow Author URI: http://www.pixflow.net License: GNU General Public License version 3.0 License URI: http://www.gnu.org/licenses/gpl-3.0.html Version: 8 Tags: left-sidebar, right-sidebar, custom-colors, flexible-header, full-width-template, post-formats, theme-options, threaded-comments, translation-ready Text Domain: massive-dynamic Designed & Handcrafted by PixFlow All files, unless otherwise stated, are released under the GNU General Public License version 3.0 (http://www.gnu.org/licenses/gpl-3.0.html) ----------------------------------------------------------------------------------- Style Menu - WordPress Styles - General Tags Style - Header - Body - Content - Sidebar - Footer - Widget Area - Portfolio Detail - Txt Shortcode - Button Shortcode - Call To Action Shortcode - List Shortcode - Row Shortcode - Image Box Slider - Image Box Fancy - Team Member Classic - Tablet Slider - Mobile Slider - Skill Style 1 - Video - Testimonial Classic - Testimonial carousel - Music - Separator Shortcode - Progress bar widget - Blog Page & Pagination - Subscribe Shortcode - Team Member Style2 - Notification Center - Not Found Page (Error 404) - Search Result Page - Pixflow Slider - Pixflow Price Table - Quote - Feature Image - Price Box - Icon Box New - Process Panel - Info Box - Count Down /* WP Classes */ .wp-caption, .wp-caption-text, .bypostauthor{} .alignleft { float: left; margin-right: 10px; } .alignright { float: right; margin-left: 10px; } .aligncenter { margin-left: auto; margin-right: auto; display: table; clear: both; } .has-animation { opacity: 0; } .sticky .small-thumb .title{background: url(assets/img/sticky.png)no-repeat scroll 0 4px; padding-left: 19px;} .gallery-caption { margin-left: 0; } /* Text meant only for screen readers. */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; } .screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } /*--------------------------------------------------------- General Tags Style ---------------------------------------------------------*/ html { height: 100%; overflow: hidden; } body{ background-color: #fff; } body.wp-editor{ overflow:scroll; } h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: 10px; } a:hover { text-decoration: none; } ul { margin: 0; padding: 0; } video { display: block; } /* Allows IE to understand that video is a block-level element */ /* For theme-unit-test-data */ .sticky .post-title{background: url(assets/img/sticky.png)no-repeat scroll 0 4px; padding-left: 19px;} p.post-category { line-height: 1.3em; } main ul.raw-list, main ol.raw-list{ padding-left: 20px; } main p.raw-paragraph{ margin-bottom: 10px; } main table.raw-table { border-collapse: separate; border-spacing: 0; border-width: 1px 0 0 1px; margin-bottom: 24px; width: 100%; } main table.raw-table, main .raw-table th, main .raw-table td{ border: 1px solid rgba(0, 0, 0, 0.1); } main .raw-table th, main .raw-table td{ padding: 5px; } dl { margin-bottom: 24px; } dt { font-weight: bold; } dd { margin-bottom: 24px; font-size: 13px; } .loop-post-content blockquote, .comment-text blockquote, .page-template-default .content blockquote{ color: #767676; font-size: 16px; font-style: italic; font-weight: 300; line-height: 1.2631578947; margin-bottom: 15px; } main blockquote.raw-blockquote{ text-align: center; border: 1px solid #e5e5e5; width: 100%; padding: 90px 15% 45px 15%; -webkit-margin-before:0; -webkit-margin-after: 0; -webkit-margin-start: 0; -webkit-margin-end: 0; margin-left: 0; margin-bottom: 20px; background: url("assets/img/quote.png") no-repeat 50% 50%; } main blockquote.raw-blockquote .name{ font-size: 14px; line-height: 20px; font-weight: normal; margin-top: 25px; } main blockquote.raw-blockquote p{ font-size: 14px; line-height: 22px; color: #8b8b8b; } address{ font-size: 15px; } main textarea.raw-textarea{ border-radius: 5px; display: block; border: 1px solid #dadada; background: transparent; color: #afafaf; outline: none; font-size: 13px; width: 99.3%; padding: 12px 2%; height: 220px; } main textarea.raw-textarea ::-webkit-input-placeholder{ color: #afafaf; } main textarea.raw-textarea ::-moz-placeholder{ color: #afafaf; } main textarea.raw-textarea ::-ms-input-placeholder{ color: #afafaf; } main p.form-submit{ text-align: center; } main .submit{ border-radius: 5px; border: none; margin-top: 20px; width: 13%; background-color: #2c2c2c; color: #fff; transition: background-color 300ms; outline: none; font-size: 13px; height: 40px; } main .submit:hover{ background-color: #4b4a4a; } .transition-all{ transition:all 400ms; } .blog .loop-post-content .post-share{ display:none; } body:not(.compose-mode) .vc_empty-element>.vc_column-inner{ min-height:0px; } .no-js #pageLoadingOverlay { display: none; } .no-js { overflow: auto; } .no-js .has-animation { opacity: 1; } /* End */ /*--------------------------------------------------------- General Classes ---------------------------------------------------------*/ .left { float: left; min-height: 1px; } .right { float: right; min-height: 1px; } /* Visibility */ .visible-phone { display:none!important } .visible-tablet { display:none!important } .hidden-desktop { display:none!important } .md-hidden { display: none !important; } a.menu-item-link { text-align: center; } .iconTotation { transform: scale(0.8) rotate(180deg); webkit-transform: scale(0.8) rotate(180deg); -moz-transform: scale(0.8) rotate(180deg); -o-transform: scale(0.8) rotate(180deg); -ms-transform: scale(0.8) rotate(180deg); } .hide-overflow{ overflow: hidden; } .pixflow-slider .slide-title, p.description, p.form-description, .paragraph, p.teammember-description, li.text-title, div.md-text-title, p.slide-description, .product_compare_text p, div.description, .image-box-fancy-text, .testimonial-carousel-job-text, .sc-info-box .title, .splitBox-holder .text-holder p { white-space: pre-wrap; } .teammember-classic .description, .md-text-content p{ white-space: pre-line; } .dark-loading-overlay{ position:fixed;top:0;left:0;width:100%;height: 100%; background: #000; opacity: 1;z-index: 10000; } .light-loading-overlay{ position:fixed;top:0;left:0;width:100%;height: 100%; background: #fff; opacity: 1;z-index: 10000; } .loading-text{ text-align: center; position: absolute; top:50%; left:50%; transform:translate(-50%,-50%); font-size:19px; font-weight:normal; line-height: 29px; max-width: 450px; font-family: Arial, Helvetica, sans-serif; } .loading-text .preloader-text{ opacity: 0; transition: opacity 1.1s linear 2300ms; } .loading-text .preloader-text.show-loading-text{ opacity: .9; } .loading-text img{ display: inline-block; top:50%; opacity: 0; position: absolute; left: 50%; transform: translateZ(0) translateX(-50%); transition:opacity 500ms,transform 1.1s cubic-bezier(.58,0,0,1.07) 400ms,top 1.1s cubic-bezier(.58,0,0,1.07) 400ms; } .loading-text img.preloader{ transform: translateZ(0) translateX(-50%) translateY(-100%); top:10px; opacity: 1; } .dark-loading-overlay .loading-text{ color: #fff; } .light-loading-overlay .loading-text{ color:#000; } /*--------------------------------------------------------------------------- Header ---------------------------------------------------------------------------*/ header[class*='top'], header[class*='side'] { z-index: 9999; } header { height: 100px; left: 0; margin-left: auto; margin-right: auto; position: absolute; right: 0; } header:not(.header-clone):not(.left):not(.right) { transition: opacity .4s; visibility:hidden; } header.header-clone { top: 0; } header.sticky { position: fixed; z-index: 1; } .header-default > .container { transition: height 0.3s, max-height 0.3s; } header .container { width: 90%; } header .v-separator { display: inline-block; } header .content { margin-right: auto; margin-left: auto; height: inherit; } header .top a.logo, header .top nav, header .top ul.icons-pack { position: relative; } header .top ul.icons-pack{ overflow: hidden; } header .icons-pack .shopcart-item .number{ width: 13px; height: 13px; border-radius: 50%; font-size: 9px; display: inline-block; position: absolute; text-align: center; font-style: normal; line-height: 13px; } header .content ul.icons-pack{display:inline-block;} header.top-logotop .content ul.icons-pack{ display: inline-table; float: left;} header .content a.logo{display:inline-block;} header .content nav.navigation{display:inline-table; float: left;} header .icons-pack .shopcart-item{position: relative;} header.top-classic .top .icons-pack .shopcart-item .number, header.top-gather .style-style1 .icons-pack .shopcart-item .number{ top: 50%; right: -5px; } header.top-gather .style-style2 .icons-pack .shopcart-item .number, header.top-modern .top .icons-pack .shopcart-item .number, header.side-modern .icons-pack .shopcart-item .number{ bottom: -5px; right: -5px; } .admin-bar header.top-block.header-fix{ top:32px; } header.header-fix .color-overlay.style-second{ border:none; } header.top-block .style-style1 .icons-pack .shopcart-item .number, header.top-block .style-style2 .icons-pack .shopcart-item .number{ bottom: -5px; right: -5px; } header.side-classic .icons-pack .shopcart-item .number{ bottom: -5px; right: -5px; } header.top-logotop .top .icons-pack .shopcart-item .number{ bottom: 0; right: -5px; } header .logo { display: inline-block; position: relative; } header .logo a { height: 100%; display: block; } header .logo img { cursor: pointer; } header.top .logo img{ padding: 0 15px; } header .activeMenu { transition: all 500ms; } /*------------------------- Header Background -------------------------*/ header .color-overlay, footer .color-overlay { height: inherit; position: absolute; width: 100%; z-index: -1; top: 0; left: 0; background-size: 400% 100%; } header.top-block .color-overlay { height: 101%; } header .texture-overlay, footer .texture-overlay { height: inherit; position: absolute; width: 100%; z-index: -2; top: 0; left: 0; } header .bg-image { height: inherit; position: absolute; width: 100%; z-index: -3; top: 0; left: 0; background-position: center; background-size: cover; backface-visibility: hidden; } /* Heade styles */ .header-clone .color-overlay{ display: none !important;} /*------------------------- Business Bar -------------------------*/ .business { position: absolute; z-index: 101; margin: auto; height: 36px; right: 0; left: 0; display: block !important; } .business.business-off{ display: none !important; } .business .info-container { float: left; } .business .info-container span { line-height: 36px; display: inline-block; float: left; } .business .item { margin-right: 40px; position: relative; } .business .item .icon { margin-right: 12px; margin-left: 5px; position: relative; top: 50%; left: 0; } .business .item .icon-record{ font-size: 6px; } .business .social { float: right; } .business .social span { display: inline-block; } .business .social span a { display: inherit; line-height: 36px; margin-right: 10px; } header:not(.top-modern) .business .social .social-icon { float: left; display: inline-flex; } .business .social .social-icon > a { position: relative; display: inline-block; width: 10px; } .business .social .social-icon > a span { position: absolute; top: 50%; transform: translateY(-50%); } .business .text .social-icon > a span { transform: translateY(-80%); } /*-------------------- Header General navigation Styles --------------------*/ header nav { display: inline-block; } header > .container { height: 70px; } header nav ul { padding: 0; list-style: none; } header nav > ul { margin-bottom: 0; } header .navigation a { margin: auto; } .navigation ul li > a{ display: block ; white-space:pre-wrap !important; } header.top-logotop .navigation > ul > li > a span:not(.menu-separator-block), header.top-classic .navigation > ul > li > a span:not(.menu-separator-block) { transition: color 100ms, margin 300ms; } header nav .menu-title, .gather-overlay nav.navigation .menu-title{ transition: color .3s,left .3s; position: relative; left: 0; } header nav .menu-title .title, .gather-overlay nav.navigation .menu-title .title { font-size: inherit; padding-right: 5px; padding-left: 5px; color: inherit; } header.top-block .navigation li a span, .gather-overlay .navigation li a span { margin: 0; left: 0; transition: left 300ms; } .gather-overlay .navigation .menu-title.md-icon-mode .title, .gather-overlay .navigation .menu-title.icon-mode .title, header.top-block .top.style-style1 .menu-title.md-icon-mode .title, header.top-block .top.style-style1 .menu-title.icon-mode .title, header.top-block .top.style-style1 .menu-title.md-text-mode .icon, header.top-block .top.style-style1 .menu-title.text-mode .icon, header.top-block .top.style-style1 .hover-effect.md-icon-mode .title, header.top-block .top.style-style1 .hover-effect.icon-mode .title, header.top-block .top.style-style1 .hover-effect.md-text-mode .icon, header.top-block .top.style-style1 .hover-effect.text-mode .icon, header.side-classic.standard-mode .style-center nav > ul > li > a .menu-title.md-icon-mode .title, header.side-classic.standard-mode .style-center nav > ul > li > a .menu-title.icon-mode .title, header.side-classic.standard-mode .style-center nav > ul > li > a .menu-title.md-text-mode .icon, header.side-classic.standard-mode .style-center nav > ul > li > a .menu-title.text-mode .icon { display: none; } /*-------------------- Header Top DropDown Styles --------------------*/ header .top nav > ul > li:not(.megamenu) > .dropdown, .gather-overlay .menu nav > ul > li:not(.megamenu) > .dropdown { padding: 30px; } header .top nav > ul > li > .dropdown, .gather-overlay .menu nav > ul > li > .dropdown { -webkit-box-shadow:0 14px 32px 4px rgba(0,0,0,0.1); -moz-box-shadow:0 14px 32px 4px rgba(0,0,0,0.1); box-shadow:0 14px 32px 4px rgba(0,0,0,0.1); } header .top nav > ul > li:not(.megamenu) .dropdown, .gather-overlay .menu nav > ul > li:not(.megamenu) .dropdown{ -webkit-box-shadow:0 14px 32px 4px rgba(0,0,0,0.1); -moz-box-shadow:0 14px 32px 4px rgba(0,0,0,0.1); box-shadow:0 14px 32px 4px rgba(0,0,0,0.1); } header .top nav > ul > li:not(.megamenu) > .dropdown .icon, .gather-overlay .menu nav > ul > li:not(.megamenu) > .dropdown .icon { width: 14px; text-align: center; margin-right: 10px; } header .top nav > ul > li.megamenu > .dropdown, .gather-overlay .menu nav > ul > li.megamenu > .dropdown { padding-bottom: 30px; } header .top nav li.megamenu .dropdown .dropdown, .gather-overlay .menu nav li.megamenu .dropdown .dropdown { padding-bottom: 0; } header .top nav > ul > li:not(.megamenu) .dropdown, .gather-overlay .menu nav > ul > li:not(.megamenu) .dropdown { padding: 15px 0; min-width: 230px; width: 100%; } header .top nav > ul > li:not(.megamenu) li, .gather-overlay .menu nav > ul > li:not(.megamenu) li { margin-bottom: 10px; position: relative; float: none; display: block; } header .top nav > ul > li:not(.megamenu) li, .gather-overlay nav > ul > li:not(.megamenu) li { text-align: left; } header .top nav > ul > li:not(.megamenu) li:last-child, .gather-overlay .menu nav > ul > li:not(.megamenu) li:last-child { margin-bottom: 0; } header .top nav > ul > li:not(.megamenu) li a, .gather-overlay .menu nav > ul > li:not(.megamenu) li a { margin: 0 25px; padding: 3px 0; white-space: nowrap; } header .top nav li.megamenu > .dropdown > li, .gather-overlay .menu nav li.megamenu > .dropdown > li { display: inline-block; float: left; padding-top: 30px; opacity: 0; margin-top: -10px; z-index: 3; position: relative; } nav li.megamenu > .dropdown .dropdown li{ margin-bottom:18px; } nav li.megamenu > .dropdown > li { float: left; } nav li.megamenu > .dropdown li, nav li.has-dropdown .dropdown li { font-size: 13px; line-height: normal; display: block; z-index: 3; position: relative; } nav li.megamenu > .dropdown > li.has-dropdown > a .menu-title { font-weight: bold; margin-bottom: 15px; padding-bottom: 10px; display: inline-block; } header.top-classic nav > ul > li.has-dropdown > a .menu-title:after{ content:"\e60c"; font-family: pixflow-font-library; font-size:9px; font-weight:normal; } header.top-classic nav .dropdown .dropdown li { margin-bottom: 15px; } nav .dropdown .dropdown li a { padding: 3px 0; } nav li.megamenu .dropdown li.menu-item > a { display: block; text-align: left; } nav li.megamenu .dropdown .dropdown li.menu-item > a { white-space: nowrap; } nav li.megamenu > .dropdown > li.menu-item > a { margin-left: 30px; margin-right: 30px; text-transform: uppercase; padding: 0; } nav.navigation li.megamenu > .dropdown > li.menu-item > a span, nav li.megamenu .dropdown .dropdown li.menu-item > a span { margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; } nav li.megamenu > .dropdown > li.menu-item > a span.icon, nav li.megamenu .dropdown .dropdown li.menu-item > a span.icon { margin-right: 10px; } header nav.navigation li.megamenu > .dropdown .dropdown, .gather-overlay nav.navigation li.megamenu > .dropdown .dropdown { display: block; position: relative; background-color: transparent; margin-top: 0; margin-left: 30px; top: 0; opacity: 1; } header nav.navigation li.megamenu > ul.dropdown ul.dropdown .megamenu-dropdown-overlay, .gather-overlay nav.navigation li.megamenu > .dropdown .dropdown .megamenu-dropdown-overlay{ background-color: transparent; } header.side-classic nav > ul > li.megamenu > ul li.has-dropdown:not(.megamenu):hover > a .menu-title span, header[class *= "top"] nav > ul > li.megamenu > ul li.has-dropdown:not(.megamenu):hover > a .menu-title span, .gather-overlay nav > ul > li.megamenu > ul li.has-dropdown:not(.megamenu):hover > a .menu-title span { color: inherit; cursor: default; } header.side-classic .style-left nav ul li.megamenu ul ul li:hover .menu-title, header.side-classic .style-left nav ul li.has-dropdown:not(.megamenu) ul li:hover > a .menu-title, header.side-classic .style-left nav ul li.has-dropdown:not(.megamenu) ul ul li:hover .menu-title, header .top nav ul li.megamenu ul ul li:hover .menu-title, header .top nav ul li.has-dropdown:not(.megamenu) ul li:hover > a .menu-title, header .top nav ul li.has-dropdown:not(.megamenu) ul ul li:hover .menu-title, .gather-overlay nav ul li.megamenu ul ul li:hover .menu-title, .gather-overlay nav ul li.has-dropdown:not(.megamenu) ul li:hover > a .menu-title, .gather-overlay nav ul li.has-dropdown:not(.megamenu) ul ul li:hover .menu-title { left: 5px; } header.top nav.navigation > ul > li.has-dropdown:not(.megamenu) .dropdown.side-line, .gather-overlay nav.navigation > ul > li.has-dropdown:not(.megamenu) .dropdown.side-line{ padding: 0; } header.top nav.navigation > ul > li.has-dropdown:not(.megamenu) .dropdown.side-line li, .gather-overlay nav.navigation > ul > li.has-dropdown:not(.megamenu) .dropdown.side-line li{ padding: 17px 0; margin-bottom: 0; } header.top nav.navigation > ul > li.has-dropdown:not(.megamenu) .dropdown.side-line li:after, .gather-overlay nav.navigation > ul > li.has-dropdown:not(.megamenu) .dropdown.side-line li:after{ content: ""; height: 1px; width: 93%; position: absolute; left: 0; bottom: 0; margin-left: auto; margin-right: auto; right: 0; } header.top nav.navigation > ul > li.has-dropdown:not(.megamenu) .dropdown.side-line li:last-child:after, .gather-overlay nav.navigation > ul > li.has-dropdown:not(.megamenu) .dropdown.side-line li:last-child:after{ display: none; } header nav.navigation li.megamenu > .dropdown .megamenu-dropdown-overlay, .gather-overlay nav li.megamenu > .dropdown > .megamenu-dropdown-overlay, header nav > ul > li.has-dropdown:not(.megamenu) ul .megamenu-dropdown-overlay, header nav.navigation li.megamenu > .dropdown .megamenu-image-overlay , .gather-overlay nav li.megamenu > .dropdown > .megamenu-image-overlay{ position:absolute; width:100%; height:100%; top:0; left:0; z-index:0; } header nav.navigation li.megamenu > .dropdown .megamenu-image-overlay , .gather-overlay nav li.megamenu > .dropdown > .megamenu-image-overlay { z-index:1; background-size: contain !important; } /*------------------------- Header Icons Pack -------------------------*/ header .icons-pack { height: inherit; display: inline-block; float: none; position: relative; text-align: center; } header .icons-pack li { list-style-type: none; display: block; float: left; margin: 0 15px 0 0; } header.top-logotop .icons-pack li{ margin: 6px 15px 0 0; } header .icons-pack .item-setting { text-align: center; } /*------------------------- Header Top - Classic -------------------------*/ header.top-classic .icons-pack { text-align: center; } header.top-classic .icons-pack.item-center { text-align: center; } header.top-classic .icons-pack.item-left { text-align: left; } header.top-classic .icons-pack.item-right { text-align: right; } header.top-classic .icons-pack li { display: inline-block; float: none; } header.top-classic .icons-pack li:last-child { margin-right: 0; } header.top-classic .logo img { max-height: 100%; max-width: 100%; position: absolute; top: 50%; right: 50%; -webkit-transform: translateY(-50%) translateX(50%); -moz-transform: translateY(-50%) translateX(50%); -ms-transform: translateY(-50%) translateX(50%); -o-transform: translateY(-50%) translateX(50%); transform: translateY(-50%) translateX(50%); } header.top-classic .logo.item-center img { -webkit-transform: translateY(-50%) translateX(50%); -moz-transform: translateY(-50%) translateX(50%); -ms-transform: translateY(-50%) translateX(50%); -o-transform: translateY(-50%) translateX(50%); transform: translateY(-50%) translateX(50%); } header.top-classic .logo.item-left img { left: 0%; -webkit-transform: translateY(-50%) translateX(0%); -moz-transform: translateY(-50%) translateX(0%); -ms-transform: translateY(-50%) translateX(0%); -o-transform: translateY(-50%) translateX(0%); transform: translateY(-50%) translateX(0%); } header.top-classic .logo.item-right img { right: 0%; -webkit-transform: translateY(-50%) translateX(0%); -moz-transform: translateY(-50%) translateX(0%); -ms-transform: translateY(-50%) translateX(0%); -o-transform: translateY(-50%) translateX(0%); transform: translateY(-50%) translateX(0%); } header.top-classic nav { display: table; } header.top-classic nav.navigation > ul { display: table-cell; vertical-align: middle; } header.top-classic nav.item-center > ul { text-align: center; } header.top-classic nav.item-left > ul { text-align: left; } header.top-classic nav.item-right > ul { text-align: right; } header.top-classic .content { height: inherit; position: relative; } header.top-classic .content::before { content: " "; height: 100%; vertical-align: middle; } /*** Classic Icons Pack ***/ header.top-classic .logo, header.top-classic .icons-pack { display: inline-block; float: left; height: inherit; } header.top-classic nav.navigation { float: left; height: inherit; } header.top-classic .icons-pack a { transition: none; position: relative; } header.top-classic .icons-pack .icon { transition: color .3s, line-height .3s; } header.top-classic .icons-pack .icon span { color: inherit; cursor: pointer; } /* Navigation */ header.top-classic nav > ul > li { display: inline-block; margin: 10px 0; padding-left: 10px; padding-right: 10px; padding-top: 0; position: relative; text-align: center; } header nav > ul > li.menu-item:first-child { padding-left: 0; } header.top-classic nav > ul > li > a{ position: relative; } header.top-classic nav > ul > li a { padding: 0; } header.top-classic nav > ul > li a:after { transform: translate3d(0, 0, 0); position: absolute; z-index: 1; content: ""; left: 50%; right: 50%; height: 3px; bottom: -5px; } header.top-classic .navigation ul li .menu-separator { bottom: -10px; content: ""; height: 2px; left: 50%; padding: 0; position: absolute; right: 50%; z-index: 1; } header.top-classic nav > ul > .separator { padding: 0; } header.top-classic .style-none nav > ul > .separator { display: none; } /* dot Style */ header.top-classic .style-dot nav > ul > .separator a { display: inline-block; padding: 0; width: 4px; height: 4px; border-radius: 50%; position: absolute; top: 50%; transform: translate(-50%, -50%); left: 50%; } /* slash Style */ header.top-classic .style-slash nav > ul > .separator a { height: 12px; width: 2px; display: block; position: absolute; top: 50%; transform: translate(-50%, -50%) rotate(35deg); left: 50%; } /* dash Style */ header.top-classic .style-dash nav > ul > .separator a { height: 100%; display: block; font-size: 40px; width: 13px; height: 3px; line-height: inherit; position: absolute; top: 50%; transform: translate(-50%, -50%); left: 50%; } /* Border Style */ header.top-classic .style-border nav > ul > li.separator { display: none; } header.top-classic .style-border nav > ul > li a { padding: 3px 0; } header.top-classic .style-border nav > ul > li { border-right: 1px solid #8b8b8b; padding-left: 35px; padding-right: 35px; float: none; display: inline-block; } header.top-classic .style-border nav > ul > li:first-child { border-left: 1px solid #8b8b8b; } /** Wireframe Style **/ header.top-classic .style-wireframe nav > ul > li{ margin: 0 10px; } header.top-classic .style-wireframe nav > ul > li.separator{ display: none; } header.top-classic .style-wireframe ul li .menu-separator{ bottom: 0; left: 50%; transform: translateX(-50%); right: auto; width: 22px; height: 1px; margin-left: -5px; } header.top-classic .style-wireframe nav > ul > li.has-dropdown > a .menu-title:after{ content: "\e819"; font-size: 14px; } header[class *= "top-"]:not(.right) .style-wireframe nav.navigation > ul > li.has-dropdown > ul.dropdown:not(.side-line){ border-top: none; } header.top-classic .top.content nav > ul > li:last-child a { visibility: hidden; display: inline-block; } header.top-classic .top.content nav > ul > li:last-child a:after { display: none; } header.top-classic .top.content nav > ul > li.separator a:after { display: none; } header.top-classic .top.content nav > ul > li.separator a:hover { overflow: hidden; } /* Button styles */ header.top-classic .style-none nav > ul > .item_button{ margin:0 0 0 35px; padding:0; transition: color .25s 0s; } .navigation > ul > .item_button > a{ transition: background-color .25s,border-color .25s; } header.top-logotop .navigation > ul > li.item_button > a span:not(.menu-separator-block), header.top-classic .navigation > ul > li.item_button > a span:not(.menu-separator-block){ transition: none; } header.top-classic .style-none nav > ul > .item_button > a > .menu-separator , header.top-classic .style-none nav > ul > .item_button > a > .menu-separator-block{ display: none; } header.top-classic .style-none nav > ul > .item_button.oval-style a , header.top-classic .style-none nav > ul > .item_button.oval_outline-style a{ border-radius: 30px; } header.top-classic .style-none nav > ul > .item_button.oval-style a{ padding:15px 28px; } header.top-classic .style-none nav > ul > .item_button.rectangle-style a{ padding:16px 25px; } header.top-classic .style-none nav > ul > .item_button.oval_outline-style a{ padding:13px 26px; border: 2px solid; } header.top-classic .style-none nav > ul > .item_button.rectangle_outline-style a{ padding:14px 23px; border: 2px solid; } header.top-classic .style-none nav > ul > .item_button > a .menu-title{ z-index: 3; position: relative; } header.top-classic .style-none nav > ul > .item_button.oval-style > a:after{ border-radius: 24px; } header.top-classic .style-none nav > ul > .item_button > a, header.top-classic .style-none.content .navigation > ul > .item_button:hover > a .menu-title { color: inherit; } /* header navigation button styles */ .compose-mode header.top-classic .style-none nav > ul > .item_button > a, .compose-mode header.top-classic .style-none nav > ul > .item_button > a .menu-title, .compose-mode header.top-classic .style-none.content .navigation > ul > .item_button:hover > a .menu-title, header.top-classic.header-clone .style-none nav > ul > .item_button > a .menu-title , header.top-classic.header-clone .style-none.content .navigation > ul > .item_button:hover > a .menu-title, header.top-classic.header-fix .style-none nav > ul > .item_button > a .menu-title , header.top-classic.header-fix .style-none.content .navigation > ul > .item_button:hover > a .menu-title{ color : inherit !important; } header.top-classic.header-clone .style-none nav > ul > .item_button.rectangle-style > a, header.top-classic.header-fix .style-none nav > ul > .item_button.oval-style > a{ -webkit-box-shadow: inset 0px 0px 1px 1px rgba(0,0,0,0.1); -moz-box-shadow: inset 0px 0px 1px 1px rgba(0,0,0,0.1); box-shadow: inset 0px 0px 1px 1px rgba(0,0,0,0.1); } /*------------------------- Header Top - Block -------------------------*/ header.top-block .logo, header.top-block nav, header.top-block .icons-pack { float: left; } header.top-block, header.top-block nav, header.top-block nav > ul, header.top-block nav > ul > li { height: inherit; } header.top-block .logo { height: 100%; } header.top-block .logo img { max-height: 100%; max-width: 100%; position: absolute; top: 50%; right: 50%; -webkit-transform: translateY(-50%) translateX(50%); -moz-transform: translateY(-50%) translateX(50%); -ms-transform: translateY(-50%) translateX(50%); -o-transform: translateY(-50%) translateX(50%); transform: translateY(-50%) translateX(50%); } header.top-block .logo.item-center img { -webkit-transform: translateY(-50%) translateX(50%); -moz-transform: translateY(-50%) translateX(50%); -ms-transform: translateY(-50%) translateX(50%); -o-transform: translateY(-50%) translateX(50%); transform: translateY(-50%) translateX(50%); } header.top-block .logo.item-left img { left: 0%; -webkit-transform: translateY(-50%) translateX(0%); -moz-transform: translateY(-50%) translateX(0%); -ms-transform: translateY(-50%) translateX(0%); -o-transform: translateY(-50%) translateX(0%); transform: translateY(-50%) translateX(0%); } header.top-block .logo.item-right img { right: 0%; -webkit-transform: translateY(-50%) translateX(0%); -moz-transform: translateY(-50%) translateX(0%); -ms-transform: translateY(-50%) translateX(0%); -o-transform: translateY(-50%) translateX(0%); transform: translateY(-50%) translateX(0%); } header.top-block .icons-pack { text-align: center; } header.top-block .icons-pack.item-center { text-align: center; } header.top-block .icons-pack.item-right { text-align: right; } header.top-block .icons-pack.item-left { text-align: left; } header.top-block nav > ul { text-align: center; } header.top-block nav.item-center > ul { text-align: center; } header.top-block nav.item-left > ul { text-align: left; } header.top-block nav.item-right > ul { text-align: right; } /* fix issue in safari*/ header.top-block .style-style2 nav > ul{ display: flex; } header.top-block .style-style2 nav.item-center > ul { justify-content: center; } header.top-block nav.item-left > ul { justify-content: flex-start; } header.top-block nav.item-right > ul { justify-content: flex-end; } header.top-block nav > ul > li > a { display: block; margin-top: 0; outline: 1px solid transparent; text-align: center; } header.top-block .navigation > ul > li > a span.icon { font-size: 28px; padding-right: 4px; vertical-align: middle; padding-left: 5px; } header.top-block .navigation .dropdown li a span.icon { font-size: 13px; } header.top-block .icons-pack li .title-content { color: inherit; padding: 0; display: table-cell; } /**** DropDown ****/ header.top-block nav.navigation li.megamenu > .dropdown, header.top-block nav.navigation li.has-dropdown > .dropdown { top: 100%; } /************* Rectangle *************/ header.top-block .style-style1 nav > ul > li > a, header.top-block .style-style1 nav > ul > li > a .hover-effect, header.top-block .style-style1 nav > ul > li > a .menu-title, header.top-block .style-style1 ul.icons-pack > li .elem-container, header.top-block .style-style1 ul.icons-pack > li .elem-container > span, header.top-block .style-style1 nav > ul > li > a:hover .hover-effect, header.top-block .style-style1 ul.icons-pack > li a:hover .hover-content { line-height: 70px; height: 70px; } header.top-block .style-style1 nav { height: inherit; } header.top-block .style-style1 nav > ul > li { border-left: 1px solid rgba(255, 255, 255, 0.3); float: none; overflow: inherit; text-align: center; max-width: 300px; white-space: nowrap; display: inline-block; } header.top-block .style-style1 nav > ul > li:last-child { border-right: 1px solid rgba(255, 255, 255, 0.3); } header.top-block .style-style1 nav > ul > li > a, header.top-block .style-style1 .icons-pack li .elem-container { -webkit-perspective: 1000px; -moz-perspective: 1000px; -ms-perspective: 1000px; -o-perspective: 1000px; perspective: 1000px; } header.top-block .style-style1 nav > ul > li > a .hover-effect, header.top-block .style-style1 .icons-pack li a .hover-content { -webkit-transform: rotateX(90deg); -moz-transform: rotateX(90deg); -ms-transform: rotateX(90deg); -o-transform: rotateX(90deg); transform: rotateX(90deg); } header.top-block .style-style1 nav > ul > li:hover > a .menu-title, header.top-block .style-style1 .icons-pack li:hover a .title-content { -webkit-transform: rotateX(-90deg); -moz-transform: rotateX(-90deg); -ms-transform: rotateX(-90deg); -o-transform: rotateX(-90deg); transform: rotateX(-90deg); } header.top-block .style-style1 nav > ul > li:hover > a .hover-effect, header.top-block .style-style1 .icons-pack li:hover .hover-content, header.top-block .style-style1 nav > ul > li > a .menu-title, header.top-block .style-style1 .icons-pack li a .title-content { -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); -ms-transform: rotateX(0deg); -o-transform: rotateX(0deg); transform: rotateX(0deg); } header.top-block .style-style1 nav ul li > a > span, header.top-block .style-style1 .icons-pack li .elem-container > span { pointer-events: none; margin: 0; left: 0; top: 0; -webkit-transform-origin: 50% 50% -30px; -moz-transform-origin: 50% 50% -30px; -ms-transform-origin: 50% 50% -30px; -o-transform-origin: 50% 50% -30px; transform-origin: 50% 50% -30px; -webkit-transition: transform 0.3s ease 0s; -moz-transition: transform 0.3s ease 0s; -ms-transition: transform 0.3s ease 0s; -o-transition: transform 0.3s ease 0s; transition: transform 0.3s ease 0s, margin-left 300ms; } header.top-block .style-style1 nav ul li:hover > a > span, header.top-block .style-style1 .icons-pack li:hover .elem-container > span { -webkit-transition: transform 0.2s ease 0s, left 300ms; -moz-transition: transform 0.2s ease 0s, left 300ms; -ms-transition: transform 0.2s ease 0s, left 300ms; -o-transition: transform 0.2s ease 0s, left 300ms; transition: transform 0.2s ease 0s, left 300ms; } /* Block header icons Pack - Style1 */ header.top-block .style-style1 .icons-pack { float: left; height: inherit; transition: none; } header.top-block .style-style1 .icons-pack .icon-hover-text { display: none; font-family: "Open Sans", sans-serif; } header.top-block .style-style1 .icons-pack li { border-right: 1px solid; display: inline-block; float: left; height: inherit; margin: 0; overflow: inherit; position: relative; transition: none; } header.top-block .style-style1 .icons-pack li a { cursor: pointer; } header.top-block .style-style1 .icons-pack li a .title-content { width: 100%; } header.top-block .style-style1 .icons-pack li a .hover-content { width: 100%; } header.top-block .style-style1 .icons-pack li a .hover-content, header.top-block .style-style1 .icons-pack li a .title-content { display: inline-block; } header.top-block .style-style1 .icons-pack li .elem-container { display: block; transition: none; } header.top-block .icons-pack li .title-content .icon, header.top-block .icons-pack li .hover-content .icon-hover { vertical-align: middle; position: relative; } /* Block header style1 Hover Effect */ header.top-block .style-style1 nav > ul > li > a, header.top-block .style-style1 .icons-pack li a { margin: auto; width: 100%; } header.top-block .style-style1 nav > ul > li > a .menu-title { width: 100%; } header.top-block .style-style1 nav > ul > li > a .hover-effect { width: 100%; display: inline-block; background: #27af61; } /************* Square *************/ header.top-block .style-style2 nav > ul > li > a .menu-title .title { display: none; } header.top-block .style-style2 .icons-pack .icon { font-size: 14px; display: inline-block; float: left; } header.top-block .style-style2 .icons-pack { float: left; } header.top-block .style-style2 .menu-separator-block { background-color: #fff; bottom: -10px; height: 6px; left: 0; margin: auto !important; opacity: 0; position: absolute; right: 0; width: 94%; } header.top-block .style-style2 .icons-pack .icon-hover-text { font-family: "Open Sans", sans-serif; } header.top-block .style-style2 .icons-pack li .elem-container .hover-content .icon-hover , header.top-block .style-style2 .icons-pack li .elem-container .hover-content .icon .number{ display: none; } header.top-block .style-style2 .icons-pack li .elem-container { transition: all 0.3s ease 0s; } header.top-block .style-style2 .icons-pack li .elem-container, header.top-block .style-style1 .icons-pack li .elem-container { display: inline-block; position: relative; width: 74px; text-align: center; line-height: inherit; } /* Block header style2 Hover Effect */ header.top-block .style-style2 nav > ul > li { position: relative; display: inline-block; outline: none; float: none; text-align: center; border-right: 1px solid rgba(255, 255, 255, 1); transition: all 450ms cubic-bezier(0.215, 0.61, 0.355, 1) 1ms; } header.top-block .style-style2 nav > ul > li:first-child, header.top-block .icons-pack li:first-child { border-left: 2px solid rgba(255, 255, 255, 0.3); } header.top-block .style-style2 .icons-pack li { border-right: 1px solid rgba(255, 255, 255, 0.3); margin: 0; overflow: hidden; position: relative; } header.top-block .style-style2 nav > ul > li > a { overflow: hidden; display: inline-block; position: relative; width: 74px; height: auto; transform: translate3d(0px, 0px, 0px); } header.top-block .style-style2 nav > ul > li > a .hover-effect, header.top-block .style-style2 .icons-pack li .elem-container .hover-content { content: 'item pages'; position: absolute; top: -105%; transform: translate3d(0px, 0px, 0px); left: 0; text-align: center; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; opacity: 0; } header.top-block .style-style2 nav > ul > li > a .hover-effect span, header.top-block .style-style2 .icons-pack li .elem-container .hover-content span { display: table-cell; vertical-align: middle; line-height: normal; } header.top-block .style-style2 .icons-pack li .title-content, header.top-block .style-style2 nav > ul > li > a > .menu-title, header.top-block .style-style2 nav > ul > li ul:not(.dropdown) .menu-title { display: inline-block; transition: all 500ms; } header.top-block .style-style2 .icons-pack li:hover > a .title-content, header.top-block .style-style2 nav > ul > li:hover > a .menu-title { margin-top: 100px } header.top-block .style-style2 nav > ul > li > a .menu-title span.icon { font-size: 28px; display: inherit; vertical-align: middle; } header.top-block .style-style2 nav > ul > li .hover-effect span.icon { display: none; } header.top-block .style-style2 .icons-pack li .title-content { display: inline-block; } header.top-block .style-style2 nav > ul > li > a .menu-item:hover, header.top-block .style-style2 .icons-pack li:hover { background-color: rgba(36, 36, 36, 0.7); transition: color 400ms; } /*------------------------- Header Top - Gather -------------------------*/ /* defualt */ header.top-gather { height: 60px; } header.top-gather .logo, header.top-gather .navigation, header.top-gather .icons-pack { position: relative; float: left; top: 50%; transform: translateY(-50%); } header.top-gather .content { height: inherit; position: relative; } .top-gather.default .gather-btn span.icon-gathermenu, .gather-overlay.default .gather-btn span.icon-gathermenu { background-color: transparent; color: #000; transition: background-color 500ms, color 500ms; } .gather-overlay.default { background-color: #000; } .top-gather.default .gather-btn span.icon-gathermenu:hover, .gather-overlay.default .gather-btn span.icon-gathermenu:hover { color: #ffc400; background-color: transparent; } header.top-gather .style-style1 .gather-btn.item-center, header.top-gather .style-style2 .gather-btn.item-center { text-align: center; } header.top-gather .style-style1 .gather-btn.item-left, header.top-gather .style-style2 .gather-btn.item-left { text-align: left; } header.top-gather .style-style1 .gather-btn.item-right, header.top-gather .style-style2 .gather-btn.item-right { text-align: right; } header.top-gather .item-setting { text-align: center; } header.top-gather .icons-pack, header.top-gather .icons-pack a { transition: none; } header.top-gather .icons-pack { text-align: center; } header.top-gather .style-style1 .icons-pack.item-center, header.top-gather .style-style1 .icons-pack.item-center { text-align: center; } header.top-gather .style-style1 .icons-pack.item-left, header.top-gather .style-style2 .icons-pack.item-left { text-align: left; } header.top-gather .style-style1 .icons-pack.item-right, header.top-gather .style-style2 .icons-pack.item-right { text-align: right; } header.top-gather .icons-pack li { float: none; display: inline-block; margin-right: 10px; height: inherit; } header.top-gather .logo img { position: absolute; top: 50%; right: 50%; -webkit-transform: translateY(-50%) translateX(50%); -moz-transform: translateY(-50%) translateX(50%); -ms-transform: translateY(-50%) translateX(50%); -o-transform: translateY(-50%) translateX(50%); transform: translateY(-50%) translateX(50%); } header.top-gather .logo.item-center img { -webkit-transform: translateY(-50%) translateX(50%); -moz-transform: translateY(-50%) translateX(50%); -ms-transform: translateY(-50%) translateX(50%); -o-transform: translateY(-50%) translateX(50%); transform: translateY(-50%) translateX(50%); } header.top-gather .logo.item-left img { left: 0%; -webkit-transform: translateY(-50%) translateX(0%); -moz-transform: translateY(-50%) translateX(0%); -ms-transform: translateY(-50%) translateX(0%); -o-transform: translateY(-50%) translateX(0%); transform: translateY(-50%) translateX(0%); } header.top-gather .logo.item-right img { right: 0%; -webkit-transform: translateY(-50%) translateX(0%); -moz-transform: translateY(-50%) translateX(0%); -ms-transform: translateY(-50%) translateX(0%); -o-transform: translateY(-50%) translateX(0%); transform: translateY(-50%) translateX(0%); } /* style1 */ header.top-gather .style-style1.content { height: 100% !important; position: relative; } header.top-gather .style-style1.content::before { content: " "; display: inline-block; height: 100%; vertical-align: middle; } header.top-gather .gather-btn { /*margin-top: -2px;*/ } header.top-gather .style-style1 .logo, header.top-gather .style-style1 .gather-btn, header.top-gather .style-style1 .icons-pack { display: inline-block; vertical-align: middle; height: 100%; position: relative; text-align: center; } header.top-gather .style-style1 .icons-pack .icon { transition: color 300ms; } /* style2 */ header.top-gather .style-style2 .border-left { border-left: 1px solid; } header.top-gather .style-style2 .border-right { border-right: 1px solid; } header.top-gather .style-style2 .logo, header.top-gather .style-style2 .gather-btn { display: inline-block; margin: 0; height: 62px; text-align: center; line-height: 60px !important; } header.top-gather .style-style2 .icons-pack { border-right: none; height: 100%; } header.top-gather .style-style2 .icons-pack li.icon a span { left: 0; margin: auto; position: absolute; right: 0; } header.top-gather .style-style2 .icons-pack li a .default { top: 0; } header.top-gather .style-style2 .icons-pack li a .hover { top: -54px; } header.top-gather .style-style2 .icons-pack li { margin: 0; cursor: pointer; position: relative; overflow: hidden; } header.top-gather .style-style2 .icons-pack li a { width: 60px; height: 58px; cursor: pointer; } header.top-gather .style-style2 .v-separator { padding: 0; text-align: center; } header.top-gather .style-style2 .logo .v-separator { padding: 0 22px; } header.top-gather .style-style2 .icons-pack li a, header.top-gather .style-style2 .icons-pack li a span, header.top-gather .style-style1 .icons-pack li a, header.top-gather .style-style1 .icons-pack li a span { display: inline-block; position: relative; text-align: center; line-height: inherit; } .gather-btn .icon-gathermenu, .gather-btn .icon-close, .gather-btn .icon-hamburger-menu{ display: inline-block; float: none; /*padding: 19px;*/ background-color: transparent; cursor: pointer; vertical-align: middle; opacity: 1; transition: color .3s; } .gather-btn .icon-close{ font-size: 25px; padding: 19px; } /* gather overlay */ .gather-overlay { z-index: 10000; background: rgba(255, 187, 0, .95); opacity: 0; visibility: hidden; position: fixed; width: 100%; height: 100%; } .gather-overlay.active { visibility: visible; } .gather-overlay .gather-btn { position: absolute; top: 0; right: 0; } .gather-overlay .logo { position: absolute; top: 10px; left: 10px; max-width: 200px; } .gather-overlay ul { float: none; overflow: inherit; } .gather-overlay .menu { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 80%; text-align: center; transition: all 500ms ease 0s; text-transform: uppercase; } .gather-overlay .menu ul.dropdown { width: 100%; } .gather-overlay .menu nav > ul > li { border-right: 1px solid; display: inline-block; margin: 10px 0; padding: 0 40px; position: relative; } .gather-overlay .menu ul li:last-child { border: none; } .gather-overlay nav > ul > li:after, .gather-overlay nav > ul > li a { transition: color 300ms; } .noScroll{ overflow: hidden !important; } /*------------------------- Header Top - LogoTop -------------------------*/ header.top-logotop { display: table; } header.top-logotop a.logo { display: inline-block; float: none; min-height: 40px; width: 100%; position: relative; transform: translateY(0); top: 0; max-width: 350px; max-height: 350px; } header.top-logotop a.logo img { position: relative; display: inherit; } header.top-logotop .content-area nav.navigation { height: auto; position: relative; display: inline-block; } header.top-logotop .center-area { display: inline-block; position: relative; margin: 0 auto; } header.top-logotop .navigation { width: initial; position: relative; transform: translateY(0); display: inline-block; } header.top-logotop .navigation ul { margin-left: -5px; } header.top-logotop nav > ul > li { display: inline-block; margin: 10px 0; padding-left: 20px; padding-right: 20px; padding-top: 0; position: relative; text-align: center; } header.top-logotop nav > ul > li > a { padding: 0; position: relative; } .top-logotop .navigation > ul > li .menu-separator { bottom: -10px; content: ""; height: 2px; left: 50%; padding: 0; position: absolute; right: 50%; z-index: 1; } header.top-logotop .style-logotop nav > ul > li:after { content: '/'; /*width: 60px;*/ height: 100%; display: block; position: absolute; right: 0; top: 0; opacity: 0.5; } header.top-logotop .style-logotop nav > ul > li:last-child:after { content: ''; } /* icons pack */ header.top-logotop .icons-pack { display: inline-block; margin-left: 20px; } header.top-logotop .icons-pack .icon { color: inherit; cursor: pointer; transition: color 300ms; height:100%; display: table-cell; vertical-align: middle; } header.top-logotop .icons-pack span.icon{ height: inherit; position: relative; } .logo-top-container { width: 100%; margin-top: 10px; } header.top-logotop .content { display: table-cell; vertical-align: middle; text-align: center; } /*------------------------- Header Top - Modern -------------------------*/ header.top-modern .top a.logo { display: block; height: inherit; max-width: 200px; position: relative; width: 100%; } header.top-modern .logo img { margin: auto; position: relative; top: 50%; transform: translateY(-50%); max-width: inherit; } /* Hover Btn */ header.top-modern .btn { display: inline-block; font-family: inherit; font-size: inherit; background: none; cursor: pointer; outline: none; position: relative; border-bottom: none; border-top: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } header.top-modern .btn:after { content: ''; position: absolute; z-index: -1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } /* Button 1b */ header.top-modern .btn-1b:after { width: 100%; height: 0; top:0; left: 0; } header.top-modern .btn-1b:hover:after, header.top-modern .btn-1b:active:after { height: 100%; } /* End of Hover Btn */ header.top-modern .top nav { position: relative; transform: translate(0); top: 0; } header.top-modern, header.top-modern nav, header.top-modern nav > ul, header.top-modern nav > ul > li { height: inherit; transition: all 0ms; border-bottom: none; border-top: none; } header.top-modern{ opacity: 0; } header.top-modern nav { display: block; } header.top-modern nav > ul { /* height: 100%;*/ } header.top-modern > nav ul { display: block; height: auto; width: 100%; } header.top-modern nav > ul li { text-align: center; display: inline-block; } header.top-modern nav > ul > li > a { display: table; height: inherit; width: 100%; } header.top-modern nav > ul > li > a span.menu-title { display: table-cell; vertical-align: middle; } header.top-modern nav.navigation li.megamenu > .dropdown, header.top-modern nav.navigation li.has-dropdown > .dropdown { top: 100%; } header.top-modern .content:last-child { position: relative; display: block; top: 0; transform: none; } header.top-modern .business { background: none; position: relative; height: auto; } header.top-modern .business > div { height: 100%; } header.top-modern .business > div .info-container, header.top-modern .business > div .social.icon{ line-height: 2em; } header.top-modern .navigation { float: left; } header.top-modern .business .info-container span, header.top-modern .business .social span a, header.top-modern nav > ul > li, header.top-modern .icons-pack li { line-height: inherit; } /* Modern header icons Pack */ header.top-modern .top .icons-pack { display: table; transform: translateY(0); top: 0; position: relative; float: right; } header.top-modern .icons-pack li { text-align: center; display: table-cell; width: 70px; vertical-align: middle; float: none; margin-right: 0; } header.top-modern .icons-pack li:last-child { border: none; } header.top-modern .icons-pack li .title-content .icon { font-size: 28px; color: inherit; transition: color 300ms; position: relative; } .title-content .icon{ padding: 4px; } header.top-modern .first-part { position: relative; display: table; height: inherit; text-align: center; float: left; padding: 0 30px; } header.top-modern .second-part { height: 100%; padding: 0; float: left; } .second-header-bg{ left: 0; margin: auto; right: 0; } /*------------------------- Header Side -------------------------*/ header.left, header.right { position: fixed; top: 0; bottom: 0; height: 100%; z-index: 100; } header.left { float: left; left: 0; right: auto; } header.right { float: right; left: auto; right: 0; } header.left .logo, header.right .logo, header.left .navigation, header.right .navigation, header.left .navigation li, header.right .navigation li { float: none; } header.left .social, header.right .social { height: 100px; } header.left .icons-holder, header.right .icons-holder { display: flex; justify-content: center; align-items: center; } header.left .icons-pack, header.right .icons-pack { display: table-cell; } header.left .logo, header.right .logo { height: auto; } header.left .icons-pack li, header.right .icons-pack li { float: left; list-style: none; margin: 0; } /*** Navigation ***/ header.left nav ul > li { position: relative; } header.left nav li.megamenu > .dropdown > li.has-dropdown { float: left; } header.left nav.navigation ul.dropdown { margin: 0; padding: 0; } header.left nav.navigation ul ul li { margin: 0; } header.left nav.navigation li.megamenu > .dropdown { position: absolute; top: 0; left: 100%; padding-top: 30px; padding-bottom: 30px; margin-top: 0; } header.left nav.navigation > ul > li.megamenu > ul.dropdown > li > a .menu-title { margin-bottom: 20px; padding-bottom: 10px; } header.left nav.navigation > ul > li.has-dropdown:not(.megamenu) > ul.dropdown > li > a .menu-title { margin-bottom: 0; padding-bottom: 0; border: none; } header.left nav.navigation > ul > li.megamenu > ul.dropdown > li > ul.dropdown a { padding: 5px; } header.left nav.navigation > ul > li > ul.dropdown > li > ul.dropdown a { padding-top: 0; padding-bottom: 3px; } header:not(.right) nav.navigation li.has-dropdown:not(.megamenu) .dropdown .dropdown, .gather-overlay .menu nav.navigation li.has-dropdown:not(.megamenu) .dropdown .dropdown { position: absolute; left: 100.3%; top: 0; display: none; width: auto; } header.top-modern nav.navigation li.has-dropdown:not(.megamenu) .dropdown .dropdown{ width: 100%; } header.right nav.navigation li.megamenu > .dropdown .dropdown { margin-right: 30px; margin-left: 0; } header nav.navigation li.has-dropdown ul.dropdown, .menu nav.navigation li.has-dropdown ul.dropdown { display: none; opacity: 0; margin-top: -20px; z-index: 1; } /* dropdown */ header.right nav .dropdown .dropdown li a { padding-right: 0; } /*------------------------- Header Side - Classic ------------------------*/ header.side-classic .logo { width: 100%; } header.side-classic .logo a { height: 100%; display: block; text-align: center; padding: 50px 0; } header.side-classic .logo a img{ display: inline-block; } header.side-classic div.content.side .icons-pack { width: 100%; } header.side-classic .icons-holder { border-bottom: 1px solid rgba(210, 210, 210, 0.5); border-top: 1px solid rgba(210, 210, 210, 0.5); overflow: hidden; min-height: 56px; } header.side-classic .icons-holder ul.icons-pack { align-items: center; display: flex; height: 50%; } header.side-classic .icons-pack li:first-child { border-left: none; } header.side-classic .icons-holder li hr { background-color: rgba(232, 232, 232, 0.5); height: 19px; position: absolute; top: -3px; width: 1px; border: medium none; } header.side-classic .icons-holder ul.icons-pack > li.icon { margin: auto; padding: 13px 0; text-align: center; width: inherit; position: relative; height: 54px; display: table-cell; } header.side-classic .icons-pack li.search .search-form input { background: none repeat scroll 0 0 transparent; border: medium none; height: 32px; outline: 0; } header.side-classic .icons-holder ul.icons-pack li a { top: 0; } header.side-classic .icons-pack li span { vertical-align: middle; height: 54px; line-height: 54px; } /*** Navigation ***/ header.side-classic nav { width: 100%; } header.side-classic nav > ul { margin-top: 40px; } header.side-classic .style-center nav > ul > li{ margin-bottom: 10px; } header.side-classic nav > ul > li { padding: 0; margin: 0 0 25px; -webkit-transition: all .4s; -moz-transition: all .4s; -ms-transition: all .4s; -o-transition: all .4s; transition: all .4s; } header.side-classic nav ul > li a { padding: 2px 20px 2px 20px; } header.side-classic .style-center nav ul > li a{ padding-left: 0; } header.side-classic nav > ul > li, header.side-classic .style-left nav ul li.has-dropdown:not(.megamenu) ul li .menu-title { -webkit-transition: all .4s; -moz-transition: all .4s; -ms-transition: all .4s; -o-transition: all .4s; transition: all 400ms; } header.side-classic nav span { vertical-align: middle; text-align: center; } header.side-classic .style-left nav > ul > li > a span.title { padding-left: 0; margin-left: 0; } header.side-classic nav > ul > li > a span.icon { margin-right: 5px; } header.side-classic nav > ul > li > a span.menu-separator { margin-top: 4px; margin-left: 7px; transition: color 800ms ease 0s; width: 0; display: block; border-bottom: 1px solid #ffffff; } header.side-classic nav > ul > li > a span.menu-title { display: block; margin-left: 0; } header.side-classic nav ul li:hover span.menu-title { transition: all 0.3s ease; } header.side-classic nav .menu-title .icon { width: 25px; text-align: center; font-size: 1.2em; } header.side-classic nav .menu-title span { -webkit-transition: color .3s; -moz-transition: color .3s; -ms-transition: color .3s; -o-transition: color .3s; transition: color .3s; } /*** DropDown ***/ header.side-classic nav > ul > li.has-dropdown:not(.megamenu) ul a{ font-weight: normal; line-height: 1.5em; padding: 0 30px; } header.side-classic nav > ul > li.has-dropdown:not(.megamenu) a { color: inherit; } header.left.side-classic nav.navigation ul li.megamenu > ul > li, header.left.side-classic nav.navigation li.megamenu > .dropdown { margin-left: -40px; } header.left.side-classic nav.navigation ul li.megamenu > ul > li:last-child { margin-right: 30px; } header.right.side-classic nav.navigation ul li.megamenu > ul > li:last-child { margin-left: 30px; } header.left.side-classic nav.navigation ul > li.has-dropdown:not(.megamenu) > ul.dropdown { top: 100%; left: 0; position: relative; opacity: 1; margin-top: 0; } header.left.side-classic nav.navigation > ul > li.has-dropdown:not(.megamenu) > ul { padding-top: 6px; padding-left: 10px; padding-right: 10px; } header.left.side-classic nav.navigation > ul > li.has-dropdown:not(.megamenu) ul.dropdown ul.dropdown { padding: 5px 0 10px 30px; } header.right.side-classic nav > ul li.megamenu > ul > li { float: right; margin-right: -10px; } header.right.side-classic nav.navigation li.megamenu > .dropdown { top: 0; right: 100%; padding: 30px 0; margin-top: 0; margin-right: -10px; } header.right.side-classic nav li.megamenu > .dropdown > li.menu-item > a, header.right.side-classic nav li.megamenu .dropdown li.menu-item > a { text-align: right; } header.right.side-classic nav > ul > li { position: relative; } header.right.side-classic nav.navigation ul > li.has-dropdown:not(.megamenu) > ul.dropdown { top: 100%; /*width: 100%;*/ right: 0; position: relative; margin-top: 0; opacity: 1; } header.right.side-classic nav.navigation > ul > li.has-dropdown:not(.megamenu) > ul { padding-top: 6px; padding-right: 10px; padding-left: 10px; } header.right nav.navigation li.has-dropdown:not(.megamenu) .dropdown .dropdown { position: relative; right: 0; top: 0; display: none; } header.right nav.navigation li.has-dropdown:not(.megamenu) .dropdown .dropdown .megamenu-dropdown-overlay, header.side-classic nav.navigation > ul > li.has-dropdown:not(.megamenu) .dropdown .megamenu-dropdown-overlay { background-color: transparent; } header.side-classic nav.navigation ul > li:not(.megamenu) > ul.dropdown li { float: none; display: block; margin-bottom:3px; } header.side-classic nav > ul > li.megamenu > .expanded-menu ul { display: block !important; visibility: visible !important; opacity: 1 !important; } header.side-classic nav > ul > li.has-dropdown > a .icon-angle-right { display: inline-block; position: absolute; top:0; } header.left.side-classic nav > ul > li.has-dropdown > a .icon-angle-right { right: 20px; } header.right.side-classic nav > ul > li.has-dropdown > a .icon-angle-right { left: -10px; transform: rotateY(180deg); top: 3px; } /****** Footer ******/ /*hide footer in header side*/ nav.navigation-mobile + .wrap footer{ display: none; } header.side-classic .footer-socials li.info > a > span { font-size: 25px; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } header.side-classic .footer-socials li a span, header.side-classic .icons-pack li a span { left: 0; margin: auto; position: absolute; right: 0; } header.side-classic .footer-socials li a .default, header.side-classic .icons-pack li a .default { top: 0; } header.side-classic .footer-socials li a .hover, header.side-classic .icons-pack li a .hover { top: -54px; } header.side-classic div.footer { position: absolute; bottom: 0; width: 100%; } header.side-classic div.footer .footer-content { margin-bottom: 10px; } header.side-classic div.footer ul { list-style: none; display: flex; text-align: center; width: 100%; border-top: 1px solid rgba(210, 210, 210, 0.73); justify-content:center; } header.side-classic div.footer ul li { border-right: 1px solid rgba(210, 210, 210, 0.73); float: left; height: 52px; position: relative; width: inherit; } header.side-classic div.footer ul li:last-child { border-right: none; } header.side-classic div.footer ul li a, header.side-classic .icons-pack li a { cursor: pointer; display: inline-block; height: 100%; left: 0; line-height: 50px; overflow: hidden; position: absolute; width: 100%; } header.side-classic div.footer ul li.info, header.side-modern .footer .info a { position: relative; cursor: pointer; } header.side-classic .icons-pack li.search > a, header.side-classic div.footer ul li.info > a { z-index: 10; } header.side-classic div.footer ul li.info .footer-content .separated { letter-spacing: 1px; display: block; } header.side-classic div.footer ul li.info .footer-content, header.side-classic .icons-pack li.search .search-form, header.side-modern .footer .info .footer-content { margin-bottom: 0; position: absolute; height: 54px; z-index: 1; } header.side-classic div.footer ul li.info .footer-content, header.side-classic .icons-pack li.search .search-form { display: block; left: 0; letter-spacing: 3px; overflow: hidden; text-align: left; width: 100%; top: 0; opacity: 0; min-width: 100px; z-index: 0; } header.side-classic .icons-holder ul.icons-pack > li.searchAlone { margin: 0 0 0 10%; text-align: left; width: 10%; } header.side-classic div.footer ul li.info .footer-content { min-width: 300%; } header.side-classic div.footer ul li.info .footer-content { padding: 7px 0 0 15px; } header.side-classic .icons-pack li.search .search-form { padding: 10px 0 0; } header.side-classic .icons-pack li.search .search-form form .searchBtn { position: absolute; left: 0; opacity: 0; } header.side-classic div.footer ul li.info .footer-content span, header.side-classic .icons-pack li.search .search-form form, header.side-modern .footer .info .footer-content span { white-space: normal; line-height: 54px; height: 100%; width: 100%; } header.side-classic div.footer ul li.info .footer-content span { line-height: 10px; font-size: 10px; } header.side-classic div.footer ul li span { font-size: 15px; height: 54px; line-height: 54px; vertical-align: middle; } /*** left ***/ header.side-classic div.content.side.style-left .logo a{ text-align: left; } header div.content.side.style-left .logo { padding-left: 20px; } header.side-classic .style-left nav ul, header.side-classic .style-left nav ul li > a, header.side-classic .style-left div.footer ul li.info .footer-content p { text-align: left; } header.side-classic .style-left nav .menu-title .title { padding-left: 7px; } header.side-classic .style-left nav > ul > li.megamenu ul ul .menu-title .title { padding: 0; margin: 0; } header.side-classic .style-left nav ul li.has-dropdown:not(.megamenu) ul ul { background-color: transparent; } /*** Center ***/ header.side-classic div.content.side.style-center .logo a{ text-align: center; } header div.content.side.style-center .logo { margin-left: auto; margin-right: auto; } header.side-classic div.content.side.style-center nav { display: table; margin-left: auto; margin-right: auto; text-align: center; } header.side-classic .style-center .logo a { margin: auto; } header.side-classic .style-center nav > ul > li > a .menu-title span { display: block; margin-left: auto; margin-right: auto; } header.side-classic .style-center nav > ul > li > a .menu-title .icon { margin-bottom: 3px; } header.side-classic .style-center nav > ul > li > a .menu-title .title { margin-bottom: 0; position: relative; } header.side-classic .style-center nav > ul > li > a span.menu-separator { margin: 4px auto 0; } header.side-classic .style-center nav .menu-title { letter-spacing: 2px; } header.side-classic div.footer.style-center { text-align: center; } /*** Right ***/ header.side-classic div.content.side.style-right .logo a{ text-align: right; margin-left: auto; } header div.content.side.style-right .logo { padding-right: 20px; } header.side-classic .style-right nav ul, header.side-classic .style-left div.footer ul li.info .footer-content p { text-align: right; } header.right.side-classic nav ul > li a { display: inline-block; } header.side-classic .style-right nav ul > li a { padding: 2px 20px 2px 0; } header.side-classic .style-right nav .menu-item-link { text-align: right; } header.right.side-classic nav > ul > li > a span.menu-separator { float: right; } header.side-classic .style-right nav .menu-title .title { padding-right: 7px; } header.side-classic .style-right nav .menu-title .icon { float: right; } header.side-classic .style-right nav > ul ul li { position: relative; } header.side-classic .style-right nav ul li.megamenu ul ul li:hover .menu-title, header.side-classic .style-right nav ul li.has-dropdown:not(.megamenu) ul li:hover > a .menu-title, header.side-classic .style-right nav ul li.has-dropdown:not(.megamenu) ul ul li:hover .menu-title { margin-right: 5px; } header.side-classic div.footer.style-right { text-align: right; } /*------------------------- Header Side - New Classic(Standard mode) ------------------------*/ header.side-classic.standard-mode div.content.side .logo{ padding: 0 30px; } header.side-classic.standard-mode .icons-holder { border: none; } header.side-classic.standard-mode .icons-pack li a .hover, header.side-classic.standard-mode .footer-socials li a .hover{ display: none; } header.side-classic.standard-mode .icons-pack li a, header.side-classic.standard-mode .footer-socials li a{ transition: color .3s; } header.side-classic.standard-mode .icons-pack li a, header.side-classic.standard-mode .icons-pack li a span, header.side-classic.standard-mode .footer-socials li a, header.side-classic.standard-mode .footer-socials li a span{ position: relative; } header.side-classic.standard-mode .icons-holder ul.icons-pack > li.icon{ margin: 0 20px 0 0; width:auto; position: relative; padding: 0; height: auto; } header.side-classic.standard-mode .icons-holder ul.icons-pack li a{ display: inline; } header.side-classic.standard-mode div.content.side .icons-pack{ margin: 0; } header.side-classic.standard-mode nav .menu-title .title { padding: 0; } header.side-classic.standard-mode nav > ul{ margin-top: 25px; } header.side-classic.standard-mode nav > ul > li{ margin-bottom: 17px; } header.side-classic.standard-mode nav ul > li a{ padding: 2px 30px; } header.side-classic.standard-mode .side nav > ul > li > a .menu-title .title > span{ padding-left: 8px; } header.side-classic.standard-mode div.footer .footer-content { margin-bottom: 40px; padding: 0 30px; text-align:center; } header.side-classic.standard-mode div.footer .footer-content .copyright p { line-height: 1.4em; } header.side-classic div.footer.footer .footer-content .copyright p{ font-size: 14px; } header.side-classic.standard-mode div.footer ul, header.side-classic.standard-mode div.footer ul li{ border: none; } header.side-classic.standard-mode div.footer ul li{ margin: 0 15px 0 0; width:auto; padding: 0; height: auto; } header.side-classic.standard-mode div.footer ul li:last-child{ margin-right: 0; } /*Center Align*/ header.side-classic.standard-mode div.content.style-center .icons-pack, header.side-classic.standard-mode div.content.style-right .icons-pack{ display: block; } header.side-classic.standard-mode div.content.style-center .icons-holder ul.icons-pack > li.icon{ display: inline-block; text-align: center; float: none; } header.side-classic.standard-mode div.content.style-center .icons-holder ul.icons-pack > li.icon:last-child{ margin-right: 0; } header.side-classic.standard-mode .style-center div.footer ul, header.side-classic.standard-mode .style-right div.footer ul{ display: block; } header.side-classic.standard-mode .style-center div.footer ul li{ display: inline-block; float: none; } header.side-classic.standard-mode .style-center nav > ul > li > a .menu-title .icon{ display: inline-block; margin: 0 3px 0 0; } header.side-classic.standard-mode .style-center nav > ul > li > a .menu-title span{ display: inline-block; } header.side-classic.standard-mode .style-center div.footer .footer-content{ text-align: center; } /*Right Align*/ header.side-classic.standard-mode div.content.style-right .icons-holder ul.icons-pack > li.icon{ display: inline-block; text-align: right; float: right; } header.side-classic.standard-mode .style-right div.footer ul li{ display: inline-block; float: right; margin: 0 0 0 15px; } header.side-classic.standard-mode .style-right .icons-holder ul.icons-pack > li.icon{ margin: 0 0 0 20px; } header.side-classic.standard-mode .style-right nav > ul > li > a span.icon{ margin-right: 0; margin-left: 5px; } header.side-classic.standard-mode .side.style-right nav > ul > li > a .menu-title .title > span{ padding-left: 0; padding-right: 8px; float: left; } header.side-classic.standard-mode .style-right div.footer ul{ float: right; } header.side-classic.standard-mode .style-right div.footer .footer-content{ text-align: right; } /*------------------------- Header Side - Modern -------------------------*/ header.side-modern { width: 70px; overflow: visible; } header.side-modern .side .logo { display: block; text-align: center; width: 100%; border-bottom: 1px solid; } header.side-modern .logo a { padding-left: 10px; padding-right: 10px; } header.side-modern .side .logo img { margin: 15px auto; text-align: center; width: 90%; height:initial; } header.side-modern .icons-pack li span { font-size: 20px; } /****** Icons ******/ header.side-modern .search-form { position: absolute; height: 65px; top: 0; } header.left.side-modern .search-form { transform: rotateY(90deg); transform-origin: left top; display: none; } header.right.side-modern .search-form { transform: rotateY(-90deg); transform-origin: right top; display: none; } header.left.side-modern .search-form { left: 65px; } header.right.side-modern .search-form { right: 65px; } header.side-modern .search-form input[type="text"] { height: 65px; width: 185px; padding-left: 20px; line-height: 65px; display: block; border: none; } header.side-modern .search-form input[type="submit"] { display: none; } header.side-modern .icons-pack { width: 100%; } header.side-modern .icons-pack li, header.side-modern .nav-modern-button { float: none; border-left: none; border-bottom: 1px solid; height: 65px; text-align: center; line-height: 72px; } header.side-modern .nav-modern-button span { transition: color 500ms; font-size: 20px; } header.side-modern .icons-pack li a, header.side-modern .nav-modern-button { width: 65px; height: 65px; position: relative; display: block; overflow: hidden; } header.side-modern .icons-pack li a span, header.side-modern .nav-modern-button span { position: absolute; width: 65px; height: 65px; line-height: 65px; } header.left.side-modern .icons-pack li a span.default, header.left.side-modern .nav-modern-button span.default { left: 0; } header.right.side-modern .icons-pack li a span.default, header.right.side-modern .nav-modern-button span.default { right: 0; } header.side-modern .icons-pack li a span.hover, header.side-modern .nav-modern-button span.hover { opacity: 0; } header.left.side-modern .icons-pack li a span.hover, header.left.side-modern .nav-modern-button span.hover { left: -65px; } header.right.side-modern .icons-pack li a span.hover, header.right.side-modern .nav-modern-button span.hover { right: -65px; } /****** Navigation & DropDown ******/ .side-modern .nav-modern-side { position: relative; } header.side-modern .side nav { display: none; position: absolute; top: 0; width: 0; padding: 0 0; overflow: hidden; opacity: 1; -webkit-transition: opacity 1000ms cubic-bezier(0.250, 0.460, 0.450, 0.940); -moz-transition: opacity 1000ms cubic-bezier(0.250, 0.460, 0.450, 0.940); -o-transition: opacity 1000ms cubic-bezier(0.250, 0.460, 0.450, 0.940); transition: opacity 1000ms cubic-bezier(0.250, 0.460, 0.450, 0.940); /* easeOutQuad */ } header.left.side-modern .side nav { left: 100%; } header.right.side-modern .side nav { right: 100%; } .side-modern .nav-modern-side:hover nav { display: block; } header.side-modern .side nav ul { transition: opacity 200ms ease 500ms; /* easeOutQuad */ opacity: 1; } header.side-modern .side nav li.has-dropdown > .dropdown > li.has-dropdown { float: none; display: block; } header.side-modern .side nav.navigation > ul > li > ul.dropdown { display: block; left: 0; top: 0; position: relative; } header.side-modern .side nav.navigation li.empty-megamenu { height: 21px; } header.side-modern .side nav > ul > li { display: inline-block; padding: 20px 30px; background-color: rgba(30, 24, 30, 0.72); float: left; width: 200px; overflow-y: hidden; opacity: 0; } header.side-modern .side nav > ul > li { transform: rotateY(90deg); transform-origin: left bottom; } header.right.side-modern .side nav > ul > li { float: right; text-align: right; transform-origin: right bottom; transform: rotateY(-90deg); } header.side-modern .side nav > ul > li > a { border-bottom: 1px solid; vertical-align: middle; padding-right: 10px; margin-bottom: 10px; } header.side-modern .side nav > ul > li > a > span { display: block; margin-left: auto; margin-right: auto; margin-bottom: 5px; } header.side-modern .side nav > ul > li > a > span > .icon { font-size: 25px; width: 100%; display: none; } header.side-modern .side nav.navigation > ul > li.has-dropdown > .dropdown { opacity: 1 !important; visibility: visible !important; margin-top: 0; } header.side-modern .side nav.navigation > ul > li.has-dropdown > .dropdown .megamenu-dropdown-overlay{ background-color: transparent; } header.side-modern nav.navigation > ul > li > ul.dropdown li.has-dropdown ul { opacity: 0; display: none; -webkit-transition: opacity 500ms cubic-bezier(0.455, 0.030, 0.515, 0.955); -moz-transition: all 500ms cubic-bezier(0.455, 0.030, 0.515, 0.955); -o-transition: all 500ms cubic-bezier(0.455, 0.030, 0.515, 0.955); transition: opacity 500ms cubic-bezier(0.455, 0.030, 0.515, 0.955) 200ms; } header.side-modern nav.navigation > ul > li > ul.dropdown li.has-dropdown:hover ul { display: block; opacity: 1; padding: 7px 5px; } header.side-modern nav.navigation li.has-dropdown:not(.megamenu) .dropdown .dropdown { background-color: transparent; left: 0; padding: 3px 10px; position: relative; margin-top: 0; max-height: 85px; overflow-y: scroll; } header.side-modern .side nav.navigation ul li a { transition: all 300ms; } header.side-modern .navigation li a span:not(.menu-separator-block) { transition: none; } header.side-modern .side nav.navigation ul li a:hover { padding-left: 5px; } header.side-modern nav.navigation ul ul.dropdown li a { display: block; float: none; padding: 5px 0 3px; } header.side-modern .side nav.navigation > ul > li > ul.dropdown > li > ul.dropdown a { padding-top: 0; } header.side-modern nav.navigation ul ul li ul.dropdown li { float: none; } /***** simple style *****/ header.side-modern .style-style1.side nav{ overflow: visible; } header.side-modern .style-style1.side nav ul{ transform: rotateY(90deg); transform-origin: left bottom; } header.side-modern.right .style-style1.side nav ul{ transform: rotateY(-90deg); transform-origin: right bottom; } header.side-modern .style-style1.side nav ul li{ opacity: 1; transform: rotateY(0deg); transform-origin: center; padding: 20px 0; background-color: transparent; border-bottom: 1px solid; transition: background-color .3s; height: 65px; overflow: visible; } header.side-modern.right .style-style1.side nav ul li{ text-align: right; } header.side-modern .style-style1.side nav ul li:last-child{ border-bottom: none; } header.side-modern .style-style1.side nav ul li a{ border-bottom: 0; padding-left:20px; padding-right:20px; margin-bottom: 0; line-height: 14px; } header.side-modern .style-style1.side nav ul.dropdown li.menu-item a > span{ display: block; margin: 0 auto 5px; } header.side-modern .style-style1.side nav.navigation ul li.has-dropdown:after{ content: '>'; position: absolute; top: 21px; } header.side-modern.left .style-style1.side nav.navigation ul li.has-dropdown:after{right: 12px;} header.side-modern.right .style-style1.side nav.navigation ul li.has-dropdown:after{left: 12px; content: "<";} header.side-modern .style-style1.side nav.navigation > ul > li.has-dropdown .dropdown{ top: -44px; padding: 0; overflow: visible; max-height: none; } header.side-modern.left .style-style1.side nav.navigation > ul > li.has-dropdown .dropdown{ left:100%; border-left: 1px solid ; } header.side-modern.right .style-style1.side nav.navigation > ul > li.has-dropdown .dropdown{ left: -100%; border-right: 1px solid ; } header.side-modern .side.style-style1 nav.navigation ul li a:hover{ padding-left:25px; } header.side-modern .side.style-style1 nav.navigation ul ul.dropdown li a{ padding: 0 20px; } /****** Footer ******/ header.side-modern .side .footer { border-top: 1px solid; bottom: 0; height: 65px; position: absolute; text-align: center; width: 100%; line-height: 65px; } header.side-modern .footer .info { width: inherit; height: inherit; } header.side-modern .footer .info > a { position: absolute; width: 100%; height: 100%; left: 0; line-height: 65px; font-size: 20px; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; } header.side-modern .footer .info .footer-content { height: 64px; top: 0; white-space: nowrap; padding: 0; line-height: 64px; } header.left.side-modern .footer .info .footer-content { left: 65px; } header.right.side-modern .footer .info .footer-content { right: 65px; } header.left.side-modern .footer .copyright { padding: 25px 25px 25px 0; } header.right.side-modern .footer .copyright { padding: 25px 0 25px 25px; } header.side-modern .footer .copyright p { transition: color 500ms; margin-bottom: 0; } header.left.side-modern .footer .copyright p { border-left: 1px solid; padding-left: 15px; } header.right.side-modern .footer .copyright p { border-right: 1px solid; padding-right: 15px; } header.side-modern .footer .footer-socials, header.side-modern .footer .copyright { opacity: 0; display: inline-table; } header.left.side-modern .footer .footer-socials, header.left.side-modern .footer .copyright { transform: rotateY(90deg); transform-origin: left top; } header.right.side-modern .footer .footer-socials, header.right.side-modern .footer .copyright { transform: rotateY(-90deg); transform-origin: right top; } header.side-modern .footer .info .footer-content span, header.side-classic .icons-pack li.search .search-form form, header.side-modern .footer .info .footer-content ul { line-height: normal; } header.side-modern .footer .info .footer-content ul { list-style: none; } header.left.side-modern .footer .info .footer-content ul { float: left; } header.right.side-modern .footer .info .footer-content ul { float: right; } header.side-modern .footer .info .footer-content ul a { display: block; line-height: 65px; position: relative; } header.side-modern .footer .info .footer-socials span { position: absolute; } header.side-modern .footer .info .footer-socials span.default { top: 2px; } header.side-modern .footer .info .footer-socials span.hover { top: -50px; } header.side-modern .footer .info .footer-content ul { display: inline-flex; transition: border-color 500ms; } header.side-modern .footer .info .footer-content ul { overflow: hidden; } header.left.side-modern .footer .info .footer-content ul { padding: 25px 5px 25px 25px; } header.right.side-modern .footer .info .footer-content ul { padding: 25px 25px 25px 5px; } header.side-modern .footer .info .footer-content ul li { width: 30px; height: 15px; } header.left.side-modern .footer .info .footer-content ul li { padding-right: 15px; } header.right.side-modern .footer .info .footer-content ul li { padding-left: 15px; } header.right.side-modern .footer .info .footer-content ul li { padding-left: 15px; float: right; } /*------------------------- Mobile Navigation Button -------------------------*/ header .navigation-button, header .mobile-shopcart, header .mobile-sidebar{ display: none; width: 32px; height: 32px; text-align: center; text-decoration: none; margin-right: 10px; float: right; position: relative; top: 50%; transform: translate(0,-50%)!important; } header .navigation-button span{ line-height: 32px; font-size: 32px; } header .mobile-shopcart span{ line-height: 32px; font-size: 26px; } header .mobile-sidebar i{ line-height: 32px; font-size: 24px; } /* Mobile Navigation */ .navigation-mobile{ width: 100%; padding: 0 60px; overflow: hidden; display: none; z-index: 1; text-align: left; } .navigation-mobile ul{ list-style: none; margin:0; } .navigation-mobile li{ font-size: 14px; font-weight: 400; position: relative; } .navigation-mobile li ul{ margin-left: 15px; } .navigation-mobile .sub-menu li{ border-bottom: none; padding: 3px 0; } .navigation-mobile li a{ padding: 15px 0; font-size: 14px; line-height: 1em; display: inline-block; position: relative; z-index: 1; font-family: 'Roboto', sans-serif; width: 85% } .navigation-mobile .dropdown li a{ font-size: 13px; } .navigation-mobile li a .hover-effect{ display: none; } .navigation-mobile li .icon{ margin-right: 10px; } .navigation-mobile li .arrow{ display: inline-block; padding: 15px 10px; width: 100%; position: absolute; top: 0; left: 0; text-align: right; font-size: 16px; cursor: pointer; line-height: 14px; } .navigation-mobile .sub-menu li a{ padding: 3px 0; } .navigation-mobile > ul{ padding:0; } .navigation-mobile a{ text-decoration: none; } .navigation-mobile li.separator{ display: none; } .navigation-mobile .dropdown{ display: none; margin-bottom: 15px; } .navigation-mobile .dropdown li a, .navigation-mobile .dropdown .dropdown li a, .navigation-mobile .dropdown li .arrow{ padding: 10px 0; } .navigation-mobile .dropdown .dropdown li{ margin-bottom: 0; } /*** Mobile Navigation Search Form ***/ .navigation-mobile .search-form{ background-color: #efefef; margin-bottom: 30px; height: 50px; } .navigation-mobile .search-form fieldset{ position: relative; } .navigation-mobile .search-form input[type="text"]{ background-color: transparent; border: none; height: 50px; line-height: 50px; padding: 0 40px 0 10px; position: absolute; width: 100%; top: 0; left: 0; font-family: 'Roboto', sans-serif; font-size: 14px; } .navigation-mobile .search-form input[type="text"]:focus{ outline: none; } .navigation-mobile .search-form input[type="submit"]{ position: absolute; background: transparent url("assets/img/mobile-search-dark.png") no-repeat center; width: 19px; height: 19px; border: none; top: 15px; right: 20px; } /** Responsive Header Dark/Light variation **/ /** Light **/ header.header-light .navigation-button, header.header-light .mobile-sidebar, header.header-light .mobile-shopcart, header.header-light { color: #000; } .navigation-mobile.header-light{ background-color: #fff; } .navigation-mobile.header-light li{ border-bottom: 1px solid #e0e0e0; } .navigation-mobile.header-light a, .navigation-mobile.header-light li .arrow, .navigation-mobile.header-light .sub-menu li a{ color: #8a8a8a; } .navigation-mobile.header-dark a.open{ color: #ffffff; } .navigation-mobile.header-light a.open{ color: #000000; } .navigation-mobile.header-light .search-form{ background-color: #efefef; } /** Dark **/ header.header-dark .navigation-button, header.header-dark .mobile-sidebar, header.header-dark .mobile-shopcart, header.header-dark{ color: #fff; } .navigation-mobile.header-dark{ background-color: #252525; } .navigation-mobile.header-dark li{ border-bottom: 1px solid #424242; } .navigation-mobile.header-dark a, .navigation-mobile.header-dark li .arrow, .navigation-mobile.header-dark .sub-menu li a{ color: #a5a5a5; } .navigation-mobile.header-dark .search-form{ background-color: #424242; } /** Removing Borders **/ .navigation-mobile.header-light li li, .navigation-mobile.header-light li:last-child, .navigation-mobile.header-dark li li, .navigation-mobile.header-dark li:last-child{ border: none; } /*** responsive sidebar in tablet ***/ .layout > .smart-sidebar{ position: fixed; right: -313px; z-index: 9999; height: 100%; text-align: left; padding-top: 30px; background-color: #393939; overflow: scroll; padding-bottom: 30px; -webkit-transition: right 600ms cubic-bezier(0.23, 1, 0.32, 1); transition: right 600ms cubic-bezier(0.23, 1, 0.32, 1); min-height:100%; overflow-x:hidden !important; } .layout > .smart-sidebar div[class *= 'overlay']{ display: none; } .layout > .smart-sidebar.open{right:0;} .layout > .wrap.move{ margin-right: 313px !important; -webkit-box-shadow: 3px 1px 16px rgba(0,0,0,.75); -moz-box-shadow: 3px 1px 16px rgba(0,0,0,.75); box-shadow: 3px 1px 16px rgba(0,0,0,.75) } .smart-sidebar .widget .widget-title{ line-height: 15px; min-height: 15px; } .smart-sidebar.light-sidebar .widget{ margin-bottom: 25px; } .smart-sidebar.sidebar .widget{ padding: 0 0 25px; } .smart-sidebar.sidebar .widget_nav_menu{ padding-left: 15px; } .smart-sidebar .close-sidebar{display: none;} /*--------------------------------------------------------- BODY ---------------------------------------------------------*/ body { height: 100%; } .layout{ position: relative; } .layout-container { position: relative; transition: .3s -webkit-filter linear; } .layout-container.blur{ -webkit-filter:blur(10px); -moz-filter:blur(20px); -o-filter:blur(20px); filter: blur(20px);} .layout-container > .color-overlay, .layout-container > .texture-overlay, .layout-container > .bg-image { height: 100%; position: absolute; width: 100%; top: 0; left: 0; } .layout-container > .color-overlay { z-index: -4; } .layout-container > .texture-overlay { z-index: -5; } .layout-container > .bg-image { z-index: -6; } /****/ #pageLoadingOverlay{ position:fixed; top:0; left:0; width:100%; height: 100%; background: #fff; opacity: 1; z-index: 10000; } #pageLoadingOverlay .loading-text{ display: none; } /*--------------------------------------------------------- content ---------------------------------------------------------*/ .layout { margin-left: auto; margin-right: auto; width: 99.8%; overflow: hidden; } main { margin-left: auto; margin-right: auto; } main .color-overlay { height: 100%; position: absolute; width: 100%; z-index: -1; top: 0; left: 0; } main .texture-overlay { height: 100%; position: absolute; width: 100%; z-index: -2; top: 0; left: 0; } main .bg-image { height: 100%; position: absolute; width: 100%; z-index: -3; top: 0; left: 0; } main > .content { position: relative; min-height: 500px; } main .content .type-page .vc_empty-placeholder:first-child { margin-bottom: 0 !important; clear: both; } .layout > .wrap { width: 100%; position: relative; -webkit-transition: margin-right 600ms cubic-bezier(0.23, 1, 0.32, 1); transition: margin-right 600ms cubic-bezier(0.23, 1, 0.32, 1); } /*--------------------------------------------------------- sidebar ---------------------------------------------------------*/ /* Style */ .right-align { text-align: right; } .left-align { text-align: left; } .center-align { text-align: center; } .shadow { -moz-box-shadow: 3px 3px 5px 6px #ccc; -webkit-box-shadow: 3px 3px 5px 6px #ccc; box-shadow: 3px 3px 5px 6px #ccc; } /* Normal */ .sidebar { position: relative; z-index: 2; } .sidebar > .color-overlay { height: 100%; position: absolute; width: 100%; z-index: -1; top: 0; left: 0; } .sidebar > .texture-overlay { height: 100%; position: absolute; width: 100%; z-index: -2; top: 0; left: 0; } .sidebar > .bg-image { height: 100%; position: absolute; width: 100%; z-index: -3; top: 0; left: 0; } .sidebar .widget { padding: 20px 0; margin: 0 20px; } .sidebar.box .widget{ padding: 30px; margin: 0; } /* Border */ .sidebar.border .widget { border-bottom: 1px solid; } .sidebar.border .widget:last-child { border-bottom: none; } /* Box */ .sidebar.box > .color-overlay { background: transparent !important; } .sidebar.box > .texture-overlay { background-image: none !important; } .sidebar.box > .bg-image { background-image: none !important; } .sidebar.box{padding:5px;} .sidebar.box .widget { margin-bottom: 5px; border-radius: 3px; position: relative; overflow: hidden; } /*.sidebar .widget-title { text-align: inherit; }*/ /* Sidebar Dark/Light */ .dark-sidebar, .dark-sidebar a, .dark-sidebar a span, .dark-sidebar select { color: rgba(0, 0, 0, 0.6); transition: color 0.3s; } .sidebar.border.dark-sidebar .widget { border-color: rgba(0, 0, 0, 0.3); } .dark-sidebar .widget-title, .dark-sidebar a:hover { color: rgba(0, 0, 0, 1); } .light-sidebar, .light-sidebar a, .light-sidebar select, .light-sidebar a span { color: rgba(255, 255, 255, 0.6); transition: color 0.3s; } .sidebar.border.light-sidebar .widget { border-color: rgba(255,255,255,0.3); } .light-sidebar .widget-title, .light-sidebar a:hover, .light-sidebar a:hover span{ color: rgba(255, 255, 255, 1); } /* Skill Widget */ .sidebar.right-align .widget_md_progress .progress-list .bar-percentage { float: right; display: block; } .sidebar.right-align .widget_md_progress .progress-list .bar-container { position: relative; top: 15px; } .sidebar.right-align .widget_md_progress .progress-list .bar-container .bar { float: right; } .sidebar.right-align .widget_md_progress .progress-list .progressbar .title { width: 100%; text-align: right; margin-top: 5px; position: relative; left: -3px; } /* Double Sidebar */ main.retina-screen-main .sidebar{ display: block !important; } .sidebar.right-sidebar { float: right; } /* Wordpress Nav Menu Widget */ .sidebar.right-align .widget_nav_menu .menu-menu-container { float: right; } .sidebar.left-align .widget_nav_menu .menu-menu-container { margin-left: 17px; } .sidebar.right-align .widget_nav_menu .menu-menu-container { margin-right: 17px; direction: rtl; width: 100%; } .sidebar.center-align .widget.widget_recent_entries ul li, .sidebar.center-align .widget.widget_recent_entries ul li:hover { background-image: none; } .sidebar.center-align .widget.widget_archive ul, .sidebar.center-align .widget_nav_menu .menu-menu-container ul { list-style-type: none; } .sidebar .widget_nav_menu .menu-menu-container ul li { margin: 10px 0; } /* Calendar Widget */ .widget_calendar #calendar_wrap { font-size: 11px; text-align: center; } .sidebar .widget_calendar #calendar_wrap { display: inline-block; } /* Menu Widget */ .sidebar.right-align .widget_calendar #calendar_wrap { display: inline-block; margin-right: -6px; } /* Sidebar Box Separator */ .sidebar.box .separator{ width: 150%; margin-left: -50px; background-color: #ebeaea; height: 2px; margin-bottom: 30px; } .sidebar.box .widget{ padding-top:0; margin-bottom: 20px; border-radius: 5px; } .sidebar.box .widget-md-text .text-widget-image{ margin-bottom: 10px; margin-top: 10px; } .sidebar.box .widget .widget-title { margin-bottom: 0; } .sidebar.box h4{ line-height: 50px; } /***************************************************** * Footer ******************************************************/ footer { margin-left: auto; margin-right: auto; position: relative; /*overflow: hidden;*/ } footer .color-overlay { height: 100%; position: absolute; width: 100%; z-index: -1; top: 0; left: 0; } footer .texture-overlay { height: 100%; position: absolute; width: 100%; z-index: -2; top: 0; left: 0; } footer .bg-image { height: 100%; position: absolute; width: 100%; z-index: -3; top: 0; left: 0; } footer .content { margin-left: auto; margin-right: auto; } #footer-bottom { position: relative; filter: blur(0); -webkit-filter: blur(0); } #footer-bottom > div:first-of-type{ margin:0 auto; padding: 10px 45px 10px 55px; } #footer-bottom > div:first-of-type:after{ content:" "; display: block; clear: both; } #footer-bottom .social-icons li{ font-size: 20px; list-style: none outside none; margin-right: 6px; display: inline; } #footer-bottom .social-icons span a { text-align: center; cursor: pointer; font-size: 17px; margin: 0 4px; padding: 1px 4px 1px; transition: all 0.5s ease; } #footer-bottom .social-icons span a:hover{ opacity: 0.4; /*color: #fff;*/ } #footer-bottom .copyright, #footer-bottom .social-icons{ min-height:0; } #footer-bottom .copyright p{ font-size: 13px; } #footer-bottom .copyright a{ font-family: inherit; font-size: inherit; color:inherit; font-weight: inherit; text-decoration: underline; } #footer-bottom .linear .copyright{ float: right; text-align: right; position: relative; top: 50%; transform: translateY(-50%); } #footer-bottom .linear{ height: inherit; } #footer-bottom .centered{ position: absolute; height: auto; top: 50%; left: 50%; -webkit-filter : blur(0px); transform: translateY(-50%) translateX(-50%); } #footer-bottom .centered .footer-spacer{ margin-top: 20px; } #footer-bottom .centered .copyright { text-align: center; font-size: 12px; } #footer-bottom .linear .social-icons { padding: 0; text-align: right; margin: 0; float: right; position: relative; top: 50%; transform: translateY(-50%); margin-left: 10px; } #footer-bottom .centered .social-icons { padding: 5px 0 0 0; text-align: center; } #footer-bottom .linear .logo { float:left; position: relative; top: 50%; transform: translateY(-50%); } #footer-bottom .centered .logo { text-align: center; } #footer-bottom .logo img { display: inline-block; max-height: 55px; max-width: 80%; } footer.footer-default .footer-widgets .widget-area div[class*="col-"] { height: inherit; } footer.footer-default .footer-widgets .widget-area.classicStyle.border .wrapContent{ position: relative; /*top:50%; transform: translateY(-50%);*/ } footer.footer-default .footer-widgets .widget-area.classicStyle.border .wrapContent .widget:last-child{ margin-bottom: 0; } footer.footer-default .footer-widgets.light .widget-area.classicStyle.border.split div[class*="col-"]{ padding: 0 25px; } .footer-widgets.light .widget-area.classicStyle.border{ height: auto; } .footer-widgets.light .widget-area.classicStyle.border .widget-md-text .text-widget-desc p{ padding: 0; } footer.footer-default .footer-widgets .widget-area.classicStyle.border div[class*="col-"]:before{ content: ""; width:1px; height: 100%; position: absolute; left: 0; top:0; } footer.footer-default .footer-widgets.light .widget-area.classicStyle.border div[class*="col-"]:before{ background-color: rgba(255,255,255,.2); } footer.footer-default .footer-widgets.dark .widget-area.classicStyle.border div[class*="col-"]:before{ background-color: rgba(0,0,0,.2); } footer.footer-default .footer-widgets .widget-area.classicStyle.border div[class*="col-"]:first-child:before{ display: none; } footer.footer-default .footer-widgets .widget-area.classicStyle div[class*="col-"]:first-child{ padding-left: 0; } footer.footer-default .footer-widgets .widget-area.classicStyle div[class*="col-"]:last-child{ padding-right: 0; } footer.footer-default div#footer-bottom div.container > * { display: inline-block; float: left; color: #FFFFFF; } footer hr.footer-separator{ width:100%; margin: 0; border: 0; } /** Parallax Footer **/ footer.footer-parallax{ position: fixed; bottom: 0; opacity: 1; } footer.footer-parallax .content{ opacity: 1; } main.has-parallax-footer{ position: relative; z-index: 10; box-shadow: rgba(0, 0, 0, 0.7) 0 105px 90px -90px; padding-bottom: 0; } /* Fix bug with magnific popup*/ body.mfp-zoom-out-cur .footer-parallax { right: auto !important; } /** Removing Footer Parallax in some pages **/ .error404 footer.footer-parallax, .woocommerce-page footer.footer-parallax, .search footer.footer-parallax{ position: relative !important; bottom: auto; opacity: 1; } .error404 footer.footer-parallax .content, .woocommerce-page footer.footer-parallax .content, .search footer.footer-parallax .content{ opacity: 1; } .error404 main.has-parallax-footer, .woocommerce-page main.has-parallax-footer, .search main.has-parallax-footer{ position: static; z-index: 10; box-shadow: none; padding-bottom: 0; margin-bottom: 0!important; } /***************************************************** * Go to top button ******************************************************/ .go-to-top{ width: 50px; height: 50px; position: fixed; right: 17px; bottom: 17px; cursor: pointer; display: none; z-index: 100; } .go-to-top.dark{ background: url("assets/img/back-to-top-dark.png") no-repeat center; } .go-to-top.light{ background: url("assets/img/back-to-top-light.png") no-repeat center; } /***************************************************** * Widget Area ******************************************************/ /*.widget a,*/ .widget p, .widget span, .widget a, .widget option, .textwidget{ font-size: 13px; line-height: 21px; font-weight: normal; letter-spacing: 0; } /* excluding wordpress text shortcode */ .vc_row .widget span{ font-size: inherit; line-height: inherit; font-weight: inherit; letter-spacing: inherit; } .dark, .dark a, .dark a span, .dark span, .dark select{ color: rgba(0, 0, 0, 0.6); transition: color 0.3s; } .dark .widget-title, .dark a:hover, .dark a:hover span{ color: rgba(0, 0, 0, 1); } .light, .light a, .light a span, .light select{ color: rgba(255, 255, 255, 0.6); transition: color 0.3s; } .light .widget-title, .light a:hover, .light a:hover span{ color: rgba(255, 255, 255, 1); } .dark .widget, .light .widget { margin-bottom: 40px; } .widget .widget-title { min-height: 30px; } /* calendar widget*/ .widget_calendar #calendar_wrap{ font-size: 11px; text-align: center; } .widget-area .widget_calendar .widget-title { margin-bottom: 25px; } .widget_calendar .cellSettingRight { width: 17px; float: right; text-align: center; margin-top: 10px; } .widget_calendar .cellSettingLeft { width: 17px; float: left; text-align: center; margin-top: 10px; } .widget_calendar table tr { height: 25px; } .widget_calendar table tr td { width: 37px; } .widget_calendar table tr td#prev, .widget_calendar table tr td#next { text-align: center; } .widget_calendar table caption { display: none; } .widget_calendar table tr th { font-weight: normal; height: 40px; text-align: center; } .sidebar .widget_calendar .widget-title { margin-bottom: 10px; } /* Twitter widget */ .twitter-recent-list{ list-style: none; } .twitter-recent-list li{ margin-bottom:23px; } .twitter-recent-list .twitter-widget-title{ font-size: 14px; } .twitter-recent-list .twitter-widget-img{ width: 22px; height: 22px; border-radius: 25px; margin-right: 12px; float: left; background-size: cover; background-color: #ccc; background-repeat: no-repeat; } ul.twitter-recent-list li span.create-at{ margin-left: 7px; font-size: 11px; } ul.twitter-recent-list li .twitter-widget-status, ul.twitter-recent-list li .twitter-widget-status{ margin-top: 5px; } .dark ul.twitter-recent-list li .twitter-widget-title, .dark-sidebar ul.twitter-recent-list li .twitter-widget-title{ color: rgba(0, 0, 0, .8); } .dark ul.twitter-recent-list li .create-at, .dark-sidebar ul.twitter-recent-list li .create-at{ color: rgba(0, 0, 0, .4); } .dark ul.twitter-recent-list li .twitter-widget-status a, .dark-sidebar ul.twitter-recent-list li .twitter-widget-status a{ color: rgba(0, 0, 0, 0.6); font-size: 12px; line-height: 20px; } .dark ul.twitter-recent-list li .twitter-widget-title:hover, .dark-sidebar ul.twitter-recent-list li .twitter-widget-title:hover, .dark ul.twitter-recent-list li .twitter-widget-status a:hover, .dark-sidebar ul.twitter-recent-list li .twitter-widget-status a:hover{ color: rgba(0, 0, 0, 1); } .light ul.twitter-recent-list li .twitter-widget-title, .light-sidebar ul.twitter-recent-list li .twitter-widget-title{ color: rgba(255,255,255, 0.8); } .light ul.twitter-recent-list li .create-at, .light-sidebar ul.twitter-recent-list li .create-at{ color: rgba(255,255,255, .4); } .light ul.twitter-recent-list li .twitter-widget-status a, .light-sidebar ul.twitter-recent-list li .twitter-widget-status a{ color: rgba(255,255,255, 0.6); font-size: 12px; line-height: 20px; } .light ul.twitter-recent-list li .twitter-widget-title:hover, .light-sidebar ul.twitter-recent-list li .twitter-widget-title:hover, .light ul.twitter-recent-list li .twitter-widget-status a:hover, .light-sidebar ul.twitter-recent-list li .twitter-widget-status a:hover{ color: rgba(255,255,255, 1); } /* Search Widget */ .sidebar.box .widget_search .separator{ margin-bottom: 0; } .sidebar.box .widget_search .search-form{ margin-top: 30px; } .widget_search .search-form { border-radius: 19px; height: 38px; position: relative; width: 85%; } .right-align.sidebar .widget_search .search-form{ margin-left: 15%; } .light .widget_search .search-form, .light-sidebar .widget_search .search-form{ background-color: rgba(255,255,255,0.1); } .dark .widget_search .search-form, .dark-sidebar .widget_search .search-form{ background-color: rgba(0,0,0,0.06); } .widget_search input { outline: none; border:none; } .widget_search input:first-child{ height: 38px; font-size: 14px; font-weight: 300; font-family: inherit; background-color: transparent; width: 100%; padding-left: 15px; line-height: 38px; } .sidebar.right-align .widget_search input:first-child{ float: right; padding-right: 15px; padding-left : 0; } .sidebar.right-align .widget_search form fieldset{ float: right; width: 100%; direction: rtl; } .widget_search input:last-child{ background-position: center center; background-repeat: no-repeat; border: none; } .sidebar.center-align .widget_search input:last-child{ float: left; } .light.right-align .widget_search input:last-child, .dark-sidebar.right-align .widget_search input:last-child{ left: 15px; transform: rotateY(180deg); right: auto; } .dark .widget_search input:first-child, .dark-sidebar .widget_search input:first-child { color: rgba(0, 0, 0, 0.82); } .dark .widget_search ::-webkit-input-placeholder, .dark-sidebar .widget_search ::-webkit-input-placeholder { /* WebKit browsers */ color:rgba(0, 0, 0, 0.82); } .dark .widget_search :-moz-placeholder, .dark-sidebar .widget_search :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color:rgba(0, 0, 0, 0.82); opacity: 1; } .dark .widget_search ::-moz-placeholder, .dark-sidebar .widget_search :-moz-placeholder { /* Mozilla Firefox 19+ */ color:rgba(0, 0, 0, 0.82); opacity: 1; } .dark .widget_search :-ms-input-placeholder, .dark-sidebar .widget_search :-ms-input-placeholder { /* Internet Explorer 10+ */ color:rgba(0, 0, 0, 0.82); } .light .widget_search input:last-child, .dark-sidebar .widget_search input:last-child { background-image: url("assets/img/search-light.png"); background-color: transparent; transition: opacity 0.3s,right .15s; position: absolute; top: 10px; right: 15px; width: 30px; background-position: center center; height: 20px } .dark-sidebar .widget_search input:last-child{ background-image: url("assets/img/search-dark.png"); } .light .widget_search input:last-child:hover, .dark-sidebar .widget_search input:last-child:hover { opacity: .7; right:11px; } .light .widget_search input:first-child, .light-sidebar .widget_search input:first-child { border: none; color: rgba(255, 255, 255, 0.6); } .light .widget_search ::-webkit-input-placeholder, .light-sidebar .widget_search ::-webkit-input-placeholder { /* WebKit browsers */ color: rgba(255, 255, 255, 0.6); } .light .widget_search :-moz-placeholder, .light-sidebar .widget_search :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: rgba(255, 255, 255, 0.6); opacity: 1; } .light .widget_search ::-moz-placeholder, .light-sidebar .widget_search ::-moz-placeholder { /* Mozilla Firefox 19+ */ opacity: 1; } .light .widget_search :-ms-input-placeholder, .light-sidebar .widget_search :-ms-input-placeholder{ /* Internet Explorer 10+ */ color: transparent; } .dark .widget_search input:last-child, .light-sidebar .widget_search input:last-child{ background-image: url("assets/img/search-dark.png"); background-color: transparent; transition: opacity 0.3s,right .15s; position: absolute; top: 10px; right: 15px; width: 30px; background-position: center center; height: 20px } .light-sidebar .widget_search input:last-child{ background-image: url("assets/img/search-light.png"); } .dark .widget_search input:last-child:hover, .light-sidebar .widget_search input:last-child:hover{ opacity: .7; right:11px; } /* Archieve widget */ .sidebar .widget.widget_archive ul, .sidebar .widget.widget_categories ul{ margin-left: 17px; } .sidebar.right-align .widget.widget_archive ul{ float: right; width: 100%; margin-right: 13px; } /* Md RECENT PORTFOLIO */ .widget.widget-md-recent-portfolio .item-list{ max-width: 285px; } /*.sidebar.right-align .widget.widget-md-recent-portfolio .item-list{ float: right; }*/ .widget.widget-md-recent-portfolio .item-list .item{ float: left; width: calc(94% / 3 - 9px); height: 60px; margin: 0 9px 9px 0; position: relative; } .widget.widget-md-recent-portfolio .item-list .item .item-image div{ position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-size: cover; background-repeat: no-repeat; background-position: center; } .sidebar.right-align .widget.widget-md-recent-portfolio .item-list .item{ float: right; margin: 0 0 9px 9px; } .modernStyle .widget.widget-md-recent-portfolio .item-list .item { margin: 0 9px 9px 0; } .widget.widget-md-recent-portfolio .item { position: relative; } .widget.widget-md-recent-portfolio .item span { display: table-cell; width: 80px; height: 60px; background-color: rgba(100, 100, 100, 0.3); font-size: 11px; text-align: center; vertical-align: middle; } .widget.widget-md-recent-portfolio .item .overlay { width: 100%; height: 100%; position: absolute; top: 0; opacity: 0; transition: all 0.3s; } .widget.widget-md-recent-portfolio .item:hover .overlay { opacity: 1; } /* button */ .sidebar.widget-area .widget-md-text #text-widget-btn .shortcode-btn .fade-square { padding: 7px 21px 7px 10px; } /* Calendar */ .light-sidebar .widget_calendar #wp-calendar tr .active{ color: #fff; } .dark-sidebar .widget_calendar #wp-calendar tr .active{ color: #000; } .light-sidebar .widget_calendar #wp-calendar tr .active, .dark-sidebar .widget_calendar #wp-calendar tr .active{ font-weight: 800; } /*Categories widget */ .widget-area.classicStyle.border .widget_categories, .widget-area.classicStyle.border .widget_pages, .widget-area.classicStyle.border .widget_archive{ margin-left: 20px; } .widget-area.classicStyle.border .widget_categories ul li, .widget-area.classicStyle.border .widget_pages ul li, .widget-area.classicStyle.border .widget_archive ul li{ padding-left: 4px; } /* dark theme*/ .dark .widget .widget-title, .dark-sidebar .widget .widget-title { color: rgba(0, 0, 0, 1); } .dark .widget table tr th, .dark-sidebar .widget table tr th { color: rgba(0, 0, 0, 0.6); } .dark .widget table tr td, .dark .widget table tr td a, .dark .widget div, .dark .widget div p, .dark .widget span, .dark-sidebar .widget table tr td, .dark-sidebar .widget table tr td a, .dark-sidebar .widget div, .dark-sidebar .widget span { color: rgba(0, 0, 0, 0.6); font-size: 13px; line-height: 21px; font-weight: normal; } .dark-sidebar .widget a:hover span { color: rgba(0, 0, 0, 1); } .dark .widget table tr td#today, .dark-sidebar .widget table tr td#today, .dark-sidebar .widget table tr td#today a { color: #fff; background-color: #000; } /* light theme*/ .light .widget .widget-title, .light-sidebar .widget .widget-title { color: rgba(255, 255, 255, 1); } .light .widget table tr th, .light-sidebar .widget table tr th { color: rgba(255, 255, 255, 0.6); } .light .widget table tr td, .light .widget table tr td a, .light .widget div, .light .widget span, .light-sidebar .widget table tr td, .light-sidebar .widget table tr td a, .light-sidebar .widget div, .light-sidebar .widget span { color: rgba(255, 255, 255, 0.6); } .light .widget table tr td#today, .light-sidebar .widget table tr td#today, .light-sidebar .widget table tr td#today a{ color: #000; background-color: #fff; } /* widgets same part */ .widget-area .widget-title { font-size: 15px; margin-bottom: 18px; position: relative; } .widget-area.classicStyle.border .widget-title{ line-height: 15px; } footer .widget-area.modernStyle div ul.menu { list-style-type: none; padding-left: 15px; } footer .widget-area.classicStyle:not(.full) { padding: 60px; } .widget-area.classicStyle.border p, .widget-area.classicStyle.border span, .widget-area.classicStyle.border a{ font-size: 13px; } footer .widget-area.modernStyle { padding: 40px 60px; text-align: center; } footer.footer-default .footer-widgets .widget-area.modernStyle div[class*="col-"] { padding-left: 0; } footer .widget-area.modernStyle:after { content: ""; width: 100%; display: block; left: 0; height: 1px; position: absolute; right: 0; top: 85px; margin: auto; } footer .light .widget-area.modernStyle:after { background-color: rgba(255, 255, 255, 0.6); } footer .dark .widget-area.modernStyle:after { background-color: rgba(0, 0, 0, 0.6); } footer .widget-area.modernStyle .widget-area-column:after { content: ""; width: 1px; top: -10px; height: 30px; position: absolute; right: 0; } footer .light .widget-area.modernStyle .widget-area-column:after { background-color: rgba(255, 255, 255, 0.6); } footer .dark .widget-area.modernStyle .widget-area-column:after { background-color: rgba(0, 0, 0, 0.6); } footer .widget-area.modernStyle .widget-area-column:first-child:before { content: ""; width: 1px; top: -10px; height: 30px; position: absolute; left: 0; } footer .light .widget-area.modernStyle .widget-area-column:first-child:before { background-color: rgba(255, 255, 255, 0.6); } footer .dark .widget-area.modernStyle .widget-area-column:first-child:before { background-color: rgba(0, 0, 0, 0.6); } footer .widget-area.classicStyle .widget-title { text-align: left; } footer .widget-area.modernStyle .widget-title { text-align: left; margin-top: -17px; margin-bottom: 68px; padding-left: 10px; } footer .widget-area.modernStyle .wrapContent { display: inline-block; margin: 0 auto; text-align: left; } /* skin */ .footer-widgets.dark, .footer-widgets.dark .hr-small { color: black; border-color: rgba(0, 0, 0, 1); } .footer-widgets.light, .footer-widgets.light .hr-small { color: rgba(255, 255, 255, 1); border-color: rgba(255, 255, 255, 1); } /* Footer Widgets */ footer .footer-widgets.light .widget_calendar #wp-calendar tr .active{ color: #fff; } footer .footer-widgets.dark .widget_calendar #wp-calendar tr .active{ color: #000; } footer .footer-widgets.light .widget_calendar #wp-calendar tr .active, footer .footer-widgets.dark .widget_calendar #wp-calendar tr .active{ font-weight: 800; } footer .footer-widgets .widget-md-text #text-widget-btn .shortcode-btn .fade-square { padding: 7px 21px 7px 10px; background-color: transparent; } footer .widget li { font-size: 9px; } footer .footer-widgets .widget li a { margin-right: 5px; } footer .footer-widgets.light li, footer .footer-widgets.light li a { color: rgba(255, 255, 255, 0.6); transition: color 0.3s; } footer .footer-widgets li.menu-item { list-style: initial; text-transform: uppercase; margin-bottom: 6px; list-style-position: inside; } footer .footer-widgets.light a:hover { color: rgba(255, 255, 255, 1); } /***************************************************** * Portfolio Detail ******************************************************/ .portfolio .box_size{ margin-left: auto; margin-right: auto; margin-bottom: 10px; } .portfolio .buttons .sharing a:focus{ outline: none; } .portfolio .category span:after { content: ','; margin: 0 2px; } .portfolio .category span:last-child:after { display: none; } /*** Split ***/ .portfolio-split{ padding: 60px 0 0; } .portfolio-split .box_size .data{ padding-right: 20px; padding-bottom: 50px; } .portfolio-split .title{ margin: 5px 0 12px; font-size: 34px; font-weight: 600; line-height: 45px; } /* .portfolio-split .data{ -webkit-transition: top .1s; -moz-transition: top .1s; -ms-transition: top .1s; -o-transition: top .1s; transition: top .1s; }*/ .portfolio .more-project{ font-size: 14px; line-height: 20px; font-weight: 700; margin-top: 17px; overflow-x: hidden; overflow-y: hidden; display: inline-block; white-space: nowrap; position: relative; transition: color 0.4s cubic-bezier(0.19, 1, 0.22, 1); } .portfolio .more-project:after{ content: ""; display: block; position: absolute; left: 0; top: 50%; width: 100%; height: 2px; margin-top: -1px; transform: translateX(-101%); transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s; } .portfolio .more-project:hover::after { transform: translateX(102%); } .portfolio-split hr.separator{ margin: 30px 0 25px; } .portfolio-split .attribute{ margin-bottom: 22px; } .portfolio-split .attribute span, .portfolio-split .attribute p { display: block; font-size: 14px; line-height: 20px; } .portfolio-split .attribute .title{ font-weight: 700; text-transform: uppercase; margin-top: 0; margin-bottom: 5px; } .portfolio-split .attribute .desc, .portfolio-split .attribute i{ opacity: .6; } .portfolio-split .attribute i{ margin-right: 17px; margin-top: 14px; display: block; } .portfolio-split .media .item{ margin-bottom: 30px; } .portfolio-split .media .item.image img{ width: 100%; } .portfolio-split .buttons{ margin-top: 25px; } .portfolio-split .buttons .like, .portfolio-split .buttons .sharing{ display: inline-block; width: 47%; border: 2px solid; border-radius: 35px; height: 50px; text-align: center; padding: 12px; cursor: pointer; float: left; transition: all .3s; } .portfolio-split .buttons .like i{ font-size: 20px; } .portfolio-split .buttons .like .value{ display: inline-block; position: relative; top: -4px; margin-left: 5px; } .portfolio-split .buttons .sharing{ margin-left: 14px; position: relative; padding: 0; opacity: .3; } .portfolio-split .buttons .sharing .share{ display: inline-block; opacity: 1; color: inherit; transition: opacity 0.3s; text-align: center; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); font-size: 16px; height: 52px; line-height: 52px; } .portfolio-split .buttons .sharing a i{ font-size: 20px; position: relative; top: 2px; left: -6px; } /*** Carousel ***/ .portfolio-full .owl-item:hover { cursor: ew-resize; cursor: -webkit-grab; cursor: -moz-grab; } .portfolio-carousel .owl-carousel .item{ height: 600px; max-width: 1160px; } .portfolio-carousel .owl-carousel .item.video{ min-width: 1160px; } .portfolio-carousel .owl-carousel .item img, .portfolio-full .owl-carousel .item img{ opacity: 0 !important; } .portfolio-carousel .owl-carousel .item .image-holder, .portfolio-full .owl-carousel .item .image-holder{ height: 100%; top: 0; position: absolute; width: 100%; z-index: 1; background-size: cover; background-repeat: no-repeat; background-position: center; } .portfolio-full .owl-theme .owl-dots, .portfolio-carousel .owl-theme .owl-dots{ text-align: center; } .portfolio-full .owl-theme .owl-dots .owl-dot, .portfolio-carousel .owl-theme .owl-dots .owl-dot{ display: inline-block; zoom: 1; vertical-align: middle; } .portfolio-full .owl-theme .owl-dots .owl-dot span , .portfolio-carousel .owl-theme .owl-dots .owl-dot span { width: 8px; height: 8px; margin: 5px 4px; background: #d5d5d5; display: block; -webkit-backface-visibility: visible; -webkit-transition: opacity 200ms ease; -moz-transition: opacity 200ms ease; -ms-transition: opacity 200ms ease; -o-transition: opacity 200ms ease; transition: opacity 200ms ease; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } .portfolio-full .owl-theme .owl-controls,.portfolio-carousel .owl-theme .owl-controls{ position: relative; top: -40px;} .portfolio-full .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span , .portfolio-carousel .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #7e7e7e; } .portfolio .owl-carousel .owl-video-play-icon{ background-image: url("assets/img/owl.video.play.png"); } .portfolio-carousel .box_size{ padding-bottom: 25px; } .portfolio-carousel .data{ padding-right: 5%; margin-top: 30px; } .portfolio-carousel .title{ margin: 5px 0 0; font-size: 34px; line-height: 40px; font-weight:600; } .portfolio-carousel .category{ margin-top: 0; } .portfolio-carousel .portfolio-content{ margin-top: 20px; } .portfolio-carousel .meta{ border-left: 1px solid rgba(0,0,0,0.2); margin-top: 35px; padding-left: 9%; } .portfolio-carousel .attribute{ /*margin-bottom: 22px;*/ } .portfolio-carousel .attribute .left:last-child{ width: 70%; } .portfolio-carousel .attribute span, .portfolio-carousel .attribute p { display: block; font-size: 14px; line-height: 20px; } .portfolio-carousel .attribute .title{ font-weight: 700; text-transform: uppercase; margin-top: 0; margin-bottom: 5px; } .portfolio-carousel .attribute .desc{ word-break: normal; } .portfolio-carousel .attribute .desc, .portfolio-carousel .attribute i{ opacity: .6; } .portfolio-carousel .attribute i{ margin-right: 17px; margin-top: 3px; display: block; } .portfolio-carousel .buttons .like, .portfolio-carousel .buttons .sharing{ cursor: pointer; opacity: .6; display: inline-block; transition: all .3s; } .portfolio-carousel .buttons .sharing { margin-top: 20px; color: #000; } .portfolio-carousel .buttons .sharing a{ color: inherit; } .portfolio-carousel .buttons i{ font-size: 20px; margin-left: 1px; } .portfolio-carousel .buttons span{ margin-left: 10px; position: relative; top: -5px; } /** Full **/ .portfolio-full .data{ text-align: center; margin-top: 22px; } .portfolio-full .data .category{ margin-bottom: 17px; } .portfolio-full .data .title{ margin-bottom: 22px; font-size: 34px; font-weight: 600; line-height: 45px; } .portfolio-full .data .portfolio-content{ margin-bottom: 17px; } .portfolio-full .data .more-project{ margin-bottom: 40px; } .portfolio-full .data .attributes{ display: table; border: 1px solid rgba(0,0,0,.2); width: 100%; height: 55px; margin-bottom: 55px; } .portfolio-full .data .attributes .attribute{ display: table-cell; border-right: 1px solid rgba(0,0,0,.2); text-align: center; vertical-align: middle; padding: 10px; } .portfolio-full .data .attributes i, .portfolio-full .data .attributes .attr-title, .portfolio-full .data .attributes .desc{ display: inline-block; } .portfolio-full .data .attributes i, .portfolio-full .data .attributes .attr-title{ margin-right: 5px; } .portfolio-full .data .attributes .attr-title{ font-weight: 600; } .portfolio-full .data .attributes i, .portfolio-full .data .attributes .desc{ opacity: .6; } .portfolio-full .buttons{ display: inline-block; width: 370px; text-align: center; } .portfolio .buttons.sharing-off .like{ float: none; } .portfolio-full .buttons .like, .portfolio-full .buttons .sharing{ display: inline-block; width: 45%; -webkit-border-radius: 26px; -moz-border-radius: 26px; border-radius: 26px; border: 2px solid; height: 50px; text-align: center; padding: 12px; cursor: pointer; float: left; transition: all .3s; } .portfolio-full .buttons .like i{ font-size: 20px; } .portfolio-full .buttons .like .value{ display: inline-block; position: relative; top: -4px; margin-left: 5px; } .portfolio-full .buttons .sharing{ margin-left: 14px; position: relative; padding: 0; opacity: .3; } .portfolio-full .buttons .sharing .share{ display: inline-block; opacity: 1; color: inherit; transition: opacity 0.3s; text-align: center; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); font-size: 16px; height: 52px; line-height: 52px; } .portfolio-full .buttons .sharing a i{ font-size: 20px; position: relative; top: 2px; left: -6px; } .portfolio-full .recent-project{ background-color: transparent; border-top: 1px solid rgba(0,0,0,.1); text-align: center; margin-top: 60px; padding-top: 40px } #player{height: 46.6%;} .portfolio-full .recent-project .recent-title{ margin-bottom: 45px; } .portfolio-full .recent-title-seprator{ display: none;} .portfolio-nav *{ -webkit-backface-visibility: hidden; } .portfolio-nav { position: fixed; top: 50%; width: 100%; z-index: 2; right: 0; } .portfolio-nav a { position: absolute; top: 50%; display: block; outline: none; text-align: left; z-index: 1000; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .portfolio-nav a.prev { left: 0; } .portfolio-nav a.next { right: 0; } .portfolio-nav a .nav-icon { display: block; margin: 0 auto; padding: 0; text-align: center; color: #ffffff; font-size: 25px; } .nav-thumbflip a { -webkit-perspective: 1000px; perspective: 1000px; } .nav-thumbflip a.prev { -webkit-perspective-origin: 100% 50%; perspective-origin: 100% 50%; } .nav-thumbflip a.next { -webkit-perspective-origin: 0% 50%; perspective-origin: 0% 50%; } .nav-thumbflip .icon-wrap { display: block; width: 50px; height: 135px; background-color: rgba(0, 0, 0, 0.2); -webkit-transition: background-color 0.3s; transition: background-color 0.3s; } .nav-thumbflip .post-detail { width: 170px; height: 135px; overflow: hidden; } .nav-thumbflip .post-detail .post-detail-overlay { position: absolute; width: inherit; height: inherit; background-color: rgba(0, 0, 0, 0.40); top: 0; } .nav-thumbflip .post-detail .post-detail-title { position: absolute; padding: 0 20px; top: 50%; transform: translateY(-50%); color: #fff; width: inherit; text-align: center; opacity: 0; transition: opacity .9s; transition-delay: .1s; } .nav-thumbflip .post-detail img { width: 100%; height: 100%; transition: transform 0.3s; } .nav-thumbflip .last-post-thumbnail{ width: 100%; height: 100%; background-size: cover; } .nav-thumbflip .post-detail:hover img { -webkit-backface-visibility: hidden; -webkit-transform: translateZ(0) scale(1.03, 1.03); } .nav-thumbflip .nav-icon { position: relative; top: 50%; -webkit-transition: fill 0.3s; transition: fill 0.3s; -webkit-transform: translateY(-50%); transform: translateY(-50%); fill: #fff; } .nav-thumbflip .post-detail { position: absolute; top: 0; -webkit-transition: -webkit-transform 0.3s; transition: transform 0.3s; /*transition-delay: .1s;*/ -webkit-backface-visibility: hidden; backface-visibility: hidden; } .nav-thumbflip a.prev .post-detail { left: 100%; -webkit-transform: rotateY(90deg); transform: rotateY(90deg); -webkit-transform-origin: 0% 50%; transform-origin: 0% 50%; } .nav-thumbflip a.next .post-detail { right: 100%; -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); -webkit-transform-origin: 100% 50%; transform-origin: 100% 50%; } .nav-thumbflip a:hover .post-detail { -webkit-transform: rotateY(0deg); transform: rotateY(0deg); transition-delay: 0s; } .nav-thumbflip a:hover .icon-wrap { background-color: rgba(0, 0, 0, 0.4); } .nav-thumbflip a:hover .post-detail .post-detail-title { -webkit-backface-visibility: hidden; opacity: 1; transition: opacity .9s; transition-delay: .1s; } /*---------------------------------------------------- Recent Portrfolio ------------------------------------------------------*/ .recent-project { background-color: #f3f3f3; padding-top: 69px; padding-bottom: 80px; width: 100%; } .recent-project .recent-container { /*max-width: 1200px;*/ margin: auto; } .recent-project .recent-title { font-size: 22px; font-weight: 400; line-height: 22px; color: #222222; text-transform: uppercase; margin-left: 0; } .recent-project .recent-title-seprator { width: 25px; height: 2px; border-top: 2px solid #222222; margin: 15px 0 60px 0; } .recent-project .single_related { float: left; margin: 0 5px 20px 5px; width: calc( 100% / 5 - 11px); height: 240px; text-align: center; position: relative; } .recent-project .recent-image { width: 100%; height: 135px; background-color: #dcdcdc; display: table; overflow: hidden; position: relative; } .recent-project .recent-image .image-holder { position:absolute ; width: 100%; height:100%; top:0; left: 0; background-repeat: no-repeat; background-position: center center; background-size: cover; } .recent-project .recent-image:hover .recent-overlay { opacity: 0.3; } .recent-project .recent-overlay { width: 100%; height: 100%; background-color: #000; opacity: 0; position: absolute; top: 0; left: 0; transition: opacity 0.3s; } .recent-project .recent-image span { display: table-cell; vertical-align: middle; color: #222222; font-size: 12px; } .recent-project .recent-single-title { font-size: 15px; font-weight: 600; color: #000; line-height: 18px; margin-top: 25px; } .recent-project .recent-single-cat { font-size: 10px; font-weight: 500; color: #7d7d7d; line-height: 12px; } /* Recent Portfolio */ .dark .widget.widget-md-recent-portfolio .item .overlay, .dark-sidebar .widget.widget-md-recent-portfolio .item .overlay { background: rgba(255, 255, 255, 0.3); } .light .widget.widget-md-recent-portfolio .item .overlay, .light-sidebar .widget.widget-md-recent-portfolio .item .overlay { background: rgba(0, 0, 0, 0.3); } /*------------------------------------------------------- blog detail ---------------------------------------------------------*/ .post-content{ width: 100%; background-color: #f9f9f9; padding:40px 40px 30px 40px; } .post-content .box_size_container{ width: 100% !important; } .single-post-media{ margin-bottom: 35px; } .single-post-media, .post-media, .single-post-media li.images, .post-media li.images{ height: 550px; background-size: cover; background-repeat: no-repeat; background-position: center center; } .post-content .post-categories { text-transform: uppercase ; width: 75%; margin-bottom: 0; display: none; } .post-content .post-categories a{ font-size: inherit; font-weight: inherit; font-family: inherit; color: inherit; line-height: inherit; } .post-content .post-title{ text-transform: uppercase ; width: 75%; margin-top: 0; font-size: 35px; font-weight: bold; } .post-content .post-date{ margin-top: 6px; } .post-content .post-date a{ font-size: inherit; font-weight: inherit; font-family: inherit; color: inherit; line-height: inherit; } .post-content .post-desc{ margin-top: 28px; width: 100%; } .post-content .post-tags{ margin-top: 70px; float: left; color: #878787; width: 85%; font-size: 13px; line-height: 20px; } .post-content .post-tags a{ margin-left: 2px; color: #878787; font-size: 13px; font-weight: normal; } .post-content .post-tags a:first-child { margin-left: 10px; } .post-content .post-share{ float: right; width: 38px; height: 38px; margin-top: 60px; } .post-content .post-share .share{ background-image: url("assets/img/share-button.png"); background-repeat: no-repeat; width: 36px; height: 36px; display: block; opacity: 1; transition: opacity 0.3s; } .post-content .post-share .share-hover{ background-image: url("assets/img/share-hover.png"); background-repeat: no-repeat; width: 36px; height: 36px; display: block; margin-top: -36px; opacity: 0; transition: opacity 0.3s; } .post-content .post-share:hover .share-hover{ opacity: 1; } .post-content .post-share:hover .share{ opacity: 0; } .author-section{ margin-top: 50px; position: relative; } .author-section .title{ color: #878787; float: left; width: 6%; } .author-section .line{ height: 1px; color: #cbcbcb; background-color: #cbcbcb; border: none; float: right; width: 94%; margin-top: 10px; } .author-section .image{ float: left; width: 95px; height: 95px; border-radius: 50%; background-color:#c3c3c3 ; overflow: hidden; margin-left: 20px; margin-top: 18px; } .author-section .info{ float: left; width: 60%; margin-left: 25px; position: absolute; top: 50%; left: 115px; transform: translateY(-50%); margin-top: 13px; } .author-section .info .name{ color: #000; margin-top: 25px; font-size: 14px; font-weight: bold; line-height: 20px; } .author-section .info .name a{ color: inherit; margin-top: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; } .author-section .info .description{ margin-top: 5px; line-height: 1.5em; } .author-section .info .description a { font-size: inherit; font-weight: inherit; font-family: inherit; line-height: inherit; } .single-post .subscribe-section .sc-subscribe{ border-radius: 5px; -webkit-box-shadow: 0 0 9px rgba(0,0,0,.06); -moz-box-shadow: 0 0 9px rgba(0,0,0,.06); box-shadow: 0 0 9px rgba(0,0,0,.06); } .single-post .subscribe-section .sc-subscribe .subscribe-title{ font-weight: 400; } .single-post .subscribe-section .subscribe-textbox{ color: #000; } .single-post .subscribe-section .subscribe-textbox::-webkit-input-placeholder { color: rgba(0, 0, 0, 0.6); } .single-post .subscribe-section .subscribe-textbox:-moz-placeholder { /* Firefox 18- */ color: rgba(0, 0, 0, 0.6); } .single-post .subscribe-section .subscribe-textbox::-moz-placeholder { /* Firefox 19+ */ color: rgba(0, 0, 0, 0.6); } .single-post .subscribe-section .subscribe-textbox:-ms-input-placeholder { color: rgba(0, 0, 0, 0.6); } .single-post .subscribe-section .subscribe-textbox, .single-post .subscribe-section .subscribe-button{ border-radius: 35px; } .single-post .subscribe-section .subscribe-button{ height: 56px; letter-spacing: 1px; background-color: #bda977; color: #ffffff; } .single-post .subscribe-section .subscribe-button i{ position: relative; left: -2px; } .single-post .subscribe-section .subscribe-button:hover{ background-color: #343434; color: #ffffff; } /*---------------------comment section--------------*/ .single-post .comments{ background-color: #f1f1f1; } .nocomments{ padding: 20px 40px 20px 40px; } .comments-wrap, #respond-wrap{ padding: 55px 40px 45px 40px; } .comment-number{ margin-bottom: 40px; color: #2c2c2c; font-size: 18px; line-height: 28px; font-weight: bold; text-transform: uppercase; } .comments-list ul { list-style: none; } .comments-list .children { margin:10px 0; padding:10px 0 10px 40px; border-left:1px solid #d6d6d6; } ul.comments-list{ list-style: none; } ul.comments-list li{ border-bottom: 1px solid #cbcbcb; padding-bottom: 37px; } ul.comments-list li:last-child{ border-bottom: none; padding-bottom: 0; } .comment-image{ float: left; width: 75px; height: 75px; border-radius: 50%; background-color:#c3c3c3 ; overflow: hidden; margin-top: 38px; } .comment-content{ float: left; width: 90%; margin-left: 20px; } .comment-meta{ margin-top: 32px; } .comment-meta .name { color: #3c3c3c; font-size: 15px; line-height: 28px; font-weight: bold; float: left; width: 88%; } .comment-reply-link{ float: right; width: 5%; } .comment-edit-link{ float: left; width: 5%; margin-top: 5px; border-right: 1px solid #CAC9C9; color: #8b8b8b; font-size: 12px; line-height: 19px; font-weight: normal; } .comment-meta .comment-text{ width: 75%; } .comment-meta .comment-text p{ color: #1c1c1c; font-size: 14px; line-height: 21px; font-weight: normal; margin-top: 8px; margin-bottom: 13px; } .comment-meta .comment-date { color: #8b8b8b; font-size: 12px; line-height: 21px; font-weight: normal; transition: color 0.3s; } .comment-meta .comment-date:hover{ color: #6a6a6a; } .comment-reply-link{ font-size: 12px; line-height: 28px; font-weight: normal; transition: color 300ms; } .comment-reply-link:hover{ color: #8b8b8b; } .comment-reply-title{ font-size: 18px; line-height: 58px; font-weight: bold; color: #2c2c2c; } .logged-in-as{ font-size: 13px; margin-top: -30px; margin-bottom: 30px; } .logged-in-as a{ font-size: 13px; } /*---------------comment form----------------------*/ .single-post .comment-form{ width: 100%; margin: auto; margin-top: 55px; } .single-post .comment-form .form-container-classic{ width: 100%; } .form-container-classic .input-text{ float: left; width: 32.8%; margin:0 0.5% 0.6% 0; } .form-container-classic .input-text input, .single-post .comment-form .input-textarea textarea{ border-radius: 5px; display: block; border: 1px solid #dadada; background: transparent; color: #afafaf; outline: none; font-size: 13px; } .form-container-classic .input-text input ::-webkit-input-placeholder, .single-post .comment-form .input-textarea textarea ::-webkit-input-placeholder{ color: #afafaf; } .form-container-classic .input-text input ::-moz-placeholder, .single-post .comment-form .input-textarea textarea ::-moz-placeholder{ color: #afafaf; } .form-container-classic .input-text input ::-ms-input-placeholder, .single-post .comment-form .input-textarea textarea ::-ms-input-placeholder{ color: #afafaf; } .single-post .comment-form .input-textarea textarea{ width: 99.3%; padding: 12px 2%; height: 220px; } .form-container-classic .input-text input{ padding: 0 5.5%; width: 100%; height: 65px; } .single-post .comment-form .form-submit{ text-align: center; } .single-post .comment-form .submit{ border-radius: 5px; border: none; margin-top: 20px; width: 13%; background-color: #2c2c2c; color: #fff; transition: background-color 300ms; outline: none; font-size: 13px; height: 40px; } .single-post .comment-form .submit:hover{ background-color: #4b4a4a; } .single-post .comment-form input:focus, .single-post .comment-form textarea:focus { border: 2px solid #dadada; } /*-------------------related post-----------------------*/ .recent-post{ padding-top: 50px; } .recent-post .recent-items{ margin-right: -15px; margin-left: -15px; } .recent-post .recent-title{ margin-bottom: 40px; color: #2c2c2c; font-size: 18px; line-height: 28px; font-weight: bold; text-transform: uppercase; } .recent-post .single_related{ float: left; margin: 0 15px 20px 15px; width:245px; height: 235px; text-align: left; position: relative; } .recent-post .recent-image{ width: 245px; height: 150px; background-color: #dcdcdc; display: table; overflow: hidden; position: relative; } .recent-post .recent-image img { transition: transform 0.3s; } .recent-post .recent-image:hover img{ -webkit-backface-visibility: hidden; -webkit-transform: translateZ(0) scale(1.03, 1.03); } .recent-post .recent-image:hover .recent-overlay{ opacity: 0.3; } .recent-post .recent-overlay{ width: 100%; height: 100%; background-color: #000; opacity: 0; position: absolute; top: 0; left: 0; transition: opacity 0.3s; } .recent-post .recent-image span{ display: table-cell; vertical-align: middle; color: #222222; font-size: 12px; text-align: center; } .recent-post .recent-single-title{ font-size: 14px; font-weight: normal; color: #2c2c2c; line-height: 19px; margin-top: 20px; width: 90%; } .recent-post .recent-single-cat{ font-size: 12px; font-weight: normal; color: #7d7d7d; line-height: 17px; margin-top: 5px; margin-bottom: 5px; } /*----------recent post widget--------------------------*/ /* MD Recent Posts */ .widget.widget-md-recent-post .item-image{ float: left; margin-right: 10px; width: 60px; height: 50px; } .sidebar.center-align .widget.widget-md-recent-post .item-image { float: none; width: 60px; margin: auto; height: 50px; display: block; } .widget.widget-md-recent-post .item{ margin-bottom: 15px; } .widget.widget-md-recent-post .item-info { float: left; width: 65%; } .sidebar.center-align .widget.widget-md-recent-post .item-info { float: left; width: 100%; margin: 10px 0 15px 0; } .widget.widget-md-recent-post .item a{ position: relative; } .sidebar.right-align .widget.widget-md-recent-post .item a{ float: right; margin: 0 0 0 10px; } .sidebar.right-align .widget.widget-md-recent-post .item-info{ float: right; } .widget.widget-md-recent-post .item .overlay { width: 60px; height: 50px; position: absolute; top: 0; opacity: 0; transition: all 0.3s; } .widget.widget-md-recent-post .item:hover .overlay { opacity: 1; } .dark .widget.widget-md-recent-post .item:hover a, .dark-sidebar .widget.widget-md-recent-post .item:hover a { color: rgba(0, 0, 0, 1); } .dark .widget.widget-md-recent-post .item .overlay, .dark-sidebar .widget.widget-md-recent-post .item .overlay { background: rgba(255, 255, 255, 0.6); } .light .widget.widget-md-recent-post .item:hover a, .light-sidebar .widget.widget-md-recent-post .item:hover a { color: rgba(255, 255, 255, 1); } .light .widget.widget-md-recent-post .item .overlay, .light-sidebar .widget.widget-md-recent-post .item .overlay { background: rgba(0, 0, 0, 0.3); } /* Recent Posts */ .widget.widget_recent_entries ul { list-style: none; } .sidebar.right-align .widget.widget_recent_entries ul { float: right; } .widget.widget_recent_entries ul li { margin-top: 8px; transition: background-image 0.3s; background-repeat: no-repeat; background-position: 0 7px; } .widget.widget_recent_entries ul li a { margin-left: 20px; transition: color 0.3s; display: block; } .widget.widget_recent_entries ul li span { margin-left: 20px; font-size: 11px; } .dark .widget.widget_recent_entries ul li { background-image: url("assets/img/right-arrow-light.png"); } .sidebar.left-align.dark-sidebar .widget.widget_recent_entries ul li { background-image: url("assets/img/right-arrow-light.png"); } /*.dark .widget.widget_recent_entries ul li:hover, .dark-sidebar .widget.widget_recent_entries ul li:hover { background-image: url("assets/img/right-arrow-light-hover.png"); }*/ .dark .widget.widget_recent_entries ul li:hover a, .dark-sidebar .widget.widget_recent_entries ul li:hover a { color: rgba(0, 0, 0, 1); } .dark .widget.widget_recent_entries ul li a, .dark-sidebar .widget.widget_recent_entries ul li a { color: rgba(0, 0, 0, 0.6); } .light .widget.widget_recent_entries ul li, .sidebar.left-align.light-sidebar .widget.widget_recent_entries ul li { background-image: url("assets/img/right-arrow-dark.png"); } .sidebar.right-align.dark-sidebar .widget.widget_recent_entries ul li a:after { background-image: url("assets/img/right-arrow-light.png"); } .sidebar.right-align.light-sidebar .widget.widget_recent_entries ul li a:after { background-image: url("assets/img/right-arrow-dark.png"); } .sidebar.right-align.dark-sidebar .widget.widget_recent_entries ul li a:after, .sidebar.right-align.light-sidebar .widget.widget_recent_entries ul li a:after { content: ""; width: 5px; height: 7px; display: inline-block; margin-left: 13px; transform: rotate(180deg); float: right; background-repeat: no-repeat; top: 6px; position: relative; } .sidebar .widget li { font-size: 9px; } .sidebar.right-align .widget li { direction: rtl; } .sidebar.center-align .widget li a, .sidebar.left-align .widget li a { margin-right: 5px; } .sidebar.right-align .widget li a { margin-left: 5px; display: inline-block; } /*.light .widget.widget_recent_entries ul li:hover, .light-sidebar .widget.widget_recent_entries ul li:hover { background-image: url("assets/img/right-arrow-dark-hover.png"); }*/ .light .widget.widget_recent_entries ul li:hover a, .light-sidebar .widget.widget_recent_entries ul li:hover a { color: rgba(255, 255, 255, 1); } .light .widget.widget_recent_entries ul li a/*, .light-sidebar .widget.widget_recent_entries ul li a*/ { color: rgba(255, 255, 255, 0.6); } /*------------------share Btn---------------------------*/ .addtoany_share_save_container.addtoany_content_bottom{ display: none; } /*----------------------subscribe-section --------------*/ .post-content .subscribe-section{ margin-top: 70px; } /*--------------------gallery post--------------------*/ .single-post-media .flex-control-nav.flex-control-paging, .post-media .flex-control-nav.flex-control-paging, .blog-masonry-container .flex-control-nav.flex-control-paging{ display: none; } main .flexslider{ padding-bottom:30px; background-color: transparent; border: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; -o-box-shadow: none; box-shadow:none; } main .blog-masonry-container .flexslider{ padding-bottom:0; margin-bottom: 0 } .single-post-media .flex-direction-nav a, .post-media .flex-direction-nav a, .blog-masonry-container .flex-direction-nav a{ width: 30px; height: 65px; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .single-post-media .flex-direction-nav a.flex-prev:before, .post-media .flex-direction-nav a.flex-prev:before, .blog-masonry-container .flex-direction-nav a.flex-prev:before{ content: " "; display: block; background: url('assets/img/pervious-button.png') no-repeat; width: 30px; height: 65px; } .single-post-media .flex-direction-nav a.flex-next:before, .post-media .flex-direction-nav a.flex-next:before, .blog-masonry-container .flex-direction-nav a.flex-next:before{ content: " "; display: block; background: url('assets/img/next-button.png') no-repeat; width: 30px; height: 65px; } /*-------------------------video post ---------------------*/ .single-post-media .video-img, .loop-post-content .post-media .video-img{ width: 100% !important; max-width: 100%; } .player .vp-controls{display:none !important;opacity:0 !important} /*--------------------------------------------------------- VC Styles ---------------------------------------------------------*/ div.vc_column_container { padding: 0; } div.vc_column_container > .vc_column-inner{ padding-left:0; padding-right:0; } .vc_column_container>.vc_column-inner { box-sizing: border-box; padding-left: 15px; padding-right: 15px; width: 100%; } .vc_col-has-fill>.vc_column-inner, .vc_row-has-fill+.vc_row-full-width+.vc_row>.vc_column_container>.vc_column-inner, .vc_row-has-fill+.vc_row>.vc_column_container>.vc_column-inner, .vc_row-has-fill+.vc_vc_row>.vc_row>.vc_vc_column>.vc_column_container>.vc_column-inner, .vc_row-has-fill+.vc_vc_row_inner>.vc_row>.vc_vc_column_inner>.vc_column_container>.vc_column-inner, .vc_row-has-fill>.vc_column_container>.vc_column-inner, .vc_row-has-fill>.vc_row>.vc_vc_column>.vc_column_container>.vc_column-inner, .vc_row-has-fill>.vc_vc_column_inner>.vc_column_container>.vc_column-inner { padding-top: 35px; } body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */ -webkit-backface-visibility: hidden; } .animated { -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; } .animated.hinge { -webkit-animation-duration: 2s; -moz-animation-duration: 2s; -o-animation-duration: 2s; animation-duration: 2s; } @-webkit-keyframes fadeIn { 00% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes fadeIn { 00% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes fadeIn { 00% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeIn { 00% { opacity: 0; } 100% { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; -moz-animation-name: fadeIn; -o-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeOut { 00% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes fadeOut { 00% { opacity: 1; } 100% { opacity: 0; } } @-o-keyframes fadeOut { 00% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeOut { 00% { opacity: 1; } 100% { opacity: 0; } } .fadeOut { -webkit-animation-name: fadeOut; -moz-animation-name: fadeOut; -o-animation-name: fadeOut; animation-name: fadeOut; } /*--------------------------------------------------------- Row Shortcode ---------------------------------------------------------*/ .vc_row .one-page-anchor{ position: absolute; top: 0; } div[id^="rowInnerCustom"] > .wrap { position: relative; z-index: 1; } /* Custom for woocommerce archieve pages */ .archive.woocommerce .products > li { text-align: center; } .archive.woocommerce .products .star-rating { margin: auto; font-size: .78em !important; } /* Custom for woocommerce empty category pages */ .md-woocommerce-info{ text-align:center; margin-top: 20%; } .md-empty-category-title{ font-size: 90px; font-weight: bolder; margin-bottom: 45px; letter-spacing: 2px; } .md-empty-category-subtitle{ font-size: 20px; letter-spacing: 3px; color: gray; font-weight:600; } #empty-cart-page-button{ transition:all 0.2s ease-in-out; } #empty-cart-page-button a{ background-color:transparent; font-size: 13px; } #empty-cart-page-button:hover{ background-color:black; } #empty-cart-page-button:hover a{ color:#FFFFFF; } #empty-cart-page-button{ margin-top: 30px; border: 1px solid gray; border-radius: 25px; } /*---------------------------------------------------------- Dialog Box --------------------------------------------------------- */ #dialog-box { position: fixed; top: 50%; left: 50%; width: 392px; height: 218px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; background: #fff url(assets/img/dialog-plug.png) no-repeat center 17px; -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .19); -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .19); box-shadow: 0 0 8px rgba(0, 0, 0, .19); border: solid 1px #e3e3e3; color: #000; z-index: 9999999; transform: translate(-50%, -50%); text-align: center; } #dialog-box h6 { font-size: 19px; font-family: Raleway; font-weight: bold; color: #454545; margin-top: 67px; margin-bottom: 14px; line-height: 19px; } #dialog-box p { color: #606060; font-size: 14px; font-family: Raleway; margin-bottom: 25px; padding: 0 59px; line-height: 17px; } #dialog-box span { border-top: 1px solid #e7e7e7; width: 195px; height: 50px; color: #5d5d5d; font-size: 14px; font-family: Raleway; font-weight: 400; display: inline-block; margin-top: 7px; line-height: 50px; cursor: pointer; } #dialog-box span:hover { background-color: #e7e7e7; } #dialog-box span.yes { border-right: 1px solid #e7e7e7; } /*---------------------------------------------------------- One Page Styles --------------------------------------------------------- */ body.one_page_scroll .navigation-mobile { position: relative; z-index: 51; } body.one_page_scroll .row-over-height .wrap{ height: 100%; } body.one_page_scroll:not(.compose-mode) header:not(.header-clone){ position: fixed; } body.one_page_scroll:not(.compose-mode) div.mobile-row-over-height { overflow-y: scroll !important; height: 100%; } body.one_page_scroll .footer-parallax{ visibility: visible !important; } body.one_page_scroll main{ box-shadow:none !important; } #pix-nav *{ transition: .3s !important; } .background--light , .background--dark{ transition: .3s !important; } .background--light span{ background-color: rgba(0,0,0,.2); } .background--light .bullet-active span{ background-color: #545454 ; } .background--dark span { background-color: rgba(255,255,255,.2) ; } .background--dark .bullet-active span { background-color: #FFFFFF; } .full-page { position: fixed !important; top: 0px; left: 0px; width: 100%; overflow: hidden !important; } body.one_page_scroll:not(.compose-mode) header div.color-overlay{ background-color: rgba(255, 255, 255, 0) !important; } body.one_page_scroll footer{ position: fixed !important; bottom: 0px; width: 100%; left: 0px; } .relative-row{ position: relative !important; } body:not(.compose-mode).one_page_scroll footer , body:not(.compose-mode).one_page_scroll footer .row.widget-area{ z-index: 10; opacity: 1 !important; } body.one_page_scroll.compose-mode main{ margin-bottom: 0px !important; } body.one_page_scroll.compose-mode footer{ position: relative !important; } .vc_row .wrap{ outline: 0; } #pix-nav span { position: absolute; top: 0px; left: 0px; cursor: pointer; width: 100%; height: 100%; border-radius: 100%; } div#pix-nav li { list-style: none; width: 10px !important; height: 10px !important; position: relative; margin: 11px 0px 0px -5px !important; } div#pix-nav { position: fixed; margin-top: -50px; right: 15px; z-index: 49; width: 30px; } /*-------------------------------------- Blog Page --------------------------------------*/ /* set posts styles in sidebar different positions */ .left-sidebar-blog .posts, .left-sidebar-blog .post-pagination { margin-left: 50px; } .right-sidebar-blog .post-pagination{ margin-right: 3%; } .double-sidebar-blog .posts, .double-sidebar-blog .post-pagination { margin-left: 50px; margin-right: 50px; } .content > .posts{ margin:auto; } /* posts separator */ .content .posts article:first-child .loop-post-content{ padding-top: 0; } .content .posts article:last-child hr{ background-color: transparent; color: transparent; } .loop-post-content{ padding-top: 25px; } /* post media */ .loop-post-content .video-img { height: 460px !important; } .loop-post-content .post-media{ margin-bottom: 35px; height: 460px; } .loop-post-content .post-media .feature-image{ width: 100%; height: 460px; display: block; background-repeat: no-repeat; background-size: cover; background-position: 0 center; } /* category */ .loop-post-content .post-categories{ text-transform: uppercase; width: 75%; } .loop-post-content .post-categories a{ font-family: inherit; font-size: inherit; line-height: inherit; color: inherit; font-weight: inherit; } .loop-post-content .category .overlay-category span:last-child{ display: none; } /* post-meta */ .loop-post-content .post-meta h1 a, .loop-post-content .post-meta h4{ color: #343434; font-size: 22px; font-weight: bold; letter-spacing: normal; } .loop-post-content .post-title { text-transform: uppercase; max-width: 60%; margin-top: 15px; transition: color 0.3s; } .loop-post-content .post-meta .post-info{ margin-bottom: 25px; } body:not(.blog,.archive) .loop-post-content p{ width: 85%; margin:auto; } .loop-post-content .post-meta .post-info p{ float: left; margin-right: 5px; width: auto; } .loop-post-content p a{ font-size: inherit; font-weight: inherit; font-family: inherit; color: inherit; line-height: inherit; } .loop-post-content p .more-link{ color: #858585; font-size: 12px; font-weight: normal; margin-top: 45px; width: 110px; transition: color 0.3s,background-image 0.3s,background-position 0.3s; display: none; } .loop-post-content p .more-link .more-link-image{ background-image: url("assets/img/see-details.png"); background-repeat: no-repeat; background-position: 85px 5px; width: 110px; height: 50px; float: left; background-repeat: no-repeat; margin-top: -21px; opacity: 1; transition: opacity 0.3s; } .loop-post-content p .more-link:hover{ color: #222222; } .loop-post-content p .more-link:hover .more-link-image{ opacity: 0; } .loop-post-content p .more-link:hover .more-link-hover-image{ opacity:1; background-position: 90px 0; } .loop-post-content p .more-link-hover-image{ background-image: url("assets/img/see-details-hover.png"); background-position: 85px 0; width: 110px; height: 50px; float: left; background-repeat: no-repeat; margin-top: -45px; opacity: 0; transition: background-position 0.3s,opacity 0.2s; } /* share btn */ .loop-post-content .post-share{ float: right; width: 38px; height: 38px; margin: 0 0 30px 0; } .loop-post-content .post-share .share{ background-image: url("assets/img/share-button.png"); background-repeat: no-repeat; width: 36px; height: 36px; display: block; opacity: 1; transition: opacity 0.3s; } .loop-post-content .post-share .share-hover{ background-image: url("assets/img/share-hover.png"); background-repeat: no-repeat; width: 36px; height: 36px; display: block; margin-top: -36px; opacity: 0; transition: opacity 0.3s; } .loop-post-content .post-share:hover .share-hover{ opacity: 1; } .loop-post-content .post-share:hover .share{ opacity: 0; } /* comment btn */ .loop-post-content .post-comment-holder{ float: right; margin: 0 0 30px 10px; width: 36px; height: 36px; position: relative; } .loop-post-content .post-comment{ background-image: url("assets/img/loop-comment.png"); background-repeat: no-repeat; width: 38px; height: 38px; display: block; transition: opacity 0.3s; } .loop-post-content .post-comment-hover{ background-image: url("assets/img/number.png"); background-repeat: no-repeat; width: 38px; height: 38px; display: block; margin-top: -38px; opacity: 0; transition: opacity 0.3s; } .loop-post-content .post-comment-holder:hover .post-comment-hover{ opacity: 1; } .loop-post-content .post-comment-holder:hover .post-comment-hover span{ opacity: 1; } .loop-post-content .post-comment-holder:hover .post-comment{ opacity: 0; } .loop-post-content .post-comment-hover span{ color: #fff; position: absolute; top: 50%; right:50%; -webkit-transform: translateY(-50%) translateX(50%); -moz-transform: translateY(-50%) translateX(50%); -ms-transform: translateY(-50%) translateX(50%); -o-transform: translateY(-50%) translateX(50%); transform: translateY(-50%) translateX(50%); opacity: 0; transition: opacity 0.3s; font-weight: normal; } /*bottom-seprator*/ .loop-bottom-seprator{ height: 1px; color: #e5e5e5; background-color: #e5e5e5; border: none; width: 100%; margin-top: 13px; margin-bottom: 25px; } .loop-bottom-seprator-without-border { height: 1px; color: transparent; background-color: transparent; border: none; width: 100%; margin-top: 5px; margin-bottom: 5px; } /* gallery*/ .loop-post-content .post-media, .post-media li.images { height: 460px; } .format-gallery .loop-post-content .slides{ margin: 0; padding:0; } /*quote*/ .box_size > .format-quote blockquote{ margin-top: 0; } /*Video*/ body.blog .video-img { max-width: 100%; } .loop-post-content blockquote,.single-post blockquote{ font-size: 22px; font-weight: 300; line-height: 29px; color: #717171; text-align: center; border: none; width: 100%; padding: 90px 15% 45px 15%; -webkit-margin-before:0; -webkit-margin-after: 0; -webkit-margin-start: 0; -webkit-margin-end: 0; margin-bottom: 20px; margin-left: 0; background: url("assets/img/quote.png") no-repeat 50% 50%; } .loop-post-content blockquote .name{ font-size: 14px; line-height: 20px; font-weight: normal; margin-top: 25px; } /*** Password protected style ***/ .post-password-form{ margin: 150px auto 0; display: block; max-width: 580px; text-align: center; } .post-password-form p:last-child{ margin-top: 25px; } /*** constant value for blog page & simillar pages ***/ .blog main, .archive main{ margin-top: 110px; padding:0 !important; } .archive .item .loop-bottom-seprator{ display: none; } .blog .loop-post-content, .archive .loop-post-content{ position: relative; } .blog .loop-post-content .post-media, .archive .loop-post-content .post-media{ margin-bottom: 33px; position: relative; } .blog .loop-post-content .post-media:after, .archive .loop-post-content .post-media:after{ content: ""; position: absolute; width: 100%; height: 100%; background-color: rgba(255,255,255,.2); opacity: 0; z-index: 1; transition: opacity .3s; top:0; left: 0; } .blog .loop-post-content .post-media:hover:after, .archive .loop-post-content .post-media:hover:after{ opacity: 1; } .blog .loop-post-content .post-categories , .archive .loop-post-content .post-categories { line-height: 15px; } .blog .loop-post-content .post-categories a , .archive .loop-post-content .post-categories a { font-size: 13px; font-weight:700 ; color: #343434; } .blog .loop-post-content .post-title, .archive .loop-post-content .post-title{ font-size: 22px; font-weight: 700; line-height: 30px; margin-top: 10px; margin-bottom: 8px; color: #343434; } .blog .loop-post-content .post-meta .post-info p, .archive .loop-post-content .post-meta .post-info p{ color: #8b8b8b; } .blog .loop-post-content > p, .archive .loop-post-content > p{ font-size: 14px; line-height: 22px; color: #8b8b8b; } .blog .loop-post-content blockquote p,.single-post .post-content blockquote p, .archive .loop-post-content blockquote p,.single-post .post-content blockquote p{ font-size: 14px; line-height: 22px; color: #8b8b8b; } .blog .loop-post-content blockquote, .archive .loop-post-content blockquote, .single-post .post-content blockquote{ border: 1px solid #e5e5e5; } .blog .loop-post-content p .more-link , .archive .loop-post-content p .more-link { text-transform: uppercase; margin-top: 35px; } .blog .loop-post-content p .more-link i, .archive .loop-post-content p .more-link i{ font-size: 15px; margin-left: 5px; position: relative; top: 2px; } .blog .loop-post-content .post-comment-holder, .blog .loop-post-content .post-share{ float: none; position: relative; left: 95%; margin-bottom: 0; margin-top: 10px; } .blog .loop-post-content .post-share, .archive .loop-post-content .post-share{ right: 40px; bottom: -4px; } .blog .loop-bottom-seprator, .archive .loop-bottom-seprator{ margin-top: 44px; } body.archive:not(.blog) article{ webkit-box-shadow: 0 1px 21px rgba(0,0,0,.12); -moz-box-shadow: 0 1px 21px rgba(0,0,0,.12); box-shadow: 0 1px 21px rgba(0,0,0,.12); padding: 0 20px 20px 20px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; -webkit-box-shadow: 0 1px 21px rgba(0,0,0,.12); -moz-box-shadow: 0 1px 21px rgba(0,0,0,.12); box-shadow: 0 1px 21px rgba(0,0,0,.12); margin-bottom: 35px; background-color: #FFFFFF; overflow:hidden; } body.archive:not(.blog) article .post-media{ margin-left:-20px; margin-right:-20px; margin-top:-25px; } body.archive:not(.blog) article .loop-bottom-seprator{ display: none; } /*-----------------------------------------------------------------------------------*/ /* X. Custom share styles /*-----------------------------------------------------------------------------------*/ .portfolio-item .item-wrap{ position: relative; } .portfolio-container .portfolio-content .share, .inner-meta .a2a_dd{ font-size: 13px; font-weight: 400; color: #1b1b1b; padding-right: 19px; line-height: 15px; } .portfolio-container .portfolio-content .share:hover, .inner-meta .a2a_dd:hover{ opacity: 0.7; } .portfolio-container .portfolio-content .share{ border-left: 1px solid #7f7f7f; padding-left: 15px; } .inner-meta .a2a_dd{ float: right; text-transform: uppercase; } a.a2a_menu_show_more_less{ padding: 15px!important; margin: 0 !important; } .a2a_menu a:visited{ color: #808080!important; border-bottom: 1px solid #ececec!important; border-right: 1px solid #ececec!important; } a.a2a_i, i.a2a_i{ padding: 16px 18px!important; width: 112px !important; } a.a2a_menu_show_more_less{ border: none!important; } /* Pagination */ #content .post-pagination{ border-bottom: 1px solid #c9c9c9; } #content .post-pagination span{ display: inline-block; } #content .post-pagination .next-page-link, #content .post-pagination .no-next-page{ text-align: right; } #content .post-pagination .page-num{ text-align: center; font-size: 12px; color: #020202; } #content .post-pagination > a, #content .post-pagination > span{ padding-bottom: 11px; line-height: 25px; transition: all .5s; border-bottom: 1px solid rgba(0,0,0,0); border-bottom-width: 0; cursor: pointer; position: relative; } #content .post-pagination > a:after, #content .post-pagination > span:after{ content: ""; position: absolute; bottom: 0; width: 0; height: 1px; background-color: #020202; left: 0; transition: all .7s; } .single-post #content{ margin-bottom: 30px; } #content .post-pagination a{ color: #c9c9c9; display: inline-block; font-size: 12px; font-weight: normal; } #content .post-pagination > a:hover{ color: #3A3A3A; } /* blog pagination */ .blog #content .post-pagination{ width: 97%; overflow: hidden; position: relative; border: none; } .post-pagination > a, .post-pagination > span{ width: 33.33%; display: inline-block; float: left; } #content .post-pagination .pagination-border{ position: absolute; width: 100%; bottom: 0; left: 0; height: 1px; background-color: #c9c9c9; height: 1px; padding: 0; } #content .post-pagination .page-num:first-child{ margin-left: 33.33%; } #content .post-pagination .post-pagination-hover{ height: 1px; padding-bottom: 0; position:absolute; left:-33.33%; bottom: 0; z-index:0; background: #e21907; opacity:0; transition:all 300ms ease-in-out; } #content .post-pagination .prev-page-link:hover~.post-pagination-hover, #content .post-pagination .no-prev-page:hover~.post-pagination-hover{ left:0; opacity:1; } #content .post-pagination .page-num:hover~.post-pagination-hover { left:33.33%; opacity:1; } #content .post-pagination .next-page-link:hover~.post-pagination-hover, #content .post-pagination .no-next-page:hover~.post-pagination-hover{ left:66.66%; opacity:1; } /*--------------------------------------------------------- Notification Center ---------------------------------------------------------*/ .tab-cell { width: 100%; margin-right: 10px; } .notification-center{ position: fixed; width: 100%; height: 0; z-index: -99999; opacity: 0; overflow: hidden; } .notification-center .notification-collapse{ width: 55px; height: 35px; background: url(assets/img/notification-sprite.png) center -1302px no-repeat; position: absolute; bottom: 50px; left: 50%; cursor: pointer; margin-left: -27px; opacity: 0; } .notification-collapse-area{ position: absolute; width: 100%; height: 100px; bottom: 0; z-index: 0; } .notification-center .header, .notification-center #notification-tabs{opacity: 0;} .notification-center.dark{ background-color: rgba(0,0,0,.8); } .notification-center.dark span, .notification-center.dark a, .dark #notification-tabs ul li.ui-state-active a{ color: #FFFFFF; } .notification-center.light{ background-color: rgba(255,255,255,.8); } .notification-center.light span, .notification-center.light a, .light #notification-tabs ul li.ui-state-active a{ color: #000; } .notification-center .notification-tab{ text-align: center; margin: 0 auto } .notification-center .notification-tab .tab-item{ display: inline-block; } .notification-center .header{ margin-bottom: 45px; } .notification-center .info{ padding: 23px 30px; height: 63px; } .notification-center .info span{ color: #878787; transition: color .3s; float: right; line-height: 13px; cursor: pointer; } .notification-center .info span:hover{ color: #FFFFFF; } .notification-center .info .date{ font-size:12px; font-weight: 400; } .notification-center .info .time{ font-size: 13px; margin-left: 15px; } .notification-center .logo{ /* left: 50%; */ position: relative; display: table; /* transform: translateX(-50%); */ margin: auto; } .notification-center .logo{ max-height: 300px; max-width:300px; } .notification-center div[id*='opt']{ min-height: 200px; float: left; margin-top: 0; } #notification-tabs{ border-radius: 0; width: 100%; height:100%; margin: 0 auto; background-color: transparent; border: none; text-align: center; } #notification-tabs .tab-title{ display: none; } #notification-tabs .tab-container{ width: 80%; margin: auto; } #notification-tabs .pager{ margin-bottom:100px; position: relative; z-index: 999; } #notification-tabs .pager a{ margin-right: 20px; opacity: .5; transition: opacity .3s; position: relative; width: 100px; height: 40px; cursor: pointer; } #notification-tabs .pager a[class=""] { display: none; } #notification-tabs .pager a:hover{ opacity: 1; } #notification-tabs .pager a.is-selected{ height: 23px; opacity: 1; } #notification-tabs .pager a.is-selected:after{ content: ""; height: 1px; background-color: #fff; position: absolute; width: 100%; bottom:-5px; left: 0; } /**************************/ /** Posts Section **/ /**************************/ .notification-center .post{ text-align: left; padding:0 35px 25px 0; border-bottom: 1px solid rgba(255,255,255,.1); margin: 0 15px 25px; width: calc(100% / 3 - 30px); max-width: 500px; display: table; float: left; height: 100px; } .notification-center .post .date{ width: 17.1%; padding-right: 29px; display: table-cell; } .notification-center .post .date .detail { float: left; margin-right: 25px; } .notification-center .post .date span{ display: block; } .notification-center .post .date .day{ font-size: 30px; margin-bottom: 3px; opacity: .5;} .notification-center .post .date .month{ font-size: 11px; font-weight: 800; margin-bottom: 5px; text-transform: uppercase; } .notification-center .post .date .year{font-size: 11px; font-weight: 800;} .notification-center .post .title{ display: table-cell; vertical-align: middle; width: 75%; text-align: left; font-weight: 400; font-size: 14px; text-transform: uppercase; top: -2px; line-height: 18px; position: relative; } .notification-center.dark .post span, .notification-center.dark .post .title, .notification-center.dark .post p{ color: #a6a6a6; } .notification-center.dark .post:hover span, .notification-center.dark .post:hover .title, .notification-center.dark .post:hover p{ color: #FFFFFF; } .notification-center .post:hover .date .day{ opacity: 1; } /**************projects tab*****************/ .notification-center .portfolio, .notification-center .posts-tab .notification-tab{ overflow-y: hidden; } .notification-center .portfolio{ max-height: 190px; margin: 0 auto; } .notification-center .portfolio-item > a { display: block; } .notification-center .portfolio-thumbnail{ /*max-width: 210px;*/ height: 140px; background-size: cover; background-position: center center ; margin-bottom: 15px; position: relative; } .notification-center .portfolio-thumbnail:before{ content: ''; background-color: #000; opacity: 0; width: 100%; height: 100%; left: 0; top: 0; position: absolute; transition: opacity .3s; } .notification-center .portfolio-item:hover .portfolio-thumbnail:before{ opacity: .3; } .notification-center .portfolio-item{ text-align: center; margin-right: 30px; margin-bottom: 45px; margin-top: 45px; width: 210px; height:190px; } .notification-center .portfolio-item .portfolio-title{ opacity: .5; transition: opacity .3s; } .notification-center .portfolio-item:hover .portfolio-title{ opacity: 1; } .notification-center .portfolio-item .portfolio-title, .notification-center .portfolio-item .portfolio-category{ font-weight: normal; font-size: 13px; } .notification-center .portfolio-item .portfolio-category{ margin-top: 5px; opacity: .2; } /***************** Shop Notification ****************/ #notification-tabs #opt4{ text-align: center; } #notification-tabs .cart_list { display:block; overflow: auto; margin: auto; height:410px; border: none; max-width: 100%; } #notification-tabs .cart_list li{ display:inline-block; opacity: .7; transition: .5s all; margin-right: 36px; text-transform: uppercase; text-align: center; padding-top:10px; margin-bottom: 50px; width: 230px; } #notification-tabs .cart_list li:last-of-type { margin-right: 0; } #notification-tabs .cart_list li.empty{ background: transparent url(assets/img/notification-sprite.png) center 0 no-repeat; color: #FFFFFF; padding-top: 297px; opacity: 1; font-size: 18px; } #notification-tabs .cart_list li.empty a{ display: block; margin-top: 6px; font-weight: 400; font-size: 14px; color: #515151; } #notification-tabs .cart_list li.empty a:hover{ color: #FFFFFF; } #notification-tabs .cart_list li:hover{ opacity: 1; } #notification-tabs .cart_list li div.cart-img{ float: none; width:230px; height:280px; background-position: center center; background-size: cover; margin-bottom: 15px; background-image: url(assets/img/place-holder.jpg); } #notification-tabs .cart_list li a{ color:#fff; /*font-family: roboto, sans-serif;*/ font-size: 12px; } #notification-tabs .cart_list li a.remove{ font-family: roboto, serif; font-size: 24px; margin-top: -17px; margin-left:-5px; display: block; color: #fff !important; background: none!important; width: 1em; line-height: 1; opacity: 0; transition:all 800ms; } #notification-tabs .cart_list li:hover a.remove{ opacity: 1; } #notification-tabs .cart_list li .quantity,#notification-tabs .cart_list li .quantity .amount{ color:#b5a972; /*font-family: roboto, sans-serif;*/ } #notification-tabs .cart_list li .quantity{ display: block; margin-top: 8px; } #notification-tabs p.total, #notification-tabs p.total .amount{ color:#b5a972; /*font-family: roboto, sans-serif;*/ margin-top:30px; font-weight: normal; } #notification-tabs .buttons{ margin-top: 20px; } #notification-tabs p.buttons .wc-forward{ text-transform: uppercase; background: #696969; color: #fff; border: none; width: 180px; height: 50px; display: inline-block; padding-top: 18px; font-weight: normal; transition: all 300ms; } #notification-tabs p.buttons .wc-forward:hover{ background: #b5a972; } #notification-tabs p.buttons .checkout{ background: transparent; border: 1px solid #fff; margin-left: 10px; } #notification-tabs p.buttons .checkout:hover{ background:#fff; color: #000; } /* notification Light style*/ .notification-center.light #notification-tabs .cart_list li.empty{ background: transparent url(assets/img/notification-sprite.png) center -610px no-repeat; color: #000; opacity: .6; } .notification-center.light .notification-collapse{ background: url(assets/img/notification-sprite.png) center -1402px no-repeat; } .notification-center.light .post{ border-bottom-color: rgba(0,0,0,.1); } /* View Cart Page */ body.woocommerce-cart #content{ width: 100% !important; } body.woocommerce-cart .sidebar{ display: none;width: 0%; } .empty-cart-container{ width: 540px; margin: 200px auto 240px auto; text-align: center; padding-top: 50px; padding-bottom: 80px; background-color: #ffffff; display: block; box-shadow: 0 0 15px 0 rgba(0,0,0,0.2); } .return-to-shop a.button { background-color: transparent; border-radius: 27px !important; width: 188px; color: black; font-size: 13px !important; line-height: 3px; height: 42px !important; margin-top: 30px; border: 2px solid #949494; transition: all 0.2s ease-in; } .return-to-shop a.button:hover{ background-color: black; color: #FFFFFF; border: 2px solid black; } p.cart-empty{ font-weight: 600; } .empty-cart-icon-container{ display: block; background: url("assets/img/empty-cart.png"); background-size: 100% 100%; width: 150px; height: 200px; margin: 40px auto; } /********************************* Search Tab ************************************/ #notification-tabs .search-container{ width: 960px; margin: 0 auto; } #result-container{ overflow-x: hidden; } #notification-tabs .input-holder{ position: relative; height: 80px; max-width: 100%; margin: 200px auto 25px; } #notification-tabs #search-input { background-color: transparent; border: none; border-bottom: 1px solid rgba(184,184,184,0.3); max-width: 100%; width: 100%; font-size: 40px; line-height: 80px; font-weight: 100; color: #fff; outline: none; position: absolute; left: 0; } #notification-tabs .clear-button{ width: 40px; height: 40px; position: absolute; background: transparent url(assets/img/notification-sprite.png) center -1482px no-repeat; right: 0; top: 50%; cursor: pointer; transition: background-image 200ms; } #notification-tabs .clear-button.searching{ background-image: url("assets/img/loading.svg"); } #notification-tabs #result-container .search-title{ margin-bottom: 30px; } #notification-tabs #result-container .search-title, #notification-tabs #result-container .more-result{ text-align: left; font-size: 15px; font-family: 'Roboto',sans-serif; color: #555; } #notification-tabs #result-container .search-title-empty{ margin-bottom: 100px; text-transform: uppercase; color: #FFFFFF; text-align: center; font-size: 20px; margin-top: 95px; } #notification-tabs #result-container .search-title-empty:before{ content: ''; background: transparent url(assets/img/notification-sprite.png) center -445px no-repeat; width: 205px; display: block; height: 200px; background-size: cover; margin: 0 auto 80px; } #notification-tabs #result-container .more-result{ display: block; margin-top: 15px; } #notification-tabs #result-container .stand-out{ font-size: inherit; font-family: inherit; } .notification-center.dark .stand-out{ color: #fff; } .notification-center.light .stand-out{ color: #000; } #notification-tabs #result-container .item{ margin-bottom: 25px; } #notification-tabs #result-container .thumbnail{ height: 145px; background-size: cover; background-position: center; background-repeat: no-repeat; margin-bottom: 20px; position: relative; } #notification-tabs #result-container .background-overlay{ background: #000; opacity: 0.5; transition: opacity 300ms; width: 100%; height: 100%; position: absolute; } #notification-tabs #result-container .item:hover .background-overlay{ opacity: 0; } #notification-tabs #result-container .item .title{ font-size: 13px; text-transform: uppercase; color: rgba(255,255,255,0.5); line-height: 18px; text-align: center; transition: color 300ms; min-height: 36px; } #notification-tabs #result-container .item:hover .title{ color: rgba(255,255,255,1); } #notification-tabs .variation{ display: none; } /********************************* Not Found Page (Error 404) ************************************/ .error404 #layoutcontainer { height: 100%; } .error404 .not-found-page { text-align: center; position: fixed; bottom: 0; display: table; top: 0; width: 100%; left: 0; margin: auto; right: 0; } .error404 .not-found-page .image { background-image: url("assets/img/not-found.png"); background-repeat: no-repeat; background-position: center; width: 138px; height: 142px; margin: 0 auto 52px auto; } .error404 .not-found-page strong{ font-size: 36px; } .error404 .not-found-page p { text-transform: uppercase; font-size: 21px; } .error404 footer{ display: none; } .not-found-page > span{ font-size:36px; } /********************************* Search Result Page ************************************/ body.search .layout-container .color-overlay, body.search .layout-container .texture-overlay, body.search .layout-container .bg-image, body.search .content .color-overlay, body.search .content .texture-overlay, body.search .content .bg-image{ display:none; } body.search header a, body.search header .navigation a, body.search header .icons-pack a{ color:#000 !important; } .search-no-results header, .search-results header { position: relative; } .search-results header.left, .search-results header.right{ position: fixed; } .search-no-results main, .search-results main { margin: 80px auto; width: 60% !important; } .search-no-results main form input[type="text"], .search-results main form input[type="text"] { font-weight: 300; color: #000; font-size: 40px; width: calc(100% - 40px); border: none; outline: none; } .search-no-results main form input[type="submit"], .search-results main form input[type="submit"] { background-image: url("assets/img/magnifier.png"); background-repeat: no-repeat; background-position: center; border: none; background-color: transparent; width: 30px; height: 31px; } .search-results main form input[type="submit"]:hover { opacity: .3; } .search-results main .search-result { margin-top: 80px; } .search-results main .search-result .search-item { float: left; margin: 0 32px 32px 0; width: calc( 100% / 4 - 32px ); min-height: 198px; } .search-results main .search-item { text-align: center; } .search-results main .search-item img { width: 211px; height: 145px; display: inline; transition: opacity .3s; } .search-results main .search-result .search-item h3 { line-height: 0; width: 73%; padding-top: 15px; margin: auto; } .search-results main .search-result .search-item a { font-size: 15px; } .place-holder-thumbnail { height: 145px; background-position: center; background-size: cover; background-repeat: no-repeat; transition: opacity .3s; margin-left: auto; margin-right: auto; backface-visibility: hidden; } .place-holder-no-thumbnail { height: 145px; background-position: center; background-size: cover; background-repeat: no-repeat; background-image: url(assets/img/place-holder.jpg); transition: opacity .3s; backface-visibility: hidden; } .search-results main .search-result .search-item:hover .place-holder-thumbnail, .search-results main .search-result .search-item:hover .place-holder-no-thumbnail { opacity: .5; } /********************* Miss shortcode *******************************/ .miss-shortcode{ background: #e2e2e2 url("assets/img/miss.jpg") no-repeat 0 center; max-width: 670px; display: block; padding: 40px 5%; text-align: center; min-height: 192px; background-size: contain; margin: 0 auto; border: 2px solid #fff; outline: 1px solid #e2e2e2; } .miss-shortcode .title{ font-size: 40px!important; line-height: 45px; letter-spacing: -2px; margin-bottom: 13px; color: #616378; } .miss-shortcode .desc{ font-size: 16px; line-height: 25px; margin: 0 20px; color: #616378; } .miss-shortcode .desc a{ font-size: 16px; line-height: 25px; color: #616378; position: relative; } .miss-shortcode .desc a:after{ content: ""; width: 100%; position: absolute; height: 2px; left: 0; bottom: -3px; background-color: #a9aab2; } /*** IE styles ***/ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { /*** IE 10 ***/ .music-sc .tracks{ list-style:none; } /** IE 11 **/ *::-ms-backdrop, .music-sc .tracks{ list-style:none; } } /**************************************** New Builder *****************************/ .btn-group-vertical>.btn-group:after, .btn-group-vertical>.btn-group:before, .btn-toolbar:after, .btn-toolbar:before, .container-fluid:after, .container-fluid:before, .container:after, .container:before, .dl-horizontal dd:after, .dl-horizontal dd:before, .form-horizontal .form-group:after, .form-horizontal .form-group:before, .modal-footer:after, .modal-footer:before, .nav:after, .nav:before, .navbar-collapse:after, .navbar-collapse:before, .navbar-header:after, .navbar-header:before, .navbar:after, .navbar:before, .pager:after, .pager:before, .panel-body:after, .panel-body:before, .row:after, .row:before, .vc_row:after, .vc_row:before{ content: ' '; display: table; } .vc_clearfix:after, .vc_clearfix:before{ content: ' '; display: table; clear: both; } .portfolio-page-mode{ position: absolute; top: 0px; right: 0px; width: 100%; height: 100%; } .sidebar.widget-area.visible-desktop.hidden-tablet.light-sidebar.left-align.border.left.right-sidebar{ height: auto !important; } /* VC grid styles */ .vc_grid > div{ width:100%; } /* GENERAL STYLES */ .wpb_column .wpb_content_element { margin-bottom: 0; } small.wcvendors_sold_by_in_loop div { display: none; } .compose-mode .item_button > a { cursor: pointer !important; } .md-text-content * li{ margin-left:30px; } .md-text-content ul br, .md-text-content ol br{ display:none ; } #wpadminbar ul#wp-admin-bar-root-default>li.pixflow_custom_links { margin-right: 5px; } /* Bug Fix Version 7.3 */ @media (max-width: 1280px){ .img-box-fancy .image-box-fancy-desc.image-box-fancy-desc-normal { width: 80% !important; } } @media (max-width:800px){ .wrap-client-carousel { min-height: 300px; } } .iconbox-new .read-more:hover i:last-child{ display:none !important; } /**************************************** Light Notification *****************************/ .light #notification-tabs .cart_list li a { color: #000; } .notification-center span.woocommerce-Price-currencySymbol { color: inherit; } .light #notification-tabs p.buttons .checkout{ border: 1px solid #696969; color: #696969; } .light #notification-tabs #search-input{ color: #000; } .light #notification-tabs #result-container .search-title-empty{ color: #000; } .light #notification-tabs #result-container .item .title{ color: #000; } /*-------------------------------------- Subscribe --------------------------------------*/ .sc-subscribe { padding: 50px 0 56px; text-align: center; } .modern-subscribe .mc4wp-form, .widget-area .mc4wp-form, .sc-subscribe .mc4wp-form { display: none; } .subscribe-title { font-size: 35px; line-height: 35px; margin-bottom: 12px; } .subscribe-sub-title { font-size: 14px; font-weight: 100; } .subscribe-textbox { padding: 20px; width: 60%; background: transparent; text-transform: uppercase; margin-top: 30px; text-align: center; outline: none; max-width: 750px; -webkit-box-shadow:none; box-shadow: none; } .subscribe-textbox:focus::-webkit-input-placeholder { color: transparent !important; } .subscribe-textbox:focus:-moz-placeholder { color: transparent !important; } /* FF 4-18 */ .subscribe-textbox:focus::-moz-placeholder { color: transparent !important; } /* FF 19+ */ .subscribe-textbox:focus:-ms-input-placeholder { color: transparent !important; } /* IE 10+ */ .subscribe-button { margin-top: 20px; border: none; width: 195px; height: 47px; text-align: center; outline: none; transition: background .4s; } .subscribe-err { margin-top: 5px; font-size: 11px; } .subscribe-button-animation { -webkit-animation: subscribe-animation 2s infinite; -o-animation: subscribe-animation 2s infinite; -moz-animation: subscribe-animation 2s infinite; animation: subscribe-animation 2s infinite; } @keyframes subscribe-animation { 00% { opacity: 1 } 50% { opacity: .5 } 100% { opacity: 1 } } #custom_html-2 { padding-top: 10px; } #custom_html-2 ul.commercial-icons, #custom_html-2 .policy-info { text-align: center; font-size: 14px; } #custom_html-2 ul.commercial-icons li { display: inline-block; } #custom_html-2 ul.commercial-icons li img { height: 30px !important; } .single-product .summary .tax_text, .single-product .summary .price { margin-bottom: 10px !important; } .footer-widgets.light .policy-info{ color: rgba(255, 255, 255, 0.6); } .new-collection-products[style] { min-height: 650px !important; } .products .product .thumb-image, .products .product .hover-image { height: 650px !important; } .products .product .thumb-image, .products .product .hover-image { height: 650px !important; }