/* Theme Name: Physiotherapy Theme URI: http://themeforest.net/user/rayoflightt Author: RayoflightThemes Author URI: http://rayoflightthemes.com/ Description: Physiotherapy - Physical Therapy WordPress Theme Version: 2.0.9 Tags: gray, white, blue, red, light, right-sidebar, responsive-layout, accessibility-ready, custom-background, custom-colors, custom-menu, featured-images, post-formats, sticky-post, threaded-comments, translation-ready , page-builder License:http://themeforest.net License URI: http://themeforest.net/licenses */ /* ----------------------------------------------------------- CONTENT: less variables html5 and responsive content reset WordPress Core general classes header top (top widgets) menu flickity gallery slider and carousel team buttons main row boxes home blog carousel home blog list services gallery filter isotope footer blog pages inner pages sidebar and widgets counter testimonials vc customization accordion vc customization tour vc customization toggle vc customization tabs vc customization tabs accordion and tour new version above 4.7 vc customization post slider vc customization progress bar vc customization pie chart vc customization post grid contact form plugin timetable plugin woocommerce ------------------------------------------------------------*/ /*********** COLOR VARIABLES - CHANGE COLOR HERE ************/ /* dark blue */ @first-color: #466FA6; /* light blue */ @second-color: #88C1F2; /* red */ @third-color: #e7453a; /************* variables ************/ .transition { -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; } .borderradius0 { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .circle { -webkit-border-radius: 500px; -moz-border-radius: 500px; border-radius: 500px; } /************* variables end *************/ /************* html5 and responsive content *************/ header, nav, article, section, aside, footer { display: block; } img { -ms-interpolation-mode: bicubic; max-width: 100%; width: auto; } /*** for wp post and pages responsive images important! ***/ .comment-content img[height], img[class*="align"], img[class*="wp-image-"], img[class*="attachment-"], #site-header img { height: auto; } embed, object, video { max-width: 100%; } /********* html5 and responsive content end *********/ /************ reset ************/ a:link, a:visited { outline: none; text-decoration: none; color: @first-color; &:hover { outline: none; text-decoration: none; color: @second-color; } } ul, ol { margin: 0 0 11px 0; padding-left: 11px; line-height: 1.6; } ul li, ol li { margin: 0 0 11px 0; } h1, h2, h3, h4, h5, h6 { margin-top: 0; color: #333333; font-family: "Roboto", "open sans", arial, san-serif; } h1, h2 { font-weight: 500; margin-bottom: 22px; } h3, h4, h5, h6 { font-weight: 400; margin-bottom: 11px; } h1, h2 { line-height: 1.2; } h3, h4, h5, h6 { line-height: 1.4; } h6 { font-size: 14px; } h5 { font-size: 18px; } h4 { font-size: 22px; } h3 { font-size: 22px; } h2 { font-size: 27px; } h1 { font-size: 35px; } p { margin: 0 0 22px 0; color: #555555; font-size: 14px; font-family: "Open Sans", arial, san-serif; font-weight: 400; line-height: 1.6; } blockquote { margin: 0 0 22px 0; padding: 22px; } blockquote p { margin: 0; } /** IMPORTANT CLASS FOR METABOXES! **/ .hide { display: none!important; } /*** bootstrap fix important! ***/ .col-five-columns{ width: 20%; padding-right: 15px; padding-left: 15px; float: left; } @media (max-width: 992px) { .col-five-columns{ width: 50%; } } @media (max-width: 767px) { .col-five-columns{ width: 100%; } } .row { margin-right: 0; margin-left: 0; } @media (max-width: 767px) { .pull-right{ float: none; width: 100%; padding: 0; margin: 0; } } @media (max-width: 767px) { .navbar-fixed-top{ position: relative!important; } } /***bootstrap fix important end ***/ /************** reset end **************/ /************ WordPress Core ************/ .postnavigation { margin: 22px 0; a { font-size: 18px; } } .gallery-caption, .bypostauthor { } .alignnone { margin: 5px 20px 20px 0; } .aligncenter, div.aligncenter { display: block; margin: 5px auto 5px auto; } .alignright { float: right; margin: 5px 0 20px 20px; } .alignleft { float: left; margin: 5px 20px 20px 0; } .aligncenter { display: block; margin: 5px auto 5px auto; } a img.alignright { float: right; margin: 5px 0 20px 20px; } a img.alignnone { margin: 5px 20px 20px 0; } a img.alignleft { float: left; margin: 5px 20px 20px 0; } a img.aligncenter { display: block; margin-left: auto; margin-right: auto } .wp-caption { background: #fff; border: none; max-width: 96%; /* Image does not overflow the content area */ padding: 5px 3px 10px; text-align: center; } .wp-caption.alignnone { margin: 5px 20px 20px 0; } .wp-caption.alignleft { margin: 5px 20px 20px 0; } .wp-caption.alignright { margin: 5px 0 20px 20px; } .wp-caption img { border: 0 none; height: auto; margin: 0; max-width: 98.5%; padding: 0; width: auto; } .wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; margin: 0; padding: 0 4px 5px; } .sticky h2 a:link, .sticky h2 a:visited { color: @third-color; text-decoration: underline; } /* Text meant only for screen readers. */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; } .screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } /********** WordPress Core End **********/ /********* general classes *********/ html, body { height: 100%; } body { height: 100%; line-height: 1.6; background: #fff; background-attachment: fixed; font-size: 14px; font-family: "Open Sans", Arial, sans-serif; font-weight: 400; color: #555555; overflow-x: hidden; } ::selection { color: #fff; background: @first-color; } ::-moz-selection { color: #fff; background: @first-color; } /* important! */ .wrapper100percent { float: left; width: 100%; } .text-left{ text-align: left; } .text-right{ text-align: right; } .text-center{ text-align: center; } /*** sections for page sections posts ***/ .sectionpadding { position: relative; float: left; margin-top: 1px; padding-bottom: 120px; width: 100%; } .section1c1 { background: #fff; } .section1c2 { background: @first-color; h1, h2, h3, h4, h5, h6, p, input, form, textarea, body, { color: #fff; } a { color: #fff; &:hover { color: @second-color; } } } .section1c3 { background: @second-color; h1, h2, h3, h4, h5, h6, p, form, input, textarea, body, { color: #fff; } a { color: #fff; &:hover { color: @first-color; } } } .section1c4 { background: #f0f0f0; } /*** sections end ***/ .mainheadlinewrapper { margin-top: 0; margin-bottom: 35px; float: left; width: 100%; .mainheadline { h2 { display: inline-block; font-weight: 800; color: @first-color; font-size: 36px; line-height: 1; text-transform: uppercase; margin-bottom: 15px; } .headlineline { width: 100%; max-width: 40px; margin: 0 auto 11px auto; } i { color: @first-color; font-size: 14px; } h4 { font-weight: 500; font-size: 18px; text-transform: none; color: @second-color; } } } @media (max-width: 450px) { .mainheadlinewrapper { .mainheadline { h2 { font-size: 27px; } h4 { font-size: 14px; } } } } .mainheadlinewrappersmall { margin-top: 0; margin-bottom: 35px; float: left; width: 100%; text-transform: uppercase; .mainheadlinesmall { h3 { display: block; font-weight: 500; color: @first-color; font-size: 27px; line-height: 1; margin-bottom: 12px; } .headlineline { width: 100%; max-width: 66px; border-bottom: 3px solid @first-color; } i { color: @first-color; font-size: 14px; } } .mainheadlinesmall.text-center { .headlineline { margin: 0 auto; } } .mainheadlinesmall.text-right { .headlineline { float: right; } } } .mainheadlinewrapperpage { margin-top: 0; margin-bottom: 44px; padding: 22px 0; text-align: center; background: @second-color; h1 { font-size: 35px; margin-bottom: 0; color: #fff; } h2 { font-size: 18px; margin-bottom: 0; color: #fff; } p { font-size: 18px; margin-bottom: 0; color: #fff; } } /************* general classes end ******************/ /************* header top (top widgets) ******************/ /**logo text**/ h2.site-title{ font-size:18px; margin:0 0 5px 0; text-align:left; padding:0; border:none; } h2.site-description{ font-size:14px; font-weight: normal; margin:0; text-align:left; text-transform:none; } /**logo text end**/ .navbar-brand { height: auto; } .headerwrapper { input, select{ color: #555; } } .headerwrapper { height: auto; padding: 0; background: @first-color; ul li, ol li, a, p, h1, h2, h3, h4, h5, h6, .widget { color: #fff; } ul.headerul { li { float: left; margin-top: 10px; border-right: 1px solid #f0f0f0; } li:last-child { border-right: none; } } ul { margin: 2px 0; li { margin: 0 3px; font-size: 12px; padding: 5px 12px; line-height: 1; } i { font-size: 14px; } } ul.address-shortcode { li{ float: right; } } .socialicons { li { margin: 0; float: left; list-style: none; } i { font-size: 14px; &:hover { color: @second-color; } } } ul.socialicons li a:link, ul.socialicons li a:visited { border: none; width: 5px; height: 5px; padding: 0; &:hover { background: transparent; } } } .headerfirst{ background: #000; i { margin-top: 10px; } } ul.address-shortcode { li{ float: left; border: 2px solid @second-color; margin: 12px 10px 0 10px; padding: 8px 8px 2px 8px; } i{ font-size: 22px; float: left; padding-right: 8px; } h6{ float: left; line-height: 1; margin-top: 3px; } } @media (max-width: 996px){ .headerfirst{ float: left; width: 100%; padding-bottom: 5px; margin-top: -30px; } .headerwrapper{ float: left; width: 100%; text-align: center; padding-bottom: 5px; ul.headerul { width: 100%; text-align: center; li { width: 100%; border: none; } } .socialicons { width: 100%; float: left; li { float: none; } } } .headerwrapper{ ul.address-shortcode { li{ float: right; width: 100%; text-align: center; margin: 5px auto; } i{ float: none; } h6{ float: none; } } } } /************* header top (top widgets) end ******************/ /************* menu ****************/ /**no need for adminbar fix**/ @media (max-width: 767px){ .sticker{ position: relative!important; } } /** toggle icon **/ #toggle-icon { position: relative; width: 60px; height: 45px; margin: 27px auto; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); .transition; cursor: pointer; } #toggle-icon span { position: absolute; display: block; height: 5px; width: 100%; background: @first-color; border-radius: 10px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); .transition; } #toggle-icon span:nth-child(1) { top: 0px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; } #toggle-icon span:nth-child(2) { top: 15px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; } #toggle-icon span:nth-child(3) { top: 30px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; } #toggle-icon.open span:nth-child(1) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); top: -3px; left: 8px; } #toggle-icon.open span:nth-child(2) { width: 0%; opacity: 0; } #toggle-icon.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); top: 39px; left: 9px; } /** toggle icon end **/ @media (max-width: 600px) { .navbar-brand { width: 100%; text-align: center; margin-bottom: 0; } } .navbarwrapper { position: relative; z-index: 1000; float: left; width: 100%; height: auto; background: #fff; border-bottom: 2px solid #f0f0f0; border-top: 2px solid #f0f0f0; } .navbar { float: left; width: 100%; min-height: 70px; padding-right: 0; padding-left: 0; margin-bottom: 0; border-radius: 0; } .navbar li{ list-style: none; } .nav > li > a:link, .nav > li > a:visited { position: relative; display: inlne-block; padding: 27px 10px 15px 10px; background: transparent; font-size: 13px; font-family: "roboto"; font-weight: 500; text-transform: uppercase; .transition; } .nav > li > a:hover, .nav > li > a:active { color: @second-color; } .navbar-nav > .active > a:link, .navbar-nav > .active > a:visited, .navbar-nav > .active > a:hover, .navbar-nav > .active > a:focus { display: inlne-block; color: @second-color; .borderradius0; } /*** for dropdown hide ***/ .navbar-nav li ul { position: absolute; z-index: 100; left: -9999px; } .navbar-nav li:hover ul { left: 0; } .navbar-nav li:hover ul li ul { left: -9999px; } .navbar-nav li ul li ul { postion: absolute; left: -9999px; } .navbar-nav li ul li:hover ul { left: 0; } /*** for dropdown hide end ***/ /*** second level ***/ .navbar-nav > li > ul { padding: 0; margin: 0; width: 100%; } .navbar-nav > li > ul > li { padding: 0; margin: 2px 0 0 0; width: 100%; } .navbar-nav > li > ul > li > a:link, .navbar-nav > li > ul > li > a:visited { position: relative; display: block; padding: 7px 15px; min-width: 220px; background: #fff; border: 1px solid #f0f0f0; margin: 0; font-size: 14px; word-wrap: break-word; .transition; } .navbar-nav > li:hover ul { left:0; } /*** second level end ***/ /*** third level ***/ .navbar-nav > li > ul > li > ul { padding: 0; margin: -37px 0 0 220px; width: 100%; } .navbar-nav > li > ul > li > ul > li { padding: 0; margin: 0; width: 100%; } .navbar-nav > li > ul > li > ul > li > a:link, .navbar-nav > li > ul > li > ul > li > a:visited { position: relative; display: block; padding: 7px 15px; min-width: 220px; word-wrap: break-word; margin: 1px; font-size: 13px; background: #fff; border: 1px solid #f0f0f0; .transition; } @media (max-width: 767px) { .navbar-nav > li > ul > li > a:link, .navbar-nav > li > ul > li > a:visited { border: none; } .navbar-nav > li > ul > li > ul > li { border: none; } .navbar-nav > li > ul > li > ul > li > a:link, .navbar-nav > li > ul > li > ul > li > a:visited { display: block; width: 100%; } .navbar-nav > li > ul > li > ul { display: block; margin: 0; width: 100%; } } .navbar-nav > li:hover ul { left:0; } /*** third level end ***/ @media (max-width: 1200px) { .nav > li > a:link, .nav > li > a:visited { padding: 27px 12px 14px 12px; } } @media (max-width: 1000px) { .nav > li > a:link, .nav > li > a:visited { padding: 27px 4px 14px 4px; font-size:13px; } } @media (max-width: 767px) { .navbar-nav > li > a { margin-bottom: 5px; } .navbar-nav > li > a { margin-left: 0; } .navbar-nav > li > a{ margin-right: 0; } .nav li a:link, .nav li a:visited { padding: 14px 4px; font-size: 14px; background: #f0f0f0; margin-bottom: 5px; } .navbar-nav li ul li a:link, .navbar-nav li ul li a:visited { padding: 14px 4px; font-size: 14px; background: #f0f0f0; } .navbar-nav li ul li ul li a:link, .navbar-nav li ul li ul li a:visited { padding: 7px 4px; font-size: 14px; background: #f0f0f0; margin: 0; } .navbar { height: auto; } .nav { margin-top: 20px; } .nav li { width: 100%; text-align: center; } .navbar-nav > li > ul > li > a:link, .navbar-nav > li > ul > li > a:visited { width: 100%; text-align: center; display: block; } .navbar-nav li ul { position: relative; z-index: 100; left: 0; } .navbar-nav li:hover ul { left: 0; } .navbar-nav li:hover ul li ul { left: 0; } .navbar-nav li ul li ul { postion: relative; left: 0; } .navbar-nav li ul li:hover ul { left: 0; } .navbarwrapper { position: relative; z-index: 900; } } /************ menu end *************/ /*********** flickity gallery slider and carousel ****************/ /*! Flickity v1.0.0 http://flickity.metafizzy.co ---------------------------------------------- */ .flickity-enabled { position: relative; } .flickity-enabled:focus { outline: none; } .flickity-viewport { overflow: hidden; position: relative; height: 100%; } .flickity-slider { position: absolute; width: 100%; height: 100%; } .flickity-enabled.is-draggable { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .flickity-enabled.is-draggable .flickity-viewport { cursor: move; cursor: -webkit-grab; cursor: grab; } .flickity-enabled.is-draggable .flickity-viewport.is-pointer-down { cursor: -webkit-grabbing; cursor: grabbing; } /* ---- previous/next buttons ---- */ .flickity-prev-next-button { position: absolute; top: 50%; width: 44px; height: 44px; border: none; border-radius: 50%; background: white; background: hsla(0, 0%, 100%, 0.75); cursor: pointer; /* vertically center */ -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .flickity-prev-next-button:hover { background: #fff; } .flickity-prev-next-button:focus { outline: none; } .flickity-prev-next-button:active { filter: alpha(opacity=60); /* IE8 */ opacity: 0.6; } .flickity-prev-next-button.previous { left: 10px; } .flickity-prev-next-button.next { right: 10px; } .flickity-rtl .flickity-prev-next-button.previous { left: auto; right: 10px; } .flickity-rtl .flickity-prev-next-button.next { right: auto; left: 10px; } .flickity-prev-next-button:disabled { filter: alpha(opacity=30); /* IE8 */ opacity: 0.3; cursor: auto; } .flickity-prev-next-button svg { position: absolute; left: 20%; top: 20%; width: 60%; height: 60%; } .flickity-prev-next-button .arrow { fill: #333; } /* color & size if no SVG - IE8 and Android 2.3 */ .flickity-prev-next-button.no-svg { color: #333; font-size: 26px; } /* ---- page dots ---- */ .flickity-page-dots { position: absolute; width: 100%; bottom: -25px; padding: 0; margin: 0; list-style: none; text-align: center; line-height: 1; } .flickity-rtl .flickity-page-dots { direction: rtl; } .flickity-page-dots .dot { display: inline-block; width: 10px; height: 10px; margin: 0 8px; background: #333; border-radius: 50%; filter: alpha(opacity=25); /* IE8 */ opacity: 0.25; cursor: pointer; } .flickity-page-dots .dot.is-selected { filter: alpha(opacity=100); /* IE8 */ opacity: 1; } /* demo galleries ------------------------- */ /* hero-gallery ------------------------- */ .hero-gallery { margin-bottom: 0; background: #f0f0f0; background-size: cover; border-bottom: 1px solid #f0f0f0; } .hero-gallery__cell { position: relative; width: 100%; } .hero-gallery__cell2 { min-height: 600px; } /**** slider ****/ .sliderimage { text-align: center; } .slidertext { position: absolute; height: 50px; width: 100%; top: 50%; transform: translateY(-25%); z-index: 500; width: 100%; height: 100%; } .slidertextinner { position: relative; max-width: 1100px; margin: 0 auto; } .slidershortcode { padding: 0 20px; .hvr-shutter-out-horizontal { background: @third-color!important; } .hvr-shutter-out-horizontal:before { background: @first-color; } h2{ font-weight: 900; font-size: 44px; text-transform: uppercase; margin-bottom: 10px; color: @first-color; } h3 { font-weight: 400; font-size: 27px; margin-bottom: 8px; text-transform: uppercase; color: @second-color; } h4{ letter-spacing: 1px; font-weight: 400; font-size: 22px; margin-bottom: 22px; font-family: "open sans"; } } .textcolor.slidershortcode { h2{ color: #fff; } h3 { color: #fff; } h4{ color: #fff; } } .slidershortcode.text-right{ width: 50%; float: right; } .slidershortcode.text-left{ width: 50%; float: left; } @media (max-width: 1200px) { .slidertextinner { max-width: 960px; } .slidershortcode { overflow: visible; h2{ font-size: 35px; } h3{ font-size: 22px; } h4{ font-size: 18px; } } } @media (max-width: 1000px) { .slidertext { position: relative; top: 0; transform: translateY(0); padding-top: 22px; } .slidershortcode.text-right{ width: 100%; text-align: center; } .slidershortcode.text-left{ width: 100%; text-align: center; } .hero-gallery__cell2 { min-height: 400px; } } @media (max-width: 767px) { .hero-gallery__cell2 { .slidertext { position: absolute; top: 0; transform: translateY(0); } } .slidershortcode { .slidershortcodeimage{ border: 2px solid @first-color; width: 55px; height: 55px; .circle; margin-bottom: 15px; text-align: center; padding-top: 12px; img { max-width: 25px; } } } } @media (max-width: 500px) { .hero-gallery__cell2 { min-height: 300px!important; } .slidershortcode { img{ max-width: 35px; } h2{ font-size: 27px; } h3{ font-size: 18px; } h4{ font-size: 14px; } .button1 a{ font-size: 14px; } } } /******* slider end *******/ /******* carousel *******/ @media (max-width: 1000px) { .carouselwidth { width: 50%; float: left; } } @media (max-width: 767px) { .carouselwidth { width: 100%; } } .carouselwrapper { position: relative; } .carouselimage { position: relative; z-index: 100; } .flickity-enabled .gallery-cell { margin-bottom: 0; } /**** hover effect on images ****/ .view { width: 100%; height: 100%; overflow: hidden; cursor: default; .maskhover { position: absolute; z-index: 900; top: 0; left: 0; width: 100%; height: 100%; ul { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); text-align: center; width: 100%; li { display: inline-block; list-style: none; } } a { display: block; font-size: 15px; padding-top: 5px; background: @first-color; width: 42px; height: 42px; border: 2px solid #f0f0f0; margin: 5px; color: #fff; text-align: center; } p { margin: 0; } } } .view-first .maskhover { -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; background-color: rgba(255, 255, 255, 0.7); .transition; } .view-first:hover .maskhover { -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; } .view-first a{ -webkit-transform: translateY(-300%); -moz-transform: translateY(-300%); -o-transform: translateY(-300%); -ms-transform: translateY(-300%); transform: translateY(-300%); -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear; -ms-transition: all 0.2s linear; transition: all 0.2s linear; } .view-first:hover a { -webkit-transform: translateY(40%); -moz-transform: translateY(40%); -o-transform: translateY(40%); -ms-transform: translateY(40%); transform: translateY(40%); -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; } .view-first a.delay { -webkit-transform: translateY(-300%); -moz-transform: translateY(-300%); -o-transform: translateY(-300%); -ms-transform: translateY(-300%); transform: translateY(-300%); -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; -webkit-transition: all 0.4s linear; -moz-transition: all 0.4s linear; -o-transition: all 0.4s linear; -ms-transition: all 0.4s linear; transition: all 0.4s linear; } .view-first:hover a.delay { -webkit-transform: translateY(40%); -moz-transform: translateY(40%); -o-transform: translateY(40%); -ms-transform: translateY(40%); transform: translateY(40%); -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; } /**** hover effect on images end ****/ /*** carousel end ****/ .gallery--not-counting .gallery-cell:before { content: none; } .gallery--full-width .gallery-cell { width: 100%; } .gallery--half-width .gallery-cell { width: 50%; } .gallery--various-widths .gallery-cell { width: 33%; } .gallery--various-widths .gallery-cell.size-180 { width: 180px; } .gallery--various-widths .gallery-cell.size-large { width: 75%; } .gallery--media-queried .gallery-cell { width: 100%; } .gallery--selected-cell .gallery-cell.is-selected { background: #ED2; } .gallery--gallery-focus:focus .flickity-viewport { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; } /* ---- show-several ---- */ .gallery--show-several .gallery-cell { width: 28%; } /* ---- auto-play ---- */ /* ---- images-loaded ---- */ .gallery--images-loaded-demo img { display: block; height: 160px; } .gallery--images-demo { margin-bottom: 40px; } .gallery--images-demo img { display: block; height: 160px; } .gallery--watch-demo:after { content: 'flickity'; display: none; } .gallery--watch-demo .gallery-cell { margin-right: 10px; } .gallery--cell-selector-demo { position: relative; } .gallery--pixel-position-demo .gallery-cell { width: 300px; } .gallery--set-gallery-size-disabled { height: 160px; } .gallery--set-gallery-size-disabled .gallery-cell { height: 100%; } .gallery--set-gallery-size-disabled-percentage { padding-bottom: 50%; } .gallery--set-gallery-size-disabled-percentage .flickity-viewport { position: absolute; width: 100%; } .gallery--set-gallery-size-disabled-percentage .gallery-cell { height: 100%; } .gallery--resize-option { width: 300px; } .gallery--resize { width: 50%; min-width: 240px; } .gallery--resize.is-expanded { width: 100%; } .gallery--resize.is-expanded .gallery-cell:before { line-height: 320px; } .gallery--position-cells .gallery-cell { position: relative; width: 33%; } .gallery--position-cells .gallery-cell.is-expanded { width: 80%; } .gallery-cell .button { position: absolute; left: 10px; top: 10px; } .gallery--as-nav-for-main { margin-bottom: 40px; } .gallery--nav .gallery-cell { height: 80px; width: 100px; } .gallery--nav .gallery-cell:before { font-size: 50px; line-height: 80px; } .gallery--nav .gallery-cell.is-nav-selected { background: #ED2; } .gallery--static-click .gallery-cell { width: 26%; } .gallery--static-click .gallery-cell.is-clicked { background: #ED2; } @media screen and ( min-width: 768px ) { .gallery--media-queried .gallery-cell { width: 50%; } .gallery--watch-demo:after { content: ''; } .gallery--images-demo img { height: 400px; } } /*********** flickity gallery slider and carousel end ****************/ /************* team *************/ .teamcolumn { margin-bottom: 22px; text-align: center; img { display: block; margin: 0 auto; float: none; } h4 { line-height: 1; } p.teamjob { color: @second-color; margin-bottom: 14px; font-weight: 400; font-family: roboto; } .teamimagecontainer{ position: relative; float: left; width: 100%; } .teamtextcontainer{ position: relative; float: left; width: 100%; padding: 22px; border: 2px solid #f0f0f0; background: #fff; } } @media (max-width: 991px) { .teamcolumn{ max-width: 300px; margin: 0; float: none; } .teamtextcontainer{ margin-bottom: 44px; } } /********* team end *********/ /*********** buttons ************/ .button1 { a { &:link, &:visited { display: inline-block; text-wrap: none; font-family: roboto; text-align: center; background: @first-color; border: 2px solid #f0f0f0; color: #fff; .transition; } &:hover{ color: #fff; } &:focus{ color: #fff; } } } .button2 { a { &:link, &:visited { display: inline-block; text-wrap: none; font-family: roboto; text-align: center; background: #fff; border: 2px solid #f0f0f0; color: @first-color; .transition; } &:hover{ color: #fff; } &:focus{ color: #fff; } } } .button-small a{ font-size: 12px; padding: 4px 10px; text-transform: uppercase; font-weight: 500; } .button-medium a{ font-size: 14px; padding: 6px 17px; font-weight: 500; text-transform: uppercase; } .button-large a{ font-size: 18px; padding: 8px 35px; font-weight: 600; text-transform: uppercase; } /* Shutter Out Horizontal */ .hvr-shutter-out-horizontal { display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); background: @first-color; -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } .hvr-shutter-out-horizontal:before { content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: 0; right: 0; background: @third-color; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } .hvr-shutter-out-horizontal:hover, .hvr-shutter-out-horizontal:focus, .hvr-shutter-out-horizontal:active { color: white; } .hvr-shutter-out-horizontal:hover:before, .hvr-shutter-out-horizontal:focus:before, .hvr-shutter-out-horizontal:active:before { -webkit-transform: scaleX(1); transform: scaleX(1); } /************ buttons end *************/ /************** main row boxes **************/ /* Curl Top Right on hover */ .hvr-curl-top-right { display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; } .hvr-curl-top-right:before { pointer-events: none; position: absolute; content: ''; height: 0; width: 0; top: 0; right: 0; background: linear-gradient(225deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%); box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.4); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-property: width, height; transition-property: width, height; } .hvr-curl-top-right:hover:before, .hvr-curl-top-right:focus:before, .hvr-curl-top-right:active:before { width: 45px; height: 45px; } /* Curl Top Right on hover end */ /* curl top right active post */ .hvr-curl-top-right-active { display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; .onecolumn { background: @second-color; .hvr-shutter-out-horizontal:before { background: @first-color; } .button1 a{ background: @second-color; } .imgwrapper { border: #fff 2px solid; i { color: @second-color; } } .button1 { a { &:link, &:visited { background: @third-color; } } } } } .hvr-curl-top-right-active:before { pointer-events: none; position: absolute; content: ''; height: 0; width: 0; top: 0; right: 0; background: linear-gradient(225deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%); box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.4); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-property: width, height; transition-property: width, height; } .hvr-curl-top-right-active:before, .hvr-curl-top-right-active:hover:before, .hvr-curl-top-right-active:focus:before, .hvr-curl-top-right-active:active:before { width: 45px; height: 45px; } /* curl top right active post end */ .column1 { width: 100%; float: left; } .column2 { width: 50%; float: left; } .column3 { width: 33.33%; float: left; } .column4 { width: 25%; float: left; } .column5 { width: 20%; float: left; } @media (max-width: 766px) { .column2 { width: 100%; margin: 0; } .column3 { width: 100%; margin: 0; } .column4 { width: 100%; margin: 0; } .column5 { width: 100%; margin: 0; } } .onecolumnwrapper { margin: 0 auto; .hvr-shutter-out-horizontal:before { background: @first-color; } } .boxed { max-width: 1150px; } .onecolumnwrapper2 { margin: 0 auto; text-align: center; .onecolumn { padding: 44px 0; } .hvr-shutter-out-horizontal:before { background: @first-color; } h2 { margin-bottom: 22px; text-transform: uppercase; font-size: 27px; } } .onecolumn { padding: 30px; background: @first-color; margin-left: 1px; margin-right: 1px; .transition; color: #fff; .imgwrapper { margin-bottom: 20px; background: #fff; width: 72px; height: 72px; .circle; .transition; text-align: center; } img { padding-top: 15px; max-width: 40px; } i { font-size: 35px; padding-top: 18px; color: @first-color; } h3 { font-size: 22px; font-weight: 600; text-transform: uppercase; } p, h1, h2, h3, h4, h5, h6 { color: #fff; } ul li{ list-style: none; } &:hover { background: @second-color; } .button1 { a { &:link, &:visited { margin-top: 5px; background: @second-color; } } } &:hover { i { color: @second-color; } .button1 { a { &:link, &:visited { background: @third-color; } } } } } .workingtime { border-bottom: 1px solid #fff; margin-bottom: 11px; h6 { display: inline-block; } h6.text-right { float: right; } } /********* main row boxes end **********/ /************** home blog carousel ***************/ .onelistblog{ width: 100%; float: left; margin-bottom: 22px; } .homeblog { position: relative; z-index:100; max-width: 300px; .homeblogtext{ padding: 15px; border: 2px solid #f0f0f0; background: #fff; } .meta { ul{ width: 100%; float: left; background: #fff; margin: 0; padding: 0; list-style: none; text-align: center; padding: 10px 22px; border: 2px solid #f0f0f0; li{ display:inline-block; float:left; width: 100%; padding: 5px 0; margin-bottom: 0; background: transparent; color: @second-color; border: none; font-family: roboto; font-weight: 600; } } } } @media (max-width: 991px) { .homeblog{ margin: 0 auto 22px auto; float: none; width: 100%; } } @media (min-width: 767px) { .homeblogimage{ display: block; } .homeblogimage1{ display: none; } } @media (max-width: 767px) { .homeblogrow .homeblog{ margin-bottom: 22px; } .homeblogimage{ display: none; } .homeblogimage1{ display: block; } } @media (max-width: 500px) { .homeblog .homeblogrow .homeblogtext{ padding: 20px; } } /********* home blog carousel end *********/ /********* home blog list *********/ .homeblog-list{ float: left; .postthumb { width: 20%; margin-right: 4%; height: 100%; float: left; img{ width: 100%; } } .posttext { width: 76%; float: left; border-bottom: 2px solid #f0f0f0; margin-bottom: 22px; } .meta{ float: left; width: 100%; margin-bottom: 0; li{ float: left; list-style: none; margin-right: 12px; } i{ color: @first-color; } } } /********* home blog list end *********/ /*********** services *************/ .services { width: 100%; height: auto; text-align: center; h4 { font-weight: 400; } .servicesicon { margin: 0 auto 15px auto; .circle; .transition; width: 72px; height: 72px; img { max-width: 45px; margin-top: 25px; } i { color: #fff; font-size: 35px; padding-top: 18px; } } } .serviceone .servicesicon { background: @first-color; .transition; } .serviceone:hover .servicesicon { background: @third-color; } @media (max-width:996px) { .serviceone { margin-bottom: 44px; } } /*********** services end *************/ /*************** gallery filter isotope ********************/ .isotopewrapper{ img { width: 100%; margin-bottom: 30px; } #filters{ text-align: center; margin-bottom: 22px; } .gallery-button.hvr-shutter-out-horizontal { border: none; color: #fff; padding: 7px 20px; background: @first-color; margin-top: 22px; } .gallery-button.hvr-shutter-out-horizontal:before { background: @third-color; } } /*************** gallery filter isotope end ********************/ /************* footer *****************/ /***footer stay at bottom fix***/ #wrapperpages { width: 100%; min-height: 100%; float: left; } /***footer stay at bottom fix end***/ .bottom { width: 100%; float: left; min-height: 44px; background: @first-color; padding: 44px 0; border-top: 2px solid @second-color; input{ color: #555555; height: 35px!important; min-width: 80px; } } .copyrightwrapper { background: #000; float: left; width: 100%; p { color: #fff; font-size: 12px; padding: 20px 0; margin: 0; } a { color: #fff; font-size: 12px; padding: 20px 0; margin: 0; font-weight: bold; } } .scrollbutton a i{ .circle; margin: 10px 0; float: right; font-size: 15px; border: 2px solid @first-color; padding: 10px; .transition; &:hover{ background: @second-color; } } /** social icons **/ .socialicons { text-align: center; } .socialicons { li { margin:0 5px 5px 0; display: inline-block; text-align: center; list-style: none; } i { font-size: 27px; color: #fff; } } ul.socialicons li a:link, ul.socialicons li a:visited { display: inline-block; border: 2px solid @second-color; width: 72px; height: 72px; padding-top: 20px; .transition; .circle; &:hover { background: @second-color; } } /** social icons end **/ /************* footer end *************/ /************** blog pages **************/ .one-post{ margin-bottom: 44px; } label{ font-weight:normal; } /***for featured images***/ .postimage img { margin-bottom: 22px; } /***meta***/ .meta.metainner { ul{ width: 100%; float: left; margin: 0 0 22px 0; padding: 0; list-style: none; li{ padding: 5px 10px; float: left; margin-bottom: 0; color: @second-color; i{ padding-right: 5px; } } } } .meta.metainner { ul.metatimeul { margin-bottom: 0; li.metatime{ width: 100%; text-align: center; float: left; font-size: 18px; padding: 10px 0; color: @second-color; border: 2px solid #f0f0f0; margin: 0; } } } @media (max-width: 767px) { .meta.metainner ul li{ width: 100%; } } /***meta end***/ /*tags*/ .tags { margin: 22px 0; } .tags a{ padding: 5px; text-transform: uppercase; font-size: 14px; } /*** blog comments ***/ .comment-respond h3 { margin-top: 0; margin-bottom: 24px; } .comment cite { display:block; margin-top:11px; } .comments-area { margin: 48px auto; } .comment-reply-title, .comments-title { text-transform: uppercase; } .comment-list .reply { margin-top: 0px; } .comment-list article, .comment-list .pingback, .comment-list .trackback { margin-bottom: 24px; padding-top: 24px; } .comment-content ul, .comment-content ol { margin: 0 0 24px 22px; } .comment-content li > ul, .comment-content li > ol { margin-bottom: 0; } .comment-content > :last-child { margin-bottom: 0; } .comment-list .children { list-style: none; margin-left: 15px; } .comment-respond { margin-bottom: 24px; padding: 0; } .comment .comment-respond { margin-top: 24px; } .comment-notes, .comment-awaiting-moderation, .logged-in-as, .no-comments, .form-allowed-tags, .form-allowed-tags code { background:transparent; width:auto; line-height: 1.5; } .commenttext ol { padding:0; list-style:none; margin-bottom:21px; } .comments .avatar{ display:block; width:150px; height:150px; } .comments img{ margin:10px; } .commenttext h3, .commenttext p.date{ display:inline-blocK; } .commenttext h3{ text-transform:uppercase; } .commenttext p.date{ font-weight:bold; margin-left:10px; } .reply { text-align:left; padding-top:0px; padding-bottom:21px; } .reply a:link, .reply a:visited{ text-transform:uppercase; font-size:14px; } /**bootstrap fix***/ code { display: block; white-space: normal!important; } .comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"] { width:100%; float:left; box-shadow:none; border: #f0f0f0 2px solid; box-shadow:none; padding:0 20px; outline:none; height:40px; .transition; margin-bottom:21px; } .comment-form textarea{ width:100%; float:left; padding: 20px; box-shadow:none; border: #f0f0f0 2px solid; box-shadow:none; outline:none; height:250px; .transition; margin-bottom:21px; } .comment-form input:hover, .comment-form textarea:hover { border:@first-color 2px solid; } .comment-form input:focus, .comment-form textarea:focus { border:@first-color 2px solid; } .comment-form button, .comment-form .button, .comment-form input[type="button"], .comment-form input[type="reset"], .comment-form input[type="submit"] { background-color: @first-color; border: none; margin:21px 0; border-radius: 0px; color: #fff; padding: 5px 10px ; text-transform: uppercase; vertical-align: bottom; float:left; box-shadow:none; box-shadow:none; outline:none; height:50px; } .comment-form button:hover, .comment-form button:focus, .comment-form .button:hover, .comment-form .button:focus, .comment-form input[type="button"]:hover, .comment-form input[type="button"]:focus, .comment-form input[type="reset"]:hover, .comment-form input[type="reset"]:focus, .comment-form input[type="submit"]:hover, .comment-form input[type="submit"]:focus { background-color: @third-color; } h4.commentsheadline, .blogcommentform h6, .blogcommentform h5, .blogcommentform h4, .blogcommentform h3, .blogcommentform h2, .blogcommentform h1 { font-size: 28px; } /***blog comments end***/ .pagination { margin-bottom: 66px; float: right; } .pagination a:link, .pagination a:visited { display: inline-block; width: 33px; height: 33px; padding-top: 5px; margin-left: 5px; text-align: center; border: 2px solid #f0f0f0; .circle; } .pagination a:hover { color: @second-color; border: 2px solid @second-color; } .pagination .current{ display: inline-block; width: 33px; height: 33px; padding-top: 5px; margin-left: 5px; text-align: center; border: 2px solid @first-color; .circle; } .blogpost { img { margin-bottom: 20px; } } .commentwrapper { margin: 12px 0; width: 100%; float: left; } /********* blog pages end *********/ /************* inner pages *************/ @media (min-width: 767px) { .leftsidebar { float: right; } .innerpagecontent { float: right; } } .widget { margin:0 auto 44px auto; } /********** inner pages end ***********/ /************* sidebar and widgets **************/ .widget { a { font-family: roboto; font-weight: bold; } ul li, ol li{ list-style: none; } } .scrollbutton { text-align: center; i { color: #fff; } } .sidebar { height: 100%; } .contentr { float:right; } @media (max-width: 992px) { .sidebar { float: left; width:100%; padding-top:44px; } .sidebarl { float: left; width:100%; } .contentr { float: none; } } /*** widgets style1 for sidebar ***/ .widgets-style1 .widget { margin-bottom: 12px; padding: 20px; float: left; width: 100%; border: 2px solid #f0f0f0; ul li, ol li{ list-style: none; } } .widgets-style1 h4 { margin-bottom: 22px; font-size: 18px; text-align: center; } .widget select { width:100%; max-width: 300px; } .widgets-style1 .tagcloud a{ display: inline-block; margin: 2px; font-size: 14px!important; padding: 5px; } .widgets-style1 .tagcloud a:hover{ color: @second-color; } .widgets-style1 .widget ul, .widgets-style1 .widget li { list-style:disc; } .widgets-style1 .widget ul { margin: 0; padding: 0 0 12px 12px; } .headerwrapper .searchform { margin-top: 22px; margin-bottom: -22px; input[type='submit']{ width: 20px; height: 20px; background: url(assets/images/searchwhite.png) center center no-repeat; background-size: 100% 100%; } } footer.bottom .searchform { float: right; input[type='submit']{ width: 20px; height: 20px; background: url(assets/images/searchwhite.png) center center no-repeat; background-size: 100% 100%; } } .searchform { width: 100%; label { display: none; } input[type='text']{ max-width: 80%; border-top: none; border-right: none; border-left: none; border-bottom: #f0f0f0 2px solid; background: transparent; .transition; &:focus{ border-bottom: @second-color 2px solid; } } input[type='submit']{ max-width: 20%; display: inline-block; width: 20px; height: 20px; background: url(assets/images/search.png) center center no-repeat; background-size: 100% 100%; border: none; box-shadow: none; font-size: 12px; .transition; &:hover{ } } } /* Calendar Widget */ .widgets-style1 .widget #wp-calendar{ width: 100%; } .widgets-style1 .widget_calendar table, .widgets-style1 .widget_calendar td { border: 0; border-collapse: separate; } .widgets-style1 .widget_calendar caption { font-size: 14px; margin: 0 0 11px 0; text-align: left; } .widgets-style1 .widget_calendar th, .widgets-style1 .widget_calendar td { padding: 0; text-align: center; } .widgets-style1 .widget_calendar a { display: block; color: @second-color; } .widgets-style1 .widget_calendar a:hover { color: @third-color; } .widgets-style1 .widget_calendar a:active { background: @second-color; } .widgets-style1 .widget_calendar tbody td { background: @first-color; color: #fff; padding:3px; } /***widgets style1 for sidebar***/ /***widgets style2 for footer***/ /* events widget */ .widgets-style2 .widget.tribe-events-list-widget { ol li{ list-style: none!important; } h4{ font-size: 18px; font-weight: normal; } span { font-weight: normal; } } /* events widget end */ .widgets-style2 .widget { background: transparent; } .widgets-style2 h4 { text-align:left; color: #fff; } .widgets-style2 .tagcloud a{ font-size: 14px!important; } .widgets-style2 .widget_calendar { width: 100%; } .widgets-style2 .widget_calendar a:hover { border: 1px solid #fff; } .widgets-style2 a{ color: #fff; } .widgets-style2 .widget a:hover{ color: @second-color; } .widgets-style2 input[type="text"], .widgets-style2 a , .widgets-style2 p, .widgets-style2 h3, .widgets-style2 label, .widgets-style2 td, .widgets-style2 th, .widgets-style2 ul li, .widgets-style2 caption { color: #fff; } /* Calendar Widget */ .widgets-style2 .widget #wp-calendar{ width: 100%; } .widgets-style2 .widget_calendar table, .widgets-style2 .widget_calendar td { border: 0; border-collapse: separate; } .widgets-style2 .widget_calendar caption { font-size: 14px; margin: 0 0 11px 0; text-align: left; } .widgets-style2 .widget_calendar th, .widgets-style2 .widget_calendar td { padding: 0; text-align: center; } .widgets-style2 .widget_calendar a { display: block; color: @second-color; border: none; } .widgets-style2 .widget_calendar a:hover { color: @third-color; border: none; } .widgets-style2 .widget_calendar a:active { background: @second-color; } .widgets-style2 .widget_calendar tbody td { background: #fff; padding:3px; color: @first-color; } .widgets-style2 select option { color: #555555; } /***widgets style1 for footer field for icons end***/ /********* sidebar and widgets end **********/ /************ counter ***************/ .timerwrappercolor1 { p { color: #fff; } h6 { color: #fff; } } .timerwrappercolor2 { p { color: @first-color; } h6 { color: @first-color; } } .timerwrapper { text-align: center; .onecounter { margin: 0 auto; .transition; } p { font-size:44px; line-height: 1; font-weight:700; margin-bottom: 10px; font-family: roboto; } h6 { font-size:18px; font-weight: 400; margin-bottom: 0; font-family: "open sans"; line-height: 1; } } @media (max-width: 767px) { .timerwrapper { h6 { margin-bottom: 44px; } } } /************ counter end ************/ /*********** testimonials *****************/ .testimonials { text-align: center; .testimonialsinner { background: #fff; width: 100%; float: left; padding: 20px; } img { width: 80px; height: 80px; margin: 22px auto; float: none; .circle; } } @media (max-width: 1000px) { .testimonials { width: 50%; float: left; } } @media (max-width: 767px) { .testimonials { width: 100%; } } /************ testimonials end *************/ /************ vc customization accordion **************/ .wpb_content_element { .ui-accordion { width:100%; .ui-accordion-header { background: #fff!important; border: 2px solid #f0f0f0; cursor:pointer; position:relative; margin-top:1px; .transition; /* jquery-ui facelift */ font-family: inherit; font-weight: inherit; font-size: inherit; zoom:1; a { display: block; text-transform: uppercase; font-weight: 400; font-family: roboto; } .ui-accordion-header-icon { display: none!important;; } } .ui-accordion-header:hover { color: #fff; border: 2px solid #f0f0f0; background: @first-color!important; } .ui-accordion-header:hover a { color: #fff; } .ui-accordion-header-active { border-bottom:0 !important; background: @first-color!important; } .ui-accordion-header-active a{ color: #fff; } .ui-accordion-heading { display:block; /*font-size:1em;*/ padding:.5em .5em .5em .7em; } .ui-accordion-content { padding:1em 2.2em; border-top:0; margin-top:-2px; position:relative; top:1px; margin-bottom:2px; display:none; zoom:1; } .ui-accordion-content-active { display:block; } } .ui-accordion-icons .ui-accordion-heading { padding-left:2.2em; } } /************ vc customization accordion end **************/ /************ vc customization tour **************/ .wpb_content_element .wpb_tabs_nav li { background-color: #fff!important; border: 2px solid #f0f0f0; margin-bottom: 2px!important; margin-right: 2px!important; .transition; } .wpb_tour .wpb_text_column { background-color: #fff!important; padding: 20px!important; float: left; width: 100%; border: 2px solid #f0f0f0; } .wpb_content_element .wpb_tabs_nav li a{ text-transform: uppercase; } .wpb_content_element .wpb_tabs_nav li.ui-tabs-active, .wpb_content_element .wpb_tabs_nav li:hover { background-color: @first-color!important; } .wpb_content_element .wpb_tabs_nav li.ui-tabs-active a, .wpb_content_element .wpb_tabs_nav li:hover a{ color: #fff!important; } .wpb_tour_next_prev_nav a { border-bottom: 1px solid!important; text-transform: uppercase; } /************ vc customization tour end **************/ /************ vc customization toggle **************/ .vc_toggle_title h4 { font-size: 22px!important; } /************* vc customization toggle end **************/ /************* vc customization tabs **************/ .wpb_tabs .wpb_tab.ui-tabs-panel { background: #fff!important; border: 2px solid #f0f0f0; margin-top: 2px; } /************* vc customization tabs end **************/ /************* vc customization tabs accordion and tour new version above 4.7 **************/ .vc_tta-panel { background: transparent; border-radius: 0; border: 2px solid #f0f0f0; box-shadow: none; } .vc_tta-panels{ background: #fff!important; border-radius: 0!important; box-shadow: none; } .vc_tta-panel-body { background: #fff!important; border-radius: 0!important; box-shadow: none; } .vc_tta-panel-title a { font-size: 15px; } .vc_tta-panel-title { background: #fff; border-radius: 0; box-shadow: none; } .vc_tta-panel.vc_active .vc_tta-panel-title { background: @first-color; border-radius: 0; } .vc_tta-panel.vc_active .vc_tta-panel-title a{ color: #fff!important; } .vc_active .vc_tta-panel-heading .vc_tta-controls-icon::before{ border-color:#fff!important; } li.vc_tta-tab { border: none!important; } li.vc_tta-tab a{ background: #fff!important; border-radius: 0!important; box-shadow: none; padding: 5px 15px!important; } .vc_tta-tab.vc_active a{ background: @first-color!important; color: #fff!important; } .vc_tta-tabs-list li a{ background: #fff; border-radius: 0; box-shadow: none; } /************* vc customization tabs accordion and tour new version above 4.7 end **************/ /************* vc customization post slider **************/ .wpb_gallery_slides { box-shadow: none!important; } /************* vc customization post slider end **************/ /************* vc customization progress bar **************/ .vc_progress_bar .vc_single_bar { background: #f0f0f0!important; -webkit-box-shadow: none!important; box-shadow: none!important; -webkit-border-radius: 0!important; -moz-border-radius: 0!important; border-radius: 0!important; } .vc_progress_bar .vc_single_bar .vc_bar { background: @first-color; color: #fff; } /************* vc customization progress bar end **************/ /************* vc customization pie chart **************/ .vc_pie_chart[data-pie-color="btn-primary"] .vc_pie_chart_back { border-color: @first-color!important; } /************* vc customization pie chart end **************/ /************* vc customization post grid **************/ .vc_gitem-col { background: #fff!important; border: 2px solid #f0f0f0!important; padding: 20px!important; .vc_custom_heading { margin: 0!important; } } .vc_btn3-container a { background: @first-color!important; border-radius: 0!important; -webkit-border-radius: 0!important; -moz-border-radius: 0!important; padding: 10px!important; text-transform: uppercase!important; .transition; &:hover { background: @third-color!important; } } /************* vc customization post grid end **************/ /************* contact form plugin **************/ form.wpcf7-form { position: relative; z-index: 999; margin: 0 auto; float: none; width: 100%; } form.wpcf7-form select, form.wpcf7-form input[type="text"], form.wpcf7-form input[type="email"], form.wpcf7-form input[type="file"], form.wpcf7-form input[type="date"], form.wpcf7-form input[type="tel"] { position: relative; z-index: 999; width: 100%; height: 44px; padding: 0 20px; margin-bottom: 22px!important; border-top: none; border-left: none; border-right: none; border: #f0f0f0 2px solid; box-shadow: none; background: #fff; .transition; } form.wpcf7-form input[type="text"]:hover, form.wpcf7-form input[type="email"]:hover, form.wpcf7-form input[type="date"]:hover, form.wpcf7-form input[type="file"]:hover, form.wpcf7-form input[type="tel"]:hover, form.wpcf7-form input[type="text"]:focus, form.wpcf7-form input[type="email"]:focus, form.wpcf7-form input[type="date"]:focus, form.wpcf7-form input[type="tel"]:focus { border: @first-color 2px solid!important; } form.wpcf7-form input[type="checkbox"] { margin-bottom: 22px; } form.wpcf7-form textarea { width: 100%; float: right; margin-bottom: 22px!important; padding: 15px; border-top: none; border-left: none; border-right: none; border: #f0f0f0 2px solid; background: #fff; box-shadow: none; height: 129px; .transition; } form.wpcf7-form input:hover, form.wpcf7-form textarea:focus { border: @first-color 2px solid!important; } input.wpcf7-form-control.wpcf7-submit { font-size: 18px; text-align: center; width: 100%; color: #fff; border: none!important; background: @first-color;; text-transform: uppercase; height: 44px; .transition; } input.wpcf7-form-control.wpcf7-submit:hover { background: @third-color; border: none!important; } /*** datepicker ***/ .ui-datepicker { width: 250px; padding: 20px; display: none; background: #fff; border: #f0f0f0 2px solid; } .ui-datepicker .ui-datepicker-header { position: relative; padding: 10px; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position: absolute; top: 2px; width: 20px; height: 20px; cursor: pointer; } .ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; } .ui-datepicker .ui-datepicker-prev { left: 2px; } .ui-datepicker .ui-datepicker-next { right: 2px; } .ui-datepicker .ui-datepicker-prev-hover { left: 1px; } .ui-datepicker .ui-datepicker-next-hover { right: 1px; } .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; } .ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; } .ui-datepicker .ui-datepicker-title select { font-size: 1em; margin: 1px 0; } .ui-datepicker select.ui-datepicker-month-year { width: 100%; } .ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year { width: 49%; } .ui-datepicker table { width: 100%; font-size: .9em; border-collapse: collapse; margin: 0 0 .4em; } .ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; } .ui-datepicker td { border: 0; padding: 1px; } .ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; } .ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding: 0 .2em; border-left: 0; border-right: 0; border-bottom: 0; } .ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width: auto; overflow: visible; } .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float: left; } .widget { input.wpcf7-form-control.wpcf7-submit { font-size: 12px; text-align: center; width: 20%; color: #fff; border: none!important; background: @second-color; text-transform: uppercase; height: auto; float: left; padding: 0 5px; .transition; } form.wpcf7-form input[type="email"] { position: relative; z-index: 999; width: 100%; height: auto; padding: 0 5px; margin-bottom: 22px!important; border-top: none; border-left: none; border-right: none; border: @first-color 2px solid; box-shadow: none; background: #fff; float: left; .transition; } } /************* contact form plugin end **************/ /************* timetable plugin **************/ .tt_event_theme_page { width: 100%!important; max-width: 1150px!important; h2 { font-size: 27px!important; } h1, h2, h3, h4, h5, h6, a { font-family: roboto!important; margin-bottom: 10px; } p { font-family: "open sans"!important; } } .tt_event_page_left { width: 78%!important; float: left; padding-right: 2%; img{ width: auto!important; max-width: 100%!important; -ms-interpolation-mode: bicubic; } } .tt_event_page_right { width: 20%!important; float: left; } @media (max-width: 767px) { .tt_event_page_left { width: 100%!important; padding-right: 0; } .tt_event_page_right { width: 100%!important; } } .tt_upcoming_events_wrapper { float: left!important; width: 100%!important; margin-bottom: 20px!important; margin-top: 0!important; } .tt_upcoming_event_controls a { &:hover { background: @second-color!important; } } /************* timetable plugin end **************/ /************* woocommerce **************/ .woocommerce-main-image img { width: auto!important; } .woocommerce-breadcrumb { padding: 11px 22px!important; background: #f0f0f0; font-size: 14px!important; text-transform: uppercase; color: #333333!important; font-weight: bold; a { color: @first-color!important; .transition; &:hover { color: @second-color!important; } } } a.button, button.button, input.button, #respond input#submit { border-radius: 0!important; height: auto!important; } button.button { background-color: @first-color!important; .transition; color: #fff!important; &:hover { background-color: @second-color!important; } } .woocommerce-tabs { ul.tabs { li { border-radius: 0!important; a { font-size: 14px!important; text-transform: uppercase; } &.active { background: #f0f0f0; } &:after, &:before { -webkit-border-bottom-right-radius: 0!important; -moz-border-bottom-right-radius: 0!important; border-bottom-right-radius: 0!important; border-radius: 0!important; box-shadow: none!important; border: none!important; } } } } @media (max-width: 500px) { .woocommerce-tabs { ul.tabs { li { width: 100%; text-align: center; a { display: block; width: 100%; } } } } } .product_meta { a { text-transform: uppercase; } } .wc-proceed-to-checkout { a.checkout-button { background: @first-color!important; text-transform: uppercase; padding: 14px; .transition; &:hover { background: @second-color!important; } } } form { .form-row input[type="submit"]#place_order { background: @first-color!important; .transition; text-transform: uppercase; padding: 14px; &:hover { background: @second-color!important; } } } /************* woocommerce end **************/