.wrap_box{overflow: hidden;}
h1{letter-spacing: 0;}
#banner_box{background: url(http://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/04/26120005/uiTesting_banner_bg.jpg) no-repeat center bottom/cover;min-height: 790px; position: relative;}
#banner_box .banner_btn{margin:15px 0 25px;}
#banner_box .banner_btn .btn{color: #fff; background: #1cbec6; border: none; overflow: hidden; line-height: 43px;}
#banner_box .banner_btn .btn:after{background: #e72e41;}
#banner_box h1{color: #fff; font-weight: 500}
#banner_box h1 span{color: #1cbec6}
#banner_box h5{color: #fff;}
#banner_box figure img{position: absolute;right: 0;	left: 10%; top: -70px; margin: auto; }

#uiTesting{ padding-top: 75px; }
#uiTesting h5{font-weight: 600; color: #262f36; margin: 0; position: relative;}
#uiTesting h5:after{position: absolute;content: ''; width: 18px; height: 18px; background: #e72b47; left: -21px; bottom: 4px;}
#uiTesting h1{color: #e72b47; margin: 5px 0; position: relative;}
#uiTesting h1 span{color: #262f36}
#uiTesting h1:after{position: absolute;content: ''; width: 5px; height: 50px; background: #e72b47; left: -15px; top: -15px;}
#uiTesting h1 + p{color: #2a2929; font-weight: 600;}

.ndGraphics{left: -20px;position: absolute;top: -89px;}

#testStart{padding: 50px 0 0; position: relative;}
#testStart .container{position: relative;}
#testStart .container:after {
  background: rgba(0, 0, 0, 0) url("http://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/04/26120001/uiTesting_3rd_graphics.png") no-repeat scroll center center / contain ;
  content: "";
  height: 272px;
  left: 0;
  margin: auto;
  position: absolute;
  right:30%;
  top: -40px;
  width: 629px;
  z-index: -1;
}
#testStart h1{color: #181818; font-weight: 500;}
#testStart h1 span{color: #e72b47; font-weight: 700;}
#testStart p{font-weight: 600; color: #2a2929}

