@import "starter.css";

html	{
	margin: 0;
	padding:0;
}
body	{
	BACKGROUND-COLOR:#4d5f86;
	BACKGROUND: url(images/footer-bg.gif) repeat 50%;
	/*FONT-family: "Trebuchet MS", sans-serif;*/
	FONT-family:  Georgia,"Hoefler Text", "Times New Roman", Times, serif;
	PADDING-RIGHT: 0px;
	PADDING-LEFT: 0px;
	PADDING-BOTTOM: 0px;
	MARGIN: 0px;
	PADDING-TOP: 0px;
	FONT-SIZE: 75%;
	COLOR:#843800;
}

p 	{ 
	 FONT-SIZE: 65%;
	MARGIN: 0px;

	/*FONT-family: "Trebuchet MS", sans-serif;*/
	FONT-family:  Georgia,"Hoefler Text", "Times New Roman", Times, serif;

	FONT-WEIGHT:normal;
}
form	{
	padding:0;
margin:0;
}

p.statement	{
	Clear: both;
	MARGIN: 0px;
	FONT-WEIGHT: 500;
	 FONT-SIZE: 120%;
	 BACKGROUND: none transparent scroll repeat 0% 0%;
	 MARGIN-BOTTOM: 0.8em;
	 PADDING-top: 0px;
	 COLOR: #843800;
	 LINE-HEIGHT: 135%;
	 

}


P.intro {
	
	 
	 BACKGROUND: none transparent scroll repeat 0% 0%;
	 MARGIN-BOTTOM: 0.8em;
	PADDING-top: 12px;
	 COLOR: #843800;
	 LINE-HEIGHT: 125%;
	 FONT-STYLE: italic;
}
P.portfoliointro {
	
	 
	 BACKGROUND: none transparent scroll repeat 0% 0%;
	 MARGIN-BOTTOM: 0.8em;
	PADDING: 0px 0 0 12px;
	 COLOR: #843800;
	 LINE-HEIGHT: 135%;
	FONT-SIZE:10px;
}
P.emphasis {
	FONT-WEIGHT: bold;
}


/*---------------
A {
	COLOR: #843800! important;
	 BACKGROUND-COLOR: transparent! important;
	 TEXT-DECORATION: none;
}

A EM {
	COLOR: #843800! important;
	 BACKGROUND-COLOR: transparent! important;
	 TEXT-DECORATION: none
}

A:visited {
	COLOR: #843800! important;
	 BACKGROUND-COLOR: transparent! important;
	 TEXT-DECORATION: none
}

A:visited EM {
	COLOR: #843800! important;
	 BACKGROUND-COLOR: transparent! important;
	 TEXT-DECORATION: none
}

A:hover {
	COLOR: #540800! important;
	 BACKGROUND-COLOR: transparent! important;
	 TEXT-DECORATION: none
}

A:active {
	COLOR: #843800! important;
	 BACKGROUND-COLOR: transparent! important;
	 TEXT-DECORATION: none
}

A:hover EM {
	COLOR: #540800! important;
	 BACKGROUND-COLOR: transparent! important;
	 TEXT-DECORATION: none
}

A:active EM {
	COLOR: #843800! important;
	 BACKGROUND-COLOR: transparent! important;
	 TEXT-DECORATION: none
}
---------------*/

#logo {
	MARGIN: 0px;
	 COLOR: #000;
	 HEIGHT: 225px;
	 TEXT-ALIGN: right;
}
#container {
	PADDING-RIGHT: 0px;
	 PADDING-LEFT: 0px;
	 BACKGROUND: url(images/splash1.jpg)  no-repeat left top;
	 BACKGROUND-COLOR:transparent; 
	 PADDING-BOTTOM: 0px;
	 WIDTH: 100%;
	 COLOR: #000;
	 PADDING-TOP: 0px;
	 POSITION: absolute;
}


#main {
	BORDER-TOP: #843800 1px solid;
	BACKGROUND:  #ffe7d3;
	COLOR: #843800;
	BORDER-BOTTOM: #843800 1px solid;
	padding: 0;
}




#inhoud {
	PADDING-RIGHT: 0px;
	 PADDING-LEFT: 0px;
	 FONT-SIZE: 95%;
	 FLOAT: left;
	 PADDING-BOTTOM: 1px;
	 WIDTH: 95%;
	 COLOR: #222;
	 LINE-HEIGHT: 135%;
	 PADDING-TOP: 35px;
}



