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

Project     :  Medical & Health Care HTML Template.
Version     :   1.0
Author              : Thesoftking
Front-end developer : Mamunur Rashid
=====================================================================

[Table of contents]

1. Base CSS Start
2. Site Preloader Css Start
3. HOME PAGE CSS START
    3.1 Main Menu Area Start
    3.2 Slider Area Start
    3.3 Make an Appointment Section Start
    3.4 About Section Start
    3.5 Service Section CSS Start
    3.6 Video Section Start
    3.7 Get a Call Start
    3.8  Testimonial Area Start
    3.9 Footer Area Start
    3.10  Click BottomToTop
4  About Section Start
     4.1  BreadCrumb Area Start
5. Service Page Start
6. Blog and Blog Details Start
7. Login and Register Page Start
8. Contact Us Page Css Start
9. 404 Page Start
10. Faq Page Css Start
11. Doctor Page Css Start
12. About Doctor Page CSS Start

==================================================================*/

/*====================================================================
1. Base CSS Start
======================================================================*/

/* Google Font */

@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700|Poppins:300,400,500,600,700,800');

.required:after {
	content: '*' !important;
	color: red;
	font: bold 14px;
	display: inline;
}

.cursor {
	cursor: pointer !important;
}

.table-spacing {
	border-collapse: collapse;
	width: 99%;
}

.table-spacing td {
	padding-top: 0.2em;
	padding-bottom: 0.2em;
	padding-left: 0.2em;
}

.table-spacing th {
	padding-top: 0.5em;
	padding-bottom: 0.2em;
	padding-left: 0.2em;
}

html,
body {
	margin: 0;
	padding: 0;
	font-weight: 400;
	color: #777777;
	font-family: 'Open Sans', sans-serif;
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

a,
a:visited,
a:focus,
a:active,
a:hover {
	text-decoration: none;
	outline: none;
}

a,
button {
	margin-bottom: 0px;
	line-height: 24px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

h1,
h2,
h3,
h4,
h5,
h6,
h1,
.h1,
.h2,
.h3 {
	margin-bottom: 0px;
	font-family: 'Poppins', sans-serif;
}

h1 {
	font-size: 60px;
	line-height: 40px;
}

h2 {
	font-size: 40px;
	line-height: 40px;
}

h3 {
	font-size: 30px;
}

h4 {
	font-size: 40px;
}

h5 {
	font-size: 20px;
}

h6 {
	font-size: 16px;
}

p {
	font-size: 16px;
	line-height: 24px;
	font-weight: normal;
	color: #777777;
	margin-bottom: 0px;
}

.margin-0 {
	margin: 0;
}

.form-control {
	border: 1px solid #e2e2e2;
	-webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, 0) inset;
	box-shadow: 0 0px 0px rgba(255, 255, 255, 0);
	border-radius: 2px;
}

.form-control:focus {
	box-shadow: 0 0px 0px rgba(255, 255, 255, 0);
	border-color: #777777;
}

.modal {
	z-index: 00b28a9;
	background: rgba(0, 0, 0, 0.49);
}

.slick-initialized .slick-slide:focus {
	outline: 0px;
}

.affix {
	width: 100%;
}

#map {
	width: 100%;
	height: 500px;
}

.nav-item.dropdown:hover .dropdown-menu {
	display: block;
	padding: 0px;
}

