/* ================================= CSS Structure =================================
1. GLOBAL STYLES	
	- Fonts
	- Main Styles
	- Extra Classes
		- Z Indexes
		- Social Icon Hover Styles
		- Title and Desc Styles
		- Pointer Arrow Common Styles
	- Button Styles

2. HEADER SECTION	
	- Triangle Background
	- Logo & Menu
		- Navigation
	- Top Social Icon Styles
	
3. BANNER SECTION
	- Left Banner Styles
	- Right Banner Styles
	
4. SHAPE SECTION
	- Shape Color Styles
	
5. FEATURES SECTION
6. REVIEWS SECTION
7. SERVICES SECTION
8. SCREENSHOT SECTION
9. PRICING SECTION
10. DEMO SECTION
11. DOWNLOAD SECTION
12. CONTACT US SECTION
13. FOOTER SECTION
=========================================================================== */

/* =========================== CSS VARIABLES ============================== */
:root {
	--color-accent: #d2e360;
	--color-accent-hover: #dae979;
	--color-text-primary: #7f8c8d;
	--color-text-secondary: #1A1A1A;
	--color-text-tertiary: #ecf0f1;
}

/* =========================== GLOBAL STYLES ============================== */
/* ------------- Fonts ------------- */
@font-face {
	font-family: "Flaticon";
	src: url("../fonts/flaticon.eot");
	src: url("../fonts/flaticon.eot#iefix") format("embedded-opentype"),
	url("../fonts/flaticon.woff") format("woff"),
	url("../fonts/flaticon.ttf") format("truetype"),
	url("../fonts/flaticon.svg") format("svg");
	font-weight: normal;
	font-style: normal;
}
@font-face {
    font-family: 'latohairline';
    src: url('../fonts/lato-hai-webfont.eot');
    src: url('../fonts/lato-hai-webfontd41d.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-hai-webfont.woff') format('woff'),
         url('../fonts/lato-hai-webfont.ttf') format('truetype'),
         url('../fonts/lato-hai-webfont.svg#latohairline') format('svg');
    font-weight: normal;
    font-style: normal;
}
[class^="flaticon-"]:before, [class*=" flaticon-"]:before,
[class^="flaticon-"]:after, [class*=" flaticon-"]:after {   
	font-family: Flaticon;
    font-size: 20px;
	font-style: normal;	
}
.flaticon-arrow351:before {
	content: "\e000";
}
.flaticon-big44:before {
	content: "\e001";
}
.flaticon-check13:before {
	content: "\e002";
}
.flaticon-checkmark17:before {
	content: "\e003";
}
.flaticon-open7:before {
	content: "\e004";
}
.flaticon-phone71:before {
	content: "\e005";
}
.flaticon-yield:before {
	content: "\e006";
}
.glyph-item { 
    line-height: 1;
	display: inline-block;
}
/* ------------- Main Styles ------------- */
body {
	color: var(--color-text-secondary);
	font-size: 12px;
	padding: 0;
	font-family: 'Open Sans', sans-serif;
	-webkit-font-smoothing: antialiased !important;
	background: url(../images/bg.png) top left repeat #fff;
	overflow-x: hidden;	
	margin: 0 auto;
}
a, a:hover, a:focus, .btn:focus{
    text-decoration: none;
	outline: none;
	color: var(--color-text-tertiary);
}
img, img.responsive {
	max-width:100%;
	width: auto \9 !important;
}
.relative {
	position: relative;
}
.absolute {
	position: absolute;
}
.static {
	position: static;
}
.container {
    max-width: 1200px;
	width: 100%;
}
.no-padding {
	padding: 0;
}
.uppercase {
	text-transform: uppercase;
}
.capitalize {
	text-transform: capitalize;
}
.animated {
	visibility:hidden;
	animation-fill-mode: none;
	-webkit-animation-fill-mode: none;
	-moz-animation-fill-mode: none;
	-o-animation-fill-mode: none;
	-ms-animation-fill-mode: none;
}
.visible {
	visibility:visible;
}
.btn:hover, .btn:focus {
	background: var(--color-text-tertiary);
	color: var(--color-text-secondary) !important;
}
.btn {
	display: inline-block;
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    -ms-transition: all 500ms linear;
    transition: all 500ms linear;
}

.btn-primary {
	background-color: #2F3437;
	color: #FFFFFF;
	border: 2px solid #2F3437;
	padding: 13px 12px;
	width: 159px;
	border-radius: 6px;
	font-weight: 700;
	cursor: pointer;
	transition: all 0.25s ease;
  }
  
  .btn-primary:hover {
	background-color: #1F2326;
	border-color: #1F2326;
	transform: translateY(-1px);
  }
  
  
  /* Secondary Button */
  .btn-secondary {
	background-color: transparent;
	color: #2F3437;
	border: 2px solid #2F3437;
	padding: 12px 28px;
	border-radius: 6px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.25s ease;
  }
  
  .btn-secondary:hover {
	background-color: #2F3437;
	color: #FFFFFF;
	transform: translateY(-1px);
  }
