/* Template: Leon Mobile App Landing Page Template
   Author: InovatikThemes
   Version: 1.2
   Created: March 2017
   Description: Master CSS file
*/


/**********************************
	TABLE OF CONTENTS

01. General Styles 
02. Navigation
03. Header
04. Features Section
05. Description Section 1
06. Description Section 2
07. Screenshots Section
08. Video Section
09. Pricing Table Section
10. Testimonials Section
11. Other Apps Section
12. Social Media And Newsletter Section
13. Download Section
14. Contact Section
15. Footer
16. Back To Top Button
17. Media Queries
**********************************/


/***** 01. General Styles *****/

/* For different color schemes please do a Search and Replace All in your code editor
from the default color to the corespondent one in the new color scheme

- Default Aquamarine:
Primary-color: #27c79a 
Secondary-color: #1cb187

- Green:
Primary-color: #15de65
Secondary-color: #0bcf59

- Yellow:
Primary-color: #f1c40f
Secondary-color: #dfb302

- Orange:
Primary-color: #ff9519
Secondary-color: #e77f05

- Red
Primary-color: #e62323
Secondary-color: #d21e1e

- Blue
Primary-color: #0ca1ff
Secondary-color: #038de4
*/

html,
body {
	width: 100%;
	height: 100%;
}

body {
	font: 300 17px/26px "Roboto", sans-serif;
	color: #333e50;
}

/* Preloader */
.main-wrapper {
	overflow: hidden; /* used to keep the scroll bar on the pre-loader screen */
}

#preloader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #333e50; /* change if the mask should have another color then white */
	z-index: 9999; /* makes sure it stays on top */
}

#status {
	width: 200px;
	height: 200px;
	position: absolute;
	left: 50%; /* centers the loading animation horizontally one the screen */
	top: 50%; /* centers the loading animation vertically on the screen */
	background-image: url(../images/pre-loader-gears.gif); /* path to your loading animation */
	background-repeat: no-repeat;
	background-position: center;
	margin: -100px 0 0 -100px; /* is width and height divided by two */
}

h1 {
	font: 400 38px/1.25em "Roboto", sans-serif;
}

h2 {
	font: 300 22px/1.5em "Roboto", sans-serif;
}

h3 {
	font: 400 22px/1.5em "Roboto", sans-serif;
}

p {
	font: 300 17px/1.6em "Roboto", sans-serif;
}

a {
	color: #333e50;
	text-decoration: underline;
}

a:hover {
	color: #000;
}

/* Buttons */
.button-large-transparent,
.button-large-transparent:focus {
	font: 300 18px/32px "Roboto", sans-serif;
	background: transparent;
	color: #3aabbf;
	border: 2px solid #3aabbf;
	border-radius: 25px;
	padding: 9px 40px 9px 40px;
	text-decoration: none;
}

.button-large-transparent:hover {
	background-color: #0891ae;
	color: #333e50;
	border: 2px solid #0891ae;
	text-decoration: none;
	cursor: pointer;
}

.button-large-solid,
.button-large-solid:focus {
	font: 300 17px/1.5em "Roboto", sans-serif;
	background-color: #3aabbf;
	color: #fff;
	border: none;
	border-radius: 10px;
	padding: 13px 32px 14px 32px;
	text-decoration: none;
}

.button-large-solid:hover {
	background-color: #0891ae;
	color: #fff;
	text-decoration: none;
}

.button-small-solid,
.button-small-solid:focus {
	font: 300 15px/26px "Roboto", sans-serif;
	background-color: #3aabbf;
	color: #fff;
	border-radius: 8px;
	padding: 9px 30px 9px 30px;
	text-decoration: none;
}

.button-small-solid:hover {
	background-color: #0891ae;
	color: #fff;
	text-decoration: none;
	cursor: pointer;
}

.button-small-transparent,
.button-small-transparent:focus {
	font: 300 16px/26px "Roboto", sans-serif;
	background: transparent;
	color: #3aabbf;
	border: 2px solid #3aabbf;
	border-radius: 25px;
	padding: 8px 40px 8px 40px;
	text-decoration: none;
}

.button-small-transparent:hover {
	background-color: #0891ae;
	color: #333e50;
	border: 2px solid #0891ae;
	text-decoration: none;
	cursor: pointer;
}

/* Carousel */
.carousel-control .glyphicon-menu-right,
.carousel-control .glyphicon-menu-left {
	position: absolute;
	top: 50%;
	z-index: 5;
	display: inline-block;
	margin-top: -10px;
	font-size: 30px;
}

.carousel-control .glyphicon-menu-left {
	left: 50%;
	margin-left: -10px;
}

.carousel-control .glyphicon-menu-right {
	right: 50%;
	margin-right: -10px;
}

a.left.carousel-control, a.right.carousel-control {
	opacity: 1;
}

.right.carousel-control {
	background-image: linear-gradient(to right, transparent 0%, rgba(0, 0, 0, 0.5) 100%);
}

.left.carousel-control {
	background-image: linear-gradient(to left, transparent 0%, rgba(0, 0, 0, 0.5) 100%);
}

/* Forms success and error alerts formatting */
#nmsgSubmit.h3.text-center.tada.animated.text-success {
	margin-top: 10px;
	font: 300 20px/32px "Roboto", sans-serif;
	color: #333e50;
}

#nmsgSubmit.h3.text-center.text-danger {
	font: 300 20px/32px "Roboto", sans-serif;
	color: #333e50;
}

#cmsgSubmit.h3.text-center.tada.animated.text-success {
	font: 300 20px/32px "Roboto", sans-serif;
	color: #fff;
}

