/* CSS for Bplus */
/* code by Melimato */
/* use this code if you want but only on nice sites */
/* general design and content copyrighted: BPlus, Exelmans, Melimato */


/*general*/

body
{
	background: #555553;
	color: #CECBC6;
	font-family: 'Gill Sans', 'Trebuchet MS', Helvetica, sans-serif;
	text-align: center;
	font-size: .9em;
	font-style: normal;
	font-weight: normal;
}

a
{
  color:#CECBC6;
  text-decoration: none;
}

a:hover { color: #000; }

a img { border: none; }

h1 {
	font-family: 'Gill Sans', 'Trebuchet MS', Helvetica, sans-serif;
	text-align: center;
	font-size: 120%;
	font-style: normal;
	font-weight: normal;
	line-height: 120%;
}

div.clearer { clear: both; display: block; margin: 0; padding: 0; height: 0; line-height: 1px; font-size: 1px; }

ul
{
  list-style: none;
  text-align: left;
}

div#pageimmo, div#pageevents, div#pageimmoinfo, div#pageinteriors, div#pagerenovation, div#pagevillas, div#pageabouthistory,
div#pageaboutaanpak, div#pageaboutwerkgebied, div#pageaboutcare, div#pageaboutshowroom, div#pageaboutteam, div#pagecontact_info, div#pagecontact_small, div#pagecontactaddress, div#pagejobs, div#page404, div#pagelegal
{
  padding: 2px 2px 2px 44px;
  margin: 20px auto 12px auto;
  height: 606px;
  width: 914px;
  border-color: #61615F;
  border-width: thin;
  border-style: solid;
}

#logo
{
  margin: 0;
  padding: 0;
}


/* MENUS - MENUS - MENUS - MENUS - MENUS - MENUS - MENUS - MENUS - MENUS - MENUS - MENUS - MENUS */

div#menus
{
  float: left;
  width: 316px;
  margin: 0px 0 2px 0;
}

div#mainmenu
{
  color: #252524;
  float: left;
  width: 100px;
  margin: 36px 0 0 0;
  height: 490px;
}

div#mainmenu2 a
{
}

#mainmenu ul
{
  margin: 0;
  padding: 0;
}

ul#mainmenu1
{
	margin: 40px 0 0 0;
	letter-spacing: 1pt;
	line-height: 34px;
}

ul#mainmenu2
{
  color: #252524;
  text-transform: uppercase;
  font-size: 70%;
  letter-spacing: 2pt;
  line-height: 20px;
  margin: 90px 0 0 0;
}

ul#mainmenu3
{
  text-transform: uppercase;
  font-size: 70%;
  letter-spacing: 2pt;
  line-height: 20px;
  margin: 50px 0 0 0;
}

#ticker
{
  word-wrap:break-word;
  width:100px;
}

ul.newsticker li
{
  letter-spacing: 1pt;
  display: none;
}

ul#mainmenu3 a
{
  color: #AAC05E;
}

ul#mainmenu3 a:hover
{
  color: #000;
}

#mainmenu em
{
  font-style: normal;
  color: white;
}

#mainmenu a:hover
{
  color: #000;
  font-style: normal;
}

div#submenu
{
	color: #252524;
	margin: 0;
	padding: 185px 0 0 0;
	float: right;
	width: 162px;
	height: 419px;
	font-size: 70%;
	text-transform: uppercase;
	background-color: #5C5C5A;
	letter-spacing: 1pt;
	line-height: 21px;
}


div#submenu ul {
  padding: 0 0 0 10px;
  position: relative;
  margin: 0;
}


#lines img
{
  position: relative;
  float: right;
  padding-top: 191px;
}

img#linesvillas, div#submenu ul#villas { top: 0px; }

img#linesinteriors, ul#interiors { top: 34px; }

img#linesrenovation, ul#renovation { top: 68px; }

img#linesimmo, ul#immo { top: 102px; }

img#linesabout, ul#about { top: 237px; }

img#linesevents, ul#events { top: 257px; }

img#linescontact, ul#contact { top: 277px; }

img#linesjobs, ul#jobs { top: 297px; }


/* MAIN CONTENT - MAIN CONTENT - MAIN CONTENT - MAIN CONTENT - MAIN CONTENT - MAIN CONTENT - MAIN CONTENT */

div#content
{
  float: right;
  background-color: #6D6D6A;
  width: 514px;
  height: 558px;
  padding: 46px 42px 0 42px;
}

div#content2, div#contentmessage
{
  float: right;
  background-color: #6D6D6A;
  width: 522px;
  height: 524px;
  padding: 80px 42px 0 34px;
}

div#content2 em {
    font-style: normal;
    font-weight: bold;
}

div#page404 div#content2
{
  height: 584px;
  padding: 20px 42px 0 34px;
}

div#contentleft
{
  margin-top: 9px;
  float: left;
  width: 156px;
  text-align: left;
}

div#contentright
{
  margin-top: 10px;
  float: right;
  width: 355px;
  text-align: left;
  font-size: .9em;
  line-height: 1.1em;
}

div#contentright a { color: #343434; }

