*
{
    margin: 0;
    padding: 0;
/*    font-family: 'Poppins', sans-serif;*/
}

/*----NavigATION---*/
#nav-bar
{
    position: fixed;
    top: 0;
    z-index: 10;
    width: 100%;
}
.navbar-brand img
{
    height: 40px;
    padding-right: 30px;    
    width: auto;
}
.navbar-nav li
{
	padding: 0 10px;
}
.navbar-nav li a
{
    float: right;
    text-align: left;
 }

#nav-bar ul li a:hover 
{
    color: #007bff!important;
}
.navbar{
    background: #fff;
    }
.navbar-toggler
{
    border:none! important;
    }

.nav-link
{
    color: #555!important;
    font-weight: 600;
    font-size: 16px;
}
/*Slider */

#Slider {
	width: 100%;
}
.Carousel-caption
{
	top:50%;
	transform: translate(-50%);
	bottom: initial !important;
	}

.Carousel-caption h5
{
	color: #fff;
	font-size: 22px;
	text-align: center;
	}

.Carousel-caption h1
{
	color: #fff;
	font-size: 22px;
	text-align: center;
}

/*--About--*/

#About{
    padding-top: 60px;
	padding-bottom: 60px;
	color: #555;
}


#About .btn
{
	margin-top: 20px;
	margin-bottom: 20px;
	}

.About-Content
{
	padding-top: 20px;
	}

.Skills-Bar p
{
	margin-bottom: 6px;
	font-weight: 600;
}

.progress-bar {
	border-radius: 16px;
	}
.Progress {
	border-radius: 16px !important;
	margin-bottom: 20px;
	}


/*-----services-----*/
#services
{
	background-image: linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0.8)),url(img/services.jpg);
	background-size: cover;
	background-position: center;
    color: #2b2b2b !important;
	background-attachment: fixed;
	padding-top: 50px;
	padding-bottom: 50px; 
}
#services h1
{
	margin-top: 20px;
	text-align: center;
	color: #efefef !important;
	padding-bottom: 10 px;
	/*text-decoration-line: underline;*/
	}
#services h1::after 
{
	content: '';
	background: #efefef;
	display: block;
	height: 3px;
	width: 170px;
	margin: 20px auto 5px;
	}
.services{
	margin-top: 40px;
	}
.icon
{
 	font-size: 40px;
	margin: 20px;
	padding: 20px;
	height: 80px;
	width: 80px;
	border: 1px solid #fff;
	border-radius: 50%;
	color: azure;
	
	}
#services p
{
font-size: 14px;
margin-top: 20px;
color: #ccc;
	}
.services .col-md-3:hover{
 box-shadow: 0 2px 20px #fff;
	cursor: pointer;
	transition: 0.7s;
		}
.services h3
{
	color: azure;
	}
/*----Price---*/

#Price
{
	padding: 40px 0;
	background: #efefef;
	padding-top: 70px;
	padding-bottom: 60px;
	color: #2b2b2b !important;
}
#Price
{
	background-image: linear-
	gradient(rgba(0,0,0,0.8),rgba(0,0,0,0.8)),url(img/services.jpg);
	background-size: cover;
	background-position: center;
    color: #2b2b2b !important;
	background-attachment: fixed;
	padding-top: 50px;
	padding-bottom: 50px;	 
}
#Price h1
{
	margin-top: 20px;
	text-align: center;
	color: #333 !important;
	padding-bottom: 10 px;
	}
#Price h1::after 
{
	content: '';
	background: #333;
	display: block;
	height: 2px;
	width: 170px;
	margin: 15px auto 5px;
	}
.Single-Price{
	margin: 10px auto;
	display: inline;
	float: left;
	width: 100%;
	background-color: #2b2b2b;
	transition: 0.5s;
}
.Single-Price:hover
{ box-shadow: 0 2px 20px #333;
	}
.price-head {
	background-color: #2196f3;
	display: inline;
	float: left;
	padding: 20px 5px;
	text-align: center;
	width: 100%;
	}
.price-head h2 {
	color: #fff;
	font-size: 25px;
	font-weight: bold;
	margin-bottom: 5px;
	padding: 5px;
	text-transform: uppercase;
	}
/*.price-head p {
	font-size: 25px;
	color: #ccc;
	font-weight: bold;
	line-height: 30px;
	}*/

#Price span{ 
font-size: 15px;
	}

