/*TOPSPIN SITE CSS */

/*************************************************/
/* HTML tag styles                               */
/*************************************************/

* {
	/* Reset browsers default margin, padding and font sizes */
	margin: 0;
	padding: 0;
}

html {
}

body {
	font-family: Verdana, Geneva, sans-serif;
	background: url(../img/img_site/bg_tile.jpg) repeat;
	height: 100%;
}

/*************************************************/
/* Site layout styles                            */
/*************************************************/


/* Main blocks
**************************************************/

#wrap {
	margin: 0;   /* align for good browsers */
	padding: 0;
	width: 993px;
	height: 100%;
}

#header_container {
	background: url(../img/img_site/header.jpg) no-repeat;
	height: 150px;
	width: 993px;
}

#header_ref {
	position: relative;
}

#head_text {
	font-size: 9px;
	font-weight: bold;
	color: #fff;
	position: absolute;
	left: 130px;
	top: 91px;
	line-height: 13px;
	height: 13px;
}

#inloggen {
	font-size: 9px;
	font-weight: bold;
	color: #fff;
	text-align: right;
	position: absolute;
	top: 89px;
	padding-left: 20px;
	left: 400px;
 *left: 420px; /*IE6 en IE7 */
	width: 560px;
	line-height: 13px;
	height: 13px;
}

#inloggen a {
	color: #fff;
	text-decoration: underline;
}

#inloggen a:hover {
	color: #ccc;
}

#inloggen img {
	float: none;
	margin-right: 5px;
}

/* Topmenu
**************************************************/

#topmenu {
	position: absolute;
	top: 117px;
	height: 33px;
	left: 9px;
	width: 758px;
}

#topmenu ul {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

#topmenu ul li {
	float: left;
}

#topmenu ul li a {
	text-decoration: none;
	background: url(../img/img_site/bg_wit_op_rood.gif) no-repeat right top;
	color: #7d0c00;
	text-transform: uppercase;
	font-size: 13px;
	font-weight: bold;
	line-height: 33px;
	padding-left: 18px;
	display: block;
}

#topmenu ul li a:hover {
	color: #999;
}

#topmenu ul li a.current {
	font-weight: bold;
	background: url(../img/img_site/bg_geel_op_rood.gif) no-repeat right top;
}

#tm1 {
	width: 75px;
}

#tm2 {
	width: 180px;
}

#tm3 {
	width: 100px;
}

#tm4 {
	width: 103px;
}

#tm5 {
	width: 150px;
}

#tm6 {
	width: 150px;
}

/**************************************************/

#status {
	height: 33px;
	width: 227px;
	background: url(../img/img_site/bg_geel_op_rood.gif) no-repeat right top;
	position: absolute;
	left: 766px;
	top: 117px;
	font-size: 9px;
	font-weight: bold;
	line-height: 33px;
}

#status a {
	color: #7d0c00;
	text-decoration: underline;
	margin-left: 10px;
}

#status a:hover {
	color: #fff;
}

#center_container {
	height: 100%;
	width: 100%;
	padding-left: 9px;
}

#center_table {
	height: 100%;
	width: 100%;
	border: 2px solid #fff;
}

#menu_container {
	background: url(../img/img_site/left_image.jpg) no-repeat left bottom;
	width: 201px;
	border-right: 2px solid #fff;
}

#menu_container h2 {
	font-size: 13px;
	font-weight: bold;
	text-transform: uppercase;
	color: #fff;
	padding: 10px 5px;
}

#right_container {
	border-left: 2px solid #fff;
	width: 223px;
}

#right_container h2 {
	font-size: 13px;
	font-weight: bold;
	text-transform: uppercase;
	color: #fff;
	padding: 10px 5px;
}

.rightbox {
	font-size: 10px;
	background: #fff;
	color: #7d0c00;
	line-height: 16px;
}

.rightbox p {
	padding: 5px;
}

.rightbox a {
	color: #7d0c00;
	text-decoration: underline;
}

.rightbox a:hover {
	color: #999;
}

.rightbox img {
	display: block;
}

.rightbox input {
	border: 1px solid #000;
	width: 200px;
}

.rightbox form {
	font-weight: bold;
	font-size: 9px;

}

.rightbox .tafDiv {
  margin: 5px 5px 8px;
}

.rightbox form p {
	padding: 0px;
}

.rightbox h4 {
	font-weight: bold;
	font-size: 12px;
	color: #7d0c00;
	padding: 0px;
}
.rightbox_button {
	height: 25px;
	width: 130px;
	background: url(../img/img_site/bg_geel_op_wit.gif) no-repeat right top;
	margin-left: 93px;
}

