/*============================================
    START TABLE OF CONTENT
==============================================
    1.  Standard Styles
    2.  Heading Styles
    3.  Typography Styles
    4.  Form & Buttons Styles
    5.  Header Styles
        5.1. Top Bar Styles
        5.2. Navbar Styles
        5.3. Slider Styles
        5.4. Main Banner Styles
        5.5. Breadcrumb Styles
        5.6. Back To Top Button
        5.7. Page Preloader
    6.  Main Container Styles
    7.  Notification Boxes Styles
    8.  Welcome Section Styles
    9.  About Featured Section
    10. Featured Doctors Section Styles
    11. Medical Services Section Styles
    12. Home Page Latest News Styles
    13. Latest News Carusel Styles
    14. About Page Skills Styles
    15. 404 Page Block Styles
    16. Accordions Styles
    17. FAQ's Accordions Styles
    18. Book Appointment Box Styles
    19. Tabs Styles
    20. Doctors Pages Styles
    21. Gallery Page Styles
    22. News Pages Styles
    23. News Comments Styles
    24. Recent Comments Styles
    25. Pagination Styles
    26. Vertical Carousel Styles
    27. Box Styles
    28. Contact Page Styles
    29. Footer Styles
    30. Images Styles
    31. Lists Styles
    32. Progress Bar Styles
    33. Tags List Styles
    34. Pricing Tables Styles
    35. Departments Icons Styles
    36. Generic Styles
==============================================
    END TABLE OF CONTENT
============================================*/

/*--------------------------------------------
1. Standard Styles
--------------------------------------------*/
body {
    font: 14px/24px 'Roboto', Arial, Helvetica, sans-serif;
    color: #232323;
    background: #fff;
}

a {
    color: #009bdb;
}

a:hover,
a:focus {
    color: #057cad;
}

a:focus {
    outline: none;
}

/*--------------------------------------------
2. Heading Styles
--------------------------------------------*/
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Lato', sans-serif;
}

h1 {
    font-size: 45px;
}

h2 {
    font-size: 42px;
}

h3 {
    font-size: 36px;
}

h4 {
    font-size: 24px;
}

h5 {
    font-size: 18px;
}

h6 {
    font-size: 16px;
}

.main-heading1 {
    color: #323232;
}

.main-heading2 {
    padding-bottom: 15px;
    position: relative;
    color: #009bdb;
}

.main-heading2:after {
    content: "";
    position: absolute;
    width: 170px;
    height: 2px;
    left: 0;
    bottom: 0;
    background-color: #009bdb;
}

.lite {
    font-weight: 300;
}

.side-heading1 {
    margin-top: 50px;
    margin-bottom: 15px;
    padding-bottom: 10px;
    color: #009bdb;
    border-bottom: 1px solid #009bdb;
}

/*--------------------------------------------
3. Typography Styles
--------------------------------------------*/
.top-bar,
#nav.navbar-default .navbar-nav,
.camera_caption > div,
.camera_caption a.btn-secondary,
.tabs-wrap-2 .nav-tabs > li > a,
#doctors-filter,
.about-featured .btn-transparent,
.news-post .quote,
.list-style-1 li,
.cblock-1 li,
.contact-form .btn,
.block-404 .btn,
.book-appointment-box .btn-main,
.footer-top-bar .btn-black {
    font-family: 'Lato', sans-serif;
}

/*--------------------------------------------
5. Header Styles
--------------------------------------------*/
.main-header {
    background-color: #fff;
}

header {
    /* height: 100%; */
    height: 60px;
    min-height: 60px;
}

.nav-container {
    width: 70%;
}

/*@media (max-width: 767px) {*/
/*    .container {*/
/*        width: 95%;*/
/*    }*/
/*}*/

/*--------------------------------------------
5.1. Top Bar Styles
--------------------------------------------*/
.top-bar {
    padding-top: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #d3d3d3;
}

.top-bar,
.top-bar a {
    color: #8d8d8d;
}

.top-bar span.top-info {
    color: #009bdb;
    padding-right: 5px;
    padding-left: 10px;
    margin-left: 5px;
    border-left: 1px solid #d3d3d3;
}

.top-bar span.top-info:first-child {
    margin-left: 0px;
    border-left: none;
    padding-left: 0px;
}

.top-bar span {
    color: #313131;
}

.top-bar ul {
    text-align: right;
    margin-bottom: 0;
}

