/*----------------------------------------------------------------------------------- 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: 3.7 Tags: white, left-sidebar, right-sidebar, fluid-layout, fixed-layout, 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 */ .disable-edit-title , .disable-edit{ display: none ; } .inline-editor-title div , .inline-editor-title h1 , .inline-editor-title h2 , .inline-editor-title h3 , .inline-editor-title h4 , .inline-editor-title h5 , .inline-editor-title h6 { width:100% } .alignleft { float: left; margin-right: 10px; } .alignright { float: right; margin-left: 10px; } .aligncenter { margin-left: auto; margin-right: auto; display: table; clear: both; } .wp-caption { } .wp-caption-text{} .sticky .small-thumb .title{background: url(assets/img/Sticky.png)no-repeat scroll 0 4px; padding-left: 19px;} .gallery-caption { margin-left: 0; } .bypostauthor{} /* 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; } /* 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); } .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) { 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.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; } 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; position: relative; text-align: center; padding-left: 5px; margin: 0 !important } 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; } /*------------------------- 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; } 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: absolute; 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; } /*------------------------- 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; } 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); } 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 30px; } 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; } 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-light a.open, .navigation-mobile.header-dark a.open{ color: #40d59f; } .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: #d6d6d6; } .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); } .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; } /*--------------------------------------------------------- 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 .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.footer-default .footer-widgets.light .widget-area.classicStyle.border.split div[class*="col-"]:first-child{ padding-left: 0; }*/ .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: white; } 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; bottom: auto; opacity: 1; } .woocommerce-page footer.footer-parallax{ position: relative !important; } .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); } /* widget subscribe */ .widget-subscribe .subscribe-holder{ width: 90%; } .right-align.sidebar .widget-subscribe .subscribe-holder{ margin-left: 10%; } .widget-subscribe .widget-subscribe-textbox{ border:none; background: transparent; outline: none; width: 88%; float: left; } .right-align.sidebar .widget-subscribe .widget-subscribe-textbox { float: right; text-align: right; } .widget-subscribe .widget-subscribe-button{ background-image: url('assets/img/widget-subscribe-btn.png'); background-color: transparent; background-repeat: no-repeat; border: none; width: 18px; height: 9px; outline: none; float: right; margin-right: 2px; margin-top:5px; transition: margin 0.2s; } .right-align.sidebar .widget-subscribe .widget-subscribe-button{ float: left; margin-right: 0; margin-left: 2px; transform: rotateY(180deg); } .widget-subscribe .widget-subscribe-button:hover{ margin-right: 0; } .widget-subscribe .send{ margin-top: 30px; } .light .widget-subscribe .subscribe-holder, .light-sidebar .widget-subscribe .subscribe-holder{ border-bottom: 1px solid rgba(255,255,255, 0.3); } .dark .widget-subscribe .subscribe-holder, .dark-sidebar .widget-subscribe .subscribe-holder{ border-bottom: 1px solid rgba(0,0,0, 0.3); } /* widget-contact-info */ .light .widget-contact-info-content p, .light-sidebar .widget-contact-info-content p { color: rgba(255, 255, 255, 0.6) !important; } .dark .widget-contact-info-content p, .dark-sidebar .widget-contact-info-content p { color: rgba(0, 0, 0, 0.6) !important; } .widget-contact-info-content div, .widget-contact-info-content div span { margin-bottom: 5px; } footer .widget-contact-info-content { min-height: 130px; min-width: 240px; } /* 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 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); } /* 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; } /* 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); } /* Text Widget */ .footer-widgets .widget-md-text .text-widget-desc p{ padding-right: 40px; } .modernStyle .text-widget-image { display: inline-block; } .widget-md-text .text-widget-image { max-width: 300px; max-height: 70px; margin-bottom: -9px; } .center-align .widget-md-text .text-widget-image { margin: 0 auto; } .right-align .widget-md-text .text-widget-image { float: right; } .widget-md-text #text-widget-btn { margin-top: 25px; color: inherit; border-color: inherit; } .widget-md-text #text-widget-btn .shortcode-btn .fade-square { transition: border-color 0.3s; } .widget-md-text #text-widget-btn .shortcode-btn .fade-square span { transition: color 0.3s; } .dark .widget-md-text .text-widget-desc p, .dark-sidebar .widget-md-text .text-widget-desc p { color: rgba(0, 0, 0, 0.6) !important; } .dark .widget-md-text #text-widget-btn .shortcode-btn .fade-square, .dark-sidebar .widget-md-text #text-widget-btn .shortcode-btn .fade-square { border-color: rgba(0, 0, 0, 0.6); padding: 10px 21px 10px 10px; } .dark .widget-md-text #text-widget-btn .shortcode-btn .fade-square:hover, .dark-sidebar .widget-md-text #text-widget-btn .shortcode-btn .fade-square:hover { border-color: rgba(0, 0, 0, 1); } .dark .widget-md-text #text-widget-btn .shortcode-btn .fade-square:hover span, .dark-sidebar .widget-md-text #text-widget-btn .shortcode-btn .fade-square:hover span { color: rgba(0, 0, 0, 1); } .light .widget-md-text .text-widget-desc p, .light-sidebar .widget-md-text .text-widget-desc p { color: rgba(255, 255, 255, 0.6) !important; } .light .widget-md-text #text-widget-btn .shortcode-btn .fade-square, .light-sidebar .widget-md-text #text-widget-btn .shortcode-btn .fade-square { border: 1px solid rgba(255, 255, 255, 0.6); } .light .widget-md-text #text-widget-btn .shortcode-btn .fade-square:hover, .light-sidebar .widget-md-text #text-widget-btn .shortcode-btn .fade-square:hover { border: 1px solid rgba(255, 255, 255, 1); } .light .widget-md-text #text-widget-btn .shortcode-btn .fade-square:hover span, .light-sidebar .widget-md-text #text-widget-btn .shortcode-btn .fade-square:hover span { color: rgba(255, 255, 255, 1); } .textwidget iframe{ width:100%; } /* 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; } div#widget-column-1 { position: inherit; } 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; } /*------------------------------------------------------- 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; } .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; } /*------------------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%; } /*--------------------------------------------------------- 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 { 0% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; -moz-animation-name: fadeIn; -o-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @-o-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } .fadeOut { -webkit-animation-name: fadeOut; -moz-animation-name: fadeOut; -o-animation-name: fadeOut; animation-name: fadeOut; } /*--------------------------------------------------------- Button Shortcode ---------------------------------------------------------*/ /* General */ .shortcode-btn .button-icon { vertical-align: middle; text-align: center; } .shortcode-btn { display: inline-block; backface-visibility: hidden; padding:1px; white-space: nowrap; } .shortcode-btn .button { display: inline-table; } .shortcode-btn .button.fill-oval span, .shortcode-btn .button.fade-oval span { vertical-align: middle; position: relative; top:-1px; } .shortcode-btn .button.button-small.slide span{ position: relative; top:-2px; } .shortcode-btn .animation{ overflow: hidden; } /***** Buttons Small / Standard Sizes *****/ .shortcode-btn .button-small { font-size: 12px; line-height: 13px; } .shortcode-btn .button-standard .button-icon { font-size: 15px; width: 15px; height: 15px; line-height: 15px; } .shortcode-btn .button-standard .button-icon { font-size: 14px; width: 22px; height: 22px; line-height: 22px; } .shortcode-btn .button-standard { font-size: 13px; line-height: 13px; } /* Fade Square Sizes */ .shortcode-btn .button.fade-square.button-small .button-icon { font-size: 14px; } /* Fade Oval Sizes */ .shortcode-btn .button.fade-oval.button-standard .button-icon, .shortcode-btn .button.fill-oval.button-standard .button-icon{ font-size: 18px; } .shortcode-btn .button.fade-oval.button-small .button-icon, .shortcode-btn .button.fill-oval.button-small .button-icon{ font-size: 14px; } /* Animation Sizes */ .shortcode-btn .animation span{ display: inline-block; } .shortcode-btn .button-standard.animation { letter-spacing: 6px; } body:not(.compose-mode) .shortcode-btn .button-standard.animation{ overflow: hidden; } .shortcode-btn .button-small.animation { letter-spacing: 4px; } .shortcode-btn .button-small.animation span , .shortcode-btn .button-standard.animation span{ margin-right: 9px; } .shortcode-btn .button-small.animation .button-icon { font-size: 15px; } /* Slide Sizes */ .shortcode-btn .button-standard.slide, .shortcode-btn .button-small.slide { text-align: left; } .shortcode-btn .slide.slide-transition{ transition: width .4s, background .4s; } .shortcode-btn .button-standard.slide { height: 52px; width: 52px; } .shortcode-btn .button-small.slide { height: 40px; width: 40px; } .shortcode-btn .button-standard.slide span { left: 25px; opacity: 0; padding-right: 24px; top: 50%; transform: translateY(-50%); bottom: 0; font-size: 14px; } .shortcode-btn .button-small.slide span { opacity: 0; left: 17px; padding-right: 15px; top: 0; bottom: 0; margin: 13px 0; } .shortcode-btn .button-standard.slide .button-icon { width: 47px; display: table; height: 52px; line-height: 54px; } .shortcode-btn .button-small.slide .button-icon { width: 38px; display: inline-block; height: 40px; line-height: 38px } /* Come In Sizes */ .shortcode-btn .button-standard.come-in { border: 3px solid; } .shortcode-btn .button-small.come-in{ border: 2px solid; } /* Flash Animate Sizes */ .shortcode-btn .button-standard.flash-animate:hover .button-icon { left: 5px; } .shortcode-btn .button-small.flash-animate:hover .button-icon { left: 4px; } .shortcode-btn .button-standard.flash-animate:hover { /*padding-right: 30px !important;*/ letter-spacing: 0; } .shortcode-btn .button-small.flash-animate:hover { /*padding-right: 29px !important;*/ } /* Fade Square Style */ .shortcode-btn .fade-square, .shortcode-btn .fade-oval, .shortcode-btn .fill-oval, .shortcode-btn .slide, .shortcode-btn .come-in, .shortcode-btn .fill-rectangle, .shortcode-btn .animation, .shortcode-btn .flash-animate { opacity: 1; border: 1px solid; font-weight: 400; } .shortcode-btn .fade-oval, .shortcode-btn .flash-animate, .shortcode-btn .slide{ border: 2px solid; } .shortcode-btn .fade-square, .shortcode-btn .fade-oval, .shortcode-btn .come-in, .shortcode-btn .animation, .shortcode-btn .flash-animate { -webkit-transition: background-color .3s; -moz-transition: background-color .3s; -ms-transition: background-color .3s; -o-transition: background-color .3s; transition: background-color .3s; } .shortcode-btn .fade-square, .shortcode-btn .flash-animate { border-radius: 3px; } .shortcode-btn .fade-square .button-icon, .shortcode-btn .fade-oval .button-icon, .shortcode-btn .fill-oval .button-icon{ padding-right: 10px; } .shortcode-btn .fade-square .button-icon, .shortcode-btn .fade-square span, .shortcode-btn .fade-oval .button-icon, .shortcode-btn .fade-oval span{ -webkit-transition: all 100ms; -moz-transition: all 100ms; -ms-transition: all 100ms; white-space: nowrap; -o-transition: all 100ms; transition: all 100ms; } .shortcode-btn .fill-oval{ -webkit-transition: all .4s; -moz-transition: all .4s; -ms-transition: all .4s; -o-transition: all .4s; transition: all .4s; } /* Fade Oval Style */ .shortcode-btn .fade-oval, .shortcode-btn .fill-oval{ border-radius: 50px; font-size: 14px; } .shortcode-btn .fill-oval span{ line-height: 13px; } /* Slide Style */ /*.shortcode-btn .slide,*/ .shortcode-btn .slide .button-icon { /*-webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s;*/ transition: all .8s; } .shortcode-btn .slide { border-radius: 50px; display: flex; align-items: center; text-align: center; position: relative; overflow: hidden; } .shortcode-btn .slide span { white-space: nowrap; -webkit-transition: left .4s, opacity .4s; -moz-transition: left .4s, opacity .4s; -ms-transition: left .4s, opacity .4s; -o-transition: left .4s, opacity .4s; transition: left .4s, opacity .4s; } .shortcode-btn .slide:hover { border-radius: 50px; background-color: #2d2d2d; width: 124px; } .shortcode-btn .slide:hover .button-icon { transform: rotate(360deg); } .shortcode-btn .slide .button-icon { font-size: 18px; } /* Come In Style */ .shortcode-btn .come-in, .shortcode-btn .fill-rectangle{ position: relative; overflow: hidden; z-index: 9; transition: all .4s; } .shortcode-btn .come-in:hover:after { width: 100%; } .shortcode-btn .come-in:after { content: ''; position: absolute; z-index: -1; width: 0; height: 100%; top: 0; right: 0; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all 0.3s; } .shortcode-btn .come-in .button-icon, .shortcode-btn .come-in span{ -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all 0.3s; } .shortcode-btn .come-in .button-icon, .shortcode-btn .fill-rectangle .button-icon{ margin-right: 10px; } .shortcode-btn .button-standard.come-in span, .shortcode-btn .button-standard.fill-rectangle span{ font-size: 14px; line-height: 1.2em; } .shortcode-btn .button-standard.come-in .button-icon, .shortcode-btn .button-standard.fill-rectangle .button-icon{ font-size: 15px; } /* Animation Style */ .shortcode-btn .animation { font-size: 13px; line-height: 13px; position: relative; border: 1px solid; -webkit-transition: opacity .4s, color .4s; -moz-transition: opacity .4s, color .4s; -ms-transition: opacity .4s, color .4s; -o-transition: opacity .4s, color .4s; transition: opacity .4s, color .4s; } .shortcode-btn .animation:after { content: ""; position: absolute; left: -125px; width: 80px; height: 100px; top: -25px; -webkit-transition: left .4s, opacity .4s, color .4s, transform .4s; -moz-transition: left .4s, opacity .4s, color .4s, transform .4s; -ms-transition: left .4s, opacity .4s, color .4s, transform .4s; -o-transition: left .4s, opacity .4s, color .4s, transform .4s; transition: left .4s, opacity .4s, color .4s, transform .4s; -webkit-transform: skew(40deg); -moz-transform: skew(40deg); -ms-transform: skew(40deg); -o-transform: skew(40deg); transform: skew(40deg); } .shortcode-btn .animation:hover:after { -webkit-transform: skew(0deg); -moz-transform: skew(0deg); -ms-transform: skew(0deg); -o-transform: skew(0deg); transform: skew(0deg); left:101%; } .shortcode-btn .animation:hover { opacity: 1; } .shortcode-btn .animation .button-icon{ font-size: 15px; } /* Flash Animate Style */ .shortcode-btn .flash-animate { -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } .shortcode-btn .flash-animate:hover .button-icon { opacity: 1; left: 5px; } .shortcode-btn .flash-animate .button-icon { opacity: 0; left: -3px; position: relative; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } /*--------------------------------------------------------- Full width Button Shortcode ---------------------------------------------------------*/ .full-width-button{ transition: 0.3s; } .full-width-button a{ position: relative; display: block; width: 100%; height: 100%; text-align: center; } .full-width-button a .title{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: 0.3s; line-height: 1.5em; } /*--------------------------------------------------------- Text shortcode -----------------------------------------------------------*/ .md-text-container{ display: flex; } .md-text-container.md-align-left { justify-content: flex-start; } .md-text-container.md-align-center { justify-content: center; } .md-text-container.md-align-right { justify-content: flex-end; } .md-text .md-text-title-separator{ max-width: 96%; } .md-text-button .shortcode-btn { float: none !important; } .md-text .without-title, .md-text .without-content{ display: none; } /*--------------------------------------------------------- Call To Action Shortcode ---------------------------------------------------------*/ .call-to-action { background-position: center; background-size: cover; padding: 0 20px; } .call-to-action .content { padding: 47px 0; position: relative; } .call-to-action .content .title { margin-bottom: 12px; max-width: 70%; } .call-to-action .content .description { font-size: 14px; line-height: 21px; max-width: 100%; margin-bottom: 40px; } .call-to-action .button-parent { display: inline-block; } .col-sm-12 .call-to-action .description, .col-sm-11 .call-to-action .description, .col-sm-10 .call-to-action .description { float: left; margin-bottom: 0; max-width: 70%; } .col-sm-12 .call-to-action .button-parent, .col-sm-11 .call-to-action .button-parent, .col-sm-10 .call-to-action .button-parent { position: absolute; right: 0; top: 50%; padding: 0 0 0 20px; } /*--------------------------------------------------------- List Shortcode ---------------------------------------------------------*/ .list-shortcode{ display: flex; } .list-shortcode.md-align-left{ justify-content: flex-start; } .list-shortcode.md-align-center{ justify-content: center; } .list-shortcode.md-align-right{ justify-content: flex-end; } .list-shortcode ol { counter-reset: li; padding-left: 36px; } .list-shortcode ol > li { position: relative; margin: 0 0 15px 0; padding: 4px 8px; list-style: none; text-align: left; } .list-shortcode ol > li:before { content: counter(li); counter-increment: li; position: absolute; top: 50%; left: -35px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width: 35px; height: 35px; margin-right: 8px; padding: 6px; border: 1px solid; border-radius: 50%; text-align: center; transform: translateY(-50%); } .list-shortcode li:hover, .list-shortcode li:hover:before { transition: all 300ms; } .list-shortcode ul{ width: 100%; } .list-shortcode ul > li { list-style: none; position: relative; margin-top: 18px; } .list-shortcode ul li:first-child { margin-top: 0; } .list-shortcode ul li span { padding-right: 16px; font-size: 16px; } .list-shortcode ul li p { display: inline-block; font-size: 14px; width: calc(100% - 50px); vertical-align: middle; } .list-shortcode ul li p, .list-shortcode ol li p{ line-height: 1.4em; } /*--------------------------------------------------------- Tabs Shortcode ---------------------------------------------------------*/ .wpb_tabs .px_tabs_nav li{ float: left; } .wpb_content_element .px_tabs_nav li { background-color: #FFF; white-space: nowrap; padding: 0; background-image: none; list-style: none!important; } .wpb_column .wpb_content_element{margin-bottom: 0} .wpb_content_element .px_tabs_nav.md-custom-tab > li { background-color: transparent; margin: 0; flex-direction: row-reverse; position: relative; justify-content: center; } .wpb_content_element .px_tabs_nav.md-custom-tab > li, .wpb_content_element .px_tabs_nav.md-custom-tab > li i { transition: color .5s, background-color .5s, opacity 0.5s; } .wpb_content_element .px_tabs_nav.md-custom-tab > li { height: 80px; } .wpb_content_element .px_tabs_nav.md-custom-tab > li > a { padding: 26px 25px 30px 13px; float: right; } .wpb_content_element:not(.md_modernTab) .px_tabs_nav.md-custom-tab > li > a { text-align: center; display: block; float:none; padding:26px 0 30px 0; } .wpb_content_element.md_modernTab .px_tabs_nav.md-custom-tab > li > a { padding: 30px 18px 30px; } .wpb_content_element .px_tabs_nav.md-custom-tab > li i { margin-left: 10px; margin-right: 10px; font-size: 30px; } .wpb_content_element:not(.md_modernTab) .px_tabs_nav.md-custom-tab > li i{ margin-left:0 } .wpb_content_element .px_tabs_nav.md-custom-tab > li span{ position: relative; top: 50%; transform: translateY(-50%); display: inline-block; } .wpb_content_element .px_tabs_nav.md-custom-tab > li i.no-title { position: absolute; top: 0; margin: auto; bottom: 0; text-align: center; right: 0; left: 0; vertical-align: middle; height: 24px; } .wpb_content_element .px_tabs_nav.md-custom-tab > li i.icon-no-icon { display: none; } .md_tab.wpb_tabs { border: #d5d4d4 1px solid; } .md_tab ul.px_tabs_nav li .left-icon { float: left; } body .wpb_content_element .wpb_tour_tabs_wrapper .wpb_tab { padding-top: 2em; padding-bottom: 2em; } /*--------------------------------------------------------- Modern Tab Shortcode ---------------------------------------------------------*/ .md_modernTab.wpb_content_element .px_tabs_nav li.ui-tabs-active, .md_modernTab.wpb_content_element .px_tabs_nav li:hover { background: none; } .md_modernTab.wpb_content_element .wpb_accordion_wrapper .wpb_accordion_header, .md_modernTab.wpb_content_element.wpb_tabs .wpb_tour_tabs_wrapper .wpb_tab { background: none; } .md_modernTab.wpb_content_element .px_tabs_nav { text-align: center; } .md_modernTab.wpb_tabs > .wpb_wrapper > .px_tabs_nav li { float: none; display: inline-block; } .md_modernTab ul.px_tabs_nav li .left-icon { float: none; } .md_modernTab ul.px_tabs_nav .modernTabTitle { margin-top: 10px; } /*--------------------------------------------------------- Accordion & Toggle Shortcode ---------------------------------------------------------*/ .wpb_accordion_header a, .wpb_toggle_header a { font-size: 18px; font-weight:normal; transition: none; transition: font-size 200ms; font-family: inherit; width: calc(100% - 50px); overflow: hidden; line-height:1.2em; } .wpb_md_toggle .wpb_toggle_wrapper h3.wpb_toggle_header a, .wpb_md_toggle2 .wpb_toggle_wrapper h3.wpb_toggle_header a, .wpb_accordion .wpb_accordion_wrapper h3.wpb_accordion_header a { top: 50%; transform: translateY(-50%); padding-left: 0.5em; } .wpb_md_toggle2 .wpb_toggle_wrapper h3.wpb_toggle_header a{ padding-left: 3.9em; } .wpb_toggle_wrapper > .wpb_accordion_section > .last_toggle_el_margin{ margin:0; } .wpb_md_toggle .wpb_toggle_wrapper h3.wpb_toggle_header span, .wpb_md_toggle2 .wpb_toggle_wrapper h3.wpb_toggle_header span, .wpb_accordion .wpb_accordion_wrapper h3.wpb_accordion_header span{ font-size: 22px; } .wpb_md_toggle2 .wpb_toggle_wrapper h3.wpb_toggle_header span.ui-accordion-header-icon{ height: 54px; } .wpb_accordion.with_border .wpb_accordion_wrapper .ui-state-active .ui-icon, .wpb_accordion.with_border .wpb_accordion_wrapper .ui-state-default .ui-icon, .wpb_accordion.without_border .wpb_accordion_wrapper .ui-state-active .ui-icon, .wpb_accordion.without_border .wpb_accordion_wrapper .ui-state-default .ui-icon, .wpb_md_toggle.with_border .wpb_toggle_wrapper .ui-icon, .wpb_md_toggle.without_border .wpb_toggle_wrapper .ui-icon, .wpb_md_toggle2 .wpb_toggle_wrapper .ui-icon{ background-image: none; font-family: 'pixflow-font-library'; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; top: 50%; transform: translateY(-50%); text-indent:0; overflow: visible; } .wpb_md_toggle .wpb_toggle_wrapper .ui-icon, .wpb_md_toggle2 .wpb_toggle_wrapper .ui-icon{ font-size: 19px; } .wpb_accordion .wpb_accordion_wrapper .ui-state-active .ui-icon, .wpb_accordion .wpb_accordion_wrapper .ui-state-default .ui-icon, .wpb_accordion .wpb_accordion_wrapper h3.wpb_accordion_header .icon_left span, .wpb_md_toggle .wpb_toggle_wrapper .ui-state-active .ui-icon, .wpb_md_toggle2 .wpb_toggle_wrapper .ui-state-active .ui-icon, .wpb_md_toggle .wpb_toggle_wrapper .ui-state-default .ui-icon, .wpb_md_toggle2 .wpb_toggle_wrapper .ui-state-default .ui-icon, .wpb_md_toggle2 .wpb_toggle_wrapper h3.wpb_toggle_header .icon_left span, .wpb_md_toggle .wpb_toggle_wrapper h3.wpb_toggle_header .icon_left span{ font-family: 'pixflow-font-library'; } .wpb_accordion .wpb_accordion_wrapper .ui-state-default .ui-icon:before, .wpb_md_toggle .ui-icon:before { content: "\e614"; } .wpb_accordion .wpb_accordion_wrapper .ui-state-active .ui-icon:before, .wpb_md_toggle .wpb_toggle_wrapper .ui-state-active .ui-icon:before { content: "\e613"; } .wpb_md_toggle2 .ui-icon:before{ content: "\e826"; } .wpb_md_toggle2 .wpb_toggle_wrapper .ui-state-active .ui-icon:before{ content: "\e825"; } .wpb_md_toggle2 .ui-icon:before, .wpb_md_toggle2 .wpb_toggle_wrapper .ui-state-active .ui-icon:before{ line-height: 55px; } /* with border style*/ .wpb_md_toggle2 .wpb_accordion_section{ margin-top: 20px; } .wpb_md_toggle2 .wpb_accordion_section:first-child{ margin-top: 0; } .wpb_accordion.with_border .wpb_accordion_section .ui-state-active .ui-icon, .wpb_accordion.with_border .wpb_accordion_section .ui-state-default .ui-icon, .wpb_md_toggle.with_border .wpb_accordion_section .ui-icon{ right: 0.83em; } .wpb_md_toggle2 .wpb_accordion_section .ui-icon { width: 55px; left: 0; text-align: center; line-height: 100%; } .with_border .wpb_accordion_section h3.wpb_accordion_header, .with_border .wpb_accordion_section h3.wpb_toggle_header, .wpb_md_toggle2 .wpb_accordion_section h3.wpb_toggle_header { padding-left: 45px; margin-bottom: 0; min-height: 70px; transition: background 500ms; text-align: left; } .wpb_md_toggle2 .wpb_accordion_section h3.wpb_toggle_header { min-height: 55px; transition: all 0.3s; } .with_border .wpb_accordion_section h3.wpb_accordion_header, .with_border .wpb_accordion_section h3.wpb_toggle_header{ background: none !important; } .wpb_accordion.with_border .wpb_accordion_section .icon_left .icon, .wpb_md_toggle .wpb_accordion_section .icon_left .icon, .wpb_md_toggle2 .wpb_accordion_section .icon_left .icon{ transform: translateY(-50%); } .with_border .wpb_accordion_section .icon_left, .wpb_md_toggle2 .wpb_accordion_section .icon_left { position: absolute; left: 20px; max-width: 30px; text-align: center; z-index: 99; top: 50%; margin: 0 !important; } .wpb_md_toggle2 .wpb_accordion_section .icon_left { left: 72px; } .wpb_accordion.with_border .wpb_accordion_wrapper .wpb_accordion_section .wpb_accordion_content { padding: 30px 20px 30px 20px; min-height: 0; } .wpb_md_toggle.with_border .wpb_toggle_wrapper .wpb_accordion_section .wpb_toggle_content , .wpb_md_toggle2 .wpb_toggle_wrapper .wpb_accordion_section .wpb_toggle_content { padding: 15px 60px 27px 20px; min-height: 0; } .wpb_md_toggle2 .wpb_toggle_wrapper .wpb_accordion_section .wpb_toggle_content { padding: 20px 60px 0 0; } .wpb_accordion.with_border .wpb_accordion_wrapper .wpb_accordion_section .wpb_accordion_content .row, .wpb_md_toggle.with_border .wpb_toggle_wrapper .wpb_accordion_section .wpb_toggle_content .row , .wpb_md_toggle2 .wpb_toggle_wrapper .wpb_accordion_section .wpb_toggle_content .row { margin: 0; } .wpb_accordion.with_border .wpb_accordion_wrapper .wpb_accordion_header:not(.ui-state-active,.ui-state-hover), .wpb_md_toggle.with_border .wpb_toggle_wrapper .wpb_toggle_header:not(.ui-state-active,.ui-state-hover), .wpb_md_toggle2 .wpb_toggle_wrapper .wpb_toggle_header:not(.ui-state-active,.ui-state-hover) { background: none; } .with_border .wpb_accordion_wrapper h3, .with_border .wpb_toggle_wrapper h3, .wpb_md_toggle2 .wpb_toggle_wrapper h3 { 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; } .with_border .wpb_accordion_wrapper h3:after, .with_border .wpb_toggle_wrapper h3:after, .wpb_md_toggle2 .wpb_toggle_wrapper h3:after { content: ''; position: absolute; z-index: 0; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; width: 100%; height: 0; top: 0; left: 0; } .with_border .wpb_accordion_wrapper h3:hover:after, .with_border .wpb_accordion_wrapper h3:active:after, .with_border h3:hover:after, .with_border h3:active:after, .wpb_md_toggle2 h3:hover:after, .wpb_md_toggle2 h3:active:after{ height: 100%; } /* without border style */ .wpb_accordion.without_border .wpb_accordion_section .ui-state-active .ui-icon, .wpb_accordion.without_border .wpb_accordion_section .ui-state-default .ui-icon, .wpb_md_toggle.without_border .wpb_accordion_section .ui-accordion-header-icon.ui-icon, .wpb_md_toggle.without_border .wpb_accordion_section .ui-accordion-header-icon.ui-icon { right: 0; } .without_border .wpb_accordion_section h3.wpb_accordion_header, .without_border .wpb_accordion_section h3.wpb_toggle_header { padding-left: 25px; margin-bottom: 0; min-height: 70px; background: none !important; transition: background 500ms; text-align: left; } .without_border .wpb_accordion_section h3.wpb_accordion_header a{ position: absolute; } .without_border .wpb_accordion_section .icon_left { position: absolute; left: 0; margin: 0 !important; top: 50%; transform: translateY(-50%); text-align: center; z-index: 99; } .without_border .wpb_accordion_wrapper h3, .without_border .wpb_toggle_wrapper h3 { 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; } .without_border .wpb_toggle_wrapper .wpb_accordion_section:last-of-type, .without_border .wpb_accordion_wrapper .wpb_accordion_section:last-of-type { border-bottom: none; } .wpb_accordion.without_border .wpb_accordion_section h3.wpb_accordion_header a, .wpb_accordion.without_border .wpb_accordion_section h3.wpb_accordion_header span, .wpb_accordion.without_border .wpb_accordion_section h3.wpb_accordion_header div, .wpb_md_toggle.without_border .wpb_accordion_section h3.wpb_toggle_header a, .wpb_md_toggle.without_border .wpb_accordion_section h3.wpb_toggle_header span, .wpb_md_toggle.without_border .wpb_accordion_section h3.wpb_toggle_header div { transition: color 300ms; } .wpb_accordion.without_border .wpb_accordion_wrapper .wpb_accordion_section .wpb_accordion_content { padding: 10px 10px 30px 0; min-height: 0; } .wpb_md_toggle.without_border .wpb_toggle_wrapper .wpb_accordion_section .wpb_toggle_content { padding: 0 60px 27px 0; min-height: 0; } .wpb_accordion.without_border .wpb_accordion_wrapper .wpb_accordion_section .wpb_accordion_content .row, .wpb_md_toggle.without_border .wpb_toggle_wrapper .wpb_accordion_section .wpb_toggle_content .row { margin: 0; } .wpb_accordion.without_border .wpb_accordion_wrapper .wpb_accordion_header:not(.ui-state-active,.ui-state-hover), .wpb_md_toggle.without_border .wpb_toggle_wrapper .wpb_toggle_header:not(.ui-state-active,.ui-state-hover) { background: none; } .compose-mode .vc_element .wpb_accordion_wrapper > :last-child .wpb_accordion_content, .view-mode .vc_element .wpb_accordion_wrapper > :last-child .wpb_accordion_content { margin-bottom: 0; } .wpb_md_toggle .wpb_toggle_wrapper .wpb_toggle_header, .wpb_md_toggle2 .wpb_toggle_wrapper .wpb_toggle_header { font-weight: normal; line-height: inherit; letter-spacing: inherit; } .compose-mode .vc_element .wpb_accordion_wrapper > :last-child .wpb_accordion_content, .view-mode .vc_element .wpb_accordion_wrapper > :last-child .wpb_accordion_content { margin-bottom: 0 !important; } /*--------------------------------------------------------- Row Shortcode ---------------------------------------------------------*/ /* flex style for row */ .row-equal-column-height .wrap{ display: flex; } .row-equal-column-height .wrap .vc_column-inner{ align-items: stretch; height: 100%; } body.compose-mode .row-equal-column-height .vc_column_container{ height: 100%; width: 100%; } .row-content-top:not(.row-equal-column-height) .wrap{ display: flex; align-items: flex-start; } .row-content-middle:not(.row-equal-column-height) .wrap{ display: flex; align-items: center; } .row-content-bottom:not(.row-equal-column-height) .wrap{ display: flex; align-items: flex-end; } /* equal height - top */ .row-equal-column-height.row-content-top .wrap .vc_column-inner{ display: flex; align-items: flex-start; } /* equal height - middle */ .row-equal-column-height.row-content-middle .wrap .vc_column-inner{ display: flex; align-items: center; } /* equal height - bottom */ .row-equal-column-height.row-content-bottom .wrap .vc_column-inner{ display: flex; align-items: flex-end; } .row-equal-column-height > .wrap > .vc_column_container > .vc_column-inner > .wpb_wrapper, .row-equal-column-height > .wrap > .mBuilder-element > .vc_column_container > .vc_column-inner > .wpb_wrapper{ width: 100%; } /* END flex style for row */ .vc_row.vc_parallax { position: relative; overflow: visible; } .vc_parallax>* { position: relative; z-index: 1; } .vc_row{ position: relative; backface-visibility: hidden; } .vc_row:not(.vertical-aligned){ display: flex; width:100%; } .vc_row > .wrap:not(.box_size_container){ width:100%; } .vc_row.row_video, .vc_row.sloped_row{ overflow: hidden; } .row-image { background-position: center; background-repeat: no-repeat; } /* Parallax */ .row-image-normal.isParallax { background-attachment: fixed; background-position: center; background-repeat: no-repeat; } .row-image-fixed.isParallax:after { content: ""; display: block; background-attachment: fixed; width: 100%; background-position: center; background-repeat: no-repeat; height: 100%; position: absolute; top: 0; left: 0; background-size: cover; } body.one_page_scroll .row-image-fixed.isParallax:after { background-attachment: local; } /* Bg Repeat */ .row-image.repeat{ background-repeat: repeat; background-size: inherit !important; } .row-image.repeat:after{ background-repeat: repeat; background-size: inherit !important; } /* End */ .sectionOverlay:after { width: 100%; height: 100%; position: absolute; left: 0; top: 0; display: block !important; } .sectionOverlay .row-image, .sectionOverlay .row-image-inner-row { width: 100%; position: absolute !important; height: 100%; left: 0; z-index: 0 !important; top: 0; margin: auto; background-size: cover; overflow: hidden; } .sectionOverlay.box_size { margin-left: auto !important; margin-right: auto !important; } .sectionOverlay .box_size_container { float: none; margin:0 auto; } /* Sloped Edge */ .sloped-edge { height: 105px; position: absolute !important; left: -10%; right: -10%; } .sloped-edge.top-edge { top: -55px; } .sloped-edge.bottom-edge { bottom: -55px; } /* Inner Row */ .vc_row.full_size { margin: 0; } video.row-videobg { position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; z-index: -1; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); background-repeat: no-repeat; background-size: cover; } .vc_row .one-page-anchor{ position: absolute; top: 0; } div[id^="rowInnerCustom"] > .wrap { position: relative; z-index: 1; } /*--------------------------------------------------------- Iconbox Top Shortcode ---------------------------------------------------------*/ .iconbox-top.md-align-center{ text-align: center;} .iconbox-top.md-align-left{text-align: left;} .iconbox-top.md-align-right{text-align: right;} .iconbox-top .icon-holder { margin-bottom: 15px; position: relative; height: 100px; width: 100px; } .iconbox-top .iconbox-top-content{ display: inline-block; max-width: 700px; } .iconbox-top .icon, .iconbox-top .svg-circle { 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%); } .iconbox-top .icon { font-size: 42px; z-index: 1; -webkit-backface-visibility: hidden; } .iconbox-top .svg-circle { width: 100px; height: 100px; padding: 1px; display: block; opacity: 0.3; z-index: 0; } .iconbox-top .svg-circle circle { stroke-dashoffset: 360px; stroke-dasharray: 360px, 360px; } .iconbox-top .title { margin-bottom: 10px; transition: letter-spacing 0.2s cubic-bezier(0.44, 0.54, 0, 1.75); } .iconbox-top .description { padding-bottom: 35px; font-weight: normal; width: 75%; } /*--------------------------------------------------------- Iconbox Side Shortcode ---------------------------------------------------------*/ .iconbox-side { padding: 10px; } .iconbox-side .icon-container { transition: background 0.2s; } .iconbox-side .icon { transition: color 0.2s; font-size: 30px; } .iconbox-side .iconbox-side-container { width: 70%; max-width: 500px; } .iconbox-side .description { margin-bottom: 25px; font-size: 13px; line-height: 21px; font-weight: normal; } /* alignment */ .iconbox-side.left-align .icon-container, .iconbox-side.left-align .iconbox-side-container { float: left; text-align: left; } .iconbox-side.left-align .iconbox-side-container { margin-left: 19px; } .iconbox-side.right-align .icon-container, .iconbox-side.right-align .iconbox-side-container { float: right; text-align: right; } .iconbox-side.right-align .iconbox-side-container { margin-right: 19px; } .iconbox-side.responsive .iconbox-side-container{ margin: auto 0; } .iconbox-side.left-align.responsive .icon-container, .iconbox-side.left-align.responsive .iconbox-side-container, .iconbox-side.right-align.responsive .icon-container, .iconbox-side.right-align.responsive .iconbox-side-container{ float: none; display: block; text-align: center; width: inherit; } /* icon background */ .iconbox-side .icon-background { display: table; } .iconbox-side .icon-background .icon:before { speak: none; font-size: 30px; line-height: 63px; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; display: block; -webkit-font-smoothing: antialiased; } .iconbox-side .icon-background .icon { vertical-align: middle; transition: color 0.3s; display: inline-block; font-size: 0; cursor: pointer; width: 61px; height: 61px; border-radius: 50%; text-align: center; position: relative; z-index: 1; } .iconbox-side .icon-background .icon:after { top: 0; left: 0; padding: 0; z-index: -1; -webkit-transition: -webkit-transform 0.2s, opacity 0.3s; -moz-transition: -moz-transform 0.2s, opacity 0.3s; transition: transform 0.2s, opacity 0.3s; pointer-events: none; position: absolute; width: 100%; height: 100%; border-radius: 50%; content: ''; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } .iconbox-side:hover .icon-background .icon:after { transform: scale(1.3); opacity: 0; } .iconbox-side:not(.side2) .iconbox-side-container .title { line-height: 30px; } .iconbox-side .icon-container.icon-background ~ .iconbox-side-container .title { line-height: 61px; margin-bottom: 0; } /************* style2 ****/ .iconbox-side.style2 .iconbox-content { max-width: 450px; } .iconbox-side.style2 .iconbox-side-container{ width:100%; float: none; position: relative; margin:0 0 15px; display: table; } .iconbox-side.style2 .icon-container, .iconbox-side.style2 .heading, .iconbox-side.style2 .image-container{ float: none; display: table-cell; vertical-align: middle; } .iconbox-side.style2.left-align .icon-container, .iconbox-side.style2.left-align .heading{ text-align: left; } .iconbox-side.style2.right-align .icon-container, .iconbox-side.style2.right-align .heading{ text-align: right; float: right; } .iconbox-side.style2 .heading{ width:calc(100% - 60px ); position: relative; } .iconbox-side.style2 .icon-container,.iconbox-side.style2 .icon-container .image-container{ width: 60px; } .iconbox-side.style2 .icon{ font-size: 50px; } .iconbox-side.style2.left-align .icon ,.iconbox-side.style2.left-align .iconbox_side2_image{ margin-right: 10px; } .iconbox-side.style2.right-align .icon{ margin-left: 10px; margin-bottom: 10px; } .iconbox-side.style2 .info-title{ font-size: 15px; font-weight: 400; display: block; margin-bottom: 10px; } .iconbox-side.style2 .title{ margin-bottom: 0; } .iconbox-side.style2 .description{ opacity: 0.7; font-size: 15px; font-weight: 400; line-height: 25px; } .iconbox-side.style2 .image-container{ width: 50px; } .iconbox-side.style2 .image-container .iconbox_side2_image{ background-size:contain; background-repeat: no-repeat; width: 50px; height: 50px; margin-right: 10px; } /* ------------------------------------------------- Product Compare Shortcode ----------------------------------------------------*/ .wpb_product_compare { text-align: center; padding: 3em 1em; opacity:0.9 ; -ms-transform:scale(1); -webkit-transform: scale(1); transform: scale(1); transition: transform 300ms, opacity 300ms; } .wpb_product_compare:hover { -ms-transform: scale(1.05); -webkit-transform: scale(1.05); transform: scale(1.05); -webkit-filter: blur(0); opacity: 1; } .wpb_product_compare .button-parent { margin-top: 35px; } .product_compare_img { margin-bottom: 47px; } .product_compare_img img { margin: auto; } .product_compare_currency { font-size: 45px; font-weight: 100; } .product_compare_price { font-size: 70px; font-weight: bold; } .product_compare_title { margin-bottom: 10px; margin-top: -13px; text-transform: uppercase; } .md-align-left.wpb_product_compare .ui-product_compare{ display: inline-block; float: left; } .md-align-right.wpb_product_compare .ui-product_compare{ display: inline-block; float: right; } .wpb_product_compare:after{ content: ' '; clear: both; display: block; } /* 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:white; } #empty-cart-page-button { margin-top: 30px; border: 1px solid gray; border-radius: 25px; } /* ------------------------------------------------- Device Slider Shortcode ----------------------------------------------------*/ .device-slider .flex-control-nav { position: relative; bottom: 0; margin-bottom: 40px; list-style-type: none; text-align: center; } .device-slider .flex-control-nav li { display: inline-block; font-size: 12px; cursor: pointer; padding-left: 17px; opacity: 0.5; } .device-slider .flex-control-nav li:last-child:after { content: ''; } .device-slider .flex-control-nav li.flex-active { opacity: 1; } .device-slider .flexslider { max-width: 745px; margin: 0 auto; position: relative; background: none; border: none; width: 90%; height: 90%; } .device-slider .flexslider .slides { list-style-type: none; } .device-slider .flexslider .slides li { max-height: 705px; } .device-slider .flexslider .mac-frame { background: transparent url("assets/img/slider-mac-with-shade.png") left top no-repeat; position: absolute; left: 0; max-width: 100%; background-size: contain; height: 593px; right: 0; margin: auto; transform: scale(1.009); } .device-slider .flexslider .slide-description { margin-bottom: 67px; color: #000; text-align: center; font-size: 14px; line-height: 22px; height: 64px; overflow: hidden; padding: 0 7%; } .device-slider .flexslider .slide-image { background-size: cover; background-position: center; border-radius: 0; margin: auto; } .device-slider .flexslider .flex-direction-nav a { width: 13%; height: 13%; top: 38%; opacity: 1; } .device-slider ul li { overflow: hidden; } .md-align-left.device-slider .flexslider{ margin-left:0; } .md-align-center.device-slider .flexslider{ margin:auto; } .md-align-right.device-slider .flexslider{ float:right; } .md-align-right.device-slider:after{ content: ' '; clear: both; display: block; } /* ------------------------------------------------- Image Box Slider ----------------------------------------------------*/ /* image */ .img-box-slider{ overflow: hidden; position: relative; } .img-box-slider .imgBox-image{ width: 100%; height: 100%; margin: auto; background-repeat: no-repeat; background-size: auto; display: block; } .img-box-slider.md-align-right .imgBox-image{ background-position: right; } .img-box-slider.md-align-left .imgBox-image{ background-position: left; } .img-box-slider.md-align-center .imgBox-image{ background-position: center; } /* hover */ .img-box-slider .image-box-slider-hover{ width: 100%; height: 100%; position: absolute; top: 0; z-index: 9; } .image-box-slider-hover .bg-animate, .image-box-slider-hover .title, .image-box-slider-hover .description{ position: relative; left: -100%; } .image-box-slider-hover .title, .image-box-slider-hover .description{ background-color: transparent !important; } .img-box-slider .bg-animate { width: 100%; height: 100%; position: absolute; top: 0; background-color: rgba(0, 0, 0, 0); } .img-box-slider .image-box-slider-hover .title{ font-size: 20px; font-weight: bold; color: #fff; margin-bottom: 30px; padding: 56px 56px 0 34px; } .img-box-slider .image-box-slider-hover .description{ font-size: 14px; font-weight: 400; color: #fff; padding: 0 56px 0 34px; } /* button */ .img-box-slider .image-box-slider-btn{ background-color: rgba(15, 15, 15, 0.4); width: 35px; height: 35px; position: absolute; bottom: 0; right: 0; color: #fff; backface-visibility: hidden; margin: 0 26px 21px 0; border-radius: 50px; background-position: center; cursor: pointer; z-index: 10; transition: transform .3s, background-color .3s, opacity .2s; } @-moz-document url-prefix() { .img-box-slider .image-box-slider-btn { height: 37px; } } .img-box-slider .image-box-slider-btn:before { display: table-cell; text-align: center; vertical-align: middle; width: 35px; height: 35px; } .img-box-slider .image-box-slider-btn:hover { opacity: 0.7; } .img-box-slider ul, .img-box-slider ul > li { height: 100%; position: relative; } .img-box-slider .image-box-slider-hover-text { position: absolute; top: 50%; padding: 0 50px 0 50px; text-align: center; opacity: 0; font-size: 18px; display: inline-block; width: 100%; line-height: 25px; left: 0; transform: translateY(-50%); } .img-box-slider .imgBox-image-hover { position: absolute; top: 0; left: 0; transition: opacity .3s; } /* ------------------------------------------------- Image Box Fancy ----------------------------------------------------*/ /* image */ .img-box-fancy{ overflow: hidden; position: relative; } .img-box-fancy.md-align-left .imgBox-image{ background-position: left; } .img-box-fancy.md-align-center .imgBox-image{ background-position: center; } .img-box-fancy.md-align-right .imgBox-image{ background-position: right; } .img-box-fancy .imgBox-image{ width: 100%; height: 100%; margin: auto; background-repeat: no-repeat; background-size: auto; display: block; } /* button */ .img-box-slider .image-box-slider-btn{ background-color: rgba(15, 15, 15, 0.4); width: 35px; height: 35px; position: absolute; bottom: 0; right: 0; color: #fff; backface-visibility: hidden; margin: 0 26px 21px 0; border-radius: 50px; background-position: center; cursor: pointer; z-index: 10; transition: transform .3s, background-color .3s, opacity .2s; } @-moz-document url-prefix() { .img-box-fancy .image-box-fancy-btn { height: 37px; } } .img-box-fancy .image-box-fancy-btn:before { display: table-cell; text-align: center; vertical-align: middle; width: 35px; height: 35px; } .img-box-fancy .image-box-fancy-btn:hover { opacity: 0.7; } .img-box-fancy ul, .img-box-fancy ul > li { height: 100%; position: relative; } .img-box-fancy .image-box-fancy-hover-text { position: absolute; top: 50%; padding: 0 50px 0 50px; text-align: center; opacity: 0; font-size: 18px; display: inline-block; width: 100%; line-height: 25px; left: 0; transform: translateY(-50%); } .img-box-fancy .imgBox-image-hover { position: absolute; top: 0; left: 0; transition: opacity .3s; } .img-box-fancy .image-box-fancy-desc{ position: absolute; z-index: 9; padding:45px 60px; transition: all .7s; } .col-sm-3 .img-box-fancy .image-box-fancy-desc.image-box-fancy-desc-full, .col-sm-2 .img-box-fancy .image-box-fancy-desc.image-box-fancy-desc-full, .col-sm-1 .img-box-fancy .image-box-fancy-desc.image-box-fancy-desc-full{ padding:45px 15px; } .img-box-fancy .image-box-fancy-desc.image-box-fancy-desc-full { text-align: center; } .col-sm-3 .img-box-fancy .image-box-fancy-desc.image-box-fancy-desc-full .image-box-fancy-container, .col-sm-2 .img-box-fancy .image-box-fancy-desc.image-box-fancy-desc-full .image-box-fancy-container, .col-sm-1 .img-box-fancy .image-box-fancy-desc.image-box-fancy-desc-full .image-box-fancy-container{ max-width: 75%; } .img-box-fancy .image-box-fancy-desc.image-box-fancy-desc-full .image-box-fancy-container{ position: absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; max-width:50%; } .img-box-fancy .image-box-fancy-container{ position: absolute; top: 50%; transform: translateY(-50%); width: calc(100% - 120px); max-height: 100%; overflow: hidden; } .img-box-fancy .image-box-fancy-desc.image-box-fancy-desc-normal{ width: 60%; height: 60%; bottom: calc(-60% + 70px); left: calc(-60% + 70px); } .img-box-fancy .image-box-fancy-desc.image-box-fancy-desc-full{ width: 100%; height: 100%; bottom: calc(-100% + 70px); left: calc(-100% + 70px); } .img-box-fancy .image-box-fancy-desc.image-box-fancy-open{ bottom: 0!important; left:0!important; } .img-box-fancy .image-box-fancy-collapse{ position: absolute; right: 0; font-size: 23px; top: 0; padding-top: 26px; padding-right: 22px; cursor:pointer; width: 70px; height:70px; } .img-box-fancy .image-box-fancy-collapse i{ transform: rotate(90deg); display: block; float: right; } .img-box-fancy .image-box-fancy-icon{ font-size:40px; } .img-box-fancy .image-box-fancy-title{ font-size: 20px; font-weight: bold; line-height: 1.2em; margin:15px 0 15px; } .img-box-fancy p{ line-height: 1.7em; } .img-box-fancy .image-box-fancy-desc .image-box-fancy-title, .img-box-fancy .image-box-fancy-desc p, .img-box-fancy .image-box-fancy-desc .image-box-fancy-icon{ opacity:0; transform: translateX(-50px); transition: opacity .2s, transform .4s; } .img-box-fancy .image-box-fancy-desc.image-box-fancy-open .image-box-fancy-title, .img-box-fancy .image-box-fancy-desc.image-box-fancy-open p, .img-box-fancy .image-box-fancy-desc.image-box-fancy-open .image-box-fancy-icon{ opacity:1; transform: translateX(0px); transition: opacity 1s .4s, transform .7s .2s; } /* ------------------------------------------------- Imagebox Full-width Shortcode ----------------------------------------------------*/ .imagebox-full { background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; position: relative; /*margin: 0 -15px;*/ } .imagebox-full.align-center{ padding: 55px 19% 40px 19%; } .imagebox-full.align-left{ padding: 55px 19% 40px 5%; } .col-sm-1 .imagebox-full.align-left, .col-sm-2 .imagebox-full.align-left, .col-sm-3 .imagebox-full.align-left, .col-sm-4 .imagebox-full.align-left{ padding: 55px 19% 39px 8%; } .imagebox-full .overlay { position: absolute; left: 0; right: 0; top: 0; bottom: 0; } .imagebox-full .text-container { position: relative; z-index: 1; overflow: hidden; margin-bottom: 35px; } .col-sm-5 .imagebox-full .text-container, .col-sm-5 .imagebox-full .title, .col-sm-4 .imagebox-full .text-container, .col-sm-4 .imagebox-full .title, .col-sm-3 .imagebox-full .text-container, .col-sm-3 .imagebox-full .title, .col-sm-2 .imagebox-full .text-container, .col-sm-2 .imagebox-full .title, .col-sm-1 .imagebox-full .text-container, .col-sm-1 .imagebox-full .title{ margin-bottom: 10px; } .imagebox-full .title, .imagebox-full .description { max-width: 570px; } .imagebox-full .title { margin-bottom: 30px; padding-top: 175px; } .imagebox-full .description { font-size: 14px; line-height: 1.6em; opacity: 0; } .imagebox-full .slide:hover { background-color: transparent; } .imagebox-full .shortcode-btn a.button{ border: 2px solid; position: relative; } .imagebox-full .shortcode-btn a.button.fill-rectangle{ border: none; } /*---------------------------------------------------------- Team Member Classic --------------------------------------------------------- */ .team-member-classic { position: relative; } .team-member-classic .content { background-size: cover; background-repeat: no-repeat; background-position: center; width: 100% !important; } .team-member-classic .content .social-icons li:hover { opacity: 0.6; } /*---------------------------------------------------------- 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; } /* ------------------------------------------------- Tablet Slider Shortcode ----------------------------------------------------*/ .tablet-slider { min-height: 330px; } .tablet-slider .flex-control-nav { position: relative; bottom: 0; margin-bottom: 40px; list-style-type: none; text-align: center; } .tablet-slider .flex-control-nav li { display: inline-block; font-size: 14px; cursor: pointer; padding-left: 17px; opacity: 0.5; } .tablet-slider .flex-control-nav li:last-child:after { content: ''; } .tablet-slider .flex-control-nav li.flex-active { opacity: 1; } .tablet-slider .flexslider { max-width: 745px; margin: 0 auto; position: relative; background: none; border: none; width: 90%; height: 90%; } .tablet-slider .flexslider .slides { list-style-type: none; } .tablet-slider .flexslider .tablet-frame { background: transparent url("assets/img/tablet-slider-with-shade.png") left top no-repeat; position: absolute; left: 0; max-width: 100%; background-size: contain; height: 593px; right: 0; margin: auto; transform: scale(1.009); } .tablet-slider .flexslider .slide-description { margin-bottom: 67px; color: #000; text-align: center; font-size: 14px; line-height: 22px; height: 64px; overflow: hidden; padding: 0 7%; } .tablet-slider .flexslider .slide-image { background-size: cover; background-position: center; border-radius: 20px; margin: auto; } .tablet-slider .flexslider .flex-direction-nav a { width: 13%; height: 13%; top: 50%; opacity: 1; } .tablet-slider .flexslider .flex-direction-nav .flex-prev { left: -9% !important; } .tablet-slider .flexslider .flex-direction-nav .flex-prev:before { content: ""; background: transparent url("assets/img/tablet-slider-back-button.png") left top no-repeat; max-width: 100%; background-size: contain; width: 100%; height: 100%; } .tablet-slider .flexslider .flex-direction-nav .flex-next { right: -16% !important; } .tablet-slider .flexslider .flex-direction-nav .flex-next:before { content: ""; background: transparent url("assets/img/tablet-slider-next-button.png") left top no-repeat; max-width: 100%; background-size: contain; width: 100%; height: 100%; } .md-align-left.tablet-slider{ float: left; margin-left:25px; display: inline-block; } .md-align-center.tablet-slider{ margin:0 auto; } .md-align-right.tablet-slider{ float:right; display: inline-block; margin-right: 10px; } .vc_md_tablet_slider:after, .vc_md_tablet_slider:before{ clear: both; content: ' '; display: block; } /* ------------------------------------------------- Contact form Shortcode ----------------------------------------------------*/ /*------------ classic -----------*/ .form-container-classic .form-name, .form-container-classic .form-subject, .form-container-classic .form-email { float: left; width: 33%; } .form-container-classic .message-container { width: 99%; } .form-container-classic .form-name input, .form-container-classic .form-email input, .form-container-classic .form-subject input, .form-container-classic .form-message textarea { width: 97%; border-radius: 5px; display: block; border: 1px solid; } .form-container-classic .form-message textarea { width: 99%; } .form-container-classic .form-name input, .form-container-classic .form-email input, .form-container-classic .form-subject input { padding: 0 5.5%; height: 63px; } .contact-form .form-container-classic .form-message textarea { padding: 12px 2%; margin-top: 1.2%; height: 230px; } .form-container-classic .form-submit { text-align: center; } .form-container-classic .form-submit input { border-radius: 5px; border: none; margin-top: 20px; height: 56px; } /*------------ business -----------*/ .form-container-business, .form-container-classic { width: 92%; margin: auto; } .form-container-business .inputs-container, .form-container-business .message-container { float: left; width: 50%; } .form-container-business .form-name, .form-container-business .form-email, .form-container-business .form-subject { margin-bottom: 2.5%; } .form-container-business .form-name input, .form-container-business .form-email input, .form-container-business .form-subject input, .form-container-business .form-message textarea { width: 97%; border-radius: 3px; display: block; border: 1px solid; } .form-container-business .form-name input, .form-container-business .form-email input, .form-container-business .form-subject input { padding: 0 4%; height: 61px!important; } .form-container-business .form-message textarea { padding: 12px 4%; height: 203px!important; } .form-container-business .form-submit input { display: block; width: 98.5%; border-radius: 3px; border: none; height: 61px!important; } .wpcf7-not-valid-tip { display: none !important; } /*--------------general------------------*/ .contact-form { text-align: center; width: 880px; max-width: 100%; } .contact-form.md-align-left{margin-left: 0} .contact-form.md-align-left .form-container-business,.contact-form.md-align-left .form-container-classic{float: left} .contact-form.md-align-center{margin: 0 auto;} .contact-form.md-align-center .form-container-business,.contact-form.md-align-center .form-container-classic{float: none} .contact-form.md-align-right{margin-left:auto; margin-right: 0} .contact-form.md-align-right .form-container-business,.contact-form.md-align-right .form-container-classic{float: right} .contact-form .form-title { margin-bottom: 2.5%; font-size: 35px; font-weight: bold; } .contact-form .form-description { margin-bottom: 8%; font-size: 15px; line-height: 20px; } .contact-form .form-message textarea { height: 221px; } .contact-form .form-submit input { color: #fff; transition: background-color 300ms; } .contact-form input, .contact-form textarea { outline: none; font-size: 13px; } .contact-form input:focus, .contact-form textarea:focus { border: 2px solid; } .contact-form div.wpcf7-validation-errors, .contact-form div.wpcf7-mail-sent-ng { border: none; font-size: 13px; } /*-------------- modern ------------------*/ .form-container-modern .input { position: relative; z-index: 1; margin-right:25px; max-width: 350px; width: calc(100% /3 - 17px); vertical-align: top; display: block; float: left; } .form-container-modern .top-elems{ margin-bottom: 75px; } .form-container-modern .top-elems .input:last-child{ margin-right: 0; } .form-container-modern .wpcf7-form-control-wrap .input__field{ position: relative; display: block; float: right; padding: 0.8em; width: 100%; border: none; border-radius: 0; font-weight: bold; font-size: 15px; box-shadow: none; -webkit-appearance: none; } .form-container-modern .wpcf7-form-control-wrap .wpcf7-not-valid{ box-shadow: none !important; } .form-container-modern .wpcf7-form-control-wrap .wpcf7-not-valid-tip{ display: block !important; position: absolute; min-width: 210px; top: 10px; left: 64px; font-size: 12px; text-align: right; } .form-container-modern .wpcf7-form-control-wrap textarea + .wpcf7-not-valid-tip{ top:60px; } input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill{ background-color: rgba(255,255,255,0); } .form-container-modern .wpcf7-form-control-wrap .input__field:focus, .form-container-modern .submit-button:focus{ outline: none; border: none; } .form-container-modern .input__label{ display: inline-block; float: right; padding: 0 1em; width: 40%; color: #929296; font-weight: bold; font-size: 70.25%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .form-container-modern .input__label-content { position: relative; display: block; padding: 0; font-size: 14px; font-weight: 400; width: 100%; -webkit-filter:blur(0px); } .form-container-modern .input--filled .input__label-content{ font-size: 12px; } .form-container-modern .submit-button{ width:150px; height: 50px; background-color:rgba(47,47,47,1); font-size: 13px; border-radius:35px; border:none; color: #ffffff; transition: background-color .3s; margin: 50px auto 0; text-transform: capitalize; } .form-container-modern .submit-button:hover{ background-color:rgba(47,47,47,.9); } .form-container-modern .input--hoshi { overflow: hidden; } .form-container-modern .bottom-elem .input { width: 100%; max-width: none; margin-right: 0; } .form-container-modern .bottom-elem .input textarea{ height: 90px; resize: none; } .form-container-modern .bottom-elem .input__label-content, .form-container-modern .bottom-elem .input--filled .input__label-content{ top:50px; } .form-container-modern .bottom-elem .input .focus + .input__label .input__label-content, .form-container-modern .bottom-elem .input--filled .input__label-content{ top:0; } .form-container-modern .wpcf7-form-control-wrap .input__field--hoshi { margin-top: 1em; padding: 0.85em 0.15em; width: 100%; font-weight:400; background: transparent; } .form-container-modern .input__label--hoshi { position: absolute; bottom: 0; left: 0; padding: 0 0.25em; width: 100%; height: calc(100% - 1em); text-align: left; pointer-events: none; } .form-container-modern .input__label-content--hoshi { position: absolute; } .form-container-modern .input__label--hoshi::before, .form-container-modern .input__label--hoshi::after { content: ''; position: absolute; top: 0; left: -1px; width: 100%; height: calc(100% - 10px); border-bottom: 1px solid #000; } .form-container-modern .input__label--hoshi::after { margin-top: 2px; border-bottom: 3px solid #000000; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); -webkit-transition: -webkit-transform 0.3s; transition: transform 0.3s; } .form-container-modern .input__label--hoshi-color::after { border-color: hsl(0, 0%, 0%); } .form-container-modern .focus + .input__label--hoshi::after, .form-container-modern .input--filled .input__label--hoshi::after { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .form-container-modern .focus + .input__label--hoshi .input__label-content--hoshi, .form-container-modern .input--filled .input__label-content--hoshi { -webkit-animation: anim-1 0.3s forwards; animation: anim-1 0.3s forwards; } @-webkit-keyframes anim-1 { 50% { opacity: 0; -webkit-transform: translate3d(1em, 0, 0); transform: translate3d(1em, 0, 0); } 51% { opacity: 0; -webkit-transform: translate3d(-1em, -40%, 0); transform: translate3d(-1em, -40%, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, -40%, 0); transform: translate3d(0, -40%, 0); } } @keyframes anim-1 { 50% { opacity: 0; -webkit-transform: translate3d(1em, 0, 0); transform: translate3d(1em, 0, 0); } 51% { opacity: 0; -webkit-transform: translate3d(-1em, -40%, 0); transform: translate3d(-1em, -40%, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, -40%, 0); transform: translate3d(0, -40%, 0); } } /* ------------------------------------------------- Mobile Slider Shortcode ----------------------------------------------------*/ .col-sm-2 .mobile-slider .flexslider .slide-image { margin-top: 8px; border-radius: 0; } .mobile-slider .flex-control-nav { position: relative; bottom: 0; margin-bottom: 57px; } .mobile-slider .flex-control-nav { list-style-type: none; text-align: center; } .mobile-slider .flex-control-nav li { display: inline-block; font-size: 12px; cursor: pointer; opacity: 0.5; } .mobile-slider .flex-control-nav li:last-child:after { content: ''; } .mobile-slider .flex-control-nav li.flex-active { opacity: 1; } .mobile-slider .flexslider { max-width: 745px; margin: 0 auto; position: relative; background: none; border: none; } .mobile-slider .flexslider { width: 90%; height: 90%; } .mobile-slider .flexslider .slides { list-style-type: none; } .mobile-slider .flexslider .mobile-frame { background: transparent url("assets/img/mobile-slider-with-shade.png") left top no-repeat; position: absolute; left: 0; max-width: 100%; background-size: contain; height: 593px; right: 0; margin: auto; width: 264px; transform: scale(1.009); } .mobile-slider .flexslider .slide-description { margin-bottom: 67px; color: #000; text-align: center; font-size: 14px; line-height: 22px; height: 64px; overflow: hidden; padding: 0 7%; } .mobile-slider .flexslider .slide-image { background-size: cover; background-position: center; border-radius: 20px; margin: auto; } .mobile-slider .flexslider .flex-control-paging { margin-top: 86px; z-index: 9; } .mobile-slider .flexslider .flex-control-paging li a { width: 6px; height: 6px; } .mobile-slider .flexslider .flex-direction-nav a { width: 13%; height: 13%; top: 38%; } .md-align-left.mobile-slider .flexslider{ margin-left:0; max-width:300px; } .md-align-center.mobile-slider .flexslider{ margin:0 auto; } .md-align-right.mobile-slider .flexslider{ float:right; max-width:300px; } .md-align-right.mobile-slider:after{ content: ' '; display: block; clear: both; } /* ------------------------------------------------- Skill Style 1 ----------------------------------------------------*/ .skill-style1 { /*padding-right: 15px;*/ max-width: 470px; } .skill-style1.style2 { /*padding-right: 15px;*/ max-width: 100%; } .skill-style1.md-align-left{margin-left: 0} .skill-style1.md-align-center{margin: 0 auto;} .skill-style1.md-align-right{margin-left:auto; margin-right: 0} .skill-style1 .bar-main-container { overflow: hidden; vertical-align: middle; height: 63px; } .skill-style1 .bar-percentage{ float: left; margin-right: 15px; font-size: 20px; text-align: left; margin-top: 3px; width: 45px; } .skill-style1 .bar-container{ height: 100%; max-width: 400px; overflow: hidden; vertical-align: middle; display: list-item; line-height: 100%; opacity: 0; } .skill-style1.style2 .bar-container{ max-width: 100%; } .skill-style1 .bar{ height: 4px; border-radius: 5px; opacity: 0; } .skill-style1.style2 .middle-bar{ height:12px; } .skill-style1 .bar-title{ margin-top: 3px; left: 3px; position: relative; font-size: 13px; } .skill-style1 .box_size_container { float: left; } .skill-style1.style2 .bar-title{ margin-top: 0; margin-bottom: 10px; font-size: 16px; } .skill-style1.style2 .bar{ border-radius: 15px 0 0 15px; height:18px; border-radius: 10px; background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.65) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.65) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#85ffffff',GradientType=1 ); /* IE6-9 */ background-blend-mode:overlay; } .skill-style1.style2 .bar-container,.skill-style1.style2 .bar-main-container { position: relative; height: 70px; margin-bottom: 15px; } .skill-style1.style2 .back-bar{ height: 18px; width: 100%; position: absolute; background-color:rgba(150, 150, 150,0.20); top: 24px; z-index: -1; border-radius: 15px; } .skill-style1.style2 .bar-percentage { font-size:12px; } .skill-style1.style2 .bar-percentage { position: absolute; text-align: right; bottom:0; } .middle-bar .circle{ width: 1px; height: 5px; border-radius: 6px; margin-top: 7px; float: right; margin-right: 13px; } .gradient-bar{ height: 100%; width: 100%; border-top-left-radius: 5px; } /* ------------------------------------------------- Portfolio Filter ----------------------------------------------------*/ .portfolio .filter ul { list-style: none; } .portfolio .filter li { display: inline-block; margin-right: 13px; } .portfolio .filter li a { font-size: 13px; } .portfolio .filter li.have-counter { position: relative; } .portfolio .filter.yes li{ margin-right: 40px; } .portfolio .filter .md_portfolio_counter { position: absolute; top: -0; font-size: 10px; right: -18px; min-width: 20px; height: 15px; line-height: 15px; border-radius: 10px; font-weight: 400; padding-left: 3px; padding-right: 3px; text-align: center; } /* ------------------------------------------------- Portfolio Multisize Shortcode ----------------------------------------------------*/ .portfolio .heading { margin-bottom: 25px; } .portfolio .heading .title { font-weight: 300; font-size: 44px; } .portfolio .heading .filter { line-height: 44px; } .portfolio .item-image { background-position: center; background-size: cover; } /******** Inside Meta ********/ body:not(.compose-mode) .portfolio.inside .item-wrap.portfolio-popup { position: relative; overflow: hidden; cursor: url("assets/img/popup-cursor.png") 25 25,auto; } body:not(.compose-mode) .outside .item-image.portfolio-popup{ cursor :url("assets/img/popup-cursor.png") , auto; } .portfolio.inside .overlay-background { height: 100%; width: 100%; position: absolute; top: 0; left: 0; opacity: 0; transition: opacity 300ms; } .portfolio.inside .item-meta { position: absolute; left: 30px; bottom: 35px; max-width: 210px; } .compose-mode .portfolio.inside .item-meta, .compose-mode .portfolio.inside .md-post-like{display: none;} .portfolio.inside .item-title, .portfolio.inside .item-category { margin: 0; } .portfolio.inside .item-title { font-size: 28px; line-height: 30px; font-weight: bold; margin-bottom: 10px; opacity: 0; padding-right: 100px; margin-left: -100px; transition: all 300ms 100ms; text-align: left; } .portfolio .item-title a{ font-size: inherit; line-height: inherit; font-weight: inherit; } .portfolio.inside .item-title a{ font-weight: 500; } .portfolio.inside .thumbnail-small .item-title { font-size: 22px; line-height: 22px; } .portfolio.inside .item-category { font-size: 14px; line-height: 14px; opacity: 0; margin-left: 25px; transition: opacity 300ms, margin 300ms; text-align: left; } /**** Inside like ****/ .portfolio.inside .md-post-like { position: absolute; left: 30px; top: 25px; text-align: center; opacity: 0; transition: opacity 300ms 100ms; } .portfolio.inside .like-heart { font-size: 18px; display: block; opacity: 0.6; transition: opacity 300ms; } .portfolio.inside .like-heart:hover { opacity: 1; } .portfolio.inside .like-count { font-size: 14px; } /******* Inside Hover ********/ .portfolio.inside .item:hover .overlay-background, .portfolio.inside .item:hover .item-title, .portfolio.inside .item:hover .md-post-like { opacity: 1; } @keyframes fadeInFromNone { 0% { display: none; opacity: 0; } 1% { display: block!important; opacity: 0; } 100% { display: block!important; opacity: 1; } } .portfolio.inside .item:hover .item-title { margin-left: 0; padding-right: 0; } .portfolio.inside .item:hover .item-category { margin-left: 0; opacity: 0.8; } /* Outside meta */ .portfolio.outside .item-image { position: relative; overflow: hidden; } .portfolio-multisize.outside .portfolio-item .item-image{ overflow: hidden; z-index: 0; } body:not(.compose-mode) .portfolio-multisize.outside .portfolio-item, .compose-mode.gizmo-off .portfolio-multisize.outside .portfolio-item{ overflow: hidden; } .portfolio.outside .md-post-like { position: absolute; right: 35px; bottom: 20px; text-align: center; } .portfolio.outside .like-heart { font-size: 25px; display: block; opacity: 0.6; transition: opacity 300ms; } .portfolio.outside .like-heart:hover { opacity: 1; } .portfolio.outside .like-count { font-size: 12px; } .portfolio.outside .item-meta { text-align: center; padding: 25px 0 25px; position: relative; } .portfolio.outside .item-title, .portfolio.outside .item-category { margin: 0; } .portfolio.outside .item-title { font-size: 18px; line-height: 20px; margin-bottom: 7px; transition: margin-top .3s cubic-bezier(0.85, 0, .15, 1) } .portfolio .item-title a{ outline: none; } .portfolio.outside .item-category { font-size: 14px; line-height: 20px; opacity: 0.7; } .portfolio.outside .item-meta .line { position: absolute; left: 50%; top: -37px; width: 1px; height: 55px; transform: scaleY(0); /*transform-origin: center bottom;*/ transform-origin: center center; transition: transform .3s cubic-bezier(0.85, 0, .15, 1), top .3s cubic-bezier(0.85, 0, .15, 1); } .portfolio.outside .item:hover .item-title { /*margin-top: -15px;*/ } body:not(.compose-mode) .portfolio.outside .item:hover .line, .compose-mode.gizmo-off .portfolio.outside .item:hover .line{ transform: scaleY(1); /*top: -52px;*/ top: -37px; } .portfolio.outside .item-image div { position: absolute; z-index: 3; transition: transform 250ms cubic-bezier(0.85, 0, .15, 1); } .portfolio.outside .item-image .border-top, .portfolio.outside .item-image .border-bottom { /*height: 15px;*/ height: 8px; width: 100%; left: 0; } .portfolio.outside .item-image .border-top { top: 0; transform: translateX(0) translateY(-15px) translateZ(0); } .portfolio.outside .item-image .border-bottom { bottom: 0; transform: translateX(0) translateY(15px) translateZ(0); } .portfolio.outside .item-image .border-left, .portfolio.outside .item-image .border-right { /*width: 15px;*/ width: 8px; height: 100%; top: 0; } .portfolio.outside .item-image .border-left { left: 0; transform: translateX(-15px) translateY(0) translateZ(0); } .portfolio.outside .item-image .border-right { right: 0; transform: translateX(15px) translateY(0) translateZ(0); } body:not(.compose-mode) .portfolio.outside .item:hover .item-image div , .compose-mode.gizmo-off .portfolio.outside .item:hover .item-image div { transform: translateX(0) translateY(0) translateZ(0); } /**** Portfolio load more ****/ .portfolio .loadmore-button, .portfolio .shortcode-btn { margin-top: 80px; } body.gizmo-off .portfolio-panel-setting{ display: none; } .portfolio-multisize .portfolio-panel-setting { color: #fff; position: absolute; top: -5px; margin: 0 auto; right: 40px; transition: opacity .3s, top .3s,width 450ms cubic-bezier(.6,0,.4,1); opacity: 0; z-index: 1; height: 43px; padding: 0 0 9px; } .portfolio-multisize .portfolio-panel-setting .tooltip{ background: rgba(0,0,0,.9); color: #fff; font-size: 10px; padding: 8px; width: 110px; text-align: center; position: absolute; top: -33px; left: -157%; display: none; opacity: 0; } .portfolio-multisize .portfolio-panel-setting:hover .tooltip{ display: block; } .portfolio-multisize .portfolio-panel-setting .tooltip:after{ content: ""; display: inline-block; width: 8px; height: 8px; left: 50%; bottom: -7px; transform: rotate(45deg) translateX(-50%); background: rgba(0,0,0,.9); position: absolute; } .portfolio-multisize .portfolio-panel-setting span { display: block; width: 7px; height: 14px; background: rgba(255,255,255,.6); margin-left: 2px; transition: background .3s, opacity .3s; cursor: pointer; float: left; } .portfolio-multisize .portfolio-panel-setting span:after{ content: ""; width: 2px; height: 14px; display: inline-block; position: relative; left: 7px; margin: 0; top: -1px; } .portfolio-multisize .portfolio-panel-setting span:hover { background: rgba(255,255,255,1); } /** Popup **/ div.mfp-ready{ z-index: 99991; } .mfp-with-zoom .mfp-container, .mfp-with-zoom.mfp-bg { opacity: 0; transition: all 0.4s ease-out; } .mfp-wrap{ transition: all 0.4s ease-out; } .mfp-with-zoom.mfp-ready .mfp-container { opacity: 1; } .mfp-with-zoom.mfp-ready.mfp-bg { opacity: 0.8; } .mfp-with-zoom.mfp-removing .mfp-container, .mfp-with-zoom.mfp-removing.mfp-bg { opacity: 0; transition: all 0.4s ease-out; } /* hover state */ .portfolio-panel-setting .state{ height: 14px; background-color: #ffffff; position: absolute; left: 2px; z-index: -1; } .thumbnail-small .portfolio-panel-setting:not(.hovering) .state, .state.small, .active-small{ width:7px; } .thumbnail-medium .portfolio-panel-setting:not(.hovering) .state, .state.average, .active-average{ width:16px; } .thumbnail-large .portfolio-panel-setting:not(.hovering) .state, .state.large, .active-large{ width:25px; } /*---------------------------------------------------------- Client Normal --------------------------------------------------------- */ .client-normal { position: relative; width: 100%; min-height: 300px; z-index: 0; overflow: hidden; } .client-normal .content { display: table; width: 100.3%; height: 100%; position: relative; } .client-normal .content .overlay{ position: absolute; top: 0; left:0; width: 100%; height: 100%; opacity:0.2; transition: opacity 0.3s; } .client-normal:hover .content .overlay{ opacity:0.8; } .client-normal .content .holder { position: relative; display: table-cell; vertical-align: middle; } .client-normal .content .holder .logo { text-align: center; width: 100%; } .client-normal .content .holder .logo img { max-height: 80px; margin: auto; transition: transform 0.3s; } .client-normal:hover .holder img{ -webkit-backface-visibility: hidden; transform: scale(0.8); } .client-normal .content .holder .title { position: absolute; opacity: 0; max-height: 100%; max-width: 100%; right: 50%; -webkit-transform: translateX(50%); -moz-transform: translateX(50%); -ms-transform: translateX(50%); -o-transform: translateX(50%); transform: translateX(50%); bottom: 0; text-align: center; width: 100%; font-size: 17px; font-weight: 300; line-height: 26px; transition: opacity 0.5s,bottom 0.5s; } .client-normal:hover .holder .title{ opacity: 1; bottom: 40px; } .client-normal .bg-image{ position: absolute; width: 140%; height: 140%; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; left: 0; top: 0; } /*---------------------------------------------------------- one page styel --------------------------------------------------------- */ 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 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.one_page_scroll footer , body.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; } /*---------------------------------------------------------- Client Carousel --------------------------------------------------------- */ .slick-list.slick-list{margin: 0 auto;} .slick-slide .client-logo img{ margin: auto; } .wrap-client-carousel{margin: 0 auto;} .wrap-client-carousel button{display: none;} .wrap-client-carousel .slick-slide, .wrap-client-carousel .slick-slide .wrap, .wrap-client-carousel .client-logo{ outline: none; box-shadow: none; } .wrap-client-carousel .slick-track{ display: flex; align-items: center; } .wrap-client-carousel .slick-dots li{ width: 12px; height: 12px; } .wrap-client-carousel .slick-dots li button{ background-color: #d3d3d3; width: 12px; height: 12px; border-radius: 50%; text-indent: -999px; transition: background-color .3s; } .wrap-client-carousel .slick-dots li button:hover, .wrap-client-carousel .slick-dots li.slick-active button{ background-color: #8f8f8f; } .wrap-client-carousel .slick-slide{ margin: 0 15px; } .slick-slide .slick-dots li button:before{ content: ''; } .slick-slide .slick-arrow{ display: none !important; } .wrap-client-carousel .slick-arrow { display: none !important; } /* ------------------------------------------------------ Video Shortcode Styles ------------------------------------------------------*/ .video > div:first-child { margin: 0 auto; } .video.md-align-left > div:first-child{margin-left: 0} .video.md-align-center > div:first-child{margin: 0 auto;} .video.md-align-right > div:first-child{margin-left:auto; margin-right: 0} .video-js.vjs-default-skin:not(.instagram) { position: fixed; width: 80%; height: 80%; opacity: 0; left: 10%; top: 10%; z-index: 999999; display: none; } .video-overlay { position: fixed; width: 100%; height: 100%; background: #000; opacity: 0; top: 0; left: 0; z-index: 999998; } .video-img { display: block; position: relative; overflow: hidden; max-width: 496px; background-repeat: no-repeat; background-position: center; background-size: cover; width: 100%; height: 100%; } .video-img:after { background-color: rgba(0, 0, 0, 0.2); content: ""; width: 100%; height: 100%; display: block; } .image-play-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: transform .3s cubic-bezier(0.23, 1, 0.32, 1); backface-visibility: hidden; } .image-play-btn:hover { transform: translate(-50%, -50%) scale(1.08); } .video .play-btn{ border-radius: 100%; text-align: center; display: table; margin: auto; transition: border-color .2s,transform .2s; } .video .play-btn .play-helper{ transition: transform .2s; } .video .play-btn:hover { transform: scale(1.1); } .video .play-btn:hover .play-helper{ transform: scale(1.1); } .video .play-helper { display: table-cell; vertical-align: middle; padding-left: 10%; padding-top: 10%; } /* ------------------------------------------------- Showcase ----------------------------------------------------*/ .carousel.showcase { height: 579px; position: relative; } .carousel-image { border: 0; display: block; width: 100%; height: 100%; } .carousel-feature { position: absolute; top: -1000px; left: -1000px; cursor: pointer; } .carousel.showcase .carousel-shadow { position: absolute; bottom: -6px; left: -10%; z-index: -1; max-width: none; width: 120%; } .carousel.showcase a { overflow: visible !important; cursor: pointer; } .showcase-overlay-first { position: absolute; width: 100%; height: 101%; background: #fff; top: 0; left: 0; opacity: .2; } .showcase-overlay-second { position: absolute; width: 100%; height: 101%; background: #fff; top: 0; left: 0; opacity: .5; } .showcase a.smooth-rotation{ transition: transform 300ms; } .showcase a .overlay{ width: 100%; height: 100%; position: absolute; top: 0; background-color: rgba(0,0,0,0.5); text-align: center; opacity: 0; transition: opacity 300ms; } .showcase a.carousel-center:hover .overlay{ opacity: 1; } .showcase a .border{ border: 0 solid; margin: 14px; display: block; height: calc(100% - 28px); transition: border-width 300ms; } .showcase a.carousel-center:hover .border{ border-width: 12px; } .showcase a .text-container{ display: block; position: relative; top: 50%; transform: translateY(-50%); } .showcase a .title, .showcase a .subtitle{ color: #fff; margin: 0; } .showcase a .title{ font-size: 48px; line-height: 58px; font-weight: 600; } .showcase a .subtitle{ font-size: 14px; line-height: 22px; } /* ------------------------------------------------- Testimonial Classic ----------------------------------------------------*/ .testimonial-classic { width: 100%; margin: 0 auto; } .testimonial-classic.testimonial-classic-left{ text-align: left; margin: 0; } .testimonial-classic .quote { margin-right: 10px; } .testimonial-classic .title { font-size: 30px; font-weight: 300; margin-bottom: 37px; } .testimonial-classic .flexslider { background-color: transparent; border: none; margin: 0; padding: 0; } .testimonial-classic .flexslider .slide-image { width: 70px; height: 70px; border-radius: 50%; background-size: cover; margin-bottom: 15px; } .testimonial-classic .flexslider .detail { margin-bottom: 25px; } .testimonial-classic .flexslider .detail .paragraph { margin-bottom: 26px; } .testimonial-classic .flexslider .name-job { font-size: 13px; font-style: italic; } /* center style */ .testimonial-classic-center { text-align: center; } .testimonial-classic-center .flex-control-nav { text-align: center; margin-left: 0; } .testimonial-classic-center .title { display: inline-block; } .testimonial-classic-center .icon { padding-right: 8px; float: none; margin: 0; } .testimonial-classic-center .flexslider .slide-image { float: none; margin: 0 auto 15px; } /*.testimonial-classic-center .slides { margin-bottom: 90px; }*/ /*------------------------------------------------- Testimonial Carousel ---------------------------------------------------*/ .testimonial-carousel.owl-theme .owl-dots{ text-align: center; height: 22px; } .testimonial-carousel.owl-theme .owl-dots .owl-dot { display: inline-block; zoom: 1; height: 22px; width: 24px; position: relative; } .testimonial-carousel.owl-theme .owl-dots .owl-dot span { width: 8px; height: 8px; margin: 5px 4px; background: #d5d5d5; display: block; bottom: 0; position: absolute; -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; } .testimonial-carousel.owl-theme .owl-controls{ position: relative; top: -40px; } .testimonial-carousel.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #7e7e7e; } .testimonial-carousel .owl-item{ opacity: 0; transition: opacity 0.5s; } .testimonial-carousel .owl-item.active{ transition: opacity 0.5s; opacity: 1; } .testimonial-carousel.owl-carousel .owl-stage-outer{ overflow: visible; } .testimonial-carousel .clipPath { -webkit-mask-image: url(assets/img/testimonial.png); -o-mask-image: url(assets/img/testimonial.png); -moz-mask-image: url(assets/img/testimonial.png); clip-path: url(#clipping); height: 100px; width: 100px; background-size: cover; background-repeat: no-repeat; background-position: center center; margin: auto; margin-top:45px; margin-bottom: 10px; } .testimonial-carousel .testimonial-carousel-name{ font-size: 14px; font-weight: bold; color:#171b1c; line-height: 23px; text-align: center; } .testimonial-carousel .testimonial-carousel-job-name{ font-size: 12px; font-weight: normal; color:#a9a9a9; line-height: 22px; text-align: center; margin-bottom: 17px; font-style: italic; } .testimonial-carousel .testimonial-carousel-job-text{ text-align: center; font-weight: normal; line-height: 24px; width: 70%; margin: auto; } .vc_md_testimonial_carousel #owl-demo{ display: block; margin: 0 auto; } .vc_md_testimonial_carousel #owl-demo .item:not(:first-child){ display: none; } #owl-demo.testimonial-carousel .item img{ display: block; width: 100%; height: auto; } .testimonial-carousel.owl-theme .owl-dots .owl-dot span{ width: 10px; height: 10px; margin: 0 7px; transition: all 0.3s; } .testimonial-carousel.owl-theme .owl-dots .owl-dot.active span{ border-radius: 5px; height: 16px; transition: all 0.3s; } .testimonial-carousel.owl-theme .owl-controls{ margin-top: 72px; text-align: center; } .testimonial-carousel.owl-theme .owl-controls .owl-buttons div{ color: #FFF; display: inline-block; zoom: 1; *display: inline;/*IE7 life-saver */ margin: 5px; padding: 3px 10px; font-size: 12px; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; background: #869791; filter: Alpha(Opacity=50);/*IE7 fix*/ opacity: 0.5; } .testimonial-carousel.owl-theme .owl-controls.clickable .owl-buttons div:hover{ filter: Alpha(Opacity=100);/*IE7 fix*/ opacity: 1; text-decoration: none; } .testimonial-carousel.owl-theme .owl-controls .owl-page{ display: inline-block; zoom: 1; *display: inline;/*IE7 life-saver */ } .testimonial-carousel.owl-theme .owl-controls .owl-page span{ display: block; width: 12px; height: 12px; margin: 5px 7px; filter: Alpha(Opacity=50);/*IE7 fix*/ opacity: 0.5; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; background: #869791; } .testimonial-carousel.owl-theme .owl-controls .owl-page.active span, .testimonial-carousel.owl-theme .owl-controls.clickable .owl-page:hover span{ filter: Alpha(Opacity=100);/*IE7 fix*/ opacity: 1; } .testimonial-carousel.owl-theme .owl-controls .owl-page span.owl-numbers{ height: auto; width: auto; color: #FFF; padding: 2px 10px; font-size: 12px; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } .testimonial-carousel.owl-carousel .owl-wrapper:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } /* ------------------------------------------------- Music ----------------------------------------------------*/ .music-sc { right: 0; position: relative; max-width: 1243px; padding: 0 5px; transform:translateX(-80px); } .music-sc.left-music-panel{ transform:translateX(55px); } .music-sc.md-align-left{margin-left: 0} .music-sc.md-align-center{margin: 0 auto;} .music-sc.md-align-right{margin-left:auto; margin-right: 0} .music-sc .music-main-container { width: 44%; float: left; /*margin-right: 3%;*/ margin-left: 10%; padding-bottom: 32px; } .music-sc.left .music-main-container { margin-left: 0; } /* track link */ .music-sc .tracks{ margin-top: 0; } .jp-state-playing .track-album-name { opacity: .3; } .music-sc .track .link { cursor: pointer; left: 20px; position: relative; } .music-sc .track:hover .track-name { opacity: 0.6; } .music-sc .track-name { font-size: 16px; display: block; transition: opacity .2s; } .music-sc .track-album-name { font-size: 13px; opacity: 0.4; } .music-sc .track:first-child { border-top: 1px solid rgba(255,255,255,0.3); } .music-sc .track { /* list-style: none; */ padding-bottom: 20px; /*color: #fff;*/ padding-top: 22px; position: relative; font-size: 12px; transition: all .1s; } .music-sc .track.music-played{ list-style: none!important; } .music-sc .track.music-played .icon-play { opacity:1!important; left:0!important; } li.track .music-hoverd { width: 10px; height: 10px; display: block; position: absolute; margin: auto; bottom: 0; top: 0; list-style: none; left: -5px; margin-top: 27px; opacity: 0; transition: all .4s; } .music-sc .image-album { position: relative; width: 100%; height: 100%; margin-bottom: 25px; display: block; } .wrap-image { display: inline-block; width: 38%; } .wrap-image .btnSimulate { width: 70px; height: 70px; opacity: 0; position: absolute; top: 0; bottom: 0; margin: auto; right: 0; left: 0; } .music-sc .image-album .image { width: 100%; height: 100%; display: inline-block; background-repeat: no-repeat; background-size: cover; margin-bottom: 25px; background-position: center; } .music-sc .image-album .image-shadow { width: 115%; height: 47px; position: absolute; bottom: -27px; right: -8%; max-width: none; z-index: -1; } .music-sc .image-album .disc-image { background-image: url('assets/img/disc.png'); width: 317px; height: 317px; display: inline-block; background-repeat: no-repeat; background-size: cover; margin-bottom: 25px; position: absolute; background-position: center; top: 5%; z-index: -1; right: 0; transition: right 1s linear; animation-name: rotate; animation-duration: 7s; animation-iteration-count: infinite; animation-timing-function: linear; animation-play-state: paused; margin-right: 24px; } @keyframes rotateLeft { from { transform: rotate(0deg); } to { transform: rotate(-360deg); } } @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .music-sc .image-album .disc-image-state { animation-play-state: running; right: -43% !important; } .music-sc.left-music-panel .image-album .disc-image-state { animation-play-state: running; right: 43% !important; } .wrap-image > div { font-weight: 300; font-family: "Roboto"; } .music-sc .main-album-name { font-size: 21px; } .music-sc .artist { font-size: 13px; } /* jPlayer */ .jp-audio { font-size: 14px; } .jp-audio-stream { width: 182px; } .jp-interface { position: relative; } .jp-audio-stream .jp-interface { height: 80px; } /* @group CONTROLS */ .music-sc .jp-controls { position: absolute; top: 0; } .music-sc .play-pause { width: 70px; height: 70px; border: none; font-size: 33px; background-color: rgba(0, 0, 0, 0.6); background-position: center; border-radius: 50%; outline: none; color: #fff } .play-pause-state-remove { animation-name: playToPause; animation-direction: reverse; } .music-sc .musicBtnClicked { font-size: 14px !important; } /* Progress */ .music-sc .jp-progress { position: absolute; top: 16px; height: 1px; } .music-sc .jp-type-single .jp-progress { width: 100%; } .music-sc .jp-type-playlist .jp-progress { left: 166px; width: 130px; } .music-sc .jp-seek-bar { width: 0; height: 100%; cursor: pointer; } .music-sc .jp-seek-bar:after { content: ""; width: 100%; margin-top: -11px; height: 18px; opacity: 0.2; display: block; } .music-sc .jp-play-bar { background-color: #fff; width: 0; height: 4px; top: -4px; margin-top: -3px; } .music-sc .seekRefine { width: 0 !important; } /* The seeking class is added/removed inside jPlayer */ .music-sc .jp-duration { position: relative; margin-top: -32px; float: right; right: 0; transition: all .1s; } .music-sc .jp-audio .music-bar { background-image: url("assets/img/music-bar.gif"); background-repeat: no-repeat; background-size: cover; width: 14px; height: 11px; margin-top: -27px; float: right; display: none; } .video.md-align-left > div:first-child{} /* Responsive */ .col-sm-6 .music-sc { overflow: hidden; } .col-sm-6 .music-sc .music-main-container { margin-right: 5%; } .col-sm-12 .wrap-image { width: 350px !important; height: 350px !important; } .col-sm-6 .music-sc .image-album .disc-image { top: 6%; margin-right: 42px; } /* Left Alignment */ .music-sc.left-music-panel .music-main-container { margin-left: 0; } .music-sc.left-music-panel .wrap-image { float: left; margin-left: 10%; } .music-sc.right-music-panel .wrap-image{ float: right; margin-right: 10%; } /* ------------------------------------------------- Instagram Widget ----------------------------------------------------*/ .left-align .widget-instagram .widget-content{ float: left; } .right-align .widget-instagram .widget-content{ float: right; } .widget-instagram .widget-content { position: relative; max-width: 100%; width: 256px; margin: auto; } .widget-instagram .widget-content > .item { width: 60px; height: 60px; margin: 2px; float: left; position: relative; cursor: pointer; } .widget-instagram .featured-item .item { width: 256px; height: 256px; max-width: 100%; float: none; cursor: inherit; } .widget-instagram .widget-content > .item .meta { display: none; } .widget-instagram .featured-item .meta { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 58px; text-align: left; background: transparent url("assets/img/instagram-shadow.png") center repeat-x; } .widget-instagram .item .meta .likes, .widget-instagram .item .meta .comments { color: #fff; font-size: 12px; line-height: 58px; background-color: transparent; } .widget-instagram .item:first-child .meta i { margin-right: 5px; } .widget-instagram .item .meta .likes { margin-left: 15px; } .widget-instagram .item .meta .comments { margin-left: 10px; } .widget-instagram .user-info { text-align: center; margin: -40px 0 20px; position: relative; } .widget-instagram .user-info .avatar { width: 80px; height: 80px; border: 3px solid rgba(255, 255, 255, 0.3); border-radius: 50%; background-position: center; background-size: contain; margin: 0 auto 10px; background-clip: padding-box; } .widget-instagram .user-info .username, .widget-instagram .user-info .biography { color: inherit; margin: 0; line-height: 14px; } .widget-instagram .user-info .username { margin-bottom: 5px; } .widget-instagram .user-info .username a { font-size: 14px; font-weight: bold; } .widget-instagram .user-info .biography { font-size: 12px; } /*------------------------------------------ Calendar Blog -------------------------------------------*/ .calendar-blog { min-height: 150px; position: relative; margin: auto; border-top: 1px solid; border-left: 1px solid; background-size: calc(100% + 100px); background-clip: content-box; /* Firefox issue fix */ } .calendar-blog .blog-container { position: relative; float: left; border-bottom: solid 1px; border-right: solid 1px; width: 20%; z-index: 5; height: 300px; } .calendar-blog .image { position: absolute; top: 0; left: 0; opacity: 0; z-index: 1; transition: opacity 0.3s; width: 100%; height: 100%; background-position: center; background-size: cover; } .calendar-blog .blog-day { font-size: 48px; line-height: 48px; font-weight: normal; position: absolute; top: 6%; left: 7%; z-index: 3; transition: color 0.3s; } .calendar-blog .blog-month, .calendar-blog .blog-year { font-size: 13px; position: absolute; top: 25%; left: 7%; text-transform: uppercase; line-height: 13px; font-weight: bold; z-index: 3; transition: color 0.3s; } .calendar-blog .blog-year { top: 30%; } .calendar-blog .blog-title { font-size: 18px; line-height: 25px; font-weight: normal; position: absolute; bottom: 14%; left: 7%; z-index: 3; transition: color 0.3s; width: 70%; } .calendar-blog .blog-overlay { position: absolute; top: 0; left: 0; width: 100%; z-index: 2; right: 0; bottom: 0; } .calendar-blog .blog-details { font-size: 14px; position: absolute; bottom: 8%; left: 7%; line-height: 14px; font-weight: normal; width: 91%; z-index: 3; opacity: 0; transition: opacity 0.3s; } .calendar-blog .blog-container:hover .image,.calendar-blog .blog-container.hovered .image{ -webkit-backface-visibility: hidden; opacity: 0.9; } .calendar-blog .blog-container:hover .blog-details { opacity: 1; } .calendar-blog .blog-comment { background-image: url("assets/img/comment.png"); background-repeat: no-repeat; width: 13%; height: 15px; float: left; font-size: 13px; font-weight: normal; padding-left: 7%; } .calendar-blog .blog-cat { width: 87%; float: left; } /*------------------------------------------ Carousel Blog -------------------------------------------*/ .post-carousel-container{ max-width: 1200px; margin:0 auto 30px auto; padding-bottom: 10px; } .post-carousel-container .flickity-viewport{ transition: height 0.4s ease-in; } .post-carousel-container .post-wrap{ height:470px; width:29%; margin-right: 23px; margin-left:23px; display: inline-block; position: relative; outline: none; padding-top: 10px; transition: opacity 0.5s ease-out; } .post-carousel-container .post-content-container{ padding-top:60px; padding-left:60px; padding-right: 60px; border-radius:5px; transition: all 0.5s ease-out; position: relative; } .post-carousel-container .post-content-container .blog-title{ font-size: 18px; text-align: left; line-height: 1.5em; } .post-carousel-container .post-content-container .post-description{ margin-top:18px; overflow: hidden; text-align: left; } .post-carousel-container .post-content-container .post-description p{ margin-bottom: 25px; line-height: 1.6em; } .post-carousel-container .post-content-container .post-separator{ width: 100%; height: 1px; } .post-carousel-container .post-content-container .post-meta-container{ padding-bottom: 30px; } .post-carousel-container .post-content-container .post-author-image{ width:26px; height:26px; border-radius: 26px; margin:25px auto 5px auto; } .post-carousel-container .post-content-container .post-author-image img{ width:26px; height:26px; border-radius: 26px; } .post-carousel-container .post-content-container .post-author-name , .post-carousel-container .post-content-container .post-author-name a{ text-align: center; text-transform: capitalize; font-size: 11px; } .post-carousel-container .vertical-separator { width: 1px; height: 30px; margin: 0 auto; position: absolute; left: 50%; bottom: -15px; } .post-carousel-container .post-date{ width:100%; text-align: center; margin-top:30px; } .post-carousel-container .post-date .post-date-day{ font-size:37px; font-weight: bold; } .post-carousel-container .post-date .post-date-month{ font-size:11px; letter-spacing:3px; text-transform: uppercase; } .post-carousel-container .post-wrap{ opacity:0.5; } .post-carousel-container .post-wrap.is-selected{ opacity:1; } .post-carousel-container .flickity-page-dots .dot.is-selected { height:11px; } .post-carousel-container .flickity-page-dots { position: absolute; width: 100%; bottom: 0; border-radius: 30px; } .post-carousel-container .flickity-page-dots .dot { background-color: rgba(0,0,0,0.3); width: 6px; height: 6px; opacity: 1; transition: all 0.1s ease-in; display: inline-block; } .flickity-page-dots .dot.is-selected{ border-radius: 5px; } .post-carousel-container .flickity-page-dots { bottom: 0; } .post-carousel-container .flickity-slider{ padding-top: 20px; } .post-carousel-container .post-wrap:not(.is-selected) .post-content-container{ -webkit-box-shadow: 0 1.5px 9px 0 rgba(0,0,0,0.2); -moz-box-shadow: 0 1.5px 9px 0 rgba(0,0,0,0.2); box-shadow: 0 1.5px 9px 0 rgba(0,0,0,0.2); } /*---------------------------------------------------- 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; } /*------------------------------------------ Instagram shortcode -------------------------------------------*/ .instagram .heading { margin: 0 13px 80px 33px; } .instagram .left-aligned { float: left; } .instagram .right-aligned { float: right; } .instagram .heading .avatar { width: 77px; height: 77px; background-position: center; background-size: cover; float: left; border-radius: 50%; margin-right: 30px; } .instagram .heading .title-holder { float: left; } .instagram .heading .title { font-size: 32px; line-height: 32px; margin: 0; } .instagram .heading .separator { width: 40px; height: 1px; margin: 18px 0; } .instagram .heading .username, .instagram .heading .username a { font-weight: bold; font-size: 15px; line-height: 15px; margin: 0; font-variant: small-caps; } .instagram .statistic { margin-top: 25px; } .instagram .statistic .item { float: left; padding: 0 20px; border-left: 1px solid; } .instagram .statistic .item:first-child { border: none; } .instagram .statistic .number { font-weight: bold; font-size: 14px; } .instagram .statistic .label { font-size: 12px; line-height: 12px; font-weight: normal; margin: 2px 0 0; } .instagram .photo-list .item { float: left; margin-bottom: 55px; } .instagram .photo-list .item .media { position: relative; margin-bottom: 25px; } .instagram .photo-list .overlay-background { position: absolute; width: 100%; height: 100%; top: 0; left: 0; text-align: center; opacity: 0; transition: opacity 300ms; } .instagram .photo-list .video-js + .overlay-background{ display: none; } .instagram .photo-list .item:hover .overlay-background { opacity: 1; } .instagram .photo-list .overlay-background .description { position: relative; top: 50%; transform: translateY(-50%); font-size: 16px; line-height: 22px; padding: 0 20px; } .instagram .photo-list .item-image { background-size: cover; background-position: center; background-repeat: no-repeat; } .instagram .photo-list .item .meta .description { float: left; font-size: 15px; line-height: 15px; margin: 0; font-weight: bold; } .instagram .photo-list .item .meta .likes, .instagram .photo-list .item .meta .comments { float: right; font-size: 13px; line-height: 15px; } .instagram .photo-list .item .meta .likes { margin-right: 15px; } .instagram .photo-list .item .meta .likes i, .instagram .photo-list .item .meta .comments i { margin-right: 5px; font-size: 14px; } .instagram .comments { background-color:transparent; } .instagram .video_instagram + .overlay-background{ display: none;} .video_instagram .icon-play-curve{ font-size: 45px; color: #efe9e9; width: 45px; height: 45px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); cursor: pointer; } /*------------------------------------------ Process Steps shortcode -------------------------------------------*/ .process-steps .step { float: left; text-align: center; } .process-steps .step:last-child { margin-right: 0; } .process-steps .step .circle { border-radius: 50%; text-align: center; position: relative; transform: scale(0); opacity: 0; background-size: cover; background-position: center; } .process-steps .step .circle .separator { content: ""; margin: 50% 15px; position: absolute; top: 0; left: 101%; transform: scaleX(0); transform-origin: left center; } .process-steps .step .circle .overlay-background { width: 100%; height: 100%; position: absolute; top: 0; left: 0; border-radius: 50%; z-index: -1; } .process-steps .step:last-child .circle .separator { display: none; } .process-steps .step.small .circle { margin: 47px 0 77px; } .process-steps .step.medium .circle { margin: 24px 0 54px; } .process-steps .step.large .circle { margin-bottom: 30px; } .process-steps .step .caption { position: relative; top: 50%; display: block; font-size: 22px; transform: translateY(-50%); } .process-steps .step .title { font-size: 17px; line-height: 25px; margin-bottom: 0; padding-top: 30px; opacity: 0; backface-visibility: hidden; } .process-steps .step .description { font-size: 14px; line-height: 20px; opacity: 0; visibility: hidden; padding-top: 30px; backface-visibility: hidden; } /*-------------------------------------- Separator --------------------------------------*/ .sc-separator { text-align: center; margin: auto } .sc-separator.md-align-left{margin-left: 0} .sc-separator.md-align-center{margin: 0 auto;} .sc-separator.md-align-right{margin-left:auto; margin-right: 0} .sc-separator img { margin: auto; width: 100%; height: 45px } .has-animation { opacity: 0; } /*-------------------------------------- Progress bar widget --------------------------------------*/ .widget_md_progress { padding-right: 35px; } .widget_md_progress .widget-title { font-size: 15px; } .widget_md_progress .progress-list .bar-percentage { float: left; margin-right: 9px; font-size: 13px; text-align: right; margin-top: 3px; line-height: 2; width: 33px; } .widget_md_progress .progress-list .bar-container { height: 100%; overflow: hidden; vertical-align: middle; display: list-item; line-height: 100%; opacity: 0; } .widget_md_progress .progress-list .bar { height: 3px; border-radius: 5px; opacity: 0; } .widget_md_progress .progress-list .title { left: 3px; position: relative; line-height: 23px; text-align: left; font-size: 13px; font-weight: normal; } .widget-area.modernStyle .wrapContent { width: 100%; } /* Dark style */ .dark-sidebar.dark .widget_md_progress .progress-list .bar-percentage, .footer-widgets.dark .widget_md_progress .progress-list .bar-percentage { color: rgba(0, 0, 0, 0.6); } .dark-sidebar .widget_md_progress .progress-list .bar, .footer-widgets.dark .widget_md_progress .progress-list .bar { background-color: rgba(0, 0, 0, 0.3); } .dark-sidebar .widget_md_progress .progress-list .title, .footer-widgets.dark .widget_md_progress .progress-list .title { color: rgba(0, 0, 0, 0.6); } /* hover */ .dark-sidebar .widget_md_progress .progress-list .progressbar:hover .bar-percentage, .footer-widgets.dark .widget_md_progress .progress-list .progressbar:hover .bar-percentage{ color: rgba(0, 0, 0, 1); } .dark-sidebar .widget_md_progress .progress-list .progressbar:hover .bar, .footer-widgets.dark .widget_md_progress .progress-list .progressbar:hover .bar{ background-color: rgba(0, 0, 0, 1); } .dark-sidebar .widget_md_progress .progress-list .progressbar:hover .title, .footer-widgets.dark .widget_md_progress .progress-list .progressbar:hover .title{ color: rgba(0, 0, 0, 1); } /* Light style */ .light-sidebar .widget_md_progress .progress-list .bar-percentage, .footer-widgets.light .widget_md_progress .progress-list .bar-percentage{ color: rgba(255, 255, 255, 0.6); } .light-sidebar .widget_md_progress .progress-list .bar, .footer-widgets.light .widget_md_progress .progress-list .bar{ background-color: rgba(255, 255, 255, 0.6); } .light-sidebar .widget_md_progress .progress-list .title, .footer-widgets.light .widget_md_progress .progress-list .title{ color: rgba(255, 255, 255, 0.6); } /* hover */ .light-sidebar .widget_md_progress .progress-list .progressbar:hover .bar-percentage, .footer-widgets.light .widget_md_progress .progress-list .progressbar:hover .bar-percentage{ color: rgba(255, 255, 255, 1); } .light-sidebar .widget_md_progress .progress-list .progressbar:hover .bar, .footer-widgets.light .widget_md_progress .progress-list .progressbar:hover .bar{ background-color: rgba(255, 255, 255, 1); } .light-sidebar .widget_md_progress .progress-list .progressbar:hover .title, .footer-widgets.light .widget_md_progress .progress-list .progressbar:hover .title{ color: rgba(255, 255, 255, 1); } /* other options */ .widget_md_progress .progressbar{ cursor: pointer; } .widget_md_progress .progressbar .bar-percentage, .widget_md_progress .progressbar .bar, .widget_md_progress .progressbar .title{ transition: all .5s; } /*-------------------------------------- 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; display: block; font-weight: normal; margin-top: 45px; width: 110px; transition: color 0.3s,background-image 0.3s,background-position 0.3s; } .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; } /*** 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: white; 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-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; } /* social widget */ .widget-md-social .item { margin-bottom: 20px; } .widget-md-social a i.icon { margin-right: 10px; } .sidebar.right-align .widget-md-social .item-list a i.icon{ float: right; margin: 3px 0 0 10px; } .footer-widgets .widget-md-social a i.icon { padding: 5px; border-radius: 50px; display: inherit; transition: background-color .3s; } .footer-widgets.light .widget-md-social a i.icon { background-color: rgba(255,255,255, 0.6); color: rgba(0,0,0,.6); } .footer-widgets.dark .widget-md-social a i.icon { background-color: rgba(0,0,0, 0.6); color: rgba(255,255,255,.6); } /* hover */ .footer-widgets.light .widget-md-social a:hover i.icon { background-color: #fff; } .footer-widgets.dark .widget-md-social a:hover i.icon { background-color: #000; } /* text part */ .footer-widgets .widget-md-social a i.text { font-style: normal; } /* 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:hover:after, #content .post-pagination > span:hover:after{ width: 100%;transition: all 1s; }*/ #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; } /*-------------------------------------- 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; } .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 { 0% { opacity: 1 } 50% { opacity: .5 } 100% { opacity: 1 } } /*-------------------------------------- Team Member Style2 --------------------------------------*/ .wrap-teammember-style2{ margin: auto; } .wrap-teammember-style2 .slick-slider{ margin-left: auto !important; margin-right: auto !important; width: 90%; right: 0; margin-bottom: 0; } .wrap-teammember-style2 .slick-track{ margin: auto; } .wrap-teammember-style2 .slides li{ outline: none; position: relative; transition: margin .5s; margin: 0 12px; } .wrap-teammember-style2 .slides li .wrap{ position: relative; } .wrap-teammember-style2 .teammember-image{ width: 100%; background-position: center; height: 330px; background-size: cover; } /* meta */ .wrap-teammember-style2 .slides li .meta{ margin-top: 24px; text-align: center; } .wrap-teammember-style2 .slides li .meta .name{ font-size: 16px; } .wrap-teammember-style2 .slides li .meta .position{ font-size: 13px; } /* hover */ .wrap-teammember-style2 .teammember-hover{ background-color: rgba(0,0,0,0.7); position: absolute; width: 100%; height: 100%; display: block; top: 0; left: 0; opacity: 0; transition: opacity .4s; } .wrap-teammember-style2 .slides li:hover .teammember-hover{ opacity: 1; } .wrap-teammember-style2 .teammember-hover p{ font-size: 14px; color: #fff; margin: auto; display: table; padding: 37% 40px 35px 40px; line-height: 22px; text-align: center; } /* socials */ .wrap-teammember-style2 .teammember-hover .social-icons{ margin: 0 auto; display: table; } .wrap-teammember-style2 .teammember-hover .social-icons li{ list-style: none; float: left; margin: 0 10px; } .wrap-teammember-style2 .teammember-hover .social-icons li a{ color: #fff; transition: opacity .5s; } .wrap-teammember-style2 .teammember-hover .social-icons li a:hover { opacity: .5; } /*To move navigation buttons outside use these settings:*/ .wrap-teammember-style2 .slick-arrow { background-repeat: no-repeat; background-position: center; width: 16px; height: 41px; transition: opacity .4s; } .wrap-teammember-style2 .slick-arrow:hover { opacity: .5 !important; } .wrap-teammember-style2 .slick-arrow { transition: left .2s, right .2s; margin-top: -3%; } .wrap-teammember-style2 .slick-arrow:before { content: ''; } .wrap-teammember-style2 .slick-arrow.slick-prev { background-image: url('assets/img/tm2-back.png'); left: -61px; } .wrap-teammember-style2 .slick-arrow.slick-prev:hover { left: -66px; } .wrap-teammember-style2 .slick-arrow.slick-next:hover { right: -66px; } .wrap-teammember-style2 .slick-arrow.slick-next { background-image: url('assets/img/tm2-next.png'); right: -61px; } /* Responsive */ .col-sm-12 .wrap-teammember-style2 .slick-slider { width: 90%; } .col-sm-10 .wrap-teammember-style2 .slick-arrow { margin-top: -5%; } .col-sm-8 .wrap-teammember-style2 .slick-arrow { margin-top: -5%; } .col-sm-6 .wrap-teammember-style2 .slick-arrow { margin-top: -7%; } .col-sm-4 .wrap-teammember-style2 .slick-arrow { margin-top: -9%; } .col-sm-3 .wrap-teammember-style2 .slick-arrow.slick-prev, .col-sm-4 .wrap-teammember-style2 .slick-arrow.slick-prev { left: -41px; } .col-sm-3 .wrap-teammember-style2 .slick-arrow.slick-next, .col-sm-4 .wrap-teammember-style2 .slick-arrow.slick-next { right: -41px; } .col-sm-3 .wrap-teammember-style2 .slick-arrow { margin-top: -14%; } .col-sm-2 .wrap-teammember-style2 .slick-arrow { margin-top: -23%; } .col-sm-2 .wrap-teammember-style2 .slick-arrow.slick-prev { left: -27px; } .col-sm-2 .wrap-teammember-style2 .slick-arrow.slick-next { right: -27px; } /*--------------------------------------------------------- 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-collapse.png); 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/empty_cart.png") 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; } /* 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: white; 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/close.png") center 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/notfound.png") no-repeat center; 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 p { text-transform: uppercase; font-size: 15px !important; } .error404 footer{ display: none; } /********************************* 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; } /************************************************************ Blog Masonry ************************************************************/ .blog-masonry-container{ float:left; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin: 0 15px 35px; transition: all 300ms; } .blog-masonry-container:hover{ box-shadow: 0 20px 25px rgba(0, 0, 0, 0.15)!important; -webkit-box-shadow: 0 20px 25px rgba(0, 0, 0, 0.15)!important; margin-top: -4px; } .blog-masonry-container .quote-img{ margin: 40px 0 -10px 35px; } .blog-masonry-container .blog-masonry-content{ margin: 30px 35px 35px; } .blog-masonry-container .blog-masonry-content .blog-cat{ border-radius: 35px; padding: 5px 16px; font-size: 13px; font-weight: normal; line-height: 35px; margin-right: 8px; } .blog-masonry-container .blog-masonry-content .blog-date{ font-size: 13px; font-weight: normal; line-height: 23px; opacity: 0.7; } .blog-masonry-container .blog-masonry-content .blog-date a, .blog-masonry-container .blog-masonry-content .blog-cat a{ font-size: 13px; } .blog-masonry-container .blog-masonry-content .blog-title{ font-size: 23px; font-weight: bold; line-height: 30px; margin-top: 20px; transition: color .3s; } .blog-masonry-container .blog-masonry-content .blog-excerpt{ font-size: 15px; font-weight: normal; line-height: 23px; margin-top: 10px; opacity: 0.7; } .blog-masonry-container.quote .blog-masonry-content .blog-excerpt{ margin-top: 20px; } .blog-masonry-container .blog-masonry-content .post-share{ float: left; width: 38px; height: 38px; margin-top: 35px; } .blog-masonry-container .blog-masonry-content .post-share .share{ width: 36px; height: 36px; display: block; opacity: 1; transition: opacity 0.8s; } .blog-masonry-container .blog-masonry-content .post-share .share-hover{ width: 36px; height: 36px; display: block; margin-top: -36px; opacity: 0; transition: opacity 0.8s; } .blog-masonry-container .blog-masonry-content .post-share:hover .share-hover{ opacity: 1; } .blog-masonry-container .blog-masonry-content .post-share:hover .share{ opacity: 0; } /* comment btn */ .blog-masonry-container .blog-masonry-content .post-like-holder, .blog-masonry-container .blog-masonry-content .post-share{ float: right; margin: 25px 8px 22px 0; width: 36px; height: 36px; position: relative; opacity: 0.7; text-align: center; } .blog-masonry-container .blog-masonry-content .like-heart, .blog-masonry-container .blog-masonry-content .share, .blog-masonry-container .blog-masonry-content .share-hover{ width: 36px; height: 36px; display: block; transition: all 0.8s ease-out; border-radius: 100%; border: 1px solid rgba(140,135,135,0.7); } .blog-masonry-container .blog-masonry-content .like-heart i, .blog-masonry-container .blog-masonry-content .share i, .blog-masonry-container .blog-masonry-content .share-hover i{ position: absolute; color: #cfcfcf; } .blog-masonry-container .blog-masonry-content .like-heart i{ right: 9px; top: 11px; font-size: 17px; } .blog-masonry-container .blog-masonry-content .share i, .blog-masonry-container .blog-masonry-content .share-hover i{ right: 11px; font-size: 16px; top: 10px; } .blog-masonry-container .blog-masonry-content .like-count{ position: absolute; top: 12px; left: 0; right: 0; margin: 0 auto; color: #fff; display: none; } .blog-masonry-container .blog-masonry-content .post-like-holder:hover i{ display: none; } .blog-masonry-container .blog-masonry-content .post-like-holder:hover .post-like-hover{ opacity: 0.7; } .blog-masonry-container .blog-masonry-content .post-like-holder:hover .post-like-hover span{ opacity: 0.7; } .blog-masonry-container .blog-masonry-content .post-like-holder:hover .post-like{ opacity: 0; } .blog-masonry-container .blog-masonry-content .post-like-holder:hover .like-count{ display: block } .blog-masonry-container .blog-masonry-content .post-like-holder:hover .like-heart{ border: none; background-color: #CFCFCF } .blog-masonry-container li.images { height: 250px; background-size: cover; background-position: 50% 50%; border-top-left-radius: 4px; border-top-right-radius: 4px; } .blog-masonry-container.standard img { width: 100%; transition: all 400ms; } .blog-masonry-container.video .video .video-img{ max-width: 100%; } .blog-masonry-container .blog-details{ position: absolute; top: 15px; right: 13px; z-index:2; } .blog-masonry-container .blog-date .px-icon{ margin-right:5px; } .blog-masonry-container .post-like-holder{ margin-right: -3px !important; } /******************************************************** Counter 1 ********************************************************/ .md-counter.md-align-left{text-align: left;} .md-counter.md-align-center{text-align: center;} .md-counter.md-align-right{text-align: right;} .md-counter .icon{ display: inline-block; font-size: 55px; font-weight: normal; } .md-counter .icon i{ vertical-align: super; } .md-counter .text{ display: inline-block; margin-left: 10px; text-align: left; } .md-counter .timer{ font-size: 55px; font-weight: normal; line-height: 55px; opacity: 0; width: 120px; margin-bottom: 5px; } .md-counter .title{ font-size:18px; font-weight:normal; opacity: 0.7; line-height: 18px; } /******************************************************** Count Box ********************************************************/ .md-countbox.md-align-left{ text-align: left; } .md-countbox.md-align-center{ text-align: center; } .md-countbox.md-align-right{ text-align: right; } .md-countbox .counter{ display: inline-block; } .md-countbox .timer{ font-size: 85px; font-weight: normal; line-height: 85px; opacity: 0; width: 22%; float: left; margin-right: 30px; text-align: right; } .md-countbox .countbox-text{ float: left; width: 70%; text-align: left; } .md-countbox .title{ font-size:27px; font-weight:bold; line-height: 27px; margin-bottom: 20px; margin-top: 10px; opacity: 1; width: 70%; } .md-countbox .title.countbox-nodesc{ margin: 0; line-height: 85px; } .md-countbox .countbox-title-separator{ border-bottom: 1px solid; width: 7%; margin-bottom: 17px; } .md-countbox p{ font-size:14px; font-weight:normal; line-height: 23px; margin-bottom: 35px; opacity: 0.7; } /****************************************************************** Horizontal Tab ******************************************************************/ .vc_md_hor_tabs{ clear: both; } .md_hor_tab ul.px_tabs_nav { float: left; } .md_hor_tab .wpb_tab { float: left; } .md_hor_tab.wpb_content_element.wpb_tabs .wpb_tour_tabs_wrapper .wpb_tab{ width: 60%; background-color: transparent; padding-top: 0 ; text-align: left; padding: 0 !important; } .md_hor_tab.wpb_content_element .px_tabs_nav.md-custom-tab{ width: 40%; position: relative; } .md_hor_tab.wpb_content_element .overlay{ position: absolute; width: 100%; height: 100%; background-color: rgba(0,0,0,.5); display: inline; top: 0; left: 0; z-index: 0; } .md_hor_tab.wpb_content_element .px_tabs_nav.md-custom-tab > li{ float: none; height: 65px; display: table; width: 100%; z-index: 1; } .md_hor_tab.wpb_content_element .px_tabs_nav.md-custom-tab > li > a{ float: none; padding: 0; display: table-cell; vertical-align: middle; } .md_hor_tab.wpb_content_element .px_tabs_nav.md-custom-tab > li > a .horTabTitle{ float: left; font-size: 18px; font-weight: normal; line-height: 20px; } .md_hor_tab.wpb_content_element .px_tabs_nav.md-custom-tab > li a i{ margin-right: 12px; float: left; font-size: 19px; font-weight: normal; } .md_hor_tab.wpb_content_element .px_tabs_nav.md-custom-tab > li a i.icon-angle-right{ float: right; margin-right: 0; } .compose-mode .md_hor_tab.wpb_content_element .px_tabs_nav.px_tabs_nav{ z-index: 1; } .px_tabs_nav.md-custom-tab > li > a:active,.px_tabs_nav.md-custom-tab > li > a:hover,.px_tabs_nav.md-custom-tab > li > a:focus{ outline:0; } /****************************************************************** Horizontal Tab 2 ******************************************************************/ .vc_md_hor_tabs2{ clear: both; } .md_hor_tab2 ul.px_tabs_nav { float: left; } .md_hor_tab2 .wpb_tab { float: left; } .md_hor_tab2.wpb_content_element.wpb_tabs .wpb_tour_tabs_wrapper .wpb_tab{ width: 60%; background-color: transparent; padding-top: 0 ; text-align: left; padding: 0 !important; } .md_hor_tab2.wpb_content_element .px_tabs_nav.md-custom-tab{ width: 40%; position: relative; } .md_hor_tab2.wpb_content_element .px_tabs_nav.md-custom-tab > li:first-child{ margin-top: 0; } .md_hor_tab2.wpb_content_element .px_tabs_nav.md-custom-tab > li{ float: none; height: 55px; display: table; width: 100%; z-index: 1; margin-top: 15px; background-repeat: no-repeat; transition: background-size .3s, color .3s; background-position: 50% 50%; background-size: 100% 0%; background-color: transparent; } .md_hor_tab2.wpb_content_element .px_tabs_nav.md-custom-tab > li:hover, .md_hor_tab2.wpb_content_element .px_tabs_nav.md-custom-tab > li.ui-tabs-active{ background-size: 100% 100%; } .md_hor_tab2.wpb_content_element .px_tabs_nav.md-custom-tab > li > a{ float: none; display: table-cell; vertical-align: middle; padding: 0 18px; } .md_hor_tab2.wpb_content_element .px_tabs_nav.md-custom-tab > li > a .horTabTitle{ float: left; font-size: 16px; font-weight: normal; line-height: 22px; } .md_hor_tab2.wpb_content_element .px_tabs_nav.md-custom-tab > li a i{ margin-right: 12px; float: left; font-size: 22px; font-weight: normal; } .md_hor_tab2.wpb_content_element .px_tabs_nav.md-custom-tab > li a i.icon-angle-right{ float: right; margin-right: 0; } .compose-mode .md_hor_tab2.wpb_content_element .px_tabs_nav.px_tabs_nav{ z-index: 1; } /**************************************************************** Skill Chat Pie ****************************************************************/ .md-pie-chart{ padding-top: 80px } .md-pie-chart.md-align-left .chart{margin-left: 0;} .md-pie-chart.md-align-center .chart{margin: 0 auto;} .md-pie-chart.md-align-right .chart{margin-left:auto;margin-right: 0;} .md-pie-chart .chart{ width: 210px; } .md-pie-chart .easyPieChart { position: relative; text-align: center; } .md-pie-chart .label{ text-align: center; font-size: 16px; font-weight: normal; line-height: 16px; } .md-pie-chart .percentage{ text-align: center; font-size: 35px; font-weight: normal; line-height: 35px } .md_pieChart2_title { display: block; font-size: 15px; margin-top: 15px; line-height: 20px; } .type-2 .icon { position: absolute; top: -44%; width: 102%; text-align: center; } .type-2.without-title .icon { position: absolute; top: -26%; width: 102%; text-align: center; } .pie_chart2_bottom_title { display: inline-block; position: absolute; top: 95%; text-align: center; width: 102%; } .md-pie-chart.type-2{ padding-top:113px ; } /**************************************************************** Google Map ****************************************************************/ .md-google-map { width:100%; } .gm-style-mtc { display: none; } /****************************************************************** Blog Classic *******************************************************************/ .classic-blog .loop-post-content{ padding: 0 0 15px; -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: white; } .classic-blog.classic-blog-left .loop-post-content { padding: 0 0 33px; } .classic-blog .loop-post-content ol, .classic-blog .loop-post-content ul{ padding-left: 0; margin-left: 0; } .classic-blog .loop-post-content .post-categories { width: 100%; padding-top: 35px; margin-bottom: 20px; text-transform: capitalize; color: #ffffff; } .classic-blog-left .loop-post-content .post-categories{ width:auto; float:left; padding-left:55px; padding-top:42px; } .classic-blog .loop-post-content .post-categories a{ font-size: 14px; font-weight: normal; line-height: 22px; padding: 4px 15px; border-radius: 35px; display: inline-block; -webkit-transition: color .3s, background-color .3s; -moz-transition: color .3s, background-color .3s; -ms-transition: color .3s, background-color .3s; -o-transition: color .3s, background-color .3s; transition: color .3s, background-color .3s; } .classic-blog .loop-post-content .post-meta { margin-bottom: 20px; } .classic-blog-left .loop-post-content .post-meta{ clear: both; padding:0 55px; } .classic-blog .loop-post-content .post-meta .post-info{ margin-bottom: 16px; margin-top: 17px; } .classic-blog-left .loop-post-content .post-info{ float:left; padding-top:47px; margin-left:25px; } .classic-blog .loop-post-content .classic-blog-icon{ padding:0 10px 0 0; font-size: 17px; } .classic-blog-left .loop-post-content .post-info *{ width:auto; } .classic-blog .loop-post-content .post-title{ margin-left: -2px; max-width: 100%; margin-top: 0; font-size: 35px; font-weight: normal; line-height: 35px; } .classic-blog .loop-post-content .post-title a{ font-size: 35px; font-weight: 900; line-height: 1.2em; transition: color 0.3s; text-transform: none; letter-spacing: -1px; } .classic-blog .loop-post-content p { width: 88%; } .classic-blog-left .loop-post-content .classic-blog-content{ padding:0 55px; } .classic-blog-left .loop-post-content .classic-blog-content p{ width:100%; } .classic-blog .loop-post-content .post-meta .post-info p { float: none; display: inline-block; margin-right: 3px; } .classic-blog .loop-post-content .post-meta .post-info p a{ font-size: 15.8px; font-weight: normal; line-height: 23px; } .classic-blog .loop-post-content .post-meta .post-date .symbol{ background: transparent url(assets/img/date-icon.png) no-repeat center; margin-right: 12px; width: 15px; height: 15px; display: inline-block; } .classic-blog .loop-post-content .post-share .share{ background-image: url("assets/img/share-blog.png"); height: 20px; width: 20px; opacity: 1; } .classic-blog .loop-post-content .post-share .share-hover{ display: none; } .classic-blog .loop-post-content .post-comment{ background-image: url("assets/img/blog-chat.png"); height: 20px; width: 20px; } .classic-blog .loop-post-content .post-comment-hover{ background-image: none; height: 20px; width: 20px; margin-top: -10px; } .classic-blog .loop-post-content .post-comment-holder, .classic-blog .loop-post-content .post-share{ margin-top: 30px; width: 20px; height: 20px; margin-right: 12px; float: left; display: inline-block; } .classic-blog-left .loop-post-content .post-comment-holder, .classic-blog-left .loop-post-content .post-share{ margin-top: 50px; } .classic-blog-left .loop-post-content .post-comment-holder{ margin-right: 0; } .classic-blog .loop-post-content .post-comment-hover span{ color:#cbcbcb; } .classic-blog .loop-post-content .sepretor{ float: left; color: #cbcbcb; margin-top: 45px; font-size: 18px; font-weight: 100; margin-right: 3px; } .classic-blog.classic-blog-center .loop-post-content .sepretor{ margin-top: 25px; } .classic-blog .loop-post-content .video-img{ width: 100%; max-width: 100%; transform: scale(1); } .classic-blog .post-pagination{ border-bottom: none !important; margin-top: 90px; overflow: hidden; position: relative; margin-left:0; margin-right:0; } .classic-blog .post-pagination .post-pagination-hover{ background:#717171 !important; } .classic-blog .loop-post-content a.continue-reading{ float: none; display: inline-block; width: 185px; font-size: 14px; font-weight: normal; line-height: 55px; margin-top: 30px; border: 2px solid; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; text-align: center; -webkit-transition: color .3s, background-color .3s; -moz-transition: color .3s, background-color .3s; -ms-transition: color .3s, background-color .3s; -o-transition: color .3s, background-color .3s; transition: color .3s, background-color .3s; } .classic-blog-center.classic-blog .loop-post-content a.continue-reading{ display: block; margin-right: auto; margin-left: auto; } .classic-blog-center.classic-blog .loop-post-content .sharing{ display: inline-block; } .classic-blog-center.classic-blog .classic-blog-content p{ margin: 0 auto; } .classic-blog-left .loop-post-content a.continue-reading{ margin-left:55px; } .classic-blog .loop-post-content .continue-reading-arrow{ margin-left: 0; position: relative; top: 3px; left: 5px; } .classic-blog .loop-post-content .post-media{ height:auto; position: relative; border-top-left-radius: 7px; border-top-right-radius: 7px; overflow: hidden; margin-bottom:0; } .classic-blog .loop-post-content:not(.video) .post-media:after, .classic-blog .loop-post-content.video .video-img:after{ content: ""; position: absolute; width:100%; height: 100%; opacity: 0; background-color: rgba(0,0,0,.6); top:0; left: 0; z-index: 4; -webkit-transition: opacity .3s; -moz-transition: opacity .3s; -ms-transition: opacity .3s; -o-transition: opacity .3s; transition: opacity .3s; border-top-left-radius: 7px; border-top-right-radius:7px; } .classic-blog .loop-post-content.video .video-img:after{z-index: -1;} .classic-blog .loop-post-content:not(.video) .post-media:hover:after, .classic-blog .loop-post-content.video .video-img:hover:after{opacity: 1;} .classic-blog .loop-post-content .post-media .post-author-meta{ position: absolute; z-index: 5; top: 15px; left: 15px; } .classic-blog .loop-post-content .post-media .post-author-meta .author-image{ display: inline-block; border-radius: 50%; width:50px; height: 50px; overflow: hidden; float: left; } .classic-blog .loop-post-content .post-media .post-author-meta .post-author{ text-transform: capitalize; color: #ffffff; width: auto; display: inline-block; margin-left: 10px; font-size: 13px; text-align: left; } .classic-blog .loop-post-content .post-media .post-author-meta .post-author a{ display: block; font-size: 15px; } .classic-blog .loop-post-content .post-media .post-image a img{ width:100%; } .classic-blog .loop-post-content.gallery .post-media, .classic-blog .loop-post-content.gallery .post-media li.images{ height:575px; } .classic-blog .loop-post-content.gallery .post-media .slides li, .classic-blog .loop-post-content .video-img{ border-top-left-radius: 7px; border-top-right-radius: 7px; } .classic-blog .loop-post-content blockquote { border-left: none; border-right: none; background-image: none; padding: 90px 15% 55px 15%; font-size: 135px; font-style: normal; } .classic-blog .loop-post-content blockquote .name { font-weight: normal; font-style: normal; margin-top: 40px; margin-left: auto; margin-right: auto; } .classic-blog .loop-post-content blockquote p:not(.name){ font-style: italic; font-size: 20px; margin-top: -20px; line-height: 30px; margin-right: auto; margin-left: auto; } .classic-blog .loop-post-content.quote{ padding: 0; } .classic-blog .loop-post-content .sharing{ margin: 0 auto; } .classic-blog-left .loop-post-content .sharing{ float:right; margin-right: 55px; } .classic-blog-left .post-date{ font-size: 18px; line-height: 1.3em; } /****************************************************************** Icon Shortcode *******************************************************************/ .md-icon.md-align-left{ text-align: left; } .md-icon.md-align-center{ text-align: center; } .md-icon.md-align-right{ text-align: right; } /********************* 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; 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; } } /*--------------------------------------------------------- Text in box Shortcode ---------------------------------------------------------*/ .text-in-box{ text-align: center; position: relative; padding-top: 70px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); transition: 0.3s; top:0; margin: 4px 10px 20px 10px; } .text-in-box:hover{ box-shadow: 0 20px 25px rgba(0, 0, 0, 0.15); -webkit-box-shadow: 0 20px 25px rgba(0, 0, 0, 0.15); top: -4px; } .text-in-box .icon-holder { margin: 0 auto 40px auto; position: relative; } .text-in-box .icon{ font-size: 55px; } .text-in-box .title { margin-bottom: 20px; } .text-in-box .description { padding-bottom: 65px; font-weight: normal; width: 75%; margin: 0 auto; float: none; } /****************************************************************** Fancy Text Shortcode *******************************************************************/ .md-fancy-text{ position: relative; display: inline-block; } .md-fancy-text-container.md-align-center{ text-align: center; } .md-fancy-text.md-align-center{ text-align: left; } .md-fancy-text.md-align-left{ float: left; } .md-fancy-text.md-align-right{ float: right; } .md-fancy-text .fancy-text-bg{ font-size:100px; position: absolute; left:100px; top:0; z-index: 0; line-height:50px; font-weight: bold; transform: translateX(-90%); } .md-fancy-text .fancy-text-bg.fancy-text-numeric{ font-weight: normal; } .md-fancy-text.fancy-text-type-icon .fancy-text-text{ top:34px; left:45px; } .md-fancy-text.fancy-text-type-icon .fancy-text-title{ top:29px; left:43px; } .md-fancy-text .fancy-text-title{ position: relative; z-index: 1; top: 15px; left:65px; padding-right:85px; } .md-fancy-text .fancy-text-text{ position:relative; left: 67px; top:20px; padding:0 85px 31px 0; font-size:14px; line-height: 1.9em; font-weight: normal; white-space:pre-wrap; } /**** Pixflow Slider ****/ .pixflow-slider.slick-slider{ margin: 0; /*-webkit-transition: all 600ms cubic-bezier(0.215, 0.61, 0.355, 1); transition: all 600ms cubic-bezier(0.215, 0.61, 0.355, 1);*/ } .pixflow-slider .pixflow-slide-bg{ position: absolute; width: inherit; height: inherit; z-index: -1; background-repeat: no-repeat; background-position: center center; background-size: cover; will-change: transform; } .pixflow-slider .pixflow-slide{ position: relative; width: 100%; /*height: 979px;*/ overflow: hidden; } .pixflow-slide-container .slide-subtitle{ display: inline-block; } .pixflow-slide-container .slide-desc{ font-size: 28px; line-height: 1em; } .pixflow-slider-dots-container .current-slide-no, .md-pixflow-slider.classic .pixflow-slider-dots-container { display: none; } .pixflow-slider-dots , .pixflow-slider .flickity-page-dots{ list-style: none; float: left; height: 60px; display: table; } .pixflow-slider .flickity-page-dots{ position: absolute; bottom: 0; left: 18%; text-align: left; display: inline-block; width:auto; } .pixflow-slider-dots .pixflow-slider-dot{ padding-right: 20px; vertical-align: middle; display: table-cell; } .pixflow-slider .flickity-page-dots .dot{ padding-right: 20px; vertical-align: middle; display: inline-block; width: 27px; height: 6px; cursor: pointer; border-radius: 10px; transition: all 0.3s; margin:0 5px; } .pixflow-slider-dots-container .current-slide-no.background--light{ color: black; } .pixflow-slider-dots.background--light .pixflow-slider-dot .circle-dot , .pixflow-slider .flickity-page-dots .dot.background--light{ background-color: rgba(0, 0, 0, 0.5); } .pixflow-slider-dots.background--light .pixflow-slider-dot.active .circle-dot, .pixflow-slider .flickity-page-dots .dot.background--light.is-selected{ background-color: black; } .pixflow-slider-dots-container .current-slide-no.background--dark{ color: white; } .pixflow-slider-dots.background--dark .pixflow-slider-dot.active .circle-dot, .pixflow-slider .flickity-page-dots .dot.background--dark.is-selected{ background-color: white; } .pixflow-slider-dots.background--dark .pixflow-slider-dot .circle-dot, .pixflow-slider .flickity-page-dots .dot.background--dark{ background-color: rgba(255, 255, 255, 0.5); } .pixflow-slider-dots-container .current-slide-no.background--complex{ color: grey; } .pixflow-slider-dots.background--complex .pixflow-slider-dot.active .circle-dot, .pixflow-slider .flickity-page-dots .dot.background--complex.is-selected{ background-color: grey; } .md-pixflow-slider .pixflow-slide .pixflow-slide-overlay{ position: absolute; z-index: 1; width: 100%; height: 100%; left: 0; top: 0; } /*Classic Skin*/ .md-pixflow-slider.classic .pixflow-slide-container{ position: absolute; top: 50%; max-width: 40%; z-index: 2; } .md-pixflow-slider.classic.hr-left .pixflow-slide-container > div{ position: relative; left:0; } .md-pixflow-slider.classic.hr-left .pixflow-slide-container{ left: 18%; transform: translateY(-50%); text-align: left; } .md-pixflow-slider.classic.hr-center .pixflow-slide-container{ left: 50%; transform: translate(-50%,-50%); text-align: center; } .md-pixflow-slider.classic .pixflow-slide-container .slide-content-image, .md-pixflow-slider.classic .pixflow-slide-container .slide-content-image img{ max-height: 210px; } .md-pixflow-slider.classic .pixflow-slide-container .slide-content-image{ margin-bottom: 15px; } .md-pixflow-slider.classic .pixflow-slider-dots-container{ position: absolute; bottom: 2%; left: 10%; } .md-pixflow-slider.classic .pixflow-slider-dots .pixflow-slider-dot .circle-dot{ width: 30px; height: 8px; cursor: pointer; border-radius: 7px; display: block; transition: all 0.3s; } .md-pixflow-slider.classic .pixflow-slide-container .slide-desc{ display: none; } .md-pixflow-slider.classic .pixflow-slide-container .slide-subtitle{ font-size: 20px; line-height: 20px; font-weight: normal; margin-bottom: 15px; } .md-pixflow-slider.classic .pixflow-slide-container .slide-title{ font-size: 70px; line-height: 1.1em; margin-bottom: 20px; } .md-pixflow-slider.classic .btn-container { height: 54px; } .md-pixflow-slider.classic .shortcode-btn { margin: 2px 5px 0 0; height: 54px; padding: 0; } .md-pixflow-slider.classic .shortcode-btn .button-standard.button{ backface-visibility: hidden; } .md-pixflow-slider.classic .shortcode-btn .button-standard.fade-oval{ padding: 17px 24px !important; margin: 0 !important; } /* Vertical Skin */ .md-pixflow-slider.vertical .pixflow-slide-container{ position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); max-width: 70%; text-align: center; } .md-pixflow-slider.vertical .pixflow-slider-dots-container{ position: absolute; left: 3%; top: 50%; transform: translateY(-50%); transform: rotate(90deg); } .md-pixflow-slider.vertical .pixflow-slider-dots-container .current-slide-no{ margin-right: 30px; font-size: 60px; line-height: 60px; font-weight: bold; float: left; display: block; } .md-pixflow-slider.vertical .pixflow-slider-dots .pixflow-slider-dot .circle-dot{ width: 10px; height: 10px; cursor: pointer; border-radius: 50%; display: block; transition: all 0.3s; } .md-pixflow-slider.vertical .pixflow-slider-dots .pixflow-slider-dot.active .circle-dot{ height: 24px; width: 5px; border-radius: 3px; } .md-pixflow-slider.vertical .pixflow-slide-container .slide-subtitle{ color: #FFF; padding: 10px 20px; font-size: 17px; line-height: 17px; font-weight: bold; margin-bottom: 20px; } .md-pixflow-slider.vertical .pixflow-slide-container .slide-title{ font-size: 100px; line-height: 1em; margin-bottom: 20px; } .md-pixflow-slider.indicator-dark .flickity-page-dots .dot{ background-color:#333; } .md-pixflow-slider.indicator-light .flickity-page-dots .dot{ background-color:#F4FDFF; } .md-pixflow-slider{ overflow-y: hidden; } /************************************** Pixflow Price Table **************************************/ .pixflow-price-table.md-align-center .price-table-container{float: none;} .pixflow-price-table.md-align-left .price-table-container{float: left;} .pixflow-price-table.md-align-right .price-table-container{float: right;} .pixflow-price-table .price-table-container{ border-radius: 15px; display: inline-block; text-align: center; width:98%; max-width: 365px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); transition: all 0.3s; margin-top:4px; padding: 50px 30px 30px 35px; } .pixflow-price-table .price-table-container:hover{ box-shadow: 0 20px 25px rgba(0, 0, 0, 0.15); -webkit-box-shadow: 0 20px 25px rgba(0, 0, 0, 0.15); margin-top: 0; } .pixflow-price-table .price-container .price{ font-size: 80px; } .pixflow-price-table .price-container .currency{ font-size: 30px; vertical-align: top; line-height: 60px; } .pixflow-price-table .title{ font-size: 15px; font-weight: bold; margin: 10px 30px 15px 30px; } .pixflow-price-table .separator{ margin-bottom: 5px; } .pixflow-price-table .separator span{ font-size: 35px; font-weight: bold; } .pixflow-price-table .description{ font-size: 16px; line-height: 2em; } .pixflow-price-table .price-table-button{ margin-top: 37px; } /************************************** Text Box **************************************/ .text-box{ width: 100.3%; min-height: 300px; position: relative; transition: background 0.3s; } .text-box .text-box-content{ position: absolute; width: 90%; top: 50%; left:50%; transform:translate(-50%,-50%); } .text-box .text-box-icon{ font-size: 50px; text-align: center; transition: color 0.3s; } .text-box .text-box-title{ font-size: 25px; font-weight: 500; line-height: 25px; text-align: center; margin-top: 28px; transition: color 0.3s; } .text-box .text-box-description{ font-size: 14px; font-weight: normal; line-height: 24px; text-align: center; position: absolute; top: 74%; left:50%; transform:translateZ(0) translate(-50%,-60%); width: 70%; opacity: 0; } /*********************************** Modern Subscribe ************************************/ .modern-subscribe{ overflow: hidden; border-radius: 5px; max-width: 1043px; margin: 0 auto; } .modern-subscribe.shadow{ -webkit-box-shadow: 0 0 92px rgba(0,0,0,.24); -moz-box-shadow: 0 0 92px rgba(0,0,0,.24); box-shadow: 0 0 92px rgba(0,0,0,.24); margin-top: 40px; margin-bottom: 40px; } .modern-subscribe .subscribe-content{ float: left; width: 50%; padding:73px 100px 0 90px; } .modern-subscribe .modern-subscribe-title{ font-size: 26px; font-weight: 600; line-height: 30px; width: 60%; } .modern-subscribe .modern-subscribe-desc{ font-size: 14px; font-weight: 500; line-height: 26px; margin-top: 30px; } .modern-subscribe .send{ margin-top: 45px; } .modern-subscribe .subscribe-image{ float: left; width: 50%; min-height: 485px; background-repeat: no-repeat; background-size: cover; background-position: center center; } .modern-subscribe .modern-subscribe-textbox{ border:none; background: transparent; outline: none; width: 100%; height: 35px; box-shadow: none; border-bottom: 1px solid; } .modern-subscribe .modern-subscribe-textbox.left{ margin-top: 25px; } .modern-subscribe .modern-subscribe-button{ background-color: transparent; border: none; width: 13px; height: 11px; outline: none; margin-left: -20px; margin-top:37px; transition: margin 0.2s; } .modern-subscribe .modern-subscribe-button:hover{ margin-left: -18px; } /*********************************** Slider Carousel ************************************/ .slider-carousel .gallery-cell{ background-size:cover; background-position: center; outline:none; transition: box-shadow 300ms; width: 100%; box-shadow: none; } @media screen and ( min-width: 768px ) { .slider-carousel .gallery-cell { width: 60%; } } .slider-carousel .flickity-page-dots{ bottom: 20px; } .slider-carousel .flickity-page-dots .dot{ border-radius: 5px; width: 6px; height: 6px; padding: 0; display: inline-block; margin: 0 5px; background: rgba(0,0,0,0.3); transition:width 200ms; } .slider-carousel .flickity-page-dots .dot.is-selected{ width: 10px; border-radius:5px; transition:width 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55); } /*********************************** Double Slider ************************************/ .double-slider{ position: relative; } .double-slider .flex-direction-nav{ display: none; } .double-slider .double-slider-text-container, .double-slider .double-slider-image-container{ width:50%; float: left; } .double-slider.double-slider-right .double-slider-text-container, .double-slider.double-slider-right .double-slider-image-container{ float: right; } .double-slider .double-slider-text-container{ transition: background 1s; position: relative; } .double-slider .double-slider-text-container .double-slider-slides{ /*transition-delay: 600ms*/ } .double-slider .flex-control-paging{ display: none; } .double-slider .double-slider-text-container li{ height: 100%; } .double-slider .double-slider-container{ text-align: center; position: relative; top: 50%; transform: translateY(-50%); width: 70%; float: right; margin-right: 15%; } .double-slider .double-slider-container p, .double-slider .double-slider-container h3, .double-slider .double-slider-container a{ color: inherit; } .double-slider .double-slider-container p.double-slider-sub-title{ font-weight:normal; font-size:14px; opacity:.5; margin-bottom:20px; transition: transform 200ms ease; } .double-slider .double-slider-container p.double-slider-description{ font-weight:normal; font-size:14px; opacity:.7; margin-top:20px; transition: transform 200ms 100ms ease; } .double-slider .double-slider-container h3.double-slider-title{ font-weight: bold; font-size: 51px; line-height: 1.2em; transition: transform 200ms 80ms ease; } .double-slider .double-slider-container .double-slider-nav{ margin-top:20px; } .double-slider .double-slider-image-container ul li div{ background-position: center; } .double-slider-nav{ opacity:.6; position: absolute; z-index: 1; width: 100%; top: 50%; transform: translateY(-50%); } .double-slider-nav a{ font-size:18px; position: absolute; } .double-slider .double-slider-prev{ left: 50px; } .double-slider .double-slider-next{ right: 50px; } .double-slider .double-slider-text-container li{ opacity:0; transition:opacity 300ms ; } .double-slider .double-slider-text-container li.flex-active-slide{ opacity:1; } .double-slider .double-slider-text-container li.clone{ opacity:1; } /************************************** Quote **************************************/ /* message part */ .sc-quote { margin: auto; } .sc-quote .message { background: #f3f3f3; padding: 4em 6%; position: relative; margin-bottom: 35px; } .sc-quote .message:after { content: ""; width: 0; height: 0; /* border-left: 15px solid transparent; */ border-right: 25px solid transparent; border-top: 20px solid #f3f3f3; position: absolute; bottom: -19px; left: 40px; z-index: 2; } .sc-quote .message p { font-size: 15px; line-height: 24px; text-align: center; } .sc-quote .message i { font-size: 30px; position: absolute; right: 35px; bottom: 30px; } /* main part */ .sc-quote .main { display: inline-block; float: left; } .sc-quote .main img.quote-image { width: 81px; height: 81px; border-radius: 50%; float: left; } .sc-quote .main .titles { display: inline-block; float: left; padding: 1.5em; } .sc-quote .main .titles h3 { font-size: 16px; font-weight: bold; line-height: 16px; } .sc-quote .main .titles h4 { font-size: 14px; font-weight: bold; line-height: 14px; } /************************************** Feature Image **************************************/ .sc-feature_image .main { padding: 30px; border-right: 1px solid #d6d6d6; border-left: 1px solid #d6d6d6; border-bottom: 1px solid #d6d6d6; } .sc-feature_image .image-container { width: 100%; overflow: hidden; } .sc-feature_image .feature_image-image { -webkit-transform: scale(1); transform: scale(1); -webkit-transition: .5s ease-in-out; transition: .5s ease-in-out; } .sc-feature_image:hover .feature_image-image { -webkit-transform: scale(1.2); transform: scale(1.2); } .sc-feature_image .main i { float: left; font-size: 30px; margin: 0px 25px 10px 0; } .sc-feature_image .main h3 { font-size: 18px; font-weight: bold; line-height: 18px; margin-bottom: 20px; } .sc-feature_image .main p { font-size: 15px; line-height: 23px; } .sc-feature_image .main, .sc-feature_image .main h3, .sc-feature_image .main p, .sc-feature_image .main i { transition: background-color .3s, color .3s; } .row-equal-column-height .mBuilder-md_feature_image, .row-equal-column-height .sc-feature_image{ height: 100%; } /* Image */ .sc-feature_image .feature_image-image { background-size: cover; background-position: center; } /************************************** Price Box **************************************/ .pixflow-price-box { width: 100%; display: flex; } .price-box-align-wraper { width: 570px; } .pixflow-price-box.md-align-center { justify-content: center; } .pixflow-price-box.md-align-right { justify-content: flex-end; } .pixflow-price-box .price-box-container { border: 1px solid; padding: 50px; position: relative; display: flex; align-items: flex-end; text-align: left; transition: box-shadow .3s; overflow: hidden; min-height: 260px; } .pixflow-price-box .price-box-container:hover { box-shadow: inset 0 0 0 4px #2098d1, 0 0 1px rgba(0, 0, 0, 0); } .pixflow-price-box.few-items .lists{ position: absolute; } /* price container */ .pixflow-price-box .price-container { display: inline-block; margin-right: 7%; text-align: left; } .pixflow-price-box .price-container .text-part{ position: absolute; top: 50px; } .pixflow-price-box .price-container .title { font-size: 18px; font-weight: bold; margin-bottom: 0; line-height: 22px; } .pixflow-price-box .price-container .currency, .pixflow-price-box .price-container .price { font-size: 30px; font-weight: bold; } .pixflow-price-box .price-container .sub-title { font-size: 14px; margin-bottom: 39px; line-height: 18px; } /* Lists */ .pixflow-price-box .lists { list-style: none; display: inline-block; } .pixflow-price-box .lists ul > li { list-style: none; position: relative; max-width: 195px; overflow: hidden; white-space: nowrap; margin-top: 18px; } .pixflow-price-box .lists ul li:first-child { margin-top: 0; } .pixflow-price-box .lists ul li span { padding-right: 10px; font-size: 14px; white-space: normal; } /* offer */ .pixflow-price-box .offer-box { position: absolute; right: -62px; top: 16px; padding: 10px; text-align: center; transform: rotate(45deg); width: 200px; height: 40px; white-space: nowrap; z-index: -1; } /* in columns */ .col-sm-3 .pixflow-price-box .price-container, .col-sm-4 .pixflow-price-box .price-container { margin-bottom: 9%; } /********************************* Article Box *********************************/ .article-box{ width: 100.3%; position: relative; overflow: hidden; } .article-box .article-box-img{ position: absolute; width: 100%; height: 100%; z-index: 1; top:0; left:0; background-position: center center; background-size: cover; } .article-box .article-box-content{ transition: margin-top 0.2s; } .article-box .article-overlay{ position: absolute; width: 100%; height: 100%; z-index: 2; left:0; opacity: 0.9; transition: opacity 0.3s,top 0.4s; padding: 0 40px 0 40px; } .article-box .title-icon{ margin-top: 16px; } .article-box .article-box-icon{ font-size: 27px; display: inline-block; margin-right: 10px; } .article-box .article-box-icon:before{ vertical-align: middle; } .article-box .article-box-title{ font-size: 18px; font-weight: bold; line-height: 40px; display: inline-block; } .article-box .article-box-description{ font-size: 14px; font-weight: normal; line-height: 24px; } .article-box .read-more{ font-size: 13px; line-height: 19px; font-weight: normal; } .article-box .read-more-icon{ margin-left:7px; font-size: 13px; } /*************************** Counter Card ***************************/ .md-counter-card{ width: 97%; height: 97%; min-height: 195px; position: relative; display: table; text-align: center; transition: 0.3s; top:0; } .md-counter-card:hover{ box-shadow: 0 20px 25px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 20px 25px rgba(0, 0, 0, 0.1); top: -4px; } .md-counter-card .counter{ display: table-cell; vertical-align: middle; } .md-counter-card .counter .timer{ margin: auto; margin-top: 5px; font-size: 45px; } .md-counter-card .counter-icon{ margin-top: 7px; } .md-counter-card .counter-icon i{ font-size: 40px; } .md-counter-card .counter-text h2{ font-size: 15px; font-weight: normal; margin-top: 5px; opacity: 0.7; } /*************************** Statistic ****************************/ .md-statistic { width: 100%; height: 100%; position: relative; display: flex; text-align: center; transition: 0.3s; top:0; } .md-statistic .counter{ width:100%; } .md-statistic .counter .timer, .md-statistic .statistic-symbol{ font-size: 80px; line-height: 80px; font-weight: normal; display: inline-block; width: auto; } .md-statistic .statistic-text h2{ font-size: 14px; font-weight: bold; line-height: 24px; opacity: 0.7; } /************************* Split Box *************************/ .splitBox-holder{ position: relative; overflow: hidden; height: 100%; } .splitBox-holder .image-holder{ height: 100%; width: 50%; top: 0; position: absolute; background-size: cover; background-position: center center; transform: scale(1.1); z-index: 1; transition:transform .3s; } .splitBox-holder:hover .image-holder { transform: scale(1); } .splitBox-holder .text-holder{ height: 100%; width: 50%; top: 0; position: relative; z-index: 2; } .splitBox-holder .text-holder .subtitle{ font-weight: bold; font-size: 15px; line-height: 19px; width: 100%; } .splitBox-holder .text-holder .title{ width: 100%; } .splitBox-holder .text-holder p{ font-weight: normal; font-size: 15px; line-height: 24px; margin-top: 15px; width: 100% } .splitBox-holder .splitBox-button{ margin-top: 25px; } .splitBox-holder .arrow-right { width: 0; height: 0; border-top: 15px solid transparent; border-bottom: 15px solid transparent; border-left: 15px solid; position: absolute; top: calc(50% - 15px); z-index: 2; margin-left: 0; } .md-splitBox.sb-left .text-holder .fixed-width { margin-left: 0; transition: margin-left .3s; } .md-splitBox.sb-left .splitBox-holder:hover .fixed-width { margin-left: 50px; } .md-splitBox.sb-right .text-holder .fixed-width { margin-right: 0; transition: margin-right .3s; } .md-splitBox.sb-right .splitBox-holder:hover .fixed-width { margin-right: 50px; } .md-splitBox.sb-left .image-holder{ left: 50%; } .md-splitBox.sb-right .image-holder{ left: 0; } .md-splitBox.sb-left .splitBox-holder .text-holder { left: 0; padding: 0 95px 0 70px; transition: width 0.3s; display: flex; align-items: center; } .md-splitBox.sb-right .splitBox-holder .fixed-width{ display: inline-block; } .md-splitBox.sb-right .splitBox-holder .text-holder{ left: 50%; text-align: left; padding: 0 95px 0 70px; float: left; margin-left: 0; transition: width 0.3s,margin-left 0.3s; display: flex; align-items: center; } .md-splitBox.sb-right .splitBox-holder:hover .text-holder{ margin-left: -50px; } .md-splitBox.sb-right .splitBox-holder .arrow-right{ transform: rotateY(180deg); left: 50%; margin-left: -15px; transition: left 0.3s,margin-left 0.3s; } .md-splitBox.sb-left .splitBox-holder .arrow-right{ left: 50%; transition: left 0.3s; } /*-------------------------------------- Subscribe Business --------------------------------------*/ .business-subscribe.md-align-left .subscribe-content { text-align: left; } .business-subscribe.md-align-center .subscribe-content{ text-align: center; } .business-subscribe.md-align-right .subscribe-content{ text-align: right; } .business-subscribe .mc4wp-form{ display: none; } .business-subscribe-email-input{ height: 65px; max-width: 385px; padding-right: 25px; padding-left: 25px; outline: none; text-align: left; border-radius: 3px 0 0 3px; background: transparent; text-transform:none ; } .business-subscribe-button{ height: 65px; width: 170px; border-radius: 0 3px 3px 0; border: none; margin-left: -7px; color:#fff; font-size: 17px; font-weight: bold; line-height: 22px; position: relative; } .business-subscribe-button i{ margin-left: 5px; vertical-align: middle; } /*************************** Icon Box New ****************************/ .iconbox-new.md-align-center{ text-align: center;} .iconbox-new.md-align-left{text-align: left;} .iconbox-new.md-align-right{text-align: right;} .iconbox-new .icon-holder { position: relative; height: 100px; width: 100px; margin: 0 auto; } .iconbox-new .iconbox-new-content { display: inline-block; max-width: 700px; } .iconbox-new .iconbox-new-content.box-hover { transition: background-color .3s; } .iconbox-new .icon-holder .icon, .iconbox-new .svg-circle { 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%); } .iconbox-new .icon-holder .icon { font-size: 55px; z-index: 1; -webkit-backface-visibility: hidden; } .iconbox-new .svg-circle { width: 100px; height: 100px; padding: 1px; display: block; opacity: 0.3; z-index: 0; border-radius: 50%; } .iconbox-new .svg-circle circle { stroke-dashoffset: 360px; stroke-dasharray: 360px, 360px; } .iconbox-new .title { transition: letter-spacing 0.2s cubic-bezier(0.44, 0.54, 0, 1.75); /* line-height: 50px; margin-bottom: 0;*/ } .iconbox-new .description { font-weight: normal; width: 75%; line-height: 22px; padding: 10px 0 25px 0; } /* read more */ .iconbox-new .read-more { position: relative; margin-bottom: 50px; display: inline-block; overflow: hidden; } .iconbox-new .read-more i { font-size: 21px; vertical-align: middle; transition: margin .3s ease; } .iconbox-new .read-more i:first-child{ margin-left: -20px; margin-right: 10px; } .iconbox-new .read-more:hover i:first-child{ margin-left: 5px; } .iconbox-new .read-more i:last-child{ margin-right: 0; margin-left: 2px; } .iconbox-new .read-more:hover i:last-child{ margin-right: -25px; } /*************************** Process Panel ****************************/ .process-panel-main { display: block; width: 100%; } .process-panel-main-container { float: left; padding: 0; height: 163px; overflow: hidden; position: relative; display: block; line-height: 163px; } .process-panel-main-container:not(:first-child):after { content: ""; width: 0px; height: 0px; border-left: 60px solid rgb(0, 0, 0); border-top: 100px solid rgba(243, 243, 243, 0); border-bottom: 100px solid rgba(243, 243, 243, 0); position: absolute; bottom: 0; top: 0; margin: auto; left: 0; } .process-panel-main-container.fix-border:not(:first-child):after { border-top-width: 80px; } .process-panel-main-container h3.title { font-size: 25px; font-weight: bold; line-height: 25px; } .process-panel-main-container .sub-title { font-size: 15px; line-height: 15px; } .process-panel-main-container .process-panel-icon { font-size: 43px; /*margin-top: 4px;*/ margin-top: 0; position: absolute; margin-left: 0.5em; } .process-panel-main-container:not(:first-child) .process-panel-icon { margin-left: 2em; } .process-panel-main-container .process-panel-txt { display: inline-block; margin-left: 7em; vertical-align: middle; } .process-panel-main-container:not(:first-child) .process-panel-txt { margin-left: 12em; } .process-panel-main-container .process-panel-txt .sub-title{ margin: 0; } .process-panel-main .process-panel-main-container .kesho{ width: 0; height: 100%; position: absolute; left: 0; transition: all .5s cubic-bezier(0.68, -0.55, 0.265, 1.55); } .process-panel-main-container:hover +.process-panel-main-container .kesho{ width:20px; } .process-panel-main-container:after{ transition: all .5s cubic-bezier(0.68, -0.55, 0.265, 1.55); } .process-panel-main-container:hover + .process-panel-main-container:after{ left:20px; } /*************************** Info Box ****************************/ .sc-info-box { border: 3px solid gray; padding: 45px 50px 45px 35px; text-align: left; transition: box-shadow .3s,border-color .3s; position: relative; } .sc-info-box .title { font-size: 25px; max-width: 220px; line-height: 35px; font-weight: bold; } .sc-info-box .separator { width: 40px; height: 3px; display: inline-block; margin: 5px 0 10px 0; } .sc-info-box .description { font-size: 14px; margin-bottom: 35px; line-height: 24px; margin-top: 9px; } .sc-info-box i { position: absolute; right: 0; top: 0; font-size: 10em; } /*************************** Count Down ****************************/ .count-down { text-align: center; } .count-down #date-time .content { margin: 50px 2em 50px 2em; text-align: center; font-size: 18px; position: relative; display: inline-block; width: 74px; } .count-down #date-time .content span { display: block; font-size: 60px; margin-bottom: 17px; line-height: 60px; } .count-down #date-time .content hr { height: 2px; width: 34px; border: none; } /**************************************** 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%; } /* ------------------------------------------------- Item Order Styles ----------------------------------------------------*/ /* Move to livepreview.css */ .sidebar.widget-area.visible-desktop.hidden-tablet.light-sidebar.left-align.border.left.right-sidebar{ height: auto !important; } /* start css 13-02-2017 */ @media (min-width:1150px) { nav.navigation.hidden-tablet.hidden-phone.item-left { width:auto !important;} } header.top-classic .icons-pack.item-right { float:right;} /* end css 13-02-2017 */ header.top-modern.header-style3.top.header-light.logo-dark { position: fixed; background-color: #fff;} ul#menu-menu li a:hover span span.title { color: #000 !important;} header.top-classic.header-style1.top.header-light.logo-dark { position: fixed; width: 100% !important; } ul#menu-menu li a:hover { background: rgba(0, 0, 0, 0.75); padding:10px; color: #fff !important; } ul#menu-menu li a:hover span span.title { color: #fff !important; } ul#menu-menu li.current-menu-item a { background: rgba(0, 0, 0, 0.75); padding:10px; color: #fff !important; } ul#menu-menu li.current-menu-item a span span.title { color: #fff !important; } header.top-classic nav > ul > li a { padding: 10px !important; } .second-part.hidden-tablet.hidden-tablet { width: 78% !important; } .second-part nav.navigation.hidden-tablet.hidden-phone { width: 45% !important; } ul#menu-menu li a span { color: #000 !important;} ul#menu-menu li { border-right: 1px solid rgba(54,54,54,0.3) !important;} header.top-modern.header-style3.top.header-light.logo-dark { box-shadow: 10px 10px 5px -10px rgba(0,0,0,0.75); -webkit-box-shadow: 10px 10px 5px -10px rgba(0,0,0,0.75); -moz-box-shadow: 10px 10px 5px -10px rgba(0,0,0,0.75);} .linear.content .logo { display: none !important;} .linear.content { display: none !important;} div#footer-bottom { display: none !important;}