/* ========== DESKTOP =========== */

@media (min-width: 769px) {

	HTML {
		font-family: Roboto;
		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;
		box-sizing: border-box;
	}
	
	BODY {
		margin: 0px; height: 100%; padding: 0px;
		height: 100%;
		background-color: #FFFFFF;
		font-size: 14px;
		color: #000000;
		text-align: left;
	}

	H1, .fn_h1
	{
		font-family: Roboto;
		font-size: 36px;
		font-weight: 900;
		line-height: 42px;
		letter-spacing: 0em;
	}

	H2, .fn_h2
	{
		font-family: Roboto;
		font-size: 20px;
		font-weight: 700;
		line-height: 23px;
		letter-spacing: 0em;
		text-transform: uppercase;
	}

	H3, .fn_h3
	{
		font-family: Roboto;
		font-size: 14px;
		font-weight: 700;
		line-height: 16px;
		letter-spacing: 0em;
		text-transform: uppercase;
	}

	P, DIV
	{
		font-family: Roboto;
		font-size: 14px;
		font-weight: 400;
		line-height: 16px;
		letter-spacing: 0em;
		text-align: left;
		box-sizing: border-box; 
	}

	.wide
	{
		font-family: Roboto;
		font-size: 14px;
		font-weight: 400;
		line-height: 23.8px;
		letter-spacing: 0em;
		text-align: left;
	}

	.small
	{
		font-family: Roboto;
		font-size: 12px;
		font-weight: 400;
		line-height: 14px;
		letter-spacing: 0em;
		text-align: left;
	}
	
	INPUT						{ box-sizing: border-box; height: 40px; width: 250px; padding-left: 10px; padding-right: 10px; color: #000000; background: #FFFFFF; border: 1px solid #9B9B9B;}
	INPUT.field					{ box-sizing: border-box; height: 40px; width: 520px; padding-left: 10px; padding-right: 10px; color: #000000; background: #FFFFFF; border: 1px solid #9B9B9B;}
	INPUT.search				{ box-sizing: border-box; height: 35px; width: 150px; color: #000000; background: #FFFFFF; border: none;}
	INPUT.radio					{ box-sizing: border-box; height: 20px; width: 20px; color: #000000; background: #FFFFFF; border: 1px solid #9B9B9B; margin-left: 0px;}
	INPUT.contact				{ box-sizing: border-box; height: 40px; color: #000000; background: #FFFFFF; border: 1px solid #9B9B9B;}
	INPUT.p100					{ box-sizing: border-box; height: 40px; width: 100%; padding-left: 10px; padding-right: 10px; color: #000000; background: #FFFFFF; border: 1px solid #9B9B9B;}
	INPUT.checkbox				{ box-sizing: border-box; height: 20px; width: 20px; color: #000000; background: #FFFFFF; border: 1px solid #9B9B9B; margin-left: 0px;}
	INPUT:focus					{ outline: none; }
	TEXTAREA					{ padding: 10px;  box-sizing: border-box; height: 40px; width: 250px; color: #000000; background: #FFFFFF; border: 1px solid #9B9B9B;}
	TEXTAREA:focus				{ outline: none; }
	SELECT						{ box-sizing: border-box; height: 40px; width: 250px; color: #000000; border: 1px solid #9B9B9B; 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.ipp					{ box-sizing: border-box; height: 25px; width: 250px; color: #000000; font-size: 16px; border: 1px solid #9B9B9B; padding-left: 10px; background: url("/filer/icons/middle/dropdown.svg") no-repeat right 7px top 4px #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					{ text-transform: uppercase; height: 40px; border: 0px solid #000000; box-sizing: border-box; padding-top: 9px; padding-left: 10px; padding-right: 10px; cursor: pointer; }
	.bu_normal:hover			{ opacity: 0.75; cursor: pointer; }
	.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; }

	.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; }
	.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: #000000; border: 0px solid #FFFFFF; border-bottom: 5px solid #FFFFFF; cursor: pointer;}
	.top_menu:hover				{ width: 100px; height: 110px; font-weight: 400; color: #000000; border: 0px solid #FFFFFF; border-bottom: 5px solid #3D5B4E; cursor: pointer; }

	.top_menu_active			{ width: 100px; height: 110px; font-weight: 700; color: #3D5B4E; border: 0px solid #FFFFFF; border-bottom: 5px solid #3D5B4E; cursor: pointer; }
	.top_menu_active :hover		{ width: 100px; height: 110px; font-weight: 700; color: #3D5B4E; border: 0px solid #FFFFFF; border-bottom: 5px solid #3D5B4E; cursor: pointer; }

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

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

	.quicksearch				{ width: 220px; height: 40px; border: 1px solid #9B9B9B; 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_popup					{ width: 510px; }
	.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% }

	#categories					{ position: relative; top: -20px; }
	#categories	.bo_bottom		{ border-bottom: 5px #3D5B4E solid; }

	/* ========== CHECKBOX & RADIOBUTTON =========== */

	/* The container */
	.in_checkbox {
	  display: block;
	  position: relative;
	  padding-left: 35px;
	  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: 20px;
	  background-color: #FFFFFF;
	  border: #9B9B9B 1px solid;
	  border-radius: 4px;
	}

	/* On mouse-over, add a grey background color */
	.in_checkbox:hover input ~ .in_checkbox_checkmark {
	  background-color: #FFFFFF;
	  border: #9B9B9B 1px solid;
	}

	/* When the checkbox is checked, add a blue background */
	.in_checkbox input:checked ~ .in_checkbox_checkmark {
	  background-color: #3D5B4E;
	}

	/* 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 {
	  left: 6px;
	  top: 2px;
	  width: 5px;
	  height: 10px;
	  border: solid #FFFFFF;
	  border-width: 0 3px 3px 0;
	  -webkit-transform: rotate(45deg);
	  -ms-transform: rotate(45deg);
	  transform: rotate(45deg);
	}


	/* The container */
	.small .in_checkbox {
	  display: block;
	  position: relative;
	  padding-left: 22px;
	  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 */
	.small .in_checkbox input {
	  position: absolute;
	  opacity: 0;
	  cursor: pointer;
	  height: 0;
	  width: 0;
	}

	/* Create a custom checkbox */
	.small .in_checkbox_checkmark {
	  position: absolute;
	  top: 0;
	  left: 0;
	  height: 14px;
	  width: 14px;
	  background-color: #FFFFFF;
	  border: #9B9B9B 1px solid;
	  border-radius: 2px;
	}

	/* On mouse-over, add a grey background color */
	.small .in_checkbox:hover input ~ .in_checkbox_checkmark {
	  background-color: #FFFFFF;
	  border: #9B9B9B 1px solid;
	}

	/* When the checkbox is checked, add a blue background */
	.small .in_checkbox input:checked ~ .in_checkbox_checkmark {
	  background-color: #3D5B4E;
	}

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

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

	/* Style the checkmark/indicator */
	.small .in_checkbox .in_checkbox_checkmark:after {
	  left: 5px;
	  top: 1px;
	  width: 3px;
	  height: 9px;
	  border: solid #FFFFFF;
	  border-width: 0 2px 2px 0;
	  -webkit-transform: rotate(45deg);
	  -ms-transform: rotate(45deg);
	  transform: rotate(45deg);
	}

	 /* Customize the label (the container) */
	.in_radiobutton {
	  display: block;
	  position: relative;
	  padding-left: 30px;
	  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: 20px;
	  background-color: #FFFFFF;
	  border: 1px solid #9B9B9B; 
	  border-radius: 50%;
	}

	/* On mouse-over, add a grey background color */
	.in_radiobutton:hover input ~ .in_radiobutton_checkmark {
	  background-color: #FFFFFF;
	  border: 1px solid #9B9B9B; 
	}

	/* When the radio button is checked, add a blue background */
	.in_radiobutton input:checked ~ .in_radiobutton_checkmark {
	  background-color: #3D5B4E;
	}

	/* 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 {
	  top: 4px;
	  left: 4px;
	  width: 12px;
	  height: 12px;
	  border-radius: 50%;
	  background: #FFFFFF;
	} 

    /* ========== 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; }
	.slider_slogan {
			width: 1200px;
			position: absolute;
			text-align: right;
	}

	.slider_piclayer {
			height: 413px;
			width: 100%;
			position: absolute;
			color: #FFFFFF;
			font-size: 22px;
			text-shadow: #000000 0px 0px 8px;
			text-align: left;
	}

	.slider_piclayer H1 {
			color: #FFFFFF;
			font-size: 26px;
	}

	.slider_piclayer A {
			color: #FFFFFF;
			text-decoration: none;
			cursor: pointer;
	}

	.slider_piclayer A:hover {
			color: #FFFFFF;
			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: #3D5B4E;
			text-decoration: none;
	}

	.slider_active A {
			color: #9B9B9B;
			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%;
	}
}