.full-width{float: left;width: 100%;}
.wrapper_box{ overflow: hidden; }
img{ max-width: 100%; }

ul{ padding-left:0; }
.common-title-border{position: relative;}
.common-title-border:after{
content: '';
position: absolute;
left: 0;
right: 0;
margin:auto;
bottom: -20px;
width:70px;
height:3px;
background:#2d3243;
display: inline-block;
}

#banner_box { padding-top: 115px;}
a:focus{outline:none; outline-color:none; outline-style:none;}
#banner_box{background:url(https://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/06/15055956/sw_capture_banner.jpg) no-repeat center top /cover;  position: relative; min-height:650px;  }
#banner_box h1{ color:#fff; margin-top: 0; font-weight: 400;}
#banner_box h1 span{ color:#09d1c4; }
#banner_box h5{ color: #fff; }
#banner_box .banner_btn .btn{ background:#fff; border-color:#fff; color:#383739;}
#banner_box .banner_btn .btn::after{ background:#09d1c4;}
#banner_box .banner_btn .btn:hover{ border-color:#09d1c4; }
#banner_box .banner_btn{ margin-top:50px; }
#banner_box .media-icons{ margin-top: 35px; }
#banner_box .media-icons .media-body p{ font-weight: 600; color: #09d1c4; font-size: 16px; line-height: 20px; }
#banner_box .media-icons .media-body h4{ font-weight: 600;color: #fff;  font-size: 20px; line-height: 24px;}
#banner_box .media-icons .media-left .fa{ color: #09d1c4; font-size: 30px; line-height: 1; }
#banner_box .media-icons .media-body{ padding-left: 5px; }

#banner_box  .banner-mobile-paper-icon{ position: absolute; left:5% bottom: 0; width: 700px;}
#banner_box  .img-box { position: relative; z-index: 99;  direction: rtl; width:75%; float: right;}
#banner_box .banner-text-box{ padding:60px 0; }
#banner_box .banner-bottom-shadow{
 position:absolute; left: 0; bottom:-71px;
 background:url(https://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/06/15055957/sw_capture_banner_bottom_shadow.png) no-repeat center top /cover; 
display: block;
width: 100%;
height: 50px;
}

