/*----------------------------------------------------
basic style sheet

version:	1.1
author:	Niels Aupperlee
email:	niels@nielsaupperlee.nl
website:	http://www.nielsaupperlee.nl
----------------------------------------------------*/

/* opmaak van de body */

body {
background-color: #ff6600; /* color-rgb, color-hex, color-name, transparent */
background-image: none; /* url(" img/name.jpg"), none */
background-repeat: repeat; /* repeat, repeat-x, repeat-y, no-repeat */
background-attachment: scroll; /* scroll, fixed */
background-position: top left; /*top left, top center, top right, center left, center center, center right, bottom left, bottom center, bottom right, x% y%, xpos ypos */
}

/* opbouw van een pagina met behulp van divjes */

div.container{
width: 100%;
margin: 0px;
border-width: 1px;
border-style: solid;
border-color: black;
}

div.header,div.footer
{
padding: 10px;
color:white;
background-color:gray;
}

h1.header
{
padding:0;
margin:0;
}

div.left
{
margin:0;
padding:15px;
}

div.content
{
margin-left:190px;
border-left-width:1px;
border-left-style: solid;
border-left-color: black;
padding:15px;
height: 150px;
overflow: auto;
}

/* opmaak van de headers */

h1, h2, h3{ /* De selectors kunnen ook gegroepeerd worden */
background-color: black;
color: red;
}

h1:hover{ /* wanneer je met je muis er overheen beweegt */
background-color: orange;
color: blue;
}

/* opmaak van de paragrafen */

p{
font-family: trebuchet ms; /* lettertype */
font-size: 20px; /* lxx-small, x-small, small, medium, large, x-large, xx-large, smaller, larger, length, % */
font-style: normal; /* normal, italic, oblique */
font-weight: 400; /* 100 - 900 (400 = normal, 700 = bold) */
text-decoration: none; /* blink, overline, line-through, underline, none */
}

/* opmaak van de paragraaf met classes */

p.testclass{
font-family: verdana;
font-size: 16px;
text-align: right; /* left, right, center, justify */
}

/* hier wordt getest op borders, elke border kan ook apart  - border-bottom, border-left, border-right, border-top */

p.border{
border-width: thick; /* thin, medium, thick, length */
border-style: dotted; /*none, hidden, dotted, dashed, solid, double, groove, ridge, inset, outset */
border-color: blue;
}

/* hier wordt getest op marging */

p.margin{
margin-top: 5px;
margin-right: 5px;
margin-bottom: 5px;
margin-left: 25px;
}

/* opmaak van de paragraaf met id tags*/

p#testid{
color: purple;
font-family: tahoma;
font-size: 12px;
text-align: left;
}

/* opmaak van de fieldset */

fieldset{
color: pink;
border-color: red;
}

legend{
color: green;
}

/* opmaak van een unordered list */

ul{
list-style: url("../img/success.gif"); /* dit plaatje vervangt de standaard bullets */
}

/* opmaak van een horizontaal menu */

ul.menu{
float:left;
width:100%;
padding:0;
margin:0;
list-style-type:none;
}

li.menu{
display:inline;
}

a.menu{
float:left;
width:6em;
text-decoration:none;
color:white;
background-color:green;
padding:0.2em 0.6em;
border-right-width: 1px;
border-right-style: solid;
border-right-color: #ff6600;
}

a.menu:hover{
background-color:#ff3300;
}

/* opmaak van een tabel */

table.tabletest{
border-collapse: separate; /* separate, collapse */
border-spacing: 10px;
empty-cells: hide; /* show, hide */
table-layout: automatic; /* automatic, fixed */
}

caption{
caption-side: bottom; /* top, bottom, left, right */
}

/* hier wordt getest op padding*/

td.padding{
padding-top: 25px;
padding-right: 25px;
padding-bottom: 25px;
padding-left: 25px;
}

/* opmaak van de links */

a:link{
color: #ff0000;
}

a:visited{
color: #00ff00;
}

a:hover{
color: #ff00ff;
}

a:active{
color: #0000ff;
}

/* opmaak van de link class */

a.linktest:link{
color: #333333;
text-decoration: line-through;
}

a.linktest:visited{
color: #ffFF00;
text-decoration: none;
}

a.linktest:hover{
color: #FF00FF;
background: #66ff66;
text-decoration: none;
}

a.linktest:active{
color: #0000FF;
}