/* ------------- Extra Classes ------------- */
.text-extrabold {
	font-weight: 800;
}
.text-bold {
	font-weight: 700;
}
.light-italic {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-style: italic;
}
.extrabold-italic {
	font-family: 'Open Sans', sans-serif;
	font-weight: 800;
	font-style: italic;
}
.bold-italic {
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	font-style: italic;
}
.color-yellow {
	color: #F1C40F;
}
.color-grey {
	color: #7f8c8d;
}
.color-white {
	color: #FFFFFF;
}

.pageloader { 
	background: url(../images/loader.gif) center center no-repeat #fff;  
    height: 100%;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 99999;	
}
/* ------- Z Indexes ------- */
.index-1 {
	z-index: 1;
}
.index-2 {
	z-index: 2;
}
.index-3 {
	z-index: 3;
}
.index-4 {
	z-index: 4;
}
.index-big {
	z-index: 99;
}
/* ------- Social Icon Hover Styles ------- */
.gk-facebook:hover, .gk-facebook:focus, .gk-facebook:active {
	background: #3B5999;
	color: #fff;
}
.gk-twitter:hover, .gk-twitter:focus, .gk-twitter:active {
	background: #00ACEE;
	color: #fff;
}
/* ------- Title and Desc Styles ------- */
.section-title {
	font-family: 'Open Sans', sans-serif;
	font-size: 61px;
	text-align: center;
	text-transform: uppercase;
	margin-bottom: 20px;
	font-weight: 300;
}
.after-2000 .section-title, .after-2600 .section-title, .after-3000 .section-title {
	font-size: 60px;
}
.section-msg {
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 32px;
	line-height: 1.4;
	margin-top: 15px;
}
.section-msg1 {
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 42px;
}
/* ------- Trust Point (About) Styles ------- */
.gk-trust-point {
	display: flex;
	align-items: center;
}
.gk-trust-point-number {
	width: 60px;
	height: 60px;
	line-height: 60px;
	min-width: 60px;
	font-size: 1.50rem;
	font-weight: 600;
	border: 1px solid var(--color-text-secondary);
	border-radius: 50%;
	margin-right: 22px;
	text-align: center;
}
.gk-trust-point-title {
	font-size: 1.75rem;
}
.gk-trust-point-desc {
	font-size: 1.5rem;
}
.gk-triangle-medium:before, .gk-triangle-medium:after {
	font-size: 30px;
}
/* ------- Pointer Arrow Common Styles ------- */
.gk-pointer-features {
	position: absolute;
}
.gk-pointer-features.animated {
	visibility: hidden;
}
.gk-pointer-features.visible {
	visibility: visible;
}
/* ------------- Button Styles ------------- */
.gk-btn {
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	padding: 13px 12px;
	width: 159px;
}
.gk-btn .fa {
	padding-right: 8px;
}
.gk-btn-margin {
	margin-right: 30px;
}
.yellow-btn {
	border-color: #F1C40F;
	color: #F1C40F;
}
.yellow-btn:hover, .yellow-btn:active, .yellow-btn:focus {
	background: #F1C40F;
	color: #FFFFFF;
}
.green-btn:hover, .green-btn:active, .green-btn:focus {
	background: var(--color-accent);
	color: var(--color-text-secondary);
}
.green-btn {
	border-color: var(--color-accent);
	color: var(--color-accent);
}
.white-btn {
	background: none;
	border: 1px solid var(--color-text-secondary);
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	padding: 12px 40px;
}