.top-bar li {
    padding-left: 5px;
    padding-right: 5px;
    border-right: 1px solid #d3d3d3;
}

.top-bar li:last-of-type {
    padding-right: 0;
    border: none;
}

.top-bar li .fa {
    margin-right: 5px;
    vertical-align: middle;
}

.top-bar li a:hover {
    color: #009bdb;
}

/*--------------------------------------------
5.2. Navbar Styles
--------------------------------------------*/
#nav {
    margin-bottom: 0;
    background: none;
    text-transform: uppercase;
}

#nav .navbar-brand {
    padding: 17px 0 0;
    color: #009bdb;
    font-size: 30px;
    font-weight: 500;
    height: auto;
    line-height: normal;
}

#nav .navbar-brand span {
    color: #8d8d8d;
}

#nav .navbar-brand .logo {
    float: left;
    margin-right: 50px;
    vertical-align: middle;
    width: 160px;
}

#nav.navbar {
    min-height: 60px;
}

#nav .nav {
    margin-top: 5px;
}

#nav.navbar-default .navbar-nav > li > a {
    font-size: 15px;
    font-weight: normal;
    color: #313131;
    line-height: normal;
}

#nav .navbar-nav > li.active > a,
#nav.navbar-default .navbar-nav > .open > a,
#nav.navbar-default .navbar-nav > .open > a:hover,
#nav.navbar-default .navbar-nav > .open > a:focus,
#nav .dropdown-menu > .active > a,
#nav .dropdown-menu > .active > a:hover,
#nav .dropdown-menu > .active > a:focus {
    background: none;
}

#nav .navbar-nav > li:hover > a,
#nav .navbar-nav > li.active > a,
#nav .navbar-nav > li > a:hover,
#nav .navbar-nav > li > a:focus {
    color: #4385FF;
}

#nav .dropdown-menu {
    background-color: #FFFFFF;
    padding: 10px 0;
    left: 0;
    border: none;
    text-transform: capitalize;
    min-width: unset;
    border-radius: 5px;
    font-size: 16px;
}

#nav .dropdown-menu > li.active > a,
#nav .dropdown > .dropdown-menu > li > a {
    padding: 10px 15px;
}

#nav .dropdown-menu > li > a:hover,
#nav .dropdown-menu > li > a:focus {
    background-color: #4385FF;
    color: #FFFFFF;
}

#nav .dropdown-menu a.active,
#nav .dropdown-menu > .active > a:hover,
#nav .dropdown-menu > .active > a:focus {
    background-color: #4385FF;
    color: #FFFFFF;
}

.dropdown:hover > .dropdown-menu {
    display: block;
}

.dropdown > .dropdown-toggle:active {
    pointer-events: none;
}

#nav .navbar-toggle {
    margin-top: 27px;
    margin-bottom: 0;
    padding: 0;
}

#nav .navbar-toggle:hover,
#nav .navbar-toggle:focus {
    background: none;
}

#nav .navbar-toggle:hover .icon-bar,
#nav .navbar-toggle:focus .icon-bar {
    background-color: #009bdb;
}

#nav.affix-top {
    position: fixed;
    /* top: 55px; */
    top: 0;
    left: 0;
    right: 0;
    z-index: 10;
    height: 60px;
    background-color: #ffffff;
    border: 0;
}

#nav.affix {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10;
    height: 60px;
    background-color: #ffffff;
    border-bottom: solid 1px #F1F1F1;
    transition: all .6s ease-in-out, top 0s;
}

#nav.navbar.affix {
    min-height: inherit;
}

#nav.affix .navbar-brand {
    padding: 17px 0 0;
}

#nav.affix .nav {
    margin-top: 5px;
}

.navbar-collapse {
    background-color: #fff;
}

.container-relative {
    position: relative;
}

.main-banner {
    width: 100%;
}

/*--------------------------------------------
5.7. Page Preloader
--------------------------------------------*/
#loading {
    background-color: #fff;
    height: 100%;
    width: 100%;
    position: fixed;
    z-index: 9999999;
    margin-top: 0;
    top: 0;
    opacity: 0.95;
}

#loading-center {
    width: 100%;
    height: 100%;
    position: relative;
}

#loading-center-absolute {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 200px;
    width: 200px;
    margin-top: -100px;
    margin-left: -100px;
    -ms-transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}

