/* Template: Leno - Mobile App HTML Landing Page Template
   Author: Inovatik
   Created: Mar 2019
   Description: Master CSS file
*/

/*****************************************
Table Of Contents:

01. General Styles
02. Preloader
03. Navigation
04. Header
05. Testimonials
06. Features
07. Video
08. Screenshots
09. Download
10. Footer
11. Back To Top Button
12. Extra Pages
13. Media Queries
******************************************/

/*****************************************
Colors:

All colors are defined as CSS custom properties
in the :root block below. Change a value there
and it updates everywhere in this file.

- --color-text          text, navbar links (near-white)
- --color-primary       buttons, bullets, icons (turquoise)
- --color-primary-light lighter accent (rotating header text)
- --color-primary-hover hover state for primary accent
- --color-secondary     navbar background (navy)
- --color-accent        video play button (blue)
- --color-bg-dark       section background - dark denim
- --color-bg-darker     section background - denim
- --color-input-bg      form input background
- --color-border        form input border
- --color-divider       thin dividers / hr
- --color-light-bg      light section background
- --color-white         pure white
- --color-gradient-start / --color-gradient-end
                        extra-page header gradient
******************************************/

:root {
    /* Brand */
    --color-primary: #00c9db;
    --color-primary-light: #40e0ee;
    --color-primary-hover: #36edfd;
    --color-secondary: #4633af;
    --color-accent: #4eaaff;

    /* Text */
    --color-text: #f1f1f8;
    --color-white: #ffffff;

    /* Backgrounds */
    --color-bg-dark: #262431;
    --color-bg-darker: #2f2c3d;
    --color-light-bg: #f9fafc;

    /* Forms & UI */
    --color-input-bg: #413d52;
    --color-border: #9791ae;
    --color-divider: #b5bcc4;

    /* Gradient (extra pages header) */
    --color-gradient-start: #2c1a7e;
    --color-gradient-end: #5557db;

    /* Typography */
    --font-heading: "Montserrat", sans-serif;
    --font-body: "Open Sans", sans-serif;
}


/******************************/
/*     01. General Styles     */
/******************************/
body,
html {
    width: 100%;
	height: 100%;
}

body, p {
	color: var(--color-text); 
	font: 400 0.875rem/1.375rem var(--font-body);
}

.p-large {
	color: var(--color-text);
	font: 400 1rem/1.5rem var(--font-body);
}

.p-small {
	color: var(--color-text);
	font: 400 0.75rem/1.25rem var(--font-body);
}

.p-heading {
	margin-bottom: 3.75rem;
	text-align: center;
}

.li-space-lg li {
	margin-bottom: 0.375rem;
}

.indent {
	padding-left: 1.25rem;
}

h1 {
	color: var(--color-text);
	font: 700 2.5rem/2.875rem var(--font-heading);
}

h2 {
	color: var(--color-text);
	font: 700 2.25rem/2.75rem var(--font-heading);
}

h3 {
	color: var(--color-text);
	font: 700 1.75rem/2.125rem var(--font-heading);
}

h4 {
	color: var(--color-text);
	font: 700 1.375rem/1.75rem var(--font-heading);
}

h5 {
	color: var(--color-text);
	font: 700 1.125rem/1.625rem var(--font-heading);
}

h6 {
	color: var(--color-text);
	font: 700 1rem/1.5rem var(--font-heading);
}

a {
	color: var(--color-text);
	text-decoration: underline;
}

a:hover {
	color: var(--color-text);
	text-decoration: underline;
}

a.turquoise {
	color: var(--color-primary);
}

a.white {
	color: var(--color-white);
}

.testimonial-text {
	font: italic 400 1rem/1.5rem var(--font-body);
}

.testimonial-author {
	font: 700 1rem/1.5rem var(--font-heading);
}

.btn {
	display: inline-block;
	border: 0.125rem solid var(--color-primary);
	border-radius: 2rem;
	font: 700 0.75rem/0 var(--font-heading);
	text-decoration: none;
	cursor: pointer;
	transition: all 0.2s ease;
}

/* Sizes */
.btn,
.btn-reg {
	padding: 1.1875rem 2.125rem;
}

.btn-lg {
	padding: 1.375rem 2.625rem;
}

.btn-sm {
	padding: 1rem 1.625rem 0.875rem 1.625rem;
	font-size: 0.625rem;
}

