@import '../sppagebuilder/assets/css/sppagebuilder.css';
@import "uikit/uikit.less";

// Theme variables
// ===============

// page loader
@theme-page-loader-background:                      #66b5ff;
@theme-page-loader-color:                           #fff;

// toolbar
@theme-toolbar-padding:                             10px;
@theme-toolbar-font-size:							14px;

@theme-header-lines-height:							6px;
@theme-header-lines-1:								#273f5b;
@theme-header-lines-2:								#0083ff;
@theme-header-lines-3:								#98d5ff;
@theme-header-lines-4:								#f89101;
@theme-header-lines-5:								#ff3133;
@theme-header-lines-6:								#01a23c;
@theme-header-lines-7:								#273f5b;

// Header
@theme-navbar-toggle-text:                          "menu";
@theme-navbar-padding:								15px;

// default header
@theme-default-toolbar-color:						#273f5b;
@theme-default-toolbar-highlight-color:				#6987ab;
@theme-default-toolbar-link-color:					#273f5b;
@theme-default-toolbar-link-hover-color:			#0083ff;
@theme-default-toolbar-divider-color:				#4b5d73;
@theme-default-navbar-background:                   #ecf5fe;
@theme-default-navbar-color:                        #6a85a6;
@theme-default-navbar-hover-color:                  #0083ff;
@theme-default-navbar-active-background:       		#fff;
@theme-default-navbar-active-color:            		#0083ff;

// dark header
@theme-dark-toolbar-color:							#5f7288;
@theme-dark-toolbar-highlight-color:				#6987ab;
@theme-dark-toolbar-link-color:						#5f7288;
@theme-dark-toolbar-link-hover-color:				#0083ff;
@theme-dark-toolbar-divider-color:					#4b5d73;
@theme-dark-navbar-background:                   	#121921;
@theme-dark-navbar-color:                        	#6987ab;
@theme-dark-navbar-hover-color:                  	#0083ff;
@theme-dark-navbar-active-background:				rgba(0,131,255,0.2);
@theme-dark-navbar-active-color:            		#0083ff;

// light header
@theme-light-toolbar-color:							#273f5b;
@theme-light-toolbar-highlight-color:				#6987ab;
@theme-light-toolbar-link-color:					#273f5b;
@theme-light-toolbar-link-hover-color:				#0083ff;
@theme-light-toolbar-divider-color:					#4b5d73;
@theme-light-navbar-background:                   	#fff;
@theme-light-navbar-color:                        	#6987ab;
@theme-light-navbar-hover-color:                  	#0083ff;
@theme-light-navbar-active-background:       		#ecf4fc;
@theme-light-navbar-active-color:            		#0083ff;

// navbar dropdown
@theme-menu-dropdown-background:                  	#fff;
@theme-menu-dropdown-border-color:                	#0083ff;

@theme-menuitem-color:                              #6987ab;
@theme-menuitem-heading-color:                      #2f2c2c;
@theme-menuitem-hover-color:                        #0083ff;

// Search Modal
@theme-modal-close-background:                      #002e5b;
@theme-modal-close-color:                          	#fff;
@theme-modal-text-align:                            left;

@theme-search-field-font-size:                      20px;
@theme-search-field-color:                          #fff;
@theme-search-field-width:                          600px;
@theme-search-field-height:                         75px;

@theme-article-padding:								50px;

// footer
@theme-footer-background:                           #121921;
@theme-footer-color:                                #4b5d73;
@theme-footer-heading-color:                        #fff;
@theme-footer-link-color:                           #4b5d73;
@theme-footer-link-hover-color:                     #0083ff;

@theme-copyright-font-size:                         16px;
@theme-copyright-font-weight:						700;
@theme-copyright-color:                             #6987ab;
@theme-copyright-link-color:                        #0083ff;
@theme-copyright-link-hover-color:                  #4b5d73;

// Custom text
@theme-j2store-sale-text:                           sale;

/* Layout
 ========= */

html {
	background-color: @global-background;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

body {
	overflow-x: hidden;
	position: relative;
}

.uk-notouch body { min-height: 100vh; }

.tm-container {
	background-color: @global-background;
	position: relative;
	z-index: 1;
	box-shadow: 0 40px 50px @global-dark-2-shadow;
}

a {
	transition: @global-transition-color;
	-webkit-text-decoration-skip: objects;
	text-decoration: none;

	&:hover {
		text-decoration: none;
	}
}

// Preloader
.tm-preload {
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background: @theme-page-loader-background;
	z-index: 10000000000;
	-webkit-transform: translateZ(2000px);
	
	// Rotating box
	&.tm-rotate-circles {

		.tm-preload-box {
			display: inline-block;
			width: 57px;
			height: 57px;
			background: url(../images/preload.svg) center center no-repeat;
			position: absolute;
			z-index: 10000001;
			top: 50%;
			left: 50%;
			margin-top: -15px;
			margin-left: -15px;
		}
	}

	// Infinity 
	&.tm-infinity {
		.tm-preload-infinity {
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			margin: auto;
			
			svg {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 0;
				right: 0;
				margin: auto;
			}
		}

		#infinity-outline {
			fill: transparent;
			stroke-width: 4;
			stroke: @theme-page-loader-color;
			stroke-dasharray: 3px, 300px;
			stroke-dashoffset: 0;
			animation: infinity 3000ms linear infinite;
		}

		#infinity-bg {
			fill: transparent;
			stroke-width: 4;
			stroke: lighten(@theme-page-loader-background, 30%);
			opacity: 0.2;
		}
	}
}

.no-preload .tm-preload {
	display: none !important;
}

// Boxed Layout
.tm-boxed-container {
	padding: 0;
	overflow-x: hidden;
	box-shadow: @panel-box-shadow-horizontal @panel-box-shadow-vertical @panel-box-shadow-blur @panel-box-shadow-spread @panel-box-shadow-color;

	.header-lines-decoration {
		max-width: @utility-container-max-width;
	}
}

// Particles
#particles-js {
	width: 100%;
	height: 100%;

	canvas {
	    display: block;
	    vertical-align: bottom;
	    position: absolute;
	    top: 0;
	    left: 0;
	}
}

// Blocks
.tm-block {
	> div .uk-grid {
		overflow: hidden;
	}

	&.tm-block-large-padding {padding: @panel-box-padding*2;}
	&.tm-block-no-padding { padding: 0; }
}

.tm-block,
.tm-block-large-padding {
	padding-top: @panel-box-padding;
	padding-bottom: @panel-box-padding;
}

.tm-block-default { 
	background: @global-background; 
}

.tm-block-padding {
	padding: @panel-box-padding;
}

.tm-block-main,
#tm-hero {
	clear: both;
	position: relative;
	z-index: 1;
}

#tm-main {
	background-color: @global-background;
}

.tm-block-fullwidth {
	padding: 0;

	> .uk-container  {
		max-width: 100%;
		padding: 0;
	}
}

.tm-main-top,
.tm-main-bottom {
	> div > .uk-panel-box {
		padding: 40px;
	}
}

// contact
.blog-featured table {
	.uk-table;
}

//
// Search
//

#tm-search-modal {

	&.uk-modal { 
		background: transparent; 
	}

	.uk-modal-dialog {
		border-radius: 0;
		background: fade(@theme-modal-close-background, 97%);
		box-shadow: none;
	}

	.uk-modal-dialog-blank {
		height: ~"calc(100% - @{theme-header-lines-height})";
		opacity: 1;
		margin-top: @theme-header-lines-height;
	}

	.uk-search {
		padding: 0;
	}

	.uk-search-field {
		width: @theme-search-field-width;
		height: @theme-search-field-height;
		padding-left: 0;
		text-align: @theme-modal-text-align;
		border-radius: 0;
		background-color: transparent;
		border-left: 0;
		border-bottom: 4px solid @global-primary-background;
		font-size: @theme-search-field-font-size;
		color: @theme-search-field-color;
		opacity: 0;
		transition: @global-transition-opacity;
	}

	.tm-search-subtitle {
		color: fade(@theme-search-field-color, 20%);
		text-align: @theme-modal-text-align;
	}

	.uk-modal-dialog-blank > .uk-close:first-child {
		right: 50px;
	}

	// Modal animation
	.uk-modal-dialog {
		transform: scale(0);
		transition: opacity 0.4s ease-in-out, transform 0.5s ease-in-out;
	}

	&.uk-open {

		.uk-modal-dialog {
			transform: scale(1);
			
			.uk-search-field { opacity: 1; }
		}

		.uk-close:after { background-image: none; }

	}
}

.tm-modal-close {
	position: relative;
	height: 70px;
	width: 70px;
	box-sizing: border-box;
	line-height: 50px;
	opacity: 1;
	transform: translateZ(0);


	&:before,
	&:after {
		content: '';
		position: absolute;
		display: block;
		top: 50%;
		left: 50%;
		height: 2px;
		width: 30px;
		margin-left: -(30px / 2);
		margin-top: -(2px / 2);
		background-color: @theme-modal-close-color;
		transform: rotate(-45deg);
		transition: all 0.25s ease-out;
	}

	&:after {
		transform: rotate(-135deg);
	}

	&:hover {

		opacity: 1;

		&:before,
		&:after {
			transform: rotate(0deg);
		}
	}
}

.tm-breadcrumbs {
	box-shadow: inset 0 -1px 0 @global-dark-05-shadow;

	.uk-breadcrumb > li > a { 
		color: @breadcrumbs-color;
		transition: @global-transition-color;

		&:hover {
			color: @global-link-hover-color;
		}
	}
}

// grid collapse
.tm-block-collapse,
.tm-block-collapse .uk-grid > div { 
	padding: 0;
}

.tm-grid-collapse > .uk-container {

	&::before,
	&::after { display: none; }

	> .uk-grid {
		width: 100%;
		margin-left: 0;
	}

	> .uk-grid > * {
		margin-top: 0 !important;
		margin-bottom: 0 !important;
		padding-left: 0;
	}
}

//
// Toolbar
//

.tm-toolbar {
	font-size: @theme-toolbar-font-size;
	padding-top: 6px;

	.uk-subnav {
		margin: 0 0 0 -15px;

		> li {
			line-height: 30px;
			padding-left: 25px;
		}
	}

	li:not([class]), p {
		margin: 0;
	}

	.uk-subnav-line > li {
		margin-top: 0;
	
		&:nth-child(n+2):before {
		    content: '.';
		    display: block;
		    position: absolute;
		    left: 4px;
		    width: 20px;
		    top: 0;
		    z-index: 1;
		    font-size: 50px;
		    line-height: 2px;
		    border-left: none;
		}
	}

	.uk-nav li > a > div {
		line-height: 24px;
		word-wrap: break-word;
		margin-top: 10px;
	}

	.uk-button-dropdown {
		display: block;
		
		.uk-dropdown .uk-nav {
			margin: 0;
		}
	}

	.uk-dropdown {
		padding: 0;
		margin-top: 9px;
		border-radius: @global-border-radius;
		box-shadow: inset 0 0 0 1px @global-dark-075-shadow, 
					25px 20px 20px -15px @global-dark-2-shadow;

		.uk-nav-dropdown > li > a {
			padding: 2px 15px;
			transition: @global-transition-color;
		}
	}

	.uk-button-link {
		line-height: 28px;
		min-height: 30px;
		padding: 0 0 0 15px;
		border: 0;
		outline: none;
		text-decoration: none;
		text-transform: none;
		font-size: @theme-toolbar-font-size;
		font-weight: @global-body-font-weight;
		font-family: @global-body-font-family;

		&:after {
			display: none;
		}

		i:before {
			font-size: @theme-toolbar-font-size;
		}

		&[class*='uk-icon-']:before {
			padding-right: 7px;
			font-family: @global-font-icon;
		}
	}

	.utouch-icon {
	    display: inline-block;
	    vertical-align: middle;
		top: 8px;
		position: relative;
		height: 15px;
		width: 15px;
		margin-right: 15px;

		&.world {
		    width: 30px;
		    height: 25px;
		    top: auto;
		}
	}

	span {
		margin-right: 10px;
	}

	.list-icons {
		padding: 0;
		margin: 0;

		li {
			float: left;
			padding: 0 25px 0 15px;

			&:after {
			    content: '.';
			    display: block;
			    position: absolute;
			    right: 0;
			    bottom: 0;
			    font-size: 50px;
			    line-height: 1.2;
			}

			&:last-child:after {
				content: "";
			}
		}
	}

	.uk-form {

		:-ms-input-placeholder { color: @global-color; }
		::-moz-placeholder { color: @global-color; }
		::-webkit-input-placeholder { color: @global-color; }

		input[type="text"] {
			background-color: @global-dark-15-shadow;
			box-shadow: 0 1px 0 @global-light-1-shadow;
			line-height: 30px;
			height: 30px;
			color: @global-color;
			border-radius: 5px;
			font-size: round((@global-font-size*0.85));

			&:focus {
				background-color: @global-dark-15-shadow;
				border: 1px solid @global-dark-075-shadow;
				box-shadow: 0 1px 0 @global-light-1-shadow;
				color: @global-color;
			}
		}
	}

	.mod-languages form {
		margin: 0;
	}

	.uk-icon-button {
		font-size: round((@theme-toolbar-font-size*1.2));
		line-height: 22px;
		height: 22px;
		width: 25px;
		font-weight: 400;
	}

	.uk-float-left > div {
		float: left;
		margin-right: 20px;
		padding: @theme-toolbar-padding 0;
	}

	.uk-float-right > div {
		float: right;
		margin-left: 20px;
		padding: @theme-toolbar-padding 0;
	}

	+ .uk-sticky-placeholder .tm-header-layout {
		.header-lines-decoration {
			display: none;
		}

		&.uk-active .header-lines-decoration {
			display: block;
		}
	}
}

//
// Logo
//

.tm-logo {
	display: block;
}

.tm-logo,
.tm-logo-container {
	z-index: 10;
}

.tm-logo,
.tm-logo-small {
    p { margin: 0; }
}

//
// Header
//

.tm-header {
	position: relative;
}

.tm-headerbar {
	display: block;

	h1,h2,h3,h4,h5,h6 {
		margin: 0;
		color: @global-heading-color;
		font-weight: @global-heading-font-weight;
		font-size: @base-h5-font-size;
		line-height: @base-h5-line-height;
		white-space: pre-wrap;
	}

	.uk-grid > * {
		&:last-child .tm-block-number .tm-block-content {
			padding-right: 0;
		}
	}

	.tm-block-icon {
		font-size: 33px;
		padding-top: 10px;
	}

	.tm-block-content {
		margin: 5px 0 0 0;
		color: @global-heading-color;
		font-size: round((@global-font-size*0.85));
		display: table;
	}

	p {
		margin: 0;
		color: @global-color;
		white-space: nowrap;
		display: -moz-inline-box; /* fix for firefox */

		&:empty {
			display: none;
		}
	}

	> div {
		margin-left: 20px;
	}
}

.tm-right-offcanvas {
	position: absolute;
	right: 10px;
	top: 25px;

	.uk-navbar-toggle:before {
		content: "";
	}
}

svg {
	.primary {
		fill: @global-primary-background;
	}

	.primary-light {
		fill: @global-primary-light-background;
	}

	.secondary {
		fill: @global-secondary-color;
	}

	.primary-2 {
		fill: @global-primary-2-background;
	}

	.contrast {
		fill: @global-contrast-color;
	}
}

// navbar icons
.tm-navbar-icon {
	position: relative;
	padding: 0 15px;
	margin-right: 15px;

	+ div:not(.tm-navbar-icon) + div:not(.tm-navbar-icon) > a.tm-navbar-icon {
		box-shadow: none;
		border-left: 0;
	}

	span.tm-offcanvas-icon, 
	> a {
		min-width: 32px;
		height: @navbar-nav-height;
		color: @theme-default-navbar-color;
		text-align: center;
		transition: color 0.1s ease-in-out;

		&:before {
			font-family: @global-utouch-icon;
			font-size: 23px;
			line-height: @navbar-nav-height;
			-moz-osx-font-smoothing: auto;
			-webkit-font-smoothing: auto;
		}

		&:hover {
			color: @theme-default-navbar-hover-color;
		}
	}

	.uk-dropdown .uk-button {
		transition: none;
	}
}

// navbar search button
.tm-navbar-search {
	height: @navbar-nav-height;
	min-width: @navbar-nav-height/2;
	
	.tm-search-button {
		text-decoration: none;
		line-height: 1;

		.utouch-icon {
		    transition: all .3s ease;
		    height: 28px;
		    width: 28px;
		    padding: 2px;
		    fill: @theme-default-navbar-color;
		    transition: @global-transition-fill;
		}

		&:hover .utouch-icon {
			fill: @theme-default-navbar-hover-color; 
		}
	}
}

.tm-offcanvas-menu-icon {
	color: @theme-default-navbar-color;
	vertical-align: baseline;

	> span.tm-offcanvas-icon {
		display: inline-block;
		vertical-align: middle;
		text-align: center;
		position: relative;
		height: auto;
		min-width: 30px;

		> span {
			color: @theme-default-navbar-color;
			position: absolute;
			top: 0;
			left: auto;
			right: 0;
			height: 0;
			border-bottom: 2px solid;
			transition: @global-transition;

			&:nth-child(1) {
				width: 20px;
				transform: translateY(-7px);
			}

			&:nth-child(2) {
				width: 16px;
				transition-delay: 40ms;
			}

			&:nth-child(3) {
				width: 23px;
				transform: translateY(7px);
				transition-delay: 90ms;
			}
		}
	}

	&:hover {
		color: @theme-default-navbar-hover-color;

		> span.tm-offcanvas-icon > span {
			width: 25px;
			color: @theme-default-navbar-hover-color;
		}
	}
}

// menu image

.tm-dropdown-background + .uk-dropdown-navbar {
	background-position: right bottom;
	background-repeat: no-repeat;
	background-size: contain;
	padding-right: 120%;
}

// Navbar Toggle Text
.tm-offcanvas-menu-icon {

    &:after {
        content: "@{theme-navbar-toggle-text}";
        text-transform: uppercase;
        letter-spacing: 1px;
        top: 3px;
        position: relative;
        margin-left: 10px;
        font-weight: @global-body-font-weight;
        font-family: @global-body-font-family;
    }
}

//
// Navbar
//

.tm-navbar {
	position: relative;
	z-index: 1001;
	clear: both;
	transition: @global-transition;

	.uk-navbar-nav > li {
	    &[data-menu-fullwidth] {
	        position: static;

	        .uk-dropdown.uk-dropdown-navbar { 
	            left: 0 !important;
	            right: 0 !important;
	            width: 100%;
	            top: @navbar-nav-height !important;

	            .uk-nav-navbar > li:first-child {
	            	padding-top: 20px;
	            }

	            > .uk-dropdown-grid {
	                padding: 0 20px 0;
	            }
	        }
	    }
	}

	.uk-open > .uk-dropdown-navbar {
		animation-duration: 0.25s;
	}

	.uk-nav-navbar ul a,
	.uk-nav-navbar > li > a,
	.uk-dropdown-navbar .uk-nav-header {
		color: @theme-menuitem-color;
		transition: color ease 250ms;
		position: relative;
	}

	.uk-nav-navbar-subtitle {
		.uk-flex;
		.uk-flex-column-reverse;

		> div {
			margin-top: 5px;
			text-transform: lowercase;
			font-size: @nav-subtitle-font-size;
			line-height: @nav-subtitle-line-height;
			color: @theme-menuitem-color;
		}
	}

	.uk-nav-navbar > li > a i,
	.uk-nav-navbar .uk-nav-sub > li > a i {
		width: 22px;
		font-size: 16px;
	}

	.uk-float-right > div {
		float: left;
	}

	.uk-navbar-nav > li .uk-dropdown-navbar {
		margin-top: -4px;
		background-color: @theme-menu-dropdown-background;
		border-top: 4px solid @theme-menu-dropdown-border-color;
		opacity: 0;
	}

	.uk-navbar-nav > li.uk-open > .uk-dropdown-navbar,
	.uk-navbar-nav > li:hover > .uk-dropdown-navbar {
		opacity: 1;
	}

    .uk-dropdown.uk-dropdown-width-2,
    .uk-dropdown.uk-dropdown-width-3,
    .uk-dropdown.uk-dropdown-width-4,
    .uk-dropdown.uk-dropdown-width-5 {

		.uk-nav-navbar > li:last-child {
		    margin-bottom: 30px;
		}
    }

	.uk-dropdown-navbar .uk-nav-navbar {
	
		> li.uk-nav-header,
		> li > a {

			&.tm-menu-header {
				padding: 20px 30px 30px;
				color: @theme-menuitem-heading-color;
			}

			&.tm-menu-child {
				line-height: 32px;
				padding: 0 15px;
				margin-left: 45px;
				position: relative;
				box-shadow: none;

				&:before {
					content: '';
					display: block;
					height: 100%;
					width: 3px;
					background-color: @global-primary-light-background;
					left: -15px;
					top: 0;
					position: absolute;
					transition: background-color .3s ease;
				}

				&:hover:before {
					background-color: @theme-menuitem-hover-color;
				}
			}
		}

	    li + li.uk-nav-header.tm-menu-header,
	    li + li > a.tm-menu-header {
	    	padding-top: 10px;
	    }
	}

	// fly-out menu
	> ul > li {
		&.uk-parent > a:before {
			position: absolute;
			content: @global-font-icon;
			right: 15px;
			font-family: @global-font-icon;
			font-size: @global-font-size;
			line-height: @navbar-nav-height;
		}

		&:hover > a:before,
		&.uk-parent.uk-open > a:before,
		&.uk-parent.uk-active > a:before {
			color: darken(@theme-default-navbar-active-background, 15%);
		}
	}

	.uk-navbar-nav > li {	
		> a {
			position: relative;
			transition: @global-transition-background;
		}
	}

}

// top lines
.header-lines-decoration {
    width: 100%;
    position: absolute;
    top: 0;
    height: @theme-header-lines-height;
    z-index: @global-z-index;
    background-size: 100% @theme-header-lines-height;
	background: repeating-linear-gradient(to right, 
		@theme-header-lines-1, @theme-header-lines-1 14.29%, 
		@theme-header-lines-2 14.29%, @theme-header-lines-2 28.58%, 
		@theme-header-lines-3 28.58%, @theme-header-lines-3 42.87%,
		@theme-header-lines-4 42.87%, @theme-header-lines-4 57.16%,
		@theme-header-lines-5 57.16%, @theme-header-lines-5 71.45%,
		@theme-header-lines-6 71.45%, @theme-header-lines-6 85.74%,
		@theme-header-lines-7 85.74%, @theme-header-lines-7 100%
	);
	
	+ .tm-toolbar,
	+ .uk-sticky-placeholder .tm-header-layout {
		padding-top: 6px;
	}
}



