/* ==================================================================
Allgemeines Stylesheet fuer Portalseiten
Datei: standard_modules.css
Media: all

Datum: 11.10.2013
Autor:	Mucke Forßmann für grintsch communications
Internet: www.grintsch.com

Inhalt:
CSS-Anweisungen fuer Ideal Standard Portalseite(n)

Aufbau:
1.0			Box Flyout Arrow 
1.1			Box Flyout Arrow Left (Standard)
1.2			Box Flyout Arrow Top

2.0 		Result controls
2.1 		Result controls - Sorter
2.2 		Result controls - Pagination
2.3 		Result controls - Switch view
2.4 		Result controls - Switch items per page
2.5 		Result controls - Select List
2.5.1 		Result controls - Select List - Level 1
2.5.2 		Result controls - Select List - Level 2

3.0 		Socialbuttons 
3.1 		Socialbuttons Page

4.0			Facettes 
4.1 		Facettes: Box_hierarchy 
4.2 		Facettes: Box_facettes 

5.0			Sidebar-Navigation
 
6. 			Listing
6.1 		Listing: Grid view
6.1.1 		Listing: Grid view - Flyout
6.1.1.1 	Listing: Grid view - Flyout-Ausrichtung
6.1.2 		Listing: Grid view - Flytop
6.2 		Listing: List view
6.2.1 		Listing: List view - Flyout 

7.			Designer Profile

8.0			Tabs
8.1			Tab Listing
8.2			Tab content 2 Col

9.			Google Maps

10.0		Box Module (as object)
10.1		Box Module (as object) elements
10.2		Box Module (as object) modifiers




 
==================================================================== */
#content span.icon {
	position: absolute;
	
	background: url(img/sprite/no-repeat.png) no-repeat;
}

/* ======================================================

	=1.0 Box Flyout Arrow
	
========================================================= */
#content .arrow_box {
	position: relative;
	
	width: 150px;
	background: #fff;
	padding: 10px;
	border: 1px solid #C0C1C2;	
	box-shadow: 0 3px 5px rgba(0,0,0,0.3);
}
		
/* ======================================================
	=1.1 Box Flyout Arrow left
========================================================= */
#content .arrow_box .box_before,
#content .arrow_box .box_after {
	right: 100%;
	
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

#content .arrow_box .box_after  {
	border-color: rgba(255, 255, 255, 0);
	border-right-color: #fff;
	border-width: 10px;
	top: 50%;
	margin-top: -10px;
}

#content .arrow_box .box_before {
	border-color: rgba(0, 0, 0, 0);
	border-right-color: #000;
	border-width: 11px;
	top: 50%;
	margin-top: -11px;
}
	
/* ======================================================
	=1.2 Box Flyout Arrow Top
========================================================= */
#content .arrow_box_top .box_before, #content .arrow_box_top .box_after {
	top: auto;
	bottom: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

#content .arrow_box_top .box_after  {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #ffffff;
	border-width: 10px;
	left: 50%;
	margin-left: -10px;
}

#content .arrow_box_top .box_before {
	border-color: rgba(0, 0, 0, 0);
	border-bottom-color: #C0C1C2;
	border-width: 11px;
	left: 50%;
	margin-left: -11px;
}

/* ======================================================

	=2. Object: wrap

	Used in:
	- teaser_liste.html (grintsch_page_aggregator)

	@review: done

========================================================= */
.wrap {}

.wrap--facette { margin-bottom: 20px; }

	.wrap--facette__control { margin-top: 10px; }

.wrap--half { margin-bottom: 40px; }
	
/* ======================================================

	=2. Result controls

	Used in:
	- teaser_liste.html (grintsch_page_aggregator)

	@review: done

========================================================= */
.control {
	display: block;

	font-family: "museo-sans-n5", "museo-sans", sans-serif;
	font-size: 0.857em;
	font-style: normal;
	font-weight: 500;
	color: #8b8b8a;
	line-height: 1em;

	padding: 0.714em 0;
}

/* Change box model for module `.control` and content */ 
.control *, .control *:before, .control *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