/* Variants */
.btn-primary {
	background-color: var(--color-primary);
	color: var(--color-white);
}

.btn-primary:hover {
	background-color: transparent;
	color: var(--color-primary);
	text-decoration: none;
}

.btn-secondary {
	background-color: transparent;
	color: var(--color-primary);
}

.btn-secondary:hover {
	background-color: var(--color-primary);
	color: var(--color-white);
	text-decoration: none;
}

.btn-lg .fab {
	margin-right: 0.5rem;
	font-size: 1.25rem;
	line-height: 0;
	vertical-align: top;
}

.btn-lg .fab.fa-google-play {
	font-size: 1rem;
}

/* Shared animation duration/fill-mode - used with fadeIn on the rotating header text */
.animated {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

/* Fade Animation For Image Slider - Magnific Popup */
@-webkit-keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

@keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

.fadeIn {
	-webkit-animation: fadeIn 0.6s;
	animation: fadeIn 0.6s;
}

@-webkit-keyframes fadeOut {
	from {
		opacity: 1;
	}
	to {
		opacity: 0;
	}
}

@keyframes fadeOut {
	from {
		opacity: 1;
	}
	to {
		opacity: 0;
	}
}

.fadeOut {
	-webkit-animation: fadeOut 0.8s;
	animation: fadeOut 0.8s;
}
/* end of fade animation for image slider - magnific popup */


/*************************/
/*     02. Preloader     */
/*************************/
.spinner-wrapper {
	position: fixed;
	z-index: 999999;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: var(--color-bg-darker);
}

.spinner {
	position: absolute;
	top: 50%; /* centers the loading animation vertically one the screen */
	left: 50%; /* centers the loading animation horizontally one the screen */
	width: 3.75rem;
	height: 1.25rem;
	margin: -0.625rem 0 0 -1.875rem; /* is width and height divided by two */ 
	text-align: center;
}

.spinner > div {
	display: inline-block;
	width: 1rem;
	height: 1rem;
	border-radius: 100%;
	background-color: var(--color-white);
	-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
	animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
	-webkit-animation-delay: -0.32s;
	animation-delay: -0.32s;
}

.spinner .bounce2 {
	-webkit-animation-delay: -0.16s;
	animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
	0%, 80%, 100% { -webkit-transform: scale(0); }
	40% { -webkit-transform: scale(1.0); }
}

@keyframes sk-bouncedelay {
	0%, 80%, 100% { 
		-webkit-transform: scale(0);
		-ms-transform: scale(0);
		transform: scale(0);
	} 40% { 
		-webkit-transform: scale(1.0);
		-ms-transform: scale(1.0);
		transform: scale(1.0);
	}
}


/**************************/
/*     03. Navigation     */
/**************************/
.navbar-custom {
	background-color: var(--color-secondary);
	box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.1);
	font: 700 0.75rem/2rem var(--font-heading);
	transition: all 0.2s ease;
}

.navbar-custom .navbar-brand.logo-image img {
    width: 113px;
	height: 34px;
	margin-bottom: 1px;
	-webkit-backface-visibility: hidden;
}

.navbar-custom .navbar-brand.logo-text {
	font: 700 2.375rem/1.5rem var(--font-heading);
	color: var(--color-white);
	letter-spacing: -0.5px;
	text-decoration: none;
}

.navbar-custom .navbar-nav {
	margin-top: 0.75rem;
}

.navbar-custom .nav-item .nav-link {
	padding: 0 0.75rem 0 0.75rem;
	color: var(--color-white);
	text-decoration: none;
	transition: all 0.2s ease;
}

.navbar-custom .nav-item .nav-link:hover,
.navbar-custom .nav-item .nav-link.active {
	color: var(--color-primary);
}

.navbar-custom .social-icons {
	display: none;
}

.navbar-custom .navbar-toggler {
	border: none;
	color: var(--color-white);
	font-size: 2rem;
}

.navbar-custom button[aria-expanded='false'] .navbar-toggler-awesome.fas.fa-times{
	display: none;
}

.navbar-custom button[aria-expanded='false'] .navbar-toggler-awesome.fas.fa-bars{
	display: inline-block;
}

.navbar-custom button[aria-expanded='true'] .navbar-toggler-awesome.fas.fa-bars{
	display: none;
}

.navbar-custom button[aria-expanded='true'] .navbar-toggler-awesome.fas.fa-times{
	display: inline-block;
	margin-right: 0.125rem;
}


