@charset "utf-8";
	
	/* CSS Document Youfone.nl - Zakelijk */
	/* Groen Brandmanual: #97be0d; Roze Brandmanual: #8e004d; Grijs Brandmanual: #666666; */

	html { background: url('../images/gradient-bg.gif') left top repeat-x #666666; }
	body { background: url('../../images/body-bg.gif') center top repeat-y; margin: 0; padding: 0px 0px 0px 1px; text-align: center; font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #6a6a6a; }
	#container { margin: 0 auto 0 auto; width: 900px; background: url('../images/header-bg.gif') top left no-repeat; text-align: left; min-height: 800px; height: auto !important; height: 800px; position: relative; padding: 151px 0 0 0; }

	a { text-decoration: none; font-weight: bold; color: #97be0d; }
		a:hover { text-decoration: underline; }

	#particulieren { position: absolute; right: 100px; top: 80px; }
		#particulieren img { width: 130px; height: 27px; }
	#zakelijk { position: absolute; right: 0px; top: 80px; }
		#zakelijk img { width: 100px; height: 27px; }

	ul#menu { margin: 0px; padding: 0px; position: absolute; right: 230px; top: 122px; }
	ul#menu li { display: inline; margin-left: 20px; }
		ul#menu li a { color: #666; }
		ul#menu li a:hover { color: #7b7a7b; }

	h2 { color: #8e004d; font-size: 30px; margin: 0px; padding: 0px; margin-left: 40px; text-transform: uppercase; }
	h3 { color: #6a6a6a; font-size: 20px; margin: 0px; padding: 0px; margin-left: 40px; margin-bottom: 20px; text-transform: uppercase; width: 500px; }
		.subh3 { margin-top: 40px; margin-bottom: 10px; }
	
	p { margin-left: 40px; width: 470px; line-height: 22px; }
	.startpar { margin-top: 20px; }
	
	p#breadcrumb { position: absolute; left: 0px; top: 0px; }
	p#breadcrumb a { color: #a3a3a3; }
	
	ul { list-style: none; }
		ul li { line-height: 20px; }
		ul li a:hover { text-decoration: none; color: #bbe91b; }
		ul li a span { margin-right: 15px; }
		ul li a:hover span { padding-left: 10px; margin-right: 5px; }

	ul.opsomming { margin-left: 40px; }
		ul.opsomming li { width: 500px; }
		ul.opsomming li span { float: right; display: inline; }
	
	#homebanner { width: 900px; height: 342px; background: url('../images/banner-home.jpg') left top; position: relative; }
	
	#homebanner #zakelijkblok { width: 196px; height: 136px; position: absolute; bottom: 31px; right: 41px; padding: 61px 20px 10px 15px; }
		#homebanner #zakelijkblok h3 { margin: 0px; width: 176px; }
		#homebanner #zakelijkblok h3 img { position: absolute; left: 0px; top: 0px; width: 232px; height: 48px; }
		#homebanner #zakelijkblok li { font-weight: bold; color: #8e004d; padding-left: 20px; line-height: 25px; background: url('../images/homeblok-vinkje.gif') left center no-repeat; }
		#homebanner #zakelijkblok .bestelknop { background: url('../../images/home-bestel-over.gif') left top no-repeat; display: block; width: 163px; height: 42px; position: absolute; left: 34px; bottom: 15px; }
		
	#homeblokken { width: 860px; margin: 20px 0 0 20px; height: 244px; }
		#homeblokken div { width: 293px; height: 214px; float: left; position: relative; display: inline; }
			#homeblokken #calculator { background: url('../images/homeblok-calculator.gif') left top no-repeat;/*background: url('../images/homeblok-onderling-bellen.gif') left top no-repeat;*/ }
			#homeblokken #mobielinternet { width: 294px; background: url('../images/homeblok-mobiel-internet.gif') left top no-repeat; }
			#homeblokken #tarieven { width: 273px; background: url('../images/homeblok-tarieven.gif') left top no-repeat; }

	#homeblokken #calculator { padding-top: 48px; text-align: center; font-weight: bold; height: 166px; }
		#homeblokken #calculator form { width: 193px; }
		/*  #homeblokken #calculator p { width: 213px; text-align: left; margin: 20px; font-weight: normal; line-height: 14px; padding-top: 28px; }
		*/#homeblokken #calculator p { width: 193px; line-height: 59px; }
		#homeblokken #calculator label { font-weight: bold; color: #666; font-size: 14px; position: absolute; left: 94px; top: 101px;}
		#homeblokken #calculator input { width: 80px; height: 25px; border: 1px solid #666666; position: absolute; left: 82px; top: 94px; padding-left: 20px; color: #666; }
		/* #homeblokken #calculator .bestelknop { background: url('../../images/home-bestel-over.gif') left top no-repeat; display: block; width: 163px; height: 42px; position: absolute; left: 54px; bottom: 15px; }
		 */#homeblokken #calculator .bestelknop { background: url('../images/vc-knop-over.png') left top no-repeat; display: block; width: 183px; height: 42px; position: absolute; left: 43px; bottom: 15px; }

	#homeblokken #mobielinternet { width: 253px; height: 134px; padding: 70px 20px 10px 20px; }
	#homeblokken #mobielinternet h3 { font-size: 12px; text-transform: none; margin: 0px; width: 233px;  }
	#homeblokken #mobielinternet p { margin: 0px; width: 233px; line-height: 14px;  }
	#homeblokken #mobielinternet .bestelknop { background: url('../../images/home-bestel-over.gif') left top no-repeat; display: block; width: 163px; height: 42px; position: absolute; left: 54px; bottom: 15px; }

	#homeblokken #tarieven { width: 237px; height: 144px; padding: 60px 20px 10px 16px; }
	#homeblokken #tarieven p.mroze { font-size: 14px; color: #8e004d; font-weight: bold; margin: 0px; width: 215px; line-height: 14px; background: url('../images/homeblok-tarievenbullet.gif') left center no-repeat; padding-left: 18px; line-height: 36px; }
	#homeblokken #tarieven a { color: #8e004d; }
		#homeblokken #tarieven a:hover { color: #ad005f; text-decoration: none; }
	#homeblokken #tarieven p { font-weight: bold; color: #666666; width: 215px; line-height: 14px; margin: 0px; padding-left: 18px; }
	#homeblokken #tarieven select { width: 212px; margin: 13px 0 0 16px; color: #666; }	

	#footer1 { background: url('../images/footer-bot.gif') left bottom no-repeat #f3f3f3; margin: 30px 0 0 0; border-top: 1px solid #dcdcdc; }
	#footer1 div.blok { float: left; width: 262px; margin: 18px 3px 24px 30px;  display: inline;}
	#footer1 h4 { font-size: 19px; color: #8e004d; text-transform: uppercase; }
	#footer1 ul { margin: 14px 0 0 0; }
	#footer1 ul li { line-height: 16px; }
	#footer1 a { color: #333333; text-decoration: none; font-weight: normal; font-size: 11px; }
		#footer1 a:hover { color: #666666; }
	
	#footer2 { width: 900px; background-color: #666666; color: #fff; text-align: center; padding: 40px 0 10px 0; }
		#footer2 a { color: #fff; margin: 0 5px 0 5px; }
		#footer2 p { font-size: 11px; width: 900px; margin: 0 0 24px 0; line-height: 18px; }
		#footer2 p.seos { font-size: 9px; }

	#content { margin: 30px 0 0 0; padding-top: 30px; min-height: 600px; height: auto !important; height: 600px; position: relative; }

	.clear { clear: both; }
	.toelichting { font-size: 9px; }

	#zoekres { margin: 0 40px 40px 40px; }
		#zoekres h3 { margin: 20px 0 10px 0; }
		#zoekres p { margin-left: 0px; }

		#zoekform { position: absolute; right: 0px; top: 117px; }
		#zoekform p.zoekvelden { width: 220px; height: 168px; display: block; position: relative; padding: 0px; }
		#zoekform #query { width: 148px; height: 16px; padding: 4px; font-size: 11px; border: 1px solid #d5d7d7; color: #6a6a6a; background: url('../../images/zoekveldbg.gif') 4px 50% no-repeat; position: absolute; right: 55px; top: 1px; }
			#zoekform #query:focus { background: none; }
		input#submit { height: 24px; width: 23px; background: url('../../images/zoekbut.gif') left top no-repeat; position: absolute; right: 25px; top: 1px; }
			input#submit:hover { background-position: left bottom; }

		.groen { color: #97be0d; }
		.paars { color: #8e004d; }

/* Bestelformulier */
	#bestellen table { margin: 0 0 0 22px; width: 856px; }
	#bestellen th { background-color: #f3f3f3; width: 573px; border-right: 5px solid #fff; border-bottom: 5px solid #fff; font-weight: normal; vertical-align: top; text-align: left; }
		#bestellen p.boldpink { font-weight: bold; color: #8e004d; margin: 20px 0 20px 20px; }
		#bestellen p { margin: 0 0 0 20px; line-height: 15px; width: 520px; }
			#bestellen p.toelichting { margin: 10px 0 0 37px; }
		#bestellen h4 { font-size: 14px; margin: 18px 0 14px 20px; }
		#bestellen ul { font-weight: bold; color: #8e004d; margin: 0 0 0 20px; }
		#bestellen li { background: url('../../images/homeblok-vinkje.gif') left 4px no-repeat; padding-left: 17px; line-height: 24px; }
		
		#bestellen ul.norm { color: #666; font-weight: normal; width: 450px; }
		#bestellen ul.norm li { background-position: 0px 5px; }

		#bestellen td, #kieswijzer td { background-color: #f3f3f3; width: 278px; border-bottom: 5px solid #fff; text-align: center; padding: 15px 0 15px 0; }
		#bestellen .headerlinks, #bestellen .headerlinks2, #bestellen .headerlinks3 { width: 573px; height: 48px; text-indent: -5000px; background: url('../../images/bestelheader-groen.gif') left top repeat-x; padding: 0px; }
			#bestellen .headerlinks2 { background: url('../../images/bestelheader-groen2.gif') left top no-repeat; }
			#bestellen .headerlinks3 { background: url('../../images/bestelheader-groen3.gif') left top no-repeat; }
		#bestellen .headerrechts, #kieswijzer .headerrechts { width: 278px; height: 48px; text-indent: -5000px; background: url('../../images/bestelheader-rechts.gif') left top no-repeat; padding: 0px; }
		#bestellen td.winkelmandje, #kieswijzer td.winkelmandje { height: 380px; text-align: left; vertical-align: top; }
		#bestellen td.opsomming, #kieswijzer td.opsomming { width: 246px; height: 16px; background-color: #aaaaaa; color: #fff; padding: 16px; font-size: 14px; font-weight: bold; text-align: left; }
			#bestellen .opsomming span, #kieswijzer .opsomming span { position: absolute; right: 36px; text-align: right; width: 100px; }
			#kieswijzer td#besparing { background-color: #8e004d; display: none; }
			.herinnerservicekw { width: 525px; text-align: center; }
				.herinnerservicekw img { margin: 20px auto 0 auto; }
		
		#bestellen .onderling { font-weight: bold; position: relative; width: 367px; }
		
			#bestellen .onderling span { position: absolute; right: 0px; }
		#bestellen .datapakketten ul { width: 367px; position: relative; }
			#bestellen .datapakketten li.novinkje { background: none; color: #6a6a6a; padding: 0px; }
			#bestellen .datapakketten span { position: absolute; right: 0px; }
			#bestellen .datapakketten .toelichting { margin: 10px 0 20px 20px; }
		
	#bestellen dl { margin: 0 0 0 18px; line-height: 23px; font-weight: bold; }
		#bestellen dt { color: #97be0d; margin-top: 3px; }
		#bestellen dd { width: 245px; position: relative; }
		#bestellen dd span { position: absolute; right: 0px; top: 0px; }
			/*#bestellen dd#abbokosten { height: 40px; }*/
			#bestellen dd span.oudeprijs { position: absolute; right: -1px; top: 0px; color: #666; }
			#bestellen dd#abbokosten .stripeww { position: absolute; right: -1px; top: 6px; }
			#bestellen dd span.nieuweprijs { top:20px; }
			#bestellen dd span.nieuweprijs span { position: static; color: #97be0d; }
			
			#bestellen dd span.nofloat { position: static; float: none; }
			
	#bestellen .bestelknop { margin: 0 auto 0 auto; background: url('../../images/bestelknop-over.gif') left top no-repeat; display: block; width: 239px; height: 42px; border: none; }
	
	#kieswijzer .bestelknop { margin: 0 auto 0 auto; background: url('../../images/home-bestel-over.gif') left top no-repeat; display: block; width: 163px; height: 42px; border: none; }
	
	#bestellen th.voorwaarden { padding: 0 0 0 18px; }
		#bestellen th.voorwaarden ul li { background-position: 0px 5px; }
		#bestellen th.voorwaarden p { margin: 20px 0 20px 0; }
	
	ul.bgfixed li { float: left; clear: both; width: 470px; }
		a.uitklap { display: block; }
		.uitklap { display: none; }

	
	#dataverbruik { margin: 10px 0 0 20px; }
	
	#bestelform #formstap1 { padding: 20px 0 20px 0; }
	#bestelform label { display: block; width: 140px; float: left; line-height: 24px; clear: left; }
	#bestelform input, #bestelform textarea { float: left; border: 1px solid #cccccc; padding: 3px; color: #6a6a6a; height: 16px; margin: 2px 0 2px 0;  display: inline;} 
		#bestelform textarea { height: 100px; width: 300px; }
	#bestelform input.radio { float: none; border: none; }
	#bestelform input.radio2 { float: none; border: none; }
	#bestelform select { float: left; border: 1px solid #cccccc; padding: 0px; color: #6a6a6a; height: 22px; margin: 2px 2px 2px 0;  display: inline; } 
	#bestelform h4 { clear: both; }
	#bestelform label.checkbox { width: 500px; }
	#bestelform label.radio2 { width: 500px; margin: 0 0 0 15px; }
	#bestelform input.checkbox { padding: 0px; border: none; float: none; margin: 0 10px 0 0; }
	#bestelform span { float: left; line-height: 24px; }
	#bestelform span.radio { float: none; position: relative; top: auto; right: auto; }
	#bestelform #nrbehoud_1, #bestelform #nrbehoud_2, #bestelform #nrbehoud_3, #bestelform #nrbehoud_4, #bestelform #nrbehoud_5, #bestelform #nrbehoud_6, #bestelform #nrbehoud_7, #bestelform #nrbehoud_8, #bestelform #nrbehoud_9, #bestelform #nrbehoud_10 { margin-left: 20px; display: none; clear: left; }
	#bestelform #formstap1 span.toelichting { float: none; clear: both; display: block; width: 240px; padding: 0 0 0 140px;  display: inline;}
	#bestelform #formstap1 .bestelknop { margin: 20px 0 0 15px; background: url('../../images/bestelknop-next-over.gif') left top no-repeat; display: block; float: left; clear: both; display: inline; }
	
	#bestelform input.rood { border: 1px solid #CC0000; }
	#bestelform .rood { color: #CC0000; }
	
	#bestelform input.datapakket_radio { border: none; clear: left; }
	#bestelform .onderling input { border: none; clear: left; }

	#contactformulier { width: 700px; height: 700px; margin: 0 0 0 30px; }

/* faq */

	#faqblokken { width: 540px; margin: 20px 0 0 40px; }
	.faqblok, .miblok { width: 249px; height: 90px; display: blok; float: left; margin: 0 20px 20px 0; background: url('../../images/faqblok-bg.gif') left top no-repeat; position: relative; cursor: pointer; display: inline; }
		.faqblok h3, .miblok h3 { color: #8e004d; text-transform: none; font-size: 14px; position: absolute; left: 0px; top: 14px; width: 200px; line-height:22px;}
		.faqblok p, .miblok p { width: 190px; position: absolute; left: 0px; top: 35px; line-height: 16px; font-weight: bold; }
		.faqblok p a, .miblok a { color: #6a6a6a; }
			.faqblok a:hover, .miblok a:hover { text-decoration: none; }

	#top8 { width: 268px; background: url('../../images/top8faqheader.gif') top left no-repeat #f3f3f3; float: right; margin: 20px 30px 0 0; padding: 70px 10px 0 0; display: inline; }
	#top8 ul { margin-bottom: 20px; }
	#top8 li { display: block; line-height: 20px; margin: 0 0 10px 18px; padding-left: 15px; background: url('../../images/bullet.gif') left top no-repeat; }
		#top8 li a { color: #666666; }
		#top8 li a:hover { color: #333333; }

	#faqs { margin-left: 40px; line-height: 30px; }
		#faqs dd { line-height: 16px; width: 500px; margin-bottom: 20px; }
		#faqs dd h3 { font-weight: normal; margin: 0px; color: #97be0d; text-transform: none; font-size: 12px; }

/* tarievenpagina's */

		#tarievenpaginas h4.cufon { display: block; background: url('../../images/headerbg-groen.gif') left top repeat-x #97be0d; width: 508px; height: 24px; color: #fff; margin: 0 0 20px 30px; padding: 12px 12px 12px 32px; font-size: 24px; text-transform: uppercase; position: relative; }
			#tarievenpaginas h4.cufon a { color: #fff; }
			#tarievenpaginas h4.cufon a:hover { text-decoration: none; }
			#tarievenpaginas h4.cufon img { position: absolute; left: 0px; top: 0px; }
			#tarievenpaginas p { margin-bottom: 20px; }
			#tarievenpaginas #anderetarieven h4.cufon { margin-bottom: 0px; }
		#tarievenpaginas table { margin: 0 0 20px 30px; width: 550px; }
		#tarievenpaginas td { padding: 10px; border: 1px solid #999; }
		#tarievenpaginas th { padding: 10px; border: 1px solid #999; text-align: left; }
			#tarievenpaginas tr.tabje th, #tarievenpaginas tr.tabje td, #tarievenpaginas tr.tabje2 th { border: none; color: #97be0d; }
				#tarievenpaginas tr.tabje th { background: url('../../images/tabletab.gif') 0 0px no-repeat; }
				#tarievenpaginas tr.tabje2 th { background: none; border: 1px solid #999; } /*breder*/
		#tarievenpaginas .toelichting { line-height:16px; font-weight: bold; }
			#tarievenpaginas .toelichting p { margin: 0px; }
			#tarievenpaginas td.nblb { border-left: none; border-bottom: none; }
			#tarievenpaginas td.nbrb { border-right: none; border-bottom: none; }
			#tarievenpaginas td.nblbt { border-left: none; border-bottom: none; border-top: none;}
			#tarievenpaginas td.nbrbt { border-right: none; border-bottom: none; border-top: none; }
			#tarievenpaginas td.nbl { border-left: none;  border-top: none; }
			#tarievenpaginas td.nbr { border-right: none;  border-top: none; }
			#tarievenpaginas select { color: #6a6a6a; }
			
		.tarievendeco { position: absolute; right: 20px; top: 265px; }
		.tarievenbestel { position: absolute; right: 20px; top: 608px; z-index: 10; }

/* voordeelcalculator */

	#calculator div.vc_blok { width: 530px; height: auto; margin: 0 0 20px 30px; background-color: #f9f9f9; padding: 13px 0 13px 20px; }
		.vc_blok h4 { margin-bottom: 10px; color: #8e004d; }
		.vc_blok input { width: 50px; height: 15px; padding: 2px; border: 1px solid #a8a5a4; color: #666; margin-top: 5px; float: left; display: inline; }
		.vc_blok label { display: block; width: 150px; padding: 4px 0 4px 0; height: 19px; float: left; margin-top: 5px; clear: left;line-height: 15px; height: auto; display: inline; }
			.vc_blok label.large { width: 222px; }
			.vc_blok span.small { width: 100px; }
		.vc_blok span { margin-left: 15px; width: 280px; padding: 4px 0 4px 0; margin-top: 5px; display: block; float: left; clear: right; line-height: 15px; position: relative; }
		.vc_blok select { width: 145px; height: 21px; position: absolute; right: 20px; bottom: 2px; }
			.vc_blok select.small { width: 56px; height: 21px; padding: 0px; border: 1px solid #a8a5a4; color: #666; margin-top: 5px; float: left; position: static; right: auto; bottom: auto; display: inline; }
		.vc_blok a.add { position: absolute; right: -5px; bottom: 2px; display: block; background: url('../images/addsmall-over.png') left top no-repeat; }
		.vc_blok p { margin: 0px; }
		.vc_blok p.rood { font-weight: bold; color: #CC0000; }
		.vc_blok input.rood { border: 1px solid #cc0000; }
		
		dl#finalbesparing { font-size: 14px; font-weight: bold; position: relative; margin-top: 10px; width: 400px;}
			dl#finalbesparing dt { height: 24px; line-height: 24px; width: 200px; float: left; clear: left; }
			dl#finalbesparing dd { height: 24px; line-height: 24px; width: 200px; color: #97be0d; float: left; }
		
		#calculator div.vc_blokw { width: 510px; height: auto; margin: 0 0 20px 30px; background-color: #fff; padding: 13px 20px 13px 20px; text-align: center; }
		#calculator div.vc_blokw .bestelknop { background: url('../images/vc-knop-over.png') left top no-repeat; display: block; width: 183px; height: 42px; position: static; left: auto; bottom: auto; margin: 0 auto 0 auto; }

/* Sitemap */

	ul#sitemap1 { display: block; width: 300px; margin: 20px 20px 20px 40px; float: left; }
	ul#sitemap2 { display: block; width: 300px; margin: 20px 0px 20px 0px; float: left; }
		ul#sitemap1 li, ul#sitemap2 li { margin-bottom: 10px; }
		ul#sitemap1 li ul, ul#sitemap2 li ul { margin: 0 0 10px 13px; }
		ul#sitemap1 li ul li, ul#sitemap2 li ul li { margin-bottom: 0px; }
		ul#sitemap1 li ul li a, ul#sitemap2 li ul li a { font-weight: normal; }
		
		
	#herinnerservice { width: 500px; margin-left: 20px; margin-top: 20px; }
	#herinnerservice input { width: 239px; }
	#herinnerservice input.checkbox { width: auto; }
	#herinnerservice label { display: block; width: 150px; float: left; clear: left; line-height: 20px; display: inline; }
	#herinnerservice label.radiom { float: left; clear: none; margin-left: 150px; width: 60px; display: inline; }
	#herinnerservice label.radiov { float: left; clear: none; display: inline; }
	#next3 img { width: 239px; height: 42px; }
	#next3 { background: url('../images/herinnerbutton.gif') 0px 0px; display: block; width: 239px; height: 42px; margin: 10px 0 0 150px; }
		#next3:hover { background-position: 0px -42px; }
	.rood { color: #990000; }
	#herinnerservice #opmerkingen { width: 300px; height: 200px; }
	
	#homebanner #zakelijkblok .belmijknop { position: absolute; right: 0px; top: -72px; display: none; }