#focus {
	BACKGROUND: url(images/focus-tile.jpg) #fff0e3;
	 MARGIN: 0px 5% 20px 4%;
	 COLOR: #000;
}
#bg {	/**  width:100%;**/
	height:216px;  
	BORDER-RIGHT: #ccc 1px solid;
	 BORDER-TOP: #ccc 1px solid;
	 BACKGROUND: url(images/box-bg-right.jpg) #fff0e3 no-repeat right bottom;
	 BORDER-LEFT: #ccc 1px solid;
	 COLOR: #000;
	 BORDER-BOTTOM: #ccc 1px solid
}

#focus H1 {
	MARGIN: 0px 0px 0px 12px;
}

#focus .intro {
	FONT-SIZE: 12px;
	COLOR: #843800;
	 MARGIN: 0px 300px 5px 5%;
	 LINE-HEIGHT: 14px;
}

#focusicons {
	MARGIN: 0px 0px 3px 5%;
}
#focusicons A {
	DISPLAY: inline;
}

#focusicons IMG {
	MARGIN: 5px 0px 0px 0px;
}


*html #focusicons IMG {
	MARGIN: 14px 0px 0px 0px;
}


/***************---  Porfolio Page  ---***********************/
#portbody {
	MARGIN: 0px 0px 0px 3px;
	PADDING-RIGHT: 0px;
	 PADDING-LEFT: 0px;
	 FONT-SIZE: 130%;
	 FLOAT: left;
	 PADDING-BOTTOM: 1px;
	 WIDTH: 30%;
	 COLOR: #222;
	 LINE-HEIGHT: 135%;
	 PADDING-TOP: 35px;
	position:relative;
}

#portbody p	{
	MARGIN: 10px 0 10px 0;
	FONT-SIZE: 95%;
	 
	 PADDING: 0 30px 0 15px;
	 COLOR: #843800;
	 LINE-HEIGHT: 140%;
}


#rightbox	{
	BORDER: #ccc 1px solid;
	PADDING: 0 0 1px 0;
	 MARGIN:20px 0 0 0;
	 FONT-SIZE: 95%;
	 FLOAT: left;
	 WIDTH: 30%;
	 BACKGROUND: #fff0e3;
	 LINE-HEIGHT: 125%;
	 
}

#rightbox p	{
	MARGIN: 0px;
	FONT-SIZE: 100%;
	 BACKGROUND: none transparent scroll repeat 0% 0%;
	 MARGIN-BOTTOM: 0.8em;
	 PADDING: 0 0 0 15px;
	 COLOR: #843800;
	 LINE-HEIGHT: 100%;
}
#rightbox H2	{
	COLOR: #843800;
	PADDING: 5px 5px;
	FONT-WEIGHT: bold;
	 FONT-SIZE: 145%;
	MARGIN: 0px 0px 0.5em 0;
	 LINE-HEIGHT: 115%;
}

.porticonlist {
	BACKGROUND: url(images/bg-portfolio.gif)  no-repeat left top;
}

.porticonlist H2	{
	PADDING: 0px;
	FONT-WEIGHT: bold;
	 FONT-SIZE: 145%;
	MARGIN: 0px 0px 0.5em 0;
	 LINE-HEIGHT: 115%;
}

.porticonlist H2	{
	COLOR: #843800;
	PADDING: 0px;
	FONT-WEIGHT: bold;
	 FONT-SIZE: 145%;
	MARGIN: 0px 0px 0.5em 0;
	 LINE-HEIGHT: 115%;


}
/***************---  End Porfolio Page  ---***********************/

/****************** service section  ******************/

.services	{
	BACKGROUND: url(images/bg-services.gif)  no-repeat left top;
}

.wsd 	{
	BACKGROUND: url(images/bg-wsd.gif)  no-repeat left top;
}

#wsd-box 	{
	BACKGROUND: url(images/service-box-wsd.gif)  no-repeat left top;
	FLOAT: left;
	MARGIN: 5px 20px 10px 7px;
	WIDTH: 278px;
	HEIGHT: 77px;
}


.wsc 	{
	BACKGROUND: url(images/bg-wsc.gif)  no-repeat left top;
}
#wsc-box 	{
	BACKGROUND: url(images/service-box-wsc.gif)  no-repeat left top;
	FLOAT: left;
	MARGIN: 5px 20px 10px 7px;
	WIDTH: 278px;
	HEIGHT: 77px;
}

