@charset "utf-8";
@import url(reset.css);

/* colors used
 #ffffff - background
 #3d3d3d - text general
 #3690c5 - highlighted text
 #d2d2d2 - borders
 #fafafa - grey background
 #d32240 - red
*/

#fixedtipdiv{
position:absolute;
margin-top:0px;
margin-left:-19px;
padding: 2px;
border:1px solid black;
font:normal 12px "Trebuchet MS", Arial, Helvetica, sans-serif;
line-height:18px;
z-index:1000;
}

.tooltip {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	display: none;
	border:1px solid black;
	background-color: lightyellow; 
	padding: 5px 5px 5px 5px;
	color: #000000;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	text-align: left;
	line-height:16px;
	text-decoration:none;
}


/* GENERAL PAGE ELEMENTS */
body { background-color: #ffffff; color: #3d3d3d; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 62.5%; }

/*.content-wrapper { padding-left: 5px; width: 910px; margin: auto; position: relative; font-size: 1.3em; }*/
.content-wrapper { padding-left: 5px; width: 910px; margin: auto; font-size: 1.3em; }
.logo { text-align: center; padding: 6px 0; }
.page-wrapper { padding: 20px 0 20px 0; overflow: hidden; margin-left: -2px; padding-left: 2px; } 
                /* negative margin and padding-left to place homepage banner nav a little bit to the left without cropping */

.left-col, .right-col { float: left; }
.left-col  { width: 685px; }
.right-col { width: 222px; }

h1, h2, .block h3, .block_grijs h3 { color: #3c99d0; }
h1 { font-size: 1.5em; }
h2, .block h3 { font-size: 1.1em; padding: 12px 0;}
h2 .small-head-text, .block h3 .small-head-text { font-size: 0.8em; font-weight: normal; }

/* GENERAL TEXT STYLES */
p { margin: 16px 0 0; line-height: 22px; }
.highlight { color: #3690c5; }

a { color: #3690c5; text-decoration: none; }
a:hover { text-decoration: underline; }
a img {border: none;}


ul { margin-left: 2px;  padding: 0; }
ul li { padding: 3px 0 0 9px; list-style: none; }

ul li a { font-size: 0.85em; }
ul.link-list li { /*list-style-postition: outside; list-style-image: url(../img/list-bullet-blue.gif);*/
               background: url(../img/list-bullet-blue.gif) no-repeat 0 9px; }

/* STYLES FOR PROJECT */
.project {
		color:#cc0202;
		}


/* STYLES FOR FOOTER */
.footer { font-size: 0.9em; border-top: 1px solid #d2d2d2;  padding: 15px 0 20px 0; text-align: center; clear: both; }

/* TOP BLOCK ELEMENTS */
.top-block {
    background: url(../img/bg_top-block.jpg) no-repeat 0 0;
    width: 555px;
    height: 248px;
}
.intro-text {
    padding: 20px;
    width: 305px;
    font-weight: bold;
    float: left;
    display: inline;
}
.form-text {
    padding: 26px 20px 20px;
    width: 168px;
    font-weight: bold;
    float: left;
    display: inline;
}
.form-text p {
    margin: 0 0 17px;
}


	.tab-project { width: 673px; height: 80px; padding: 16px 0 0 0; margin: 5px 0 0 -2px; list-style: none; 
	              position: relative; z-index: 0; background: url(../img/banner-menu.png) no-repeat 0 0; } 
	              /* negative margin to place homepage banner nav a little bit to the left without cropping 
	                 and push it up, under our banners */
	.tab-project li { float: left; height: 40px; padding: 0; margin: 0; }
	.tab-project li, .tab-project li a  { display: block; width: 220px; width: 227px; }
	.tab-project li a { padding: 12px 0 0 0; height: 30px; color: #a6a7ac; font-weight: bold; font-size: 1.1em; text-align: center; }
	
	.tab-project li.activetab { height: 54px; background: url(../img/banner-menu-active.png) no-repeat 0 0;}
	.tab-project li.activetab, .tab-project li.activetab a  {  }
	.tab-project li.activetab a { padding: 15px 0 0 0; height: 40px; color: #3c99d0; }
	.tab-project li.activetab a:hover { text-decoration: none; }



/* STYLES FOR HOME */

	/* BANNER MENU HOME */
	.banner-menu-wrapper { margin: 0 0 0 0; height: 245px; }
	.banner-carousel-wrapper { width: 668px; height: 184px; overflow: hidden; position: relative; z-index: 100;}
	.banner-carousel ul { margin: 0; padding: 0; list-style: none; }
	.banner-carousel ul li { padding: 0; margin: 0; }
	.banner-carousel ul li a img { border: 0 none; }
	
	.banner-nav { width: 673px; height: 80px; padding: 16px 0 0 0; margin: -17px 0 0 -2px; list-style: none; 
	              position: relative; z-index: 0; background: url(../img/banner-menu.png) no-repeat 0 0; } 
	              /* negative margin to place homepage banner nav a little bit to the left without cropping 
	                 and push it up, under our banners */
	.banner-nav li { float: left; height: 40px; padding: 0; margin: 0; }
	.banner-nav li, .banner-nav li a  { display: block; width: 220px; width: 224px; }
	.banner-nav li a { padding: 12px 0 0 0; height: 30px; color: #a6a7ac; font-weight: bold; font-size: 1.1em; text-align: center; }
	
	.banner-nav li.active { height: 54px; background: url(../img/banner-menu-active.png) no-repeat 0 0;}
	.banner-nav li.active, .banner-nav li.active a  {  }
	.banner-nav li.active a { padding: 15px 0 0 0; height: 40px; color: #3c99d0; }
	.banner-nav li.active a:hover { text-decoration: none; }

.home-content { padding-left: 6px;}
.home-main-text { padding-bottom: 30px; width: 655px; }

/* TAB MENU */
.tab-nav { padding-top: 8px; background: url(../img/tab-menu.png) no-repeat 0 0;  }
.tab-nav li.active { background: url(../img/tab-menu-active.png) no-repeat 0 0;}

/* STYLES FOR SLIDESHOW */
.slideshow-image-wrapper { text-align: center; width: 206px; height: 154px; }
.slideshow-image-wrapper img { border: none; }

/* BLOCKS */
.block .corner-tl, .block .corner-tr, .block .corner-bl, 
.block .corner-br { width: 50%; height: 4px; float: left; line-height: 1px; font-size: 1px; }
.block .corner-tl { background: url(../img/block-corner-tl.gif) no-repeat top left; }
.block .corner-tr { background: url(../img/block-corner-tr.gif) no-repeat top right; }
.block .corner-bl { background: url(../img/block-corner-bl.gif) no-repeat top left; }
.block .corner-br { background: url(../img/block-corner-br.gif) no-repeat top right; }
.block .content   { padding: 2px 11px; border-left: 1px solid #d2d2d2; border-right: 1px solid #d2d2d2; clear: both; 
                    overflow: hidden; }


/* BLOCKS GRIJS*/
.block_grijs .corner-tl_grijs, .block_grijs .corner-tr_grijs, .block_grijs .corner-bl_grijs, 
.block_grijs .corner-br_grijs { width: 50%; height: 4px; float: left; line-height: 1px; font-size: 1px; }
.block_grijs .corner-tl_grijs { background: url(../img/block-corner-tl_grijs.gif) no-repeat top left; }
.block_grijs .corner-tr_grijs { background: url(../img/block-corner-tr_grijs.gif) no-repeat top right; }
.block_grijs .corner-bl_grijs { background: url(../img/block-corner-bl_grijs.gif) no-repeat top left; }
.block_grijs .corner-br_grijs { background: url(../img/block-corner-br_grijs.gif) no-repeat top right; }
.block_grijs .content_grijs   { padding: 2px 11px; border-left: 1px solid #d2d2d2; border-right: 1px solid #d2d2d2; clear: both; background-color:#eaeaea;
                    overflow: hidden; }


/* BLOCKS GROEN*/
.block_green .corner-tl_green, .block_green .corner-tr_green, .block_green .corner-bl_green, 
.block_green .corner-br_green { width: 50%; height: 4px; float: left; line-height: 1px; font-size: 1px; }
.block_green .corner-tl_green { background: url(../img/block-corner-tl_green.gif) no-repeat top left; }
.block_green .corner-tr_green { background: url(../img/block-corner-tr_green.gif) no-repeat top right; }
.block_green .corner-bl_green { background: url(../img/block-corner-bl_green.gif) no-repeat top left; }
.block_green .corner-br_green { background: url(../img/block-corner-br_green.gif) no-repeat top right; }
.block_green .content_green   { padding: 2px 11px; border-left: 1px solid #d2d2d2; border-right: 1px solid #d2d2d2; clear: both; background-color:#DFF7E7;
                    overflow: hidden; }


                    
.last-block { margin: 0 !important;}

.block-right { width: 222px; margin-bottom: 20px; }
.block-right .content { padding: 2px 6px; }
.block-third { margin-right: 18px; width: 206px; float: left; }

/* ACTION BUTTONS */
.action { margin-top: 10px; background: url(../img/action-left.png) no-repeat top left; overflow: hidden; float: left; }
.action a { padding: 8px 20px 0 14px; height: 29px; font-weight: bold; text-decoration: none; color: #3d3d3d;
			font-size: 0.9em; background: transparent url(../img/action-right.png) no-repeat top right; display: block; 
			float: left; }
.action a:hover { text-decoration: none; }

.action_green { margin-top: 10px; background: url(../img/action-left_green.png) no-repeat top left; overflow: hidden; float: left; }
.action_green a { padding: 8px 20px 0 14px; height: 29px; font-weight: bold; text-decoration: none; color: #3d3d3d;
			font-size: 0.9em; background: transparent url(../img/action-right_green.png) no-repeat top right; display: block; 
			float: left; }
.action_green a:hover { text-decoration: none; }



/* BREADCRUMB */
.breadcrumb {
	margin: 0px 0 10px;
	padding-left: 0px;
	color: #d32240;
	font-size: 0.85em;
	position: relative;
	z-index: 100;
	
	height: 12px;

}
.breadcrumb a { color: #3d3d3d; }
.breadcrumb .divider { padding: 0 4px; color: #3d3d3d; }

/* FORMS */
.helptekst { padding-left:140px; display: block; 
			text-decoration:italic;
			font-size:11px;
			}

form {overflow: hidden;}
.form-item { padding-bottom: 11px; overflow: hidden;}
.form-item label { padding-top: 2px; width: 140px; display: block; float: left; }
.form-item label.label-fullwidth { width: 100%; float: none; }
.block-right label { padding-bottom: 5px; padding-top: 0; }

.input-text { padding: 3px 5px 4px; float: left; border: none; color: #3D3D3D; }
.text-small {  width: 80px; height: 16px; background: url(../img/input-small.gif) no-repeat 0 0; }
.text-medium {  width: 148px; height: 16px; background: url(../img/input-medium.gif) no-repeat 0 0; }
.text-large {  width: 176px; height: 16px; background: url(../img/input-large.gif) no-repeat 0 0; }
.text-superlarge {  width: 350px; height: 16px; background: url(../img/input-superlarge.gif) no-repeat 0 0; }
.text-260 {  width: 260px; height: 16px; background: url(../img/input-260.gif) no-repeat 0 0; }
.text-170 {  width: 170px; height: 16px; background: url(../img/input-170.gif) no-repeat 0 0; }
.block-right .input-text { width: 198px; height: 16px; background: url(../img/input-rightblock.gif) no-repeat 0 0; }

.input-checkbox { margin-right: 8px; }

.block-right .button-submit { float: right; clear: both; }

.form-item textarea { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; color: #3D3D3D; font-size: 1em; }



.clear { clear: both; height: 1px; line-height:1px;}

.form-errors { padding: 20px 0 0; color: #D32240; font-size: 0.9em; b}





/* TOP BLOCK ELEMENTS */
.top-block {
    background: url(../img/actie/bg_top-block.jpg) no-repeat 0 0;
    width: 555px;
    height: 248px;
}
.intro-text {
    padding: 20px;
    width: 305px;
    font-weight: bold;
    float: left;
    display: inline;
}
.form-text {
    padding: 26px 20px 20px;
    width: 168px;
    font-weight: bold;
    float: left;
    display: inline;
}
.form-text p {
    margin: 0 0 17px;
}
.form-text .minutes-field {
    background: url(../img/actie/input-bereken.gif) no-repeat 0 0;
    width: 36px;
    height: 23px;
    border: none;
	font-weight:bold;
	text-align:center;
    margin: 0px 10px 0px 1px;
}
.form-text .button {
    margin-top: 20px;
}


/* COMPARISON TABLE ELEMENTS */
table#compare {
    width: 555px;
    margin-top: 30px;
}
table#compare tr.top-row {
    height: 54px;
}
table#compare th.first {
    background: url(../img/actie/bg_table-top_01.jpg) no-repeat 0 0;
}
table#compare th.middle {
    background: url(../img/actie/bg_table-top_02.jpg) no-repeat 0 0;
}
table#compare th.last {
    background: url(../img/actie/bg_table-top_03.jpg) no-repeat -2px 0;
}
table#compare tr.top-row th {
    padding-top: 1px;
}
table#compare tr.bottom-row td.last-colspan {
    background: url(../img/actie/bg_table-bottom.jpg) no-repeat 5px 0;
    height: 44px;
}
table#compare tr.bottom-row td {
    font-size: 15px;
    color: #d32240;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
}
table#compare tr.bottom-row td {
    width: 395px;
}
table#compare tr.even, table#compare tr.odd {
    height: 39px;
}
table#compare tr.odd td.first, table#compare tr.even td.first {
    background: url(../img/actie/bg_tableborder_01.gif) no-repeat 0 0;
}
table#compare td.middle {
    background: url(../img/actie/bg_tableborder_02.gif) no-repeat 0 0;
}
table#compare td.last {
    background: url(../img/actie/bg_tableborder_03.gif) no-repeat -2px 0;
}

table#compare tr.even td, table#compare tr.odd td {
    padding: 0;
    font-weight: bold;
    vertical-align: middle;
}
table#compare tr.even {
    background-color: #fafafa;
}
table#compare tr.bottom-row td.first,
table#compare tr td.first {
    padding-left: 12px;
    width: 160px;
}
table#compare tr td {
    width: 197px;
}