#cmsgSubmit.h3.text-center.text-danger {
	font: 300 20px/32px "Roboto", sans-serif;
	color: #fff;
}


/***** 02. Navigation *****/

/* Image logo */
a.navbar-brand.img-logo.scrolling {
	padding: 0px;
	margin-left: 0px;
}

/* Image logo not affixed */
.navbar-brand.img-logo.scrolling img {
	margin-left: 10px;
	margin-top: 6px;
	width: 118px;
	height: 38px;
}

/* Image logo affixed while scrolling */
.navbar.navbar-default.navbar-custom.navbar-fixed-top.affix .navbar-brand.img-logo.scrolling img {
	margin-top: 6px;
	margin-left: 10px;
}

/* Text logo */
a.navbar-brand.scrolling {
	text-decoration: none;
	font: 300 30px/20px "Roboto", sans-serif;
	color: #fff;
	margin-top: 3px;
	margin-left: 5px;
}

/* Navbar */
.navbar-custom {
	background-color: #333e50;
	border-color: transparent;
	font: 300 14.5px/22px "Roboto", sans-serif; /* menu links font properties */
}

.navbar-custom .navbar-brand {
	color: #fff;
}

.navbar-collapse .navbar-nav {
	margin-left: 5px; /* margin left indent for menu links in mobile menu */
}

.navbar-custom .navbar-brand:hover,
.navbar-custom .navbar-brand:focus,
.navbar-custom .navbar-brand:active,
.navbar-custom .navbar-brand.active {
	color: #fff;
	opacity: 1;
}

.navbar-custom .navbar-collapse {
	border-color: rgba(255, 255, 255, 0.02);
}

/* Mobile menu toggle button hover color */
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
	background-color: #0891ae;
	color: #fff;
	border-color: #0891ae;
}

/* Mobile menu toggle button hover color */
.navbar-default .navbar-toggle,
.navbar-default .navbar-toggle.collapsed {
	background-color: #3aabbf;
	border-color: #3aabbf;
	color: #fff;
	font: 300 14px/19px "Roboto", sans-serif;
}

.navbar-custom .nav li a.scrolling {
	color: #fff;
	opacity: 0.7;
	text-decoration: none;
}

.navbar-custom .nav li a:hover {
	color: #fff;
	outline: none;
	opacity: 1;
}

.navbar-custom .navbar-nav > .active > a.scrolling {
	border-radius: 0;
	color: #fff;
	background-color: transparent;
	opacity: 1;
}

.navbar-custom .navbar-nav > .active > a:hover,
.navbar-custom .navbar-nav > .active > a:focus {
	color: #fff;
	background-color: transparent;
}


/***** 03. Header *****/
header {
	position: relative;
	min-height: auto;
	width: 100%;
	background-color: #333e50;
	background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url("../images/header-background.jpg") center no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	min-height: 100%;
	background-attachment: fixed;
}

/* IE fix for vertical alignment in flex box */
header .flex-container-wrapper {
	display: flex;
	flex-direction: column;
	height: 100%;
}

header .header-content {
	position: relative;
	width: 100%;
	padding: 100px 15px;
	z-index: 2;
	margin-top: 25px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 100vh;
}

header .header-content img {
	margin-top: 15px;
	text-align: center;
}

header .header-content .call-to-action {
	margin-top: 10px;
}

header .header-content .call-to-action h1 {
	font: 400 48px/1.2em "Roboto", sans-serif;
	color: #fff;
	margin-bottom: 40px;
	margin-top: 40px;
}

header .header-content .call-to-action h2 {
	font: 300 22px/1.5em "Roboto", sans-serif;
	color: #fff;
	margin-left: 0%;
	margin-right: 0%;
}

header .header-content .call-to-action .header-buttons {
	margin-top: 30px;
	text-align: center;
}

header .header-content .call-to-action .header-buttons a {
	display: inline-block;
}

header .header-content .call-to-action .header-buttons :nth-child(2) {
	margin-top: 20px;
}

header .header-content .call-to-action .header-buttons .google-icon {
	background: url("../images/google-icon.svg") no-repeat center;
	background-size: 20px 21px;
	padding-left: 10px;
	padding-right: 10px;
	display: inline-block;
	height: 21px;
	margin-bottom: -5px;
	margin-right: 9px;
	color: #3aabbf;
}

header .header-content .call-to-action .header-buttons .apple-icon {
	background: url("../images/apple-icon.svg") no-repeat center;
	background-size: 20px 24px;
	padding-left: 10px;
	padding-right: 10px;
	display: inline-block;
	height: 24px;
	margin-bottom: -5px;
	margin-right: 9px;
	color: #3aabbf;
}


/***** 04. Features Section *****/
#features-section {
	padding-top: 80px;
	padding-bottom: 110px;
	background-color: #eeeeee;
}

#features-section h1 {
	margin-bottom: 10px;
}

#features-section .sub-heading {
	margin-top: 10px;
	margin-bottom: 40px;
}

#features-section p {
	margin-bottom: 0px;
}

#features-section .feature-box {
	margin-top: 40px;
	margin-left: -15px;
	margin-right: -15px;
}

#features-section .features-icons {
	font-size: 40px;
	padding-top: 0px;
	margin-bottom: 0px;
	margin-top: 4px;
	float: left;
	color: #3aabbf;
}

#features-section .features-text {
	margin-left: 60px;
	margin-top: 0px;
}

#features-section .features-text h3 {
	margin-top: 0px;
	margin-bottom: 3px;
}

#features-section .features-text p {
	margin-bottom: initial;
	margin-left: initial;
	margin-right: initial;
}

