/* 
Stylesheet voor EJP Belastingadviseurs & Accountants
door Nowton - bespoke crossmedia solutions
januari-april 2009

960, 3 col
 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}

/* remember to define focus styles! */
:focus {
    outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
    text-decoration: none;
}
del {
    text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
}
 
 
 /*
GLOBAL
*/
body {
    text-align: center;
    margin: 0 auto;
    background-color: white;
    background-image:url(../images/bg-body.png);/*960_grid_12_col.png*/
    background-repeat:no-repeat;
    background-position:top;
}
a img {
    border: none;
}
/*
TYPE
*/
body {
    font-family: Arial, Helvetica, sans-serif;
    font-size:62.5%; /* base font size */
}

#wrapper {
    text-align: left;
}


h1, h2, h3, h4 {
    text-transform: uppercase; /*font-weight: normal;*/
    letter-spacing: 0.1em;
}
h1 {
    font-size:5em;
    color: white;
}
h2 {
    font-size: 2.4em;
    color: #FE7D18;
}
h3 {
    font-size: 2em;
    color: #3FA8DA;
}
h4 {
    font-size: 1.4em;
    color: #3FA8DA;
    font-weight: normal;
}
/*.col ol {list-style-type: none;}
.col ul {margin: 1em 1.5em;} 
.col ul li {list-style-type: disc;}*/
.title {
    text-transform: uppercase;
    display: block;
    color: #3FA8DA;
}
p {
    font-size: 1.2em;
    line-height:1.5;
}
#arena p {
    color: #EAF8FF;
    margin: 1em 1em 1em 0;
}
#arena a {
    color: #FE7D18;
}
#mainContent p {
    margin:0 0 1em 0;
}
#mainContent li {
    font-size: 1.2em;
    line-height:1.4;
}
#mainContent ol {
    list-style-type: decimal;
    list-style-position: inside;
    padding-bottom: 1em;
}
#mainContent ul {
    margin-left: 2em;
    margin-bottom: 1em;
    list-style: disc;
}
#footer p {
    color: #FE7D18;
    font-size:1.3em;
    text-transform:uppercase;
}
#footer li {
    font-size: 1.1em;
    line-height: 1.2;
}
#credits p {
    color: #CCC;
    font-size:1em;
}
/*
COLORS
*/
orange {
    color: #FE7D18;
}
lightorange {
    color: #FFDEBB;
}
lightblue {
    color: #ABD9F0;
}
mediumblue {
    color:#3FA8DA;
}
darkblue {
    color: #258DC0;
}

/*
NAVIGATION
*/
#menu {
    overflow: hidden;
}
#menu li {
    font-size: 1.5em;
    text-transform: uppercase;
    margin-bottom: .5em;
}
#menu li a {
    text-decoration: none;
    font-weight: bold;
    color:#3FA8DA;
}
#menu li a:hover {
    color: #FE7D18;
}

/*Internet Boekhouden*/
#twinfield a {     
    display: block; 
    text-indent: -5000px; 
    background-position: 0 0; 
    height: 150px; 
    width: 50px; 
    background: transparent url(../images/twinfield.png) no-repeat;
    }
#twinfield a:hover {background-position: -50px 0; z-index:50;}
/*Internet Salarisverwerking*/
#loket {
    color:white;
    height:150px;
    position:absolute;
    right:0;
    top:360px;
    width:50px;
    z-index:5;
}
#loket a {
    display: block;
    text-indent: -5000px;
    height: 150px;
    width: 50px;
    background: transparent url(../images/internetsalaris.png) no-repeat;
    background-position: 0 0;
}
#loket a:hover {
    background-position: -50px 0pt;
    z-index: 60;
}
/* Social */
#social { position: absolute; top: 40px; right: 0; background: white; padding: 5px;}

/*Highlighting*/
#home a.home, #actueel a.actueel, #accountancy a.accountancy, #belastingadvies a.belastingadvies, #overejp a.overejp, #vacatures a.vacatures, #contact a.contact {
    color: #FE7D18; /*background-color: white;*/
}
/*Main*/
#mainContent a:link {
    color: #258DC0;
}
#mainContent a:hover {
    color: #FF6500;
}
#mainContent a:visited {
    color: #86C9EA;
}
/*Footer & Credits*/
#footer a:link, #credits a:link {
    color: #3FA8DA;
    text-decoration:none;
}
#footer a:hover, #credits a:hover {
    color: #FE7D18;
}
#footer a:visited {
    color: #3FA8DA;
}
/*
LAYOUT
*/
#twinfield {
    position: absolute;
    width: 50px;
    height: 150px;
    color: white;
    top: 220px;
    right: 0px;
    z-index: 10;
}

#wrapper {
    width: 960px;
    margin: 0 auto;
    background-color: white; 
}
#header {
    overflow: hidden;
    background-image:url(../images/bg-header.png);
    background-repeat: no-repeat;
    background-position: bottom;
    border-bottom: 1px solid gainsboro;
    margin-bottom: 10px;
}
#logo {
    width:310px;
    float:left;
    padding-left: 10px;
}
#menu {
    width: 640px;
    float:left;
    margin-top: 22px;
}

#menu ul {
float:left;
width:150px;
}

#menu ul li a.active{
    color: #FE7D18;
}

#langselect {
    float: left;
    width: 60px;
    margin-left: 580px;
    padding-top: 10px;
    padding-bottom: 4px;
    background-image: url(../images/bg-lang.png);
    background-position: bottom;
    background-repeat: no-repeat;
    text-align: center;
}
/*Language selector*/
#langselect ul {display: inline;} 
#langselect li {display: inline; }
#arena {
    height: 120px;
    overflow: hidden;
    background-color:#066AA6;
    padding: 10px;
}
#mainContent {
    overflow: hidden;
    margin-top: 1em;
    padding-top:10px;
    background-image:url(../images/bg-footer.png);
    background-repeat: no-repeat;
    background-position:top;
}
.dcol {    
    float: left;
    width: 620px;
    margin-left: 10px;
    margin-right:10px;
    }
