/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Algemene stylesheet CSS voor Amsterdam Autrement, october 2009 © Stylesheet by Mosselman multimedia 1. Basis layout omvat : algemene styles, layout: header , 2 col pagina opbouw , footer(optioneel) , content , tools , navigatie, eyecather 2. Elementen styles : H, p, ul/li, ahref, class, other :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */ /* +---------------- GENERAL STYLES ------*/ /* ------------------- GENERALL styles ---------------*/ img { display: block; border-width: 0px; } html,body { margin:0; padding:0; height:100%; /* needed for container min-height */ } body { height:100%; /* needed for container min-height */ font-family: Arial, Helvetica; color:#000000; background-color: #fff; background: url(../images/footsteps-bg.gif) no-repeat right top; } /* ------------------- DIV LAYOUT -----------------------*/ div#container { position:relative; /* needed for footer positioning*/ z-index: 1; margin: 0 auto; width: 960px; height: auto !important; height: 100%; min-height:100%; background: url(../images/border-right.gif) repeat-y right top; } div#header { width: 960px; height: 247px; padding: 0em 0em 0em 0em; margin: 0px 0px 0px 0px ; background: url(../images/header-bg.gif) no-repeat left top; } div#header-top { float: left; position:relative; width: 395px; height: 52px; margin-top: 72px; padding: 0px 0px 0px 0px; background-color: #0abdaa; border-top: #3f0093 solid 8px; z-index: 2; } div#header-img { position: absolute; width: 857px; height: 217px; left:16px; top: 25px; padding: 0px 0px 0px 0px; margin: 0px; } div#logo { float: left; position:relative; width: 36px; height: 37px; padding: 7px 0px 0px 0px; margin: 0px 0px 0px 16px; border-bottom: #3f0093 solid 8px; z-index: 3; } div#beeldmerk { float: left; position:relative; width: 335px; height: 44px; margin: 0px; padding: 0px 0px 0px 0px; border-right: #3f0093 solid 8px; border-bottom: #3f0093 solid 8px; text-align:right; z-index: 3; } div#nav { position: relative; width: 934px; height: 29px; padding: 7px 0px 0px 26px; margin: 0px ; background: url(../images/nav-bg.gif) repeat-y left top; z-index: 15; } div#content { position: relative; width: 939px; margin: 0px; min-height: 500px; padding: 50px 0px 0px 0px; background: url(../images/content-bg.gif) no-repeat left top; z-index: 4; } div#contenttext { position: relative; width: 525px; min-height: 400px; padding: 0px 85px 150px 0px; margin: 10px 0px 0px 0px; background: url(../images/content-text.gif) no-repeat left top; z-index: 4; } div#mapp-div { padding: 20px 0px 0px 35px;} div#content-eyecatch { position: absolute; top: 82px; right: 0px; width: 302px; padding: 0px; margin: 0px 0px 0px 0px; background: url(../images/footsteps.gif) no-repeat right bottom; } div#lots { width: 302px; padding: 0px; margin: 0px; } div#prog { position: relative; width: 215px; min-height: 50px; padding: 0px 0px 10px 25px; margin: 25px 0px 0px 0px; background: url(../images/prog-bg.gif) repeat-y left top; } div#contact { position: relative; width: 215px; min-height: 150px; padding: 0px 0px 10px 25px; margin: 0px 0px 0px 0px; background: url(../images/contact-bg.gif) no-repeat left top; } div#contact-noprog { position: relative; width: 215px; min-height: 150px; padding: 0px 0px 0px 25px; margin: 25px 0px 0px 0px; background: url(../images/contact-bg.gif) no-repeat left top; } div#middle { position: relative; width: 215px; height: 20px; padding: 0px 0px 0px 25px; margin: 0px 0px 0px 0px; background: url(../images/prog-bg.gif) repeat-y left top; } div#footer { position: absolute; width: 960px; /* must be 100%, otherwise IE Footer sroll isn't working! */ bottom:0; /* stick to bottom */ padding: 10px 0px 0px 0px; margin: 0px; background: #fff url(../images/footer-bg.gif) no-repeat left top; z-index: 5; } /* ------------------- CONTENT STYLES -----------------------*/ /* ------------------- H styles -----------------------*/ /* h1 */ #beeldmerk h1 { text-transform: none; font-weight: bold; color: #fff; font-size: 1.45em; line-height: 0.9em; letter-spacing: 3px; padding: 0px 15px 0px 0px; margin: 7px 0px 0px 0px; } #contenttext h1 { width: 250px; padding: 0px 0px 0px 20px; margin: 0px 0px 0px 16px; text-transform: none; color: #fff; background-color: #330099; font-size: 1.2em; font-weight: 400; } /* h2 */ #beeldmerk h2 { text-transform: none; font-weight: bold; color: #330099; font-size: 1.0em; line-height: 0.9em; padding: 0px 17px 0px 0px; margin: 0px; } #contenttext h2 { width: 250px; padding: 0px 0px 0px 20px; margin: 0px; text-transform: none; color: #fff; background-color: #0149d4; font-size: 1.2em; font-weight: 400; } #news h2 { height: 18px; width: 285px; padding: 0px 0px 0px 5px; margin: 0px; text-transform: none; color: #fff; background-color: #0149d4; font-size: 0.9em; font-weight: 400; text-transform:uppercase; } #lots h2 { float: left; position: relative; height: 27px; width: 193px; padding: 3px 0px 0px 5px; margin: 0px; color: #fff; background-color: #0149d4; font-size: 0.8em; font-weight: 400; text-transform:uppercase; z-index: 2; } /* h3 */ #lots h3 { position: absolute; text-align:right; right: 17px; height: 18px; width: 88px; padding: 0px 3px 0px 5px; margin: 0px; color: #fff; background-color: #0abdaa; font-size: 0.7em; font-weight: 400; text-transform:uppercase; z-index: 3; } /* ------------------- P styles ---------------------*/ p { margin: 0 0 0.5em; } div#contenttext p { padding: 10px 0px 0px 20px; margin: 0px 0px 0px 16px; font-size: 1.0em; line-height: 1.3em; font-size: 0.85em; } div#lots p { padding: 5px 0px 0px 5px; margin: 0px; font-size: 1.0em; line-height: 1.3em; font-size: 0.85em;} div#news p { padding: 5px 0px 0px 5px; background-color: #ebebeb; margin: 7px 0px 5px 27px; width: 398px; font-size: 0.85em; } div#footer p { margin:0px; padding: 5px 0px 5px 20px; color: #000; font-size: 0.6em; clear: both; } #news p { padding: 0px 0px 0px 35px; } /* ------------------- UL/LI styles -----------------*/ /* ul */ #menu, #menu ul { margin:0; padding:0; list-style-type:none; list-style-position:outside; position:relative; line-height:1.5em; z-index: 18; } #menu ul { position:absolute; display:none; xwidth:12em; top:1.5em;z-index: 18;} #menu ul ul { top:auto; z-index:25; } #menu li:hover ul { display:block; } #menu li.current_page_item ul { display:block; } #menu li.current_page_parent ul { display:block; } /* general */ #footer ul { padding: 5px 5px 10px 20px; margin: 0px 0px 0px 0px; text-align:left; } /* li */ #menu li { float:left; position:relative; margin: 0px; padding: 0px 10px 0px 0px; } #menu li li { list-style: none; margin: 0px; padding: 0px 0px 0px 0px; } #contenttext li { font-size: 0.85em; } #footer li { float: left; padding: 0px; margin: 0px; list-style: none; padding: 0px 0px 0px 0px; } /* ------------------- A HREF styles -----------------------*/ /* general */ a img { border:none; outline:none; } a { padding: 0px; margin: 0px; color: #0abdaa; text-decoration: underline; font-weight: 400;} a:hover { padding: 0px; margin: 0px; color: #fff; background-color: #0abdaa;} /* ------------------- navigation -----------------------*/ /* +---------------- navigatie links, 1e niveau ------*/ #menu li a:link, #menu li a:visited { display:block; padding: 2px 10px 2px 10px; text-decoration:none; font-size: 0.9em; color:#330099; font-weight:600; text-transform:uppercase; } #menu li a:hover { padding: 2px 10px 2px 10px; text-decoration:none; font-size: 0.9em; font-weight:600; background-color: #330099; color:#FFFFFF; } #menu li.current_page_item a:link, #menu li.current_page_item a:visited { padding: 2px 10px 2px 10px; text-decoration:none; font-size: 0.9em; color:#fff; font-weight:600; background-color: #330099; } #menu li.current_page_parent a:link, #menu li.current_page_parent a:visited { padding: 2px 10px 2px 10px; text-decoration:none; font-size: 0.9em; color:#fff; font-weight:600; background-color: #330099;} /* +---------------- navigatie links, 2de niveau ------*/ #menu li li a:link, #menu li li a:visited { display: block; width: 100%; text-decoration:none; font-size:0.7em; color:#fff; font-weight: 200; background-color: #0149d4; } #menu li li a:hover { text-decoration:none; font-size:0.7em; color:#fff; font-weight:200; display: block; background-color: #330099; } #menu li.current_page_item li a:link, #menu li.current_page_item li a:visited { text-decoration:none; font-size:0.7em; color:#fff; font-weight:200; display: block; background-color: #0149d4;} #menu li.current_page_item li a:hover { text-decoration:none; font-size:0.7em; color:#fff; background-color: #330099; } #menu li.current_page_parent li.current_page_item a:link, #menu li.current_page_parent li.current_page_item a:visited { text-decoration:none; font-size:0.7em; color:#fff; font-weight:200; display: block; background-color: #330099; } #menu li.current_page_parent li.current_page_item a:hover { text-decoration:none; font-size:0.7em;; color:#fff; background-color: #330099; } #menu li.current_page_parent li a:link, #menu li.current_page_parent li a:visited { text-decoration:none; font-size:0.7em; color:#fff; font-weight:200; display: block; background:none; background-color: #0149d4; } #menu li.current_page_parent li a:hover { text-decoration:none; font-size:0.7em;; color:#fff; background-color:#330099; } #contenttext a:link, #contenttext a:visited { color: #0abdaa; text-decoration: underline; } #contenttext a:hover { color: #fff; text-decoration: underline; background: #0abdaa; } #footer a:link, #footer a:visited { color: #0abdaa; text-decoration: underline; font-size: 0.9em; padding-right: 10px; margin: 0px; } #footer a:hover { color: #fff; text-decoration: underline; background: #0abdaa; } /* ------------------- Class styles -----------------------*/ /* layout classes */ .mapp-poweredby { display: none;} /* style classes */ .kopje { font-weight: bold; color: #ce000c; } .kopjehome { font-weight: bold; color: #ce000c; } .right { float: right; padding: 0px 20px 0px 0px; margin: -20px 0px 0px 0px; font-size: 1.5em; } /* images classes */ /* link classes */ /* form classes */ /* ------------------- IMAGE STYLES -----------------------*/ .img_content { float: right; width: 150px; margin: 5px 10px 15px 0px; border: 1px solid #000; } /* ------------------- Form styles -----------------------*/ /* ------------------- OTHER styles -----------------------*/