/*-------------------------------------------------------------------------------------
Theme Name:	AppStrap
Theme URI: 	http://demo.bhardwaja.com/html/appstrap/
Version:	1.0
Author:		Avinash
-------------------------------------------------------------------------------------*/

/*-------------------------------------------------------------------------------------
COLOR CODES
body Text Color :     #555555;
background-gray :     #f9f9f9;
Text:	              #555555;
Text Light :          #fff;
Links:   	      #F1C40F;
Hover:		      #F1C40F
-------------------------------------------------------------------------------------*/	

/*-------------------------------------------------------------------------------------
-- TYPOGRAPHY All copy:  Open Sans
-------------------------------------------------------------------------------------*/

/*-------------------------------------------------------------------------------------
Table of contents

- General Styles
- Typography
- Bug Fixes
- Buttons Styles 
- Columns of same height styles
- Clearfix Styles
- Border Styles
- Background Style
- Padding Style
- Margin Style
- Position Style
- Parallax Style
- Preloader Style
- Arrows And Separator Styles
- Nivo Lightbox Styles
- Navigation Styles
- Header Styles
- Page Title Styles
- About Styles 
- Features Styles
	- Feature list 1
	- Feature list 2
	- Feature list 3
- Counters Styles
- Screenshot Styles
- Team Style
- Testimonial Styles
- Client Styles
- Download App
- Contact Styles
- Footer Styles
- OS Select Styles
- Animation Styles
-------------------------------------------------------------------------------------*/	


/*-----------------------------------------------------------------------------------*/
/*	 General Styles                                                              */
/*-----------------------------------------------------------------------------------*/

body,html {
    height: 100%;
}
body {
    font-size: 24px;
    line-height: 30px;
    letter-spacing: 0;
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    font-weight: lighter!important;
    word-wrap: break-word;
    -webkit-font-smoothing: antialiased !important;
    color: #555;
    overflow-x: hidden;
}

a {
    text-decoration: none;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

a:hover,
a:focus,
a:active {
    color: #F1C40F;
    text-decoration: none;
    outline: none !important;
}

a:focus,
.btn:focus {
    outline: none;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

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

textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"],
input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"],
input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"],
.uneditable-input {
    outline: none;
}


/*-----------------------------------------------------------------------------------*/
/*	Typography
/*-----------------------------------------------------------------------------------*/
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 10px 0;
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    font-style: normal;
    color: #555;
}

h1.light, 
h2.light, 
h3.light, 
h4.light, 
h5.light, 
h6.light {
    color: #fff !important;
}

h1.uppercase,
h2.uppercase,
h3.uppercase,
h4.uppercase,
h5.uppercase,
h5.uppercase {
    text-transform: uppercase;
}

h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
    margin-top: 0;
}

h1:last-child,
h2:last-child,
h3:last-child,
h4:last-child,
h5:last-child,
h6:last-child {
    margin-bottom: 0;
}

h1 {
    font-size: 48px;
    line-height: 52px;
}

h2 {
    font-size: 38px;
    line-height: 42px;
}

h3 {
    font-size: 32px;
    line-height: 32px;
}

h4 {
    font-size: 24px;
    line-height: 24px;
}

h5 {
    font-size: 18px;
    line-height: 18px;
}

h6 {
    font-size: 14px;
    line-height: 18px;
}

p {
    font-weight: 300;
    font-size: 18px;
    font-weight: lighter!important;
    line-height: 22px;
}

p:last-child {
    margin-bottom: 0;
}

p.light {
    color: #fff;
}

p strong {
    font-weight: 700;
    font-style: normal;
}

p em {
    font-weight: 300;
    font-style: italic;
}

/*-----------------------------------------------------------------------------------*/
/*	Bug Fixes
/*-----------------------------------------------------------------------------------*/
/* chrome fontface fix */
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
        font-family: 'FontAwesome';
        src: url('fonts/fontawesome-webfont.svg?v=4.0.3#fontawesomeregular') format('svg');
    }
}
/* Internet Explorer 10 in Windows 8 and Windows Phone 8 Bug fix */

@-webkit-viewport {
    width: device-width;
}

@-moz-viewport {
    width: device-width;
}

@-ms-viewport {
    width: device-width;
}

@-o-viewport {
    width: device-width;
}

@viewport {
    width: device-width;
}

/*-----------------------------------------------------------------------------------*/
/*	Buttons Styles
/*-----------------------------------------------------------------------------------*/
.btn-appstrap,
.btn-appstrap:focus {
    border: none;
    font-size: 18px;
    cursor: pointer;
    padding: 20px 40px;
    display: inline-block;
    margin:20px 0;
    text-decoration: none;
    font-weight: 400;
    outline: none;
    position: relative;
    background: #3b3b3b;
    color: #fff;
    border-radius: 0;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
}

.btn-appstrap:hover,
.btn-appstrap:active {
    color: #fff;
    background: #F1C40F;
    text-decoration: none;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
}

.btn-appstrap.transparent,
.btn-appstrap.transparent:focus {
    background: transparent;
    padding: 18px 38px;
    border:1px solid #fff;
    box-shadow: none;
    text-decoration: none;
    -webkit-transition:all .2s ease-out;
    transition:all .2s ease-out;
}

.btn-appstrap.transparent:hover,
.btn-appstrap.transparent:active {
    background:transparent;
    border:1px solid#F1C40F;
    color:#F1C40F;
    top:0;
    box-shadow:0 3px rgba(0,0,0,0.1);
    text-decoration: none;
}