/*********************/
/*    04. Header     */
/*********************/
.section-hero {
	background: linear-gradient(135deg, var(--color-gradient-start), var(--color-gradient-end));
}

.section-hero .header-content {
	padding-top: 8.5rem;
	padding-bottom: 7rem;
	text-align: center;
}

.section-hero .text-container {
	margin-bottom: 3rem;
}

.section-hero h1 {
	margin-bottom: 1rem;
}

.section-hero #js-rotating {
	color: var(--color-primary-light);
}

.section-hero .p-large {
	margin-bottom: 2rem;
}

.section-hero .btn-lg {
	margin-right: 0.5rem;
	margin-bottom: 1.25rem;
}


/****************************/
/*     05. Testimonials     */
/****************************/
.section-testimonials {
	padding-top: 6.875rem;
	padding-bottom: 6.375rem;
	background-color: var(--color-bg-dark);
}

.section-testimonials .slider-container {
	position: relative;
}

.section-testimonials .swiper-container {
	position: static;
	width: 90%;
	text-align: center;
}

.section-testimonials .swiper-button-prev:focus,
.section-testimonials .swiper-button-next:focus {
	/* even if you can't see it chrome you can see it on mobile device */
	outline: none;
}

.section-testimonials .swiper-button-prev {
	left: -0.5rem;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23f1f1f8'%2F%3E%3C%2Fsvg%3E");
	background-size: 1.125rem 1.75rem;
}

.section-testimonials .swiper-button-next {
	right: -0.5rem;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23f1f1f8'%2F%3E%3C%2Fsvg%3E");
	background-size: 1.125rem 1.75rem;
}

.section-testimonials .card {
	position: relative;
	border: none;
	background-color: transparent;
}

.section-testimonials .card-image {
	width: 6rem;
	height: 6rem;
	margin-right: auto;
	margin-bottom: 0.25rem;
	margin-left: auto;
	border-radius: 50%;
}

.section-testimonials .card-body {
	padding-bottom: 0;
}

.section-testimonials .testimonial-author {
	margin-bottom: 0;
}


/************************/
/*     06. Features     */
/************************/
.section-features {
	padding-top: 6.5rem;
	padding-bottom: 4.25rem;
	background-color: var(--color-bg-darker);
}

.section-features h2 {
	margin-bottom: 1.125rem;
	text-align: center;
}

.section-features .p-heading {
	margin-bottom: 3.125rem;
}

.section-features .nav-tabs {
	margin-right: auto;
	margin-bottom: 2.5rem;
	margin-left: auto;
	justify-content: center;
	border-bottom: none;
}

.section-features .nav-link {
	margin-bottom: 1rem;
	padding: 0.5rem 1.375rem 0.25rem 1.375rem;
	border: none;
	border-bottom: 0.1875rem solid var(--color-text);
	border-radius: 0;
	color: var(--color-text);
	font: 700 1rem/1.75rem var(--font-heading);
	text-decoration: none;
	transition: all 0.2s ease;
}

.section-features .nav-link.active,
.section-features .nav-link:hover {
	border-bottom: 0.1875rem solid var(--color-primary);
	background-color: transparent;
	color: var(--color-primary);
}

.section-features .nav-link .fas {
	margin-right: 0.375rem;
	font-size: 1rem;
}

.section-features .tab-content {
	width: 100%; /* for proper display in IE11 */
}

.section-features .card {
	border: none;
	background: transparent;
}

.section-features .card-body {
	padding: 1rem 0 1.25rem 0;
}

.section-features .card-title {
	margin-bottom: 0.5rem;
}

.section-features .card .card-icon {
	display: inline-block;
	width: 3.5rem;
	height: 3.5rem;
	border-radius: 50%;
	background-color: var(--color-primary);
	text-align: center;
	vertical-align: top;
}

.section-features .card .card-icon .fas,
.section-features .card .card-icon .far {
	color: var(--color-white);
	font-size: 1.75rem;
	line-height: 3.5rem;
}

.section-features #tab-1 .card.left-pane .text-wrapper {
	display: inline-block;
	width: 75%;
}

.section-features #tab-1 .card.left-pane .card-icon {
	float: left;
	margin-right: 1rem;
}

.section-features #tab-1 img {
	display: block;
	margin: 2rem auto 3rem auto;
}

