/*
Iqbal Professional Corporation, Chartered Professional Accountant | Toronto, ON

		CONTENT
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
1. IMPORT
2. BASE STYLE
3. UTILITIES
4. HEADER AND NAVBAR
5. HOME PAGE MAIN SLIDER
6. SLIDER-CAROUSEL AND MOBILE
7. INTRODUCTION AND WORK EXPERIENCE
8. SERVICE INTRODUCTIONS
9. CONFIDENT AND COMMITMENT
10.CUSTOMER FEEDBACK AND QUOTATION
11.ABOUT US CONTENT
12.ABOUT US CUSTOMER FEEDBACK
13.SERVICES CONTENT
14.SERVICES HELPFUL TIPS AND LINKS
15.HELP & TIPS PAGE
16.CONTACT FORM 
17.CONTACT INFO
18.DIRECTION AND MAP
19.FOOTER
20.MEDIA QUERY
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
*/

/*
==================================================
1. IMPORT SECTION
==================================================*/
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&family=Open+Sans:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Arima:wght@300;400;500&family=Nunito:wght@200;300;400;600;700&display=swap'); /*font-family: 'Arima', cursive;*/

/*
==================================================
2. BASE STYLE
==================================================*/
:root {
	--bdg-primary: #F5F8FA;
	--header-bdg-primary: #020223;
	--header-bdg-secondary: #0B1246;
	--footer-bdg: #1f1d1d;
	--text-bdg-primary: #7bcb2a;
	--text-primary: #555555;
	--text-secondary: #eaeaf5;
	--contact-icon: #f9972b;
}
*, *::before, *::after {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	outline: none;
	border:none;
	text-decoration: none;
	transition: all .2s linear;
}
html, body {
	font-family: 'Lato', sans-serif;
	font-size: 16px;
	color: var(--text-primary);
	width: 100%;
	max-width: 1400px;
	height: 100%;
	margin: 0 auto;
	line-height: 1.6;
	background-color: var(--bdg-primary);
}

ul {
	list-style: none;
}
a {
	text-decoration: none;
	color: inherit;
}
h1, h2, h3, h4, h5, h6 {
	padding: 0;
	margin: 0;
}
p{
	margin: 10px 0;
}
i {
	color: var(--contact-icon);
}
img {
	width: 100%;
	max-width: 100%;
	height: auto;
	text-align:center;
}

.space {
	width: 100%;
	height: 2000px;
	background-color: grey;
}

/* text */
.lead{font-size: 20px;} .sm{font-size: 1rem;} .md{font-size: 2rem;} .lg{font-size: 3rem;} .xl{font-size: 4rem;} .xxl{font-size: 5rem;} .xxxl{font-size: 6rem;}
.text-center {text-align: center;}

/* margin */
.m-1{margin: 1rem;} .m-2{margin: 1.5rem;} .m-3{margin: 2rem;} .m-4{margin: 3rem;} .m-5{margin: 4rem;}.m-6{margin: 5rem;}.m-7{margin: 6rem;}
.my-1{margin: 1rem 0;} .my-2{margin: 1.5rem 0;} .my-3{margin: 2rem 0;} .my-4{margin: 3rem 0;} .my-5{margin: 4rem 0;}.my-6{margin: 5rem 0;}.my-7{margin: 6rem 0;}
.mx-1{margin: 0 1rem;} .mx-2{margin: 0 1.5rem;} .mx-3{margin: 0 2rem;} .mx-4{margin: 0 3rem;} .mx-5{margin: 0 4rem;} .mx-6{margin: 0 5rem;} .mx-7{margin: 0 6rem;}

/* padding */
.p-1{padding: 1rem;} .p-2{padding: 1.5rem;} .p-3{padding: 2rem;} .p-4{padding: 3rem;} .p-5{padding: 4rem;} .p-6{padding: 5rem;} .p-7{padding: 6rem;}
.py-1{padding: 1rem 0;} .py-2{padding: 1.5rem 0;} .py-3{padding: 2rem 0;} .py-4{padding: 3rem 0;} .py-5 {padding: 4rem 0;} .py-6 {padding: 5rem 0;} .py-7 {padding: 6rem 0;}
.px-1{padding: 0 1rem;} .px-2{padding: 0 1.5rem;} .px-3{padding: 0 2rem;} .px-4{padding: 0 3rem;} .px-5 {padding: 0 4rem;} .px-6 {padding: 0 5rem;} .px-7 {padding: 0 6rem;}