.object {
    -moz-border-radius: 50% 50% 50% 50%;
    -webkit-border-radius: 50% 50% 50% 50%;
    border-radius: 50% 50% 50% 50%;
    position: absolute;
    border-top: 5px solid #009bdb;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #009bdb;
    border-right: 5px solid transparent;
    -webkit-animation: animate 2s infinite;
    animation: animate 2s infinite;
}

#object_one {
    left: 75px;
    top: 75px;
    width: 50px;
    height: 50px;
}

#object_two {
    left: 65px;
    top: 65px;
    width: 70px;
    height: 70px;
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
}

#object_three {
    left: 55px;
    top: 55px;
    width: 90px;
    height: 90px;
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
}

#object_four {
    left: 45px;
    top: 45px;
    width: 110px;
    height: 110px;
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

@-webkit-keyframes animate {
    50% {
        -ms-transform: rotate(360deg) scale(0.8);
        -moz-transform: rotate(360deg) scale(0.8);
        -o-transform: rotate(360deg) scale(0.8);
        -webkit-transform: rotate(360deg) scale(0.8);
        transform: rotate(360deg) scale(0.8);
    }
}

@keyframes animate {
    50% {
        -ms-transform: rotate(360deg) scale(0.8);
        -moz-transform: rotate(360deg) scale(0.8);
        -o-transform: rotate(360deg) scale(0.8);
        -webkit-transform: rotate(360deg) scale(0.8);
        transform: rotate(360deg) scale(0.8);
    }
}

/*--------------------------------------------
6. Main Container Styles
--------------------------------------------*/
.main-container {
    margin-top: 60px;
    margin-bottom: 60px;
}

/*--------------------------------------------
10. Featured Doctors Section Styles
--------------------------------------------*/
.featured-doctors {
    padding-top: 70px;
    padding-bottom: 70px;
    text-align: center;
    background-color: #fafafa;
}

.featured-doctors h2 {
    margin-top: 0;
    margin-bottom: 20px;
}

.featured-doctors h2,
.featured-doctors h2 + p {
    color: #000;
}

.featured-doctors h2 + p {
    margin-left: 5%;
    margin-right: 5%;
}

.featured-doctors p {
    font-size: 18px;
}

.featured-doctors img {
    margin-top: 40px;
    width: 100%;
}

.featured-doctors .bio-box,
.doctors-grid .bio-box {
    margin-top: 40px;
    background-color: #fff;
}

/*--------------------------------------------
11. ContactUs Section Styles
--------------------------------------------*/
.featured-contactus {
    padding-top: 70px;
    padding-bottom: 70px;
    text-align: center;
    background-color: #fff;
}

.featured-contactus h2 {
    margin-top: 0;
    margin-bottom: 40px;
    color: #000;
}

.featured-contactus .container {
    display: flex;
    flex-direction: row;
    background-color: #fff;
}

.featured-contactus .container .left {
    display: flex;
    flex-direction: column;
    flex: 1;
    align-items: flex-start;
    background-color: #fafafa;
    border-radius: 8px;
    padding: 25px 30px;
    margin-right: 40px;
}

.featured-contactus .container .left h5 {
    font-weight: 600;
    margin-bottom: 20px;
}


.featured-contactus .container .left img {
    width: 18px;
    height: 18px;
    margin-right: 15px;
    margin-top: -1px;
}

.featured-contactus .container .left span {
    font-size: 14px;
    color: #333333;
    margin-top: 5px;
}

.featured-contactus .container .right {
    display: flex;
    flex-direction: column;
    height: 100%;
    flex: 1;
    /*background-color: #fafafa;*/
    border-radius: 8px;
    margin-left: 40px;
}

.featured-contactus .container img {
    width: 100%;
    border-radius: 8px;
    /* height: 160px; */
}

.featured-contactus span {
    color: #333;
}

@media (max-width: 500px) {
    .featured-contactus .container {
        flex-direction: column;
    }

    .featured-contactus .container .left {
        margin-right: 0;
    }

    .featured-contactus .container .right {
        margin-top: 20px;
        margin-left: 0;
    }

    .featured-contactus .container img {
        width: 100%;
    }
}


/*--------------------------------------------
14. About Page Skills Styles
--------------------------------------------*/
.main-block2 {
    color: #0c0c0c;
}

.main-block2 h4 {
    margin-top: 0;
    margin-bottom: 20px;
    color: #191919;
}

.main-block2 p {
    margin-bottom: 20px;
}