.adwords 	{
	BACKGROUND: url(images/bg-adwords.gif)  no-repeat left top;
}
#adwords-box 	{
	BACKGROUND: url(images/service-box-adwords.gif)  no-repeat left top;
	FLOAT: left;
	MARGIN: 5px  20px 10px 7px;
	WIDTH: 278px;
	HEIGHT: 77px;
}


.blog 	{
	BACKGROUND: url(images/bg-blog.gif)  no-repeat left top;
}
.about 	{
	BACKGROUND: url(images/bg-about.gif)  no-repeat left top;
}

.login 	{
	BACKGROUND: url(images/bg-login.gif)  no-repeat left top;
}

.faq 	{
	BACKGROUND: url(images/bg-faq.gif)  no-repeat left top;
}

#blog-box 	{
	BACKGROUND: url(images/service-box-blog.gif)  no-repeat left top;
	FLOAT: left;
	MARGIN: 5px  20px 10px 7px;
	WIDTH: 278px;
	HEIGHT: 77px;
}



.wfdm 	{
	BACKGROUND: url(images/bg-wfdm.gif)  no-repeat left top;
}
#wfdm-box 	{
	BACKGROUND: url(images/service-box-wfdm.gif)  no-repeat left top;
	FLOAT: left;
	MARGIN: 5px  20px 10px 7px;
	WIDTH: 278px;
	HEIGHT: 77px;
}



/****************** end service section  ******************/


/***************---  SUBBODY ---***********************/
#subbody {
	MARGIN: 0px 0px 0px 3px;
	PADDING-RIGHT: 0px;
	 PADDING-LEFT: 0px;
	 FLOAT: left;
	 PADDING-BOTTOM: 1px;
	 WIDTH: 60%;
	 COLOR: #222;
	 PADDING-TOP: 35px;
	position:relative;
}

#subbody p	{
	MARGIN: 10px 0 10px 0;
	FONT-SIZE: 130%;
	LINE-HEIGHT: 140%;	 
	 PADDING: 0 30px 0 15px;
	 COLOR: #843800;
}
#subbody p.serv-desc	{
	padding-top:35px;
}
#subbody a	{
	 COLOR: #843800;
	text-decoration:underline;
}

#subbody a:hover	{
	 COLOR: #364063;
}

#subbody li	{
	
	COLOR: #843800;
	MARGIN: 0 0 0 30px;
	PADDING: 0.1em 0 0.1em 1.5em;
	LINE-HEIGHT: 110%;
	FONT-SIZE: 130%;
	BACKGROUND: url(images/arrow=bullet.gif) 2px 0.3em no-repeat;

}
#subbody li.emphasis	{
	font-weight:bold;
}

#goarrow	{
	float:right;
	align:right;
	Margin: 0 25px 0 5px;
}
.justify	{
	text-align:justify;
	Padding-right:0;
}

/***************---  End SUBBODY  ---***********************/


/***************---  SUBNAV ---***********************/
#subnav	{
	
	PADDING: 0px 0 0 10px;
	 MARGIN:30px 0 0 0;
	 FLOAT: left;
	 WIDTH: 30%;
	 BACKGROUND: url(images/subnavbg.gif) left repeat-y;
	 
}

#subnav H2	{
	COLOR: #843800;
	PADDING: 5px 5px;
	FONT-WEIGHT: bold;
	 FONT-SIZE: 135%;
	MARGIN: 0.25em 0 0.25em 0;
	 LINE-HEIGHT: 105%;
}
#subnav a	{
	COLOR: #843800;
}

#subnav a:hover	{
	COLOR: #364063;
}



/***************--- END SUBNAV ---***********************/

/*****home focus box ****/

.uright {
	POSITION: relative;
}

.uleft {
	POSITION: relative;
}

.lright {
	POSITION: relative;
}

.lleft {
	POSITION: relative;
}

.uleft {
	BACKGROUND: url(images/box-ul.gif) no-repeat left top;
	 LEFT: -1px;
	 COLOR: #000;
	 TOP: -1px;
}

.uright {
	BACKGROUND: url(images/box-ur.gif) no-repeat right top;
	 LEFT: 2px;
	 COLOR: #000;
}

.lright {
	BACKGROUND: url(images/box-lr.gif) no-repeat right bottom;
	 COLOR: #000;
	 TOP: 2px;
}