.tm-blue-shadow {
	box-shadow: 15px -15px 0 0 rgba(145, 165, 185, 0.5), 
				30px -30px 0 0 rgba(165, 187, 210, 0.4), 
				45px -45px 0 0 rgba(166, 187, 208, 0.3);
}

.tm-black-shadow {
	box-shadow: 15px -15px 0px 0px rgba(69, 74, 79, 0.5), 
				30px -30px 0px 0px rgba(69, 74, 79, 0.5), 
				45px -45px 0px 0px rgba(69, 74, 79, 0.5);
}

// Header Laoyout
.tm-header-layout {
	position: relative;
}

// 
// header - default
//  

.tm-header-default {

	.tm-toolbar {
		color: @theme-default-toolbar-color;
		background-color: @theme-default-navbar-background;
		border-bottom: 1px solid darken(@theme-default-navbar-background, 3%);

		a,
		.uk-subnav > li > a {
			color: @theme-default-toolbar-link-color;

			&:hover {
				color: @theme-default-toolbar-link-hover-color;
			}
		}

		span {
			color: @theme-default-toolbar-highlight-color;
		}

		.uk-button-link,
		> a:not(.uk-icon-button),
		.uk-subnav > li > a {
			
			&:after {
				bottom: 3px;
				background-color: @theme-default-toolbar-link-color;
			}

			&:hover:after {
				background-color: @theme-default-toolbar-link-hover-color;
			}

			&:hover {
				color: @theme-default-toolbar-link-hover-color;
			}
		}

		.uk-dropdown {
			background-color: @theme-default-navbar-background;

			.uk-nav-dropdown > li > a {
				color: @theme-default-toolbar-link-color;

				&:hover {
					color: @theme-default-toolbar-link-hover-color;
				}
			}
		}

		.uk-button-link {
			&:focus,
			i:before {
				color: @theme-default-toolbar-link-color;
			}
		}

		.utouch-icon {
			fill: @theme-default-toolbar-link-color;
		}

		.list-icons li {
			i {
				color: @theme-default-toolbar-link-color;
			}

			&:after {
				color: @theme-default-toolbar-divider-color;
			}
		}

		.uk-subnav-line > li:nth-child(n+2):before {
			color: @theme-default-toolbar-divider-color;
		}
	}
	
	.tm-header-layout {
		background-color: @theme-default-navbar-background;

		&[data-uk-sticky].uk-active {
			box-shadow: 0 10px 60px fade(@global-dark-background, 15%);
		}
	}

	.tm-header {
		padding: 0 30px;
		transition: @global-transition;
	}

	.tm-search-button {
		i:before {
			color: @theme-default-navbar-color;
		}

		&:hover i:before {
			color: @theme-default-navbar-active-color;
		}
	}

	.tm-offcanvas-menu-icon {
		&:after,
		> span.tm-offcanvas-icon,
		> span.tm-offcanvas-icon > span {
			color: @theme-default-navbar-color;
		}

		&:hover {
			> span.tm-offcanvas-icon,
			> span.tm-offcanvas-icon > span {
				color: @theme-default-navbar-active-color;
			}
		}
	}

	.uk-navbar-nav > li > a {
		color: @theme-default-navbar-color;
	}

	.tm-navbar {
		.uk-navbar-nav > li:hover > a,
		.uk-navbar-nav > li.uk-open > a,
		.uk-navbar-nav > li.uk-active > a,
		.uk-nav-side > li.uk-active > a {
			background-color: rgba(0,0,0,0);
			color: @theme-default-navbar-active-color;
			position: relative;

			&:before {
				content: "";
				width: 90%;
				height: 30px;
				background-color: @theme-default-navbar-active-background;
				position: absolute;
				top: round((@navbar-nav-height/2))-15px;
				left: 5px;
				border-radius: 20px;
				z-index: -1;
			}
		}
	}

	.tm-navbar-icon {
		margin-right: 0;
		padding: 0 15px 0 0;
	}
}

// 
// header - dark
// 

.tm-header-dark {

	.tm-toolbar {
		color: @theme-dark-toolbar-color;
		background-color: @theme-dark-navbar-background;
		border-bottom: 1px solid lighten(@theme-dark-navbar-background, 5%);

		a,
		.uk-subnav > li > a {
			color: @theme-dark-toolbar-link-color;

			&:hover {
				color: @theme-dark-toolbar-link-hover-color;
			}
		}

		span {
			color: @theme-dark-toolbar-highlight-color;
		}

		.uk-button-link,
		> a:not(.uk-icon-button),
		.uk-subnav > li > a {
			
			&:after {
				bottom: 3px;
				background-color: @theme-dark-toolbar-link-color;
			}

			&:hover:after {
				background-color: @theme-dark-toolbar-link-hover-color;
			}

			&:hover {
				color: @theme-dark-toolbar-link-hover-color;
			}
		}

		.uk-dropdown {
			background-color: lighten(@theme-dark-navbar-background, 3%);

			.uk-nav-dropdown > li > a {
				color: @theme-dark-toolbar-link-color;

				&:hover {
					color: @theme-dark-toolbar-link-hover-color;
				}
			}
		}

		.uk-button-link {
			&:focus,
			i:before {
				color: @theme-dark-toolbar-link-color;
			}
		}

		.utouch-icon {
			fill: @theme-dark-toolbar-link-color;
		}

		.list-icons li {
			i {
				color: @theme-dark-toolbar-link-color;
			}

			&:after {
				color: @theme-dark-toolbar-divider-color;
			}
		}

		.uk-subnav-line > li:nth-child(n+2):before {
			color: @theme-dark-toolbar-divider-color;
		}
	}
	
	.tm-header-layout {
		background-color: @theme-dark-navbar-background;

		&[data-uk-sticky].uk-active {
			box-shadow: 0 10px 60px fade(@global-dark-background, 15%);
		}
	}

	.tm-header {
		padding: 0 30px;
		transition: @global-transition;
	}

	.tm-search-button {
		i:before {
			color: @theme-dark-navbar-color;
		}

		&:hover i:before {
			color: @theme-dark-navbar-active-color;
		}
	}

	.tm-offcanvas-menu-icon {
		&:after,
		> span.tm-offcanvas-icon,
		> span.tm-offcanvas-icon > span {
			color: @theme-dark-navbar-color;
		}

		&:hover {
			> span.tm-offcanvas-icon,
			> span.tm-offcanvas-icon > span {
				color: @theme-dark-navbar-active-color;
			}
		}
	}

	.uk-navbar-nav > li > a {
		color: @theme-dark-navbar-color;
	}

	.tm-navbar {
		.uk-navbar-nav > li:hover > a,
		.uk-navbar-nav > li.uk-open > a,
		.uk-navbar-nav > li.uk-active > a,
		.uk-nav-side > li.uk-active > a {
			background-color: rgba(0,0,0,0);
			color: @theme-dark-navbar-active-color;
			position: relative;

			&:before {
				content: "";
				width: 90%;
				height: 30px;
				background-color: @theme-dark-navbar-active-background;
				position: absolute;
				top: round((@navbar-nav-height/2))-15px;
				left: 5px;
				border-radius: 20px;
				z-index: -1;
			}
		}
	}

	.tm-navbar-icon {
		margin-right: 0;
		padding: 0 15px 0 0;
	}
}

// 
// header - light
// 

.tm-header-light {

	.tm-toolbar {
		color: @theme-light-toolbar-color;
		background-color: @theme-light-navbar-background;
		border-bottom: 1px solid darken(@theme-light-navbar-background, 3%);

		a,
		.uk-subnav > li > a {
			color: @theme-light-toolbar-link-color;

			&:hover {
				color: @theme-light-toolbar-link-hover-color;
			}
		}

		span {
			color: @theme-light-toolbar-highlight-color;
		}

		.uk-button-link,
		> a:not(.uk-icon-button),
		.uk-subnav > li > a {
			
			&:after {
				bottom: 3px;
				background-color: @theme-light-toolbar-link-color;
			}

			&:hover:after {
				background-color: @theme-light-toolbar-link-hover-color;
			}

			&:hover {
				color: @theme-light-toolbar-link-hover-color;
			}
		}

		.uk-dropdown {
			background-color: @theme-light-navbar-background;

			.uk-nav-dropdown > li > a {
				color: @theme-light-toolbar-link-color;

				&:hover {
					color: @theme-light-toolbar-link-hover-color;
				}
			}
		}

		.uk-button-link {
			&:focus,
			i:before {
				color: @theme-light-toolbar-link-color;
			}
		}

		.utouch-icon {
			fill: @theme-light-toolbar-link-color;
		}

		.list-icons li {
			i {
				color: @theme-light-toolbar-link-color;
			}

			&:after {
				color: @theme-light-toolbar-divider-color;
			}
		}

		.uk-subnav-line > li:nth-child(n+2):before {
			color: @theme-light-toolbar-divider-color;
		}
	}
	
	.tm-header-layout {
		background-color: @theme-light-navbar-background;

		&[data-uk-sticky].uk-active {
			box-shadow: 0 10px 60px fade(@global-dark-background, 15%);
		}
	}

	.tm-header {
		padding: 0 30px;
		transition: @global-transition;
	}

	.tm-search-button {
		i:before {
			color: @theme-light-navbar-color;
		}

		&:hover i:before {
			color: @theme-light-navbar-active-color;
		}
	}

	.tm-offcanvas-menu-icon {
		&:after,
		> span.tm-offcanvas-icon,
		> span.tm-offcanvas-icon > span {
			color: @theme-light-navbar-color;
		}

		&:hover {
			> span.tm-offcanvas-icon,
			> span.tm-offcanvas-icon > span {
				color: @theme-light-navbar-active-color;
			}
		}
	}

	.uk-navbar-nav > li > a {
		color: @theme-light-navbar-color;
	}

	.tm-navbar {
		.uk-navbar-nav > li:hover > a,
		.uk-navbar-nav > li.uk-open > a,
		.uk-navbar-nav > li.uk-active > a,
		.uk-nav-side > li.uk-active > a {
			background-color: rgba(0,0,0,0);
			color: @theme-light-navbar-active-color;
			position: relative;

			&:before {
				content: "";
				width: 90%;
				height: 30px;
				background-color: @theme-light-navbar-active-background;
				position: absolute;
				top: round((@navbar-nav-height/2))-15px;
				left: 5px;
				border-radius: 20px;
				z-index: -1;
			}
		}
	}

	.tm-navbar-icon {
		margin-right: 0;
		padding: 0 15px 0 0;
	}
}

@media (max-width: @breakpoint-medium-max) {

	.tm-navbar .uk-container {
		padding: 0;
	}

}

//
// Navbar Toggle
//

.uk-navbar-toggle {
	height: 35px;

	&:after {
		padding: 12px;
		border-radius: 25px;
	}
}

//
// Main/Content
//

.tm-main > :nth-child(n+2) { margin-top: @global-grid-gutter; }

.tm-noblog .tm-content {
	.uk-pagination > li > span,
	.uk-pagination > li > a {
		box-shadow: none;
	}
}

.tm-isblog .uk-article,
.tm-noblog .tm-content {

	.uk-panel-box {
		border: none;
		padding: @panel-box-padding;
	}

	.uk-panel-header {
		box-shadow: none;
	}
}

.tm-content > :last-child { margin-bottom: 0; }

.tm-highlight-block {
	color: @global-heading-color;
	font-family: @global-heading-font-family;
	font-size: @base-h3-font-size;
	font-weight: @global-heading-font-weight;
	line-height: round((@base-h3-line-height*1.2));
	margin: 10px 20px 10px 0;
	padding: 10px 0 15px;
	width: 45%;
	position: relative;

	&:before,
	&:after {
		content: "";
		position: absolute;
		width: 15px;
		height: 15px;
		z-index: 0;
		top: -10px;
		border-radius: 2px;
	}

	&:before {
		background-color: @global-primary-background;
	}

	&:after {
		background-color: @global-secondary-background;
	}

	&.tm-highlight-left {
		float: left;
		text-align: right;
		padding-right: 30px;
		margin-right: 30px;
		border-left: 3px solid @global-primary-light-background;

		&:before {
			left: 0;
		}

		&:after {
			left: 20px;
		}
	}

	&.tm-highlight-right {
		float: right;
		text-align: left;
		padding-left: 30px;
		margin-left: 30px;
		border-left: 3px solid @global-primary-light-background;

		&:before {
			right: 0;
		}

		&:after {
			right: 20px;
		}
	}
}

.pagenavcounter {
	float: right;
	font-size: @global-font-size - 2;
	letter-spacing: 1px;
}

.contact {

	legend,
	h3:first-of-type {
		display: none;
	}

	> h3 {
		margin: 0 0 30px;
		font-size: 30px;
	}
}

.tm-grid-filters {
	margin: 0 0 40px -30px;

	&.uk-subnav > * {
		padding-left: 30px;
	}

	&.uk-subnav > li a {
		padding: 3px 10px;
	}
}

#tm-footer {
	box-sizing: border-box;
	background-color: @theme-footer-background;

	.header-lines-decoration {
		z-index: 0;
	}

	.uk-panel,
	.uk-panel-box {
		background-color: rgba(0,0,0,0);
		box-shadow: none;
		border-radius: 0;
		padding: 0;
		border: 0;
		color: @theme-footer-color;
	}

	h1,h2,h3,h4,h5,h6 {
		color: @theme-footer-heading-color;
	}

	a:not([class]) {
		color: @theme-footer-link-color;

		&:hover {
			color: @theme-footer-link-hover-color;
		}
	}

	.uk-icon-button {
		color: @theme-footer-color;
		border-radius: 50%;
		width: 30px;
		height: 30px;
		line-height: 37px;
		text-align: left;

		+ .uk-icon-button {
			margin-left: 2px;
		}

		&:hover {
			color: @theme-footer-link-hover-color;
		}
	}
}

.tm-copyright {

	color: @theme-copyright-color;
	font-size: @theme-copyright-font-size;
	font-weight: @theme-copyright-font-weight;
	margin: 30px 0 20px;
	position: relative;

	.uk-container {
		max-width: 100%;
	}

	.uk-panel {
		padding: 10px 0;
	}

	.uk-subnav li a,
	a {
		color: @theme-copyright-link-color;

		&:after {
			background-color: @theme-copyright-link-color;
		}

		&:hover:after {
			background-color: @theme-copyright-link-hover-color;
		}

		&:hover {
			color: @theme-copyright-link-hover-color;
		}
	}

	.uk-subnav li a:after {
		bottom: 3px;
	}

	.uk-subnav-line > li:nth-child(n+2):before {
		height: 15px;
		border-color: fade(@global-color, 50%);
		border-left-style: dotted;
		position: relative;
		margin-right: 15px;
		vertical-align: text-bottom;
	}

	.uk-nav li > a > div {
		line-height: 24px;
		word-wrap: break-word;
		margin-top: 10px;
	}

	.uk-subnav {
		margin: 0;

		> * {
			padding-left: 15px;
			margin: 0;
		}

		> li:first-child {
			padding-left: 0;
		}
	}

	p {
		margin: 0;
		padding: 0;
	}
}

//
// To-Top Scroller
//

.tm-totop-scroller {
    position: absolute;
    z-index: 20;
    width: 60px;
    height: 60px;
    line-height: 60px;
    display: block;
    fill: @global-contrast-color;
    stroke: inherit;
    transition: @global-transition;
    top: -60px;
    left: 50%;
    transform: translate(-50%, 0);
    cursor: pointer;
    box-shadow: 10px 0 30px 0 fade(@global-primary-background, 40%);
    border-radius: 100%;
    background-color: @global-primary-background;
    text-align: center;

	.utouch-icon {
		fill: @global-contrast-color;
		height: 28px;
		width: 28px;
	}

	&:hover,
	&:focus {
		outline: none;
		text-decoration: none;
	}

	&:active:after { font-size: 20px; }
}

.uk-active .tm-totop-scroller {
	display: block;
	bottom: 30px;
	opacity: 1;
	transition: @global-transition;
}

//
// Dynamic Grid
//

.tm-grid-title {
	background: @global-secondary-background;
	color: @global-contrast-color;
	display: inline-block;
	padding: 5px 10px;
	box-shadow: 0 0 0 @global-dark-15-shadow;
}

.tm-overlay-content,
.tm-grid-content {
	text-shadow: 0 1px 1px rgba(0,0,0,0.5);
}

.tm-grid-content {
	z-index: 1;
	position: relative;
}

.tm-dynamic-grid figure img {
	width: 100%;
}

//
// Colored Panels
//

.tm-panel-box-primary-color {

	background: @button-background;
	color: @global-contrast-color;

	a { color: @global-contrast-color; }

}

.tm-panel-box-secondary-color {

	background: @button-primary-background;
	color: @global-contrast-color;

	a { color: @global-contrast-color; }

}

//
// Side Navigation
//

.tm-navigation-bar {
	position: fixed;
	right: 20px;
	top: 45%;

	.uk-dotnav {  
		font-size: 0.001px;
		list-style: none outside none;
		padding: 0;
		width: 20px;
		
		> li {
			border-radius: 100%;
			height: 15px;
			width: 15px;
			padding-left: 0;
			margin: 15px 0 0 !important;

			> a {
				height: 10px;
				width: 10px;
				box-shadow: 0 0 0 4px @global-light-15-shadow, 0 0 0 5px @global-dark-075-shadow;

				&:hover,
				&:focus {  
					background-color: rgba(50, 50, 50, 0.2);
					outline: medium none;
				}
			}
		
			&.uk-active > a {  
				background-color: @global-primary-background;
			}
		}
	}
}

//
// Shortcodes
//

.uk-module-title {
	position: relative;
	padding-bottom: 10px;
	margin-bottom: 20px !important;
	letter-spacing: @global-heading-letter-space;
}

.uk-contrast {
	.uk-sub-title {
		text-shadow: 0 1px 2px @global-dark-2-shadow;
	}
}

.tm-heading {
	font-family: @global-heading-font-family;
	font-weight: @global-heading-font-weight;
}

.uk-sub-title,
.uk-sub-title-small {
	text-transform: uppercase;
	letter-spacing: 3px;
	margin: 0 0 15px 0;
	font-family: @base-body-font-family;
	font-size: @base-body-font-size;
}

.uk-sub-title-small {
	font-size: round((@global-font-size*0.85));
}

//
// Blocks
//

.tm-block-digit {
	text-align: center;
	margin: 0 15px 0 0;
}

.tm-block-text {
	font-size: @base-h3-font-size;
	font-family: @global-heading-font-family;
	font-weight: @global-regular-font-weight;
	background-color: rgba(0,0,0,0);
	color: @global-heading-color;
	min-width: 50px;
	line-height: 50px;
	box-shadow: -3px 3px 0 @global-primary-background;
	border-width: 1px 1px 0 0;
	border-style: solid;
	border-color: fade(@global-color, 5%);
}

.tm-block-time {
	background: @global-background;
	color: @global-color;
	text-align: center;
	margin: 5px @global-grid-gutter 15px 0;
}

.tm-block-month {
	padding: 0 5px;
	border-radius: @global-border-radius / 2;
	background: @global-primary-background;
	color: @global-contrast-color;
	width: 40px;
	line-height: 26px;
	float: left;
}

.tm-block-month {
	letter-spacing: 1px;
	font-family: @global-heading-font-family;
	font-weight: 400;
	font-size: @global-font-size - 2;
	text-transform: uppercase;
	margin-left: -24px;
	transform: rotateZ(-90deg) translateY(12px) translateX(-12px);
}


.tm-event-descr {
	margin: 0 0 15px;
}

.tm-block-icon {
	font-size: round((@base-h2-font-size*1.17));
	padding: 15px 15px 0 0;
	color: @global-primary-background;
	margin-right: 5px;
	-moz-osx-font-smoothing: auto;
	-webkit-font-smoothing: auto;
	background-color: @global-primary-background;
	-webkit-background-clip: text;
			background-clip: text;
	-webkit-text-fill-color: transparent;
			text-fill-color: transparent;
}
 
.tm-block-number {
	margin-bottom: 10px;
}

// contacts

.tm-contact-item {
	.uk-flex;
	.uk-flex-middle;
	margin-bottom: 5px;
	
	.utouch-icon {
	    height: 18px;
	    width: 18px;
	    color: @global-primary-background;
	    fill: @global-primary-background;
	    margin-right: 10px;
	}

	&.tm-large-icons {
		margin-bottom: 15px;

		.utouch-icon {
		    height: 44px;
		    min-width: 44px;
		    margin-right: 30px;
		}
	}

	.tm-info-wrap {
		.uk-flex;
		.uk-flex-column;
	}

	.info {
		color: @theme-footer-color;
		font-weight: @global-bold-font-weight;

		span {
			font-weight: @global-body-font-weight;
		}
	}
}

//
// Icons
//

.shortcode-icons {
	padding-left: 0;

	li {
		display: inline-block;
		list-style-type: none;

		a {
			font-size: @base-h3-font-size;
		}
	}
}

//
// Tags
//

.tagspopular ul {
	padding-left: 0;

	li {
		list-style-type: none;
		float: left;
	}
}

.tm-tags-list {
	padding: 10px 0 0;
	margin: 0;

	ul li {
		display: inline-block;
	}
}

.tm-tags-list a,
.tagspopular ul li a,
.tm-tag {
	line-height: 30px;
	min-height: 30px;
	font-size: round((@button-mini-font-size*1.2));
	font-family: @global-body-font-family;
	font-weight: @global-body-font-weight;
	margin: 5px 10px 10px 0;
	padding: 0 15px;
	border: 1px solid darken(@panel-box-primary-background, 5%);
	display: inline-block;
	border-radius: @form-input-border-radius;
	vertical-align: middle;
	background-color: @panel-box-primary-background;
	color: @panel-box-primary-color;
	box-sizing: border-box;
	text-decoration: none;
	text-align: center;
	transition: @global-transition;

	&:focus,
	&:hover {
		text-decoration: none;
		background-color: darken(@panel-box-primary-background, 7%);
	}
}

// button link underline 
	
