@charset "utf-8";

@import "font-awesome.min.css";
@import "et-line.css";
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,300,700);
@import url(https://fonts.googleapis.com/css?family=Dosis:300,400,700);

/* ------------------------------------------------------------------
[Table of contents]

01. Common style

03. Typography
05. Forms fields
06. Home sections / .home-section

08. Classic menu bar / .main-nav
09. Sections styles / .page-section, .small-section, .split-section


27. Shortcodes










1. Common styles
2. Page loader / .page-loader


5. Forms fields
6. Home sections / .home-section
	6.1. Home content
	6.2. Scroll down icon
	6.3. Headings styles
7. Compact bar / .nav-bar-compact
8. Classic menu bar / .main-nav
9. Sections styles / .page-section, .small-section, .split-section
10. Alternative services / .alt-service-grid
11. Team / .team-grid
12. Features
13. Benefits (Process)
14. Counters
15. Portfolio / #portfolio
	15.1. Works filter
	15.2. Works grid
	15.3. Works full view
16. Banner section
17. Testimonial
	17.1. Logotypes
18. Post previews (news section)
19. Newsletter
20. Contact section
	20.1. Contact form
21. Bottom menu / .bot-menu
22. Google maps  /.google-map
23. Footer / .footer
24. Blog
	24.1. Pagination
	24.2. Comments
	24.3. Sidebar
25. Shop
26. Pricing
27. Shortcodes
	27.1. Owl Carousel
	27.2. Tabs
	27.3. Tabs minimal
	27.4. Alert messages
	27.5. Accordion
	27.6. Toggle
	27.7. Progress bars
	27.8. Font icons examples
	27.9. Intro page
28. Special demos
29. Skip to Content Link
30. Improve the readability
31. Wow animation fix
32. Morphext

*/


:root {
	--bs-blue: #0d6efd;
	--bs-indigo: #6610f2;
	--bs-purple: #6f42c1;
	--bs-pink: #d63384;
	--bs-red: #dc3545;
	--bs-orange: #fd7e14;
	--bs-yellow: #ffc107;
	--bs-green: #198754;
	--bs-teal: #20c997;
	--bs-cyan: #0dcaf0;
	--bs-white: #fff;
	--bs-gray: #6c757d;
	--bs-gray-dark: #343a40;
	--bs-gray-100: #f8f9fa;
	--bs-gray-200: #e9ecef;
	--bs-gray-300: #dee2e6;
	--bs-gray-400: #ced4da;
	--bs-gray-500: #adb5bd;
	--bs-gray-600: #6c757d;
	--bs-gray-700: #495057;
	--bs-gray-800: #343a40;
	--bs-gray-900: #212529;
	--bs-primary: #0d6efd;
	--bs-secondary: #6c757d;
	--bs-success: #198754;
	--bs-info: #0dcaf0;
	--bs-warning: #ffc107;
	--bs-danger: #dc3545;
	--bs-light: #f8f9fa;
	--bs-dark: #212529;
	--bs-primary-rgb: 13, 110, 253;
	--bs-secondary-rgb: 108, 117, 125;
	--bs-success-rgb: 25, 135, 84;
	--bs-info-rgb: 13, 202, 240;
	--bs-warning-rgb: 255, 193, 7;
	--bs-danger-rgb: 220, 53, 69;
	--bs-light-rgb: 248, 249, 250;
	--bs-dark-rgb: 33, 37, 41;
	--bs-white-rgb: 255, 255, 255;
	--bs-black-rgb: 0, 0, 0;
	--bs-body-color-rgb: 33, 37, 41;
	--bs-body-bg-rgb: 255, 255, 255;
	--bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	--bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	--bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
	--bs-body-font-family: var(--bs-font-sans-serif);
	--bs-body-font-size: 1rem;
	--bs-body-font-weight: 400;
	--bs-body-line-height: 1.5;
	--bs-body-color: #212529;
	--bs-body-bg: #fff;
}	
	

/* === 01. Common styles === */
.align-center {text-align:center !important;}
.align-left {text-align:left !important;}
.align-right {text-align:right !important;}
.text-justify {text-align: justify !important;}
.left {float:left !important;}
.right {float:right !important;}
.relative {position:relative;}
.hidden {display:none;}
.inline-block {display:inline-block;}
.white {color: #fff !important;}
.black {color: #111 !important;}
.color {color: #e41919 !important;}
.glass {opacity: .5;}
.image-fullwidth img {
	width: 100%;
}

:root {
	scroll-behavior: auto;
}

*, ::after, ::before {
	box-sizing: border-box;
}
	
html {
	overflow-y: scroll;
	-ms-overflow-style: scrollbar;
}

html, body {
	height: 100%;
	-webkit-font-smoothing: antialiased;
}

body {
	color: rgb(17, 17, 17);
	font-size: 14px;
	font-family: "Open Sans", arial, sans-serif;
	line-height: 1.6;
	margin: 0;
	text-align: var(--bs-body-text-align);
	background-color: var(--bs-body-bg);
	-webkit-text-size-adjust: 100%;
	display: block;
}

.clearfix::after {
	display: block;
	clear: both;
	content: "";
}

.relative {
	position:relative;
}

.page {
	overflow: hidden;
}

.row {
	--bs-gutter-x: 1.5rem;
	--bs-gutter-y: 0;
	display: flex;
	flex-wrap: wrap;
	margin-top: calc(-1 * var(--bs-gutter-y));
	margin-right: calc(-.5 * var(--bs-gutter-x));
	margin-left: calc(-.5 * var(--bs-gutter-x));
}

.row>* {
	flex-shrink: 0;
	width: 100%;
	max-width: 100%;
	padding-right: calc(var(--bs-gutter-x) * .5);
	padding-left: calc(var(--bs-gutter-x) * .5);
	margin-top: var(--bs-gutter-y);
}

@media (min-width: 768px) {
	.col-md-4 {
		flex: 0 0 auto;
		width: 33.33333333%;
	}
}


.stick-fixed {
	position: fixed !important;
	top: 0;
	left: 0;
}

.clearlist, .clearlist li {
	list-style: none;
	padding: 0;
	margin: 0;
	background: none;
}

.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
	width: 100%;
	padding-right: var(--bs-gutter-x, .75rem);
	padding-left: var(--bs-gutter-x, .75rem);
	margin-right: auto;
	margin-left: auto;
}

@media (min-width: 768px) {
	.container {
		width: 750px;
	}
}

@media (min-width: 992px){ 
	.container {
		width: 970px;
	}
}
@media (min-width: 1200px){ 
	.container {
		width: 1170px;
	}
}


.full-wrapper {
	margin: 0 2%;
}

a, b, div, ul, li {
	-webkit-tap-highlight-color: rgba(0,0,0,0); 
	-webkit-tap-highlight-color: transparent; 
	-moz-outline-: none;
}

a:focus:not(.focus-visible),
a:active,
section:focus,
div:active,
div:focus{
	-moz-outline: none;
	outline: none;
}

a:focus.focus-visible,
button:focus.focus-visible,
div:focus.focus-visible {
	-moz-outline: 2px dotted #36a367 !important;
	outline: 2px dotted #36a367 !important;
	outline-offset: 0 !important;
}

img:not([draggable]), embed, object, video {
	max-width: 100%;
	height: auto;
}

.animate, .animate * {
	-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
	-moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	-o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}

.no-animate, .no-animate * {
	-webkit-transition: 0 none !important;  
	-moz-transition: 0 none !important;  
	-ms-transition: 0 none !important;
	-o-transition: 0 none !important;	
	transition:0 none !important;  
}

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

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

@media only screen and (max-width: 575px) {
	.mb-xs-30 {
		margin-bottom: 30px !important;
	}
}

@media only screen and (max-width: 767px) {
	.mb-sm-40 {
		margin-bottom: 40px !important;
	}
}


.mb-0 {
	margin-bottom: 0 !important;
}

.mt-0 {
	margin-top: 0 !important;
}

.mb-0 {
	margin-bottom: 0 !important;
}

.mt-0 {
	margin-top: 0 !important;
}


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

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

.nav {
	display: flex;
	flex-wrap: wrap;
	padding-left: 0;
	margin-bottom: 0;
	list-style: none;
}

.nav-link {
	display: block;
	padding: .5rem 1rem;
	color: #0d6efd;
	text-decoration: none;
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
}

.fade {
	transition: opacity .15s linear;
}

.fade:not(.show) {
	opacity: 0;
}



/* === 03. Typografy === */
body {
	color: #111;
	font-size: 14px;
	font-family: "Open Sans", arial, sans-serif;
	line-height: 1.6;	
	-webkit-font-smoothing: antialiased;
}

a {
	color: #111;
	text-decoration: underline;
}
a:hover {
	color: #888;
	text-decoration: underline;
}

h1, h2, h3, h4, h5, h6 {
	margin-bottom: 1.3em;
	line-height: 1.4;
	font-weight: 400;
}

h1, .h1 {
	font-size: 32px;
}

h2, .h2 {
	font-size: 28px;
}

h3, .h3 {
	font-size: 24px;
}

h4, .h4 {
	font-size: 18px;
}

h5, .h5 {
	font-size: 14px;
}
h6, .h6 {
	font-size: 12px;
	font-weight: 700;
}

p {
	margin: 0 0 2em 0;
}

ul, ol {
	margin: 0 0 1.5em 0;
}

blockquote {
	margin: 3em 0 3em 0;
	padding: 0;
	border: none;
	background: none;
	font-style: normal;
	line-height: 1.7;
	color: #777;
}

blockquote p {
	margin-bottom: 1em;
	font-size: 24px;
	font-weight: 300;
	font-style: normal;
	line-height: 1.6;
}

blockquote footer {	
	font-size: 11px;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 2px;
}

.font-alt {
	font-family: Dosis, arial, sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.2em;
}


hr {
	margin: 1rem 0;
	color: inherit;
	background-color: currentColor;
	border: 0;
	opacity: .25;
}

hr:not([size]) {
	height: 1px;
}



/* === 04.Buttons === */
.btn-mod, 
a.btn-mod {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 4px 13px;
	color: #fff;
	background: rgba(34,34,34, .9);
	border: 2px solid transparent;
	font-size: 11px;
	font-weight: 400;
	text-transform: uppercase;
	text-decoration: none;
	letter-spacing: 2px;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	-webkit-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
	-moz-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	-o-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-ms-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}

.btn-mod:hover,
.btn-mod:focus,
a.btn-mod:hover,
a.btn-mod:focus {
	font-weight: 400;
	color: rgba(255,255,255, .85);
	background: rgba(0,0,0, .7);
	text-decoration: none;
	outline: none;
	border-color: transparent;	
	-webkit-box-shadow: none;
	box-shadow: none;
}

.btn-mod:active {
	cursor: pointer !important;
	outline: none !important;
}

.btn-mod.btn-medium {
	height: auto;
	padding: 8px 37px;
	font-size: 12px;
}






/* === 05. Forms fields === */
.form input[type="text"],
.form input[type="email"],
.form input[type="number"],
.form input[type="url"],
.form input[type="search"],
.form input[type="tel"],
.form input[type="password"],
.form input[type="date"],
.form input[type="color"],
.form select {
	display: inline-block;
	height: 27px;
	vertical-align: middle;
	font-size: 11px;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #777;
	border: 1px solid rgba(0,0,0, .1);
	padding-left: 7px;
	padding-right: 7px;
	
	-webkit-border-radius: 0.1px;
	-moz-border-radius: 0.1px;
	border-radius: 0.1px;
	
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	
	-webkit-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
	-moz-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	-o-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-ms-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	
	appearance: auto;
	-moz-appearance: auto;
	-webkit-appearance: auto;
}

.form select {
	font-size: 12px;
}

.form select[multiple] {
	height: auto;
}

.form input[type="text"]:hover,
.form input[type="email"]:hover,
.form input[type="number"]:hover,
.form input[type="url"]:hover,
.form input[type="search"]:hover,
.form input[type="tel"]:hover,
.form input[type="password"]:hover,
.form input[type="date"]:hover,
.form input[type="color"]:hover,
.form select:hover {
	border-color: rgba(0,0,0, .2);
}

.form input[type="text"]:focus,
.form input[type="email"]:focus,
.form input[type="number"]:focus,
.form input[type="url"]:focus,
.form input[type="search"]:focus,
.form input[type="tel"]:focus,
.form input[type="password"]:focus,
.form input[type="date"]:focus,
.form input[type="color"]:focus,
.form select:focus {
	color: #111;
	border-color: rgba(0,0,0, .6);	
	-webkit-box-shadow: 0 0 0px rgba(0,0,0, .0);
	-moz-box-shadow: 0 0 0px rgba(0,0,0, .0);
	box-shadow: 0 0 0px rgba(0,0,0, .0);
	outline: none;
}



.form-control {
	display: block;
	width: 100%;
	padding: .375rem .75rem;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #212529;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: .25rem;
	transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}


/* === 06. Home sections === */
.home-section {
	width: 100%;
	display: block;	
	position: relative;
	overflow: hidden;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.home-content {
	display: table;
	width: 100%;
	height: 100%;
	text-align: center;
}

/* Home content */
.home-content {
	position: relative;
}

.home-text {
	display: table-cell;
	height: 100%;
	vertical-align: middle;
}



.hs-line-8 {
	margin-top: 0;
	position: relative;
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 0.3em;
	line-height: 1.2;
	opacity: .75;
}

@media only screen and (max-width: 480px) {
	.hs-line-8 {
		font-size: 11px;
	}
}

.hs-line-14 {
	margin-top: 0;
	position: relative;
	font-size: 48px;
	font-weight: 400;
	line-height: 1.4;
	text-transform: uppercase;
	letter-spacing: 0.7em;
}

@media only screen and (max-width: 767px) {
	.hs-line-14 {
		font-size: 22px;
		letter-spacing: 0.3em;
	}
}

.no-transp {
	opacity: 1 !important;
}

/* Scroll down icon */
@-webkit-keyframes scroll-down-anim {
	0%{ bottom: 2px; }
	50%{ bottom: 7px; }
	100%{ bottom: 2px; }
}
@-moz-keyframes scroll-down-anim {
	0%{ bottom: 2px; }
	50%{ bottom: 7px; }
	100%{ bottom: 2px; }
}
@-o-keyframes scroll-down-anim {
	0%{ bottom: 2px; }
	50%{ bottom: 7px; }
	100%{ bottom: 2px; }
}
@keyframes scroll-down-anim {
	0%{ bottom: 2px; }
	50%{ bottom: 7px; }
	100%{ bottom: 2px; }
}

.scroll-down{
	width: 40px;
	height: 40px;
	margin-left: -20px;
	position: absolute;
	bottom: 20px;
	left: 50%;
	text-align: center;
	text-decoration: none;
	-webkit-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 
	-moz-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 
	-o-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 
	transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 

}

.scroll-down:before{
	display: block;
	content: "";
	width: 20px;
	height: 20px;
	margin: 0 0 0 -10px;
	position: absolute;
	bottom: 0;
	left: 50%;
	background: #fff;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	-webkit-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 
	-moz-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 
	-o-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 
	transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940);
	z-index: 1;
}

.scroll-down:hover:before{
	opacity: .6;
}


.scroll-down-icon{
	display: block;
	width: 10px;
	height: 10px;
	margin-left: -5px;	
	position: absolute;
	left: 50%;
	bottom: 4px;
	color: #111;
	font-size: 15px;
	-webkit-animation: scroll-down-anim 1s infinite;
	-moz-animation: scroll-down-anim 1s infinite;
	-o-animation: scroll-down-anim 1s infinite;
	animation: scroll-down-anim 1s infinite; 
	z-index: 2;
}




/* === 08. Classic menu bar === */
.nav-logo-wrap {
	float: left;
	margin-right: 20px;
}

.nav-logo-wrap .logo {
	display: flex;
	align-items: center;
	max-width: 118px;
	height: 75px;
	-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
	-moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	-o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}
.nav-logo-wrap .logo img {
	width: auto;
	max-height: 100%;
}
.nav-logo-wrap .logo:before,
.nav-logo-wrap .logo:after {
	display: none;
}

.logo,
a.logo:hover {
	font-family: Dosis, arial, sans-serif;
	font-size: 18px;
	font-weight: 400 !important;
	text-transform: uppercase;
	letter-spacing: 0.2em;
	text-decoration: none;
	color: rgba(0,0,0, .9);
}

/* Desktop nav */
.main-nav {
	width: 100%;
	height: 75px !important;
	position: relative;
	top: 0;
	left: 0;
	text-align: left;
	background: rgba(255,255,255, .97);
	-webkit-box-shadow: 0 1px 0 rgba(0,0,0,.05);
	-moz-box-shadow: 0 1px 0 rgba(0,0,0,.05);
	box-shadow:  0 1px 0 rgba(0,0,0,.05);
	z-index: 1030;
	-webkit-transition: height 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
	-moz-transition: height 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	-o-transition: height 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-ms-transition: height 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	transition: height 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}

.main-nav.transparent {
	background: transparent !important;
}

.small-height {
	/* height: 55px !important; */
	height: 75px !important;
}

.small-height .inner-nav ul li a {
	height: 75px !important;
	line-height: 75px !important;
}

.inner-nav {
	display: inline-block;
	position: relative;
	float: right;
}

.inner-nav ul {
	float: right;
	margin: auto;
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 1px;
	text-transform: uppercase;
	text-align: center;
	line-height: 1.3;
}

.inner-nav ul li {
	float: left;
	margin-left: 30px;
	position: relative;
}

.inner-nav ul li a {
	color: #777;
	letter-spacing: 2px;
	display: inline-block;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	text-decoration: none;
	-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
	-moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	-o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}
.inner-nav ul > li:first-child > a{

}  
.inner-nav ul li a:hover,
.inner-nav ul li a.active {
	color: #000;
	text-decoration: none;
}


/* Menu sub */
.mn-sub {
	display: none;
	width: 250px;
	position: absolute;
	top: 100%;
	left: 0;
	padding: 0;
	background: rgba(30,30,30, .97);
}

.mn-sub li {
	display: block;
	width: 100%;
	margin: 0 !important;
}

.inner-nav ul li .mn-sub li a {
	display: block;
	width: 100%;
	height: auto !important;
	line-height: 1.3 !important;
	position: relative;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	padding: 11px 15px;
	font-size: 13px;
	text-align: left;
	text-transform: none;	
	border-left: none;
	border-right: none;
	letter-spacing: 0;
	color: #b0b0b0 !important;
	outline-offset: -2px !important;
	cursor: pointer;
}

.mobile-on .mn-has-multi > li:last-child > a {
	border-bottom: 1px solid rgba(255,255,255, .065) !important;
}

.mn-sub li a:hover,
.inner-nav ul li .mn-sub li a:hover,
.mn-sub li a.active {
	background: rgba(255,255,255, .09);
	color: #f5f5f5 !important;
}

.mn-sub li ul {
	left: 100%;
	right: auto;
	top: 0;
	border-left: 1px solid rgba(255,255,255, .07);
}
.inner-nav > ul > li:last-child .mn-sub,
.inner-nav li .mn-sub.to-left {
	left: auto;
	right: 0;
}
.inner-nav > ul > li:last-child .mn-sub li ul,
.inner-nav > li:last-child .mn-sub li ul,
.inner-nav li .mn-sub li ul.to-left {
	left: auto;
	right: 100%;
	top: 0;
	border-left: none;
	border-right: 1px solid rgba(255,255,255, .07);
}
.mobile-on .inner-nav li:last-child .mn-sub li ul {
	left: auto;
	right: auto;
	top: 0;
}

.mn-wrap {
	padding: 8px;
}


/* Menu sub multi */
.mn-has-multi {
	width: auto !important;
	padding: 15px;
	text-align: left;
	white-space: nowrap;
}

.mn-sub-multi {
	width: 190px !important;
	overflow: hidden;
	white-space: normal;
	float: none !important;
	display: inline-block !important;
	vertical-align: top;
}

.mn-sub-multi > ul {
	width: auto;
	margin: 0;
	padding: 0;
	float: none;
}

.mn-group-title{
	font-weight: 700;
	text-transform: uppercase;
	color: #fff !important;
}

.mn-group-title:hover {
	background: none !important;
}

.mobile-on .mn-sub-multi > ul {
	left: auto;
	right: auto;
	border: none;
}

.mobile-on .mn-sub-multi {
	display: block;
	width: 100% !important;
}

.mobile-on .mn-sub-multi > ul > li:last-child > a {
	border: none !important;
}

.mobile-on .mn-sub:not(.mn-has-multi) > li:last-child > a {
	border: none !important;
}

.mobile-on .mn-sub-multi:last-child > ul {
	border-bottom: none !important;
}




/* Mobil nav */

.mobile-on .desktop-nav {
	display: none;
	width: 100%;
	position: absolute;
	top: 100%;
	left: 0;
	padding: 0 15px;
	z-index: 100;	
}

.mobile-on .full-wrapper .desktop-nav {
	padding: 0;
}

.mobile-on .desktop-nav ul {
	width: 100%;
	float: none;
	background: rgba(18,18,18, .97);
	position: relative;
	overflow-x: hidden;
}

.mobile-on .desktop-nav > ul {
	overflow-y: auto;
}

.mobile-on .desktop-nav ul li {
	display: block;
	float: none !important;
	overflow: hidden;
}

.mobile-on .desktop-nav ul li ul {
	padding: 0;
	border-bottom: 1px solid rgba(255,255,255, .1);
}

.mobile-on .desktop-nav ul li a {
	display: block;
	width: 100%;
	height: 38px !important;
	line-height: 38px !important;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0 10px;
	text-align: left;
	border-left: none;
	border-right: none;
	border-bottom: 1px solid rgba(255,255,255, .065);
	color: #999;
	letter-spacing: 1px;
	cursor: pointer;
}

.mobile-on .desktop-nav ul li a:hover,
.mobile-on .desktop-nav ul li a.active {
	background: rgba(255,255,255, .03);
	color: #ddd;
}

.mobile-on .desktop-nav ul li a:focus {
	outline-offset: -2px !important; 
}

.mobile-nav {
	display: none;
	float: right;
	vertical-align: middle;
	font-size: 11px;
	font-weight: 400;
	text-transform: uppercase;
	border-left: 1px solid rgba(0,0,0, .05);
	border-right: 1px solid rgba(0,0,0, .05);
	cursor: pointer;
	-webkit-user-select: none;  
	-moz-user-select: none;	 
	-ms-user-select: none;	 
	-o-user-select: none;
	user-select: none;
	-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
	-moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	-o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
		-webkit-transition-property: background, color, height, line-height;
	-moz-transition-property: background, color, height, line-height;
	-o-transition-property: background, color, height, line-height;
	transition-property:  background, color, height, line-height;
}

.mobile-nav:hover,
.mobile-nav.active {
	background: #fff;
	color: #777;
}
.mobile-nav:active {
	-webkit-box-shadow: 0 0 35px rgba(0,0,0,.05) inset;
	-moz-box-shadow: 0 0 35px rgba(0,0,0,.05) inset;
	box-shadow: 0 0 35px rgba(0,0,0,.05) inset;
}

.no-js .mobile-nav {
	width: 75px;
	height: 75px;
}
.mobile-on .mobile-nav {
	display: table;
}

.mobile-nav .fa {
	height: 100%;
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	font-size: 21px;
}

.mobile-on .mn-has-sub > .fa {
	display: block;
	width: 18px;
	height: 18px;
	font-size: 14px;
	line-height: 16px;
	position: absolute;
	top: 50%;
	right: 10px;
	margin-top: -8px;
	text-align: center;
	border: 1px solid rgba(255, 255, 255, .1);
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
}

.mobile-on .inner-nav li {
	margin: 0 !important;
}

.mobile-on .mn-sub li {
	padding-left: 10px;
}

.mobile-on .mn-sub-multi {
	display: block !important;
}





/* === 09. Sections styles / .page-section, .small-section, .split-section === */
.bg-gray {
    background-color: #f4f4f4;
}

.page-section,
.small-section {
	width: 100%;
	display: block;	
	position: relative;
	overflow: hidden;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 140px 0;
}

@media only screen and (max-width: 1024px) {
	.page-section {
		padding: 120px 0;
	}
}

@media only screen and (max-width: 1024px) {
	.page-section, .home-section, .small-section {
		background-attachment: scroll;
	}
}

@media only screen and (max-width: 768px) {
	.page-section {
		padding: 80px 0;
	}
}

@media only screen and (max-width: 480px) {
	.page-section {
		padding: 60px 0;
	}
}

@media only screen and (max-height: 1366px) and (-webkit-min-device-pixel-ratio: 1.5) {
	html:not(.no-touch) .page-section, html:not(.no-touch) .home-section, html:not(.no-touch) .small-section {
		background-attachment: scroll !important;
	}
}


.section-title {
	margin-bottom: 15px;
	font-size: 18px;
	font-weight: 400;
	text-transform: uppercase;
	text-align: center;
	letter-spacing: 0.5em;
	line-height: 1.4;
}

.section-more {
	margin-top: 7px;
	color: #999;
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 0.4em;
	text-decoration: none;
	-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
	-moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	-o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
	transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}
.section-more:hover {
	text-decoration: none;
	color: #000;
 
}
.section-more .fa {
	font-size: 12px;
}

@media only screen and (max-width: 767px) {
	.section-more, .section-more.left, .section-more.right {
		float: none !important;
		display: block;
	}
}

.section-text {
	font-size: 15px;
	font-weight: 300;
	color: #777;
	line-height: 1.7;
}












/* Search widget */
.search-wrap {
	position: relative;
}

.search-field {
	width: 100% !important;
	height: 40px !important;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.search-button {
	width: 42px;
	height: 40px;
	line-height: 38px;
	margin-top: -20px;
	position: absolute;
	top: 50%;
	right: 1px;	
	overflow: hidden;
	background: transparent;
	border: none;
	outline: none;
	color: #999;
	font-size: 14px;
}

.search-button:hover {
	color: #111;
}

.search-button:hover + .search-field {
	border-color: #ccc;
}

.mn-sub.search {
	background: rgba(30, 30, 30, .17);
	left: auto;
	right: 0px;
}





/* === 27. Shortcodes === */

/* Progress bars */

.progress {
	display: flex;
	height: 1rem;
	overflow: hidden;
	font-size: .75rem;
	background-color: #e9ecef;
	border-radius: .25rem;
}

.progress-bar {
	display: flex;
	flex-direction: column;
	justify-content: center;
	overflow: hidden;
	color: #fff;
	text-align: center;
	white-space: nowrap;
	background-color: #0d6efd;
	transition: width .6s ease;
}

.tpl-progress {
	margin-top: 10px;
	margin-bottom: 50px;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 1px;
	overflow: visible;
	height: 2px;
	background: #f0f0f0;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

.tpl-progress .progress-bar {
	padding-top: 2px;
	position: relative;
	overflow: visible;
	background-color: #222;
	font-size: 11px;
	color: #000;
	text-align: left;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.tpl-progress .progress-bar > div {
	position: relative;
	top: 10px;
}

.tpl-progress .progress-bar > span {
	display: inline-block;	
	min-width: 24px;
	height: 24px;
	padding: 0 3px;
	position: absolute;
	top: 0px;
	right: -5px;
	text-align: center;
	line-height: 23px;
	letter-spacing: 0;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
}

.progress-color .progress-bar {
	background-color: #e41919;
	color: #e41919;
}

.progress-color .progress-bar > span {
	background-color: #e41919;
	color: #fff;
}






/* Tabs */
.tpl-tabs{
	border-color: #e5e5e5;
	font-size: 12px;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 1px;	
}
.tpl-tabs > li > a,
.tpl-tabs > li > a:hover{
	text-decoration: none;
	color: #777;
	-webkit-border-radius: 0 !important;
	-moz-border-radius: 0 !important;
	border-radius: 0 !important;
}
.tpl-tabs > li > a:hover{
	background-color: #f5f5f5;
}
.tpl-tabs li.active a{
	color: #000;
}
.tpl-tabs-cont{
	padding: 30px 0;
	color: #777;
	line-height: 1.8;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
	color: #495057;
	background-color: #fff;
	border-color: #dee2e6 #dee2e6 #fff;
}


/* Tabs Alternative */
.tpl-alt-tabs {
	display: block;
	font-size: 14px;
	font-weight: 400;
	text-transform: uppercase;
	text-align: center;
	letter-spacing: 0.4em;	
	border: none;
}

.tpl-alt-tabs > li {
	width: 215px;
	display: inline-block;
	vertical-align: top;
	float: none;
	padding: 0;
	background: none !important;
}

.tpl-alt-tabs > li > a {
	text-decoration: none;
	color: #a3a3a3;
	background: none !important;
	border: none !important;
	-webkit-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 
	-moz-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 
	-o-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 
	transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 
}

.tpl-alt-tabs > li > a:hover {
	background: none;
	color: #111;
}

.tpl-alt-tabs li.active a,
.tpl-alt-tabs li.active a:hover,
.tpl-alt-tabs li.active a:focus {
	cursor: default;
	color: #111;
}

.alt-tabs-icon {
	display: block;
	margin-bottom: 12px;
	font-size: 48px;
	letter-spacing: 0;
}

.tab-content>.tab-pane {
	display: none;
}

.tab-content>.active {
	display: block;
}




/* === 30. Improve the readability === */
.section-text, 
.text,
.banner-decription,
.alt-features-descr,
.post-prev-text,
.ci-text,
.team-item-detail,
.alt-service-item,
.benefits-descr,
.features-descr,
.blog-item-body {
	font-weight: 400;
}


.section-text blockquote {
	margin-top: -5px;
}

.section-more {
	margin-top: 7px;
	color: #999;
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 0.4em;
	text-decoration: none;
	-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}