.rightbox_button a {
	text-decoration: underline;
	cursor: pointer;
	padding-left: 8px;
	font-size: 9px;
	font-weight: bold;
}

.rightbox_button a:hover {
	color: #fff;
}


.div.rightbox_button_submit {
	height: 25px;
	width: 130px;
	background: url(../img/img_site/bg_geel_op_wit.gif) no-repeat right top;
	margin-left: 93px;
}

.div.rightbox_button_submit a {
	text-decoration: underline;
	cursor: pointer;
	padding-left: 8px;
	font-size: 9px;
	font-weight: bold;
	cursor: pointer;
}

.div.rightbox_button_submit a:hover {
	color: #fff;
}

#content_container {
	padding: 9px;
	height: 100%;
}

#content_container .head {
	font-size: 13px;
	font-weight: bold;
	text-transform: uppercase;
	color: #fff;
}

#content_container_bg_head {
	background: url(../img/img_site/bg_wit_op_rood.gif) no-repeat right top;
}

#content_container_bg_table {
	background: #fff;
	width: 100%;
}

#content_container .terug a {
	font-size: 10px;
}

#content_container .terug {
	font-size: 10px;
}

#footer_container {
	height: 80px;
	vertical-align: top;
}

#footer_ref {
	position: relative;
}

#subtext {
	font-size: 9px;
	color: #fff;
	height: 30px;
	width: 900px;
	position: absolute;
	left: 9px;
	top: 10px;
	font-weight: bold;
}

#footer {
	font-size: 9px;
	color: #fff;
	position: absolute;
	height: 20px;
	left: 9px;
	top: 50px;
	font-weight: bold;
}

#footer a {
	color: #fff;
	text-decoration: underline;
}

#footer a:hover {
	color: #ccc;
}

#realisatie {
	font-size: 9px;
	color: #fff;
	position: absolute;
	height: 20px;
	width: 260px;
	left: 720px;
	top: 50px;
	text-align: right;
	font-weight: bold;
}

#realisatie a {
	color: #fff;
	text-decoration: underline;
}

#realisatie a:hover {
	color: #ccc;
}

/* Zoeken CMS
**************************************************/

#zoeken {
	background: #FFFFFF;
	padding: 8px;
	font-size: 9px;
	font-weight: bold;
	color: #7d0c00;
}

#zoeken a {
	color: #7d0c00;
}

#zoeken a:hover {
	color: #999;
}

#zoeken img {
	vertical-align: middle;
	float: none;
	cursor: pointer;
}

#zoeken input {
	width: 150px;
	margin-right: 5px;
	border: 1px solid #000000;
	background: #FFFFFF;
	font-size: 11px;
	color: #333333;
	padding: 2px;
	margin-top: 5px;
	margin-bottom: 5px;
}

/* Ingangen
**************************************************/

.ingang {
	font-size: 10px;
	background: #fff;
	color: #7d0c00;
	line-height: 16px;
	width: 169px;
	float: left;
	margin-top: 9px;
	margin-right: 9px;
}

#content_container .ingang .ingang_head h2 {
	font-size: 12px;
	font-weight: bold;
	text-transform: none;
	color: #7d0c00;
	padding: 5px;
	line-height: 16px;
	height: 60px;
}

.ingang a {
	color: #7d0c00;
	text-decoration: underline;
}

.ingang a:hover {
	color: #999;
}

.ingang p {
	height: 169px;
	width: 169px;
	text-align: center;
}

.ingang img {
	display: block;
	padding: 5px;
}

.ingang_button {
	height: 25px;
	background: url(../img/img_site/bg_geel_op_wit.gif) no-repeat right top;
	width: 100%;
	text-align: right;
}

.ingang_button a {
	text-decoration: underline;
	font-size: 9px;
	font-weight: bold;
	padding-right: 8px;
}

.ingang_button a:hover {
	color: #fff;
}

.aanbieding_button {
	height: 25px;
	background: url(../img/img_site/bg_geel_op_wit.gif) no-repeat right top;
	width: 100%;
	font-size: 12px;
	font-weight: bold;
	color: #7d0c00;
}

.aanbieding_button p {
	font-size: 9px;
	text-align: left;
	height: 11px;
}

.aanbieding_button a {
	text-decoration: underline;
	font-size: 9px;
	font-weight: bold;
	text-align: right;
	padding-right: 8px;
	line-height: 25px;
}

.aanbieding_button a:hover {
	color: #fff;
}

.prijs {
	font-size: 14px;
	font-weight: bold;
}

