/* ------------------------------------------------------------- Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets List of CSS3 Sass Mixins File to be @imported and @included as you need The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER ENDING css files note: All CSS3 Properties are being supported by Safari 5 more info: http://www.findmebyip.com/litmus/#css3-properties Mixins available: - css3-prefix - arguments: Property, Value - background-gradient - arguments: Start Color: #3C3C3C, End Color: #999999 - background-horizontal - arguments: Start Color: #3C3C3C, End Color: #999999 - background-radial - arguments: Start Color: #FFFFFF, Start position: 0%, End Color: #000000, End position: 100% - background-size - arguments: Width: 100%, Height: 100% - background-opacity - arguments: Color: #000, Opacity: .85 - border-radius - arguments: Radius: 5px - border-radius-separate - arguments: Top Left: 5px, Top Right: 5px, Bottom Left: 5px, Bottom Right: 5px - box - arguments: Orientation: horizontal, Pack: center, Align: center - box-rgba - arguments: R: 60, G: 3, B: 12, Opacity: 0.23, Color: #3C3C3C - box-shadow - arguments: X: 2px, Y: 2px, Blur: 5px, Color: rgba(0,0,0,.4) - box-sizing - arguments: Type: border-box - columns - arguments: Count: 3, Gap: 10 - double-borders - arguments: Color One: #3C3C3C, Color Two: #999999, Radius: 0 - flex - arguments: Value: 1 - flip - arguments: ScaleX: -1 - font-face - arguments: Font Family: myFont, Eot File Src: myFont.eot, Woff File Src: myFont.woff, Ttf File Src: myFont.ttf - opacity - arguments: Opacity: 0.5 - outline radius - arguments: Radius: 5px - resize - arguments: Direction: both - rotate - arguments: Degree: 0, M11: 0, M12: 0, M21: 0, M22: 0 CSS Matrix Rotation Calculator http://www.boogdesign.com/examples/transforms/matrix-calculator.html - text-shadow - arguments: X: 2px, Y: 2px, Blur: 5px, Color: rgba(0,0,0,.4) - transform - arguments: Parameters: null - transform-style - arguments: Style: preserve-3d - transition - Default arguments: What: all, Length: 1s, Easing: ease-in-out - - Examples: @include transition (all 2s ease-in-out); - @include transition (opacity 1s ease-in 2s, width 2s ease-out); - triple-borders - arguments: Color One: #3C3C3C, Color Two: #999999, Color Three: #000000, Radius: 0 - keyframes - arguments: Animation name - content: Animation css - animation - arguments: name duration timing-function delay iteration-count direction fill-mode play-state (http://www.w3schools.com/cssref/css3_pr_animation.asp) ------------------------------------------------------------- */ /* ADDS A BROWSER PREFIX TO THE PROPERTY */ /* OPACITY */ /* ========================================================================== Style Button ========================================================================== */ /* ANIMATION */ /* ANIMATION */ /* ANIMATION */ /* ANIMATION */ /* ANIMATION */ /* ANIMATION */ /*------------------------------------------------------------------ [Table of contents] 1. Blog Classic 2. Post Classic 3. Navigation 4. FAQ -------------------------------------------------------------------*/ /* ========================================================================== [Start] Blog Classic ========================================================================== */ /* Padding equal container */ /* ========================================================================== All Style Header ========================================================================== */ /* ========================================================================== Start Style Footer ========================================================================== */ /* ========================================================================== [Start] All Style Form ========================================================================== */ /*------------------------------------------------------------------ [Table of contents] 1. Reset HTML/CSS, Unitest, Body 2. Page Title 3. Primary -------------------------------------------------------------------*/ /* ========================================================================== [Start] 1. Reset HTML/CSS, Unitest, Body, @Extend ========================================================================== */ /*------------------------------------------------------------------ [All Style Shortcode] 1. Shortcode Fancy Box 2. Shortcode Pie Chart 3. Shortcode Team 4. Shortcode Testimonial 5. Tab 6. Counter 7. Accordion 8. Progress 9. Pricing 10. Blog 11. Images Carousel 12. Gallery default style 13. Gallery full width style 14. Team Style 15. Shortcode Blog Grid -------------------------------------------------------------------*/ /* ========================================================================== [Start] 1. Shortcode Fancy Box ========================================================================== */ /* Images */ /* Style Loadding */ /* ========================================================================== Style 1 ========================================================================== */ /* ========================================================================== Style Main Menu ========================================================================== */ /*------------------------------------------------------------------ [All Style Sidebar Widget] -------------------------------------------------------------------*/ /*------------------------------------------------------------------ [All Style Sidebar Widget] 1. Widget Search 2. Widget Category 3. Widget Tags -------------------------------------------------------------------*/ /* ========================================================================== [Start] 1. Widget Search ========================================================================== */ /*! * bootstrap-vertical-tabs - v1.2.1 * https://dbtek.github.io/bootstrap-vertical-tabs * 2014-11-07 * Copyright (c) 2014 İsmail Demirbilek * License: MIT */ /* Header Sticky */ /* Footer Scroll Top */ /* Start Form Comment */ .zo_extra_font1, .post-teaser .btn-readmore, .post-navigation .post-prev-title, .single-pro-car-dealer .zo-car-dealer-header .zo-blog-title, .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-title, #comments #commentform p.form-submit input, .zo-tabs-about-us-style .vc_tta-tabs-container ul.vc_tta-tabs-list li.vc_tta-tab a span, .zo-contact-form h1, .zo-grid-gallery .zo-grid-filter ul.zo-filter-category li a, .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title, .template-zo_carousel--new-car .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title, .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title, .template-zo_grid--car-dealer-gallery-fullwidth .zo-carousel-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title, .template-zo_carousel--new-car .zo-carousel-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title, .template-zo_grid--car-dealer-new-car .zo-carousel-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title, .template-zo_grid--car-dealer-gallery .zo-portfolio-item .zo-portfolio-inner .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title, .template-zo_grid--car-dealer-about-us .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title, .zo-team-default .zo-grid-item .zo-team-inner .zo-team-overlay .zo-team-overlay-inner .zo-team-title, .zo-carousel.template-zo_carousel--testimonial .owl-stage-outer .owl-stage .owl-item .zo-carousel-item .zo-carousel-title span, .template-zo_fancybox_single--services .zo-fancyboxes-body .zo-fancybox-item .fancybox-title { font-family: Montserrat; } @font-face { font-family: "RageItalic"; src: url('../fonts/RageItalic.eot') format('eot'), url('../fonts/RageItalic.woff') format('woff'), url('../fonts/RageItalic.ttf') format('truetype'); } .zo-text-signature .zo-name, .zo-text-signature .zo-shadow { font-family: 'RageItalic'; } body.admin-bar #zo-header.zo-header-1 { margin-top: calc(0 + 32px); } #zo-header-logo a { line-height: 115px; } #zo-header.header-fixed { height: 115px; } body.fixed-margin-top { margin-top: 115px; } #zo-header.zo-main-header.header-fixed { background-color: #fff; } #zo-header.header-fixed #zo-header-logo a, #zo-header.header-fixed #zo-header-navigation .main-navigation .menu-main-menu > li { line-height: 115px; } @media (min-width: 992px) { #zo-header #zo-header-navigation { text-align: right; } #zo-header-navigation .main-navigation .menu-main-menu > li > a, #zo-header-navigation .main-navigation .menu-main-menu > ul > li > a, .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon { color: #696969; } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children > .zo-menu-toggle { color: #696969; display: none; } #zo-header-navigation .main-navigation .menu-main-menu > li, #zo-header-navigation .main-navigation .menu-main-menu > ul > li { line-height: 115px; } #zo-header-navigation .main-navigation .menu-main-menu > li > a:hover, #zo-header-navigation .main-navigation .menu-main-menu > ul > li > a:hover, .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon:hover { color: #3d72a4; } #zo-header-navigation .main-navigation .menu-main-menu > li.current-menu-item > a, #zo-header-navigation .main-navigation .menu-main-menu > li.current-menu-ancestor > a, #zo-header-navigation .main-navigation .menu-main-menu > li.current_page_item > a, #zo-header-navigation .main-navigation .menu-main-menu > li.current_page_ancestor > a, #zo-header-navigation .main-navigation .menu-main-menu > ul > li.current-menu-item > a, #zo-header-navigation .main-navigation .menu-main-menu > ul > li.current-menu-ancestor > a, #zo-header-navigation .main-navigation .menu-main-menu > ul > li.current_page_item > a, #zo-header-navigation .main-navigation .menu-main-menu > ul > li.current_page_ancestor > a, .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon:active { color: #3d72a4; } } #zo-header.zo-main-header.header-fixed #zo-header-navigation .main-navigation .menu-main-menu > li > a { color: #696969; } #zo-header.zo-main-header.header-fixed #zo-header-navigation .main-navigation .menu-main-menu > li > a:hover { color: #3d72a4; } #zo-header.zo-main-header.header-fixed #zo-header-navigation .main-navigation .menu-main-menu > li.current-menu-item > a, #zo-header.zo-main-header.header-fixed #zo-header-navigation .main-navigation .menu-main-menu > li.current-menu-ancestor > a, #zo-header.zo-main-header.header-fixed #zo-header-navigation .main-navigation .menu-main-menu > li.current_page_item > a, #zo-header.zo-main-header.header-fixed #zo-header-navigation .main-navigation .menu-main-menu > li.current_page_ancestor > a { color: #3d72a4; } #zo-header-navigation .main-navigation .menu-main-menu > li ul li > a, #zo-header-navigation .main-navigation .menu-main-menu > ul > li ul li .zo-menu-toggle { color: #696969; } #zo-header-navigation .main-navigation .menu-main-menu > li ul li:hover > a, #zo-header-navigation .main-navigation .menu-main-menu > li ul li:hover .zo-menu-toggle, #zo-header-navigation .main-navigation .menu-main-menu > li ul a:focus, #zo-header-navigation .main-navigation .menu-main-menu > li ul li.current-menu-item > a, #zo-header-navigation .main-navigation .menu-main-menu > ul > li ul li:hover a, #zo-header-navigation .main-navigation .menu-main-menu > ul > li ul a:focus, #zo-header-navigation .main-navigation .menu-main-menu > ul > li ul li.current-menu-item > a, #zo-header-navigation .main-navigation .menu-main-menu > li ul li.current-menu-parent > a, #zo-header-navigation .main-navigation .menu-main-menu > li ul li.current-menu-parent > .zo-menu-toggle, #zo-header-navigation .main-navigation .menu-main-menu > li ul li.current-menu-ancestor > a, #zo-header-navigation .main-navigation .menu-main-menu > li ul li.current-menu-ancestor > .zo-menu-toggle { color: #3d72a4; } #zo-page-element-wrap .page-title-breadcrumb-wrap { text-align: right; } #zo-footer-top .wg-title:before { background-color: #fff; } .btn, button, .button, input[type="submit"] { line-height: 1; display: inline-block; outline: medium none; text-decoration: none; color: #969696; font-weight: bold; font-size: 13px; border: 1px solid transparent; padding: 15px 35px; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ -webkit-transition: all 300ms linear 0ms; -khtml-transition: all 300ms linear 0ms; -moz-transition: all 300ms linear 0ms; -ms-transition: all 300ms linear 0ms; -o-transition: all 300ms linear 0ms; transition: all 300ms linear 0ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ text-transform: uppercase; } .btn:hover, button:hover, .button:hover, input[type="submit"]:hover, .btn:focus, button:focus, .button:focus, input[type="submit"]:focus { outline: medium none; text-decoration: none; } .btn.btn-default { -webkit-transition: all 300ms linear 0ms; -khtml-transition: all 300ms linear 0ms; -moz-transition: all 300ms linear 0ms; -ms-transition: all 300ms linear 0ms; -o-transition: all 300ms linear 0ms; transition: all 300ms linear 0ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ border-color: #3d72a4; } .btn.btn-default:hover { background: #3d72a4; color: #fff; } .btn.btn-primary, .vc_general.btn.btn-primary { color: #fff; background: #3d72a4; } .btn.btn-primary:hover, .vc_general.btn.btn-primary:hover { background: #fff; color: #3d72a4; border-color: #3d72a4; } .btn.vc_general { font-weight: 700; /* ========================================================================== End Style Button ========================================================================== */ } .btn.vc_general:hover { background: #3d72a4; color: #fff; } @-webkit-keyframes toLeftFromRight { 49% { -webkit-transform: translate(-100%); -khtml-transform: translate(-100%); -moz-transform: translate(-100%); -ms-transform: translate(-100%); -o-transform: translate(-100%); transform: translate(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translate(100%); -khtml-transform: translate(100%); -moz-transform: translate(100%); -ms-transform: translate(100%); -o-transform: translate(100%); transform: translate(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-moz-keyframes toLeftFromRight { 49% { -webkit-transform: translate(-100%); -khtml-transform: translate(-100%); -moz-transform: translate(-100%); -ms-transform: translate(-100%); -o-transform: translate(-100%); transform: translate(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translate(100%); -khtml-transform: translate(100%); -moz-transform: translate(100%); -ms-transform: translate(100%); -o-transform: translate(100%); transform: translate(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-ms-keyframes toLeftFromRight { 49% { -webkit-transform: translate(-100%); -khtml-transform: translate(-100%); -moz-transform: translate(-100%); -ms-transform: translate(-100%); -o-transform: translate(-100%); transform: translate(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translate(100%); -khtml-transform: translate(100%); -moz-transform: translate(100%); -ms-transform: translate(100%); -o-transform: translate(100%); transform: translate(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-o-keyframes toLeftFromRight { 49% { -webkit-transform: translate(-100%); -khtml-transform: translate(-100%); -moz-transform: translate(-100%); -ms-transform: translate(-100%); -o-transform: translate(-100%); transform: translate(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translate(100%); -khtml-transform: translate(100%); -moz-transform: translate(100%); -ms-transform: translate(100%); -o-transform: translate(100%); transform: translate(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @keyframes toLeftFromRight { 49% { -webkit-transform: translate(-100%); -khtml-transform: translate(-100%); -moz-transform: translate(-100%); -ms-transform: translate(-100%); -o-transform: translate(-100%); transform: translate(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translate(100%); -khtml-transform: translate(100%); -moz-transform: translate(100%); -ms-transform: translate(100%); -o-transform: translate(100%); transform: translate(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-webkit-keyframes toRightFromLeft { 49% { -webkit-transform: translate(100%); -khtml-transform: translate(100%); -moz-transform: translate(100%); -ms-transform: translate(100%); -o-transform: translate(100%); transform: translate(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translate(-100%); -khtml-transform: translate(-100%); -moz-transform: translate(-100%); -ms-transform: translate(-100%); -o-transform: translate(-100%); transform: translate(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-moz-keyframes toRightFromLeft { 49% { -webkit-transform: translate(100%); -khtml-transform: translate(100%); -moz-transform: translate(100%); -ms-transform: translate(100%); -o-transform: translate(100%); transform: translate(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translate(-100%); -khtml-transform: translate(-100%); -moz-transform: translate(-100%); -ms-transform: translate(-100%); -o-transform: translate(-100%); transform: translate(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-ms-keyframes toRightFromLeft { 49% { -webkit-transform: translate(100%); -khtml-transform: translate(100%); -moz-transform: translate(100%); -ms-transform: translate(100%); -o-transform: translate(100%); transform: translate(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translate(-100%); -khtml-transform: translate(-100%); -moz-transform: translate(-100%); -ms-transform: translate(-100%); -o-transform: translate(-100%); transform: translate(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-o-keyframes toRightFromLeft { 49% { -webkit-transform: translate(100%); -khtml-transform: translate(100%); -moz-transform: translate(100%); -ms-transform: translate(100%); -o-transform: translate(100%); transform: translate(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translate(-100%); -khtml-transform: translate(-100%); -moz-transform: translate(-100%); -ms-transform: translate(-100%); -o-transform: translate(-100%); transform: translate(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @keyframes toRightFromLeft { 49% { -webkit-transform: translate(100%); -khtml-transform: translate(100%); -moz-transform: translate(100%); -ms-transform: translate(100%); -o-transform: translate(100%); transform: translate(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translate(-100%); -khtml-transform: translate(-100%); -moz-transform: translate(-100%); -ms-transform: translate(-100%); -o-transform: translate(-100%); transform: translate(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-webkit-keyframes toTopFromBottom { 49% { -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translateY(100%); -khtml-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-moz-keyframes toTopFromBottom { 49% { -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translateY(100%); -khtml-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-ms-keyframes toTopFromBottom { 49% { -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translateY(100%); -khtml-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-o-keyframes toTopFromBottom { 49% { -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translateY(100%); -khtml-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @keyframes toTopFromBottom { 49% { -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translateY(100%); -khtml-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-webkit-keyframes toBottomFromTop { 49% { -webkit-transform: translateY(100%); -khtml-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-moz-keyframes toBottomFromTop { 49% { -webkit-transform: translateY(100%); -khtml-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-ms-keyframes toBottomFromTop { 49% { -webkit-transform: translateY(100%); -khtml-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-o-keyframes toBottomFromTop { 49% { -webkit-transform: translateY(100%); -khtml-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @keyframes toBottomFromTop { 49% { -webkit-transform: translateY(100%); -khtml-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 50% { opacity: 0; -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 51% { opacity: 1; } } @-webkit-keyframes toTopFromBottom2 { 0% { -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 100% { -webkit-transform: translateY(0); -khtml-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } } @-moz-keyframes toTopFromBottom2 { 0% { -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 100% { -webkit-transform: translateY(0); -khtml-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } } @-ms-keyframes toTopFromBottom2 { 0% { -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 100% { -webkit-transform: translateY(0); -khtml-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } } @-o-keyframes toTopFromBottom2 { 0% { -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 100% { -webkit-transform: translateY(0); -khtml-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } } @keyframes toTopFromBottom2 { 0% { -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } 100% { -webkit-transform: translateY(0); -khtml-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } } @-webkit-keyframes zoFadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes zoFadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-ms-keyframes zoFadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes zoFadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes zoFadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } .dropcap { line-height: 24px; } .dropcap:first-letter { margin-top: 10px; padding: 0 20px; color: #141414; float: left; font-size: 36px; font-weight: bold; } .dropcap-bg { line-height: 24px; margin-top: 10px; } .dropcap-bg:first-letter { background: #141414 none repeat scroll 0 0; color: #fff; float: left; font-size: 36px; font-weight: bold; margin-right: 14px; margin-top: -3px; padding: 10px 15px; } .entry-blog { position: relative; margin: 0 0 50px; /** * ----> Single Post */ } .entry-blog .entry-title { font-size: 24px; line-height: 38px; margin: 0; padding: 30px 0; text-transform: uppercase; } .entry-blog .entry-header .entry-feature.entry-feature-image img { width: 100%; } .entry-blog .entry-meta { border-bottom: 1px solid #eee; padding: 25px 0; } .entry-blog .entry-meta ul { position: relative; display: inline-block; padding: 0; margin: 0; } .entry-blog .entry-meta ul li { display: inline-block; margin-right: 6px; padding-right: 10px; position: relative; font-size: 12px; color: #aaa; } .entry-blog .entry-meta ul li a { color: #aaa; } .entry-blog .entry-meta ul li a:hover { color: #3d72a4; } .entry-blog .entry-meta ul li i { padding-right: 6px; } .entry-blog .entry-meta ul li.detail-like .zo-post-like { cursor: pointer; } .entry-blog .entry-meta ul li.detail-like .zo-post-like:hover { color: #3d72a4; } .entry-blog .entry-content { /*** Blog Type ***/ } .entry-blog .entry-content .list-style-check { margin-left: 40px; } .entry-blog .entry-gallery .carousel-control { width: 45px; height: 45px; line-height: 52px; text-align: center; opacity: 1; top: 50%; transform: translate(0, -50%); text-shadow: 0 0 0 rgba(0, 0, 0, 0) 2px 5px rgba(0, 0, 0, .4); /* TRANSFORM */ border: 1px solid #3d72a4; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; /* BACKGROUND GRADIENT */ background-color: transparent; background-image: none !important; filter: none; } .entry-blog .entry-gallery .carousel-control.left { left: 10px; } .entry-blog .entry-gallery .carousel-control.right { right: 10px; } .entry-blog .entry-gallery .carousel-control .fa { font-size: 36px; color: #3d72a4; } .entry-blog .entry-video iframe { width: 100%; } .entry-blog .entry-quote blockquote { background: none repeat scroll 0 0 #ece9ef; border-left: 3px solid #3d72a4; padding: 23px; margin: 0 0 0 78px; position: relative; } .entry-blog .entry-quote blockquote:before { content: "\f10d"; font-size: 60px; font-family: FontAwesome; color: #3d72a4; position: absolute; top: 15px; left: -75px; } .post-teaser { margin-bottom: 50px; padding-bottom: 50px; border-bottom: 2px solid #f0f0f0; display: inline-block; width: 100%; } .post-teaser.sticky { background-color: #f9f9f9; padding: 10px 20px 20px; } .post-teaser.sticky .zo-blog-detail .zo-blog-title:before { content: "\f08d"; font-size: 30px; color: #3d72a4; padding-right: 10px; font-family: FontAwesome; } .post-teaser .zo-blog-detail { padding: 0 30px; } .post-teaser .zo-blog-detail .zo-blog-title { text-transform: uppercase; letter-spacing: 0; font-size: 19px; font-weight: 700; line-height: 30px; margin: 15px 0 0; color: #000; } .post-teaser .zo-blog-detail .zo-blog-title a { color: #000; } .post-teaser .zo-blog-detail .zo-blog-title a:hover { color: #3d72a4; } .post-teaser .zo-blog-detail .zo-blog-meta { margin-bottom: 13px; } .post-teaser .zo-blog-detail .zo-blog-meta a { color: #696969; } .post-teaser .zo-blog-detail .zo-blog-meta a:hover { color: #3d72a4; } .post-teaser .zo-blog-detail .zo-blog-meta ul { padding-left: 0; margin: 0; position: relative; width: 100%; line-height: 21px; } .post-teaser .zo-blog-detail .zo-blog-meta ul li { display: inline-block; font-size: 13px; line-height: 21px; } .post-teaser .zo-blog-detail .zo-blog-meta ul li + li:before { content: "|"; margin-left: 4px; margin-right: 5px; } .post-teaser .zo-blog-detail .zo-blog-meta ul .author a, .post-teaser .zo-blog-detail .zo-blog-meta ul .zo-blog-date, .post-teaser .zo-blog-detail .zo-blog-meta ul .zo-blog-comment { text-transform: capitalize; } .post-teaser .zo-blog-detail .zo-blog-readmore { border-color: #e4e4e4; } .post-teaser .zo-blog-detail .zo-blog-more a { font-weight: 700; font-size: 13px; line-height: 30px; text-transform: uppercase; color: #696969; } .post-teaser .zo-blog-detail .zo-blog-more a:hover { color: #3d72a4; } .post-teaser .zo-blog-detail .zo-blog-more a i { margin-left: 4px; } .post-teaser .zo-blog-image { position: relative; text-align: center; margin-bottom: 30px; } .post-teaser .zo-blog-image .zo-blog-avata { border: 3px solid #fff; left: -20px; position: absolute; top: 20px; } .post-teaser .zo-blog-image.zo-blog-quote { padding: 50px 75px; background: #3d72a4; } .post-teaser .zo-blog-image.zo-blog-quote blockquote { border-left-color: #fff; color: #fff; margin: 0; } .post-teaser .zo-blog-image .carousel .carousel-control { background: none; text-shadow: none; opacity: 1; } .post-teaser .zo-blog-image .carousel .carousel-control .fa { background: #fff; color: #141414; display: block; width: 35px; height: 35px; line-height: 35px; text-align: center; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -khtml-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .post-teaser .zo-blog-image .carousel .carousel-control:hover > .fa { background: #3d72a4; color: #fff; } .post-teaser .zo-blog-video .overlay, .post-teaser .zo-blog-audio .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .post-teaser .zo-blog-video .overlay .overlay-inner, .post-teaser .zo-blog-audio .overlay .overlay-inner { position: absolute; top: 50%; left: 0; text-align: center; width: 100%; -webkit-transform: translateY(-50%); -khtml-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ padding-left: 20px; padding-right: 20px; } .post-teaser .zo-blog-video .overlay .play-button, .post-teaser .zo-blog-audio .overlay .play-button { color: #fff; display: inline-block; border: 1px solid rgba(255, 255, 255, 0.3); font-size: 55px; height: 88px; line-height: 88px; text-align: center; width: 88px; } .post-teaser .zo-blog-video .overlay .mejs-container, .post-teaser .zo-blog-audio .overlay .mejs-container { margin-top: 40px; } .post-teaser .zo-blog-video iframe, .post-teaser .zo-blog-audio iframe { width: 100%; } .post-teaser .zo-blog-link { position: relative; background: #3d72a4; padding: 73px 0; text-align: center; line-height: inherit; } .post-teaser .zo-blog-link a { color: #fff; font-size: 28px; letter-spacing: 0; } .post-teaser .btn-readmore { border: 2px solid #969696; color: #969696; display: inline-block; font-size: 13px; font-weight: bold; letter-spacing: 0; margin: 0; padding: 4px 34px 4px 35px; text-transform: uppercase; } .post-teaser .btn-readmore:hover { border-color: #3d72a4; background: #3d72a4; color: #fff; } .post-teaser .zo-blog-content { margin-bottom: 32px; } .zo-blog-button { display: table; width: 100%; } .zo-blog-category { display: inline; } .zo-blog-category a { border: 2px solid #969696; color: #969696; background: #fff; line-height: 26px; font-size: 13px; letter-spacing: 0; padding: 0 15px; float: left; margin: 5px 10px 5px 0; -webkit-border-radius: 30px; -khtml-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; border-radius: 30px; /* BACKGROUND GRADIENT */ } .zo-blog-category a:hover { border-color: #3d72a4; background: #3d72a4; color: #fff; } .social-share { display: inline-block; line-height: 40px; float: right; } .social-share .social-list { text-align: right; margin: 0; } .social-share .social-list li { display: inline-block; list-style: none; } .social-share .social-list li + li { margin-left: 9px; } .social-share .social-list li .fa { display: block; width: 28px; height: 28px; line-height: 26px; text-align: center; font-size: 13px; color: #969696; border: 2px solid #969696; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; /* BACKGROUND GRADIENT */ } .social-share .social-list li .fa:hover { border-color: #3d72a4; background: #3d72a4; color: #fff; } .single .post-teaser { margin-bottom: 0; padding-bottom: 0; border: 0; } .single .post-teaser .zo-blog-detail .zo-blog-title { font-size: 26px; text-transform: uppercase; } .single .post-teaser .zo-blog-detail .zo-blog-content { margin-bottom: 40px; } .single .zo-blog-button { padding: 25px 0; border-top: 2px solid #f0f0f0; border-bottom: 2px solid #f0f0f0; margin-bottom: 50px; } .zo-author-about { padding: 25px 65px 25px 85px; background: #3d72a4; color: #fff; font-size: 13px; line-height: 24px; position: relative; margin-bottom: 50px; } .zo-author-about .zo-author-avatar img { border: 3px solid #fff; position: absolute; top: 20px; left: -20px; } @media screen and (max-width: 991px) { .zo-author-about .zo-author-avatar img { left: 0px; } } .zo-author-about .zo-author-info-name { display: inline-block; font-size: 15px; color: #fff; line-height: inherit; font-weight: 400; margin-right: 30px; } .zo-author-about .zo-author-info-name a { color: #fff; text-transform: uppercase; } .zo-author-about .zo-author-social-list { display: inline-block; } .zo-author-about .zo-author-social-list > label, .zo-author-about .zo-author-social-list > div { display: inline; } .zo-author-about .zo-author-social-list > div + div:before { content: "|"; color: #7dacd8; } .zo-author-about .zo-author-social-list a { color: #7dacd8; } .zo-author-about .zo-author-social-list a:hover { color: #fff; } @media (min-width: 768px) and (max-width: 991px) { /* ========================================================================== [End] Blog Classic ========================================================================== */ /* ========================================================================== [Start] Navigation ========================================================================== */ .page .post-teaser .zo-blog-detail .zo-blog-content { min-height: 85px; } } .navigation { text-align: center; } .navigation .pagination { margin-bottom: 40px; } .navigation .pagination a, .navigation .pagination .current, .navigation .pagination .disable { padding: 10px 15px; border: 1px solid #ececec; color: ; margin-right: 7px; } .navigation .pagination a:hover, .navigation .pagination .current:hover, .navigation .pagination .disable:hover { background-color: transparent; color: #3d72a4; } .navigation .pagination span.disable { color: #ececec; } .navigation .pagination span.disable:hover { color: #ececec; } .navigation .pagination span.current { color: #3d72a4; background-color: transparent; } .post-navigation { margin-bottom: 50px; /* ========================================================================== [End] 3. Navigation ========================================================================== */ /*================================================================= [Start] Portfolio *==================================================================*/ /* ---> zo-portfolio-style-1 */ } .post-navigation a { font-size: 14px; color: #343434; max-width: 350px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; z-index: 9; display: flex; align-items: center; } .post-navigation a i { background: #fff none repeat scroll 0 0; border-radius: 100%; font-size: 41px; height: 60px; line-height: 60px; width: 60px; color: #3d72a4; } .post-navigation .post-prev-wrap, .post-navigation .post-next-wrap { padding-top: 30px; padding-bottom: 30px; background: #c6c6c6; display: table; width: 100%; background-position: center center !important; background-repeat: no-repeat !important; background-size: cover !important; position: relative; } .post-navigation .post-prev-wrap .overlay, .post-navigation .post-next-wrap .overlay { position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(255, 255, 255, 0.7); } .post-navigation .post-prev-wrap:hover, .post-navigation .post-next-wrap:hover { -webkit-transition: all 200ms ease-in-out; -khtml-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .post-navigation .post-prev-wrap:hover .overlay, .post-navigation .post-next-wrap:hover .overlay { background: rgba(0, 0, 0, 0.5); } .post-navigation .post-prev-wrap:hover a, .post-navigation .post-next-wrap:hover a { color: #fff; } .post-navigation .post-prev-title { font-size: 19px; font-weight: bold; text-transform: uppercase; max-width: 270px; } .post-navigation .post-prev-wrap { padding-left: 15px; } .post-navigation .post-prev-wrap .post-prev-title { margin-left: 20px; } .post-navigation .post-next-wrap { padding-right: 15px; } .post-navigation .post-next-wrap .post-prev-title { margin-right: 20px; } .post-navigation .post-prev-title, .post-navigation .post-prev-title { white-space: nowrap; overflow: hidden; } .zo-portfolio-style-1 { height: 100%; width: 100%; background-size: cover; position: relative; /*================================================================= [End] Portfolio *==================================================================*/ /*================================================================= [Start] Team *==================================================================*/ /*================================================================= [End] Team *==================================================================*/ /*================================================================= [Start] Testimonial *==================================================================*/ /*================================================================= [End] Testimonial *==================================================================*/ /*================================================================= [Start] Client *==================================================================*/ } .zo-portfolio-style-1:hover .zo-portfolio-overlay { opacity: 1; -webkit-transform: scale(1); -khtml-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .zo-portfolio-style-1 .zo-portfolio-image img { width: 100%; } @media (min-width: 980px) and (max-width: 991px) { .zo-portfolio-style-1 .zo-portfolio-image img { width: 100% !important; } } .zo-portfolio-style-1 .zo-portfolio-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); opacity: 0; -webkit-transform: scale(0); -khtml-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ -webkit-transition: all 200ms ease-in-out; -khtml-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .zo-portfolio-style-1 .zo-portfolio-overlay .zo-portfolio-title { font-size: 15px; position: absolute; -webkit-transform: translate(0, -50%); -khtml-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ top: 50%; left: 0; width: 100%; text-align: center; text-transform: uppercase; } .zo-portfolio-style-1 .zo-portfolio-overlay .zo-portfolio-title a { color: #fff; } .zo-portfolio-style-1 .zo-portfolio-overlay .zo-portfolio-title a:hover { color: #3d72a4; } .zo-portfolio-style-1 .zo-portfolio-overlay .zo-portfolio-category { font-style: italic; font-size: 18px; position: absolute; -webkit-transform: translate(0, -50%); -khtml-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ top: 50%; left: 0; width: 100%; text-align: center; line-height: 60px; margin-top: -40px; } .zo-portfolio-style-1 .zo-portfolio-overlay .zo-portfolio-category a { color: #fff; } .our-partners { text-align: center; /*================================================================= [End] Client *==================================================================*/ /* ========================================================================== [Start] FAQ ========================================================================== */ } .our-partners img { display: inline-block; border: 1px solid #ececec; margin-bottom: 15px !important; } @media screen and (min-width: 640px) { .our-partners img { margin-left: 15px !important; } } .vc_tta-panel-body { padding-left: 0 !important; padding-right: 0 !important; padding-top: 55px !important; /* ========================================================================== [End] Blog Classic ========================================================================== */ /** * Custom Carousel */ } .vc_tta-panel-body .vc_toggle_default { border: 1px solid #ececec; padding: 15px 35px 15px 25px; } .vc_tta-panel-body .vc_toggle_default .vc_toggle_title { padding-left: 0 !important; } .vc_tta-panel-body .vc_toggle_default .vc_toggle_title h4 { font-size: 14px; font-weight: normal; letter-spacing: 0; } .vc_tta-panel-body .vc_toggle_default .vc_toggle_title .vc_toggle_icon { left: auto !important; right: -10px; } .vc_tta-panel-body .vc_toggle_default .vc_toggle_content { padding-left: 0 !important; font-size: 13px; } .vc_tta-panel-body .vc_toggle_default.vc_toggle_active { border-color: #909090; } .custom-carousel.owl-carousel .owl-item { color: #fff; } .custom-carousel.owl-carousel .owl-item h2 { font-size: 26px; line-height: 60px; letter-spacing: 0.1em; font-weight: 400; color: #fff; } .custom-carousel.owl-carousel .owl-item p { font-size: 22px; font-style: italic; color: #fff; } .custom-carousel.owl-carousel .owl-nav { text-align: left; margin-top: 40px; } .custom-carousel.owl-carousel .owl-nav [class*="owl-"] { background-color: transparent; display: inline-block; padding: 0; margin: 0; height: 34px; width: 34px; line-height: 30px; font-size: 20px; color: #fff; border: 1px solid #fff; text-align: center; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ } .custom-carousel.owl-carousel .owl-nav [class*="owl-"] i { line-height: normal; } .custom-carousel.owl-carousel .owl-nav [class*="owl-"].owl-prev { margin-right: 40px; position: relative; } .custom-carousel.owl-carousel .owl-nav [class*="owl-"].owl-prev:after { width: 40px; height: 1px; background-color: #fff; content: ''; position: absolute; top: 50%; right: -41px; } body.error404 { /*Style single page car*/ } body.error404 #zo-page-element-wrap { margin-bottom: 0; } .zo-boxed .zo-thumb-full { margin: 0px; } .single-pro-car-dealer { /*End single page care*/ } .single-pro-car-dealer .zo-car-dealer-header { margin-bottom: 60px; } .single-pro-car-dealer .zo-car-dealer-header .zo-blog-title { font-size: 23px; color: #343434; line-height: 25px; text-align: left; font-weight: 700; font-style: normal; } .single-pro-car-dealer .zo-car-dealer-header .zo-blog-title .zo-number-title { font-size: 19px; line-height: 25px; padding: 15px 20px 35px 0; margin-right: 20px; border-right: 2px solid #3d72a4; } @media screen and (max-width: 479px) { .single-pro-car-dealer .zo-car-dealer-header .zo-blog-title { font-size: 20px; } .single-pro-car-dealer .zo-car-dealer-header .zo-blog-title .zo-number-title { font-size: 18px; padding: 8px 10px 15px 0; margin-right: 10px; } } .single-pro-car-dealer .car-dealer .zo-car-slider .zo-slide-show { max-height: 510px; } .single-pro-car-dealer .car-dealer .zo-car-slider .slick-arrow { background: transparent; width: 50px; height: 50px; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ z-index: 99999; border: 2px solid #969696; } @media screen and (max-width: 1199px) { .single-pro-car-dealer .car-dealer .zo-car-slider .slick-arrow { display: none !important; } } .single-pro-car-dealer .car-dealer .zo-car-slider .slick-arrow:before { font-size: 30px; color: #969696; } .single-pro-car-dealer .car-dealer .zo-car-slider .slick-arrow:hover { background: #3d72a4; border: 2px solid #3d72a4; } .single-pro-car-dealer .car-dealer .zo-car-slider .slick-arrow:hover:before { color: #fff; } .single-pro-car-dealer .car-dealer .zo-car-slider .slick-prev { left: -90px; } .single-pro-car-dealer .car-dealer .zo-car-slider .slick-prev:before { content: "\f104"; } .single-pro-car-dealer .car-dealer .zo-car-slider .slick-next { right: -90px; } .single-pro-car-dealer .car-dealer .zo-car-slider .slick-next:before { content: "\f105"; } .single-pro-car-dealer .car-dealer .zo-thumb-full { background: #f4f4f4; } .zo-boxed .single-pro-car-dealer .car-dealer .zo-thumb-full { margin: 0px; } @media screen and (max-width: 1199px) { .single-pro-car-dealer .car-dealer .zo-thumb-full { margin: 0px; } } .single-pro-car-dealer .car-dealer .zo-thumb-full .container { padding: 0px; overflow: hidden; } .single-pro-car-dealer .car-dealer .zo-thumb-full .zo-thumb-nav { margin: 0; } .single-pro-car-dealer .car-dealer .zo-thumb-nav .zo-thumb-wrapper { position: relative; padding-left: 15px; padding-right: 15px; cursor: pointer; } .single-pro-car-dealer .car-dealer .zo-thumb-nav .zo-thumb-wrapper.slick-current:before { opacity: 0; } .single-pro-car-dealer .car-dealer .zo-thumb-nav .zo-thumb-wrapper:before { background: #d6d6d6; position: absolute; width: calc(100% - 30px); height: 100%; content: ''; top: 0; left: 15px; opacity: 0.6; } .single-pro-car-dealer .car-dealer .zo-thumb-nav .zo-thumb-wrapper:hover:before { opacity: 0; } .single-pro-car-dealer .zo-car-detail { padding: 0px; margin-top: 40px; } @media screen and (min-width: 993px) { .single-pro-car-dealer .zo-car-detail .zo-car-groups:first-child { padding-left: 0px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups:last-child { padding-right: 0px; } } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-title { font-size: 17px; line-height: 30px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-vehicle-title { margin-bottom: 20px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default { margin-bottom: 10px; border: 0; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default.active .panel-heading { background: #3d72a4; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default.active .panel-heading .panel-title { color: #fff; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default.active .panel-heading .pro-right-icon { color: #fff; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default .panel-heading { -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ position: relative; background: #e0e0e0; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default .panel-heading .panel-title { color: #000; font-size: 17px; line-height: 30px; font-weight: 700; font-family: Montserrat; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default .panel-heading .pro-right-icon { color: #000; position: absolute; width: 100%; text-align: right; padding-right: 20px; right: 0; top: 0; height: 100%; font-family: Roboto; line-height: 50px; font-weight: 400; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default .panel-collapse .panel-body { padding: 0px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default .panel-collapse .panel-body .pro-body-accordion { padding: 0px; list-style: none; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default .panel-collapse .panel-body .pro-body-accordion .pro-lists iframe { width: 400px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default .panel-collapse .panel-body .pro-body-accordion .pro-lists .pro-galleries { list-style: none; padding-left: 0px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default .panel-collapse .panel-body .pro-body-accordion .pro-lists .pro-galleries .pro-gallery { float: left; padding-right: 10px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default .panel-collapse .panel-body .pro-body-accordion .pro-lists .pro-item-title { background: #f4f4f4; display: block; color: #343434; font-family: Roboto; font-size: 15px; font-weight: 700; line-height: 24px; margin: 0; padding: 10px 0 10px 20px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-vehicle .panel-default .panel-collapse .panel-body .pro-body-accordion .pro-lists .pro-item-content { display: block; font-size: 13px; line-height: 24px; padding: 8px 0 8px 20px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-share-info { border-bottom: 2px solid #e0e0e0; padding-bottom: 15px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-share-info .zo-blog-button { border: 0px; width: auto; padding: 0px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-share-info .zo-blog-button .social-share { float: none; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-share-info .zo-blog-button .social-share .social-list { padding: 0px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-share-info .zo-blog-meta ul { list-style: none; padding: 0px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-share-info .zo-blog-meta ul li { font-size: 13px; line-height: 24px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-share-info .zo-blog-meta, .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-share-info .zo-blog-button { width: 50%; float: left; } @media screen and (max-width: 479px) { .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-share-info .zo-blog-meta, .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-share-info .zo-blog-button { width: 100%; } } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-blog-content { margin-top: 30px; font-size: 13px; line-height: 24px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-send-email .zo-car-form-contact p { margin-bottom: 20px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-send-email .zo-car-form-contact input[type="email"], .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-send-email .zo-car-form-contact input[type="text"] { background: #f4f4f4; color: #969696; font-family: Roboto; font-size: 15px; line-height: 24px; font-style: normal; padding-left: 20px; margin-bottom: 0px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-send-email .zo-car-form-contact textarea { border: 1px solid #3d72a4; font-size: 15px; line-height: 24px; font-family: Roboto; color: #343434; min-height: 200px; font-style: normal; padding-left: 20px; margin-bottom: 0px; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-send-email .zo-car-form-contact .zo-car-button { float: right; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-send-email .zo-car-form-contact .zo-loading { display: none; border: 1px solid #3d72a4; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-send-email .zo-car-form-contact .zo-loading.zo-form-error { border: 1px solid red; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-send-email .zo-car-form-contact .zo-loading.zo-form-success { border: 1px solid #398f14; } .single-pro-car-dealer .zo-car-detail .zo-car-groups .zo-car-send-email .zo-car-form-contact .zo-loading p { margin: 0; padding: 5px; } #comments { width: 100%; } #comments .comments-title, #comments .comment-reply-title { color: #000; position: relative; font-size: 17px; font-weight: 700; line-height: 30px; letter-spacing: 0; text-transform: uppercase; } #comments .comments-title { margin-top: 40px; margin-bottom: 40px; } #comments .comment-reply-title { margin-top: 0; margin-bottom: 20px; } #comments .comment-list { list-style: none; padding: 0; } #comments .comment-list li { position: relative; list-style: none; } #comments .comment-list > li { border-bottom: 2px solid #f0f0f0; margin-bottom: 40px; } #comments .comment-list > li:last-child { margin-bottom: 0; } #comments .comment-list .comment-body { margin-bottom: 35px; overflow: hidden; } #comments .comment-list .comment-body .comment-author-image { float: left; max-width: 70px; } #comments .comment-list .comment-body .comment-author-image img { height: 70px; width: 70px; } #comments .comment-list .comment-main { margin-left: 100px; color: #969696; } @media screen and (max-width: 767px) { #comments .comment-list .comment-main { margin-left: 0; } } #comments .comment-list .comment-main .comment-header { line-height: 25px; margin-top: 8px; } #comments .comment-list .comment-main .comment-header .comment-author { font-size: 15x; color: #000; text-transform: uppercase; font-weight: 700; } #comments .comment-list .comment-main .comment-header .comment-awaiting-moderation { font-size: 13px; color: #3d72a4; } #comments .comment-list .comment-main .comment-content { font-size: 14px; line-height: 24px; } #comments .comment-list .comment-main .comment-content p { margin-bottom: 0; } #comments .comment-list .comment-main .comment-date-and-reply { line-height: 25px; margin-bottom: 15px; } #comments .comment-list .comment-main .comment-date-and-reply .comment-date { color: #969696; font-size: 13px; } #comments .comment-list .comment-main .comment-date-and-reply .reply { float: right; font-size: 13px; text-transform: uppercase; display: inline; } #comments .comment-list ul.children { padding-left: 100px; position: relative; } #comments .comment-list ul.children .comment-author-image { max-width: 100px; float: left; background: #fff; } #comments .comment-respond { margin-top: 40px; } #comments #commentform p { margin: 0 0 10px; } #comments #commentform p input[type="text"], #comments #commentform p textarea { -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ font-size: 13px; border-color: #ebebeb; } #comments #commentform p input[type="text"]:focus, #comments #commentform p textarea:focus { border-color: #3d72a4; } #comments #commentform p label { font-size: 12px; font-style: italic; letter-spacing: 0.1em; color: #141414; text-transform: uppercase; } #comments #commentform p.comment-form-author, #comments #commentform p.comment-form-email { width: calc(50% - 15px); float: left; margin-bottom: 30px; } @media screen and (max-width: 767px) { #comments #commentform p.comment-form-author, #comments #commentform p.comment-form-email { width: 100%; padding-right: 0; } } #comments #commentform p.comment-form-author input, #comments #commentform p.comment-form-email input { background: #f0f0f0; } #comments #commentform p.comment-form-email { margin-right: 15px; } #comments #commentform p.comment-form-author { margin-left: 15px; } @media screen and (max-width: 767px) { #comments #commentform p.comment-form-author { margin-left: 0px; } } #comments #commentform p.comment-form-url { padding-right: 0; } #comments #commentform p.comment-form-comment { clear: both; margin-bottom: 30px; } #comments #commentform p.form-submit { text-align: right; } #comments #commentform p.form-submit input { font-size: 17px; font-weight: bold; color: #fff; padding: 16px 35px; line-height: 1; background: #3d72a4; border-color: #3d72a4; } .single #comments { margin-bottom: 100px; } .padding-right-equal-container { padding-right: calc((100% - 1170px) / 2) !important; } .padding-left-equal-container { padding-left: calc((100% - 1170px) / 2) !important; /* Row in row */ } @media (min-width: 992px) and (max-width: 1199px) { .padding-left-equal-container { padding-left: 15px !important; } } .vc_row { /* Primary color class */ } .vc_row .vc_row.vc_inner { margin-left: 0; margin-right: 0; } .primary-color { color: #3d72a4; } .zo-primary-color { background: #3d72a4; /* Secondary Color */ } .secondary_color { color: #609ad0; /*[Start] Zo Grid =============================================*/ } .zo-grid { /*[End] Zo Grid =============================================*/ } @media screen and (min-width: 992px) { .zo-grid .zo-grid-item.col-lg-6:nth-child(2n+1) { clear: both; } .zo-grid .zo-grid-item.col-lg-4:nth-child(3n+1) { clear: both; } .zo-grid .zo-grid-item.col-lg-3:nth-child(4n+1) { clear: both; } .zo-grid .zo-grid-item.col-lg-2:nth-child(6n+1) { clear: both; } } @media screen and (max-width: 991px) { .zo-grid .zo-grid-item.col-sm-6:nth-child(2n+1) { clear: both; } } .zo-grid.zo-grid-masonry .zo-grid-item { margin-bottom: 30px; } blockquote { border-left: 5px solid #3d72a4; padding-left: 10px; } dl { margin-bottom: 1.6em; } dt { font-weight: bold; } dd { margin-bottom: 1.6em; } table, th, td { border: 1px solid #eaeaea; } table { border-collapse: separate; border-spacing: 0; border-width: 1px 0 0 1px; margin: 0 0 1.6em; /* Prevents HTML tables from becoming too wide */ table-layout: fixed; width: 100%; } caption, th, td { font-weight: normal; text-align: left; } th { border-width: 0 1px 1px 0; font-weight: 700; } td { border-width: 0 1px 1px 0; } th, td { padding: 0.4em; } img { -ms-interpolation-mode: bicubic; border: 0; height: auto; max-width: 100%; vertical-align: middle; } figure { margin: 0; } del { opacity: 0.8; } dl { /* Alignments ==================================*/ } dl dt { font-weight: bold; } blockquote.alignleft, .wp-caption.alignleft, img.alignleft { margin: 0.4em 1.6em 1.6em 0; } blockquote.alignright, .wp-caption.alignright, img.alignright { margin: 0.4em 0 1.6em 1.6em; } blockquote.aligncenter, .wp-caption.aligncenter, img.aligncenter { clear: both; margin-top: 0.4em; margin-bottom: 1.6em; } .wp-caption.alignleft, .wp-caption.alignright, .wp-caption.aligncenter { margin-bottom: 1.2em; } .post-password-form input[type="submit"] { margin-top: 15px; } @media screen and (min-width: 1200px) { .no-padding .container { padding-left: 0; padding-right: 0; } } @media screen and (max-width: 991px) { /* Accordion */ .no-padding.zo-row-full-width .no-container { padding-left: 0; padding-right: 0; } } .zo-accordion { /*Message box*/ } .zo-accordion .vc_tta-accordion .vc_tta-panel-heading .vc_tta-panel-title { text-align: left; font-size: 12px; letter-spacing: 0; font-weight: 400; } .zo-accordion .vc_tta-accordion .vc_tta-panel-heading .vc_tta-panel-title .vc_tta-title-text { color: #6f6f6f; } .zo-accordion .vc_tta-accordion .vc_tta-panel-heading .vc_tta-panel-title i { border: 2px solid #ececec; height: 22px; width: 22px; } .zo-accordion .vc_tta-accordion .vc_tta-panel-heading .vc_tta-panel-title i:before { width: 8px; margin: 0 auto; } .zo-accordion .vc_tta-accordion .vc_tta-panel-heading .vc_tta-panel-title i:after { height: 8px; top: 50%; -webkit-transform: translate(-50%, -50%); -khtml-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .zo-accordion .vc_tta-accordion .vc_tta-panel-body { padding: 25px !important; } .zo-accordion .vc_tta-accordion .vc_tta-panel-body .wpb_single_image { float: left; width: 116px; } .zo-accordion .vc_tta-accordion .vc_tta-panel-body .wpb_text_column { padding-left: 136px; } .zo-accordion .vc_tta-accordion .vc_tta-panel-body .wpb_text_column p { font-size: 12px; line-height: 24px; color: #6f6f6f; } .zo-accordion .vc_tta-accordion .vc_active .vc_tta-panel-heading .vc_tta-panel-title .vc_tta-title-text { color: #3d72a4; font-size: 14px; font-weight: bold; } .zo-accordion .vc_tta-accordion .vc_active .vc_tta-panel-heading .vc_tta-panel-title i { border: 2px solid #3d72a4; background: #3d72a4; } .zo-accordion .vc_tta-accordion .vc_active .vc_tta-panel-heading .vc_tta-panel-title i:before { border-color: #fff !important; } .custom-message { /** * Tabs */ } .custom-message .alert { border-radius: 0; position: relative; margin-bottom: 30px; } .custom-message .alert .close { position: absolute; right: 15px; top: 15px; font-size: 18px; font-weight: bold; } .custom-message .alert .vertical-align > div:first-child { text-align: center; } .custom-message.message-icon-1 .alert strong { font-size: 14px; } .custom-message.message-icon-1 .alert .fa { background: #fff; border-radius: 50%; color: #000; line-height: 38px; -webkit-transform: translateY(calc(50% + 17px)); -khtml-transform: translateY(calc(50% + 17px)); -moz-transform: translateY(calc(50% + 17px)); -ms-transform: translateY(calc(50% + 17px)); -o-transform: translateY(calc(50% + 17px)); transform: translateY(calc(50% + 17px)); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ height: 38px; text-align: center; width: 38px; } .custom-message.message-icon-2.message-style-1 .alert .fa { border: 1px solid #fff; } .custom-message.message-icon-2.message-style-2 .alert.alert-success .fa { border: 1px solid #2fba87; } .custom-message.message-icon-2.message-style-2 .alert.alert-warning .fa { border: 1px solid #ffc11b; } .custom-message.message-icon-2.message-style-2 .alert.alert-info .fa { border: 1px solid #6dcff6; } .custom-message.message-icon-2.message-style-2 .alert.alert-danger .fa { border: 1px solid #eb5020; } .custom-message.message-icon-2 .alert strong { font-size: 14px; } .custom-message.message-icon-2 .alert .fa { border-radius: 50%; line-height: 38px; height: 38px; text-align: center; width: 38px; } .custom-message.message-icon-2 .alert .vertical-align > div:first-child { text-align: center; } .custom-message.message-style-1 .alert { font-size: 11px; color: #fff; } .custom-message.message-style-1 .alert .close { color: #fff; } .custom-message.message-style-1 .alert.alert-success { background: #2fba87; border-color: #2fba87; } .custom-message.message-style-1 .alert.alert-warning { background: #ffc11b; border-color: #ffc11b; } .custom-message.message-style-1 .alert.alert-info { background: #6dcff6; border-color: #6dcff6; } .custom-message.message-style-1 .alert.alert-danger { background: #eb5020; border-color: #eb5020; } .custom-message.message-style-2 .alert { font-size: 11px; border-width: 2px; } .custom-message.message-style-2 .alert.alert-success { color: #2fba87; border-color: #2fba87; background: #e7f6f0; } .custom-message.message-style-2 .alert.alert-success .close { color: #2fba87; } .custom-message.message-style-2 .alert.alert-warning { color: #ffc11b; border-color: #ffc11b; background: #fffbf0; } .custom-message.message-style-2 .alert.alert-warning .close { color: #ffc11b; } .custom-message.message-style-2 .alert.alert-info { color: #6dcff6; border-color: #6dcff6; background: #effaff; } .custom-message.message-style-2 .alert.alert-info .close { color: #6dcff6; } .custom-message.message-style-2 .alert.alert-danger { color: #eb5020; border-color: #eb5020; background: #fff0ec; } .custom-message.message-style-2 .alert.alert-danger .close { color: #eb5020; } .nav-primary-color { /** * Accordion */ } .nav-primary-color .vc_pagination-color-pink.vc_pagination-style-outline .vc_active .vc_pagination-trigger { background-color: #ff83a6 !important; border-color: #ff83a6 !important; } .nav-primary-color .vc_pagination-color-pink.vc_pagination-style-outline .vc_pagination-trigger { border: 1px solid #3c3c3c !important; } .vc_tta-container { /*Custom Heading*/ } .vc_tta-container .vc_tta-accordion .vc_tta-panels-container .vc_tta-panels .vc_tta-panel { margin-bottom: 10px; } .vc_tta-container .vc_tta-accordion .vc_tta-panels-container .vc_tta-panels .vc_tta-panel .vc_tta-panel-heading { background-color: transparent; border-radius: 0; } .vc_tta-container .vc_tta-accordion .vc_tta-panels-container .vc_tta-panels .vc_tta-panel .vc_tta-panel-heading .vc_tta-panel-title { font-size: 13px; font-weight: 400; line-height: normal; } .vc_tta-container .vc_tta-accordion .vc_tta-panels-container .vc_tta-panels .vc_tta-panel .vc_tta-panel-heading .vc_tta-panel-title > a { color: #3c3c3c; padding-left: 20px; position: relative; } .vc_tta-container .vc_tta-accordion .vc_tta-panels-container .vc_tta-panels .vc_tta-panel .vc_tta-panel-heading .vc_tta-panel-title > a:after { content: "\f107"; font-family: FontAwesome; position: absolute; top: 50%; right: 20px; -webkit-transform: translateY(-50%); -khtml-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .vc_tta-container .vc_tta-accordion .vc_tta-panels-container .vc_tta-panels .vc_tta-panel .vc_tta-panel-heading .vc_tta-panel-title > a .vc_tta-controls-icon { display: none; } .vc_tta-container .vc_tta-accordion .vc_tta-panels-container .vc_tta-panels .vc_tta-panel .vc_tta-panel-body { background-color: transparent; padding: 20px; } .vc_tta-container .vc_tta-accordion .vc_tta-panels-container .vc_tta-panels .vc_tta-panel.vc_active .vc_tta-panel-heading { border-color: #3d72a4; border-bottom: none; } .vc_tta-container .vc_tta-accordion .vc_tta-panels-container .vc_tta-panels .vc_tta-panel.vc_active .vc_tta-panel-heading .vc_tta-panel-title > a { color: #3d72a4; font-weight: 700; } .vc_tta-container .vc_tta-accordion .vc_tta-panels-container .vc_tta-panels .vc_tta-panel.vc_active .vc_tta-panel-body { border-color: #3d72a4; border-top: none; } .vc_custom_heading.style-1 { overflow: hidden; /*Page About Us */ /*Ul About us Custom*/ } .vc_custom_heading.style-1 .zo-number-title { font-size: 19px; line-height: 25px; padding: 15px 20px 35px 0; margin-right: 20px; border-right: 2px solid #609ad0; } .zo-ul-custom-about-us { /*Style Tab About Us*/ } .zo-ul-custom-about-us ul { padding-left: 0; list-style: none; } .zo-ul-custom-about-us ul li { font-size: 13px; line-height: 24px; margin-bottom: 10px; } .zo-ul-custom-about-us ul li i { font-size: 15px; line-height: 30px; width: 30px; height: 30px; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ text-align: center; background: #3d72a4; margin-right: 10px; color: #fff; } .zo-tabs-about-us-style { /*Style Zo New letter*/ } .zo-tabs-about-us-style .vc_tta-panels-container div.vc_tta-panels { border: 0 !important; background: transparent !important; background-color: transparent !important; } .zo-tabs-about-us-style .vc_tta-panels-container div.vc_tta-panels .vc_tta-panel { background-color: transparent; } .zo-tabs-about-us-style .vc_tta-panels-container div.vc_tta-panels .vc_tta-panel .vc_tta-panel-heading { -webkit-border-radius: 0px; -khtml-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; /* BACKGROUND GRADIENT */ } .zo-tabs-about-us-style .vc_tta-panels-container div.vc_tta-panels .vc_tta-panel div.vc_tta-panel-body { padding: 20px !important; background-color: transparent; -webkit-border-radius: 0px; -khtml-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; /* BACKGROUND GRADIENT */ } .zo-tabs-about-us-style .vc_tta-tabs-container ul.vc_tta-tabs-list li.vc_tta-tab { margin: 0; border-bottom: 2px solid #969696; } .zo-tabs-about-us-style .vc_tta-tabs-container ul.vc_tta-tabs-list li.vc_tta-tab a { border-color: transparent; background: transparent; color: #969696; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ } .zo-tabs-about-us-style .vc_tta-tabs-container ul.vc_tta-tabs-list li.vc_tta-tab a span { font-size: 17px; line-height: 30px; font-weight: 700; } .zo-tabs-about-us-style .vc_tta-tabs-container ul.vc_tta-tabs-list li.vc_tta-tab:hover, .zo-tabs-about-us-style .vc_tta-tabs-container ul.vc_tta-tabs-list li.vc_tta-tab.vc_active { border-bottom: 2px solid #3d72a4; } .zo-tabs-about-us-style .vc_tta-tabs-container ul.vc_tta-tabs-list li.vc_tta-tab:hover a, .zo-tabs-about-us-style .vc_tta-tabs-container ul.vc_tta-tabs-list li.vc_tta-tab.vc_active a { color: #343434; } .zo-newsletter { /*End page About Us*/ /*Hone page*/ } .zo-newsletter .widget_newsletterwidget { margin-bottom: 10px !important; padding-left: 28px; } @media (min-width: 992px) and (max-width: 1023px) { .zo-newsletter .widget_newsletterwidget form p { max-width: calc(100% - 45px) !important; padding: 0 0 0 45px !important; float: none !important; } } @media screen and (max-width: 991px) { .zo-newsletter .widget_newsletterwidget { padding-left: 0px; } } @media screen and (max-width: 767px) { .zo-newsletter .widget_newsletterwidget { padding-left: 0px !important; } .zo-newsletter .widget_newsletterwidget form p { max-width: 100% !important; padding: 0 !important; float: none !important; } } .zo-newsletter .widget_newsletterwidget .newsletter-widget form p { padding: 0 15px; max-width: calc(100%/3); float: left; } .zo-newsletter .widget_newsletterwidget .newsletter-widget form p input[type="text"], .zo-newsletter .widget_newsletterwidget .newsletter-widget form p input[type="email"] { margin-top: 10px; min-width: 200px; background: transparent; color: #a3a8ac; border: 1px solid #a3a8ac; } .zo-newsletter .widget_newsletterwidget .newsletter-widget form p input[type="text"]:focus, .zo-newsletter .widget_newsletterwidget .newsletter-widget form p input[type="email"]:focus { color: #fff; border: 1px solid #fff; } .zo-newsletter .widget_newsletterwidget .newsletter-widget form p .newsletter-submit { background: #3d72a4; color: #fff; font-size: 17px; line-height: 40px; padding: 14px 80px; text-transform: uppercase; font-weight: 700; } .zo-newsletter .widget_newsletterwidget .newsletter-widget form p .newsletter-submit:hover { background: #fff; color: #3d72a4; } .zo-newsletter .widget_newsletterwidget .newsletter-widget form p:last-child { text-align: right; } .zo-newsletter .widget_newsletterwidget .newsletter-widget form p:first-child { padding-left: 45px; } @media screen and (max-width: 599px) { h2.zo-home-title-call { line-height: 45px !important; font-size: 45px !important; } } .zo-slider-border-bottom { border-bottom: 8px solid #3d72a4; } .zo-boxed div.zo-pading-welcome .zo-shadow { left: 0px; font-size: 42px; } @media screen and (max-width: 767px) { .zo-welcome-row div.zo-image .vc_column-inner { padding-top: 150px !important; padding-bottom: 150px !important; } } .zo-pading-welcome { /*Sell Car*/ } @media screen and (min-width: 1200px) { .zo-pading-welcome { padding-left: calc((100% - 1170px)/ 2 - 15px) !important; } } .zo-pading-welcome .zo-welcome-background { background: #3d72a4; position: relative; z-index: 9; } @media screen and (min-width: 1200px) { .zo-pading-welcome .zo-welcome-background { width: calc(100% + 47px); } } @media screen and (max-width: 766px) { .zo-pading-welcome .zo-welcome-background { text-align: center; } } .zo-pading-welcome .zo-welcome-background h2 { font-size: 35px; line-height: 25px; font-weight: 700; line-height: 40px; color: #fff; } .zo-pading-welcome .zo-text-signature { padding-left: 20px; } @media screen and (max-width: 991px) { .zo-pading-welcome .zo-text-signature { padding-bottom: 30px; } } .zo-pading-welcome .zo-text-signature .wpb_wrapper { position: relative; } .zo-pading-welcome .zo-text-signature .zo-word { font-family: Roboto; font-size: 17px; line-height: 25px; font-weight: 700; padding-left: 20px; } .zo-pading-welcome .zo-text-signature .zo-name { font-size: 35px; line-height: 25px; -webkit-transform: rotate(-10deg); -khtml-transform: rotate(-10deg); -moz-transform: rotate(-10deg); -ms-transform: rotate(-10deg); -o-transform: rotate(-10deg); transform: rotate(-10deg); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ color: #3d72a4; z-index: 9; padding-left: 30px; } @media screen and (max-width: 991px) { .zo-pading-welcome .zo-text-signature .zo-name { position: absolute; top: 50px; left: 40px; } } .zo-pading-welcome .zo-text-signature .zo-shadow { position: absolute; font-size: 55.46px; line-height: 39.61px; color: #e7e6e6; top: 69%; left: -15px; -webkit-transform: rotate(-10deg); -khtml-transform: rotate(-10deg); -moz-transform: rotate(-10deg); -ms-transform: rotate(-10deg); -o-transform: rotate(-10deg); transform: rotate(-10deg); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } @media screen and (max-width: 991px) { .zo-pading-welcome .zo-text-signature .zo-shadow { position: absolute; top: 37px; left: 50px; font-size: 40px; } } .zo-sell-car-home .zo-btn-car-sell { margin-top: 15px; } @media screen and (max-width: 991px) { .zo-sell-car-home .zo-btn-sell-wrapper .vc_column-inner { padding-top: 0px !important; } .zo-sell-car-home .zo-btn-sell-wrapper .vc_column-inner .zo-btn-car-sell { margin-top: 0px !important; float: left !important; } } .zo-sell-car-home .zo-btn-car-sell button { font-weight: 700; border: 2px solid #fff !important; font-family: Montserrat; line-height: 30px; color: #fff !important; font-size: 17px !important; } .zo-sell-car-home .zo-btn-car-sell button:hover { color: #000 !important; background: #fff !important; } .zo-sell-car-home .zo-sell-car-padding { padding-left: 210px; } @media screen and (max-width: 1169px) { .zo-sell-car-home .zo-sell-car-padding { padding-left: 0 !important; } } .zo-sell-car-home .wpb_single_image { position: absolute; top: 0; left: 0; -webkit-transform: translate(-15px, -25px); -khtml-transform: translate(-15px, -25px); -moz-transform: translate(-15px, -25px); -ms-transform: translate(-15px, -25px); -o-transform: translate(-15px, -25px); transform: translate(-15px, -25px); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .zo-sell-car-home .wpb_single_image img { max-height: 210px; } @media screen and (max-width: 1169px) { .zo-sell-car-home .wpb_single_image { display: none; } } .zo-sell-car-home .zo-row-car-sell { margin-left: 140px !important; } @media screen and (max-width: 1169px) { .zo-sell-car-home .zo-row-car-sell { margin-left: 0 !important; margin-right: 0 !important; } } @media screen and (max-width: 767px) { .zo-sell-car-home .zo-row-car-sell { text-align: center; } .zo-sell-car-home .zo-row-car-sell .vc_custom_heading { line-height: 40px !important; text-align: center !important; } } .vc_custom_heading.zo-heading-style .zo-number-title { border-right: 2px solid #609ad0; } @media screen and (max-width: 767px) { .zo-background-resize .vc_column-inner { padding-top: 150px !important; padding-bottom: 150px !important; } div.zo-home-question { padding-top: 80px !important; padding-bottom: 80px !important; } } @media screen and (min-width: 1200px) { .zo-service-padding { padding-right: calc((100% - 1170px)/ 2) !important; padding-left: 50px !important; } } @media screen and (max-width: 1199px) { .zo-service-padding { padding-left: 15px !important; padding-right: 15px !important; padding-top: 40px; } } @media screen and (max-width: 991px) { .zo-service-padding { padding-bottom: 40px; } } @media screen and (max-width: 479px) { .zo-service-padding .vc_inner.vc_row-fluid .vc_column_container { width: 50% !important; } } .zo-home-filter { background: #fff; border-top: 8px solid #3d72a4; -webkit-box-shadow: 0 1px 27px rgba(0, 0, 0, 0.3); -khtml-box-shadow: 0 1px 27px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 1px 27px rgba(0, 0, 0, 0.3); -ms-box-shadow: 0 1px 27px rgba(0, 0, 0, 0.3); -o-box-shadow: 0 1px 27px rgba(0, 0, 0, 0.3); box-shadow: 0 1px 27px rgba(0, 0, 0, 0.3); /* BACKGROUND GRADIENT */ /* BOX SIZING */ } @media screen and (max-width: 991px) { .zo-home-filter { webkit-box-shadow: none; box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none; } } .zo-about-us-row-tab { position: relative; } @media screen and (max-width: 767px) { .zo-about-us-row-tab .vc_column_container { padding-top: 80px; } } .zo-about-us-row-tab .img-on-row-right { position: absolute; height: 100%; bottom: 50px; right: 0; } .zo-boxed .zo-about-us-row-tab .img-on-row-right { display: none; } @media screen and (max-width: 1599px) { .zo-about-us-row-tab .img-on-row-right { position: relative !important; } .zo-about-us-row-tab .img-on-row-right .wpb_single_image { position: relative !important; height: auto !important; } } .zo-about-us-row-tab .img-on-row-right .wpb_single_image { position: absolute; height: 100%; right: 0; } .zo-contact-form7 .container .row.vc_row { margin-top: -100px; -webkit-box-shadow: 0 1px 27px rgba(0, 0, 0, 0.3); -khtml-box-shadow: 0 1px 27px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 1px 27px rgba(0, 0, 0, 0.3); -ms-box-shadow: 0 1px 27px rgba(0, 0, 0, 0.3); -o-box-shadow: 0 1px 27px rgba(0, 0, 0, 0.3); box-shadow: 0 1px 27px rgba(0, 0, 0, 0.3); /* BACKGROUND GRADIENT */ /* BOX SIZING */ padding-bottom: 30px; } .zo-contact-form7 .wpcf7-form { padding-bottom: 25px; position: relative; } .zo-contact-form7 .wpcf7-form:after { position: absolute; margin: 0 auto; content: ''; background: #d6d6d6; width: calc(100% - 30px); height: 1px; bottom: 0; left: 15px; } .zo-see-all-btn a.vc_general { color: #969696; border: 1px solid #969696 !important; } .zo-contact-form { padding: 38px 25px 0px; background: #fff; } .zo-contact-form h1 { font-size: 15px; font-weight: 700; text-transform: uppercase; line-height: auto; } .zo-contact-form .wpcf7-form-control-wrap input[type='email'], .zo-contact-form .wpcf7-form-control-wrap input[type='text'], .zo-contact-form .wpcf7-form-control-wrap input[type='url'], .zo-contact-form .wpcf7-form-control-wrap textarea { font-size: 13px; line-height: 22px; font-style: normal; margin-bottom: 0px; } .zo-contact-form .wpcf7-form-control-wrap input[type='text'], .zo-contact-form .wpcf7-form-control-wrap input[type='url'] { background: #f4f4f4; color: #adadad; padding-left: 10px; } .zo-contact-form .wpcf7-form-control-wrap input[type='email'] { background: #fdfdfd; color: #adadad; padding-left: 10px; } .zo-contact-form .wpcf7-form-control-wrap textarea { border: 1px solid #3d72a4; min-height: 160px; color: #343434; } .zo-contact-form .wpcf7-submit { float: right; font-size: 17px; line-height: 30px; } @media screen and (max-width: 767px) { body div#zo-header { margin-top: 10px; } body.admin-bar div#zo-header { margin-top: 45px; } body div#zo-header.zo-header-2, body.admin-bar div#zo-header.zo-header-2 { margin-top: 0; } } #zo-header-top { line-height: 30px; font-size: 12px; font-weight: 500; letter-spacing: 0.025em; } #zo-header-top a { color: #fff; } #zo-header-top a:hover { color: #3d72a4; } #zo-header-top .social-top { display: inline-block; } #zo-header-top .social-top a:first-child { margin-left: 3px; } #zo-header-top .social-top a + a { margin-left: 9px; } #zo-header-top .header-top-right { text-align: right; } #zo-header-top .header-top-right a { margin: 0 6px; } #zo-header-top .header-top-right a:last-child { margin: 0; } @media screen and (max-width: 767px) { #zo-header-top .header-top-right, #zo-header-top .widget_text { text-align: center; } } #zo-header { width: 100%; z-index: 999; top: 0; /*** Admin Bar ***/ } #zo-header.no-sticky { position: relative; } #zo-header.no-sticky.header-fixed, #zo-header.no-sticky.header-fixed-page { -webkit-transition: all 420ms linear 0ms; -khtml-transition: all 420ms linear 0ms; -moz-transition: all 420ms linear 0ms; -ms-transition: all 420ms linear 0ms; -o-transition: all 420ms linear 0ms; transition: all 420ms linear 0ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ position: fixed; } #zo-header.header-fixed, #zo-header.header-fixed-page { position: fixed; -webkit-animation: 1s ease zoFadeIn; -khtml-animation: 1s ease zoFadeIn; -moz-animation: 1s ease zoFadeIn; -ms-animation: 1s ease zoFadeIn; -o-animation: 1s ease zoFadeIn; animation: 1s ease zoFadeIn; /* BACKGROUND GRADIENT */ /*///////////////////////////////////ANIMATION//////////////////////////////////*/ } #zo-header.header-default.header-fixed, #zo-header.header-default.header-fixed-page { position: fixed; } #zo-header #zo-header-logo a img { -webkit-transition: all 420ms linear 0ms; -khtml-transition: all 420ms linear 0ms; -moz-transition: all 420ms linear 0ms; -ms-transition: all 420ms linear 0ms; -o-transition: all 420ms linear 0ms; transition: all 420ms linear 0ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } #zo-header > .container { position: relative; z-index: 99; } #zo-header.header-fixed-page.header-fixed-page-trans { position: absolute; } #zo-header #zo-header-navigation #site-navigation, #zo-header #zo-header-navigation #zo-header-right { display: inline-block; } .admin-bar { /*** End Admin Bar ***/ /*** Logo ***/ } .admin-bar #zo-header { top: 32px; } .admin-bar #zo-header.no-sticky { top: 0; } .admin-bar #zo-header.no-sticky.header-fixed-page { top: 32px; } #zo-header-logo a { display: block; -webkit-transition: all 300ms linear 0ms; -khtml-transition: all 300ms linear 0ms; -moz-transition: all 300ms linear 0ms; -ms-transition: all 300ms linear 0ms; -o-transition: all 300ms linear 0ms; transition: all 300ms linear 0ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ /*** End Logo ***/ /* ========================================================================== End All Style Header ========================================================================== */ } #zo-header-right { position: static; /* Cart and Search ==========================================================*/ } .widget_cart_search_wrap { text-align: right; } .widget_cart_search_wrap .widget_cart_search_wrap_item { line-height: 115px; display: inline-block; } @media screen and (max-width: 991px) { .widget_cart_search_wrap .widget_cart_search_wrap_item { line-height: 80px; } } .header-fixed .widget_cart_search_wrap .widget_cart_search_wrap_item { line-height: 115px; } .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon { position: absolute; right: 15px; top: 0; } .header-fixed .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon { line-height: 115px; } .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon.icon_cart_wrap i { padding: 0 29px; border-left: 1px solid #696969; } .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon.icon_cart_wrap .cart_total { position: absolute; color: #fff; background-color: red; border: 2px solid #fff; display: block; font-size: 11px; height: 17px; line-height: 13px; right: 20px; text-align: center; top: 42px; width: 17px; } .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon.icon_search_wrap i { padding-left: 29px; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown, .widget_cart_search_wrap .widget_cart_search_wrap_item .widget_searchform_content { height: 0; overflow: hidden; opacity: 0; -webkit-transition: all 400ms; -khtml-transition: all 400ms; -moz-transition: all 400ms; -ms-transition: all 400ms; -o-transition: all 400ms; transition: all 400ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown.active, .widget_cart_search_wrap .widget_cart_search_wrap_item .widget_searchform_content.active { height: auto; overflow: hidden; opacity: 1; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown { width: 360px; position: absolute; background-color: #141414; top: 100%; right: 16px; } @media screen and (max-width: 768px) { .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown { right: 0; width: 100%; } } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner { padding: 20px; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart_list { list-style: none inside; margin: 0; padding: 0; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart_list li.cart-list { border-bottom: 1px solid #393939; color: #fff; overflow: hidden; padding: 20px 0; line-height: normal; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart_list li.cart-list.empty { text-align: center; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart_list li.cart-list a { float: left; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart_list li.cart-list a img { width: 75px; height: 93px; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart_list li.cart-list .cart-list-info { padding-left: 95px; text-align: left; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart_list li.cart-list .cart-list-info .title { color: #fff; font-size: 12px; padding: 0 0 10px; margin: 0; text-transform: uppercase; line-height: normal; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart_list li.cart-list .cart-list-info .amount { color: #3d72a4; display: block; font-style: italic; padding-bottom: 10px; padding-right: 4px; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart_list li.cart-list .cart-list-info .quantity { display: block; color: #858585; text-transform: uppercase; padding-bottom: 10px; padding-right: 4px; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart_list li.cart-list .cart-list-info .quantity a { float: right; margin-left: 15px; color: #858585; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart-total .total { font-size: 16px; color: #fff; display: block; text-align: center; text-transform: uppercase; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart-total .total .amount { font-size: 36px; padding-left: 10px; color: #3d72a4; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart-total .btn { width: 100%; text-align: center; color: #fff !important; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart-total .btn.btn-checkout:hover { background: #3d72a4; background: rgba(61, 114, 164, 0.3); /* COLOR OPACITY */ } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart-total .btn.btn-cart { background-color: #909090; border-color: #909090; } .widget_cart_search_wrap .widget_cart_search_wrap_item .shopping_cart_dropdown .shopping_cart_dropdown_inner .cart-total .btn.btn-cart:hover { background: #909090; background: rgba(144, 144, 144, 0.3); /* COLOR OPACITY */ } .widget_cart_search_wrap .widget_cart_search_wrap_item .widget_searchform_content { position: absolute; width: 100%; left: 0; top: 100%; } @media (min-width: 768px) and (max-width: 991px) { .widget_cart_search_wrap .widget_cart_search_wrap_item .widget_searchform_content { -webkit-transform: translateY(30%); -khtml-transform: translateY(30%); -moz-transform: translateY(30%); -ms-transform: translateY(30%); -o-transform: translateY(30%); transform: translateY(30%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } } .widget_cart_search_wrap .widget_cart_search_wrap_item .widget_searchform_content form { position: relative; padding: 35px 60px; border: 1px solid rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.3); } @media screen and (max-width: 599px) { .widget_cart_search_wrap .widget_cart_search_wrap_item .widget_searchform_content form { padding: 20px 20px; } } .widget_cart_search_wrap .widget_cart_search_wrap_item .widget_searchform_content form input { display: block; height: 40px; line-height: 40px; padding: 0; color: #fff; } .widget_cart_search_wrap .widget_cart_search_wrap_item .widget_searchform_content form input[type="text"] { font-size: 18px; color: #000; background-color: #fff; border: none; padding: 0 15px; } .widget_cart_search_wrap .widget_cart_search_wrap_item .widget_searchform_content form input[type="text"]:focus { background-color: #fff; border: none; } .widget_cart_search_wrap .widget_cart_search_wrap_item .widget_searchform_content form input[type="submit"] { font-size: 12px; text-transform: uppercase; padding: 0 50px; position: absolute; right: 40px; top: 35px; background-color: #3d72a4; } @media screen and (max-width: 599px) { .widget_cart_search_wrap .widget_cart_search_wrap_item .widget_searchform_content form input[type="submit"] { right: 20px; top: 20px; } } @media screen and (max-width: 768px) { .widget_cart_search_wrap .widget_cart_search_wrap_item .widget_searchform_content form input[type="submit"] { padding: 0 15px; } } footer { position: relative; } #zo-footer-top { position: relative; font-size: 13px; line-height: 24px; overflow: hidden; } #zo-footer-top [class*="footer-"] h3 { font-size: 13px; line-height: 24px; } #zo-footer-top .footer-first h6 { color: #3d72a4; } #zo-footer-top .wg-title { font-size: 17px; line-height: 40px; position: relative; text-transform: uppercase; padding-bottom: 10px; margin-bottom: 25px; } #zo-footer-top .wg-title:before { content: ''; position: absolute; left: 0; bottom: 0; width: 70px; height: 3px; background-color: #3d72a4; } #zo-footer-top ul.menu { padding: 0; margin: 0; list-style: none inside; } #zo-footer-top ul.menu li { font-size: 10px; line-height: 36px; text-transform: uppercase; } #zo-footer-top ul.menu li:first-child { margin-top: -9px; } #zo-footer-bottom { /* End Widget Categories */ } #zo-footer-bottom .coppy-right { text-align: center; font-size: 13px; line-height: 30px; color: #fff; } #zo-footer-bottom .coppy-right a { color: #fff; } #zo-footer-bottom .coppy-right a:hover { color: #3d72a4; } footer.entry-meta { font-size: 13px; line-height: 1.84615; color: #757575; margin: 0; text-align: center; clear: both; /* Back To Top */ } .back_to_top { color: #cdcdcd; height: auto; position: fixed; bottom: -40px; margin: 0; z-index: 10000; -webkit-transition: all 1s ease 1s; -moz-transition: all 1s ease 1s; -o-transition: all 1s ease 1s; transition: all 1s ease 1s; right: 25px; opacity: 0; filter: alpha(opacity=0); cursor: pointer; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ border: 2px solid #e8e8e8; } .back_to_top.on { opacity: 1; filter: alpha(opacity=100); display: block; bottom: 10px; } #back_to_top span { width: 42px; height: 42px; line-height: 42px; text-decoration: none; -webkit-transition: all 0.2s ease 0s; -khtml-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -ms-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ background: rgba(0, 0, 0, 0.10); display: block; text-align: center; color: #b0b0b0; } #back_to_top span:hover { background: rgba(0, 0, 0, 0.60); color: #fff; } #back_to_top span i { font-size: 15px; -webkit-transition: all 0.2s ease 0s; -khtml-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -ms-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ line-height: 42px; } .footer-second { /* End Back To Top */ /* ========================================================================== End Style Footer ========================================================================== */ } .footer-second .textwidget h3 { margin-bottom: 5px; } input[type='text'], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], textarea, select { color: #626262; font-size: 16px; font-weight: 400; padding: 15px 17px; border: 1px solid #ececec; width: 100%; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ line-height: normal; } textarea { height: 240px; max-height: 240px; max-width: 100%; } input[type='text']:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, textarea:focus { border: 1px solid #141414; background-color: inherit; } .form-group { margin-bottom: 10px; /** Contact Form 7 */ } .wpcf7-form { /* ========================================================================== [End] All Style Form ========================================================================== */ } .wpcf7-form .wpcf7-form-item { margin-bottom: 24px; } .wpcf7-form input[type='text'], .wpcf7-form input[type="password"], .wpcf7-form input[type="datetime"], .wpcf7-form input[type="datetime-local"], .wpcf7-form input[type="date"], .wpcf7-form input[type="month"], .wpcf7-form input[type="time"], .wpcf7-form input[type="week"], .wpcf7-form input[type="number"], .wpcf7-form input[type="email"], .wpcf7-form input[type="url"], .wpcf7-form input[type="search"], .wpcf7-form input[type="tel"], .wpcf7-form input[type="color"], .wpcf7-form textarea, .wpcf7-form select { color: #fff; font-size: 12px; font-weight: 400; padding: 10px 5px; border: none; border-bottom: 1px solid rgba(255, 255, 255, 0.3); width: 100%; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ line-height: normal; background-color: transparent; margin-bottom: 45px; font-style: italic; } .wpcf7-form textarea { height: 150px; } .wpcf7-form .form-action { text-align: right; } .wpcf7-form .form-action .wpcf7-form-control { float: right; } .wpcf7-form .form-action .wpcf7-submit { letter-spacing: 0.4em; font-size: 14px; padding: 19px 38px; line-height: 1.1; } .wpcf7-form .form-action .wpcf7-submit:hover, .wpcf7-form .form-action .wpcf7-submit:focus { background: #fff !important; } .wpcf7-form .wpcf7-form-control-wrap { display: block; } .wpcf7-form .wpcf7-form-control-wrap .wpcf7-textarea + .wpcf7-not-valid-tip { bottom: -1px; } .wpcf7-form .wpcf7-not-valid-tip { font-size: 12px; position: absolute; right: 15px; bottom: 3px; color: #3d72a4; } .wpcf7-form .wpcf7-validation-errors { display: block; text-align: center; margin: 20px 0 0; border: 1px solid #3d72a4; color: #fff; } .wpcf7-form .wpcf7-response-output { text-align: center; } body { overflow-x: hidden; } body.remove-margin-top { margin-top: 0; } .align-center { text-align: center; } .align-left { text-align: left; } .align-right { text-align: right; } .left { float: left; } .right { float: right; } .entry-page-image { margin-bottom: 14px; } #main #page-default { position: relative; } @media screen and (min-width: 1200px) { #main #page-default.container-fluid { padding-left: 0; padding-right: 0; } } a, a:hover, a:focus { outline: none; text-decoration: none; -webkit-transition: all 300ms linear 0ms; -khtml-transition: all 300ms linear 0ms; -moz-transition: all 300ms linear 0ms; -ms-transition: all 300ms linear 0ms; -o-transition: all 300ms linear 0ms; transition: all 300ms linear 0ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } h1, h2, h3, h4, h5, h6 { margin: 0 0 15px; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #3d72a4; } p { margin: 0 0 15px; } img { height: auto; max-width: 100%; } .w50 { float: left; width: 50%; } body .wpb_content_element, body .wpb_button { margin: 0 auto; } @media screen and (max-width: 991px) { .zo-row-full-width .no-container { padding-left: 15px; padding-right: 15px; } } .zo-row-full-width .no-container .row { margin: 0; } .zo-row-full-width .no-container .row .vc_column_container { padding: 0; } @media screen and (min-width: 992px) { #page-default.container-fluid #primary { margin: 0px; } } .no-container > .row { margin: 0; } .bg-effect-lg, .wpb_accordion.wpb_content_element .wpb_accordion_wrapper .wpb_accordion_header, .zo-progress-layout-default .zo-progress-main .zo-progress .progress-bar, .bg-effect-sm { background: repeat-y center center; background-size: 100%; } .bg-position-center { background-position: center center !important; } .bg-dark-inset .wpb_wrapper { background: #060606; } .bg-main-inset .wpb_wrapper { background: #3d72a4; } .wrap-btn-inline { display: inline-block; margin-right: 20px; /* ========================================================================== [End] 1. Reset HTML/CSS, Unitest, Body ========================================================================== */ /* ========================================================================== [Start] 2. Page Title ========================================================================== */ } @media screen and (max-width: 479px) { .wrap-btn-inline { margin-right: 0px; } .wrap-btn-inline + .wrap-btn-inline { margin-top: 20px; } } #zo-page-element-wrap { max-height: 765px; border-bottom: 8px solid #3d72a4; } @media screen and (max-width: 767px) { #zo-page-element-wrap div.page-title-breadcrumb-wrap { padding: 60px; } } #page-title-text h1 { padding: 0; text-transform: uppercase; margin: 0 0 12px; } #page-title-text .page-sub-title { margin: 0 0 75px; padding: 0; } @media screen and (max-width: 767px) { div.page-title #page-title-text h1 { font-size: 24px; } } #breadcrumb { /* ========================================================================== [End] 2. Page Title ========================================================================== */ /* ========================================================================== [Start] 3. Primary ========================================================================== */ /* ----> List Style */ } #breadcrumb #breadcrumb-text .breadcrumbs { margin: 0; padding: 0; } #breadcrumb #breadcrumb-text .breadcrumbs li { padding: 0 9px 0 14px; display: inline-block; position: relative; } #breadcrumb #breadcrumb-text .breadcrumbs li:after { content: "/"; font-size: 15px; position: absolute; right: -6px; } #breadcrumb #breadcrumb-text .breadcrumbs li:first-child { padding-left: 0; } #breadcrumb #breadcrumb-text .breadcrumbs li:last-child { padding-right: 0; } #breadcrumb #breadcrumb-text .breadcrumbs li:last-child:after { content: ""; } #breadcrumb #breadcrumb-text .breadcrumbs li a:hover { color: #3d72a4; } .list-style-check li { color: #9c9c9c; line-height: 31px; position: relative; padding-left: 36px; } .list-style-check li:before { content: "\f00c"; font-family: FontAwesome; color: #fff; font-size: 18px; position: absolute; top: 1px; left: 4px; z-index: 1; } .list-style-check li:after { content: ""; width: 24px; height: 24px; display: inline-block; background-color: #db5896; -webkit-border-radius: 2px; -khtml-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; /* BACKGROUND GRADIENT */ border: 2px solid #ba2b6f; position: absolute; top: 4px; left: 0; } .list-style-check.green { /* ----> End List Style */ /* ----> VC Row Overlay Color */ } .list-style-check.green li:after { background-color: #81b748; border-color: #5a951b; } .entry-content .wpb_row { /* ----> End VC Row Overlay Color */ /* ----> VC Row Backgrund Color Custom */ } .entry-content .wpb_row.background-image-fixed { overflow: hidden; position: inherit; } .entry-content .wpb_row.background-image-fixed .zo-overlay-color { height: 3000px; left: 0; position: relative; margin-bottom: -3000px; width: 100%; -webkit-transform: translateY(-20%); -khtml-transform: translateY(-20%); -moz-transform: translateY(-20%); -ms-transform: translateY(-20%); -o-transform: translateY(-20%); transform: translateY(-20%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .entry-content .wpb_row .zo-overlay-color { position: absolute; height: 100%; width: 100%; top: 0; left: 0; } .row-custom-bg-color { position: relative; /* ----> End VC Row Backgrund Color Custom */ } .row-custom-bg-color .zo-custom-bg-left, .row-custom-bg-color .zo-custom-bg-right { position: absolute; top: 0; left: 0; width: 50%; height: 100%; } .row-custom-bg-color .zo-custom-bg-right { left: inherit; right: 0; } .zo-row-arrow { border: 20px solid; bottom: 0; height: 20px; left: 0; margin: auto; position: absolute; right: 0; width: 38px; } .row-arrow-top .zo-row-arrow { bottom: inherit; top: 0; border-bottom-color: transparent; border-left-color: transparent; border-right-color: transparent; } .row-arrow-top .zo-row-arrow:hover { cursor: pointer; } .row-overlay-color, .zo_parallax { position: relative; } .row-arrow-bottom .zo-row-arrow { border-top-color: transparent; border-left-color: transparent; border-right-color: transparent; } .row-arrow-bottom .zo-row-arrow:hover { cursor: pointer; } #zo-loadding { background: #fff; height: 100%; position: fixed; width: 100%; z-index: 1000; top: 0; /* [Start] Eror Page ==============================================================*/ } #zo-loadding .ball { position: absolute; left: 0; right: 0; margin: auto; top: 50%; -webkit-transform: translate(0px, -50%); -khtml-transform: translate(0px, -50%); -moz-transform: translate(0px, -50%); -ms-transform: translate(0px, -50%); -o-transform: translate(0px, -50%); transform: translate(0px, -50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .error404 { /* [End] Eror Page ==============================================================*/ } .error404 #main { padding: 0 !important; } .error404 #main #primary { background-color: #3d72a4; padding: 160px 0; } .error404 .entry-error404 { text-align: center; color: #333; } .error404 .entry-error404 .entry-header img { margin-bottom: 40px; } .error404 .entry-error404 .entry-header h1 { font-size: 50px; color: #333; } .error404 .entry-error404 .entry-header h2 { color: #333; font-size: 30px; line-height: 50px; } .error404 .entry-error404 .entry-content { padding: 20px 0; } .error404 .entry-error404 .entry-footer .btn-home { margin-right: 20px; } .zo-carousel.owl-carousel .owl-item img { width: auto; } .zo-animation { visibility: hidden; } .zo-fancy-box-icon i { line-height: normal; /* ----> Fancy Layout 1 Default */ } .zo-fancybox-layout-default { /* ========================================================================== [End] 1. Shortcode Fancy Box ========================================================================== */ /* ========================================================================== [Start] 2. Shortcode Pie Chart ========================================================================== */ /* ========================================================================== [End] 2. Shortcode Pie Chart ========================================================================== */ /* ========================================================================== [Start] 3. Team ========================================================================== */ /* ========================================================================== [End] 3. Team ========================================================================== */ /* ========================================================================== [Start] 4. Testimonial ========================================================================== */ /* ========================================================================== [End] 4. Testimonial ========================================================================== */ /* ========================================================================== [Start] 5. Tabs ========================================================================== */ /* ========================================================================== [End] 5. Tabs ========================================================================== */ /* ========================================================================== [Start] 6. Counter ========================================================================== */ } .zo-fancybox-layout-default .zo-fancybox-inner { text-align: center; border: 1px solid #3d72a4; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; /* BACKGROUND GRADIENT */ padding: 15px 10px; min-height: 230px; margin-bottom: 20px; overflow: hidden; position: relative; } .zo-fancybox-layout-default .zo-fancybox-inner:after { position: absolute; content: ''; top: 0; left: 0; height: 100%; width: 100%; background: #3d72a4; background: rgba(61, 114, 164, 0.2); /* COLOR OPACITY */ filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -webkit-opacity: 0; -khtml-opacity: 0; -moz-opacity: 0; -ms-opacity: 0; -o-opacity: 0; opacity: 0; /* BACKGROUND GRADIENT */ /* OUTLINE RADIUS */ -webkit-transition: opacity 200ms; -khtml-transition: opacity 200ms; -moz-transition: opacity 200ms; -ms-transition: opacity 200ms; -o-transition: opacity 200ms; transition: opacity 200ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .zo-fancybox-layout-default .zo-fancybox-inner:hover:after { filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -webkit-opacity: 1; -khtml-opacity: 1; -moz-opacity: 1; -ms-opacity: 1; -o-opacity: 1; opacity: 1; /* BACKGROUND GRADIENT */ /* OUTLINE RADIUS */ cursor: pointer; } .zo-fancybox-layout-default .zo-fancybox-inner .zo-fancy-box-content-icon i, .zo-fancybox-layout-default .zo-fancybox-inner .zo-fancy-box-image span { display: inline-block; color: #3d72a4; text-align: center; font-size: 40px; } .zo-fancybox-layout-default .zo-fancybox-inner .zo-fancy-box-content-icon, .zo-fancybox-layout-default .zo-fancybox-inner .zo-fancy-box-image { margin-bottom: 20px; } .zo-fancybox-layout-default .zo-fancybox-inner .zo-fancy-box-image span { line-height: 100px; } .zo-fancybox-layout-default .zo-fancybox-inner .zo-fancy-box-title { margin: 0 0 15px; color: #333; text-transform: uppercase; font-size: 16px; } .zo-counter-wraper { /* ========================================================================== [End] 6. Counter ========================================================================== */ /* ========================================================================== [Start] 7. Accordion ========================================================================== */ } .zo-counter-wraper .zo-counter-box { position: relative; margin: 0 auto; padding-bottom: 20px; } .zo-counter-wraper .zo-counter-box .zo-counter-middle .zo-counter-icon i { color: #3d72a4; } .zo-counter-wraper .zo-counter-box .zo-counter-middle .zo-counter { font-size: 48px; font-weight: 400; line-height: normal; letter-spacing: 0.1em; } .zo-counter-wraper .zo-counter-box .zo-counter-title { margin: 0; font-size: 13px; text-transform: none; font-style: italic; } .zo-counter-wraper.zo-counter-layout-default .zo-counter-body .zo-icon .fa { font-size: 46px; padding-bottom: 20px; } .zo-counter-wraper.zo-counter-layout-default .zo-counter-body .zo-counter { font-size: 30px; margin-bottom: 10px; } .zo-counter-wraper.zo-counter-layout-default .zo-counter-body h3 { font-weight: normal; letter-spacing: 0.1em; color: #6f6f6f; font-style: italic; } .wpb_accordion.wpb_content_element { /* ========================================================================== [End] 7. Accordion ========================================================================== */ /* ========================================================================== [Start] 8. Progress ========================================================================== */ } .wpb_accordion.wpb_content_element .wpb_accordion_wrapper .wpb_accordion_section { margin: 0 0 4px; } .wpb_accordion.wpb_content_element .wpb_accordion_wrapper .wpb_accordion_header { line-height: 50px; padding: 0; margin: 0; border: 2px solid #1a9eb9; -webkit-border-radius: 4px; -khtml-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; /* BACKGROUND GRADIENT */ } .wpb_accordion.wpb_content_element .wpb_accordion_wrapper .wpb_accordion_header .ui-accordion-header-icon { display: none; } .wpb_accordion.wpb_content_element .wpb_accordion_wrapper .wpb_accordion_header.ui-state-active { -webkit-border-radius: 4px 4px 0 0; -khtml-border-radius: 4px 4px 0 0; -moz-border-radius: 4px 4px 0 0; -ms-border-radius: 4px 4px 0 0; -o-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; /* BACKGROUND GRADIENT */ } .wpb_accordion.wpb_content_element .wpb_accordion_wrapper .wpb_accordion_header a { padding: 1em 15px; color: #fff; font-size: 21px; line-height: 25px; font-weight: 700; -webkit-box-shadow: none 2px 5px rgba(0, 0, 0, .4); -khtml-box-shadow: none 2px 5px rgba(0, 0, 0, .4); -moz-box-shadow: none 2px 5px rgba(0, 0, 0, .4); -ms-box-shadow: none 2px 5px rgba(0, 0, 0, .4); -o-box-shadow: none 2px 5px rgba(0, 0, 0, .4); box-shadow: none 2px 5px rgba(0, 0, 0, .4); /* BACKGROUND GRADIENT */ /* BOX SIZING */ } .wpb_accordion.wpb_content_element .wpb_accordion_wrapper .wpb_accordion_header a i { font-size: 18px; padding-right: 12px; padding-left: 2px; } .wpb_accordion.wpb_content_element .wpb_accordion_wrapper .wpb_accordion_content { padding: 10px 20px !important; border-width: 0 2px 2px 2px; border-style: solid; -webkit-border-radius: 0 0 4px 4px; -khtml-border-radius: 0 0 4px 4px; -moz-border-radius: 0 0 4px 4px; -ms-border-radius: 0 0 4px 4px; -o-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; /* BACKGROUND GRADIENT */ } .zo-progress-wraper .progress .progress-bar { transition-duration: 1s; } .zo-progress-layout-default { padding-top: 40px; /* ========================================================================== [End] 8. Progress ========================================================================== */ /* ========================================================================== [Start] 9. Pricing ========================================================================== */ } .zo-progress-layout-default .zo-progress-main.bar-icon { padding-left: 50px; position: relative; } .zo-progress-layout-default .zo-progress-main .zo-progress-icon { position: absolute; left: 0; } .zo-progress-layout-default .zo-progress-main .zo-progress-icon i { color: #8f8f8f; font-size: 34px; } .zo-progress-layout-default .zo-progress-main .zo-progress { overflow: visible; background-color: #3d72a4; border: 2px solid #3d72a4; height: 38px; width: 100%; position: relative; margin: 0 0 10px; -webkit-box-shadow: none 2px 5px rgba(0, 0, 0, .4); -khtml-box-shadow: none 2px 5px rgba(0, 0, 0, .4); -moz-box-shadow: none 2px 5px rgba(0, 0, 0, .4); -ms-box-shadow: none 2px 5px rgba(0, 0, 0, .4); -o-box-shadow: none 2px 5px rgba(0, 0, 0, .4); box-shadow: none 2px 5px rgba(0, 0, 0, .4); /* BACKGROUND GRADIENT */ /* BOX SIZING */ -webkit-border-radius: 3px; -khtml-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; /* BACKGROUND GRADIENT */ } .zo-progress-layout-default .zo-progress-main .zo-progress .zo-progress-title { position: absolute; top: 50%; left: 15px; font-size: 18px; font-weight: 700; color: #fff; z-index: 1; -webkit-transform: translate(0px, -50%); -khtml-transform: translate(0px, -50%); -moz-transform: translate(0px, -50%); -ms-transform: translate(0px, -50%); -o-transform: translate(0px, -50%); transform: translate(0px, -50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .zo-progress-layout-default .zo-progress-main .zo-progress .progress-bar { width: 20%; overflow: visible; -webkit-box-shadow: none 2px 5px rgba(0, 0, 0, .4); -khtml-box-shadow: none 2px 5px rgba(0, 0, 0, .4); -moz-box-shadow: none 2px 5px rgba(0, 0, 0, .4); -ms-box-shadow: none 2px 5px rgba(0, 0, 0, .4); -o-box-shadow: none 2px 5px rgba(0, 0, 0, .4); box-shadow: none 2px 5px rgba(0, 0, 0, .4); /* BACKGROUND GRADIENT */ /* BOX SIZING */ background-color: #3d72a4; line-height: 40px; text-align: right; padding: 0 15px; } .zo-progress-layout-default .zo-progress-main .zo-progress .progress-bar span { color: #fff; font-size: 15px; font-weight: 700; position: absolute; right: -44px; top: -39px; height: 29px; line-height: 28px; padding: 0 8px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; /* BACKGROUND GRADIENT */ } .zo-progress-layout-default .zo-progress-main .zo-progress .progress-bar span:before { position: absolute; height: 0; width: 0; content: ""; border-width: 5px; border-style: solid; bottom: -10px; left: 0; right: 0; margin: auto; } .zo-grid-pricing { /* ========================================================================== [End] 9. Pricing ========================================================================== */ /* ========================================================================== [Start] 10. Zo Grid ========================================================================== */ } .zo-grid-pricing .zo-pricing-item .zo-pricing-inner { text-align: center; border: 1px solid #ececec; -webkit-transition: all 200ms ease-in-out; -khtml-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .zo-grid-pricing .zo-pricing-item .zo-pricing-inner .zo-pricing-meta-wrap { margin-bottom: 40px; } .zo-grid-pricing .zo-pricing-item .zo-pricing-inner .zo-pricing-meta-wrap .option-item { font-size: 12px; line-height: 48px; } .zo-grid-pricing .zo-pricing-item .zo-pricing-inner .zo-pricing-meta-wrap .option-item .fa { padding-left: 20px; color: #3d72a4; } .zo-grid-pricing .zo-pricing-item .zo-pricing-inner .zo-pricing-price-wrap { color: #141414; margin-bottom: 40px; } .zo-grid-pricing .zo-pricing-item .zo-pricing-inner .zo-pricing-price-wrap .price { font-size: 50px; } .zo-grid-pricing .zo-pricing-item .zo-pricing-inner .zo-pricing-price-wrap sup { font-size: 18px; top: -25px; } .zo-grid-pricing .zo-pricing-item .zo-pricing-inner .zo-pricing-price-wrap sub { font-size: 14px; font-style: italic; text-transform: lowercase; } .zo-grid-wraper { /* ========================================================================== [End] 10. Zo Grid ========================================================================== */ /* ========================================================================== [Start] 10. Zo Masonry ========================================================================== */ } .zo-grid-wraper .zo-grid-filter { margin-bottom: 40px; } .zo-grid-wraper .zo-grid-filter ul { padding: 0; margin: 0; list-style: none inside; text-align: center; } .zo-grid-wraper .zo-grid-filter ul li { display: inline-block; margin-bottom: 16px; } .zo-grid-wraper .zo-grid-filter ul li a { border: 1px solid #dedede; font-size: 10px; font-weight: 600; padding: 5px 25px; text-transform: uppercase; letter-spacing: 0.1em; } .zo-grid-wraper .zo-grid-filter ul li a.active, .zo-grid-wraper .zo-grid-filter ul li a:hover { border-color: #3d72a4; } .zo-grid-wraper .zo-grid-filter ul li + li { margin-left: 16px; } .zo-grid-wraper.no-padding .zo-grid .zo-grid-item { padding: 0; margin: 0; } .zo-grid-wraper.no-padding .zo-grid .zo-grid-item .zo-team-wrap { padding-bottom: 0; } .zo-masonry-wrapper { /* ========================================================================== [End] 10. Zo Masonry ========================================================================== */ /* ========================================================================== [Start] 11. Images Carousel ========================================================================== */ } .zo-masonry-wrapper .zo-masonry-filter { margin-bottom: 40px; } .zo-masonry-wrapper .zo-masonry-filter ul { padding: 0; margin: 0; list-style: none inside; text-align: center; } .zo-masonry-wrapper .zo-masonry-filter ul li { display: inline-block; margin-right: 16px; margin-top: 15px; } .zo-masonry-wrapper .zo-masonry-filter ul li a { display: block; font-size: 10px; padding: 5px 25px; border: 1px solid #dedede; text-transform: uppercase; font-weight: normal; } .zo-masonry-wrapper .zo-masonry-filter ul li a.active, .zo-masonry-wrapper .zo-masonry-filter ul li a:hover { border-color: #3d72a4; } .wpb_images_carousel .vc_item { text-align: center; } .wpb_images_carousel .vc_images_carousel.vc_per-view-more .vc_carousel-slideline .vc_carousel-slideline-inner > .vc_item > .vc_inner { padding: 0; margin: 0; } .wpb_images_carousel.overlay .vc_item img, .wpb_images_carousel.overlay .slick-slide img { opacity: 0.6; } .wpb_images_carousel.overlay .vc_item:hover img, .wpb_images_carousel.overlay .slick-slide:hover img { opacity: 1; } .wpb_images_carousel.green .slick-dots li.slick-active button::before { color: #3d72a4; } .wpb_images_carousel .slick-dots li.slick-active button::before { color: #3d72a4; } .wpb_images_carousel .vc_slide .vc_carousel-control { border-radius: 100%; border: 2px solid #fff; display: block; height: 50px; opacity: 1; width: 50px; line-height: 47px; margin: 0; top: 50%; color: #fff; text-shadow: none; -webkit-transform: translate(0px, -50%); -khtml-transform: translate(0px, -50%); -moz-transform: translate(0px, -50%); -ms-transform: translate(0px, -50%); -o-transform: translate(0px, -50%); transform: translate(0px, -50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ text-shadow: none 2px 5px rgba(0, 0, 0, .4); /* TRANSFORM */ font-size: 22px; } .wpb_images_carousel .vc_slide .vc_carousel-control:hover { background-color: rgba(255, 255, 255, 0.5); } .wpb_images_carousel .vc_slide .vc_carousel-control span { display: none; } .wpb_images_carousel .vc_slide .vc_carousel-control.vc_left { left: 15px; } .wpb_images_carousel .vc_slide .vc_carousel-control.vc_left:before { content: "\f053"; font-family: FontAwesome; } .wpb_images_carousel .vc_slide .vc_carousel-control.vc_right { right: 15px; } .wpb_images_carousel .vc_slide .vc_carousel-control.vc_right:before { content: "\f054"; font-family: FontAwesome; } @media screen and (max-width: 767px) { .wpb_images_carousel .vc_images_carousel .vc_carousel-inner .vc_carousel-slideline { width: 100% !important; } .wpb_images_carousel .vc_images_carousel .vc_carousel-inner .vc_carousel-slideline .vc_carousel-slideline-inner .vc_item { width: 100% !important; height: auto !important; } .wpb_images_carousel .vc_images_carousel .vc_carousel-inner .vc_carousel-slideline .vc_carousel-slideline-inner .vc_item + .vc_item { margin-top: 50px; } .wpb_images_carousel.about-us-carousel-2 .vc_images_carousel .vc_carousel-inner .vc_carousel-slideline .vc_carousel-slideline-inner .vc_item + .vc_item { margin-top: 0px; } } @media screen and (max-width: 991px) { /* ========================================================================== [End] 11. Images Carousel ========================================================================== */ /** [Start]Heading page ============================*/ .wpb_images_carousel .zo_images_carousel-wrap { text-align: center; } .wpb_images_carousel .zo_images_carousel-wrap .zo_images_carousel > div + div { margin-top: 50px; } } .heading { /** [End]Heading page ============================*/ /** [Start]List shortcode page ============================*/ } .heading h1, .heading h2, .heading h3, .heading h4, .heading h5, .heading h6 { text-transform: uppercase; } .list a { color: #868686; padding-left: 20px; } .list li { list-style: none inside; } .list li:before { content: "\f067"; height: 1px; color: #3d72a4; font: normal normal normal 14px/1 FontAwesome; } .list-right { /** [End]List shortcode page*/ /** [Start]Heading Accordion Toggle page*/ } .list-right a { color: #868686; padding-left: 20px; } .list-right li { list-style: none inside; } .list-right li:before { content: "\f111"; height: 1px; color: #3d72a4; font-size: 10px ! important; font: normal normal normal 14px/1 FontAwesome; } .wpb_accordion_section { /** [End]Heading Accordion Toggle page*/ /** [Start] charts page*/ } .wpb_accordion_section .wpb_accordion_header { background: #f8f8f8; border: none ! important; border-radius: 0 ! important; } .wpb_accordion_section .wpb_accordion_header:hover { background: #3d72a4 ! important; } .wpb_accordion_section .wpb_accordion_header a { font-weight: 400; letter-spacing: 2px; font-size: 14px ! important; color: #333 ! important; text-transform: uppercase ! important; } .wpb_accordion_section .wpb_accordion_header.ui-state-active { background: #3d72a4 ! important; border-radius: 0 ! important; } .wpb_accordion_section .wpb_accordion_content { border: none ! important; padding: 0 ! important; } .vc_pie_chart .vc_pie_wrapper { margin-bottom: 40px ! important; } .vc_progress_bar { /** [End]charts page*/ /** [Start] text highlight page*/ } .vc_progress_bar .vc_single_bar { margin-bottom: 60px; border-radius: 0; background: none !important; box-shadow: none !important; } .vc_progress_bar .vc_single_bar .vc_bar_wrap { background: #909090 none repeat scroll 0 0; border-radius: 3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset; width: 100%; height: 15px; position: relative; } .vc_progress_bar .vc_single_bar .vc_bar_wrap .vc_bar { border-radius: 0; } .vc_progress_bar .vc_single_bar .vc_label { font-size: 11px; padding-left: 0 !important; padding-right: 0 !important; color: #333 ! important; } .vc_progress_bar .vc_single_bar .vc_label .vc_percent { float: right; font-size: 11px; } .vc_progress_bar .vc_single_bar .vc_label .vc_percent:after { color: #909090; content: "\f0d7"; font-family: FontAwesome; font-size: 16px; margin-left: 10px; } .highlight1 mark { background: #3d72a4; } .highlight2 mark { background: #3d72a4; color: #fff; } .highlight3 mark { background: #fff; color: #808080; } .highlight4 { /** [End]charthighlights page*/ /** Custome Heading ================================================*/ } .highlight4 mark { background: #3d72a4; color: #333; } .zo-custom-heading { /** Carousel Wrap ================================================*/ } .zo-custom-heading .center { text-align: center; } .zo-custom-heading .left { text-align: left; } .zo-custom-heading .right { float: none; text-align: right; } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background-color: #3d72a4 !important; } .zo-carousel-purchase .vc_btn3-container .vc_btn3 { background: #fff; display: inline-block; width: 100%; } @media (min-width: 768px) and (max-width: 799px) { .zo-carousel-purchase .vc_btn3-container .vc_btn3 { padding: 16px 26px !important; } } @media (min-width: 800px) and (max-width: 979px) { .zo-carousel-purchase .vc_btn3-container .vc_btn3 { padding: 16px 30px !important; } } .zo-carousel-purchase .vc_btn3-container .vc_btn3:hover { color: #fff !important; background: #3d72a4; } .zo-carousel-wrap { /** Features ================================================*/ } .zo-carousel-wrap .zo-carousel { display: none; } .zo-carousel-wrap .zo-carousel.owl-carousel { display: block; -webkit-animation: 0.7s ease zoFadeIn; -khtml-animation: 0.7s ease zoFadeIn; -moz-animation: 0.7s ease zoFadeIn; -ms-animation: 0.7s ease zoFadeIn; -o-animation: 0.7s ease zoFadeIn; animation: 0.7s ease zoFadeIn; /* BACKGROUND GRADIENT */ /*///////////////////////////////////ANIMATION//////////////////////////////////*/ } .zo-carousel-wrap .zo-carousel-filter ul { margin-bottom: 40px; text-align: center; padding: 0; list-style: none; } .zo-carousel-wrap .zo-carousel-filter ul li { border: 1px solid #696969; display: inline-block; margin-right: 16px; margin-bottom: 5px; } @media screen and (max-width: 767px) { .zo-carousel-wrap .zo-carousel-filter ul li { margin-right: 0; } } .zo-carousel-wrap .zo-carousel-filter ul li a { padding: 5px 15px; text-transform: uppercase; display: block; color: #fff; } .zo-carousel-wrap .zo-carousel-filter ul li a:hover { color: #3d72a4; } .list-icon li, .list-primary li, .list-number li { font-size: 12px; margin-bottom: 15px; } .list-icon li .fa, .list-primary li .fa, .list-number li .fa { font-size: 18px; } .list-icon { list-style: none; padding-left: 0; } .list-icon .fa { background: #909090; border-radius: 50%; color: #fff; font-size: 15px; height: 25px; line-height: 22px; text-align: center; vertical-align: middle; width: 25px; margin-right: 14px; } .list-primary { list-style: none; padding-left: 0; } .list-primary .fa { color: #3d72a4; margin-right: 24px; } .list-number { list-style: none; padding-left: 0; counter-reset: numList; overflow: hidden; /** * VC Images Carousel * Slick Slider **/ } .list-number li { padding-left: 48px; } .list-number li:before { border: 1px solid #ededed; border-radius: 50%; color: #141414; content: counter(numList); counter-increment: numList; height: 25px; left: 17px; line-height: 25px; position: absolute; text-align: center; width: 25px; } .zo_images_carousel-wrap { /*[Start Style zo-grid-gallery]*/ } .zo_images_carousel-wrap .zo_images_carousel .slick-list .slick-slide { text-align: center; outline: none; } .zo_images_carousel-wrap .zo_images_carousel .slick-list .slick-slide img { display: inline-block; } .zo_images_carousel-wrap .slick-slider .slick-arrow { width: 35px; height: 35px; text-align: center; line-height: 35px; z-index: 99; background-color: #fff; } .zo_images_carousel-wrap .slick-slider .slick-arrow:before { color: #141414; line-height: inherit; } .zo_images_carousel-wrap .slick-slider .slick-arrow.slick-prev { left: 25px; } .zo_images_carousel-wrap .slick-slider .slick-arrow.slick-next { right: 25px; } .zo_images_carousel-wrap .zo_images_carousel_nav.slick-slider .slick-arrow { text-align: center; z-index: 99; top: 0; width: 30px; background-color: #3d72a4; height: 100%; margin: 0; padding: 0; } .zo_images_carousel-wrap .zo_images_carousel_nav.slick-slider .slick-arrow:before { color: #fff; line-height: inherit; } .zo_images_carousel-wrap .zo_images_carousel_nav.slick-slider .slick-arrow.slick-prev { left: 0; } .zo_images_carousel-wrap .zo_images_carousel_nav.slick-slider .slick-arrow.slick-next { right: 0; } .zo_images_carousel-wrap .zo_images_carousel_nav.slick-slider .slick-slide { padding: 0 5px; } .zo_images_carousel-wrap .zo_images_carousel_nav.slick-slider .slick-slide.slick-current span { position: relative; display: block; } .zo_images_carousel-wrap .zo_images_carousel_nav.slick-slider .slick-slide.slick-current span:before { content: ''; background: #3d72a4; background: rgba(61, 114, 164, 0.8); /* COLOR OPACITY */ position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .zo-grid-gallery { /*[End Style zo-grid-gallery]*/ /*[Start 13. template-zo_grid--car-dealer-gallery-fullwidth ]*/ } .zo-grid-gallery .zo-grid-filter ul.zo-filter-category { text-align: center; padding: 0; margin: 0 0 31px; } .zo-grid-gallery .zo-grid-filter ul.zo-filter-category li { list-style: none; display: inline-block; position: relative; } .zo-grid-gallery .zo-grid-filter ul.zo-filter-category li:not(:last-child):after { content: ""; background: #000; content: ""; width: 2px; position: absolute; right: 0; height: 15px; top: 8px; } .zo-grid-gallery .zo-grid-filter ul.zo-filter-category li:hover a, .zo-grid-gallery .zo-grid-filter ul.zo-filter-category li:active a { color: #3d72a4; } .zo-grid-gallery .zo-grid-filter ul.zo-filter-category li a { line-height: 30px; font-size: 17px; color: #343434; text-transform: uppercase; font-weight: 700; padding: 0px 10px; } .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item { padding: 0px; } .template-zo_grid--car-dealer-gallery-fullwidth, .template-zo_carousel--new-car, .template-zo_grid--car-dealer-new-car { /*[End 13. template-zo_grid--car-dealer-gallery-fullwidth ]*/ /*[Style Overlay Hover image]*/ } .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item, .template-zo_carousel--new-car .zo-portfolio-item, .template-zo_grid--car-dealer-new-car .zo-portfolio-item, .template-zo_grid--car-dealer-gallery-fullwidth .zo-carousel-item, .template-zo_carousel--new-car .zo-carousel-item, .template-zo_grid--car-dealer-new-car .zo-carousel-item { margin-bottom: 20px !important; position: relative; } .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item.col-lg-2-zo:nth-child(5n-4) .zo-portfolio-overlay, .template-zo_carousel--new-car .zo-portfolio-item.col-lg-2-zo:nth-child(5n-4) .zo-portfolio-overlay, .template-zo_grid--car-dealer-new-car .zo-portfolio-item.col-lg-2-zo:nth-child(5n-4) .zo-portfolio-overlay, .template-zo_grid--car-dealer-gallery-fullwidth .zo-carousel-item.col-lg-2-zo:nth-child(5n-4) .zo-portfolio-overlay, .template-zo_carousel--new-car .zo-carousel-item.col-lg-2-zo:nth-child(5n-4) .zo-portfolio-overlay, .template-zo_grid--car-dealer-new-car .zo-carousel-item.col-lg-2-zo:nth-child(5n-4) .zo-portfolio-overlay, .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item.col-lg-2-zo:nth-child(5n-2) .zo-portfolio-overlay, .template-zo_carousel--new-car .zo-portfolio-item.col-lg-2-zo:nth-child(5n-2) .zo-portfolio-overlay, .template-zo_grid--car-dealer-new-car .zo-portfolio-item.col-lg-2-zo:nth-child(5n-2) .zo-portfolio-overlay, .template-zo_grid--car-dealer-gallery-fullwidth .zo-carousel-item.col-lg-2-zo:nth-child(5n-2) .zo-portfolio-overlay, .template-zo_carousel--new-car .zo-carousel-item.col-lg-2-zo:nth-child(5n-2) .zo-portfolio-overlay, .template-zo_grid--car-dealer-new-car .zo-carousel-item.col-lg-2-zo:nth-child(5n-2) .zo-portfolio-overlay, .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item.col-lg-2-zo:nth-child(5n-0) .zo-portfolio-overlay, .template-zo_carousel--new-car .zo-portfolio-item.col-lg-2-zo:nth-child(5n-0) .zo-portfolio-overlay, .template-zo_grid--car-dealer-new-car .zo-portfolio-item.col-lg-2-zo:nth-child(5n-0) .zo-portfolio-overlay, .template-zo_grid--car-dealer-gallery-fullwidth .zo-carousel-item.col-lg-2-zo:nth-child(5n-0) .zo-portfolio-overlay, .template-zo_carousel--new-car .zo-carousel-item.col-lg-2-zo:nth-child(5n-0) .zo-portfolio-overlay, .template-zo_grid--car-dealer-new-car .zo-carousel-item.col-lg-2-zo:nth-child(5n-0) .zo-portfolio-overlay { background: #f4f4f4; } .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item .zo-portfolio-overlay, .template-zo_carousel--new-car .zo-portfolio-item .zo-portfolio-overlay, .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-portfolio-overlay, .template-zo_grid--car-dealer-gallery-fullwidth .zo-carousel-item .zo-portfolio-overlay, .template-zo_carousel--new-car .zo-carousel-item .zo-portfolio-overlay, .template-zo_grid--car-dealer-new-car .zo-carousel-item .zo-portfolio-overlay { background: #fafafa; } .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner, .template-zo_carousel--new-car .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner, .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner, .template-zo_grid--car-dealer-gallery-fullwidth .zo-carousel-item .zo-portfolio-overlay .zo-portfolio-overlay-inner, .template-zo_carousel--new-car .zo-carousel-item .zo-portfolio-overlay .zo-portfolio-overlay-inner, .template-zo_grid--car-dealer-new-car .zo-carousel-item .zo-portfolio-overlay .zo-portfolio-overlay-inner { padding: 30px 0 35px; text-align: center; width: 100%; height: 100%; } .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title, .template-zo_carousel--new-car .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title, .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title, .template-zo_grid--car-dealer-gallery-fullwidth .zo-carousel-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title, .template-zo_carousel--new-car .zo-carousel-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title, .template-zo_grid--car-dealer-new-car .zo-carousel-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title { margin-bottom: 0px; font-weight: 700; font-size: 17px; text-transform: uppercase; line-height: 30px; } .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title a, .template-zo_carousel--new-car .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title a, .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title a, .template-zo_grid--car-dealer-gallery-fullwidth .zo-carousel-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title a, .template-zo_carousel--new-car .zo-carousel-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title a, .template-zo_grid--car-dealer-new-car .zo-carousel-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title a { color: #000; } .template-zo_grid--car-dealer-about-us, .template-zo_grid--car-dealer-gallery-fullwidth { /*[Start 12. Gallery default template-zo_grid--car-dealer-gallery]*/ } .template-zo_grid--car-dealer-about-us .zo-portfolio-item, .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item { position: relative; } .template-zo_grid--car-dealer-about-us .zo-portfolio-item:hover .zo-grid-media .zo-icon-hover, .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item:hover .zo-grid-media .zo-icon-hover { opacity: 1; -webkit-transition: all 300ms ease-in-out; -khtml-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .template-zo_grid--car-dealer-about-us .zo-portfolio-item:hover .zo-portfolio-overlay, .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item:hover .zo-portfolio-overlay { opacity: 1; -webkit-transition: all 300ms ease-in-out; -khtml-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .template-zo_grid--car-dealer-about-us .zo-portfolio-item:hover .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title a, .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item:hover .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title a { color: #3d72a4; } .template-zo_grid--car-dealer-about-us .zo-portfolio-item .zo-grid-media, .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item .zo-grid-media { position: relative; } @media screen and (max-width: 767px) { .template-zo_grid--car-dealer-about-us .zo-portfolio-item .zo-grid-media img, .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item .zo-grid-media img { width: 100%; } } .template-zo_grid--car-dealer-about-us .zo-portfolio-item .zo-grid-media .zo-icon-hover, .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item .zo-grid-media .zo-icon-hover { text-align: center; opacity: 0; position: absolute; width: 100%; height: 100%; top: 0; -webkit-transition: all 300ms ease-in-out; -khtml-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ background: #000; background: rgba(0, 0, 0, 0.7); /* COLOR OPACITY */ } .template-zo_grid--car-dealer-about-us .zo-portfolio-item .zo-grid-media .zo-icon-hover a, .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item .zo-grid-media .zo-icon-hover a { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -khtml-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .template-zo_grid--car-dealer-about-us .zo-portfolio-item .zo-grid-media .zo-icon-hover a i, .template-zo_grid--car-dealer-gallery-fullwidth .zo-portfolio-item .zo-grid-media .zo-icon-hover a i { color: #3d72a4; background: #fff; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ width: 50px; height: 50px; font-size: 21px; line-height: 50px; } .template-zo_grid--car-dealer-gallery { /*[Start template-zo_grid--car-dealer-about-us]*/ } .template-zo_grid--car-dealer-gallery .zo-portfolio-item .zo-portfolio-inner { position: relative; } .template-zo_grid--car-dealer-gallery .zo-portfolio-item .zo-portfolio-inner:hover .zo-portfolio-overlay { opacity: 1; -webkit-transition: all 300ms ease 0s; -khtml-transition: all 300ms ease 0s; -moz-transition: all 300ms ease 0s; -ms-transition: all 300ms ease 0s; -o-transition: all 300ms ease 0s; transition: all 300ms ease 0s; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ background: #000; background: rgba(0, 0, 0, 0.7); /* COLOR OPACITY */ } .template-zo_grid--car-dealer-gallery .zo-portfolio-item .zo-portfolio-inner:hover .zo-portfolio-overlay .zo-portfolio-overlay-inner { -webkit-transition: all 300ms ease 0s; -khtml-transition: all 300ms ease 0s; -moz-transition: all 300ms ease 0s; -ms-transition: all 300ms ease 0s; -o-transition: all 300ms ease 0s; transition: all 300ms ease 0s; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .template-zo_grid--car-dealer-gallery .zo-portfolio-item .zo-portfolio-inner .zo-portfolio-overlay { opacity: 0; position: absolute; width: 100%; height: 100%; top: 0; } .template-zo_grid--car-dealer-gallery .zo-portfolio-item .zo-portfolio-inner .zo-portfolio-overlay .zo-portfolio-overlay-inner { text-align: center; width: 100%; top: 50%; display: inline-block; position: absolute; text-align: center; -webkit-transform: translateY(-50%); -khtml-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .template-zo_grid--car-dealer-gallery .zo-portfolio-item .zo-portfolio-inner .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title { font-weight: 700; font-size: 17px; text-transform: uppercase; line-height: 30px; margin: 0 0 5px; } .template-zo_grid--car-dealer-gallery .zo-portfolio-item .zo-portfolio-inner .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title a { color: #fffefe; position: relative; padding-bottom: 27px; line-height: 30px; width: 100%; } .template-zo_grid--car-dealer-gallery .zo-portfolio-item .zo-portfolio-inner .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title a:hover { color: #fffefe; } .template-zo_grid--car-dealer-gallery .zo-portfolio-item .zo-portfolio-inner .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title a:after { content: ''; width: 60%; height: 2px; position: absolute; background: #fffefe; left: 50%; -webkit-transform: translateX(-50%); -khtml-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ bottom: 0; } .template-zo_grid--car-dealer-gallery .zo-portfolio-item .zo-portfolio-inner .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-categories { padding: 35px 15px 15px; } .template-zo_grid--car-dealer-gallery .zo-portfolio-item .zo-portfolio-inner .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-categories a { line-height: 30px; font-size: 15px; color: #fffefe; font-family: "Roboto"; font-weight: 400; text-transform: capitalize; } @media screen and (max-width: 767px) { .template-zo_grid--car-dealer-gallery .zo-portfolio-item .zo-portfolio-inner img { width: 100%; } } .template-zo_grid--car-dealer-about-us { /*[End template-zo_grid--car-dealer-about-us]*/ /*[End gallery default]*/ /*[Start Zo Video]*/ } .template-zo_grid--car-dealer-about-us .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner { padding: 20px 0 35px; text-align: center; width: 100%; height: 100%; } .template-zo_grid--car-dealer-about-us .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title { margin-bottom: 0px; font-weight: 700; font-size: 17px; text-transform: uppercase; line-height: 30px; padding-bottom: 10px; border-bottom: 2px solid #d5d5d5; } .template-zo_grid--car-dealer-about-us .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-title a { color: #000; } .template-zo_grid--car-dealer-about-us .zo-portfolio-item .zo-portfolio-overlay .zo-portfolio-overlay-inner .zo-portfolio-content { padding-top: 15px; font-size: 13px; line-height: 24px; color: #696969; } .zo-video-play-wrapper { /*[End Zo Video]*/ } @media screen and (min-width: 768px) { .zo-video-play-wrapper a.play-button img { min-height: 540px; } } .zo-video-play-wrapper a.play-button span { border: 2px dashed #fff; background-size: 3px 1px; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ padding: 3px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -khtml-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ position: absolute; width: 118px; height: 118px; } .zo-video-play-wrapper a.play-button span:hover { -webkit-transition: all 300ms ease-in-out; -khtml-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ border: 2px dashed #3d72a4; } .zo-video-play-wrapper a.play-button span:hover i { color: #fff; background: #3d72a4; background: rgba(61, 114, 164, 0.7); /* COLOR OPACITY */ } .zo-video-play-wrapper a.play-button span i { width: 100%; height: 100%; font-size: 50px; line-height: 114px; text-indent: 10px; font-weight: 400; text-align: center; color: #3d72a4; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ background: #fff; background: rgba(255, 255, 255, 0.7); /* COLOR OPACITY */ } .zo-custom-width-text { /*[Start Team]*/ } @media screen and (min-width: 1200px) { .zo-custom-width-text { padding-right: calc((100% - 1170px)/ 2) !important; padding-left: 80px !important; } } @media screen and (max-width: 991px) { .zo-custom-width-text { padding-bottom: 80px; } } .zo-team-default { /*[End Team]*/ /*[15 Blog Grid template-zo_grid--blog]*/ } @media screen and (max-width: 767px) { .zo-team-default .zo-grid-item .zo-team-inner { max-width: 390px; margin: 0 auto; } .zo-team-default .zo-grid-item .zo-team-inner div.zo-team-overlay { padding: 30px 0px 20px; } } .zo-team-default .zo-grid-item .zo-team-inner .zo-team-image { position: relative; } .zo-team-default .zo-grid-item .zo-team-inner .zo-team-image:before { opacity: 0; content: ''; position: absolute; width: 100%; height: 100%; left: 0; z-index: 1; top: 0; background: #000; background: rgba(0, 0, 0, 0.7); /* COLOR OPACITY */ } .zo-team-default .zo-grid-item .zo-team-inner .zo-team-image .zo-team-socials { padding-left: 0; text-align: center; position: absolute; bottom: 0; margin-bottom: 30px; width: 100%; opacity: 0; z-index: 2; list-style: none; } .zo-team-default .zo-grid-item .zo-team-inner .zo-team-image .zo-team-socials li { display: inline-block; } .zo-team-default .zo-grid-item .zo-team-inner .zo-team-image .zo-team-socials li a i { font-size: 17px; line-height: 30px; width: 30px; height: 30px; color: #fff; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ } .zo-team-default .zo-grid-item .zo-team-inner .zo-team-image .zo-team-socials li a:hover i { background: #fa2929; -webkit-transition: all 300ms ease-in-out; -khtml-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .zo-team-default .zo-grid-item .zo-team-inner .zo-team-overlay { padding: 30px 40px 20px; } .zo-team-default .zo-grid-item .zo-team-inner .zo-team-overlay .zo-team-overlay-inner .zo-team-title { font-size: 17px; line-height: 30px; font-weight: 700; padding-bottom: 0; } .zo-team-default .zo-grid-item .zo-team-inner .zo-team-overlay .zo-team-overlay-inner .zo-team-position { font-size: 13px; line-height: 22px; color: #3d72a4; padding-bottom: 10px; } .zo-team-default .zo-grid-item .zo-team-inner .zo-team-overlay .zo-team-overlay-inner .zo-team-content { font-size: 13px; color: #696969; line-height: 22px; } .zo-team-default .zo-grid-item .zo-team-inner:hover { cursor: pointer; } .zo-team-default .zo-grid-item .zo-team-inner:hover .zo-team-image .zo-team-socials { opacity: 1; } .zo-team-default .zo-grid-item .zo-team-inner:hover .zo-team-image:before { opacity: 1; -webkit-transition: all 300ms ease-in-out; -khtml-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .template-zo_grid--blog { /*[End Blog Grid]*/ /*[Style Car New]*/ } .template-zo_grid--blog .zo-grid-item .post-teaser .zo-blog-detail { padding: 0px; } .template-zo_grid--car-dealer-new-car { /*[Style Car New Carousel]*/ } .template-zo_grid--car-dealer-new-car .zo-portfolio-item.zo-no-padding { padding: 0px; } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-grid-media { position: relative; } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-grid-media .zo-car-deals-image { position: relative; } @media screen and (max-width: 767px) { .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-grid-media .zo-car-deals-image img { width: 100% !important; } } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-grid-media .zo-car-deals-image .pro-stick-sale { background: #f00; border: 1px solid #f00; } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-grid-media .zo-car-deals-image .pro-stick-rent { background: #ffae00; border: 1px solid #ffae00; } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-grid-media .zo-car-deals-image .pro-stick { z-index: 5; font-weight: 700; font-size: 13px; line-height: 13px; font-family: Montserrat; position: absolute; top: 20px; right: 10px; text-align: center; width: 49px; height: 49px; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ color: #fff; padding-top: 10px; z-index: 99; } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-grid-media .zo-icon-hover { text-align: center; opacity: 0; position: absolute; width: 100%; height: 100%; top: 0; -webkit-transition: all 300ms ease-in-out; -khtml-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ background: #000; background: rgba(0, 0, 0, 0.7); /* COLOR OPACITY */ } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-grid-media .zo-icon-hover a { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -khtml-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-grid-media .zo-icon-hover a i { color: #3d72a4; background: #fff; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ width: 50px; height: 50px; font-size: 21px; line-height: 50px; } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-grid-media .zo-icon-hover .pro-car-dealer-price { position: absolute; height: 50%; top: 50%; left: 50%; -webkit-transform: translateX(-50%); -khtml-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-grid-media .zo-icon-hover .pro-car-dealer-price span { font-size: 17px; line-height: 30px; font-weight: 700; top: 50%; position: relative; color: #fff; } .template-zo_grid--car-dealer-new-car .zo-portfolio-item:hover .zo-grid-media .zo-icon-hover { opacity: 1; } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-car-overlay-inner { padding: 30px 40px 35px; width: 100%; height: 100%; text-align: left; } @media screen and (max-width: 991px) { .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-car-overlay-inner { padding: 30px 20px 35px; } } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-car-overlay-inner h2 { color: #3d72a4; margin-bottom: 0px; font-weight: 700; font-size: 17px; text-transform: uppercase; line-height: 30px; } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-car-overlay-inner .zo-car-readmore:hover a { color: #3d72a4; } .template-zo_grid--car-dealer-new-car .zo-portfolio-item .zo-car-overlay-inner .zo-car-readmore a { font-weight: 700; font-size: 13px; line-height: 30px; color: #696969; } .template-zo_carousel--new-car { /*Stye blog Home*/ } .template-zo_carousel--new-car .zo-carousel-item.zo-no-padding { padding: 0px; } .template-zo_carousel--new-car .zo-carousel-item .zo-grid-media { position: relative; } .template-zo_carousel--new-car .zo-carousel-item .zo-grid-media .zo-car-deals-image { position: relative; } @media screen and (max-width: 767px) { .template-zo_carousel--new-car .zo-carousel-item .zo-grid-media .zo-car-deals-image img { width: 100% !important; } } .template-zo_carousel--new-car .zo-carousel-item .zo-grid-media .zo-car-deals-image .pro-stick-sale { background: #f00; border: 1px solid #f00; } .template-zo_carousel--new-car .zo-carousel-item .zo-grid-media .zo-car-deals-image .pro-stick-rent { background: #ffae00; border: 1px solid #ffae00; } .template-zo_carousel--new-car .zo-carousel-item .zo-grid-media .zo-car-deals-image .pro-stick { z-index: 5; font-weight: 700; font-size: 13px; line-height: 13px; font-family: Montserrat; position: absolute; top: 20px; right: 10px; text-align: center; width: 49px; height: 49px; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ color: #fff; padding-top: 10px; } .template-zo_carousel--new-car .zo-carousel-item .zo-grid-media .zo-icon-hover { text-align: center; opacity: 0; position: absolute; width: 100%; height: 100%; top: 0; -webkit-transition: all 300ms ease-in-out; -khtml-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ background: #000; background: rgba(0, 0, 0, 0.7); /* COLOR OPACITY */ } .template-zo_carousel--new-car .zo-carousel-item .zo-grid-media .zo-icon-hover a { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -khtml-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .template-zo_carousel--new-car .zo-carousel-item .zo-grid-media .zo-icon-hover a i { color: #3d72a4; background: #fff; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ width: 50px; height: 50px; font-size: 21px; line-height: 50px; } .template-zo_carousel--new-car .zo-carousel-item .zo-grid-media .zo-icon-hover .pro-car-dealer-price { position: absolute; height: 50%; top: 50%; left: 50%; -webkit-transform: translateX(-50%); -khtml-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } .template-zo_carousel--new-car .zo-carousel-item .zo-grid-media .zo-icon-hover .pro-car-dealer-price span { font-size: 17px; line-height: 30px; font-weight: 700; top: 50%; position: relative; color: #fff; } .template-zo_carousel--new-car .zo-carousel-item:hover .zo-grid-media .zo-icon-hover { opacity: 1; } .template-zo_carousel--new-car .zo-carousel-item .zo-car-overlay-inner { padding: 30px 40px 35px; width: 100%; height: 100%; text-align: left; } @media screen and (max-width: 991px) { .template-zo_carousel--new-car .zo-carousel-item .zo-car-overlay-inner { padding: 30px 20px 35px; } } .template-zo_carousel--new-car .zo-carousel-item .zo-car-overlay-inner h2 { margin-bottom: 0px; font-weight: 700; font-size: 17px; text-transform: uppercase; line-height: 30px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .template-zo_carousel--new-car .zo-carousel-item .zo-car-overlay-inner h2 a { color: #3d72a4; } .template-zo_carousel--new-car .zo-carousel-item .zo-car-overlay-inner .zo-car-readmore:hover a { color: #3d72a4; } .template-zo_carousel--new-car .zo-carousel-item .zo-car-overlay-inner .zo-car-readmore a { font-weight: 700; font-size: 13px; line-height: 30px; color: #696969; } .template-zo_grid--blog-home { /*Style Carousel template-zo_carousel--testimonial*/ } .template-zo_grid--blog-home .post-teaser { border-bottom: 0; margin-bottom: 0; } .template-zo_grid--blog-home .post-teaser .zo-blog-detail { padding: 0px; } .template-zo_grid--blog-home .post-teaser .zo-blog-detail .zo-blog-title { font-size: 17px; text-transform: uppercase; } .template-zo_grid--blog-home .post-teaser .zo-blog-detail .zo-blog-content { font-size: 13px; line-height: 24px; margin-bottom: 0; } .template-zo_grid--blog-home .post-teaser . .zo-blog-video iframe { max-height: 262px; } .zo-carousel.template-zo_carousel--testimonial { position: relative; /*End template-zo_carousel--testimonial*/ } .zo-carousel.template-zo_carousel--testimonial .owl-stage-outer .owl-stage .owl-item { text-align: center; padding: 0 100px; } @media screen and (max-width: 767px) { .zo-carousel.template-zo_carousel--testimonial .owl-stage-outer .owl-stage .owl-item { padding: 0 40px; } } .zo-carousel.template-zo_carousel--testimonial .owl-stage-outer .owl-stage .owl-item .zo-carousel-item .zo-carousel-description { font-size: 17px; line-height: 25px; font-style: italic; font-family: Roboto; margin-bottom: 30px; max-width: 830px; margin: 0 auto; } .zo-carousel.template-zo_carousel--testimonial .owl-stage-outer .owl-stage .owl-item .zo-carousel-item .zo-grid-media img { margin: 0 auto; padding-bottom: 10px; } .zo-carousel.template-zo_carousel--testimonial .owl-stage-outer .owl-stage .owl-item .zo-carousel-item .zo-carousel-title span { font-size: 17px; line-height: 30px; } .zo-carousel.template-zo_carousel--testimonial .owl-stage-outer .owl-stage .owl-item .zo-carousel-item .zo-carousel-title .zo-title { font-weight: 700; } .zo-carousel.template-zo_carousel--testimonial .owl-nav .owl-prev, .zo-carousel.template-zo_carousel--testimonial .owl-nav .owl-next { position: absolute; transform: translateY(-50%); top: 35px; width: 50px; height: 50px; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ background: transparent; border: 2px solid #969696; } @media screen and (max-width: 479px) { .zo-carousel.template-zo_carousel--testimonial .owl-nav .owl-prev, .zo-carousel.template-zo_carousel--testimonial .owl-nav .owl-next { transform: translateY(-80%); top: 80%; } } .zo-carousel.template-zo_carousel--testimonial .owl-nav .owl-prev i, .zo-carousel.template-zo_carousel--testimonial .owl-nav .owl-next i { text-align: center; line-height: 40px; font-size: 32px; color: #969696; } .zo-carousel.template-zo_carousel--testimonial .owl-nav .owl-prev:hover, .zo-carousel.template-zo_carousel--testimonial .owl-nav .owl-next:hover { border: 2px solid #3d72a4; background: #3d72a4; -webkit-transition: all 200ms ease-in-out; -khtml-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .zo-carousel.template-zo_carousel--testimonial .owl-nav .owl-prev:hover i, .zo-carousel.template-zo_carousel--testimonial .owl-nav .owl-next:hover i { color: #fff; } .zo-carousel.template-zo_carousel--testimonial .owl-prev { left: 5px; } .zo-carousel.template-zo_carousel--testimonial .owl-next { right: 5px; } .template-zo_fancybox_single--services { /*Plugin Car Dealer*/ } .template-zo_fancybox_single--services .zo-fancyboxes-body.zo_font_service .zo-fancybox-item .fancybox-header:hover { cursor: pointer; } .template-zo_fancybox_single--services .zo-fancyboxes-body.zo_font_service .zo-fancybox-item .fancybox-header:hover .fancybox-icon { -webkit-transition: all 400ms ease-in-out; -khtml-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -ms-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ background: #3d72a4; border: 2px solid #3d72a4; } .template-zo_fancybox_single--services .zo-fancyboxes-body.zo_font_service .zo-fancybox-item .fancybox-header:hover .fancybox-icon i { color: #fff; } .template-zo_fancybox_single--services .zo-fancyboxes-body.zo_font_service .zo-fancybox-item .fancybox-header:hover .fancybox-title { color: #3d72a4; } .template-zo_fancybox_single--services .zo-fancyboxes-body.zo_font_service .zo-fancybox-item .fancybox-title { color: #696969; line-height: 25px; margin-top: 30px; } .template-zo_fancybox_single--services .zo-fancyboxes-body.zo_font_service .zo-fancybox-item .fancybox-icon { border: 2px solid #696969; } .template-zo_fancybox_single--services .zo-fancyboxes-body.zo_font_service .zo-fancybox-item .fancybox-icon i { color: #696969; } @media screen and (max-width: 479px) { .template-zo_fancybox_single--services .zo-fancyboxes-body .zo-fancybox-item div.fancybox-icon { width: 90px; height: 90px; } .template-zo_fancybox_single--services .zo-fancyboxes-body .zo-fancybox-item div.fancybox-icon i { font-size: 34px; line-height: 90px; } .template-zo_fancybox_single--services .zo-fancyboxes-body .zo-fancybox-item div.fancybox-title { font-size: 15px; } } .template-zo_fancybox_single--services .zo-fancyboxes-body .zo-fancybox-item .fancybox-icon { width: 120px; height: 120px; text-align: center; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; /* BACKGROUND GRADIENT */ border: 2px solid #fff; margin: 0 auto; } .template-zo_fancybox_single--services .zo-fancyboxes-body .zo-fancybox-item .fancybox-icon:hover { -webkit-transition: all 400ms ease-in-out; -khtml-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -ms-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ background: #fff; } .template-zo_fancybox_single--services .zo-fancyboxes-body .zo-fancybox-item .fancybox-icon:hover i { color: #3d72a4; } .template-zo_fancybox_single--services .zo-fancyboxes-body .zo-fancybox-item .fancybox-icon i { font-size: 37px; line-height: 120px; color: #fff; } .template-zo_fancybox_single--services .zo-fancyboxes-body .zo-fancybox-item .fancybox-title { text-transform: uppercase; margin-top: 8px; line-height: 25px; font-weight: 700; font-size: 17px; text-align: center; color: #fff; } .pro-car-dealer-filter .pro-car-title-form { background: #3d72a4; } .pro-car-dealer-filter .pro-group-attributes .noUi-connect { background: #3d72a4; } .pro-car-dealer-filter .pro-group-attributes .noUi-handle { border: 1px solid #3d72a4; background: #3d72a4; } .zo-boxed { /*========================== START PLUGIN PRO CAR DEALER =======================*/ /*Modal Compare product*/ } .zo-boxed .zo-car-overlay-inner { padding: 20px 15px 30px !important; } .zo-boxed .zo-team-overlay { padding: 20px 15px 30px !important; } .zo-modal-wrapper { position: fixed; left: 0; top: 0; background: rgba(0, 0, 0, .8); width: 100%; height: 100%; overflow: auto; /*Style Item Ajax result*/ } .zo-modal-wrapper.zo-modal { opacity: 0; z-index: -10; } .zo-modal-wrapper.zo-modal.open, .zo-modal-wrapper.zo-modal.loading { opacity: 1; z-index: 999; -webkit-transition: all 0.3s ease-out; -khtml-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .zo-modal-wrapper.zo-modal.open .zo-modal-inner { animation: slideUp 0.5s ease; -webkit-animation: slideUp 0.5s ease; opacity: 1; top: 10%; padding: 20px; } .zo-modal-wrapper .zo-modal-inner { width: 90%; max-height: 85%; max-width: 1024px; overflow-y: auto; overflow-x: hidden; border-radius: 1px; background: #fff; position: absolute; left: 50%; top: 10%; margin-bottom: 50px; -webkit-transform: translateX(-50%); -khtml-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ opacity: 0; } .zo-modal-wrapper .zo-modal-inner .pro-modal-close { float: right; color: #000; padding-bottom: 20px; cursor: pointer; } .pro-result-search-ajax { /*End modal*/ /*========================== END PLUGIN PRO CAR DEALER =======================*/ } .pro-result-search-ajax .po-list-carder { margin-bottom: 20px; } .pro-result-search-ajax .paging-navigation { padding-top: 20px; } .pro-result-search-ajax .pro-message-ajax { padding: 5px 10px; background: #3d72a4; } .pro-result-search-ajax .pro-message-ajax .pro-message-content { font-size: 17px; color: #fff; margin: 0px; } .pro-result-search-ajax .pro-car-dealer-item .pro-car-dealer-inner .pro-media-wrapper .pro-car-dealer-media .pro-car-dealer-image .pro-price { z-index: 5; bottom: 20px; left: 10px; position: absolute; font-family: Roboto; font-weight: 400; color: #fff; font-size: 15px; padding: 0px 20px; background: #3d72a4; display: inline-block; } .pro-result-search-ajax .pro-car-dealer-item .pro-car-dealer-inner .pro-media-wrapper .pro-car-dealer-media .pro-car-dealer-image .pro-price.pro-price-rent { background: #ffae00 none repeat scroll 0 0; } .pro-result-search-ajax .pro-car-dealer-item .pro-car-dealer-inner .pro-media-wrapper .pro-car-dealer-media .pro-car-dealer-image .pro-price.pro-price-sale { background: #f00 none repeat scroll 0 0; } img { max-width: 100%; } .alignleft { float: left; } .alignright { float: right; } .aligncenter { display: block; margin-left: auto; margin-right: auto; } .entry-content .wp-caption, .post .wp-caption { text-align: center; } .wp-caption { /* Keep wide captions from overflowing their container. */ max-width: 100%; padding: 4px; } .wp-caption .wp-caption-text, .gallery-caption, .entry-caption { font-style: italic; font-size: 12px; line-height: 2; color: #757575; } img.wp-smiley, .rsswidget img { border: 0; border-radius: 0; box-shadow: none; margin-bottom: 0; margin-top: 0; padding: 0; } .entry-content dl.gallery-item { margin: 0; } .gallery-item a, .gallery-caption { width: 90%; } .gallery-item a { display: block; } .gallery-caption a { display: inline; } .gallery-columns-1 .gallery-item a { max-width: 100%; width: auto; } .gallery .gallery-icon img { height: auto; max-width: 90%; padding: 5%; } .gallery-columns-1 .gallery-icon img { padding: 3%; /* Video background */ } .row-bg-video { position: relative; /** * Slideshow */ } .row-bg-video .zo-bg-video { overflow: hidden; position: absolute; left: 0; top: 0; width: 100% !important; height: 100% !important; } @media screen and (max-width: 768px) { .row-bg-video .zo-bg-video { display: none; } } .row-bg-video .wp-video-shortcode { width: 100% !important; height: auto !important; } .rev_slider_wrapper { /* Slideshow =============================================*/ } .rev_slider_wrapper .tparrows.default { background: none; border: 1px solid rgba(255, 255, 255, 0.2); line-height: 37px; text-align: center; } .rev_slider_wrapper .tparrows.default.tp-leftarrow:before { content: "\f104"; font-family: FontAwesome; font-size: 30px; } .rev_slider_wrapper .tparrows.default.tp-rightarrow:before { content: "\f105"; font-family: FontAwesome; font-size: 30px; } .rev_slider_wrapper .tparrows.default:hover { border-color: #fff; } .rev_slider_wrapper .tparrows.default:hover:before { color: #fff; } .wpb_revslider_element .tp-bullets { z-index: 777; } .wpb_revslider_element .tp-bullets.simplebullets.round .bullet { padding: 0; background: none; background-color: #fff; width: 50px; height: 2px; margin: 0 5px; display: inline-block; cursor: pointer; } .wpb_revslider_element .tp-bullets.simplebullets.round .bullet.selected { background: #3d72a4; } .wpb_revslider_element .tp-bullets.simplebullets.round .bullet:hover { background: #3d72a4; } .loader { position: relative; width: 2.5em; height: 2.5em; -webkit-transform: rotate(165deg); -moz-transform: rotate(165deg); -ms-transform: rotate(165deg); -o-transform: rotate(165deg); transform: rotate(165deg); } .loader:before, .loader:after { content: ''; position: absolute; top: 50%; left: 50%; display: block; width: 0.5em; height: 0.5em; border-radius: 0.25em; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .loader:before { -webkit-animation: before 2s infinite; -moz-animation: before 2s infinite; -ms-animation: before 2s infinite; -o-animation: before 2s infinite; animation: before 2s infinite; } .loader:after { -webkit-animation: after 2s infinite; -moz-animation: after 2s infinite; -ms-animation: after 2s infinite; -o-animation: after 2s infinite; animation: after 2s infinite; } @keyframes before { 0% { width: 0.5em; -webkit-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); } 35% { width: 2.5em; -webkit-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); } 70% { width: 0.5em; -webkit-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); } 100% { -webkit-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); } } @keyframes after { /* Webkit */ 0% { height: 0.5em; -webkit-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); } 35% { height: 2.5em; -webkit-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); } 70% { height: 0.5em; -webkit-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); } 100% { -webkit-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); } } @-webkit-keyframes before { 0% { width: 0.5em; -webkit-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); } 35% { width: 2.5em; -webkit-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); } 70% { width: 0.5em; -webkit-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); } 100% { -webkit-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); } } @-webkit-keyframes after { /* Moz */ 0% { height: 0.5em; -webkit-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); } 35% { height: 2.5em; -webkit-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); } 70% { height: 0.5em; -webkit-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); } 100% { -webkit-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); } } @-moz-keyframes before { 0% { width: 0.5em; -webkit-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); } 35% { width: 2.5em; -webkit-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); } 70% { width: 0.5em; -webkit-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); } 100% { -webkit-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); } } @-moz-keyframes after { /* IE */ 0% { height: 0.5em; -webkit-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); } 35% { height: 2.5em; -webkit-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); } 70% { height: 0.5em; -webkit-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); } 100% { -webkit-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); } } @-o-keyframes before { 0% { width: 0.5em; -webkit-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); } 35% { width: 2.5em; -webkit-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); } 70% { width: 0.5em; -webkit-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); } 100% { -webkit-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -moz-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -ms-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); -o-box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); } } @-o-keyframes after { /** * Attempt to center the whole thing! */ 0% { height: 0.5em; -webkit-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); } 35% { height: 2.5em; -webkit-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); } 70% { height: 0.5em; -webkit-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); } 100% { -webkit-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -moz-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -ms-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); -o-box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); } } html, body { height: 100%; } .loader { position: absolute; top: calc(50% - 1.25em); left: calc(50% - 1.25em); /* ========================================================================== End Style 1 ========================================================================== */ /* ========================================================================== Style 2 ========================================================================== */ } @-webkit-keyframes ball { 0% { -webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -moz-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -ms-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -o-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 45% { -webkit-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -moz-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -ms-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -o-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 50% { -webkit-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -moz-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -ms-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -o-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -ms-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } 55% { -webkit-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -moz-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -ms-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -o-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -ms-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @-moz-keyframes ball { 0% { -webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -moz-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -ms-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -o-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 45% { -webkit-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -moz-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -ms-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -o-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 50% { -webkit-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -moz-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -ms-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -o-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -ms-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } 55% { -webkit-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -moz-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -ms-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -o-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -ms-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @-o-keyframes ball { 0% { -webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -moz-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -ms-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -o-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 45% { -webkit-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -moz-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -ms-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -o-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 50% { -webkit-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -moz-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -ms-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -o-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -ms-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } 55% { -webkit-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -moz-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -ms-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -o-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -ms-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @keyframes ball { 0% { -webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -moz-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -ms-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -o-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 45% { -webkit-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -moz-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -ms-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -o-transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); transform: translate3d(0, 150px, -10px) scale3d(1, 0.95, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 50% { -webkit-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -moz-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -ms-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -o-transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); transform: translate3d(0, 150px, -10px) scale3d(1, 0.5, 1); -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -ms-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } 55% { -webkit-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -moz-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -ms-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -o-transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); transform: translate3d(0, 150px, -10px) scale3d(1, 1.25, 1); -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -ms-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @-webkit-keyframes ball-highlight { 0% { -webkit-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -moz-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -ms-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -o-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 45% { -webkit-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -moz-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -ms-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -o-transform: skew(-30deg, 0) translate3d(0, 0, 1px); transform: skew(-30deg, 0) translate3d(0, 0, 1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 50% { -webkit-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -moz-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -ms-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -o-transform: skew(-30deg, 0) translate3d(0, 0, 1px); transform: skew(-30deg, 0) translate3d(0, 0, 1px); -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -ms-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } 55% { -webkit-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -moz-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -ms-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -o-transform: skew(-30deg, 0) translate3d(0, 0, 1px); transform: skew(-30deg, 0) translate3d(0, 0, 1px); -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -ms-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } 100% { -webkit-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -moz-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -ms-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -o-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @-moz-keyframes ball-highlight { 0% { -webkit-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -moz-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -ms-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -o-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 45% { -webkit-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -moz-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -ms-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -o-transform: skew(-30deg, 0) translate3d(0, 0, 1px); transform: skew(-30deg, 0) translate3d(0, 0, 1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 50% { -webkit-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -moz-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -ms-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -o-transform: skew(-30deg, 0) translate3d(0, 0, 1px); transform: skew(-30deg, 0) translate3d(0, 0, 1px); -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -ms-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } 55% { -webkit-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -moz-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -ms-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -o-transform: skew(-30deg, 0) translate3d(0, 0, 1px); transform: skew(-30deg, 0) translate3d(0, 0, 1px); -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -ms-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } 100% { -webkit-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -moz-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -ms-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -o-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @-o-keyframes ball-highlight { 0% { -webkit-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -moz-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -ms-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -o-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 45% { -webkit-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -moz-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -ms-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -o-transform: skew(-30deg, 0) translate3d(0, 0, 1px); transform: skew(-30deg, 0) translate3d(0, 0, 1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 50% { -webkit-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -moz-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -ms-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -o-transform: skew(-30deg, 0) translate3d(0, 0, 1px); transform: skew(-30deg, 0) translate3d(0, 0, 1px); -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -ms-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } 55% { -webkit-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -moz-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -ms-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -o-transform: skew(-30deg, 0) translate3d(0, 0, 1px); transform: skew(-30deg, 0) translate3d(0, 0, 1px); -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -ms-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } 100% { -webkit-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -moz-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -ms-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -o-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes ball-highlight { 0% { -webkit-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -moz-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -ms-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -o-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 45% { -webkit-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -moz-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -ms-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -o-transform: skew(-30deg, 0) translate3d(0, 0, 1px); transform: skew(-30deg, 0) translate3d(0, 0, 1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 50% { -webkit-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -moz-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -ms-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -o-transform: skew(-30deg, 0) translate3d(0, 0, 1px); transform: skew(-30deg, 0) translate3d(0, 0, 1px); -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -ms-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } 55% { -webkit-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -moz-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -ms-transform: skew(-30deg, 0) translate3d(0, 0, 1px); -o-transform: skew(-30deg, 0) translate3d(0, 0, 1px); transform: skew(-30deg, 0) translate3d(0, 0, 1px); -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -ms-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } 100% { -webkit-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -moz-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -ms-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -o-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @-webkit-keyframes ball-shadow { 0% { -webkit-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -moz-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -ms-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -o-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 45% { -webkit-transform: translate3d(12.5px, -15px, -1px); -moz-transform: translate3d(12.5px, -15px, -1px); -ms-transform: translate3d(12.5px, -15px, -1px); -o-transform: translate3d(12.5px, -15px, -1px); transform: translate3d(12.5px, -15px, -1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 50% { -webkit-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -moz-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -ms-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -o-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -ms-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } 55% { -webkit-transform: translate3d(12.5px, -15px, -1px); -moz-transform: translate3d(12.5px, -15px, -1px); -ms-transform: translate3d(12.5px, -15px, -1px); -o-transform: translate3d(12.5px, -15px, -1px); transform: translate3d(12.5px, -15px, -1px); -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -ms-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } 100% { -webkit-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -moz-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -ms-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -o-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @-moz-keyframes ball-shadow { 0% { -webkit-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -moz-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -ms-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -o-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 45% { -webkit-transform: translate3d(12.5px, -15px, -1px); -moz-transform: translate3d(12.5px, -15px, -1px); -ms-transform: translate3d(12.5px, -15px, -1px); -o-transform: translate3d(12.5px, -15px, -1px); transform: translate3d(12.5px, -15px, -1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 50% { -webkit-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -moz-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -ms-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -o-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -ms-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } 55% { -webkit-transform: translate3d(12.5px, -15px, -1px); -moz-transform: translate3d(12.5px, -15px, -1px); -ms-transform: translate3d(12.5px, -15px, -1px); -o-transform: translate3d(12.5px, -15px, -1px); transform: translate3d(12.5px, -15px, -1px); -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -ms-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } 100% { -webkit-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -moz-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -ms-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -o-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @-o-keyframes ball-shadow { 0% { -webkit-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -moz-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -ms-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -o-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 45% { -webkit-transform: translate3d(12.5px, -15px, -1px); -moz-transform: translate3d(12.5px, -15px, -1px); -ms-transform: translate3d(12.5px, -15px, -1px); -o-transform: translate3d(12.5px, -15px, -1px); transform: translate3d(12.5px, -15px, -1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 50% { -webkit-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -moz-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -ms-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -o-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -ms-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } 55% { -webkit-transform: translate3d(12.5px, -15px, -1px); -moz-transform: translate3d(12.5px, -15px, -1px); -ms-transform: translate3d(12.5px, -15px, -1px); -o-transform: translate3d(12.5px, -15px, -1px); transform: translate3d(12.5px, -15px, -1px); -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -ms-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } 100% { -webkit-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -moz-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -ms-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -o-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes ball-shadow { /* Styles for old versions of IE */ 0% { -webkit-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -moz-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -ms-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -o-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 45% { -webkit-transform: translate3d(12.5px, -15px, -1px); -moz-transform: translate3d(12.5px, -15px, -1px); -ms-transform: translate3d(12.5px, -15px, -1px); -o-transform: translate3d(12.5px, -15px, -1px); transform: translate3d(12.5px, -15px, -1px); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } 50% { -webkit-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -moz-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -ms-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -o-transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); transform: translate3d(12.5px, -15px, -1px) scale3d(1, 1, 1); -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -ms-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } 55% { -webkit-transform: translate3d(12.5px, -15px, -1px); -moz-transform: translate3d(12.5px, -15px, -1px); -ms-transform: translate3d(12.5px, -15px, -1px); -o-transform: translate3d(12.5px, -15px, -1px); transform: translate3d(12.5px, -15px, -1px); -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -ms-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } 100% { -webkit-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -moz-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -ms-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -o-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -ms-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .ball { font-family: sans-serif; font-weight: 100; /* :not(:required) hides this rule from IE9 and below */ } .ball:not(:required) { position: relative; display: inline-block; font-size: 0; letter-spacing: -1px; border-radius: 100%; background: #f86; width: 50px; height: 50px; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; -o-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -moz-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -ms-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -o-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -webkit-transform-origin: 0 100%; -moz-transform-origin: 0 100%; -ms-transform-origin: 0 100%; -o-transform-origin: 0 100%; transform-origin: 0 100%; -webkit-animation: ball 1500ms infinite linear; -moz-animation: ball 1500ms infinite linear; -ms-animation: ball 1500ms infinite linear; -o-animation: ball 1500ms infinite linear; animation: ball 1500ms infinite linear; } .ball:not(:required)::after { content: ''; position: absolute; top: 4.5px; left: 5.5px; width: 15px; height: 15px; background: #ffb099; border-radius: 100%; -webkit-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -moz-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -ms-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -o-transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); transform: skew(-20deg, 0) translate3d(0, 2.5px, 1px); -webkit-animation: ball-highlight 1500ms infinite linear; -moz-animation: ball-highlight 1500ms infinite linear; -ms-animation: ball-highlight 1500ms infinite linear; -o-animation: ball-highlight 1500ms infinite linear; animation: ball-highlight 1500ms infinite linear; } .ball:not(:required)::before { content: ''; position: absolute; top: 50px; left: 5.5px; width: 50px; height: 15px; background: rgba(0, 0, 0, 0.2); border-radius: 100%; -webkit-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -moz-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -ms-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -o-transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); transform: translate3d(66.66667px, 66.66667px, -1px) scale3d(1.25, 1.25, 1); -webkit-animation: ball-shadow 1500ms infinite linear; -moz-animation: ball-shadow 1500ms infinite linear; -ms-animation: ball-shadow 1500ms infinite linear; -o-animation: ball-shadow 1500ms infinite linear; animation: ball-shadow 1500ms infinite linear; -webkit-filter: blur(1px); -moz-filter: blur(1px); filter: blur(1px); /* ========================================================================== End Style 2 ========================================================================== */ } #zo-header-navigation { position: static; /* -----> Minimum width of 992 pixels. */ /** Menu Default ====================================================== */ } #zo-header-navigation .main-navigation ul.ping-right { left: auto; right: 100%; } #zo-header-navigation .main-navigation ul.ping-left { left: 100%; right: auto; } @media screen and (min-width: 992px) { /* -----> Minimum width of 992 pixels. */ /* -----> Max width of 992 pixels. */ #menu-mobile { display: none; } #zo-header-navigation.collapse { display: block; } #zo-header-navigation .main-navigation { padding-right: 30px; } #zo-header-navigation .main-navigation div.nav-menu > ul { display: inline-block; width: 100%; } #zo-header-navigation .main-navigation ul { margin: 0; padding: 0; list-style: none; text-indent: 0; } #zo-header-navigation .main-navigation ul li { position: relative; } #zo-header-navigation .main-navigation ul li a { padding: 0 13px; display: inline-block; border-bottom: 0; white-space: nowrap; -webkit-transition: all 420ms linear 0ms; -khtml-transition: all 420ms linear 0ms; -moz-transition: all 420ms linear 0ms; -ms-transition: all 420ms linear 0ms; -o-transition: all 420ms linear 0ms; transition: all 420ms linear 0ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } #zo-header-navigation .main-navigation .menu-main-menu > li { -webkit-transition: all 420ms linear 0ms; -khtml-transition: all 420ms linear 0ms; -moz-transition: all 420ms linear 0ms; -ms-transition: all 420ms linear 0ms; -o-transition: all 420ms linear 0ms; transition: all 420ms linear 0ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } #zo-header-navigation .main-navigation .menu-main-menu > li > a { position: relative; text-align: center; line-height: normal; -webkit-transition: all 420ms linear 0ms; -khtml-transition: all 420ms linear 0ms; -moz-transition: all 420ms linear 0ms; -ms-transition: all 420ms linear 0ms; -o-transition: all 420ms linear 0ms; transition: all 420ms linear 0ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } #zo-header-navigation .main-navigation .menu-main-menu > li > a i { display: block; width: 100%; line-height: 0; margin-bottom: 6px; -webkit-transition: all 420ms linear 0ms; -khtml-transition: all 420ms linear 0ms; -moz-transition: all 420ms linear 0ms; -ms-transition: all 420ms linear 0ms; -o-transition: all 420ms linear 0ms; transition: all 420ms linear 0ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } #zo-header-navigation .main-navigation .menu-main-menu > li > a i + .menu-title { -webkit-transform: translateY(25px); -khtml-transform: translateY(25px); -moz-transform: translateY(25px); -ms-transform: translateY(25px); -o-transform: translateY(25px); transform: translateY(25px); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ display: block; } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children { position: relative; } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children > ul.sub-menu { margin-top: 10px; background-color: #fff; border-top: 1px solid #e4e4e4; -webkit-transition: all 0.4s ease 0s; -khtml-transition: all 0.4s ease 0s; -moz-transition: all 0.4s ease 0s; -ms-transition: all 0.4s ease 0s; -o-transition: all 0.4s ease 0s; transition: all 0.4s ease 0s; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children > ul.sub-menu.current-menu-parent > a, #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children > ul.sub-menu.current-menu-ancestor > a { color: #3d72a4; } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children > ul.sub-menu .sub-menu { background-color: #fff; } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children > ul.sub-menu li.menu-item-has-children { position: relative; } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children > ul.sub-menu li.menu-item-has-children.group .zo-menu-toggle { display: none; } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children > ul.sub-menu li.menu-item-has-children .zo-menu-toggle { position: absolute; right: 20px; top: 50%; line-height: normal; -webkit-transform: translateY(-50%); -khtml-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children > ul.sub-menu li.menu-item-has-children .zo-menu-toggle .fa:before { content: "\f105"; } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children > ul.sub-menu li:hover { border-color: #3d72a4; } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children:hover > ul.sub-menu { -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15) 2px 5px rgba(0, 0, 0, .4); -khtml-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15) 2px 5px rgba(0, 0, 0, .4); -moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15) 2px 5px rgba(0, 0, 0, .4); -ms-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15) 2px 5px rgba(0, 0, 0, .4); -o-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15) 2px 5px rgba(0, 0, 0, .4); box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15) 2px 5px rgba(0, 0, 0, .4); /* BACKGROUND GRADIENT */ /* BOX SIZING */ margin-top: 0; } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children:hover > .zo-menu-toggle { opacity: 1; } #zo-header-navigation .main-navigation .menu-main-menu > li, #zo-header-navigation .main-navigation .menu-main-menu > li a, #zo-header-navigation .main-navigation .menu-main-menu > ul > li, #zo-header-navigation .main-navigation .menu-main-menu > ul > li > a { display: inline-block; text-decoration: none; text-transform: uppercase; } #zo-header-navigation .main-navigation .menu-main-menu > li ul li, #zo-header-navigation .main-navigation .menu-main-menu > li ul li a, #zo-header-navigation .main-navigation .menu-main-menu > ul > li ul li, #zo-header-navigation .main-navigation .menu-main-menu > ul > li ul li a { display: block; text-decoration: none; text-align: left; text-transform: initial; font-weight: 400; line-height: 40px; } #zo-header-navigation .main-navigation .menu-main-menu > li ul ul, #zo-header-navigation .main-navigation .menu-main-menu > ul > li ul ul { width: 215px; } #zo-header-navigation .main-navigation li li { padding-left: 15px; border-left: 3px solid transparent; -webkit-transition: all 300ms ease; -khtml-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } #zo-header-navigation .main-navigation li ul { margin: 0; padding: 0; position: absolute; z-index: 1; height: 1px; width: 220px; top: 100%; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); /* Menu Stick Wall */ } #zo-header-navigation .main-navigation li ul ul { top: 15px; left: 100%; width: 220px; /* End Menu Stick Wall */ } #zo-header-navigation .main-navigation li ul ul.back { right: 100%; left: auto; } #zo-header-navigation .main-navigation li ul ul.back ul:not(.back) { right: 100%; left: auto; } #zo-header-navigation .main-navigation li ul ul.back ul.back { left: 100%; right: auto; } #zo-header-navigation .main-navigation li ul ul.back ul.back ul:not(.back) { left: 100%; right: auto; } #zo-header-navigation .main-navigation li ul ul.back ul.back ul.back { right: 100%; left: auto; } #zo-header-navigation .main-navigation { /* End Menu Sub Level */ /* Start Mega Menu */ } #zo-header-navigation .main-navigation ul li:hover > ul, #zo-header-navigation .main-navigation ul li:focus > ul, #zo-header-navigation .main-navigation .focus > ul { border-left: 0; clip: inherit; overflow: inherit; height: inherit; } #zo-header-navigation .main-navigation li ul li a { white-space: normal; } #zo-header-navigation .main-navigation li ul li:last-child a { border-bottom: none; } #zo-header-navigation .main-navigation .columns2 > li:nth-of-type(2n+1), #zo-header-navigation .main-navigation .columns3 > li:nth-child(3n+1), #zo-header-navigation .main-navigation .columns4 > li:nth-child(4n+1), #zo-header-navigation .main-navigation .columns5 > li:nth-child(5n+1) { clear: left; } #zo-header-navigation .main-navigation .columns5 > li { width: 20% !important; } #zo-header-navigation .main-navigation .columns4 > li { width: 25% !important; } #zo-header-navigation .main-navigation .columns3 > li { width: 33% !important; } #zo-header-navigation .main-navigation .columns2 > li { width: 50% !important; } #zo-header-navigation .main-navigation [class*="columns"] > li { float: left; } #zo-header-navigation .main-navigation [class*="columns"] > li > a { width: 100%; } #zo-header-navigation .main-navigation .menu-main-menu li.has_full_width { position: inherit; } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children ul.sub-menu:not(.multicolumn) { padding-top: 20px; padding-bottom: 20px; min-width: 220px; } #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children ul.sub-menu:not(.multicolumn) > li > a { padding: 0; } #zo-header-navigation .main-navigation .menu-main-menu li:not(.group) > ul.drop_full_width.sub-menu { left: 0 !important; width: 100% !important; background: #fff; border: 1px solid #e4e4e4; } #zo-header-navigation .main-navigation .menu-main-menu li:not(.group) > ul.drop_full_width.sub-menu ul.sub-menu:not(.multicolumn) { padding-top: 0; padding-bottom: 0; min-width: 200px; padding-right: 20px; } #zo-header-navigation .main-navigation .menu-main-menu li:not(.group) > ul.drop_full_width.sub-menu > li.menu-item-has-children a { padding: 0; line-height: 40px; } #zo-header-navigation .main-navigation .menu-main-menu li:not(.group) > ul.drop_full_width.sub-menu > li.menu-item-has-children > a { color: #fff; padding-bottom: 20px; margin-bottom: 16px; position: relative; font-weight: bold; font-size: 12px; line-height: normal; } #zo-header-navigation .main-navigation .menu-main-menu li:not(.group) > ul.drop_full_width.sub-menu > li.menu-item-has-children > a:after { content: ''; position: absolute; width: 23px; height: 3px; background-color: #3d72a4; bottom: 0; left: 0; } #zo-header-navigation .main-navigation .menu-main-menu li:not(.group) > ul.drop_full_width.sub-menu .sub-menu { background-color: transparent; } #zo-header-navigation .main-navigation li.group > ul.sub-menu { display: block; float: left; left: 0; position: relative; width: 100%; height: inherit; padding: 0; } #zo-header-navigation .main-navigation li.title-hide .menu-title { display: none; } #zo-header-navigation .main-navigation .widget { line-height: 30px; text-transform: initial; } #zo-header.header-fixed #zo-header-navigation .main-navigation .menu-main-menu > li > a i + .menu-title { -webkit-transform: translateY(14px); -khtml-transform: translateY(14px); -moz-transform: translateY(14px); -ms-transform: translateY(14px); -o-transform: translateY(14px); transform: translateY(14px); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } #zo-header.header-fixed #zo-header-navigation .main-navigation .menu-main-menu > li > a i { margin-bottom: 3px; /* End Start Mega Menu */ } #zo-header.header-fixed #zo-header-navigation .main-navigation .menu-main-menu > li.menu-item-has-children > .zo-menu-toggle { display: none; } } @media screen and (max-width: 991px) { /* -----> End Max width of 992 pixels. */ /* ========================================================================== End Style Main Menu ========================================================================== */ #zo-header-navigation.collapse { background: #222; position: absolute; top: 80px; width: 100%; } #zo-menu-mobile { display: none; } #zo-menu-mobile i { background: #3d72a4; color: #fff; cursor: pointer; font-size: 32px; height: 35px; line-height: 35px; text-align: center; width: 45px; } #zo-menu-mobile i:hover { background: #333; } #zo-header-navigation .main-navigation ul { margin: 0; padding: 0; list-style: none; overflow: hidden; transition: all 500ms ease; } #zo-header-navigation .main-navigation ul li { list-style: none; display: inline-block; width: 100%; } #zo-header-navigation .main-navigation ul li a { display: block; color: #5e5e5e; } #zo-header-navigation .main-navigation ul li a:hover, #zo-header-navigation .main-navigation ul li a:focus { color: #21759b; } .collapse .main-navigation div.nav-menu > ul { display: block; max-height: 2000px; } #zo-header #zo-header-navigation .main-navigation { padding: 15px 0; /* Dropdown Sub Menu */ } #zo-header #zo-header-navigation .main-navigation .menu-main-menu > li > a i { display: none; } #zo-header #zo-header-navigation .main-navigation .menu-main-menu li { line-height: 31px; } #zo-header #zo-header-navigation .main-navigation .menu-main-menu li a { background: transparent; color: #fff; } #zo-header #zo-header-navigation .main-navigation ul.sub-menu { width: 100% !important; } .zo-menu-toggle { display: block; } #zo-header-navigation .main-navigation .menu-main-menu > li { position: relative; } #zo-header-navigation .main-navigation .menu-main-menu > li li { position: relative; } #zo-header-navigation .main-navigation .menu-main-menu > li a { display: block; border-bottom: none; color: #999 !important; margin: 0 0 4px !important; padding: 0 !important; } #zo-header-navigation .main-navigation .menu-main-menu > li a:hover { color: #fff !important; } #zo-header-navigation .main-navigation .menu-main-menu > li ul li a { font-size: 16px; } #zo-header-navigation .main-navigation .menu-main-menu > li .zo-menu-toggle { color: #999; cursor: pointer; position: absolute; right: -5px; text-align: center; top: 0; width: 30px; } #zo-header-navigation .main-navigation .menu-main-menu > li .zo-menu-toggle:hover { color: #fff; } #zo-header-navigation .main-navigation .menu-main-menu > li ul.sub-menu { max-height: 0; overflow: hidden; padding-left: 10px; -webkit-transition: max-height 600ms linear 0ms; -khtml-transition: max-height 600ms linear 0ms; -moz-transition: max-height 600ms linear 0ms; -ms-transition: max-height 600ms linear 0ms; -o-transition: max-height 600ms linear 0ms; transition: max-height 600ms linear 0ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } #zo-header-navigation .main-navigation .menu-main-menu > li ul.sub-menu.submenu-open { max-height: 1000px; } #zo-header-navigation .main-navigation .menu-main-menu > li ul.sub-menu.submenu-open + .zo-menu-toggle i:before { content: "\f106"; } #zo-header-navigation .main-navigation .menu-main-menu > li ul.sub-menu .zo-menu-toggle { right: 12px; } } .secondary .widget, .wpb_widgetised_column .widget { border-bottom: none; margin-bottom: 17px; } .secondary .wg-title, .wpb_widgetised_column .wg-title { color: #000; font-size: 17px; letter-spacing: 0; line-height: 30px; margin: 0; text-transform: uppercase; } .secondary .wg-title span:hover, .wpb_widgetised_column .wg-title span:hover { color: #3d72a4; } .secondary .widget_layered_nav ul, .wpb_widgetised_column .widget_layered_nav ul { margin: 0 0 0 30px; } .secondary ul, .wpb_widgetised_column ul { margin: 0; padding: 0; } .secondary ul ul, .wpb_widgetised_column ul ul { margin: 0 0 0 15px; } .secondary ul li, .wpb_widgetised_column ul li { list-style: none inside; line-height: 31px; font-size: 15px; } .secondary ul li a, .wpb_widgetised_column ul li a { text-transform: capitalize; } .secondary ul li a:hover, .wpb_widgetised_column ul li a:hover { color: #3d72a4; } .secondary ul li.chosen a, .wpb_widgetised_column ul li.chosen a, .secondary ul li.current-cat a, .wpb_widgetised_column ul li.current-cat a { color: #3d72a4; } .wpb_widgetised_column { /** * RSS Widget */ } .wpb_widgetised_column .widget_newsletterwidget .wg-title { margin: 0; padding: 0; border: none; } .widget_rss { /* *Sidebar Single Car */ } .widget_rss ul li a { color: #3d72a4; } .zo-sidebar-single-car .vc_custom_heading { padding-top: 23px; padding-bottom: 23px; } .searchform, .woocommerce-product-search { position: relative; margin-bottom: 15px; /* ========================================================================== [Start] 2. Widget Search ========================================================================== */ /* ========================================================================== [Start] 3. Widget Tags ========================================================================== */ } .searchform .screen-reader-text, .woocommerce-product-search .screen-reader-text { display: none; } .searchform input[type="text"], .woocommerce-product-search input[type="text"], .searchform input[name="s"], .woocommerce-product-search input[name="s"] { width: 100%; margin: 0; height: 50px; line-height: 50px; display: block; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ box-sizing: border-box; font-style: italic; padding: 0 15px; background: #f0f0f0; } .searchform input[type="submit"], .woocommerce-product-search input[type="submit"] { position: absolute; right: 0; top: 0; width: 35px; height: 50px; line-height: 50px; background: none; border: none !important; text-indent: -99999px; opacity: 0; padding: 0; } .tagcloud a { font-size: 13px !important; line-height: 30px; height: 34px; padding: 0 15px; color: #6f6f6f; margin: 0 10px 10px 0; display: inline-block; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ background-color: transparent; border: 1px solid #ececec; /* ========================================================================== [End] 3. Widget Tags ========================================================================== */ /* ========================================================================== [Start] 4. Instagram ========================================================================== */ } .tagcloud a:hover { border-color: #3d72a4; background-color: transparent; } .zo-instagram-pics .instagram-item { margin: 0 0 16px; padding: 0 8px; } .zo-instagram-pics .instagram-item a { display: block; position: relative; } .zo-instagram-pics .instagram-item a:before { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: #3d72a4; opacity: 0; -webkit-transition: all 200ms ease-in-out; -khtml-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .zo-instagram-pics .instagram-item a:after { content: "\f002"; color: #fff; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -khtml-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ font-size: 20px; opacity: 0; -webkit-transition: all 200ms ease-in-out; -khtml-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ font-family: FontAwesome; } .zo-instagram-pics .instagram-item a:hover:after, .zo-instagram-pics .instagram-item a:hover:before { opacity: 1; } .zo-get-touch li { position: relative; padding-left: 30px; /* ========================================================================== [End] 4. Instagram ========================================================================== */ /* ========================================================================== [Start] 5. Twitter ========================================================================== */ } .zo-get-touch li i { font-size: 20px; color: #808080; padding-right: 10px; position: absolute; top: 0; left: 0; } .tweets-container { /* ========================================================================== [Start] 5. Zo Recent Post ========================================================================== */ } .tweets-container ul { list-style: none inside; margin: 0; padding: 0; } .tweets-container ul li { font-size: 11px; line-height: 18px; margin-bottom: 25px; } .tweets-container ul li .jtwt_date { color: #3a3a3a !important; } .tweets-container ul li .jtwt_date .fa { padding-right: 18px; } .zo-recent-post { margin-top: 40px; } .zo-recent-post .zo-recent-post-wrapper { margin-left: 0; } .zo-recent-post .zo-recent-post-wrapper > li { margin: 0 0 40px; clear: both; line-height: normal; } .zo-recent-post .zo-recent-post-wrapper > li:last-child { margin: 0; } .zo-recent-post .zo-recent-post-wrapper .zo-recent-media { width: 70px; max-width: 70px; float: left; } .zo-recent-post .zo-recent-post-wrapper .zo-recent-details { padding-left: 100px; font-size: 14px; } .zo-recent-post .zo-recent-post-wrapper .zo-recent-details.no-image { padding: 0; } .zo-recent-post .zo-recent-post-wrapper .zo-recent-details .title { font-size: 16px; margin: 0 0 10px; color: #141414; font-weight: normal; letter-spacing: 0; line-height: normal; } .zo-recent-post .zo-recent-post-wrapper .zo-recent-details .title a { color: #141414; } .zo-recent-post .zo-recent-post-wrapper .zo-recent-details .date { display: inline-block; } .zo-recent-post .zo-recent-post-wrapper .zo-recent-details .date .author { padding-left: 1px; } .zo-recent-post .zo-recent-post-wrapper .zo-recent-details .date .author:before { content: "|"; padding-right: 3px; } .zo-recent-post .zo-recent-post-wrapper .zo-recent-details .post-categories { margin: 0; } .zo-recent-post .zo-recent-post-wrapper .zo-recent-details .post-categories li { line-height: normal; } .zo-recent-post .zo-recent-post-wrapper .zo-recent-details .post-categories li a { font-style: italic; font-size: 16px; color: #6f6f6f; } #secondary .zo-recent-post-wrapper { /** * Calendar Widget */ } #secondary .zo-recent-post-wrapper .zo-recent-details .date { color: #3d72a4; } .widget_calendar table { width: 100%; /** * Products Rate */ } .widget_calendar table caption { text-align: center; font-weight: bold; } .widget_calendar table td { text-align: center; } .widget_top_rated_products { /** * Filter */ } .widget_top_rated_products .product_list_widget li { overflow: hidden; margin-bottom: 30px !important; } .widget_top_rated_products .product_list_widget li a img { float: left; width: 70px; height: 75px; margin-right: 30px; } .widget_top_rated_products .product_list_widget li a .product-title { float: left; color: #141414; font-size: 12px; width: calc(100% - 105px); line-height: normal; text-transform: uppercase; letter-spacing: 0.1em; font-weight: normal; word-wrap: break-word; } .widget_top_rated_products .product_list_widget li .amount { font-size: 18px; font-style: italic; letter-spacing: 0.1em; color: #141414; } .widget_top_rated_products .product_list_widget li ins { text-decoration: none; } .widget_price_filter .price_slider_wrapper { position: relative; padding-top: 30px; /** * News Tabs */ } .widget_price_filter .price_slider_wrapper .price_slider { background-color: #909090 !important; -webkit-border-radius: 0 !important; -khtml-border-radius: 0 !important; -moz-border-radius: 0 !important; -ms-border-radius: 0 !important; -o-border-radius: 0 !important; border-radius: 0 !important; /* BACKGROUND GRADIENT */ } .widget_price_filter .price_slider_wrapper .price_slider .ui-slider-handle { width: 20px; height: 20px; top: -7px; left: -10px; background-color: #3d72a4; } .widget_price_filter .price_slider_wrapper .price_slider .ui-slider-range { background-color: #141414; } .widget_price_filter .price_slider_wrapper .price_slider_amount .price_label { position: absolute; top: 0; left: 0; display: block; width: 100%; text-align: center; font-size: 13px; color: #6f6f6f; } .widget_price_filter .price_slider_wrapper .price_slider_amount .button { margin-top: 55px; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ border: 2px solid #e4e4e4; padding: 10px 25px; } .widget_ww_news_tabs { /* * Recent Comments */ } .widget_ww_news_tabs .tab-holder .tab-hold .nav-tabs { overflow: hidden; border-left: 1px solid #ececec; border-right: 1px solid #ececec; } .widget_ww_news_tabs .tab-holder .tab-hold .nav-tabs li { background-color: #f2f2f2; border: none; border-top: 2px solid transparent; display: block; float: left; width: 50%; text-align: center; letter-spacing: 0.1em; font-size: 12px; } .widget_ww_news_tabs .tab-holder .tab-hold .nav-tabs li a { display: block; border: none !important; } .widget_ww_news_tabs .tab-holder .tab-hold .nav-tabs li.active { background-color: transparent; border-top-color: #3d72a4; } .widget_ww_news_tabs .tab-content { margin: 0; border-width: 0 1px 1px 1px; } .widget_ww_news_tabs .tab-content .tab-pane { padding: 40px 20px 0; } @media (min-width: 768px) and (max-width: 991px) { .widget_ww_news_tabs .tab-content .tab-pane { padding-left: 5px; padding-right: 5px; } } .widget_ww_news_tabs .tab-content .news-list { margin: 0; } .widget_ww_news_tabs .tab-content .news-list li { width: 100%; clear: both; overflow: hidden; margin-bottom: 40px; } .widget_ww_news_tabs .tab-content .news-list li .zo-image { width: 70px; height: 70px; float: left; } .widget_ww_news_tabs .tab-content .news-list li .zo-image + .zo-details { padding-left: 100px; } .widget_ww_news_tabs .tab-content .news-list li .zo-details { line-height: normal; } .widget_ww_news_tabs .tab-content .news-list li .zo-details h4 { font-size: 16px; line-height: normal; font-weight: 400; letter-spacing: 0; margin: 0 0 5px; padding: 0; } .widget_ww_news_tabs .tab-content .news-list li .zo-details a { font-style: italic; font-size: 16px; } .widget_recent_comments { /** * Rss Widget */ } .widget_recent_comments .recentcomments { color: #c8c8c8; } .widget_rss { /* Lastet new, recent post with thumb */ } .widget_rss ul li { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #3d72a4; } .widget_rss .rssSummary { line-height: 30px; } .wpb_widgetised_column .widget.widget_zo-recent-posts-widget-with-thumbnails { margin-bottom: 0; } .widget_zo-recent-posts-widget-with-thumbnails { /* * Featured Deals */ } .widget_zo-recent-posts-widget-with-thumbnails ul li { display: inline-block; max-width: 370px; overflow: hidden; } .widget_zo-recent-posts-widget-with-thumbnails ul li + li { margin-left: 26px; } .widget_zo-recent-posts-widget-with-thumbnails ul li .zo-post-title h3 { line-height: 18px; margin-top: 19px; letter-spacing: 0; text-transform: capitalize; margin-bottom: 0; } .widget_zo-recent-posts-widget-with-thumbnails ul li .zo-post-content p { color: #6f6f6f; line-height: 24px; margin-bottom: 35px; margin-top: 25px; } .widget_zo-featured-car-deals ul { padding-left: 0; padding-top: 7px; list-style: none; } .widget_zo-featured-car-deals ul.zo-template-style1 li { padding: 0px; position: relative; } .widget_zo-featured-car-deals ul.zo-template-style1 li .recent-thumb { margin: 0px; } .widget_zo-featured-car-deals ul.zo-template-style1 li .zo-post-wrapper { position: absolute; left: 10px; bottom: 10px; background: #3d72a4; background: rgba(61, 114, 164, 0.85); /* COLOR OPACITY */ max-width: 215px; padding: 10px; } .widget_zo-featured-car-deals ul.zo-template-style1 li .zo-post-wrapper:hover { -webkit-transition: all 300ms linear 0ms; -khtml-transition: all 300ms linear 0ms; -moz-transition: all 300ms linear 0ms; -ms-transition: all 300ms linear 0ms; -o-transition: all 300ms linear 0ms; transition: all 300ms linear 0ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ background: #fff; background: rgba(255, 255, 255, 0.5); /* COLOR OPACITY */ } @media (min-width: 768px) and (max-width: 991px) { .widget_zo-featured-car-deals ul.zo-template-style1 li .zo-post-wrapper h3 { line-height: 24px; } .widget_zo-featured-car-deals ul.zo-template-style1 li .zo-post-wrapper a { font-size: 12px !important; } .widget_zo-featured-car-deals ul.zo-template-style1 li .zo-post-wrapper .zo-post-content ul { display: inline-block; } .widget_zo-featured-car-deals ul.zo-template-style1 li .zo-post-wrapper .zo-post-content ul li { float: left !important; } } .widget_zo-featured-car-deals ul.zo-template-style1 li .zo-post-wrapper .zo-post-title h3 a { font-size: 17px; line-height: 30px; color: #fff; } .widget_zo-featured-car-deals ul.zo-template-style1 li .zo-post-wrapper .zo-post-title h3 a:hover { color: #3d72a4; } .widget_zo-featured-car-deals ul.zo-template-style1 li .zo-post-wrapper .zo-post-content ul { padding-top: 0px; margin: -10px 0 0 0; } .widget_zo-featured-car-deals ul.zo-template-style1 li .zo-post-wrapper .zo-post-content ul li { line-height: 13px; font-size: 11px; margin: 0; } .widget_zo-featured-car-deals ul.zo-template-style1 li .zo-post-wrapper .zo-post-content ul li a { color: #fff; } .widget_zo-featured-car-deals ul li { color: #fff; font-size: 13px; display: inline-block; margin-bottom: 5px; } .widget_zo-featured-car-deals ul li .recent-thumb, .widget_zo-featured-car-deals ul li .zo-post-wrapper { float: left; } .widget_zo-featured-car-deals ul li .recent-thumb { margin-right: 20px; } .widget_zo-featured-car-deals ul li .zo-post-content p { margin-bottom: 0; } .widget_zo-featured-car-deals ul li div.zo-post-title { margin-top: -8px; } .widget_zo-featured-car-deals ul li div.zo-post-title h3 { margin-bottom: 0px; } .zo-contact-info i, .zo-contact-info span { display: table-cell; } .zo-contact-info i { padding-right: 10px; } .zo-sidebar-text { font-size: 13px; line-height: 24px; } .tabs-left, .tabs-right { border-bottom: none; padding-top: 2px; } .tabs-left { border-right: 1px solid #ddd; } .tabs-right { border-left: 1px solid #ddd; } .tabs-left > li, .tabs-right > li { float: none; margin-bottom: 2px; list-style: none; } .tabs-left > li { margin-right: -1px; } .tabs-right > li { margin-left: -1px; } .tabs-left > li.active > a, .tabs-left > li.active > a:focus, .tabs-left > li.active > a:hover { border-bottom-color: #ddd; border-right-color: transparent; } .tabs-right > li.active > a, .tabs-right > li.active > a:focus, .tabs-right > li.active > a:hover { border-bottom: 1px solid #ddd; border-left-color: transparent; } .tabs-left > li > a { border-radius: 4px 0 0 4px; margin-right: 0; display: block; } .tabs-right > li > a { border-radius: 0 4px 4px 0; margin-right: 0; } .tab-content > .tab-pane { display: none; } .tab-content > .active { display: block; } .sideways { margin-top: 50px; border: none; position: relative; } .sideways > li { height: 20px; width: 120px; margin-bottom: 100px; } .sideways > li > a { border-bottom: 1px solid #ddd; border-right-color: transparent; text-align: center; border-radius: 4px 4px 0 0; } .sideways > li.active > a, .sideways > li.active > a:focus, .sideways > li.active > a:hover { border-bottom-color: transparent; border-right-color: #ddd; border-left-color: #ddd; } .sideways.tabs-left { left: -50px; } .sideways.tabs-right { right: -50px; } .sideways.tabs-right > li { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } .sideways.tabs-left > li { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); /* Woo Commerce ==============================================================*/ } .woocommerce ul.products, .woocommerce-page ul.products { padding: 0; margin: 0; list-style: none inside; } .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width: 30.8%; } @media screen and (max-width: 767px) { .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width: 100%; } } .woocommerce ul.products li.product h3, .woocommerce-page ul.products li.product h3 { padding: 0; margin: 0; } .woocommerce.columns-4 ul.products li.product, .woocommerce-page.columns-4 ul.products li.product { width: 22.05%; } @media (min-width: 768px) and (max-width: 799px) { .woocommerce.columns-4 ul.products li.product, .woocommerce-page.columns-4 ul.products li.product { width: 48%; } } @media screen and (max-width: 767px) { .woocommerce.columns-4 ul.products li.product, .woocommerce-page.columns-4 ul.products li.product { width: 100%; } } .woocommerce { /** * Tab: woocommerce_product_reviews */ } .woocommerce span.onsale { width: 50px; height: 40px; border: 2px solid #000; color: #333; line-height: 40px; text-align: center; position: absolute; top: 20px; left: 20px; margin: 0; padding: 0; background-color: transparent; text-transform: uppercase; z-index: 10; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ } .woocommerce .star-rating { float: none; } .woocommerce .woocommerce-ordering select { padding: 7px 10px; } .woocommerce a.remove { padding-left: 3px; } .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button { background: #fff; border: 1px solid #3d72a4; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; /* BACKGROUND GRADIENT */ padding: 0.618em 1em; font-weight: 400; } .woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover { color: #fff; background-color: #3d72a4; } .woocommerce div.product .quantity { background-color: #fff; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ border: 2px solid #ececec; height: 40px; width: 140px; line-height: 40px; overflow: hidden; margin: 10px 20px 0 0 !important; } @media screen and (max-width: 359px) { .woocommerce div.product .quantity { margin-bottom: 15px !important; } } .woocommerce div.product .quantity .qty, .woocommerce div.product .quantity span { border: none; padding: 0; display: inline-block; margin: 0; height: 100%; } .woocommerce div.product .quantity input[type=number]::-webkit-inner-spin-button, .woocommerce div.product .quantity input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .woocommerce div.product .quantity .qty { width: 50%; -moz-appearance: textfield; -webkit-appearance: textfield; appearance: textfield; } .woocommerce div.product .quantity span { width: 21%; text-align: center; cursor: pointer; } .woocommerce div.product .quantity span:hover { color: #3d72a4; } .woocommerce div.product .single_add_to_cart_button { -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ background-color: #3d72a4; color: #fff; padding: 18px 35px; } .woocommerce div.product .single_add_to_cart_button:hover { background-color: transparent; color: #3d72a4; } .woocommerce div.product .product_title { position: relative; margin-bottom: 25px; font-size: 36px; letter-spacing: 0; } .woocommerce div.product .rating-price .woocommerce-product-rating .woocommerce-review-link, .woocommerce div.product .single_variation_wrap .woocommerce-product-rating .woocommerce-review-link { display: none; } .woocommerce div.product .rating-price .woocommerce-product-price, .woocommerce div.product .single_variation_wrap .woocommerce-product-price { margin-bottom: 15px; } .woocommerce div.product .rating-price .woocommerce-product-price .price del, .woocommerce div.product .single_variation_wrap .woocommerce-product-price .price del, .woocommerce div.product .rating-price .woocommerce-product-price .price ins, .woocommerce div.product .single_variation_wrap .woocommerce-product-price .price ins { display: inline-block; } .woocommerce div.product .rating-price .woocommerce-product-price .price .amount, .woocommerce div.product .single_variation_wrap .woocommerce-product-price .price .amount { display: inline-block; font-size: 36px; line-height: 60px; font-style: italic; font-weight: 400; color: #141414; } .woocommerce div.product .rating-price .woocommerce-product-price .price del .amount, .woocommerce div.product .single_variation_wrap .woocommerce-product-price .price del .amount { margin-right: 10px; color: #6f6f6f; text-decoration: line-through; } .woocommerce div.product .rating-price .woocommerce-product-price .price ins .amount, .woocommerce div.product .single_variation_wrap .woocommerce-product-price .price ins .amount { color: #141414; } .woocommerce div.product .variations tr .label { padding: 10px 0 0; width: 55px; } .woocommerce div.product .variations tr .label label { font-style: italic; font-weight: normal; font-size: 12px; text-transform: uppercase; letter-spacing: 0.1em; } .woocommerce div.product .product_meta > span { display: block; color: #6f6f6f; text-transform: uppercase; font-size: 10px; line-height: 30px; } .woocommerce div.product .product_meta > span a, .woocommerce div.product .product_meta > span span { color: #141414; } .woocommerce div.product .social-list { margin: 40px 0 0; padding: 0; text-align: left; } .woocommerce div.product .social-list li { display: inline-block; } .woocommerce div.product .social-list li a { display: block; text-align: center; margin-right: 5px; } .woocommerce div.product .social-list li a i { width: 42px; height: 42px; color: #141414; line-height: 42px; background-color: #f9f9f9 !important; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; /* BACKGROUND GRADIENT */ } .woocommerce div.product .social-list li a:hover i { background-color: #3d72a4 !important; color: #fff; } .woocommerce .woocommerce-info { border-top-color: #3d72a4; /** * --> Product Tabs */ } .woocommerce .woocommerce-info:before { color: #3d72a4; } .woocommerce .zo-woocommerce-tabs .nav-tabs { margin: 0; padding: 0; border: none; } .woocommerce .zo-woocommerce-tabs .nav-tabs li { display: block; height: 55px; line-height: 55px; width: 100%; background-color: #ececec; text-align: center; margin-bottom: 20px; -webkit-transition: all 200ms; -khtml-transition: all 200ms; -moz-transition: all 200ms; -ms-transition: all 200ms; -o-transition: all 200ms; transition: all 200ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ position: relative; text-transform: uppercase; } .woocommerce .zo-woocommerce-tabs .nav-tabs li.active { background-color: #3d72a4; } .woocommerce .zo-woocommerce-tabs .nav-tabs li.active a { color: #fff; } .woocommerce .zo-woocommerce-tabs .nav-tabs li.active:before { color: #fff; } .woocommerce .zo-woocommerce-tabs .nav-tabs li:before { content: ''; position: absolute; left: 30px; font-size: 25px; font-family: FontAwesome; -webkit-transition: all 200ms; -khtml-transition: all 200ms; -moz-transition: all 200ms; -ms-transition: all 200ms; -o-transition: all 200ms; transition: all 200ms; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .woocommerce .zo-woocommerce-tabs .nav-tabs li.description:before { content: "\f040"; } .woocommerce .zo-woocommerce-tabs .nav-tabs li.additional_information:before { content: "\f02b"; } .woocommerce .zo-woocommerce-tabs .nav-tabs li.reviews:before { content: "\f0e5"; } .woocommerce .zo-woocommerce-tabs .tab-content { margin: 0; padding: 30px; } #woocommerce_product_reviews { /* *---> Your Cart */ } #woocommerce_product_reviews #reply-title { text-transform: uppercase; margin: 20px 0; } .woocommerce form .form-row .required { color: #3d72a4; } .woocommerce-cart table.cart { border: none; margin-bottom: 30px; } .woocommerce-cart table.cart tr th, .woocommerce-cart table.cart tr td { border: none; border-bottom: 1px solid #ececec; padding: 0 0 20px; letter-spacing: 0.1em; color: #141414; text-transform: uppercase; } .woocommerce-cart table.cart tr th { font-size: 14px; font-weight: bold; } .woocommerce-cart table.cart tr td { padding: 60px 30px 60px 0; font-size: 12px; font-weight: 400; } .woocommerce-cart table.cart tr .product-remove { width: 30px; padding-right: 0; } .woocommerce-cart table.cart tr .product-name { padding-right: 0; width: 50%; position: relative; } @media screen and (max-width: 767px) { .woocommerce-cart table.cart tr .product-name { width: 39%; font-size: 9px; } .woocommerce-cart table.cart tr .product-name .variation dt.variation-Color, .woocommerce-cart table.cart tr .product-name .variation dt.variation-Size { display: none; } .woocommerce-cart table.cart tr .product-name .variation dd.variation-Color, .woocommerce-cart table.cart tr .product-name .variation dd.variation-Size { margin: 0; width: 100%; } } .woocommerce-cart table.cart tr .product-name span { display: inline-block; padding-right: 30px; } .woocommerce-cart table.cart tr .product-name span.product-name { float: right; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -khtml-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ } @media screen and (max-width: 799px) { .woocommerce-cart table.cart tr .product-name span.product-name { width: calc(100% - 30px); } } @media screen and (max-width: 767px) { .woocommerce-cart table.cart tr .product-name span.product-name { padding-right: 0; } .woocommerce-cart table.cart tr .product-name span.product-name > a { font-size: 11px; } } .woocommerce-cart table.cart tr .product-name img { max-width: 170px; width: 100%; } .woocommerce-cart table.cart tr .product-quantity .qty { display: inline-block; margin-right: 20px; padding: 0; width: 70px; height: 40px; line-height: 40px; border: 2px solid #e4e4e4; font-size: 12px; color: #141414; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ text-align: center; } @media screen and (max-width: 767px) { .woocommerce-cart table.cart tr .product-quantity .qty { width: 55px; } } @media screen and (max-width: 767px) { .woocommerce-cart table.cart tr .product-price, .woocommerce-cart table.cart tr .product-subtotal { text-align: center; padding-right: 0; } } .woocommerce-cart table.cart tr .product-price .amount, .woocommerce-cart table.cart tr .product-subtotal .amount { font-size: 18px; font-style: italic; } @media screen and (max-width: 767px) { .woocommerce-cart table.cart tr .product-price .amount, .woocommerce-cart table.cart tr .product-subtotal .amount { font-size: 13px; font-weight: 600; } } .woocommerce-cart input[type="submit"], .woocommerce-cart button[type="submit"], .woocommerce-cart .btn-continue { display: inline-block; margin-right: 20px; padding: 12px 35px; border: 2px solid #e4e4e4; font-size: 12px; color: #141414; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ } .woocommerce-cart input[type="submit"]:hover, .woocommerce-cart button[type="submit"]:hover, .woocommerce-cart .btn-continue:hover { border-color: #3d72a4; color: #fff !important; } .woocommerce-cart .cart-actions { margin-bottom: 50px; } .woocommerce-cart .cart-actions input[type="submit"], .woocommerce-cart .cart-actions .btn-continue { display: inline-block; margin-right: 20px; padding: 12px 35px !important; border: 2px solid #e4e4e4; font-size: 12px; color: #141414; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ } .woocommerce-cart .cart-actions input[type="submit"]:hover, .woocommerce-cart .cart-actions .btn-continue:hover { border-color: #3d72a4; } .woocommerce-cart .cart-actions .cart-action-continue { text-align: right; } .woocommerce-cart .cart-actions .cart-action-continue .btn-continue { margin-right: 0; } @media screen and (max-width: 767px) { .woocommerce-cart .cart-actions .cart-action-group, .woocommerce-cart .cart-actions .cart-action-continue { text-align: center; } .woocommerce-cart .cart-actions .cart-action-group input[type="submit"], .woocommerce-cart .cart-actions .cart-action-continue input[type="submit"], .woocommerce-cart .cart-actions .cart-action-group .btn-continue, .woocommerce-cart .cart-actions .cart-action-continue .btn-continue { margin-right: 0; margin-bottom: 15px; width: 160px; } } .woocommerce-cart .cart-options { padding-bottom: 100px; } .woocommerce-cart .cart-options .title { position: relative; font-size: 12px; letter-spacing: 0.1em; background: url('../images/dot.png') no-repeat left center transparent; text-indent: 30px; font-weight: 400; text-transform: uppercase; margin: 0 0 5px; padding: 0; } .woocommerce-cart .cart-options .coupon input[type="text"], .woocommerce-cart .cart-options .form-shipping-calculator input[type="text"], .woocommerce-cart .cart-options .coupon select, .woocommerce-cart .cart-options .form-shipping-calculator select { width: 100%; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ background-color: transparent; border: 1px solid #ececec; padding: 15px 30px; font-style: italic; font-size: 16px; } .woocommerce-cart .cart-options .coupon .button, .woocommerce-cart .cart-options .form-shipping-calculator .button { float: right; margin: 30px 0 0; padding: 12px 35px !important; } .woocommerce-cart .cart-options .cart-collaterals .cart_totals { width: 100%; } .woocommerce-cart .cart-options .cart-collaterals .cart-subtotal th, .woocommerce-cart .cart-options .cart-collaterals .cart-subtotal td { padding-top: 0 !important; } .woocommerce-cart .cart-options .cart-collaterals .cart-subtotal td, .woocommerce-cart .cart-options .cart-collaterals .order-total td { text-align: right; } .woocommerce-cart .cart-options .cart-collaterals .cart-subtotal td .amount, .woocommerce-cart .cart-options .cart-collaterals .order-total td .amount { color: #141414; display: block; font-size: 18px; font-style: italic; font-weight: normal; } .woocommerce-cart .cart-options .cart-collaterals .order-total td .amount { font-size: 36px; } @media screen and (max-width: 767px) { /* * Checkout Page */ .woocommerce-cart table.cart thead tr th { text-align: center; font-size: 9px; } } .woocommerce .cart-total-table { padding: 20px; border: 2px solid #ececec; margin-bottom: 100px; } .woocommerce .cart-total-table table { border: none; } .woocommerce .cart-total-table th { font-size: 12px; color: #141414; text-transform: uppercase; font-weight: normal; } .woocommerce .cart-total-table th, .woocommerce .cart-total-table td { width: 50%; text-transform: uppercase; border-top: none !important; border-bottom: 1px solid #ececec !important; padding: 20px 0 !important; } .woocommerce .cart-total-table #shipping_method li { list-style: none; padding: 0; text-indent: 0; overflow: hidden; clear: both; line-height: 24px; margin: 0 0 25px; } .woocommerce .cart-total-table #shipping_method li input { display: block; float: left; margin-top: 5px; margin-right: 15px; } .woocommerce .cart-total-table #shipping_method li label { display: block; float: left; font-size: 10px; text-transform: uppercase; color: #6f6f6f; letter-spacing: 0.1em; font-family: inherit; font-style: normal; } .woocommerce .cart-total-table #shipping_method li label span { color: #141414; display: block; font-size: 18px; font-style: italic; font-weight: normal; } .woocommerce .cart-total-table .wc-proceed-to-checkout .checkout-button { padding: 21px; font-size: 14px; font-weight: bold; } .woocommerce form .form-row { margin-bottom: 25px; padding: 0; } .woocommerce form .form-row:last-child { margin-bottom: 0; } .woocommerce form .form-row label { font-size: 12px; font-style: italic; color: #141414; display: block; margin-bottom: 10px; text-transform: uppercase; } .woocommerce .button { padding: 18px 35px !important; -webkit-border-radius: 0 !important; -khtml-border-radius: 0 !important; -moz-border-radius: 0 !important; -ms-border-radius: 0 !important; -o-border-radius: 0 !important; border-radius: 0 !important; /* BACKGROUND GRADIENT */ } .woocommerce-checkout { /** * Product Single */ } .woocommerce-checkout .woocommerce { padding-bottom: 100px; } .woocommerce-checkout .select2-container .select2-choice { padding: 12px 17px; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ } .woocommerce-checkout .woocommerce-billing-fields > h3 { padding-bottom: 20px; margin-bottom: 30px; border-bottom: 1px solid #ececec; text-transform: uppercase; font-size: 14px; } .woocommerce-checkout .woocommerce-billing-fields .create-account { margin-bottom: 0; } .woocommerce-checkout .woocommerce-billing-fields .create-account label { letter-spacing: 0; font-size: 10px; font-family: inherit; font-weight: bold; font-style: normal; } .woocommerce-checkout .woocommerce-shipping-fields #ship-to-different-address { letter-spacing: 0; font-size: 10px; text-transform: uppercase; } .woocommerce-checkout .woocommerce-shipping-fields #ship-to-different-address .input-checkbox { display: inline; margin: -2px 8px 0 0; text-align: center; vertical-align: middle; } .woocommerce-checkout #order_review table tr th, .woocommerce-checkout #order_review table tr td { border: none; } .woocommerce-checkout #order_review table tr .product-total { text-align: right; } .woocommerce-checkout #order_review table tr .amount { display: block; font-size: 18px; line-height: 60px; font-style: italic; color: #141414; letter-spacing: 0.1em; font-weight: normal; } .woocommerce-checkout #order_review table .cart_item .product-name { font-size: 10px; } .woocommerce-checkout #order_review table .cart-subtotal td, .woocommerce-checkout #order_review table .order-total td { text-align: right; } .woocommerce-checkout #order_review_heading { color: #3d72a4; font-size: 18px; text-transform: uppercase; } .woocommerce-checkout #payment { background-color: transparent; } .woocommerce-checkout #payment h3 { color: #3d72a4; font-size: 18px; text-transform: uppercase; padding-bottom: 20px; border-bottom: 1px solid #ececec; } .woocommerce-checkout #payment ul.payment_methods { padding: 0; } .woocommerce-checkout #payment ul.payment_methods li { padding: 20px 0; border-bottom: 1px solid #ececec; } .woocommerce-checkout #payment ul.payment_methods li:last-child { border-bottom: none; } .woocommerce-checkout #payment ul.payment_methods li input { float: left; margin-top: 9px; } .woocommerce-checkout #payment ul.payment_methods li label { color: #141414; font-size: 10px; text-transform: uppercase; } .woocommerce-checkout #payment ul.payment_methods li .payment_box { background: transparent; padding: 20px 0; margin: 0; } .woocommerce-checkout #payment ul.payment_methods li .payment_box:after { content: none; } .woocommerce-checkout #payment #place_order { background-color: #3d72a4; display: block; color: #fff; width: 100%; } .woocommerce-checkout .order_details { margin: 0; } .woocommerce-checkout .order_details li { width: 20%; margin: 0; padding: 0; text-align: center; } .woocommerce-checkout h2 { font-size: 18px; text-transform: uppercase; color: #3d72a4; } .woocommerce-checkout .addresses .title h3 { font-size: 18px; text-transform: uppercase; color: #3d72a4; } @media screen and (max-width: 991px) { .woocommerce .products .zo-product-teaser { width: 100%; } } .zo-product-teaser { margin-bottom: 30px; position: relative; left: 50%; -webkit-transform: translateX(-50%); -khtml-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ display: inline-block; /** * Related Products */ } @media screen and (min-width: 992px) { .zo-product-teaser { width: 100%; } } @media (min-width: 480px) and (max-width: 991px) { .zo-product-teaser { width: inherit; } } .zo-product-teaser:hover .zo-product-header .zo-product-overlay { bottom: 0; } .zo-product-teaser .zo-product-header { position: relative; overflow: hidden; } .zo-product-teaser .zo-product-header .onsale { width: 50px; height: 40px; border: 2px solid #000; color: #333; line-height: 40px; text-align: center; position: absolute; top: 20px !important; left: 20px !important; right: auto !important; margin: 0; padding: 0; background-color: transparent; text-transform: uppercase; z-index: 10; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; /* BACKGROUND GRADIENT */ } .zo-product-teaser .zo-product-header img { margin: 0 !important; } @media screen and (max-width: 479px) { .zo-product-teaser .zo-product-header img { width: 100%; } } .zo-product-teaser .zo-product-header .zo-product-overlay { position: absolute; width: 100%; height: 60px; bottom: -60px; left: 0; -webkit-transition: all 200ms ease-in-out; -khtml-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; /* BACKGROUND GRADIENT */ /* TRIPLE BORDERS */ } .zo-product-teaser .zo-product-header .zo-product-overlay .zo-add-to-cart { position: absolute; bottom: 0; left: 0; width: 100%; } .zo-product-teaser .zo-product-header .zo-product-overlay .zo-add-to-cart .add_to_cart_button, .zo-product-teaser .zo-product-header .zo-product-overlay .zo-add-to-cart .added_to_cart { width: 100%; background-color: #3d72a4; padding: 0; height: 60px; line-height: 60px; letter-spacing: 0.05em; font-size: 14px; color: #000; text-align: center; display: block; } .zo-product-teaser .zo-product-header .zo-product-overlay .zo-add-to-cart .add_to_cart_button span:after, .zo-product-teaser .zo-product-header .zo-product-overlay .zo-add-to-cart .added_to_cart span:after { content: '+'; padding-left: 10px; } .zo-product-teaser .zo-product-header .zo-product-overlay .zo-add-to-cart .add_to_cart_button.added, .zo-product-teaser .zo-product-header .zo-product-overlay .zo-add-to-cart .added_to_cart.added { display: none; } .zo-product-teaser .zo-product-header .zo-product-overlay .zo-add-to-cart .add_to_cart_button.loading:after, .zo-product-teaser .zo-product-header .zo-product-overlay .zo-add-to-cart .added_to_cart.loading:after { content: "\f110"; display: inline-block; font-family: FontAwesome; margin-left: 10px; } .zo-product-teaser .zo-product-header .zo-product-overlay .zo-add-to-cart .add_to_cart_button:hover, .zo-product-teaser .zo-product-header .zo-product-overlay .zo-add-to-cart .added_to_cart:hover { color: #fff; } .zo-product-teaser .zo-product-header .zo-product-overlay .zo-add-to-cart .added_to_cart:before { content: "\f07a"; display: inline-block; font-family: FontAwesome; margin-right: 10px; } .zo-product-teaser .zo-product-meta .zo-product-title { padding: 0; margin: 0; } .zo-product-teaser .zo-product-meta .zo-product-title a { letter-spacing: 0.1em; font-size: 12px; line-height: 60px; text-transform: uppercase; font-weight: 400; color: #141414; } .zo-product-teaser .zo-product-meta .zo-product-title a:hover { color: #3d72a4; } .zo-product-teaser .zo-product-meta .zo-product-price { display: block; font-size: 18px; font-style: italic; color: #141414; } .zo-product-teaser .zo-product-meta .zo-product-price .amount { letter-spacing: 0.1em; } .zo-product-teaser .zo-product-meta .zo-product-price ins { float: left; margin-right: 10px; text-decoration: none; } .zo-product-teaser .zo-product-meta .zo-product-price del { color: #6f6f6f; } .zo-related-products { margin-top: 80px; margin-bottom: 250px; } .zo-related-products .zo-header { margin-bottom: 80px; text-align: center; } @media screen and (min-width: 1200px) { body.zo-boxed #page { margin-left: auto; margin-right: auto; width: 1200px; box-shadow: 0 0 30px rgba(0, 0, 0, 0.2); -webkite-box-shadow: 0 0 30px rgba(0, 0, 0, 0.2); } body.zo-boxed #page .vc_row.wpb_row { margin: 0; } body.zo-boxed #page #zo-header.header-fixed { margin-left: auto; margin-right: auto; width: 1200px; } } @media screen and (min-width: 768px) { .zo-contact-col-2 .vc_column-inner, .zo-contact-col-3 .vc_column-inner { float: right; } div.zo-contact-col-1 > .vc_column-inner { padding-left: 30px; } .zo-contact-col-2 .vc_column-inner { max-width: 250px; } .zo-contact-col-3 .vc_column-inner { max-width: 223px; padding-right: 30px; } } @media screen and (min-width: 992px) { .vc_row.vc_row-no-padding .vc_column_container.custom-col-6 { max-width: calc(1170px / 2); padding-right: 15px; padding-left: 15px; } .vc_row.vc_row-no-padding .wpb_column .zo-grid-item[class*="-2-zo"] { padding-right: 0; padding-left: 0; } } @media (min-width: 992px) and (max-width: 1400px) { .vertical-align-middle > .container > .row > div[class^="col"], .vertical-align-middle > .container-fluid > .row > div[class^="col"], .vertical-align-middle > .container > .row > div[class^="vc_col"], .vertical-align-middle > .container-fluid > .row > div[class^="vc_col"] { float: none; display: inline-block; vertical-align: middle; } .vertical-align-middle > .container > .row > .vc_col-sm-6, .vertical-align-middle > .container-fluid > .row > .vc_col-sm-6, .vertical-align-middle > .container > .row > .vc_col-md-6, .vertical-align-middle > .container-fluid > .row > .vc_col-md-6 { width: calc(50% - 2px); } .vertical-align-middle > .container > .row > .vc_col-sm-8, .vertical-align-middle > .container-fluid > .row > .vc_col-sm-8, .vertical-align-middle > .container > .row > .vc_col-md-8, .vertical-align-middle > .container-fluid > .row > .vc_col-md-8 { width: calc(66.6667% - 2px); } .vertical-align-middle > .container > .row > .vc_col-sm-4, .vertical-align-middle > .container-fluid > .row > .vc_col-sm-4, .vertical-align-middle > .container > .row > .vc_col-md-4, .vertical-align-middle > .container-fluid > .row > .vc_col-md-4 { width: calc(33.33333333% - 2px); } .vertical-align-middle > .container > .row > .vc_col-sm-7, .vertical-align-middle > .container-fluid > .row > .vc_col-sm-7, .vertical-align-middle > .container > .row > .vc_col-md-7, .vertical-align-middle > .container-fluid > .row > .vc_col-md-7 { width: calc(58.3333% - 2px); } .vertical-align-middle > .container > .row > .vc_col-sm-5, .vertical-align-middle > .container-fluid > .row > .vc_col-sm-5, .vertical-align-middle > .container > .row > .vc_col-md-5, .vertical-align-middle > .container-fluid > .row > .vc_col-md-5 { width: calc(41.6667% - 2px); } } @media screen and (max-width: 1024px) { #zo-header > .container { padding: 0 15px; } .wpb_column.padding-30 { padding: 0 30px !important; } .zo-row-full-width > .no-container { margin-left: 0; margin-right: 0; } .zo-row-full-width > .no-container > .row { margin-left: 0; margin-right: 0; } .zo-row-full-width > .no-container > .row > .wpb_column { padding: 0; } } @media screen and (max-width: 991px) { .vc_row.wpb_row { margin: 0; } .zo-welcome-row .vc_row-flex { display: block; } .zo-welcome-row .vc_row-flex .zo-pading-welcome { padding-left: 0px; } body .container { width: 100%; /* ========================================================================== Header Mobile ========================================================================== */ } #zo-header, #zo-header.header-fixed { height: 80px; /*Style Menu*/ } #zo-header > .container, #zo-header.header-fixed > .container { position: relative; z-index: 99; } #zo-header #zo-header-logo a, #zo-header.header-fixed #zo-header-logo a { line-height: 80px; } #zo-header #zo-header-logo a img, #zo-header.header-fixed #zo-header-logo a img { max-height: 55px; } #zo-header-right .widget_cart_search_wrap .widget_cart_search_wrap_item { width: 40px; display: inline-block; } #zo-header-right .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon { text-align: center; position: absolute !important; top: 19px; } #zo-header-right .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon.icon_cart_wrap { right: 100px; } #zo-header-right .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon.icon_search_wrap { right: 70px; } #zo-header-right .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon.icon_search_wrap i { padding-left: 0; } #zo-header-right .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon i { border: 0px; display: inline-block; height: 32px; width: 32px; line-height: 32px; } #zo-menu-mobile { display: block; } #zo-menu-mobile { position: absolute; right: 15px; bottom: 0; } #zo-header-navigation { display: none; } #zo-header-navigation.collapse { display: block; } #zo-header-navigation .main-navigation .menu-main-menu, #zo-header-navigation .main-navigation div.nav-menu > ul { text-align: left; } #zo-header-navigation .main-navigation .menu-main-menu > li a { text-transform: none; line-height: 50px; } body.fixed-margin-top #zo-header.header-fixed #zo-header-navigation .main-navigation .menu-main-menu > li { line-height: normal; /* ========================================================================== End Header Mobile ========================================================================== */ /* ========================================================================== Shortcode ========================================================================== */ /* Tab */ } .wpb_tour .ui-tabs.wpb_tour_tabs_wrapper { /* End Tab */ /* Shortcode Priccing */ } .wpb_tour .ui-tabs.wpb_tour_tabs_wrapper .wpb_tabs_nav { width: 31.667%; } .wpb_tour .ui-tabs.wpb_tour_tabs_wrapper .wpb_tab.ui-tabs-panel { width: 68.333%; } .zo-grid-pricing .zo-grid-item { margin-bottom: 80px; } .zo-grid-pricing .zo-grid-item:last-child { margin-bottom: 0; } body #zo-header.sticky-tablets { position: fixed; /* Footer Top */ } #zo-footer-top .row > [class*="col-"]:nth-child(2n+1) { clear: left; } #zo-footer-top [class^="col-"] { margin-bottom: 30px; } .wpb_single_image .vc_single_image-wrapper { /**Fancybox**/ } .wpb_single_image .vc_single_image-wrapper img { width: 100%; } .template-zo_fancybox--process .zo-fancybox-item:nth-child(2n) .zo-fancybox-inner::after { content: none; } } @media screen and (max-width: 767px) { .zo-welcome-row .vc_row-flex { display: block; } .zo-welcome-row .vc_row-flex .zo-pading-welcome { padding-left: 0px; } body #zo-header.sticky-mobile { position: fixed; /* Start Form Comment */ } #comments .comment-list ul.children { padding: 0; /* End Comment */ /* Tab */ } #comments .comment-list ul.children:before { height: 0; } #comments .comment-list ul.children .comment-main .comment-content:before { height: 0; } .wpb_tabs .ui-tabs.wpb_tour_tabs_wrapper .wpb_tabs_nav .ui-state-default a { line-height: 40px; padding: 0 20px; } .wpb_tabs .ui-tabs.wpb_tour_tabs_wrapper .wpb_tabs_nav .ui-state-default a span { display: none; } .ui-tabs-panel img { width: 100%; /* End Tab */ /* Footer Bottom */ } #zo-footer-bottom { /* End Footer Bottom */ /* Sidebar =================*/ } #zo-footer-bottom [class^="col-"] { text-align: center; } #zo-footer-bottom [class^="col-"] .text-left, #zo-footer-bottom [class^="col-"] .text-right, #zo-footer-bottom [class^="col-"] .align-right, #zo-footer-bottom [class^="col-"] .align-left { text-align: center; } #secondary { margin-top: 50px; } .zo-pricing-default .zo-pricing-item.pricing-feature-item .zo-pricing-inner { -webkit-transform: scale(1); -khtml-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); /* BACKGROUND GRADIENT */ /* TRANSFORM STYLE */ /**Fancybox**/ } .template-zo_fancybox--process .zo-fancybox-item .zo-fancybox-inner::after { content: none; /*Header widget Cart*/ } #zo-header-right .widget_cart_search_wrap .widget_cart_search_wrap_item > a.icon { top: 0px; } #zo-menu-mobile { bottom: 45px; } } @media screen and (max-width: 640px) { #zo-site-map a { padding: 0 20px 0 55px; /* End Footer Scroll Top */ /* Tab Custom Color */ } #zo-site-map a i { left: 21px; } .vc_tta-container { /* End Tab Custom Color */ } .vc_tta-container .vc_tta-tabs.custom-color { border: none; } } @media screen and (max-width: 480px) { #comments .comment-list li .comment-body .comment-author-image { padding: 0; float: none; max-width: inherit; text-align: center; } #comments .comment-list li .comment-body .comment-main { padding: 10px; } .single-post .post-navigation a { float: left; margin-top: 20px; } .navigation.post-navigation { text-align: center; /* End Comment */ } .navigation.post-navigation a { float: none; margin-bottom: 10px; } }