/* info -------------------------------------------------------- Start: 08.08.2009. Author: BozooArt, www.bozooart.com Name: MICRO grupa - www.microgrupa.hr */ /* Colors ----------------------------------------------- #ef9b11 = orange #000000 = black #707173 = gray #e7e7e7 = light gray #0b2644 = blue ----------------------------------------------- */ /* Normalize ----------------------------------------------- */ body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td { margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6 { font-size: 100%; margin: 0; font-weight: normal; } ol, ul { list-style: none; } address, caption, cite, code, dfn, th, var { font-style: normal; font-weight: normal; } table { border-collapse: collapse; border-spacing: 0; } fieldset, img { border: 0; } caption, th { text-align: left; } q:before, q:after { content:''; } hr { display: none; } legend { display: none; } input, textarea, select { font: 1em Arial,Helvetica,sans-serif; color: #494627; } img { margin: 0; padding: 0; } a { text-decoration: none; color: #ef9b11; } a:hover { border: none; } a:focus { outline: none; } .clr { clear: both; } .hide { display: none; } *:focus { outline: none; } /* General ----------------------------------------------- */ body { font: 62.5%/1.4 Arial,Helvetica,sans-serif; background: #000; color: #707173; } #background { background: url(/en/css/img/orange_line.gif) repeat-x 0 125px; } #container { width: 977px; background: #fff; margin: 20px auto 0 auto; padding: 3px; } #header h2 a { background: url(/en/css/img/logo.gif) no-repeat; width: 297px; height: 59px; display: block; float: left; margin: 15px 0 15px 20px; } #header h2 a span { display: none; } #lang { float: right; margin: 38px 20px 0 0; font-size: 1.2em; color: #636466; } #lang li { float: left; margin-left: 30px } #lang a { color: #636466; } #lang a:hover { text-decoration: underline; color: #ef9b11 } #lang span { margin: 0 10px; color: #e7e7e7; } /* navigation */ #nav { background: url(/en/css/img/3dfx.gif) no-repeat 0 100%; padding-bottom: 25px; width: 1015px; margin: 0 0 3px -19px; } #nav ul { background: url(/en/css/img/nav-bg.gif) repeat-x; height: 43px; padding: 2px 0 0 2px; } #nav ul li { float: left; } #nav ul li a { display: block; padding: 12px 0 9px; text-align: center; color: #fff; font-weight: bold; font-size: 1.4em; margin-right:1px;} #nav ul li a:hover { background: #fff; color: #707173; } #nav ul li.selected a { color: #707173; } #nav ul li.selected li.active a { color: #ef9b11; } #nav ul li a:hover, #nav ul li:hover a, #nav ul li.selected a { background: url(/en/css/img/active-btns.gif) no-repeat; } #nav ul li.lnk1:hover a, #nav ul li.lnk1 a:hover, #nav ul li.lnk1.selected a { background-position: 0 0; } #nav ul li.lnk2:hover a, #nav ul li.lnk2 a:hover, #nav ul li.lnk2.selected a { background-position: -150px 0; } #nav ul li.lnk3:hover a, #nav ul li.lnk3 a:hover, #nav ul li.lnk3.selected a { background-position: -320px 0; } #nav ul li.lnk4:hover a, #nav ul li.lnk4 a:hover, #nav ul li.lnk4.selected a { background-position: -468px 0; } #nav ul li.lnk5:hover a, #nav ul li.lnk5 a:hover, #nav ul li.lnk5.selected a { background-position: -633px 0; } #nav ul li.lnk6:hover a, #nav ul li.lnk6 a:hover, #nav ul li.lnk6.selected a { background-position: -828px 0; } #nav ul ul { padding: 7px 0; height: auto; position: absolute; z-index: 10; display: none; } #nav ul li:hover ul { display: block; } #nav ul li:hover a { color: #707173; } #nav ul ul li { float: none; display: block; padding: 0; padding: 5px 0 } #nav ul ul li a { color: #707173; width: auto !important; font-size: 1.2em; font-weight: normal; display: block; text-align: left; padding: 0 30px 0 25px; background: url(/en/css/img/separator.gif) no-repeat 15px 7px !important; } #nav ul ul li a:hover { color: #ef9b11; background: url(/en/css/img/orange_square.gif) no-repeat 15px 7px !important; } #nav ul li:hover li a { margin-top: 0 !important; } #nav ul li ul { background: url(/en/css/img/sub-menu-bg.png) no-repeat; padding-bottom: 18px; } #nav ul li.lnk2 ul { background-position: 0 0; } #nav ul li.lnk3 ul { background-position: -692px 0; } #nav ul li.lnk5 ul { background-position: -319px 0; } #nav ul li.lnk6 ul { background-position: -513px 0; } #nav ul li.lnk1 a { width: 150px; // width: 149px; // } #nav ul li.lnk2 a, #nav ul li.lnk2 ul { width: 170px; } #nav ul li.lnk3 a, #nav ul li.lnk3 ul { width: 148px; } #nav ul li.lnk4 a, #nav ul li.lnk4 ul { width: 165px; } #nav ul li.lnk5 a, #nav ul li.lnk5 ul { width: 195px; } #nav ul li.lnk6 a, #nav ul li.lnk6 ul { width: 179px; } #about { width: 285px; height: 102px; margin: -178px 0 0 645px; background: url(/en/css/img/about-bg.png); color: #e7e7e7; font: 1.3em "trebuchet ms", arial, verdana, helvetica, sans-serif; padding: 25px 15px; line-height: 1.6em; position: relative; // position: static; // } #head_banner { width: 651px; height: 192px; margin-top: -27px; clear: both; } #sidebar { width: 323px; float: left; padding-top: 36px; font-size: 1.2em; } #sidebar h2 { background: url(/en/css/img/3d-orange.gif) no-repeat 0 100%; margin: 0 0 0 -19px; padding-bottom: 25px } #sidebar h2 span { background: #707173; color: #fff; padding: 7px 10px 7px 30px; display: block; font-size: 1.1em; font-weight: bold; } #sidebar ul { margin: 0 0 40px 20px; width: 250px; } #sidebar ul li {border-bottom: 1px solid #e7e7e7; padding: 7px 10px; } #sidebar ul li a { color: #707173 } #sidebar ul li a:hover, #sidebar ul li.active a { color: #ef9b11 } #sidebar dl { margin-bottom: 40px; } #sidebar dt { background: url(/en/css/img/3d-orange.gif) no-repeat 0 100%; margin: 0 0 0 -19px; padding-bottom: 25px } #sidebar dd { margin: 0 0 0px 30px; line-height: 1.8em; } #sidebar dd a { text-decoration: underline } #sidebar dt strong { background: #707173; color: #fff; padding: 7px 10px 7px 30px; display: block; font-size: 1.1em; font-weight: bold; } #sidebar dd strong { display: inline-block; width: 50px; } #sidebar dd a:hover { text-decoration: none } #sidebar dd.address { margin-bottom: 15px; } #sidebar dd.btn { margin: 25px 0 0 30px; } #sidebar dd.btn a { background: url(/en/css/img/offices-btn.gif) no-repeat; width: 168px; height: 35px; display: block; color: #707173; text-decoration: none; text-transform: uppercase; font-weight: bold; text-align: center; padding: 13px 0 0 25px; font-size: 1.1em; } #sidebar dd.btn a:hover { background-position: right; } #main-content { width: 601px; float: left; padding: 35px 25px; font-size: 1.3em; } #main-content h1 { color: #0b2644; font: 1.6em "trebuchet ms", arial, helvetica verdana, sans-serif; font-weight: bold; border-bottom: 1px solid #ef9b11; padding-bottom: 5px; margin-bottom: 30px } #main-content p { margin-bottom: 25px; } #main-content a { text-decoration: underline; } #main-content a:hover { text-decoration: none; } #wide_content { padding: 35px 25px; font-size: 1.3em; } #wide_content h1 { color: #0b2644; font: 1.6em "trebuchet ms", arial, helvetica verdana, sans-serif; font-weight: bold; border-bottom: 1px solid #ef9b11; padding-bottom: 5px; margin-bottom: 30px } #content { background: url(/en/css/img/content_bg.gif) repeat-x; padding-bottom: 40px; margin-top: 3px } #footer { width: 937px; margin: 0 auto; padding: 10px 20px; color: #707173; font-size: 1.1em; } #footer .web { margin-left: 657px } #footer a { color: #707173 } #footer a:hover { color: #ef9b11 } #table { font-size: .9em; width: 100%; text-align: center; border: 1px solid #e7e7e7; border-bottom: none; } #table th { font-weight: bold; background: #ef9b11; color: #fff; padding: 12px 5px; text-align: center } #table th.col1 { width: 12%; text-align: left } #table th.col2 { width: 40%; text-align: left } #table th.col3 { width: 15%;} #table th.col4 { width: 15%; } #table th.col5 { width: 10%; } #table td { padding: 10px 7px; border-bottom: 1px solid #e7e7e7; } #table td.long, #table td.first { text-align: left; } #table td.long { font-weight: bold; } #table tr.gray td { background: #f1f1f1; } #main-content h3 { font-weight: bold; margin-bottom: 10px} #main-content ul { margin: 10px 0 25px 20px; } #main-content ul li { margin-bottom: 7px; background: url(/en/css/img/orange_square.gif) no-repeat 0 8px; padding-left: 10px; } #main-content.deep-list ul ul { margin: 0 0 10px 0; } #main-content.deep-list ul li { background: none; font-weight: bold; } #main-content.deep-list ul li li { font-weight: normal; margin: 0; } #main-content.deep-list ul li a { text-decoration: none; } #main-content.deep-list ul li a:hover { text-decoration: underline; } #main-content .important { font-weight: bold; background: #e7e7e7; padding: 20px } #main-content #category h3 { font-weight: bold; paddging-bottom: 5px; border-bottom: 1px solid #ef9b11; margin-bottom: 10px; } #main-content #category h3 a { text-decoration: none; color: #0b2644; } #main-content #category h3 a:hover { color: #000; } #main-content #category .date { font-size: .9em; font-weight: bold; display: block; margin-bottom: 5px; } #main-content #category .box { margin-bottom: 50px; } #main-content.contact dl { margin-bottom: 25px; } #main-content.contact dt { color: #0b2644; border-bottom: 1px solid #E7E7E7; padding-bottom: 3px; margin-bottom: 10px; } #main-content.contact dd { margin-left: 25px; } #form { margin: 0 0 20px 0; font-size: .9em; } #form label { display: inline-block; width: 100px; text-align: right; margin-right: 10px } #form .input_text, #form textarea { width: 250px; border: 1px solid #707173; background: #fff; padding: 3px 4px; } #form .input_text:focus, #form textarea:focus { border: 1px solid #ef9b11; } #form textarea { width: 350px; height: 100px } #form p { margin-bottom: 25px; } #form input.btn { width: 82px; height: 31px; text-align: center; font-weight: bold; background: #707173; color: #f3f1eb; border: none; cursor: pointer; margin-left: 114px } #form input.btn:hover { background: #ef9b11; } #wide_content h3 { font-weight: bold; border-bottom: 1px solid #e7e7e7; padding: 15px 5px; font-size: 1.0em; } #wide_content h3 a { color: #0b2644; } #wide_content h3 a:hover { color: #ef9b11; } .reference { width: 100%; font-size: .9em; margin: 0 0 50px 20px; } .reference th { width: 20%; padding: 7px 10px; font-weight: bold; vertical-align: top; border-bottom: 1px solid #e7e7e7; } .reference td { padding: 7px 10px; border-bottom: 1px solid #e7e7e7; } .reference ul { margin: 10px 0 25px 20px; } .reference ul li { margin-bottom: 7px; background: url(/en/css/img/orange_square.gif) no-repeat 0 8px; padding-left: 10px; } /* main page */ #main-page { font-size: 1.1em; padding-top: 40px; } .home-box { width: 215px; margin-left: 25px; float: left; color: #a3a4a5; } .home-box h3 { font-weight: bold; font-size: 1.3em; color: #0b2644; border-bottom: 1px solid #ef9b11; padding: 0 5px 0 30PX; margin-bottom: 15px; background: url(/en/css/img/home-icons.gif) no-repeat 0 3px; } .home-box .lead { height: 130px; } .home-box span { display: block; text-alight: right; background: url(/en/css/img/arrow.gif) no-repeat 0 4px; padding-left: 20px; margin-left: 140px } .home-box span a:hover { text-decoration: underline; } #b1.home-box { margin-left: 20px; } #b2.home-box h3 { background-position: 0 -31px } #b3.home-box h3 { background-position: 0 -62px } #b4.home-box h3 { background-position: 0 -93px } /* html offices */ #offices-map { background: url(/en/css/img/home-map.png) no-repeat; width: 316px; height: 207px; float: left; } #office-network { height: 248px; background: #000 url(/en/css/img/footer-bg.jpg) no-repeat center 100%;width: 953px; margin: 0 auto; padding: 10px 15px 10px; font-size: 1.2em; } #office-network h4 { font-weight: bold; color: #ef9b11; font-size: 1.3em; margin-bottom: 20px; } #main-office { width: 270px; float: left; margin-right: 20px } #main-office ul li.address { margin-bottom: 20px; } #main-office ul li strong { display: inline-block; width: 50px; } #main-office ul li a { color: #707173 } #main-office ul li a:hover { text-decoration: underline; color: #ef9b11 } #offices { float: left; width: 270px; margin-right: 70px; } #left-col.offices-list { margin-right: 40px; } #offices .offices-list { width: 110px; float: left; } .offices-list dl { margin: 0 0 10px 0; color: #8f8f8f; } .offices-list dt { border-bottom: 1px solid #707173; margin-bottom: 3px; } .offices-list dd { padding-left: 10px; } .offices-list dd a { color: #8f8f8f; } .offices-list dd a:hover { color: #ef9b11; text-decoration: underline; }