/*
Theme Name: Appointment
Theme URI: https://webriti.com/appointment-wordpress-theme-1/
Author: Webriti
Author URI: https://www.webriti.com
Description: Appointment WordPress Theme is a fully responsive and translation-ready theme that allows you to create stunning blogs and websites. The theme is well suited for companies, law firms, travel, photography, recipes, design, art, personal and any other creative websites and blogs. The theme is developed using Bootstrap 3 that makes it mobile and tablet friendly. It has various options in the WordPress Customizer to change the look of the theme. The theme customizer can be used to add your own custom header, favicon, logo, slides, services, callout and much more. In the premium version you can add different type of slides like video, aside, quote, status and standard, all of which have a different HTML look. There are a number of in-built widgets; sidebars with support for WPML, the Polylang translation WordPress plugin and Contact Form 7; a portfolio template, contact us, portfolio column layouts and many sections for business using the Homepage template. Appointment theme comes with various locales and this theme is General Data Protection Regulation ready as it comes with WP GDPR Compliant Just navigate to Appearance / Customize to start customizing.
Tags: full-width-template, threaded-comments, two-columns, right-sidebar, sticky-post, custom-menu, translation-ready, rtl-language-support, blog, footer-widgets, featured-images, news
Version: 3.4.7
Requires at least: 4.5
Tested up to: 6.4
Requires PHP: 5.4
License URI: http://www.gnu.org/licenses/gpl-2.0.html
License: GPLv2 or later
Text Domain: appointment
*/
/*Header Social Icons---------------------------------------------------------------------------------------------------*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 Common
2.0 Header Social Icons
3.0 Header Contact Info
4.0 Homepage Carousel Bootstrap Slider Section
5.0 Direction Nav
6.0 Slider Fade Effect
7.0 Top Callout Section
8.0 Section Title
9.0 Service Section
10.0 Callout Section
11.0 Blog
    11.1 Blog Homepage Section Css here
    11.2 Blog Section
    11.3 Blog Author
    11.4 Blog Pagination
12.0 Footer Widget section
13.0 Page Title Section
14.0 Image Paragraph Alignment\
15.0 Comment Section
16.0 Comment Form
17.0 Placeholder
18.0 Slider section
19.0 Sidebar Latest Post
20.0 Sidebar Links
21.0 Slidebar Tags
22.0 404 Page Section
23.0 Scroll Layout Button
24.0 Extra Css
25.0 Header Image with content section
26.0 Header widget and Top contact detail section
27.0 Text meant only for screen readers
28.0 contact Form 7

--------------------------------------------------------------*/

/*--------------------------------------------------------------
4.0 Homepage Carousel Bootstrap Slider Section
--------------------------------------------------------------*/
#carousel-example-generic .active > div { display: block; }
.carousel-indicators li, .carou-direction-nav li { padding: 0; }
.homepage-mycarousel .carousel-inner > .item > img { display: block; margin: 0 auto; }
.carousel-indicators { margin-bottom: 0; }
.slide-caption {
    height: auto;
    left: 0;
    margin: 0;
    padding: 15px;
    position: absolute;
    right: 0;
    width: 50%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 0;
}
.slide-text-bg1 {
    z-index: 773;
    width: 50%;
    text-align: left;
    position: relative;
    margin: 0 0 20px;
    padding: 0;
}
.slide-text-bg1 h2 {
    background-color: rgba(255, 255, 255, 0.9);
    color: #242526;
    font-family: 'Open Sans';
    font-weight:400;
    font-weight: normal;
    border-radius: 2px;
    padding: 6px 12px;
    display: inline-block;
    letter-spacing: 0;
    line-height: 40px;
    margin: 0 0 0px;
    text-shadow: 0 0px 1px rgba(155, 155, 155, 0.7);
    -webkit-box-shadow: 0 0 3px 0 rgba(161, 161, 161, 0.9);
    -moz-box-shadow: 0 0 3px 0 rgba(161, 161, 161, 0.9);
    box-shadow: 0 0 3px 0 rgba(161, 161, 161, 0.9);
}
.slide-text-bg2 {
    text-align: left;
    margin: 0 0 20px;
    padding: 0;
    position: relative;
    width: 50%;
    z-index: 773;
}
.slide-text-bg2 span {
    background-color: rgba(45, 47, 49, 0.8);
    color: #ffffff;
    font-family: 'Open Sans';
    font-weight: 400;
    font-size: 15px;
    font-weight: normal;
    display: inline-block;
    border-radius: 2px;
    line-height: 25px;
    letter-spacing: 1px;
    padding: 6px 12px;
    margin: 0 0 0px;
    text-shadow: 0 0px 1px rgba(155, 155, 155, 0.7);
}
.slide-text-bg2 .check {
    background-color: rgba(45, 47, 49, 0.95);
    background: #3e4041 url(../images/check.png) no-repeat center center;
    padding: 6px 25px;
    border-bottom-left-radius: 2px;
    border-top-left-radius: 2px;
    color: #ffffff;
    width: 50px;
    height: 40px;
    float: left;
    margin-right: 12px;
}

