/*	html and body
	----------------------------------------------------------------------*/

	html {
		background: #e1e1e1;
	}

		body {
			text-align: center;
		}

			.wrapper {
				background: #fff url('/img/design/wrapper.jpg') center top repeat-x;
				margin:     0 auto;
				padding:    80px 0 0;
				position:   relative;
				text-align: left;
				width:      900px;
			}



	/*	header
	----------------------------------------------------------------------*/

	#header {
		background: #282829 url('/img/design/header.png') left top repeat-x;
	}

		#header p {
			display:     inline;
			float:       left;
			line-height: 62px;
			margin:      0;
			padding:     25px 0 0 20px;
			width:       180px;
		}

			#header p a {
				background:  url('/img/design/logo.png') center center no-repeat;
				display:     block;
				height:      59px;
				width:       109px;
				text-indent: -10000px;
			}

		#header h1 {
			color:       #fff;
			display:     inline;
			float:       left;
			font-size:   3.2em;
			font-weight: normal;
			line-height: 1;
			margin:      0;
			padding:     56px 15px 0;
			width:       470px;
		}

		#header ul {
			float:  right;
			height: 20px;
			margin: 0;
			width:  200px;
		}

			#header ul a {
				color:       #fff;
				display:     block;
				font-weight: bold;
				padding:     0 10px;
			}

				#header ul a:hover {
					background:      #2c2c2c;
					text-decoration: none;
				}

			#header ul li {
				display: inline;
				float:   left;
				margin:  0;
			}

		#header dl {
			clear:       right;
			float:       right;
			margin:      0;
			padding-top: 24px;
			width:       190px;
		}

			#header dt {
				clear:      none;
				display:    none;
				float:      none;
				visibility: hidden;
			}

			#header dd {
				color:       #fff;
				font-size:   1.4em;
				line-height: 1.3;
			}

				#header dd a {
					color:           #fff;
					text-decoration: none;
				}

					#header dd a:hover {
						text-decoration: underline;
					}



	/*	page layout
	----------------------------------------------------------------------*/

	#page {
		background: url('/img/design/page.png') center top repeat-y;
		clear:      both;
		padding:    15px 0;
	}

		body.quote #page {
			background: none;
		}

		.sidebar {
			display: inline;
			float:   left;
			width:   200px;
		}

		.content {
			display:    inline;
			float:      left;
			min-height: 300px;
			padding:    0 15px;
			width:      470px;
		}

			.content:after {
				content: '\00A0'; /*   */
			}

			body.quote .content {
				width: 870px;
			}



	/*	page elements
	----------------------------------------------------------------------*/

	div.alert {
		background: 10px 11px no-repeat;
		border:     1px solid;
		clear:      both;
		color:      #525252;
		margin:     0 auto 20px;
		padding:    10px 10px 10px 36px;
		-moz-box-shadow:    0 0 5px #999;
		-webkit-box-shadow: 0 0 5px #999;
		box-shadow: 0 0 5px #999;
		width:      422px;
	}

		div.done    { background-color: #e9fad0; background-image: url('/img/icons/tick.png');  border-color: #aee756; }
		div.quote   { background-color: #eaf3f8; border-color: #72aed3; }
		div.error   { background-color: #ffe3df; background-image: url('/img/icons/cross.png'); border-color: #f08a73; }
		div.warning { background-color: #ffefb5; background-image: url('/img/icons/error.png'); border-color: #ffca0b; }

		.alert h2 {
			font-size:   1.6em;
			font-weight: bold;
			line-height: 1.1;
			margin:      0 0 .7em;
		}

		.alert p {
			margin-bottom: .5em;
		}

		.alert ul {
			margin:  10px 0 0;
			padding: 0;
		}



	div.content_image {
		margin: 0 0 20px;
	}

		div.image_left {
			display: inline;
			float:   left;
			margin:  0 10px 10px 0;
		}

		div.image_right {
			display: inline;
			float:   right;
			margin:  0 0 10px 10px;
		}

		.content_image img {
			border:  1px solid #003d7e;
			display: block;
		}



	div.downloads {}

		.downloads a {
			cursor:  pointer;
			display: block;
		}

			.downloads a:hover {
				text-decoration: none;
			}

		.downloads img {
			border:  1px solid #ccc;
			display: block;
			float:   right;
		}

		.downloads p {
			display:  inline;
			margin:   0;
			position: relative;
			width:    225px;
		}

			.downloads p.spec  { float: left;  }
			.downloads p.guide { float: right; }

		.downloads span {
			background:    #000;
			-moz-border-radius: 10px 0 0 10px;
			-webkit-border-top-left-radius:    10px;
			-webkit-border-bottom-left-radius: 10px;
			border-radius: 10px 0 0 10px;
			bottom:        0;
			color:         #fff;
			font-size:     1.1em;
			font-weight:   bold;
			padding:       5px 10px;
			position:      absolute;
			width:         105px;
		}

			.downloads a:hover span {
				background: #333;
			}



	div.home_quote {
		background: #438bc0;
		display:    inline;
		float:      right;
		padding:    15px;
		width:      170px;
	}

		.home_quote blockquote {
			margin:  0;
			padding: 0;
		}

			.home_quote blockquote p {
				color:       #fff;
				font-size:   1.2em;
				font-weight: normal;
				margin:      0;
				text-indent: -0.5em;
			}

				.home_quote blockquote p:before { color: #fff; font-size: 1.0em; font-weight: normal; }
				.home_quote blockquote p:after  { color: #fff; font-size: 1.0em; font-weight: normal; }

		.home_quote cite {
			color:   #fff;
			margin:  0;
			padding: 0;
		}



	div.infopanel {
		left:        50%;
		position:    absolute;
		top:         203px;
		margin-left: -485px;
		width:       280px;
	}

		.infopanel_arrow {
			background:  url('/img/design/infopanel_arrow.png') center center no-repeat;
			height:      34px;
			left:        50%;
			margin-left: -24px;
			position:    absolute;
			top:         0;
			width:       47px;
			z-index:     10;
		}

		.infopanel_content {
			background:    RGBa(125, 125, 125, 0.5);
			-moz-border-radius:    10px;
			-webkit-border-radius: 10px;
			border-radius: 10px;
			padding:       10px;
			position:      absolute;
			text-align:    center;
			top:           24px;
			width:         260px;
			z-index:       5;
		}

			.infopanel_content .infopanel_inner {
				background:    #fff;
				background:    -moz-linear-gradient(-90deg, #fff, #e7e7e7);
				background:    -webkit-gradient(linear, 0 top, 0 bottom, from(#fff), to(#e7e7e7));
				-moz-border-radius:    4px;
				-webkit-border-radius: 4px;
				border-radius: 4px;
				padding:       10px 10px 0;
			}

			.infopanel_content a {
				background:    #fff;
				background:    -moz-linear-gradient(-90deg, #fff, #d7d7d7);
				background:    -webkit-gradient(linear, 0 top, 0 bottom, from(#fff), to(#e7e7e7));
				border:        2px solid #777;
				-moz-border-radius:    5px;
				-webkit-border-radius: 5px;
				border-radius: 5px;
				display:       inline-block;
				margin:        0 5px;
				padding:       5px 10px;
			}

				.infopanel_content a.go {
					border-color: #f77;
				}

				.infopanel_content a:hover {
					background:      #e7e7e7;
					text-decoration: none;
				}

			.infopanel_content p {
				font-size:      1em;
				margin:         0;
				padding-bottom: 15px;
				text-indent:    0;
			}

			.infopanel_content span {
				font-weight: normal;
			}



	div.other_cables {
		color:   #4e80b4;
		padding: 0 15px;
	}

		.other_cables a {
			display:         block;
			text-decoration: none;
		}

			.other_cables a:hover {
				color: #777;
			}

		.other_cables h2 {
			font-weight: normal;
			line-height: 1.3;
		}

		.other_cables ul {}

			.other_cables li {
				font-size:   1.2em;
				font-weight: bold;
				list-style:  none;
				margin:      0 0 1em;
			}



	div.request_sub {
		margin: 0 auto;
		width:  470px;
	}



	div.quote_animation {
		padding: 0 15px;
	}

		.quote_animation img {
			display: block;
		}

		.quote_animation p {
			font-size:   1.4em;
			font-weight: bold;
		}

		.quote_animation ul {
			height: 113px;
			margin: 0 0 .25em;
		}

			.quote_animation li {
				height:     113px;
				list-style: none;
				margin:     0 0 .5em;
			}

				body.js .quote_animation li {
					cursor: pointer;
				}



	div.spec_footer {
		background: #d6d6d6;
		margin-top: 1em;
	}

		.spec_footer p {
			margin: 0;
		}

			.spec_footer p.spec_download {
				border-left: 1px solid #fff;
				display:     inline;
				float:       right;
				width:       204px;
			}

			.spec_footer p.spec_print {
				background: #d6d6d6 url('/img/icons/download.png') 7px 10px no-repeat;
				display:    inline;
				float:      left;
				font-size:  1.1em;
				font-weight: bold;
				padding:    5px 10px 5px 20px;
				width:      205px;
			}



	div.swf {
		margin-bottom: 1em;
	}

		.swf p {
			margin: 0;
		}

		body.js .swf p {
			display:    none;
			visibility: hidden;
		}

			.swf p img {
				display: block;
			}



	dl.contact_details {
		font-size: 1.6em;
		margin:    0 0 .5em;
	}

		.contact_details a {}

		.contact_details dt {
			margin: 0;
			width:  4em;
		}

		.contact_details dd {
			text-indent: 0;
		}



	dl.spec_details {}

		.spec_details dt {
			display: block;
			float:   none;
			margin:  0;
		}

		.spec_details dd {
			display:       block;
			float:         none;
			margin-bottom: 1em;
		}



	form.contact_form {
		background: #ececec;
		padding:    10px;
	}

		body.quote form.contact_form {
			display: inline;
			float:   right;
			width:   450px;
		}

		.contact_form button {
			font-size: 1.4em;
			padding:   3px 10px;
		}

			.quote_form button {
				background:    #3586be;
				-moz-border-radius:    5px;
				-webkit-border-radius: 5px;
				border:        0;
				border-radius: 5px;
				-moz-box-shadow:    0 1px 2px #231f20;
				-webkit-box-shadow: 0 1px 2px #231f20;
				box-shadow:    0 1px 2px #231f20;
				color:         #fff;
				display:       inline-block;
				font-size:     1.3em;
				font-weight:   bold;
				line-height:   30px;
				margin-left:   5px;
				padding:       5px 10px;
				text-shadow:   0 1px #19568f;
			}

				.quote_form button:hover {
					background:      #72aed3;
					text-decoration: none;
				}

		.contact_form fieldset {}

		.contact_form input {
			width: 332px;
		}

		.contact_form label {
			display:       block;
			margin-bottom: 1px;
			text-indent:   4px;
		}

		.contact_form legend {
			color:          #4e80b4;
			font-size:      1.5em;
			margin-bottom:  .5em;
			text-transform: none;
		}

		.contact_form p {
			clear:   both;
			display: inline;
			width:   220px;
		}

			.contact_form p.company,
			.contact_form p.email {
				clear: none;
				float: right;
			}

			.contact_form p.name,
			.contact_form p.phone {
				float: left;
			}

				.contact_form p input {
					width: 212px;
				}

					.contact_form p.address {
						clear:   both;
						display: block;
						width:   auto;
					}

						.contact_form p.address input {
							width: 442px;
						}

			.contact_form p.comments {
				display: block;
				width:   auto;
			}

			.contact_form p.submit {
				display:    block;
				margin:     0 0 .5em;
				text-align: center;
				width:      auto;
			}

		.contact_form span {
			color:         #666;
			display:       block;
			margin-bottom: 1px;
			text-indent:   4px;
		}

			.contact_form span.asterisk {
				color:   #f44;
				display: inline;
			}

		.contact_form textarea {
			height: 150px;
			width:  442px;
		}



	form.quantities_form {
		margin:  0 auto;
		width:   470px;
	}

		.quantities_form fieldset {
			margin-bottom: 20px;
		}

			.quantities_form fieldset.submit {
				background: none;
				text-align: right;
			}

		.quantities_form button {
			background:    #3586be;
			-moz-border-radius:    5px;
			-webkit-border-radius: 5px;
			border:        0;
			border-radius: 5px;
			-moz-box-shadow:    0 1px 2px #231f20;
			-webkit-box-shadow: 0 1px 2px #231f20;
			box-shadow:    0 1px 2px #231f20;
			color:         #fff;
			display:       inline-block;
			font-size:     1.3em;
			font-weight:   bold;
			height:        30px;
			margin-left:   5px;
			padding:       0 7px;
			text-shadow:   0 1px #19568f;
		}

			.quantities_form button:hover {
				background:      #72aed3;
				text-decoration: none;
			}

		.quantities_form label {}

			.quantities_form label {
				display: block;
			}

				.quantities_form label span {
					padding-left:   3px;
					vertical-align: middle;
				}

					.quantities_form label.sample span {
						display:    none;
						visibility: hidden;
					}

				.quantities_form label.sample {}

				.quantities_form label.quantity {
					padding: 5px;
				}

		.quantities_form input {
			vertical-align: middle;
		}

			.quantities_form label.sample input {}

			.quantities_form label.quantity input {
				border:  1px solid #b0b0b0;
				padding: 4px;
				width:   190px;
			}

				.quantities_form label.quantity input.reel_count {
					border:  1px solid #b0b0b0;
					padding: 4px;
					width:   60px;
				}

				.quantities_form tr.error label.quantity input {
					border-color: #f6b9ab;
				}

		.quantities_form table {
			width: 470px;
		}

		.quantities_form caption {
			border:       solid #d0d0d0;
			border-width: 0 0 1px;
			font-size:    1.6em;
			font-weight:  bold;
			line-height:  2;
		}

			.quantities_form caption.black       { background: #231f20; color: #fff; }
			.quantities_form caption.greenyellow { background: url("/img/design/greenyellow_cable.png") left center; }
			.quantities_form caption.brown       { background: #93683e; }
			.quantities_form caption.grey        { background: #a1a8ae; }
			.quantities_form caption.pink        { background: #e7b6bc; }
			.quantities_form caption.violet      { background: #b29aa7; }
			.quantities_form caption.darkblue    { background: #19568f; }
			.quantities_form caption.blue        { background: #3586be; }
			.quantities_form caption.lightblue   { background: #72aed3; }
			.quantities_form caption.green       { background: #5bb251; }
			.quantities_form caption.yellow      { background: #f1d300; }
			.quantities_form caption.orange      { background: #fb963a; }
			.quantities_form caption.red         { background: #cd1827; }
			.quantities_form caption.white       { background: #fff; border-width: 1px; }

			.quantities_form thead {}

				.quantities_form thead tr {}

					.quantities_form thead th {
						border:       solid #d7d7d7;
						border-width: 0 1px 1px 0;
						font-size:    1.4em;
						font-weight:  bold;
						line-height:  1.5;
					}

						.quantities_form thead th.size {
							background: #fafafa;
							text-align: center;
							width:      99px;
						}

						.quantities_form thead th.quan {
							background:   #fafafa;
							text-indent:  5px;
							width:        263px;
						}

						.quantities_form thead th.samp {
							background:   #fafafa;
							border-right: 0;
							text-align:   center;
							width:        79px;
						}

						.quantities_form thead th.del {
							background:   #fafafa;
							border-right: 0;
							text-indent:  5px;
							width:        25px;
						}

			.quantities_form tbody {
				padding-top: 5px;
			}

				.quantities_form tbody tr {}

					.quantities_form tbody td {
						border-bottom: 1px solid #e0e0e0;
						font-size:     1.3em;
					}

						.quantities_form tbody tr.error td {
							background:   #ffebe9;
							border-color: #f9d0c7;
						}

						.quantities_form tbody td.size {
							background:  #e0e0e0;
							font-size:   1.5em;
							font-weight: bold;
							text-align:  center;
						}

						.quantities_form tbody td.quan {}
						.quantities_form tbody td.samp { text-align: center; }
						.quantities_form tbody td.del  { width: 20px; }

							.quantities_form tbody td.del a {
								background:  url('/img/icons/cross_faded.png') center center no-repeat;
								display:     block;
								height:      20px;
								text-indent: -10000px;
								width:       20px;
							}

								.quantities_form tbody td.del a:hover {
									background-image: url('/img/icons/cross.png');
								}



	p.actions {
		margin:     0 10px;
		text-align: right;
	}

		.actions a {
			color: #cd1827;
		}

		.actions a.continue {
			background:    #3586be;
			-moz-border-radius:    5px;
			-webkit-border-radius: 5px;
			border-radius: 5px;
			-moz-box-shadow:    0 1px 2px #231f20;
			-webkit-box-shadow: 0 1px 2px #231f20;
			box-shadow:    0 1px 2px #231f20;
			color:         #fff;
			display:       inline-block;
			font-size:     1.3em;
			font-weight:   bold;
			line-height:   30px;
			margin-left:   5px;
			padding:       0 10px;
			text-shadow:   0 1px #19568f;
		}

			.actions a.continue:hover {
				background:      #72aed3;
				text-decoration: none;
			}



	p.back_link {
		background:  #eff0f0;
		display:     inline;
		float:       left;
		font-weight: bold;
		line-height: 30px;
		text-indent: 20px;
		width:       200px;
	}



	p.get_a_quote {
		font-size:   1.8em;
		font-weight: bold;
		margin:      0 0 1.5em;
		padding:     0 15px;
	}

		.get_a_quote a {
			background:    #3586be;
			-moz-border-radius:    5px;
			-webkit-border-radius: 5px;
			border-radius: 5px;
			-moz-box-shadow:    0 1px 2px #231f20;
			-webkit-box-shadow: 0 1px 2px #231f20;
			box-shadow:    0 1px 2px #231f20;
			color:         #fff;
			display:       inline-block;
			font-weight:   bold;
			line-height:   30px;
			padding:       0 10px;
			text-shadow:   0 1px #19568f;
		}

			.get_a_quote a:hover {
				background:      #72aed3;
				text-decoration: none;
			}



	table.sample_table {
		margin: 0 10px 20px;
		width:  850px;
	}

		.sample_table thead {}

			.sample_table thead tr {}

				.sample_table thead th {
					background:     #231f20;
					border:         solid #fff;
					border-width:   0 0 2px 2px;
					color:          #fff;
					font-size:      1.3em;
					height:         35px;
					text-align:     center;
					vertical-align: middle;
				}

				.sample_table thead th.size_desc {
					border-right: 2px solid #fff;
					background:   none;
					color:        #231f20;
					font-weight:  normal;
					padding:      0 5px;
					text-align:   right;
					width:        118px;
				}

					.sample_table thead th.mm {
						font-weight: bold;
					}

					.sample_table thead th.awg,
					.sample_table thead th.amp {
						font-size:   1.1em;
						font-weight: normal;
					}

		.sample_table tbody {}

			.sample_table tbody tr {
				height:         35px;
				vertical-align: middle;
			}

				.sample_table tbody td {
					background:     url('/img/design/sample_table_cell.png') right top no-repeat;
					height:         35px;
					width:          40px;
					text-align:     center;
					vertical-align: middle;
				}

					.sample_table tbody tr:nth-child(even) td {
						background-position: right bottom;
					}

					.sample_table tbody td a {
						background:  url('/img/design/sample_picker_states.png') left top no-repeat;
						display:     block;
						height:      35px;
						overflow:    hidden;
						text-indent: -10000px;
						width:       40px;
					}

						.sample_table tbody td a:hover { background-position: -40px top; }

						.sample_table tbody td a.chosen       { background-position: -80px  top; }
						.sample_table tbody td a.chosen:hover { background-position: -120px top; }

						.sample_table tbody td a.hover { background-position: -80px top !important; }

						.sample_table tbody tr:nth-child(even) td a { background-position: left bottom; }

							.sample_table tbody tr:nth-child(even) td a:hover        { background-position: -40px  bottom; }
							.sample_table tbody tr:nth-child(even) td a.chosen       { background-position: -80px  bottom; }
							.sample_table tbody tr:nth-child(even) td a.chosen:hover { background-position: -120px bottom; }

					.sample_table tbody th {
						border-right: 2px solid #fff;
						font-size:    1.5em;
						line-height:  35px;
						text-indent:  10px;
						width:        128px;
					}

						.sample_table tbody th.black       { background: #231f20; color: #fff; }
						.sample_table tbody th.greenyellow { background: url('/img/design/greenyellow_cable.png') left center no-repeat; }
						.sample_table tbody th.brown       { background: #93683e; }
						.sample_table tbody th.grey        { background: #a1a8ae; }
						.sample_table tbody th.pink        { background: #e7b6bc; }
						.sample_table tbody th.violet      { background: #b29aa7; }
						.sample_table tbody th.darkblue    { background: #19568f; }
						.sample_table tbody th.blue        { background: #3586be; }
						.sample_table tbody th.lightblue   { background: #72aed3; }
						.sample_table tbody th.green       { background: #5bb251; }
						.sample_table tbody th.yellow      { background: #f1d300; }
						.sample_table tbody th.orange      { background: #fb963a; }
						.sample_table tbody th.red         { background: #cd1827; }
						.sample_table tbody th.white       { background: url('/img/design/white_cable.png') left bottom no-repeat; }



	table.spec {
		background: #efefef;
		width:      470px;
	}

		.spec caption {
			background:    #e2e2e2;
			border-bottom: 1px solid #fff;
			font-size:     1.4em;
			font-weight:   bold;
			line-height:   2em;
			text-align:    left;
			text-indent:   10px;
		}

		.spec thead {}

			.spec thead tr {}

			.spec thead th {
				background:   #e2e2e2;
				border:       solid #fff;
				border-width: 0 1px 1px 0;
				font-size:    1.1em;
				font-weight:  normal;
				padding:      2px 3px;
				text-align:   right;
			}

				.spec thead th:last-child,
				.spec thead th.last {
					border-right: 0;
				}

				.spec thead th em {
					color:      #777;
					display:    block;
					margin-top: .5em;
				}

		.spec tbody {}

			.spec tbody tr {}

			.spec tbody td {
				border-right: 1px solid #fff;
				font-size:    1.2em;
				line-height:  1.5em;
				text-align:   right;
				padding:      2px 3px;
			}

				.spec tbody td:last-child,
				.spec tbody td.last {
					border: 0;
				}

				.spec tbody tr:nth-child(even) td,
				.spec tbody tr.even td {
					background: #e2e2e2;
				}



	ul.checkout_progress {
		background: url('/img/design/progress.png') center bottom no-repeat;
		display:    inline;
		float:      right;
		margin:     0 0 1em;
	}

		.checkout_progress li {
			background:     url('/img/design/progress_step.png') center bottom no-repeat;
			color:          #999;
			display:        inline;
			float:          left;
			font-size:      1.2em;
			font-weight:    bold;
			line-height:    30px;
			list-style:     none;
			margin:         0 10px;
			padding-bottom: 12px;
			text-align:     center;
			width:          114px;
		}

			.checkout_progress li.current {
				background-image: url('/img/design/progress_step_current.png');
				color:            #19568f;
			}

			.checkout_progress li.last {
				margin-right: 0;
			}



	ul.sub_nav {
		padding: 0 15px;
		margin:  0 0 2em;
	}

		.sub_nav a {
			color:           #111;
			text-decoration: none;
		}

			.sub_nav a:hover {
				text-decoration: underline;
			}

		.sub_nav li {
			font-size:   1.4em;
			font-weight: bold;
			list-style:  none;
			margin:      0 0 1em;
		}





	/*	footer
	----------------------------------------------------------------------*/

	p#footer {
		border-top:  10px solid #111;
		color:       #777;
		font-weight: bold;
		margin:      0;
		padding:     5px 15px 5px;
		clear:       both;
	}

		#footer a {
			text-decoration: none;
		}

			#footer a:hover {
				text-decoration: underline;
			}