/* #Basic Font
================================================== */
html,
body,
body.page,
.wf-container > * {
	font: var(--the7-base-font-big);
	letter-spacing: var(--the7-base-letter-spacing);
	text-transform: var(--the7-base-text-transform);
	text-decoration: var(--the7-base-text-decoration);
	word-spacing: normal;
	color: var(--the7-base-color);
}
a.dt-owl-item-wrap,
a.dt-owl-item-wrap:hover {
	color: var(--the7-base-color);
}

.elementor-widget[class*='elementor-widget-wp-widget-'] a:not(:hover) {
	color: var(--the7-base-color);
}
#main .wf-wrap,
.page-title .wf-wrap,
.fancy-header .wf-wrap {
	padding: 0 @page-right-margin 0 @page-left-margin;
}

.side-header .mobile-header-bar {
	box-sizing: border-box;
}
//Fallback css grid
.no-cssgridlegacy.no-cssgrid {
	& .wf-container,
    & .wf-container-main {
		margin: 0 -@page-right-margin 0 -@page-left-margin;
   	}
}
#main-slideshow.fixed > .royalSlider {
	max-width: @content-width;
	.header-width (@content-width);
}
.header-width (@customSize) when (ispercentage(@customSize)) {
	max-width: @customSize;
}

.header-bar {
 	.masthead:not(.side-header):not(.side-header-menu-icon) & {
		max-width: calc(@content-width ~"-" @header-right-padding ~"-" @header-left-padding);
		.header-width (@content-width);
		margin: 0 auto;
	}
	.masthead:not(.side-header).full-width &,
	.masthead.side-header-menu-icon {
		max-width: 100%;
	}
}

.page-title .wf-wrap:after {
	width: calc(@content-width ~"-" @page-right-margin ~"-" @page-left-margin);
	max-width: calc(100% ~"-" @page-right-margin ~"-" @page-left-margin);
	.boxed & {
		left: @page-left-margin;
	}
}

//Fallback css grid
.no-cssgridlegacy.no-cssgrid {
	& .wf-container,
    & .wf-container-main {
  		margin: 0 -@page-right-margin 0 -@page-left-margin;
   	}
   	& .sidebar-right .content {
		padding-left: @page-left-margin;
	}
	& .sidebar-left .content {
		padding-right: @page-right-margin;
	}
	& .sidebar-right .sidebar,
	& .sidebar-divider-off.sidebar-right .sidebar,
	& .sidebar-right .sidebar.solid-bg,
	& .sidebar-right .sidebar.bg-under-widget
	{
		padding-right: @page-right-margin;
	}
	& .sidebar-left .sidebar,
	& .sidebar-divider-off.sidebar-left .sidebar,
	& .sidebar-left .sidebar.solid-bg,
	& .sidebar-left .sidebar.bg-under-widget {
		padding-left: @page-left-margin;
	}
	& .sidebar-right .sidebar,
	& .sidebar-divider-off.sidebar-right .sidebar,
	& .sidebar-right .sidebar.solid-bg,
	& .sidebar-right .sidebar.bg-under-widget {
		padding-left: 0;
	}
	& .sidebar-left .sidebar,
	& .sidebar-divider-off.sidebar-left .sidebar,
	& .sidebar-left .sidebar.solid-bg,
	& .sidebar-left .sidebar.bg-under-widget {
		padding-right: 0;
	}
	& .content,
	& .sidebar {
		padding: 0 @page-right-margin 0 @page-left-margin;
	}
	}

.sidebar-right .sidebar,
.sidebar-divider-off.sidebar-right .sidebar,
.sidebar-right .sidebar.solid-bg,
.sidebar-right .sidebar.bg-under-widget
{
	margin-right: 0;
	margin-left: 0;
}
.sidebar-left .sidebar,
.sidebar-divider-off.sidebar-left .sidebar,
.sidebar-left .sidebar.solid-bg,
.sidebar-left .sidebar.bg-under-widget {
	margin-right: 0;
	margin-left: 0;
}
#main-slideshow.fixed {
	padding: @page-top-margin @page-right-margin @page-bottom-margin @page-left-margin;
}

	.wf-container {
		margin: 0 -@page-right-margin 0 -@page-left-margin;
	}
	.wf-cell,