.section-features #tab-1 .card.right-pane .text-wrapper {
	display: inline-block;
	width: 75%;
}

.section-features #tab-1 .card.right-pane .card-icon {
	margin-right: 1rem;
}

.section-features #tab-2 img {
	display: block;
	margin: 0 auto 2rem auto;
}

.section-features #tab-2 .text-area {
	margin-top: 1.5rem;
}

.section-features #tab-2 h3 {
	margin-bottom: 0.75rem;
}

.section-features #tab-2 .icon-cards-area {
	margin-top: 2.5rem;
}

.section-features #tab-2 .icon-cards-area .card {
	width: 100%; /* for proper display in IE11 */
}

.section-features #tab-3 .icon-cards-area .card {
	width: 100%; /* for proper display in IE11 */
}

.section-features #tab-3 .text-area {
	margin-top: 0.75rem;
	margin-bottom: 4rem;
}

.section-features #tab-3 h3 {
	margin-bottom: 0.75rem;
}

.section-features #tab-3 img {
	margin: 0 auto 3rem auto;
}


/*********************/
/*     07. Video     */
/*********************/
.section-preview {
	padding-top: 6.375rem;
	padding-bottom: 6.875rem;
	background: linear-gradient(135deg, var(--color-gradient-start), var(--color-gradient-end));
}

.section-preview h2 {
	margin-bottom: 1.125rem;
	text-align: center;
}

.section-preview .p-heading {
	margin-bottom: 4rem;
	text-align: center;
}

.section-preview .image-container img {
	border-radius: 0.375rem;
}

.section-preview .video-wrapper {
	position: relative;
}

/* Video Play Button */
.section-preview .video-play-button {
	position: absolute;
	z-index: 10;
	top: 50%;
	left: 50%;
	display: block;
	box-sizing: content-box;
	width: 2rem;
	height: 2.75rem;
	padding: 1.125rem 1.25rem 1.125rem 1.75rem;
	border-radius: 50%;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}
  
.section-preview .video-play-button:before {
	content: "";
	position: absolute;
	z-index: 0;
	top: 50%;
	left: 50%;
	display: block;
	width: 4.75rem;
	height: 4.75rem;
	border-radius: 50%;
	background: var(--color-accent);
	animation: pulse-border 1500ms ease-out infinite;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}
  
.section-preview .video-play-button:after {
	content: "";
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 50%;
	display: block;
	width: 4.375rem;
	height: 4.375rem;
	border-radius: 50%;
	background: var(--color-accent);
	transition: all 200ms;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}
  
.section-preview .video-play-button span {
	position: relative;
	display: block;
	z-index: 3;
	top: 0.375rem;
	left: 0.25rem;
	width: 0;
	height: 0;
	border-left: 1.625rem solid var(--color-white);
	border-top: 1rem solid transparent;
	border-bottom: 1rem solid transparent;
}
  
@keyframes pulse-border {
	0% {
		transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
		opacity: 1;
	}
	100% {
		transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
		opacity: 0;
	}
}
/* end of video play button */  


/***************************/
/*     08. Screenshots     */
/***************************/
.section-screenshots {
	padding-top: 6.875rem;
	padding-bottom: 6.875rem;
	background-color: var(--color-bg-darker);
}

.section-screenshots .slider-container {
	position: relative;
}

.section-screenshots .swiper-container {
	position: static;
	width: 90%;
	text-align: center;
}

.section-screenshots .swiper-button-prev,
.section-screenshots .swiper-button-next {
	top: 50%;
	width: 1.125rem;
}

.section-screenshots .swiper-button-prev:focus,
.section-screenshots .swiper-button-next:focus {
	/* even if you can't see it chrome you can see it on mobile device */
	outline: none;
}

.section-screenshots .swiper-button-prev {
	left: -0.5rem;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
	background-size: 1.125rem 1.75rem;
}

.section-screenshots .swiper-button-next {
	right: -0.5rem;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
	background-size: 1.125rem 1.75rem;
}


/************************/
/*     09. Download     */
/************************/
.section-download {
	padding-top: 6.5rem;
	padding-bottom: 6.75rem;
	background: linear-gradient(135deg, var(--color-gradient-start), var(--color-gradient-end));
}

.section-download .text-container {
	margin-bottom: 3.5rem;
	text-align: center;
}

.section-download h2 {
	margin-bottom: 1.25rem;
}

.section-download .p-large {
	margin-bottom: 1.75rem;
}