.btn-appstrap.white,
.btn-appstrap.white:focus {
    background: #fff;
    color:#555;
    box-shadow: none;
    text-decoration: none;
    -webkit-transition:all .2s ease-out;
    transition:all .2s ease-out;
}

.btn-appstrap.white:hover,
.btn-appstrap.white:active {
    color: #fff;
    background: #F1C40F;
    top:0;
    text-decoration: none;
}


.btn-appstrap [class*=fa]{
    margin-right:10px;
}

.btn + .btn {
    margin-left:10px;
}
/* Button Color */
.btn-submit{
    padding: 10px 30px;
    color:#fff;
    font-size: 21px;
    font-weight: 300;
    background:#F1C40F;
    outline: none !important;
    border-radius: 0;
    transition: opacity .2s ease-out;
}
.btn-submit:hover{
    color:#fff;
    opacity: 0.5;
}
.btn-submit:focus,
.btn-submit:active{
    color:#fff;
}
.btn-submit .fa{
    margin-right: 15px;
}

/*-----------------------------------------------------------------------------------*/
/*	Columns of same height styles
/*-----------------------------------------------------------------------------------*/
/* columns of same height styles */
.container-fluid {
    width: 100%;
}
/* firefox fix */
.img-responsive {
    width: 100%;
}
/* vertical alignment styles */
.col-top {
    vertical-align: top;
}

.col-middle {
    vertical-align: middle;
}

.col-bottom {
    vertical-align: bottom;
}

.container-xs-height {
    display: table;
    padding-left: 0px;
    padding-right: 0px;
}

.row-xs-height {
    display: table-row;
}

.col-xs-height {
    display: table-cell;
    float: none;
}

@media (min-width: 768px) {
    .container-sm-height {
        display: table;
        padding-left: 0px;
        padding-right: 0px;
    }

    .row-sm-height {
        display: table-row;
    }

    .col-sm-height {
        display: table-cell;
        float: none;
    }
}

@media (min-width: 992px) {
    .container-md-height {
        display: table;
        padding-left: 0px;
        padding-right: 0px;
    }

    .row-md-height {
        display: table-row;
    }

    .col-md-height {
        display: table-cell;
        float: none;
    }
}

@media (min-width: 1200px) {
    .container-lg-height {
        display: table;
        padding-left: 0px;
        padding-right: 0px;
    }

    .row-lg-height {
        display: table-row;
    }

    .col-lg-height {
        display: table-cell;
        float: none;
    }
}

/*-----------------------------------------------------------------------------------*/
/*	Clearfix Styles
/*-----------------------------------------------------------------------------------*/
.cf:before,
.cf:after {
    content: " ";
 /* 1 */
    display: table;
 /* 2 */
    ;
}

.cf:after {
    clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
    *zoom: 1;
}
/*-----------------------------------------------------------------------------------*/
/*	Border Styles
/*-----------------------------------------------------------------------------------*/
.border-right {
    border-right: 1px solid#ccc;
}

.border-left {
    border-left: 1px solid#ccc;
}

.border-top {
    border-top: 1px solid#ccc;
}

.border-bottom {
    border-bottom: 1px solid#ccc;
}
/*-----------------------------------------------------------------------------------*/
/*	Background Style
/*-----------------------------------------------------------------------------------*/
.background-white {
    background: #fff;
}

.background-gray {
    background: #f9f9f9;
}
/*-----------------------------------------------------------------------------------*/
/*	Padding Style
/*-----------------------------------------------------------------------------------*/
/* Padding Top / Bottom */
.padding-tb-none {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.padding-tb-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.padding-tb-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.padding-tb-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
}

.padding-tb-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

.padding-tb-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}

.padding-tb-60 {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
}

.padding-tb-70 {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
}

.padding-tb-80 {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}

.padding-tb-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
}

.padding-tb-100 {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
}


