/*** TITLES ***/ h1 { font-family:'Trebuchet MS',Verdana, Arial, Helvetica, sans-serif; font-size:2.2em; font-weight:normal; text-transform:uppercase; background:url(../images/page/h1-bullet.png) no-repeat top left; padding-left:30px; margin:0 0 20px 0; } h1.red { background: url(../images/page/h1-bullet-red.png) no-repeat top left; } h1.blue { background: url(../images/page/h1-bullet-blue.png) no-repeat top left; } h1.orange { background: url(../images/page/h1-bullet-orange.png) no-repeat top left; } h2 { font-family: 'Trebuchet MS',Verdana, Arial, Helvetica, sans-serif; font-size:1.8em; font-weight:normal; text-transform:uppercase; background: url(../images/page/h2-bullet.png) no-repeat 0px 10px; padding-left:15px; } h2 a, h2 a:visited, h2 a:link { color:#c0c2c3; } h3 { background: url(image/page/bullet.html) no-repeat left ; font-size:1.3em; padding-left:18px; } h4 { font-size:1.4em; margin:0 0 5px 0; padding:0; color:#eee; } h5 { font-size:1.2em; margin:15px 0 5px 0; padding:0; color:#eee; } h6 { font-size:1.6em; margin:0 0 5px 0; padding:0; } /*** CLASSES ***/ .right { float:right; } .clear { display:block;height:0;clear:both;visibility:hidden;line-height:0em; } .green { color:#839f37; } .red { color:#c04a86; } .blue { color:#378899; } .orange { color:#9a5d38; } .logo-icon { float:left; margin:15px 0 0 40px; position:relative; } .logo-text { float:left; margin:25px 0 0 0; border-left:1px solid #888; padding-left:15px; } .corner { float:right;background:url(../images/page/pf-corner.png) no-repeat top right;width:24px;height:33px;margin-top:-17px;line-height:0; } .no-top-padding { padding-top:0; } .extra-right-padding p { padding-right:55px;text-align:justify; } .extra-right-padding_about_us p { padding-right:25px;text-align:justify; } .link { width:110px;float:left; } /*** IDS ***/ #bottom { margin:0 auto; width:870px; } /*** DIVS ***/ div#wrap { margin:0 auto;width:945px; } /* universal wrapper...set page width here */ div#page { background-color:#2e3337;padding:0;overflow:hidden; } /* actual page div */ div#bigbox a:link, div#bigbox a:visited { color: #c0c2c3; } /*** HEADER***/ div#header { background:#1f282d url(../images/page/header-background.jpg) no-repeat bottom left;padding:0;height:100px;margin:0; } div#header.light { background-image:none; } div#header.light .logo-text { margin:35px 0 0 0;} div#header.light .logo-icon { float:left;margin:5px 0 0 40px; } /*** HIMAGE ***/ .himage { z-index:-1;height:346px;background: #2e3337 url(../images/page/main_banner.png) no-repeat top; } body.portfolio .himage { background: #2e3337 url(../images/page/header-image-B.jpg) no-repeat top; height:146px; } body.about .himage { background: #2e3337 url(../images/page/header-aboutus.png) no-repeat top; height:247px; } body.contact .himage { background: #2e3337 url(../images/page/4_banner_B.png) no-repeat top; height:250px; } body.subpage .himage { background: #2e3337 url(../images/page/4_banner_services.png) no-repeat top; height:146px; } body.services .himage { background: #2e3337 url(../images/page/3_banner_B.png) no-repeat top; height:250px; } /*** CONTENT ***/ #contact_us_content { padding:0;background:#2e3337 url(../images/page/content-background-green.jpg) repeat-x top;} div#pagecontent { padding:35px 35px 0 35px; } /*** FOOTER ***/ div#footer { clear:both;padding:20px;color:#666;border-top:1px dashed #444;background-color:#2c2d2f;margin-top:0px; } #subfooter { width:945px;margin:25px auto;background:url(../images/page/bg_subfooter.png) no-repeat;padding:10px 0 0 0;overflow:visible; } #subcontact { float:right;margin-right:80px;display:block; } #latestposts { margin-bottom:10px;margin-left:30px;width:600px;float:left; } .subrss { float:right;margin-top:-45px; } .rssicon { margin-top:22px;margin-left:5px;} .latestblogpost { border-top:1px #CCCCCC dashed;display:block;padding:10px 0;margin-top:10px; } .latestblogtitle { color:#689f34; } .latestblogdate { color:#757677; } .latestcontent { margin-left:40px; } .subcontactadres { border-top:1px #CCCCCC dashed;padding-top:10px;display:block;margin-top:10px; } .postdatesub { background:url(../images/icons/calendar-blog.gif) no-repeat;width:32px;height:45px;float:left;color:#333;text-align:center;margin-right:5px; } .postmonthsub { margin-top:9px; } .postdaysub { margin:-5px;font-size:20px; } .h { position:absolute;top:-1000px;left:-1000px;} /*** BLOG ***/ div#blog_graphics { background:#2e3337 url(../images/page/headers/graphics_blog_header.png) no-repeat top;height:250px; } div#blog_webdesign, div#blog_programming { background:#2e3337 url(../images/page/headers/webdev_blog_header.png) no-repeat top;height:250px; } div#blog_systeembeheer, div#blog_systemadministration { background:#2e3337 url(../images/page/headers/system_blog_header.png) no-repeat top;height:250px; } .post { background:url(../images/page/bg_blog.png) repeat-x;padding:20px; } .post h2 { background-image:none; } .post .content { margin: 15px 0 25px 0;font-size: 1.2em; } .postdate { background:url(../images/icons/calendar-blog.gif) no-repeat;width:32px;height:45px;float:left;color:#333;text-align:center;margin-right:5px; } .postmonth { margin-top:9px; } .postday { margin:-5px;font-weight:bold;font-size:20px; } .leavecomment { font-family:'Trebuchet MS',Verdana, Arial, Helvetica, sans-serif;font-size:1.8em;font-weight:normal;text-transform:uppercase;background:url(../images/icons/comment_add.png) no-repeat 0px 10px;padding-left:20px;padding-top:5px; } .usericon { margin-right:5px; } .caticon { padding-top:5px;margin-right:5px; } .blogcategory { background:url(../images/icons/cat_dbicon.png) no-repeat;padding-left:19px;padding-bottom:5px; } .blogimg { background-color:#4b525a;padding:10px; } .arrowicon { margin-right:5px; } .rss { display:block;height:16px;background:url(../images/icons/feed.png) no-repeat;width:117px;margin-left:15px;list-style:none;padding-top:0px;padding-left:22px; } .rss a { color:#c0c2c3; } .form_control { margin: 5px 0 5px 0; } .comment { background-color:#131718;border-top:1px solid #000000;border-bottom:1px solid #000000;padding:10px 10px 20px 10px; } .comment .details { color:#666666;font-size:9px;margin-bottom:10px; } .commentcount { float:right;background-color:#3d4449;border:3px solid #2e3337;color:#9a9b9b;padding:2px; } .deletecomment { display:block;background:url(../images/icons/comment_delete.png) no-repeat;width:50px;height:16px;padding-left:18px; } #blog_comment { width:600px;float:left;margin:10px 0;padding:25px 15px 0 35px; } div.comment { margin-bottom: 4px; } div.comment .body { font-size: 1.2em; } blockquote { font-family:"Times New Roman", Times, serif;display: block;padding: 0 60px;width: 450px;margin-bottom:20px; } blockquote:before, blockquote:after { height:50px;color: #69c;display:block;font-size: 700%;width:50px; } blockquote:before { content:open-quote;margin-left:-0.55em;margin-top:-30px; } blockquote:after { content:close-quote;margin-top:-50px;margin-left: 460px; } /*** LANGUAGE ***/ #language { font-size:1.0em;float:right;margin:10px 20px 0 0; } #language li { float:left;list-style-type:none;margin:0 5px; } #language li a { color:#666; padding:0; } #language li a:hover { text-decoration:none; color:#999; } #language li a.selected { color:#999; } /*** NAVIGATION ***/ #navigation { font-size:1.4em; float:right; margin:15px 20px 0 0; clear:right; } #navigation li { float:left;list-style-type:none;margin:0 4px;height: 57px;*top: 40px; } #navigation li a { height:57px;color:#aaa;padding:10px 15px 35px 15px;background:url(../images/page/navigation-a-background.jpg) repeat-x;display:block;} #navigation li a:hover { text-decoration:none;color:#fff;background: url(../images/page/navigation-a-background-hover.jpg) repeat-x; } #navigation li a.selected { color:#ddd;background:url(../images/page/navigation-a-background-hover.jpg) repeat-x; } /*** PORTFOLIO ***/ #portfolio-container { background:url(../images/page/content-background-portfolio.jpg) repeat-x;clear:left; } #portfolio { list-style:none;padding:15px 15px 15px 5px; } #portfolio li { margin:0px 7px;float:left;width:75px;} #portfolio li img { display:block;margin-bottom:2px;width:75px;height:75px; } .project { margin:25px 0; border-bottom:1px solid #444; padding:5px 0 25px 0; } .projecttitle { float:left; } .slideshowlinks { float:right; } .slideshowlinks a { display:block;float:left;width:10px;padding:2px;margin-top:0px;color:#777;font-family: 'Trebuchet MS',Verdana, Arial, Helvetica, sans-serif; font-size:1.3em; text-transform:uppercase; font-weight:bold; } span.year { font-size:0.8em; color:#777; } span.tags { font-size:1.3em; color:#839f37; } a.visit { background-color:#839f37; color:black; padding:2px 10px; } a.visit:hover { background-color:#accf4d; } img.screen { background-color: #eee; padding:5px; margin:3px 0 0 0; } div.imagecontainer { margin-top:10px;height:165px; } ul.listing { list-style: none; margin-left:10px; margin-bottom: 20px; } ul.listing li { font-size:110%; line-height:1.5em; color:#839f37; } ul.listing li a, ul.listing li a:visited { color:#c0c2c3; } ul.listing li a.selected { font-weight:bold; color:white; } /*** TABS ***/ .tabs-container { clear:both;height:27px;background:url(../images/page/portfolio-navigation-background.jpg) repeat-x bottom 0; } .tabs { text-align:center;display:block;margin:0 auto;list-style:none; width:494px;overflow:hidden; } .tabs li { margin:0px 1px;width:162px;padding:4px 0px 9px 0px;float:left;background:url(../images/page/portfolio-tab.png) repeat-x; } .tabs li.selected { background:url(../images/page/portfolio-tab-active.png) repeat-x; } .tabs a:link, .tabs a:visited { color:#787c81;text-decoration:none; } .tabs li.selected a:link, .tabs li.selected a:visited, .tabs a:active, .tabs a:focus, .tabs a:hover { color:#c7cbcd;font-weight:bold;text-decoration:none; } /*** SCOLL DING ***/ #scrollcontainer { margin:0px auto;width:680px; } #scrollbox { text-align:center;height:130px;width:542px;z-index:-1;overflow:hidden;float:left;background: url(../images/tab/middle.png) repeat-x top center;} .arrow { cursor: pointer; } .arrowleft, .arrowright { float:left;margin:0;height:124px; } .col1 { width:210px;float:left;margin:0;padding:35px 35px 0 35px;} .col1_about_us { width:252px; height: 345px; float:left; margin:0; padding:35px 5px 0 25px; border-bottom: 1px solid yellow; } .col2 { width:210px; float:left;margin:0;padding:35px 35px 0 35px;border-left:1px solid #2e3338; } .col2_about_us { width:267px; height: 345px; float:left; margin:0; padding:35px 5px 0 25px; border-left:1px solid yellow; border-bottom: 1px solid yellow; } .col3 { width:240px;float:left;margin:0;padding:0px 35px 0 200px; } .col4 { width:240px;float:left;margin:0;padding:0px 35px 0 30px; } .col5 { width:500px;float:left;margin:0;padding:0px 35px 0px 140px; } .col3_about_us { width:545px;float:left;margin:0;padding:0px 5px 0 30px; } .col1w{ width:480px; float:left; margin:0; padding:25px 35px 0 200px;} .col2w{ width:480px; float:left; margin:0; padding:35px 35px 0 35px; border-left:1px solid #2e3338; } /* ugly hack need to improved this */ .col2wtop { width:480px;float:left;margin:0; padding:5px 35px 0 35px;border-left:1px solid #2e3338; } .col1h, .col2h { width:40%;float:left;margin:0 3%;padding:35px 0 0 0; } .col1ew { width:670px;float:left; margin:0;padding:35px 35px 0 35px;border-left:1px solid #2e3338; } .col1ew-small { width:160px;padding:35px 0 0 0;float:left; } .col1m { width:89%; float:left; margin:0 2%; padding:35px 0 0 0; } /*** INDEX ***/ p.contactinfo span { display:block;width:60px;float:left; } div.mainnewsitem { background: url(../images/page/news_transparant.png) repeat-x;position:relative;top:116px;left:700px;width:218px;height:200px;color:black; } div.mainnewsiteminner { padding:10px 15px 0 15px; } div.mainnewsitem p { color:#24282b; margin:0; padding:0; margin-bottom:5px;} div.mainnewsitem p.title { font-size:120%; font-weight:bold; margin-bottom:10px;} div.mainnewsitem p.subtitle { margin-top:15px; margin:0; padding:0; margin-top:15px; font-size:110%; color:#575757;} /*** CONTACT ***/ input , textarea { color: #FFF; border:1px solid #839f37;background-color:#2e3337;margin:0; } label { display:block;margin:0;padding:0; } .error-contactus { float:right;padding-right:65px;color:red; } #map { width:550px;height:255px; margin:0 15px 15px 15px; } #map2 { width:245px;height:235px; margin:0 15px 5px 15px; } #aboutus_map { width:245px;height:235px; margin:0 15px 5px 15px; } /*** SERVICES ***/ body.services #content .spacer { margin-bottom:50px; } body.services #content ul { margin:0px 0 5px 0px; background: url(../images/page/ul-background.html) repeat-x bottom center; min-height:120px;padding:20px; padding-top:0px; list-style-type:none; } body.services #content li { border-bottom:1px dashed #666; padding:8px 0 8px 15px; background: url(../images/page/li-bullet.gif) no-repeat left center; } div.servicedescription { height:80px;} a.more { background-color:#2c2d2f; display:block; padding:8px 8px; font-size:1.4em; } /*** ABOUT ***/ .employee { border:1px solid #444;width:40%;float:left;margin:0 55px 15px 10px;padding:1%;background:url(../images/page/ul-background.html) repeat-x bottom center; } .team { float:left;margin-right:10px;border:1px solid #000;} .qualification { padding-top:6px; } /*** LOGIN ***/ .login { min-height:300px; } .login img { border:4px solid white;float:right; }