@charset "utf-8"; /* ####### RESET CSS ####### */ /* v1.0 | 20080212 */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent} body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } /* remember to define focus styles! */ :focus { outline: 0; } /* remember to highlight inserts somehow! */ ins { text-decoration: none; } del { text-decoration: line-through; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: collapse; border-spacing: 0; } /* ####### RESET CSS ####### */ /* ####### DEFAULT CSS ####### */ html{overflow-y:scroll; height:100%} body{font:12px Arial, Verdana, Helvetica, sans-serif; color:#555; height:100%} h2{font-size:1.4em; margin:10px; position:relative} li li{font-size:1em} p{margin:1.5em 0; line-height:22px; padding:.5em} a{color:#288fe1} a:hover{text-decoration:none} ul{margin:1em 3.5em; list-style-type:square} li{line-height:1.6em} .italic{font-style:italic} .align_center{text-align:center} .align_right{text-align:right} .bold{font-weight:bold} img.left{float:left; margin:0 10px 10px 0} img.right{float:right; margin:0} .error, .success{background-color:#ffeaea; border:solid 1px #fbb; padding:0 1em; border-left:solid .4em #fbb; margin-bottom:1em; color:#333} .error p, .succes p{margin:4px 0} .succes ul, .error ul{margin-top:0} .success{background-color:#d7edf8; border-color:#81b6d1} p.m10{margin:10px} .pos_rel{position:relative} /* ####### DEFAULT CSS ####### */ body{background:#fff url(bg.jpg) left top repeat-x} #page_wrapper{width:900px; margin:0 auto; background:transparent url(page_wrapper_bg.png) left top repeat; height:auto; min-height:100%} #menu{height:50px; padding:30px 30px 0 30px} #menu ul{list-style-type:none; margin:0; float:left; margin-left:60px} #menu li{float:left; margin:0 5px} #menu a{color:#fff; font-weight:bold; text-decoration:none; display:block; padding:3px 10px 3px 10px} #menu a:hover, #menu a.sel{background-color:#ffcc00; color:#24517c} #content_wrapper{margin:0 30px; background-color:#fff; min-height:500px; padding:10px} #header{background:#fff url(header_dotted_divider.gif) left bottom repeat-x; height:159px} #header .main_logo{display:block} #header .left_col{width:220px; text-align:center; padding-top:5px} #visual{float:right; width:600px; height:146px; text-align:right; position:relative} #visual .bottom{position:absolute; left:34px; bottom:-47px} #visual .top{position:absolute; right:156px; top:-56px} #lang_sel{padding:10px 20px 10px 22px; border:solid 1px #eee; border-width:1px 0; width:160px; margin:10px; float:left; list-style-type:none} #lang_sel li{margin:0 12px 0 0; float:left} #lang_sel .last{margin-right:0} #lang_sel img{display:block} #lang_sel .sel a{background-color:#BFE8FF; border:solid 1px #BFE8FF} #lang_sel a{border:solid 1px #fff; padding:2px; display:block} #lang_sel a:hover{border:solid 1px #BFE8FF} #date{clear:both} #footer{background:#fff url(header_dotted_divider.gif) left top repeat-x; position:relative; float:left; padding:5px 0 10px 10px; width:810px; margin:10px 0} #footer .d2d{position:absolute; right:10px; top:5px} /* INDEX */ h2.index{color:#444; margin-left:5px} #gamma{float:left; margin:0 2px; list-style-type:none} #gamma li{float:left; width:132px; height:150px; border:solid 1px #f6f6f6; text-align:center; margin-right:2px} #gamma li.last{margin-right:0} #gamma li.odd{background-color:#f6f6f6} #gamma li span{height:35px; display:block; padding-top:10px} #gamma li span a{} #gamma li .img{display:block; width:130px; height:85px; text-align:left} #main_col_wrapper{float:left; width:100%; margin-top:5px; margin-bottom:15px} #main_col_wrapper .left_col, #main_col_wrapper .left_col_index{float:left; width:570px; margin-right:16px; margin-left:10px} #main_col_wrapper .left_col_index, #main_col_wrapper .right_col_index{background:#fff url(header_dotted_divider.gif) left top repeat-x; width:544px; padding:0; margin-left:0; margin-top:10px; margin-right:2px} #main_col_wrapper .right_col_index{width:271px; float:left} #main_col_wrapper .right_col{float:left; width:221px} #index_realisation{float:left; margin-left:5px; width:525px} #index_realisation img{float:left; margin-right:15px} #index_realisation h3{color:#288fe1; font-size:12px} #index_realisation p{margin:10px 10px 0 135px; padding:0} #route_index{background:transparent url(company_index.jpg) left top no-repeat; width:265px; height:121px; position:relative} #route_index span{display:block; position:absolute; bottom:0; left:0; background:transparent url(route_index_bg.png) left top repeat; width:100%} #route_index img{float:right; margin:2px 0 2px 10px; border:solid 3px #fff} #route_index span p{margin:0; padding:5px} /* INDEX */ /* PRODUCTS */ #product_cats{padding:10px 0; border-top:dotted 1px #eee; margin:10px 0} .right_col .detail{height:50px; border-bottom:dotted 1px #eee} #product_cats ul, #products{margin:10px 0 0 0; list-style-type:none} #product_cats li, #products li{border-bottom:solid 1px #eee} #product_cats a, #products a{display:block; padding:2px 5px 3px 15px; text-decoration:none; border-left:3px solid #0086cb} #products a{border-color:#FFCC00} #product_cats .sel, #product_cats a.sel:hover, #products .sel, #products a.sel:hover{background-color:#00a8ff; font-weight:bold; color:#fff} #products .sel, #products a.sel:hover{background-color:#ffcc00} #product_cats a:hover{background-color:#d6f1ff} #products a:hover{background-color:#ffefb0} #product_cats select{width:200px; margin:10px 0; vertical-align:middle} h3.cat{background-color:#00a8ff; color:#fff; border-left:3px solid #0086cb; padding:3px 5px} #product_list{margin:10px; list-style-type:none; float:left} #product_list li{padding:0 5px 15px 5px; border-bottom:solid 1px #ccc; float:left} #product_list li.last{border-bottom:none} #product_list h4{font-weight:bold; padding:5px 0} #product_list .desc{margin:0 0 0 135px; padding:0; width:400px} #product_list .img{display:block; float:left; width:120px; height:120px} #product_list .more{text-align:right; padding:0 10px 0 0; margin:0} #product_list li.over{border-color:#00a8ff} #product_list li.over h4{color:#00a8ff; padding-left:10px; background:transparent url(h4_arrow.gif) left center no-repeat} #product_list li.over a{text-decoration:none} #case_detail .img{float:left; margin:0 15px 15px 0; width:120px; height:120px; display:block} .detail h4{margin:10px 0} #specs{clear:both; margin-top:10px} #case_detail .desc p{margin:0 0 0 130px} .table_wrapper{clear:both} .table_wrapper table{width:100%; border:solid 1px #ccc} table td{padding:2px 4px} table .odd td{background-color:#f6f6f6} td.slabel{width:25%} td.stype{width:20%} /* PRODUCTS */ /* REFERENCES */ #refs{float:left; list-style-type:none; margin:0} #refs li{float:left; width:85px; height:85px; text-align:center; margin:5px 7px; border:solid 1px #eee} /* REFERENCES */ /* SHOWCASE */ #cases{float:left; margin:0 0 15px 0; width:100%; list-style-type:none} #cases li{float:left; width:386px; margin:9px; border:solid 1px #fff; padding:2px; background-color:#f6f6f6} #cases img{float:left; margin:0 10px 0 0} #cases h3{margin:5px 5px 5px 0} #cases p{margin:0; line-height:18px} #cases li.alt{background-color:#f6f6f6; border-color:#FFC931; background:transparent url(showcase_alt.gif) left top repeat-y} #cases li.over{border-color:#00a8ff; cursor:pointer; background:transparent url(showcase_over.gif) left top repeat-y} #cases li.over h3{color:#00a8ff} #cases li.over a{text-decoration:none} #case_wrapper{float:left; width:800px; margin:0 11px 11px 11px} #case_wrapper .left_col{width:308px; float:left; margin-right:15px} #case_thumbs{float:left; margin:0; list-style-type:none; padding:5px 0; border:solid 1px #018fe3; border-width:1px 0} #case_thumbs li{float:left; margin:0 1px 1px 0; width:76px; height:57px} #case_thumbs img{display:block} #case_description{float:left} #case_description p{margin:10px 0; padding:0} #case_description ul{margin:10px 10px 10px 35px} h3.case{color:#00a8ff; margin:5px 5px 5px 0} #case_wrapper .right_col{width:473px; overflow:hidden; height:347px; border:solid 1px #ccc} #case_images ul{list-style-type:none; margin:0; padding:0} #case_images img{display:block; padding:5px} #case_images .last img{padding-bottom:6px} #case_images a{display:block} p.m5{margin:5px} /* SHOWCASE */ p.notify{margin:10px; border:dotted 1px #ffc931; background-color:#fff6dd; padding:10px; font-style:italic} .company h3{clear:both; margin:10px 0; border-bottom:solid 1px #aaa; padding:0 5px 5px 5px} .company .left_col p{margin-top:0} .company .left_col .error p, .company .left_col .success p{float:none; margin-bottom:10px} .company .left_col img{padding:3px; border:solid 1px #bbb} .company .right_col ul{margin:10px 0 20px 14px; padding-left:15px; border-left:solid 3px #999; list-style-type:none; background-color:#f6f6f6} .company .right_col h4{color:#00a8ff; margin-left:14px; border-bottom:dotted 1px #ccc; padding:3px} .company .right_col img{vertical-align:middle} .route{margin:0 0 10px 25px} .route a{display:block} .pdf-icon{background:url(pdf_icon.gif) 0px 3px no-repeat; padding-left:19px} .gps-icon{background:url(gps_icon.gif) 0px 3px no-repeat; padding-left:19px} .company ul.no_margin_bottom{margin-bottom:0} .company .imgs_wrapper{float:left; width:151px; height:100px; margin:5px 10px 5px 5px; border:solid 1px #bbb; padding:3px} .company .imgs_wrapper div{width:151px; height:100px} .company .imgs_wrapper img{border:none; padding:0} /* clearfix */ * html .clearfix {height: 1%} .clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden} .clearfix {display:inline-block} /* Hide from IE Mac \*/ .clearfix {display:block} /* End hide from IE Mac */