/* WEBSHOP CSS */

/* balk */
.newsPagination {
	xbackground: #d4d4d4 url(../../images/webshop/webshop_balk.gif) right top no-repeat;
	background: #d4d4d4;
	text-align: left;
	padding-left: 20px;
	color: #666;
	font-size: 12px;
	line-height: 24px;
	height: 30px;
	position: relative;
	padding-top: 3px;
	margin: 0 0 17px 0;
}
#newsPagination select {
	width: 250px;
	float: left;
	xposition: absolute;
	xright: 100px;
	font-family: Arial, Sans-Serif;
	font-size: 13px;
	margin: 2px 0 2px -10px;
	display: block;
	padding: 2px;
	border: solid 1px #009933;
}
/* balk icon */
a.listView, a.gridView {
	width: 17px;
	height: 16px;
	float: left;
	position: absolute;
	top: 7px;
	display: block;
	text-indent: -9999px;
	background-image: url(../../images/webshop/webshop_view.gif);
	background-repeat: no-repeat;
}

a.listView {
	right: 33px;
	background-position: 0 0;
}

a.listView:hover, a.listView.activated {
	background-position: 0 -16px;
}

a.gridView {
	right: 11px;
	background-position: 0 -32px;
}

a.gridView:hover, a.gridView.activated {
	background-position: 0 -48px;
}
/* balk icon - inactive*/
a.listView_inactive, a.gridView_inactive {
	width: 17px;
	height: 16px;
	float: left;
	position: absolute;
	top: 7px;
	display: block;
	text-indent: -9999px;
	background-image: url(../../images/webshop/webshop_view.gif);
	background-repeat: no-repeat;
}

a.listView_inactive {
	right: 33px;
	background-position: 0 0;
}

a.listView_inactive:hover, a.listView_inactive.activated {
	background-position: 0 0px;
}

a.gridView_inactive {
	right: 11px;
	background-position: 0 -32px;
}

a.gridView_inactive:hover, a.gridView_inactive.activated {
	background-position: 0 -32px;
}

/* product list */
.portofolioItem {
	background: #f6f6f6;
	font-size: 14px;
	line-height: 24px;
	margin-bottom: 20px;
	position: relative;
	border: 2px solid #f6f6f6;
}
.portofolioItem a {
  display:block;
	width:100%;
  height:100%;
}

.grided .portofolioItem {   /* txt under image */
	float: left;
	text-align:center;
	width: 190px;
	height: 100%;
	padding: 8px 10px 8px 10px;
	margin-right: 0px;
}

.listed .portofolioItem:hover, .grided .portofolioItem:hover {
	border-color: #ccc;
	cursor: pointer;
}

.listed .portofolioItem h3 {
	font-size: 14px;
	font-weight: normal;
}

.listed .portofolioItem {
	padding: 8px 13px 8px 8px;
}

.listed .portofolioImage {
	float: left;
	text-align: left;
	width: 138px;
	height: 138px;
	padding: 2px 16px 2px 2px;
	background: url(../../images/webshop/webshop_image_bg.png) 0 0 no-repeat;
}

.grided .portofolioImage {
	float: none;
	width: 138px;
	height: 138px;
	padding: 2px 16px 2px 28px;
	background: url(../../images/webshop/webshop_image_bg.png) 26px 0 no-repeat;
}

.listed .portofolioImage a {
	width: 138px;
	height: 138px;
	overflow: hidden;
	float: left;
	display: block;
}

.grided .portofolioImage a {
	width: 138px;
	height: 138px;
	overflow: hidden;
	float: left;
	display: block;
}
/*DOWNLOAD IMAGES*/
.listed .DownloadsImage {
	float: left;
	text-align: left;
	vertical-align: center;
	width: 178px;
	height: 114px;
	padding: 2px 16px 2px 2px;
	background: url(../../images/downloads/downloads_image_bg.png) 0 0 no-repeat;
}
.listed .DownloadsImage_v2 {
	float: left;
	text-align: left;
	vertical-align: center;
	width: 178px;
	height: 114px;
	padding: 7px 10px 7px 7px;
	background: url(../../images/downloads/downloads_image_bg.png) 0 0 no-repeat;
}
.grided .DownloadsImage {
	float: none;
	width: 178px;
	height: 114px;
	padding: 2px 16px 2px 28px;
	background: url(../../images/downloads/downloads_image_bg.png) 26px 0 no-repeat;
}