.control--top {}
.control--bottom { border-top: 1px dotted #c0c1c2; }

	.control__frame { width: 100%; }
	
		.control__item {}
		.control__item--gutter { margin-left: 1.429em; }
		
			.control__item--switch-view { width: 65px; }
			.control__item--switch-num { width: 130px; }
			.control__item--pagination {}
			.control__item--select {}

	.control__text { margin: 0; }
	
/* ======================================================

	=2.1 Controls: href

========================================================= */
.control__href {
	color: #8b8b8a;
	text-decoration: none;
}

	.control__href--text {
		border-bottom: 3px solid #fff;
		margin-top: 0.357em;
		margin-left: 0.714em;
	}
	
	.control__item--pagination .control__href--text { margin-left: 1.429em; }

		.control__href--text.active { border-bottom-color: #8b8b8a; }

	.control__href--icon {
		width: 14px;
		height: 20px;
		background: url(img/sprite/no-repeat.png) no-repeat;
		margin-left: 1.429em;
	}

	.control__href--icon-list { background-position: 0 -247px; }
	.control__href--icon-grid { background-position: -50px -247px; }
	.control__href--icon-next { background-position: -250px -58px; }
	.control__href--icon-previous { background-position: -196px -58px; }
	
	
	
	
	

/* ======================================================

	=3. Select List

========================================================= */
.select-list {
	list-style-type: none;
	
	background-color: #fff;
	border: 1px solid #c0c1c2;
	border-radius: 5px;
	margin: 0;
}

	.select-list--02 {
		display: none;
		position: absolute;
		top: 30px;
		left: -1px;
		z-index: 1;

		border: 1px solid #c0c1c2;
		border-radius: 0 0 5px 5px;
		padding: 1px 0 0;
	}

	.select-list:hover .select-list--02 { display: block; }
		
		.select-list__item {
			position: relative;

			width: 170px;
			height: 33px;
			margin: 0;
		}
		
		.select-list__item:hover { background-color: #c0c1c2; }

/* ======================================================

	=3.1 Select List: Links

========================================================= */
.select-list__href {
	display: block;

	color: #8B8B8A;
	text-decoration: none;
	line-height: 32px;

	width: 150px;
	height: 33px;
	border-top: 1px dotted #c0c1c2;
	margin: -1px 10px 0;
}

.select-list__href:hover { color: #fff; }

.select-list__item--02:first-child .select-list__href { border-top: 0; }

/* ======================================================
	3.1.1 Level 1
========================================================= */
.select-list__item--01:hover {
	background-color: #fff;
	border-radius: 5px 5px 0 0;
}

	.select-list__href--01 {
		width: 170px;
		background: url("/fileadmin/templates/main/res/css/img/sprite/no-repeat_x.png") no-repeat;
		padding: 0 10px;
		border: 0;
		border-radius: 5px;
		margin: 0;
	}

	.select-list--down .select-list__href--01 { background-position: -10660px 0; }

	.select-list__href--01:hover { color: #8B8B8A; }
	


	



/* ======================================================

	=4. Tabs

========================================================= */
.tab { width: 100%; }

/* ======================================================

	=4.1 Tabs: Bereich mit Reitern

========================================================= */
.tab__head {
	display: block;
	
	border-bottom: 1px solid #f4f4f4;
	margin: 0;
}

	.tab__name {
		display: inline;
		float: left;
		
		padding: 0;
		margin: 0 1px 0 0;
	}
	
		.tab__href { 
			display: block;

			font-size: 12px;
			color: #000;
			line-height: 15px;
			text-decoration: none;
			text-transform: uppercase;

			padding: 12px 28px;
			border: 1px solid #c0c1c2;
		}
		
		.tab__href:hover,
		.tab__href:focus,
		.tab__href:active { text-decoration: none; }

		.ui-state-active .tab__href {
			background: #eee; 
			border-color: #eee;
		}

/* ======================================================

	=4.2 Tabs: Bereich mit Inhalt

========================================================= */
.tab__frame {
	position: relative;
	
	width: 100%;
	min-height: 160px;
	background-color: #eee;
}

	.tab__content {}
	
	.tab__content--img { min-height: 260px; }

		.tab__title { display: none; }

/* START: NOT REWORKED */
.js_whithout_js .tabs ul { border: none; }

	.js_whithout_js .tabs li {
		float: none;
		display: block;
	}

		.js_whithout_js .tabs li a {
			display: inline;

			text-transform: none;
			text-decoration: underline;

			border: none;
			padding: 0;
		}

		.js_whithout_js .tabs .tab_name {
			display: block;

			margin: 20px 0 5px;
		}
/* END: NOT REWORKED */

/* ======================================================

	=5. Box Object

========================================================= */
/* Change box model for module `.box` and content */ 
.box *, .box *:before, .box *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

/* object `.box` 
 *  
 * base declarations
 */ 
.box {
    position: relative;	
    width: auto;
    box-shadow: 0 0 5px #DBDBDB;

    border-bottom-width: 3px;
    border-bottom-style: solid;
    border-bottom-color: #009de4; /* @move, to carry over to colors_* stylesheets */
 }

/* ======================================================

	=4.1 Box object elements

========================================================= */
.box__frame {
    position: relative;
	
    width: 100%;
	background-color: #fff;
    padding: 0.714em 0.714em 0.2em 0.714em;
}

	.box__content {
		width: 100%;
		margin: 0;
	}

		.box__title,
		.box__subtitle {
			display: block; /* declare to allow non-block elements too */
			
			font-family: "museo-sans-n5","museo-sans",Arial,Helvetica,sans-serif;
			font-weight: 500;
			font-style: normal;
			font-size: 1em; /* 14px */
			line-height: 1.429em;
			color: #009de4; /* @colors_* stylesheets */

			margin-bottom: 5px;
		}
		
			.box__title--fix {
				overflow: hidden;

				height: 2.6em;
				margin-bottom: 0.5em
			}

		.box__subtitle { color: #686868; }

		.box__text {
			font-size: inherit;

			margin-bottom: 5px;
		}

			.box__text--small { font-size: 0.9em; }

			.box__text--last { margin-bottom: 0 !important; }
			
			.box__text--fix {
				overflow: hidden;
				
				height: 3em;
			}
			
			.box__text--fix:hover {
				height: auto;
				min-height: 3em;
			}

.box__img {
     /* puts img in line, whitespace issue */
     xxxdisplay: table;
     xxxborder: 0;
     xxx*border: 1px solid;
	 width: 100%;
}

	.box__img--left {
		 float: left;
		 margin-right: 20px;
	}

	.box__img--right {
		 float: right;
		 margin-left: 20px;
	}

.box__href {
    display: block;
    text-decoration: none;
    color: inherit;
}

	.box__href--icon {
		display: block;
		background: url(img/sprite/no-repeat_x.png) no-repeat -2893px 2px;
		padding-left: 18px;
	}

	
	
	
/* Action box */
.box__action {
	position: absolute;
	bottom: 10px;
	right: 8px;
	
    padding: 0;
    text-align: center;
}

	.box__icon {  
	   display: block;
	   width: 16px;
	   height: 12px;
	   background: url(img/sprite/no-repeat_x.png) no-repeat -2893px 2px;    
	}

	
	
	
.box__wrap {
    position: relative;
}

.box__headings {
    /* hgroup like headings within a relative/absolute contect */
}

/* ======================================================

	=4.2 Box object modifier

========================================================= */
.box--icon .box__title,
.box--icon .box__text { margin-right: 15px; }

/* ======================================================
	4.2.1 Box without border and shadow
========================================================= */
.box--naked {
    border: 0;
    box-shadow: none;
}

	.box--naked .box__frame { padding: 0; }

	.box--naked h2.box__title {
		font-size: 1.429em;
		font-weight: 300;
		line-height: 1.429em;
		text-transform: uppercase;
		
		margin-bottom: 0.714em;
	}
	
	.box--naked h3.box__subtitle {
		font-size: 1em; 
		font-weight: 300;
		line-height: 1.5em; 
		
		margin-bottom: 1em;
	}
	
	.box--naked .box__img {
		/* Font-size is essential here to correlate ratios.
		 * Setting font-size attribute on `box__img` assures an
		 * identical ratio correlated to "img -> title -> subtitle/text"
		 */
		font-size: 1.286em;
		line-height: 1.1664em;
		
		width: 100%;
		margin-bottom: 1em;
	}

/* ======================================================
	4.2.2 Download box without border and shadow

	Used in:
	- collection_view_detail.html (grintsch_is_pmd)
========================================================= */
.box--download {}

	.box--download h3.box__title { color: #686868; }

	.box--download /*p*/.box__text--download {
		color: #000;
		
		margin-top: 1em;
	}
	
		.box--download /*span*/.box__icon--download {
			display: inline-block;
			
			height: 16px;
			background-position: -14800px 0;
			margin-left: 10px;
		}

/* ======================================================
	4.2.3 Polaroid box: Copy over image

	Used in:
	- teaser.html (smarty_elements)

	@reviewed
========================================================= */
.box--enclosed {
	padding-bottom: 50px;
	border-bottom: 0;
}

	.box--enclosed .box__frame {
		position: absolute;
		bottom: 0;
		left: 0;

		padding-top: 2px;
		padding: 10px 10px 3px;
		border-bottom-width: 3px;
		border-bottom-style: solid;
		box-shadow: 0 0 6px #d0d0d0;
	}

	.box--enclosed .box__title { margin-bottom: 0; }

	.box--enclosed .box__text { margin-right: 15px; }
	
	.box--enclosed .box__action { bottom: 9px; }
	

/* ======================================================
	4.2.4 Polaroid box: Selectable border color

	Used in:
	- teaser.html (smarty_elements)

	@reviewed
========================================================= */	
.box__frame--inspiration { border-bottom-color: #EE007D; }
	.box__frame--inspiration .box__title { color: #EE007D; }
	.box__frame--inspiration .box__icon { background-position: -4093px 2px; }

.box__frame--collection { border-bottom-color: #FA5400; }
	.box__frame--collection .box__title { color: #FA5400; }
	.box__frame--collection .box__icon { background-position: -5293px 2px; }

.box__frame--product { border-bottom-color: #00AC1F; }
	.box__frame--product .box__title { color: #00AC1F; }
	.box__frame--product .box__icon { background-position: -6493px 2px; }
	
.box__frame--3d { border-bottom-color: #0D7ABF; }
	.box__frame--3d .box__title { color: #0D7ABF; }
	.box__frame--3d .box__icon {}

.box__frame--support { border-bottom-color: #FFBA00; }
	.box__frame--support .box__title { color: #FFBA00; }
	.box__frame--support .box__icon { background-position: -7693px 2px; }
	
.box__frame--about { border-bottom-color: #A2042F; }
	.box__frame--about .box__title { color: #A2042F; }
	.box__frame--about .box__icon { background-position: -8893px 2px; }
	
.box__frame--standard { border-bottom-color: #009DE4; }
	.box__frame--standard .box__title { color: #009DE4; }
	.box__frame--standard .box__icon { background-position: -2893px 2px; }
	
.box__frame--external { border-bottom-color: #000; }
	.box__frame--external .box__title { color: #000; }
	.box__frame--external .box__icon { background-position: -15093px 2px; }
	
/* ======================================================
	4.2.5 Gradient box

	Used in:
	- teaser.html (smarty_elements)

	@reviewed
========================================================= */
.box--gradient { border-bottom: 0; }

	.box--gradient .box__frame { padding: 0; }

		.box--gradient /*a*/.box__href {
			display: table-cell;
			
			color: #fff;
			vertical-align: middle;
		}
	
		.row--fix300 .box--gradient /*a*/.box__href { height: 280px; }
		.row--fix600 .box--gradient /*a*/.box__href { height: 580px; }
	
			.box--gradient .box__content { padding: 1.429em; }
		
				.box--gradient /*h2*/.box__title {
					font-size: 2.142em;
					color: #fff;
					line-height: 1.143em;
					text-transform: uppercase;
				}

				.box--gradient /*h3*/.box__subtitle {
					font-size: 1.286em;
					color: #fff;
					line-height: 1.1664em;
					text-transform: uppercase;
				}
				
				.box--gradient /*p*/.box__text {
					font-family: "museo-sans-n3","museo-sans",Arial,Helvetica,sans-serif;
					font-weight: 300;
				}
		
			.box--gradient .box__icon { background-position: -15993px 2px; }

/* Gradient colors */
.box--gradient .box__frame--standard {
	background: #204c90; /* Old browsers */
	background: -moz-linear-gradient(left,  #204c90 0%, #378cd1 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#204c90), color-stop(100%,#378cd1)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #204c90 0%,#378cd1 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #204c90 0%,#378cd1 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #204c90 0%,#378cd1 100%); /* IE10+ */
	background: linear-gradient(to right,  #204c90 0%,#378cd1 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#204c90', endColorstr='#378cd1',GradientType=1 ); /* IE6-9 */
}

.box--gradient .box__frame--blue {
	background: #12385c; /* Old browsers */
	background: -moz-linear-gradient(left,  #12385c 0%, #2a759e 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#12385c), color-stop(100%,#2a759e)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #12385c 0%,#2a759e 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #12385c 0%,#2a759e 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #12385c 0%,#2a759e 100%); /* IE10+ */
	background: linear-gradient(to right,  #12385c 0%,#2a759e 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#12385c', endColorstr='#2a759e',GradientType=1 ); /* IE6-9 */
}

.box--gradient .box__frame--purple {
	background: #3c105a; /* Old browsers */
	background: -moz-linear-gradient(left,  #3c105a 0%, #712a7f 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#3c105a), color-stop(100%,#712a7f)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #3c105a 0%,#712a7f 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #3c105a 0%,#712a7f 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #3c105a 0%,#712a7f 100%); /* IE10+ */
	background: linear-gradient(to right,  #3c105a 0%,#712a7f 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3c105a', endColorstr='#712a7f',GradientType=1 ); /* IE6-9 */
}

.box--gradient .box__frame--plum {
	background: #521233; /* Old browsers */
	background: -moz-linear-gradient(left,  #521233 0%, #87004e 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#521233), color-stop(100%,#87004e)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #521233 0%,#87004e 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #521233 0%,#87004e 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #521233 0%,#87004e 100%); /* IE10+ */
	background: linear-gradient(to right,  #521233 0%,#87004e 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#521233', endColorstr='#87004e',GradientType=1 ); /* IE6-9 */
}

.box--gradient .box__frame--aqua {
	background: #0e3842; /* Old browsers */
	background: -moz-linear-gradient(left,  #0e3842 0%, #216875 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#0e3842), color-stop(100%,#216875)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #0e3842 0%,#216875 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #0e3842 0%,#216875 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #0e3842 0%,#216875 100%); /* IE10+ */
	background: linear-gradient(to right,  #0e3842 0%,#216875 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e3842', endColorstr='#216875',GradientType=1 ); /* IE6-9 */
}

.box--gradient .box__frame--grey {
	background: #2c3d4f; /* Old browsers */
	background: -moz-linear-gradient(left,  #2c3d4f 0%, #758c9f 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#2c3d4f), color-stop(100%,#758c9f)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #2c3d4f 0%,#758c9f 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #2c3d4f 0%,#758c9f 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #2c3d4f 0%,#758c9f 100%); /* IE10+ */
	background: linear-gradient(to right,  #2c3d4f 0%,#758c9f 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c3d4f', endColorstr='#758c9f',GradientType=1 ); /* IE6-9 */
}

.box--gradient .box__frame--pink {
	background: #8d006b; /* Old browsers */
	background: -moz-linear-gradient(left,  #8d006b 0%, #b50078 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#8d006b), color-stop(100%,#b50078)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #8d006b 0%,#b50078 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #8d006b 0%,#b50078 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #8d006b 0%,#b50078 100%); /* IE10+ */
	background: linear-gradient(to right,  #8d006b 0%,#b50078 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8d006b', endColorstr='#b50078',GradientType=1 ); /* IE6-9 */
}

.box--gradient .box__frame--indigo {
	background: #32255b; /* Old browsers */
	background: -moz-linear-gradient(left,  #32255b 0%, #788cb6 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#32255b), color-stop(100%,#788cb6)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #32255b 0%,#788cb6 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #32255b 0%,#788cb6 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #32255b 0%,#788cb6 100%); /* IE10+ */
	background: linear-gradient(to right,  #32255b 0%,#788cb6 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#32255b', endColorstr='#788cb6',GradientType=1 ); /* IE6-9 */
}

.box--gradient .box__frame--orange {
	background: #6c2b09; /* Old browsers */
	background: -moz-linear-gradient(left,  #6c2b09 0%, #c04c1d 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#6c2b09), color-stop(100%,#c04c1d)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #6c2b09 0%,#c04c1d 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #6c2b09 0%,#c04c1d 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #6c2b09 0%,#c04c1d 100%); /* IE10+ */
	background: linear-gradient(to right,  #6c2b09 0%,#c04c1d 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6c2b09', endColorstr='#c04c1d',GradientType=1 ); /* IE6-9 */
}

/* ======================================================
	4.2.6 Polariod box: with flyout

	Used in:
	- productType_list.html (grintsch_is_pmd)
	- productType_list_byProductType.html (grintsch_is_pmd)
	- collection_list_byProductType.html (grintsch_is_pmd)
	- product_list_grid.html (grintsch_is_pmd)

	@toReview
========================================================= */
.box--flyout:hover { box-shadow: 0 8px 12px -1px #999; }
    
	.box--flyout:hover .box__flyout { display: block; }

	.box__flyout {
		display: none;
		position: absolute;
		z-index: 9999;
		
		width: 100%;
		background-color: #fff;
		border-top-width: 3px;
		border-top-style: solid;
		box-shadow: 0 8px 12px -4px #333;
	}

		.box__flyout .box__frame { padding: 15px 15px 20px; }

		.box__flyout .box__content {
			width: 100%;
			margin: 0;
		}
		
			.box__flyout .box__text { margin-right: 0; }
			
.box__flyout--long-text {
	top: 322px;
	
	border-top: none !important;
}

	.box__href--long-text { position: relative; }

	.box__long-text {
		min-height: 3.9em;
		padding: 0 25px 10px 10px;
		background: #fff;
		border-bottom: 3px solid #009DE4;
		margin: -48px 0 0;
	}
	
	.box__flyout--long-text .box__action { bottom: 14px; }
	
/* ======================================================
	4.2.7 Polaroid box: Product grid view

	Used in:
	- product_list_grid.html (grintsch_is_pmd)
	- product_view_details.html (grintsch_is_pmd)

	@reviewed
========================================================= */
.box--product {}

	.box--product .box__img { border-bottom: 1px dotted #C0C1C2; }

	.box--product .box__title {
		overflow: hidden;

		height: 2.7em;
		margin-right: 0;
	}

	.box--product .box__text--small {
		overflow: hidden;

		height: 3em;
	}
	
	.box--product .box__text--more {
		background: url(img/sprite/no-repeat_x.png) no-repeat -6500px 7px;
		padding-left: 15px;
	}
	
	.box--product .box__flyout .box__text { margin-bottom: 0.857em; }
	
.box--product .box__note {
	position: absolute;
	top: 5px;
	right: 0;
}
	
/* ======================================================
	4.2.8 Horizontal box: Small image with text at the right

	Used in:
	- list.html (smarty_elements/smarty_templavoila)

	@reviewed
========================================================= */	
.box--horizontal {
	xxxbackground-color: lightblue;
}

	.box--horizontal .box__img {
		width: 160px;
		height: auto;
	}	
	
	.box--horizontal .box__frame { padding-left: 20px; }

	.col--fix6 .box--horizontal .box__frame { width: 300px; }	
	
	.col--fix9 .box--horizontal .box__frame { width: 540px; }	
	

	
	
	

/* Used ??? */
.box--enclosure .box__wrap {
    position: relative;
}

	.box--enclosure .box__headings  {
		position: absolute; 
		right: 15px;
		bottom: 15px;
		padding: 15px;
		width: 300px;
		background-color: #fff;
		background-color: rgba(255, 255, 255, 0.8);
	}

	.box--enclosure .box__title, .box--enclosure .box__subtitle {
		margin-bottom: 0;
	}

	.box--enclosure h2.box__subtitle {
		font-size: 14px;
		font-style: normal;
		font-weight: 100;
	}

	.box--enclosure .box__text {}


/* Used ??? */	
.box__linklist {
    list-style: none;	
	width: 100%;
    margin: 0;
    padding: 0;
} 

.box__linklist li {
    
    /* neutralize temporarily because of
     * `#content .listing ul.grid li` cascade
     */
/*    float: none!important;*/
  /*  margin: 0!important;*/
    
    border-top: 1px solid #eee;
}

.box__linklist li:first-child {  
    border-top: 0;
}

.box__linklist /*a*/.box__href--icon {
    font-size: 13px;
	line-height: 1.5;
    padding-top: 5px;
    padding-bottom: 5px;
    text-decoration: none;
    background-position: -2893px 8px;
}

.box__linklist /*a*/.box__href--icon:hover {
    color: #009de4;
}





/* ======================================================

	=5. Listview object
	
	Used in:
	- teaser_liste.html (grintsch_page_aggregator)
	- brochure_list.tpl (grintsch_download_center)
	- download_list.tpl (grintsch_download_center)

========================================================= */
/* Change box model for module `.listview` */ 
.listview *, .listview *:before, .listview *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

/*ul*/.listview {   
    width: 100%;
    
	padding: 0;
	margin: 0;
}

	/*ul*/.listview li {  
		list-style: none;
		
		padding: 16px 0;
		border-top: 1px dotted #c0c1c2;
		margin-left: 0;
	}

	/*ul*/.listview li:first-child { xxxborder: none; }
	
/* ======================================================
	=5.0.1 Listview object support elements
========================================================= */
/*h2,h3*/.listview-headline { margin-bottom: 10px; }

/* ======================================================

	=5.1 Listview object elements 

========================================================= */
/* ======================================================
	=5.1.1 Listview object elements - Image
========================================================= */
.listview__wrap-img {
	width: 220px;
	margin: 0 20px 0 0;
}

	.listview__img {
		width: 100%;
		box-shadow: 0 0 5px #DBDBDB;
	}

.listview__wrap-img--video {
	position: relative;
	width: 380px;
}	
	
	
/* ======================================================
	=5.1.2 Listview object elements - Text
========================================================= */
.listview__content {}
	
	.listview__title,
	.listview__subtitle {
		/* Enable non-block elements like span to use */
		display: block;

		font-style: normal;
		color: #686868;
		
		margin-bottom: 0.714em;
	}

	.listview__title {   
		font-size: 1.286em; /* 18px, 18px / 14px = 1.286 */ 
		line-height: 1.1664em; /* 1.5 / 1.286 */
	}

	.listview__subtitle {   
		font-size: 1em; /* 14px, 14px / 14px = 1 */ 
		line-height: 1em; 
	}

	.listview__marginale {
		font-size: 0.857em; /* 12px, 12px / 14px = 0.857 */
		line-height: 0.857em;
		margin-bottom: 0.857em;
	}

	.listview__text {}
	.listview__text--date {}

	.listview__text--small {
		font-size: 0.857em; /* 12px, 12px / 14px = 0.857 */ 
		line-height: 0.857em;
		margin-bottom: 0.857em;
	}
	
	.listview__text--last { margin-bottom: 0; }
	
/* ======================================================
	=5.1.3 Listview object elements - Link
========================================================= */
/*a*/.listview__href { 
	color: #686868;
	text-decoration: none; 
}

	.listview__href--colored:hover { 
		color: #0D7ABF;
		text-decoration: underline;	
	} 
	
	
	/*a*/.listview__href:hover {}
	
/*a*/.listview__href--block { display: block; }

	/*a*/.listview__href--block:hover { color: #686868; }

/*[a|span]*/.listview__href--icon {
	color: #686868;
	text-decoration: none;
}

	/*[a|span]*/.listview__href--icon:hover {
		color: #009de4; /* @colors_* stylesheets */
		text-decoration: underline;
	}

	/*[a|span]*/.listview__href--icon:before {
	   display: inline-block;

	   content: "";

	   width: 16px;
	   height: 12px;
	   background: url(img/sprite/no-repeat_x.png) no-repeat -2898px 4px; /* @colors_* stylesheets */
	   padding-left: 16px;
	}

/* Start: @review */
.listview__href--btn {
	font-size: 14px;
	font-style: normal;
	font-weight: 100;
	color: #fff;
	text-align: center;
	text-decoration: none;
	/*line-height: 1.25;*/
	padding: 8px 16px;
	cursor: pointer;
	
    /* @move, to carry over to colors_* stylesheets */
	background: #009de4;
	
    border-width: 1px;
    border-style: solid;
    
    /* @move, to carry over to colors_* stylesheets */
    border: 3px solid #009de4;
}

.listview__href--btn:hover {
    /* @move, to carry over to colors_* stylesheets */
    border-color: #ccc;
    color: #000;
    background-color: #ccc;
}
/* End: @review */
  
/* ======================================================

	=5.2 Listview object modifier 

========================================================= */
.listview--productlist /* object element */ {}
.listview--downloadlist /* object element */ {}
.listview--teaser /* object element */ {}



/* ======================================================

	=6. Media object 

	@toReview
========================================================= */

.media {
    /* no declaration neccessary yet */
}

.media ul {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
}

.media li {
    background: none!important;
    padding: 0!important;
    margin: 0!important;
}

.media img {
    display: block;
}

.media p {
    padding: 0;
    /*margin: 0 0 10px 0!important;*/
}

/* ======================================================

	=5.1 Media object modifier (with modifier elements)

========================================================= */
 
.media--model {
    /* no declaration neccessary yet */
}

.media--model__headline {
    font-size: 14px;
    /*margin-bottom: 20px;*/
    letter-spacing: normal;
}

/* elements of modifier object `.media--model` */
.media--model__imgview, 
.media--model__description {
    display: inline-block;
    vertical-align: top;
    letter-spacing: normal;
    /* IE7 */
    *display: inline;
    *zoom: 1;
}

.media--model__imgview {
    /* 42px + 10px right pseudo margin */
    width: 52px;
}

.media--model__description {
    width: 60%;
}

.media--model__col {
    display: inline-block;
    vertical-align: top;
    letter-spacing: normal;
    width: 33%;
    /* IE7 */
    *display: inline;
    *zoom: 1;
}

/* elements of modifier object `.media--model` 
 * within object `.accordion-prefixed`
 */
.accordion__heading .media--model__imgview,
.accordion__heading .media--model__description {
    vertical-align: middle;
}

.media--model table {
    padding: 10px 15px 0 15px;
}







/* ======================================================

	=6. Accordion object

========================================================= */
/**
 * As there is a `.accordion` class used within
 * the current stylesheet(s), we set a temporarily
 * class with verbose naming to avoid conflicts while
 * merging styles later on.
 *
 * Please have in mind that all modifier/elements name
 * assumes a class called `.accordion`.
 *
 * So it is correct to have a
 
    // modifier
    `.accordion--model`
    
    // or element
    `.accordion__heading`
 *
 */
 
/* Change box model for module `.listview` */ 
.accordion-prefixed *, .accordion-prefixed *:before, .accordion-prefixed *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

.accordion-prefixed { border-bottom: 1px dotted #C0C1C2; }
    
.accordion-headline {}

.accordion-gradient { border-bottom: none; }

/* ======================================================

	=6.1 Accordion object elements

========================================================= */
.accordion__pane {
    /* no declaration necessary yet */
}

	.accordion__pane p,
	.accordion__pane ul { margin: 10px 15px 0; }
		

	.accordion__pane p:last-child,
	.accordion__pane ul:last-child { margin-bottom: 45px; }
	
/* ======================================================
	=6.1.1 Accordion object elements: Table
========================================================= */
.accordion__pane table {
    text-align: left;
	
	width: 100%;
    margin-bottom: 30px;
}

	.accordion__pane table th {
		font-weight: 500;
		text-align: left;
		
		padding-bottom: 5px;
	}
	
	.accordion__pane table td {
		padding: 5px 0;
		border-top: 1px dotted #C0C1C2;
	}
	
	.accordion__pane table td { width: 33%; }
	
	.accordion__pane table td:nth-child(1) { width: 40%; }
	
	.accordion__pane table td:nth-child(2) { width: 40%; }
	
	.accordion__pane table td:nth-child(3) { width: 20%; }


 /* ======================================================
	=6.1.1 Accordion object elements: Child elements
========================================================= */   
.accordion__heading { 
    position: relative;
    cursor: pointer;
    border-top: 1px dotted #C0C1C2;
    padding: 10px 15px;
    margin: 0;
}

.accordion__heading:hover {
    /* debug */
    color: #555;
}

	.accordion-headline + .accordion__heading { border: none; }

		/*.accordion__heading*/ /*i*/.toggleview {
			position: absolute;
			right: 15px;
			top: 42%;
			width: 10px;
			height: 10px;
			background: url(img/sprite/no-repeat.png) -200px 0 no-repeat;
		}

		/*.accordion__heading*/.current /*i*/.toggleview  {
			background-position: -250px 0;
		}

/* ======================================================

	=6.2 Accordion modifier: Gradient

	Used in:
	- product_view_details.html (grintsch_is_pmd)

	@reviewed
========================================================= */
.accordion__heading--gradient {
	text-transform: uppercase;
	
	padding: 20px 60px 20px 20px;
	border-top: 3px solid #fff;
}

	/*.accordion__heading--gradient*/ /*i*/.toggleview--gradient {
		top: 50%;
		right: 20px;

		width: 31px;
		height: 19px;
		background: url(img/sprite/no-repeat_v1-1.png) no-repeat -240px -43px;
		margin-top: -10px;
	}
	
	.accordion__heading--gradient.current {
		background-color: #F2F1ED;
		background-image: none;	
		filter: none;
	}
	
	/*.accordion__heading--gradient*/.current /*i*/.toggleview--gradient { background-position: -240px 0; }

	.accordion__pane--gradient { padding-right: 20px; }
	
		.accordion__pane--gradient ul { margin: 0 !important; }
		.accordion__pane--gradient p:last-child  { margin-bottom: 0 !important; }
		




/* ======================================================

	=7. List object

	Used in:
	- collectionGroup_list_collectionsByCollectionGroup.html (grintsch_is_pmd)

========================================================= */
/* Change box model for object `.lists` */ 
.lists *, .lists *:before, .lists *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

/*ul*/.lists {
    list-style: none;
	margin: 0;
}

	/*ul*/.lists li {
		padding-top: 6px;
		padding-bottom: 6px;
		border-bottom: 1px dotted #c0c1c2;
		margin: 0;
	}
	
		/*ul*/.lists li:first-child { border-top: 1px dotted #c0c1c2; }

	/*ul*/.lists a { text-decoration: none; }

	/*ul*/.lists a:hover,
	/*ul*/.lists li > span,
	/*ul*/.lists .active { color: #009de4; } /* @colors_* stylesheets */

/* ======================================================

	=7.1 List object elements

	No solitude object elements yet...

========================================================= */

/* ======================================================

	=7.2 List object modifiers

========================================================= */
/* ======================================================
	=7.2.1 List object modifiers - Link list with icon
========================================================= */
.lists--linklist { width: 100%; }

	.lists--linklist li {
	   background: url(img/sprite/no-repeat_x.png);
	   background-repeat: no-repeat;
	   background-position: -2898px 12px; /* @colors_* stylesheets */
	}
	
	.lists--linklist li:first-child { border-top: 0; }

		.lists--linklist a {
			display: inline-block;
			
			color: #686868;

			width: auto;
			padding-left: 20px;
		}

/* ======================================================
	=7.2.2 List object modifiers - Link list as block with icon
========================================================= */
.lists--linklist-block li { padding: 0; }

	.lists--linklist-block a {
	   display: block;

	   padding-top: 6px;
	   padding-bottom: 6px;
	}



	
	
	
	

/**
 * object modifier
 *
 * Vertical linklist with inline content
 */
.lists--linklist-inline {
    letter-spacing: -0.31em;
    display: table;
}

.lists--linklist-inline li {
   display: inline-block;
   vertical-align: middle;
   letter-spacing: normal;
   
   /* important needed. Overwrites `:first-child` declaration of .lists li */
   border: 0!important;
}


/**
 * object modifier
 *
 * Avoid borders on list
 */
.lists--borderless {}
.lists--borderless li, .lists--borderless li:first-child {
   border: 0;
}




/**
 * object modifier
 *
 * Build a tree of lists
 */
/*ul*/.lists--tree, /*ul*/.lists--tree ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* second level */
.lists--tree ul a,
.lists--tree ul span, 
.lists--tree ul .lists--tree__level > span {
    padding-left: 40px;
}
.lists--tree ul li {
    /* @move, to carry over to colors_products.css stylesheets */
    background-position: -2878px 12px;
}

/* third level */
.lists--tree ul ul a, 
.lists--tree ul ul span,
.lists--tree ul ul .lists--tree__level > span {
    padding-left: 60px;
}
.lists--tree ul ul li {
    /* @move, to carry over to colors_products.css stylesheets */
    background-position: -2858px 12px;
}

/* fourth level */
.lists--tree ul ul ul a, 
.lists--tree ul ul ul span {
    padding-left: 80px;
}
.lists--tree ul ul ul li {
    /* @move, to carry over to colors_products.css stylesheets */
    background-position: -2838px 12px;
}

.lists--tree__level > ul > li {
    /* important needed. Overwrites `:first-child` declaration of .lists li */
    border-top: 0!important;
}

.lists .lists--tree__level {
    border-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: 20px;
}

.lists .lists--tree__level > a {
    font-weight: 500;
}

.lists--tree__level > span, .lists--tree__level > a  {
    display: block;
    padding-top: 6px;
    padding-bottom: 6px;
    border-bottom: 1px dotted #c0c1c2;
}		


/* ======================================================

	8. Object: List

	Simplified lists object

	Used in:
	- grintsch_navigation
	- grintsch_pageaggregator
	- generic_hierachy.html (grintsch_is_pmd)

	@inReview

========================================================= */
/*ul*/.list {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	
	list-style-type: none;
	
	margin: 0;
}

/*h2*/.list-title {
	font-size: 1.286em;;
	line-height: 1.1664em;
	text-transform: uppercase;
}

/*h3*/.list-subtitle { margin-bottom: 5px; }

/* ======================================================

	8.1 Object: List - Elements

========================================================= */
/*li*/.list__item {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	
	margin: 0;
}

/*li*/.list__item--last {}

	/*a|p*/.list__href {
		display: block;

		color: #686868;
		text-decoration: none;

		padding: 6px 0 6px 20px;
		border-bottom: 1px dotted #C0C1C2;
		margin: 0;
	}
	
	/*a|p*/.list__href--disabled { opacity: 0.5; }
		
/* ======================================================

	8.2 Object: List - Modifier

========================================================= */
/* ======================================================
	8.2.1 Object: List - Modifier --linklist
========================================================= */
/*ul*/.list--linklist {}

	.list--linklist /*li*/.list__item {}
	
		.list--linklist /*a*/.list__href { background: url("img/sprite/no-repeat_x.png") no-repeat -2898px 13px; /* @colors_* stylesheets */ }
		
		.list--linklist /*a*/.list__href--active { color: #009de4; }
		
/* ======================================================
	8.2.2 Object: List - Modifier --multiselect
========================================================= */
/*ul*/.list--multiselect {}

	.list--multiselect /*li*/.list__item {  }
	
		.list--multiselect /*a|p*/.list__href { background: url("img/sprite/no-repeat_x.png") no-repeat -17798px 10px; }
				
		.list--multiselect /*a*/.list__href:hover,
		.list--multiselect /*a*/.list__href--active {
			color: #00ac1f;
			
			background-position: -18798px 10px;
		}
		
			.list--multiselect /*a*/.list__href > span { color: #999; }
			
/* ======================================================
	8.2.3 Object: List - Modifier --treelist
========================================================= */
/*ul*/.list--tree {}

	/*ul*/.list--tree ul { margin-left: 20px; }
	
		.list--tree /*li*/.list__item--level01 { margin-bottom: 20px; }

			.list--tree .list__item--title,
			.list--tree /*a*/.list__href--level01 {
				font-family: "museo-sans-n5","museo-sans",Arial,Helvetica,sans-serif;
				font-weight: 500;
				text-transform: uppercase;
			}
			
			.list--tree .list__item--title {
				padding: 8px 0 6px;
				border-bottom: 1px dotted #C0C1C2;
				margin: 0 0 0 20px;
			}
				
	
			
		

		

/* ======================================================

	8.3 Object: List - Special surroundings

========================================================= */
/*div*/.wrap-col--double .list--linklist /*li*/.list__item:nth-child(odd) { padding-right: 10px; }
/*div*/.wrap-col--double .list--linklist /*li*/.list__item:nth-child(even) { padding-left: 10px; }
	


/* ======================================================

	=8. Locate-views object

========================================================= */


/* Rewrite/redeclare of product locate navigation
 *  
 * Based on current template markup
 */ 

/*div*/.locate-views {}


.locate-views p[class*="locate-views__push"] {
    border-top: 1px dotted #c0c1c2;
}

.locate-views a {
    text-decoration: none;
}

.locate-views a:hover, .locate-views a:focus, .locate-views a:active {
    text-decoration: none;
}

/* overrides from within other objects */
.locate-views .lists li:first-child {
    border-top: 0;
}

.locate-views .lists li a {
    display: block;
}




/* ======================================================

	=8.1 Locate-views object elements

========================================================= */

/* simulate a list item view */
.locate-views__liststyle {
    padding-top: 6px;
    padding-bottom: 6px;
    margin: 0;
}

.locate-views__push-3 a,
.locate-views__push-3 span {
    padding-left: 20px;
}

.locate-views__push-4 a,
.locate-views__push-4 span {
    padding-left: 40px;
}

.locate-views__active {
    /* @move, to carry over to colors_products.css stylesheets */
    color: #009de4;
    border-bottom: 1px dotted #c0c1c2;
}

.locate-views__control {
    padding-top: 6px;
    padding-bottom: 6px;
    text-align: right;
    margin-top: 15px;
}


/* ======================================================

	=8.2 Locate-views object modifier

========================================================= */

.locate-views--filter {
    margin-top: 50px;
}

/* elements */
.locate-views--filter__caption {
    position: relative;
}
.locate-views--filter__caption span {
    position: absolute;
    top: 5px;
    right: 0;
    font-size: 14px;
} 

/* modify other objects elements within the current context */
.locate-views--filter .accordion__heading {
    border-top: 0;
    border-bottom: 1px dotted #c0c1c2;
    padding-left: 0;
    padding-right: 0;
}

.locate-views--filter .toggleview {
    right: 0;
    top: 12px;
}

.locate-views--filter .accordion-prefixed {
    border-bottom: 0;
}

.locate-views--filter .accordion__pane ul {
    margin: 0;
}

.locate-views--filter .lists li:first-child {
    border-top: 0;
}
    
.locate-views--filter .lists a {
    display: block;
}

.locate-views--filter .lists a {
   display: block;
}

.locate-views--filter .lists a > span {
   color: #999;
}

/*i*/.locate-views__check {
   display: inline-block;
   width: 18px;
   height: 18px;   
   vertical-align: text-top;
   padding-left: 20px;
   background: url(img/sprite/no-repeat.png) no-repeat -150px -338px;
}

.locate-views--filter .lists a:hover .locate-views__check,
/* following declaration only exists
 * to set this class on reload of page
 */
.locate-views--filter__active .locate-views__check {
   background-position: -400px -338px;
}

.locate-views--filter__active {
   /* @move, to carry over to colors_* stylesheets */
   /*color: #009de4; */
}

.locate-views--filter .locate-views__control {
    text-align: left;
    margin-left: 0;
    margin-bottom: 15px;
}

.locate-views--filter .locate-views__control-inner {
    text-align: right;
    margin-right: 0;
    margin-bottom: 15px;
}

.locate-views--filter .lists a img {
    vertical-align: middle;
    margin: 0 5px;
}





/* ======================================================

	=NOT REVIEWED

========================================================= */

	
/* ======================================================

	=4. Facetten

========================================================= */


/* actually empty */

/* ======================================================

	=4.2 Facetten: Price Slider

========================================================= */	
.ui-slider {
	position: relative;
	
	text-align: left;
	
	border: 1px solid #c0c1c2;
	margin: 20px 10px;
}

#content .ui-slider .ui-slider-handle {
	position: absolute;
	z-index: 2;
	
	width: 1.2em;
	height: 1.2em;
	background: #eee;
	border: 1px solid #c0c1c2;
	border-radius: 2px;
	
	cursor: default;
}

.ui-slider .ui-slider-range {
	display: block;
	position: absolute;
	z-index: 1;
	
	font-size: .7em;
	
	background: #ddd;
	border: 0;
}

.ui-slider-horizontal { height: .8em; }

.ui-slider-horizontal .ui-slider-handle {
	top: -.3em;
	
	margin-left: -.6em;
}

.ui-slider-horizontal .ui-slider-range {
	top: 0;
	
	height: 100%;
}

.ui-slider-horizontal .ui-slider-range-min { left: 0; }
.ui-slider-horizontal .ui-slider-range-max { right: 0; }
		
#js_PriceForm {
	display: block;
	
	padding: 0 0 10px
}
	
#js_PriceForm input.btn {
	display: block;
	overflow: hidden;
	
	text-indent: -999px;

	height: 25px;
	width: 20px;
	background: #fff url("img/sprite/no-repeat.png") no-repeat -245px -56px ;
	padding: 5px;
	border: 1px solid #c0c1c2;
	border-radius: 2px;	
}

/* ======================================================

	=9. googleMaps

========================================================= */
/* REWORKED ??? */
#containerContactMaps .colx4 { width: 220px;}