/**
 * Device detection (smartphone, tablet, laptop, etc)
 * @see https://medium.com/@ferie/detect-a-touch-device-with-only-css-9f8e30fa1134
 * Headline "Target specific existing device"
 *
 */





@CHARSET "UTF-8";





.slicknav_menu .badge-topmenu {
		display: none;
		transition: all 2s linear;
}





.note-xs-sm {
	width: 100%;
	color: #8a6d3b;
	text-align: justify;
	background: #fcf8e3;
	border: 1px solid #8a6d3b;
	padding: 10px 10px 10px 10px;
}

.note-xs-sm div.title {
	font-weight: bold;
	padding-bottom: 30px;
	margin-bottom: 10px;
	border-bottom: 1px solid #8a6d3b;
}

.note-xs-sm-top {
	background: #fcf8e3;
	padding: 15px;
}



.note-xs-sm-error {
	width: 100%;
	color: #a94442;
	text-align: justify;
	background: #f2dede;
	border: 1px solid #a94442;
	padding: 10px 10px 10px 10px;
}

.note-xs-sm-error a,
.note-xs-sm-error a:active,
.note-xs-sm-error a:focus,
.note-xs-sm-error a:hover {
	color: #a94442;
	text-decoration: underline;
}

.note-xs-sm-error div.title {
	font-weight: bold;
	text-align: center;
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px solid #a94442;
}

.note-xs-sm-error-container {
	padding: 0px 30px 0px 30px;
}





#deviceTypeDEV1,
#deviceTypeDEV2 {
	color: #ff0000;
	font-size: 12px;
	font-weight: normal;
}










/**
 * XS-devices (smartphones)
 *
 */

@media only screen and (max-width: 767px) {
	:root {
		--ha-fontsize-h1: 30px;
		--ha-fontsize-h2: 35px;
		--ha-fontsize-h3: 21px;
		--ha-fontsize-h4: 18px;
		--ha-fontsize-h5: 16px;
		--ha-fontsize-default: 14px;
		--ha-fontsize-badge: 12px;
		--ha-fontsize-small: 11px;
		--ha-fontsize-product-title: 25px;
		
		--ha-responsive-spacing: 30px;
	}
	
	
	
	
	
	#back-to-top {
		bottom: 20px;
		right: 30px;
	}
	
	#lz_overlay_wm {
		/*inset: auto auto 0px 0px !important;*/
		/*margin: 0px 0px 16px 15px !important;*/
		margin: 0px 30px 75px 0px !important;
	}
	
	
	
	
	
	/** mobile main menu **/
	
	.slicknav_nav a:active,
	.slicknav_nav a:focus,
	.slicknav_nav a:hover {
		background: #fe1a67 !important;
	}
	
	.slicknav_menu ul.slicknav_nav {
		border-top: 3px solid #fe1a67;
	}
	
	.slicknav_menu ul.slicknav_nav li.slicknav_parent:not(:first-child) {
		border-top: 1px solid #fff;
	}
	
	.slicknav_menu .slicknav_menutxt {
		padding-top: 5px;
	}
	
	.slicknav_menu .slicknav_icon {
		border-radius: 5px;
		background: #202020;
		border: 1px solid #0C0C0C;
		padding: 8px;
		margin: 0 !important;
		width: auto !important;
		height: auto !important;
	}
	
	.slicknav_menu .slicknav_arrow {
		color: #fff;
		float: right;
		font-family: FontAwesome;
	}
	
	.slicknav_menu li.slicknav_collapsed span.slicknav_arrow:after {
		content: "\f054";
	}
	
	.slicknav_menu li.slicknav_open span.slicknav_arrow:after {
		content: "\f078";
	}
	
	.slicknav_menu li.slicknav_open li.slicknav_collapsed span.slicknav_arrow:after {
		content: "\f054";
	}
	
	/** end of mobile main menu **/
	
	
	
	
	
	/** section spacing **/
	
	.section_space-x {
		padding: 50px 0;
	}
	
	.section_space {
		padding: 40px 0;
	}
	
	/*.section_space2 {
		padding: 40px 0;
	}*/
	
	/*.section_space3 {
		padding: 30px 0;
	}*/
	
	/*.section_space4 {
		padding: 15px 0;
	}*/
	
	/** end of section spacing **/
	
	
	
	
	
	.section-title h3 {
		font-size: 25px;
	}
	
	.section-title h3 span {
		font-size: 15px;
	}
	
	.section-title h3:before {
		width: 80px;
		height: 3px;
	}
	
	
	
	
	
	.responsive-spacing-xs {
		margin-top: var(--ha-responsive-spacing);
	}
	.responsive-spacing-xs-sm {
		margin-top: var(--ha-responsive-spacing);
	}
	.responsive-spacing-xs-sm-md {
		margin-top: var(--ha-responsive-spacing);
	}
	
	
	
	
	
	.col4 .badge-boxes {
		left: 105px;
	}
	
	
	
	
	
	#owl-opinions .item .opinion {
		font-size: 15px;
		margin: 20px 0;
	}
	
	
	
	
	
	#deviceTypeDEV1 {
		margin-left: 20px;
	}
	
	h3 {
		font-size: 16px;
	}
	
	div ul.list3.header {
		font-size: 12px
	}
	
	.pagebanner img {
		display: none;
	}
	
	
	
	
	
	ul.payment-icons li img {
		width: 80px;
	}
}










