@font-face {
  font-family: 'Haas Grot Disp 55 Roman';
  src: url('../fonts/NeueHaasGrotDisp-55Roman.eot'); /* IE9 Compat Modes */
  src: url('../fonts/NeueHaasGrotDisp-55Roman.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/NeueHaasGrotDisp-55Roman.woff') format('woff'), /* Modern Browsers */
       url('../fonts/NeueHaasGrotDisp-55Roman.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/NeueHaasGrotDisp-55Roman.svg#12c368608e891f02a5927b1eb6914726') format('svg'); /* Legacy iOS */      
  font-style:   normal;
  font-weight:  400;
}
@font-face {
  font-family: 'Haas Grot Disp 55 Roman';
  src: url('../fonts/NeueHaasGrotDisp-56Italic.eot'); /* IE9 Compat Modes */
  src: url('../fonts/NeueHaasGrotDisp-56Italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/NeueHaasGrotDisp-56Italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/NeueHaasGrotDisp-56Italic.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/NeueHaasGrotDisp-56Italic.svg#fb4c68637085a98b2befc48ae6260979') format('svg'); /* Legacy iOS */
  font-style:   italic;
  font-weight:  400;
}
@font-face {
  font-family: 'Haas Grot Disp 65 Medium';
  src: url('../fonts/NeueHaasGrotDisp-65Medium.eot'); /* IE9 Compat Modes */
  src: url('../fonts/NeueHaasGrotDisp-65Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/NeueHaasGrotDisp-65Medium.woff') format('woff'), /* Modern Browsers */
       url('../fonts/NeueHaasGrotDisp-65Medium.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/NeueHaasGrotDisp-65Medium.svg#65903ca0ff958ed6773c4beb922bbcfd') format('svg'); /* Legacy iOS */
  font-style:   normal;
  font-weight:  400;
}
@font-face {
  font-family: 'Haas Grot Disp 75 Bold';
  src: url('../fonts/NeueHaasGrotDisp-75Bold.eot'); /* IE9 Compat Modes */
  src: url('../fonts/NeueHaasGrotDisp-75Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/NeueHaasGrotDisp-75Bold.woff') format('woff'), /* Modern Browsers */
       url('../fonts/NeueHaasGrotDisp-75Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/NeueHaasGrotDisp-75Bold.svg#0a31bc1206d3fabf0012ed3ace631934') format('svg'); /* Legacy iOS */      
  font-style:   normal;
  font-weight:  700;
}
@font-face {
  font-family: 'Haas Grot Disp 75 Bold';
  src: url('../fonts/NeueHaasGrotDisp-76BoldItalic.eot'); /* IE9 Compat Modes */
  src: url('../fonts/NeueHaasGrotDisp-76BoldItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/NeueHaasGrotDisp-76BoldItalic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/NeueHaasGrotDisp-76BoldItalic.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/NeueHaasGrotDisp-76BoldItalic.svg#833d761e20704610ddd2bc50c2bc90c5') format('svg'); /* Legacy iOS */
  font-style:   italic;
  font-weight:  700;
}





/*------------------- helper classes -------------------------*/
*,
*:after,
*:before {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box
}
.clear { 
    clear: both; 
}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	font-size: 0;
}
* html .clearfix{ 
    zoom: 1; 
}
*:first-child+html .clearfix { 
    zoom: 1; 
}
.remove-margin { 
    margin-right: 0 !important 
}
.fullwidth{
    width: 100%;
    margin-right: 0;
    margin-left: 0;
    padding-right: 0;
    padding-left: 0;
}
.container{
    width: 1028px;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    padding-right: 10px;
    padding-left: 10px;
}
.responsive-img{
    display: block;
    max-width: 100%;
    height: auto;
}
/*------------------- styles -------------------------*/
body{
    font-size: 17px;
    font-weight: 400;
    line-height: 1.3em;
    font-family: 'Haas Grot Disp 55 Roman';
    color: #545454;
    background: url(../images/bg.png) repeat;
}
p{
    margin: 0 0 1.25em;
}
em{
    font-style: italic;
    font-family: 'Haas Grot Disp 55 Roman';
    font-weight: 400;
}
strong{
    font-family: 'Haas Grot Disp 75 Bold';
    font-weight: 700;
}
em strong,
strong em{
    font-family: 'Haas Grot Disp 75 Bold';
    font-weight: 700;
    font-style: italic;
}
.aligncenter{
    display: block;
    margin: 0 auto;
}
.floatright{
    float: right;
    margin-left: 29px;
}
.floatleft{
    float: left;
}
.red{
    color: #f25b5b;
}
.yellow{
    color: #f6e14b;
}
/*------------------- styles -------------------------*/
header{
    height: 80px;
    padding-top: 18px;
}
header .logo{
    display: block;
    margin: 0 auto;
}