/*
==================================================
3. UTILITIES
==================================================*/
.container {
	width: 100%;
	max-width: 1150px;
	margin: 0 auto;
}
.containers {
	width: 95%;
	max-width: 1150px;
	margin: 0 auto;
}
.flex {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
}
.grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 20px;
	justify-content: center;
	align-items: center;
	height: 100%;
}
.grid-3 {
	grid-template-columns: repeat(3, 1fr);
}
.card {
	background-color: #fff;
	color: #333;
	border-radius: 10px;
	box-shadow: 0 3px 10px rgba(0,0,0,0.2);
	padding: 20px;
	margin: 10px;
}
.btn {
	display: inline-block;
	padding: 10px 30px;
	cursor: pointer;
	background: var(--primary-color);
	color: #fff;
	border: none;
	border-radius: 5px;
}
.btn-outline {
	background-color: transparent;
	border: 1px #fff solid;
}
.btn:hover {
	transform: scale(0.98 );
}

/* -- scrolling button -- */
.scroll-to-top-link {
		position:fixed;
		width: 50px;
		right: 3%;
		bottom: 5%;
		cursor:pointer;
		display:none;
		z-index: 1;
}

/* -- heading for other pages-- */
.sub_head {
	margin-top: 150px;
	height: 250px;
	width: 100%;
	background: linear-gradient(to right, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.9)), url('image/head_background.jpg') no-repeat center center/cover;
}
.sub_head h1 {
	padding: 80px 0 0 30px;
	font-size: 3rem;
	opacity: 1;
	color: var(--text-secondary);
}

/*
==================================================
4. HEADER AND NAVBAR
==================================================*/
#head {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 80px;
	color: var(--text-secondary);
	background:var(--header-bdg-primary);
	z-index: 1000;
}

#head .head_flex{
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 100%;
}
#head .name_logo {
	font-family: "Times New Roman", Times, serif;
	line-height: 1.2;
}
#head .name_logo span {
	font-size: 25px;
}
#head .name_logo h3 {
	font-size: 20px;
}

#head .nav_bar .contact_top {
	text-align: right;
	margin-top: 5px;
}
#head .nav_bar .contact_top a {
	border: none;
}
#head .nav_bar .contact_top i{
	margin-right: 5px;
	font-size: 1.3rem;
}

#head .nav_bar ul {
	display: flex;
	
}
#head .nav_bar a {
	color: #fff;
	margin: 0 .2rem;
	padding: 5px 10px;
}
#head .nav_bar li a:hover {
	border-bottom: 2px solid #fff;
	padding-bottom: 4px;
	transition: none;
}
#head a {
	text-decoration: none;
	color: inherit;
}
#head .nav_bar ul {
	margin-top: 5px;
}

.current {
	border-bottom: 2px solid #fff;
	padding-bottom: 4px;
}

#menu_bar {
	color: #fff;
	border-radius: .5rem;
	font-size: 2rem;
	padding: .5rem 1.2rem;
	cursor: pointer;
	display: none;
}

/*
==================================================
5. HOME PAGE MAIN SLIDER
==================================================*/
#slider {
	height: 100vh;
	width: 100%;
	position: relative;
	padding-top: 10px;
}

.carousel-caption {
	top: 40%;
	transform: translateY(-50%);
	bottom: initial;
	background-color: rgba(0,0,0,0.4);
	max-width: 600px;
	height: 150px;
	position: absolute;
	display: block;
	margin-left: auto;
	margin-right: auto;
	border-radius: 5px;
}
.carousel-item {
	height: 100vh;
	min-height: 300px;

}
.banner-1, .banner-2, .banner-3, .banner-4, .banner-5  {
	-webkit-background-size: cover;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	height: 100vh;
}
.banner-1 {background-image: url(image/img_1200x600-1.jpg);}
.banner-2 {background-image: url(image/img_1200x600-2.jpg);}
.banner-3 {background-image: url(image/img_1200x600-3.jpg);}
.banner-4 {background-image: url(image/img_1200x600-4.jpg);}
.banner-5 {background-image: url(image/img_1200x600-5.jpg);}


