/*************************************************** MASTER CSS file for Euroakma Author: WEB Marketing (www.wem.hr) Media: Screen STRUCTURE: 01/ BASIC SETTINGS 02/ LAYOUT & GRID 03/ NAVIGATION 04/ CONTENT 05/ MISC ***************************************************/ /* 01/ BASIC SETTINGS ==================================================*/ * { margin: 0; padding: 0; list-style: none; outline: none; } body { font: normal .75em/1em Arial, Helvetica, sans-serif; color: #333; background: #fff url(../images/layout/body.gif) repeat-x 0 0; } /**** RESET ***/ a img { border: none; } a,a img,a:link,a:visited, a:hover,a:active { outline: none; } input:focus,textarea:focus,select:focus { outline: none; } /* Safari Fix. */ #printLogo, #printContacts { display: none; } /*** headings ***/ h1, h2, h3, h4, h5, h6 { clear: both; line-height: 1.5em; } /* 02/ LAYOUT & GRID ==================================================*/ #wrapper { width: 960px; height: 100%; margin: 0 auto; } #mainNavWrapper { height: 100px; margin-bottom: 15px; } #logo { display: inline; float: left; clear: none; width: 210px; height: 75px; overflow: hidden; margin-top: 20px; } #mainNav { display: inline; float: right; width: 740px; padding-top: 10px; } #headerWrapper { margin-bottom: 15px; background: transparent url(../images/layout/header-top.gif) no-repeat 0 0; padding-top: 10px; } #headerHolder { background: transparent url(../images/layout/header-bottom.gif) no-repeat left bottom; padding-bottom: 10px; } #header { height: 100%; overflow: hidden; background: transparent url(../images/layout/header-bg.gif) repeat-y 0 0; padding: 20px 0 5px 0; } #singleBox { display: inline; float: left; width: 330px; height: 100%; overflow: hidden; } #doubleBox { display: inline; float: left; width: 630px; height: 100%; overflow: hidden; } #header .box { display: inline; float: left; width: 277px; height: 100%; overflow: hidden; margin-left: 25px; } #header #boxHolder { height: 100%; overflow: hidden; margin-bottom: 10px; } #nav { height: 100%; overflow: hidden; margin-bottom: 10px; } #container { height: 100%; overflow: hidden; margin-bottom: 15px; } #mainContent { width: 960px; height: 100%; overflow: hidden; background: transparent url(../images/layout/wide-heading-top.gif) no-repeat 0 0; padding: 5px 0 0 0; } #topLink { text-align: right; margin-bottom: 25px; } #footer { margin-bottom: 15px; background: transparent url(../images/layout/footer-top.gif) no-repeat 0 0; padding-top: 10px; } #banners { height: 100%; overflow: hidden; background: transparent url(../images/layout/footer.gif) no-repeat left bottom; padding: 0 15px; text-align: center; } #banners img { margin: 0 5px 10px 5px; vertical-align: middle; } #development { text-align: center; margin-bottom: 40px; } /* 03/ NAVIGATION ==================================================*/ /*** LANGUAGE ***/ #languageHolder { height: 100%; overflow: hidden; font-size: .8em; line-height: 1em; margin-bottom: 20px; } #language { float: right; width: 45px; height: 18px; background: transparent url(../images/layout/language.gif) no-repeat 0 0;} #language li { float: left; margin-top: 4px; } #hr { margin-left: 5px; margin-right: 3px; padding-right: 3px; border-right: 1px solid #fff; } #language a { color: #fff; text-decoration: none; } #language a:hover, #language .on a { color: #fff; text-decoration: underline; } /*** MAIN MENU ***/ #mainMenuHolder { height: 100%; overflow: visible; } #mainMenu { float: right; font-size: 12px; line-height: normal; z-index: 1000; } #mainMenu li { position: relative; float: left; width: auto; height: 22px; padding: 0 0 0 6px; margin: 0 0 0 3px; background: transparent url(../images/layout/mainmenu-a-left.gif) no-repeat -9999px 0; z-index: 1500; cursor: pointer; } #mainMenu a { display: block; background: transparent url(../images/layout/mainmenu-a-right.gif) no-repeat -9999px 0; padding: 3px 6px 4px 0; text-decoration: none; color: #333; border: none; } /*** MAIN MENU - FIRST LEVEL - ACTIVE ***/ #mainMenu li:hover { background: transparent url(../images/layout/mainmenu-active.gif) no-repeat left top; } #mainMenu li:hover a { background: transparent url(../images/layout/mainmenu-active.gif) no-repeat right top; color: #fff; } #mainMenu .on { background: transparent url(../images/layout/mainmenu-active.gif) no-repeat left top; } #mainMenu .on a { background: transparent url(../images/layout/mainmenu-active.gif) no-repeat right top; color: #fff; } /*** MAIN MENU LEVELS ***/ #mainMenu ul { position: absolute; left: 0; top: 18px; background: #414141; width: 170px; font-weight: normal; line-height: 14px; font-size: 11px; z-index: 2000; padding-top: 5px; } #mainMenu ul ul { top: 0; left: 170px; z-index: 3000; padding-top: 0; } #mainMenu ul li { display: block; background: none; margin: 0; padding: 0; width: 170px; height: auto; z-index: 4000; cursor: pointer; } #mainMenu ul a { margin: 0; padding: 4px 17px 4px 7px; background: none; border-bottom: 1px solid #4d4d4d; color: #fff; } #mainMenu li:hover ul li { background: none; } #mainMenu li:hover ul a { background: none; } #mainMenu li.on ul li { background: none; } #mainMenu li.on ul a { background: none; } #mainMenu ul .sub { background: transparent url(../images/layout/mainmenu-sub-arrow.gif) no-repeat 155px 8px; } #mainMenu li:hover ul li.sub { background: transparent url(../images/layout/mainmenu-sub-arrow.gif) no-repeat 155px 8px; } #mainMenu ul li:hover a { color: #999; } #mainMenu ul li:hover ul a { color: #fff; } #mainMenu ul li:hover ul li:hover a { color: #999; } #mainMenu ul li:hover ul li:hover ul a { color: #fff; } #mainMenu ul li:hover ul li:hover ul li:hover a { color: #999; } #mainMenu ul li:hover ul li:hover ul li:hover ul a { color: #fff; } #mainMenu ul a.on, #mainMenu li.on:hover ul a.on, #mainMenu ul li ul li a.on, #mainMenu ul li ul li:hover ul li a.on { color: #999; } #mainMenu ul { visibility: hidden; } #mainMenu li:hover ul { visibility: visible; } #mainMenu li:hover ul li ul { visibility: hidden; } #mainMenu li:hover ul li:hover ul { visibility: visible; } #mainMenu li:hover ul li:hover ul li ul { visibility: hidden; } #mainMenu li:hover ul li:hover ul li:hover ul { visibility: visible; } /* 04/ CONTENT ==================================================*/ /*** LOGO ***/ #logo a { display: block; width: 210px; height: 75px; overflow: hidden; text-indent: -9999px; background: transparent url(../images/layout/logo.gif) no-repeat 0 0; } /*** HEADER ***/ #header .box h2 { padding-top: 5px; font-size: 1em; font-weight: normal; margin: 10px 0 0 0; } #header .box h2 a { display: block; padding: 0 10px 5px 10px; font-size: 1.3em; font-weight: normal; color: #fff; text-decoration: none; } #header .box h2 a:hover { color: #fff; text-decoration: underline; } #singleBox .box h2 { background: transparent url(../images/layout/black-heading-top.gif) no-repeat 0 0; } #singleBox .box h2 a { background: transparent url(../images/layout/black-heading-bottom.gif) no-repeat left bottom; } #doubleBox .box h2 { background: transparent url(../images/layout/red-heading-top.gif) no-repeat 0 0; } #doubleBox .box h2 a { background: transparent url(../images/layout/red-heading-bottom.gif) no-repeat left bottom; } #doubleBoxNotice { width: 600px; height: 100%; overflow: hidden; margin: 0 25px; font-size: .9em; color: #fff; } #doubleBoxNotice a { color: #fff; text-decoration: underline; } #doubleBoxNotice a:hover { color: #fff; text-decoration: none; } /*** PATH ***/ #path { display: inline; float: left; width: 700px; font-size: .9em; } #path li { float: left; margin-right: 5px; padding-right: 10px; background: transparent url(../images/layout/path-arrow.gif) no-repeat right center; } #path .on { padding: 0; margin: 0; background: none; } #path a { color: #333; text-decoration: underline; } #path .on a { text-decoration: none; } /*** OPTIONS ***/ #options { display: inline; float: right; height: 100%; overflow: hidden; } #printIcon { display: inline; float: left; width: 11px; height: 10px; overflow: hidden; background: transparent url(../images/layout/print.gif) no-repeat 0 0; text-indent: -9999px; margin: 0 20px 0 0; } #fontSize { display: inline; float: left; height: 100%; overflow: hidden; letter-spacing: 2px; padding-bottom: 2px; } #fontSize a { color: #333; text-decoration: none; } #fontSize a:hover { color: #333; text-decoration: underline; } #small { font-size: 10px; } #normal { font-size: 12px; } #large { font-size: 14px; } /*** HOME CONTENT ***/ .home .box { display: inline; float: left; width: 220px; height: 100%; overflow: hidden; background: transparent url(../images/layout/grey-heading-top.gif) no-repeat 0 0; padding-top: 5px; margin-right: 26px; } #certWrapper { display: inline; float: right; width: 220px; background: transparent url(../images/layout/cert-top.gif) no-repeat 0 0; padding-top: 10px; color: #808080; font-size: .9em; } #certHolder { background: transparent url(../images/layout/cert-bottom.gif) no-repeat left bottom; padding-bottom: 10px; } .home #certWrapper .box { display: block; float: none; height: 100%; overflow: hidden; margin: 0; background: transparent url(../images/layout/cert-bg.gif) repeat-y 0 0; padding: 10px 10px 80px 10px; width: 200px; } #container.home h2 { background: transparent url(../images/layout/grey-heading-bottom.gif) no-repeat left bottom; padding: 0 10px 5px 10px; font-size: 1.5em; font-weight: normal; line-height: 1em; margin: 0 0 15px 0; } #container.home img { margin: 5px 0; } /* 05/ MISC ==================================================*/ #topLink { font-size: .9em; } #topLink a { color: #333; text-decoration: underline; } #topLink a:hover { color: #333; text-decoration: none; } #development { font-size: .9em; color: #999; } #development a { color: #999; text-decoration: underline; } #development a:hover { color: #666; text-decoration: underline; }