.wf-usr-cell
{
	padding: 0 @page-right-margin 0 @page-left-margin;
}

#footer .wf-wrap {
	padding: 0 @footer-right-padding 0 @footer-left-padding;
}
/*Large text*/
.text-big,
.dt-accordion-text-big .wpb_accordion_header > a {
	font-size: var(--the7-text-big-font-size);
	line-height:  var(--the7-text-big-line-height);
}
/*Medium text*/
.text-normal,
.dt-accordion-text-normal .wpb_accordion_header > a,
.icon-with-text-shortcode .dt-text-desc {
	font-size:  var(--the7-base-font-size);
	line-height:  var(--the7-base-line-height);
}
/*Small text*/
.text-small,
.dt-accordion-text-small .wpb_accordion_header > a {
	font-size: var(--the7-text-small-font-size);
	line-height: var(--the7-text-small-line-height);
}
.wp-caption-text {
	.text-small;
}
.text-uppercase {
	text-transform: uppercase;
}

/*title colors*/
h1,
h2,
h3,
h4,
h5,
h6,
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a,
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover,
.h1-size,
.entry-title.h1-size,
.h2-size,
.entry-title.h2-size,
h1.entry-title,
.h3-size,
.entry-title.h3-size,
h2.entry-title,
.h4-size,
.entry-title.h4-size,
h3.entry-title,
.h5-size,
.entry-title.h5-size,
.h6-size,
.entry-title.h6-size,
.header-color,
.entry-meta .header-color,
.color-title {
	color: var(--the7-title-color);

	.dt-mega-menu .dt-mega-parent .sidebar-content .widget & {
		color: @mega-menu-widget-title-color;
	}
	.sidebar-content & {
		color: @widget-sidebar-header-color;
	}
	.footer & {
		color: @widget-footer-header-color;
		.custom-mixin-footer-with-accent-color (@widget-footer-header-color, @widget-footer-accent-color);
	}
}

/* #Headers fonts
================================================== */
h1,
.h1-size,
.entry-title.h1-size,
.dt-accordion-h1-size .wpb_accordion_header > a {
	color: var(--the7-h1-color);
	font: var(--the7-h1-font);
	text-transform: var(--the7-h1-text-transform);
	letter-spacing: var(--the7-h1-letter-spacing);
	word-spacing: var(--the7-h1-word-spacing);
	text-decoration: var(--the7-h1-text-decoration);
}

h2,
.h2-size,
.entry-title.h2-size,
h1.entry-title,
.dt-accordion-h2-size .wpb_accordion_header > a {
	color: var(--the7-h2-color);
	font: var(--the7-h2-font);
	text-transform: var(--the7-h2-text-transform);
	letter-spacing: var(--the7-h2-letter-spacing);
	word-spacing: var(--the7-h2-word-spacing);
	text-decoration: var(--the7-h2-text-decoration);
}

h3,
.h3-size,
.entry-title.h3-size,
h2.entry-title,
.dt-accordion-h3-size .wpb_accordion_header > a {
	color: var(--the7-h3-color);
	font: var(--the7-h3-font);
	text-transform: var(--the7-h3-text-transform);
	letter-spacing: var(--the7-h3-letter-spacing);
	word-spacing: var(--the7-h3-word-spacing);
	text-decoration: var(--the7-h3-text-decoration);
}

h4,
.h4-size,
.entry-title.h4-size,
h3.entry-title,
.dt-accordion-h4-size .wpb_accordion_header > a,
.vc_separator h4 {
	color: var(--the7-h4-color);
	font: var(--the7-h4-font);
	text-transform: var(--the7-h4-text-transform);
	letter-spacing: var(--the7-h4-letter-spacing);
	word-spacing: var(--the7-h4-word-spacing);
	text-decoration: var(--the7-h4-text-decoration);
}

h5,
.h5-size,
h4.entry-title,
.entry-title.h5-size,
.dt-accordion-h5-size .wpb_accordion_header > a {
	color: var(--the7-h5-color);
	font: var(--the7-h5-font);
	text-transform: var(--the7-h5-text-transform);
	letter-spacing: var(--the7-h5-letter-spacing);
	word-spacing: var(--the7-h5-word-spacing);
	text-decoration: var(--the7-h5-text-decoration);
}