#features-section #myCarousel {
	display: inline-block;
	margin-top: 50px;
	margin-bottom: 30px;
	height: 80%;
}

#features-section #myCarousel .carousel-control.left {
	background: none;
	margin-top: -40px;
	opacity: 0.7;
	margin-left: 20px;
}

#features-section #myCarousel .carousel-control.right {
	right: 0;
	left: auto;
	background: none;
	margin-top: -40px;
	padding-left: 20px;
	opacity: 0.7;
	margin-right: 20px;
}

#features-section #myCarousel .carousel-control:hover,
#features-section #myCarousel .carousel-control:focus {
	color: #fff;
	text-decoration: none;
	filter: alpha(opacity=90);
	outline: 0;
	opacity: 1;
}

#features-section #myCarousel .carousel-caption {
	position: relative;
	right: 0%;
	margin-bottom: 20px;
	left: 0%;
	z-index: 0;
	padding-top: 20px;
	padding-bottom: 20px;
	color: #333e50;
	text-align: center;
	text-shadow: none;
}

#features-section #myCarousel .carousel-caption p {
	margin-top: 23px;
	margin-bottom: 2px;
}

#features-section #myCarousel .carousel-indicators {
	margin-bottom: -40px;
}

#features-section #myCarousel .carousel-indicators li {
	display: inline-block;
	width: 9px;
	height: 9px;
	margin: 1px;
	text-indent: -999px;
	cursor: pointer;
	background-color: transparent;
	border: 1px solid #333e50;
	border-radius: 10px;
}

#features-section #myCarousel .carousel-indicators .active {
	width: 10px;
	height: 10px;
	margin: 0;
	background-color: #333e50;
}


/***** 05. Description Section 1 *****/
#description-section-1 {
	background-color: #fff;
}

#description-section-1 .container-full {
	padding: 0 15px;
}

#description-section-1 .description-text-container h1 {
	margin-bottom: 10px;
	margin-top: 90px;
}

#description-section-1 .description-text-container .sub-heading {
	margin-top: 20px;
}

#description-section-1 .description-text-container .button-small-solid {
	display: inline-block;
	margin-top: 12px;
}

#description-section-1 .description-image-wrapper {
	background: #333e50;
	margin-top: 100px;
}

#description-section-1 .description-image-wrapper img {
	padding-top: 100px;
	padding-bottom: 50px;
	margin-left: auto;
	margin-right: auto;
}

/* Magnific PopUp FAQ PopUp */
#small-dialog {
	background: #fff;
	padding: 20px 20px 30px 20px;
	text-align: left;
	max-width: 650px;
	margin: 40px auto;
	position: relative;
}

#small-dialog h3 {
	text-align: center;
	margin-bottom: 35px;
	margin-top: 20px;
	font: 400 30px/1.3em "Roboto", sans-serif;
}

#small-dialog p.faq-question {
	font: 400 18px/1.4em "Roboto", sans-serif;
}

#small-dialog p {
	font: 300 16px/1.4em "Roboto", sans-serif;
}

#small-dialog .faq-row {
	margin-top: 20px;
}

#small-dialog .bullet-number {
	width: 33px;
	height: 33px;
	background-color: #298aff;
	color: #fff;
	text-align: center;
	font: 600 15px/2.2em "Roboto", sans-serif;
	display: inline-block;
	vertical-align: middle;
	margin-right: 5px;
	vertical-align: top;
	margin-top: 4px;
}

#small-dialog .faq-text {
	display: inline-block;
	max-width: 80%;
	vertical-align: top;
}

/* Fade-move animation for second dialog */
/* at start */
.my-mfp-slide-bottom .zoom-anim-dialog {
	opacity: 0;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
	-webkit-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-moz-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-ms-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-o-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
}

/* animate in */
.my-mfp-slide-bottom.mfp-ready .zoom-anim-dialog {
	opacity: 1;
	-webkit-transform: translateY(0) perspective( 600px ) rotateX( 0 );
	-moz-transform: translateY(0) perspective( 600px ) rotateX( 0 );
	-ms-transform: translateY(0) perspective( 600px ) rotateX( 0 );
	-o-transform: translateY(0) perspective( 600px ) rotateX( 0 );
	transform: translateY(0) perspective( 600px ) rotateX( 0 );
}

/* animate out */
.my-mfp-slide-bottom.mfp-removing .zoom-anim-dialog {
	opacity: 0;
	-webkit-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg );
	-moz-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg );
	-ms-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg );
	-o-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg );
	transform: translateY(-10px) perspective( 600px ) rotateX( 10deg );
}

/* Dark overlay, start state */
.my-mfp-slide-bottom.mfp-bg {
	opacity: 0;
	-webkit-transition: opacity 0.3s ease-out;
	-moz-transition: opacity 0.3s ease-out;
	-o-transition: opacity 0.3s ease-out;
	transition: opacity 0.3s ease-out;
}

/* animate in */
.my-mfp-slide-bottom.mfp-ready.mfp-bg {
	opacity: 0.8;
}
/* animate out */
.my-mfp-slide-bottom.mfp-removing.mfp-bg {
	opacity: 0;
}
/* end of magnific popup faq popup */


/***** 06. Description Section 2 *****/
#description-section-2 {
	background-color: #fff;
}

#description-section-2 .container-full {
	padding: 0 15px;
}

#description-section-2 .description-image-wrapper {
	background: #3aabbf;
}

#description-section-2 .description-image-wrapper img {
	padding-top: 50px;
	padding-bottom: 100px;
	margin-left: auto;
	margin-right: auto;
}

#description-section-2 .description-text-container {
	padding-top: 90px;
	padding-bottom: 100px;
}

