@media (min-width: 992px) {
	.mobile-menu{
		display: none;
	}
	.menu ul{
		display: block !important;
	}
 
}
@media (max-width: 991px) {
	.logo {
		float: left;
		padding: 10px 0px;
	}
	.mobile-menu {
		float: right;
	}
	.menu{
		text-align: left;
	}
	.menu ul{
		display: none;
	}
	.menu ul li {
		display: block;
		padding: 3px 0px;
		width: 100%;
	}
	.mobile-menu i {
		line-height: 1;
		padding: 7px 10px;
		display: block;
		border: 2px solid #333;
		cursor: pointer;
		margin-top: 10px;
	}
	.menu ul li a {
		display: block;
	}
	.about-info {
		margin-top: 30px;
	}
 
}
@media (max-width: 767px) {
	.header-top {
		display: none;
	}
	.about-area, .testimonial-area, .contact-area{
		padding: 70px 0px;
	}
	.services-area, .portfolio-area, .counter-area, .blog-area{
		padding-bottom: 40px;
		padding-top: 70px;
	}
}
@media (max-width: 576px) {
	.hero-area {
		padding-top: 120px;
		padding-bottom: 70px;
	}
	.about-area, .testimonial-area, .contact-area{
		padding: 50px 0px;
	}
	.services-area, .portfolio-area, .counter-area, .blog-area{
		padding-bottom: 20px;
		padding-top: 50px;
	}
	.footer-top {
		padding-top: 50px;
		padding-bottom: 20px;
	}
 
}
@media (max-width: 460px) {
	.hero-caption h2 {
		font-size: 28px;
	}
	.hero-caption h4 {
		font-size: 20px;
	}
	.button-1 {
		padding: 12px 30px;
	}
	.button-2 {
		padding: 10px 28px;
	}
	.about-info h2 {
		font-size: 24px;
	}
 
}
@media (max-width: 360px) {
	.hero-btn .button-1:first-child {
		margin-right: 0px;
		margin-bottom: 10px;
	}
	.about-info h2 {
		font-size: 22px;
	}
 
}