.listed .DownloadsImage a {
	width: 178px;
	height: 114px;
	overflow: hidden;
	float: left;
	display: block;
}
.listed .DownloadsImage_v2 a {
	xwidth: 178px;
	xheight: 114px;
	xoverflow: hidden;
	xfloat: left;
	xdisplay: block;
}

.grided .DownloadsImage a {
	width: 178px;
	height: 114px;
	overflow: hidden;
	float: left;
	display: block;
}
.listed .DownloadsDetailLine {
	background: url(../../images/webshop/webshop_line_back.gif) 0 bottom repeat-x;
	text-align: left;
	position: relative;
	float: left;
	left: 0px;
	width:225px;
}
.listed .DownloadsDetailLine a{
	text-align: left;
	position: relative;
	float: left;
	left: 0px;
	width:50px;
}
.listed .DownloadsDetailLine span.date {
	font-size: 10px;
	position: absolute;
	right: 2px;
	top: 2px;
}

.listed .LinkDetailLine {
	background: url(../../images/webshop/webshop_line_back.gif) 0 bottom repeat-x;
	text-align: left;
	position: relative;
	float: left;
	left: 0px;
	width:225px;
}
.listed .LinkDetailLine a{
	text-align: left;
	position: relative;
	float: left;
	left: 0px;
	width:225px;
}
.listed .LinkDetailLine span.date {
	font-size: 10px;
	position: absolute;
	right: 2px;
	top: 2px;
}
/*      */

.listed .portofolioDetailLine {
	background: url(../../images/webshop/webshop_line_back.gif) 0 bottom repeat-x;
	text-align: left;
	position: relative;
	float: left;
	left: 0px;
	width:260px;
}
.listed .portofolioDetailLine_v2 {
	background: url(../../images/webshop/webshop_line_back.gif) 0 bottom repeat-x;
	text-align: left;
	position: relative;
	float: right;
	right: 9px;
	width:410px;
}

.grided .portofolioDetailLine {
	display: none;
}

.listed .portofolioDetailLine span.date {
	font-size: 10px;
	position: absolute;
	right: 2px;
	top: 0px;
}

.listed .portofolioDetailLineLast {
	font-size: 12px;
	color: #ccc;
	text-align: right;
	padding-top: 3px;
}

.grided .portofolioDetailLineLast {
	display: none;
}

a.portofolioItemLink {
	position: absolute;
	left: 0;
	top: 0;
	border: 1px solid #f6f6f6;
	width: 504px;
	height: 148px;
}



/* Clearing floats */
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {
	display: inline-block;
}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.listed .gridName {
	display: none;
}
#columnCenter .gridName h3 {
	font-weight: normal;
	font-size: 14px;
}
/*form*/
	#inputArea
	{
	    font-family: Arial, Sans-Serif;
	    font-size: 13px;
	    background-color: #f6f6f6;
	    padding: 10px;
	    width:430px;

	}
		#inputArea_small
	{
	    font-family: Arial, Sans-Serif;
	    font-size: 13px;
	    xbackground-color: #f6f6f6;
	    padding: 10px;
	    width:275px;

	}
	#inputArea input, #inputArea textarea, #inputArea select
	{
	    font-family: Arial, Sans-Serif;
	    font-size: 13px;
	    margin-bottom: 5px;
	    display: block;
	    padding: 4px;
	    xwidth: 280px;
	}

.activeField
        {
            background-image: none;
            background-color: #ffffff;
            border: solid 1px #cccccc;
        }