.uk-button-link {
	text-decoration: none;
	position: relative;

	&:hover, 
	&.uk-link:hover {
		text-decoration: none;
	}
	
	&:after {
		content: "";
		position: absolute;
		width: 100%;
		height: 1px;
		bottom: 5px;
		left: 0;
		background-color: @global-link-hover-color;
		visibility: hidden;
		transform: scaleX(0);
		transition: @global-transition;
	}

	&:hover:after {
		text-decoration: none;
		visibility: visible;
		transform: scaleX(1);
	}
}

//
// Module Classes
//

#tm-container {
	
	.tm-primary-color { color: @global-primary-background; }
	.tm-primary-2-color { color: @global-primary-2-background; }
	.tm-primary-3-color { color: @global-primary-3-background; }
	.tm-primary-4-color { color: @global-primary-4-background; }
	.tm-secondary-color { color: @global-secondary-background; }
	.tm-dark-color { color: @global-dark-color; }
	.tm-light-color { color: @global-light-color; }
	.tm-extra-light-color { color: @global-extra-light-background; }
	.tm-primary-color path { fill: @global-primary-background; }
	.tm-offset-left { margin-left: -60px !important; }
	.tm-offset-left-large { margin-left: -100px !important; }
	.tm-offset-left-xlarge { margin-left: -150px !important; }
	.tm-offset-top { margin-top: -60px !important; }
	.tm-offset-top-large { margin-top: -100px !important; }
	.tm-offset-top-xlarge { margin-top: -150px !important; }
	.tm-offset-bottom { margin-bottom: -60px !important; }
	.tm-offset-bottom-large { margin-bottom: -100px !important; }
	.tm-offset-bottom-xlarge { margin-bottom: -150px !important; }
}

.tm-rating {
	margin-bottom: 10px;

	.uk-icon-star {
		letter-spacing: 5px;
		font-size: 20px;
		color: @global-warning-background;
	}

	.tm-5-star:before {
		content: "\f005 \f005 \f005 \f005 \f005";
	}

	.tm-4-star:before {
		content: "\f005 \f005 \f005 \f005 \f006";
	}

	.tm-3-star:before {
		content: "\f005 \f005 \f005 \f006 \f006";
	}

	.tm-2-star:before {
		content: "\f005 \f005 \f006 \f006 \f006";
	}

	.tm-1-star:before {
		content: "\f005 \f006 \f006 \f006 \f006";
	}

	.tm-0-star:before {
		content: "";
	}
}

.tm-primary-light-background {
	background-color: @global-primary-light-background !important;
}

.tm-primary-overlay,
.tm-primary-background {
	border-color: @global-dark-075-shadow !important;
	color: @panel-box-primary-color !important;

	h1,h2,h3,h4,h5,h6,em {
		color: @panel-box-primary-color !important;
	}
}

.uk-block-primary,
.tm-primary-background {
	background-color: @panel-box-primary-background !important;
}

.tm-primary-overlay {
	
	&:before {
		position: absolute;
		content: "";
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background-color: fade(@panel-box-primary-background, 80%) !important;
		color: @panel-box-primary-color !important;
		border-color: @global-dark-075-shadow !important;
	}
}

.tm-primary-2-overlay {
	color: @global-primary-2-color !important;
	
	&:before {
		position: absolute;
		content: "";
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background-color: fade(@global-primary-2-background, 80%) !important;
		color: @global-primary-2-color !important;
		border-color: @global-dark-075-shadow !important;
	}

	h1,h2,h3,h4,h5,h6,em {
		color: @global-primary-2-color !important;
	}
}

.tm-primary-3-overlay {
	color: @global-primary-3-color !important;
	
	&:before {
		position: absolute;
		content: "";
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background-color: fade(@global-primary-3-background, 80%) !important;
		color: @global-primary-3-color !important;
		border-color: @global-dark-075-shadow !important;
	}

	h1,h2,h3,h4,h5,h6,em {
		color: @global-primary-3-color !important;
	}
}

.tm-primary-4-overlay {
	color: @global-primary-4-color !important;
	
	&:before {
		position: absolute;
		content: "";
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background-color: fade(@global-primary-4-background, 80%) !important;
		color: @global-primary-4-color !important;
		border-color: @global-dark-075-shadow !important;
	}

	h1,h2,h3,h4,h5,h6,em {
		color: @global-primary-4-color !important;
	}
}

.tm-secondary-overlay {
	color: @global-contrast-color;
	
	&:before {
		position: absolute;
		content: "";
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background-color: fade(@global-secondary-background, 80%) !important;
		color: @global-contrast-color !important;
		border-color: @global-dark-075-shadow !important;
	}

	h1,h2,h3,h4,h5,h6,em {
		color: @global-contrast-color !important;
	}
}

.uk-block-primary-2,
.tm-primary-2-background {
	background-color: @global-primary-2-background !important;
	color: @global-primary-2-color !important;
	border-color: @global-dark-075-shadow !important;

	h1,h2,h3,h4,h5,h6,em {
		color: @global-primary-2-color !important;
	}
}

.uk-block-primary-3,
.tm-primary-3-background {
	background-color: @global-primary-3-background !important;
	color: @global-primary-3-color !important;
	border-color: @global-dark-075-shadow !important;

	h1,h2,h3,h4,h5,h6,em {
		color: @global-primary-3-color !important;
	}
}

.uk-block-primary-4,
.tm-primary-4-background {
	background-color: @global-primary-4-background !important;
	color: @global-primary-4-color !important;
	border-color: @global-dark-075-shadow !important;

	h1,h2,h3,h4,h5,h6,em {
		color: @global-primary-4-color !important;
	}
}

.uk-block-secondary,
.tm-secondary-background {
	background-color: @global-secondary-background !important;
	color: @global-contrast-color !important;
	border-color: @global-dark-075-shadow !important;

	h1,h2,h3,h4,h5,h6,em {
		color: @global-contrast-color;
	}

	.tm-light-color, 
	.tm-light-color .sppb-addon-title {
		color: fade(@global-contrast-color, 50%) !important;
	}
}

.tm-dark-background {
	background-color: @global-dark-background !important;
	color: @global-contrast-color !important;

	h1,h2,h3,h4,h5,h6,em {
		color: @global-contrast-color;
	}

	.tm-light-color, 
	.tm-light-color .sppb-addon-title {
		color: fade(@global-contrast-color, 50%) !important;
	}
}

.tm-primary-3-background {
	h1,h2,h3,h4,h5,h6,em {
		color: @global-primary-3-color;
	}
}

.tm-primary-4-background {
	h1,h2,h3,h4,h5,h6,em {
		color: @global-primary-4-color;
	}
}

.tm-weight-thin { font-weight: @global-thin-font-weight !important; }
.tm-weight-light { font-weight: @global-light-font-weight !important; }
.tm-weight-regular { font-weight: @global-regular-font-weight !important; }
.tm-weight-medium { font-weight: @global-medium-font-weight !important; }
.tm-weight-bold { font-weight: @global-bold-font-weight !important; }

.tm-muted-background { background-color: @global-light-background; }
.tm-light-background { background-color: @global-light-background !important;}
.tm-extra-light-background { background-color: @global-extra-light-background !important;}

.tm-svg-icon {
	height: 48px;
	padding-top: 0;
	min-width: 48px;
}

.tm-text-large {
	line-height: 1;
	font-size: round(@base-h1-font-size * 2.5);
	font-weight: @global-thin-font-weight;
}

.tm-text-xlarge {
	line-height: 1 !important;
	font-size: 80px;
	font-weight: @global-thin-font-weight;
}

.tm-border-transparent,
.tm-border-edge {

	> div {    
		position: relative;
		display: inline-block;

		&:before,
		&:after {
			content: '';
			height: 100px;
			width: 100px;
			border: 1px solid fade(@global-primary-2-background, 50%);
			position: absolute;
			bottom: -10px;
			left: -10px;
			z-index: 1;
			border-radius: @global-border-radius;
		}

		&:after {
			top: -20px;
			left: auto;
			right: -20px;
			z-index: 2;
		}
	}

	img {
		position: relative;
		z-index: 2;
		margin: 10px;
		box-shadow: 0 0 0 10px rgba(0,0,0,0.02);
	}
}

.tm-border-transparent {

	img {
		box-shadow: none;
	}
}

.tm-thin-font {
	font-weight: 300;
}

.tm-caps {
	text-transform: uppercase;
	
	> .uk-panel-title {
		font-size: @base-h3-font-size;
		letter-spacing: @global-heading-letter-space;
		text-transform: uppercase;
		text-align: center;
		display: block;
		border-bottom: 0;
		margin-bottom: @global-block-gutter;
	}
}

.tm-small-caps {
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: round((@global-font-size*0.85));
}

.tm-italic,
.tm-italic.sppb-addon-header > .sppb-addon-title {
	font-family: @global-italic-font-family;
}

.tm-font-italic {
	font-style: italic;
}

.tm-padding {
	padding: @panel-box-padding;

	&.uk-panel-box {
		padding: @panel-box-padding @panel-box-padding*2;
	}
}

.tm-inner-padding-large {
	.tm-inner-container {
		padding-top: @panel-box-padding*3;
		padding-bottom: @panel-box-padding*3;
	}
}

.tm-padding-large {
	padding-top: @panel-box-padding*2;
	padding-bottom: @panel-box-padding*2;
}

.tm-padding-sides {
	padding: 0 60px;
}

.tm-padding-small-sides {
	padding: 0 @panel-box-padding;
}

.tm-inner-shadow {
	box-shadow: inset 0 2px 5px @global-dark-2-shadow;
}

p:empty {
	margin: 0;
	display: none;
}

.tm-padding-remove { padding: 0 !important; }
.tm-padding-left-remove { padding-left: 0 !important; }
.tm-padding-bottom-remove { padding-bottom: 0 !important; }
.tm-padding-top-remove { padding-top: 0 !important; }

.tm-overlay-primary.sppb-section,
.tm-overlay-primary > .tm-background-cover,
.tm-overlay-secondary.sppb-section,
.tm-overlay-secondary > .tm-background-cover,
.tm-overlay-secondary.tm-darker > .tm-background-cover {
	min-height: inherit;

	&:before {
		position: absolute;
		content: "";
		width: 100%;
		height: 100%;
		padding: 0;
		top: 0;
		left: 0;
		display: block;
	}
}

.tm-overlay-primary,
.tm-overlay-primary.sppb-section:before,
.tm-overlay-primary > .tm-background-cover:before {
	background-color: fade(@global-primary-background, 80%);
}

.tm-overlay-secondary,
.tm-overlay-secondary.sppb-section:before,
.tm-overlay-secondary > .tm-background-cover:before {
	background-color: fade(@global-secondary-background, 85%);
}

.tm-overlay-secondary.tm-darker,
.tm-overlay-secondary.tm-darker > .tm-background-cover {
	background-color: fade(@global-secondary-background, 90%);
}

// Modalx

.modal-x, .modal-x > div {
	visibility: hidden;
}

// Panel
.tm-panel-box-teaser { margin: -@panel-box-padding !important; }

.tm-panel-space-teaser { margin: -@panel-space-padding -@panel-space-padding ((@panel-space-padding / 2)) -@panel-space-padding; }

.tm-panel-space-teaser:before,
.tm-panel-box-image-teaser:before {
	content: '';
	display: block;
	position: absolute;
	right: 0;
	left: 0;
	z-index: 10;
	border-bottom: 1px solid @global-border;
}

// Tablet and bigger
@media (min-width: @breakpoint-medium) {
	.tm-margin-right-gutter-medium { margin-right: -@global-grid-gutter; }
}

// Large screen and bigger
@media (min-width: @breakpoint-xlarge) {

	.tm-margin-right-gutter { margin-right: -@global-grid-gutter-large; }

}

// 

.login {
	padding: @theme-article-padding;
	box-shadow: @panel-box-shadow-horizontal @panel-box-shadow-vertical @panel-box-shadow-blur @panel-box-shadow-spread @panel-box-shadow-color;
    border-radius: @panel-box-border-radius;

	.uk-form input[type="text"],
	.uk-form input[type="password"] {
		width: 100% !important;
	}
}

// 
// Article style
//

article.tm-article {
	border-radius: @panel-box-border-radius;
	box-shadow: @panel-box-shadow-horizontal @panel-box-shadow-vertical @panel-box-shadow-blur @panel-box-shadow-spread @panel-box-shadow-color;
	transition: @global-transition-box-shadow;

	&:hover {
		box-shadow: @panel-box-shadow-horizontal @panel-box-shadow-vertical @panel-box-shadow-blur @panel-box-shadow-spread fade(@global-primary-background, 20%);		

		.uk-article-title {
			color: @global-primary-background;
	    }
	}
}

.tm-article-wrapper {
	padding: @theme-article-padding;
}

.tm-article-featured-image {
	position: relative;
	margin: 0;
	border-radius: @panel-box-border-radius @panel-box-border-radius 0 0;

	.uk-overlay,
	figure,
	img {
		border-radius: @panel-box-border-radius @panel-box-border-radius 0 0;
	}

	img {
		margin-top: 0;
		width: 100% !important;
	}

	+ .tm-article-wrapper .uk-article-title {
		margin-top: 0;
	}
}

.tm-article-content {
	margin-top: 20px;

	.btn-next {
		margin-top: 0;
	}
}

.tm-noblog .uk-article + .uk-article {
	padding-top: @article-margin-top;
	border-top: 1px solid @global-border;
}

.tm-page-title {
	padding: 0 0 @panel-space-padding;
	margin-top: -20px;
}

.tm-dropcap-block > p:first-of-type:first-letter,
.tm-dropcap .tm-article > p:first-of-type:first-letter {
	margin: 10px 10px 0 0;
	float: left;
	line-height: 38px;
	font-size: @global-font-size*3;
	color: @global-color;
	font-family: @global-body-font-family;
	font-weight: @global-body-font-weight;
}

.tm-content > h2 {
	padding-bottom: @global-block-gutter;
}

.tm-article-icons {
	padding-bottom: 10px;
	margin: 0;
	font-family: @global-heading-font-family;
	font-weight: @global-heading-font-weight;
	font-size: round((@global-font-size * 0.85));

	a {
		margin-right: 15px;
		color: fade(@global-color, 40%);
		transition: @global-transition-color;

		&:hover {
			color: @global-link-color;

			&:after {
				background-color: @global-link-color;
			}
		}
	}

	.icon-edit:before {
		font-family: @global-utouch-icon;
		content: "\f153";
	}

	.icon-print,
	.icon-envelope {
		vertical-align: middle;
		padding-right: 5px;
		font-size: 15px;

		&:before {
			font-family: @global-utouch-icon;
		}
	}

	.icon-print:before {
		content: "\f1af";
	}

	.icon-envelope:before {
		content: "\f156";
	}
}

//
// Category Module
//

.category-module {
	list-style-type: none;
	padding-left: 0;
}

//
// Contact
//

.contact {
	h3 { .uk-module-title; }

	.form-horizontal {
		.controls {
			margin-right: 22px;
		}

		.control-group {
			margin-bottom: 10px;

			.controls > input,
			.controls > textarea {
				width: 100%;
			}
		}
	}
}

// Search results

.search {

    span.highlight {
        background-color: @global-highlight-background;
        font-weight: @global-regular-font-weight;
        padding: 1px 5px;
        color: @global-highlight-color;
    }

    #searchForm {
        margin-bottom: 30px;

        .uk-panel-box {
        	padding: @theme-article-padding;
        	box-shadow: @panel-box-shadow-horizontal @panel-box-shadow-vertical @panel-box-shadow-blur @panel-box-shadow-spread @panel-box-shadow-color;
        }

        fieldset {
            margin-bottom: 30px;

            label {
                padding-right: 15px;
                white-space: nowrap;
            }
        }
    }

    .tm-text-large,
    .uk-article-title {
        font-size: @base-h3-font-size;
        line-height: @base-h3-line-height;
        font-weight: @global-regular-font-weight;
        padding-bottom: 0;
    }

    .uk-article + .uk-article {
        margin-top: 30px;
        padding-top: 0;
        border-top: 1px dotted @global-border;
    }

    .uk-article-meta {
        font-size: @global-font-size;
        line-height: @global-line-height;
        margin-bottom: 0;
    }

    .tm-article-content {
        margin-bottom: 30px !important;
    }
}

//
// Error
//

.tm-error-number {
	font-size: 300px;
	line-height: 200px;	
	text-shadow: 0 20px 20px @global-dark-1-shadow;
}

.tm-error-headline {
	font-size: 60px;
	line-height: 60px;
	margin-bottom: 30px;
	text-shadow: 0 3px 5px @global-dark-1-shadow;
}

.tm-error-content { 
	font-size: 24px;
	font-weight: @global-thin-font-weight;
	line-height: 36px;
	color: @global-contrast-color;
	text-shadow: 0 20px 20px @global-dark-1-shadow;

	a {
		color: @global-contrast-color;
		text-decoration: none;
		position: relative;

		&:after {
			content: "";
			border-bottom: 1px dotted @global-contrast-color;
			width: 100%;
			position: absolute;
			bottom: 0;
			left: 0;
		}
	}
}

.tm-error {
	.tm-block-main {
		min-height: 100vh;
	}
}

.tm-offline-cm {
	margin: 50px;
	position: relative;
	z-index: 1;

	.tm-coming-content {
		background-color: fade(@global-secondary-background, 95%);
	    height: ~"calc(100vh - 100px)";
	    padding: 50px;
	    border-radius: @global-border-radius * 2;
	    box-shadow: -20px 0 50px fade(@global-secondary-background, 10%);
	}

	.uk-scrollable-text {
		resize: none;
	}
}

.tm-offline {
	padding: 30px 50px;
	position: relative;
	z-index: 1;
}

.tm-coming-soon-block {

	.uk-form {
		#response {
			color: @global-warning-background;
		}

		input[type="text"] {
			background-color: rgba(0,0,0,0);
			border-color: @global-light-color;
			border-radius: @global-border-radius;
			color: @global-contrast-color;

			&:focus {
				border-color: @global-primary-background;
			}
		}
	
		input:-webkit-autofill {
			-webkit-text-fill-color: @global-light-color;
		}

		input:-webkit-autofill:focus {
			-webkit-text-fill-color: @form-focus-color;
		}

		button {
			color: @button-primary-color;
			background-color: @button-primary-background;

			&:after {
				border-color: rgba(0,0,0,0) @button-primary-background rgba(0,0,0,0) rgba(0,0,0,0);
			}

			&:hover{
				background-color: @button-primary-hover-background;

				&:after {
					border-color: rgba(0,0,0,0) @button-primary-hover-background rgba(0,0,0,0) rgba(0,0,0,0);
				}
			}

			&:active,
			&:focus {
				background-color: @button-primary-active-background;
				
				&:after {
					border-color: rgba(0,0,0,0) @button-primary-active-background rgba(0,0,0,0) rgba(0,0,0,0);
				}
			}
		}
	}
}

// Countdown
.uk-countdown-number {
	font-size: 2.5rem !important;
	font-family: @global-heading-font-family;
	font-weight: @global-heading-font-weight;
}

.uk-countdown-separator {
	line-height: 60px;
	font-size: 32px;
	width: 40px;
}

.uk-countdown-label {
	font-family: @global-italic-font-family;
	color: @global-light-color;
}

.tm-coming-soon-desc {
	color: @global-light-color !important;
}

.uk-background-primary {
	background-color: @global-primary-background;
}

.uk-background-secondary {
	background-color: @global-secondary-background;
}

.tm-coming-soon {

	&.uk-background-secondary {
		background-color: fade(@global-secondary-background, 50%);
	}
}

// 
// K2
// 

#k2container {
	article ul {
		padding: 0;
		margin-bottom: 0
	}

	.uk-pagination {
		margin-top: 20px;
	}
}

// rss feed

.k2FeedIcon a,
a.k2FeedIcon {
	display: block;
	float: right;
	height: 21px;
	line-height: 21px;
	padding: 30px 0 0 0;
	color: fade(@global-color, 40%);
	font-family: @global-body-font-family;
	
	&:before {
		color: orange;
		font-family: @global-font-icon;
	}

	&:hover {
		color: @global-color;
	}
}

.k2FeedIcon a {
	float: none;
}

// category list

.k2CategoriesListBlock {

	ul{
		padding: 0;
		line-height: 22px;
		color: @global-color;
		margin-bottom: 0;
		list-style-type: none;
	}

	a { margin: 0 8px 8px 0; }
}

ul li.itemResizer a {
	display: inline-block;
	height: 26px;
	width: 15px;
	
	span {
		padding: 0 6px 0 0;
	}
}

.smallerFontSize {
	font-size: round((@global-font-size*0.9)) !important;
}

.largerFontSize {
	font-size: round((@global-font-size*1.15)) !important;
}

.itemImageBlock {
	clear: both;
	> a {width: 100%;}
}

.itemImage img{
	width: 100% !important
}

table.admintable tr{border: 5px solid transparent;}
th.k2ProfileHeading{text-align: left; line-height: 48px;}

.itemExtraFields ul li span.itemExtraFieldsValue,
.itemLinks .itemCategory a,
.itemLinks .itemAttachmentsBlock ul,
.itemLinks .itemTagsBlock{
	margin-top: 10px;
}

ul.itemAttachments li {
	list-style-type: none;
}

.itemLinks .itemCategory a{
	margin-left: 10px;
}

.itemLinks .itemTagsBlock ul {
	display: block;
	margin: 0 0 0 8%;

	li {
		margin: -3px -5px 0 10px;
	}
}

.itemBottom .itemRatingBlock span,
.itemBottom .itemRatingBlock .itemRatingList,
.itemBottom .itemRatingBlock .itemRatingForm ul.itemRatingList li,
.itemLinks .itemCategory span,.itemLinks .itemAttachmentsBlock > span,
.itemExtraFields ul li span.itemExtraFieldsLabel,
.itemLinks .itemTagsBlock span,
.itemLinks .itemTagsBlock ul li,
.latestView .itemsContainer {
	float: left;
}

.itemRatingBlock {
	padding-top: 5px;
	padding-right: 15px;
}

.itemAuthorContent ul,
.itemExtraFields ul{
	padding: 0;
}

.itemBottom {
	clear: both;
	margin: 0 0 6px;
}

.itemLinks {
	clear: both;
	margin: 0 0 38px 0;
	
	.itemTagsBlock,
	.itemSocialSharing {
		clear: both;
	}
}

.itemSocialSharing {
	min-height: 38px;
	margin: 42px 0 0 !important;
	overflow: visible !important;
	padding: 20px 0 0 0;
	border-top: 1px solid rgba(0,0,0,0.05);
	box-shadow: 0 1px 0 @global-light-1-shadow inset;
}