/*------------------------------#key_feature--------------------------*/
#key_feature{ margin:30px 0; }
#key_feature .img-box{ width:88%; }
#key_feature .key-feature-heading h3{ color: #000; font-weight: 600; }
#key_feature .key-feature-heading h5{ color:#11c1b6; }
#key_feature .key-feature-heading{ margin-bottom:50px; }
.sw-common-media .media .media-heading{color: #32c6bb; font-weight: 600; font-size: 20px; line-height: 24px;}
.sw-common-media .media p{ font-size: 18px; line-height: 22px; font-weight: 400;color: #1d202b; }
.sw-common-media .key-feature-icon {
  background: #1d202b;
  border-radius: 50%;
  display: table;
  height:80px;
  vertical-align: middle;
  width:80px;
  text-align: center;
  position: relative;
  margin-top:15px;

}
.sw-common-media .key-feature-icon .fa{ 
position: relative; z-index: 999; display: table-cell; vertical-align: middle; color: #32c6bb;
 font-size:30px; line-height: 1;
  transition: all ease-in-out 0.4s;
-webkit-transition: all ease-in-out 0.4s;
-ms-transition: all ease-in-out 0.4s;
 }
.sw-common-media .key-feature-icon:before{ 
  content: '';
  background:#32c6bb;
  width:30%;
  height: 30%;
  position: absolute;
  right: 0;
  top: 0;
  border-radius: 50%;
  display: block;
    transition: all ease-in-out 0.3s;
  -webkit-transition: all ease-in-out 0.3s;
  -ms-transition: all ease-in-out 0.3s;

 }
 .sw-common-media .key-feature-icon.left-icon:before{ left: 0; right: auto; }
.sw-common-media .key-feature-icon:hover:before{ width: 96%; height: 96%; }

.sw-common-media .key-feature-icon:hover .fa{
  color: #fff; 
}

/*--------------------------------------------------------*/
#screenshot_slider{ padding: 30px 0 50px;}
#screenshot_slider .heading-box h3{ font-size: 30px; line-height: 34px; color:#000000; font-weight: 600; }
#screenshot_slider .heading-box h5{ font-size:22px; line-height: 26px; color:#09d1c4; font-weight:400; }

#screenshot_slider .screenshot_bg{background:url(https://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/06/15060012/sw_screenshot_bg.png) no-repeat center top;

left: 0;
bottom: 0;
margin: auto;
display: block;
width: 100%;
height: 500px;
position: absolute;
z-index: -1;
}
#screenshot_slider .heading-box{ margin-bottom:45px;}
/*ScreenShot slider css*/
.dg-wrapper{
  height: 560px;
  width: 275px;
  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/06/07123141/dot_link_screenshot_mobile.png)no-repeat center center/contain;
}
.dg-wrapper div{
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 256px;
  height: 545px;
  
}
.dg-wrapper div img{padding:74px 0 0 22px}
.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 span{
  display: inline-block;
  cursor:pointer;
  width: 40px;
  height: 40px;
  opacity: 0.8;
  border-radius: 100%; background: #f07124;
  margin-top: 20px;
}
.dg-container nav span .fa{line-height: 40px; color: #fff; font-weight: 700; margin-left: -1px;}
.dg-container nav span.dg-next{margin-left: 10px;}
.dg-container nav span:hover{background: #c95914;}

/*End ScreenShot slider css*/


/* ------------------------- We are Here Help You Section----------------------*/
#we_are_here_box{ background: url(https://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/06/15060014/sw_we_are_here_box_bg.jpg) no-repeat center center/cover; padding:50px 0; }
#we_are_here_box h4{ color: #21d2c6;text-transform: uppercase; font-weight: 600; }
#we_are_here_box h3{ color: #fff; text-transform: uppercase; font-weight: 600;}
 #we_are_here_box #contact .btn{background: #0fc1b6; color: #fff;}
#we_are_here_box #contact .btn::before{background: #06a89e;}

/*-----------------------Key Feature-------------------------------------- */
#img_capture_feature{ background: #18c7bc; padding:30px 0; }
#img_capture_feature h3{ color: #000; font-weight: 600; }
#img_capture_feature h5{ color: #fff; }
#img_capture_feature .key-feature-heading{ margin-bottom:50px; }
#img_capture_feature .key-feature-heading .common-title-border::after{ background: #fff; }
#img_capture_feature .sw-common-media .media .media-heading{ color:#0f0f0f; font-weight: 500; margin:15px 0 10px;}
#img_capture_feature .sw-common-media .media p{color: #fff;}
#img_capture_feature .sw-common-media .key-feature-icon::before{background: #fff; height: 15%; width: 15%; right: 10px;}
#img_capture_feature .sw-common-media .key-feature-icon{background: #2d3243; width:63px; height: 63px;}
#img_capture_feature .sw-common-media .key-feature-icon .fa{color: #fff;}
#img_capture_feature  .sw-common-media .key-feature-icon.left-icon::before{ right: auto; left: 10px; }
#img_capture_feature  .sw-common-media .key-feature-icon.bottom-icon::before {bottom: -4px;left: 15px;margin: auto;top: auto;}

#img_capture_feature .sw-common-media .key-feature-icon:hover .fa{color: #21dbcf;}
#img_capture_feature .sw-common-media  span.key-feature-icon::after{ box-shadow: none; }
#img_capture_feature .key-feature-detail{margin-top: 50px;}
#img_capture_feature .key-feature-detail .media:hover .fa{color: #21dbcf;}
#img_capture_feature .img-box{ position: relative;  width: 100%;}
#img_capture_feature .img-box .main-screen-img{display:block; position: relative; z-index: 99;}
#img_capture_feature .img-box .calc-icon {
  left: 27px;
  position: absolute;
  top: 145px;
  z-index: 9;
}
#img_capture_feature .img-box .graph-icon {
  bottom: 105px;
  margin: auto;
  position: absolute;
  right: 60px;
  z-index: 999;
}



/*---------------------------------------------------------- */

#tech{background: #2d3243; padding-top: 55px;}
#tech h3,
#delivery h3{color: #18c7bc; font-weight:600;}
#tech h3 span,
#delivery h3 span{color: #fdb853; font-weight: 600}
#tech h5,
#delivery h5{color: #fff;}
#tech .common-title-border::after,#delivery .common-title-border::after{background: #fff;}
#tech .tech-icon{margin: 35px 0 50px; padding: 25px 0; position: relative; }
#tech .tech-icon:after,
#tech .tech-icon:before,
#delivery ul:before,
#delivery ul:after{position: absolute; content: ''; background: url(https://algoworksupload.s3.amazonaws.com/new-algoworks/wp-content/uploads/2016/05/30071158/feastbeast_tech_border.png) no-repeat center center; width: 100%; height: 2px; top: 0; left: 0;}
#tech .tech-icon:before,
#delivery ul:before{top: auto; bottom: 0;}

