*{
	margin: 0px;
	padding: 0px;
	font-family: 'Crimson Text', serif;
}

/*Navigation Bar*/

#navbar{
	display: flex;
	position: relative;

}

/*logo and image*/
#logo{
	margin: 15px;

}

#logo img{
	margin: -11px 0px;

	height: 57px;


}
/*list styling*/
#navbar ul{
	display: flex;
}


#navbar::before{
	content: "";
	top: 0px;
	left: 0px;
	background-color:black ;
	position: absolute;
	height: 100%;
	width:100%;
	z-index: -1;
	opacity: 0.4;
	
}


#navbar ul li{
	/*color: white;*/
	list-style: none;
	/*background-color: black;*/
	font-size: 1.3rem;
}

#navbar ul li a{
	color: white;
	display: block;
	padding: 11px 22px;
	border-radius: 22px;
	text-decoration: none;
	

}

#navbar ul li a:hover{
	color: black;
	background-color: white;
	font-family: 'Crimson Text', serif;
	font-family: 'Staatliches', cursive;

}

/*Home Section*/
#home{
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 540px;
	align-items: center;
	padding: 3px 200px;

}

#home::before{
	content: "";
	background: url("../img/bg.jpg") no-repeat center center/cover;
	position: absolute;
	height: 100%;
	width:100%;
	z-index: -1;
	opacity: 4.8;
	top: 0px;
	left: 0px;
}

#home h1{
	color: #F2CAFF;
	text-align: center;

}

#home p{
	color: white;
	text-align: center;
	font-size: 1.5rem;
}
/*About*/
#about{
	color: white;
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 330px;
	align-items: center;
	padding: 3px 200px;

}


#about-container{
	position: relative;
}


#about-container::before{
	content: "";
	top: 0px;
	left: 0px;
	background: url("../img/bg1.jpg") no-repeat center center/cover;
	position: absolute;
	height: 100%;
	width:100%;
	z-index: -1;
	opacity: 0.9;
}
#about-container h1{
	color: white;
}
.about{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%
	opacity:inherit;
}
 
.about-img{
	height: 25%;
    width: 190px;
    margin-right: 50px;

}  

.about-img img{
	border-top-left-radius: 24%;
    border-bottom-right-radius: 24%;
    margin-left: 82px;

}

.about-content{
	height: 300px;
	width: 900px;
	opacity: inherit;
	margin-left: 80px;
	display: flex;
	justify-content: center;
	align-items: center;


}


.about-content p{
	
	color: white;
	font-size: 17px;
	text-align: center;
	margin-left: -68px;
	margin-left: 140px;
    background-color: black;
    margin-right: 236px;

}
    
}
/*sevices section*/

#services-container{
	position: relative;
	


}
/*#services-container::before{
	position: absolute;
	content: "";
	background: url("../img/bg3.jpg") no-repeat center center/cover;
	height: 100%;
	width:100%;
	z-index: -1;
	opacity: 0.8;
	
}*/

#services{
	display: flex;
	align-items: center;
	justify-content: center;

}
#services .box{
	
	align-items: center;
	justify-content: center;
	border: 2px solid brown;
	height: 335px;
    margin: 36px;
    border-radius:46px;
    width: 270px;
    
	
}
#services .box img{
	height: 150px;
	display: block;
	margin: auto;
	align-items: center;
	justify-content: center;


}
#services .box p{
	text-align: center;

}

/*Contact*/
#contact{
	position: relative;
}

#contact::before{
	content: "";
	position: absolute;
	width: 100%;
	height:100%;
	z-index: -1;
	opacity: 0.7;
	background: url("../img/bg2.jpg") no-repeat center center/cover;

}
#contact-box{
	display: flex;
	justify-content: center;
	align-items: center;
	padding-bottom: 34px;
}
#contact-box input {
	width: 100%;
	padding:0.5rem;
	border-radius: 9px;
	font-size: 1.2rem;
	border: 2px solid black;
}
#contact-box textarea{
	width: 100%;
	padding:0.5rem;
	border-radius: 9px;
	font-size: 1.2rem;
	border: 2px solid black;
}
#contact-box input:hover{
	color: white;
	background-color: #D5B2B2;
	transition-property: all;
	transition-duration: 2s;
	border-top-left-radius: 29px;
	border-bottom-right-radius: 29px;

}
#contact-box textarea:hover{
	color: white;
	background-color: #D5B2B2;
	transition-property: all;
	transition-duration: 2s;
	border-top-left-radius: 29px;
	border-bottom-right-radius: 29px;
}
#contact-box form{
	width: 40%;

}

#contact-box label{
	font-size: 1.3rem;

}
.btn{
	margin-top:10px;
	width: 68px;
	height: 40px;
	font-size: 1rem;
	border: none;
	transition-property: all;
	transition-duration: 1s;
	cursor: pointer;
	font-family: 'Crimson Text', serif;
	border-top-left-radius: 20px;
	border-bottom-right-radius: 20px;
	
	
}

.btn:hover{
	color: white;
	background-color: #210F5B;

}
footer{
	background: black;
	color: white;
	font-size: 1.3rem;
	padding-bottom: 9px;
	padding-top: 9px; 
}
.center{
	text-align: center;
}

/*Utility classes*/
.h-primary{
	font-size: 2.8rem;
	font-family: 'Rowdies', cursive;
	font-family: 'Staatliches', cursive;
	padding: 12px;

}

.h-secondary{
	font-size: 1.6rem;
	text-align: center;
	font-family: 'Crimson Text', serif;
	font-family: 'Rowdies', cursive;
	font-family: 'Staatliches', cursive;
	font-family: 'Yanone Kaffeesatz', sans-serif;
}