/**
 * SM-devices (small devices, tablets)
 *
 */

@media only screen and (min-width: 768px) and (max-width: 991px) {
	:root {
		--ha-fontsize-h1: 50px;
		--ha-fontsize-h2: 35px;
		--ha-fontsize-h3: 21px;
		--ha-fontsize-h4: 18px;
		--ha-fontsize-h5: 16px;
		--ha-fontsize-default: 14px;
		--ha-fontsize-badge: 12px;
		--ha-fontsize-small: 11px;
		--ha-fontsize-product-title: 25px;
		
		--ha-responsive-spacing: 30px;
	}
	
	
	
	
	
	.responsive-spacing-sm {
		margin-top: var(--ha-responsive-spacing);
	}
	.responsive-spacing-xs-sm {
		margin-top: var(--ha-responsive-spacing);
	}
	.responsive-spacing-xs-sm-md {
		margin-top: var(--ha-responsive-spacing);
	}
	
	
	
	
	
	#deviceTypeDEV1 {
		margin-left: 180px;
	}
	
	.pagebanner img {
		display: none;
	}
	
	.main_menu_bt {
		border-top: none;
	}
	
	.slider-container {
		font-size: 17px;
	}
	
	.slider-container .title {
		font-size: 40px;
	}
	
	
	
	
	
	.col4 .badge-boxes-highlight {
		left: 123px;
	}
}










/**
 * MD-devices (medium devices)
 *
 */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
	:root {
		--ha-fontsize-h1: 50px;
		--ha-fontsize-h2: 35px;
		--ha-fontsize-h3: 21px;
		--ha-fontsize-h4: 18px;
		--ha-fontsize-h5: 16px;
		--ha-fontsize-default: 14px;
		--ha-fontsize-badge: 12px;
		--ha-fontsize-small: 11px;
		--ha-fontsize-product-title: 25px;
		
		--ha-responsive-spacing: 30px;
	}
	
	
	
	
	
	.responsive-spacing-md {
		margin-top: var(--ha-responsive-spacing);
	}
	.responsive-spacing-xs-sm-md {
		margin-top: var(--ha-responsive-spacing);
	}
	
	
	
	
	
	.pagebanner img {
		width: 100%;
		margin-top: 80px;		/* TODO: horizontal middle alignment */
	}
	
	.r-tabs .r-tabs-nav .r-tabs-tab {
		width: auto;
	}
	
	
	
	
	
	.col4 .badge-boxes-highlight {
		left: 98px;
	}
}










/**
 * LG-devices (large devices)
 *
 */

@media only screen and (min-width: 1200px) {
	
}










/**
 * SM-devices (small devices, tablets) and larger
 *
 */

@media only screen and (min-width: 768px) {
	
}










/**
 * XS and SM devices
 *
 */

@media only screen and (max-width: 991px) {
	header {
		min-height: auto;
		border-bottom: none;
	}
}










/**
 * MENU FIXES - without this mobile menu instead of desktop menu is shown by 1024px desktop screen
 *
 */


/* Mobile menu for touch devices */
/* with any screen resolution */
@media (hover: none) and (pointer: coarse),							/* smartphones, touchscreens */
@media (hover: none) and (pointer: fine),							/* stylus-based screens */
@media (hover: hover) and (pointer: coarse) {						/* Nintendo Wii controller, Microsoft Kinect */
	#deviceIsTouch {
		display: block !important;
	}
	
	.sticky-wrapper {
		display: none;
	}
	
	.slicknav_menu {
		display: block !important;
		font-size: 13px;
		font-weight: 500;
		top: 0;
		z-index: 9999;
		padding: 0px;
	}
}


/* Desktop menu for 1024px laptop/desktop devices */
@media only screen and (hover: hover) and (pointer: fine) and (min-width: 1024px) and (max-width: 1024px) {
	.slicknav_menu {
		display: none !important;
	}
	
	.sticky-wrapper {
		display: block;
	}
	
	.main_menu {
		display: block;
	}
}










/** EOF **/