#description-section-2 .description-text-container .nav-pills {
	margin-top: 0px;
	margin-bottom: 30px;
}

#description-section-2 .description-text-container .nav-pills li {
	text-align: center;
	width: 100%;
}

#description-section-2 .description-text-container .nav-pills li a {
	font: 300 17px/1.6em "Roboto", sans-serif;
	background-color: none;
	color: #6a6a6a;
	border: 1px solid #aaa;
	border-radius: 8px;
	margin-right: 4px;
	margin-top: 10px;
	padding: 9px 30px 10px 30px;
	text-decoration: none;
}

#description-section-2 .description-text-container .nav-pills li a:hover {
	background-color: #333e50;
	color: #fff;
	border: 1px solid #333e50;
}

#description-section-2 .description-text-container .nav-pills li.active a {
	background-color: #333e50;
	color: #fff;
	border: 1px solid #333e50;
}

#description-section-2 .description-text-container #tab_a ul {
	list-style: none;
	padding-left: 0px;
}

#description-section-2 .description-text-container #tab_a ul .checkmark {
	margin-right: 10px;
}

#description-section-2 .description-text-container #tab_a ul li {
	font: 300 17px/1.6em "Roboto", sans-serif;
}

#description-section-2 .description-text-container #tab_a .button-small-solid {
	display: inline-block;
	margin-top: 12px;
}

#description-section-2 .description-text-container #tab_b {
	margin-top: 20px;
}

#description-section-2 .description-text-container #tab_b .progress {
	height: 30px;
	border-radius: 4px;
	margin-top: 20px;
}

#description-section-2 .description-text-container #tab_b .progress-bar {
	text-align: left;
	font: 300 14px/22px "Roboto", sans-serif;
	background-color: #3aabbf;
	color: white;
	padding-left: 20px;
	padding-top: 5px;
}

#description-section-2 .description-text-container #tab_c .button-small-solid {
	display: inline-block;
	margin-top: 12px;
}


/***** 07. Screenshots Section *****/
#screenshots-section {
	padding-top: 80px;
	padding-bottom: 70px;
	background-color: #eeeeee;
}

#screenshots-section h1 {
	margin-bottom: 10px;
}

#screenshots-section .sub-heading {
	margin-top: 10px;
	margin-bottom: 10px;
}

#screenshots-section .swiper-container {
	width: 100%;
	height: 400px;
	margin: 0px auto 30px auto;
}

#screenshots-section .swiper-container .swiper-pagination {
	height: 40px;
	bottom: -20px;
}

#screenshots-section .swiper-container .swiper-pagination .swiper-pagination-bullet, #screenshots-section .swiper-container .swiper-pagination .swiper-pagination-bullet-active {
	width: 10px;
	height: 10px;
	background-color: #333e50;
}

/* Center slide text vertically */
#screenshots-section .swiper-slide {
	text-align: center;
	font-size: 18px;
	background: #eeeeee;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}

#screenshots-section .swiper-slide a {
	box-shadow: 0px 0px 9px 3px rgba(190, 190, 190, 0.7);
}

#screenshots-section .swiper-slide a.popup-link {
	color: #fff;
	background-color: #fff;
}


/***** 08. Video Section *****/
#video-section {
	padding-top: 110px;
	padding-bottom: 100px;
	background: #333e50;
}

#video-section p {
	color: #fff;
	margin-top: 20px;
}


/***** 09. Pricing Table Section *****/
#pricing-table-section {
	padding-top: 80px;
	padding-bottom: 50px;
}

#pricing-table-section h1 {
	margin-bottom: 10px;
}

#pricing-table-section .sub-heading {
	margin-top: 10px;
	margin-bottom: 50px;
}

#pricing-table-section .pricing-column {
	border: 2px solid #e5e5e5;
	border-radius: 4px;
	margin-bottom: 60px;
	text-align: center;
	max-width: 280px;
}

#pricing-table-section .pricing-column h3 {
	font: 400 26px/1.4em "Roboto", sans-serif;
	text-align: center;
	margin: 18px 15px 0px 15px;
}

#pricing-table-section .pricing-column .separator-pricing {
	margin-top: 14px;
}

#pricing-table-section .pricing-column .price {
	font: 300 72px/1em "Roboto", sans-serif;
	margin-top: 4px;
}

#pricing-table-section .pricing-column .pricing-first-p {
	margin: 25px 15px 0px 15px;
	color: #333e50;
}

#pricing-table-section .pricing-column p {
	color: #333e50;
	text-align: center;
	margin-top: 15px;
	margin-bottom: -6px;
}

#pricing-table-section .pricing-column .checkmark {
	margin-right: 8px;
	color: #3aabbf;
	font-size: 18px;
	font-weight: bold;
}

#pricing-table-section .pricing-column .button {
	display: inline-block;
	padding-top: 13px;
	padding-bottom: 8px;
	margin-top: 30px;
	width: 100%;
	max-width: 100%;
	background-color: #e5e5e5;
	border-style: none;
	border-radius: 2px;
	color: #333e50;
	font-size: 20px;
	line-height: 32px;
	text-decoration: none;
}

#pricing-table-section .pricing-column:hover {
	border: 2px solid #3aabbf;
}

#pricing-table-section .pricing-column:hover .separator-pricing {
	border-color: #3aabbf;
}

#pricing-table-section .pricing-column:hover .button {
	background-color: #3aabbf;
	border-style: none;
	color: #fff;
}


/***** 10. Testimonials *****/
#testimonials-section {
	padding-top: 20px;
	padding-bottom: 90px;
	background-color: #3aabbf;
}