.slide-btn-area-sm { margin: 0px 0 0px; float: left; width: 80%; }
.slide-btn-sm {
    border-radius: 3px;
    cursor: pointer;
    display: inline-block;
    font-family: 'Open sans';
    font-weight:600;
    color: #ffffff;
    transition: all 0.3s ease-in-out 0s;
    font-size: 13px;
    letter-spacing: 0.5px;
    line-height: 20px;
    padding: 10px 25px;
    margin: 0;
    text-align: center;
    text-transform: uppercase;
    vertical-align: middle;
}
.slide-btn-sm:hover, .slide-btn-sm:focus { color: #ffffff; }
.homepage-mycarousel .format-quote p { color: #ffffff; margin-bottom: 0; }

/*--------------------------------------------------------------
5.0 Direction Nav
--------------------------------------------------------------*/
.carou-direction-nav {
    *height: 0;
    list-style-type: none;
    margin: 0px;
}
.carou-direction-nav a {
    background: rgba(0, 0, 0, 0.8);
    color: #ffffff;
    border-radius: 5px;
    text-decoration: none;
    display: block;
    width: 52px;
    height: 52px;
    margin: -20px 0 0;
    position: absolute;
    top: 50%;
    z-index: 10;
    overflow: hidden;
    opacity: 0;
    cursor: pointer;
    text-align: center;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
}
.carou-direction-nav .carou-prev {
    left: 15px;
    color: #ffffff;
    opacity: 0.5;
}
.carou-direction-nav .carou-next {
    right: 15px;
    text-align: right;
    color: #ffffff;
    text-align: center;
    opacity: 0.5;
}
.carou-direction-nav :hover .carou-prev {
    opacity: 1;
    left: 30px;
}
.carou-direction-nav :hover .carou-next {
    opacity: 1;
    right: 30px;
}
.carou-direction-nav :hover .carou-next:hover,
.carou-direction-nav :hover .carou-prev:hover {
    opacity: 1;
}
.carou-direction-nav .carou-disabled {
    opacity: 0!important;
    filter: alpha(opacity=0);
    cursor: default;
}
.carou-direction-nav a:before {
    font-family: "FontAwesome";
    font-size: 24px;
    line-height: 2.2;
    display: inline-block;
    content: '\f104';
}
.carou-direction-nav a.carou-next:before {
    content: '\f105';
}

h1{ display: inline-block;margin-bottom: 0; }
.logo-link-url {display: inline-block;}
.navbar-brand{padding: 0;}

@media (max-width:768px){
  .navbar-header{text-align: center;}
}

/*--------------------------------------------------------------
6.0 Slider Fade Effect
--------------------------------------------------------------*/
.carousel.carousel-fade .item {
    -webkit-transition: opacity 0.6s ease-in-out;
    -moz-transition: opacity 0.6s ease-in-out;
    -o-transition: opacity 0.6s ease-in-out;
    transition: opacity 0.6s ease-in-out;
    transition-duration:3s;
    opacity:0;
    left: 0 !important;
}

.carousel.carousel-fade .active.item {
    opacity:1;
}

.carousel.carousel-fade .active.left,
.carousel.carousel-fade .active.right {
    left: 0;
    z-index: 2;
    opacity: 0;
}
.carousel.carousel-fade .next,
.carousel.carousel-fade .prev {
    left: 0;
    z-index: 1;
}
.carousel.carousel-fade .carousel-control {
    z-index: 3;
}