﻿/* Markup Styles */	
	/* Body text styles */
    body, td, input, h1, h2, h3, h4 {
	    font-family: Verdana, Arial;
	    font-size: 12px;}
    h1, h2, h3, h4, p{
        margin:0px;}

    /* Nieuws ticker op de frontpage */
    .nieuws_ticker td{padding:0px; font-size:120%;}
    .nieuws_ticker td li{padding:0px; font-size:80%;}
    .nieuws_ticker td b{color: #B40000;}

    /* Bedrijfssoftware pagina ms producten boxen 4 stuks */
    .box {
	    width: 216px;
	    height: 75px;
	    border: solid 1px #4d4d4d;	
	    margin-right: 5px;
	    margin-bottom: 5px;
	    text-align: left;
	    float: right;}
    .boxheader {
	    padding: 2px;	
	    background-color: #6e7176;
	    color: #fff;
	    font-size: 8pt;
	    font-weight: bold;}
    .boxcontent img{
	    text-align: center;
	    vertical-align: middle;
	    width: 170px;
	    padding: 5px;}

    /* Grootte plaatjes + subteksten */
        #bigpicture{width: 726px; height: 450px; float: left; z-index: 10;}
        .bg{position: absolute; width: 726px; height: 425px; border-bottom: solid 3px #9D9D9D; z-index: 1;}
        #bluepicture_medium{width: 726px; height: 250px; float: left; z-index: 10;}
        .bluebg{position: absolute; width: 726px; z-index: 1;}
        #bigpicture_narrow{width: 726px; height: 290px; float: left; z-index: 10;}
        .bg_narrow{position: absolute; width: 726px; z-index: 1; border-bottom: solid 3px #9D9D9D;}
        #mediumpicture{width: 500px; height: 352px; border-bottom: solid 3px #9D9D9D; float: left; z-index: 10;}
        .mediumbg{position: absolute; width: 500px; height: 352px; z-index: 1;}
    	        
    /* linkjes bewerken. */
    a:link{text-decoration:none; color: #333;}
    a:hover{text-decoration: none; color: #bd0a0a;}
    a:visited{text-decoration: none; color: #333;}
    a:visited:hover{text-decoration: none; color: #bd0a0a;}
    #topright a, #topright a:visited {color: #555; font-size: 11px;}
    #topright a:hover {color: #333; text-decoration:underline;}

    /* standaard hebben img onderdelen een border deze zetten we hier op 0 */
    img {border: 0px;}

    /* Text Styles */
            #bigpicturetitle{font-size: 18px; font-weight: bold; color: #FFC550; padding: 10px 0 0 10px; margin-bottom: 37px;}
            #noimagetekst #bigpicturetitle{font-size: 25px; font-weight: bold; color: #FFC550; padding: 10px 0 0 10px; margin-bottom: -25px;}

        /* Title text styles */
            .title{font-size: 18px; font-weight: bold; color:#b40000; margin:0px;}
            #subtitle, .subtitle{font-size: 14px; font-weight: 500; color: #c03434; margin:0;}
            #small_subtitle{color: #c03434; margin:0;}
            #linktitle{font-size: 16px; font-weight: bold; margin-bottom: 0px; color:#b40000;}
            #inleiding #title, #inleiding .title {padding-bottom: 5px; margin-bottom:5px; border-bottom: solid 2px #D4D4D4;}
            #opsomming #title{padding-bottom: 5px; margin-bottom:5px; border-bottom: solid 2px #D4D4D4;}
            #info_title{font-size: 18px; padding-top: 25px; font-weight: bold; color:#b40000;}
            #quote_title{font-size: 16px;}

        /* Subteksten horende bij de plaatjes */
            #subtekst{padding: 5px 0 5px 0; width: 470px; position:relative; float: left; }
            #subtekst h2{margin-top: 2px; font-size: 12px; font-weight:500; width:470px;}
            sub{font-size: 11px; color: #bd0a0a; vertical-align: super;}
            
        /* Inleidingen gedeelte */
            #inleiding{width: 470px; float: left; position:relative;}
            #inleiding h2{font-weight: 500; margin-top: 2px;}
            #inleiding ul{color: #333; margin-top: 3px;}
            #inleiding ul h1{margin-top: 0px; list-style-image: url('/images/content/plus.png');}
            #inleiding ul h1 li{margin-bottom: 5px; font-weight:500; font-size:12px;}
            #inleiding ul h1 li b{font-size:13px;}

        /* Info gedeelte */
            #infosection{width: 500px; float: left; position:relative; margin:0;}
            #infosection h2{font-weight:500;}

        /* Opsommingen gedeelte */
            #opsomming{width: 470px; position:relative;}
            #opsomming ul{font-weight: 500; color: #333; margin-top: 0px;}
            #opsomming li{list-style: url(/images/content/list_arrow_red.png); margin-bottom: 0px;}
            #opsomming #opsomming_title, #opsomming .opsomming_title{margin-left:-17px;}
            
            /* inspring plaatjes bij opsommingen */
                .dropcap{float: left; width: 4.7em; margin-left: 30px;}
                .dropcap img{width: 30px; margin-top: 3px;}
                .dropcap{text-decoration: underline;}
            
            .hrleft{margin-top: -20px; border:solid 2px #D4D4D4; width: 100%;}
            .hrright{margin-left: 25px; border:solid 1px #D4D4D4; width: 95%;}
            #arrowright{float: right; margin: -30px 6px 0 50px; width: 30px; height: 30px;}

        /* Puntsgewijze uitleg op de klanten pagina */
            #klanten_tekst{width: 100%; padding-top: 20px;}
            #klanten_tekst h2{padding-right: 15px; font-weight:500;}
            /* Quote section - Klanten pagina*/
                #quote_div{position:relative; float:right; margin-left:-40px;}
                blockquote{padding-left:0px; background-image: url(/images/content/open-quote.gif); background-repeat: no-repeat; background-position: left 0px; margin-top: -10px;}
                blockquote span{background-image: url(/images/content/close-quote.gif); background-repeat: no-repeat; background-position: right bottom; display: block; padding:30px;}

            #product_technologie{width:200px; height:200px; background-color:#4D4D4D; font-size:11px; color:White;}
            #product_technologie ul{margin-top:0; margin-left:0px;}

        /* green text displayer on the right */
            #stappenplan{background-image: url('/images/content/stappenplan.png'); margin-top: 10px;}
            #stappenplan_dt{margin: 0 0 10px 0; padding: 10px; color: #fff; background: #999 url(/images/content/box_top.png) no-repeat top left;}
            
            #green dt{background-color: #005600;}
            #green{background-color: #69BE28; margin-top: 10px; margin-right:5px;}
            dl{width: 200px; margin: 0 0 20px 20px; padding-bottom: 15px;	background: url(/images/content/box_bottom.png) no-repeat bottom left;}
            dt{font-size: 14px; font-weight:bold; margin: 0 0 10px 0; padding: 10px; color: #fff; border-bottom: 1px solid #fff; background: #999 url(/images/content/box_top.png) no-repeat top left;}
            dd{font-size: 11px; margin: 0 0 0 5px; padding: 0 8px 8px 3px; color: #000;}
            dd b{font-size: 12px; color:White;}

    /* Sitemap link layout */
    /* markup voor sitemap links is gesplitst in 2 files hier staat de hoofd css voor ie7 en anderen.
       er is een apparte file ie-only.css hierin staat de css voor IE deze word in sitemap.aspx na de hoofdcss file geladen
       zodat hij deze instellingen alleen voor IE zal overschrijven. */
    #div_business ul, #div_bedrijfssoftware ul, #div_technologie ul, #div_itservice ul, #div_klanten ul{margin-left/**/: -16px;} /* Non IE */
    #div_business, #div_bedrijfssoftware, #div_technologie, #div_itservice, #div_klanten{padding-right/**/: 30px;} /* Non IE < 7 */
    #div_business, #div_bedrijfssoftware, #div_technologie, #div_itservice, #div_klanten{_padding-right: 30px;} /* Non IE = 7 */
    
        /* Footer text styles */
        #bottomDevider{clear: both; padding: 0 64px 8px 24px;}
            #hrReplacementDiv{border-bottom: solid 2px #6f6f6f; width: 900px; padding-bottom: 16px;}
            
        #bottom{font-size:11px; margin-top:0px; padding-top:0px; text-align: left;}
        #certified{position:absolute; float:left; margin:10px 0 0 270px;}

        #resource{position:absolute; height: 100px; margin: 0 0 0 520px; border-left:solid 2px #C9C9C9;}
        #ervaring{position:absolute; height: 100px; margin: 0px 10px 0 700px; border-left:solid 2px #C9C9C9; float:left;}
        #resource p, #ervaring p{color:#365f95; font-size:12pt; font-weight:bold; margin-top: 0px; margin-left: 23px; margin-bottom:-12px;}

        #resource a, #resource li, #ervaring a, #ervaring li{color:#000; list-style-image: url(/images/content/list_arrow_gray.png);}
        
        /* Black footer way at the bottom of the page it's always there */
        .black_footer{
	        margin-top: 50px;
	        height: 170px; /* .push must be the same height as .footer */
	        text-align: left;
	        color: #fff;}

        .black_footer a:link {color: #fff;}
        .black_footer a:hover{text-decoration: none; color: #bd0a0a;}
        .black_footer a:visited{text-decoration: none; color: #fff;}
        .black_footer a:visited:hover{text-decoration: none; color: #bd0a0a;}
    
    /* Layout van de black footer word hier bepaald */    	
    .bfTop {height: 145px; background-color: #333333; border-bottom: solid 2px #B2B2B2;}
        #bfTop_table{margin-top: 5px; width:853px;}
        .spacer{width:20px;}
                
        #tr1 td{font-weight: bold; text-indent: 3px; border-bottom: solid 2px #B2B2B2;}
        #tr2 td{font-size: 10px;}

        .ul_dotted{ border-bottom: dotted 1px #B2B2B2; padding-bottom: 3px; width:100%;}
            
    .bfBottom {height: 35px; background-color: #4D4D4D;}
        #bfBottom_table{text-align: left; width:810px;}