#testimonials-section #carousel-example-generic {
	text-align: center;
	margin-top: 70px;
	margin-left: 5%;
	margin-right: 5%;
}

#testimonials-section #carousel-example-generic img {
	width: 105px;
	height: 105px;
	margin-bottom: 20px;
}

#testimonials-section #carousel-example-generic p {
	padding-top: 15px;
	width: 100%;
	color: #fff;
}

#testimonials-section #carousel-example-generic h2 {
	font: 300 21px/30px "Roboto", sans-serif;
	color: #fff;
}

#testimonials-section #carousel-example-generic a.left.carousel-control,
#testimonials-section #carousel-example-generic a.right.carousel-control {
	background: none;
}

#testimonials-section #carousel-example-generic .carousel-indicators {
	position: static;
	margin-top: 0px;
}

#testimonials-section #carousel-example-generic .carousel-indicators .active {
	background-color: #fff;
	border: 2px solid #fff;
	width: 10px;
	height: 10px;
	margin-right: 4px;
}

#testimonials-section #carousel-example-generic .carousel-indicators li {
	border: 1px solid #fff;
	width: 10px;
	height: 10px;
	margin: 0px;
	margin-right: 4px;
}

#testimonials-section #carousel-example-generic .carousel-indicators li:hover {
	background-color: #fff;
	border: 2px solid #fff;
	width: 10px;
	height: 10px;
	margin-right: 4px;
}

#testimonials-section #carousel-example-generic .carousel-content {
	color: #fff;
	display: flex;
	align-items: center;
}


/***** 11. Other Apps Section *****/
#other-apps-section {
	padding-top: 80px;
	padding-bottom: 30px;
}

#other-apps-section h1 {
	margin-bottom: 10px;
}

#other-apps-section .sub-heading {
	margin-top: 10px;
	margin-bottom: 65px;
}

#other-apps-section .development-process {
	text-align: left;
}

#other-apps-section .development-process img {
	margin-bottom: 30px;
	border-radius: 3px;
}

#other-apps-section .development-process .text-div {
	margin-top: 13px;
}

#other-apps-section .development-process .text-div .box-title {
	font: 400 20px/30px "Roboto", sans-serif;
	margin-top: 20px;
	margin-bottom: 10px;
}

#other-apps-section .development-process .text-div p {
	margin-bottom: 5px;
	margin-left: 0%;
	margin-right: 0%;
}

#other-apps-section .development-process .button-small-solid {
	display: inline-block;
	margin-top: 20px;
	margin-bottom: 80px;
}


/***** 12. Social Media And Newsletter Section *****/
#social-media-and-newsletter-section {
	padding-top: 80px;
	padding-bottom: 90px;
	background-color: #eeeeee;
}

#social-media-and-newsletter-section .social-follow h3 {
	text-align: center;
	margin-bottom: 8px;
}

#social-media-and-newsletter-section .social-links {
	text-align: center;
}

#social-media-and-newsletter-section .social-links a span {
	font-size: 40px;
	color: #333e50;
	margin: 5px 3px 0px 3px;
}

#social-media-and-newsletter-section .social-links a:hover span {
	color: #3aabbf;
}

#social-media-and-newsletter-section .newsletter-subscribe {
	text-align: center;
	margin-top: 40px;
}

#social-media-and-newsletter-section .newsletter-form {
	text-align: center;
	margin-top: 13px;
}

#social-media-and-newsletter-section .newsletter-form #NewsletterForm .form-group {
	display: inline-block;
	margin-bottom: 0px;
}

#social-media-and-newsletter-section .newsletter-form #NewsletterForm .form-group ::-webkit-input-placeholder {
	color: #333e50;
	opacity: 0.8;
}

#social-media-and-newsletter-section .newsletter-form #NewsletterForm .form-group ::-moz-placeholder {
	color: #333e50;
	opacity: 0.8;
}

#social-media-and-newsletter-section .newsletter-form #NewsletterForm .form-group :-ms-input-placeholder {
	color: #333e50;
	opacity: 0.8;
}

#social-media-and-newsletter-section .newsletter-form #NewsletterForm .form-group input:-moz-placeholder {
	color: #333e50;
	opacity: 0.8;
}

#social-media-and-newsletter-section .newsletter-form #NewsletterForm .form-group input {
	padding: 21px 30px 22px 30px;
	width: 280px;
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 20px;
	background: transparent;
	font: 300 15px/1.6em "Roboto", sans-serif;
	color: #333e50;
	box-shadow: none;
	border-radius: 8px;
	border: 1px solid black;
	text-align: center;
}

#social-media-and-newsletter-section .newsletter-form #NewsletterForm .form-group input:focus,
#social-media-and-newsletter-section .newsletter-form #NewsletterForm .form-group textarea:focus {
	box-shadow: 0 5px 2px -2px #bebebe;
}

#social-media-and-newsletter-section .newsletter-form #NewsletterForm button {
	display: inline-block;
	border: none;
}


/***** 13. Download Section *****/
#download-section {
	padding-top: 80px;
	padding-bottom: 100px;
}

#download-section h1 {
	margin-bottom: 10px;
}

#download-section .sub-heading {
	margin-top: 10px;
	margin-bottom: 40px;
}

#download-section .download-buttons {
	margin-top: 30px;
	text-align: center;
}

#download-section .download-buttons .button-large-solid {
	margin-left: 5px;
	margin-right: 5px;
}

#download-section .download-buttons a {
	display: inline-block;
}

#download-section .download-buttons :nth-child(1) {
	margin-bottom: 15px;
}

