@charset 'UTF-8';
/**
 * **********************************************************************
 * **********************************************************************
 * "skan.ch website" - styles
 *
 * @author         stefan kloiber, <stk@coma.de>
 * @date           2008-08
 * @copyright      2008 coma ag
 * @link           http://www.coma.de
 *
 * @version        0.10
 * @media          screen
 *
 *
 * @tested         Firefox 3.0.1, IE 6.0.2, Opera 9.5, Safari 3.1.2 (PC)
 * @lastmodified   2008-09-04
 * **********************************************************************
 * **********************************************************************
 */


/**
 * meta information
 *
 * @section meta
 */

/* declares an xml namespace in css3 */
@namespace 'http://www.w3.org/1999/xhtml';


/**
 * yui reset css
 *
 * the foundational yui reset css removes and neutralizes the 
 * inconsistent default styling of html elements
 *
 * @section reset
 */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; }
/* table { border-collapse:collapse; border-spacing:0; } */
fieldset,img { border:0; }
address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; }
ol,ul { list-style:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym { border:0; }



@media screen
{


  /* firefox scrollbar hack --------------------------------------------------- */
  /*html { overflow:-moz-scrollbars-vertical; }*/
  html { height:101%; }



  /* global ------------------------------------------------------------------- */
  body { background:#81c5e8 url('screen_FILES/bg_body.jpg') repeat-x; font:normal 11px 'Arial','Verdana',sans-serif; color:#003272; }

  .hidden { display:none; }
  .shown { display:block; }


  /* container --------------------------------------------------------------- */
  div#container { width:954px; margin:15px auto; padding:3px; background:#fff; }



  /* layout ------------------------------------------------------------------ */
  div#header { position:relative; height:109px; background:#c1d7e5 url('screen_FILES/bg_header.jpg') no-repeat; }

  ul#main_menu { position:absolute; top:67px; left:243px; margin:0; padding:0; color:#fff; font-size:14px; }
  ul#sub_menu { height:40px; margin:0; padding:0 20px; background-color:#003272; color:#fff; font-size:13px; }

  div#footer { height:23px; padding: 5px 22px 0; background-color:#003272; color:#d6e4f3; border-bottom:1px solid #325a8e; }



  /* menu -------------------------------------------------------------------- */
  /* main menu */
  ul#main_menu li { float:left; border-left:2px solid #fff; }
  ul#main_menu li.firstChild { border: 0px none; }
  ul#main_menu a { margin:0 6px; background-color:inherit; color:#003c8c !important; font-weight:bold; text-transform:uppercase; text-decoration:none; }
  ul#main_menu a:hover { color:#fff !important; background-color:inherit; }
  ul#main_menu a.active { color:#fff !important; background-color:inherit; }

  /* sub menu */
  ul#sub_menu li { float:left; margin-top:13px; background:url('screen_FILES/square_s.png') no-repeat 0px 7px; }
  ul#sub_menu li.firstChild { background:none; }
  ul#sub_menu a { margin:0 6px 0 10px; background-color:inherit; color:#b0ccde !important; text-decoration:none; }
  ul#sub_menu a:hover { color:#fff !important; background-color:inherit; }
  ul#sub_menu a.active { color:#fff !important; background-color:inherit; }



  /* link globals ------------------------------------------------------------ */
  a { color:#003272 !important; text-decoration:none; }
  a:hover { color:#fff !important; }

  a.bold:hover { color:#1176a0 !important; }

  a.download { font-weight:bold; }
  a.download:hover { color:#1176a0 !important; }

  a.internal-link:hover { color:#1176a0 !important; }
  a.external-link-new-window, a.external-link { text-decoration:underline; }
  a.external-link-new-window:hover, a.external-link:hover { color:#1176a0 !important; }

  td a.internal-link { text-decoration:underline; }
  td a.internal-link:hover { text-decoration:none; }

  /* headline globals -------------------------------------------------------- */
  h1 { margin-bottom:20px; font-size:24px; font-weight:bold; text-transform:uppercase; }
  h2 { margin-bottom:20px; font-size:14px; font-weight:bold; text-transform:uppercase; }
  h3 { margin-bottom:4px; font-weight:bold; }



  /* table globals ----------------------------------------------------------- */
  table { width:100%; border-collapse:seperate; border-spacing:1px; }
  /* head n data fields */
  th { background:#003272; font-weight:bold; color:#fff; border-bottom:1px solid #6684aa; }
  tr.light td, tr.tr-odd td, .odd { background:#e9f5fc; border-bottom:1px solid #e9f5fc; }
  tr.dark td, tr.tr-even td, .even { background:#d6eaf8; border-bottom:1px solid #d6eaf8; }
  td, th { padding:6px 10px 5px; vertical-align:top; }
  /*td.center, th.center, td.td-1, td.td-2, td.td-3, th.td-1, th.td-2, th.td-3, td.td-4, th.td-4 { text-align:center; }*/
  td.center, th.center { text-align:center; }
  table.downloads td.td-1, td.squeezed { width:62px; padding:6px 9px 5px 10px; vertical-align:top; }
  table.downloads td.td-1 a, td.squeezed a { white-space:nowrap; }

  table.options-hfcs .td-1, table.options-hfcs .td-2, table.options-hfcs .td-3, table.options-hfcs .td-4 { text-align:center; }


  /* form globals ------------------------------------------------------------ */
  input, textarea, select { font:normal 11px 'Arial', 'Verdana', sans-serif; color:#002656; }
  /* form elements */
  div#main form label { display:block; margin-bottom:3px; font-weight:bold; }
  div#main form input, div#main form textarea { display:block; width:298px; height:22px; margin-bottom:4px; border:1px solid #abadb3; }
  div#main form input.upload { border:1px solid #abadb3; }
  div#main form textarea { height:172px; }
  /* button */
  div#main form p.buttons { margin:15px 0 -3px; padding:0; }
  div#main form p.buttons input { display:inline; width:auto; margin:0 0 3px; padding:0 5px 2px 7px; border:0 none; border-right:1px solid #6684aa; background:#003272; color:#fff; font-weight:bold; }



  /* list globals ------------------------------------------------------------ */
  div#main ul { margin:10px 0 10px 15px; list-style:disc outside; }
  div#main ul li { margin-bottom:5px; }

  li.light { background:#e9f5fc; border-bottom:1px solid #e9f5fc; }
  li.dark  { background:#d6eaf8; border-bottom:1px solid #d6eaf8; }



  /* text globals ------------------------------------------------------------ */
  p { /*padding-bottom:14px;*/ line-height:14px; }
  .right { text-align:right; }
  .align-right { text-align:right; }
  .bold { font-weight:bold; }
  span.pdf { padding-left:22px; background:url('screen_FILES/i__pdf.gif') no-repeat; line-height:18px; }
  .no-gap { padding-bottom:0; }
  .arrow { padding-left:15px !important; background:url('screen_FILES/i__arrow.gif') no-repeat 0; }

  div.hr { clear:both; margin:2px 10px 12px; padding:0; height:0; border-bottom:1px solid #003272; }




  /* ------------------------------------------------------------------------- */
  /* HEADER ------------------------------------------------------------------ */
  /* ------------------------------------------------------------------------- */

  /* logo link --------------------------------------------------------------- */
  a#linkHome { display:block; position:absolute; top:10px; left:30px; width:90px; height:90px; }



  /* language select --------------------------------------------------------- */
  /* cf select box */
  div#langSelect_box { position:absolute; top:10px; left:631px; margin:0; padding:0; color:#002656; z-index:10; }

  /* cf select box: display */
  div#lang_selection { overflow:auto; clear:both; margin:0; padding:0; }
  div#lang_selection div.selected { display:inline; float:left; width:86px; height:14px; margin:0; padding:1px 7px; background:#fff; border:1px solid #abadb3; cursor:default; }
  div#lang_selection div.select_btn { display:inline; float:left; width:16px; height:16px; margin:0; margin-left:-1px; background:#fff url('screen_FILES/btn_map.png') no-repeat right; border:1px solid #abadb3; }
  div#lang_selection div.select_btn.hover { background-color:#e9f5fc; }

  /* cf select box: drop-down list */
  div#lang_select ul { display:none; overflow:auto; clear:both; width:117px; margin:0; padding:0; background:#fff; color:#002656; border:1px solid #abadb3; z-index:9999; }
  div#lang_select ul li { margin:0; padding:0; overflow:hidden; }
  div#lang_select ul li a { display:block; width:103px; margin:0; padding:2px 7px; text-decoration:none; color:#002656 !important; cursor:default; }
  div#lang_select ul li a:hover { background:#c1d7e5; }


  /* search box -------------------------------------------------------------- */
  /* cf search box */
  div#search_box { position:absolute; top:10px; left:760px; margin:0; padding:0; }

  /* cf search box: input field */
  div#search_box form input { float:left; width:153px; height:14px; padding:1px 6px; border:1px solid #abadb3; color:#abadb3; }
  /* cf search box: active state */
  div#search_box form input.active { color:#002656; }
  /* cf search box: submit button */
  div#search_box form div.submit_btn { float:left; width:16px; height:16px; margin:0; margin-left:-1px; background:#fff url('screen_FILES/btn_map.png') no-repeat; border:1px solid #abadb3; }






  /* ------------------------------------------------------------------------- */
  /* MAIN -------------------------------------------------------------------- */
  /* ------------------------------------------------------------------------- */
  div#content { width:100%; overflow:hidden; padding:10px 0 100px; }

  /* main -------------------------------------------------------------------- */
  div#main { display:inline; float:left; width:680px; margin:5px 20px 0; }

  /* columns ----------------------------------------------------------------- */
  div#main div.wrapper { overflow:auto; clear:both; margin:0; padding:5px 0; }

  /* verhalten der headlines im aeussersten div wrapper */
  div#main div.wrapper h1, div#main div.wrapper div.csc-header h1 { margin:0 10px; padding:0; }
  div#main div.wrapper * h1 { margin:0; padding:0; }
  div#main div.wrapper>h2 { margin:0 10px; padding:0; }
  div#main div.wrapper * h2 { margin:0; padding:0; }
  div#main div.wrapper * h2.gap { padding-bottom:2px; }
  div#main div.wrapper * h2.l-gap { padding-bottom:12px; }
  div#main div.wrapper h3 { margin:0 10px; padding:0; }
  div#main div.wrapper * h3 { margin:0; padding:0; }
  div#main div.wrapper * h3.gap { padding-bottom:6px; }
  div#main div.wrapper * h3.l-gap { padding-bottom:12px; }
  *html div#main div.wrapper ul.eventlist h3 { margin:0 -15px; padding:0; }

  /* breite der spalten im div wrapper */
  div#main div.wrapper div.col-1 { display:inline; float:left; width:660px; margin:10px 0 10px 10px; }
  div#main div.wrapper div.col-2 { display:inline; float:left; width:320px; margin:10px; overflow:hidden; }
  div#main div.wrapper div.col-4 { display:inline; float:left; width:150px; margin:10px; }

  /* headlines im produktbereich */
  div#main div.wrapper div.col-1 h1.product { overflow:auto; clear:both; padding-top:4px; padding-bottom:4px; border-bottom:1px solid #003272; }
  div#main div.wrapper div.col-1 h1.product p { padding:0; }
  div#main div.wrapper div.col-1 h1.product p.icons { margin:-3px 0 0; display:inline; float:right; }
  div#main div.wrapper div.col-1 h1.product p.icons img { padding:0 5px; }

  /* teaser content: genereller aufbau */
  div#main div.wrapper div.teaser { background:#e9f5fc; }
  /* teaser content: inhalt */
  div#main div.wrapper div.teaser img { border-bottom: 1px solid #fff; }
  div#main div.wrapper div.teaser div { margin:0; padding:7px 10px; }
  div#main div.wrapper div.teaser div h1 { margin-bottom:4px; font-size:12px; font-weight:bold; text-transform:uppercase; }
  div#main div.wrapper div.teaser div p { padding:0; margin:0; }

  /* teaser content: aufbau kleiner teaser */
  div#main div.wrapper div.teaser.small img { float:left; border-bottom:0 none; border-right: 1px solid #fff; }
  div#main div.wrapper div.teaser.small div { float:left; width:149px; margin:0; padding:7px 9px 7px 10px; }
  div#main div.wrapper div.small { position:relative; height: 90px; }
  div#main div.wrapper div.small p.continue { position:absolute; right:10px; top:70px; }


    /* staff content: genereller aufbau */
  div#main div.wrapper div.staff { background:#e9f5fc; }
  /* staff content: inhalt */
  div#main div.wrapper div.staff img { border-bottom: 1px solid #fff; }
  div#main div.wrapper div.staff div { margin:0; padding:4px 10px; }


  /* event liste */
  div#main div.wrapper ul.eventlist { list-style:none; margin:0; padding:0; }
  div#main div.wrapper ul.eventlist li { padding:6px 10px 5px; margin-bottom:1px; }


  /* feature box */
  div#main div.wrapper div.feature { background:#e9f5fc; }
  /* feature box: inhalt */
  div#main div.wrapper div.feature img { float:right; border-left: 1px solid #fff; }
  div#main div.wrapper div.feature div { float:left; width:390px; margin:0; padding:7px 10px; }
  div#main div.wrapper div.feature ul { margin:10px 0 0 15px; padding:0; }
  div#main div.wrapper div.feature ul  li{ margin-bottom:6px; }


  /* form box */
  div#main div.wrapper div.form { background:#e9f5fc; }

  div#main div.wrapper div.form div.col-2 { width:300px; margin:7px 10px 10px; }
  div#main div.wrapper div.form div.col-2.left { margin-right:30px; }


  /* sitemap */
  div.tx-dropdownsitemap-pi1 a, div.tx-dropdownsitemap-pi1 a:hover { color:#003272 !important; }

  /* search results */
  div.tx-indexedsearch table { border-spacing:0; }
  div.tx-indexedsearch table td { padding:5px 0; vertical-align:middle; }
  div.tx-indexedsearch-searchbox td { padding:0 !important; }
  div.tx-indexedsearch-searchbox input.sword { padding:1px 6px; }
  div.tx-indexedsearch-searchbox input.submit { display:inline; width:auto !important; margin:0 0 3px; padding:0 5px 2px 7px; border:0 none; border-right:1px solid #6684aa; background:#003272; color:#fff; font-weight:bold; }
  div.tx-indexedsearch-whatis { margin:10px 0 0; }
  div.tx-indexedsearch-whatis span.tx-indexedsearch-sw { font-weight:bold; }
  div.tx-indexedsearch-browsebox { padding-top:10px; }
  div.tx-indexedsearch-browsebox strong { font-weight:bold; }
  div.tx-indexedsearch-browsebox p { padding-bottom:10px; }
  div.tx-indexedsearch-browsebox ul.browsebox { list-style:none !important; padding-bottom:15px; margin-left:0 !important; }
  div.tx-indexedsearch-browsebox ul.browsebox li { float:left; padding:0 5px; border-left:1px solid #003272; }
  div.tx-indexedsearch-browsebox ul.browsebox li:first-child { border-left:0 none; }
  div.tx-indexedsearch-browsebox ul.browsebox li a:hover { color:#003272 !important; text-decoration:underline; }
  
  div.tx-indexedsearch-res { clear:both; }
  div.tx-indexedsearch-res a { font-weight:bold; }
  div.tx-indexedsearch-res a:hover { color:#003272 !important; }
  div.tx-indexedsearch-res td.icon { padding:5px; }
  div.tx-indexedsearch-res td.percent { padding:5px; font-weight:bold; }
  div.tx-indexedsearch-res .info { font-size:10px; }
  div.tx-indexedsearch-res .path a { font-weight:normal; }
  div.tx-indexedsearch-res .path a:hover { color:#003272 !important; text-decoration:underline; }



  /* ------------------------------------------------------------------------- */
  /* SIDE NOTES -------------------------------------------------------------- */
  /* ------------------------------------------------------------------------- */

  /* content inline navigation ----------------------------------------------- */
  div#left { display:inline; float:left; /*width:180px; height:260px;*/ margin:20px -10px 0 0; padding:0; }

  /* produktmenue */
  div#left ul.inline_menu { margin:0; padding:0 0 10px; }
  div#left ul.inline_menu li { width:180px; margin:0; padding:0; }
  div#left ul.inline_menu li a { display:block; width:150px; margin-bottom:1px; padding:6px 10px 6px 20px; background:#4395bb url('screen_FILES/square_s.png') no-repeat 12px 12px; color:#fff !important; border-top:1px solid #69aac9; }
  div#left ul.inline_menu li a:hover { background-color:#1176a0; }
  div#left ul.inline_menu li.active a { background-color:#1176a0; font-weight:bold; }

  /* produktmenue untermenue */
  /*div#left ul.inline_menu li ul li { background:#4395bb; }*/
  div#left ul.inline_menu li ul, div#left ul.inline_menu li ul li { margin:0; padding:0; }
  div#left ul.inline_menu li ul li.active a { background-color:#1176a0 !important; font-weight:bold; }
  div#left ul.inline_menu li ul li a { display:block; width:140px; margin-bottom:1px; padding:6px 10px 6px 30px; background:#7cbad7 !important; color:#fff !important; border-top:1px solid #69aac9; font-weight:normal !important; }
  div#left ul.inline_menu li ul li a:hover { background-color:#1176a0 !important; }

  /* produktmenue zusatzinfos */
  div#left ul.additional_menu { padding:6px 10px 0; }


  /* teaser ------------------------------------------------------------------ */
  /* teaser der rechten marginalspalte */
  div#right { display:inline; float:right; margin:20px 0 0 -10px; padding:0; }

  /* teaser right side note: genereller aufbau */
  div#right div.teaser { width:244px; margin:0 0 20px; padding:0; background:#cae0ed; color:#fff; }

  /* teaser right side note: hintergrund */
  div#right div.first { background:#4395bb; }
  div#right div.second { background:#1176a0; }
  div#right div.third { background:#17587d; }
  div#right div.fourth { background:#093658; }

  /* teaser right side note: inhalte */
  div#right div.teaser img { border-bottom: 1px solid #fff; }
  div#right div.teaser div { margin:0; padding:4px 10px 7px; }
  div#right div.teaser div h1 { margin-bottom:4px; color:#c1d7e5; font-size:14px; font-weight:bold; text-transform:uppercase; }
  div#right div.teaser div p { padding:0; margin:0; }
  div#right div.teaser div p.continue a { color:#c1d7e5 !important; font-weight:bold; text-decoration:none; }
  div#right div.teaser div p.continue a:hover { color:#fff !important; }




  /* ------------------------------------------------------------------------- */
  /* FOOTER ------------------------------------------------------------------ */
  /* ------------------------------------------------------------------------- */
  div#footer a { margin:0 3px; background-color:inherit; color:#d6e4f3 !important; text-decoration:none; }
  div#footer a:hover { color:#c1d7e5 !important; background-color:transparent; }
  div#footer a.active { color:#c1d7e5 !important; background-color:inherit; }

}