/*------------------------------------------------------------------
	[Master Stylesheet]

	Author        : Ateeq Rafeeq (https://themeforest.net/user/webfulcreations/portfolio)
	Template Name : Chiropractor Website Template
	Version       : 1.0
	CopyRight     : 2018 August @ www.webfulcreations.com


	- Main CSS file is inside assets/css/theme-style.css
-------------------------------------------------------------------*/


@import 'assets/css/animate.css';	   		   /* Including Animations CSS file */
@import 'assets/css/owl.carousel.css';		   /* Owl Carousel CSS File */
@import 'assets/css/foundation.min.css';       /* Including Foundation CSS File */
@import 'assets/css/theme-styles.css';		   /* Main Theme CSS File */
@import 'assets/css/responsive-styles.css';	   /* Main Theme CSS File */
@import 'assets/css/fontawesome-all.min.css';  /* Including Font Awesome Icons */
@import 'assets/css/lightbox.min.css';         /* Lightbox IMage Gallery Plugin CSS */


/**
 * Import Website Main Fonts 
 *
 * To change Fonts Get Google Fonts replace in following Link, 
 * AFter replacing below go to theme-style.css and update
 * Font Families
 *
 */
@import 'https://fonts.googleapis.com/css?family=Lato:400,700,900|Nunito:400,600,700,900" rel="stylesheet';

/*=========================================
	Below This Line You Can add Your CSS
	Please Do not Edit Files above if you 
	are not sure what you are doing!
==========================================*/
@media only screen and (max-width: 767px) 
{
.main-banner .slide.slide-one:after {
   
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
    width: 30%;
    background-position-y: top;
}
.slide.transparent-background {
    height: 42% !important;
    
}
.footer-timing ul li, .footer-links ul li
{
    font-size:9px !important;
}
.try
{
    margin-left:50% !important;
}
.testimonials .active
{
   width:400px !important;
}
}
.staff-box
{
        padding: 20px;
    border: 1px solid #b1a6a633;
}
.staff-box img {
    max-width: 50%;
    margin: 0 auto;
    display: block;
    background-color: #949597;
}
.hover-info {
    position: absolute;
    border-radius: 100%;
    top: 0;
    left: 25%;
    height: 100%;
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    opacity: 0;
    background-color: rgba(148, 149, 151, 0.9);
    transition: opacity .6s;
}