.test-manual{border: 1px solid #262a2e; border-radius: 5px; width:auto; display: inline-block; margin:15px 0 40px;overflow: hidden;}
.test-manual li{ width: 153px;padding: 0; float:left;}
.test-manual li a{text-decoration: none; display: block;padding: 15px 20px; width: 100%; color: #11354a; font-weight: 600;
transition:all 0.6s; -webkit-transition:all 0.6s; -moz-transition:all 0.6s; -ms-transition:all 0.6s; -o-transition:all 0.6s;}
.test-manual li:hover a{background: #ed8393}
.test-manual li.active a,
.test-manual li.active:hover a{background: #e72b47; color: #fff;}

.tab-content h5{color: #313a42; font-weight: 600; margin: 0; position: relative;}
.tab-content h5:after{position: absolute;content: ''; width: 18px; height: 18px; background: #e72b47; left: -21px; bottom: 4px;}
.tab-content h1{color: #11354a; margin: 0; position: relative;}
.tab-content h1:after{position: absolute;content: ''; width: 5px; height: 50px; background: #e72b47; left: -15px; top: -15px;}
.tab-content h1 span{color: #e72b47}
#testStart .tab-content h1 + p{font-weight: 600;}
#testStart .tab-content p{color: #333334; font-weight: 400;}

.media-content{margin-top: 50px;}
.tab-content .media {margin: 0 0 2px;}
.tab-content .media span{width: 45px; height: 45px; border-radius: 5px; background: #313a42; display: block; text-align: center;
transition:all 0.6s; -webkit-transition:all 0.6s; -moz-transition:all 0.6s; -ms-transition:all 0.6s; -o-transition:all 0.6s;
}
.tab-content .media span .fa{line-height: 45px; color: #fff;}
#testStart .tab-content .media p{color: #2a2929; font-weight: 600;transition:all 0.6s; -webkit-transition:all 0.6s; -moz-transition:all 0.6s; -ms-transition:all 0.6s; -o-transition:all 0.6s;}
.tab-content .media .media-body{vertical-align: middle;}
.tab-content .media:hover span{background: #e72b47}
#testStart .tab-content .media:hover p{color: #e72b47;}
a:focus{outline: none;}
.tab-details{display: none;}

#processOutput{ min-height: 835px;}
#processOutput .container{position: relative;}
#processOutput img{position: absolute; right:-28px;top: -201px; z-index: -1;
transition:all 0.6s; -webkit-transition:all 0.6s; -moz-transition:all 0.6s; -ms-transition:all 0.6s; -o-transition:all 0.6s;}
#processOutput .active img{top: -231px;}

#interfaceTesting{padding:30px 0 250px;}
#interfaceTesting h1{color: #181818;}
#interfaceTesting h1 span{color: #e72b47;}
#interfaceTesting p{font-weight: 600;color: #2a2929;}
#interfaceTesting .media span{width: 44px; height: 44px; border-radius: 5px; border: 1px solid transparent; display: block; text-align: center;}
#interfaceTesting .media h5{font-weight: 600;}
#interfaceTesting .media p{color: #21455f; font-weight: 400;}
#interfaceTesting .left-media .media:first-child span{background: #fbb43b; border-color:#efa629 }
#interfaceTesting .left-media .media:first-child h5{color:#fbb43b;}
#interfaceTesting .left-media .media:last-child span{background: #8eca4e; border-color:#6b9a39 }
#interfaceTesting .left-media .media:last-child h5{color:#8eca4e;}
#interfaceTesting .right-media .media:first-child span{background: #1cbec6; border-color:#16a6ae }
#interfaceTesting .right-media .media:first-child h5{color:#1cbec6;}
#interfaceTesting .right-media .media:last-child span{background: #e72b47; border-color:#9c133e }
#interfaceTesting .right-media .media:last-child h5{color:#e72b47;}

#interfaceTesting .media span .fa{line-height: 44px; color: #fff;}

#interfaceTesting .media:hover .fa,
#mobileTesting .media:hover .fa{animation-duration: 1s;
animation-iteration-count: 1;
animation-name: hvr-icon-wobble-vertical;
animation-timing-function: ease-in-out;
}

#mobileTesting{background: #272f36; padding: 10px 0 35px; position: relative;}
#mobileTesting:after{position: absolute; content: ''; width: 100%;height: 270px; background: url(http://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/04/26120018/uiTesting_btm_pattern.png) no-repeat center top/cover; top:-250px; z-index: -1}
#mobileTesting h5{color: #fff; font-weight: 600; position: relative;}
#mobileTesting h5:after{position: absolute;content: ''; width: 18px; height: 18px; background: #ea4c4c; left: -21px; bottom: 4px;}
#mobileTesting h1{margin: 0; position: relative; line-height: 40px;}
#mobileTesting h1:after{position: absolute;content: ''; width: 5px; height: 50px; background: #ea4c4c; left: -15px; top: -15px;}
#mobileTesting h1 span{color: #ea4c4c;}
#mobileTesting h1 +p{color: #a2a3a5; font-weight: 600;}
#mobileTesting h1 +p ~p{color: #e2e1e1;}
#mobileTesting .media span{ width: 44px; height: 44px; background: #ea4c4c; border-radius: 5px; display: block; text-align: center;}
#mobileTesting .media span .fa{line-height: 44px; color: #fff;}
#mobileTesting .media p{font-weight: 600; color: #fff;}
#mobileTesting .media-body{vertical-align: middle;}
#mobileTesting .mobile-testing{position: absolute; top: -195px; z-index: 1}

#how_can_Box{background: #ef344f;}
#how_can_Box .button_box a{background: #fff; border: none; color: #373f40;}
#how_can_Box .button_box a::after, 
#how_can_Box .button_box a::before{background: #20282e;}
#how_can_Box .button_box a:hover{color: #fff;}

@media all and (max-width: 1400px){
	#banner_box{min-height: 700px;}
	.ndGraphics {left: 0; position: absolute; top: -79px; width: 420px;}
	#testStart {padding: 15px 0 0; position: relative;}
	#testStart .container::after {height: 272px; left: 0;right: 28%;top: -47px;width: 540px;}
	.test-manual{margin: 10px 0 30px}
	#processOutput {min-height: 620px;}
	#processOutput img {right: 0;top: -170px;width: 910px;}
	#processOutput .active img {top: -190px;}
	#interfaceTesting{padding-bottom: 190px;}
	#mobileTesting::after {background-size:contain; position: absolute;top: -165px;}
}
@media all and (max-width: 992px){
	#banner_box {min-height: 600px;}
	#banner_box figure img{top: -30px;}
	.ndGraphics {left: -15px;top: -67px;width: 336px;}
	#testStart .container::after{display: none;}
	.test-manual li{width: 130px;}
	.test-manual li a{padding: 10px 15px;}
	#testStart img{display: inline-block; margin-bottom: 20px;}
	#processOutput {min-height: 490px;overflow: hidden;}
	#processOutput .active img {top: -175px;}
	#interfaceTesting .media { min-height: 125px;}
	#interfaceTesting {padding-bottom: 90px;}
	#mobileTesting::after{top: -125px;}
	#mobileTesting .mobile-testing{position: static;}
}
@media all and (max-width: 767px){
	#banner_box figure img,
	.ndGraphics,
	#processOutput img{position: static; display: inline-block;}
	#uiTesting{padding-top: 30px;}
	#processOutput{min-height: inherit;}
	#interfaceTesting {padding-bottom: 35px;}
	#mobileTesting::after {top: -50px;}
}