/*------------------- Hero ---------------------------*/
#hero{
    height: auto;
    background: url(../images/hero-bg.jpg) no-repeat top center;
    position: relative;
    padding-top: 40px;
    padding-bottom: 40px;
}
#hero .arrow,
#solution .arrow,
#system .arrow,
#guarantee .arrow,
#product .arrow,
#signature .arrow,
#price-bottom .arrow{
    position: absolute;
    display: block;
    width: 49px;
    height: 49px;
    background: url(../images/hero-arrow.png) no-repeat;
    bottom: 0;
    left: 50%;
    margin-left: -25px;
    margin-bottom: -25px;
    z-index: 2;
}

/*------------------- Intro ---------------------------*/
#intro .content{
    width: 100%;
    float: none;
    padding-top: 40px;
    padding-right: 0;
}
#intro .man{
    display: none;
}
#intro strong em{
    color: #f25b5b;
}

/*------------------- Problem ---------------------------*/
#problem{
    padding-top: 50px;
    padding-bottom: 50px;
    background: url(../images/problem-bg.png) repeat;
}
#problem h1{
    font-size: 50px;
    line-height: 50px;
    margin: 0;
    text-align: center;
    color: #f25b5b;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#problem h2{
    font-size: 30px;
    line-height: 30px;
    margin: 0;
    text-align: center;
    color: #34495e;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#problem .container{
    padding-left: 10px;
    padding-right: 10px;
}
#problem .sep{
    margin-top: 15px;
    margin-bottom: 15px;
}
#problem .problem-img{
    display: block;
    margin: 0 auto 10px;
}

/*------------------- Solution ---------------------------*/
#solution{
    padding-top: 50px;
    padding-bottom: 20px;
    background: url(../images/solution-bg.png) repeat;
    color: #fff;
    position: relative;
}
#solution h1{
    font-size: 50px;
    line-height: 50px;
    margin: 0;
    text-align: center;
    color: #f6e14b;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#solution h2{
    font-size: 30px;
    line-height: 30px;
    margin: 0 0 5px 0;
    text-align: center;
    color: #FFFFFF;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#solution .content{
    width: 100%;
    padding-right: 0;
    float: none;
    padding-top: 30px;
}
#solution .dr{
    float: none;
    width: 206px;
    height: 227px;
    display: block;
    background: url(../images/dr.png) no-repeat;
    max-width: 100%;
    -moz-background-size:contain;
    -webkit-background-size:contain;
    background-size: contain;
    margin: 15px auto 0;
    
}
#solution .features{
    width: 952px;
    height: auto;
    display: block;
    margin: 0 auto 20px;
    padding: 20px;
    color: #fff;
    background: url(../images/features-bg.png) no-repeat top center;
    font-size: 20px;
    max-width: 100%;
    -moz-background-size:cover;
    -webkit-background-size:cover;
    background-size: cover;
}
#solution .features h2{
    text-align: left;
    margin-bottom: 20px;
}
#solution .features ul{
    margin-left: 28px;
    list-style: none;
}
#solution .features ul li{
    padding-left: 40px;
    margin-bottom: 20px;
    background: url(../images/features-bullet.png) no-repeat left center;
}
#solution .inner{
    padding-left: 29px;
    padding-right: 29px;
}