.idle
        {
	    border: solid 1px #e1e1e1;
	    xbackground-image: url( '../../images/template/form_input_bg.png' );
	    xbackground-repeat: repeat-x;
	    xbackground-position: top;
        }
	#inputArea .submitstyle
	{
	    font-family: Arial, Sans-Serif;
	    font-size: 13px;
	    margin-bottom: 5px;
	    display: block;
	    padding: 4px;
	    width: 130px;
		cursor:pointer;
		xborder:outset 1px #cccccc;
		border:solid 1px #e1e1e1;
		background:#ffffff;
		color:#00000;
		background:url("../../images/formbg.gif") repeat-x left top;
	}
	#inputArea .submitstyle:hover
	{
	    font-family: Arial, Sans-Serif;
	    font-size: 13px;
	    margin-bottom: 5px;
	    display: block;
	    padding: 4px;
	    width: 130px;
		cursor:pointer;
		xborder:outset 1px #cccccc;
		border: solid 1px #e1e1e1;
		background:#ffffff;
		color:#00000;
		background:url("../../images/formbg_hover.gif") repeat-x left top;
	}

	#content_center .submitstyle
	{
	    font-family: Arial, Sans-Serif;
	    font-size: 13px;
	    margin-bottom: 5px;
	    xdisplay: block;
	    padding: 4px;
	    xwidth: 130px;
		cursor:pointer;
		xborder:outset 1px #cccccc;
		border:solid 1px #e1e1e1;
		background:#ffffff;
		color:#00000;
		background:url("../../images/formbg.gif") repeat-x left top;
	}
	#content_center .submitstyle:hover
	{
	    xfont-family: Arial, Sans-Serif;
	    xfont-size: 13px;
	    xmargin-bottom: 5px;
	    xdisplay: block;
	    xpadding: 4px;
	    xwidth: 130px;
		xcursor:pointer;
		xborder:outset 1px #cccccc;
		xborder: solid 1px #e1e1e1;
		xbackground:#ffffff;
		xcolor:#00000;
		background:url("../../images/formbg_hover.gif") repeat-x left top;
	}

/*formfield 2*/
p.label_field_pair {
clear: both;
float: none;
}
p.label_field_pair label {
clear: left;
display: block;
float: left;
text-align: left;
//width: 115px;
width: 147px;
}
p.label_field_pair_small label {
xclear: left;
display: block;
float: left;
text-align: left;
//width: 115px;
width: 147px;
}
p.label_field_pair select {
clear: right;
float: left;
margin-left: 10px;
width: 270px;
}
p.label_field_pair input {
clear: right;
float: left;
margin-left: 10px;
width: 250px;
}
p.label_field_pair textarea {
clear: right;
float: left;
margin-left: 10px;
width: 260px;
}
/////////
p.label_field_pair_2 {
clear: both;
float: none;
}
p.label_field_pair_2 label {
clear: left;
display: block;
float: left;
text-align: left;
//width: 115px;
width: 147px;
}
p.label_field_pair_2 input {
clear: right;
float: left;
margin-left: 10px;
width: 50px;
}
/*table*/
#mytable {
	width: 450px;
	padding: 0;
	margin: 0;
	border-collapse:collapse;
}
table.tablewebshop {
	width: 410px;
	padding: 0;
	margin: 0;
	border-collapse:collapse;
	border: 1px solid #C1DAD7;
}

caption {
	padding: 0 0 5px 0;
	xwidth: 700px;
	font: italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #9ba9b4;
	letter-spacing:.1em;
	margin:1em 0 0 0;
	padding:0;
	caption-side:top;
	text-align:center;
}

th {
	font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #ffffff;
	border: 1px solid #cccccc;
	xborder-bottom: 1px solid #C1DAD7;
	xborder-top: 1px solid #C1DAD7;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-align: left;
	padding: 6px 6px 6px 12px;
	background: #169234 url(../../images/table/bg_header.jpg) no-repeat;
}

th.nobg {
	xborder-top: 0px;
	xborder-left: 0px;
	border: 1px solid #cccccc;
	background: none;
}
td.alt1 {
	border: 1px solid #cccccc;
	background: #f9f9f9;
	padding: 6px 6px 6px 12px;
	color: #666666;
	xfont: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	xtext-transform: capitalize;
}
td.alt2 {
	border: 1px solid #cccccc;
	background: #f0efef;
	padding: 6px 6px 6px 12px;
	color: #333333;
	xfont: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	xtext-transform: capitalize;
}

th.spec {
	border: 1px solid #cccccc;
	xborder-top: 0px;
	background: #fff url(../../images/table/bullet1.gif) no-repeat;
	font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}

th.specalt {
	bordert: 1px solid #cccccc;
	xborder-top: 0px;
	background: #f5fafa url(../../images/table/bullet2.gif) no-repeat;
	font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #797268;
}