/*--------------------------------------------
15. 404 Block Styles
--------------------------------------------*/
.block-404 {
}

.block-404 h2 {
    margin-top: 0;
    margin-bottom: 50px;
    font-size: 140px;
    font-weight: bold;
    color: #323232;
}

.block-404 h2 span {
    color: #009bdb;
}

.block-404 h5 {
    margin-bottom: 20px;
    color: #66a3bc;
    font-weight: bold;
}

.block-404 p {
    color: #0c0c0c;
    font-size: 18px;
}

.block-404 .btn {
    margin-top: 50px;
    padding: 20px 30px;
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
}

.block-404 .btn .fa {
    font-weight: 500;
}

.block-404 .btn .fa-home {
    margin-right: 20px;
    font-size: 24px;
}

.block-404 .btn .fa-chevron-right {
    margin-left: 20px;
    font-size: 18px;
}

/*--------------------------------------------
29. Footer Styles
--------------------------------------------*/
.footer-top-bar {
    padding-top: 40px;
    padding-bottom: 40px;
    background-color: #009bdb;
}

.footer-top-bar h3 {
    margin-top: 10px;
    margin-bottom: 0;
    color: #fff;
}

.footer-top-bar .btn-black {
    padding: 15px 40px;
    font-size: 16px;
    font-weight: bold;
}

.footer-area {
    padding-top: 30px;
    padding-bottom: 10px;
    background-color: #313131;
}

.footer-area .logo {
    width: 160px;
}

.footer-area,
.footer-area a {
    color: #ffffff;
}

.footer-area a:hover {
    color: #009bdb;
}

.footer-area h4 {
    margin-top: 0;
    margin-bottom: 30px;
    padding-bottom: 20px;
    position: relative;
    color: #fff;
}

.footer-area h4:after {
    content: "";
    position: absolute;
    width: 69px;
    height: 2px;
    left: 0;
    bottom: 0;
    background-color: #009bdb;
}

.footer-area ul {
    margin-bottom: 0;
}

.footer-area li + li {
    margin-top: 9px;
}

.footer-area li .fa {
    margin-right: 7px;
    font-weight: normal;
}

.footer-area .address-list {
    margin-top: 10px;
    margin-bottom: 0;
}

.footer-area .address-list li {
    margin-top: 12px;
}

.footer-area .address-list li .fa {
    margin: 4px 10px 0 0;
    float: left;
    color: #fff;
}

.footer-area .address-list li.address .fa {
    margin: 2px 10px 0 0;
    font-size: 18px;
}

.footer-area .tweets-list {
}

.footer-area .tweets-list li {
    margin-top: 0px;
}

.footer-area .tweets-list li .fa {
    margin: 7px 12px 20px 0;
    color: #fff;
    font-size: 18px;
    float: left;
}

.footer-area .tweets-list li a:hover {
    text-decoration: underline;
}

.tweets-list p {
    margin: 0;
    color: #fff;
}

.footer-area .newsletter {
    margin-top: 35px;
}

.footer-area .newsletter .form-control {
    padding: 15px 20px;
    height: 52px;
    color: #fff;
    background-color: #434343;
    border-color: #595959;
}

.footer-area .newsletter .form-control:focus {
    border-color: #777;
}

.footer-area .newsletter .btn-secondary {
    text-transform: uppercase;
    font-weight: 500;
}

.bottom_line {
    background-image: url('../images/bottom_line.png');
    width: 100%;
    height: 2px;
    background-size: cover;
}

.copyright {
    padding-top: 20px;
    padding-bottom: 20px;
    font-size: 12px;
    text-transform: uppercase;
    background-color: #262626;
}

.copyright,
.copyright a {
    color: #8d8d8d;
}

.copyright span,
.copyright a:hover {
    color: #009bdb;
}

.copyright p,
.copyright ul {
    margin-bottom: 0;
}

.copyright li {
    padding-left: 10px;
    padding-right: 10px;
}

.copyright li:last-of-type {
    padding-right: 0;
}

/*--------------------------------------------
30. Images Styles
--------------------------------------------*/
.img-style1 {
    border: 1px solid #e6e6e6;
}

/*--------------------------------------------
31. Lists Styles
--------------------------------------------*/
.list-style-1 {
    margin-bottom: 10px;
}

.list-style-1 li {
    padding-top: 10px;
    padding-bottom: 8px;
    border-bottom: 1px dotted #9b9b9b;
}