/*
==================================================
6. SLIDER-SERVICE CAROUSEL AND SLIDER MOBILE
==================================================*/
.slide_bottom {
	height: 80px;
	width: 100%;
	background-color: #ccc;
	position: absolute;
	bottom: -5px;
	opacity: .7;
	z-index: 500;
	text-align: center;
	justify-content: center;
	align-items: center;

}

/*
==================================================
7. INTRODUCTION AND WORK EXPERIENCE
==================================================*/
.intro {
	max-width: 1000px;
	text-align: center;
	font-family: 'Arima', cursive;
	margin: 0 auto;
}

/* -- working experience -- */
.experience .grid {
	grid-gap: 0px;
}
.experience .container {
	line-height: 1;
	background-color: var(--header-bdg-secondary);
}
.experience .container div {
	padding: 50px 0 50px 30%;
}
.experience h1 {
	color: #fff;
	font-family: 'arial', sans-serif;
	font-size: 40px;
	font-weight: bold;
}
.experience p {
	color: var(--text-bdg-primary);
	font-size: 1.8rem;
	font-weight: bold;
}

/*
==================================================
8. SERVICE INTRODUCTIONS
==================================================*/
.services {
	margin: 6rem 0 5rem 0;
	color: #555;
	font-weight: 300;
}
.services h1 {
	text-align: center;
	font-family: 'Arima', cursive;
	font-size: 2rem;
	margin-bottom: 6rem;
}
.services .service {
	width: 400px;
	height: 400px;
	margin: auto;
	text-align: center;
}
.services .grid {
	grid-column-gap: 30px;
	grid-row-gap: 50px;
}
.services .container {
	width: 70%;
}
.services .service {
	text-align: center;

}
.services .card {
	background-color: var(--bdg-primary);
	text-align: center;
}
.services .card:hover {
	background-color: #fff;
}
.services .service .read {
	margin-top: 2rem;
	
}
.services .service p {
	margin-bottom: 30px;
}
.services .service a {
	border: 1px solid #ccc;
	text-decoration: none;
	color: inherit;
	
	text-align: center;
	border-radius: 3px;
	padding: 5px 15px;
}
.services .service a:hover {
	background-color: #EDE9EC;
}

/*
==================================================
9. CONFIDENT AND COMMITMENT
==================================================*/
/* -- feel confident -- */
.feel_confident {
	margin-top: 8rem;
}
.feel_confident img {
	width: 550px;
	text-align: center;
}

/* -- commitment -- */
.commitment {
	margin-top: 6rem;
}
.commitment .container {
	background-color: var(--text-bdg-primary);
	padding: 2.5rem 0 2.5rem 6%;
	color: #fff;
	font-weight: 700;
}
.commitment .container p {
	padding: 0 10%;
}

/*
==================================================
10.CUSTOMER FEEDBACK AND QUOTATION
==================================================*/
/*-- customer feedback -- */
.customer {
	margin: 5rem 0 0 3rem;
}
.customer .review_title img {
	width: 100px;
	height: auto;
	margin-right: 20px;
}
.customer .slider .inner {
	position: relative;
	padding: 1.6rem 20%;
	text-align: center;
	cursor: grab;
}
.customer .slider .excert {
	font-size: 17px;
	color: #555;
}

.slider .slick-dots li button:before {
	font-size: 16px;
	color: #e2e0dd;
	opacity: 1;
}
.slider .slick-dots li.slick-active button:before {
	opacity: 1;
	color: blue;
}
.slider .slick-dots li {
	margin: 0 3px;
}

/* -- quotation -- */
.quotation {
	margin-top: 6rem;
}
.quotation .container {
	width: 60%;
}
.quotation .quote {
	text-align: center;
	line-height: 1;
	padding: .8rem;
	border-radius: 5px;
	border: solid 1px #fff;
	color: #454444;
	background-color: #FEFACC;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	background: linear-gradient(132deg, #F8E60F, #fff);
	background-size: 400% 400%;
	animation: BackgroundGradient 10s ease infinite;
}
@keyframes BackgroundGradient {
	0% {background-position: 0% 50%;}
	50% {background-position: 100% 50%;}
	100% {background-position: 0% 50%;}
}
/*
==================================================
              END HOME PAGE
==================================================*/