#tech li{margin: 0 15px;}




/* --------------------------------------------------*/

#delivery{padding-bottom: 40px; background: #2d3243;}
#delivery h5{color: #fff;}
#delivery h4{color: #fff; margin: 40px 0 13px;}
#delivery .timeline-title{display: block; font-size: 26px; line-height: 30px; color: #fff; font-weight: 400; margin-top: 55px;letter-spacing: 1[x] }
#delivery ul{padding: 10px 0; margin:35px 0 25px; position: relative;}
#delivery ul:before{top: auto; bottom: 0;}
#delivery li{font-size: 16px; line-height: 18px; color: #fff; padding-right: 55px;}
#delivery li span{ width: 15px; height: 15px; display: inline-block;margin-right: 10px;}

#delivery li:nth-child(1) span{ background: #fff;}
#delivery li:nth-child(2) span{ background: #e6b41c;}
#delivery li:nth-child(3) span{ background: #29cef1;}
#delivery li:nth-child(4) span{ background: #4ee751;}
#delivery li:nth-child(5) span{ background: #e04d5c;}



@media only screen and (max-width:1400px) {
#banner_box .banner-bottom-shadow{ bottom: -82px; }
#key_feature{ padding: 20px 0; }
.sw-common-media .media .media-heading{ font-size:18px; line-height: 22px; }
.sw-common-media .media p{ font-size: 16px; line-height: 20px; margin-bottom: 0; }
#img_capture_feature .key-feature-detail{ margin-top: 25px; }
#img_capture_feature .sw-common-media .media .media-heading{margin: 10px 0 5px;}
#img_capture_feature .key-feature-heading{ margin-bottom: 40px; }
#img_capture_feature .img-box .calc-icon{ left: -13px; }
#img_capture_feature .img-box .graph-icon{ right: 35px; }
#tech{ padding-top:15px; }
#tech li{ margin: 0 3px; }
#tech .tech-icon {margin: 40px 0 6px; padding: 15px 0 25px;}
#delivery .timeline-title{ margin-top: 35px; }
#delivery ul{ margin: 25px 0; }
#banner_box .banner-mobile-paper-icon{ width: 578px; }

}
@media only screen and (max-width:1169px) {

#banner_box .banner-mobile-paper-icon {width: 100%; bottom: 0;  left: 10%;}
#banner_box .img-box{ width: 82%; }

}



@media only screen and (max-width:992px) {
  #banner_box h1{  font-size: 29px; line-height: 33px; }
  #banner_box .banner-bottom-shadow { bottom: -52px;}
  .sw-common-media .media p { font-size: 15px;  line-height: 19px;  }
  .sw-common-media .key-feature-icon{ width: 70px; height: 70px; }
  #key_feature .key-feature-heading { margin-bottom: 35px;}
  #screenshot_slider {padding: 15px 0 30px;}
#img_capture_feature .img-box .calc-icon { left: -38px;}
#img_capture_feature .img-box .graph-icon {  right: -30px;}
#tech li{ width: 16%; margin: 0; }

}


@media only screen and (max-width:767px) {
#banner_box .banner-mobile-paper-icon{ display: none; }
#banner_box .banner-bottom-shadow {bottom: -92px;}
.key-feature-detail {margin-top: 20px;}
#tech li {display: block;margin: 0 0 15px;  width: auto;}
#delivery li{ margin-bottom: 10px; }
#delivery .timeline-title{ font-size:17px; line-height: 24px; }
#screenshot_slider .heading-box h3,#key_feature .key-feature-heading h3,#img_capture_feature h3,
#tech h3, #delivery h3{ font-size: 22px; line-height: 26px; }
.common-title-border{ font-size: 18px !important; line-height: 22px !important; }
#tech li img{ width: 110px; }
}
@media only screen and (max-width:639px) {
#banner_box .banner-bottom-shadow {bottom: -70px;}

}

@media only screen and (max-width:479px) {
  #banner_box .banner-bottom-shadow { bottom: -53px;}
  #banner_box h1 { font-size: 23px;  line-height: 30px;}
  #banner_box .banner_btn { margin-top: 25px;}
  #we_are_here_box .banner_btn { margin-top: 0;}
  #tech li img{ width: 100px; }
 

}