
/* common code start */
@keyframes background{
	from{
		background: #18FFBA;
	}
	to{
		background: #78F78B;
	}
}
@keyframes rotate{
	0%{
		transform: rotate(0deg);
	}
	100%{
		transform: rotate(360deg);
	}
}
body{
	margin: 0px;
}
.container{
	width: 87%;
	margin: 0px auto;
}
html {
  scroll-behavior: smooth;
}
.d-flex{
	display: flex;
}
ul{
	margin: 0px;
	padding: 0px;
}
ul li{
	list-style: none;
}
a{
	display: inline-block;
	text-decoration: none;
}
/* common code end */
/* nav section start */
#navbar-section{
	animation: background 2s linear infinite alternate;
	position: sticky;
	top:0px;
	z-index:99999;
}
.navbar{
	flex-direction: row;
	justify-content: space-between;
	padding: 20px 0px;
}
.navbar-brand{
	color: rgba(0, 0, 0, 0.9);
	font-size: 34px;
	font-weight: 600;
	font-family: "Segoe UI", sans-serif;
}
.navbar-nav{
	flex-direction: row;
	align-items: center;
}
.navbar-nav li a{
	color: rgba(0, 0, 0, 1);
	font-size: 16px;
	font-weight: 500;
	font-family: "Segoe UI", sans-serif;
	padding: 0px 20px;
	margin: 0px 0px 0px 10px;
	transition: .3s;
}
.navbar-nav li a:hover{
	color: #F7783C;
}
.navbar-nav li a.active{
	color: #F7783C;
}
.navbar-nav li:last-child a{
	padding: 0px 0px 0px 20px;
}
/* nav section end */

/* header section start */
#header-section{
	animation: background 2s linear infinite alternate;
}
#header-section section{
	padding-bottom: 50px;
}
.header-content{
	width: 100%;
	padding: 80px 0px 80px 0px;
}
.header-content h2{
	color: #060606;
	font-size: 72px;
	font-weight: 700;
	font-family: "Segoe UI", sans-serif;
	margin: 0px;
}
.header-content h3{
	color: #060606;
	font-size: 72px;
	font-weight: 100;
	line-height: 1;
	font-family: "Segoe UI", sans-serif;
	margin: 0px;
}
.header-content p{
	color: #060606;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.5;
	font-family: "Segoe UI", sans-serif;
	margin: 40px 0px;
	max-width: 550px;
}
.header-content a{
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	font-family: "Segoe UI", sans-serif;
	
	background: #F7783C;
	padding: 10px 30px;
	border-radius: 20px;

	transition: .5s;
}
.header-content a:hover{
	background: #0ABF53;
}
.header-poster{
	width: 60%;
	align-items: center;
	overflow: hidden;
}
.header-poster img{
	width: 100%;
	display: block;
	animation: rotate 8s infinite linear;
}
/* header section end */

/* about section start */
#about-section{
	background: #fff;
}
.about-poster{
	width: 100%;
	position: relative;
	padding: 80px 0px;
}
.about-poster img{
	border: 5px solid #fff;
	border-radius: 5px;
}
.about-poster img:last-child{
	position: absolute;
	left: 30%;
    top: 20%;
}
.about-content{
	width: 100%;
	padding: 80px 0px;
}
.about-content h4{
	color: #060606;
	font-size: 28px;
	font-weight: 100;
	font-family: "Segoe UI", sans-serif;
	margin: 0px;
}
.about-content h2{
	color: #060606;
	font-size: 45px;
	font-weight: 700;
	font-family: "Segoe UI", sans-serif;
	margin: 0px;
}
.about-content h2 span{
	color: #F7783C;
}
.about-content q{
	color: #060606;
	font-size: 18px;
	font-weight: 500;
	font-style: italic;
	line-height: 1.5;
	font-family: "Segoe UI", sans-serif;
	display: block;
	margin: 30px 0px;
}
.about-content p{
	color: #060606;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	font-family: "Segoe UI", sans-serif;
	margin: 0px 0px 50px 0px;
}
/* about section end */

/* popular section start */
#popular-section{
	background: #f7f4f4;
	padding: 80px 0px;
}
.title{
	text-align: center;
	padding: 0px 0px 50px 0px;
}
.title h3{
	color: #060606;
	font-size: 45px;
	font-weight: 700;
	font-family: "Segoe UI", sans-serif;
	margin: 0px;
}
.title h3 span{
	color: #F7783C;
	font-weight: 500;
}
#popular-section .card {
	width: 100%;
	padding: 60px 40px;
	background: #fff;
	border-radius: 5px;
	margin: 0px 10px;
	position: relative;
	
	overflow: hidden;
}
#popular-section .card::before{
	content: '';
    width: 300px;
    height: 170px;
	background: rgb(0 169 90 / 44%);
    position: absolute;
    top: -10%;
    left: -28%;
    transform: rotate(50deg);
    border-radius: 50%;
	transition: .5s linear;
}
#popular-section .card:hover::before{
	background: #f7783c;
}
#popular-section .card img{
	display: block;
	border: 12px solid #fff;
	border-radius: 50%;
	position: relative;
}
#popular-section .card a{
	color: #060606;
	font-size: 26px;
	font-weight: 700;
	font-family: "Segoe UI", sans-serif;
	display: block;
	margin: 20px 0px;
	transition: .3s;
}
#popular-section .card a:hover{
	color: #f7783c;
}
#popular-section .card p{
	color: #060606;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	font-family: "Segoe UI", sans-serif;
	margin: 0px;
	
}
#popular-section .card p::after{	
	content: '';
    width: 80px;
    height: 80px;
    background: #f7783c;
	
    position: absolute;
	bottom: -47px;
    right: -32px;
    transform: rotate(53deg);
	opacity: 0;
	transition: .5s linear;
}
#popular-section .card:hover p::after{
	opacity: 1;
}
/* popular section end */
/* Restaurants section start */
#restaurants-menu-section{
	
	background:url(../images/img1.png) no-repeat right,linear-gradient(to right, #1AFFBC,#71FFB0
	);
	padding:80px 0px;
}
#restaurants-menu-section .title{
	text-align:left;
	padding:0px 0px 50px 0px;
}
#restaurants-menu-section p{
	color: #060606;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	text-align:justify;
	font-family: "Segoe UI", sans-serif;
	margin: 0px 30px 0px 0px;
	max-width:400px;
	
	
}
#restaurants-menu-section a{
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	text-align:justify;
	font-family: "Segoe UI", sans-serif;
	background:#F7783C;
	padding:10px 30px;
	border-radius:20px;
	margin-top: 40px;
	transition:.5s;
	
	
}
#restaurants-menu-section a:hover{
	background:#0ABF53;
	border:1px solid red;
	
	
}