/*
==================================================
11.ABOUT US CONTENT
==================================================*/
.about_content .grid{
	grid-template-columns: 60% 30%;
	align-items: flex-start;
	grid-column-gap: 60px;
}
.about_content .card {
	background-color: transparent;
	padding: 30px;
	font-weight: 300;
	border-radius: 3px;
}
.about_content h4 {
	text-align:
}

/*
==================================================
12.ABOUT US CUSTOMER FEEDBACK
==================================================*/
#scroll {
	width:100%;
	height:550px;
	font: 14px/20px Arial, San-serif;
	color: #555;
}
#scroll h3 {
	text-align: center;
	padding:10px 20px 10px 0px;
	font-family:Arial, San-serif;
	color: #555;
}
#scroll li {
	max-width:300px;
	padding: 40px 20px 40px 20px;
	margin: 0 auto;
	border-bottom: 1px solid #fff;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
	background: #D1D0D1;
	}
#scroll #news{
	border-top: 1px solid #fff;
	max-width:300px;
	margin: 0 auto;
}
.customer_name_about {
	float: right;
	padding-right: 10px;
}
/*
==================================================
              END ABOUT US PAGE
==================================================*/

/*
==================================================
13.SERVICES CONTENT
==================================================*/
.service_doc .grid {
	grid-template-columns: 65% 30%;
	align-items: flex-start;
	grid-column-gap: 50px;
}

.service_doc .service_content h2 {
	background: linear-gradient(to right, rgba( 49, 49, 53, 1), rgba(0, 0, 0, 0)) ;
	color: #fff;
	width: 380px;
	padding: 3px 0 3px 10px;
	border-radius: 3px;
	margin-bottom: 1rem;
}
.service_doc .service_content ul {
	list-style: disc;
	padding-left: 40px;
}
.service_doc .service_content .box {
	margin-bottom: 80px;
}

/*
==================================================
14.SERVICES HELPFUL TIPS AND LINKS 
==================================================*/
.service_doc .help_link {
	margin-top: 5rem;
}
.service_doc .help_link h3 {
	margin-bottom: 10px;
	padding-left: 10px;
}

.service_doc .help_link a {
	display: block;
	padding: 8px 10px;
	border-bottom: 1px solid #CBCBCF;
}
.service_doc .help_link a:nth-child(2) {
	border-top: 1px solid #CBCBCF;
}
.service_doc .help_link a:hover {
	background-color: var(--text-secondary);
	border-bottom: 1px solid grey;
}
.service_doc .help_link .box {
	margin-bottom: 5rem;
}
/*
==================================================
              END SERVICES PAGE
==================================================*/

/*
==================================================
15.HELP & TIPS PAGE 
==================================================*/
.help_tips .grid {
	grid-template-columns: 30% 70%;
	align-items: flex-start;
	grid-column-gap: 0px;
}
.help_tips .container {
	width: 100%;
}
.help_tips .left_content {
	background-color: #EDEEF0;
	height: 800px;
}
.help_tips .right_content {
	background-color: #EDEEF0;
	height: 1650px;
}

.help_tips_2nd {
	margin-top: 4rem;
	width: 100%;
	display: none;
}
.help_tips_2nd .title {
	color: #eaeaf5;
	background: #0B1246;
	/*width: 90%;*/
	padding: 25px 0;
	border-radius: 3px;
	text-align: center;
	margin-bottom: 1.5rem;
}
.help_tips_2nd .help_content {
	margin-top: 5rem;
}
/*
==================================================
              END HELP & TIPS PAGE 
==================================================*/