#download-section .download-buttons .google-icon {
	background: url("../images/google-icon.svg") no-repeat center;
	background-size: 20px 21px;
	padding-left: 10px;
	padding-right: 10px;
	display: inline-block;
	height: 21px;
	margin-bottom: -5px;
	margin-right: 9px;
	color: #3aabbf;
}

#download-section .download-buttons .apple-icon {
	background: url("../images/apple-icon.svg") no-repeat center;
	background-size: 20px 24px;
	padding-left: 10px;
	padding-right: 10px;
	display: inline-block;
	height: 24px;
	margin-bottom: -5px;
	margin-right: 9px;
	color: #3aabbf;
}


/***** 14. Contact Section *****/
#contact-section {
	padding-top: 80px;
	padding-bottom: 30px;
	background-color: #333e50; 
}

#contact-section p, #contact-section a {
	color: #fff; 
}

#contact-section a,
#contact-section .location-information a {
	color: #c4c4c4; 
}

#contact-section a:hover,
#contact-section .location-information a:hover {
	color: #fff; 
}

#contact-section .contact-text p {
	color: #fff; 
	font: 300 16px/26px "Roboto", sans-serif;
}

#contact-section .contact-text h3 {
	margin-top: 10px;
	color: #fff;	
}

#contact-section .location-information {
	margin-top: 19px; 
	color: #fff;
	font: 300 16px/26px "Roboto", sans-serif;
}

#contact-section .location-information p {
	font: 300 16px/26px "Roboto", sans-serif;
}

#contact-section .location-information ul {
	margin-top: 30px;
	list-style-type: none;
	padding-left: 0px; 
}

#contact-section .location-information ul .location-item {
	margin-right: 14px; 
}

#contact-section .location-information ul .location-icons {
	font-size: 15px;
	margin-right: 5px;
	width: 20px; 
}

#contact-section .location-information ul .icon-map-pin {
	margin-right: 0px; 
}

#contact-section .location-information ul .icon-phone {
	margin-right: 1px; 
}

#contact-section .location-information ul .icon-envelope {
	margin-right: 9px; 
}

#contact-section .location-information p.important-links {
	margin-top: 21px;
}

#contact-section form {
	margin-top: 40px; 
}

#contact-section form .col-md-4, #contact-section form .col-md-12 {
	padding-left: 0px;
	padding-right: 0px; 
}

/* Chrome/Opera/Safari */
#contact-section form ::-webkit-input-placeholder {
	color: #fff;
	opacity: 0.8; 
}

/* Firefox 19+ */
#contact-section form ::-moz-placeholder {
	color: #fff;
	opacity: 0.8; 
}

/* IE 10+ */
#contact-section form :-ms-input-placeholder {
	color: #fff;
	opacity: 0.8; 
}

/* Firefox 18- */
#contact-section form :-moz-placeholder {
	color: #fff;
	opacity: 0.8; 
}

#contact-section form input {
	height: 45px;
	padding-bottom: 6px;
	background: transparent;
	font: 300 15px/1.6em "Roboto", sans-serif;
	color: #fff;
	border: none;
	box-shadow: none;
	border-radius: 8px;
	border: 1px solid white;
	margin-top: 20px; 
}

#contact-section form input:focus, #contact-section form textarea:focus {
	box-shadow: 0 5px 2px -2px #bebebe; 
}

#contact-section form textarea {
	background-color: transparent;
	color: #fff;
	font: 300 15px/1.6em "Roboto", sans-serif;
	border: 1px solid white;
	border-radius: 8px;
	margin-top: 30px; 
}

#contact-section form textarea[placeholder] {
	text-align: left; 
}

#contact-section form button {
	margin-top: 15px;
	border: none; 
}


/***** 15. Footer *****/
footer {
	padding-top: 25px;
	padding-bottom: 25px;
	background-color: #333e50; 
}

footer p {
	font: 300 15px/1.5em "Roboto", sans-serif;
	color: #c4c4c4;
	text-align: center;
	width: 90%;
	margin: 0 auto; 
}

footer p a {
	color: #c4c4c4; 
}

footer p a:hover {
	color: #fff; 
}


/***** 16. Header Privacy *****/
#header-privacy {
	position: relative;
	min-height: auto;
	width: 100%;
	background-color: #333e50;
}

/* IE fix for vertical alignment in flex box */
#header-privacy .flex-container-wrapper {
	display: flex;
	flex-direction: column;
	height: 100%; 
}

#header-privacy .header-privacy-content {
	position: relative;
	width: 100%;
	padding: 120px 0px 80px 0px;
	z-index: 2;
	margin-top: 25px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

#header-privacy .header-privacy-content h1 {
	margin-top: 0px;
	font: 300 38px/1.2em "Roboto", sans-serif;
	color: #fff;
	text-align: center;
}

#header-privacy .header-privacy-content h1 .icon-shield {
	margin-right: 15px;
	padding-bottom: 12px;
	font-size: 38px;
	vertical-align: middle;
}


/***** 17. Privacy Content *****/
#privacy-content {
	padding-top: 30px;
	padding-bottom: 100px;
}

#privacy-content h4 {
	margin-top: 50px;
	margin-bottom: 10px;
}

#privacy-content ul {
	padding-left: 15px;
}

#privacy-content ul li {
	margin-top: 3px;
}

#privacy-content .gray-background {
	background-color: #ebebeb;
	padding: 35px 35px 30px 15px;
	margin-top: 20px;
}

#privacy-content .gray-background ol {
	counter-reset: awesome-counter;
	padding-left: 15px;
}

#privacy-content .gray-background li {
	list-style: none;
	margin-top: 3px;
}