h6,
.h6-size,
.entry-title.h6-size,
.dt-accordion-h6-size .wpb_accordion_header > a {
	color: var(--the7-h6-color);
	font: var(--the7-h6-font);
	text-transform: var(--the7-h6-text-transform);
	letter-spacing: var(--the7-h6-letter-spacing);
	word-spacing: var(--the7-h6-word-spacing);
}

.fade-header-color( @property, @property-str-1, @property-str-2, @property-str-3, @property-str-4, @property-str-5, @opacity) {
	color: fade(@property, @opacity);
}

/*Primary text colors*/
.text-primary {
	.text-big;
	.content & {
		color: var(--the7-h4-color);
	}
	.footer & {
		color: @widget-footer-header-color;
	}
	a& {
		text-decoration: none;
		&:hover {
			text-decoration: underline;
		}
	}
}
.color-primary {
	.sidebar,
	.sidebar-content & {
		color: @widget-sidebar-header-color;
	}
	.footer & {
		color: @widget-footer-header-color;
	}
	a& {
		text-decoration: none;
		&:hover {
			text-decoration: underline;
		}
	}
}

/*Secondary text*/
.text-secondary {
	.text-small;
}

.color-secondary,
.text-secondary {
	color: var(--the7-accent-color);
	.stripe & {
		color: var(--the7-accent-color);
	}
	.wf-container-footer & {
		.custom-mixin-footer-color (@widget-footer-accent-color);
	}
}
a,
a:hover {
	color: var(--the7-links-color);
	.wf-container-footer & {
		.custom-mixin-footer-color (@widget-footer-accent-color);
	}
}
/*Accent text*/
.color-accent {
	#page & {
		color: var(--the7-accent-color);
	}
	.accent-gradient #page & {
		.text-gradient (@startColor: @accent-bg-color, @endColor: @accent-text-color-2);
	}
	#page .wf-container-footer &,
	.accent-gradient #page .footer &  {
		.custom-mixin-footer-color (@widget-footer-accent-color);
	}
}
.paint-accent-color {
	// color: @accent-bg-color !important;
	// .accent-gradient & {
	// 	.text-gradient (@startColor: @accent-bg-color, @endColor: @accent-text-color-2);
	// }
	color: var(--the7-accent-color) !important;
	.accent-gradient & {
		.text-gradient-text-fill (@startColor: @accent-bg-color, @endColor: @accent-text-color-2);
  	}
	.wf-container-footer &,
	.accent-gradient &  {
		.custom-mixin-footer-color (@widget-footer-accent-color) !important;
	}
}
/*Transparent color*/
.color-secondary,
.color-base-transparent {
	color: var(--the7-secondary-text-color);
	.sidebar-content & {
		color: fade(@widget-sidebar-color, 50%);
	}
	.footer & {
		color: fade(@widget-footer-color, 50%);
	}
}
.bg-header-transparent(@opacity) {
	background-color: fade(@h1-color, @opacity);
	.sidebar-content & {
		background-color: fade(@widget-sidebar-header-color, @opacity);
	}
	.footer & {
		background-color: fade(@widget-footer-header-color, @opacity);
	}
}
/* #General -> Appearance -> Layout -> Content width
================================================== */
#main > .wf-wrap,
#bottom-bar > .wf-wrap,
#footer > .wf-wrap {
	width: @content-width;
}

// .ph-wrap {
// 	max-width:  @content-width - 88;
// }
#phantom.full-width .ph-wrap.boxed {
	max-width: 100%;
}
#page.boxed {
	max-width: @box-width;
}
.boxed .footer,
.boxed #bottom-bar {
	.footer-overlap & {
		max-width: @box-width;
	}
}

#phantom .ph-wrap.boxed,
.boxed .top-bar.line-content:before,
.boxed .classic-header.content-width-line .navigation:before {
	max-width: calc(@content-width ~"-" @header-right-padding ~"-" @header-left-padding);
	
}
.boxed .full-width .top-bar.line-content:before,
.boxed .classic-header.full-width.content-width-line .navigation:before {
	max-width: 100%;
}
	// .content {
	// 	width: calc(100% ~'-' @sidebar-width);
	// }

