@charset "utf-8";

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

date		16 july 2009
edit		18 july 2009
author 		Niels Westerhof

media		screen
file		hub.css 
			expanding layout.css
    	
/////////////////////////////////////
*/

div#breadcrumbs { width: 960px; height: 16px; margin: 0 0 7px 0; line-height: 16px; text-align: left;}

div#column-container  { width: auto; height: auto; float: left; margin: 0 0 10px 0; }
	div.container-3-column { width: 774px; }
	div.container-4-column { width: 800px; }
	
	div.hub-column { width: auto; height: 436px; float: left; }
	
	div.container-3-column div.hub-column { width: 258px; }
	div.container-4-column div.hub-column { width: 200px; }
	
	div.container-3-column div.column-container { background: url("../images/bg-column-big.png") 0 0 no-repeat; height: 300px; padding: 15px 15px 5px 15px; }
	div.container-4-column div.column-container { background: url("../images/bg-column-small.png") 0 0 no-repeat; height: 300px; padding: 15px 12px 5px 12px; }
	
	div.column-container h2, div.column-container h1 { color: #50404d; font-weight: normal; margin: -4px 0 30px 0; height: 45px; line-height: 23px; vertical-align: top; }
	div.container-3-column div.column-container h2, div.container-3-column div.column-container h1 { width: 175px; font-size: 19px; }
	div.container-4-column div.column-container h2 { width: 130px; font-size: 16px; }
	div.container-1-column h2, div.container-1-column h1 { font-size: 21px; font-weight: normal; }
	
	ul.icon-list { position: absolute; }
	div.container-1-column ul.icon-list { position: relative; } /*z-index: 10; */
	
	div.container-3-column div.column-container ul.icon-list { margin: 6px 0 0 185px; }
	div.container-4-column div.column-container ul.icon-list { margin: 1px 0 0 133px; }
	
	ul.horizontal-list { width: 300px; height: 40px; }
	ul.horizontal-list li { float: left; display: inline; }
	
	div.content-container-1 ul.horizontal-list { margin: -25px 0 0 170px; }
	div.content-container-2 ul.horizontal-list { margin: -25px 0 0 220px; }
	div.content-container-3 ul.horizontal-list { margin: -25px 0 0 300px; }
	
		ul.icon-list li { width: 34px; height: 35px; display: block; margin: 0 0 5px 0; }
		ul.icon-list li.icon-internet { background: url("http://www.online.nl/fileadmin/templates/images/icon-internet.png") 0 0 no-repeat; }
		ul.icon-list li.icon-bellen { background: url("http://www.online.nl/fileadmin/templates/images/icon-telefonie.png") 0 0 no-repeat; }
		ul.icon-list li.icon-hdtv { background: url("http://www.online.nl/fileadmin/templates/images/icon-hdtv.png") 0 0 no-repeat; }
		ul.icon-list li.icon-globe { background: url("http://www.online.nl/fileadmin/templates//images/icon-globe.png") 0 0 no-repeat; }
		ul.icon-list li.icon-overstappen { background: url("http://www.online.nl/fileadmin/templates//images/icon-overstappen.png") 0 0 no-repeat; }
		ul.icon-list li.icon-installatieservice { background: url("http://www.online.nl/fileadmin/templates//images/icon-installatieservice.png") 0 0 no-repeat; }
		
		img.header-image { margin: 0 0 40px 0; }
		
		ul.item-list li { font-size: 12px; padding: 0 0 0 16px; line-height: 24px; background-position: 0 10px; }
			ul.green-list li { background-image: url("../images/bg-li-link.png"); }
			ul.taupe-list li { background-image: url("../images/bg-li-taupe.png"); }
		ul.purple-list { margin-bottom: 0; }
			ul.purple-list li { background-image: url("../images/bg-li-purple.png");}
			
		div.container-3-column div.bottom-price { width: 243px; height: 72px; background: url("../images/bottom-prijs-big.png") 0 -10px no-repeat; padding: 12px 15px 0 0; text-align: right; }
			div.vanaf-prijs-pre { color: #fff; font-size: 12px; font-weight: bold; padding: 5px 8px 0 0; line-height: 18px; }
			div.vanaf-prijs { color: #fff; font-size: 35px; font-weight: bold; font-family: Arial, Helvetica, sans-serif; padding: 0 8px 0 0; margin: 6px 0 0 0; }
		div.container-4-column div.bottom-price { width: 183px; height: 72px; background: url("../images/bottom-prijs-small.png") 0 -7px no-repeat; padding: 12px 10px 0 0; text-align: right; }
	
	/* cadeauweken */
	div.container-3-column a.meer-info-button { width: 122px; height: 27px; display: inline-block; float: right; background: url("http://www.online.nl/images/cadeauweken/hub-button-bekijk-aanbod.png") 0 0 no-repeat; margin: 106px 0 0 106px; position: absolute; }
	div.container-3-column a.meer-info-button-green { width: 122px; height: 27px; display: inline-block; float: right; background: url("http://www.online.nl/images/cadeauweken/button-bekijk-aanbod-green.png") 0 0 no-repeat; margin: 106px 0 0 106px; position: absolute; }
/*	div.container-3-column a.meer-info-button { width: 101px; height: 27px; display: inline-block; float: right; background: url("../images/button-meer-info.png") 0 0 no-repeat; margin: 106px 0 0 125px; position: absolute; }	*/
	div.container-4-column a.meer-info-button { width: 101px; height: 27px; display: inline-block; float: right; background: url("../images/button-meer-info.png") 0 0 no-repeat; margin: 68px 0 0 0; }
	
	div.container-3-column a:hover.meer-info-button,
	div.container-3-column a:hover.meer-info-button-green,
	div.container-4-column a:hover.meer-info-button { background-position: 0 -27px; }
	
div#info-column-big { width: 186px; height: 400px; float: left; }
div#info-column-small {
	width: 160px;
	height: 400px;
	float: left; 
	position:absolute;
	bottom:-12px;
	*bottom:5px;
	right: 0px;
}

	div#info-column-big a.customer-toggle { width: 186px; height: 27px; display: block; background: url("http://www.online.nl/fileadmin/templates/images/toggle-customer-big.png") 0 0 no-repeat; }
	div#info-column-small a.customer-toggle { width: 160px; height: 27px; display: block; background: url("http://www.online.nl/fileadmin/templates/images/toggle-customer-small.png") 0 0 no-repeat; }
	
	div#info-column-big .alreadycustomer a.customer-toggle { width: 186px; height: 27px; display: block; background: url("http://www.online.nl/fileadmin/templates/images/toggle-customer-big.png") 0 -54px no-repeat; }	
	div#info-column-big .alreadycustomer a:hover.customer-toggle { width: 186px; height: 27px; display: block; background: url("http://www.online.nl/fileadmin/templates/images/toggle-customer-big.png") 0 -81px no-repeat; }

	div#info-column-big a:hover.customer-toggle,
	div#info-column-small a:hover.customer-toggle { background-position: 0 -27px; }
	
	div#info-column-big div.telefonisch-bestellen { width: 186px; height: 195px; background: url("http://www.online.nl/fileadmin/templates/images/bg-telefonisch-bestellen-small.png") 50% 0 no-repeat; margin: 12px 0 6px 0; }
	div#info-column-small div.telefonisch-bestellen { width: 160px; height: 195px; background: url("http://www.online.nl/fileadmin/templates/images/bg-telefonisch-bestellen-small.png") 50% 0 no-repeat; margin: 12px 0 6px 0; }
	
	div#info-column-small div.telefonisch-bestellen-no-image { width: 160px; height: 195px; background: url("http://www.online.nl/fileadmin/templates/images/bg-telefonisch-bestellen-nummer.png") 50% 0 no-repeat; margin: 12px 0 6px 0; }
	div#info-column-small div.telefonisch-bestellen-image { width: 160px; height: 195px; background: url("http://www.online.nl/fileadmin/templates/images/bg-telefonisch-bestellen-new.png") 50% 0 no-repeat; margin: 12px 0 6px 0; }
	
	div#info-column-small div.telefonisch-bestellen#recruitment { background: url("http://www.online.nl/fileadmin/templates/images/recruitment.png") 50% 0 no-repeat; }
	
	div#info-column-big div.special-info-block { width: 165px; height: 155px; background: url("http://www.online.nl/fileadmin/templates/images/bg-info-block-big.png") 0 0 no-repeat; padding: 10px 0 10px 17px;}
	div#info-column-small div.special-info-block { width: 149px; height: 155px; background: url("http://www.online.nl/fileadmin/templates/images/bg-info-block-small.png") 0 0 no-repeat; padding: 15px 0 10px 10px; }
	
		ul.special-list li { background: none; padding: 0; line-height: 24px; }
			ul.special-list li a { display: block; font-size: 11px; font-weight: normal; text-decoration: none; padding: 0 0 0 22px; color: #c821ac; }
			ul.special-list li a:hover { text-decoration: underline; }
				ul.special-list li a.call-me-back { background: url("http://www.online.nl/fileadmin/templates/images/icon-telefoon.png") 0 50% no-repeat; }
				ul.special-list li a.test-speed { background: url("http://www.online.nl/fileadmin/templates/images/icon-kilometerteller.png") 0 50% no-repeat; }
				ul.special-list li a.why-online { background: url("http://www.online.nl/fileadmin/templates/images/icon-info.png") 0 50% no-repeat; }
				ul.special-list li a.installatieservice { background: url("http://www.online.nl/fileadmin/templates/images/icon-installatieservice2.png") 0 50% no-repeat; }
				ul.special-list li a.email-recruitment { background: url("http://www.online.nl/fileadmin/templates/images/icon-email2.png") 0 50% no-repeat; }
				ul.special-list li a.winkelmandje { background: url("http://www.online.nl/fileadmin/templates/images/icon-winkelmandje.png") 0 50% no-repeat; }

div.column-container ul { height: 200px; }
div.column-container ul li { font-size: 12px; line-height: 24px; padding: 0 0 0 16px; background-position: 0 10px; background-image: url('../images/bg-li-link.png'); }
div.column-container ul li ul { height: auto; background-position: 0 10px; margin: 15px 0 0 0; }
div.column-container ul li ul li { background-image: url("../images/bg-li-taupe.png"); margin: 0 0 0 -16px; }
div.column-container ul li ul li ul { height: auto; background-position: 0 10px; }
div.column-container ul li ul li ul li { background-image: url("../images/bg-li-purple.png");}

div.column-container p.bodytext { color: #c821ac; font-size: 12px; }
div.column-container a { }
div.column-container a:hover { text-decoration: none; color: #50404D; }

div.container-3-column div.bottom-price img {}
div.container-4-column div.bottom-price img {}
				
/* sub pagina hub */
div.spacer-block { widows: auto; height: 27px; }

div.container-1-column { width: 800px; height: 400px; display: block; }

	div.content-container-1 { width: 770px; height: 365px; background: url("http://www.online.nl/fileadmin/templates/images/bg-container-table-1.png") 0 0 no-repeat; padding: 15px 15px 0 15px; }
	div.content-container-2 { width: 770px; height: 365px; background: url("http://www.online.nl/fileadmin/templates/images/bg-container-table-2.png") 0 0 no-repeat; padding: 15px 15px 0 15px; }
	div.content-container-3 { width: 770px; min-height: 365px; display: table; background: url("http://www.online.nl/fileadmin/templates/images/bg-container-table-3.png") 0 0 no-repeat; padding: 15px 15px 0 15px; }

	div.bottom-container { width: 800px; height: 20px; background: url("http://www.online.nl/fileadmin/templates/images/bg-container-table-bottom.png") 0 0 no-repeat; margin: 0 0 5px 0; }


table { border-spacing: 3px; }
	table.producten { width: 755px; margin: -30px 0 0 0; float: left; }
		table.producten th { font-weight: normal; text-align: center; padding: 0 0 10px 0;}
		table.producten th h3, table.producten th h2 { font-weight: bold; font-size: 13px; }
			table.producten td { background: #ffffff; padding: 0 12px; }

			table.producten td a { text-decoration: underline;}
			td.comparison-20, td.comparison-25, td.comparison-30 { width: 136px; text-align: center; height: 24px; }

div.table-price { color: #c821ac; font-weight: normal; font-size: 20px; padding: 5px 0 0 0; }

img.comparisonIcon { margin-right: 12px; vertical-align: middle; float: left; }
span.highlight { font-weight: bold; color: #c821ac; }
span.highlight-hdtv { color: #c821ac; }
a.highlight	{ color: #c821ac; }

div.button-container { float: right; padding: 0px 15px 0 0; }
	div.buttons a { font-size: 10px; font-family: Verdana, Geneva, Helvetica, sans-serif; }
	div.buttons { float: left; text-align: center; margin: 0 2px 0 0; }
	a.bestel-button { width: 160px; height: 27px; display: block; background: url("http://www.online.nl/fileadmin/templates/images/button-bestellen.png") 0 0 no-repeat; margin: 0 0 5px 0; }
	
	a.bestel-button-bestel { width: 160px; height: 27px; display: block; background: url("http://www.online.nl/fileadmin/templates/images/button-bestel.png") 0 0 no-repeat; margin: 0 0 5px 0; }
	a.bestel-button-verder { width: 160px; height: 27px; display: block; background: url("http://www.online.nl/fileadmin/templates/images/button-verder.png") 0 0 no-repeat; margin: 0 0 5px 0; }
	
/* product detail page */
table.productdetails { width: 425px; margin: 35px 0 0 0; float: left; }
	table.productdetails th { text-align: left; }
		table.productdetails th h3 { color: #c821ac; font-size: 12px; margin: 0 0 10px 0; letter-spacing: 0.05em; }
		table.productdetails td { font-size: 12px; padding: 3px 0; }

div.check-list-container { width: 425px; margin: 35px 0 0 0; float: left; }
	div.check-list-container h3 { color: #c821ac; font-size: 12px; margin: 0 0 10px 0; letter-spacing: 0.05em; }
		ul.check-list li { height: 30px; background: url("/images/icons/icoon-beschikbaar.png") 0 50% no-repeat; font-size: 12px; padding: 0 0 0 35px; line-height: 30px; }

div.sub-info-block { width: 252px; height: 46px; background: url("http://www.online.nl/fileadmin/templates/images/bg-block.png") 0 0 no-repeat; }
	div.sub-info-block a { display: block; padding: 4px 0 0 45px; height: 46px; float: left; font-size: 13px; cursor: pointer; margin: 0 0 0 10px; line-height: 17px; }
	a.icon-arrow { background: url("http://www.online.nl/fileadmin/templates/images/icon-large-arrow.png") 0 50% no-repeat; }
	a.icon-wrench { background: url("http://www.online.nl/fileadmin/templates/images/icon-large-wrench.png") 0 50% no-repeat; }
	
div.good-to-know { float: left; width: 285px; padding: 0 0 0 40px; }
	div.good-to-know h3 { color: #c821ac; font-size: 12px; letter-spacing: 0.05em; margin: 0 0 10px 0; }
	div.good-to-know ul li { font-size: 12px; line-height: 24px; background-position: 0 10px; }
	
div.package-price { background: url("http://www.online.nl/fileadmin/templates/images/bg-productdetails.png") 0 0 no-repeat; width: 338px; height: 189px; float: left; position: relative; z-index: 2; left: 6px; top: 14px; }
div.package-price-hdtv { background: url("http://www.online.nl/fileadmin/templates/images/bg-productdetails.png") 0 0 no-repeat; width: 338px; height: 189px; float: left; position: relative; z-index: 2; left: 6px; top: 37px; }
div.package-price-hdtv-extra { background: url("http://www.online.nl/fileadmin/templates/images/bg-productdetails.png") 0 0 no-repeat; width: 338px; height: 189px; float: left; position: relative; z-index: 2; left: 6px; top: 97px; }
	a.button-bestellen-small { width: 101px; height: 27px; background: url("http://www.online.nl/fileadmin/templates/images/button-bestel-small.png") 0 0 no-repeat; display: block; }
			
	img.box-art { float: left; margin: 0 0 0 55px; }
	div.price-bestel-container { float: right; padding: 35px 15px 0 0; }
	div.discountline {padding: 19px 15px 0 0 !important; }

		img.productdetail-price { margin: 0 0 7px 0; }
	div.sub-package-text p { float: left; width: 338px; text-align: center; line-height: 55px; }
	
/* hub page hdtv */
table.producten-hdtv { width: 755px; margin: 10px 0 0 0; float: left; }
	table.producten-hdtv th { text-align: center; }
		table.producten-hdtv h2, table.producten-hdtv h3 { font-weight: bold; font-size: 15px; }
		table.producten-hdtv h4 { font-weight: normal; font-size: 11px; color:#50404d; }
			table.producten-hdtv td { background: #fff; padding: 0 12px; line-height: 24px; }
				table.producten-hdtv td a { text-decoration: underline; }
				table.producten-hdtv td.bg-none { background: transparent; }
				table.producten-hdtv td.header-td { background: #f4f6e4;  padding: 8px 0; }
		
			td.comparison-all { width: 89px; text-align:center !important; height: 24px; }
			.comparison-wide {width: 200px !important;}
			
			div.contain-header { float: left; width: 113px; text-align: center; }
			img.icon-hdtv { margin-right: 10px; }
			img.icon-stars { float: left; margin-top: 17px; }
			
			div.actie-block { float: left; padding: 5px 0; line-height: 15px;  }
			
			a.bestellen-button-small { margin: 0 0 5px 0; width: 113px; height: 27px; display: block; background: url("http://www.online.nl/fileadmin/templates/images/button-bestellen-small.png") 0 0 no-repeat; }
			
			a.bestel-button-small { margin: 0 0 5px 0; width: 113px; height: 27px; display: block; background: url("../images/button-bestel-small.png") 0 0 no-repeat; }
			a.verder-button-small { margin: 0 0 5px 0; width: 113px; height: 27px; display: block; background: url("../images/button-verder-small.png") 0 0 no-repeat; }
			
table.button-holder { width: auto; }
	table.button-holder td { text-align: center; padding: 0; }
		table.button-holder td a { font-size: 10px; font-family: Verdana, Geneva, Helvetica, sans-serif; }
		
				
/* channel overview */
div.channel-container { background: #e5e5e5 url("../images/bg-channel-overview.png") 0 0 no-repeat; width: 670px;  padding: 15px 0 0 20px;}
	div.channel-container h2 { color: #50404d; font-weight: normal; margin: 0 30px 0 0; line-height: 23px; vertical-align: top; font-size: 20px; }
	div.channel-container h3 { color: #50404d; font-weight: normal; margin: 0; line-height: 23px; vertical-align: top; font-size: 17px; }
	ul.hdtv-list { position: relative; margin: -25px 0 0 260px; height: 50px; }
	ul.hdtv-list li { float: left; }
	
	
	div.channel-content { padding: 25px 0 0 0; }
		div.channel-content p { margin: 0 0 15px 0; }
		
	div.basis-zenders { width: 663px; height: 236px; background: url("../images/bg-basis-zenders.png") 0 0 no-repeat; margin: 5px 0 0 0; padding: 6px; }
	div.hd-zenders { width: 663px; height: 67px; background: url("../images/bg-hd-zenders.png") 0 0 no-repeat; margin: 5px 0 0 0; padding: 6px; }
	div.extra-zenders { width: 663px; height: 47px; background: url("../images/bg-extra-zenders.png") 0 0 no-repeat; margin: 5px 0 0 0; padding: 5px 0 0 7px; }

div#front-page { width: 943px; height: 420px; padding: 10px 16px; background: url("http://www.online.nl/images/landing/campagne-geen-dief/bg-frontpage.png") 0 0 no-repeat; padding-left: 1px;padding-top: 14px;  }
	div#front-page h1 { color: #c821ac; width: auto; height: auto; float: none; margin: 0 0 10px 0;font-size: 35px; font-weight: normal; position: relative; line-height: normal; }

		div.frontpage-visual { width: 943px; height: 414px; background: url('http://www.online.nl/images/landing/campagne-geen-dief/bg-internet-bellen-visual.jpg') no-repeat; text-align: right; float: left; }
		
		div.frontpage-info { width: 485px; float: left; text-align: left; margin-left: 464px; display: inline;}
			div.frontpage-info p { font-size: 12px;  width: 485px;   }

			div.frontpage-info h2 { color: #c821ac; font-weight: normal; font-size: 14px; margin: 0 0 5px 0; }
			div.frontpage-info ul li	{ background: transparent url("../images/bg-li-link.png") no-repeat scroll 0 7px; }
		div.frontpage-buttons { width: 290px; height: 160px; float: left; }
			div.frontpage-buttons a { width: 300px; height: 80px; display: block; position: relative; z-index: 5; }
				div.frontpage-buttons a.internet { background: url("http://www.online.nl/images/landing/campagne-geen-dief/frontpage-button-internet.png") 0 0 no-repeat; }
				div.frontpage-buttons a.internet-bellen { background: url("http://www.online.nl/images/landing/campagne-geen-dief/frontpage-button-internet-bellen.png") 0 0 no-repeat; }
				div.frontpage-buttons a.internet-bellen-hdtv { background: url("http://www.online.nl/images/landing/campagne-geen-dief/frontpage-button-internet-bellen-hdtv.png") 0 0 no-repeat; }
				a.overlay-vergelijkingstabel {color: #c821ac; }
	
	div#vergelijkingstabel { background: url('http://www.online.nl/images/landing/campagne-geen-dief/bg-vergelijkingstabel.png') no-repeat; width: 449px; height: 187px; margin-top: 33px; padding: 17px 18px 17px 18px;}
	div#vergelijkingstabel img { margin-bottom: 2px; }
	div#vergelijkingstabel a {color: #c821ac}
	a.cta { height: 27px; width: 129px; background: url('http://www.online.nl/images/landing/campagne-geen-dief/btn-bespaar-direct.png') no-repeat; display: block; float: right; margin: 10px 10px 0 0;}
	a:hover.cta { background-position: 0 -27px; }

/*
** overlays
*/

div.vergelijk-tarieven{ width: 470px; height: 236px; background: url("../images/bg-vergelijk-tarieven.png") 0 0 no-repeat; margin: 5px 0 0 0; padding: 11px; }
img.overlay-installatieservice-stap1	{ float: left; margin-right: 5px; }
img.overlay-installatieservice-stap2	{ float: left; margin-right: 5px; padding-top: 4px; }
img.overlay-installatieservice-stap3	{ float: left; margin-right: 5px; padding-top: 8px; }
table.overlay-aansluitkosten	 {width: 475px;}

/*
** hub pages
*/

table.producten-hdtv a.comparisonHeaderLink	{ text-decoration: none; color: #50404d; }
a.comparisonHeaderLink:hover	{ text-decoration: none; color: #50404d;}
div.actielijst {position: absolute;}



/* CADEAUWEKEN OVERRIDES */

/*#cw-ctab {
	display: none;
}*/

div#rightCol {
	display: none !important;
}	
	
div#leftCol {
	width: 960px !important;
	height: 346px !important;
	background: url('http://www.online.nl/images/cadeauweken/bg-homepage.jpg') no-repeat !important;
}

#leftColBlocks {
	margin-left: 5px !important;
	margin-top: 5px !important;
}		

div#onlineUPS {
	left: 229px !important;
	top: 70px !important;
}

div#onlineUPS h1 {
	display: none !important;
}

div#cw-ctab {
	position: relative;
	height: 35px;
	width: 153px;
	left: 805px;
	top: 234px;
}

/*
** hub layout wijzigingen voor cadeauweken
*/

div.container-3-column div.bottom-price-internet {
			background:transparent url('http://www-admin.online.nl/images/cadeauweken/hub-bg-internet.png') no-repeat scroll 0 -10px;
			height:30px;
			padding:53px 15px 0 0;
			text-align:right;
			width:243px;
			}

		div.container-3-column div.bottom-price-internet-bellen {
			background:transparent url('http://www-admin.online.nl/images/cadeauweken/hub-bg-internet-bellen.png') no-repeat scroll 0 -10px;
			height:30px;
			padding:53px 15px 0 0;
			text-align:right;
			width:243px;
			}
			
		div.container-3-column div.bottom-price-internet-bellen-hdtv {
			background:transparent url('http://www-admin.online.nl/images/cadeauweken/hub-bg-internet-bellen-hdtv.png') no-repeat scroll 0 -10px;
			height:30px;
			padding:53px 15px 0 0;
			text-align:right;
			width:243px;
			}
			
		div.container-3-column a.bekijk-aanbod-button {
			background:transparent url('http://www.online.nl/images/cadeauweken/hub-button-bekijk-aanbod.png') no-repeat scroll 0 0;
			display:inline-block;
			float:right;
			height:27px;
			margin:106px 0 0 106px;
			position:absolute;
			width:122px;
			}
			


#actieLink {
	position:relative;
}

.actieLink {
	height:100px;
	position:absolute;
	top:130px;
	width:255px;
}