.itemExtraFields {
	margin: 0 20px 25px 0;
	float: left;
	padding: 10px 20px;

	h3 {
		padding: 0 0 15px !important;
	}
}

.itemsCategory {
	padding: 0 0 @global-block-gutter;
}

.itemBottom small.itemDateModified {
	display: block;
	text-align: right;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.itemRatingLog {
	float: left;
	line-height: 20px;
	margin: 0 0 0 10px;
	font-size: round((@global-font-size * 0.75));
	text-transform: uppercase;
	letter-spacing: 1px;
}

#formLog {
	clear: both;
	color: inherit;
	display: block;
	float: none;
	margin: 10px 0;
	position: relative;
	text-align: center;
	top: 10px;

	&:empty { display: none; }
}

.formLogLoading {
	width: 16px;
	height: 21px;
	font-family: @global-font-icon;
	font-size: 16px;
	animation: uk-rotate 1s infinite linear;
	overflow: hidden;
	margin: 0 0 0 10px;
	color: @global-primary-background;

	&:before{
		content: "\f1ce";
	}
}

.tm-blog + .tm-blog {
	margin-top: @article-margin-top;
}

.itemView {

	.uk-article-meta {
		margin: 20px 0 0;
		display: block;

		> span {
			display: inline-block;
			padding-right: 5px;
		}
	}

	.tm-article-icons {
		.icon-print, .icon-envelope {
			line-height: 14px;
		}
	}
}

.itemRatingList,
.itemRatingList a:hover,
.itemRatingList .itemCurrentRating {
	background: url("../images/icons/star.svg") left -1000px repeat-x;
}

.itemRatingList {
	background-position: left top;
	float: left;
	height: 20px;
	list-style: none;
	margin: 0 !important;
	overflow: hidden;
	padding: 0;
	position: relative;
	width: 100px;
}

#k2Container header {
	.itemRatingList{
		height: 18px !important;
		margin: 18px 5px 0 !important;
	}

	.itemRatingLog{
		margin: 19px 0 0;
	}
}

.itemRatingList {

	li {
		background: none;
		border: none !important;
		display: inline;
		padding: 0;
	}

	a,
	.itemCurrentRating {
		border: none;
		cursor: pointer;
		height: 20px;
		left: 0;
		line-height: 20px;
		outline: none;
		overflow: hidden;
		position: absolute;
		text-align: right;
		top: 0;
		text-indent: 9em;
	}

	a{
		&:hover {
			background-position: left center;
		}

		&.one-star {
			width: 20%;
			z-index: 6;
		}

		&.two-stars {
			width: 40%;
			z-index: 5;
		}

		&.three-stars {
			width: 60%;
			z-index: 4;
		}

		&.four-stars {
			width: 80%;
			z-index: 3;
		}

		&.five-stars {
			width: 100%;
			z-index: 2;
		}
	}

	.itemCurrentRating {
		background-position: 0 bottom;
		margin: 0;
		padding: 0;
		z-index: 1;
	}
}

.itemTags li{
	margin-right: 5px;
	margin-top: -8px;
}

.itemExtraFields ul li {
	list-style: none;
	padding: 5px 0;
}

.itemLinks .itemAttachmentsBlock ul li a span {
	color: @global-color;
}
.itemLinks .itemAttachmentsBlock span{
	margin-right: 10px
}

.itemLinks .itemSocialSharing > div {
	float: left;
}

.itemAuthorEmail {
	margin-right: 5px;
}

.itemAuthorContent {
	margin: 20px 0 32px 0;
	overflow: hidden;
}

.itemNavigation {
	clear: both;
	padding: 0;
}

.k2CommentItem > a {
	color: @global-color;
}

.itemCommentsForm label {
	clear: both;
	width: 30%;
	float: left;
}

.commentReportLink.modal {
	font-size: 12px;
	border: 1px solid @global-primary-background;
	border-radius: 2px;
	padding: 3px 5px;
	top: 25px;
}

.itemCommentsForm textarea,
.itemCommentsForm .inputbox {
	float: left;
}

.itemCommentsForm textarea.inputbox {
	height: 150px;
}

.itemCommentsForm .inputbox {
	width: 100% !important;
	margin-bottom: @global-block-gutter !important;
}

.itemCommentsForm #submitCommentButton {
	clear: both;
	margin: 0;
}

.itemCommentsForm .itemCommentsFormNotes {
	font-size: 13px;
	margin: 24px 0;
}

#itemCommentsAnchor {
	clear: both;
	margin: 48px 0 0;
}

// Items views

.itemIntroText {
	color: @global-color;
	font-weight: @global-body-font-weight;
	line-height: @global-line-height;
}

.itemList article header h1,
.itemList article header h2,
.itemsContainerWrap article header h1 {
	line-height: @article-title-line-height;
}

.itemList ul.itemTags {
	clear: both;
}

.itemList ul.itemTags li {
	float: left;
	list-style-type: none
}

.clr {
	clear: both;
}

.itemListSubCategories {
	overflow: hidden;
}

.userView {
	> div.uk-block-muted {
		margin-bottom: 80px;
	}

	.tm-author-block {
		border: 1px solid darken(@global-primary-light-background, 5%);
		box-shadow: @panel-box-shadow-horizontal @panel-box-shadow-vertical @panel-box-shadow-blur @panel-box-shadow-spread @panel-box-shadow-color;
	}

}

.has-caption {

	.uk-image-round,
	.itemImage{
		border-radius: @global-border-radius @global-border-radius 0 0;
	}

	.k2ImageCaption{
		background: @global-light-background;
		letter-spacing: 2px;
		font-size: 10px;
		text-transform: uppercase;
		border: 1px solid @global-border;
		border-radius: 0 0 @global-border-radius @global-border-radius;
		margin-top: -6px;
		padding: 10px 10px 4px;
		box-shadow: -1px -1px 0 @global-light-1-shadow inset;
	}
}

.subCategoryContainer {
	float: left;
	margin-bottom: 32px;
}

.subCategoryContainer .subCategory {
	margin: 0 32px 24px 0;
	height: auto !important;
}

.itemContainer {
	float: left;
}

.itemAuthorUrl {
    display: block;
    margin-top: 10px;
}

article.itemView {
	border-radius: @panel-box-border-radius;
	box-shadow: @panel-box-shadow-horizontal @panel-box-shadow-vertical @panel-box-shadow-blur @panel-box-shadow-spread @panel-box-shadow-color;
	transition: @global-transition-box-shadow;

	&:hover {
		box-shadow: @panel-box-shadow-horizontal @panel-box-shadow-vertical @panel-box-shadow-blur @panel-box-shadow-spread fade(@global-primary-background, 20%);		

		.uk-article-title {
			color: @global-primary-background;
	    }
	}

	+ article.itemView {
		margin-top: @article-margin-top;
	}

	.uk-overlay {
		display: block;
		border-radius: @global-border-radius @global-border-radius 0 0;
	}

	.btn-prev, 
	.btn-next {
		margin-top: 0;
	}
}

.latestView .itemsContainerWrap {
	margin: 0;
}

.itemContainerLast article {
	margin: 0;
}

#itemListLinks {
	clear: both;

	ul {
		margin: 12px 0 0 0;
	}

	li {
		font-size: @global-font-size - 1;
		padding-left: 24px;
	}

	a {
		color: #737373;
	}
}

.fb_iframe_widget span {
	vertical-align: baseline !important;
	margin-left: 20px;
}

//
// K2 Comments Module
//

.k2LatestCommentsBlock ul{
	padding-left: 0;
	padding-right: 0;
}

.k2LatestCommentsBlock .k2FeedIcon {
	margin-top: 16px;
}

.k2LatestCommentsBlock ul li,
.k2TopCommentersBlock ul li {
	list-style: none !important;
	padding: 5px 0 10px !important;
}

.k2Avatar {
	display: block !important;
	float: left;
	margin: 15px 20px 10px 0;

	img { border-radius: 100%; }
}

.k2CommentItem .tm-tags-list a {
	margin: 0;
}

.k2CommentItem p{
	margin: 0 0 8px;
}

.lcItemTitle {
	font-size: round((@global-font-size*0.95));
	padding: 10px 0;
	text-transform: none;

	> a { color: fade(@global-color, 50%); }
}

.k2CommentItem span {
	display: block;
}

.k2CommentItem span.lcItemCategory{
	font-size: 12px;
	padding: 0 4px;
	border: 1px solid @global-border;
	border-radius: 3px;
	background: rgba(0,0,0,0.055);
	box-shadow: 0 1px 0 @global-light-1-shadow inset;
	display: inline-block;
}

.k2CommentItem span.lcCommentDate {
	font-size: 10px;
	font-weight: normal;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.k2AuthorsListBlock {

	ul li {
		border: none;
		border-bottom: 1px solid @global-dark-075-shadow;
		padding: 12px 0;

		a.abAuthorLatestItem {
			clear: both;
			display: inline-block;
			font-size: 12px;
			line-height: 14px;
			margin: 12px 0 0;
			padding: 0;

			span {
				color: #777;
				display: block;
				font-size: 10px;
			}
		}
	}
}

// Top Commenters

.tcUsername {
	color: #333;
	font-size: 18px;
}

.tcLatestComment {
	display: block;
	color: #737373;
	font-size: 13px;
	margin: 6px 0;
}

.tcLatestCommentDate {
	color: @global-color;
	display: block;
	font-size: 11px;
}

// 
// K2 Content Module 
// 

div .k2ItemsBlock ul {
	margin: 0;
	padding: 0;
}

div .k2ItemsBlock ul li {
	background: none !important;
	list-style: none !important;
	margin: 0 0 12px;
	padding: 12px 0 12px 0;
}

.moduleItemTitle {
	display: block;
	font-size: 18px;
	font-family: @global-body-font-family;
	font-weight: @global-body-font-weight;
	line-height: @global-line-height;

	&:hover {
		text-decoration: none;
	}
}

.moduleItemAuthor {
	border-bottom: 1px dotted @global-dark-075-shadow;
	margin: 0 0 16px;
	overflow: hidden;
	
	a { padding: 0 0 12px;}
	p { clear: both; }
}

.moduleItemIntrotext {
	display: block;
	padding: 12px 0 0;
	line-height: inherit;
	
	.moduleItemImage img {
		margin-left: 0;
	}
}

.moduleItemDateCreated,
.moduleItemCategory {
	color: @global-color;
	font-size: 14px;
	padding: 10px 0;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.moduleItemExtraFields ul li span.moduleItemExtraFieldsLabel {
	display: block;
	float: left;
	font-weight: bold;
	margin: 0 4px 0 0;
	width: 30%;
}

.itemExtraFieldsLabel {
	margin-right: 100px;
	display: inline-block;
}

.moduleItemTags,
.moduleAttachments {
	border-top: 1px dotted @global-dark-075-shadow;
	margin: 12px 0 0;
	overflow: hidden;
	padding: 12px 0 0;
}

.moduleItemTags strong {
	font-size: 12px;
}

.moduleItemTags a {
	.tm-tag;
}

a.moduleItemComments {
	font-size: ((@global-font-size * 0.85));
	letter-spacing: 1px;
	text-transform: uppercase;

	&:hover {
		background-position: 0 100%;
		color: @global-contrast-color;
	}
}

.k2ItemsBlock ul li span.moduleItemHits {
	font-size: ((@global-font-size * 0.85));
	letter-spacing: 1px;
	text-transform: uppercase;
}

// Login Module

.k2LoginBlock {

	fieldset.input {
		margin: 0;
		padding: 0 0 8px 0;

		p {
			margin: 0;
			padding: 0 0 4px 0;

			label,
			input {
				display: block;
			}

			&#form-login-remember label,
			&#form-login-remember input {
				display: inline;
			}
		}
	}
}

.k2UserBlock {

	p.ubGreeting {
		border-bottom: 1px dotted @global-dark-075-shadow;
	}

	.k2UserBlockDetails {

		span.ubName {
			display: block;
			font-weight: bold;
			font-size: 14px;
		}

		> span {
			display: block;
			font-size: 11px;
			line-height: 16px;
			margin: 3px 0;
		}
	}

	.k2UserBlockActions {
		margin-bottom: 10px;
	}

	.ubAvatar {
		margin-right: 12px;
	}

	.ubName {
		font-size: 13px;
	}
}

.k2LoginBlock ul li {
	font-size: 11px;
}

.k2UserBlock .k2UserBlockActions li,
.k2UsersBlock .ubUserItems li,
.k2UsersBlock .ubUserAdditionalInfo a {
	font-size: 12px;
	padding-left: 16px;
}

// Breadcrumbs

.k2BreadcrumbsBlock {
	span.bcTitle {
		color: @global-color;
		padding: 0 4px 0 0;
	}

	span.bcSeparator {
		font-size: 14px;
		padding: 0 4px;
	}
}

// Calendar

.k2CalendarLoader {
	background: @global-background;
}

.k2CalendarBlock {
    margin-bottom: 8px;

    table.calendar {
        margin: 0 auto;
        width: 100%;
        border: 1px solid @global-dark-1-shadow;
        border-collapse: collapse;

        tr:nth-of-type(even) td:nth-of-type(odd),
        tr:nth-of-type(odd) td:nth-of-type(even) {
            background-color: lighten(@global-light-background, 2%);
        }

        tr {

            td {
                padding: 3px;
                text-align: center;
                vertical-align: middle;
            }

            .calendarDate,
            .calendarDateEmpty,
            .calendarDateLinked,
            .calendarTodayLinked{
                box-shadow: none;
            }

            .calendarNavMonthPrev,
            .calendarNavMonthNext {
                font-size: @global-font-size + 1 !important;
                text-align: center;
            }

            .calendarNavLink {
                color: @global-color;
                text-decoration: none;

                &:hover {
                    color: @global-link-hover-color;
                }
            }

            .calendarCurrentMonth {
                background-color: @panel-box-primary-background !important;
                color: @panel-box-primary-color;
            }

            .calendarDayName {
                font-size: 12px;
                font-weight: 400;
                width: 14.2%;
                color: inherit;
                background: @global-light-1-shadow;
            }

            .calendarDateEmpty {
                background: @global-light-1-shadow;
            }

            .calendarNavMonthPrev,
            .calendarNavMonthNext {
                background: @global-dark-05-shadow;
            }

            .calendarDateLinked {
                padding: 0;

                a {
                    display: block;
                    padding: 2px;

                    &:hover {
                        display: block;
                        padding: 2px;
                    }
                }
            }

            .calendarToday {
                color: @global-color;
            }

            .calendarTodayLinked {
                color: @global-contrast-color;
                padding: 0;
            }

            .calendarTodayLinked a {
                color: @global-color !important;
                background: @global-dark-05-shadow;
                font-weight: normal;
                display: block;
                padding: 3px;
                box-shadow: 0 -1px 4px @global-dark-05-shadow inset;

                &:hover {
                    background-color: #f4f4f4;
                    color: #404040;
                    display: block;
                    padding: 2px;
                }
            }
        }
    }
}

// Category Tree select box

.k2CategorySelectBlock form select {
	width: auto;
}

// Tag cloud

.k2TagCloudBlock {
	font-size: 15px;
	padding: 8px 0 0 4px;
}

// google search

#k2Container .gsc-branding-text {
	text-align: right;
}
#k2Container .gsc-control {
	width: 100%;
}
#k2Container .gs-visibleUrl {
	display: none;
}

a.ubUserURL,
a.ubUserFeedIcon {
	clear: both;
	display: block;
	font-size: 12px;
}

span.ubUserEmail {
	display: inline-block;
	height: 16px;
	margin: 0 2px 0 0;
	overflow: hidden;
	padding: 0;
	width: 16px;

	a {
		display: inline-block;
		height: 16px;
		margin: 0;
		padding: 0;
		text-indent: -9999px;
		width: 16px;
	}
}

.tm-related-block,
.tm-author-block {
    padding: 40px;
    background-color: @global-primary-light-background;
    border-radius: @global-border-radius;

    h3 a {
        color: @global-heading-color;
        transition: @global-transition-color;
        text-decoration: none;

        &:hover {
            text-decoration: none;
            transition: @global-transition-color;
            color: @global-link-hover-color;
        }
    }

    p {
        margin: 5px 0 0;
    }

    .tm-avatar {
        min-width: 64px;
        margin-bottom: 0;
        margin-right: 40px;
    }
}

.tm-related-block {
    a {
        color: @global-color;
        text-decoration: none;
        transition: @global-transition-color;

        &:hover {
            color: @global-link-hover-color;
            text-decoration: none;
            transition: @global-transition-color;
        }
    }

    .uk-list li {
        padding-left: 30px;
        background: url(../images/icons/latest.svg) 0 10px no-repeat;
    }
}

.k2UsersBlock{

	ul li h3 {
		clear: both;
		margin: 8px 0 0 0;
		padding: 0;
	}
	.ubUserDescription p {
		font-size: @global-font-size - 2;
	}
	.ubUserAvatar {
		margin-right: 12px;
	}
	.ubUserName {
		display: block;
		line-height: 11px;
	}
	h3 {
		font-size: @base-h5-font-size;
	}
	.ubUserItems {
		font-size: @global-font-size - 2;
	}
}

.catCounter {
	font-size: 13px;
	font-weight: normal;
}

// Fix for the categories view

.itemContainerLast:first-child .itemImageBlock,
.clr + .itemContainerLast .itemImageBlock {
	padding: 0;
}
.itemCommentsPagination ul li {
	display: inline-block;
	font-size: 80%;
	margin: 0 3px;
}
.itemCommentsPagination ul  {
	text-align: right;
}

#k2Container .pagination a,
#k2Container .pagination strong{
	padding: 5px 10px 5px;
}

.itemsContainer{
	max-width: 100%;
}

.k2UsersBlock li {
	list-style-type: none;
}

.recaptchatable {
	float: left;
}

.itemAuthorBlock {
	h4 a {
		color: @global-heading-color;
	}
}

// 
// K2 responsiveness
// 

@media (max-width: @breakpoint-small-max) {
	#k2Container .itemContainer{
		width: 100% !important;
	}

	.itemCommentsForm .inputbox {
		width: 100%;
	}

	ul.itemCommentsList{
		padding-left: 0;
	}

	.itemAuthorBlock .itemAuthorDetails{
		margin-left: 0;
	}

	.itemComments .itemCommentsList li > div {
		margin-left: 32px;
	}

	#k2Container header > h1 {
		font-size: 24px;
		line-height: 40px;
		margin: 0 0 15px 0;
	}

	.itemView span.uk-blog-date {
		display: none;
	}
}

@media (max-width: @breakpoint-mini-max) {
	.itemExtraFields {
		float: none;
		margin: 0;
	}

	.subCategoryContainer {
		width: 100% !important;
		margin-bottom: 0;
	}

	.subCategoryContainer .subCategory {
		margin: 0;
		height: auto !important;
	}

	article header .itemRatingBlock > div {
		float: left;
	}

	.itemList article header h1,
	.itemList article header h2,
	.itemsContainerWrap article header h1 {
		font-size: 24px;
		line-height: 40px;
	}
}

//
// J2 Store
//

.j2store-single-product.multiple {
	position: relative;
	text-align: left;
	background-color: @global-extra-light-background;
	border-radius: @global-border-radius;

	h2.product-title {
		font-size: round(@base-h5-font-size*0.8);
		font-weight: @global-heading-font-weight;
		font-family: @global-heading-font-family;
		line-height: @base-h3-line-height;
		margin: 15px 20px 0;
		text-align: center;

		a { 
			color: @global-heading-color; 
			transition: @global-transition-color;

			&:hover {
				color: @global-primary-background;
			}
		}
	}

	.product-price-container {
		margin: 0 20px 0;
		text-align: center;
	}

	#kt {
		display: none;
	}
}

.j2store-view-back-button {
	margin-bottom: 20px;
}

#productFilters .btn-success,
#j2store-slider-range-box > .btn{
	&:extend(.uk-button-secondary all);
}

.j2store-single-product.detail {

	.product-title {
		margin-bottom: 0;
		font-weight: @global-heading-font-weight;
		font-size: @base-h2-font-size;
		line-height: @base-h2-line-height;
	}

	.price-sku-brand-container {
		.product-price-container {
			text-align: left;
		}
		
		.sale-price {
			font-weight: @global-heading-font-weight;
			font-family: @global-heading-font-family;
			font-size: @base-h3-font-size;
		}
	}

	.product-qty input[type="text"], 
	.product-qty input[type="number"] {
		padding: 16px 10px !important;
		min-width: 50px;
	}

	.j2store-cart-button {
		&:extend(.uk-button-large all);
	}

	.j2store-addtocart-form {
		text-align: left !important;
		margin: 0;
	}

	#description {
		font-size: @global-font-size;
		margin: 0;
		color: @global-color;
		text-align: left;
	}
}

.j2store-add-to-cart {
	margin-left: 0;
}

.product-price-container {
	text-align: left;

	.sale-price {
		font-weight: @global-body-font-weight;
		font-size: @global-font-size;
		margin-bottom: 5px;
		display: inline-block;
	}

	.base-price.strike {
		display: inline-block;
		margin-right: 10px;
		color: @global-muted-color;

		&:before {
			content: "@{theme-j2store-sale-text}";
			position: absolute;
			background-color: @alert-danger-background;
			min-width: 45px;
			height: 27px;
			color: @alert-danger-color;
			text-align: center;
			top: 10px;
			right: 10px;
			border-radius: 3px;
		}
	}
}

.product-qty input[type="text"], 
.product-qty input[type="number"] {
	padding: 7px !important;
}

.product-sdesc {
	display: inline-block;
	margin: 20px 0;
    border-top: 1px solid @global-dark-075-shadow;
    padding-top: 20px;

	p {
		margin-bottom: 0;
		text-align: left;
	}
}

.discount-percentage {
	display: inline-block;
	margin-right: 15px;
	color: @global-light-color;
	font-size: @global-font-size;
	font-family: @global-italic-font-family;
	font-style: italic;
	display: inline-block;
	top: 8px;
	right: 55px;
	position: absolute;
}

.j2store-product-images {
	padding: 0;
}

.j2store-product-main-image {
	margin-bottom: 30px;
	box-shadow: 0 0 0 1px @global-dark-05-shadow;
}

.j2store-single-product .tab-pane table,
.product-specs table {
	&:extend(.uk-table all);
}