div#contentright a:hover { color: #CECBC6; }

div#contentright ul {
margin: -10px 0 0 -10px;
list-style-type: disc;
}

div#contentright ul li {
margin: 0;
}

p#title
{
  text-align: left;
  margin-left: 100px;
  color: #383837;
  letter-spacing: 2px;
}

p#title em
{
  font-style: normal;
  color: #FFF;
}

p#subtitle
{
  margin: 18px 0 20px 0;
  text-transform: uppercase;
  letter-spacing: .1em;
  font-size: 92%;
}



/* VILLAS - VILLAS VILLAS - VILLAS VILLAS - VILLAS VILLAS - VILLAS VILLAS - VILLAS VILLAS - VILLAS - VILLAS - VILLAS */

img#loading
{
height: 515px;
}

div#featuredPhoto {
position: absolute;
top: 68px;
height: 515px;
z-index: 2;
}

div#loadingContainer
{
position: absolute;
top: 68px;
z-index: 1;
}

div#picnav { width: 515px; height: 36px; margin: 0; margin-top: 523px; padding: 0; }

div#picnav ul { margin: 0; padding: 0; }

#picture { margin-bottom: 6px; }

#piclegend { font-size: 70%; }

#picnav img { padding: 0; margin: 0; }

#picnav a { margin: 0; padding: 0; }

div#thumbs { height:28px; width:446px; margin:0; padding:0; float: left; text-align: left; overflow: hidden; }
img#rightnav { float: right; }

img#leftnav { float: left; margin-right: 4px; }

.grande ul { margin:0; padding:0; list-style-type:none; display:inline; /*border: 1px solid blue;*/}

.grande li { margin:0 0 0 2px; padding:0; display:inline;}

.peque li  { padding-left:7px;margin: 0 0 0 -4px;}

