﻿/*1 em = 10 px*/

/* lay-out */
    html,
    body,
    #page {
	    width: 100%;
	    height: 100%;
	    margin: 0px 0px 0px 0px;
	    padding: 0px 0px 0px 0px;
	    background-color: #fff;
    }
	    /* top */ 
	    #top {
            width: 100%;
            height: 94px;
            background-image: url(../images/bg_top_blank.png);
			background-position: top left;
			background-repeat: repeat-x;
        }
	        #header {
                width: 990px;
                height: 94px;
                margin-left: auto;
                margin-right: auto;
            }
            	#logo {
                    float: left;
                    width: 250px;
                    height: 60px;
                    margin: 0;
			        padding:10px 0px 0px 0px;
                }
                /* navigation Level 1 */
                ul
{
    margin: 3px 0px 5px 0px;
    padding: 0em 0px 0px 0px;
    list-style: none;
}
ul li
{
    margin: 0em 0em 0em 0em;
    padding: 0.3em 0em 0em 3em;
    background-image: url(../images/bullet_default.png);
    background-repeat: no-repeat;
    background-position: 2.0em 0.5em;
}
                #navigationLevel1 {
                    float: left;
                    height: 27px;
                    margin-top: 37px;
                }
                #navigationLevel1 ul {
                    padding: 0px 0px 0px 0px;
	                margin: 0px 0px 0px 0px;
                    list-style: none;
                }
                
                    #navigationLevel1 li {
                        float: left;
                        margin: 0;
                        padding: 0;
                        background-image: none;
                        background-position: 0;
                    }
                        #navigationLevel1 li a {
                            float: left;
                            height:28px;
                            background-position: top left;
                            background-repeat: no-repeat;
                            text-decoration: none;
                        }
                        #thuisLink {
                            width: 69px;
                            background-image: url(../images/lnk_voor_thuis.png);
                        }
                        #thuisLink:hover {
                            background-image: url(../images/lnk_voor_thuis_hover.png);
                        }
                        #thuisLink:hover.selected,
                        #thuisLink.selected {
                            background-image: url(../images/lnk_voor_thuis_selected.png);
                        }
                        #zakelijkLink {
                            width: 88px;
                            background-image: url(../images/lnk_zakelijk.png);
                        }
                        #zakelijkLink:hover {
                            background-image: url(../images/lnk_zakelijk_hover.png);
                        }
                        #zakelijkLink:hover.selected,
                        #zakelijkLink.selected {
                            background-image: url(../images/lnk_zakelijk_selected.png);
                        }   
                        #over-greenchoiceLink {
                            width: 150px;
                            background-image: url(../images/lnk_over_greenchoice.png);
                        }
                        #over-greenchoiceLink:hover {
                            background-image: url(../images/lnk_over_greenchoice_hover.png);
                        }
                        #over-greenchoiceLink:hover.selected,
                        #over-greenchoiceLink.selected {
                            background-image: url(../images/lnk_over_greenchoice_selected.png);
                        }
                        #klantenserviceLink {
                            width: 134px;
                            background-image: url(../images/lnk_klantenservice.png);
                        }
                        #klantenserviceLink:hover {
                            background-image: url(../images/lnk_klantenservice_hover.png);
                        }
                        #klantenserviceLink:hover.selected,
                        #klantenserviceLink.selected {
                            background-image: url(../images/lnk_klantenservice_selected.png);
                        }
                        
                        #uw-dossierLink {
                            width: 134px;
                            background-image: url(../images/lnk_uwdossier.png);
                            margin-top:1px;
                            margin-left: 125px;
                        }
                        #uw-begreenLink {
                            width: 134px;
                            background-image: url(../images/lnk_uwdossier.png);
                            margin-top:1px;
                        }  
                /* navigation Level 2 */
                #navigationLevel2Margin {
                    float: left;
                    width: 262px;
                    height: 28px;
                }
                #navigationLevel2 {
                    float: left;
                    width: 656px;
                    height: 28px;
                    overflow: hidden;
                }
                /* fix IE6 */
                *html #navigationLevel2 {
                    width: 527px;
                }
                    #navigationLevel2 a:link, #navigationLevel2 a:visited {
                        float: left;
                        margin: 0px 20px 0px 0px;
                        /* see markup in Markup.css */
                    }
                #search {
                    width: 156px;
                    height: 28px;
                    background-image: url(../images/bg_search.png);
			        background-position: 0px 3px;
			        background-repeat: no-repeat;
			        overflow: hidden;
			        display:none;
                }
                    #search input {
                        width: 128px;
                        height: 17px;
                        margin: 5px 0px 0px 3px;
                        padding: 0px 0px 0px 0px;
                        background-color: #fdfdfd;
                        vertical-align: middle;
                        border: 0px;
                    }
                    /* fix IE6 */
                    *html #search input {
                        margin-top: 3px;
                    }
	    /* middle */
	    #middle {
            width: 100%;
            min-height: 510px;
            margin: 0px 0px 0px 0px;
	        padding: 20px 0px 0px 0px;
            background-color: #f9fbf4;
        }
        /* fix IE6 */
        *html #middle {
            height: 510px;
        }
	        #main {
                margin-top: 0px;
                margin-left:auto;
                margin-right:auto;
                width: 990px;
            }
                #columnLeftMargin {
                    float: left;
                    width: 50px;
                }
                /* display columnLeft 'block' or 'none' to show the left navigation */
                .columnLeft {
                    display: block;
                    float: left;
                    width: 210px;
                    height: 100%;
                }
                    #leftNavigation {
                        width: 183px;
                    }
                            #leftNavigation ul
                            {
                                margin: 0px 0px 0px 0px;
                                padding: 0px 0px 0px 0px;
                                list-style: none;
                            }
                                #leftNavigation ul li
                                {
                                    margin: 0px 0px 0px 0px;
                                    padding: 0px 0px 0px 0px;
                                }
                       #leftNavigationTop {
                            width: 183px;
                            height: 10px;
                            background-image: url(../images/bg_navigation_top_bottom.png);
	                        background-position: 0px 0px;
	                        background-repeat: no-repeat;
	                        overflow: hidden;
                        }
                        #leftNavigationMiddle {
                            width: 183px;
                            background-image: url(../images/bg_navigation_middle.png);
	                        background-position: top left;
	                        background-repeat: repeat-y;
                        }
                        #leftNavigationBottom {
                            width: 183px;
                            height: 10px;
                            background-image: url(../images/bg_navigation_top_bottom.png);
	                        background-position: 0px -10px;
	                        background-repeat: no-repeat;
	                        overflow: hidden;
                        }     
                /* 
                #columnLeft | #columnRight | #content | id Name
                block       | block        | 502px    | #contentSmall
                block       | none         | 692px    | #contentMedium
                none        | block        | 712px    | #contentLarge    
                none        | none         | 902px    | #contentX-large
                */
                #contentSmall {
                    float: left;
                    width: 502px;
                }
                #contentMedium {
                    float: left;
                    width: 692px;
                }
                #contentLarge {
                    float: left;
                    width: 712px;
                }
                #contentX-large {
                    float: left;
                    width: 902px;
                }
                /* display columnRight 'block' or 'none' to show navigation level 3 */
                #columnRight {
                    display: block;
                    float: left;
                    width: 190px;
                    height: 100%;
                }
                    #rightBanners {
                        float: right;
                        width: 160px;
                        height: 100%;
                        overflow: hidden;
                    }
                        #login {
                            width: 160px;
                            height: 125px;
                            background-image: url(../images/bg_dossierInlog.png);
                            background-position: 0px 0px;
			                background-repeat: no-repeat;
			                padding: 3px 3px 3px 5px;
                        }
                        
        #rightColumnBanner {
            margin: 10px 0px 0px 2px;
            padding-right:1px;
        }
        /* bottom */
        #bottom {
            width: 100%;
            height: 300px;
			background-image: url(../images/bg_bottom.png);
			background-position: top left;
			background-repeat: repeat-x;
			background-color: #e6eed6;
        }
            #footer {
                width: 990px;
                height: 150px;
                margin-left:auto;
                margin-right:auto;
                background-image: url(../images/img_horizontal_ruler.png);
                background-position: 30px 0px;
                background-repeat: no-repeat;
            }
                /* level 2 */
                #footer ul {
                    margin: 0 0 0 20px;
                    padding: 0px 0px 0px 0px;
                    list-style: none;
                }
                    #footer ul li {
                        float: left;
                        margin: 0px 30px 0px 0px;
                        padding: 0px 0px 0px 0px;
                    }
                        #footer ul li h1 {
                            margin: 15px 0px 0px 30px;
                            padding: 0px 0px 0px 0px;
                        }
                        /* level 3 */
                        #footer ul li ul {
                            margin: 0px 0px 0px 5px;
                            padding: 0px 0px 0px 0px;
                            list-style: none;
                        }
                            #footer ul li ul li {
                                float: none;
                                margin: 0px 0px 0px 0px;
                                padding: 0px 0px 0px 0px;
                            }
                               #footer ul li ul li h2 {
                                    margin: 0px 0px 0px 30px;
                                    padding: 0px 0px 0px 0px;
                                } 
                                /* level 4 */
                                #footer ul li ul li ul {
                                    margin: 0px 0px 0px 5px;
                                    padding: 0px 0px 0px 0px;
                                    list-style: none;
                                }
                                    #footer ul li ul li ul li {
                                        float: none;
                                        margin: -3px 0px 0px 30px;
                                        padding: 0px 0px 0px 0px;
                                    }