/*
==================================================
16.CONTACT FORM 
==================================================*/
.contact .grid{
	grid-template-columns: 60% 30%;
	align-items: flex-start;
	grid-column-gap: 60px;
}
.contact .contact_form {
	width: 80%;
	margin: auto;
	background-color: #4D4D4F;
	border-radius: 3px;
}
.contact .contact_form h2 {
	padding: 30px 10px;
	text-align: center;
	color: #fff;
}
.contact #feedback {
	width: 85%;
	margin: auto;
}
.contact .form_fld {
	width: 100%;
	margin: 10px 0;
}
.contact label {
	color: #fff;
}
.contact label, input, textarea {
	width: 100%;
	padding: 5px;
}
.contact input {
	padding: 10px;
	border-radius: 3px;
}
.form_fld input[type="submit"] {
	cursor:pointer;
	border:none;
	background:#737475;
	color:#fff;
	margin:20px 0;
	padding:10px;
	font-size:18px;
}
.form_fld input[type="submit"]:hover {
	background:#1B1B1D;
	-webkit-transition:background 0.3s ease-in-out;
	-moz-transition:background 0.3s ease-in-out;
	transition:background-color 0.3s ease-in-out;
	color: #fff;
}
#response {
	height:auto;
	font-size: 16px;
	line-height:1.3;
	text-align:center;
}
.error {
	color: red;
	width: 80%;
	background-color: #DCDCE0;
	border: 2px solid red;
	font-size: 12px;
	font-weight: 400;
	margin: auto;
	padding: 5px 10px;
	border-radius: 5px;
}
.processing {
	color: green;
	border: 2px solid green;
	width: 80%;
	background-color: #DCDCE0;
	font-size: 16px;
	font-weight: 400;
	padding: 10px;
	border-radius: 5px;
	margin: auto;
}

/*
==================================================
17.CONTACT INFO
==================================================*/
.contact_info {
	margin-top: 2rem;
}
.contact_info .info_box {
	display: flex;
	align-items: flex-start;
	margin-bottom: 30px;
}
.contact_info .info_box h2 {
	margin-right: 30px;
	padding: 0;
}
.contact_info .details {
	padding-top: 6px;
}
.contact_info .info_box h4, .contact_info .info_box p {
	line-height: 1.2rem;
}

/*
==================================================
18.DIRECTION AND MAP
==================================================*/
.map {
	width: 100%;
}
.contact_map {
	width: 100%;
	height:600px;
}
.contact_map_mb {
	margin: 0 auto;
	text-align: center;
	display: none;
}
/*
==================================================
              END CONTACT PAGE 
==================================================*/

/*
==================================================
19.FOOTER
==================================================*/
#footer {
	width: 100%;
	padding: 60px 120px;
	margin-top: 7rem;
	color: var(--text-secondary);
	background:var(--footer-bdg);
	color: #9F9E9D;
}
#footer .flex {
	justify-content: space-between;
	align-items: flex-start;
}
#footer .footer_contact_info {
	display: flex;
}
#footer .footer_left .f_home {
	font-size: 22px;
	}
#footer .footer_contact_info h2, footer .footer_contact_info h3 {
	margin: 3px 20px 0 0;
}
#footer .footer_contact_info p {
	font-size: .8rem;
	font-weight: 400;

}
#footer .footer_direction {
	font-size: .8rem;
	color: var(--contact-icon);
}

#footer a {
	text-decoration: none;
	color: inherit;
}
#footer a:hover {
	opacity: .8;
}

#footer .footer_right{
	text-align: center;
	font-size: .9rem;
}
#footer .footer_right a:hover{
	color: #fff;
}

#footer .footer_notes {
	margin-top: 40px;
	text-align: center;
	font-size: .8rem;
	color: #7B7979;
	padding: 1.5rem;
}

/*
==================================================
20.MEDIA QUERY
==================================================*/
@media (max-width: 1000px) {
	#head .container {
		width: 95% !important;
		padding: 0;
	}
	.customer .container {
		width: 80%;
	}
	.customer {
		margin: 5rem 0 0 2rem;
	}
	.quotation {
		margin-top: 5rem;
	}
}

@media (max-width: 900px) {
	#head .containers {
		width: 98%;
	}
	#head .name_logo {
		font-size: .8rem;
	}
	.name_logo span {
		font-size: 1.3rem;
	}
	#head .nav_bar a {
		margin: 0 .08rem;
	padding: 5px;
	}

	.customer {
		margin: 4rem 0 0 1rem;
	}
	.customer .slider .inner {
		padding: 1.6rem 15%;
	}
	.quotation {
		margin-top: 4rem;
	}
	.quotation .container {
		width: 70%;
	}
	#footer {
		padding: 60px 30px;
	}
}