.currency {
    float: left;
    display: inline;
    padding-left: 45px;
}
.amount {
    width: 75px;
    float: left;
    display: inline;
    text-align: right;
}
.notice {
    padding-left: 6px;
    font-weight: normal;
}
.minutes {
    width: 128px;
    text-align: right;
}
.note { 
    font-size: 11px;
    line-height: 20px;
    padding: 15px 0;
}

/* PACKAGE ELEMENTS */
.package {
    background: url(../img/actie/bg_package.jpg) no-repeat left bottom;
    height: 160px;
}
.package .package-text {
    padding: 45px 0 0 15px;
    width: 320px;
    float: left;
    display: inline;
}
.package .package-text p {
    line-height: 18px;
    font-weight: bold;
}
.package .package-text img {
    display: block;
    margin-bottom: 5px;
}
.package .package-box {
    float: left;
    display: inline;
    padding: 2px 0 0 25px;
}

/* ACTION BUTTONS */
.actions {
    padding: 22px 0 20px 0;
    overflow: hidden;
}
.actions a {
    background: url(../img/actie/bg_action.jpg) no-repeat 0 0;
    width: 250px;
    height: 29px;
    display: block;
    padding: 15px 0 0 14px;
    color: #3d3d3d;
    font-weight: bold;
    text-decoration: none;
    float: left;
}
.actions a.action-left {
    margin-right: 27px;
}

.top-package {margin: -30px 0 25px 0;}
#contact { padding-top: 10px; overflow: hidden; }
#contact .form-left-col, #contact .form-right-col,
#tellafriend .form-left-col, #tellafriend .form-right-col { float: left; overflow: hidden; }
#contact .form-left-col { padding-top: 23px; width: 320px; }
#contact .form-right-col { width: 210px; }
#contact .contact-message { margin-top: 8px; padding:3px 5px 4px; width: 193px; height: 119px; border: none; background: url(../img/actie/contact-message.gif) no-repeat 0 0; }
#contact .button-submit { margin-right: 3px; float: right; }

#tellafriend label { width: 105px;}
#tellafriend p { margin-top: 4px;}
#tellafriend .form-left-col { padding-top: 35px; width: 320px; }
#tellafriend .form-right-col { width: 210px; font-size: 11px; font-size: 0.85em; }
#tellafriend .button-submit { margin-right: 25px; float: right; }