#Price-Content {
	display: inline;
	float: left;
	width: 100%;
	padding: 0 15px;
}

.Price-Content ul li
{
	border-bottom: 1 px solid #efefef;
	padding: 8px 3px;
	list-style: none;
	}

/*Book-Apnt {
	text-align: center;
}*/
.price-button
{
	display: inline;
	float: left;
	padding: 15px 15px 30px;
	text-align: center; 
	width: 100%;
}
.Book-Apnt{
	background-clip: #2196f3;
	border-radius: inline-block;
	font-size: 18px;
	padding: 15px 50px;
	transition: 0.5s;
	}
/*HowWework*/

#HowWeWork {
	padding-top: 70px;
	padding-bottom: 50px;
	}

#HowWeWork
{
	background-image: linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0.8)),url(img/services.jpg);
	background-size: cover;
	background-position: center;
    color: #2b2b2b !important;
	background-attachment: fixed;
	padding-top: 50px;
	padding-bottom: 50px; 
}
#HowWeWork h1
{
	padding-top: 50px;
	text-align: center;
	color: #efefef !important;
	padding-bottom: 10 px;
	/*text-decoration-line: underline;*/
	}
#HowWeWork h1::after 
{
	content: '';
	background: #efefef;
	display: block;
	height: 3px;
	width: 170px;
	margin: 20px auto 5px;
	}
.HowWeWork{
	margin-top: 40px;
	}
.HowWeWork img{
	height: 50px;
	width: 50px;
	object-fit: cover;
	border-radius: 20%;
	border: 5px solid crimson;
	align-content: center;
	}

.icon
{
 	font-size: 40px;
	margin: 20px;
	padding: 20px;
	height: 80px;
	width: 80px;
	border: 1px solid #fff;
	border-radius: 50%;
	color: azure;
	
	}
#HowWeWork p
{
font-size: 17px;
margin-top: 20px;
color: #ccc;
	}
.HowWeWork .col-md-3:hover{
 	box-shadow: 0 2px 20px #fff;
	cursor: pointer;
	transition: 0.7s;
		}
.HowWeWork h3
{
	text-align: center;
	color: azure;
	}
/* Contact */


	/*
.Book-Apnt:hover{
	border-color: 1px solid #fff;
	background-color: #2196f3;
}
*/
/*a{
	text-decoration: none!important;
	color: #fff!important;
}


/*
	background-image: linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0.8)),url(img/services.jpg);
	background-size: cover;
	background-position: center;
    color: #2b2b2b !important;
	background-attachment: fixed;
	padding-top: 50px;
	padding-bottom: 50px;
}
/*

.price-head li {
	background-color: #2196f3;
	display: inline;
	float: left;
	padding: 10px 5 px;
	text-align: center;
	width: 100%;
	}
*/
#Price h2
{
	text-align: center;
	color: #efefef !important;
	padding-bottom: 10 px;
	}
#Price h2
{
	color: azure;
	}
#Price{
	margin-top: 40px;
	}
#price li {
	color: azure;
	} 
.Price-Content{
	display: inline;
	float: left;
	width: 100%;
	padding: 0 15px;
}

/*---Contact--*/

#contact {
	padding: 40px 0;
	background: #efefef;
	padding-top: 70px;
	padding-bottom: 60px;
	color: #2b2b2b !important;
}
#contact
{
	background-image: linear-
	gradient(rgba(0,0,0,0.8),rgba(0,0,0,0.8)),url(img/services.jpg);
	background-size: cover;
	background-position: center;
    color: #2b2b2b !important;
	background-attachment: fixed;
	padding-top: 50px;
	padding-bottom: 50px;	 
}

#contact h1{
	margin-top: 20px;
	text-align: center;
	color: #333 !important;
	padding-bottom: 10 px;
	text-align: center;
	
}

#contact h1::after 
{
	content: '';
	background: #333;
	display: block;
	height: 3px;
	width: 170px;
	margin: 20px auto 5px;
	}



/*---TakeAppointment--*/

<style>
@import url('https://fonts.googleapis.com/css2?family=Roboto+Serif:opsz,wght@8..144,100&display=swap');
</style>

* Box-sizing: {
    border-box;
    
}
    

body {
    font-family:'Inter';
    height: 100vh;
    background-color: azure;
    display flex;
    align-items: left;
    justify-content: center;
    
}

