.wrap-box{overflow: hidden;}
h1,.h1,.h2,h2{letter-spacing: 0;}
#banner_box{background: url(https://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/07/25064803/als-banner-bg.jpg) no-repeat center bottom/100% 100%; position: relative;padding-bottom: 45px;}
#banner_box h1{margin-top: 85px;}
#banner_box h5{color: #fff;}
#banner_box .banner-btn{margin: 35px 0 15px;}
#banner_box .banner-btn .learn_more{color: #3b3635; background: #fff;}
#banner_box .banner-btn .learn_more:before{background: #bdbcbc;}
#banner_box .banner-btn .contact_us{background: #169fee; color: #fff;}
#banner_box .media{margin-top: 20px;}
#banner_box .banner-btn .contact_us:before{background: #0c7bba;}
#banner_box .media .f-icon{border:1px solid #169fee; width: 40px; height: 40px; border-radius: 5px; text-align: center;}
#banner_box .media h5{color: #169fee; font-weight: 600;}
#banner_box .media .fa{color: #169fee; line-height: 40px;}
#banner_box .media p{color: #fff;}
.banner-screen{position: relative; z-index: 1;}
.back-circle{position: absolute; width: 380px; height: 380px; border-radius: 100%; background: #09599e; top: 0; right: 0; left: 0; bottom: 0; margin: auto; z-index: -1}
.back-circle:after,
.back-circle:before {
  position: absolute;
  content: '';
  animation: 2s linear 0s normal none infinite running pulse;
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: 4px solid #169fee;
  border-radius: 50%;
  height: 380px;
  width: 380px;
  opacity: 1;
  margin: auto;
  left: -100%;
  top: 0;
  right: -100%;
  bottom: 0;
  z-index: 1;
}
.back-circle:before{width: 425px; height: 425px; border:1px solid #085ba2;}

@keyframes pulse {
  0% {
      opacity: 0;
      transform: scale(1);
  }
  25% {
      opacity: 0.2;
      transform: scale(1.1);
  }
  50% {
      opacity: 0.4;
      transform: scale(1.2);
  }
  75% {
      opacity: 0.2;
      transform: scale(1.3);
  }
  100% {
      opacity: 0;
      transform: scale(1.4);
  }
}
@-webkit-keyframes pulse {
  0% {
      opacity: 0;
      transform: scale(1);
  }
  25% {
      opacity: 0.2;
      transform: scale(1.1);
  }
  50% {
      opacity: 0.4;
      transform: scale(1.2);
  }
  75% {
      opacity: 0.2;
      transform: scale(1.3);
  }
  100% {
      opacity: 0;
      transform: scale(1.4);
  }
}
#mainFeature{background:url(https://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/07/25064827/als-mainfeature-bg.jpg)no-repeat center top/100% #001137;overflow: hidden;}
#mainFeature h3{color: #1491db;}
#mainFeature h3+h5{color: #fff; margin-bottom: 45px;}
#mainFeature .col-sm-6{border:1px solid #1e5ac9; padding:25px 15px;}
#mainFeature .f-box .f-icon{
  background: rgb(1, 161, 224) none repeat scroll 0 0;
  display: inline-block;
  height: 33px;
  margin: 18px 0;
  position: relative;
  text-align: center;
  width: 58px;
}
#mainFeature .f-box .f-icon .fa {
  color: rgb(255, 255, 255);
  line-height: 33px;
}
#mainFeature .f-box .f-icon:before {
  border-left: 29px solid rgba(0, 0, 0, 0);
  border-right: 29px solid rgba(0, 0, 0, 0);
  border-top: 18px solid #01a1e0;
  content: "";
  height: 0;
  left: 0;
  position: absolute;
  top: 33px;
  width: 0;
}
#mainFeature .f-box .f-icon:after {
  border-bottom: 18px solid #01a1e0;
  border-left: 29px solid rgba(0, 0, 0, 0);
  border-right: 29px solid rgba(0, 0, 0, 0);
  bottom: 33px;
  content: "";
  height: 0;
  left: 0;
  position: absolute;
  width: 0;
}
#mainFeature .col-sm-6:nth-child(2) .f-box .f-icon{background: #648fde;}
#mainFeature .col-sm-6:nth-child(2) .f-box .f-icon:after{border-bottom-color:#648fde }
#mainFeature .col-sm-6:nth-child(2) .f-box .f-icon:before{border-top-color: #648fde}
#mainFeature .col-sm-6:nth-child(3) .f-box .f-icon{background: #d3a657;}
#mainFeature .col-sm-6:nth-child(3) .f-box .f-icon:after{border-bottom-color:#d3a657 }
#mainFeature .col-sm-6:nth-child(3) .f-box .f-icon:before{border-top-color: #d3a657}
#mainFeature .f-box h4{color: #fefefe; font-weight: 500;}
#mainFeature .f-box h5{color: #fff; font-weight: 600;}
#mainFeature .f-box p{color: #e7eaec;}
#mainFeature .col-sm-6:nth-child(4){background: url(https://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/07/25064809/als-f-box-bg.jpg)no-repeat center center/cover;}
#mainFeature .col-sm-6 .btn{background: #169fee;color: #fff; margin-top: 20px;}
#mainFeature .col-sm-6 .btn:before{background: #0a8dd9;}
#mainFeature .h1{font-size: 36px;}
.feature-screen{margin-top: -15px; position: relative;}
.feature-screen:after{position: absolute;content: ''; top: 15px; background: url(https://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/07/25064816/als-feature-screen-shdw.png)no-repeat left bottom; width: 515px; height: 564px;left: 0; bottom:0;}



#screenshot{ background: url(https://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/07/25064835/als-screebshot-bg.jpg)no-repeat center top/cover; padding: 40px 0;}
#screenshot .screenshot h3{color: #fff;  font-weight: 600;}
#screenshot .screenshot h5,
#screenshot .key-feature h5{color: #fff;margin: 0 0 30px;}
.dg-wrapper{
  height: 586px;
  width: 342px;
  margin: 0 auto;
  position: relative;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-perspective: 1000px;
  -moz-perspective: 1000px;
  -o-perspective: 1000px;
  -ms-perspective: 1000px;
  perspective: 1000px;
  background: url(https://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/07/18093023/phone_screenshot_screen1.png)no-repeat center center/contain;
}
.dg-wrapper div{
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 265px;
  height: 468px;
  right: 0; margin: auto; padding: 47px 0 0 ;
  
}
.dg-wrapper div.dg-transition{
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
.dg-container nav div{
  display: inline-block;
  cursor:pointer;
  width: 40px;
  height: 40px;
  border-radius: 100%; 
  margin: 5px 5px 10px;
  background:#169fee;
  position: relative;
  transition: all 0.6s;
  -webkit-transition: all 0.6s;
}
.dg-container nav div .fa{line-height: 40px; color: #fff; font-weight: 600;}
.dg-container nav div:hover{box-shadow:inset 0 0 0 40px #1685c5;}

.key-feature h3{color: #169fee}
#screenshot .key-feature .media h5{color: #169fee; margin-bottom: 10px;}
.key-feature .media p{color: #fff;}

.key-feature .media .f-icon {
  background:#169fee;
  border-radius: 100%;
  height:60px;
  position: relative;
  text-align: center;
  width: 60px;
}
.key-feature .media .f-icon .fa{line-height: 60px; color: #fff; font-size: 2em}
.key-feature .media .f-icon::after, 
.key-feature .media .f-icon::after {
  border-left: 25px solid rgba(0, 0, 0, 0);
  border-right: 25px solid rgba(0, 0, 0, 0);
  border-top: 45px solid #066aa4;
  bottom: 0;
  content: "";
  height: 0;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  width: 15px;
  z-index: -1;
  transition:all 0.6s ease 0s;
  -webkit-transition:all 0.6s ease 0s;
}
.key-feature .media:hover .f-icon::after, 
.key-feature .media:hover .f-icon::after {
  bottom: -30px;
}
.feature-screens{padding-top: 30px;}
.screen02{position: absolute; right: 30px; top: 0;}



#tech,
#delivery{background: #012455; position: relative;  padding-top: 30px;}
#tech h3,
#delivery h3{color: #1fa9f9; font-weight: 600;}
#tech h4,
#delivery h4{color: #fff; position: relative; padding-bottom: 15px;}
#tech h4:after,
#delivery h4:after{position: absolute; content: ''; width: 70px; height: 3px; background: #fff; bottom: 0; right: 0; left: 0; margin: auto;}
#tech .tech-icon {margin: 35px 0;padding: 10px 0; position: relative;}
#tech .tech-icon li{vertical-align: middle;}
#tech .tech-icon::after, 
#tech .tech-icon::before,
#delivery ul::before ,
#delivery ul:after{background: rgba(0, 0, 0, 0) url("https://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/05/30071158/feastbeast_tech_border.png") no-repeat scroll center center;
  content: "";
  height: 2px;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

#tech .tech-icon::before, #delivery ul::before {bottom: 0;  top: auto;}
#tech li {margin: 0 15px;}
#tech .border,
#delivery .border{margin-bottom: 20px;}
#delivery{padding-bottom: 40px;}
#delivery ul {margin: 0 0 25px;padding: 10px 0; position: relative;}
#delivery li {color: rgb(255, 255, 255);font-size: 16px; line-height: 18px;padding-right: 55px;}
#delivery li span {display: inline-block;height: 15px; margin-right: 10px; width: 15px;}
#delivery li:nth-child(1) span {background: #fff;}
#delivery li:nth-child(2) span {background: #ffc000;}
#delivery li:nth-child(3) span { background: #29cef1;}
#delivery li:nth-child(4) span{background: #4ee751;}
.del-process-graph{background: #082e6c; min-height: 310px; margin-top: 30px; border-radius: 20px;}
#delivery .del-process-graph h5{color: #fff;  margin: 30px 0 20px;}

@media all and (max-width: 1400px){
#mainFeature .h1 {font-size: 30px;}
 .screens {margin-top: 45px;}
 #screenshot{padding: 50px 0 30px;}
 #keyFeature .media .f-icon{width: 55px; height: 55px;}
 #keyFeature .media .f-icon .fa{line-height: 55px; font-size: 2em;}
 #keyFeature .media:first-child{margin-top: 55px;}
 .del-process-graph{min-height: 240px;}
 #delivery .del-process-graph h5{margin: 35px 0;}
  #tech li {margin: 0 5px; padding: 0;}
  #tech .tech-icon{margin-bottom: 0;}
}



@media all and (max-width: 992px){
 #mainFeature .h1 {font-size: 24px;}
  #screenshot {padding: 10px 0 20px;}
	#delivery{padding-top: 0;}
  #tech li{margin: 5px;}
  .feature-screen + .feature-screen{right: 0;}
	.del-process-graph{margin-top: 0; min-height: 230px;}
	#contact{padding: 15px 0 25px;}

}
@media all and (max-width: 767px){
  .dg-container nav div {margin: 5px 2px 10px;}
  #tech li {margin: 5px 0;}
	.dg-wrapper{width: 285px; height: 485px;}
	.dg-wrapper div{width: 219px; padding: 39px 0 0;}
}