#main {
	padding: @page-top-margin 0 @page-bottom-margin 0;

	& > .wf-wrap {
		padding: 0 @page-right-margin 0 @page-left-margin;
	}
}


/* #General -> Appearance -> Background under the box
================================================== */
body {
	background: @body-bg-color @body-bg-image @body-bg-repeat @body-bg-attachment @body-bg-position-x @body-bg-position-y;
	background-size: @body-bg-size;
}

/* #General -> Appearance -> Background
================================================== */
#page {

	background: @page-bg-color @page-bg-image @page-bg-repeat @page-bg-attachment @page-bg-position-x @page-bg-position-y;
	background-size: @page-bg-size;
	background-attachment: @page-bg-attachment;
	.fixed-page-bg & {
		background: none;
	}
	&:after {
		.fixed-page-bg & {
			content:"";
			position:fixed;
			top:0;
			height:100vh;
			left:0;
			right:0;
			z-index:-1;
			background: @page-bg-color @page-bg-image @page-bg-repeat @page-bg-position-x @page-bg-position-y;
			background-size: @page-bg-size;
		}
	}
}
.fixed-page-bg #page.boxed:after {
	max-width: @box-width;
	margin: 0 auto;
}
	.footer-overlap .page-inner {
		background: @page-bg-color @page-bg-image @page-bg-repeat @page-bg-attachment @page-bg-position-x @page-bg-position-y;
		background-size: @page-bg-size;
	}

		

/*****************************************************
	!-Theme Options -> Appearance -> BORDER RADIUS
******************************************************/

	textarea,
	select,
	blockquote,
	.entry-author,
	.format-aside-content,
	.format-status-content,
	.format-link-content,
	.dt-form button,
	.dt-btn,
	#main-slideshow .tp-button,
	.wpcf7-submit.dt-btn-m,
	.shortcode-action-bg,
	.shortcode-action-bg:before,
	.shortcode-teaser.frame-on,
	.testimonial-item  .ts-viewport,
	.footer .testimonials.slider-content,
	.shortcode-code,
	#main .vc_text_separator div,
	#main .vc_progress_bar .vc_single_bar,
	#main .vc_progress_bar .vc_single_bar .vc_label,
	#main .vc_progress_bar .vc_single_bar .vc_bar,
	#main .flexslider,
	.nsu-submit,
	.mc4wp-form input[type="url"],
	.mc4wp-form input[type="date"],
	#main #content .rotatingtweets,
	#main #content .norotatingtweets,
	.mc4wp-form form select,
	#megaMenu ul.megaMenu > li.menu-item,
	#megaMenu ul.megaMenu > li.menu-item > a,
	.customSelect,
	.loading-label,
	.widget .testimonial-content,
	.skill,
	.skill-value,
	.widget .team-container,
	.widget .logo-items li,
	.comment-list .comment > article,
	.bg-on:not(.fullwidth-img),
	.blog-content .block-style-widget,
	#mobile-menu,
	.testimonial-content,
	.wpb_content_element .wpb_accordion_header > a:before,
	.wpb_content_element.dt-accordion-bg-on .wpb_accordion_wrapper .wpb_accordion_header,
	.twentytwenty-before-label,
	.twentytwenty-after-label,
	.btn-cntr a,
	.photo-scroller .album-share-overlay .share-button.entry-share,
	.project-navigation,
	.album-share-overlay,
	.st-accordion li > a:before,
	.arrows-accent .prev i,
	.arrows-accent .next i,
	.arrows-accent .owl-prev i,
	.arrows-accent .owl-next i,
	.round-images .bg-on.team-container:not(.fullwidth-img),
	.solid-bg .sidebar-content,
	.solid-bg.sidebar-content .widget,
	.bg-under-widget .sidebar-content .widget,
	.ls-container.ls-carousel .ls-nav-prev,
	.ls-container.ls-carousel .ls-nav-next,
	.menu-btn,
	.custom-menu a:before,
	.small-fancy-datas .fancy-date a {
		.border-radius;
	}
	.wpb_tabs.tab-style-two,
	.wpb_tour.tab-style-two {
		.border-radius;
	}