/*：源码地址唯一出处: https://www.17sucai.com*/
@media only screen and (min-width:768px) and (max-width:991px) {
	.bg-gray-responsive {
		padding-top: 120px;
		padding-bottom: 120px;
		background: #f7f7f7
	}

	.top-bar-area .text-right {
		text-align: center;
		display: flex;
		align-content: center;
		justify-content: center
	}

	.top-bar-area .text-right.button-box {
		display: none
	}

	.top-bar-area .item-flex {
		display: flex;
		align-items: center;
		justify-content: center
	}

	.top-bar-area .float-right .info .list li:first-child {
		margin-left: 0
	}

	.about-area .thumb-box {
		padding-left: 15px;
		margin-top: 30px
	}

	.about-area .thumb {
		margin-bottom: 0
	}

	.about-area .thumb .video {
		position: relative;
		left: 50%;
		bottom: 150px;
		height: 300px;
		width: 300px;
		transform: translate(-50%, 0);
		margin-bottom: -150px
	}

	.about-area .thumb-left {
		padding-right: 15px;
		margin-bottom: 30px
	}

	.about-area .experiecne strong {
		line-height: 100px
	}

	.features-area.multi-option {
		padding-top: 120px
	}

	.features-area.multi-option .features-items {
		margin-bottom: 0;
		top: 0;
		padding: 0;
		box-shadow: inherit
	}

	.features-area.multi-option .features-items .single-item {
		margin-bottom: 30px
	}

	.features-area.multi-option .features-items .single-item:last-child {
		margin-bottom: 0
	}

	.features-area .features-items .item {
		box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
		padding: 50px
	}

	.features-area .features-items .single-item.emergency {
		padding: 0;
		margin: 0 15px;
		margin-bottom: 30px
	}

	.work-with-us-area .fun-facts-items {
		margin-top: 30px
	}

	.achivement-area .single-item {
		margin-top: 50px
	}

	.achivement-area .single-item:first-child {
		margin-top: 0
	}

	.achivement-area .single-item::after {
		display: none
	}

	.why-us-area .fixed-thumb {
		position: relative;
		width: 100%;
		min-height: 400px;
		margin-top: -120px;
		margin-bottom: 120px
	}

	.why-us-area .info {
		z-index: 1;
		padding-left: 15px
	}

	.clients-area .clients-items {
		margin-top: 20px
	}

	.clients-area {
		text-align: center
	}

	.projects-area .thumb-box {
		margin-top: 30px
	}

	.projects-area .project-item.projects-carousel .owl-nav .owl-prev,
	.projects-area .project-item.projects-carousel .owl-nav .owl-next {
		left: -50px
	}

	.projects-area .project-item.projects-carousel .owl-nav .owl-next {
		right: -50px;
		left: auto
	}

	.testimonials-area .testimonial-content {
		border-left: 2px solid #ff3514;
		padding-left: 30px;
		margin-top: 30px
	}

	.services-area .services-box .nav-tabs {
		border: 0;
		padding-right: 0;
		border-right: 0;
		text-align: center;
		margin-bottom: 25px
	}

	.services-area .services-box .nav-tabs li a {
		background: #fff
	}

	.services-area .services-box .nav-tabs li a.active {
		background: #ff3514;
		color: #fff
	}

	.services-area .tab-content .thumb {
		margin-top: 30px
	}

	.services-details-area .sidebar {
		padding-left: 15px;
		margin-top: 30px
	}

	.blog-area.left-sidebar .blog-content {
		float: none
	}

	.blog-area .blog-thin-colums .thumb {
		margin-bottom: 30px
	}

	.blog-area.left-sidebar .sidebar,
	.blog-area.right-sidebar .sidebar {
		margin-top: 50px
	}

	.blog-area .blog-items .blog-thin-colums .item {
		padding: 0;
		border: 0
	}

	.blog-area.right-sidebar .sidebar {
		padding-left: 15px
	}

	.blog-area.left-sidebar .sidebar {
		padding-right: 15px
	}

	.blog-area .item .thumb img {
		width: 100%
	}

	.contact-area .contact-items .left-item {
		padding-right: 50px
	}

	.contact-area .contact-items .right-item {
		padding-left: 50px
	}

	.contact-area .contact-items .item i {
		padding-right: 0;
		margin-bottom: 25px
	}

	.contact-area .contact-items .item {
		display: block;
		margin-bottom: 30px;
		padding-bottom: 30px;
		text-align: center
	}

	.faq-area img {
		max-width: 100%;
		left: 0;
		margin-top: 30px
	}

	
}