.prijsoud {
	text-decoration: line-through;
	padding-left: 8px;
}

.row_home {
	display: block;
	padding-bottom: 10px;
	border-bottom: 2px solid #fff;
}

.row {
	display: block;
	padding-bottom: 10px;
}

/* Button styles
**************************************************/

div.button {
	font-size: 9px;
	color: #7d0c00;
	background: #E8E8E8;
	width: 140px;
	text-align: center;
	display: inline;
	float: right;
	margin-left: 0px;
	font-weight: bold;
	height: 25px;
  cursor : pointer;
}

div.button#custombutton45 {
	width: 45px;
}

div.button#custombutton130 {
	width: 130px;
}

div.button#custombutton150 {
	width: 150px;
}

div.button#custombutton200 {
	width: 200px;
}

div.button a {
	text-decoration: none;
	color: #7d0c00;
	display: block;
	padding-top: 2px;
	padding-bottom: 2px;
}

div.button a:hover {
	color: #999;
}

div.button_cta { /* cta: call to action */
	font-size: 9px;
	color: #7d0c00;
	text-align: center;
	display: inline;
	float: right;
  width: 140px;
	margin-left: 6px;
	font-weight: bold;
	height: 25px;
	cursor : pointer;
	background: url(../img/img_site/bg_geel_op_wit.gif) no-repeat right top;
}

div.button_cta#custombutton45 {
	width: 45px;
}

/* geen margin voor winkelmand */
div.button_cta#custombutton100 {
	width: 100px;
  margin-left: 0px;
}

div.button_cta#custombutton150 {
	width: 150px;
}

div.button_cta#custombutton200 {
	width: 200px;
}

div.button_cta a {
	text-decoration: none;
	color: #7d0c00;
	display: block;
	padding-top: 2px;
	padding-bottom: 2px;
}

div.button_cta a:hover {
	color: #fff;
}

/* winkelmand buttons in tabel padding meegegeven */
.marginButton {
	padding-top: 2px;
	padding-bottom: 2px;
}


/*************************

div.button_cta button {
	text-decoration: none;
	color: #7d0c00;
	display: block;
	padding-top: 2px;
	padding-bottom: 2px;
}

div.button_cta button:hover {
	color: #fff;
}

div.button_cta button span {
	display: none;

}

**************************/

/* Content CMS
**************************************************/

.content {
	color: #7d0c00;
	font-size: 11px;
	line-height: 18px;
	padding: 5px;
}

.content ul {
	margin-bottom: 11px;
}

.content li {
	list-style: url(none) none;
	background: url(../img/img_algemeen/bullet_red.gif) no-repeat 0em 0.2em;
	padding-left: 15px;
}

.content ul li ul {
	margin-bottom: 0px;
}

.content ul li ul li {
	list-style: url(none) none;
	background: url(../img/img_algemeen/bullet_red.gif) no-repeat 0.1em 0.2em;
	padding-left: 16px;
}

.content a {
	text-decoration: underline;
	color: #7d0c00;
}

.content a:hover {
	text-decoration: underline;
	color: #999;
}

.content .imglinks {
	float: left;
	margin: 6px;
}

.content .imgrechts {
	float: right;
	margin: 6px;
}

.content p {
	font-size: 11px;
	line-height: 18px;
	color: #7d0c00;
	margin-bottom: 11px;
}

.content h1 {
	margin-bottom: 11px;
	color: #7d0c00;
	font-size: 13px;
	line-height: 20px;
	font-weight: bold;
	text-transform: uppercase;
}

.content h2 {
	font-weight: bold;
	font-size: 11px;
	line-height: 18px;
	color: #7d0c00;
}

.content h3 {
	font-weight: bold;
	font-size: 11px;
	line-height: 18px;
	color: #7d0c00;
}

.content h4 {
	font-weight: bold;
	font-size: 11px;
	color: #7d0c00;
}

.content h5 {
	font-weight: bold;
	font-size: 11px;
	line-height: 18px;
	color: #7d0c00;
}

.content h6 {
	font-weight: bold;
	font-size: 11px;
	line-height: 18px;
	color: #7d0c00;
}

/* Go to top
**************************************************/

#gototop {
	font-size: 11px;
	text-decoration: underline;
	cursor: pointer;
}

.pdf {
	line-height:32px;
	background:url(../img/img_icons/PDF_icon.gif) no-repeat;
	height:36px;
	padding-left:36px;
	font-size:10px;
}

#specs {
	text-align:left;
	background:#FFFFFF;
	font-size:11px;
	margin-bottom:15px;
}