/* Padding Left / Right */
.padding-lr-none {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.padding-lr-10 {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.padding-lr-20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.padding-lr-30 {
    padding-left: 30px !important;
    padding-right: 30px !important;
}

.padding-lr-40 {
    padding-left: 40px !important;
    padding-right: 40px !important;
}

.padding-lr-50 {
    padding-left: 50px !important;
    padding-right: 50px !important;
}

.padding-lr-60 {
    padding-left: 60px !important;
    padding-right: 60px !important;
}

.padding-lr-70 {
    padding-left: 70px !important;
    padding-right: 70px !important;
}

.padding-lr-80 {
    padding-left: 80px !important;
    padding-right: 80px !important;
}

.padding-lr-90 {
    padding-left: 90px !important;
    padding-right: 90px !important;
}

.padding-lr-100 {
    padding-left: 100px !important;
    padding-right: 100px !important;
}
/*-----------------------------------------------------------------------------------*/
/*	Margin Style
/*-----------------------------------------------------------------------------------*/
.margin-tb-none {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

.margin-tb-10 {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

.margin-tb-20 {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}

.margin-tb-30 {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}

.margin-tb-40 {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
}

.margin-tb-50 {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
}

.margin-tb-60 {
    margin-top: 60px !important;
    margin-bottom: 60px !important;
}

.margin-tb-70 {
    margin-top: 70px !important;
    margin-bottom: 70px !important;
}

.margin-tb-80 {
    margin-top: 80px !important;
    margin-bottom: 80px !important;
}

.margin-tb-90 {
    margin-top: 90px !important;
    margin-bottom: 90px !important;
}

.margin-tb-100 {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
}


/* Margin Left / Right */
.margin-lr-none {
    margin-left: 0px !important;
    margin-right: 0px !important;
}

.margin-lr-10 {
    margin-left: 10px !important;
    margin-right: 10px !important;
}

.margin-lr-20 {
    margin-left: 20px !important;
    margin-right: 20px !important;
}

.margin-lr-30 {
    margin-left: 30px !important;
    margin-right: 30px !important;
}

.margin-lr-40 {
    margin-left: 40px !important;
    margin-right: 40px !important;
}

.margin-lr-50 {
    margin-left: 50px !important;
    margin-right: 50px !important;
}

.margin-lr-60 {
    margin-left: 60px !important;
    margin-right: 60px !important;
}

.margin-lr-70 {
    margin-left: 70px !important;
    margin-right: 70px !important;
}

.margin-lr-80 {
    margin-left: 80px !important;
    margin-right: 80px !important;
}

.margin-lr-90 {
    margin-left: 90px !important;
    margin-right: 90px !important;
}

.margin-lr-100 {
    margin-left: 100px !important;
    margin-right: 100px !important;
}
/*-----------------------------------------------------------------------------------*/
/*	Position Style
/*-----------------------------------------------------------------------------------*/ 
.posisonfixed {
    position: fixed;
}

.posisonrelative {
    position: relative;
}

.posisonabsolute {
    position: absolute;
}

.posisoninherit {
    position: inherit;
}

.posisoninitial {
    position: initial;
}

.posisonstatic {
    position: static;
}

/*-----------------------------------------------------------------------------------*/
/*	Parallax Style
/*-----------------------------------------------------------------------------------*/  
.parallax-bg {
    background-repeat: no-repeat;
    background-position: 50% 0;
    background-size: cover;
    background-attachment: fixed;
}

.touch .parallax-bg {
    background-attachment: scroll;
}
/*-----------------------------------------------------------------------------------*/
/*	Preloader Style
/*-----------------------------------------------------------------------------------*/ 
#page-loader {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: #fff;
    z-index: 99999;
}

#page-loader .page-loader-gif {
    display: block;
    width: 100%;
    height: 64px;
    position: absolute;
    top: 50%;
    left: 0;
    margin: -32px 0 0;
    font-size: 21px;
    line-height: 58px;
    text-align: center;
    color: #555;
    color: rgba(0,0,0,0.5);
}
/*-----------------------------------------------------------------------------------*/
/*	Arrows And Separator Styles
/*-----------------------------------------------------------------------------------*/ 
.arrows_box {
    width: 100%;
    height: 45px;
    border-bottom: solid 1px #cccccc;
    position: absolute;
    bottom: 0;
}
.arrows_no_border {
    border-bottom: none;
}
.arrows {
    display: inline;
    left: 50%;
    margin-left: -92px;
    position: relative;
    background:transparent;
    z-index: 999;
}

.arrows a {
    text-decoration: none;
}

.arrow_down,.arrow_up {
    margin: 0;
    width: 90px;
    height: 90px;
    border: 1px solid#ccc;
    background: #fff;
    display: inline-block;
    border-radius: 100%;
}

.arrow_down i,.arrow_up i {
    color: #ccc;
    display: block;
    font-size: 35px;
    line-height: 90px;
    text-align: center;
}

.arrow_down:hover, .arrow_up:hover {
    cursor: pointer;
}
/*-----------------------------------------------------------------------------------*/
/*	Nivo Lightbox Styles
/*-----------------------------------------------------------------------------------*/ 
.nivo-lightbox-theme-default.nivo-lightbox-overlay {
    background: rgba(255,255,255,0.9);
}

.nivo-lightbox-theme-default .nivo-lightbox-nav:hover {
    background-color: rgba(255,255,255,0.5);
}

/*-----------------------------------------------------------------------------------*/
/*	Navigation Styles 
/*-----------------------------------------------------------------------------------*/ 
.sticky-wrapper {
    background: #000;
}

#main-nav {
    position: static;
    top: -70px;
    background: #fff;
    color: #555;
    box-shadow: none;
    width: 100%;
    border-bottom: 1px solid #e5e5e5;
    -webkit-transition: box-shadow .2s ease-out, top .3s ease-out .1s;
    transition: box-shadow .2s ease-out, top .3s ease-out .1s;
    z-index: 999999;
    margin: 0;
    padding: 15px 0;
}

#main-nav.stuck {
    position: fixed;
    top: 0;
    left: 0;
    border-bottom: 1px solid #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

#main-nav .navbar-toggle {
    border: 1px solid #4E5961;
    border-radius: 0;
}

#main-nav .icon-bar {
    background: #4E5961;
}

.navbar-brand,
.navbar-brand:hover,
.navbar-brand:active,
.navbar-brand:focus {
    position: relative;
    padding: 0 10px;
    font-size: 28px;
    line-height: 54px;
    height: 50px;
    font-weight: 600;
    color: #F1C40F;
    font-variant: small-caps;
    letter-spacing: 0.02em;
    -webkit-transition: font-size .2s ease-out;
    transition: font-size .2s ease-out;
    overflow: hidden;
}

.site-logo {
    height: 50px;
    margin: 0;
    top: 0;
    vertical-align: top;
}

#main-nav .container {
    padding: 0 20px;
    -webkit-transition: padding 0.3s ease-out;
    transition: padding 0.3s ease-out;
}

#main-nav .nav a {
    position: relative;
    z-index: 1;
}

#main-nav .nav a,
#main-nav .nav a:active,
#main-nav .nav a:hover {
    padding: 5px 15px;
    font-size: 18px;
    line-height: 38px;
    font-weight: 300;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    background: transparent;
    color: #555;
    opacity: 0.5;
    -webkit-transition: opacity 0.2s ease-out;
    transition: opacity 0.2s ease-out;
    border-top: 1px solid#ccc;
}