.lleft {
	PADDING-RIGHT: 20px;
	 PADDING-LEFT: 20px;
	BACKGROUND: url(images/box-ll.gif) no-repeat left bottom;
	 LEFT: -2px;
	 PADDING-BOTTOM: 12px;
	 COLOR: #000;
	 PADDING-TOP: 12px
	 
}
#focus .uright {
	BACKGROUND-IMAGE: url(images/box-ur.gif)
}

#focus .lright {
	BACKGROUND-IMAGE: url(images/box-lr.gif)
}

#focus .lleft {
	BACKGROUND-IMAGE: url(images/box-ll.gif)
}


#focus .lleft {
	PADDING-RIGHT: 3%;
	 PADDING-LEFT: 3%;
	 PADDING-BOTTOM: 12px;
	 PADDING-TOP: 12px
}
#inhoud FORM .lleft {
	PADDING-RIGHT: 4%;
	 PADDING-LEFT: 4%;
	 PADDING-BOTTOM: 12px;
	 PADDING-TOP: 1.2em
}
/*End home focus box*/




.break {
	CLEAR: both;
	 FONT-SIZE: 1px;
	 LINE-HEIGHT: 1px;
}


#footer	{
	BACKGROUND:transparent;
	POSITION: relative;
	DISPLAY: inline;

}
#end {
	CLEAR: both;
	 PADDING-RIGHT: 4%;
	 PADDING-LEFT: 4%;
	 FONT-SIZE: 100%;
	COLOR:#ffe7d3;
	 PADDING-BOTTOM: 18px;
	 MARGIN: 0px;
	 LINE-HEIGHT: 170%;
	 PADDING-TOP: 6px;
}
#end a	{
	COLOR:#ffe7d3;
}

#end a:hover	{
	COLOR:#ffac66;
}

#dec {
	CLEAR: both;
	 PADDING-RIGHT: 0px;
	 PADDING-LEFT: 0px;
	 BACKGROUND: none transparent scroll repeat 0% 0%;
	 PADDING-BOTTOM: 0px;
	 MARGIN: 0px 5% 10px 4%;
	 COLOR: #444;
	 PADDING-TOP: 10px;
}
.items {
	
	FONT-SIZE: 90%;
	 BACKGROUND: none transparent scroll repeat 0% 0%;
	 MARGIN: 30px 0px 0px 0px;
	 COLOR: #333;
	 LINE-HEIGHT: 140%;
}

.items H2 {
	PADDING-RIGHT: 0px;
	 PADDING-LEFT: 0px;
	 FONT-WEIGHT: bold;
	 FONT-SIZE: 145%;
	 PADDING-BOTTOM: 0px;
	 MARGIN: 0px 0px 0.5em 0;
	 LINE-HEIGHT: 115%;
	 PADDING-TOP: 0px;
}
.items A {
	COLOR: #843800! important;
	 BACKGROUND-COLOR: transparent! important;
	 TEXT-DECORATION: underline;
}
.items P {
	MARGIN-LEFT: 0px;
	 MARGIN-RIGHT: 0px;
	COLOR: #843800! important;
	FONT-SIZE: 12px;
}

.block1 {
	FLOAT: left;
	 MARGIN: 0px 4% 10px;
	 WIDTH: 24%;
}

.block2 {
	FLOAT: left;
	 MARGIN: 0px 2% 10px;
	 WIDTH: 24%;
}

.block3 {
	FLOAT: right;
	 MARGIN: 0px 4% 10px;
	 WIDTH: 22%;
}
.blocks	{
	
}
/*--------------- #sitePrimaryNav -----------------*/
/*-------------- #siteSecondaryNav ---------#-------*/
/*-------------- -------*/
#sitePrimaryNav,
#siteSecondaryNav
{
	POSITION: absolute;
	LEFT:0px;
	 TOP: 199px;
	 HEIGHT: 25px;
	WIDTH: 400px;

  border-top              : 1px solid #d87831;
  background              : #ffe7d3 url(images/nav_ul.gif) repeat-x 50% 100%;
  padding                 : 0 0 0 5px;
}
* html  #sitePrimaryNav
{
	TOP: 196px;

}

#sitePrimaryNav ul,
#siteSecondaryNav ul
{
  border-top              : 2px solid #ffe7d3;
  padding-left            : 2px;
  background              : url(images/nav_li.gif) no-repeat 0 100%;
}
#sitePrimaryNav ul li,
#siteSecondaryNav ul li
{
  float                   : left;
  display                 : inline;
  padding-right           : 2px;
  background              : url(images/nav_li.gif) no-repeat 100% 100%;
}
#sitePrimaryNav ul li a,
#siteSecondaryNav ul li a
{
  display                 : block;
	font-size: 12px;
  line-height             : 20px;
  padding                 : 0 10px 2px 10px;
  color                   : #843800;
}
* html  #sitePrimaryNav ul li a,	
{
	line-height             : 2em;
}