/* validation */
#loginValidationBackground,
#validationBackground {
    z-index: 100;
    display: none;
    position: absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    height:100%;
    width:100%;
    margin:0;
    padding:0;
    background:#000;
    opacity:.75;
    filter: alpha(opacity=75);
    -moz-opacity: 0.75;
}
#loginValidationBox,
#validationBox {
    z-index: 110;
    display: none;
    position: absolute;   
    width: 240px;
    margin: 0px 0px 0px 0px;
	padding: 15px 0px 10px 30px; 
    border: solid 1px  #90ce42; 
    background-color: #e6eed6; 
}
    .validation-summary-errors {
        margin: 0px 0px 0px 30px !important;
        padding: 0em 0px 0px 0px !important;
        list-style: none !important;
    }

    .validation-summary-errors li {
        margin: 0em 0em 0em 0em !important;
	    padding: 0em 0em 0em 2.4em !important;
        background-image: url(../images/bullet_validation.png) !important;
        background-repeat: no-repeat !important;
        background-position: 1.3em 0.4em !important;
    }
    .noSummary {
        padding: 15px 0px 10px 0px !important;
    }
        .noSummary .validation-summary-errors {
            margin: 0px 0px 0px 0px !important;
            padding: 0em 0px 0px 0px !important;
            list-style: none !important;
        }
        .noSummary .validation-summary-errors li {
            margin: 0em 0em 0em 0em !important;
	        padding: 0em 0em 0em 0em !important;
            background-image: none !important;
            background-repeat: no-repeat !important;
            background-position: 0em 0em !important;
            text-align: center !important;
        }
        .noSummary #okLink {
            margin: 10px 0px 0px 70px !important;
        }
    #okLink {
        float: left;
        width: 104px;
        height: 24px;
        margin: 10px 0px 0px 50px;
        background-image: url(../images/btn_ok.png);
    }
    #okLink:hover {
        background-image: url(../images/btn_ok_hover.png);
    }