.testimonial{
    margin-bottom: 50px;
    padding-right: 0px;
}
.testimonial .photo{
    width: 126px;
    float: none;
    display: block;
    margin: 0 auto 5px;
}
.testimonial .testimonial-content{
    width: 100%;
    float: none;
}
.testimonial .testi{
    position: relative;
    padding: 15px 30px;
    margin: 0 0 20px;
    color: #fff;
    font-style: italic;
    color: #000;
    background: rgba(255,255,255,0.8);
    -moz-border-radius: 5px / 5px 5px 5px 5px;
    -webkit-border-radius: 5px / 5px 5px 5px 5px;
    border-radius: 5px / 5px 5px 5px 5px;
}
.testimonial .testi:after{
    content: "";
    position: absolute;
    bottom: -15px;
    left: 50px;
    border-width: 15px 15px 0px;
    border-style: solid;
    border-color: rgba(255,255,255,0.8) transparent;
    display: block;
    width: 0px;
}
.testimonial .author{
    font-size: 15px;
    line-height: 1.1em;
    color: #fff;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
    margin-bottom: 10px;
}
.testimonial .des{
    -moz-border-radius: 5px / 5px 5px 5px 5px;
    -webkit-border-radius: 5px / 5px 5px 5px 5px;
    border-radius: 5px / 5px 5px 5px 5px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    background-color: #138d13;
    color: #fff;
    ont-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
    padding: 10px 30px;
}

/*------------------- System ---------------------------*/
#system{
    padding-top: 60px;
    padding-bottom: 100px;
    position: relative;
}
#system h1{
    font-size: 50px;
    line-height: 50px;
    margin: 0 0 20px 0;
    text-align: center;
    color: #f25b5b;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#system h1 span{
    font-size: 30px;
    line-height: 30px;
    color: #34495e;
}
#system .notice{
    -moz-border-radius: 5px / 5px 5px 5px 5px;
    -webkit-border-radius: 5px / 5px 5px 5px 5px;
    border-radius: 5px / 5px 5px 5px 5px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    background-color: #e9a904;
    background-image: -moz-linear-gradient(57deg, #e9a905 0%, #f6b91f 100%);
    background-image: -o-linear-gradient(57deg, #e9a905 0%, #f6b91f 100%);
    background-image: -webkit-linear-gradient(57deg, #e9a905 0%, #f6b91f 100%);
    background-image: linear-gradient(33deg, #e9a905 0%, #f6b91f 100%);
    padding: 10px 20px;
    color: #fff;
    margin-bottom: 20px;
}
#system .step{
    -moz-border-radius: 5px / 5px 5px 5px 5px;
    -webkit-border-radius: 5px / 5px 5px 5px 5px;
    border-radius: 5px / 5px 5px 5px 5px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    background: rgba(82,82,82,0.05);
    padding: 20px 10px 20px 50px;
    margin-bottom: 20px;
    position: relative;
}
#system .step .title{
    font-size: 20px;
    margin-bottom: 20px;
}
#system .step p:last-child{
    margin-bottom: 0;
}
#system .step:after{
    content: "";
    font-size: 20px;
    height: 35px;
    width: 35px;
    display: block;
    position: absolute;
    left: 8px;
    top: 20px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background-color: #138d13;
    text-align: center;
    line-height: 35px;
    color: #fff;
    font-family: 'Haas Grot Disp 75 Bold';
    font-weight: 700;
}
#system .step.one:after{
    content: "1";
}
#system .step.two:after{
    content: "2";
}
#system .step.three:after{
    content: "3";
}
#system .step.four:after{
    content: "4";
}
#system .graph{
    float: none;
    margin: 10px auto 20px;
}

#system ol.list-numbered {
    list-style: none;
    counter-reset: line;
    margin-left: 5px;
}
#system ol.list-numbered > li {
    position: relative;
    padding-left: 40px;
    margin-bottom: 25px;
}
#system ol.list-numbered > li:before {
    position: absolute;
    left: -5px;
    display: inline-block;
    width: 35px;
    height: 35px;
    background-color: #138d13;
    border-radius: 50%;
    color: #fff;
    text-align:center;
    line-height: 35px;
    counter-increment: line;
    content: counter(line);
}
#system .highlights{
    width: 100%;
    margin-left: 0;
    background: url(../images/system-highlights.png) no-repeat;
    height: auto;
    margin-top: 60px;
    color: #fff;
    padding: 20px;
    background: url(../images/features-bg.png) no-repeat top center;
    -moz-background-size:cover;
    -webkit-background-size:cover;
    background-size: cover;
}
#system .highlights h2{
    padding-left: 0px;
    font-size: 25px;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
    line-height: 25px;
    margin-bottom: 20px;
}
#system .highlights ul{
    padding-left: 0px;
    margin: 0;
    list-style: none;
}
#system .highlights ul li{
    padding-left: 40px;
    margin-bottom: 24px;
    background: url(../images/system-highlights-bullet.png) no-repeat top left;
}

