/*
Theme Name: Kalium - Medical Theme
Theme URI: https://laborator.co/themes/kalium/
Author: Laborator
Author URI: https://laborator.co/
Description: Start creating that amazing website that you have always wanted, only with Kalium — Connect with Laborator on: Envato • Twitter • Facebook • Instagram
Version: 1.0
License: GNU General Public License version 3.0
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Template: kalium
Text Domain: kalium
*/
/* ===========================================================
Custom modification only for MEDICAL Demo - START
=========================================================== */
/* Button Color and Radius */
.button {
background-color: #6dab3c;
border-radius: 50px;
}
/* Header Background Color and Padding */
header.main-header {
background: #fff;
}
/* Standard Header Menus: Margin Left */
.main-header.menu-type-standard-menu .standard-menu-container div.menu>ul>li+li, .main-header.menu-type-standard-menu .standard-menu-container ul.menu>li+li {
margin-left: 25px;
}
/* Header: Menu Buy Button */
.main-header.menu-type-standard-menu .standard-menu-container.menu-skin-main div.menu > ul > li.special-menu-button > a,
.main-header.menu-type-standard-menu .standard-menu-container.menu-skin-main ul.menu > li.special-menu-button > a {
color: #6dab3c;
border: 1px solid #6dab3c;
padding: 5px 10px;
line-height: 1;
border-radius: 50px;
}
/* Header: Menu Buy Button on Hover */
.main-header.menu-type-standard-menu .standard-menu-container.menu-skin-main div.menu > ul > li.special-menu-button > a:hover,
.main-header.menu-type-standard-menu .standard-menu-container.menu-skin-main ul.menu > li.special-menu-button > a:hover {
color: #fff;
background: #6dab3c;
}
/* Homepage: Blog Posts and Departments More Button */
.more-link {
border: none;
top: 0px;
right: 0px;
position: absolute;
}
/* Homepage: Blog Posts See More Button Border */
.show-more .reveal-button {
min-width: 150px;
border: none;
}
/* Homepage: Blog Posts See More Button Spacing */
.more-link .show-more {
padding:0px;
margin: 0px;
margin-top: 35px;
}
/* Homepage: Blog Posts See More Button Border Color */
.more-link .show-more .reveal-button a {
width: auto;
background-color: #6dab3c;
border-radius: 50px;
padding: 15px;
color: #fff;
line-height: 1;
}
/* Homepage: Blog Posts See More Button Arrow */
.more-link .show-more .reveal-button a:before {
content: "»";
margin-left: 10px;
float: right;
line-height : 1;
}
/* Homepage: All Departments Button */
.lab-portfolio-items .more-link .show-more .reveal-button a {
background-color: #fff;
color: #009db3;
}
/* Homepage Testimonials: pagination padding */
.wpb-js-composer .vc_tta-tabs.vc_tta-has-pagination.testimonials:not(.vc_tta-tabs-position-bottom) {
padding-bottom: 35px;
}
/* Homepage Testimonials: pagination position */
.wpb-js-composer .testimonials.vc_tta-tabs.vc_tta-has-pagination .vc_pagination {
right: auto;
margin: 0px;
}
/* Homepage: Departments List Area */
.departments-list ul {
padding: 0px;
list-style-type: none;
}
/* Homepage: Departments Last List Area Style */
.departments-list ul li {
border-bottom: 1px solid #18a9bd;
list-style-position: inside;
padding: 8px 0px;
margin: 0px;
color: #fff;
}
/* Homepage: Departments Last List Area Without Dotted Border in Bottom */
.departments-list ul li:last-child {
border: none;
}
/* Homepage: Departments Area Box */
body.home .portfolio-holder.portfolio-type-1 .portfolio-item .info {
background-color: transparent;
box-shadow: none;
padding-left: 0px;
padding-right: 0px;
padding-bottom: 0px;
}
/* Homepage: Departments Area Heading and Paragraph Color */
body.home .portfolio-holder.portfolio-type-1 .portfolio-item .info h3 a,
body.home .portfolio-holder.portfolio-type-1 .portfolio-item .info p {
color: #fff;
}
/* Departments Page: Departments Boxes */
.portfolio-holder.portfolio-type-1 .portfolio-item .info {
background-color: #fff;
box-shadow: 0px 3px 10px -5px rgba(0,0,0,0.1);
padding: 22px 30px;
}
/* Departments Page: Departments Area Heading and Paragraph Color */
.portfolio-holder .item-box .info h3 {
margin-bottom: 15px;
margin-top: 0px;
}
/* Departments Page: Department Title Link Color */
.portfolio-holder .item-box .info h3 a {
color: #2a527b;
}
/* Homepage: Departmens Area Title Width*/
.home-departments .portfolio-title-holder .pt-column-title {
max-width: 75%;
}
/* Homepage: Departmens Area Title */
.home-departments.lab-portfolio-items .portfolio-title-holder h1,
.home-departments.lab-portfolio-items .portfolio-title-holder h2 {
color: #fff;
}
/* Homepage: Departmens Area Description */
.home-departments .section-title p {
color: #fff;
}
/* Homepage: Departmens Area More Button */
.lab-portfolio-items .more-link {
margin-top: 0px;
}
/* Footer Area: No Margin in Bottom */
.site-footer .footer-widgets {
margin-bottom: 0;
}
/* Footer: Widgets Navigation Menu Area Padding Left */
.site-footer .footer-widgets .widget.widget_nav_menu {
padding-left: 100px;
}
/* Footer: Widgets List Area Link Color */
.site-footer .widget-area .widget li a,
.site-footer .widget ul ul a:before {
color: #777;
}
/* Footer Bottom: Paddings */
.site-footer .footer-bottom-content {
padding-top: 20px;
padding-bottom: 20px;
}
/* Footer Social Networs Box Size and Color */
.site-footer .social-networks.rounded li a {
width: 30px;
height: 30px;
background-color: #f3f8fb;
border-radius: 5px;
}
/* Footer Social Networs Icon Size */
.social-networks.rounded li a i {
font-size: 14px;
}
/* Widgets Lists with Dotted Border in Bottom */
.widget ul li {
border-bottom: 1px dotted #ddd;
}
/* Widgets Lists Last item Without Dotted Border in Bottom */
.widget ul li:last-child {
border: none;
}
/* News Page: Blog Post Detials Area and Thumbnails Area */
.blog-posts .post-item.template-standard .post-details,
.blog-posts .post-item.template-standard .post-thumbnail {
border: none;
background-color: #fff;
}
/* News Page: Blog Post Details Area */
.blog-posts .post-item.template-standard .post-details {
padding-top: 30px;
padding-bottom: 30px;
}
/* News Page: Title spacing */
.page-heading__title-section {
margin: 0px;
}
/* Homepage: Working Hours Table Area */
.working-hours-table table {
background-color: #d7e9f5;
}
.working-hours-table table td {
color: #2d527b;
padding: 10px 20px;
}
.working-hours-table table tr {
border-bottom: 1px solid #f3f8fb;
}
/* Sidebar Skin (Background Fill Style) */
.widget-area--skin-background-fill .widget {
border: none;
background-color: #fff;
box-shadow: 0px 3px 10px -5px rgba(0,0,0,0.1);
}
/* Sidebar Skin (Bordered Style) */
.widget-area--skin-bordered .widget {
background-color: #fff;
}
/* Homepage: Blog Posts Widget Box */
.wpb_wrapper .lab-blog-posts .blog-post-entry {
border: none;
background: #fff;
box-shadow: 0px 3px 10px -5px rgba(0,0,0,0.1);
transition: all 0.2s;
}
/* Homepage: Blog Posts Widget Box Hover */
.wpb_wrapper .lab-blog-posts .blog-post-entry:hover {
box-shadow: 0px 3px 50px -15px rgba(0,0,0,0.2);
}
/* Homepage: Blog Posts Widget Box Date */
.wpb_wrapper .lab-blog-posts .blog-post-entry .blog-post-content-container .blog-post-date {
letter-spacing: 1px;
}
/* Multiplle Areas: Removes the Underline Animation in Theme Links */
.site-footer a:after,
.blog-posts .post-item .post-details .post-title a:after,
.single-post .post .post-meta a:hover:after,
.wrapper a:after,
.wpb_wrapper .lab-blog-posts .blog-post-entry .blog-post-content-container .blog-post-title a:after,
body a:after {
background-color: transparent !important;
}
/* Multiplle Areas: Link Hover Color */
.widget-area .widget li a:hover,
.site-footer a:hover,
.site-footer .footer-bottom a:hover,
.blog-posts .post-item .post-details .post-title a:hover,
.single-post .post .post-meta a:hover,
.wpb_wrapper .lab-blog-posts .blog-post-entry .blog-post-content-container .blog-post-title a:hover,
body a:hover {
color: #039db3
}
/* Search Widget Background Color */
.widget.widget_product_search .search-bar input[name="s"], .widget.widget_search .search-bar input[name="s"] {
background-color: #fff;
}
/* Blog: Masonry Posts Layout */
.blog-posts .post-item.template-standard {
box-shadow: 0px 3px 10px -5px rgba(0,0,0,0.1);
}
/* Blog: Classic Posts Layout */
.blog-posts .has-post-thumbnail .post-item {
box-shadow: 0px 3px 10px -5px rgba(0,0,0,0.1);
background-color: #fff;
}
/* Blog: Rounded Posts Layout */
.blog-posts .post-item.template-rounded.columned {
background: transparent;
-webkit-box-shadow: none;
box-shadow: none;
}
/* Blog: Square Posts Layout */
.blog-posts .format-video .post-item.template-square.columned .post-details,
.blog-posts .has-post-thumbnail .post-item.template-square.columned .post-details {
padding: 20px 25px 0 0;
}
/* Blog Post: Rounded Social Networks Layout */
.single-post .post .post-share-networks--style-icons a {
background: #fff;
border-radius: 3px;
width: 35px;
height: 35px;
}
/* Blog Post: Blog Tags Layout */
.single-post .post .post-tags a {
background: #fff;
box-shadow: 0px 3px 10px -5px rgba(0,0,0,0.1);
padding: 6px 8px;
margin-right: 10px;
}
/* Blog Post: Author Info Box */
section.post-author {
border-top: 2px dotted #e1eaef;
padding-top: 35px;
}
/* Blog Post: Author Info Image */
.author-info--alignment-bottom.single-post--has-author-info.single-post .post .post-author .author-info--image a {
width: 130px;
margin-right: 35px;
}
/* Blog Post: Author Info Image Radius */
.single-post .post .author-info--image .image-placeholder {
border-radius: 3px;
}
/* Posts Navigation - Next-Prev Layout */
.post-navigation {
border-top: 2px dotted #e1eaef;
padding: 20px 0;
margin-bottom: 0;
}
/* Posts Navigation - Next-Prev Post Hide Arrows */
.post-navigation--next .post-navigation--arrow,
.post-navigation--prev .post-navigation--arrow {
display: none;
}
/* Posts Navigation - Color */
.post-navigation a i, .post-navigation a strong {
color: #2a527b;
}
/* Posts Navigation - Hover Color */
.post-navigation a:hover i, .post-navigation a:hover strong {
color: #009db4;
}
/* Blog Post: Comments Area Color */
.single-post .post-comments {
background-color: #e1eaef;
}
/* Blog Post: Reply Button Color */
.single-post .post-comments--list .comment .commenter-details .name a {
color: #009db4;
}
/* Blog Post: Reply to a Comments Background Color */
.single-post .post-comments--list .comment-respond {
background-color: #f3f8fb;
}
/* Blog Post: Comment Connector Color */
.single-post .post-comments--list .comment .commenter-image .comment-connector {
border-color: #c5d6de;
}
/* Blog Post: Commenter Details Padding */
.single-post .post-comments--list .comment .commenter-details {
padding-left: 15px;
}
/* Blog Posts: Comments Textarea */
p.labeled-textarea-row.comment-form-comment, .single-post .comment-form>p {
background: #fff;
box-shadow: 0px 3px 10px -5px rgba(0,0,0,0.1);
padding: 5px 15px;
}
/* Blog Post: Leave a Reply Comment Area */
.single-post .comment-form {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-flow: row wrap;
justify-content: space-between;
margin: 0;
margin-top: 35px;
}
/* Blog Post: Comments Area */
.single-post .comment-form>p.logged-in-as {
background: transparent;
padding: 0px;
border: none;
box-shadow: none;
}
/* Blog Post: Comments Area */
.single-post .comment-form>p.logged-in-as a{
color: #009db3;
}
/* Blog Post: Add a Comment Fill Areas Width */
.single-post .comment-form>p.labeled-input-row {
width: 32%;
float: none;
}
/* Blog Post: Add a Comment Fill Areas Style */
.labeled-textarea-row textarea {
background-image: none;
line-height: 1.5;
padding: 0px;
}
/* Blog Post: Add a Comment Fill Areas Border */
.labeled-input-row label,
.labeled-textarea-row label,
.labeled-input-row input {
border: none;
}
/* Blog Page and Blog Post: Quote Post Background Color */
.blog-posts .post-item .post-thumbnail blockquote,
.single-post .post--full-width-image.format-quote .post-image {
background-color: #dce6ec;
}
/* Blog Post: Add a Comment Fill Required Areas */
.labeled-input-row label .required, .labeled-textarea-row label .required {
color: red;
}
/* Blog Posts: Submit Comment Button */
.single-post .comment-form>p.form-submit {
padding: 0px;
background: transparent;
margin-top: 0px;
margin-left: auto;
border: none;
}
/* Blog: Single Post Navigation Show Labels */
.post-navigation--label em, .post-navigation--label strong {
top: auto;
opacity: 1;
}
/* Menu: Search Button Background */
.header-search-input .search-field {
background: #f3f8fb;
}
/* Search Page: Results Box Border */
.search-results-holder .result-box + .result-box {
border-top-color: #e1eaef;
}
/* Search Page: Results Page Title */
.search-results-holder .result-box .result-info h3 a {
color: #2a527b;
}
/* Blog Page: Header */
.blog .page-heading {
margin-top: 50px;
margin-bottom: 50px;
}
/* Blog Page: Heading Description (paragraph) */
.page-heading--description p {
color: #768ca5;
}
/* Browser Selection Color */
::selection {
background: #039db3;
}
/* Widget: Sidebar Working Hours Area */
.sidebar-working-hours {
color: #2d527b;
}
.sidebar-working-hours td {
padding: 5px 0;
}
.sidebar-working-hours td:nth-child(even) {
text-align: right;
}
.sidebar-working-hours tr {
border-bottom: 1px solid #f3f8fb;
}
.emergency-button-sidebar a {
background: #6dab3c;
color: #fff;
border-radius: 3px;
padding: 7px 5px;
width: 100%;
text-align: center;
}
.emergency-button-sidebar a:hover {
color: #fff !important;
background: #5f9434;
}
/* Classic Pagination Layout */
.pagination-container a.page-numbers,
.pagination-container span.page-numbers,
.woocommerce-pagination a.page-numbers,
.woocommerce-pagination span.page-numbers,
.pagination--normal .page-numbers {
background: #fff;
padding: 5px 15px;
border-radius: 50px;
margin: 0px 5px;
}
/* Classic Pagination Layout */
.pagination-container a.page-numbers,
.pagination-container span.page-numbers {
color: #2a527b;
}
/* Classic Pagination Layout: Current page */
.pagination-container a.page-numbers.current,
.pagination-container span.page-numbers.current,
.woocommerce-pagination a.page-numbers.current,
.woocommerce-pagination span.page-numbers.current,
.pagination--normal .page-numbers.current {
color: #c5ced4;
}
/* Classic Pagination Layout: Page Hover */
.pagination-container a.page-numbers:hover,
.pagination-container span.page-numbers:hover,
.woocommerce-pagination a.page-numbers:hover,
.woocommerce-pagination span.page-numbers:hover,
.pagination--normal .page-numbers:hover {
color: #039db3;
}
/* Classic Pagination Layout: Current page no hover*/
.pagination--normal .page-numbers.current:hover,
.pagination-container span.page-numbers.current:hover {
color: #c5ced4;
}
/* Infinite Scroll Pagination Style */
.pagination--infinite-scroll .pagination--infinite-scroll-show-more {
box-shadow: 4px 7px 10px -9px rgba(0,0,0,0.1);
background-color: #fff;
border-style: none;
}
/* Page Title Padding */
.page-title {
padding: 50px 0px;
}
/* Departments Title */
.departments-title {
padding: 50px 0px 35px 0;
}
/* Departments Title Holder */
.wpb_wrapper .lab-portfolio-items .portfolio-title-holder {
margin: 0px;
}
/* Homepage Blog Posts */
.home-news {
padding: 50px 0 35px 0;
}
/* Homepage: Appointments */
.home-appointment .vc_column-inner>.wpb_wrapper {
padding: 0 50px;
background-color: #f3f8fb;
padding-top: 35px;
}
/* Homepage: Google Maps */
.home-map.vc_column_container>.vc_column-inner {
padding-top: 0;
}
/* Homepage: View All Button */
.home-button a {
padding: 15px !important;
line-height: 1 !important;
background-image: none !important;
}
/* Homepage: All Doctors Button */
.home-button a:before {
content: "»";
margin-left: 10px;
float: right;
line-height: 1;
}
/* Departments Title Holder */
.wpb_wrapper .lab-portfolio-items .portfolio-title-holder {
margin-bottom: 20px;
}
/* Contact Form: Input Colors */
.contact-form .form-group.labeled-input-row, .form-group.labeled-textarea-row {
padding: 5px 15px;
background: #fff;
box-shadow: 0px 3px 10px -5px rgba(0,0,0,0.1);
}
/* Contact Form: Checkboxes and Radio Buttons */
.contact-form input[type=checkbox], .contact-form input[type=radio] {
background: #fff;
}
/* Appointments Ninja Forms Plugin Layout */
.appointments nf-fields-wrap {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
}
.appointments nf-field {
width: 45%;
}
.dep-appointments nf-field {
width: 100%;
}
.dep-appointments,
.dep-appointments .submit-container {
margin-bottom: 0px;
}
.appointments .nf-field-element {
box-shadow: 0px 3px 10px -5px rgba(0,0,0,0.1);
}
.dep-appointments .nf-field-element {
box-shadow: none;
}
.submit-container .nf-field-element {
box-shadow: none;
}
.appointments nf-field:last-child {
width: 100%;
box-shadow: none;
}
.nf-field-element select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
padding-left: 10px;
padding-right: 10px;
padding-top: 1px;
padding-bottom: 1px;
}
.appointments input[type=text],
.appointments input[type=number],
.appointments input[type=email],
.appointments input[type=password],
.appointments input[type=url],
.appointments input[type=tel],
.appointments select,
.appointments textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border-color: #fff;
}
.dep-appointments input[type=text],
.dep-appointments input[type=number],
.dep-appointments input[type=email],
.dep-appointments input[type=password],
.dep-appointments input[type=url],
.dep-appointments input[type=tel],
.dep-appointments select,
.dep-appointments textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border-color: #f3f8fb;
background: #f3f8fb;
}
.appointments .nf-error .ninja-forms-field {
border: 1px solid #e80000;
}
.appointments .submit-container .nf-field-element,
.appointments .submit-container .nf-field-element {
box-shadow: none;
}
@media screen and (max-width: 991px) and (min-width: 768px) {
.site-footer .footer-widgets .widget.widget_nav_menu {
width: 100%;
padding-left: 15px;
}
.welcome-box .working-hours-column {
width: 41.66666667%;
}
}
@media screen and (max-width: 991px) {
.mobile-menu-wrapper.mobile-menu-fullscreen+.mobile-menu-overlay {
background-color: rgba(0, 157, 180,0.9);
}
.mobile-menu-wrapper.mobile-menu-fullscreen .mobile-menu-container .search-form input::placeholder {
color: rgba(255,255,255,0.75);
}
.mobile-menu-wrapper .mobile-menu-container .search-form label {
color: #FFF;
}
}
/* Contact Form: Submit Loading Bar */
.contact-form .button .loading-bar span {
border-radius: 50px;
background-color: rgba(0,0,0,.25);
}
/* Contact Form: Submit Loading Bar */
.contact-form .button .loading-bar {
bottom: 0;
left: 20px;
right: 20px;
top: auto;
background: none;
border-radius: 50px;
}
/* Top Bar: Button */
.top-bar-button {
color: #6dab3c;
border: 1px solid #6dab3c;
padding: 5px 10px;
border-radius: 50px;
transition: all 0.25s ease;
}
a.top-bar-button:hover {
color: #fff;
background-color: #6dab3c;
}
/* XS: Mobile devices */
@media screen and (max-width: 480px){
.site-footer .footer-widgets .widget.widget_nav_menu {
padding-left: 15px;
}
.blog .page-heading {
margin-top: 35px;
margin-bottom: 35px;
}
.widget {
margin-bottom: 15px;
}
.page-title {
padding: 35px 0px;
}
.departments-title {
padding: 35px 0px 20px 0;
}
.single-post .post-comments:before {
border-width: 20px 20px 0 0;
right: 20px;
}
.welcome-box {
padding: 35px 0 25px 0;
}
.more-link {
position: relative;
}
.home-departments .portfolio-title-holder .pt-column-title {
max-width: 100%;
}
.home-departments .more-link .show-more {
padding: 0px 15px;
}
.more-link .show-more {
margin: 0px;
}
.show-more .reveal-button {
display: block;
}
.more-link .show-more .reveal-button a {
text-align: left;
width: 100%;
}
.home-news {
padding: 35px 0 25px 0;
}
.home-map.vc_column_container>.vc_column-inner {
padding-top: 20px;
}
.home-appointment .appointments {
margin-bottom: 0px;
}
.home-appointment .vc_column-inner>.wpb_wrapper {
padding: 0 35px;
padding-top: 35px;
}
.home-testimonials {
padding-top: 0px;
}
.single-post .post .post-navigation {
margin-bottom: 10px;
}
.single-post .comment-form>p.form-submit{
margin-left: 0px;
}
.single-post .comment-form>p.labeled-input-row {
width: 100%;
}
.single-post .post-comments--list .comment-respond .comment-reply-title {
left: 40px;
right: auto;
}
.archive .container {
margin: 0;
}
.archive .page-heading {
margin-bottom: 10px;
}
.wpb_wrapper .lab-portfolio-items .more-link {
margin: 20px 0;
}
}
/* SM: Mobile and tablet devices */
@media screen and (min-width: 768px) {
.welcome-box {
padding: 35px 0;
}
}
/* MD: Tablet and desktop devices */
@media screen and (min-width: 992px) {
.welcome-box {
padding: 35px 0;
}
}
/* LG: Desktop devices */
@media screen and (min-width: 1200px) {
.welcome-box {
padding: 35px 0;
}
}
/* ===========================================================
Custom modification only for MEDICAL Demo - END
=========================================================== */
/* ===========================================================
User CSS modifications - START
=========================================================== */