/* RESET */

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,
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-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

:focus {outline: 0;}
body {line-height: 1;	color: black;	background: white;}
ol, ul {list-style: none;}
table {border-collapse: separate;border-spacing: 0;}
caption, th, td {text-align: left;font-weight: normal;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}

/* MAIN */

html, body {font-family:"Arial"; font-size:11px; color:#ffffff;}
body {background-color:#0d0d0d; background-image:url(../images/body.jpg); background-repeat:repeat-y;}

/* LAYOUT */
#header {position:absolute; top:0px; height:106px; width:100%; background:url(../images/header.jpg) repeat-x;}
#logoflash {padding:19px 0 0 21px; float:left;}
#col1 {width:697px; position:absolute; left:0px; top:106px; background:#0e0e0e url(../images/col1.jpg) no-repeat bottom; padding-bottom:270px;}
#col2 {width:299px; position:absolute; left:697px; top:105px; background:#ffffff;}
#main {min-height:354px;}
#mainleft {float:left; width:85px; margin-top:40px; padding:0 20px 0 20px;}
#mainright {float:left; width:492px; padding:40px 80px 0 0;}
#bottom {clear:both; height:210px; background:url(../images/bottom.jpg) no-repeat;}
#rightbottom {width:297px; height:210px; background:url(../images/rightbottom.jpg) no-repeat; border: #ffffff 1px solid; border-top:0px; border-bottom:0px;}

/* LAYOUT PORTFOLIO */

#portfolio #col1 {background:#0e0e0e; padding:0px;}
#portfolio #main {min-height:414px; background:#0e0e0e url(../images/main.jpg) no-repeat bottom;}

/* LAYOUT CONTACT */

#contact #col1 {background:#0e0e0e; padding:0px;}
#contact #main {min-height:414px; background:#0e0e0e url(../images/main_contact.jpg) no-repeat bottom;}
#contact #realtime {margin-top:3px;}

/* HOOFDMENU */

#mainmenu {position:absolute; top:78px; left:0px; width:689px; height:24px; background:url(../images/mainmenu.jpg) no-repeat; padding:4px 0 0 8px;}
#mainmenu li {float:left; margin-right:8px;}
#mainmenu li a {color:#ffffff; display:block; width:86px; height:17px; padding:6px 0 0 12px; font-size:10px; font-weight:bold; letter-spacing:1px; text-transform:uppercase; text-decoration:none;}
#mainmenu li.notactive a {background:none; color:#ffffff;}
#mainmenu li.active a {color:#1160a6; background:#ffffff;}
#mainmenu li.active2 a {color:#1160a6; background:#ffffff;}
#mainmenu li:hover a {color:#1160a6; background:#6699CC;}

/* SUBMENU'S */

#submenu {position:absolute; top:0px; left:0px; height:25px;}
.submenu {width:697px; height:25px; background:url(../images/submenu.jpg) no-repeat; line-height:25px;}
.submenu li {display:inline; margin-right:26px;}
.submenu li a {color:#0059a5; text-decoration:none; letter-spacing:2px;}
.submenu li a:hover {border-bottom:#0059a5 1px solid;}
.submenu li span {color:#0059a5; margin-right:10px;}
.submenu li.first {padding-left:125px;}
.submenu li.hidesubmenu {float:right; padding-top:2px;}
.submenu li.hidesubmenu a {display:block; width:14px; height:14px; font-size:16px; background:url(../images/hidesubmenu.gif) no-repeat; padding:3px; text-indent:-9999px;}
.submenu li.hidesubmenu a:hover {border:none;}

#submenu1, #submenu2, #submenu3, #submenu4, #submenu5, #submenu0 {display:none;}

/* MENU RECHTSBOVEN */

#menutop {position:absolute; top:49px; left:707px; line-height:20px;}
#menutop li {display:inline; margin-right:27px;}
#menutop a {color:#005cac; text-decoration:none; text-transform:uppercase; letter-spacing:1px;}
#menutop a:hover {border-bottom:#005cac 2px solid;}

/* REALTIME */

#realtime {position:absolute; top:78px; left:697px; height:28px; background:url(../images/realtime.jpg) no-repeat;}
#realtime p {font-size:9px; text-transform:uppercase; letter-spacing:1px; padding: 6px 0 0 10px; margin:0;}
.bold {font-weight:bold; letter-spacing:2px; padding-right:5px;}

/* WEBWISE & DOMEINNAAM */

#rightmiddle {width:297px; height:129px; background:url(../images/webwise.jpg) no-repeat; border: #ffffff 1px solid; border-top:0px;}
#rightmiddle p {margin:0;}

#webwise {padding:20px 0 10px 51px;}
#domain {padding-left:11px;}
#domain label {padding-left:39px;}

/* MENU RECHTSONDER */

#rightbottom ul {font-size:10px; padding:11px 0 0 11px;}
#rightbottom ul li {display:inline;}
#rightbottom ul li a {color:#597a96; letter-spacing:2px; text-decoration:none;}
#rightbottom ul li a:hover {color:#ffffff;}
#rightbottom span {color:#597a96; margin:0 16px 0 16px;}

/* PORTFOLIO PRESENTATIE */

#portfoliopic img {border:#ffffff 2px solid; float:left; margin-right:26px; width:154px;}
#portfoliodetails {line-height:20px; float:left; font-weight:bold; letter-spacing:1px; width:300px;}
#portfoliolijst { position:relative; margin:0px; padding:0px; width:697px; overflow:hidden; }

/* PORTFOLIO ITEMS */

#portfolioitems {position:relative; top:0px; left:0px; clear:both; width:697px; margin-left:20px; padding-bottom:20px;}
#portfolioitems img {border:#ffffff 2px solid; float:left; margin:0 9px 9px 0;}
.portfoliosubtitel {font-weight:bold; margin-top:30px; left:0px; margin-left:20px;}

/* PORTFOLIO ITEMS TOOLTIPS */

.tool-tip {color:#fff; letter-spacing:1px; z-index:13000;}
.tool-title {font-weight:bold; font-style:italic;	font-size:11px;	letter-spacing:1px;	margin:0;	color:#4095cb; padding:8px 8px 4px;	background:url(../images/bubble.png) top left;}
.tool-text {font-size:11px; padding:4px 8px 8px; background:url(../images/bubble.png) bottom right;}
.custom-tip {color:#000; width:130px;	z-index:13000;}
.custom-title {font-weight:bold; font-size:11px; margin:0; color:#3E4F14;	padding:8px 8px 4px; background:#C3DF7D; border-bottom:1px solid #B5CF74;}
.custom-text {font-size:11px; padding:4px 8px 8px; background:#CFDFA7;}

/* CONTACT PAGINA (plus route) */

#contact form {margin-top:20px; margin-bottom:10px;}
#contact p {line-height:15px; margin:0;}
#contact p.marginbottom {margin-bottom:10px;}
#contact label {margin-left:7px;}
#contact .button {margin-left:30px;}

/* CONTACTFORMULIER */

#formuliervenster label {width:120px; float:left;}
#formuliervenster .field, #formuliervenster textarea {width:200px; padding:2px;}
#formuliervenster textarea {height:100px;}
#formuliervenster #captcha {margin-left:125px;}
#formuliervenster .button {width:70px;}

/* LANDINGPAGE */

#landingPage h1 {line-height:20px; text-transform:uppercase; letter-spacing:2px; font-weight:normal; background:none; padding:0;}
#landingPage #logo {background:#ffffff; float:left; padding:50px 0 0 11px;}
#landingPage #logo a {display:block; width:229px; height:18px; background:url(../images/h1.gif) no-repeat; text-indent:-9999px;}

/* ALGEMENE CLASSES */

.bold {font-weight:bold;}
.grey {color:#787878; font-style:italic; font-weight:normal; padding-right:10px;}
.field, .FORMINPUT {width:169px; padding:2px;}
.button, .INPUTBUTTON {font-weight:bold; color:#ffffff; background:none; text-transform:uppercase; cursor:pointer;}
.button:hover, .INPUTBUTTON:hover {color:#0071b9;}
.element_style {text-transform:uppercase; padding:5px 5px 0 0; letter-spacing:1px;}
.FORMTEXTAREA {width:169px; height:100px; color:#3377ad; padding:2px;}
.formulier td {padding-bottom:3px; vertical-align:top;}
.floatclearer {clear:both;}

/* ELEMENTEN */

h1 {background:#ffffff; float:left; padding:50px 0 0 11px;}
h1 a {display:block; width:229px; height:18px; background:url(../images/h1.gif) no-repeat; text-indent:-9999px;}
h2 {line-height:20px; text-transform:uppercase; letter-spacing:2px; font-weight:normal;}
h3 {font-weight:bold; margin-bottom:20px; line-height:20px; letter-spacing:1px;}
p {line-height:20px; letter-spacing:1px; margin-bottom:20px;}
#mainright a {color:#ffffff; text-decoration:none; border-bottom:#787878 1px solid;}
#mainright a:hover {border-bottom:#005cac 1px solid;}
#mainright ul {line-height:20px; letter-spacing:1px;}
label {font-weight:bold; font-size:9px; letter-spacing:1px; font-weight:bold; text-transform:uppercase;}
input {font-family:"Arial"; font-size:9px; height:14px; color:#3377ad; line-height:14px; letter-spacing:1px; padding:0; margin:0; border:0;}
textarea {font-family:"Arial"; font-size:9px; line-height:14px; border:0; color:#3377ad;}

strong {font-weight:bold;}
italic {font-style:italic;}
em {font-style:italic;}
u {text-decoration:underline;}