/* RESET */ * { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; } ol, ul { list-style: none; } blockquote, q { quotes: none; } :focus { outline: 0; } table { border-collapse: collapse; border-spacing: 0;} img { vertical-align: bottom } /* DEFAULTS */ body { font-family: Georgia, "Times New Roman", Times, serif; font-size:12px; line-height:20px; color:#8f8f8f; background:url('images/bg.gif') repeat-x #e6f1ff; } a { color:#8f8f8f; text-decoration:underline; } a:hover { text-decoration:underline; } input { font-family: Georgia, "Times New Roman", Times, serif; font-size:12px; color:#343434; } p { padding:7px 0; } h1 { } h2 { color:#363064; font-size:20px; font-weight:normal; } h2 a { color:#363064; text-decoration:none; } h1.label ,h2.label { background-image:url('images/labels.png'); background-repeat:no-repeat; float:left; margin: 10px 0 0 10px; display:block; height:30px; text-indent:-9999px; } a { } hr { display:none; } #logo { display:block; width:170px; height:150px; background:url('images/sprites_heuvel.png') no-repeat 0 0; text-indent:-9999px; position:absolute; top:0; left:0px; } .left { float:left; width:612px; margin-left:18px; } .center { width:960px; margin:0 auto; position:relative; background:#fff; } .clear { clear:both;} .hidden { display:none;} .noborder { border:none !important; } .right { float:right; width:302px; margin-right:18px; } .spacer { clear:both; height:20px; } .spacer15 { clear:both; height:15px; } .rel { position:relative; } .button { background-image:url('images/sprites_heuvel.png'); background-repeat:no-repeat; text-indent:-9999px; display:block; } .text a { color:#df8d2f; text-decoration:none; } .textonly a { color:#df8d2f; text-decoration:none; } /* MENU */ #menu { width:790px; height:58px; position:absolute; top:0; left:170px; } #menu li { float:left; height:58px; } #menu a { float:left; display:block;height:58px; background-image:url('images/sprites_heuvel.png'); background-repeat:no-repeat; text-indent:-9999px; } #menu a.act { } #m_home { width:85px; } #m_home a { width:85px; background-position:-170px 0; } #m_home a:hover { width:85px; background-position:-170px -61px; } #m_home a.act { width:85px; background-position:-170px -122px; } #m_activities { width:120px; } #m_activities a { width:120px; background-position:-250px 0; } #m_activities a:hover { width:120px; background-position:-250px -61px; } #m_activities a.act { width:120px; background-position:-250px -122px; } #m_organisation { width:120px; } #m_organisation a { width:120px; background-position:-372px 0; } #m_organisation a:hover { width:120px; background-position:-372px -61px; } #m_organisation a.act { width:120px; background-position:-372px -122px; } #m_press { width:60px; } #m_press a { width:60px; background-position:-492px 0; } #m_press a:hover { width:60px; background-position:-492px -61px; } #m_press a.act { width:60px; background-position:-492px -122px; } #m_sponsors { width:190px; } #m_sponsors a { width:190px; background-position:-552px 0; } #m_sponsors a:hover { width:190px; background-position:-552px -61px; } #m_sponsors a.act { width:190px; background-position:-552px -122px; } #m_donate { width:100px; } #m_donate a { width:100px; background-position:-745px 0; } #m_donate a:hover { width:100px; background-position:-745px -61px; } #m_donate a.act { width:100px; background-position:-745px -122px; } #m_contact { width:115px; } #m_contact a { width:115px; background-position:-845px 0; } #m_contact a:hover { width:115px; background-position:-845px -61px; } #m_contact a.act { width:115px; background-position:-845px -122px; } /* HEADER */ #header { width:960px; height:380px; background-repeat:no-repeat; } .slogan { float:left; width:880px; height:100px; background:url('images/sprites_heuvel.png') no-repeat -10px -200px; margin:260px 0 0 10px; color:#ffffff; font-size:20px; line-height:30px; padding:20px 40px 0 20px; font-weight:bold; } /* FOOTER */ #footer { clear:both; width:960px; border-top:1px solid #e5e5e5; height:100px; } #footer a { text-decoration:none; color:#8f8f8f; } #footer a:hover { color:#df8d2f; text-decoration:none; } #footer ul { float:right; margin:20px 20px 8px 0px; } #footer li { float:left; border-right:1px solid #adadad; padding:0 5px 0 5px; } #footer .footer_right { float:right; width:390px;} #footer .social_media a { margin-left:5px; float:left;} #culture { background:url('images/sprites_heuvel.png') no-repeat 0 -350px; width:130px; margin:20px 0 0 30px; height:52px; float:left; display:block; text-indent:-9999px; } #utrechtse-heuvelrug { background:url('images/sprites_heuvel.png') no-repeat -158px -350px; width:195px; height:52px; float:left; display:block; text-indent:-9999px; margin:20px 0 0 30px; } /* Social media */ .facebook { background:url('images/sprites_heuvel.png') no-repeat -750px -350px; height:20px; width:20px; text-indent:-9999px; display:block;} .twitter { background:url('images/sprites_heuvel.png') no-repeat -725px -350px; height:20px; width:20px; text-indent:-9999px; display:block;} .hyves { background:url('images/sprites_heuvel.png') no-repeat -775px -350px; height:20px; width:20px; text-indent:-9999px; display:block;} .linkedin { background:url('images/sprites_heuvel.png') no-repeat -700px -350px; height:20px; width:20px; text-indent:-9999px; display:block;} .facebook_contact { background:url('images/sprites_heuvel.png') no-repeat -820px -371px; height:20px; width:20px; display:block; margin-bottom:20px; padding-left:30px; color:#DF8D2F; text-decoration:none; margin-top:10px; } .twitter_contact { background:url('images/sprites_heuvel.png') no-repeat -755px -371px; height:20px; width:20px; display:block; margin-bottom:20px; padding-left:30px; color:#DF8D2F; text-decoration:none;} .hyves_contact { background:url('images/sprites_heuvel.png') no-repeat -875px -371px; height:20px; width:20px; display:block; margin-bottom:20px; padding-left:30px; color:#DF8D2F; text-decoration:none;} .linkedin_contact { background:url('images/sprites_heuvel.png') no-repeat -700px -371px; height:20px; width:20px; display:block; margin-bottom:20px; padding-left:30px; color:#DF8D2F; text-decoration:none;} /* SIDEBAR */ /* nieuws */ .newssmall { float:right; width:300px; height:290px; border:1px solid #e1e1e1; margin:20px 0 0 0; } .newssmall .button { background-position:0 -160px; width:65px; height:30px; float:left; margin:10px 0 0 10px; } .newssmall .button:hover{ background-position:-75px -160px;} .newssmall ul { width:300px; float:left; border-top:1px solid #e1e1e1; margin-top:10px; } .newssmall li { float:left; width:300px; border-top:1px dotted #e1e1e1; margin-top:10px; height:69px; } .newssmall li.first { margin:0; border:none; } .newssmall .thumb { float:left; margin:10px 0 0 10px; width:60px; } .newssmall .label { width:205px; background-position:0 -60px; } .newssmall .link { float:left; width:210px; margin:10px 0 0 10px; } .newssmall a { text-decoration:none; } .newssmall a:hover { color:#df8d2f; } /* nieuwsbrief */ .newsletter { float:right; width:300px; height:150px; border:1px solid #e1e1e1; margin:10px 0 0 0; } .newsletter .label { width:280px; background-position:-205px -60px; } .newsletter .content { width:260px; float:left; border-top:1px solid #e1e1e1; padding:3px 20px 0 20px; margin-top:10px; } .newsletter .input { float:left; width:180px; margin-top:5px; } .newsletter .input input { font-style:italic; width:165px; height:30px; line-height:30px;background:url('images/sprites_heuvel.png') no-repeat 0 -410px; padding-left:5px; } .newsletter .input input.act { font-style:normal; } .newsletter .submit { float:left; width:80px; margin-top:5px; } .newsletter .submit input { float:left; width:80px; height:30px; background:url('images/sprites_heuvel.png') no-repeat -180px -410px; text-indent:-9999px; cursor:pointer; } .newsletter .submit input.hover { background-position:-180px -440px;} .newsletter input.error { background:url('images/sprites_heuvel.png') no-repeat -600px -480px !important; } .newsletter input.correct { background:url('images/sprites_heuvel.png') no-repeat -600px -510px !important; } /* flyer */ .flyer { float:right; width:290px; height:400px; border:1px solid #e1e1e1; margin:20px 0 0 0; padding:10px 0 0 10px; } /* HOME */ /* aankomende evententen */ .upcoming { float:left; width:610px; height:290px; border-top:1px solid #e1e1e1; border-right:1px solid #e1e1e1; border-left:1px solid #e1e1e1; margin:20px 0 0 0; } .home .upcoming { border-bottom:1px solid #e1e1e1 } .upcoming .button { background-position:0 -160px; width:65px; height:30px; float:left; margin:10px 0 0 10px; } .upcoming .button:hover { background-position:-75px -160px;} .upcoming .content { width:590px; float:left; padding:10px 10px 0 10px; } .upcoming .label { width:515px; background-position:0 -330px; } .upcoming .thumb { float:left; width:280px; } .upcoming .text { float:right; width:280px; } .upcoming .tags { font-size:14px; line-height:20px; color:#363064; font-weight:normal; margin-top:10px; } .upcoming .date { position:absolute; width:69px; height:57px; top:0px; right:0; text-align:right; color:#df8d2f; font-weight:bold; background:url('images/sprites_heuvel.png') no-repeat -400px -350px; } .upcoming .dayname { font-size:20px; line-height:24px; } .upcoming .day { font-size:14px; line-height:18px; } .upcoming .text a { color:#8f8f8f; } .upcoming .text a:hover { color:#df8d2f} .upcoming .text h3 { font-size:20px; line-height:26px; color:#363064; font-weight:normal; } .upcoming .text h3 a { color:#363064; text-decoration:none; } .upcoming .text h3 a:hover {color:#363064; text-decoration:underline; } /* media */ .media { float:left; width:610px; height:150px; border:1px solid #e1e1e1; margin:10px 0 0 0; } .media .button { background-position:0 -160px; width:65px; height:30px; float:left; margin:10px 0 0 10px; } .media .button:hover { background-position:-75px -160px; } .media .content { width:604px; float:left; border-top:1px solid #e1e1e1; padding:14px 0 0 6px; margin-top:10px; } .media ul { width:604px;float:left; } .media li { float:left; width:75px; background-repeat:no-repeat; background-position:5px 5px; } /* foto's */ .photos .label { width:292px; background-position:0 -30px; } .content .photos { width:375px; float:left; } /* videos */ .videos .label { width:141px; background-position:0 -420px; } .content .videos { width:200px; float:left; height:20px; } .youtubeVideo { padding-top:35px; } /* videos gallerij */ .videocontent { text-align:center; height:391px;} /* NIEUWS */ .news { float:left; width:610px; height:571px; border:1px solid #e1e1e1; margin:20px 0 0 0; } .news.newsdetails { height:auto; } .news h1 { color:#363064; font-size:20px; } .news ul { width:610px; float:left; border-top:1px solid #e1e1e1; margin-top:10px; } .news li { float:left; width:610px; background:url('images/dotted-line.gif') top repeat-x; padding-top:8px; height:150px; } .news li p { padding:0; } .news li:first-child { background:none;} .news .label { width:590px; background-position:0 -90px; } .news .thumb { float:left; margin:10px 0 0 10px; width:100px; background-repeat:no-repeat;background-position:5px 5px; } .news .text { float:left; width:480px; margin:5px 0 0 0; } .news .text a { text-decoration:none; color:#8F8F8F; } .news .text a:hover { text-decoration:none; color:#df8d2f; } .news .textonly a { text-decoration:none; color:#8F8F8F; } .news .textonly a:hover { text-decoration:none; color:#df8d2f; } .news .text h2 a { color:#363064; text-decoration:none; } .news .text h2 a:hover { color:#363064; text-decoration:underline;} .news .textonly h2 a { color:#363064; text-decoration:none; } .news .textonly h2 a:hover { color:#363064; text-decoration:underline; } .news .paging { width:590px; margin:0px; padding:4px 10px 4px 10px;} .newsdetails .content { margin:10px 0 10px 0; float:left;} .defaultpage.news { height:auto;} .defaultpage.news .label { background-position:0 -90px; width:590px; } /* ACTIVITEITEN OVERZICHT */ .upcoming.overview .label { background-position:0 -330px; width:590px;} .upcoming.overview { height:auto;} .upcoming.overview .text { float:left; width:570px; padding:10px 10px 0 10px;} .options { width:580px; float:left; background:url('images/dotted-line.gif') repeat-x top; padding:10px 10px 10px 20px; margin-top:10px; border-bottom:1px solid #e1e1e1; } .options .tags { float:left; width:390px; margin-top:5px; } .options .button { float:right; margin-top:0px; } /* ACTIVITEITEN DETAIL */ .upcoming.detail .label { background-position:0 -120px; width:590px;} .upcoming.detail { height:auto;} .upcoming.detail .text { float:left; width:570px; padding:10px 10px 0 10px;} .tabs { clear:both; float:left; width:610px; background:url('images/bg_tab.gif') repeat-x bottom; margin:10px 0 0 0;} .tabs .item { float:left; border-bottom:1px solid #e2e2e2; line-height:29px; margin-left:10px;} .tabs .item:first-child { padding-left:19px; margin-left:0px; } .tabs .item .lc { display:block; background:url('images/sprites_heuvel.png') 0 -450px; float:left; width:3px; height:29px;} .tabs .item .name { display:block; float:left; width:144px; line-height:28px; border-top:1px solid #e2e2e2; text-decoration:none; font-weight:bold; text-indent:-9999px;} .tabs .item .rc { display:block; background:url('images/sprites_heuvel.png') -3px -450px; float:left; width:3px; height:29px;} .tabs .item.active { border-bottom:1px solid #fff; } .tabs .item.active:first-child { margin-left:19px; padding-left:0px; } .tabs .name.about { background:url('images/tab_over.gif') top;} .tabs .name.program { background:url('images/tab_programma.gif') top;} .tabs .name:hover { background-position: bottom;} .tabs .item.active .name { color:#df8d2f; background-position: bottom;} .content.withtab { margin-top:0px; border-top:0px; } .content.withtab .text { padding:0 0 0 10px; } .content.withtab .options { margin:18px 0 0 -10px;} .listing { margin:0 0 0 10px; } .listing .line { clear:both; float:left; width:570px; background:url('images/dotted-line.gif') repeat-x; height:2px; margin-top:20px;} .listing h3.title { float:left; width:390px;} .downloadbook { display:block; float:right; background:url('images/sprites_heuvel.png') -470px -410px; width:190px; height:30px; text-indent:-9999px;} .downloadbook:hover { background-position:-470px -440px; } .listing .item { clear:both; float:left; width:570px; background:url('images/dotted-line.gif') repeat-x bottom; padding:20px 0;} .listing .item .time { display:block; color:#cf3d44; font-size:14px; font-weight:bold;} .listing .item .title { display:block; background:url('images/arrowdown.gif') no-repeat top right; color:#363064; font-size:14px; padding-right:25px; text-decoration:none; font-weight:normal;} .listing .item .thumb { float:left; margin:10px 0 0 0; width:100px; background-repeat:no-repeat; background-position:5px 5px; } .listing .item .details { display:none;} .listing .item .details p { padding:0;} .listing .item .desc { float:left; margin-top:10px; width:450px; padding-right:20px; cursor:pointer; } .listing .item .desconly { float:left; margin-top:10px; width:570px; padding-right:20px; cursor:pointer; } .listing .item.active .title { background:none;} .listing .item.active .details { background:url('images/arrowup.gif') no-repeat bottom right;} /* DISCLAIMER */ .defaultpage { float:left; width:610px; border:1px solid #e1e1e1; margin:20px 0 0 0; } .defaultpage h3 { font-size:20px; line-height:26px; color:#363064; font-weight:normal; margin-top:10px; } .defaultpage h3:first-child { margin:0px;} .defaultpage .content { width:590px; float:left; border-top:1px solid #e1e1e1; padding:10px 10px 0 10px; margin-top:10px; } .defaultpage .label { width:590px; background-position:0 0; } .defaultpage .thumb { float:left; margin:10px 0 0 0; width:100px; background-repeat:no-repeat;background-position:5px 5px; } .defaultpage .text { float:left; width:470px; padding:0 0 11px 0; } .defaultpage.organisation .label { background-position:0px -150px; } .defaultpage.disclaimer .label { background-position:0px -300px; } .defaultpage.error404 .label { background-position:0px -390px; } .defaultpage.contact .label { background-position:0px -240px; } .defaultpage.newsletterpage .label { background-position:0px -360px; } .defaultpage.donate .label { background-position:0px -450px; } .defaultpage.contact .content { padding:10px 20px 0; width:570px;} .defaultpage.contact .phone { color:#df8d2f; display:block; background:url('images/icons.png') no-repeat top left; padding-left:30px; line-height:42px; margin-top:10px;} .defaultpage.contact .mail { color:#df8d2f; display:block; background:url('images/icons.png') no-repeat bottom left; padding-left:30px; line-height:42px; margin-top:0px;} .defaultpage.contact .mail a { color:#df8d2f; text-decoration:none; } .textonly { margin-left:10px; float:left; width:570px; } /* GALERIJ */ .defaultpage.gallery .label { background-position:0px -270px;} .defaultpage.gallery .content { padding:5px; width:600px;} .scroller { position:relative; width:600px; height:410px;} .scroller .ts { background:url('images/overlay_gallery_top.gif'); width:600px; height:8px;} .scroller .ls { float:left; background:url('images/overlay_gallery_left.gif'); width:8px; height:394px;} .scroller .rs { float:left; background:url('images/overlay_gallery_right.gif'); width:8px; height:394px;} .scroller .bs { background:url('images/overlay_gallery_bottom.gif'); width:600px; height:8px; clear:both;} .scroller .display { float:left; width:584px;} .gallery .overlay li { text-align:center; } .gallery .overlay { position:relative;} .gallery .overlay .nav { position:absolute; left:8px; bottom:8px; width:584px; height:42px; } .gallery .overlay .nav_video { margin-left:8px; bottom:8px; width:584px; height:42px; } .gallery .overlay .title { display:block; float:left; background:url('images/sprites_heuvel.png') -8px -505px; width:544px; padding:0 20px; line-height:42px; color:#fff; font-size:14px;} .gallery .space { float:left; width:38px; height:75px;} .gallery .thumbs { position:relative; float:left; width:525px; overflow:hidden; height:75px; background:#ffffff; margin:16px 0 0 0; padding-bottom:10px; } .gallery .thumbs .items { list-style:none outside; width:20000em; position:absolute; } .gallery .thumbs .items li { float:left; position:relative; background:no-repeat center; display:inline;} .gallery .thumbs_video { position:relative; float:left; width:525px; overflow:hidden; height:75px; background:#ffffff; margin:7px 0 0 0; } .gallery .thumbs_video .items { list-style:none outside; width:20000em; position:absolute; } .gallery .thumbs_video .items li { float:left; position:relative; background:no-repeat center; display:inline; padding-left:3px; } .gallery .prevPage { display:block; position:absolute; top:0px; left:5px; width:20px; height:75px; background:url('images/overlay_left.png') top no-repeat; text-indent:-9999px; margin-top:16px; cursor:pointer;} .gallery .prevPage:hover { background-position:bottom;} .gallery .nextPage { display:block; position:absolute; top:0px; right:5px; width:20px; height:75px; background:url('images/overlay_right.png') top no-repeat; text-indent:-9999px; margin-top:16px; cursor:pointer} .gallery .nextPage:hover { background-position:bottom;} /* SPONSORS / PERS */ .sponsors { float:left; width:610px; border:1px solid #e1e1e1; margin:20px 0 0 0; } .sponsors ul { width:610px; float:left; border-top:1px solid #e1e1e1; margin-top:10px; } .sponsors li { float:left; width:610px; background:url('images/dotted-line.gif') top repeat-x; padding:10px 0px 14px 0px; } .sponsors li:first-child { background:none;} .sponsors .label { width:590px; background-position:0 -210px; } .sponsors .thumbs { float:left; width:100px; } .sponsors .thumb { float:left; margin:5px 0 0 10px; width:100px; background-repeat:no-repeat;background-position:5px 5px; } .sponsors .thumb:first-child{ margin-top:10px;} .sponsors .text { float:left; width:470px; margin:5px 0 0 0; } .sponsors .textonly { float:left; width:570px; margin:5px 0 0 20px; } .sponsors .logos { background:url('images/dotted-line.gif') top repeat-x; width:610px; float:left; margin:5px 0 10px; } .sponsors .logos ul { border:none; margin-left:0;} .sponsors .logos li { width:115px; background:none; padding:0; margin:5px 0 0 5px; height:115px; float:left; background-repeat:no-repeat; background-position:center; text-indent:-9999px; } a.downloadpers { display:block; background:url('images/sprites_heuvel.png') -670px -410px; width:160px; height:30px; text-indent:-9999px; margin-top:10px;} a.downloadpers:hover { background-position:-670px -440px;} .pers .label { width:590px; background-position:0 -180px; } /* PAGING */ .paging { width:580px; float:left; background:url('images/dotted-line.gif') repeat-x top; padding:10px 10px 10px 20px; margin-top:10px;} .newer a { display:block; float:left; width:80px; height:30px; margin-top:2px; background:url('images/sprites_heuvel.png') no-repeat -270px -440px; text-indent:-9999px; } .newer a:hover { background-position:-270px -470px;} .older a { display:block; float:right; width:100px; height:30px; margin-top:2px; background:url('images/sprites_heuvel.png') no-repeat -360px -440px; text-indent:-9999px; } .older a:hover { background-position:-360px -470px;} .prev.disabled { background-position:-270px -410px;} .next.disabled { background-position:-360px -410px;} /* HIGHSLIDE */ body.highslide { background:#fff; margin:10px; } .highslide-html { background:#fff;} .highslide-html-content { display: none; width: 480px;} .highslide .margin { padding:10px 0 0 0;} .highslide-header { display:none;} .highslide { border:0px; line-height:16px; } .highslide h1 { color:#363064; font-size:12px; float:left; width:215px; height:30px; line-height:30px; font-size:12px; font-weight:normal; text-indent:5px; } .highslide-dimming { background: black; } .highslide .header { background:url('images/sprites_heuvel.png') -478px -350px; width:300px; height:30px;} .highslide .close { display:block; float:left; margin-left:10px; background:url('images/sprites_heuvel.png') -840px -410px; width:65px; height:30px; text-indent:-9999px;} /* 404 */ .errorlist { list-style:disc inside; } /* DONATEURS */ .inputblock { float:left; width:470px; margin-top:5px; } .formlabel { font-weight:bold; float:left; width:470px; margin-top:10px; } .donate .input { float:left; width:290px; } .donate .marker { color:#cc0000; line-height:30px; float:right; width:180px; } .donate #marker_defaultamount { float:left; } .donate #marker_useramount { float:left; } .donate #marker_gender { line-height:20px; float:right; } .donate .input input { width:265px; height:30px; line-height:30px;background:url('images/sprites_heuvel.png') no-repeat -600px -560px; padding-left:5px; } .donate .input input.error { background:url('images/sprites_heuvel.png') no-repeat -600px -590px !important; } .donate .input input.correct { background:url('images/sprites_heuvel.png') no-repeat -600px -620px !important; } .donate .input_sm { float:left; width:120px; } .donate .input_sm input { width:115px; height:30px; line-height:30px;background:url('images/sprites_heuvel.png') no-repeat 0 -560px; padding-left:5px; } .donate .input_sm input.error { background:url('images/sprites_heuvel.png') no-repeat 0 -590px !important; } .donate .input_sm input.correct { background:url('images/sprites_heuvel.png') no-repeat 0 -620px !important; } .donate .submit { float:left; width:80px; margin-top:5px; } .donate .btn_submit { margin-top:15px;display:block; float:left; width:80px; height:30px; background:url('images/sprites_heuvel.png') no-repeat -180px -410px; text-indent:-9999px; cursor:pointer; } .donate .btn_submit:hover { background-position:-180px -440px;} .donate .inputradio { float:left; margin-right:10px; margin-top:3px; } .donate .inputcheck { float:left; width:25px; } .donate .value { float:left; width:445px; } .donate #valid_disclaimer.error { color:#cc0000; }