.list-style-1 li:last-of-type {
    border-bottom: none;
}

.list-style-1 li,
.list-style-1 li a {
    color: #323232;
    font-size: 18px;
}

.list-style-1 li a:hover,
.list-style-1 li a:focus {
    color: #0091cd;
}

.list-style-2 {
    margin-top: 5px;
    margin-bottom: 15px;
}

.list-style-2 li {
    position: relative;
    padding-top: 5px;
    padding-bottom: 5px;
}

.list-style-2 li:before {
    content: "\f017";
    margin-right: 10px;
}

.list-style-2 li,
.list-style-2 li a {
    color: #0c0c0c;
    font-size: 18px;
}

.list-style-2 li:before,
.list-style-2 li a:hover,
.list-style-2 li a:focus {
    color: #0091cd;
}

.list-style-3 {
    margin-top: 20px;
    margin-bottom: 0;
}

.list-style-3 li {
    position: relative;
    padding-top: 5px;
    padding-bottom: 5px;
}

.list-style-3 li:before {
    content: "\f21e";
    margin-right: 10px;
}

.list-style-3 li,
.list-style-3 li a {
    color: #0c0c0c;
    font-size: 18px;
}

.list-style-3 li:before {
    color: #0091cd;
}

.list-style-3 li:hover:before,
.list-style-3 li a:hover,
.list-style-3 li a:focus {
    color: #0091cd;
}

.list-style-4 {
    margin-top: 5px;
    margin-bottom: 15px;
}

.list-style-4 li {
    position: relative;
    padding-top: 5px;
    padding-bottom: 5px;
}

.list-style-4 li:before {
    content: "\f219";
    margin-right: 10px;
}

.list-style-4 li,
.list-style-4 li a {
    color: #0c0c0c;
    font-size: 18px;
}

.list-style-4 li:before,
.list-style-4 li a:hover,
.list-style-4 li a:focus {
    color: #0091cd;
}

/*--------------------------------------------
32. Progress Bar Styles
--------------------------------------------*/
.progress-bar-list {
    margin-top: 40px;
    margin-bottom: 0;
}

.progress-bar-list h6 {
    margin-top: 0;
    margin-bottom: 0;
}

.progress-bar-list li .progress {
    margin-bottom: 0;
    background: none;
    height: 35px;
}

.progress-bar-list li .progress .progress-bar {
    line-height: 35px;
    font-size: 18px;
}

.progress-bar-list li .progress .progress-bar-1 {
    background-color: #2ca6d9;
}

.progress-bar-list li .progress .progress-bar-2 {
    background-color: #2cbfd9;
}

.progress-bar-list li .progress .progress-bar-3 {
    background-color: #56cce1;
}

.progress-bar-list li .progress .progress-bar-4 {
    background-color: #2ca6d9;
}

.progress-bar-list li .progress .progress-bar-5 {
    background-color: #1b90da;
}

.progress-bar-list li .progress .progress-bar-6 {
    background-color: #3d8dd8;
}

.progress-bar-list li .progress .progress-bar-7 {
    background-color: #5891df;
}

.progress-bar-list > li.row > .col-md-8 {
    padding-top: 10px;
    padding-bottom: 20px;
}

/*--------------------------------------------
33. Tags List Styles
--------------------------------------------*/
.list-tags {
    margin-bottom: 15px;
}

.list-tags li {
    margin: 5px;
    padding: 6px 12px 4px;
    border: 1px solid #d5d5d5;
}

.list-tags li:hover,
.list-tags li:focus {
    background-color: #0091cd;
}

.list-tags li a {
    color: #656565;
}

.list-tags li:hover a,
.list-tags li:focus a {
    color: #fff;
}

.list-tags li a:before {
    content: "\f02c";
    padding-right: 8px;
    font-size: 13px;
}

/*--------------------------------------------
36. Generic Styles
--------------------------------------------*/
.parallax {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
}

.spacer-block {
    height: 60px;
}

.nomargin-top {
    margin-top: 0;
}

.margin-bottom-5 {
    margin-bottom: 5px;
}

.top-bar li a,
.post-meta a:hover,
#accordion .panel-title a:hover,
#accordion .panel-title a:focus,
#accordion-faqs .panel-title a:hover,
#accordion-faqs .panel-title a:focus,
#doctors-filter li a:hover,
#doctors-filter li a:focus,
#doctors-filter li a.active,
.box1 h4 a:hover,
.box1 h4 a:focus,
.list-tags li a:hover,
.list-tags li a:focus,
.copyright a:hover,
.footer-area li a:hover {
    text-decoration: none;
}

