/* -- Body --*/

body {
background:url(Images/Body.jpg) repeat-x;
background-attachment:fixed;
margin:0px;
padding:0px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#555555;
line-height:20px;
}

/* -- Styling --*/

p {
padding:0;
margin-bottom:15px;
}
hr {
color:#dadada;
height:1px;
margin:0 0 15px 0;
padding:0;
}
.Clear {
clear:both;
}
.alignleft {
float:left;
padding-right:20px;
}
.ContentContainer a {
color:#ff0030;
font-weight:bold;
}
.ContentContainer a:hover {
color:#555;
}
a img {
border:0;
}
a.Button, input.Button {
display:block;
height:25px;
line-height:25px;
padding:0 15px;
background:url(Images/bg-button.jpg) top left repeat-x;
float:left;
color:#FFF;
text-decoration:none;
text-shadow: #a00724 0px 1px 0px;
margin-bottom:15px;
font-size:12px;
border:0px;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
}
a.Button:hover, input.Button:hover {
color:#FFF;
background-position:bottom left;
text-shadow: #555 0px 1px 0px;
}

/* -- Wrapper --*/

.SuperWrapper {
width:980px;
margin:0 auto;
background-image:url(Images/Wrapper.png);
background-repeat:repeat-y;
background-position:top left;
}
.Wrapper {
float:left;
width:920px;
margin-left:10px;
padding:10px 20px 18px 20px;
}
.Wrapper ul, .Wrapper ul li { float:left; clear:left; }

/* -- TopContainer --*/

.TopContainer {
float:left;
width:920px;
}
.TopContainer a.tcCompanyLogo {
float:left;
width:210px;
height:100px;
display:block;
background-image:url(Images/tcCompanyLogo.jpg);
background-repeat:no-repeat;
background-position:top left;
}
.TopContainer .tcCompanyDesc {
float:left;
width:450px;
height:90px;
padding-left:20px;
padding-top:10px;
}
.TopContainer .tcCompanyDesc h1 {
font-size:30px;
color:#888;
}
.TopContainer .tcUtilities {
float:right;
width:220px;
height:100px;
}
.TopContainer .tcUtilities .UtilitiesMenu {
float:right;	
}
.TopContainer .tcUtilities .UtilitiesMenu a {
text-decoration:none;
color:#555555;
font-weight:bold;
margin-left:5px;
padding-right:5px;
border-right:1px solid #dadada;
}
.TopContainer .tcUtilities .UtilitiesMenu a:hover {
color:#ff0030;
}
.TopContainer .tcMenuHolder {
float:left;
clear:left;
width:920px;
height:40px;
background-image:url(Images/tcMenuHolder.jpg);
background-repeat:repeat-x;
background-position:top left;
}
.TopContainer .tcMenuHolder .MainMenu {
float:left;
}
.TopContainer .tcMenuHolder .Search {
float:right;
}

/* -- Panorama --*/

.PanoramaContainer {
float:left;
width:920px;
height:250px;
display:inline;
background-image:url(Images/pcPanorama.jpg);
}

/* -- ContentContainer --*/

.ContentContainer {
float:left;
width:920px;
margin-top:20px;
display:inline;
}
.ContentContainer  h2 {
font-size:24px;
}
.ContentContainer  h3 {
font-size:18px;
}
.ContentContainer  h2, .ContentContainer  h3 {
font-family:"Palatino Linotype";
font-style:italic;
font-weight:bold;
color:#ff0030;
margin:0 0 15px 0;
padding:0;
}
.ContentContainer  h2 a, .ContentContainer  h3 a {
text-decoration:none;
margin:0;
padding:0;
}

/* -- LeftColumn / Navigation --*/

.ContentContainer .ccLeft {
float:left;
width:210px;
margin-right:20px;
}

/* SuckerFish Essential Styling */

.sf-menu, .sf-menu * {
margin:	0;
padding: 0;
list-style: none;
}
.sf-menu {
line-height: 1.0;
}
.sf-menu ul {
position: absolute;
top: -999em;
width: 15em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
width: 100%;
}
.sf-menu li:hover {
visibility:	inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
float: left;
position: relative;
}
.sf-menu li a {
display: block;
font-size:13px;
font-weight:bold;
text-transform:uppercase;
background:url(Images/bg-navitem.jpg) top left repeat-x;
color:#FFF;
text-decoration:none;
text-shadow: #555 0px 2px 0px;
position: relative;
}
.sf-menu li:hover ul, .sf-menu li.sfHover ul {
left:0;
top: 2.5em; /* match top ul list item height */
z-index: 99;
}
ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul {
top:-999em;
}
ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul {
left:10em; /* match ul width */
top:0;
}
ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul {
top: -999em;
}
ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul {
left:15em; /* match ul width */
top:0;
}

/* SuckerFish Styling */