#main-nav.stuck .nav .active a,
#main-nav .nav a:hover {
    opacity: 1;
}

#main-nav .nav .active a {
    border-left: 1px solid#F1C40F;
    border-bottom: 1px solid#F1C40F;
    color:#F1C40F;
    font-weight: 300;
    border-top: none;
}

#main-nav li {
    background: transparent;
    margin: 0 10px;
}

#main-nav .dropdown-menu a {
    font-size: 14px;
}
/*-----------------------------------------------------------------------------------*/
/*	Header Styles
/*-----------------------------------------------------------------------------------*/ 
#header {
    display: table;
    height: 100%;
    width: 100%;
    position: relative;
}

#header .header-content {
    position: relative;
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

#header .scroll-button {
    color: #fff;
    position: absolute;
    bottom: 30px;
    left: 50%;
    margin-left: -35px;
    padding: 20px;
    -webkit-animation: moving 2s ease-out infinite;
    animation: moving 2s ease-out infinite;
}

#header  .scroll-button i {
    color: #fff;
    font-size: 72px;
}
#header .header-logo {
    width: 100%;
    position: absolute;
    max-width: 250px;
    top: 22px;
    left:50%;
    margin-left: -125px;
    text-align: center;
}


#header .header-logo img {
    width: 100%;
}

#header .header-carousel-slider {
    text-align: center;
    position: absolute;
    width: 100%;
    margin-top: -80px;
    display: block;
}

#header .slider-text {
    padding: 20px 0;
}

#header .header-item h1:after {
    content: "";
    width: 250px;
    height: 1px;
    border: 1px solid #F1C40F;
    text-align: center;
    margin: 20px auto 0;
    display: block;
}
/*-----------------------------------------------------------------------------------*/
/*	Page Title Styles
/*-----------------------------------------------------------------------------------*/
.page-title {
    width: 100%;
    display: inline-block;
}

.page-title > .left-col {
    padding: 0 5%;
    width: 100%;
    text-align: right;
}

.page-title .right-col {
    padding: 0 5%;
    width: 100%;
    text-align: left;
}

.page-title h1:after {
    content: "";
    max-width: 250px;
    height: 1px;
    border: 1px solid #F1C40F;
    text-align: center;
    margin: 15px auto;
    display: block;
}

.page-title .left-col:after {
    max-width: 50%;
    margin: 10px 0 10px 50%;
}

.page-title .right-col:after {
    max-width: 50%;
    margin: 10px 50% 10px 0;
}
/*-----------------------------------------------------------------------------------*/
/*	About Styles
/*-----------------------------------------------------------------------------------*/
#about {
    position: relative;
}

#about .app-users {
    position: relative;
}

#about .app-users #user {
    width: 100%;
    zoom: 1;
}

#about .app-users #user:before, .app-users #user:after {
    content: "";
    display: table;
}

#about .app-users #user:after {
    clear: both;
}

#about .app-users #user img {
    float: left;
     /* Firefox */
    width: -moz-calc(100% / 15);
    /* WebKit */
    width: -webkit-calc(100% / 15);
    /* Opera */
    width: -o-calc(100% / 15);
    /* Standard */
    width: calc(100% / 15);
    /* Older Browser */
    width:6.66666666667%;
    height: auto;
    position: relative;
/*padding:0 1px 1px 0;*/
    -khtml-opacity: 0;
    -moz-opacity: 0;
    -webkit-opacity: 0;
    -o-opacity: 0;
    -ms-opacity: 0;
    opacity: 0;
    -ms-filter: "alpha(opacity=0)";
    filter: alpha(opacity=0);
    -moz-transition: opacity 1.5s ease-in-out;
    -o-transition: opacity 1.5s ease-in-out;
    -webkit-transition: opacity 1.5s ease-in-out;
    -ms-transition: opacity 1.5s ease-in-out;
    transition: opacity 1.5s ease-in-out;
    z-index: 5;
}

#about .app-users #user img.loaded {
    -khtml-opacity: .5;
    -moz-opacity: .5;
    -webkit-opacity: .5;
    -o-opacity: .5;
    -ms-opacity: .5;
    opacity: .15;
    -ms-filter: "alpha(opacity=20)";
    filter: alpha(opacity=20);
}

#about .app-users #user img.loaded:hover {
    -khtml-opacity: 1;
    -moz-opacity: 1;
    -webkit-opacity: 1;
    -o-opacity: 1;
    -ms-opacity: 1;
    opacity: 1;
    -ms-filter: "alpha(opacity=100)";
    filter: alpha(opacity=100);
    -moz-transition: opacity .15s ease-in-out;
    -o-transition: opacity .15s ease-in-out;
    -webkit-transition: opacity .15s ease-in-out;
    -ms-transition: opacity .15s ease-in-out;
    transition: opacity .15s ease-in-out;
    border-color: transparent;
}

#about .app-users-count {
    width: 50%;
    height: 50%;
    padding: 20px 0;
    overflow: hidden;
    position: absolute;
    
      /* Firefox */
    left: -moz-calc(100% / 2 - 25%);
    /* WebKit */
    left: -webkit-calc(100% / 2 - 25%);
    /* Opera */
    left: -o-calc(100% / 2 - 25%);
    /* Standard */
    left: calc(100% / 2 - 25%);
    /* Older Browser */
    left:50%;
    margin-left:-25%;
    top:25%;
    
    background: #eee;
    -moz-box-shadow: inset 0 0 10px #aaa;
    -webkit-box-shadow: inset 0 0 10px #aaa;
    box-shadow: inset 0 0 10px #aaa;
}