.j2store-thumbnail-image {
	position: relative;

	 > a {
		display: block;
		transition: @global-transition;

		&:before {
			content: "";
			position: absolute;
			width: 100%;
			height: 100%;
			background-color: fade(@global-secondary-background, 15%);
			top: 0;
			left: 0;
			opacity: 0;
			transition: @global-transition-opacity;
		}

		&:hover:before {
			opacity: 1;
		}

		img {
			width: 100%;
		}
	}
}

.j2store-addtocart-form {
	text-align: center;
	margin: 10px 20px 0;
	padding-bottom: 20px;

	> a {
		.uk-button;
		.uk-button-primary;
		.uk-button-small;
	}
}

.cart-checkout-button > a {
	float: right;
	&:extend(.uk-button all);
	&:extend(.uk-button-primary all);
}

.j2store .checkout-content .buttons {
	margin-top: 30px;
}

.cart-checkout-button > a,
#button-payment-method,
#cash-submit-button {
	.uk-button-large;
}

.cart-action-complete {
	clear: both;

	.text-success {
		.uk-badge;
		.uk-badge-success;
		display: inline-block;
		padding: 5px 20px;
	}
}

.cart-update-button > input {
	&:extend(.uk-button all);
	&:extend(.uk-button-primary all);
}

.cart-continue-shopping-button > input {
	&:extend(.uk-button all);
}

.j2store-addtocart-form > a.btn-success,
.j2store-cart-button {
	&:extend(.uk-button-small all);
	&:extend(.uk-button-primary all);
}

.j2store-product-list select {
	float: right;
	font-size: 14px;
}

.j2store-remove {
	color: @global-primary-background;
	border: none;
	background-color: rgba(0,0,0,0);

	i {
		font-size: 18px;
	}
}

.j2store-products-row.row-fluid {
	margin-bottom: 40px;
}

#j2store-pagination {
	text-align: left;
	margin-bottom: 0;
}

ul.additional-image-list {
	padding-left: 0;
	margin-bottom: 40px;

	li img {
		padding: 0;
		border-radius: @global-border-radius;
		margin-right: 20px;
		box-shadow: 0 0 0 1px @global-dark-05-shadow;
		transition: @global-transition;

		&:hover {
			border-color: @global-primary-background;
		}
	}
}

.price-sku-brand-container {
	border: none;
	margin-bottom: 0;
	position: relative;
}

.j2store.checkout h1 {
	.uk-module-title;
}

.cart-item-options {
	float: right;
}

.j2store .checkout-content {
	overflow: visible;
	margin: 30px 10px;
}

.j2store .checkout-heading {
	.tm-toggle .uk-accordion-title;
	padding: 15px 20px;
	font-size: @global-heading-font-family;
	font-size: @base-h3-font-size;
	line-height: @base-h3-line-height;
	font-weight: @global-body-font-weight;

	a {
		font-size: @base-h5-font-size;
	}
}

// Estimate shipping

.cart-estimator-discount-block {
	margin-top: 50px;
}

#j2store-cart-modules > label > input {
	margin: -3px 10px 0 0;
}

#shipping-estimate-form table {
	&:extend(.uk-table all);
	border: none;

	td {
		border-bottom: none;
	}
}

// share button
#j2store_app_shareButton {
	margin: 30px 0;

	.app_socialmedia {
		margin-right: 10px;

		i  {
			font-size: 18px;
			color: @global-color;
			border: 1px solid @global-dark-05-shadow;
			padding: 10px;
			border-radius: 50%;
			width: 37px;
			height: 37px;
			text-align: center;
			transition: @global-transition-color;

			&.fa-twitter-square:before {
				content: "\f099";
			}

			&.fa-facebook-square:before {
				content: "\f09a";
			}

			&.fa-google-plus-square:before {
				content: "\f0d5";
			}

			&.fa-pinterest-square:before {
				content: "\f0d2";
			}

			&.fa-linkedin-square:before {
				content: "\f0e1";
			}
		}

		&:hover {
			i { color: @global-link-color; }
		}
	}
}

// login form

ul.loginLinks {
	list-style-type: none;
	padding-left: 0;
}

.j2storeUserName > input,
.j2storePassword > input {
	clear: both;
	display: block;
}

// filters

#j2store-slider-range {

	&.ui-slider {
		background-color: fade(@global-primary-background, 10%);
		border-radius: 10px;
	}

	.ui-slider-handle {
		border-radius: 10px;
		height: 20px;
		width: 20px;
		top: -9px;
		margin: 0;
		background-color: @global-primary-background;

		&:last-child {
			margin-left: -20px;
		}
	
		&:before {
			content: "";
			position: absolute;
			background: @global-background;
			width: 10px;
			height: 10px;
			border-radius: 50%;
			margin: 5px;
			cursor: ew-resize;
			box-shadow: 0 0 0 1px darken(@global-primary-background, 3%);
		}
	}

	.ui-slider-range {
		background-color: darken(@global-primary-background, 5%);
	}
}

#productsideFilters {
	.product-filter-heading {
		font-size: @base-h5-font-size;
		display: block;
		margin: 0 0 30px;
	}

	.j2store-product-filters {
		margin-bottom: 50px;
	}

	.j2store-product-brand-label input {
	    margin-right: 10px;
	    margin-top: 0;
	}

	.j2store-item-category:before {
		content: "\f1f0";
		font-family: @global-utouch-icon;
		font-size: @global-font-size;
		color: fade(@global-color, 15%);
		padding-right: 10px;
	}

	li.j2product-categories.level1 a {
		padding-left: 0;
	}
}

input[type="text"].j2store-product-search-input {
	height: 32px;
	line-height: 32px;
}

.product-upsells-container,
.product-crosssells-container {
	margin-top: 60px;

	> div {
		> h3 {
			margin-bottom: 40px;
		}
	}

	.product-price-container {
		margin: 0 20px;
	}

	#j2store_app_shareButton {
		display: none;
	}
}

// upsell
.product-upsells-container {

	.upsell-product-row {
		text-align: left;

		.upsell-product {
		    position: relative;
		    background-color: @global-extra-light-background;
			border-radius: @global-border-radius;

			> .btn {
				margin: 10px 20px 20px;
			}
		}

		[class^="j2store-product-thumb-image-"] {
			width: 100%;
		}
	}

	.upsell-product-title {
		text-align: left;
		font-size: round(@base-h3-font-size*0.8);
		font-weight: @global-heading-font-weight;
		font-family: @global-heading-font-family;
		line-height: @base-h3-line-height;
		margin: 15px 20px 0;

		a { 
			color: @global-color;
			transition: @global-transition-color;

			&:hover {
				color: @global-link-color;
			}
		}
	}
}

// cross sell
.product-crosssells-container {
	.crosssell-product-row {
		text-align: left;

		.crosssell-product {
			position: relative;
			background-color: @global-extra-light-background;
			border-radius: @global-border-radius;

			> .btn {
				margin: 10px 20px 20px;
			}
		}

		[class^="j2store-product-thumb-image-"] {
			width: 100%;
		}
	}

	.cross-sell-product-title {
		text-align: left;
		font-size: round(@base-h3-font-size*0.8);
		font-weight: @global-heading-font-weight;
		font-family: @global-heading-font-family;
		line-height: @base-h3-line-height;
		margin: 15px 20px 0;

		a { 
			color: @global-color;
			transition: @global-transition-color;

			&:hover {
				color: @global-link-color;
			}
		}
	}
}

// product compare
.product-compare {
	padding: 15px 2px;

	a {
		transition: @global-transition-color;
		text-decoration: none;
	}
}

.j2store-product-compare-container {
	.table-bordered {
		border: 0;

		th, td {
			border-left: 0;
		}

		thead th h3.center {
			text-align: left;
		}
	}

	.j2store-productcompare-img {
		width: 100%;
		border: 0;
		border-radius: @global-border-radius;
	}

	.product-compare-remove {
		float: right;
	}

	.cart-action-complete + .btn,
	.compare-product-price-container + .btn,
	.sale-price + .btn {
		clear: both;
		display: table;
		margin-top: 5px;
	}

	.compare-product-price-container {
		.strike {
			color: @global-muted-color;
		}

		.sale-price {
			font-size: @global-font-size;
			font-weight: @global-body-font-weight;
		}
	}

	.product-title {
		font-size: @base-h3-font-size;
		color: @global-color;
		transition: @global-transition-color;

		&:hover {
			color: @global-link-color;
		}
	}
}

// profile
.j2store-myprofile table {
	.uk-table;
}

// mod_j2store_detailcart

.detailJ2StoreCartBlock {
	
	.j2store-cart-table {
		font-size: round(@global-font-size*0.95);

		tr td:nth-child(3) {
			text-align: right;
		}
	}

	.table-responsive {
		overflow: visible;
	}
}

//
// Kunena
//

#kunena.layout {
	.navbar-inner,
	.breadcrumb {
		background-color: lighten(@global-primary-light-background, 1%);
		border-color: darken(@global-primary-light-background, 3%);
	}

	tr.category:nth-child(odd){
		background-color: lighten(@global-primary-light-background, 1%);
	}

	.navbar .nav > .active > a, 
	.navbar .nav > li > a:focus, 
	.navbar .nav > li > a:hover {
		background-color: darken(@global-primary-light-background, 2%);
	}
}

//
// Jevents
//

#jevents {

	.cal_daysoutofmonth {
		background-color: @global-light-background;
		font-size: round((@global-font-size*0.9));
		font-weight: @global-body-font-weight;
		color: fade(@global-color, 30%);
	}

	.cal_top_day_names td {
		font-family: @global-heading-font-family;
		font-weight: @global-heading-font-weight;
	}

	.nav-items > div {
		border: 1px solid @global-primary-background;
		padding: 6px 0;
		margin: 0 5px;
		border-width: 1px 0;
		border-style: dotted;

		a:hover {
			text-decoration: none;
			border-left: none;
			background-color: fade(@global-primary-background, 10%);
		}

		&:first-child { border-left: none; border-radius: 0; }
		&:last-child { border-right: none; border-radius: 0; }
	}

	.icon-print,
	.icon-envelope {
		background: none;
		margin-left: 8px;
	
		&:before {
			font-family: @global-utouch-icon;
		}
	}

	.icon-print:before{
		content: "\f1af";
	}

	.icon-envelope:before {
		content: "\f156";
	}

	#nav-search a {
		text-decoration: none;
		
		&:before {
			font-family: @global-font-icon;
			font-size: 20px;
			content: "\f002";
		}

		img {
			display: none;
		}
	}
}

.month_date > *,
.contentheading {
	font-family: @global-heading-font-family !important;
	font-weight: @global-heading-font-weight !important;
	color: @global-heading-color !important;
}

.month_date {
	text-align: center;
	margin-bottom: @panel-box-padding;

	> * {
		font-size: @base-h3-font-size;
	}
}

#jevents_body {
	background-color: rgba(0,0,0,0);
	border: none;
	
	div.list_no_e {
		font-size: @global-font-size;
	}

	a.cal_titlelink:link, 
	a.cal_titlelink:visited, 
	a.cal_titlelink:hover {
		font-size: 12px;
		padding: 4px;
	}

	a.ev_link_row:link,
	a.ev_link_row:visited, 
	a.ev_link_row:hover {
		font-size: @global-font-size;
	}

	.month_cell_st {
		background-color: @global-primary-light-background;
	}

	#jumpto form select {
		font-size: @global-font-size;
		font-weight: @global-body-font-weight;
		margin-top: 15px;

	}

	#jumpto form button {
		font-size: @global-font-size;
		font-weight: @global-body-font-weight;
		text-shadow: none;
		line-height: 35px;
		min-height: 35px;
		&:extend(.uk-button all);
		&:extend(.uk-button-primary all);
	}

	.jev_pagination select#limit.inputbox {
		margin: 0 25px 0 10px;
	}

	ul.ev_ul li.ev_td_li {
		margin: 15px;
		padding: 15px;
		border-bottom: none;
		line-height: @global-line-height;
	}

	.cal_table {
		background-color: rgba(0,0,0,0);
	}

	.cal_daysnoevents {
		height: 110px;
		background-color: rgba(0,0,0,0);
	}

	.cal_cell_rows{
		&:nth-of-type(odd) {
			background-color: @global-primary-light-background;
		}

		&:nth-of-type(even) {
			background-color: rgba(0,0,0,0);
		}

		&:nth-of-type(even) td:nth-of-type(odd),
		&:nth-of-type(odd) td:nth-of-type(even) {
			background-color: darken(@global-primary-light-background, 2%);
		}
	}

	.nav-items {
		width: 100%;
		
		> div:first-child a:hover {
			margin-left: 0;
		}

		> div a {
			padding: 8px 12px;
		}
	}

	.nav-items div.active a, 
	.jev_header2 .active a {
		background-color: @global-primary-background;
		padding: 8px 12px;

		&:hover {
			border-left: none;
			border-top: none;
			padding: 8px 12px;
			background: @global-primary-background;
			color: @global-contrast-color;
		}
	}

	.new-navigation #nav-search {
		margin-top: -35px;
		position: relative;
	}

	.cal_today a.cal_daylink {
		background-color: @global-primary-background;
		border-radius: 50%;
		padding: 1px 6px;

		&:hover {
			border-radius: 50%;
			color: @global-primary-background;
			border: 1px solid @global-primary-background;
		}
	}

	.cal_table {
		border: 1px solid @global-primary-light-background;
	}

	.cal_daysnames {
		font-weight: @global-body-font-weight;
		color: @global-color;
		font-size: @global-font-size;
		height: 40px;
		line-height: 40px;
	}

	div.event_legend_name {
		font-weight: @global-body-font-weight;
		margin-right: 20px;
	}

	.event_legend_container {
		margin-top: @panel-box-padding;
	}

	div.new-navigation {
		margin-bottom: 60px;
	}

	.jev_toprow {

		.jev_header2 {
			margin-bottom: 30px;
		}

		div.currentmonth {
			border-top: none;
			border-bottom: none;
			font-weight: @global-body-font-weight;
			padding: 8px 0;
			color: @global-color !important;
			width: 50%;
		}

		div.previousmonth, 
		div.nextmonth {
			background-color: rgba(0,0,0,0);
			border: none;
			padding: 8px 0;
			margin: 0;

			a {
				font-size: @global-font-size;
				background: none !important;
				color: @global-primary-background;

				&:before,
				&:after {
					font-family: @global-font-icon;
					font-size: 18px;
				}
			}
		}

		div.nextmonth a:after {
			content: "\f105";
			margin-left: 8px;
		}

		div.previousmonth a:before {
			content: "\f104";
			margin-right: 8px;
		}
	}

	#jev_maincal {
		border-radius: @global-border-radius;
		background-color: @global-primary-light-background;
		border: 1px solid darken(@global-primary-light-background, 7%);
		margin: @panel-box-padding*2 0 0 0;

		&.jev_listview .jev_listrow {
			border-color: darken(@global-primary-light-background, 7%);
		}

		&.jev_listview .jev_daysnames {
			border-width: 0 1px 1px 0;
			background-color: @panel-box-primary-background;
			color: @panel-box-primary-color;
			border-radius: 0 0 @global-border-radius 0;
			border-color: darken(@panel-box-primary-background, 5%);
		}
	}
}

.jevbootstrap input,
.jevbootstrap button,
.jevbootstrap select,
.jevbootstrap textarea {
	font-family: @global-body-font-family;
}

a.cal_daylink {

	&:hover {
		color: @global-primary-background;
	}

	&:link,
	&:visited {
		font-weight: @global-body-font-weight;
		font-size: round((@global-font-size*0.95));
		font-family: @global-heading-font-family;
		color: @global-color;
	}
}

div.jevtt_title {
	font-family: @global-heading-font-family;
	font-weight: @global-heading-font-weight;
}

div.jevtt_title {
	font-family: @global-body-font-family;
	font-weight: @global-body-font-weight;
}

.jev_evdt .jev_evdt_title {
	font-family: @global-heading-font-family;
	font-weight: @global-heading-font-weight;
	font-size: @base-h3-font-size;
	line-height: @base-h3-line-height;
}

// events calendar module
#flatcal_minical {
	table.flatcal_main_t {
		width: 100%;
		border: none;
		background-color: rgba(0,0,0,0);
		border-radius: @global-border-radius;
	}

	.full_cal_link {
		display: none;
	}

	.flatcal_daycell, 
	.flatcal_todaycell, 
	.flatcal_sundaycell, 
	.flatcal_othermonth {
		color: @global-color;
		padding: 1px;
		font-weight: @global-body-font-weight;
	}

	.flatcal_todaycell a {
		padding: 0 3px;
	}

	.flatcal_busylink:link, 
	.flatcal_busylink:visited {
		color: @global-link-color;
	}

	table tr,
	table td {
		padding: 0;
	}

	table.flatcal_navbar {
		background-color: @global-primary-background;
		box-shadow: 0 1px 0 darken(@global-primary-background, 5%);
		border-bottom: 0;
		border-radius: @global-border-radius @global-border-radius 0 0;
		width: 100% !important;
	}

	table.flatcal_weekdays {
		width: 100% !important;
	}

	TD.flatcal_weekdays {
		font-size: round((@global-font-size*0.8));
		color: @global-color;
		border-bottom: 1px solid @global-light-background;
	}

	td.link_next,
	td.link_prev {
		min-width: 25px;
		position: relative;
		padding-right: 10px;

		img {
			display: block;
			box-sizing: border-box;
			width: 20px;
			height: 20px;
			z-index: 1;
			position: relative;
		}

		&:before {
			font-family: @global-font-icon;
			position: absolute;
			font-size: 20px;
			color: @panel-box-primary-color;
			z-index: 0;
			line-height: 20px;
			left: 40%;
		}
	}

	td.link_prev {
		position: absolute;
		right: 30px;
		top: 9px;
	}

	td.link_next img {
		padding-right: 20px;
	}

	td.link_prev img {
		padding-left: 20px;
	}

	td.link_next:before {
		content: "\f105";
		left: 30%;
	}
	
	td.link_prev:before {
		content: "\f104";
		line-height: 26px;
	}
	
	.flatcal_month_label {
		color: @panel-box-primary-color;
		height: 45px;
		font-weight: @global-heading-font-weight;
		font-family: @global-heading-font-family;
		font-size: @base-h5-font-size;
		line-height: @base-h5-line-height;
		text-align: left;
		padding-left: 20px;
	}

	.flatcal_daylink, 
	.flatcal_sundaylink, 
	.flatcal_busylink {
		font-size: round((@global-font-size*0.95));
		font-family: @global-body-font-family;
		font-weight: @global-body-font-weight;
	}

	.flatcal_daylink:link, 
	.flatcal_daylink:visited {
		color: @global-color;
	}

	.flatcal_todaycell a {
		border: 1px solid @global-primary-background;
		background-color: @global-primary-background;
		border-radius: 2px;

		&:hover {
			border: 1px solid @global-primary-background;
		}
	}
}

// Events Latest module 

.mod_events_latest_table {
	.tm-block-time {
		margin-right: 20px;
	}

	.tm-event-descr {
		padding-right: 0;
		margin-bottom: 20px;

		h3, h4 {
			margin-bottom: 5px; 
		}

		p {
			margin: 0;
		}
	}
}

// 
// SP Page Builder
// 

@media (min-width:1200px) {
	.mod-sppagebuilder .sppb-container-inner,
	.sppb-row-container {
		width: auto;
	}
}

.sppb-addon-header {
	&.uk-h1 > .sppb-addon-title {
		.uk-h1;
	}

	&.uk-module-title {
		&.sppb-text-center:after {
			left: 50%;
			margin-left: -30px;
		}
	}

	&.uk-module-title {
		&.sppb-text-right:after {
			left: auto;
			right: 0;
		}
	}
}

.sppb-addon-title .sppb-addon-title-icon {
	padding-right: 10px;
}

.mod-sppagebuilder {
	.sppb-container-inner {
		margin-right: auto;
		margin-left: auto;
	}
	
	.sppb-column-addons .sppb-container-inner {
	    padding: 0;
	}
}

.tm-list-icons {
	overflow: hidden;
    margin-left: 30px;

    li {
		margin-bottom: 0.35em;
		font-size: 1em;
		overflow: hidden;
		clear: both;
		transition: all .3s ease;
		font-weight: @global-bold-font-weight;

		svg {
			height: 1em;
			width: 1em;
			margin-top: 7px;
			margin-right: 20px;
			float: left;
		}

		a {
			display: block;
			overflow: hidden;
		}
    }

    &.tm-large-icons li svg {
		margin-top: 0;
		height: 32px;
		width: 32px;
    }

    &.tm-color-cyan {
    	a {
    		color: #0ff;
    	}

    	svg {
			color: #0ff;
			fill: #0ff;
    	}
    }

    &.tm-color-green {
    	a:hover {
    		color: @global-success-background;
    	}

    	svg {
			color: @global-success-background;
			fill: @global-success-background;
    	}
    }
}

.mod-sppagebuilder .sppb-container-inner,
.sppb-row-container {
	&:extend(.uk-container all);
}