#privacy-content .gray-background ol li:before {
	content: counter(awesome-counter);
    counter-increment: awesome-counter;
	margin-right: 8px;
	content: counter(awesome-counter) '.';
}

#privacy-content a:hover {
	color: #ff2121;
}


/***** 18. Header Terms *****/
#header-terms {
	position: relative;
	min-height: auto;
	width: 100%;
	background-color: #333e50;
}

/* IE fix for vertical alignment in flex box */
#header-terms .flex-container-wrapper {
	display: flex;
	flex-direction: column;
	height: 100%; 
}

#header-terms .header-terms-content {
	position: relative;
	width: 100%;
	padding: 120px 0px 80px 0px;
	z-index: 2;
	margin-top: 25px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

#header-terms .header-terms-content h1 {
	margin-top: 0px;
	font: 300 38px/1.2em "Roboto", sans-serif;
	color: #fff;
	text-align: center;
}

#header-terms .header-terms-content h1 .icon-search {
	margin-right: 8px;
	padding-bottom: 9px;
	font-size: 38px;
	vertical-align: middle;
}


/***** 19. Terms Content *****/
#terms-content {
	padding-top: 30px;
	padding-bottom: 100px;
}

#terms-content h4 {
	margin-top: 50px;
	margin-bottom: 10px;
}

#terms-content ul {
	padding-left: 30px;
}

#terms-content ul li {
	margin-top: 3px;
}

#terms-content a:hover {
	color: #ff2121;
}


/***** 20. Back To Top Button *****/
a.back-to-top {
	display: none;
	width: 40px;
	height: 40px;
	text-indent: -9999px;
	position: fixed;
	z-index: 999;
	right: 10px;
	bottom: 10px;
	background: #333e50 url("../images/up-arrow.png") no-repeat center 47%;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	background-size: 18px 18px; 
}

a:hover.back-to-top {
	background-color: #193e52; 
}


/***** 21. Media Queries *****/

/*Min-width width 768*/
@media (min-width: 768px) {
	h1 {
		font: 400 40px/1.25em "Roboto", sans-serif; 
	}

	/* Image logo not affixed */
	.navbar-brand.img-logo.scrolling img {
		margin-top: 5px;
		margin-left: 0px; 
	}


	/* Image logo affixed while scrolling */
	.navbar.navbar-default.navbar-custom.navbar-fixed-top.affix .navbar-brand.img-logo.scrolling img {
		margin-top: 6px;
		margin-left: 0px; 
	}

	/* Text logo not affixed */
	a.navbar-brand.scrolling {
		margin-top: -3px;
		font: 300 38px/20px "Roboto", sans-serif; 
	}

	/* Text logo affixed while scrolling */
	.navbar.navbar-default.navbar-custom.navbar-fixed-top.affix a.navbar-brand.scrolling {
		font: 300 30px/20px "Roboto", sans-serif;
		margin-top: -2px;
		margin-left: 0px; 
	}

	.navbar-collapse .navbar-nav {
		margin-left: 0px; /* margin left reset for menu links */ 
	}

	.navbar-custom.affix .navbar-brand {
		font: 300 25px/20px "Roboto", sans-serif; 
	}

	.navbar-custom {
		background-color: transparent;
		padding: 25px 0;
		-webkit-transition: padding 0.3s;
		-moz-transition: padding 0.3s;
		transition: padding 0.3s;
		border: none; 
	}

	.navbar-custom .navbar-brand {
		font-size: 2em;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s; 
	}

	.navbar-custom .navbar-nav > .active > a {
		border-radius: 3px; 
	}

	/* Navbar height and color while scrolling */
	.navbar-custom.affix {
		background-color: #333e50;
		padding: 4px 0 3px 0; 
	}

	.navbar-custom .nav li a.scrolling {
		padding-left: 12px;
		padding-right: 12px; 
	}

	header {
		min-height: 100%; 
	}

	header .header-content {
		margin-top: 0px; 
	}

	header .header-content img {
		margin-top: 60px; 
	}

	header .header-content .call-to-action {
		margin-top: 60px;
		margin-left: 5px; 
	}

	header .header-content .call-to-action h1 {
		font: 400 50px/1.2em "Roboto", sans-serif;
		margin-top: 20px;
		text-align: center; 
	}

	header .header-content .call-to-action h2 {
		text-align: center; 
	}

	header .header-content .call-to-action .header-buttons {
		margin-top: 0px;
		text-align: center; 
	}

	header .header-content .call-to-action .header-buttons a:nth-child(2) {
		margin-left: 10px; 
	}

	#features-section p.sub-heading {
		margin-left: 8%;
		margin-right: 8%;
		margin-bottom: 0px; 
	}

	#features-section #myCarousel .carousel-indicators {
		margin-bottom: -60px; 
	}

	#description-section-1 .description-text-container {
		max-width: 700px;
		margin-left: auto;
		margin-right: auto; 
	}
	
	/* Magnific PopUp FAQ PopUp */
	#small-dialog {
		padding: 30px 40px 40px 40px;
	}
	
	#small-dialog h3 {
		text-align: center;
		margin-bottom: 35px;
		margin-top: 20px;
		font: 400 32px/1.5em "Roboto", sans-serif; 
	}

	#small-dialog .bullet-number {
		width: 39px;
		height: 39px;
		background-color: #298aff;
		color: #fff;
		text-align: center;
		font: 600 20px/1.9em "Roboto", sans-serif;
		display: inline-block;
		vertical-align: middle;
		margin-right: 12px;
		vertical-align: top;
		margin-top: 5px;
	}

	#small-dialog .faq-text {
		max-width: 89%;
	}
	/* end of magnific popup faq popup */
	
	#description-section-2 .description-text-container {
		max-width: 700px;
		margin-left: auto;
		margin-right: auto; 
	}

	#social-media-and-newsletter-section {
		padding-bottom: 105px; 
	}

	#social-media-and-newsletter-section .social-links a span {
		font-size: 44px;
		margin: 5px 5px 0px 5px; 
	}

	#social-media-and-newsletter-section .newsletter-form #NewsletterForm .form-group input {
		margin-bottom: 0px; 
	}

	#contact-section {
		padding-top: 80px;
		padding-bottom: 35px; 
	}

	#contact-section form button {
		margin-top: 10px; 
	}

	#contact-section form textarea {
		margin-top: 20px; 
	}

	#contact-section .location-information ul {
		margin-top: 5px; 
	}

	#contact-section .location-information ul li {
		display: inline; 
	}
	
	#header-privacy .header-privacy-content h1 .icon-shield {
		font-size: 44px;
	}
	
	#header-privacy .header-privacy-content h1 {
		font: 300 44px/1.1em "Roboto", sans-serif;
	}
	
	#privacy-content ul {
		padding-left: 25px;
	}
	
	#privacy-content .gray-background ol {
		padding-left: 25px;
	}
	
	#header-terms .header-terms-content h1 .icon-search {
		font-size: 44px;
	}
	
	#header-terms .header-terms-content h1 {
		font: 300 44px/1.1em "Roboto", sans-serif;
	}
	
	#terms-content ul {
		padding-left: 45px;
	}
}