#specs th {
	color:#7d0c00;
	background:#F9B600;
	padding:2px;
}

#specs td {
	padding:2px;
	background: #E8E8E8;
}

/* See also
**************************************************/

#see_also {
	font-size: 10px;
	line-height: 16px;
	border: 1px dotted #D6D4D5;
	margin: 0px;
	padding: 5px;
}

#see_also h3 {
	margin-bottom: 5px;
}

#see_also ul {
	margin-bottom: 5px;
}

#see_also li {
	display: block;
}

#see_also li.bg {
	background: #EBEBEB url(../img/img_algemeen/bullet_small.gif) no-repeat 0.4em 0.6em;
}

#see_also a {
}

#see_also a:hover {
}

/* Formulieren CMS
**************************************************/

input, select, textarea, file {
	border: 1px solid #6e7176;
	margin: 2px 0px 2px 7px;
	color: #000;
	width: 200px;
	text-align: left;
	vertical-align: middle;
	font: 10px Verdana, Geneva, sans-serif;
	padding: 2px;
	background: #FFFFFF;
}

textarea {
	height: 80px;
	width: 200px;
	margin-top: 7px;
}

.letsFormTable {
	padding: 2px;
	display:block;
	font-size: 11px;
	line-height: 18px;
	width: 100%;
}

.letsFormRadio {
  width: 20px;
  background: transparent;
  border: none;
}

.letsFormCheckbox {
  width: 20px;
  background: transparent;
  border: none;
}

.letsFormInput_error {
	border: 1px solid red;
}

.letsFormTD {
	width: 160px;
	padding-bottom:5px;
}

.letsErrorList {
	color:red;
}

.w20 {
	width: 20px
}

.w35 {
	width: 35px
}

.w50 {
	width: 50px;
	color: red;
}

.w75 {
	width: 75px;
}

.w100 {
	width: 100px
}

.w120 {
	width: 120px
}

.w150 {
	width: 150px
}

.w180 {
	width: 180px
}

.w200 {
	width: 200px
}

.w100percent {
	width: 100%
}

/*************************************************/
/* Styling Shop Module                           */
/*************************************************/

/**************************** ERROR MESSAGES ***********************************/

  div.error {
    font-size:10px;
    font-weight:bold;
    margin-bottom: 10px;
  }

  div.error ul {
    margin:4px 10px 4px 36px;
    list-style:square;
  }

  div.error ul li {
    line-height:18px;

  }

  div.error#red {
    background:#ffcccc url(../img/img_icons/error_red.gif) top left no-repeat;
    border:1px solid #ccc;
    color:#c00;
  }

  div.error#green {
    background:#ccffcc url(../img/img_icons/error_green.gif) top left no-repeat;
    border:1px solid #ccc;
    color:#060;
  }

  div.error#yellow {
    background:#fffac7;
    border:1px solid #978e2f;
    color:#575000;
    font-weight:normal;
    line-height:18px;
    text-align:center;

  }

/**************************** MIJN BESTELLINGEN ***********************************/

  table.grid {
    border:1px solid #e1e1e1;
    border-collapse:collapse;
    background-color:#ffffff;
    font-size:11px;
    margin:0px 0px 5px 0px;
    width:100%;
  }

  table.grid th {
    border:1px solid #e1e1e1;
    border-collapse:collapse;
    color:#01456a;
    background-color:#ffffff;
    padding:1px 3px 1px 3px;
    text-align:left;
    font-weight:bold;
    line-height:20px;
    height:20px;
  }

  table.grid td {
    border:1px solid #e1e1e1;
    border-collapse:collapse;
    color:#000000;
    background-color:#ffffff;
    padding:1px 3px 1px 3px;
    line-height:20px;
    height:20px;
  }

/******************************************************************************/

  span.red {
    color:#f00;
    margin-left:5px;
  }

  div.block {
    font-size:11px;
    /* background:#ecf3f9; */
    background:#E8E8E8;
    margin:0 0 11px 0px;
    padding:5px;
  }

/***************************   WINKELMANDJE  ***************************/

table.winkelmandje {
  border:1px solid #e1e1e1;
  border-collapse:collapse;
  font-size:11px;
}

table.winkelmandje th {
  text-align:left;
  color:#01456a;
  background:#ecf3f9;
  padding:3px 1px 3px 4px;
}

table.winkelmandje td {
  padding:1px 3px 1px 3px;
  line-height:20px;
  height:20px;
}



/*************************************************/
/* Browser compatibility                         */
/*************************************************/

/* fixes float problems
**************************************************/

.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;
}