/*------------------- Guarantee ---------------------------*/
#guarantee{
    padding-top: 65px;
    padding-bottom: 80px;
    background: url(../images/guarantee-bg.png) repeat;
    position: relative;
}
#guarantee .container{
    padding-left: 10px;
    padding-right: 10px;
}
#guarantee h1{
    font-size: 30px;
    line-height: 30px;
    margin: 0 0 25px;
    text-align: center;
    color: #f25b5b;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#guarantee .subtitle{
    font-size: 15px;
    line-height: 18px;
    margin: 0 0 25px;
    font-family: 'Haas Grot Disp 75 Bold';
    font-weight: 400;
    font-style: italic;
    color: #f25b5b;
    padding-top: 0px;
}
#guarantee .features{
    width: 100%;
    height: auto;
    display: block;
    margin: 0 0 20px;
    padding: 20px;
    color: #fff;
    font-size: 20px;
     background: url(../images/features-bg.png) no-repeat top center;
    -moz-background-size:cover;
    -webkit-background-size:cover;
    background-size: cover;
}
#guarantee .features h2{
    margin-bottom: 25px;
    font-size: 30px;
    line-height: 30px;
    color: #FFFFFF;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#guarantee .features ul{
    margin-left: 5px;
    list-style: none;
}
#guarantee .features ul li{
    padding-left: 30px;
    margin-bottom: 20px;
    background: url(../images/features-bullet.png) no-repeat left center;
}

/*------------------- Product ---------------------------*/
#product{
    position: relative;
    padding: 60px 10px 30px;
}
#product h1{
    font-size: 30px;
    line-height: 30px;
    margin: 0 0 25px 0;
    text-align: center;
    color: #f25b5b;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#product h1 span{
    font-size: 25px;
    line-height: 25px;
    color: #34495e;
}
#product .option{
    border: 3px solid rgba(0,0,0,0.1);
    -moz-border-radius: 13px / 13px 13px 13px 13px;
    -webkit-border-radius: 13px / 13px 13px 13px 13px;
    border-radius: 13px / 13px 13px 13px 13px;
    background: rgba(218,218,218,0.1);
    padding: 20px;
    margin-bottom: 30px;
    position: relative;
}
#product .option h1{
    text-align: left;
}
#product .option h1 span{
    font-size: 30px;
    line-height: 30px;
}
#product .option ul{
    list-style: none;
    margin: 0 0 20px 0;
}
#product .option ul li{
    padding-left: 30px;
    margin-bottom: 15px;
    background: url(../images/option-bullet.png) no-repeat center left;
}
#product .option p:last-child{
    margin: 0;
}
#product .option .popular{
    width: 191px;
    height: 119px;
    top: -11px;
    right: -13px;
    display: block;
    position: absolute;
    background: url(../images/popular-badge.png) no-repeat;
    z-index: 1;
}

/*------------------- Price ---------------------------*/
#price{
    padding-top: 40px;
    padding-bottom: 40px;
    background: url(../images/solution-bg.png) repeat;
    color: #fff;
    position: relative;
}
#price h1{
    font-size: 30px;
    line-height: 30px;
    margin: 0;
    text-align: center;
    color: #f6e14b;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#price h1 span{
    color: #fff;
}
#price h2{
    font-size: 20px;
    line-height: 20px;
    margin: 0 0 5px 0;
    text-align: center;
    color: #FFFFFF;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}

#pricing-table{
    width: 100%;
    margin: 40px auto 0;
}
#pricing-table .table{
    width: 100%;
    position: relative;
    background: #fff;
    text-align: center;
    margin-bottom: 20px;
}