@media only screen and (max-width:767px) {
	

	.default-padding {
		padding-top: 50px;
		padding-bottom: 50px
	}

	.default-padding.bottom-less {
		padding-bottom: 20px;
		padding-top: 50px
	}

	.portfolio-area.bottom-less {
		padding-bottom: 35px
	}

	.default-padding-bottom {
		padding-bottom: 50px
	}

	.default-padding-top {
		padding-top: 50px
	}

	.site-heading {
		margin-bottom: 30px
	}

	.breadcrumb-area {
		padding: 100px 0
	}

	.default-padding-bottom.bottom-less {
		padding-bottom: 20px
	}

	.breadcrumb-area h1 {
		font-size: 36px
	}

	.bg-gray-responsive {
		padding-top: 50px;
		padding-bottom: 50px;
		background: #f7f7f7
	}

	.top-bar-area {
		display: none
	}

	.attr-nav {
		display: none
	}

	

	.center-responsive {
		text-align: center
	}

	

	.shadow.gradient-light::after {
		background: rgba(0, 0, 0, 0) linear-gradient(to top, rgba(0, 0, 0, 0) 0, rgba(255, 255, 255, 0.65) 100%) repeat scroll 0 0;
		width: 100%
	}

	.about-area .info-content h2 {
		display: block;
		margin-bottom: 15px;
		line-height: 1.3;
		font-size: 26px
	}

	.about-area .info-content h2 strong {
		font-size: 100px;
		line-height: 80px;
		padding-right: 0;
		display: block;
		margin-bottom: 20px
	}

	.about-area .thumb-box {
		padding-left: 15px;
		margin-top: 30px
	}

	.about-area .thumb .video {
		position: relative;
		left: 50%;
		bottom: 100px;
		height: 200px;
		width: 200px;
		transform: translate(-50%, 0);
		margin-bottom: -150px
	}

	.about-area .thumb-left {
		padding-right: 15px;
		margin-bottom: 20px
	}

	.about-area .experiecne strong {
		font-size: 150px;
		line-height: 100px
	}

	.about-area .experiecne::after {
		height: 70%
	}

	.about-area .experiecne h5 {
		font-size: 24px
	}

	.features-area.multi-option {
		padding-top: 50px
	}

	.features-area.multi-option .features-items {
		margin-bottom: 0;
		top: 0;
		padding: 0;
		box-shadow: inherit
	}

	.features-area.multi-option .features-items .single-item {
		margin-bottom: 30px
	}

	.features-area.multi-option .features-items .single-item:last-child {
		margin-bottom: 0
	}

	.features-area .features-items .item {
		box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
		padding: 50px
	}

	.features-area .features-items .single-item.emergency {
		padding: 0;
		margin: 0 15px;
		margin-bottom: 30px
	}

	.work-with-us-area .fun-fact {
		margin-top: 30px
	}

	.achivement-area .single-item {
		margin-top: 50px
	}

	.achivement-area .single-item:first-child {
		margin-top: 0
	}

	.achivement-area .single-item::after {
		display: none
	}

	.why-us-area .fixed-thumb {
		position: relative;
		width: 100%;
		min-height: 300px;
		margin-top: -50px;
		margin-bottom: 50px
	}

	.why-us-area .info {
		z-index: 1;
		padding-left: 15px
	}

	.projects-area .info {
		text-align: center
	}

	.projects-area .info ul li {
		margin-right: 0;
		width: 100%;
		text-align: center
	}

	.projects-area .thumb-box {
		margin-top: 30px
	}

	.services-area.with-thumb .services-items .item .info i {
		left: 50%;
		transform: translate(-50%, 0)
	}

	.services-area.with-thumb .services-items .item .info {
		text-align: center
	}

	.services-area .services-box .nav-tabs {
		border: 0;
		padding-right: 0;
		border-right: 0;
		text-align: center;
		margin-bottom: 25px
	}

	.services-area .services-box .nav-tabs li a {
		background: #fff
	}

	.services-area .services-box .nav-tabs li a.active {
		background: #ff3514;
		color: #fff
	}

	.services-area .tab-content .thumb {
		margin-top: 30px
	}

	.services-details-area .sidebar {
		padding-left: 15px;
		margin-top: 30px
	}

	.clients-area .clients-items {
		margin-top: 20px
	}

	.clients-area {
		text-align: center
	}

	.testimonial-items::after {
		font-size: 60px
	}

	.testimonials-area .testimonial-content {
		padding-left: 25px;
		margin-top: 30px
	}

	.work-process-area .work-pro-items .item {
		text-align: center
	}

	.work-process-area .work-pro-items .item h4 span {
		left: 50%;
		transform: translate(-50%, 0)
	}

	.blog-area .blog-thin-colums .thumb {
		margin-bottom: 30px
	}

	.blog-area .blog-items .footer-meta ul {
		border-top: 0;
		padding-top: 0
	}

	.blog-area .blog-items .footer-meta ul li:first-child {
		display: none
	}

	.blog-area .pagi-area .pagination {
		display: block
	}

	.blog-area .item blockquote .footer p {
		padding-left: 0
	}

	.blog-area .item blockquote .footer p::after {
		display: none
	}

	.blog-area .pagi-area .pagination li {
		display: inline-block;
		margin-top: 5px
	}

	.blog-area .blog-content .post-tags,
	.blog-area .blog-content .share {
		display: block;
		text-align: center
	}

	.blog-area .blog-content .share .social {
		margin-top: 10px
	}

	.blog-area.left-sidebar .blog-content {
		float: none
	}

	.blog-area.left-sidebar .sidebar,
	.blog-area.right-sidebar .sidebar {
		margin-top: 50px;
		overflow: hidden
	}

	.blog-area.right-sidebar .sidebar {
		padding-left: 15px
	}

	.blog-area.left-sidebar .sidebar {
		padding-right: 15px
	}

	.blog-area.single .post-pagi-area {
		text-align: center
	}

	.blog-area.single .post-pagi-area a {
		margin: 5px
	}

	.blog-area.single .post-pagi-area a:last-child {
		float: none
	}

	.comments-list .commen-item.reply {
		margin-left: 0;
		padding-left: 0
	}

	.comments-list .commen-item .content,
	.comments-list .commen-item .avatar {
		display: block;
		text-align: center
	}

	.comments-list .commen-item .content {
		width: 100%
	}

	.comments-list .commen-item .avatar {
		float: none;
		height: 80px;
		width: 80px;
		margin: auto
	}

	.comments-list .commen-item .content .title {
		display: block;
		margin-top: 20px;
		margin-bottom: 10px
	}

	.comments-list .commen-item .content .title span {
		margin: 0;
		padding: 0;
		border: 0;
		display: block;
		margin-top: 15px
	}

	.comments-list .commen-item {
		margin-bottom: 30px;
		border-bottom: 1px solid #e7e7e7;
		padding-bottom: 15px
	}

	.comments-list .commen-item:last-child {
		margin-bottom: 0;
		padding: 0;
		border: 0
	}

	.blog-area .comments-form {
		margin-top: 30px
	}

	.contact-area .contact-items .left-item {
		padding-right: 50px
	}

	.contact-area .contact-items .right-item {
		padding-left: 50px
	}

	.contact-area .contact-items .item i {
		padding-right: 0;
		margin-bottom: 25px
	}

	.contact-area .contact-items .item {
		display: block;
		margin-bottom: 30px;
		padding-bottom: 30px;
		text-align: center
	}

	.faq-area img {
		max-width: 100%;
		left: 0;
		margin-top: 30px
	}

	.faq-area .accordion h4 span {
		display: none
	}

	.accordion .card-header h4::after {
		top: 30px
	}

	.error-page-area .error-box h1 {
		font-size: 250px
	}

	.footer-top {
		padding: 30px 0
	}

	.footer-top .text-left,
	.footer-top .text-right {
		text-align: center !important
	}

	.footer-top.bg-dark .subscribe-form {
		border: 0
	}

	
}