.mybtn {
	background-color: #00b28a;
	width: 150px;
	height: 50px;
	color: #fff;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 700;
	display: inline-block;
	text-align: center;
	line-height: 50px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.mybtn:hover {
	background-color: #f66;
	color: #fff;
}

/*=================================================
2. Site Preloader Css Start
===================================================*/
.site-preloader {
	background-color: #fff;
	height: 100%;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 9999999;
}

.site-preloader .spinner {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

/* section Header */

.sectionHeader {
	text-align: center;
}

.sectionHeader h2 {
	color: #222222;
	font-size: 40px;
	text-transform: uppercase;
	margin-bottom: 17px;
	font-weight: 600;
}

/* ============================================
3. HOME PAGE CSS START
=============================================== */

/* ================================================
3.1 Main Menu Area Start
===================================================*/

.support-bar-area {
	display: none;
}

header.header {
	position: relative;
	z-index: 2;
	background: rgb(255, 255, 255);
	box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.1);
}

.navbar-light .navbar-toggler-icon {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.3)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

.navbar-light .navbar-toggler:focus {
	outline: 0px;
}

.header.header.stiky {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 99;
	background: #fff;
	border-bottom: 0px;
}

.header.header .nav-link {
	color: #222222;
	font-size: 16px;
	margin-right: 10px;
	font-weight: 700;
	position: relative;
	text-transform: uppercase;
	padding: 35px 0px 35px;
	margin-right: 28px;
	display: block;
}

.header.header .nav-link.active,
.header.header .nav-link:hover {
	color: #00b28a;
}

.header.header .nav-link.active::before {
	position: absolute;
	content: ' ';
	bottom: 0px;
	left: 0px;
	width: 100%;
	height: 4px;
	background-color: #00b28a;
}

.header.header .nav-item.dropdown .dropdown-item {
	color: rgb(119, 119, 119);
	font-size: 16px;
	margin-right: 10px;
	font-weight: 700;
	position: relative;
	text-transform: uppercase;
	padding: 7px 15px 7px;
}

.header.header .nav-item.dropdown .dropdown-item.active,
.header.header .nav-item.dropdown .dropdown-item:hover {
	background: #00b28a;
	color: #fff;
}

.navbar-nav .dropdown-menu {
	border-radius: 0px;
	margin-top: -1px;
}

.header.header .nav-link.active::before {
	width: 100%;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.header.header .nav-link:hover::before {
	width: 100%;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.header.header .nav-item:last-child .nav-link {
	margin-right: 0px;
	padding-right: 30px;
}

.navbar-light .navbar-toggler {
	border: 0px;
}

.header .call_btn a {
	background-color: #00b28a;
	width: 170px;
	height: 50px;
	color: #fff;
	display: inline-block;
	text-align: center;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 700;
	line-height: 50px;
	margin-left: 50px;
}

.header .call_btn a i {
	transform: rotate(90deg);
	font-size: 14px;
	margin-right: 5px;
}

.header .call_btn a:hover {
	background-color: #f66;
}

/* =============================================
3.2 Slider Area Start
================================================ */

#slider-area .sbanner {
	position: relative;
	background: url(../img/banner/istocknurse.png) no-repeat;
	background-position: bottom right;
}

#slider-area {
	border-bottom: 2px solid rgb(236, 236, 236);
	position: relative;
}

#slider-area .overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.8);
	opacity: 0;
}

#slider-area .slide-caption .slider-inner .slide-btn a {
	margin-right: 20px;
}

#slider-area .slide-caption .slider-inner .slide-btn .slidveideo a {
	margin-right: 10px;
}

#slider-area .slide-caption .slider-inner .slide-btn a:hover {
	text-decoration: none;
}

#slider-area .slide-caption .slider-inner .slide-btn {
	margin-top: 36px;
}

#slider-area .slide-caption .slider-inner .caption-desc {
	font-size: 18px;
	font-weight: 500;
	line-height: 30px;
	color: #999999;
}

#slider-area .slide-item {
	position: relative;
	width: 100%;
	padding: 120px 0px 120px;
	display: table;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

#slider-area .mybtn {
	width: 160px;
	font-size: 16px;
	font-weight: 600;
	height: 50px;
}

#slider-area .slide-caption {
	display: table-cell;
	vertical-align: middle;
	text-align: left;
	position: relative;
	padding: 0px 15px;
}

#slider-area .slide-caption h1 {
	font-size: 50px;
	line-height: 65px;
	font-weight: 600;
	text-transform: capitalize;
	font-family: 'Poppins', sans-serif;
	text-transform: uppercase;
	color: #00b28a;
	margin-bottom: 15px;
}

#slider-area .slide-caption p {
	margin: 0 auto;
	color: #e2e2e2;
	font-size: 16px;
	margin-top: 0;
	text-transform: capitalize;
}

#slider-area .slidveideo {
	display: inline-block;
}

#slider-area a i {
	display: inline-block;
	border-style: solid;
	border-width: 2px;
	border-color: #f66;
	color: #f66;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	line-height: 47px;
	text-align: center;
	position: relative;
	top: 0px;
	transition: 0.3s ease-in;
}

#slider-area a span {
	padding-left: 10px;
	color: #f66;
	font-weight: 600;
	transition: 0.3s ease-in;
}