#sp-page-builder,
.sp-page-builder,
#tm-page-builder,
.tm-page-builder {

	.sp-pagebuilder-page-edit {
		background-color: @button-primary-background;
		color: @button-primary-color;

		&:hover {
			background-color: @button-primary-hover-background;
			color: @button-primary-hover-color;
		}

		&:active,
		&:focus {
			background-color: @button-primary-active-background;
			color: @button-primary-active-color;       
		}
	}

	.tm-vertical-title,
	.tm-bottom-right-title,
	.tm-bottom-title, 
	.tm-bottom-title-light {

		overflow: hidden;

		.sppb-section-title > .sppb-title-heading {
			font-size: 150px;
			line-height: 80px;
			letter-spacing: -5px;
			margin-bottom: 0;
			font-weight: @global-large-text-font-weight;
			color: @global-section-title-color;
		}
	}

	.tm-vertical-title {
		.sppb-section-title {
			position: absolute;
			bottom: 50px;
			transform: rotate(-90deg);
			transform-origin: left center;
		}
	}

	.tm-bottom-title {
		.sppb-section-title {
			position: absolute;
			bottom: -10px;
		}

		&.tm-light-title .sppb-section-title > .sppb-title-heading {
			color: fade(@global-contrast-color, 10%) !important;
		}
	}

	.tm-bottom-right-title {
		.sppb-section-title {
			position: absolute;
			bottom: -30px;
			right: 100px;
		}
	}

	.tm-block-main {
		padding-top: 0;
		padding-bottom: 0;

		> .uk-container {
			max-width: 100%;
			padding: 0;
		}
	}

	.sppb-section-title {
		h1.sppb-title-heading {
			font-size: @base-h1-font-size;
			line-height: @base-h1-line-height;
		}

		h2.sppb-title-heading {
			font-size: @base-h2-font-size;
			line-height: @base-h2-line-height;
		}

		h3.sppb-title-heading {
			font-size: @base-h3-font-size;
			line-height: @base-h3-line-height;
		}

		h4.sppb-title-heading {
			font-size: @base-h5-font-size;
			line-height: @base-h5-line-height;
		}

		h5.sppb-title-heading {
			font-size: @base-h5-font-size;
			line-height: @base-h5-line-height;
		}

		h6.sppb-title-heading {
			font-size: @base-h6-font-size;
			line-height: @base-h6-line-height;
		}

		.sppb-title-subheading {
			font-size: @global-font-size;
			line-height: @global-line-height;
		}
	}

	.sppb-btn {
		.uk-button;

		&:hover {
			.hook-button-hover;
		}

		&:focus,
		&:active {
			.hook-button-active;
		}

		i.fa:before {
			font-size: inherit;
			margin: 0 5px;
		}

		&.sppb-btn-action-icon {
			height: 70px;
			width: 70px;
			line-height: 70px;
			padding: 0;
			position: relative;
			box-shadow: 0 0 0 10px @global-primary-light-background;

			i:before {
				font-size: 20px;
				line-height: 70px;
				margin: 0;
			}

			&:after {
				content: "";
				position: absolute;
				width: 70px;
				height: 70px;
				border: 2px solid @global-contrast-color;
				left: 0;
				top: 0;
				opacity: 0;
				animation: pulsate 2.5s cubic-bezier(0.25,0.1,0.25,1) infinite;
			}

			&.sppb-btn-round:after {
				border-radius: 50%;
			}

			&.sppb-btn-square:after {
				border-radius: 0;
			}

			&.sppb-btn-rounded:after {
				border-radius: @global-border-radius;
			}

			&:hover {
				&:after {
					animation: none;
				}
			}
		}
	}

	.sppb-btn-round {
		border-radius: 100px;
		padding: 0 50px;

		.sppb-modal-selector {
			padding: 0 25px;
		}
	}

	.sppb-btn-square {
		border-radius: 0 !important;
	}
	
	.sppb-btn-link {
		&:extend(.uk-button-link all);
		background-color: rgba(0,0,0,0);
		color: @button-link-color;
	}

	.sp-pagebuilder-btn:after {
		display: none;
	}

	.sppb-btn-xlg {
		min-height: 60px;
		padding: 0 35px;
		line-height: 64px;
		font-size: 24px;
		border-radius: @global-border-radius * 3;
	}

	.sppb-btn-lg {
		.uk-button-large;
		padding: 0 50px;
	}

	.sppb-btn-sm {
		.uk-button-small;
	}

	.sppb-btn-xs {
		.uk-button-mini;
	}

	.sppb-btn-success {
		.uk-button-success;

		&:hover {
			.hook-button-success-hover;
		}

		&:focus,
		&:active {
			.hook-button-success-active;
		}
	}

	.sppb-btn-warning {
		.uk-button-warning;

		&:hover {
			.hook-button-warning-hover;
		}

		&:focus,
		&:active {
			.hook-button-warning-active;
		}
	}

	.sppb-btn-danger {
		.uk-button-danger;

		&:hover {
			.hook-button-danger-hover;
		}

		&:focus,
		&:active {
			.hook-button-danger-active;
		}
	}

	.sppb-btn-primary {
		.uk-button-primary;

		&:hover {
			.hook-button-primary-hover;
		}
		&:focus,
		&:active {
			.hook-button-primary-active;
		}
	}

	.sppb-btn-primary-2 {
		.uk-button-primary-2;

		&:hover {
			background-color: desaturate(darken(@global-primary-2-background, 3%), 3%);
			box-shadow: @button-hover-box-shadow fade(@global-primary-2-background, 30%);
		}

		&:focus,
		&:active {
			background-color: darken(@global-primary-2-background, 1%);
			box-shadow: @button-active-box-shadow fade(@global-primary-2-background, 30%);
		}
	}

	.sppb-btn-primary-3 {
		.uk-button-primary-3;

		&:hover {
			background-color: desaturate(darken(@global-primary-3-background, 3%), 3%);
			box-shadow: @button-hover-box-shadow fade(@global-primary-3-background, 30%);
		}

		&:focus,
		&:active {
			background-color: darken(@global-primary-3-background, 1%);
			box-shadow: @button-active-box-shadow fade(@global-primary-3-background, 30%);
		}
	}

	.sppb-btn-primary-4 {
		.uk-button-primary-4;

		&:hover {
			background-color: desaturate(darken(@global-primary-4-background, 3%), 3%);
			box-shadow: @button-hover-box-shadow fade(@global-primary-4-background, 30%);
		}

		&:focus,
		&:active {
			background-color: darken(@global-primary-4-background, 1%);
			box-shadow: @button-active-box-shadow fade(@global-primary-4-background, 30%);
		}
	}

	.sppb-btn-secondary {
		.uk-button-secondary;

		&:hover {
			box-shadow: @button-hover-box-shadow fade(@global-secondary-background, 30%);
		}

		&:focus,
		&:active {
			box-shadow: @button-active-box-shadow fade(@global-secondary-background, 30%);
		}
	}

	.sppb-btn-outline {
		.uk-button-line;

		&:hover {
			color: @button-line-hover-color;
			background: @button-line-hover-background !important;
			border: 2px solid @button-line-hover-border !important;
		}

		&.sppb-btn-round {
			border-radius: 100px;
			padding: 0 30px;
		}

		&.sppb-btn-primary-2 {
			border-color: @global-primary-2-background;
			color: @global-primary-2-background;

			&:hover {
				color: @global-primary-2-color;
				background: @global-primary-2-background !important;
				border: 2px solid darken(@global-primary-2-background, 5%) !important;
			}
		}

		&.sppb-btn-primary-3 {
			border-color: @global-primary-3-background;
			color: @global-primary-3-background;

			&:hover {
				color: @global-primary-3-color;
				background: @global-primary-3-background !important;
				border: 2px solid darken(@global-primary-3-background, 5%) !important;
			}
		}

		&.sppb-btn-primary-4 {
			border-color: @global-primary-4-background;
			color: @global-primary-4-background;

			&:hover {
				color: @global-primary-4-color;
				background: @global-primary-4-background !important;
				border: 2px solid darken(@global-primary-4-background, 5%) !important;
			}
		}

		&.sppb-btn-secondary {
			border-color: @global-secondary-background;
			color: @global-secondary-background;

			&:hover {
				color: @global-contrast-color;
				background: @global-secondary-background !important;
				border: 2px solid darken(@global-secondary-background, 5%) !important;
			}
		}
	}

	.sppb-btn-3d {
		position: relative;
    	top: -6px;
    	transition: all 40ms linear;

		&:active:focus,
		&:focus:hover,
		&:focus {
			-moz-outline-style: none;
			outline: medium none;
		}

		&:focus, 
		&:active {
			top: 2px;
		}

		&.sppb-btn-primary {
	    	box-shadow: 0 0 0 1px lighten(@global-primary-background, 5%) inset, 0 0 0 1px @global-light-1-shadow inset, 0 8px 0 0 darken(@global-primary-background, 12%), 0 8px 8px 1px @global-dark-3-shadow;

	    	&:focus,
	    	&:active {
	    		box-shadow: 0 0 0 1px lighten(@global-primary-background, 5%) inset, 0 0 0 1px @global-light-15-shadow inset, 0 1px 3px 1px @global-dark-2-shadow;
	    	}
		}

		&.sppb-btn-primary-2 {
	    	box-shadow: 0 0 0 1px lighten(@global-primary-2-background, 5%) inset, 0 0 0 1px @global-light-1-shadow inset, 0 8px 0 0 darken(@global-primary-2-background, 12%), 0 8px 8px 1px @global-dark-3-shadow;

	    	&:focus,
	    	&:active {
	    		box-shadow: 0 0 0 1px lighten(@global-primary-2-background, 5%) inset, 0 0 0 1px @global-light-15-shadow inset, 0 1px 3px 1px @global-dark-2-shadow;
	    	}
		}

		&.sppb-btn-primary-3 {
	    	box-shadow: 0 0 0 1px lighten(@global-primary-3-background, 5%) inset, 0 0 0 1px @global-light-1-shadow inset, 0 8px 0 0 darken(@global-primary-3-background, 12%), 0 8px 8px 1px @global-dark-3-shadow;

	    	&:focus,
	    	&:active {
	    		box-shadow: 0 0 0 1px lighten(@global-primary-3-background, 5%) inset, 0 0 0 1px @global-light-15-shadow inset, 0 1px 3px 1px @global-dark-2-shadow;
	    	}
		}

		&.sppb-btn-primary-4 {
	    	box-shadow: 0 0 0 1px lighten(@global-primary-4-background, 5%) inset, 0 0 0 1px @global-light-1-shadow inset, 0 8px 0 0 darken(@global-primary-4-background, 12%), 0 8px 8px 1px @global-dark-3-shadow;

	    	&:focus,
	    	&:active {
	    		box-shadow: 0 0 0 1px lighten(@global-primary-4-background, 5%) inset, 0 0 0 1px @global-light-15-shadow inset, 0 1px 3px 1px @global-dark-2-shadow;
	    	}
		}

		&.sppb-btn-secondary {
	    	box-shadow: 0 0 0 1px lighten(@global-secondary-background, 5%) inset, 0 0 0 1px @global-light-1-shadow inset, 0 8px 0 0 darken(@global-secondary-background, 12%), 0 8px 8px 1px @global-dark-3-shadow;

	    	&:focus,
	    	&:active {
	    		box-shadow: 0 0 0 1px lighten(@global-secondary-background, 5%) inset, 0 0 0 1px @global-light-15-shadow inset, 0 1px 3px 1px @global-dark-2-shadow;
	    	}
		}

		&.sppb-btn-success {
	    	box-shadow: 0 0 0 1px lighten(@global-success-background, 5%) inset, 0 0 0 1px @global-light-1-shadow inset, 0 8px 0 0 darken(@global-success-background, 12%), 0 8px 8px 1px @global-dark-3-shadow;

	    	&:focus,
	    	&:active {
	    		box-shadow: 0 0 0 1px lighten(@global-success-background, 5%) inset, 0 0 0 1px @global-light-15-shadow inset, 0 1px 3px 1px @global-dark-2-shadow;
	    	}
		}

		&.sppb-btn-warning {
	    	box-shadow: 0 0 0 1px lighten(@global-warning-background, 5%) inset, 0 0 0 1px @global-light-1-shadow inset, 0 8px 0 0 darken(@global-warning-background, 12%), 0 8px 8px 1px @global-dark-3-shadow;

	    	&:focus,
	    	&:active {
	    		box-shadow: 0 0 0 1px lighten(@global-warning-background, 5%) inset, 0 0 0 1px @global-light-15-shadow inset, 0 1px 3px 1px @global-dark-2-shadow;
	    	}
		}

		&.sppb-btn-danger {
	    	box-shadow: 0 0 0 1px lighten(@global-danger-background, 5%) inset, 0 0 0 1px @global-light-1-shadow inset, 0 8px 0 0 darken(@global-danger-background, 12%), 0 8px 8px 1px @global-dark-3-shadow;

	    	&:focus,
	    	&:active {
	    		box-shadow: 0 0 0 1px lighten(@global-danger-background, 5%) inset, 0 0 0 1px @global-light-15-shadow inset, 0 1px 3px 1px @global-dark-2-shadow;
	    	}
		}
	}

	.sppb-addon-header {
		&.tm-primary-color > * { color: @global-primary-background; }
		&.tm-primary-2-color > * { color: @global-primary-2-background; }
		&.tm-primary-3-color > * { color: @global-primary-3-background; }
		&.tm-primary-4-color > * { color: @global-primary-4-background; }
		&.tm-light-color > * { color: @global-light-color; }
		&.tm-extra-light-color > * { color: @global-extra-light-background; }
	}
}

.tm-overlay-primary ,
.tm-overlay-secondary {
	&.sppb-section {
		.sppb-addon-title,
		.sppb-addon-content {
			color: @global-contrast-color;
		}
	}
}

.tm-primary-4-background {
	.sppb-btn-outline {
		border-color: @global-primary-4-color;
		color: @global-primary-4-color;
	}
}

.sppb-section {
	&.tm-light {
		background-color: @global-light-background;
	}
	&.tm-extra-light {
		background-color: @global-extra-light-background;
	}
	&.tm-primary-light {
		background-color: @global-primary-light-background;
	}
}

.sp-pagebuilder-column,
.sppb-column {
	&.tm-light > div > div {
		background-color: @global-light-background;
	}
	&.tm-extra-light > div > div {
		background-color: @global-extra-light-background;
	}
	&.tm-primary-light > div > div {
		background-color: @global-primary-light-background;
	}
}

// next / previous

.btn-prev,
.btn-next {
  transition: @global-transition;
  stroke: inherit;
  opacity: .4;
  cursor: pointer;
  display: inline-block;
  position: relative;
  z-index: 10;
  margin-top: 20px;
}
.btn-prev:after,
.btn-next:after {
  content: '';
  display: block;
  height: 100%;
  width: 15px;
  position: absolute;
  top: 0;
}
.btn-prev .utouch-icon,
.btn-next .utouch-icon {
  color: @global-link-hover-color;
  fill: @global-link-hover-color;
  transition: @global-transition;
  width: 36px;
  height: 36px;
}
.btn-prev .tm-icon-hover,
.btn-next .tm-icon-hover {
  opacity: 0;
  position: absolute;
}
.btn-prev:hover,
.btn-next:hover {
  opacity: 1;
}
.btn-prev:hover .tm-icon-hover,
.btn-next:hover .tm-icon-hover {
  opacity: 1;
}
.btn-prev .tm-icon-hover {
  left: 0;
}
.btn-next .tm-icon-hover {
  right: 0;
}
.btn-next:hover {
  margin-left: 5px;
  margin-right: -5px;
}
.btn-prev:hover {
  margin-left: -5px;
  margin-right: 5px;
}

// Opt in Form

.sppb-addon-optin-forms {

	.sppb-addon-title {
		color: @global-heading-color !important;
	}

	form.sppb-optin-form {
		margin: 10px 0;

		input[type="email"] {
			height: 45px;
            color: @form-color;
            border-width: 1px;
            background-color: @form-background;
            border-color: rgba(0,0,0,0);
            box-shadow: 0 0 30px 0 fade(@global-dark-background, 15%);
			
			&:focus {
                    color: @form-focus-color;
                    background-color: @form-focus-background;
                    border-color: @form-focus-border;
                    box-shadow: 5px 0 40px 0 fade(@global-primary-background, 25%);

                    &:-ms-input-placeholder { color: fade(@global-color, 30%) !important; }
                    &::-moz-placeholder { color: fade(@global-color, 30%); }
                    &::-webkit-input-placeholder { color: fade(@global-color, 30%); }
                }
            }

        :-ms-input-placeholder { color: fade(@global-color, 70%) !important; }
        ::-moz-placeholder { color: fade(@global-color, 70%); }
        ::-webkit-input-placeholder { color: fade(@global-color, 70%); }

		.sppb-optin-form-details {
			font-family: @global-italic-font-family;
		}
	}
}




// pricing
.tm-pricing {
	.sppb-pricing-price {
		font-weight: @global-bold-font-weight;
		font-family: @global-heading-font-family;
	}

	.sppb-addon-pricing-table {
		position: relative;
		transition: @global-transition;

		&:hover {
		    margin-bottom: -30px;
		    margin-top: -30px;

		    .sppb-pricing-box {
			    padding: 90px 60px;
			}
		}
	}

	.sppb-pricing-features ul li {
		line-height: 30px;
		color: @global-secondary-background;
	    font-weight: @global-bold-font-weight;
	    font-size: round((@global-font-size*0.8));
	}

	.sppb-pricing-box {
		background-color: @global-background;
		box-shadow: 20px 0 60px 0 @global-dark-1-shadow;
		padding: 60px;
		position: relative;
		border-radius: 10px;
		width: ~"calc(100% - 30px)";
		z-index: 5;
		transition: @global-transition;
	}

	.sppb-pricing-content {
	    position: absolute;
	    width: ~"calc(100% - 30px)";
	    height: ~"calc(100% + 50px)";
	    right: 0;
	    top: 30px;
	    border-radius: @global-border-radius;
	    transition: @global-transition;
	    text-align: center;

	    .sppb-btn {
	    	color: #fff;
	    	background-color: rgba(0,0,0,0) !important;
		    position: absolute;
		    bottom: 20px;
		    text-transform: uppercase;
		    width: 100%;
		    left: 0;
		    box-shadow: none;

		    &:hover {
		    	box-shadow: none !important;
		    }
	    }
	}

	.tm-pricing-pretext {
		margin-bottom: 30px;
		color: @global-color;
	}

	.tm-pricing-posttext {
	    font-size: round((@global-font-size*0.8));
	    color: fade(@global-color, 75%);
	    margin-top: 25px;
	    margin-bottom: 0;
	}

	.pc-success-background {

		.sppb-pricing-content {
			background-color: @global-success-background;
			color: @global-contrast-color;
		}

		.sppb-pricing-price,
		.sppb-pricing-duration,
		.sppb-pricing-title,
		.sppb-pricing-features {
			color: @global-contrast-color;
		}

		.sppb-btn-outline {
			border-color: @global-contrast-color;
			color: @global-contrast-color;

			&:hover {
				color: @global-contrast-color;
			}
		}
	}

	.pc-warning-background {

		.sppb-pricing-content {
			background-color: @global-warning-background;
			color: @global-contrast-color;
		}

		.sppb-pricing-price,
		.sppb-pricing-duration,
		.sppb-pricing-title,
		.sppb-pricing-features {
			color: @global-contrast-color;
		}

		.sppb-btn-outline {
			border-color: @global-contrast-color;
			color: @global-contrast-color;

			&:hover {
				color: @global-contrast-color;
			}
		}
	}

	.pc-danger-background {

		.sppb-pricing-content {
			background-color: @global-danger-background;
			color: @global-contrast-color;
		}

		.sppb-pricing-price,
		.sppb-pricing-duration,
		.sppb-pricing-title,
		.sppb-pricing-features {
			color: @global-contrast-color;
		}

		.sppb-btn-outline {
			border-color: @global-contrast-color;
			color: @global-contrast-color;

			&:hover {
				color: @global-contrast-color;
			}
		}
	}

	&.pc-primary-background {

		.sppb-pricing-content {
			background-color: @panel-box-primary-background;
			color: @panel-box-primary-color;
		}

		.sppb-pricing-price,
		.sppb-pricing-duration,
		.sppb-pricing-title,
		.sppb-pricing-features {
			color: @panel-box-primary-color;
		}

		.sppb-btn-outline {
			border-color: @panel-box-primary-color;
			color: @panel-box-primary-color;

			&:hover {
				border-color: @panel-box-primary-link-color !important;
				background: @panel-box-primary-link-color !important;
				color: @panel-box-primary-color;
			}
		}
	}

	.pc-primary-2-background {

		> div > div {
			background-color: @global-primary-2-background;
		}

		.sppb-pricing-price,
		.sppb-pricing-duration,
		.sppb-pricing-title,
		.sppb-pricing-features {
			color: @global-primary-2-color;
		}

		.sppb-btn-outline {
			border-color: @global-primary-2-color;
			color: @global-primary-2-color;

			&:hover {
				border-color: @panel-box-primary-link-color !important;
				background: @panel-box-primary-link-color !important;
				color: @global-primary-2-color;
			}
		}
	}

	.pc-primary-3-background {

		> div > div {
			background-color: @global-primary-3-background;
		}

		.sppb-pricing-price,
		.sppb-pricing-duration,
		.sppb-pricing-title,
		.sppb-pricing-features {
			color: @global-primary-3-color;
		}

		.sppb-btn-outline {
			border-color: @global-primary-3-color;
			color: @global-primary-3-color;

			&:hover {
				border-color: @panel-box-primary-link-color !important;
				background: @panel-box-primary-link-color !important;
				color: @global-primary-3-color;
			}
		}
	}

	.pc-primary-4-background {

		> div > div {
			background-color: @global-primary-4-background;
		}

		.sppb-pricing-price,
		.sppb-pricing-duration,
		.sppb-pricing-title,
		.sppb-pricing-features {
			color: @global-primary-4-color;
		}

		.sppb-btn-outline {
			border-color: @global-primary-4-color;
			color: @global-primary-4-color;

			&:hover {
				border-color: @panel-box-primary-link-color !important;
				background: @panel-box-primary-link-color !important;
				color: @global-primary-4-color;
			}
		}
	}

	.sppb-pricing-price,
	.sppb-pricing-duration {
		color: @global-primary-background;
	}
}

// 
// Addons
// 