#nav,
    /*#nav .dropdown-menu,*/
    /*#nav .navbar-toggle,*/
.breadcrumb,
.form-control,
.btn,
.tabs-wrap .nav-tabs > li > a,
.tabs-wrap-2 .nav-tabs > li > a,
.progress-bar-list li .progress,
.panel-profile,
.panel-profile > .panel-heading,
.panel-profile > .panel-footer,
#accordion.panel-group .panel,
#accordion .panel-heading,
#accordion-faqs.panel-group .panel,
#accordion-faqs .panel-heading,
.pagination,
.pagination > li:first-child > a,
.pagination > li:first-child > span,
.pagination > li:last-child > a,
.pagination > li:last-child > span,
.no-border-radius {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.block-404 .btn,
.gallery-grid .hover-content .overlay a.zoom,
.footer-top-bar .btn-black {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.featured-doctors .bio-box .profile-img .overlay ul.sm-links li,
.doctors-grid .bio-box .profile-img .overlay ul.sm-links li,
.panel-profile > .panel-footer ul.sm-links li,
.medical-services li .icon,
.cblock-1 .icon-wrap,
.tabs-wrap .nav li .icon {
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
}

#nav .dropdown-menu,
.progress-bar-list li .progress,
.progress-bar-list li .progress .progress-bar,
#accordion.panel-group .panel,
#accordion-faqs.panel-group .panel,
.panel-profile,
.contact-form input.form-control,
.footer-area .newsletter .form-control:hover,
.footer-area .newsletter .form-control:focus,
.no-boxshadow {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.camera_caption > div {
    -webkit-box-shadow: 8px 8px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 8px 8px rgba(0, 0, 0, 0.1);
    box-shadow: 8px 8px rgba(0, 0, 0, 0.1);
}

.book-app .btn {
    margin-right: 15px;
}

.book-appointment-box .btn-main,
.notification-boxes .box {
    -webkit-box-shadow: 4px 4px rgba(85, 85, 85, 0.2);
    -moz-box-shadow: 4px 4px rgba(85, 85, 85, 0.2);
    box-shadow: 4px 4px rgba(85, 85, 85, 0.2);
}

.book-appointment-box .btn-main:hover,
.notification-boxes .box:hover,
.featured-doctors .bio-box:hover {
    -webkit-box-shadow: 6px 6px rgba(85, 85, 85, 0.4);
    -moz-box-shadow: 6px 6px rgba(85, 85, 85, 0.4);
    box-shadow: 6px 6px rgba(85, 85, 85, 0.4);
}

.news-post-box,
.news-post,
.gallery-grid .hover-content,
.blog-author-bio,
.comments-area > .media {
    -webkit-box-shadow: 4px 4px #ececec;
    -moz-box-shadow: 4px 4px #ececec;
    box-shadow: 4px 4px #ececec;
}

.news-post-box:hover,
.news-post:hover,
.gallery-grid .hover-content:hover,
.blog-author-bio:hover,
.comments-area > .media:hover {
    -webkit-box-shadow: 6px 6px #d6d6d6;
    -moz-box-shadow: 6px 6px #d6d6d6;
    box-shadow: 6px 6px #d6d6d6;
}

.featured-doctors .bio-box .profile-img .overlay ul.sm-links li,
.doctors-grid .bio-box .profile-img .overlay ul.sm-links li,
.panel-profile > .panel-footer ul.sm-links li {
    -webkit-box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.4);
    -moz-box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.4);
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.4);
}

.featured-doctors .bio-box .profile-img .overlay ul.sm-links li:hover,
.doctors-grid .bio-box .profile-img .overlay ul.sm-links li:hover,
.panel-profile > .panel-footer ul.sm-links li:hover {
    -webkit-box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.6);
    -moz-box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.6);
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.8);
}

#nav,
#nav .navbar-toggle {
    border: none;
}

.breadcrumb li + li::before,
.list-style-2 li:before,
.list-style-3 li:before,
.list-style-4 li:before,
.recent-comments-list li:before,
.list-tags li a:before {
    font-family: 'FontAwesome';
}