.section-download .btn-lg {
	margin-right: 0.5rem;
	margin-bottom: 1.25rem;
}


/**********************/
/*     10. Footer      */
/**********************/
.section-footer {
	padding-top: 3rem;
	padding-bottom: 1.5rem;
	background-color: var(--color-bg-dark);
	text-align: center;
}

.section-footer .footer-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	margin-bottom: 1.5rem;
}

.section-footer .footer-brand {
	margin: 0 1.25rem 0.5rem 1.25rem;
	color: var(--color-text);
	font: 700 1rem/1.5rem var(--font-heading);
}

.section-footer .footer-links {
	margin-bottom: 0.5rem;
}

.section-footer .footer-link {
	margin: 0 0.75rem;
	color: var(--color-text);
	text-decoration: none;
	transition: all 0.2s ease;
}

.section-footer .footer-link:hover {
	color: var(--color-primary);
	text-decoration: none;
}

.section-footer .footer-copyright {
	color: var(--color-text);
	opacity: 0.6;
}


/**********************************/
/*     11. Back To Top Button     */
/**********************************/
a.back-to-top {
	position: fixed;
	z-index: 999;
	right: 0.75rem;
	bottom: 0.75rem;
	display: none;
	width: 2.625rem;
	height: 2.625rem;
	border-radius: 1.875rem;
	background-size: 1.125rem 1.125rem;
	text-indent: -9999px;
}

a:hover.back-to-top {
	background-color: var(--color-primary-hover); 
}


/***************************/
/*     12. Extra Pages     */
/***************************/
.section-page-hero {
	padding-top: 8rem;
	padding-bottom: 5rem;
	background: linear-gradient(to bottom right, var(--color-gradient-start), var(--color-gradient-end));
	text-align: center;
}

.section-page-breadcrumbs {
	padding-top: 2rem;
	padding-bottom: 0.875rem;
	background-color: var(--color-bg-darker);
}

.section-page-breadcrumbs .breadcrumbs {
	margin-bottom: 1.125rem;
}

.section-page-breadcrumbs .breadcrumbs .fa {
	margin-right: 0.5rem;
	margin-left: 0.625rem;
}

.section-page-content {
	padding-top: 4.75rem;
	padding-bottom: 4rem;
	background-color: var(--color-bg-dark);
}

.section-page-content h3 {
	margin-bottom: 1rem;
}

.section-page-content .text-container {
	margin-bottom: 3.625rem;
}

.section-page-content .text-container.last {
	margin-bottom: 0;
}

.section-page-content .list-unstyled .fas {
	color: var(--color-primary);
	font-size: 0.5rem;
	line-height: 1.375rem;
}

.section-page-content .list-unstyled .media-body {
	margin-left: 0.625rem;
}

.section-page-content .btn-secondary {
	margin-top: 1.75rem;
}

.section-page-content .image-container-large {
	margin-bottom: 4rem;
}

.section-page-content .image-container-large img {
	border-radius: 0.25rem;
}

.section-page-content .image-container-small img {
	border-radius: 0.25rem;
}

.section-page-content .text-container.dark-bg {
	padding: 1.625rem 1.5rem 0.75rem 2rem;
	background-color: var(--color-light-bg);
}


