/** 
* BASE STRUCTURE & FORMATTING SETTINGS
**/

body { background: #f5f5f5 url(../images/bricks/bg-body.gif) center top repeat-y; font-family: Arial; color: #666666; font-size: 12px; line-height: 1.5em; }
form { padding: 0px; margin: 0px; }
div.clear { clear: both; }

img { border: 0px none; }
img.imageleft { float: left; margin: 10px 10px 10px 0px; }
img.imageright { float: right; margin: 10px 0px 10px 10px; }

a { text-decoration: none; color: #08b2f0; }
a:hover { text-decoration: underline; }
a.more { display: block; padding: 0px 0px 0px 10px; background: url(../images/bricks/gt.gif) left center no-repeat; }

h1 {line-height:28px; font-size: 16px;}

p, ul, ol { margin: 1em 0em; padding: 0px; }
ul { list-style-type: none; list-style: none; }
ul li { background: url(../images/bricks/ul.gif) 0em 0.5em no-repeat; padding: 0px 0px 0px 15px; margin: 0px 0px 0.2em; }
ol li { margin: 0px 0px 0.2em 2em; }
.caption { margin: 1.5em 0em !important; color: #8c8c8c !important; font-size: 17px !important;}


/* main container */ 
#page { width: 960px; padding: 0px 10px; margin: 0px auto; }

/* top part of the site */
#top { height: 121px; position: relative; overflow: hidden; }

	/* hidden for normal users */
	#jumptocontent { position: absolute; left: -1000px; }
	
	/* ul with main menu */
	#mainmenu { position: absolute; right: 10px; top: 88px; list-style-type: none; margin: 0px; padding: 0px; }
		#mainmenu li { float: left; margin: 0px 0px 0px 20px; padding: 0px; font-size: 17px; background: none; }
		#mainmenu li a { color: #999999; }
		#mainmenu li a.active, #mainmenu li a:hover { color: #08b2f0; text-decoration: none; }
		/**
		  * logo is in main menu, so it looks nice in text browsers,
		  * width is exactly 10px, so we can set position of left edge using 'right' attribute (left = right - 10px)
		  * we cannot use left, because left edge of main menu depends on count of menu items
		  * image is propably widther than 10px so it's 'out of the box', but we don't care 
		**/
		#mainmenu #logo { position: absolute; right: 938px; bottom: 0; width: 10px; height: 10px; overflow: visible; }
		#mainmenu #logo img { position: absolute; left: 0px; bottom: 0px; }
	
	/* ul with site menu (langs, sitemap, etc) */
	#sitemenu { position: absolute; right: 10px; top: 10px; list-style-type: none; margin: 0px; padding: 0px; }
		#sitemenu li { float: left; margin: 0px 0px 0px 10px; padding: 0px 0px 0px 11px; background: url(../images/bricks/border-sitemenu.gif) left center no-repeat; }
		#sitemenu li:first-child { margin: 0px; padding: 0px; background: none; }
		#sitemenu li a { color: #999999; }
		#sitemenu li a.active, #mainmenu li a:hover { color: #08b2f0; text-decoration: none; }
		#sitemenu li.lang a { color: #999999; font-weight: bold; }
		#sitemenu li.lang a.active, #mainmenu li.lang a:hover { color: #00549a; text-decoration: none; }
	
	#banner { height: 163px; width: 960px; }
		#banner img { height: 163px; width: 960px; }
	#banner.index { height: 253px; overflow: hidden; }
	
	#content { margin: 0px 0px 30px; }
		#path { padding: 5px 0px; margin: 0px 0px 7px; background: url(../images/bricks/border-hdot.gif) left bottom repeat-x; }
		#path p { margin: 0px 15px; font-size: 11px; vertical-align: middle; color: #999999; }
		#path p img { vertical-align: middle; margin: 0px 3px; }
		#path p a { color: #999999; }
		#path p .current { color: #f0064d; }
		
		.basic-layout { background: url(../images/bricks/border-columnright.gif) 793px 0px repeat-y; padding-top: 10px; }
			.basic-layout h1 { margin: 0px 0px 15px; font-size: 22px; font-weight: normal; color: #666666; width: 450px; line-height: 1.2em; }
			.basic-layout .column { float: left; }
			.basic-layout .column-left { width: 220px; margin-right: 35px; }
			
			.basic-layout .column-main { width: 520px; margin-right: 18px; position: relative; }
				.basic-layout .column-main .tools { position: absolute; top: 0px; right: 0px; width: 70px; }
				.basic-layout .column-main .tools a { margin-left: 10px; outline: 0px; }
				.basic-layout .column-main .tools .view { width: 33px; height: 25px; margin-left: 1px; float: right; background: url(../images/bricks/view.gif) 0px 0px no-repeat; }
				.basic-layout .column-main .tools .list { background-position: 0px 0px; }
				.basic-layout .column-main .tools .tble { background-position: -33px 0px; }
				.basic-layout .column-main .tools .list.active { background-position: 0px -25px !important; }
				.basic-layout .column-main .tools .tble.active { background-position: -33px -25px !important; }
				
				.basic-layout .column-main .sorttools { width: 380px !important; text-align: right; }
				.basic-layout .column-main .sorttools a { margin: 0px !important; }
				.basic-layout .column-main .sorttools img { vertical-align: middle; }
				
			.basic-layout .column-right { width: 165px; }
				.basic-layout .column-right h2 { margin: 0px 0px 15px; font-size: 17px; font-weight: normal; color: #1f69a7; }
				.basic-layout .column-right .block { padding: 0px 0px 0px 15px; margin: 0px 0px 20px; } 
				.basic-layout .column-right .catalougeblock p { background: url(../images/bricks/bg-catalougeblock-right.gif) left top no-repeat; width: 136px; height: 78px; padding: 15px 0px 0px 12px; font-size: 11px; line-height: 1.2em; }
			
			.basic-layout .pager { color: #999999; }
				.basic-layout .pager .left { float: left; width: 155px; margin-right: 10px; }
				.basic-layout .pager .right { float: left; width: 155px; margin-right: 10px; text-align: right; }
				.basic-layout .pager .main { float: left; width: 155px; margin-right: 10px; text-align: center; }
				.basic-layout .pager input { width: 25px; vertical-align: middle; text-align: center; color: #999999; }
			
		.submenu { padding: 0px; margin: 0px 0px 25px; list-style-type: none; list-style: none; background: none; border-bottom: solid 1px #eef3ec; }
		.submenu ul { padding: 0px; margin: 0px; list-style-type: none; list-style: none; background: none; }
		.submenu li { margin: 0px; padding: 0px; border-top: solid 1px #eef3ec; background: none; }
		.submenu li a { font-weight: bold; display: block; padding: 5px 5px 5px 25px; background: url(../images/bricks/dot.gif) 16px 11px no-repeat; }
		.submenu li a.active { color: #f1074e; }
		.submenu .title { font-size: 22px; color: #1f69a7; padding: 0px 5px 10px 15px; background: none; border: 0px none; }
		.submenu li li a { padding-left: 40px; background: url(../images/bricks/ul-blue.gif) 31px 11px no-repeat; font-weight: normal; }
		.submenu li li li a { padding-left: 55px; background: url(../images/bricks/ul-blue.gif) 46px 11px no-repeat; font-weight: normal; }
		
		.searchblock { background: #f0f3ec; padding: 15px; }
		.searchblock .title { font-size: 17px; color: #1f69a7; font-weight: normal; margin: 0px; padding: 0px; }
		.searchblock p { text-align: center; margin: 10px 0px; }
		.searchblock p.input { height: 24px; background: url(../images/bricks/search-input.png) center top no-repeat; }
		.searchblock p.input input { position: relative; top: 4px; width: 150px; height: 16px; vertical-align: middle; padding: 0px; border: 0px none; background: #FFFFFF; }
		.searchblock p.submit input { width: 112px; height: 24px; }
		.searchblock p.advanced { line-height: 11px; vertical-align: middle; text-align: left; }
		.searchblock p.advanced a { display: block; padding-left: 15px; background: url(../images/bricks/icon-search-advanced.gif) left center no-repeat; }
		
		.list-block { list-style-type: none; list-style: none; margin: 10px 0px; padding: 0px; }
		.list-block li { display: block; margin: 10px 0px; padding: 0px; background: none; }
		.list-block p { margin: 0px; }
		
		.list-horizontal { overflow: hidden; }
		.list-horizontal li { float: left; margin-right: 10px; }
		
		.tabs { width: 520px; }
		.tabs a { outline: 0px; }
		.tabs .buttons { background: #f0f3ec; font-size: 16px; color: #999999; padding: 5px 5px 0px; }
		.tabs .buttons a { float: left; width: 255px; height: 37px; line-height: 37px; vertical-align: middle; text-align: center; color: #999999; }
		.tabs .buttons a.active { background: url(../images/bricks/tab-active.gif) center center no-repeat; }
		
		.tabs .cards { padding: 15px 5px 0px; }
		.tabs .card { padding: 0px 0px 16px; background: url(../images/bricks/tab-list-bottom.gif) left bottom no-repeat; }
		
		.tabs .cards h1 { margin: 0px; padding: 0px; width: auto; font-size: 16px; font-weight: bold; }
		.tabs .cards h1 a { display: block; line-height: 40px; height: 40px; background: url(../images/bricks/tab-list-head.gif) top left no-repeat; padding: 0px 15px; }
		.tabs .cards h1.first a { background: url(../images/bricks/tab-list-head-first.gif) top left no-repeat; }
		.tabs .cards h1 a.active { background-position: 0px -40px !important; }
		
		.tabs .cards ul { margin: 0px; padding: 5px 0px; border-left: 1px solid #e6e7e2; border-right: 1px solid #e6e7e2; }
		.tabs .cards ul li { margin: 0 15px; padding: 0px; background: url(../images/bricks/border-hdot.gif) left top repeat-x; }
		.tabs .cards ul li a { display: block; padding: 5px 5px 5px 25px; background: url(../images/bricks/tab-list-punch.gif) 2px center no-repeat; }
	
	#footer { }
		#footer #fb { padding: 24px 20px; background: url(../images/bricks/border-hdot.gif) left top repeat-x; overflow: hidden; line-height: 58px; vertical-align: middle; text-align: left; float: left; }
		#footer #rewards { padding: 24px 0px; background: url(../images/bricks/border-hdot.gif) left top repeat-x; overflow: hidden; line-height: 58px; vertical-align: middle; text-align: right; float: right; }
		#footer #rewards a { margin: 0px 2px; }
		#footer #rewards img { vertical-align: middle; height: 58px; }
		#footer #info { padding: 15px 0px; background: url(../images/bricks/border-hdot.gif) left top repeat-x; overflow: hidden; clear: both; }
			#footer #info p, #footer #info a { color: #CCCCCC; }
			#footer #info p.left { float: left; margin: 0px; padding: 0px; }
			#footer #info p.right { float: right; margin: 0px; padding: 0px; }

/**
* THINGS DEDICATED FOR SPECIFIED TEMPLATES
**/

#productblocks { background: #f5f9fa; padding: 15px 0px; overflow: hidden; height: 220px; }
	#productblocks .block { float: left; width: 190px; height: 220px; padding: 0px 25px; background: transparent url(../images/bricks/border-indexblock.gif) top left repeat-y !important; }
	#productblocks .block:first-child { background: none; }
	
	#productblocks .searchblock h1 { font-size: 22px; } 
	#productblocks .productblock img { margin: 0px auto 5px; width: 190px; height: 145px; }
	#productblocks .productblock p { margin: 0px 0px 0px 10px; }
	
#textblocks { padding: 25px 0px 0px; overflow: hidden; }
	#textblocks .block { float: left; width: 240px; margin-left: 40px; padding-right: 40px; }
	#textblocks .block:first-child { margin-left: 30px; }
	
	#textblocks .block h1 { font-size: 22px; color: #1f69a7; font-weight: normal; margin: 0px; padding: 0px; }
	#textblocks .block p { margin: 10px 0px; }
	
	#textblocks .catalogue { background: url(../images/bricks/bg-catalogueblock.gif) left top no-repeat; height: 146px; }
	#textblocks .catalogue h1 { margin: 0px 0px 0px 15px; }
	#textblocks .catalogue p { width: 135px; padding: 30px 15px 0px;  }
	
#awards li { width: 140px; }
	#awards img { width: 140px; }
	#awards p { text-align: center; }
	
#productlist li { margin-bottom: 15px; }
	#productlist .productlist-image { float: left; width: 155px; height: 118px; }
	#productlist .productlist-image img { width: 155px; height: 118px; }
	#productlist .productlist-info { float: left; width: 155px; }
	 
	#productlist.list-horizontal li { width: 160px; height: 200px; margin-right: 10px; }
	#productlist.list-horizontal .productlist-image { margin-bottom: 10px; }
	#productlist.list-vertical .productlist-image { margin-right: 30px; }
	
#productroot li { margin-bottom: 30px; width: 250px; margin-right: 10px; color: #999999; }
	#productroot li.clear { clear: left; }
	#productroot li h2 { font-size: 17px; font-weight: normal; margin: 0px 0px 0.5em; }
	#productroot .productroot-image { float: left; width: 111px; height: 71px; margin-right: 15px; }
	#productroot .productroot-image img { width: 111px; height: 71px; }
	#productroot .productroot-groups { float: left; width: 120px; }

#manuals { list-style-type: none; padding: 0px; }
	#manuals li { display: block; padding: 0px; margin: 0em 0em 2em; background: url(../images/bricks/border-solid.gif) 440px 0px repeat-y; }
	#manuals li .icon { float: left; width: 50px; margin-right: 30px; }
	#manuals li .icon img { width: 50px; height: 50px; }
	#manuals li .desc { float: left; width: 320px; margin-right: 30px; }
	#manuals li .desc p { margin: 0px 0px 0.2em; }
	#manuals li .download { float: right; width: 70px; }
	#manuals li .download a { display: block; text-align: center; padding-left: 15px; background: url(../images/bricks/icon-download.gif) 0px 0.35em no-repeat; }

.product-gallery { width: 235px; float: left; padding: 0px 8px; background: url(../images/bricks/border-vdot.gif) top right repeat-y; margin: 0px 0px 20px; }
	.product-gallery .preview { position: relative; width: 235px; height: 179px; padding: 0px 0px 15px;}
	.product-gallery .preview img { width: 235px; height: 179px; }
	.product-gallery .preview img.zoom-in { display: block; position: absolute; left: 0px; bottom: 15px; width: 15px; height: 15px; display: none; z-index: 9998; }
	.product-gallery .thumbs { width: 235px; }
	.product-gallery .thumbs .thumb { float: left; width: 43px; height: 43px; border: solid 1px #e6e6e6; margin: 0px 6px 6px 0px;  }
	.product-gallery .thumbs img { width: 43px; height: 43px; }
	
	#full-page-preview { display: none; position: absolute; background: #FFFFFF; padding: 30px; border: solid 1px #CCCCCC; overflow: hidden; }
	#full-page-preview.loading { background: #FFFFFF url(../images/loader.gif) center center no-repeat; }

.product-info { width: 250px; float: left; margin: 0px 0px 20px 15px; color: #666666; }
	.product-info p.meta { margin: 0px; }
	.product-info #colorscheme { line-height: 14px; vertical-align: middle; }
	.product-info #colorscheme .color { width: 14px; height: 14px; margin-left: 5px; }
	.product-info #colorscheme img { width: 14px; height: 14px; vertical-align: middle; }
	.product-info #manual a { font-weight: bold; color: #666666; }
	
#googlemap { float: left; width: 340px; height: 390px; overflow: hidden; }
#googlemap-search { float: left; width: 160px; margin-left: 20px; }
#shops_list { padding: 0px; }
#shops_list h2 { font-weight: normal; font-size: 16px; }
#shops_list li { background: none; float: left; margin: 0px 15px 15px 0px; padding: 0px; width: 110px; }
#shops_list li.clear { clear: left; }

#searchpage h1 { margin: 1.0em 0em 1.0em; }
	#searchpage p, #searchpage ul, #searchpage ol { margin: 0.2em 0em; }
	#searchpage .searchblock { background: #f0f3ec; text-align: left; }
	#searchpage .searchblock h1 { color: #656764; margin: 0em 0em 1.0em; font-size: 17px; font-weight: normal; }
	#searchpage .searchblock .column { float: left; width: 230px; margin-right: 15px; }
	#searchpage .searchblock p { overflow: hidden; text-align: left; margin: 0.5em 0em; }
	#searchpage .searchblock p label { float: left; width: 80px; margin-right: 5px; }
	#searchpage .searchblock p input, #searchpage .searchblock p select { width: 140px; }