#about .app-users-count h2, #about .app-users-count h3 {
    text-align: center;
    padding: 20px 0;
}
/*-----------------------------------------------------------------------------------*/
/*	Features Styles
/*-----------------------------------------------------------------------------------*/
#features-1 {
    position: relative;
}

/* Feature list 1 Column 1 */
#features-1 .feature-list-1-col-1 > li {
    position: relative;
    border-bottom: 1px solid#ccc;
    text-align: right;
}

#features-1 .feature-list-1-col-1 h2 {
}

#features-1 .feature-list-1-col-1 p {
}

#features-1 .feature-list-1-col-1 > li >.icon {
    text-align: center;
    position: relative;
    border: 3px solid#555555;
    border-radius: 100%;
}

#features-1 .feature-list-1-col-1 > li >.icon.left {
    width: 90px;
    height: 90px;
    float: right;
}

#features-1 .feature-list-1-col-1 > li >.icon.right {
    width: 90px;
    height: 90px;
    float: left;
}

#features-1 .feature-list-1-col-1 > li >.icon>i {
    font-size: 36px;
    line-height: 80px;
    position: relative;
}

#features-1 .feature-list-1-col-1 > li:last-child {
    border-bottom: none;
}
/* Feature list 1 Column 2 */
#features-1 .feature-list-1-col-2 > li {
    position: relative;
    border-bottom: 1px solid#ccc;
    text-align: left;
}

#features-1 .feature-list-1-col-2 h2 {
}

#features-1 .feature-list-1-col-2 p {
}

#features-1 .feature-list-1-col-2 > li >.icon {
    text-align: center;
    position: relative;
    border: 3px solid#555555;
    border-radius: 100%;
}

#features-1 .feature-list-1-col-2 > li >.icon.left {
    width: 90px;
    height: 90px;
    float: right;
}

#features-1 .feature-list-1-col-2 > li >.icon.right {
    width: 90px;
    height: 90px;
    float: left;
}

#features-1 .feature-list-1-col-2 > li >.icon>i {
    font-size: 36px;
    line-height: 80px;
    position: relative;
}

#features-1 .feature-list-1-col-2 > li:last-child {
    border-bottom: none;
}

/* Feature list 1 LIST HOVER */
#features-1 .feature-list-1-col-1 > li:hover,#features-1 .feature-list-1-col-2 > li:hover {
    border-bottom: 1px solid#F1C40F;
}

#features-1 .feature-list-1-col-1 > li:last-child:hover,#features-1 .feature-list-1-col-2 > li:last-child:hover {
    border-bottom: none;
}

#features-1 .feature-list-1-col-1 > li:hover .icon,#features-1 .feature-list-1-col-2 > li:hover .icon {
    border: 3px solid#F1C40F;
    cursor: pointer;
}

#features-1 .feature-list-1-col-1 > li:hover .icon i,#features-1 .feature-list-1-col-2 > li:hover .icon i {
    color: #F1C40F;
}


/*  FEATURE LIST 2 ============================== */
#features-2 {
}

#features-2 .feature-list-2 {
    position: relative;
}
/* Feature list 2 Column 1 */
#features-2 .feature-list-2-col-1 {
    position: relative;
    padding:0;
    margin:0;
}

#features-2 .feature-list-2-col-1 > li {
    position: relative;
    border-bottom: 1px solid#ccc;
    text-align: right;
}

#features-2 .feature-list-2-col-1 > li:before {
    content: "";
    position: absolute;
    height: 25px;
    width: 25px;
    background-color: #fff;
    bottom: -12px;
    border-radius: 100%;
    right: 0;
}

#features-2 .feature-list-2-col-1 > li:last-child:before {
    height: 0;
    width: 0;
    border-radius: 0;
}

#features-2 .feature-list-2-col-1 h4 {
    color: #fff;
}

#features-2 .feature-list-2-col-1 p {
    font-size: 18px;
    line-height: 22px;
}

#features-2 .feature-list-2-col-1 > li >.icon {
    color: #fff;
    text-align: center;
    position: relative;
    border: 5px solid#fff;
    border-radius: 100%;
}

#features-2 .feature-list-2-col-1 > li >.icon.left {
    width: 90px;
    height: 90px;
    float: right;
}

#features-2 .feature-list-2-col-1 > li >.icon.right {
    width: 90px;
    height: 90px;
    float: left;
}

#features-2 .feature-list-2-col-1 > li >.icon>i {
    font-size: 36px;
    line-height: 80px;
    position: relative;
}

#features-2 .feature-list-2-col-1 > li:last-child {
    border-bottom: none;
}

/* Feature list 2 Column 2 */
#features-2 .feature-list-2-col-2{
    padding: 0;
}
#features-2 .feature-list-2-col-2 > li {
    position: relative;
}

#features-2 .feature-list-2-col-2 > li > .responsive {
    width: 60%;
    margin: 0 auto;
    position: relative;
}

#features-2 .feature-list-2-col-2 > li > .responsive img {
    width: 100%;
}

#features-2 .feature-list-2-col-2 > li > .responsive > span.arrow-tl {
    width: 50%;
    top: 25%;
    z-index: 1;
    left: -25%;
    position: absolute;
    border-bottom: 2px solid #ecedee;
}

#features-2 .feature-list-2-col-2 > li > .responsive > span.arrow-tl:before {
    content: "";
    position: absolute;
    height: 25px;
    width: 25px;
    background-color: #fff;
    bottom: -12px;
    border-radius: 100%;
    right: 0;
}