/*****************************/
/*     13. Media Queries     */
/*****************************/	
/* Min-width width 768px */
@media (min-width: 768px) {
	
	/* General Styles */
	.p-heading {
		width: 85%;
		margin-right: auto;
		margin-left: auto;
	}

	h1 {
		font: 700 3.25rem/3.75rem var(--font-heading);
	}
	/* end of general styles */


	/* Navigation */
	.navbar-custom {
		padding: 2.125rem 1.5rem 2.125rem 2rem;
		box-shadow: none;
        background: transparent;
	}
	
	.navbar-custom .navbar-brand.logo-text {
		color: var(--color-white);
	}

	.navbar-custom .navbar-nav {
		margin-top: 0;
	}

	.navbar-custom .nav-item .nav-link {
		padding: 0.25rem 0.75rem 0.25rem 0.75rem;
		color: var(--color-white);
	}
	
	.navbar-custom .nav-item .nav-link:hover,
	.navbar-custom .nav-item .nav-link.active {
		color: var(--color-primary);
	}

	.navbar-custom.top-nav-collapse {
        padding: 0.5rem 1.5rem 0.5rem 2rem;
		box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.1);
		background-color: var(--color-secondary);
	}

	.navbar-custom.top-nav-collapse .navbar-brand.logo-text {
		color: var(--color-white);
	}

	.navbar-custom.top-nav-collapse .nav-item .nav-link {
		color: var(--color-white);
	}
	
	.navbar-custom.top-nav-collapse .nav-item .nav-link:hover,
	.navbar-custom.top-nav-collapse .nav-item .nav-link.active {
		color: var(--color-primary);
	}

	/* end of navigation */


	/* Header */
	.section-hero .header-content {
		padding-top: 11rem;
	}
	/* end of header */


	/* Testimonials */
	.section-testimonials .swiper-button-prev {
		left: 1rem;
		width: 1.375rem;
		background-size: 1.375rem 2.125rem;
	}
	
	.section-testimonials .swiper-button-next {
		right: 1rem;
		width: 1.375rem;
		background-size: 1.375rem 2.125rem;
	}
	/* end of testimonials */


	/* Features */
	.section-features .card .card-icon {
		width: 4.5rem;
		height: 4.5rem;
	}
	
	.section-features .card .card-icon .fas,
	.section-features .card .card-icon .far {
		font-size: 2.25rem;
		line-height: 4.5rem;
	}

	.section-features #tab-1 .card.left-pane .text-wrapper {
		width: 85%;
	}

	.section-features #tab-2 img {
		margin-bottom: 0;
	}

	.section-features #tab-2 .text-area {
		margin-top: 0;
	}

	.section-features #tab-2 .icon-cards-area .card {
		display: inline-block;
		width: 44%;
		margin-right: 2.5rem;
		vertical-align: top;
	}

	.section-features #tab-2 div.card:nth-child(2n+2) {
		margin-right: 0;
	}

	.section-features #tab-3 .text-area {
		margin-bottom: 0;
	}

	.section-features #tab-3 .icon-cards-area .card {
		display: inline-block;
		width: 44%;
		margin-right: 2.5rem;
		vertical-align: top;
	}

	.section-features #tab-3 div.card:nth-child(2n+2) {
		margin-right: 0;
	}

	.section-features #tab-3 img {
		margin-bottom: 0;
	}
	/* end of features */


	/* Screenshots */
	.section-screenshots .swiper-button-prev {
		width: 1.375rem;
		background-size: 1.375rem 2.125rem;
	}
	
	.section-screenshots .swiper-button-next {
		width: 1.375rem;
		background-size: 1.375rem 2.125rem;
	}
	/* end of screenshots */


	/* Extra Pages */
	.section-page-hero {
		padding-top: 11rem;
		padding-bottom: 9rem;
	}

	.section-page-content .text-container.dark {
		padding: 2.5rem 3rem 2rem 3rem;
	}

	.section-page-content .text-container.column {
		width: 90%;
		margin-right: auto;
		margin-left: auto;
	}
	/* end of extra pages */
}
/* end of min-width width 768px */