#sitePrimaryNav ul li a:hover,
#siteSecondaryNav ul li a:hover
{
  text-decoration         : none;
  background              : #ffe7d3 url(images/nav_a_hover.gif) repeat-x 50% 100%;
	color: #540800;
}
#sitePrimaryNav ul li a:active,
#siteSecondaryNav ul li a:active
{
  background              : #ffe7d3 url(images/nav_a_active.gif) repeat-x 50% 100%;
}

/*-------------- end nav section----------------*/

/***********************************************************
FORM ELEMENTS
***********************************************************/
.contact 	{
	BACKGROUND: url(images/bg-contact.gif)  no-repeat left top;
}

#kaddress	{
	float:left;
	background: url(images/kaddress.gif)  no-repeat left top;
	width: 235px;
	height: 125px;
}

.pulldown
{
    BORDER-RIGHT: #843800 1px;
    BORDER-TOP: #843800 1px;
    FONT-WEIGHT: bold;
    FONT-SIZE: 12px;
    MARGIN: 5px 0px 0px 25px;
    BORDER-LEFT: #843800 1px;
    WIDTH: 200px;
    COLOR: #843800;
    BORDER-BOTTOM: #843800 1px;
    	/*FONT-family: "Trebuchet MS", sans-serif;*/
	FONT-family: "Hoefler Text", Georgia, "Times New Roman", Times, serif;
	background: #fff7f1 url(images/bginputtxt.gif) repeat-x 0 0;
}
.inputtext
{

    FONT-WEIGHT: normal;
    FONT-SIZE: 12px;
    MARGIN: 5px 100px 0px 25px;
    LETTER-SPACING: 1px;
    TEXT-ALIGN: right;
}
.formlook
{
    BORDER-RIGHT: #ffffff 1px solid;
    PADDING-RIGHT: 3px;
    BORDER-TOP: #aa5d24 1px solid;
    PADDING-LEFT: 3px;
    FONT-WEIGHT: bold;
    PADDING-BOTTOM: 0px;
    MARGIN: 5px 0px 0px 25px;
    BORDER-LEFT: #aa5d24 1px solid;
    WIDTH: 200px;
    COLOR: #843800;
    PADDING-TOP: 0px;
    BORDER-BOTTOM: #ffffff 1px solid;
    	/*FONT-family: "Trebuchet MS", sans-serif;*/
	FONT-family: "Hoefler Text", Georgia, "Times New Roman", Times, serif;
    background: #ffe7d3 url(images/bginputtxt.gif) repeat-x 0 0;
}
.textarea
{
    BORDER-RIGHT: #ffffff 1px solid;
    BORDER-TOP: #aa5d24 1px solid;
    FONT-WEIGHT: bold;
    MARGIN: 5px 0px 0px 25px;
    BORDER-LEFT: #aa5d24 1px solid;
    WIDTH: 200px;
    COLOR: #843800;
    BORDER-BOTTOM: #ffffff 1px solid;
    	/*FONT-family: "Trebuchet MS", sans-serif;*/
	FONT-family: "Hoefler Text", Georgia, "Times New Roman", Times, serif;
    background: #ffe7d3 url(images/bginputtxt.gif) repeat-x 0 0;
        
}
.inputtextline
{
    PADDING-RIGHT: 100px;
    FONT-WEIGHT: normal;
    MARGIN: 5px 100px 0px 25px;
    LETTER-SPACING: 1px;
    TEXT-ALIGN: center;
}
.pulldowncenter
{
    BORDER-RIGHT: #ffffff 1px solid;
    PADDING-RIGHT: 0px;
    BORDER-TOP: #aa5d24 1px solid;
    PADDING-LEFT: 0px;
    FONT-WEIGHT: bold;
    FONT-SIZE: 12px;
    PADDING-BOTTOM: 0px;
    MARGIN: 0px;
    BORDER-LEFT: #aa5d24 1px solid;
    COLOR: #843800;
    PADDING-TOP: 0px;
    BORDER-BOTTOM: #ffffff 1px solid;
    TEXT-ALIGN: middle;
	background: #ffe7d3 url(images/bginputtxt.gif) repeat-x 0 0;
}