/**
 * Stylesheet for <http://www.sfinx.to>
 * @author	karen <karen@codedor.be>
 * @media	screen, projection
 */

 
* { margin: 0;}
html, body { height: 100%; margin: 0; padding:0;}
#footer, .push { height: 39px; clear: both; }

h1.logo a {
background:transparent url(../img/logo.png) no-repeat scroll 0 0; text-indent: -9999px;
display:block; height:70px; margin:15px 0 0 70px; overflow:hidden; position:absolute; width:223px;}

#container{ position: relative; width: 960px; display: block; min-height: 100%;  height: auto !important; height: 100%; margin: 0 auto -39px; }


/**
 * = Global
 * ----------------------------------------------------------
 */
h1, h2, h3, h4, h5{font-family: Tahoma, Arial, Verdana; color: #727272;}
h1{ font-size: 1.3em;}

#sidebar h1{ text-transform: uppercase; font-size: 0.9em; line-height: 1.8em; }

h2{ font-size: 1.2em;}
#leftside h2.line{ background: none; border-bottom: 1px solid #bebebe ; padding: 0 3px 0 3px; margin: 0 0 8px 0; font-family: "Lucida Sans", Tahoma, Arial; line-height: 2.0em; width:565px; }

h3{ font-size: 0.90em; margin: 0 0 5px 0}

p{ font-size: 11px; color: #6b6b6b; font-family: "Lucida Sans", "Trebuchet MS", Arial; margin: 0 0 20px 0; text-align: justify; }

p a{ color: #6B6B6B;}
p a:hover{ color: #000;}

p img{ margin: 5px}

/* #main h2{ margin: 0 0 10px 0; float: left; display: block; width: 570px; background: #e6e6e6; color: #6b6b6b; font-size: 1.0em; font-family: "Lucida Sans", Arial; height: 23px; padding: 0 0 0 10px}
*/


#leftside ul { margin: 0 0 0 30px; }
#leftside ul li { list-style: disc; font-size: 11px; }
#leftside li a { color: #6B6B6B;}


/* Images */
img.left{ float: left; margin: 3px 10px 5px 0px;}
img.right{ float: right; margin: 3px 0 5px 10px;}
img.center { margin: 3px 5px 5px 0px; }


/* Links */
a.lnk{color: black; font-size: 0.85em; font-weight: 500; display: block; margin: 7px 10px 0 0; text-decoration: underline;}
a.left{ float: left; }
a.right{ float: right; }


/* Calendar */
.cal{ color: #444740;background: url(../img/bg_cal.jpg) no-repeat; width: 78px; height: 108px; display: block; float: left; margin: 0 5px 0 0; padding: 0 8px 0 0 ;text-align: center; }
.cal .day{ font-size: 3em; font-weight: bold; font-family: "Gill Sans", "Trebuchet MS", Georgia; clear: both; padding: 0; margin: 0;}
.cal .month{ display: block; clear: both; padding: 0; margin: -10px 0 0 0;}
.cal .year{}

/* Clearfix */
.clearfix:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden;}


a{ color: #6B6B6B;}
a:hover{ color: #6B6B6B;}
a:link{ color: #6B6B6B;}
a:visited{ color: #6B6B6B;}
a:link{ color: #6B6B6B;}



/**
 * = Header
 * ----------------------------------------------------------
 */
#header{  height: 110px; background: url(../img/bg_header.jpg) no-repeat bottom right; }
.lnk_admin { position: relative; top: 5px; left: 840px; display: block; float: left; }
/* .lnk_admin img{ position: relative; top: 5px; right: 20px; } */

.print_logo{ display: none; }

/**
 * = Top header backgrounds
 * ----------------------------------------------------------
 */

.newsitems { background:transparent url(../img/bg_news.png) no-repeat right top; }
.bouwinfo{ background: url(../img/bg_bouwinfo.png) no-repeat top right; }
.references{ background: url(../img/bg_references.png) no-repeat left top; }
.ecologisch { background: url(../img/bg_ecologisch.png) no-repeat right top; }
.spotlight{ background: url(../img/bg_spotlight.png) no-repeat scroll right top; }
.contact{ background: url(../img/bg_contact.png) no-repeat scroll right top; }
.disclaimer{ background: url(../img/bg_disclaimer.png) no-repeat scroll right top; }
.empty{ background: url(../img/bg_empty.png) no-repeat scroll right top; }


/**
 * = Menu
 * ----------------------------------------------------------
 */
ul.nav { display: block; float: right; margin: 30px 15px 0 0; font-family: "Trebuchet MS", Arial, Verdana;}
ul.nav li.first { height: 70px; background: none;}
ul.nav li { height: 70px; float: left; padding: 0 20px 0 20px; background: url(../img/menu_line.png) no-repeat;  }
ul.nav li a { font-size: 0.9em; display: block; margin: 25px 0 0 0; color: #929292; text-decoration: none; } 
ul.nav li a:hover,
ul.nav li.selected a { color: white;}

.foot_more { display: block; clear: both; height: 30px; display: block; text-align: right;  background: url(../img/bg_footer_more.jpg) repeat-x; margin: 7px 9px 0 0; padding: 2px 10px 0 0; vertical-align: middle;}
.foot_more a, .foot_bottom a{ text-decoration: underline;  color: black; } 
.foot_more a .txt_lnk, .foot_bottom a .txt_lnk{ font-size: 0.85em; font-weight: 500; padding: 0; font-family: Tahoma, "Gill Sans", "Trebuchet MS"}
.foot_more a .arrow, .foot_bottom a .arrow { font-size: 1.4em;  padding: 0;  }

.two-cols p{ margin: 10px 0 10px 0 ; width: 432px; display: block; padding: 0 10px 0 5px; float: left;}


/**
 * = General
 * ----------------------------------------------------------
 */

.top{ width: 960px; height: 55px; padding: 27px 0 10px 0;}
.middle_home{ width: 893px; background: url(../img/box_middle.png) repeat-y top right; padding: 10px 0 10px 67px; margin: -25px 0 0 0}
.middle{ width: 893px; background:  url(../img/box_middle.png) repeat-y top right; padding: 0 0 20px 67px; margin: 0 0 0 0}
.bottom{ width: 960px; background: transparent url(../img/bg_box_footer.png) no-repeat scroll bottom right; margin: 0 0 10px 0}

.top h1 { display: block; float: left; margin: 20px 0 0px 67px; line-height: 1em; width: 595px; line-height: 1.3em;}
.top h1.bar { margin: 0 0 0 67px; }
.top h1.bar_home { margin: 15px 0 0 67px; }

#content_wrapper{ width: 960px; display: block; float: left; margin: 0 10px 0 0;}

#leftside{ display: block; float: left; width: 610px;}
#leftside h2{ margin: 0 0 10px 0; float: left; display: block; width: 585px; background: #e6e6e6; color: #6b6b6b; font-size: 1.0em; font-family: "Lucida Sans", Arial; padding: 5px 0 0 5px}

#leftside p{padding: 0 5px 0 3px; text-align: justify; }

.page_newsitems #leftside h2, .page_newsitems_detail #leftside h2{ width: 489px;} 




/* SIDEBAR */

#sidebar{ display: block; float: left; width: 240px;}
#sidebar h1{ background:#434343 none repeat scroll 0 0; color: white; height: 18px; margin: 0; padding: 3px 0 5px 7px; margin: 0; letter-spacing: 0.5px; }

#sidebar h1.red{ background:#90171B none repeat scroll 0 0; }


#sidebar a { color:#6B6B6B;}
#sidebar a, #sidebar span{  text-decoration: none; display: block; font-size: 0.9em; padding: 9px 20px 7px 5px;}
#sidebar span{ color:#d0d0d0;}

#sidebar ul {margin: 0;  width: 240px;}
#sidebar ul li{ border-top:1px solid #E6E6E6;}

#sidebar li span, #sidebar li div{ margin: 0}
#sidebar li li span, #sidebar li li div{ margin: 0 0 0 15px}
#sidebar li li li span, #sidebar li li li div{ margin: 0 0 0 30px}


#sidebar ul li div.selected a, #sidebar ul li a:hover{ font-weight: bold; color: black; background: url(../img/arrow_left.gif) center right no-repeat;}


.article{ margin: 15px 0 20px 0; width: 595px;}
.contact_form{margin: 30px 0 20px 0;}


#SearchSearchstring{ width: 95%; height: 17px; margin: 0 0 7px 0; padding: 3px 0 0 0}




/**
 * = Breadcrumb
 * ----------------------------------------------------------
 */
#breadcrumb{ color: #6b6b6b; font-size: 0.85em; margin: 15px 0 15px 67px}
#breadcrumb a{ color: #6b6b6b;}




/**
 * = Footer
 * ----------------------------------------------------------
 */
#footer{  position: relative; margin: 0 auto; width: 960px; background: url(../img/bg_footer.jpg) no-repeat top right; }
#footer p{ width: 922px;  text-align: center; color: white; padding: 10px 0 0 0 ; margin: 0;}
#footer p a{ color: white; cursor: pointer;}




/**
 * = Boxes
 * ----------------------------------------------------------
 */


.page_home .box{ width: 960px; background: url(../img/bg_box_footer.png) no-repeat bottom right; padding: 0 0 20px 0; margin: 10px 0 0 0;}
.page_home .who{ background: url(../img/bg_who.png) no-repeat top right; padding: 32px 0 20px 47px; }
.page_home .news{ background: url(../img/bg_news.png) no-repeat top right; /*padding: 38px 0 20px 50px; margin: 0 0 10px 0;*/}



/**
 * = News on homepage
 * ----------------------------------------------------------
 */
.item_left { margin: 0 0 0 0; width: 450px; float: left;}



.item_left h2{ margin: 0 0 10px 0; float: left; display: block; width: 335px; background: #e6e6e6; color: #6b6b6b; font-size: 1.0em; font-family: "Lucida Sans", Arial;  padding: 6px 0 0 10px}
.item_left .news_txt {  float: left; width: 350px}
.item_left .news_txt p{ margin: 10px 0 10px 0 }
.item_left .news_txt p a{ color: #6b6b6b;}
.item_left .news_txt strong{ font-weight: bold;}


/**
 * = Spotlight on homepage
 * ----------------------------------------------------------
 */
.item_right { margin: 0 0 0 20px; width: 400px; float: left; }
.spotlight_txt h2{ margin: 0 0 10px 0; float: left; display: block; width: 400px; background: #3D3D3D; color: #fff; font-size: 1.0em; font-family: "Lucida Sans", Arial; height: 23px; padding: 6px 0 0 10px}
.item_right .spotlight_txt{float: left; width: 400px;}
.item_right .spotlight_txt p{ margin: 10px 0 10px 0;}
.item_right .spotlight_txt p a{ color: #6b6b6b;}
.item_right .spotlight_txt p a:hover{ color: #000;}
.spot_left {display: block; float: left; margin: 5px 13px 5px 0; padding: 0}
.spot_right {display: block; float: right; margin: 10px; padding: 10px 0 0 0}

.foot_bottom{display: block; clear: both; display: block; text-align: right; margin: 7px 9px 0 0; padding: 2px 10px 0 0; vertical-align: middle;}
a .lnk_ref_left{ color: #6B6B6B; font-size: 0.85em; font-weight: 500; float: left; display: block; margin: 5px 10px 0 0; text-decoration: underline;}

a:hover .lnk_ref_left{ color: black; text-decoration: none;}


/**
 * = whoarewe (step 1)
 * ----------------------------------------------------------
 */

.block_ref{ display: block; margin: 0 0 10px 0; border: 1px solid #e7e7e7;height: 130px; width: 860px;}

.block_ref img{ width: 420px; height: 130px; }

a .lnk_ref{ color: black; font-size: 0.85em; font-weight: 500; float: right; display: block; margin: 7px 10px 0 0; text-decoration: underline;}



.whoarewe img.eyecat{ float: left; display: block;}
.whoarewe h1{ margin: 10px 0 10px 0; }
.whoarewe h2{ color: white; background: url(../img/bg_ref_h2.jpg) repeat-x; width: 175px; height: 22px; padding: 3px 0 0 10px; display: block; float: left; font-family: "Lucida Sans", "Trebuchet MS", Tahoma;}
.whoarewe p{ display: block; float: left; width: 380px; margin: 9px 0 0 10px; text-align: left;}

.whoarewe .block_ref_txt{ display: block; width: 410px;float: left; margin: 0 0 0 20px}
.whoarewe .block_ref_txt a .lnk_ref_left{ margin: 7px 0 0 10px; }


/**
 * = News
 * ----------------------------------------------------------
 */
.news_content{ margin: 0 0 10px 0; width: 495px; float: left; display: block; padding: 0;}
.page_newsitems a .lnk_ref_left, .article a .lnk_ref_left{ margin: 7px 0 0 0px; float: none;}

/**
 * = Detail page Realisations (step1)
 * ----------------------------------------------------------
 */
#boxes_ref{}
.box_ref{ background: url(../img/box_ref.jpg) no-repeat; display: block; float: left; width: 200px; height: 300px; padding: 6px 0 0 12px; margin: 10px 0 0 0}
.box_ref img{ border: 1px solid #f2f2f2; margin: 10px 0 0 0;}
a .lnk_ref_detail { color: black; font-size: 0.85em; font-weight: 500; float: left; display: block; margin: 7px 0 0 0; text-decoration: underline; clear: both;}

.location { display: block; float: left; margin: 10px 0 0 0;}
#boxes_ref .location{ width:  170px; line-height: 1.30em; }

/**
 * = Detail page Realisations (step1)
 * ----------------------------------------------------------
 */
.page_realisations #ref_fiche, .page_realisations_step1 #ref_fiche, .page_realisations_step2 #ref_fiche { display: block; float: left; width: 410px; margin: 0 50px 0 0;}
.page_realisations #ref_pics, .page_realisations_step1 #ref_pics, .page_realisations_step2 #ref_pics  { display: block; float: left; width: 410px}

.page_realisations table, .page_realisations_step1 table, .page_realisations_step2 table{ margin: 20px 0 0; }
.page_realisations table td, .page_realisations_step1 table td, .page_realisations_step2 #ref_pics  { vertical-align: top;}
.page_realisations table td.left, .page_realisations_step1 table td.left, .page_realisations_step2 #ref_pics  { padding: 0 10px 5px 0;}
.page_realisations table td p, .page_realisations_step1 table td p, .page_realisations_step2 table td p { margin: 0; padding: 1px 0 0 0; width: 300px;}

.ref_pics_thumbs{ margin: 10px 0 10px 0;}
.thumb{ padding: 5px; border: 1px solid #d2d2d2; margin: 0 20px 10px 0; }


.cat_line{  border-bottom: 1px solid #D2D2D2; margin: 20px 0 10px 0;font-size: 0.90em; font-weight: 500; }
#ref_fiche p{ margin: 0 0 20px 90px; text-align: left;}


/** 
* Search */
#search{ background: #f0f0f0; border: 1px solid #e0e0e0; width: 556px; padding: 20px 15px 20px 15px; margin: 0 0 20px 0}
.srch{ border: 1px solid #acacac; background: #fff; color: black; width: 460px; margin: 0 10px 0 0; height: 25px; font-size: 1.35em; padding: 3px 0 0 3px; }

.btn_search{ color: #fff; background: #891014; padding: 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px solid #891014; }




/* Bouwinfo (detail) */

.tags_all {font-size: 0.90em; border-bottom: 1px dotted #bebebe;}
.tags{ font-weight: bold; border:  none; }
.tags a { color: #6B6B6B; text-decoration: none;}
.tags a:hover{ text-decoration: underline; } 
.art_pics{ margin: 30px 0 0 0; padding:  0 0 10px 0; }

.art_links{ margin: 30px 0 0 0}
.art_links ul { clear:  both; }

.art_files{ margin: 30px 0 0 0}
#leftside .art_files ul li { list-style: none;}
#leftside .art_files ul{ clear: both; margin: 0; padding: 0;}
.art_files .icon{ width: 23px; height: 23px; vertical-align: middle; }

.art_related{ margin: 30px 0 0 0}
.art_related ul {clear: both; margin: 0; padding: 0;}


/* Contact */
.contact_left{ width: 290px; float: left; margin: 0  }
.contact_right{ width: 290px; float: left;  }

.googlemaps{ margin: 20px 0 0 0; clear: both; display: block; float: left; }
.googlemaps iframe { border: 1px solid #000 ;}

.roaddescription{ margin: 20px 0 0 0; display: block; float: left; }


/* sfinxpages */

.intro{ font-style: italic; padding: 5px; background: #f5f5f5; border: 1px solid #e5e5e5}
#boxes_ref { padding: 30px 0 0 0; }
#boxes_ref .intro{ width: 850px; padding-top: 15px;}

#leftside .intro h2 { float: left; width: 578px; font-weight: bold;}


/* pagination */
 
.print_article{	float: right; margin: 0 20px 0 0; } 
 
.pagination { float: right; margin: 8px 20px 8px 0; display: block; width: 540px; text-align: right; }

.pagination .paginator_float{ float: right; margin: 0 9px 0 0; }

.pagination .paginator_float .prev{ float: left; margin: 0 10px 0 0; display: block;}
.pagination .paginator_float .numbers{ float: right; }
.pagination .paginator_float .next{ float: right; margin: 0 0 0 10px; display: block;}
.pagination .paginator_float .next a, .pagination .paginator_float .prev a{ color: #000; font-size: 0.85em; } 
.pagination .disabled { display: none; }

.pagination span{  display: block; float: left; padding: 3px 2px; margin: 1px 0 0 0;font-size: 0.85em; }
.pagination span a, .paginator a{ color: #000!important; padding: 1px 7px; background: #E6E6E6; text-decoration: none}

.pagination span.current{ background: #444740; color: #fff;  padding: 4px 7px; margin: 0 2px}

.error-message{ color: red; font-style: italic; font-size: 0.85em; }




/* pagination 
.pagination {  width:  500px; float: right; margin-right: 25px;}
.pagination .disabled{ float: left; }
.pagination a, .pagination span.current{ display: block; float: left; padding: 3px 8px; background: #E6E6E6; margin: 0 5px 0 0}
*/

/* autocomplete */
.autocomplete_live {
	background:#F0F0F0 none repeat scroll 0%;
	clear:both;
	cursor:pointer;
	display:block;
	margin:0px;
	padding:0px;
	z-index:9999;
}

.autocomplete_live ul {
	clear:both;
	display:block;
	list-style-type:none;
	margin:0px;
	padding:0px;
	position:absolute;
	width:100%;
}

.autocomplete_live li {
	background:#F0F0F0 none repeat scroll 0%;
	border-bottom:1px solid #C0C0C0;
	display:block;
	height:25px;
	list-style-type:none;
	margin:0px;
	padding:0px;
}


/* tiny mce */

/*.article h1{ font-family: Tahoma, Arial, Verdana; background: #E6E6E6; color: #727272; font-size: 0.95em; padding: 3px 0 3px 5px; width: 585px; margin: 0 0 10px 0; font-weight: bold;}*/
.article h2{  font-family: Tahoma, Arial, Verdana; background: #E6E6E6; color: #727272; font-size: 1.1em; padding: 3px 0 3px 5px; width: 585px; margin: 0 0 10px 0; font-weight: bold;}
.article h3{ font-family: Tahoma, Arial, Verdana; color: #727272; margin: 0 0 10px 0; font-size: 1.1em; font-weight: bold;}
.article h4{ font-family: Tahoma, Arial, Verdana; color: #727272; margin: 0 0 10px 0; font-size: 0.95em; text-decoration: underline}
.article h5{ font-family: Tahoma, Arial, Verdana; color: #727272; margin: 0 0 10px 0; font-size: 0.95em;}
.article h6{ font-family: Tahoma, Arial, Verdana; color: #727272; margin: 0 0 10px 0; font-size: 0.85em;}