// Accordions
.sppb-addon-accordion {

	.sppb-panel {
		border: none;
		margin-bottom: 15px;

		.sppb-panel-heading {
			background-color: @global-primary-light-background;
			border-radius: @global-border-radius / 2;
			color: @global-color;
			transition: @global-transition;
			padding: 12px 20px;

			.sppb-panel-title {
				font-size: @base-h5-font-size;
				line-height: @base-h5-line-height;
				font-family: @global-heading-font-family;
				font-weight: @global-heading-font-weight;
				margin-left: 45px;
			}

			&.active {
				color: @global-color;
				box-shadow: 0 0 0 2px @global-primary-background, 5px 0 20px fade(@global-primary-background, 30%);
				
				.sppb-toggle-direction {
					transform: translateY(0%);

					i:before {
						opacity: 0;
						transform: rotate(90deg);
					}

					i:after {
						transform: rotate(90deg);
					}
				}
			}
		}

		.sppb-panel-body {
			border: none;
		}

		.sppb-toggle-direction {
			top: 15px;
			left: 20px;
			transform: translateY(0%);

			i {
				font-style: normal;
				font-family: @global-font-icon;
				width: 26px;
				height: 26px;
				border-radius: @global-border-radius;
				text-align:center;
				position: relative;

				&:before,
				&:after {
					content: "";
					position: absolute;
					background-color: @global-primary-background;
					transition: @global-transition;
					transition-delay: 0.4s;
				}

				&:before {
					content: "";
					height: 1px;
					width: 21px;
					top: 11px;
					left: 5px;
				}

				&:after {
					content: "";
					height: 21px;
					width: 1px;
					top: 2px;
					left: 15px;
					opacity: 1;
					transform: rotate(0deg);
				}
			}
		}
	
		&.sppb-panel-primary {
			border-color: fade(@panel-box-primary-background, 15%);

			> .sppb-panel-heading {
				color: @panel-box-primary-background;
				background: fade(@panel-box-primary-background, 3%);

				.sppb-toggle-direction i {
					&:before,
					&:after {
						background-color: @panel-box-primary-background;
					}
				}

				&.active {
					background-color: @panel-box-primary-background;
					color: @panel-box-primary-color;
					border-color: darken(@panel-box-primary-background, 3%);
					box-shadow: 0 0 0 1px @panel-box-primary-background;

					.sppb-toggle-direction i {
						&:before,
						&:after {
							background-color: @global-contrast-color;
						}
					}
				}
			}
		}

		&.sppb-panel-info {
			border-color: fade(@global-primary-3-background, 15%);

			> .sppb-panel-heading {
				color: @global-primary-3-background;
				background: fade(@global-primary-3-background, 3%);

				.sppb-toggle-direction i {
					&:before,
					&:after {
						background-color: @global-primary-3-background;
					}
				}

				&.active {
					background-color: @global-primary-3-background;
					color: @global-primary-3-color;
					border-color: darken(@global-primary-3-background, 3%);
					box-shadow: 0 0 0 1px @global-primary-3-background;

					.sppb-toggle-direction i {
						&:before,
						&:after {
							background-color: @global-contrast-color;
						}
					}
				}
			}
		}

		&.sppb-panel-success {
			border-color: fade(@global-success-background, 15%);

			> .sppb-panel-heading {
				color: @global-success-background;
				background: fade(@global-success-background, 3%);

				.sppb-toggle-direction i {
					&:before,
					&:after {
						background-color: @global-success-background;
					}
				}

				&.active {
					background-color: @global-success-background;
					color: @global-contrast-color;
					border-color: darken(@global-success-background, 3%);
					box-shadow: 0 0 0 1px @global-success-background;

					.sppb-toggle-direction i {
						&:before,
						&:after {
							background-color: @global-contrast-color;
						}
					}
				}
			}
		}

		&.sppb-panel-warning {
			border-color: fade(@global-warning-background, 15%);

			> .sppb-panel-heading {
				color: @global-warning-background;
				background: fade(@global-warning-background, 3%);

				.sppb-toggle-direction i {
					&:before,
					&:after {
						background-color: @global-warning-background;
					}
				}

				&.active {
					background-color: @global-warning-background;
					color: @global-contrast-color;
					border-color: darken(@global-warning-background, 3%);
					box-shadow: 0 0 0 1px @global-warning-background;

					.sppb-toggle-direction i {
						&:before,
						&:after {
							background-color: @global-contrast-color;
						}
					}
				}
			}
		}

		&.sppb-panel-danger {
			border-color: fade(@global-danger-background, 15%);

			> .sppb-panel-heading {
				color: @global-danger-background;
				background: fade(@global-danger-background, 3%);

				.sppb-toggle-direction i {
					&:before,
					&:after {
						background-color: @global-danger-background;
					}
				}

				&.active {
					background-color: @global-danger-background;
					color: @global-contrast-color;
					border-color: darken(@global-danger-background, 3%);
					box-shadow: 0 0 0 1px @global-danger-background;

					.sppb-toggle-direction i {
						&:before,
						&:after {
							background-color: @global-contrast-color;
						}
					}
				}
			}
		}
	}
	
	.sppb-panel-body {
		padding: 25px;
	}
}

// Alerts
.sppb-addon-alert {

	.sppb-alert {
		padding: 20px;
		border: none;

		h1,h2,h3,h4,h5,h6 {
			color: inherit;
			margin: 10px 0;
		}
	}

	.sppb-alert-info {
		color: @global-primary-3-background;
		background-color: fade(@global-primary-3-background, 3%);
		box-shadow: inset 0 0 0 1px fade(@global-primary-3-background, 20%), 10px 0 10px fade(@global-primary-3-background, 7%);
	}

	.sppb-alert-warning {
		color: @global-warning-background;
		background-color: fade(@global-warning-background, 3%);
		box-shadow: inset 0 0 0 1px fade(@global-warning-background, 20%), 10px 0 10px fade(@global-warning-background, 7%);
	}

	.sppb-alert-danger {
		color: @global-danger-background;
		background-color: fade(@global-danger-background, 3%);
		box-shadow: inset 0 0 0 1px fade(@global-danger-background, 20%), 10px 0 10px fade(@global-danger-background, 7%);
	}

	.sppb-alert-primary {
		color: @global-primary-background;
		background-color: fade(@global-primary-background, 3%);
		box-shadow: inset 0 0 0 1px fade(@global-primary-background, 20%), 10px 0 10px fade(@global-primary-background, 7%);
	}

	.sppb-alert-success {
		color: @global-success-background;
		background-color: fade(@global-success-background, 3%);
		box-shadow: inset 0 0 0 1px fade(@global-success-background, 20%), 10px 0 10px fade(@global-success-background, 7%);
	}

	.sppb-alert-light {
		color: @global-color;
		background-color: @global-extra-light-background;
		box-shadow: inset 0 0 0 1px fade(@global-color, 10%), 10px 0 10px fade(@global-color, 7%);
	}

	.sppb-alert-dark {
		color: @global-contrast-color;
		background-color: @global-secondary-background;
		box-shadow: inset 0 0 0 1px fade(@global-secondary-background, 20%), 10px 0 10px fade(@global-secondary-background, 7%);
	}
}

// Gallery 

.sppb-addon-gallery {
	.sppb-gallery li {
		width: 25%;

		a {
			overflow: hidden;
			position: relative;

			&:before {
				content: '';
				position: absolute;
				left: 0;
				top: 0;
				opacity: 0;
				height: 100%;
				width: 100%;
				transform: scale(.8);
				transition: .5s;
				z-index: 1;
				background-color: fade(@global-primary-background, 80%);
			}

			&:after {
				content: '\f1e2';
				position: absolute;
				font-family: @global-utouch-icon;
				left: 0;
				width: 65px;
				top: 0;
				right: 0;
				bottom: 0;
				margin: auto;
				font-size: 60px;
				color: @global-contrast-color;
				height: 60px;
				line-height: 1;
				transform: scale(0);
				transition: .5s;
				z-index: 1;
			}

			img {
				width: 100% !important;
				transition: 1s;
				transform: scale(1) rotate(0deg);
			}

			&:hover{
				&:before {
					transform: scale(1);
					opacity: 0.75;
				}

				&:after {
					transform: scale(1);
				}

				img {
					transform: scale(1.08);
				}
			}
		}
	}
}

// Image content
.sppb-addon-image-content {
	.sppb-image-holder {
		border-radius: @global-border-radius;
	}

	&.uk-panel-box {
		background-color: inherit;
		color: inherit;

		.sppb-image-content-title {
			color: inherit;
		}
	}

	&.alignment-right .sppb-image-holder {
		right: 0;
	}

	.uk-panel-teaser {
		margin-bottom: @panel-box-padding;
	}

	&.alignment-top,
	&.alignment-bottom {
		box-shadow: none !important;

		.sppb-container {
			margin: -@panel-box-padding;
			padding: 0;
			width: auto;
		}

		.sp-pagebuilder-row,
		.sppb-row {
			margin: 0;
		}
	}

	&.alignment-bottom {
		padding-bottom: 0 !important;
	}

	.sppb-container + .uk-panel-teaser {
		margin-top: @panel-box-padding;
		margin-bottom: 0;
	}
}

// Overlay
.sppb-addon-image-overlay {
	background-color: @overlay-panel-background;
}

// Clients
.sppb-addon-clients {
	.sppb-img-responsive {
		transition: @global-transition;
	}

	a:hover .sppb-img-responsive {
		-webkit-filter: invert(1);
    			filter: invert(1);
	}
}

// Feature box

.sppb-addon-feature {
	.sppb-media {
		overflow: visible;
	
		.pull-left {
			margin-right: 30px;
		}
		.pull-right {
			margin-left: 30px;
		}

		&.tm-icon-shadow {
			.pull-left,
			.pull-right {
				.sppb-img-container {
					background-color: @global-background;
					padding: 25px;
					border-radius: 50%;
				}
			}

			> .pull-right .sppb-img-container { 
				box-shadow: 20px 0 60px 0 @global-dark-1-shadow; 
			}

			> .pull-left .sppb-img-container { 
				box-shadow: -20px 0 60px 0 @global-dark-1-shadow;
			}
		}
	}
}

// Person
.sppb-addon-person {
	.tm-panel-card;

	.sppb-addon-content {
		padding: 20px;

		.sppb-person-information > .sppb-person-name {
			.uk-panel-title;
			font-weight: @global-heading-font-weight;
			font-family: @global-heading-font-family;
			margin-bottom: 5px;
			font-size: 24px;
		}

		.sppb-person-information > .sppb-person-designation {    
			padding-bottom: 20px;
			margin: 0;
			font-family: @global-heading-font-family;
			color: @global-primary-4-background;
			display: inline-block;
			clear: both;
			padding: 5px 0 0;
			font-size: 17px;
			text-transform: none;
		}
	}

	.sppb-person-social > li,
	.sppb-person-social > li {
		margin: 0;
	}

	.sppb-person-image {
		position: relative;
		margin: 0;
		background-color: @global-primary-light-background;
		width: 100%;
		border-radius: 100%;
	}

	.sppb-person-social-icons {
		background-color: fade(@panel-box-primary-background, 90%);
		margin-top: -45px;
		border-top: 1px solid @global-dark-075-shadow;
		position: absolute;
		opacity: 1;
		bottom: 0;
		padding: 5px 10px;
		border-radius: 0 @global-border-radius 0 0;
		box-shadow: inset 0 1px 0 @global-light-15-shadow;
		transition: @global-transition;

		.sppb-person-social li a {
			.uk-icon-button;
			color: @panel-box-primary-color;
			cursor: pointer;
		}
	}

	.sppb-person-email {
		width: 40px;
		height: 40px;
		border-radius: @global-border-radius;
		position: relative;
		display: inline-block;
		float: right;
		margin: -40px -10px 0 0;
		text-align: center;
		line-height: 40px;
		z-index: 1;
		text-decoration: none;
		cursor: pointer;
		background-color: @global-background;
		transition: @global-transition;
		box-shadow: inset 0 0 0 1px @global-primary-background;

		> * {
			cursor: pointer;
			transition: @global-transition;
		}

		&:before {
			cursor: pointer;
			content: "\f156";
			font-family: @global-utouch-icon;
			color: @global-primary-background;
			font-size: 17px;
			display: block;
		}

		&:after {
			content: "";
			width: 100%;
			height: 100%;
			border-radius: @global-border-radius; 
			transform: scale(1.3);
			opacity: 0;
			position: absolute;
			background-color: @panel-box-primary-background;
			box-sizing: content-box;
			z-index: -1;
			left: 0;
			top: 0;
			transition: transform 0.4s, opacity 0.5s;
		}

		&:hover {
			box-shadow: inset 0 0 0 1px @global-secondary-color;

			&:before {
				color: @panel-box-primary-color;
			}

			&:after {
				opacity: 1;
				transform: scale(1);
			}
		}
	}

	.sppb-person-information + .sppb-person-social-icons,
	.sppb-person-introtext + .sppb-person-social-icons {
		position: relative;
		margin: 10px 0 0 -5px;
		background: rgba(0,0,0,0);
		border-top: 0;
		padding: 0;

		.sppb-person-social li a {
			color: @global-primary-background;
		}
	}
}

// Testimonial
.sppb-addon-testimonial {
	position: relative;

	.sppb-addon-content .fa {
		position: absolute;
		left: -20px;
		top: -20px;
		z-index: -1;
		font-family: @global-utouch-icon;

		&:before {
			content: @ut-icon-var-quote-left;
		}
	}

	.sppb-addon-content {
		position: relative;
		z-index: 0;
	}

	&.sppb-text-right {
		.sppb-addon-testimonial-client {
			text-align: right;
		}
	}

	.sppb-addon-testimonial-client strong {
		font-size: @base-h6-font-size;
		line-height: @base-h6-line-height;
		color: @global-primary-background;
	}

	.sppb-addon-testimonial-client-url {
		opacity: 0.5;
	}

	.sppb-addon-testimonial-avatar {
		box-shadow: 10px 0 30px 0 fade(@global-primary-4-background, 40%);
		margin-right: 20px;
	}

	.sppb-addon-testimonial-footer {
		margin: 0 0 20px 0;
	
		a {
			color: inherit;
		}
	}
}

// Social Share

.sppb-addon-social-share {
	&.sppb-social-share-style-custom,
	&.sppb-social-share-style-solid {
		ul li a i {
			font-size: 18px;
			width: 30px;
			vertical-align: middle;
		}
	}

	&.sppb-social-share-style-simple ul {
		margin: -7px;

		li {
			margin: 7px;

			a i {
				min-width: 30px;
				min-height: 30px;
				line-height: 30px;
				vertical-align: middle;
				text-align: center;
			}
		}
	}
}

// Carousel

.sppb-carousel {
	.sppb-item.sppb-item-has-bg .sppb-carousel-item-inner {
		padding: 30px 60px;
	}

	.sppb-carousel-arrow {
		text-shadow: none;
		color: @global-color;

		.fa {
			font-family: @global-utouch-icon;
			font-size: 40px;
	
			&-chevron-left {
				&:before {
					content: "\f170";
				}
			}

			&-chevron-right {
				&:before {
					content: "\f16d";
				}
			}
		}
	}

	.sppb-carousel-indicators {
		margin-bottom: 0;
		bottom: 30px;

		li {
			border-color: @global-color;
			width: 10px;
			height: 10px;
			border-radius: 0;
			margin: 0 5px 0 0;

			&.active {
				background-color: @global-color;
			}
		}

		&.uk-contrast {
			li {
				border-color: @global-contrast-color;

				&.active {
					background-color: @global-contrast-color;
				}
			}
		}

		&.sppb-text-center {
			bottom: 15px;
		}

		&.sppb-text-left {
			left: 60px;
			width: 90%;
			text-align: left;
			margin-left: 0;
		}

		&.sppb-text-right {
			width: 100%;
			text-align: right;
			left: 0;
			margin-left: 0;
			padding-right: 60px;
		}
	}
}

// Carousel Pro

.sppb-carousel-pro {
	margin-bottom: 80px;

	.sppb-carousel-inner {
		overflow: visible;
	}

	.tm-sup-title {
		opacity: 0.7;
	}

	.sppb-item {
		.tm-content {
			.uk-flex;
			.uk-flex-middle;
		}

		.sppb-carousel-item-inner > div {
			.uk-container;
			.uk-container-center;
		}

		&.sppb-item-has-bg {
			padding: 80px 0;
		}
	}

	.tm-vertical-thumb {
		margin-bottom: -200px;
	}

	.sppb-carousel-indicators {
		bottom: -70px !important;
		z-index: 999;

		li {
			border-radius: 50%;
			width: 60px;
			height: 60px;
			position: relative;
			border: 0;
			background: rgba(0,0,0,0);

			&.active {
				background: rgba(0,0,0,0);
				top: 20px;
			}

			&:before {
				content: '';
				display: block;
				position: absolute;
				width: 4px;
				height: 0;
				border-radius: 0 0 5px 5px;
				top: -20px;
				left: 1px;
				opacity: 0;
				transition: @global-transition;
			}

			&.active {
				&:before {
					opacity: 1;
					height: 60px;
				}
			}

			&:after {
				content: "";
				width: 6px;
				height: 6px;
				border-radius: 100%;
				background-color: @global-light-color;
				position: absolute;
				bottom: 0;
				left: 0;
			}

			&.active {
				&:before {
					opacity: 1;
					height: 60px;
				}
			}
		}
	}
}

// Text Block

.sppb-addon-text-block {
	&.tm-italic > * {
		font-family: @global-italic-font-family;
	}

	&.tm-primary-color > * {
		color: @global-primary-background;
	}

	&.tm-primary-2-color > * {
		color: @global-primary-2-background;
	}

	&.tm-primary-3-color > * {
		color: @global-primary-3-background;
	}

	&.tm-primary-4-color > * {
		color: @global-primary-4-background;
	}
}

// testimonial pro
.sppb-testimonial-pro {
	padding-bottom: 80px;

	.sppb-testimonial-message {
		font-size: @base-h5-font-size;
		line-height: @base-h5-line-height;
		font-weight: @global-bold-font-weight;
		margin-bottom: 50px;
	}

	.sppb-carousel-inner {
		margin-top: -80px;
		padding: 0 50px;
	}

	.sppb-carousel-control {
		position: absolute;
		border: none;
		transition: @global-transition;
		margin: 20px 0 0 0;
		width: 36px;
		height: 36px;
		top: 50%;
		transform: translate(0, -50%);

		&:hover {
			background-color: rgba(0,0,0,0);
		}

		&.btn-next {
			right: -10%;

			&:hover {
				margin-left: 5px;
				margin-right: -5px;
			}
		}

		&.btn-prev {
			left: -10%;

			&:hover {
				margin-left: -5px;
				margin-right: 5px;
			}
		}
	}

	.sppb-addon-testimonial-pro-header {
		padding: 30px 0;

		.sppb-avatar-circle {
			border-radius: 100%;
			box-shadow: 10px 0 30px 0 @global-dark-2-shadow;
		}

		.sppb-avatar-round {
			border-radius: 10px;
			box-shadow: 0 0 0 4px @global-dark-05-shadow, 0 0 0 5px @global-light-1-shadow;
		}

		.sppb-avatar-sqaure {
			border-radius: 0;
			box-shadow: 2px 2px 0 @global-dark-1-shadow;
		}
	}

	.sppb-addon-testimonial-pro-footer {
		strong {
			font-family: @global-heading-font-family;
			color: @global-primary-background;
			font-size: @base-h5-font-size;
		}

		.tm-position {
			color: @global-secondary-background;
			font-size: @base-h5-font-size;
		}
	}

	.sppb-carousel-indicators {
		width: 100%;
		left: 0;
		margin-left: 0;

		li {
			border: none;
			border-radius: 10px;
			margin: 0 2px;
			background-color: @global-light-color;
			transition: @global-transition;

			&.active {
				border: none;
				background-color: @global-primary-background;
			}
		}
	}

	&.uk-contrast {
		.sppb-carousel-indicators li {
			background-color: @global-contrast-color;
		}

		.sppb-addon-testimonial-pro-footer .tm-position {
			color: @global-light-color;
		}
	}

	&.sppb-text-right,
	&.uk-text-right {
		padding-bottom: 60px;

		.sppb-carousel-indicators {
			.uk-flex;
			.uk-flex-right;
		}

		.sppb-carousel-indicators li {
			margin-left: 5px;
		}

		.sppb-addon-testimonial-pro-header {
			margin-right: 10px;
			padding-bottom: 15px;
		}
	}

	&.sppb-text-left,
	&.uk-text-left {
		padding-bottom: 60px;

		.sppb-carousel-indicators {
			.uk-flex;
		}

		.sppb-carousel-indicators li {
			margin-right: 5px;
		}

		.sppb-addon-testimonial-pro-header {
			margin-left: 10px;
			padding-bottom: 15px;
		}
	}
}

.tm-boxed-container .sppb-testimonial-pro {
	.sppb-carousel-control {
		&.btn-next {
			right: 0;
		}

		&.btn-prev {
			left: 0;
		}
	}
}

.tm-primary-background .sppb-testimonial-pro {
	.sppb-addon-testimonial-pro-footer .tm-position {
		color: @panel-box-primary-link-color;
	}

	.sppb-carousel-indicators li {
		background-color: @panel-box-primary-color;
	}
}

// Block numbers
.sppb-media-heading {
	color: @global-heading-color;
}

.sppb-blocknumber-number {
	background-color: @panel-box-primary-background;
	color: @panel-box-primary-color;
	text-shadow: 1px 1px 0 @global-dark-15-shadow;
	font-size: @base-h3-font-size;
	font-family: @global-heading-font-family;
	font-weight: @global-thin-font-weight;
	box-shadow: inset 0 0 0 1px @global-dark-05-shadow;
}

// Block Number 
.sppb-addon-blocknumber {
	&.tm-primary-2-color {
		.sppb-media-body {
			color: @global-color;
		}

		.sppb-blocknumber-number {
			color: @global-primary-2-color;
			background-color: @global-primary-2-background;
		}
		
		.sppb-media-heading {
			color: @global-primary-2-background;
		}
	}
	&.tm-primary-3-color {
		.sppb-media-body {
			color: @global-color;
		}

		.sppb-blocknumber-number {
			color: @global-primary-3-color;
			background-color: @global-primary-3-background;
		}

		.sppb-media-heading {
			color: @global-primary-3-background;
		}
	}
	&.tm-primary-4-color {
		.sppb-media-body {
			color: @global-color;
		}

		.sppb-blocknumber-number {
			color: @global-primary-4-color;
			background-color: @global-primary-4-background;
		}

		.sppb-media-heading {
			color: @global-primary-4-background;
		}
	}
}


// Animated counter
.sppb-addon-animated-number {
	.sppb-addon-content {
		.sppb-animated-number {
			color: @global-primary-background;
			font-weight: @global-bold-font-weight;
			font-family: @global-heading-font-family;
		}

		.sppb-animated-number-title {
			margin-top: 20px;
			font-weight: @global-bold-font-weight;
		}
	}

	&.tm-style-default {
		.sppb-addon-content {
			.sppb-animated-number-title {
				margin-top: 15px;
				background-color: @global-primary-2-background;
				color: @global-primary-2-color;
				padding: 7px;
				display: inline-block;
			}
		}
	}

	&.tm-style-modern {
		 .sppb-addon-content {
			.sppb-animated-number-title {
				margin-top: 15px;
				background-color: @global-primary-3-background;
				color: @global-primary-3-color;
				padding: 7px;
				display: inline-block;
				border-radius: @global-border-radius;
			}
		}
	}

	&.tm-style-simple {
		.sppb-addon-content {
			.sppb-animated-number-title {
				margin-top: 15px;
				display: inline-block;
			}
		}
	}
}