@media only screen and (min-width:767px) {
	.attr-nav {
		display: inline-block
	}
}

@media only screen and (min-width:500px) and (max-width:767px) {
	.projects-area .info ul {
		display: flex;
		justify-content: center
	}

	.projects-area .info ul li {
		width: auto;
		margin-right: 15px;
		margin-left: 15px
	}

	.blog-area .item blockquote .footer p {
		padding-left: 90px
	}

	.blog-area .item blockquote .footer p::after {
		display: inline-block
	}
}

@media only screen and (max-width:400px) {
	.blog-area .item .info .meta ul li:first-child {
		display: none
	}

	.blog-area .social-share {
		display: none
	}

	.faq-area .accordion h4 span {
		display: none
	}
}

@media only screen and (max-width:520px) {
	.blog-area .social-share {
		display: none
	}

	.error-page-area .error-box h1 {
		font-size: 150px
	}
}

@media only screen and (max-width:650px) {
	.owl-carousel .owl-nav {
		display: none !important
	}
}

@media only screen and (min-width:480px) and (max-width:767px) {

	.comments-list .commen-item .content,
	.comments-list .commen-item .avatar {
		display: table-cell;
		text-align: left
	}

	.comments-list .commen-item .content {
		width: auto
	}

	.comments-list .commen-item .avatar {
		float: none;
		height: 80px;
		width: 80px;
		margin: inherit
	}

	.comments-list .commen-item .content .title {
		margin-top: 0
	}

	.comments-list .commen-item .content {
		padding-left: 25px
	}

	.comments-list .commen-item .content .title {
		margin-top: 0
	}

	.blog-area.single .post-pagi-area {
		text-align: inherit
	}

	.blog-area.single .post-pagi-area a:last-child {
		float: right
	}
}

