/**
 * @license
 * MyFonts Webfont Build ID 3046088, 2015-06-20T22:09:08-0400
 *
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are
 * explicitly restricted from using the Licensed Webfonts(s).
 *
 * You may obtain a valid license at the URLs below.
 *
 * Webfont: HelveticaNeueLT-Roman by Linotype
 * URL: http://www.myfonts.com/fonts/linotype/neue-helvetica/helvetica-55-roman/
 * Copyright: Part of the digitally encoded machine readable outline data for producing the Typefaces provided is copyrighted © 1988 - 2006 Linotype GmbH, www.linotype.com. All rights reserved. This software is the property of Linotype GmbH, and may not be repro
 * Licensed pageviews: 250,000
 *
 *
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=3046088
 *
 * © 2015 MyFonts Inc
*/

@font-face {
  font-family: 'HelvNeue';
  src:  url('font/Helvetica Neue.woff2') format('woff2'),
  url('font/Helvetica Neue.woff') format('woff');
}

/* Designed & Developed by Erik Zuuring - http://erikzuuring.com */

/* ==========================================================================
HTML5 display definitions
========================================================================== */


article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; height: 0; }

[hidden] { display: none; }

/* ==========================================================================
Base
========================================================================== */

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,300,600,700,800);

html { font-size: 100%; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
-ms-text-size-adjust: 100%; /* 2 */
}
html, html a { -webkit-font-smoothing: antialiased; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004); }
html, button, input, select, textarea { font-family: "HelvNeue",sans-serif; border: none;}
body { margin: 0; font-family: "HelvNeue",sans-serif; }

a:focus { outline: thin dotted; }
a:active, a:hover { outline: 0; color:#3d8cc5;}

h1, h2 {
  font-family: "Open Sans", sans-serif;
}

h1 { font-size: 2em; margin: 0.67em 0; color: #cbcbcb; }
h2 { font-size: 1.5em; margin: 0.83em 0; }
h3 { font-size: 18px; margin: 1em 0; line-height: 48px; font-weight: 400;}
h4 { font-size: 1em; margin: 1.33em 0; }
h5 { font-size: 0.83em; margin: 1.67em 0; }
h6 { font-size: 0.75em; margin: 2.33em 0; }

abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }
h3 strong { color: #17b1a5;}
blockquote { margin: 1em 40px; }

dfn { font-style: italic; }

mark { background: #ff0; color: #000; }

p, pre { margin: 1em 0; }

code, kbd, pre, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }

pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }

q:before, q:after { content: ''; content: none; }
small { font-size: 75%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

dl, menu, ol, ul { margin: 1em 0; }
dd { margin: 0 0 0 40px; }

menu, ol, ul { padding: 0 0 0 40px; }

nav ul, nav ol { list-style: none; list-style-image: none; }


img { border: 0;  overflow: hidden; }


figure { margin: 0; }

form { margin: 0; max-width: 1080px; margin: auto; }

fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

legend { border: 0; /* 1 */
        padding: 0; white-space: normal; /* 2 */
*margin-left: -7px; /* 3 */ }

button, input, select, textarea { font-size: 100%; /* 1 */
        margin: 0; /* 2 */
        vertical-align: baseline; /* 3 */
*vertical-align: middle; /* 3 */ }

button, input { line-height: normal; }

button, html input[type="button"], /* 1 */
input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */
        cursor: pointer; /* 3 */
*overflow: visible; /* 4 */ }

button[disabled], input[disabled] { cursor: default; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */
        padding: 0; /* 2 */
        *height: 13px; /* 3 */
*width: 13px; /* 3 */ }

input[type="search"] { -webkit-appearance: textfield; /* 1 */
        -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */
box-sizing: content-box; }

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

textarea { overflow: auto; /* 1 */
vertical-align: top; /* 2 */ }

table { border-collapse: collapse; border-spacing: 0; }


/* ==========================================================================
Global Styles
========================================================================== */
a { color: #31b770; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; }
a:hover, a:focus { color: #31b770; text-decoration: none; }
p { color: #868686; word-spacing: 1px; line-height: 32px; font-size: 18px; }
h2 { font-size: 32px;color: #31b770;font-weight: 200!important;}

.section-padding { padding: 100px 0 80px!important }
.divider {margin-top: 40px;}
.wrapper { height: 400px;}
.nopadding { padding: 0; }
.inner { padding-top: 80px; }
.arrow a {outline: 0;}
.container {max-width: 860px;}


/* ==========================================================================
Hero
========================================================================== */
.hero { background: #343939 url('../img/bg.jpg') no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; padding: 145px 0 40px 0; height: 100vh; }
.hero h1 { color: #fff; font-size: 38px; font-weight:200; margin: 40px; font-family: "Open Sans",sans-serif;}
.hero h1 span { color: #FFF; display: inline-block; }
.hero img { max-width: 300px;   margin-left: -40px;}
.hero h3 { color:#fff; font-size: 22px; font-weight: 600; text-align:center;}
.hero .featr {width: 100px; height: 100px; }
.hero p { letter-spacing: 1px; color: #fff; font-size: 21px; font-weight: 200; }
.hero .fa, .hero .fa a{font-size: 38px;color: #fff; margin-top: 20px;padding:10px;opacity: 0.5;transition: opacity 0.2s ease-in-out;cursor:pointer;outline: 0}
.hero .fa:hover {opacity: 1}



/* ==========================================================================
Content
========================================================================== */

.content {padding-top: 160px; padding-bottom: 120px; margin-top: -40px;}



/* ==========================================================================
Footer
========================================================================== */
footer a { color: #a1a9b0; }
footer { background-color: #eaebeb; padding: 40px 0 30px; }
footer .fa {font-size: 32px;padding-right: 10px}


/* ==========================================================================
Waypoints
========================================================================== */
.wp1, .wp2, .wp3, .wp4, .wp5, .wp6 { visibility: hidden; }
.bounceInLeft, .bounceInRight, .fadeInUp, .fadeInUpDelay, .fadeInDown, .fadeInUpD, .fadeInLeft, .fadeInRight { visibility: visible; }
.delay-05s { animation-delay: 0.5s; -webkit-animation-delay: 0.5s; }
.delay-1s { animation-delay: 1s; -webkit-animation-delay: 1s; }
.wp3 { background: url('../img/iphone-bg.png') no-repeat center center; background-position: 200px 10px; height: 100%; }

@-webkit-keyframes slideIn {
    0% {
        left: 9%;
        opacity: 0;
    }
    100% {
        left: 0;
        opacity: 1;
    }
}
@-moz-keyframes slideIn {
    0% {
        left: 9%;
        opacity: 0;
    }
    100% {
        left: 0;
        opacity: 1;
    }
}
@-o-keyframes slideIn {
    0% {
        left: 9%;
        opacity: 0;
    }
    100% {
        left: 0;
        opacity: 1;
    }
}
@keyframes slideIn {
    0% {
        left: 9%;
        opacity: 0;
    }
    100% {
        left: 0;
        opacity: 1;
    }
}



@media screen and (max-width:480px) {

  .hero h1 {font-size: 38px;}
  .hero p {font-size: 18px;}
  .hero .fa { font-size: 28px;}

}

/* Bootstrap 990px Breakpoint to 480px */
@media screen and (min-width:480px) and (max-width:991px) {
  .hero h1 {font-size: 38px;}
  .hero p {font-size: 18px;}

}