#pricing-table .table.c .popular{
    width: 151px;
    height: 94px;
    top: -6px;
    right: -8px;
    display: block;
    position: absolute;
    background: url(../images/price-popular-badge.png) no-repeat;
    z-index: 1;
}
#pricing-table .table .header,
#pricing-table .table .footer{
    background: #e9a905;
    padding-top: 30px;
    padding-bottom: 30px;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#pricing-table .table .price{
    background: #ebebe9;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
    padding-top: 20px;
    padding-bottom: 20px;
}
#pricing-table .table .header .title{
    color: #fff;
    font-size: 25px;
}
#pricing-table .table .header .subtitle,
#pricing-table .table .price .subtitle{
    color: #3d3c3c;
    font-size: 15px;
}
#pricing-table .table .price .title{
    font-size: 40px;
    color: #f25b5b;
    line-height: 40px;
}
#pricing-table .table .features{    
    min-height: 310px;
}
#pricing-table .table .features ul{
    margin: 0;
    list-style: none;
}
#pricing-table .table .features ul li{
    color: #666362;
    font-size: 12px;
    line-height: 36px;
    border-bottom: 2px solid #ebebe9;
}
#pricing-table .table.e .features ul li:last-child{
    border-bottom: none;
}
#pricing-table .table .footer .signup{
    color: #fff;
    text-transform: uppercase;
    background: #63605f;
    padding: 8px 20px;
    display: inline-block;
    text-decoration: none;
}
/*------------------- Price Bottom ------------------------*/
#price-bottom{
    height: auto;
    position: relative;
    background: url(../images/price-bottom-bg.jpg) no-repeat top center;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
}
#price-bottom h1, #price-bottom h2{
    text-align: center;
    font-size: 45px;
    line-height: 45px;
    color: #563a03;
    text-shadow: 0 1px 0 #fbf6d5;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
    margin: 0;
}
#price-bottom h2{
    font-size: 26px;
    line-height: 28px;
    margin-bottom: 15px;
}
#price-bottom h1 span, #price-bottom h2 span{
    color: #ae5a08;
}



/*------------------- Signature ---------------------------*/
#signature{
    padding-top: 40px;
    padding-bottom: 80px;
    background: url(../images/guarantee-bg.png) repeat;
    position: relative;
}
#signature h1{
    font-size: 40px;
    line-height: 40px;
    margin: 0;
    color: #f25b5b;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#signature h2{
    font-size: 20px;
    line-height: 20px;
    margin: 0;
    color: #34495e;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#signature h2.title{
    font-size: 15px;
    font-family: 'Haas Grot Disp 55 Roman';
    font-style: italic;
}
/*------------------- QA -------------------------------*/
#qa{
    padding: 60px 10px 40px;
}
#qa h1{
    font-size: 30px;
    line-height: 30px;
    margin: 0 0 10px;
    color: #f25b5b;
    text-align: center;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#qa h1 span{
    color: #34495e;
}
#qa h2{
    font-size: 20px;
    line-height: 20px;
    margin: 0 0 40px 0;
    color: #34495e;
    text-align: center;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#qa .q{
    padding-bottom: 20px;
    padding-left: 40px;
    position: relative;
}
#qa .q:before{
    content: "Q";
    -moz-border-radius: 3px / 3px 3px 3px 3px;
    -webkit-border-radius: 3px / 3px 3px 3px 3px;
    border-radius: 3px / 3px 3px 3px 3px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    background-color: #f15b5b;
    width: 30px;
    height: 30px;
    color: #fff;
    text-align: center;
    line-height: 30px;
    font-size: 17px;
    font-family: 'Haas Grot Disp 75 Bold';
    font-weight: 700;
    position: absolute;
    top: 0;
    left: 0;
}
/*------------------- Footer ---------------------------*/
#footer{
    text-align: center;
    background: url(../images/hero-bg.jpg) no-repeat top center;
    padding-top: 40px;
    padding-bottom: 40px;
    font-size: 50px;
    line-height: 50px;
    color: #563a03;
    text-shadow: 0 1px 0 #fbf6d5;
    font-family: 'Haas Grot Disp 65 Medium';
    font-weight: 400;
}
#footer span{
    color: #ae5a08;
}