.sf-menu {
float:left;
}
.sf-menu ul li ul { min-width:200px; margin-left:60px!important; }
.sf-menu li a {
padding: 0em 1em;
height:40px;
line-height:40px;
text-decoration:none;
color:#FFF;
}
.sf-menu li a, .sf-menu li a:visited  { /* visited pseudo selector so IE6 applies text colour*/
color:#FFF;
}
.sf-menu li a, .sf-menu li li  a{
background:url(Images/bg-navitem.jpg) top left repeat-x;
}
.sf-menu li.current_page_item a, .sf-menu li.current_page_item a:hover, .sf-menu li.sfHover, .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
background:url(Images/bg-navitem.jpg) bottom left repeat-x;
color:#FFF;
outline:0;
}

/* SuckerFish Arrows Styling */

.sf-menu a.sf-with-ul {
padding-right: 	2.25em;
min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
position:absolute;
display:block;
right:.9em;
top:1.05em; /* IE6 only */
width:10px;
height:10px;
text-indent:-999em;
overflow:hidden;
background:url(Images/bg-arrows.png) no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
top:1em;
background-position:0 -100px; /* use translucent arrow for modern browsers*/
}

/* apply hovers to modern browsers */

a:focus > .sf-sub-indicator, a:hover > .sf-sub-indicator, a:active > .sf-sub-indicator, li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
background-position: bottom left; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */

.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }

/* apply hovers to modern browsers */

.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** adding sf-vertical in addition to sf-menu creates a vertical menu ***/

.sf-vertical, .sf-vertical li {
width:17.5em;
}

/* this lacks ul at the start of the selector, so the styles from the main CSS file override it where needed */

.sf-vertical li:hover ul,
.sf-vertical li.sfHover ul {
left:17.5em; /* match ul width */
top:0;
}

/*** alter arrow directions ***/

.sf-vertical .sf-sub-indicator { background-position: -10px 0; } /* IE6 gets solid image only */
.sf-vertical a > .sf-sub-indicator { background-position: 0 0; } /* use translucent arrow for modern browsers*/

/* hover arrow direction for modern browsers*/

.sf-vertical a:focus > .sf-sub-indicator,
.sf-vertical a:hover > .sf-sub-indicator,
.sf-vertical a:active > .sf-sub-indicator,
.sf-vertical li:hover > a > .sf-sub-indicator,
.sf-vertical li.sfHover > a > .sf-sub-indicator {
background-position: -10px 0; 
}

/* -- MainColumn --*/

.ContentContainer .ccMid {
float:left;		
width:400px;
min-height:220px;
border-right:1px solid #dadada;
padding-right:20px;
}
.ContentContainer .ccMid p {
	float:left;
	clear:left;	
}
.LatestNews {
padding-top:15px;
border-top:1px solid #dadada;
}
.ContentContainer .ccPage {
float:left;		
width:680px;
}

/* -- RightColumn --*/

.ContentContainer .ccRight {
float:right;
width:250px;

}
.ContentContainer .ccRight ul {
margin:0 0 15px 0;
padding:0;
list-style:none;
}

/* -- Contactformulier -- */
.ContactRow {
	float:left;	
	clear:left;
	padding:5px 0px 5px 0px;
}

.ContactRow span textarea,
.ContactRow span input {
	width:300px;
	border:1px solid #dadada;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#555555;
	padding:3px;
}
.ButtonHolder {
	float:left;
	clear:left;	
}
.ButtonHolder input {
	float:left;
}

.ButtonHolder input:hover {
	cursor:pointer;
}

.wpcf7-response-output.wpcf7-validation-errors,
.wpcf7-not-valid-tip-no-ajax {
	display:inline-block;
	float:left;
	clear:left;
	color:#ff0000;
	padding-top:5px;	
}

/* -- Footer --*/

.FooterHolder {
width:980px;
float:left;
clear:left;
background-image:url(Images/FooterHolder.png);
background-repeat:no-repeat;
background-position:top left;
}
.FooterHolder .fhFooter {
float:left;
height:40px;
line-height:50px;
margin-left:10px;
display:block;
}
.FooterHolder ul {
float:right;
list-style:none;
padding:0;
margin:0;
}
.FooterHolder ul li {
float:left;
list-style:none;
margin:0;
height:40px;
line-height:50px;
padding:0 10px;	
}
.FooterHolder ul li a {
float:left;
color:#666;
text-decoration:none;
}
.FooterHolder ul li a:hover {
text-decoration:underline;
}

/* -- Newsposts --*/

.ccPage .post {
border-bottom:1px solid #dadada;
}
.post {
margin-bottom:15px;

float:left;
clear:left;
width:100%;
display:block;
padding-bottom:15px;
}
.post h2 {
padding:0;
margin:0;
}
.post small {
font-size:11px;
color:#888;
}
.LatestPost img {
float:left;
padding:0px 10px 10px 0;
}