#features-2 .feature-list-2-col-2 > li > .responsive > span.arrow-tr {
    width: 50%;
    top: 25%;
    z-index: 1;
    right: -25%;
    position: absolute;
    border-bottom: 2px solid #ecedee;
}

#features-2 .feature-list-2-col-2 > li > .responsive > span.arrow-tr:before {
    content: "";
    position: absolute;
    height: 25px;
    width: 25px;
    background-color: #fff;
    bottom: -12px;
    border-radius: 100%;
    left: 0;
}

#features-2 .feature-list-2-col-2 > li > .responsive > span.arrow-bl {
    width: 50%;
    top: 75%;
    z-index: 1;
    left: -25%;
    position: absolute;
    border-bottom: 2px solid #ecedee;
}

#features-2 .feature-list-2-col-2 > li > .responsive > span.arrow-bl:before {
    content: "";
    position: absolute;
    height: 25px;
    width: 25px;
    background-color: #fff;
    bottom: -12px;
    border-radius: 100%;
    right: 0;
}

#features-2 .feature-list-2-col-2 > li > .responsive > span.arrow-br {
    width: 50%;
    top: 75%;
    z-index: 1;
    right: -25%;
    position: absolute;
    border-bottom: 2px solid #ecedee;
}

#features-2 .feature-list-2-col-2 > li > .responsive > span.arrow-br:before {
    content: "";
    position: absolute;
    height: 25px;
    width: 25px;
    background-color: #fff;
    bottom: -12px;
    border-radius: 100%;
    left: 0;
}
/* Feature list 2 Column 3 */
#features-2 .feature-list-2-col-3 {
    padding:0;
    margin:0;
}

#features-2 .feature-list-2-col-3 > li {
    position: relative;
    border-bottom: 1px solid#ccc;
    text-align: left;
}

#features-2 .feature-list-2-col-3 > li:first-child:before {
    content: "";
    position: absolute;
    height: 25px;
    width: 25px;
    background-color: #fff;
    bottom: -12px;
    border-radius: 100%;
    left: 0;
}

#features-2 .feature-list-2-col-3 h4 {
    color: #fff;
}

#features-2 .feature-list-2-col-3 p {
    font-size: 18px;
    line-height: 22px;
}

#features-2 .feature-list-2-col-3 > li >.icon {
    color: #fff;
    text-align: center;
    position: relative;
    border: 5px solid#fff;
    border-radius: 100%;
}

#features-2 .feature-list-2-col-3 > li >.icon.left {
    width: 90px;
    height: 90px;
    float: right;
}

#features-2 .feature-list-2-col-3 > li >.icon.right {
    width: 90px;
    height: 90px;
    float: left;
}

#features-2 .feature-list-2-col-3 > li >.icon>i {
    font-size: 36px;
    line-height: 80px;
    position: relative;
}

#features-2 .feature-list-2-col-3 > li:last-child {
    border-bottom: none;
}



/* Feature list 2 LIST HOVER */
#features-2 .feature-list-2-col-1 > li:hover,#features-2 .feature-list-2-col-3 > li:hover {
    border-bottom: 1px solid#F1C40F;
}

#features-2 .feature-list-2-col-1 > li:last-child:hover,#features-2 .feature-list-2-col-3 > li:last-child:hover {
    border-bottom: none;
}

#features-2 .feature-list-2-col-1 > li:hover .icon,#features-2 .feature-list-2-col-3 > li:hover .icon {
    border: 5px solid#F1C40F;
    cursor: pointer;
}

#features-2 .feature-list-2-col-1 > li:hover .icon i,#features-2 .feature-list-2-col-3 > li:hover .icon i {
    color: #F1C40F;
}

#features-2 .feature-list-2-col-1 > li:hover:before,#features-2 .feature-list-2-col-3 > li:hover:before {
    background: #F1C40F;
}

#features-2 .feature-list-2-col-1 > li:hover h4,#features-2 .feature-list-2-col-3 > li:hover h4,#features-2 .feature-list-2-col-1 > li:hover p,#features-2 .feature-list-2-col-3 > li:hover p {
    color: #F1C40F;
}


/*  FEATURE LIST 3 ============================== */
#features-3 {
    position: relative;
}

#features-3 .feature-list-3 {
    position: relative;
}

/* Feature list 3 Column 1 */
#features-3 .feature-list-3-col-1 > li {
    position: relative;
}

#features-3 .feature-list-3-col-1 h2 {
    padding-bottom: 15px;
}

#features-3 .feature-list-3-col-1 h4 {
    font-weight: 600;
    font-style: normal;
    padding-bottom: 15px;
}

#features-3 .feature-list-3-col-1 p {
    padding-top: 15px;
    border-top: 1px solid#ccc;
}

#features-3 .feature-list-3-col-1 > li.right {
    text-align: right;
    padding: 0 110px 0 0;
}

#features-3 .feature-list-3-col-1 > li.left {
    text-align: left;
    padding: 0 0 0 130px;
}

#features-3 .feature-list-3-col-1 > li >.icon {
    text-align: center;
    position: absolute;
    height: 100%;
    border: 1px solid#ccc;
    border-radius: 10px;
}

#features-3 .feature-list-3-col-1 > li >.icon.left {
    width: 100px;
    left: 0;
    top: 0;
}

#features-3 .feature-list-3-col-1 > li >.icon.right {
    width: 80px;
    right: 0;
    top: 0;
}