.top-bar a,
#nav.navbar-default .navbar-nav > li > a,
#nav .navbar-toggle,
.camera_prev,
.camera_next,
.breadcrumb li a,
.notification-boxes .box,
.featured-doctors .bio-box,
.featured-doctors .bio-box .profile-img .overlay,
.featured-doctors .bio-box .profile-img .overlay ul.sm-links li,
.doctors-grid .bio-box,
.doctors-grid .bio-box .profile-img .overlay,
.doctors-grid .bio-box .profile-img .overlay ul.sm-links li,
.panel-profile > .panel-footer ul.sm-links li,
.tabs-wrap .nav li a,
.tabs-wrap .nav li a .icon,
.tabs-wrap .nav li a h5,
.tabs-wrap-2 .nav-tabs > li > a,
#doctors-filter li a,
.gallery-grid .hover-content img,
.gallery-grid .hover-content .overlay,
.box1 h4 a,
.news-carousel .carousel-control,
.comments-carousel.carousel.vertical .carousel-control,
.news-post-box,
.news-post-box h5 a,
.news-post,
.news-post h4 a,
.comments-area > .media,
.pagination > li > a,
.pagination > li > span,
.list-tags li,
.list-tags li a,
.list-style-3 li a,
.recent-comments-list li a,
.footer-area a,
.footer-area .newsletter .form-control,
.btn,
.copyright a {
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

.about-intro {
    width: 100%;
    /*text-align: center;*/
    padding: 70px 15%;
    background-image: url("../images/about/bg.png");
}

.about-intro h4 {
    margin-top: 0;
    color: #000;
    font-weight: 600;
}

.about-intro .line {
    margin-top: 15px;
    background-color: #009bdb;
    height: 4px;
    width: 100px;
    border-radius: 3px;
}

.about-intro .container {
    display: flex;
    flex-direction: row;
    margin-top: 50px;
}

.about-intro .container .left {
    display: flex;
    flex-direction: column;
    flex: 1;
    align-items: flex-start;
    margin-right: 5%;
}

.about-intro .container .left p {
    font-size: 14px;
    color: #333333;
}

.about-intro .container .right {
    display: flex;
    flex-direction: column;
    height: 100%;
    flex: 1;
    margin-left: 5%;
}

.about-intro .container .right img {
    width: 70%;
    /*height: 150px;*/
}

@media (max-width: 500px) {
    .about-intro .container {
        flex-direction: column;
    }

    .about-intro .container .left {
        margin-right: 0;
    }

    .about-intro .container .right {
        margin-left: 0;
        margin-top: 10px;
    }

    .about-intro .container .right img {
        width: 100%;
        /*height: 150px;*/
    }
}

.product-icon {
    position: relative;
    top: -120px;
    left: 58%;
    height: 250px;
    z-index: 1;
}

.product-ex {
    /* width: 80% !important; */
    border-radius: 8px;
}

@media (max-width: 500px) {
    .product-icon {
        position: relative;
        top: -40px;
        left: 58%;
        height: 100px;
        z-index: 1;
    }
}

.product-intro {
    margin-top: -250px;
}

@media (max-width: 500px) {
    .product-intro {
        margin-top: -100px;
    }
}

.product-intro > img {
    width: 70%;
    /*max-width: 1200px;*/
}

.product-table-container {
    margin-top: 50px;
    background: #FFFFFF;
    width: 100%;
    padding: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.product-table {
    width: 70%;
    border-bottom: #A5A5A5 1px solid;
    display: flex;
    text-align: center;
    align-self: center;
    padding: 0 20px;
    flex-wrap: wrap;
}

.product-table span {
    font-size: 20px;
    padding: 15px;
    color: #777777;
    cursor: pointer;
}

.product-table .active {
    font-weight: bold;
    border-bottom: #4385FF solid 2px;
}

.product-content {
    width: 70%;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding-top: 30px;
    position: relative;
}

.product-content .arrow {
    width: 36px;
    cursor: pointer;
    position: absolute;
    top: 49%;
}

.product-content .left {
    left: -7%;
}

.product-content .right {
    right: -9%;
}


.product-content div {
    flex: 1;
    padding: 0;
}

.product-content div > img {
    width: 100%;
}

@media (max-width: 700px) {

    .product-table {
        width: 90%;
    }

    .product-table span {
        font-size: 12px;
        padding: 5px;
    }

    .product-content {
        width: 90%;
    }

    .product-content .arrow {
        width: 10px;
    }
}