.small-thumb{ border:1px solid #434343; z-index:0;height:12px; width:12px; margin: 0 0 7px 0; cursor:pointer;}

.big-thumb{ height:26px; width:26px; margin:0; border:1px solid #434343; z-index:5; cursor:pointer;}

.project { border:1px solid #434343; }

.photo img:hover { height:26px; width:26px; }


/* EVENTS - EVENTS - EVENTS - EVENTS - EVENTS - EVENTS - EVENTS - EVENTS - EVENTS - EVENTS - EVENTS - EVENTS */

#pageevents div#contentleft { margin-top: 62px; }

#pageevents div#contentright { margin-top: 42px; }

#eventimg {	border: #4F4F4F 4px solid; }


/* IMMO IMMO IMMO IMMO IMMO IMMO IMMO IMMO IMMO IMMO IMMO IMMO IMMO IMMO IMMO IMMO IMMO IMMO IMMO IMMO */

div#immothumb1, div#immothumb2, div#immothumb3, div#immothumb4 { width: 45px; height: 45px; overflow: hidden; margin-left:0px; border: #4F4F4F 4px solid; }

div#immothumb1, div#immothumb3 { margin: 0 11px 10px 0; }

div#immothumb2, div#immothumb4 { margin: -63px 0 10px 78px; }

#immobanner { border: #4F4F4F 4px solid; }

div#downloads { margin: 44px 0 0 0; font-size: 70%; text-transform: uppercase; letter-spacing: .1em; line-height: 22px; }

div#downloads a { color:#CECBC6; text-decoration: none; }

div#downloads a:hover { color:#000; text-decoration: none; }

div#downloads img { float: left; margin-right: 5px; }


/* para poner los thumbs en medio para empezar */

div#immothumb1 img { margin-left: -60px; }

div#immothumb2 img { margin-left: -60px; }

div#immothumb3 img { margin-left: -60px; }

div#immothumb4 img { margin-left: -60px; }

p.lowerimmothumbs { margin-top: 28px; }


/* CONTACT - CONTACT - CONTACT - CONTACT - CONTACT - CONTACT - CONTACT - CONTACT - CONTACT - CONTACT - CONTACT */

#pagecontact_info div#contentleft, #pagecontact_small div#contentleft { width: 240px; margin: 0; }

#pagecontact_info div#contentright, #pagecontact_small div#contentright { width: 240px; font-size: 100%; margin: 0 34px 0 0; letter-spacing: 0; }

#pagecontact_info div#contentleftmessage, #pagecontact_small div#contentleftmessage { margin-top: 9px; float: left; width: 156px; text-align: left; }

#w_info div#contentrightmessage, #pagecontact_small div#contentrightmessage { margin-top: 10px; float: right; width: 355px; text-align: left; font-size: 90%; }

/* ABOUT US - ABOUT US - ABOUT US - ABOUT US - ABOUT US - ABOUT US - ABOUT US - ABOUT US - ABOUT US */

div#pageaboutshowroom div#content2 { padding: 44px 38px 36px 38px; }

div#pageaboutteam div#content2 { height: 584px; padding: 20px 42px 0 34px; }

#pageabouthistory div#contentleft { margin-top: 62px; }

#fototeam {	border: #5C5C5A 4px solid; }


div#pageaboutteam p#subtitle { margin: 0px 0 0px 0; }

#historyimg, #aboutcareimg { border: #4F4F4F 4px solid; }

/* LEGAL LEGAL LEGAL LEGAL LEGAL LEGAL LEGAL LEGAL LEGAL LEGAL LEGAL LEGAL LEGAL LEGAL LEGAL LEGAL LEGAL LEGAL*/
div#pagelegal div#content2 { padding-top: 0; padding-right: 12px; height: 604px; width: 552px; }

div#pagelegal div#contentright { width: 560px; height: 580px; font-size: 80%; overflow: scroll; }


/* FOOTER - FOOTER - FOOTER - FOOTER - FOOTER - FOOTER - FOOTER - FOOTER - FOOTER - FOOTER - FOOTER */
div#footer { font-family: Verdana, Helvetica, Arial, sans-serif; clear: both; color: #343434; font-size: 68%; text-align: left; margin: 0 auto; padding-left: 200px; width: 765px; }

#footer a { color: #343434; font-size: 94%; }

#footer a#legal { font-size: 100%; }

#footer a:hover { color: #FFF; }


/* FORMS - FORMS - FORMS - FORMS - FORMS - FORMS - FORMS - FORMS - FORMS - FORMS - FORMS - FORMS - FORMS */

form { color: #C4C4C4; font-family: 'Trebuchet MS', Verdana, Helvetica, sans-serif; font-size: 80%; font-style: normal; min-width: 500px; max-width: 600px; width: 560px; text-align: left; }

form p { margin: 8px 0; display: block; }

form label { display: block; float: left; width: 140px; padding: 0 20px 0 0; margin: 10px 0 0 0; text-align: right; }
/* block float the labels to left column, set a width */
/* set top margin same as form input - textarea etc. elements */

form p.note { font-size: 90%; }

form input, form textarea, form select { width: auto; margin: 2px 0 0 10px; text-align: left; text-indent: .2em; font-size: 98%; }
/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
/* set margin on left of form elements rather than right of label aligns textarea better in IE */
/* set width of form elements to auto-size, otherwise watch for wrap on resize */

form textarea { font-family: 'Trebuchet MS', Verdana, Helvetica, sans-serif; font-size: 80%; }

p#errors { font-size: 90%; text-align: left; color: #fff; margin: 0 0 -40px 0; }

.radio { margin: 0 8px 0 4px; }

textarea { overflow: auto; }

input#name, input#realestatewhere, input#oppervlakte, input#zoekbouwgrond,
input#bezitbouwgrond, input#zoekbouwgrond, input#bezittenwoning, input#specifier, input#beroepsactiviteit,
input#kranten, input#tijdschrift, input#hobby, input#auto, input#specifieer { width: 230px; }

div#buttonsend { color: #C4C4C4; font-family: 'Trebuchet MS', Verdana, Helvetica, sans-serif; font-size: 84%; letter-spacing: 3px; text-align: center; background-color: #444443; border: none; width: 115px; height: 12px; padding: 7px 0 7px 0; margin: 20px 0 0 170px; line-height: 12px; }

div#buttonsend a { color: #CECBC6; line-height: 12px; text-decoration: none; }

div#buttonsend a:hover { color: #000; }


/* form field specific */

input#street { width: 185px; }

input#pc { width: 40px; }

/* form form form form form form form form form form contactinfo = contact_small specific */

form#contactinfo { margin: 70px 0 0 0; }

form#contactinfo label { width: 230px; padding: 0; margin: 0; text-align: left; } /* set top margin same as form input - textarea etc. elements */

form#contactinfo input, form#contactinfo select, form#contactinfo textarea {  margin-left: 0; }

form#contactinfo select { margin: 3px 0 0px 0; }

form#contactinfo #buttonsend { margin: 20px 0 0 0; }

form#contactinfo input#city { width: 185px; margin: 0 0 0 -4px; }

form#contactinfo textarea#notes { height: 80px; width: 230px;  font-size: 100%; }

/* form form form form form form form form form form immo_info specifics */

form#frm-moreinfo { margin: 50px 0 0 0; }

form#frm-moreinfo label { margin: 5px 0 0 0; }

form#frm-moreinfo label#moreinfowhatlabel { margin-left: 170px; width: 300px; text-align: left; }

form#frm-moreinfo select#moreinfowhat { min-width: 200px; }

#frm-moreinfo input#number, #contactinfo input#number { width: 40px; margin-left: -4px; }

#frm-moreinfo input#city, #contactinfo input#city { width: 185px; margin: 0 0 0 -4px; }

#frm-moreinfo input#tel, #contactinfo input#tel { width: 112px; }

#frm-moreinfo input#mail, #contactinfo input#mail { width: 113px; margin: 0 0 0 -4px; }

#frm-moreinfo input#moreinfo, #frm-moreinfo input#realestate, #frm-moreinfo select#moreinfowhat, #frm-moreinfo input#realestatewhere, #frm-moreinfo textarea#notes { margin-left: 170px; }

#frm-moreinfo textarea#notes { height: 80px; }

#frm-moreinfo p#noteslabel { margin: 10px 0 0 170px; }