#features-3 .feature-list-3-col-1 > li >.icon>i {
    font-size: 36px;
    position: absolute;
    font-size: 36px;
    position: absolute;
        /* Firefox */
    left: -moz-calc(100% / 2 - 18px);
    /* WebKit */
    left: -webkit-calc(100% / 2 - 18px);
    /* Opera */
    left: -o-calc(100% / 2 - 18px);
    /* Standard */
    left: calc(100% / 2 - 18px);
    /* Older Browser */
    left:50%;
    margin-left:-18px;
    
        /* Firefox */
    top: -moz-calc(100% / 2 - 18px);
    /* WebKit */
    top: -webkit-calc(100% / 2 - 18px);
    /* Opera */
    top: -o-calc(100% / 2 - 18px);
    /* Standard */
    top: calc(100% / 2 - 18px);
    /* Older Browser */
    top:50%;
    margin-top:-18px;
}

/* Feature list 3 Column 2 */
#features-3 .feature-list-3-col-2 {
    position: relative;
}

#features-3 .feature-list-3-col-2 li {
    position: relative;
    max-width: 900px;
    margin: 0 auto;
}

#features-3 .feature-list-3-col-2 li > .responsive {
    width: 100%;
}

/* Feature list 3 LIST HOVER */
#features-3 .feature-list-3-col-1 > li:hover .icon {
    border: 1px solid#F1C40F;
}

#features-3 .feature-list-3-col-1 > li:hover p {
    border-top: 1px solid#F1C40F;
}

#features-3 .feature-list-3-col-1 > li:hover .icon i {
    color: #F1C40F;
}

/*-----------------------------------------------------------------------------------*/
/*	 Counters Styles
/*-----------------------------------------------------------------------------------*/
#counters {
}

#counters h1.counter {
}

#counters h1.counter+p {
    font-weight: 300;
}
/*-----------------------------------------------------------------------------------*/
/*	 Screenshot Styles
/*-----------------------------------------------------------------------------------*/
#screenshots {
    position: relative;
}

#screenshots .shot {
    display: block;
    width: 100%;
    max-height: 760px;
    float: left;
}

#screenshots .shot img {
    width: 100%;
    padding: 10px;
    border: 1px solid#ccc;
}
/*-----------------------------------------------------------------------------------*/
/*	Team Style
/*-----------------------------------------------------------------------------------*/
#team {
    position: relative;
}

#team .members {
    position: relative;
}

.member-pic {
    position: relative;
    text-align: center;
    border: 1px solid #ddd;
    border-bottom: none;
    overflow: hidden;
    width: 100%;
}

.member-pic img {
    -webkit-transition: -webkit-transform .2s ease-out;
    transition: transform .2s ease-out;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
    filter: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' height='0'><filter id='greyscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0' /></filter></svg>#greyscale");
    transition: all 0.2s ease-in-out, opacity 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out, opacity 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out, opacity 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out, opacity 0.2s ease-in-out;
}

.members:hover .member-pic img {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
    filter: none;
    -webkit-filter: grayscale(0%);
}

.member-position {
    width: 67%;
    height: 70px;
    position: absolute;
    background: #fff;
    right: 0;
    bottom: 40px;
    transform: rotate(17deg);
    -webkit-transform: rotate(17deg);
    -ms-transform: rotate(17deg);
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
}

.member-position h3 {
    position: relative;
    
        /* Firefox */
    top: -moz-calc(100% / 2 - 18px);
    /* WebKit */
    top: -webkit-calc(100% / 2 - 18px);
    /* Opera */
    top: -o-calc(100% / 2 - 18px);
    /* Standard */
    top: calc(100% / 2 - 18px);
    /* Older Browser */
    top:50%;
    margin-top:-18px;
    
}

.members:hover .member-pic .member-position {
    transform: rotate(1deg);
    -webkit-transform: rotate(-17deg);
    -ms-transform: rotate(-17deg);
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    cursor: pointer;
}

.members .member-detail {
    position: relative;
    background: #fff;
    border-top: none;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
    overflow: hidden;
}

.members  .member-social-icons {
    position: relative;
    margin:0;
    padding: 0;
}

.members   .member-social-icons li {
    position: relative;
    display: block;
    float: left;
    width: 20%;
}

.members  .member-social-icons li i {
    position: relative;
    width: 100%;
    padding: 20% 0;
    font-size: 38px;
    text-align: center;
    -moz-backface-visibility: hidden;
    -webkit-transition: all 0.9s;
    -moz-transition: all 0.9s;
    -o-transition: all 0.9s;
    transition: all 0.9s;
}

.members  .member-social-icons li.facebook i {
    color: #3b589e;
}

.members  .member-social-icons li.googleplus i {
    color: #da4835;
}

.members  .member-social-icons li.twitter i {
    color: #28aae1;
}

.members .member-social-icons li.dribbble i {
    color: #28aae1;
}

.members .member-social-icons li.linkedin i {
    color: #007bb6;
}

.members  .member-social-icons li.facebook:hover i {
    color: #fff;
    background-color: #3b589e;
}

.members  .member-social-icons li.googleplus:hover i {
    color: #fff;
    background-color: #da4835;
}

.members  .member-social-icons li.twitter:hover i {
    color: #fff;
    background-color: #28aae1;
}

.members  .member-social-icons li.dribbble:hover i {
    color: #fff;
    background-color: #cc3a71;
}

.members  .member-social-icons li.linkedin:hover i {
    color: #fff;
    background-color: #007bb6;
}
/*-----------------------------------------------------------------------------------*/
/*	Testimonial Styles
/*-----------------------------------------------------------------------------------*/ 
#testimonials {
}

#testimonials.feedback {
    width: 100%;
}