/* Min-width width 992px */
@media (min-width: 992px) {
	
	/* Navigation */
	.navbar-custom .social-icons {
		display: block;
		margin-left: 0.5rem;
	}

	.navbar-custom .fa-stack {
		margin-bottom: 0.1875rem;
		margin-left: 0.375rem;
		font-size: 0.75rem;
	}
	
	.navbar-custom .fa-stack-2x {
		color: var(--color-primary);
		transition: all 0.2s ease;
	}
	
	.navbar-custom .fa-stack-1x {
		color: var(--color-white);
		transition: all 0.2s ease;
	}

	.navbar-custom .fa-stack:hover .fa-stack-2x {
		color: var(--color-white);
	}

	.navbar-custom .fa-stack:hover .fa-stack-1x {
		color: var(--color-primary);
	}
	/* end of navigation */


	/* General Styles */
	.p-heading {
		width: 65%;
	}
	/* end of general styles */


	/* Header */
	.section-hero .header-content {
		padding-top: 13rem;
		padding-bottom: 10rem;
		text-align: left;
	}

	.section-hero .text-container {
		margin-top: 6.5rem;
	}
	/* end of header */


	/* Features */
	.section-features .card-body {
		padding: 1rem 0 1.5rem 0;
	}
	
	.section-features #tab-1 .card.left-pane {
		text-align: right;
	}

	.section-features #tab-1 .card.left-pane .text-wrapper,
	.section-features #tab-1 .card.right-pane .text-wrapper {
		width: 68%;
	}

	.section-features #tab-1 .card.left-pane .card-icon {
		float: none;
		margin-right: 0;
		margin-left: 1rem;
	}

	.section-features #tab-1 img {
		margin-top: 0;
		margin-bottom: 0;
	}
	
	.section-features #tab-2 .icon-cards-area {
		margin-top: 2.25rem;
	}

	.section-features #tab-2 .icon-cards-area .card {
		width: 45%;
		margin-right: 3.5rem;
	}

	.section-features #tab-2 .icon-cards-area .card p {
		margin-bottom: 0.5rem;
	}

	.section-features #tab-3 .icon-cards-area .card {
		width: 45%;
		margin-right: 3.5rem;
	}

	.section-features #tab-3 .icon-cards-area .card p {
		margin-bottom: 0.5rem;
	}
	/* end of features */


	/* Video */
	.section-preview .image-container {
		max-width: 53.125rem;
		margin-right: auto;
		margin-left: auto;
	}
	/* end of video */


	/* Screenshots */
	.section-screenshots .swiper-container {
		width: 92%;
	}
	/* end of screenshots */


	/* Download */
	.section-download {
		padding-top: 6.75rem;
	}

	.section-download .text-container {
		margin-top: 7rem;
		margin-bottom: 0;
		text-align: left;
	}
	/* end of download */


	/* Extra Pages */
	.section-page-hero h1 {
		width: 80%;
		margin-right: auto;
		margin-left: auto;
	}

	.section-page-content {
		padding-bottom: 5rem;
	}

	.section-page-content .text-container.column {
		margin-bottom: 0;
	}
	/* end of extra pages */
}
/* end of min-width width 992px */


/* Min-width width 1200px */
@media (min-width: 1200px) {
	
	/* Navigation */
	.navbar-custom {
		padding: 2.125rem 5rem 2.125rem 5rem;
	}

	.navbar-custom.top-nav-collapse {
        padding: 0.5rem 5rem 0.5rem 5rem;
	}
	/* end of navigation */

	
	/* General Styles */
	.p-heading {
		width: 44%;
	}
	/* end of general styles */


	/* Header */
	.section-hero .text-container {
		margin-top: 7.5rem;
		margin-left: 2.5rem;
	}

	.section-hero .image-container {
		margin-left: 3rem;
	}
	/* end of header */


	/* Features */
	.section-features {
		padding-bottom: 6.5rem;
	}

	.section-features #tab-1 .card.first {
		margin-top: 4.25rem;
	}

	.section-features #tab-1 .card {
		margin-bottom: 0.75rem;
	}

	.section-features #tab-1 .card.left-pane .text-wrapper,
	.section-features #tab-1 .card.right-pane .text-wrapper {
		width: 73%;
	}

	.section-features #tab-1 img {
		margin-top: 0;
	}

	.section-features #tab-2 .container {
		padding-right: 2.5rem;
		padding-left: 2.5rem;
	}

	.section-features #tab-2 .text-area {
		margin-top: 1.5rem;
		margin-right: 1rem;
		margin-left: 1rem;
	}

	.section-features #tab-2 .icon-cards-area {
		margin-right: 1rem;
		margin-left: 1rem;
	}

	.section-features #tab-2 .icon-cards-area .card {
		margin-right: 3.875rem;
	}

	.section-features #tab-3 .container {
		padding-right: 2.5rem;
		padding-left: 2.5rem;
	}
	
	.section-features #tab-3 .icon-cards-area {
		margin-top: 2rem;
		margin-left: 1rem;
	}

	.section-features #tab-3 .icon-cards-area .card {
		margin-right: 3.875rem;
	}
	
	.section-features #tab-3 .text-area {
		margin-right: 1.5rem;
		margin-left: 1rem;
	}
	/* end of features */


	/* Download */
	.section-download .text-container {
		margin-top: 11rem;
	}

	.section-download .image-container {
		margin-left: 3rem;
	}
	/* end of download */


	/* Extra Pages */
	.section-page-hero h1 {
		width: 60%;
		margin-right: auto;
		margin-left: auto;
	}

	.section-page-content .form-container {
		margin-left: 1.75rem;
	}

	.section-page-content .image-container-small {
		margin-left: 1.75rem;
	}
	/* end of extra pages */
}
/* end of min-width width 1200px */