/* Min-width 992 */
@media (min-width: 992px) {
	h1 {
		font: 400 44px/1.25em "Roboto", sans-serif; 
	}

	/* Image logo not affixed */
	.navbar-brand.img-logo.scrolling img {
		margin-top: 3px;
		width: 140px;
		height: 45px; 
	}

	/* Image logo affixed while scrolling */
	.navbar.navbar-default.navbar-custom.navbar-fixed-top.affix .navbar-brand.img-logo.scrolling img {
		margin-top: 7px;
		width: 118px;
		height: 38px; 
	}

	header .header-content img {
		margin-top: 70px;
		max-height: 460px; 
	}

	header .header-content .call-to-action {
		margin-top: 120px;
		margin-left: 0px; 
	}

	header .header-content .call-to-action h1 {
		font: 400 52px/1.2em "Roboto", sans-serif;
		text-align: left;
		margin-bottom: 30px; 
	}

	header .header-content .call-to-action h2 {
		text-align: left; 
	}

	header .header-content .call-to-action .header-buttons {
		text-align: left; 
	}

	#features-section .feature-box.top {
		margin-top: 95px; 
	}

	#features-section .feature-box {
		margin-top: 30px; 
	}

	#features-section #myCarousel {
		display: inline-block;
		margin-top: 50px;
		margin-bottom: 30px;
		height: 100%; 
	}

	#description-section-1 .description-text-container {
		max-width: 500px;
		margin-top: 70px;
		margin-right: 50px;
		float: right; 
	}

	#description-section-1 .description-text-container .text-center {
		text-align: left; 
	}

	#description-section-1 .description-image-wrapper {
		background: #333e50;
		margin-top: 0px; 
	}

	#description-section-1 .description-image-wrapper img {
		margin-left: 0px;
		padding-top: 100px;
		padding-bottom: 100px;
		padding-left: 60px; 
	}

	#description-section-2 .description-text-container {
		max-width: 500px;
		margin-left: 70px;
		padding-top: 20px;
		padding-bottom: 0px; 
	}

	#description-section-2 .description-text-container .nav-pills {
		margin-top: 50px; 
	}

	#description-section-2 .description-text-container .nav-pills li {
		width: auto;
		text-align: initial; 
	}

	#description-section-2 .description-text-container .tab-content .text-center {
		text-align: left; 
	}

	#description-section-2 .description-image-wrapper img {
		float: right;
		padding-right: 60px;
		padding-top: 110px;
		padding-bottom: 100px; 
	}

	#video-section p {
		width: 80%;
		margin: 30px auto 0px auto; 
	}

	#social-media-and-newsletter-section .newsletter-subscribe {
		margin-top: 0px; 
	}

	#contact-section form {
		width: 97%;
		float: right; 
	}

	#contact-section form .col-md-4, #contact-section form .col-md-12 {
		padding-left: 10px;
		padding-right: 10px; 
	}

	#contact-section form input {
		margin-top: 0px; 
	}

	#contact-section form textarea {
		margin-top: 10px; 
	}

	#contact-section form button {
		margin-top: 5px; 
	} 
}


/* Min-width 1200 */
@media (min-width: 1200px) {
	header .header-content img {
		max-height: 500px; 
	}

	header .header-content .call-to-action {
		margin-top: 150px; 
	}

	header .header-content .call-to-action h1 {
		font: 400 56px/1.2em "Roboto", sans-serif; 
	}

	#features-section .feature-box.top {
		margin-top: 120px; 
	}

	#features-section .feature-box {
		margin-top: 40px; 
	}

	#features-section .feature-box .features-icons {
		font-size: 48px; 
	}

	#features-section .feature-box .features-text {
		margin-left: 70px; 
	}

	#description-section-1 .description-text-container {
		margin-top: 110px; 
	}

	#description-section-2 .description-text-container {
	padding-top: 80px; 
	}

	#download-section p {
		margin-left: 5%;
		margin-right: 5%; 
	}

	#contact-section form {
		margin-top: 15px; 
	}

	#contact-section form button {
		margin-top: 10px; 
	}

	#contact-section .location-information p {
		margin-bottom: 0px; 
	} 
}