/** * @section : Lay-out CSS * @project : Dragon Plastics * @author : Boye Oomens * @media : all * @version : 2.0 */ /* Main container and header */ #mainContainer {width:813px; position:relative; padding:0; margin:0 auto; z-index:98} #topHeader {width:813px; height:79px; margin:0; background:url(/images/dragon-icon.gif) no-repeat bottom right; position:relative;} #banner {width:179px; height:179px; position:absolute; top:17px; left:256px; overflow:hidden; z-index:100; background:url(/images/sales-manager-gezocht.png) no-repeat top left; text-indent:-8000em; display:block;} /* logo */ #topLogo {width:235px; height:24px; position:relative; float:left; left:0; top:52px; margin:0; padding:0} #topLogo a {width:235px; height:24px; display:block; outline:0; text-indent:-2000px; background:url(/images/dragon-plastic-logo.gif) no-repeat top left} #zoekFrm {width:240px; height:50px; position:absolute; right:20px; top:10px; margin:0} /* Main navigation */ #mainNav {width:813px; height:35px; margin:0 auto; position:relative; background:#1B1B1B url(/images/nav_bg.gif) no-repeat top left; z-index:99} #mainNav #rightSideNav {margin:0 7px 0 0; padding:0; height:35px; right:0; float:right} #mainNav #rightSideNav li {display:block; float:left; height:35px; margin:0; padding:0} #mainNav #kitLink a {background:url(/images/kit-nav-link.gif) no-repeat left; width:41px; height:35px; display:block; outline:0; text-indent:-2000px} #mainNav #contactLink a {background:url(/images/contact-nav-link.gif) no-repeat left; width:83px; height:35px; display:block; outline:0; text-indent:-2000px} #mainNav #disclaimerLink a {background:url(/images/disclaimer-nav-link.gif) no-repeat left; width:88px; height:35px; display:block; outline:0; text-indent:-2000px} #mainNav #rssLink a {background:url(/images/icons/rss.png) no-repeat left; width:22px; height:35px; display:block; outline:0; text-indent:-2000px; margin-left:5px;} #mainNav #leftSideNav {width:71px; height:35px; top:0; left:33px; position:absolute; background:url(/images/main-nav-bg.gif) no-repeat top left; cursor:pointer; z-index:101;} #mainNav #leftSideNav ul {width:365px; margin:0; height:35px; padding:35px 0 0 0; display:none} #mainNav #leftSideNav ul li {width:355px; height:22px; display:block; position:relative; float:left; background:#666; margin:1px 0 0 0; padding:9px 0 0 10px; color:#333} #mainNav #leftSideNav ul li a {color:#333; text-transform:uppercase; font-weight:bolder; font-size:11px !important; text-decoration:none; display:block; width:325px; float:left; outline:0} #mainNav #leftSideNav ul li:hover {color:#fff !important; background:#333 url(/images/submenu-item-bg-hover.gif) no-repeat left !important; cursor:pointer; width:342px !important; padding:9px 0 0 23px !important} #mainNav #leftSideNav ul li:hover a {color:#fff !important; text-transform:uppercase; font-weight:bolder; font-size:11px !important; text-decoration:none; display:block; width:325px; float:left; outline:0} /* Main content divisions */ #mainContent {width:813px; margin:0; padding:6px 0 0 0; line-height:1.6em; font-size:1.1em; color:#fff} /* Main content blocks */ #mainContent .mainBlock{width:271px; height:271px; margin:0; padding:0; float:left; text-align:justify} #mainContent .googleMaps {width:270px; height:270px; margin:0; padding:0} #mainContent .smallThumb {width:57px; height:57px; margin:0 10px 0 10px; padding:0} /* Cases overview */ #casesOverview {margin:10px 0 0 0; padding:0; width:270px} #casesOverview li {width:60px; height:60px; display:block; float:left; padding:0; margin:0 10px 10px 0} #casesOverview li a {outline:0} /* News overview */ #newsOverview{margin:0; padding:0; width:270px; position:absolute; top:0; right:0} #newsOverview li{width:270px; height:60px; display:block; float:left; padding:0 9px 0 0; margin:0 0 10px 0; text-align:right;} #newsOverview li a {color:#fff; font-weight:bold; text-decoration:none; font-size:1.4em} #newsOverview li a img {padding:0 0 0 10px} #newsOverview li a span {position:relative; top:22px} #newsOverview li a .newsLinkText {position:relative; top:-22px !important} #imageOverview{margin:0; padding:0; width:261px; position:absolute; bottom:-10px; left:9px} .imageOverviewRight{right:9px !important} .imageOverviewRight li{float:right !important; text-align:right !important} #imageOverview li{width:261px; height:60px; display:block; float:left; padding:0 9px 0 0; margin:0 0 10px 0; text-align:left} #imageOverviewHorizontal{margin:4px 0 0 0; padding:0; width:261px; float:left} #imageOverviewHorizontal li{width:60px; height:60px; display:block; float:left; padding:0 9px 0 0; margin:0 0 10px 0; text-align:left} #mainContent .mainBlockMerged{width:530px; height:270px; margin:0 1px 1px 10px; padding:0; float:left; text-align:justify} #enterWebsite #mainContentText{color:#fff; width:812px; padding:15px 0 0 0; text-align:justify} #enterWebsite{color:#fff; width:812px; padding:15px 0 0 0; text-align:right; position:relative; z-index:2; cursor:pointer} #enterWebsite a.enterLink{color: #018C39; text-decoration:none; position: absolute; bottom: 0; right: 0} #enterWebsite a.enterLink img{outline:0; border:none} #enterWebsite #mainContentText .homePageTextColumn{float:left; width:261px; padding:0 9px 9px 0; margin:0} #enterWebsite #mainContentText .homePageTextColumn h2{color:#fff} /* Nieuwsbrief form */ #nieuwsbriefFrm {width:270px; height:270px; margin:0 0 1px 0; padding:0; color:#fff; font-size:1.1em} #nieuwsbriefFrm form br {clear:left} #nieuwsbriefFrm form label {float:left; margin:0; padding:8px 0 0 10px; color:#fff; width:40px; font-size:11px} #nieuwsbriefFrm form input {width:262px !important; height:22px; margin:0 !important; padding:5px 0 0px 5px !important; background:#333; font-size:1.0em; color:#999; border:none; float:left} #nieuwsbriefFrm form input.error {border:1px solid #c00 !important; width:262px !important} #nieuwsbriefFrm form select {width:200px; height:18px; margin:5px 5px 0 10px; font-size:1.1em; border:1px solid #fff; color:#213016; font-weight:bold; background:#fff} #nieuwsbriefFrm form input.nieuwsbriefBtn {width:265px !important; height:27px; margin:0 !important; position:relative; top:-3px; left:1px; padding:4px 0 6px 5px !important; background:#333; font-size:1.0em; color:red !important; text-decoration:underline; text-align:left; font-weight:bold; cursor:pointer} /* Footer */ #mainFooter {width:813px; margin:10px 0 0 0; padding:0; height:35px; background:#1b1b1b url(/images/footer-slogan.gif) no-repeat left; clear:both; font-size:1.1em; position:relative} #footerNav {margin:0; padding:0; height:35px; right:0; top:0; position:absolute; background:#ccc} #footerNav li {display:block; float:left; height:35px; margin:0; padding:0} #footerNav li a {height:35px; display:block; outline:0; text-indent:-2000px} #footerNav #languageNL a {background:url(/images/language-nl.gif) no-repeat left; width:45px} #footerNav #languageSK a {background:url(/images/language-sk.gif) no-repeat left; width:45px} #footerNav #languageDE a {background:url(/images/language-de.gif) no-repeat left; width:46px} #footerNav #languageEN a {background:url(/images/language-en.gif) no-repeat left; width:37px} /* e-sites logo */ #e-sitesLogo{width:35px; height:30px; position:absolute; bottom:6px; right:-40px} #e-sitesLogo a{width:35px; height:30px; display:block; text-indent:-2000px; overflow:hidden; background:url(http://www.e-sites.nl/banners/small/dlm.jpg) center center no-repeat} /* Contact form */ #contactFrm {margin:0; padding:0} #contactFrm fieldset {margin:0 0 0 0; padding:0; width:270px; float:left} #contactFrm label {margin:0 !important; padding:2px 0 0 10px!important; width:259px; height:18px; float:left; font-size:1.0em; color:#fff} #contactFrm input {width:265px !important; height:22px; margin:0 !important; padding:5px 0 0px 5px !important; background:#333; font-size:1.0em; color:#999; border:none} #contactFrm select {width:267px !important; height:25px; margin:0 !important; border-top:4px solid #333 !important; border-bottom:4px solid #333 !important; padding:1px 1px 1px 5px !important; background:#333; font-size:1.0em; color:#999; border:none} #contactFrm textarea {width:264px; height:128px; margin:0 !important; padding:4px 0 0px 5px !important; background:#333; font-size:1.0em; color:#999; overflow:auto} #contactFrm input.submitBtn {width:271px !important; height:27px; margin:0 !important; position:relative; top:-3px; left:1px; padding:4px 0 6px 5px !important; background:#333; font-size:1.0em; color:red !important; text-decoration:underline; text-align:left; font-weight:bold; cursor:pointer} /* Titles */ #smallTitle{width:120px; position:absolute; margin:-10% auto 0 -60px; left:50%; top:50%; text-align:center} #smallTitle h2{margin:0; padding:0; font-size:2.0em; font-weight:bold; text-transform:uppercase; letter-spacing:1px; color:#fff; line-height:24px} #largeTitle{width:170px; position:absolute; margin:-30% auto 0 -85px; left:50%; top:50%; text-align:center} #largeTitle h2{margin:0; padding:0; font-size:2.0em; font-weight:bold; text-transform:uppercase; letter-spacing:1px; color:#fff; line-height:24px} /* Scroll elements */ #scroll_box{overflow:auto; height:270px; width:270px} #scroll_up{cursor:pointer; width:20px; height:20px; background:url(/images/scroll_arrow_up.gif) no-repeat; position:absolute; top:0; left:0px} #scroll_up:hover{background:url(/images/scroll_arrow_up-hover.gif) no-repeat !important; text-decoration:none !important; cursor:pointer; width:15px; height:15px; border:none} #scroll_down{cursor:pointer; width:20px; height:20px; background:url(/images/scroll_arrow_down.gif) no-repeat; position:absolute; bottom:0; left:0px} #scroll_down:hover{background:url(/images/scroll_arrow_down-hover.gif) no-repeat !important; text-decoration:none !important}