.white-reverse-btn {
	background: var(--color-text-tertiary);
	border: 1px solid var(--color-text-tertiary);
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	padding: 12px 40px;
}
.white-reverse-btn:hover {
	background: none;
	
}
/* =========================== HEADER SECTION ============================== */
/* ------------- Triangle Background ------------- */
.triangle-bg {	
	min-height: 480px;
	position: relative;
	top: -70px;	
	margin: 0 auto;
	background: #FFFFFF;
}
.triangle-bg:before {
	border-color: #d2e360 transparent transparent #d2e360;
    border-style: solid;
    border-width: 550px;
    content: "";
    height: 0;
    left: 0;
    position: absolute;
    top: 0;
    width: 0;
    z-index: 1;	
}
.after-1600 .triangle-bg:before {
	border-width: 630px;
}
.after-1800 .triangle-bg:before {
	border-width: 675px;
}
.after-2000 .triangle-bg:before {	
	border-width: 725px;
}
.after-2600 .triangle-bg:before {
	border-width: 900px;
}
.after-3000 .triangle-bg:before {	
	border-width: 1350px;
}
/* ------------- Logo & Menu ------------- */
.logo-container {
	background: rgba(27,38,51,0.9);
	color: #fff;
	padding: 16px 0 13px;
}
.logo {
	max-width: 150px;
	max-height: 100px;
	width: 100%;
	height: 100%;
	/* object-fit: contain; */
}
.sticky-navigation {
	width: 100%;
	z-index: 9999;	
	position: relative;
}
/* -------- Navigation --------- */
.top-navbar {
	margin: 0;
	min-height: inherit;
}
.top-navbar ul.nav a {	
	font-size: 13px;
	font-weight: 800;	
	/* color: #F1C40F; */
	color: var(--color-accent);
}
.top-navbar ul.nav a:hover, .top-navbar ul.nav a:focus, .top-navbar ul.nav a:active, .top-navbar ul.nav li.active a {
	background:none !important;
	color: var(--color-text-tertiary);
}
/* -------- Hamburger menu -------- */
.nav-hamburger {
	display: none;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 10px;
	border: none;
	border-radius: 6px;
	background-color: var(--color-accent, #F1C40F);
	cursor: pointer;
	flex-direction: column;
	gap: 5px;
	transition: background-color 0.2s;
}
.nav-hamburger:hover {
	background-color: var(--color-accent-hover, #e6b80a);
}
.nav-hamburger .hamburger-line {
	display: block;
	width: 22px;
	height: 2px;
	background-color: #fff;
	border-radius: 1px;
	transition: transform 0.2s, opacity 0.2s;
}
.nav-hamburger[aria-expanded="true"] .hamburger-line:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}
.nav-hamburger[aria-expanded="true"] .hamburger-line:nth-child(2) {
	opacity: 0;
}
.nav-hamburger[aria-expanded="true"] .hamburger-line:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}
/* Legacy icon-bar (if used elsewhere) */
.navbar-toggle {
	background-color: var(--color-accent, #F1C40F);
}
.navbar-toggle .icon-bar {
	background-color: #fff;
}
.navbar-nav {
	margin: 0;
}
.navbar-nav li {
	margin-right: 20px;
}
.after-2000 .navbar-nav li, .after-2600 .navbar-nav li {
	margin-right: 12px;
}
.navbar-nav li a{
	padding-bottom:7px;
	padding-top:7px;
}
.top-navbar .dropdown a{
	background:none !important;
}
/* ------------- Top Social Icon Styles ------------- */
.top-social-icon {
	margin: 0;
	padding: 0;
	list-style: none;
	float: right;
}
.top-social-icon li {
	float: left;	
}

.top-social-icon li a {
	background: #fff;
	border-radius: 100%;	
	font-size: 12px;	
	display: block;
	width: 18px;
	height: 18px;
	color: #1b2633;
	margin: 7px 26px 0 0;	
}
.top-social-icon li .fa {
	width: 18px;
	height: 18px;
	display: block;
	line-height: 18px;
	text-align: center;
}
.top-social-icon li:last-child a {
	margin-right: 0;
}
/* =========================== BANNER SECTION ============================== */
/* ------------- Left Banner Styles ------------- */
.left-banner-text {
	margin-top: 60px;
	padding-top: 50px;
	color: #FFFFFF;
}
.after-1500 .left-banner-text {
	margin-top: 30px;
}
.after-1500 .right-banner-image {
	margin-top: 20px;
}
.left-banner-text h1 {
	font-size: 53px;
	margin: 0;
	font-weight: 300;
	font-family: 'Open Sans', sans-serif;
}
.text-slider {
	margin-bottom: 30px;
}
.text-slider ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.banner-text {
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 17px;
	padding: 0 30px 0 0;
	color: #7f8c8d;
}
.banner-button {
	padding: 32px 45px 0 0;
}

.triangle-shape {
	padding: 45px 0 0;
}
.flaticon.gk-triangle-bigsharp:before, .flaticon.gk-triangle-bigsharp:after {
	font-size: 36px;
	font-weight: bold;
}
.banner-section {
	padding-top: 70px;
	position: relative;
	z-index: 10;
}
.banner-triangle:hover, .banner-triangle:active, .banner-triangle:focus {
	color: #FFFFFF;	
}
.banner-triangle:hover {
	opacity: 0.6;
	transition: all 0.4s ease-in 0s;
	-moz-transition: all 0.4s ease-in 0s;
	-webkit-transition: all 0.4s ease-in 0s;
	-o-transition: all 0.4s ease-in 0s;
	-ms-transition: all 0.4s ease-in 0s;
}
.banner-left-margin {
	margin-left: 45px;
	margin-bottom: 12px;
}
/* ------------- Right Banner Styles ------------- */
.right-banner-image {
	padding-top: 10px;
	margin-top: 50px;
}
.banner-image-info {
	margin-top: 410px;
}
.banner-info {
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 12px;
	color: var(--color-text-secondary);
	padding-right: 5px;
}
.banner-info .text-bold {
	font-size: 32px;
	display: block;
	color: var(--color-text-secondary);
}
.close-brackets {
	font-family: 'latohairline';
	color: var(--color-text-secondary);
	font-size: 86px;
}
.banner-image-info .fa {
	font-size: 32px;
	vertical-align: top;
	line-height: 80px;
	margin-top: 20px;
	padding-left: 15px;
	width: 40px;
}
.banner-image-info .fa-solid,
.banner-image-info .fa-brands {
	font-size: 32px;
	vertical-align: top;
	line-height: 80px;
	margin-top: 20px;
	padding-left: 15px;
	width: 40px;
}
.banner-info-right {
	margin-top: -30px;
}
/* =========================== SHAPE SECTION ============================== */
.shape-section {	
	position: relative;
	overflow: hidden;
	top: -110px;	
	margin: 0 auto -110px auto;
	background: #FFFFFF;
}
.gk-shape-cover {    
    position: relative;
    top: 0;
	margin-bottom: 80px;
}
.gk-dd-shape {
    width: 100%;
    height: 1800px;
    position: relative;
	max-width: 1600px;
	margin: 0 auto;
}
.gk-dd-shape:before{
    position: absolute;
    display: block;
    content: "";
    width: 1800px;
    height: 1800px;
    left: -765px;
    top: 375px;	
    right: 0;
    bottom: 0;
    -webkit-transform: rotate(43deg);
    -moz-transform: rotate(43deg);
	-o-transform: rotate(43deg);
	-ms-transform: rotate(43deg);
    transform: rotate(43deg);
}
.gk-dd-shape:after {
    position: absolute;
    display:block;
    content: "";
   	width: 1800px;
    height: 1800px;    
    top: 1295px;
    left: 25%;
    bottom: 0;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
.after-1500 .gk-dd-shape:before {
	left: -685px;
}
.after-1500 .gk-dd-shape:after {
	left: 29%;
	top: 1290px;
}
.after-1600 .gk-dd-shape:before {
	left: -635px;
}
.after-1600 .gk-dd-shape:after {
	left: 30%;
	top: 1300px;
}
.after-1800 .gk-dd-shape:before, .after-2000 .gk-dd-shape:before, .after-2600 .gk-dd-shape:before, .after-3000 .gk-dd-shape:before {
	height: 3800px;
    left: -1300px;
	top: 110px;
}
.after-1800 .gk-dd-shape:after, .after-2000 .gk-dd-shape:after, .after-2600 .gk-dd-shape:after, .after-3000 .gk-dd-shape:after {
	width: 3800px;
	top: 1970px;
	left: 14%;
}
/* ------------- Shape Color Styles ------------- */
.grey-green-color:before {
	background: var(--color-accent);
}
.grey-green-color:after {
	background: var(--color-accent);
}
.white-grey-color:before {
	background: #FFFFFF;
}
.white-grey-color:after {
	background: #ecf0f1;
}
.green-white-color:before {
    background: var(--color-accent);
}
.green-white-color:after {
    background: #ffffff;
}
.grey-green-color:before {
	background: #ecf0f1;
}
.grey-green-color:after {
	background: var(--color-accent);
}
/* =========================== FEATURES SECTION ============================== */
.features-section {
	padding: 120px 0 20px;
}
.features-left-info {
	padding: 120px 0 0 15px;
}
.gk-list {
    display: inline-block;
    width: 100%;
	padding-top: 5px;
}
.gk-list li {
	font-size: 17px;
	clear: both;
	float: left;
	display: inline-block;
	border-bottom: 1px solid #bdc3c7;
	padding: 5px 12px 5px 0;
}
.gk-list li .fa {
	display: inline;
	font-size: 15px;	
}
.gk-list li .simple-icon {
	font-size: 14px;
	padding-right: 4px;
	text-shadow: 0 0 0;
}
.gk-list li.no-border {
	border: none;
	align-items: center;
}
.features-right-grid {
	padding-top: 30px;
	padding-left: 40px;
}
.text-right .features-grid {
	padding: 0 30px 10px 30px;
}
.features-grid {
	padding: 0 40px 10px 0;	
}
.features-grid .fa, .features-grid .simple-icon {
	font-size: 26px;
	padding-bottom: 10px;
}
.grid-title {
	font-size: 21px;
}
.features-line {
	border-color: #bdc3c7;
	width: 78%;
}
.features-right-grid .text-right .features-line {	
	margin-left: 20px;
	margin-right: 20px;
	float: right;
}
.features-right-grid .features-line {
	margin-right: 20px;
	margin-left: -10px;
	float: left;
}
.gk-divider {
	border-right: 1px solid #bdc3c7;
}
.ipad-shot-wrapper {
	margin-top: -165px;	
	margin-left: -108px;
	z-index: -1;
}
.features-right-info {
	position: static;
	padding-left: 120px;	
}
.gk-pointer-features.gk-right-arrow {	
	left: 15%;
	top: 6%;
}
/* =========================== REVIEWS SECTION ============================== */
.gk-pointer-features.gk-left-arrow {	
	top: 100%;
	right: -38%;
}
.section-padding {
	padding: 100px 0 20px;
}
.reviews-slider-section {
	padding: 90px 0 0;
}
.reviews-info {
	text-align: center;
	padding: 0 70px 0 30px;
}
.reviews-msg {
	font-size: 17px;
	margin-bottom: 40px;
	line-height: 1.6;
}
.reviews-msg:before {
	content: "\e004";	
	font-family: Flaticon;
	color: #F1C40F;
	font-size: 26px;
}
.reviews-image img {
	float: right;
	max-width: 310px;
	margin: 30px 30px 0 0;
}
.reviews-author:before {
	content: "";	
	width: 100%;
	height: 100%;
	border: 1px solid #7f8c8d;
	border-radius: 50%;
	padding: 0 7px;
	font-size: 10px;
}
.reviews-author {
	font-size: 21px;
}
.reviews-author .author-sub {
	font-size: 17px;
}
.author-margin {
	margin: 45px 0 0;
}
.info-margin {
	margin: 35px 0 0;
}
.reviews-indicators {
	position: absolute;
	top: 0;
	right: 14%;
}
.reviews-indicators .fa {
	font-size: 26px;
}
.reviews-indicators .fa:hover {
	opacity: 0.7;
}
.main-reviews-image {
    padding-bottom: 90px;
}
.gk-reviews-big-circle {
	width: 130px;
	height: 130px;
	border: 1px solid #FFFFFF;
	border-radius: 100%;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	-o-border-radius: 100%;
	-ms-border-radius: 100%;
	position: absolute;
	top: 67%;
	left: 20%;
}
.gk-reviews-small-circle {
	width: 80px;
	height: 80px;
	border: 1px solid #FFFFFF;
	border-radius: 100%;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	-o-border-radius: 100%;
	-ms-border-radius: 100%;
	position: absolute;
	left: 86%;
	top: 81%;
}
.gk-slide-left, .gk-slide-right {
	padding: 0 10px;
}
/* =========================== SERVICES SECTION ============================== */
.awesome-container {
	padding-top: 100px;
	padding-bottom: 80px;
	max-width: 1320px;
}
.awesome-services {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #35c8ab;
    border-radius: 12px;	
	max-width: 312px;
	margin: 0 auto;
	padding: 40px 35px;
}
.awesome-services .simple-icon {
    font-size: 32px;
    padding-bottom: 30px;
	display: block;
}
.awesome-services h3 {
	font-size: 21px;
	margin-top: 0;
	margin-bottom: 25px;
}
.awesome-services .big-text {
	font-size: 17px;
	line-height: 27px;
	margin-bottom: 18px;
}
.gk-app-left-down-arrow {
    left: 31%;
    top: 84%;
}
/* =========================== SCREENSHOT SECTION ============================== */
.app-section-padding {
	padding: 140px 0 20px;
}
.app-left-info {
	padding-top: 70px;
}
.gk-pointer-features.gk-app-right-arrow {
	top: 25%;
	left: 19.5%;
}
.gk-pointer-features.gk-about-right-arrow {
	top: 5%;
	left: 31%;
}
.about-left-info {
	padding-top: 110px;
}
/* Gap between reviews and Track your business - higher specificity so it isn't overridden */
#about.app-services-section {
	padding-top: 220px;
}
.reviews-section {
	padding-bottom: 80px;
}

.owl-controls {
	text-align: right;
	padding: 20px 20px 0 0;
	max-width: 1200px;
	margin: 0 auto;
}
.owl-controls .owl-buttons div {
	display: inline-block;
}
.owl-controls .owl-buttons .fa {
	padding: 0 10px;
	font-size: 26px;
}
.owl-controls .owl-buttons .fa:hover {
	opacity: 0.7;
}
.app-carousel-slider {
	padding: 15px 0 0;
}
.screen-item img {
	border-radius: 12px;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
	-o-border-radius: 12px;
	-ms-border-radius: 12px;
	margin: 0 auto;
}
.app-container {
	max-width: 1320px;
}
/* =========================== PRICING SECTION =========================== */
.pricing-section.app-section-padding {
	padding-top: 120px;
}
.gk-pricing-arrow {
    left: 24%;
    top: 75%;
}
.pricing-container {
	max-width: 1320px;
	padding-top: 90px;
}
/* Pricing: row = flex container for equal-height cards; Bootstrap grid defines column widths */
.pricing-grid.row {
	display: flex;
	flex-wrap: wrap;
}
.pricing-grid [class*="pricing-item"] {
	display: flex;
}
.pricing-grid [class*="pricing-item"] > a {
	width: 100%;
	min-width: 0;
	display: flex;
}
.pricing-box {
	width: 100%;
	min-width: 329px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	flex: 1;
	min-height: 0;
}
.pricing-title {
	background: none repeat scroll 0 0 #1a2836;
    border-radius: 10px 10px 0 0;
    padding: 20px 0;
}
.pricing-price{
	white-space: nowrap;
	align-self: center;
}
.pricing-info-swtc-icon {
	font-size: 11px !important;
	cursor: help;
	opacity: 0.85;
	align-self: end;
}
.pricing-info-swtc-icon:hover {
	opacity: 1;
}
.pricing-title-free-icon{
	font-size: 13px;
	cursor: help;
	opacity: 0.85;
}
.pricing-title-free-icon:hover {
	opacity: 1;
}
.pricing-title h3 {
	font-size: 21px;
}
.pricing-box .symbol { 
	font-size: 21px;
	vertical-align: top;
	line-height: 50px;
	padding-right: 8px;
}
.pricing-box .price h6 { 
	font-size: 90px;
	line-height: 90px;
	padding-left: 20px;
	margin-top: 15px;
	margin-bottom: 20px;
}
.price .per-month { 
	font-size: 17px;
	line-height: 20px;
}
.pricing-box ul {
	background: none repeat scroll 0 0 #fff;
	border: 1px solid #8ea8c1;
	border-radius: 0 0 10px 10px;
	padding: 40px;
	width: 100%;
	flex: 1;
	display: flex;
	flex-direction: column;
	min-height: 368px;
}
.pricing-box ul li {
	line-height: 24px;
	display: flex;
	align-items: flex-start;
}
.pricing-box ul li .simple-icon {
	flex-shrink: 0;
	margin-right: 8px;
}
.pricing-box ul li .pricing-item-text {
	flex: 1;
	min-width: 0;
}

.pricing-container .btn:hover{
	color: #FFFFFF !important;
}
/* =========================== DEMO SECTION ============================== */
.video-bg{
	background:url(../images/video-bg.png) center center no-repeat;
	background-size: cover;
    padding-top:60px;
	padding-bottom: 60px;	
	position: relative;
    height: 510px;
	margin-top: 70px;
	border: 2px solid rgba(0,0,0,0.5);
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-o-border-radius: 6px;
	-ms-border-radius: 6px;
}
#video_container {
	height: 510px;
}
.mb_YTVPBar .ytpicon { 
	border-width: 12px;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	-o-border-radius: 50%;
	-ms-border-radius: 50%;
	font-size: 90px;
	line-height: 105px;
}
.mb_YTVPBar span{  
    height: 128px;    
    width: 128px;
}
.gk-pointer-features.gk-down-arrow {
	top: 64%;
	right: 20%;
}
/* =========================== HOW IT WORKS (work-process) ============================== */
#work-process.video-section {
	overflow: visible;
	padding-bottom: 80px;
}
/* #work-process .section-title,
#work-process .color-white {
	color: #fff !important;
} */
/* Card: light bg + dark text so content is always readable on any section bg */
#work-process .work-process-card {
	background: #ffffff;
	border-radius: 12px;
	padding: 28px 20px 32px;
	margin-bottom: 24px;
	text-align: center;
	box-shadow: 0 8px 24px rgba(0,0,0,0.12);
	max-width: 100%;
	overflow: visible;
	min-height: 350px;
}
#work-process .work-process-step {
	padding: 0;
	margin-bottom: 0;
	text-align: center;
	max-width: 100%;
	overflow: visible;
}
#work-process .work-process-icon-box {
	width: 90px;
	height: 90px;
	line-height: 90px;
	border-radius: 1.5rem;
	background: var(--color-accent, #d2e360);
	margin: 0 auto 24px;
	color: var(--color-text-primary);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 14px rgba(0,0,0,0.15);
}
#work-process .work-process-icon-box svg {
	width: 40px;
	height: 40px;
	vertical-align: middle;
}
#work-process .work-process-step h3 {
	margin-bottom: 12px;
	font-size: 17px;
	line-height: 1.3;
}
#work-process .work-process-step p {
	font-size: 15px;
	line-height: 1.6;
	margin: 0;
	padding: 0 5px;
	max-width: 100%;
	word-wrap: break-word;
	overflow-wrap: break-word;
}
#work-process .section-title {
	margin-bottom: 8px;
}
#work-process .row .col-md-4,
#work-process .row .col-sm-4 {
	min-width: 0;
}
@media (max-width: 991px) {
	#work-process .work-process-card {
		margin-bottom: 20px;
		padding: 24px 16px 28px;
	}
	#work-process .work-process-step p {
		padding: 0;
	}
}
/* =========================== DOWNLOAD SECTION ============================== */
.download-section-padding {
	padding: 100px 0 10px;
}
.download-left-img {
	margin-top: -100px;
}
.download-right-info {
	padding: 0 0 30px;
}
.download-button {
	text-align: center;
	padding-top: 30px;
}
.gk-download-btn {
	font-family: 'Open Sans',sans-serif;
    font-size: 13px;
    font-weight: 700;
    padding: 12px 16px;
    text-transform: uppercase;
    width: auto;
	color: #333;
	border-radius: 10px;
}
.gk-download-btn .fa {
	padding-right: 10px;
	font-size: 17px;
}
.gk-download-pointer.gk-up-right-arrow {
	top: 100%;
	left: 50%;
}
.download-section .gk-input-submit.submit {
    padding-top: 20px;
}
.subscribe-form {
	padding-top: 20px;	
}
.subscribe-form .form-group.gk-email {
	max-width: 415px;
	margin: 0 auto;
}
.has-error .help-block {
	margin: 0;
}
/* =========================== CONTACT US SECTION ============================== */
.gk-contact-form {
	padding-top: 40px;
}
.gk-contact-form .form-control {
	background: none;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	-o-box-shadow: none;
	-ms-box-shadow: none;	
	resize: none;
	border: none;
	border-bottom: 1px solid #7f8c8d;
	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	-o-border-radius: 0px;
	-ms-border-radius: 0px;
	color: var(--color-text-secondary);
	text-transform: uppercase;
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	font-size: 17px;
	padding-left: 0;
}
.gk-contact-form .form-control::-moz-placeholder {
	color:var(--color-text-secondary);
	text-transform: uppercase;
}
.gk-contact-form .form-control:-ms-input-placeholder {
	color:var(--color-text-secondary);
	text-transform: uppercase;
}
.gk-contact-form .form-control::-webkit-input-placeholder {
	color:var(--color-text-secondary);
	text-transform: uppercase;
}
.gk-contact-form .form-group {
	margin-bottom: 30px;
}
.gk-textarea-message .form-control {
	background-image: -webkit-linear-gradient(left, transparent 10px, transparent 10px), -webkit-linear-gradient(right, transparent 10px, transparent 10px), -webkit-linear-gradient(transparent 60px, #7f8c8d 60px, #7f8c8d 61px, transparent 61px);
    background-image: -moz-linear-gradient(left, transparent 10px, transparent 10px), -moz-linear-gradient(right, transparent 10px, transparent 10px), -moz-linear-gradient(transparent 60px, #7f8c8d 60px, #7f8c8d 61px, transparent 61px);
    background-image: -ms-linear-gradient(left, transparent 10px, transparent 10px), -ms-linear-gradient(right, transparent 10px, transparent 10px), -ms-linear-gradient(transparent 60px, #7f8c8d 60px, #7f8c8d 61px, transparent 61px);
    background-image: -o-linear-gradient(left, transparent 10px, transparent 10px), -o-linear-gradient(right, transparent 10px, transparent 10px), -o-linear-gradient(transparent 60px, #7f8c8d 60px, #7f8c8d 61px, transparent 61px);
    background-image: linear-gradient(left, transparent 10px, transparent 10px), linear-gradient(right, transparent 10px, transparent 10px), linear-gradient(transparent 60px, #7f8c8d 60px, #7f8c8d 61px, transparent 61px);
    background-size: 100% 100%, 100% 100%, 100% 61px;
	line-height: 61px;
	border: none;	
}
.gk-submit {
	background: none;
	border: 1px solid var(--color-text-secondary);
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	padding: 12px 40px;
}
.gk-contact-form .has-error .form-control {
	border-color: #a94442;
}
.gk-contact-form .has-error .form-control:focus, .gk-contact-form .has-success .form-control:focus {
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	-o-box-shadow: none;
	-ms-box-shadow: none;
}
.gk-contact-form .has-success .form-control:focus {
	border-color: var(--color-text-secondary);
}
.gk-textarea-message .form-control-feedback {
	line-height: 61px;
	height: 61px;
}
.has-error .gk-textarea-message .form-control {
	background-image: -webkit-linear-gradient(left, transparent 10px, transparent 10px), -webkit-linear-gradient(right, transparent 10px, transparent 10px), -webkit-linear-gradient(transparent 60px, #a94442 60px, #a94442 61px, transparent 61px);
    background-image: -moz-linear-gradient(left, transparent 10px, transparent 10px), -moz-linear-gradient(right, transparent 10px, transparent 10px), -moz-linear-gradient(transparent 60px, #a94442 60px, #a94442 61px, transparent 61px);
    background-image: -ms-linear-gradient(left, transparent 10px, transparent 10px), -ms-linear-gradient(right, transparent 10px, transparent 10px), -ms-linear-gradient(transparent 60px, #a94442 60px, #a94442 61px, transparent 61px);
    background-image: -o-linear-gradient(left, transparent 10px, transparent 10px), -o-linear-gradient(right, transparent 10px, transparent 10px), -o-linear-gradient(transparent 60px, #a94442 60px, #a94442 61px, transparent 61px);
    background-image: linear-gradient(left, transparent 10px, transparent 10px), linear-gradient(right, transparent 10px, transparent 10px), linear-gradient(transparent 60px, #a94442 60px, #a94442 61px, transparent 61px);    
}
.gk-form-message {
	text-align: center;
	font-size: 15px;
	font-weight: 700;
	padding-top: 10px;
}
.gk-form-message .glyphicon {
	padding-right: 8px;
}
.gk-form-message-subscribe {
	color: #7f8c8d;
}
.gk-contact-pointer {
	padding: 170px 0 0;
	margin-left: -70px;
}
.gk-contact-pointer img {
	margin: 0 auto;
}
.contact-info {
	padding-top: 160px;
	font-size: 17px;
}
.contact-row {
	margin-bottom: 15px;
}
.contact-row p {
	margin-bottom: 5px;
}

.contact-row p a:hover {
	color: var(--color-text-secondary);
	text-decoration: underline;
}
.contact-info .simple-icon {
	font-size: 20px;
	text-shadow: 0 0 0;
}
/* =========================== FOOTER SECTION ============================== */
.footer-bg {
	background: #1a2531;
	color: var(--color-text-primary);
	padding: 32px 0 28px;
	font-size: 14px;
	line-height: 1.6;
}
.footer-bg p {
	margin: 0 0 10px;
}
.footer-bg p:last-child {
	margin-bottom: 0;
}
.footer-inner {
	margin: 0 auto;
}
.footer-copyright {
	font-size: 16px;
	font-weight: 700;
	color: var(--color-text-tertiary);
	margin-bottom: 12px !important;
}
.footer-address {
	font-size: 16px;
	line-height: 1.5;
	margin-bottom: 8px !important;
}
.footer-phone {
	font-size: 16px;
}
.footer-bg a,
.footer-phone a {
	text-decoration: none;
	font-weight: 600;
	color: var(--color-text-tertiary);
}
.footer-bg a:hover,
.footer-phone a:hover {
	color: var(--color-text-tertiary);
	text-decoration: underline;
}


/* =========================== UTILITY CLASSES ============================== */
.bg-primary {
    background-color: var(--color-accent) !important;
}
.bg-primary:hover {
    background-color: var(--color-accent-hover) !important;
}

.text-primary {
    color: var(--color-accent) !important;
}
.text-primary:hover {
    color: var(--color-accent-hover) !important;
}

.text-black {
    color: var(--color-text-secondary);
}
.text-black:hover {
    color: var(--color-text-secondary);
}

/* Display */
.d-flex { display: flex !important; }
.d-block { display: block !important; }
.d-inline-block { display: inline-block !important; }
.d-inline-flex { display: inline-flex !important; }
.d-none { display: none !important; }

/* Flex direction & wrap */
.flex-row { flex-direction: row; }
.flex-column { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.flex-nowrap { flex-wrap: nowrap; }

/* Flex align & justify */
.align-items-center { align-items: center; }
.align-items-start { align-items: flex-start; }
.align-items-end { align-items: flex-end; }
.align-self-start { align-self: flex-start; }
.justify-content-center { justify-content: center; }
.justify-content-between { justify-content: space-between; }
.justify-content-end { justify-content: flex-end; }
.justify-content-start { justify-content: flex-start; }

/* Gap (spacing between flex/grid children) */
.gap-1 { gap: 0.25rem; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 1rem; }
.gap-4 { gap: 1.5rem; }

/* Spacing */
.mt-0 { margin-top: 0; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 1rem; }
.mb-0 { margin-bottom: 0; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 1rem; }
.mb-9 { margin-bottom: 3rem; }
.mr-2 { margin-right: 0.5rem; }
.ml-2 { margin-left: 0.5rem; }

/* Text */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-3rem { font-size: 3rem; }

/* =========================== UTILITY CLASSES END ============================== */


/* Header auth links (Sign In / Sign Up in nav) */
.header-auth-links {
	align-items: center;
	gap: 0.5rem;
}
.header-auth-links a {
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
}
.signin-btn {
	padding: 10px 20px;
	border-radius: 5px;
	background-color: #1a2836;
	color: #fff;
}

.signin-btn:hover{
	color: var(--color-accent-hover);
}
.signup-btn {
	padding: 10px 20px;
	border-radius: 5px;
}

/* ======================================== shapes section ======================================== */

.shape-msg{
	font-size: 18px;
	line-height: normal;
}

.ipad-shot-wrapper img{
	max-width: 550px;
    max-height: 300px;
    /* transform: skew(-55deg, 48deg); */
}

.owl-controls .owl-buttons{
	display: none;
}

.play-store-btn {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	background: var(--color-accent);
	text-decoration: none;
	padding: 12px 20px;
	border-radius: 8px;
	width: 220px;
	color: var(--color-text-secondary);
}

.play-store-text {
display: flex;
  flex-direction: column;
  line-height: 1.1;
}

.play-icon {
	font-size: 24px;
}
.play-store-text-small {
	font-size: 14px;
    text-align: left;
    margin-bottom: 4px;
}

.play-store-text-big {
	font-size: 20px;
	font-weight: bold;
}
.play-store-btn:hover {
	background: var(--color-accent-hover);
	color: var(--color-text-secondary);
}

.section-desc {
	font-size: 18px;
	line-height: 1.6;
	font-weight: 500;
}

.about-left-image {
	max-height: 650px;
	width: 100%;
	object-fit: contain;
}

.pricing-how-it-works-section {
	top: 160px;
}