/* ========== DESKTOP =========== */
@media screen and (min-width: 981px), screen and (max-width: 980px) and (orientation: landscape) 
{

	HTML
	{
		font-family: var(--fn-default),Arial,sans-serif;
		font-size: 14px;
		font-weight: 400;
		line-height: 16px;
		letter-spacing: 0em;
		text-align: left;
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		height: 100%;
		min-width: 1200px;
	}
	
	BODY
	{
		margin: 0px; height: 100%; padding: 0px;
		height: 100%;
		background-color: var(--co-background);
		color: var(--co-text);
	}

	H1, .fn_h1
	{
		font-family: var(--fn-default),Arial,sans-serif;
		font-size: 36px;
		font-weight: 900;
		line-height: 42px;
		letter-spacing: 0em;
	}

	H2, .fn_h2
	{
		font-family: var(--fn-default),Arial,sans-serif;
		font-size: 20px;
		font-weight: 700;
		line-height: 23px;
		letter-spacing: 0em;
		text-transform: uppercase;
	}

	H3, .fn_h3
	{
		font-family: var(--fn-default),Arial,sans-serif;
		font-size: 14px;
		font-weight: 700;
		line-height: 16px;
		letter-spacing: 0em;
		text-transform: uppercase;
	}

	P, DIV
	{
		font-family: var(--fn-default),Arial,sans-serif;
		font-size: 16px;
		font-weight: 400;
		line-height: 16px;
		letter-spacing: 0em;
		text-align: left;
		
	}

	.wide
	{
		font-family: var(--fn-default),Arial,sans-serif;
		font-size: 14px;
		font-weight: 400;
		line-height: 23.8px;
		letter-spacing: 0em;
		text-align: left;
	}

	.small
	{
		font-family: var(--fn-default),Arial,sans-serif;
		font-size: 12px;
		font-weight: 400;
		line-height: 14px;
		letter-spacing: 0em;
		text-align: left;
	}
	
	#style_used
	{
		background-color: #00ff00; min-height: 2px; width: 100%;
	}
	
	INPUT						{ height: 40px; width: 250px; padding-left: 10px; padding-right: 10px; color: var(--co-text); background: var(--co-background); border: 1px solid var(--co-middle);}
	INPUT.field					{ height: 40px; width: 520px; padding-left: 10px; padding-right: 10px; color: var(--co-text); background: var(--co-background); border: 1px solid var(--co-middle);}
	INPUT.search				{ height: 35px; width: 150px; color: var(--co-text); background: var(--co-background); border: none;}
	INPUT.radio					{ height: 20px; width: 20px; color:var(--co-text)0; background: var(--co-background); border: 1px solid var(--co-middle); margin-left: 0px;}
	INPUT.contact				{ height: 40px; color: var(--co-text); background: var(--co-background); border: 1px solid var(--co-middle);}
	INPUT.p100					{ height: 40px; width: 100%; padding-left: 10px; padding-right: 10px; color: var(--co-text); background: var(--co-background); border: 1px solid var(--co-middle);}
	INPUT.checkbox				{ height: 20px; width: 20px; color: var(--co-text); background: var(--co-background); border: 1px solid var(--co-middle); margin-left: 0px;}
	INPUT:focus					{ outline: none; }
	TEXTAREA					{ padding: 10px;  height: 40px; width: 250px; color: var(--co-text); background: var(--co-background); border: 1px solid var(--co-middle);}
	TEXTAREA:focus				{ outline: none; }
	SELECT						{ height: 40px; width: 250px; color: var(--co-text); border: 1px solid var(--co-middle); padding-left: 10px; background: url("/filer/icons/middle/dropdown.svg") no-repeat right 7px top 12px var(--co-background); -webkit-appearance:none; -moz-appearance:none; appearance:none; }
	SELECT.ipp					{ height: 40px; width: 250px; color: var(--co-text); font-size: 16px; border: 1px solid var(--co-middle); padding-left: 10px; background: url("/filer/icons/middle/dropdown.svg") no-repeat right 7px top 12px #FFFFFF; -webkit-appearance:none; -moz-appearance:none; appearance:none; }
	SELECT:focus				{ outline: none; }
	.di_desktop					{ }
	.di_mobile					{ display: none; }
	.di_shadow					{ box-shadow: 0px 4px 30px rgba(0, 0, 0, 0.1); }

	.bu_normal					{ border-radius: 5px; cursor: pointer; text-transform: uppercase; height: 40px; border: 2px solid var(--co-text); padding-top: 7px; padding-left: 10px; padding-right: 10px; cursor: pointer; }
	.bu_normal:hover			{ opacity: 0.75; cursor: pointer; }
	.bu_normal_inactive			{ border-radius: 5px; opacity: 0.2; text-transform: uppercase; height: 40px; border: 2px solid var(--co-text); padding-top: 7px; padding-left: 10px; padding-right: 10px; }
	.bu_normal_inactive:hover	{ opacity: 0.2; text-transform: uppercase; height: 40px; border: 2px solid var(--co-text); padding-top: 7px; padding-left: 10px; padding-right: 10px; }
	.bu_circel_small			{ width: 31px; height: 31px; border-radius: 20px; cursor: pointer; }
	.bu_circel_small:hover		{ opacity: 0.75; cursor: pointer; }
	.bu_circel_big				{ width: 40px; height: 40px; border-radius: 20px; cursor: pointer; }
	.bu_circel_big:hover		{ opacity: 0.75; cursor: pointer; }
	.bu_radius_add				{ border-radius: 20px; }

	.im_circle_little			{ width: 117px; height: 117px; border-radius: 120px; }
	.im_circle_small			{ width: 200px; height: 200px; border-radius: 120px; }
	.im_circle_medium			{ width: 240px; height: 240px; border-radius: 120px; }
	.im_circle_big				{ width: 360px; height: 360px; border-radius: 180px; }
	
	.fn_button					{ font-size: 20px; padding-top: 10px; }
	.fn_number_products			{ font-size: 10px; }
	
	.margin_content				{ width: 1200px; margin: auto;}
	.padding_content			{ padding-left: 40px; padding-right:40px; }
	.padding_content_left		{ padding-left: 40px; }
	.padding_content_right		{ padding-right:40px; }
	.top_menu					{ width: 100px; height: 110px; font-weight: 400; color: var(--co-light); border: 0px solid var(--co-top-menu-border); border-bottom: 0px solid transparent; cursor: pointer;}
	.top_menu:hover				{ width: 100px; height: 110px; font-weight: 400; color: var(--co-accent2); border: 0px solid var(--co-top-menu-border); border-bottom: 5px solid var(--co-accent2); cursor: pointer; }

	.top_menu_active			{ width: 100px; height: 110px; font-weight: 700; color: var(--co-accent1); border: 0px solid var(--co-top-menu-border); border-bottom: 5px solid var(--co-accent1); cursor: pointer; }
	.top_menu_active :hover		{ width: 100px; height: 110px; font-weight: 700; color: var(--co-accent1); border: 0px solid var(--co-top-menu-border); border-bottom: 5px solid var(--co-accent1); cursor: pointer; }

	.box_dropdown				{ z-index: 65000; background: var(--co-box-dropdown-background); border: 1px solid var(--co-middle); position: absolute; }
	.box_dropdown_marker		{ z-index: 65001; background: var(--co-box-dropdown-background); width: 16px; height: 16px; border: 0px solid var(--co-box-dropdown-background); border-left: 1px solid var(--co-middle); border-top: 1px solid var(--co-middle); position: absolute;  transform:rotate(45deg); top: -9px; }
	.box_dropdown	SELECT		{ height: 28px; width: 250px; color: var(--co-text); border: 1px solid var(--co-middle); background: url("/filer/icons/middle/dropdown.svg") no-repeat right 7px top 6px var(--co-box-dropdown-background); -webkit-appearance:none; -moz-appearance:none; appearance:none; }
	.box_dropdown .bu_normal	{ height: 30px; padding-top: 8px;  }

	.quicksearch				{ width: 220px; height: 40px; border: 1px solid var(--co-middle); background: none; }
	.wi_540px					{ width: 520px; }
	.wi_540						{ width: 540px; }
	.wi_374						{ width: 394px; }
	.wi_190						{ width: 190px; }
	.wi_200						{ width: 200px; }
	.wi_400						{ width: 400px; }
	.wi_600						{ width: 600px; }
	.wi_800						{ width: 800px; }

	/* ========== COLUMNS =========== */
	.co_distance				{ width: 60px; }
	.co_1-1_full				{ width: 1150px; }
	.co_1-2_half				{ width: 600px; }
	.co_40_60					{ width: 414px; }
	.co_60_40					{ width: 670px; }
	.co_40_60_shop				{ width: 370px; }
	.co_60_40_shop				{ width: 750px; }
	.co_1-3						{ width: 360px; }
	.co_1-3_33					{ width: 33%; }
	.co_2-3						{ width: 730px; }
	.co_2-3 .co_50				{ width: 350px; }
	.co_2-3 .co_distance		{ width: 30px; }
	.co_2-3_66					{ width: 66%; }							   
	.co_50_popup				{ width: 250px; }
	.co_margin_bottom			{ margin-bottom: 10px; }
	.co_margin_bottom_big		{ margin-bottom: 20px; }
	.co_prod_detail_left		{ width: 550px; }
	.co_prod_detail_right		{ width: 650px; }
	.p100						{ width: 100% }


	#mainbody
	{
		margin-top: 120px;
	}

	#mainbody_no_margin 
	{
		margin-top: 80px;
	}

	#categories					{ position: relative; top: -20px; }
	#categories	.bo_bottom		{ border-bottom: 5px var(--co-accent1) solid; }

	/* ========== CHECKBOX & RADIOBUTTON =========== */
       /* The container */
        .in_checkbox
        {
			display: block;
			position: relative;
			padding-left: 50px;
			margin-bottom: 12px;
			cursor: pointer;
			-webkit-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
			user-select: none;
		}

        /* Hide the browser's default checkbox */
        .in_checkbox input
        {
			position: absolute;
			opacity: 0;
			cursor: pointer;
			height: 0;
			width: 0;
        }

        /* Create a custom checkbox */
        .in_checkbox_checkmark
        {
			position: absolute;
			top: 0;
			left: 0;
			height: 20px;
			width: 40px;
			background-image: var(--svg-checkbox-desktop-inactive);
        }

        /* Create the checkmark/indicator (hidden when not checked) */
        .in_checkbox_checkmark:after
        {
			content: "";
			position: absolute;
			display: none;
        }

        /* Show the checkmark when checked */
        .in_checkbox input:checked ~ .in_checkbox_checkmark:after
        {
			display: block;
        }

        /* Style the checkmark/indicator */
        .in_checkbox .in_checkbox_checkmark:after
        {
			position: absolute;
			top: 0;
			left: 0;
			height: 20px;
			width: 40px;
 			background-image: var(--svg-checkbox-desktop-active);
        }


         /* Customize the label (the container) */
        .in_radiobutton {
          display: block;
          position: relative;
          padding-left: 50px;
          margin-bottom: 12px;
          cursor: pointer;
          -webkit-user-select: none;
          -moz-user-select: none;
          -ms-user-select: none;
          user-select: none;
        }

        /* Hide the browser's default radio button */
        .in_radiobutton input {
          position: absolute;
          opacity: 0;
          cursor: pointer;
          height: 0;
          width: 0;
        }

        /* Create a custom radio button */
        .in_radiobutton_checkmark
        {
			position: absolute;
			top: 0;
			left: 0;
			height: 20px;
			width: 40px;
			background-image: var(--svg-radiobutton-desktop-inactive);
        }

        /* Create the indicator (the dot/circle - hidden when not checked) */
        .in_radiobutton_checkmark:after
        {
          content: "";
          position: absolute;
          display: none;
        }

        /* Show the indicator (dot/circle) when checked */
        .in_radiobutton input:checked ~ .in_radiobutton_checkmark:after
        {
          display: block;
        }

        /* Style the indicator (dot/circle) */
        .in_radiobutton .in_radiobutton_checkmark:after
        {
			position: absolute;
			top: 0;
			left: 0;
			height: 20px;
			width: 40px;
 			background-image: var(--svg-radiobutton-desktop-active);
        } 

    /* ========== PRODUCT ITEMS =========== */

	.prod_item_flex
	{
	  width: 750px;
	  position: relative;
	  display: flex;
	  flex-wrap: wrap;
	  align-items:space-between;
	  column-gap: 30px;
	  row-gap: 40px;
	} 

	.prod_item_flex .item
	{
	  width: 230px;
	  min-height: 340px;
	}

	.prod_item_flex .item .picture
	{
	  width: 230px;
	  height: 230px;
	}

	.prod_item_flex .item .picture .wishlist
	{
		position: relative; 
		left: 186px; 
		top: 5px;
	}
	.prod_item_wishlist
	{
		width: 720px;
		display: flex;
	} 

	.prod_item_wishlist .item
	{
		height: 200px;
	}

	.prod_item_wishlist .item .picture
	{
		width: 200px;
		height: 200px;
	}

	.prod_item_wishlist .item .picture .wishlist
	{
		position: relative; 
		left: 160px; 
		top: 10px;
	}
	
	.prod_item_wishlist .item .content
	{
	  width: 370px;
	}

	.prod_item_wishlist .item .price
	{
	  width: 100px;
	}

	.prod_item_wishlist .item .close
	{
	  width: 30px;
	}

/* Works on Firefox */
	.no_scrollbar { scrollbar-width: none; }

/* Works on Chrome, Edge, and Safari */
	.no_scrollbar ::-webkit-scrollbar { width: 0px; }

	.no_scrollbar ::-webkit-scrollbar-track { }

	.no_scrollbar ::-webkit-scrollbar-thumb { background-color: blue; border-radius: 20px; }

	.special_price {font-size: 24px; position: absolute; width: 50px; height:50px; top: -245px; left: -15px;}

	.slider_slogan
	{
			width: 1200px;
			position: absolute;
			text-align: right;
	}

	.slider_piclayer
	{
			height: 413px;
			width: 100%;
			position: absolute;
			color: var(--co-font-on-accent1);
			font-size: 22px;
			text-shadow: #000000 0px 0px 8px;
			text-align: left;
	}

	.slider_piclayer H1
	{
			color: var(--co-font-on-accent1);
			font-size: 26px;
	}

	.slider_piclayer A
	{
			color: var(--co-font-on-accent1);
			text-decoration: none;
			cursor: pointer;
	}

	.slider_piclayer A:hover
	{
			color: var(--co-font-on-accent1);
			text-decoration: none;
			cursor: pointer;
	}

	.slider_text
	{
			position: relative;
			font-size: 23px;
			height: 158px;
			width: 300px;
			text-align: right;
			padding-right: 20px;
			padding-top: 20px;
			padding-bottom: 20px;
			padding-left: 10px;
			left: +810px;
			top: +335px;
			overflow:hidden;
			line-height: 30px;
	}

	.slider_inactive 
	{
	}

	.slider_inactive A
	{
			color: var(--co-accent1);
			text-decoration: none;
	}

	.slider_active A
	{
			color: var(--co-middle);
			text-decoration: none;
	}

	.slider_direct
	{
			overflow: hidden; 
			height: 35px; 
			margin: auto; 
			width: 1200px; 
			text-align: left;
			font-size: 14px;
			padding-left: 1px;
			text-shadow: #000000 0px 0px 1px, #000000 0px 0px 1px ;
	}

	.slider_piclayer_outer
	{
		opacity: 0.25;  
		width: 100%; 
		height: 563px; 
		top: -30px; 
		position: relative;
	}

	.slider_piclayer_inner {
		width: 1200px; 
		height: 500px; 
		top: -563px; 
		margin: auto;
		position: relative;
	}

	.slider_text_shadow {
		padding-top: 40px; 
		padding-right: 40px; 
		display: table-cell; 
		height: 100%; 
		display: table-cell; 
		width: 426px; 
		vertical-align: top;
	}

	.slider_bullets
	{
		position: relative; 
		text-align: center; 
		display: block; 
		width: 100%; 
		top: 503px;
	}

	.slider_bullet
	{
		display: inline-block;
		font-size: 80px; 
		width: 20px;
		margin-top: 6px;
	}

	.slider_container
	{
		position: relative;
		text-align: center;
		min-height: 500px;
		display: block;
		width: 100%;
	}
	
	
/* Account popup */
	
	#AccountInfo
	{
//		width: 400px; right: 0px;
	}
	
/* header-class */	

	#header 
	{
		top: 0px;
		position: fixed;
		background: var(--co-background);
		box-shadow: 0 0 7px 0 rgba(0,0,0,.2);
		z-index: 20000;
		height: 80px;
		width: 100%;
	}

	#header IMG.logo
	{
		max-height: 70px;
		max-width: 250px;
		position: relative;
		top: +22px;
	}

	#header .fn_big
	{ 
		font-size: 16px; 
	}

	#header .fn_icon
	{ 
		font-size: 24px; 
		color: var(--co-accent1);
		transition: all .3;
	}

	#header .fn_icon:hover
	{ 
		font-size: 24px; 
		color: var(--co-accent2);
		transform: scale(1.2);
	}

	#header #topmenu
	{
		display: flex;
		flex-wrap: none;
		padding: 0px;
		justify-content: center;
		align-items: center;
		width 600px;
		flex: 1 0 auto;
		position: relative;
		top: -6px;
		cursor: pointer;
	}

	#header #topmenu .entry
	{
		display: flex;
		padding-left: 10px;
		padding-right: 10px;
		padding-top: 10px;
		padding-bottom: 10px;
		margin-top: 10px;
		justify-content: center;
		align-items: center;
		font-size: 16px;
		position: relative;
		border-bottom: 2px solid var(--co-background);
		transition: all .7s ease;
	}

	#header #topmenu .entry:hover
	{
		border-bottom: 2px solid var(--co-accent1);
	}

	#header #topmenu .entry_active
	{
		display: flex;
		padding-left: 10px;
		padding-right: 10px;
		padding-top: 10px;
		padding-bottom: 10px;
		margin-top: 10px;
		justify-content: center;
		align-items: center;
		font-size: 16px;
		border-bottom: 2px solid var(--co-accent2);
		position: relative;
		transition: all .7s ease;
	}

	#header #topmenu .entry_active:hover
	{
		border-bottom: 2px solid var(--co-accent1);
	}


	#header #topmenu .entry .submenu, #header #topmenu .entry_active .submenu
	{
		backface-visibility: hidden;
		position: absolute;
		top: +25px;
		left: +0px;
		margin-top: 20px;
		padding: 20px 20px 20px 15px;
		background: var(--co-background);
		min-width: 150px;
		white-space: nowrap;
		box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
		transform: rotateY(180deg);
		transition: all .3s ease;
	}

	#header #topmenu:hover .entry:hover .submenu, #header #topmenu:hover .entry_active:hover .submenu
	{
		transform: rotateY(360deg);
		transition: all .3s ease;
	}

	#header #topmenu:hover .entry:hover .submenu .toggle, #header #topmenu:hover .entry_active:hover .submenu .toggle
	{
		position: absolute; 
		top:-10px; 
		left: 0px; 
		width: 100%; 
		height: 15px; 
		background: transparent;
	}

	#header #topmenu:hover .entry:hover .submenu .item, #header #topmenu:hover .entry_active:hover .submenu .item
	{
		border-left: solid 2px transparent;
		padding: 2px 2px 2px 5px;
		background: transparent;
		margin-bottom: 10px;
	}

	#header #topmenu:hover .entry:hover .submenu .item:hover, #header #topmenu:hover .entry_active:hover .submenu .item:hover
	{
		border-left: solid 2px var(--co-accent1);
	}

	#header #topmenu:hover .entry:hover .submenu .item:last-child, #header #topmenu:hover .entry_active:hover .submenu .item:last-child
	{
		margin-bottom: 0px;
	}
	
/* footer-class */	
	
	#page_footer
	{
		margin-top: 40px;
	}

	#page_footer A
	{
		color: var(--co-font-on-accent1);
	}

	#page_footer A:hover
	{
		color: var(--co-light);
	}
	
	.page_footer_headline
	{
		opacity: 0.3;
	}
	
	#page_footer_menus
	{
		background-color: var(--co-dark);
		color: var(--co-light);
		min-height: 200px;
		padding-top: 20px;
		padding-bottom: 20px;
	}
	
	#page_footer_infoblock
	{
		background-color: var(--co-black);
		color: var(--co-light);
		height: 70px;
		padding-top: 25px;
	}

	#page_footer_infoblock_content
	{
		width: 1200px;
		min-width: 1200px;
		display: flex;
		flex: 1 0 auto;
		text-align: center;
	}

	#page_footer_infoblock_content
	{
		display: flex;
		flex-wrap: none;
		padding: 0px;
		justify-content: center;
		align-items: center;
		width 100%;
		padding-left: 40px;
		padding-right: 40px;
	}

	#page_footer_infoblock_content A
	{
		color: var(--co-light);
	}

	#page_footer_infoblock_content A:hover
	{
		color: var(--co-superlight);
	}

	#page_footer_infoblock_content .flex_col
	{
		text-align: center;
		flex: 1 0 auto;
	}

	#page_footer_infoblock_content .flex_col:nth-child(1)
	{
		text-align: left;
	}

	#page_footer_infoblock_content .flex_col:nth-last-child(1)
	{
		text-align: right;
	}

	#page_footer_partner
	{
		margin-top: 20px;
		width: 1160px;
		min-width: 1160px;
		display: flex;
		text-align: center;
	}

	.page_footer_partner_logo
	{
		flex: 1 0 auto;
		padding: 0px;
		width 100%;
		padding-left: 40px;
		padding-right: 40px;
	}

	#page_footer_basemenu
	{
		margin-top: 20px;
		width: 100%;
		display: flex;
		text-align: center;
	}

	.page_footer_basemenu_entry
	{
		flex: 1 0 auto;
		padding: 0px;
		width 100%;
		padding-left: 40px;
		padding-right: 40px;
	}

	#page_footer_success
	{
		margin-top: 20px;
		width: 1160px;
		min-width: 1160px;
		display: flex;
		text-align: center;
	}

	.page_footer_success_entry
	{
		flex: 1 0 auto;
		padding: 0px;
		width 100%;
		padding-left: 20px;
		padding-right: 20px;
	}

	.page_footer_success_entry .number
	{
		display: inline-block;
		font-size: 30px;
		margin-right: 10px;
	}

	.page_footer_success_entry .info
	{
		display: inline-block;
		font-size: 12px;
	}

	.page_footer_partner_logo IMG
	{
		max-width: 80px;
		max-height: 40px;
		filter: grayscale(.7) brightness(1.2);
	}

	#page_footer_languages_select
	{
		display: inline-block;
		cursor: pointer;
		position: relative; 
		top: -4px; 
		padding-left: 10px;
	}
	
	#page_footer_languages_select #page_footer_languages
	{
		display: none;
		opacity: 0.0;
		left: +1px;
		z-index: 65000;
		position: absolute;
		background-color: var(--co-black);
		border: 1px solid var(--co-light);
		border-radius: 3px;
		padding-top: 4px;
		padding-bottom: 4px;
	}

	#page_footer_languages_select:hover #page_footer_languages
	{
		display: block;
		opacity: 1.0;
	}

	#page_footer_languages .language
	{
		background-color: var(--co-black);
		margin-left: 4px;
		margin-right: 4px;
		padding-left: 6px;
		padding-right: 6px;
		padding-top: 2px;
		padding-bottom: 2px;
		border-radius: 2px;
	}

	#page_footer_languages .language:hover
	{
		color: var(--co-dark);
		background-color: var(--co-light);
		margin-left: 4px;
		margin-right: 4px;
		padding-left: 6px;
		padding-right: 6px;
		border-radius: 2px;
	}
		
	.list_body {
		list-style-type: none;
		padding: 0px;
		margin: 0px;
	}
	
	.list_line:nth-child(even)	{
		background-color: var(--co-white);
		color: var(--co-dark);
		border-bottom: 1px solid var(--co-dark);
		cursor: pointer;
		margin: 0px;
		padding: 0px 0px 10px 0px;
		max-height: 34px;
	}
	
	.list_line:nth-child(odd)	{
		background-color: var(--co-light);
		color: var(--co-dark);
		border-bottom: 1px solid var(--co-dark);
		cursor: pointer;
		margin: 0px;
		padding: 0px 0px 10px 0px;
		max-height: 34px;
	}
	
	.list_line DIV {
		overflow: hidden;
		text-overflow: ellipsis;
	}
	
	.list_body {
		border: 1px solid var(--co-dark);
	}

	.di_desktop_margin_medium_left{
		margin-left: 20px;
	}
	
	.di_dektop_margin_medium_bottom{
		margin-bottom: 20px;
	}

}