.col {
    float: left;
    width: 300px;
    margin-left: 10px;
    margin-right:10px;
}

#arena .col {
    margin-left: 0;    /*opacity: .8;    filter: alpha(opacity=80);*/
}
.subcol {
    float: left;
    width: 150px;
}
/*Footer*/
#footer {
    margin-top: 10px;
    height: 102px;
    padding:1em 0;
    background-color: white;
    overflow:hidden;
    background-image:url(../images/bg-footer.png);
    background-repeat:no-repeat;
    border-top: 1px solid gainsboro;
}
#footer a[href$=".pdf"] {
background: none;
}
#footer a:hover[href$=".pdf"] {
background: transparent url(../images/pdf-icon.gif) no-repeat center right;
}
#credits {
    font-size: .9em;
    width: /*320px*/100%;
    float: right;
    margin:20px 0;
    text-align:center;
}
#credits a {
    font-family: "Times New Roman", Times, serif;
}
/*Specifics*/
body#actueel #menu {margin-top:52px;}
#actueel ul,
#feeds ul,
ul#archive-list,
#links ul{
    margin-left:0;
}
#links li, #feeds li {
    border-bottom: 1px solid gainsboro;
    list-style:none;
    margin:.4em 0;
    padding: .4em 0;
}
#links li a, #feeds li a {    text-decoration: none;}
#links li a:hover { /*color: #ABD9F0;*/
}
/*Accordion About*/
.haccordion {padding-bottom: 10px; }
.haccordion .header, .haccordion .content{   float: left; height: 320px;    }
.haccordion .header{   width: 100px;   background: #066AA6;  color: #fff;   cursor: pointer; border-right: 1px solid white; background-position: top; background-repeat: no-repeat; }
.haccordion .content{   display: none;   width: 0px;   overflow: auto;  }
#mainContent .haccordion .content p {margin: 0 5px;}
.haccordion .header h4, .header p {   padding: 5px; }
.haccordion ul { margin: 0 ; padding: 0;}
.haccordion .header h4 {margin: 100px 0 20px;}
.header#edward {background-image: url(../images/edward_tn.jpg); }
.header#joost {    background-image: url(../images/joost_tn.jpg);}
.header#frank {background-image: url(../images/frank_tn.jpg);}
.header:hover {background-color: #FE7D18;}

/*Achtergronden*/
#arena {
    background-repeat: no-repeat;
    height: 320px;
    background-position: 320px center;
}
.homearena {
    background-image: url(http://www.ejp.nu/images/index.jpg);
}
.actueelarena {
    background-image: url(../images/actueel.jpg);
}
.accountancyarena {
    background-image: url(../images/accountancy.jpg);
}
.belastingadviesarena {
    background-image: url(../images/belastingadvies.jpg);
}
.auditarena {
    background-image: url(../images/audit.jpg);
}
.overejparena {
    background-image: url(../images/overejp.jpg);
}
.vacaturesarena {
    background-image: url(../images/vacatures.jpg);
}
.contactarena {
    background-image: url(../images/contact.jpg);
}
.avarena {
    height: 90px;
}
/*FORMS*/
form {
    font-size: 1em; /*margin-top: 1em;*/
    background-color: #EAF8FF;
    padding: 1em 0;
}
form ol {
    margin:0;
    padding:0;
    list-style:none;
}
form li {
    border-bottom:1px solid white;
    list-style:none;
}
fieldset {
    border:1px solid white;
    width:80%;
    padding:8px;
}
label {
    text-align: right;
    width: 80px;
    display: inline-block;
    /*hide from IE display:-moz-inline-box;*/
    vertical-align: top;
    padding-top: 4px;
}
input, select, textarea {
    font-family: Arial, Helvetica, sans-serif;
    font-size:1em;
    margin-left: 24px;
    margin: 2px 4px;
    padding:2px;
    width:200px;
    background-color: #FFF;
    border: 1px solid silver;
}
input:focus, select:focus, textarea:focus {
    border: 1px solid;
}
input[type="submit"] {
    width:auto;
    margin-right: 20px;
}
input[type="hidden"] {
    display: none;
}
br {
    clear: both;
}
#browse {
    width: auto;
}
form#contactut, form#contactdb {
    background: white;
    padding:0;
}
#contactdb input, #contactut input {
    width: 240px;
    margin:0;
}
#contactdb input[type=submit], #contactut input[type=submit] {
    width: 120px; height: 30px;
    border: none;
    float:left;
    background-color: #3FA8DA;
    color: white;
    margin-top: 4px;
    background:transparent url(../images/planroute.png) no-repeat;
}

#arena #subscribe { 
	padding: 10px; 
	margin-right: 0; 
	font-size: 1.1em; 
	font-weight: bold; 
	background: rgba(63, 168, 218, 0.75); 
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
	}
#subscribe p {margin-top: 0;}
#subscribe form {background-color: transparent; color: white;}
#subscribe form select {width:auto;}
#subscribe label {vertical-align:baseline;}
#subscribe input, #subscribe select { background: transparent; color: white;}
#subscribe input[type=submit] {  color: white;}

/*Tools*/
.error {
    font-weight:bold;
    color:red;
}
.comment {
    background-color: yellow;
    color: red;
    font-weight: bold;
}
a[href$=".pdf"] {
padding-right: 18px;
background: transparent url(../images/pdf-icon.gif) no-repeat center right;
} /**/