/* Restaurants section  end */
/*features section start */
#features-section{
	padding:80px 0px;
}
#features-section section{
	flex-wrap:wrap;
}
#features-section .card{
	flex: 1 1 20%;
	padding:30px;
	margin:0px 20px 40px 20px;
	border:1px solid red;
	transition:.2s linear;
	border-radius:20px;
}
#features-section .card:hover{
	
	border:1px solid teal;
	
}
#features-section .card:hover i,
#features-section .card:hover h4{
	
	color:#0ABF53;
}
#features-section .card-icon{
	width:10%;
	margin-right:10px;
}
#features-section .card-icon i{
	color:#F7783C;
	font-size:40px;
	transition:.2s linear;
}
#features-section .card-content{
	width:90%;	
}

#features-section .card-icon p{
	color:#060606;
	font-size:16px;
	font-weight:400;
	line-height:1.5;
	font-family: "Segoe UI", sans-serif;
	margin:0px 0px 0px 0px;
	
}

/* features section end */
/* meet section start */
#meet-section{
	background: #f7f4f4;
	padding: 80px 0px;
}
#meet-section .meet-content{
	width:50%;

}
#meet-section .meet-poster{
	width:50%;
	
}
#meet-section .meet-content span{
	color: #F7783C;
	font-weight: 500;
}
#meet-section .meet-content h1{
	color: #060606;
	font-size:45px;
	font-weight: 700;
	font-family: "Segoe UI", sans-serif;
	text-align:start;

}
#meet-section .meet-content p{
	color: #060606;
	font-size:16px;
	font-weight: 400;
	font-family: "Segoe UI", sans-serif;
	text-align:start;

}
#meet-section .meet-content a{
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	text-align:justify;
	font-family: "Segoe UI", sans-serif;
	background:#F7783C;
	padding:10px 30px;
	border-radius:20px;
	margin-top: 40px;
	transition:.5s;
}


#meet-section .meet-content a:hover{
	background:#0ABF53;
	border:1px solid red;
	
	
}
#meet-section .meet-poster img{
	width:70%;
	margin:0px 0px 0px 178px;
	
}
/* meet section end */
/* footer section start */
#footer-section{
	background: #A9A9A9;
	padding: 80px 0px;
}
#footer-section h1{
	color:#rgb(6, 6, 6);
	font-size:45px;
	font-weight:700;
	line-height:55px;
	text-align:center;
	font-family: "Segoe UI", sans-serif;
}
#footer-section .input-section{
	justify-content:center;
	
}
#footer-section .input-section input{
	width:40%;
	background:#fff;
	padding:22px 20px;
	font-size:17px;
	border-radius:30px 0 0 30px;
	border:2px solid #C2DBFE;	
}

#footer-section .input-section a{
	background:#F7783C;
	border-radius:0 30px 30px 0px;
	padding:10px;
	transition:.2s;
		
}
#footer-section .input-section a:hover{
	background:#0ABF53;
			
}
#footer-section .footer-about{
	width:25%;
	padding:20px;
	border:1px solid red;
}
#footer-section .footer-contact-info{
	width:25%;
	padding:20px;
	border:1px solid red;
}
#footer-section .footer-quick-link{
	width:25%;
	padding:20px;
	border:1px solid red;
}
#footer-section .footer-help-support{
	width:25%;
	padding:20px;
	border:1px solid red;
}
#footer-section .footer-about h3 {
	color:#060606;
	font-size:18px;
	font-weight:700;
	font-family: "Segoe UI", sans-serif;
	text-transform:uppercase;
	text-align:start;			
}
#footer-section .footer-about p{
	color:#060606;
	font-size:16px;
	font-weight:400;
	font-family: "Open Sans",sans-serif;
	text-align:start;
	
}
#footer-section .social-icon .fa-facebook,
.fa-linkedin,.fa-twitter,.fa-google,.fa-instagram{
	background:#F7BAC5;
	padding:6px;
	border-radius:50%;
	transition:.5s;
}
#footer-section .social-icon:hover .fa-facebook:hover,
.fa-linkedin:hover,.fa-twitter:hover,.fa-google:hover,.fa-instagram:hover{
	background:#D78C43;
}

/* footer section end */