/* tooltip */ 
div.tooltip { 
    display: none;
    margin: 0px 0px 0px 0px !important;
	padding: 0px 0px 0px 0px !important;
    width: 275px !important;
    background-color: Transparent !important;
    border: none !important;
    font-weight: normal !important;
    color: #444 !important;
} 
    div.tooltipTop {
        margin: 0px 0px 0px 0px;
        height: 10px;
        background-image: url(../images/bg_tooltip_top.png);
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-position: 0 0;
    }
    *html div.tooltipTop {
        margin-bottom: -10px;
    }
    div.tooltipMiddle {
        margin: 0px 0px 0px 0px;
        padding: 5px 20px 5px 20px;
        background-image: url(../images/bg_tooltip_middle.png);
        background-repeat: repeat-y;
        background-attachment: scroll;
        background-position: 0 0;
    }
    div.tooltipBottom {
        margin: 0px 0px 0px 0px;
        height: 15px;
        background-image: url(../images/bg_tooltip_bottom.png);
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-position: 0 0;
    }

#afrondenTarieven img,
#overigeGegevens img,
.tblTarieven img {
    margin-bottom: -4px;
}
.formulier
{
    border: solid 1px #9FC15B;
    background-color: #F0F5E9;
    width:99%;
    padding: 10px 10px 10px 10px;
    
}
.formulier fieldset
{
    border: none;
}

.formulier ul 
{
    list-style:none;
}

/* shared */	
.left {
    float: left;
}
.right {
    float: right;
}
.clearboth {
    clear: both;
}



/* Tooltip voor Forms*/
div.tooltip
{
    background-color: #5E7728;
    border: 2px solid #aaa;
    padding: 10px 15px;
    width: 200px;
    display: none;
    color: #fff;
    text-align: left;
    font-size: 12px;
    font-weight: bold; 
    /* outline radius for mozilla/firefox only */
    outline-radius: 4px;
    -moz-outline-radius: 4px;
    -webkit-outline-radius: 4px;
}

#editForm ul{
    background:none;
}

#editForm ul li{
    background:none;
} 

#blokAanmelden, #blokMeterstandenDoorgeven, #blokStartLevering {
    height:85px;
}

#blokStartLevering {
height:124px;
}

.switchStatus_i {
    background-color:#e7e6e6;
    border-top:solid 1px #fff;
    margin-left:-3px;
}

.divContentBlokSwitch {
    margin-left: 10px; 
    width: 452px;
}

.divinfoLinksSwitch {
    float: right; 
    color: #86AC3F; 
    font-weight: bold;
}