/***************************Service Banner Section***********************************/
.service_banner { padding:125px 0 135px; margin-top: -2px; }
.in_house {background:#d3d3d1; padding:85px 20px; text-align:center; z-index:1; position:relative; top:175px;}
.in_house h1 {text-transform: uppercase; color:#4e6179; line-height: 1.3; font-weight: 500; letter-spacing: 1px; padding: 0 0 20px; }
.in_house img {width:960px;}
/***************************Service Banner Section***********************************/

/***************************Middle Section*******************************************/
.speed_banner{padding:150px 0 20px; position:relative; margin-top:-150px; margin-bottom: -300px;}
.speed_banner:before{position:absolute; top:0; height:100%; width:100%; content:""; left: 0;background:#324255; -webkit-transform: skewY(-6deg); -moz-transform: skewY(-6deg); -ms-transform: skewY(-6deg); -o-transform: skewY(-6deg); transform: skewY(-6deg); -webkit-backface-visibility: hidden; backface-visibility: initial;}
.speed_banner_in{padding:150px 0;}
.speed_title {text-align:center; width:100%;position:relative;}
.tra_left,.tra_right{width:50%;}
.tra_section {position:relative; z-index:999; margin:150px 0 0; position: relative; display: flex; flex-wrap: wrap; width: 100%;-webkit-transform: skewY(-6deg); -moz-transform: skewY(-6deg); -ms-transform: skewY(-6deg); -o-transform: skewY(-6deg); transform: skewY(-6deg); -webkit-backface-visibility: hidden; backface-visibility: initial;}
.tra_left:after {position: absolute; content: ""; background:url(https://4570413.fs1.hubspotusercontent-na1.net/hubfs/4570413/Class/Service/up-down.svg?t=1532941789961) no-repeat; height: 101%; width: 100px; right: 50%; background-position: right; z-index: 9999; top: -2px; background-size: 95px; transform: translateX(48%);-webkit-transform:translateX(48%);  -ms-transform:translateX(48%); -moz-transform(48%);}
.tra_left {z-index:9;  background: #a6acbb;}
.tra_left .tra_left_inner{-webkit-transform: skewY(6deg); -moz-transform: skewY(6deg); -ms-transform: skewY(6deg); -o-transform: skewY(6deg); transform: skewY(6deg); -webkit-backface-visibility: hidden; backface-visibility: initial;}
.tra_left_inner { max-width:445px; margin: 0 auto; padding:130px 0; text-align: center;}
.tra_left_inner h3 {font-size: 42px; line-height: 1; font-weight: 500; letter-spacing: 1px; color: #324154;text-transform: uppercase;}
.tra_left_inner h2 {color: #324154; line-height: 1; font-weight: 500; letter-spacing: 3px; text-transform: uppercase;}
.tra_left_inner p {color: #292626; font-size: 18px; line-height: 1.6; margin: 0;}
.tra_right{z-index:1;  background: #d3d3d1;}
.tra_right .tra_right_inner{position: relative; top:50px;max-width:445px; margin: 0 auto; padding:180px 0; text-align: center;-webkit-transform: skewY(6deg); -moz-transform: skewY(6deg); -ms-transform: skewY(6deg); -o-transform: skewY(6deg); transform: skewY(6deg); -webkit-backface-visibility: hidden; backface-visibility: initial;}
.tra_right_inner h3 {font-size: 42px; line-height: 1; font-weight: 500; letter-spacing: 1px; color:#46586e;text-transform: uppercase;}
.tra_right_inner h2 {color: #46586e; line-height: 1;  font-weight: 500; letter-spacing: 3px; text-transform: uppercase;}
.tra_right_inner p {color: #292626; font-size: 18px; line-height: 1.6; margin: 0;}
/***************************Middle Section End*******************************************/

/************************Service Map Section**********************************************/
.cut_banner{padding:350px 0 50px; height:900px; position:relative;}
.saw_inner { position:relative; z-index:999; padding:50px 20px 70px; background: #d3d3d1; text-align: center; margin:100px 0 0;}
.saw_inner h2 { color: #4e6179; font-weight: 500; line-height: 1.3; text-transform: uppercase;}
.saw_inner ul{display: flex; flex-wrap: wrap; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex;justify-content: center;}
.saw_inner li{font-size:42px;font-family: 'Teko',sans-serif; font-weight:500; color:#324154; padding-right:35px;position:relative;text-transform: uppercase; letter-spacing: 2px;}
.saw_inner li:last-child{padding-right:0;}
.saw_inner li:last-child:after{content:none;}
.saw_inner li:after { position: absolute; right: 13px; content: ""; height: 10px; width: 10px; background: #324154; border-radius: 50% }
.saw_inner p {color: #292626; font-size: 18px; line-height: 1.6; max-width: 855px; margin: 15px auto 0;}
/**********************Service map End******************************************************/


/***********************Quality Section*****************************************************/
.quality_banner{margin-top:-150px; text-align:center; position:relative; padding:130px 0;background:#4e6179; -webkit-transform: skewY(-6deg); -moz-transform: skewY(-6deg); -ms-transform: skewY(-6deg); -o-transform: skewY(-6deg); transform: skewY(-6deg); -webkit-backface-visibility: hidden; backface-visibility: initial;}
.qualtiy_banner_in{-webkit-transform: skewY(6deg); -moz-transform: skewY(6deg); -ms-transform: skewY(6deg); -o-transform: skewY(6deg); transform: skewY(6deg); -webkit-backface-visibility: hidden; backface-visibility: initial;}
.qualtiy_banner_in img {width:100%; max-width: 250px;}
.qualtiy_banner_in h2 { color: #d3d3d1; font-weight: 500; line-height: 1.3; padding: 20px 0 0; letter-spacing: 2px; text-transform: uppercase;}
.qualtiy_banner_in p { font-size: 18px; color: #bebfbd; line-height: 1.6; max-width: 855px; margin: 0 auto; }
/***********************Quality Section End*****************************************************/


/***************************Package Section*****************************************************/
.packa_left,.packa_right{width:50%;}
.packa_left { position: relative; z-index: 999; padding-right:20px;}
.packa_banner { padding: 150px 0; margin-top: -150px;height: 720px;}
.packa_right { color: #324154; text-align:center; padding:80px 55px 0 0;}
.packa_left img {width: 100%;}
.packa_right h3{font-weight:500; font-size:42px; line-height:1;letter-spacing: 2px; text-transform: uppercase;}
.packa_right h2{font-weight:500;letter-spacing: 2px; text-transform: uppercase;line-height:1;}
/***************************Package Section End*****************************************************/


/***************************Mirror Section***************************************************/
.mirror_banner{background:#324255;margin-top: -150px;margin-bottom: -130px; position:relative; z-index:999; padding:180px 0; text-align:center;-webkit-transform: skewY(-6deg); -moz-transform: skewY(-6deg); -ms-transform: skewY(-6deg); -o-transform: skewY(-6deg); transform: skewY(-6deg); -webkit-backface-visibility: hidden; backface-visibility: initial;}
.mirror_banner_in{-webkit-transform: skewY(6deg); -moz-transform: skewY(6deg); -ms-transform: skewY(6deg); -o-transform: skewY(6deg); transform: skewY(6deg); -webkit-backface-visibility: hidden; backface-visibility: initial;}
.mirro_sec{background:#d3d3d1; padding:60px 20px; }
.mirro_sec p { color: #292626; font-size: 18px; margin: 15px auto 0; max-width: 855px; line-height: 1.6;}
/***************************Mirror Section End***************************************************/



/*************************Responsive  Layout**************************************************/

@media(min-width:1921px){
/*.tra_right{bottom:-115px;}*/
.cut_banner { height: 1988px; margin-top: -65px; margin-bottom: -100px;display: flex; flex-wrap: wrap; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex;    align-items: flex-end; }
.saw_inner{margin:0;}
.service_banner{padding: 320px 0 135px;margin-bottom: -50px;}
.quality_banner{padding:285px 0;}
}

@media(max-width:1400px){
.service_banner {padding:20px 0 135px;}
.in_house {top:125px;}
.speed_banner { padding: 90px 0 55px;}
.cut_banner {height: 1235px; margin-top: -50px; }
.saw_inner{margin:400px 0 0; }
.packa_banner{height:650px;}
.tra_left_inner{padding:80px 0;}
.tra_right .tra_right_inner{top:63px; padding:80px 0 140px;}
}

@media(max-width:1250px){
.tra_left_inner h3,.tra_right_inner h3{ font-size: 38px;}
.tra_left_inner h2,.tra_right_inner h2{font-size:54px;}
.tra_left_inner{padding:80px 30px;}
.tra_right .tra_right_inner {padding:80px 30px 120px; top: 63px;}
}

@media(max-width:1024px){
.cut_banner {height:1000px; padding:200px 0 50px;}
.tra_left_inner h3,.tra_right_inner h3{ font-size:34px;}
.tra_left_inner h2,.tra_right_inner h2{font-size:48px;}
.tra_right_inner{max-width:400px;}
.tra_right .tra_right_inner {max-width:400px; top:53px;}
.tra_right_inner p,.tra_left_inner p{font-size:16px;}
}

@media(max-width:991px){
.cut_banner {height: 780px; padding:150px 0 50px;}
.saw_inner {margin: 170px 0 0; padding:50px 20px;}
.quality_banner{padding:100px 0}
.saw_inner li{font-size:38px;}
}

@media(max-width:840px){
.tra_left:after{background:transparent; content:none;}
.tra_left, .tra_right{width:100%;}
.tra_right{margin-top:-1px;}
.tra_right .tra_right_inner{top:0; max-width:100%; padding:60px 20px 80px;}
.tra_left_inner{max-width:100%; padding:60px 20px;}
.saw_inner li{font-size:34px;}
.saw_inner{padding:50px 20px;}
.packa_right h3{font-size:38px;}
.packa_banner {height: 550px;}
.packa_right{padding:80px 20px 0 0;}
}

@media(max-width:767px){
.tra_left_inner h3,.tra_right_inner h3{ font-size:30px;}
.tra_left_inner h2,.tra_right_inner h2{font-size:40px;}
.saw_inner li{font-size:30px;}
.saw_inner p,.qualtiy_banner_in p,.mirro_sec p{font-size:16px;}
.packa_right h3 {font-size:32px;}
.mirror_banner{padding:120px 0;}
.mirro_sec,.in_house{padding:60px 20px;}

}


@media(max-width:640px){
.packa_left, .packa_right{width:100%;}
.packa_left{padding:0 0 20px; text-align:center;}
.packa_banner {height: 100%;}
.packa_right{padding:30px 0 50px; text-align:center;}
.packa_right h3 {font-size:28px;}
.packa_left img {width: 100%; max-width: 400px; margin: 0 auto;text-align: center;}
.tra_section{margin:100px 0 0;}
.saw_inner li {font-size: 28px; padding-top: 15px;}
.saw_inner li:after{width:6px; height:6px; top:55%;}
.saw_inner {margin: 100px 0 0;}
.quality_banner {padding: 80px 0;}
.saw_inner,.mirro_sec,.in_house {padding: 40px 20px;}
}

@media(max-width:480px){
.packa_right h3 {font-size:22px;}
.saw_inner li {font-size:22px; padding-top: 15px;padding-right: 15px;}
.tra_section {margin: 80px 0 0;}
.speed_banner {padding: 50px 0;}
.saw_inner li:after{right:5px;}
.cut_banner{padding:100px 0 50px;}
.mirror_banner {padding: 80px 0;}
.in_house h1{line-height:1;}
.packa_banner{margin-top:-175px;}
}