#testimonials .feedback .image {
    font-size: 24px;
    border: 2px solid transparent;
    -webkit-box-shadow: 0px 0px 0px 2px #ffffff;
    box-shadow: 0px 0px 0px 2px #ffffff;
    border-radius: 50%;
    width: 80px;
    height: 80px;
    line-height: 80px;
    margin: auto;
    margin-top: 5px;
    overflow: hidden;
}

#testimonials .feedback p {
}

#testimonials .feedback .image img {
    width: 100%;
    vertical-align: top;
}

#testimonials .owl-theme .owl-controls .owl-page span {
    background: #ffffff;
    border-radius: 50%;
}

#testimonials .customNavigation a {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
/*-----------------------------------------------------------------------------------*/
/*	Client Styles
/*-----------------------------------------------------------------------------------*/ 
#clients {
    position: relative;
    padding-left: 0 !important;
}

.client {
}

.client li {
      /* Firefox */
    width: -moz-calc(100% / 6);
    /* WebKit */
    width: -webkit-calc(100% / 6);
    /* Opera */
    width: -o-calc(100% / 6);
    /* Standard */
    width: calc(100% / 6);
    /* Older Browser */
    width: 16.6666666667%;
    float: left;
    padding: 20px;
    display: block;
}

.client li img {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

.client li img:hover {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.client li:nth-child(1n+1) {
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
}

.client li:nth-child(6),.client li:nth-child(12) {
    border-right: none;
}

.client li:nth-child(1n+7) {
    border-bottom: none;
}

/*-----------------------------------------------------------------------------------*/
/*	Download App
/*-----------------------------------------------------------------------------------*/ 
#download-app{}

#download-app .download-button li a i {
	margin-right: 18px;
	font-size: 34px;
	vertical-align: middle;
}

#download-app .download-button li a {
	color: #fff;
	line-height: 60px;
	font-size: 24px;
}

#download-app .download-button li {
	display: inline-block;
	padding:0 30px;
        border:1px rgba(255,255,255,0.5);
        border-bottom:3px rgba(255,255,255,0.5);
	margin-bottom: 30px;
	margin-right: 30px;
	border-radius: 10px;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

#download-app .download-button .apple:hover {
	background-color:rgba(94,94,94,0.9);
}

#download-app .download-button .android:hover {
	background-color:rgba(164,202,57,0.9);
}
#download-app .download-button .windows:hover {
	background-color:rgba(104,33,122,0.9);
}

/*-----------------------------------------------------------------------------------*/
/*	Contact Styles
/*-----------------------------------------------------------------------------------*/ 
#contact {
    position: relative;
}

#contact-form .form-group label {
    display: none;
    font-size: 18px;
    line-height: 24px;
    font-weight: 100;
    text-transform: uppercase;
}

#contact-form.no-placeholder .form-group label {
    display: block;
}

#contact-form .controls {
    padding: 0;
    margin-bottom: 30px;
    border-bottom: 1px solid #ddd;
    border-radius: 2px;
}

#contact-form .form-control {
    background: transparent !important;
    border: none;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    outline: none;
    box-shadow: none;
    height: 56px;
    font-size: 21px;
    line-height: 32px;
    font-weight: 100;
    padding-left: 64px;
    -webkit-transition: border-color .3s ease-out;
    transition: border-color .3s ease-out;
    border-radius: 2px;
}

#contact-form .form-group {
    position: relative;
}

#contact-form .form-group [class*=fa] {
    display: block;
    max-width: 64px;
    position: absolute;
    top: 0;
    left: 0;
    color: #ccc;
    font-size: 28px;
    line-height: 53px;
    text-align: center;
    font-weight: 300;
    opacity: 0.5;
    transition: opacity .2s ease-out;
}

#contact-form.no-placeholder .form-group [class*=fa] {
    top: 30px;
}

#contact-form .form-control:focus + [class*=fa] {
    opacity: 1;
}

#contact-form textarea.form-control {
    height: auto;
    max-width: 100%;
    min-width: 100%;
    font-size: 21px;
    line-height: 32px;
    padding-top: 10px;
}

#contact-form .form-control:focus {
    background: #fff;
    border-bottom: 3px solid #F1C40F;
    outline: none;
    box-shadow: none;
    -webkit-transition: border-color .3s ease-in;
    transition: border-color .3s ease-in;
}

#contact-form .error-message {
    padding: 5px 0;
    position: absolute;
    top: -30px;
    right: 0;
    font-size: 14px;
    font-weight: 300;
    color: #ff0000;
    z-index: 10;
}

#contact-form .error-message:before {
    content: "\00d7";
    font-size: 21px;
    line-height: 21px;
    margin-right: 5px;
}

/*-----------------------------------------------------------------------------------*/
/*	 Footer Styles
/*-----------------------------------------------------------------------------------*/ 

footer {
	text-align: center;
	padding: 100px 0;
	background: #222;
}

footer .copyright {
	display: block;
	margin: 40px 0 0 0;
}
footer .logo{
    width:100%;
}
footer .logo img{
    max-width: 100px;
}

.copyright a {
	font-weight: bold;
	color: inherit;
}

/*-----------------------------------------------------------------------------------*/
/*	Animation Styles
/*-----------------------------------------------------------------------------------*/ 
@-webkit-keyframes moving {
    0% {
        bottom: 30px;
    }

    30% {
        bottom: 10px;
    }

    60% {
        bottom: 30px;
    }
}
@keyframes moving {
    0% {
        bottom: 30px;
    }

    30% {
        bottom: 10px;
    }

    60% {
        bottom: 30px;
    }
}