.sppb-addon-image-overlay-icon {
	font-family: @global-heading-font-family;
	font-weight: @global-thin-font-weight;
	font-size: 35px;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

// Progress bar

.sppb-progress-label {
	font-size: @global-font-size;
}

.sppb-progress-bar {
	background-color: @global-primary-background;

	&-primary-2 {
		background-color: @global-primary-2-background;
	}
	&-primary-3 {
		background-color: @global-primary-3-background;
	}
	&-primary-4 {
		background-color: @global-primary-4-background;
	}
	&-secondary {
		background-color: @global-secondary-background;
	}
	&-success {
		background-color: @global-success-background;
	}
	&-warning {
		background-color: @global-warning-background;
	}
	&-danger {
		background-color: @global-danger-background;
	}
}

// Flip box

.sppb-flipbox-panel .flip-box {
	border-radius: @global-border-radius;
}

.sppb-flipbox-back.flip-box:before {
	background-color: @global-primary-background;
}

.flip-box-inner {
	h1,h2,h3,h4,h5,h6 {
		margin-bottom: 5px;
	}
}

.sppb-addon-sppb-flibox {

	.threeD-flip-front,
	.threeD-flip-back,
	.sppb-flipbox-back.flip-box:before, 
	.sppb-flipbox-front.flip-box:before, 
	.threeD-flip-back:before, 
	.threeD-flip-front:before,
	.threeD-flip-front:before {
		border-radius: @global-border-radius;
	}

	.threeD-flip-back:before,
	.sppb-flipbox-back.flip-box:before {
		background-color: @global-secondary-background;
	}

	.sppb-flipbox-front.flip-box:before, 
	.threeD-flip-front:before {
		background-color: fade(@global-secondary-background, 30%);
	}

	&.tm-primary-overlay {

		&:before {
			display: none;
		}
		
		.sppb-flipbox-front.flip-box:before {
			position: absolute;
			content: "";
			width: 100%;
			height: 100%;
			left: 0;
			top: 0;
			background-color: fade(@global-primary-background, 60%) !important;
			color: @global-contrast-color !important;
			border-color: @global-dark-075-shadow !important;
		}
	}
}


// Forms
.sppb-ajaxt-contact-form {
	&:extend(.uk-form all);
	margin-bottom: 0;
}

.sppb-form-control, 
.sppb-form-group .sppb-form-control {
	border-radius: @form-input-border-radius;
	border-width: @form-border-width;
}

.sppb-addon-ajax-contact {
	.sppb-addon-title {
		color: @global-primary-background;
	}
}

.sppb-ajax-contact-content {
	padding-top: 20px;
}

// Dropcap

.sppb-dropcap .sppb-addon-content:first-letter {
	padding-top: 8px;
}

// Tabs 

.sppb-nav > li > a {
	font-family: @global-heading-font-family;
	font-weight: @global-heading-font-weight;
	font-size: round((@global-font-size*0.95));
	padding: 12px 20px;
}

.sppb-nav-pills > li > a {
	border-radius: 50px;
	cursor: pointer;
	min-width: 60px;
	height: 60px;
	line-height: 60px;
	padding: 0px 2px;
	margin-right: 40px;
	text-transform: uppercase;
	text-align: center;
	font-size: 30px;
	font-weight: @global-bold-font-weight;
	color: @panel-box-primary-color;
	background-color: fade(@global-primary-background, 30%);
	transition: @global-transition;

	> i {
		font-size: @global-font-size;
	}

	&:focus, 
	&:hover {
		background-color: fade(@global-primary-background, 30%);		
	}
}

.tm-title-tabs {
    text-transform: uppercase;
    letter-spacing: 3px;
    font-size: 24px;
    margin-bottom: 35px;
}

.sppb-nav-pills + .sppb-tab-content {
	margin-top: 50px;

	.tm-list-icons {
		margin-bottom: 0;
	}

	.uk-panel-box {
		padding: 60px;
	}
}

.sppb-nav-modern-content,
.sppb-nav-tabs-content {
	color: @global-color;
	padding: 30px;

	> p {
		margin-bottom: 0;
	}
}

.sppb-addon-content > p {
	margin-bottom: 0;
}

.sppb-nav-lines {
	border-bottom-color: @global-light-background;

	> li > a {
		transition: @global-transition-color;
		padding: 15px 20px;
	}
}

.tm-primary-tabs {
	.sppb-nav-tabs > li.active > a {
		box-shadow: inset 0 2px 0 @global-primary-background;
		border-top-color: @global-primary-background;
	}

	.sppb-nav-pills > li.active {
		> a,
		> a:focus, 
		> a:hover {
			background-color: @panel-box-primary-background;
			color: @panel-box-primary-color;
			box-shadow: 10px 0 10px 0 fade(@global-primary-background, 20%);
		}
	}

	.sppb-nav-lines > li.active > a {
		color: @global-primary-background;
		border-bottom-color: @global-primary-background;
	}
}

.tm-primary-2-tabs {
	.sppb-nav-tabs > li.active > a {
		box-shadow: inset 0 2px 0 @global-primary-2-background;
		border-top-color: @global-primary-2-background;
	}

	.sppb-nav-pills > li.active {
		> a,
		> a:focus, 
		> a:hover {
			background-color: @global-primary-2-background;
			color: @global-primary-2-color;
			box-shadow: 0 10px 20px @global-dark-2-shadow;
		}
	}

	.sppb-nav-lines > li.active > a {
		color: @global-primary-2-background;
		border-bottom-color: @global-primary-2-background;
	}
}

.tm-primary-3-tabs {
	.sppb-nav-tabs > li.active > a {
		box-shadow: inset 0 2px 0 @global-primary-3-background;
		border-top-color: @global-primary-3-background;
	}

	.sppb-nav-pills > li.active {
		> a,
		> a:focus, 
		> a:hover {
			background-color: @global-primary-3-background;
			color: @global-primary-3-color;
			box-shadow: 0 10px 20px @global-dark-2-shadow;
		}
	}

	.sppb-nav-lines > li.active > a {
		color: @global-primary-3-background;
		border-bottom-color: @global-primary-3-background;
	}
}

.tm-primary-4-tabs {
	.sppb-nav-tabs > li.active > a {
		box-shadow: inset 0 2px 0 @global-primary-4-background;
		border-top-color: @global-primary-4-background;
	}

	.sppb-nav-pills > li.active {
		> a,
		> a:focus, 
		> a:hover {
			background-color: @global-primary-4-background;
			color: @global-primary-4-color;
			box-shadow: 0 10px 20px @global-dark-2-shadow;
		}
	}

	.sppb-nav-lines > li.active > a {
		color: @global-primary-4-background;
		border-bottom-color: @global-primary-4-background;
	}
}

.tm-secondary-tabs {
	.sppb-nav-tabs > li.active > a {
		box-shadow: inset 0 2px 0 @global-secondary-background;
		border-top-color: @global-secondary-background;
	}

	.sppb-nav-pills > li.active {
		> a,
		> a:focus, 
		> a:hover {
			background-color: @global-secondary-background;
			color: @global-secondary-color;
			box-shadow: 0 10px 20px @global-dark-2-shadow;
		}
	}

	.sppb-nav-lines > li.active > a {
		color: @global-secondary-background;
		border-bottom-color: @global-secondary-background;
	}
}

// 
// Widgetkit
// 

// popover 

.tm-popover .uk-position-relative.uk-display-inline-block {
	box-shadow: 0px 30px 50px @global-dark-2-shadow;
}

a.wk-popover-toggle.uk-icon-button {
	background-color: @global-background;
	border-radius: 50%;
	color: @global-primary-background;
	width: 10px;
	height: 10px;
	box-shadow: 0 5px 10px @global-dark-075-shadow, 0 0 0 5px @global-primary-background;

	&.uk-icon-plus:before {
		content: "";
	}

	&:after {
		content: "";
		position: absolute;
		width: 20px;
		height: 20px;
		border-radius: 50%;
		border: 2px solid @global-primary-background;
		left: -5px;
		top: 6px;
		opacity: 0;
		animation: pulsate 2.5s cubic-bezier(0.25,0.1,0.25,1) infinite;
	}
}

.tm-popover .uk-slideset .uk-panel-box,
.uk-dropdown-blank .uk-panel-box {
	h1,h2,h3,h4,h5,h6 { 
		color: @global-color !important;
	}
}

.uk-open > .uk-dropdown-blank {
	box-shadow: 0 20px 50px @global-dark-2-shadow;
}

// 
// Smart Slider 3
// 

#tm-container .n2-ss-slider {
	.tm-heading > [class^="n2-font-"] > * {
		font-family: @global-heading-font-family;
	}

	.tm-italic > .n2-ow > [class^="n2-font-"] {
		font-family: @global-italic-font-family;
	}

	.tm-content > .n2-ow > *,
	.n2-ss-button-container [class^="n2-style-"] {
		transition: @global-transition;

		> * {
			font-family: @global-body-font-family;
		}
	}

	.nextend-arrow-next {
		border-radius: 100px 0 0 100px;
	}
}

.nextend-indicator-track {
	background-color: @global-primary-background !important;
}

// 
// Responsiveness
//

@media (max-width: @breakpoint-small-max) {

	body.uk-container {
		padding: 0;
	}

	.tm-toolbar {

		.uk-subnav > * {
			padding-left: 10px; 
		}
	}

	.tm-quote {
		line-height: 35px;
	}

	.uk-panel-space {
		padding: 20px;
	}

}

// Only Tablets (Landscape)

@media (min-width: @breakpoint-medium) and (max-width: @breakpoint-large) {

	.uk-navbar-nav > li > a { padding: 0 20px; }

}

// Only tablets (Portrait)

@media (min-width: @breakpoint-medium) and (max-width: @breakpoint-medium-max) {

	.uk-navbar-nav > li > a { padding: 0 20px; }

}

// All Phones

@media (max-width: @breakpoint-small-max) {

	.uk-panel-box,
	.tm-block {
		 padding: 30px;
	}

	.tm-toolbar {
		.uk-float-right > div {
			margin-left: 10px;
		}

		.uk-float-left > div {
			margin-right: 10px;
		}

		.uk-container {
			padding:  0 20px;
		}
	}

	.tm-padding-top-remove-small { padding-top: 0 !important; }
	.tm-margin-bottom-small { margin-bottom: 40px !important; }

	.uk-nav-offcanvas .uk-nav-sub li {
		line-height: 32px;
	}
}

// Phones portrait

@media (max-width: @breakpoint-mini-max) {

	.tm-article-content p {
		clear: both;
	}
}

@media (max-width: @breakpoint-medium) {

	.sppb-carousel-pro .tm-vertical-thumb {
		margin-bottom: 0;
	}

	.tm-coming-soon-title {
		font-size: 30px;
		line-height: 36px;
	}

	.tm-coming-soon-subtitle {
		font-size: 24px;
		line-height: 32px;
		margin: 0;
		padding: 0;
	}

	.tm-headerbar-container .tm-headerbar {

		padding: 0;

		.uk-grid > div:before {
			display: none;
		}
	}

	.tm-toolbar {
		> .uk-float-right > div {
			margin-left: 10px;
		}

		> .uk-float-left > div {
			margin-right: 10px;
		}
	}

	.uk-navbar-nav > li > a {
		padding: 0 20px;
	}

	.tm-headerbar > div {
		margin-left: 0;
	}

	.tm-header-layout .tm-header { 
		padding: 15px 20px;

		.uk-container {
			padding: 0 20px;
		}
	}

	.tm-header-transparent {
		width: 100%;
	}

	.tm-headerbar {
		max-width: 100%;
		padding-right: 0;

		> div {
			padding: 30px;
			margin: 0;
		}
	}

	.tm-navbar .tm-focus-button {
		padding: 0 20px;
	}

	.tm-highlight-block {
		width: 100%;
		border: 0 !important;
		margin: 10px 0;
	}

	.sppb-addon-clients .sppb-img-responsive {
		margin-bottom: 20px;
	}

	.tm-padding-sides { padding: 0; }
}

@media (min-width: @breakpoint-small-max) {

	// navbar height
	.tm-navbar-container {
		box-sizing: border-box;
		min-height: @navbar-nav-height;
	}
}

@media (max-width: @breakpoint-small-max) {
	
	// Hides search subtitle on phone landscape and smaller
	.tm-search-subtitle { display: none; }

}

@media (min-width: @breakpoint-medium) {

	.tm-header-default,
	.tm-header-dark,
	.tm-header-light,
	.tm-header-right {
		.tm-header {
			min-height: @navbar-nav-height;
		}
	}

	// Hides search icon on bigger devices
	#tm-search-modal {
		.uk-search:before { display: none; }
	}

	.tm-container {
		box-sizing: border-box;
		transition: padding 0.2s ease-in-out;
	}
}

@media (max-width: @breakpoint-medium-max) {

	.tm-headerbar {
		width: auto;
	}

}

@media (max-width: @breakpoint-small-max) {
	.tm-price-column.tm-shift-top {
		margin-top: 0;
	}
}

// 
// Web Chat
// 

#tm-container .onwebchatbox {

	background: rgba(0,0,0,0) !important;
	box-shadow: none !important;
	width: 350px !important;
	bottom: 50px !important;
	border-radius: @global-border-radius !important;

	> * {
		background: @global-background !important;
	}

	* {
		font-family: @global-body-font-family !important;
		font-weight: @global-body-font-weight !important;
		font-style: normal;
		text-rendering: optimizeLegibility;
		-moz-osx-font-smoothing: grayscale;
		-webkit-font-smoothing: antialiased;
	}

	.onwebchat_title2 {
        box-shadow: none !important;
        background: rgba(0,0,0,0) !important;
        color: @global-color !important;
        margin: 10px 0 0 20px !important;
        width: 60% !important;
        line-height: @global-line-height !important;
        padding: 0 !important;
        border: none;

		&:before,
		&:after {
			display: none;
		}
	}

    .onweb_minimize_btn,
    #onweb_chaticon {
        width: 60px;
        height: 60px;
        margin: 0 !important;
        border-radius: 50%;
        box-shadow: 0 1px 6px rgba(0,0,0,0.06), 0 2px 32px rgba(0,0,0,0.16), 10px 0 30px 0 fade(@global-primary-background, 40%); 
        -webkit-transition: @global-transition;
                transition: @global-transition;

        &:hover {
            box-shadow: 0 2px 8px rgba(0,0,0,.09), 0 4px 40px rgba(0,0,0,.24) !important;
        }
    }

	.onweb_minimize_btn_icon {
        border: 0;
        width: 60px;
        height: 60px;
        position: relative;
        margin-top: 0;
        background-color: @global-primary-background;
        border-radius: 50%;
        padding: 0;
        top: 0;
        left: 0;

		&:before {
			content: "\f1fa";
			font-family: @global-utouch-icon;
            font-size: 24px;
            position: absolute;
            width: 60px;
            height: 32px;
            text-align: center;
            top: 14px;
            z-index: 0;
            color: @global-contrast-color;
			transition: @global-transition;
		}

        &:hover:before {
            -webkit-transform: rotate(90deg);
                    transform: rotate(90deg);
        }
	}

	.onweb_minimize_btn {
		background: @global-primary-background;
		transition: @global-transition;

		&:hover {
			opacity: 1;
			background: lighten(@global-primary-background, 5%);
		}
	 }

	#div_chat_max_title {
		text-align: left;
	}

	.chat_info {
		border-top-color: rgba(0,0,0,0);
	}

	#div_chat_min_title_span,
	#div_chat_max_title_span {
		color: @global-contrast-color !important;
		font-family: @global-heading-font-family !important;
		font-weight: @global-heading-font-weight !important;
		font-size: 17px !important;
	}

	#onweb-offline-icon,
	#onweb-online-icon {
		display: block;
		width: 7px !important;
		height: 7px !important;
		position: relative;
		top: 2px;
		content: "";
		border-radius: 50% !important;
		box-sizing: border-box !important;
		padding: 5px !important;
		right: 5px;
		margin: 0 !important;
	}

	#onweb-offline-icon {
		background: @global-danger-background;
	}

	#onweb-online-icon {
		display: block;
		background: @global-success-background;
		animation: popping 2.5s cubic-bezier(0.25,0.1,0.25,1) infinite;
	}

	.widget-logo,
	#triangle_down,
	#div_chat_min_title_span,
	#div_chat_max_title_span {
		display: none;
	}

	.chat_area {
		width: 350px;
		padding-top: 0;
		margin-top: -50px;
		border-radius: @global-border-radius @global-border-radius 0 0;
		box-shadow: 0 -40px 0 @global-secondary-background;

		.me,
		.agent {
			border: none;
		}

		a {
			color: @global-link-color;
			&:hover {
				color: @global-link-hover-color;
			}
		}

		p {
			font-size: round((@global-font-size*0.9)) !important;

			&:first-of-type {
				margin-top: 20px;
			}
		}

		.me {
			line-height: round((@global-line-height*0.7));
			color: @panel-box-primary-color;
			margin-bottom: 3px;
			float: right !important;
			clear: right !important;
			margin-right: 20px;

			a {
				color: @panel-box-primary-link-color;
				&:hover {
					color: @panel-box-primary-link-hover-color;
				}
			}
		}

		.agent {
			line-height: round((@global-line-height*0.8));
			color: @global-color;
		}
	}

	.me-bubble {
		background: @panel-box-primary-background;
		border-radius: @global-border-radius;
		
		&:before,
		&:after {
			display: none;
		}
	}

	.agent-bubble {
		background: @global-primary-light-background;
		width: auto !important;
		padding: 8px; 

		&:before {
			display: none;
		}

		&:after {
			display: none;
		}
	}

	.chat_message {
		background-color: @global-primary-light-background;
		border-bottom: 25px solid @global-background !important;
		border-radius: 0 0 5px 5px;
		opacity: 1 !important;
		box-shadow: 0 1px 6px rgba(0,0,0,0.05), 0 20px 30px rgba(0,0,0,0.12);

		.onwebtextarea {
			background-color: @global-primary-light-background !important;
			padding: 5px 10px !important;
			color: @form-color !important;
			border: 1px solid rgba(0,0,0,0) !important;
			box-shadow: none !important;
			border-radius: @global-border-radius !important;
			font-size: round((@global-font-size*0.9)) !important;
			font-weight: @global-body-font-weight !important;
			line-height: round((@global-line-height*0.8)) !important;
			width: 270px !important;
			margin-left: 10px !important;
			border: 1px solid darken(@global-primary-light-background, 10%) !important;
    		border-width: 0 0 1px 1px !important;

			&:focus {
				border-color: fade(@form-focus-border, 30%) !important;
			}
		}
	}

	// offline
	#offline_form {
		border-radius: 5px;
		padding-bottom: 1px;
		box-shadow: 0 1px 6px rgba(0,0,0,0.06), 0 20px 30px rgba(0,0,0,0.12);

		.onwebchatform_div {
			border-radius: 0 0 5px 5px;
		}
	
		.onweboffline_msg {
			margin-top: 82px !important;
			color: @global-color !important;
			top: 15px;
			left: 5px;
			padding: 0 30px;
			font-size: round((@global-font-size*0.9)) !important;
			line-height: round((@global-line-height*0.8)) !important;
		}

		#offlineform_btn {
			background-color: @button-primary-background !important;
			color: @button-primary-color !important;
			border-radius: @global-border-radius !important;
			margin: 20px 0 !important;
			box-shadow: inset 0 1px 0 @global-light-1-shadow !important;
			border: 1px solid @global-border !important;
		}

		#off-form-onwebchat-logo {
			opacity: 0;
		}
	}

	#offline_form > .onwebchatform_div > {    
		#onwebchatoffname, 
		#onwebchatoffemail, 
		#onwebchatemailtext, 
		#onprechatname, 
		#onprechatemail, 
		#onprechattext {
			box-shadow: none !important;
			height: 30px !important;
			font-family: @global-body-font-family !important;
			font-weight: @global-body-font-weight !important;
			font-size: round((@global-font-size*0.9)) !important;
			line-height: round((@global-line-height*0.8)) !important;
			background-color: @global-background !important;
			border-radius: @form-input-border-radius !important;
			padding: 5px 10px !important;
			color: @form-color !important;
			border: 1px solid @form-border !important;
		}
	}

	.onweboffline_flds + .onweb_mail {
		border: 1px solid @form-border !important;
	}

	.onweboffline_flds {
		font-size: 13px !important;
		line-height: 20px !important;
		color: @global-color !important;
	}

	#offline_form > .onwebchatform_div > #onwebchatemailtext {
		height: 60px !important;
	}

	.server_messages {
		color: fade(@global-color, 50%) !important;
	}

	#iconsdiv {
		bottom: 0;

		&:before,
		&:after {
			position: absolute;
			font-size: 18px;
			width: 30px;
			height: 30px;
			color: @global-primary-background;
		}

		&:before {
			font-family: @global-font-icon;
			content: "\f1d8";
			top: 10px;
			right: 5px;
		}

		&:after {
			content: "";
			background-image: url('../images/icons/smile.svg');
			background-repeat: no-repeat;
			bottom: 10px;
			right: 5px;
		}
	}

	#wb-send-image,
	#wb-smile-image {
		opacity: 0;
	}

	#wb-send-image {
		top: 7px;
	}

	#wb-smile-image {
		z-index: 1;
	}

	.webchat_header {
        background: @global-primary-background !important;
        width: 60px !important;
        height: 60px !important;
        border-radius: 50% !important;
        top: 0 !important;
        right: 15px;
        float: right !important;
        position: relative;
        padding: 0 !important;
        background-image: url(../images/icons/chat.svg) !important;
        background-repeat: no-repeat !important;
        background-position: 50% !important;
        margin-bottom: 40px !important;
	}

	// scrollbar
	#chat_area_id::-webkit-scrollbar {
		border: 3px solid @global-background;
		width: 5px;
		height: 5px;
	}

	#chat_area_id::-webkit-scrollbar-button:start:decrement, 
	#chat_area_id::-webkit-scrollbar-button:end:increment {
		background: @global-background;
	}

	#chat_area_id::-webkit-scrollbar-track {
		background: @global-background;
		box-shadow: none;
	}

	#chat_area_id::-webkit-scrollbar-thumb {
		border-radius: 0;
		box-shadow: none;
		background: @global-primary-background;
		
		&:hover {
			background: lighten(@global-primary-background, 10%);
		}
	}
}

// RTL

html[dir="rtl"] {

    .tm-navbar .uk-navbar-nav > li .uk-dropdown-navbar {
        left: 0;
    }

}

@import "plyr.less";