@media (max-width: 768px) {
	#menu_bar {
		display: initial;
	}
	.contact_top {
		display: none;
	}
	.nav_bar ul {
		margin-top: 0px;

	}

	#head .nav_bar ul {
		flex-direction: column;

	}
	#head .nav_bar {
		position: absolute;
		top: 100%;
		right: 0;
		left: 0;
		background: #333;
		border-top: .1rem solid rgba(255, 255, 255, .2);
		padding: .8rem 2rem .8rem .8rem;
		clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);

	}
	#head .nav_bar.active {
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	}
	#head .nav_bar a {
		display: block;
		border-radius: .2rem;
		padding: .5rem 0;
		margin: .3rem 0;
		background: #222;
		text-align: center;
		border: 1px solid #555;
	}
	#head .nav_bar li:hover a {
		/*border: 1px solid #666;*/
	}
	#head .nav_bar li:hover a, .current {
		border-bottom: none;
	}
	.intro {
		padding:  0;
	}
	.experience .grid, 
	.services .grid, 
	.feel_confident .grid,
	.about_content .grid,
	.service_doc .grid,
	.contact .grid {
		grid-template-columns: 1fr;
	}
	.experience .container div {
		padding: 25px 0 25px 30%;
	}
	.services {
		margin: 4rem 0 1rem 0;
	}
	.services h1 {
		margin-bottom: 1rem;
	}

	.feel_confident img {
		width: 100%;
		margin-bottom: 3rem;
	}
	.experience .container, .commitment .container {
		width: 100%;
	}
	.customer .container {
		width: 90%;
	}
	.customer {
		margin: 3rem 0 0 0rem;
	}
	.customer .slider .inner {
		padding: 1.6rem 10%;
	}

	.quotation {
		margin-top: 3rem;
	}
	.quotation .container {
		width: 80%;
	}

	.service_doc .box {
		margin-bottom: 50px;
	}
	.service_doc .help_link {
		margin-top: 0rem;
	}

	.help_tips {
		display: none;
	}
	.help_tips_2nd {
		display: block;
	}

	.contact .contact_form {
		width: 100%;
	}
	.contact .contact_info {
		margin-left: 30px;
	}
}


@media (max-width: 600px) {
	.container {
		width: 98%;
	}
	#head .name_logo span {
	font-size: 20px;
	}
	#head .name_logo h3 {
	font-size: 16px;
	}

	.customer .grid {
	grid-template-columns: 1fr;
	}
	.customer img {
		display: none;
	}
	.quotation .container {
		width: 90%;
	}
	.contact_map {
		display: none;
	}
	.contact_map_mb {
		display: block;
	}
}

@media (max-width: 500px) {
	#head .name_logo span {
		font-size: 16px;
	}
	#head .name_logo h3 {
		font-size: 13px;
	}

	.carousel-caption {
		height: 100px;
	}
	.banner-1 {background-image: url(image/slide_mb-1.jpg);}
	.banner-2 {background-image: url(image/slide_mb-2.jpg);}
	.banner-3 {background-image: url(image/slide_mb-3.jpg);}
	.banner-4 {background-image: url(image/slide_mb-4.jpg);}
	.banner-5 {background-image: url(image/slide_mb-5.jpg);}
	
	.carousel-caption h1{
		font-size: 20px;
	}

	.slide_bottom {
		display: none;
	}

	.feel_confident {
		margin-top: 6rem;
	}
	.commitment {
		margin-top: 4rem;
	}
	.services .service {
		width: 350px;
	}
	.quotation .quote {
		padding: .4rem;
	}
	.service_doc .service_content h2 {
		font-size: 1.1rem;
		width: 200px;
	}
	.service_doc .service_content .box {
		margin-bottom: 50px;
	}
	.service_doc .help_link .box {
		margin-bottom: 4rem;
	}
	.customer .slider .inner {
		padding: 1.6rem 2%;
	}

	#footer {
	padding: 60px 0px;
	}
	#footer .footer_left {
		margin-bottom: 50px;
	}
	#footer .flex {
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}
}