form {
    background-color: cornsilk;
    padding: 60px;
    width: 550px;
    max-width: calc (100% - 60px);
    
}

.form-element {
    display: flex;
    flex-direction: column;
    margin-bottom: 30 px;
      
}

.form-element span {
    margin-bottom: 10px;
    
}

input, textarea {
    border: 1px solid #d0d2e2;
    line-height: 2;
    padding: 5px;
    border-radius: 5px;

}

form button {
width: 100%;
padding: 20px;
color: white;
background: blueviolet;
    border-radius: 5px;
    border: none;
    font-size: 19px;
    cursor: pointer;
    
    
}



#Appointment {
	padding: 40px 0;
	background: #5e5555;
	padding-top: 70px;
	padding-bottom: 60px;
	color: #2b2b2b !important;
}

#Appointment
{
	background-image: linear-
	gradient(rgba(0,0,0,0.8),rgba(0,0,0,0.8)),url(img/services.jpg);
	background-size: cover;
	background-position: center;
    color: #fff !important;
	background-attachment: fixed;
	padding-top: 50px;
	padding-bottom: 50px;	 
}

#Appointment h1{
	margin-top: 20px;
	text-align: center;
	Font color: #fff;
	color: #fff !important;
	padding-bottom: 10 px;
	text-align: center;
	
}

#Appointment h1::after 
{
	content: '';
	background: #fff;
	display: block;
	height: 3px;
	width: 170px;
	margin: 20px auto 5px;
	}

#Appointment botton {
	background-color: rgba(0,0,0,-95);
    Border: transparent;
    font-size: 30px;
	color: #fff;
    font-size: 20px;
    font-weight: bold;
    letter-spacing: 2px;
    height: 50px;
}





/*


Commented on 25-02-2022*/


/*

*/
/*
.Appointment form-control
{
	border-radius: 0 !important;
	border: none !important;
}

::placeholder {
	color: #333 !important;
}
--*/

/*---

.header{
    min-height: 100vh;
    width: 100%;
    background-image: linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url(images/capture.png); 
    background-position: center;
    background-size: cover;
    position: relative;
}
nav{
    display: flex;
    padding: 2% 6%;
    justify-content: space-between;
    align-items:center;
}
nav img{
    width: 150px;
    }
.Menu-Bar{
    flex: 1;
    text-align: right;
}
.Menu-Bar ul li{
    list-style: none;
    display: inline-block;
    padding: 8px 12px;
    position: relative;
    }
.Menu-Bar ul li a{
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    }
.Menu-Bar ul li::after{
    content: '';
    width: 0%;
    height: 2px;
    background: #f44336;
    display: block;
    margin: auto;
    transition: 0.5s;
    }
.Menu-Bar ul li:hover::after{
    width: 100%;
    }
.text-box{
    width: 90%;
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    text-align: center;
}
.text-box h1{
    font-size: 62px;
}
.text-box{
    margin: 10px 0 40px;
    font-size: 14px;
    color: #fff;
    }
.hero-btn{
    display: inline-block;
    text-decoration: none;
    color: #fff;
    border: 1px solid #fff;
    padding: 12PX 34PX;
    font-size: 13px;
    background: transparent;
    position: relative;
    cursor: pointer;
}
.hero-btn:hover {
    border: 1px solid #f44336;
    background: #f44336;
    transition: 1s;
    }

.Submenu-Services 
{
    display:none;
}

.Menu-Bar ul li:hover .Submenu-Services 
{
    display: block;
    position: absolute;
    background: rgb(0,100,0);
    margin-top:15px;
    margin-left:-15px;
}
.Menu-Bar ul li:hover .Submenu-Services ul 
{
    display: block;
    margin: 10px;
}

.Menu-Bar ul li:hover .Submenu-Services ul li
{
    width: 250px;
    padding: 10px;
    border-bottom: 1px dotted #fff;
    background: transparent;
    border-radius: 0;
    text-align: left;
}
--*/
/*--Home---*/
/*--{
    background-image:linear-gradient(to right, #a517ba,#5f1782);
    color: #fff;
    padding-top: 10%;
}
.promo-title
{
    font-size: 40px;
    font-weight:600;
    margin-top: 100px;
}

.bottom-img{
    width: 100;
}

.Col-md-6{
    top: 70%;
   }

.HomeContent{
    top:90%;
}


 
-Home---*/