#slider-area .venobox:hover i {
	border-color: #00b28a;
	background-color: #00b28a;
	color: #fff;
}

#slider-area .venobox:hover span {
	color: #00b28a;
}

/* =============================================
3.2 Slider Area End
================================================ */

/* ==============================================
3.3 Make an Appointment Section Start
================================================= */

.appointment {
	padding: 130px 0px 120px;
}

.box {
	text-align: center;
}

.box.disabled {
	opacity: 0.4;
}

.box h4 {
	font-size: 24px;
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	color: #333;
	margin-bottom: 20px;
}

.box p {
	color: #777;
	font-size: 16px;
	line-height: 26px;
}

.box .icon {
	border-radius: 50%;
	background-color: rgb(0, 178, 138);
	position: relative;
	width: 130px;
	height: 130px;
	text-align: center;
	margin-bottom: 35px;
	display: inline-block;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	font-size: 50px;
	line-height: 130px;
	color: #fff;
}

.box .icon::after {
	position: absolute;
	content: ' ';
	background-color: rgb(0, 178, 138);
	opacity: 0.102;
	border-radius: 50%;
	width: 150px;
	height: 150px;
	left: -10px;
	top: -10px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.box:not(.disabled):hover .icon,
.box:not(.disabled).hover .icon,
.box:not(.disabled):hover .icon::after,
.box:not(.disabled).hover .icon::after {
	background-color: #f66;
}

.appointmentForm .bg1 {
	background: #00b28a;
	width: 60%;
	float: left;
	display: inline-block;
}

.appointmentForm .bg2 {
	background: #f66;
	width: 40%;
	float: left;
	display: inline-block;
}

.appointmentForm {
	margin-top: 117px;
}

.appointmentForm h3 {
	color: #fff;
	padding: 42px 50px 42px;
	display: block;
	text-align: left;
}

.appointmentForm h3 i {
	font-size: 22px;
	transform: rotate(90deg);
	margin-right: 10px;
}

.appointmentForm .form-row > .col,
.appointmentForm .form-row > [class*='col-'] {
	padding-right: 15px;
	padding-left: 15px;
}

.appointmentinputs {
	padding: 49px 40px 34px;
	box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.05);
}

.appointmentinputs input,
.appointmentinputs select {
	width: 100%;
	border-style: solid;
	border-width: 2px;
	border-color: rgb(236, 236, 236);
	background-color: rgba(0, 0, 0, 0);
	height: 50px;
	color: #777777;
	padding: 0px 15px;
}

.appointmentinputs select:focus {
	outline: 0px;
}

.appointmentinputs input.submit {
	cursor: pointer;
	text-transform: uppercase;
	background: #00b28a;
	border-color: #00b28a;
	color: #fff;
	font-weight: 700;
	font-size: 16px;
	margin-bottom: 0px;
	line-height: 24px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.appointmentinputs input.submit:hover {
	background: #f66;
	border-color: #f66;
}

.appointmentinputs .form-group {
	margin-bottom: 20px;
}

.footer h5 {
	color: rgba(255, 255, 255, 0.9);
	font-weight: 500;
	margin-bottom: 35px;
	text-transform: uppercase;
}

.footer .widget1 {
	color: rgba(255, 255, 255, 0.6);
}

.footer .widget2 .media img {
	margin-right: 20px;
}

.footer .widget2 .media p {
	font-size: 16px;
	color: rgba(255, 255, 255, 0.8);
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.footer .widget2 .media span {
	font-size: 12px;
	color: rgba(255, 255, 255, 0.5);
	text-transform: uppercase;
	margin-top: 15px;
	display: block;
}

.footer .widget2 .media {
	margin-bottom: 20px;
}

.footer .widget3 ul li a,
.footer .widget4 ul li a {
	font-size: 16px;
	color: rgba(255, 255, 255, 0.6);
	text-transform: capitalize;
	margin-bottom: 15px;
	display: block;
}

.footer .widget3 ul li a:hover,
.footer .widget4 ul li a:hover,
.footer .widget2 a:hover p {
	color: #00b28a;
}

.footer .widget3 h5 {
	margin-bottom: 30px;
}

.footer .widget4 h5,
.footer .widget4 h5,
.footer h5 {
	margin-bottom: 27px;
	font-size: 22px;
}