
/******************/
/* GLOBAL LAYOUT  */
/******************/

body {background:rgb(255,255,255); color:#5a6369; font-family:verdana,arial,sans-serif;}

.background-1 {position:absolute; overflow: auto; background:url(/csf2009/images/bg_body_1.jpg); background-attachment: fixed; width:100%; height:100%;}
.background-2 {position:absolute; overflow: auto; background:url(/csf2009/images/bg_body_2.jpg); background-attachment: fixed; width:100%; height:100%;}
.background-3 {position:absolute; overflow: auto; background:url(/csf2009/images/bg_body_3.jpg); background-attachment: fixed; width:100%; height:100%;}

.background_company {position:absolute; overflow: auto; background:url(/csf2009/images/bg_unternehmen.jpg); background-attachment: fixed; width:100%; height:100%;}
.background_solutions {position:absolute; overflow: auto; background:url(/csf2009/images/bg_loesungen.jpg); background-attachment: fixed; width:100%; height:100%;}
.background_services {position:absolute; overflow: auto; background:url(/csf2009/images/bg_leistungen.jpg); background-attachment: fixed; width:100%; height:100%;}
.background_contact {position:absolute; overflow: auto; background:url(/csf2009/images/bg_kontakt.jpg); background-attachment: fixed; width:100%; height:100%;}

.container {width:863px; padding-top:75px; padding-bottom:20px; margin:0 auto; font-size:12px;}
.header {width:863px; height:181px /*Non-IE6*/; height:auto !important /*Non-IE6*/; height:181px /*IE6*/ !important; background-color:transparent; font-size:12px;}
.header-top {clear:both; width:863px; height:20px; background: transparent url(/csf2009/images/bg_transparent_1.png) repeat-x; /*Top header background image entered here. Height: 100px*/ ; font-size:1.0em}
.header-bottom {clear:both; width:863px; margin-top: 3px; height:158px /*Non-IE6*/; height:auto !important /*Non-IE6*/; height:158px /*IE6*/ !important; background: transparent url(/csf2009/images/bg_transparent_1.png) repeat-x; /*Bottom header background image entered here: Height: 25 px*/ ; font-size:1.0em}
.navbar {white-space:nowrap /*IE hack*/; float:left; width:863px; margin-top: 3px; background: transparent url(/csf2009/images/bg_transparent_1.png) repeat-x; font-family:verdana,arial,sans-serif; font-size:12px; text-transform: uppercase;}
.main {clear:both; width:863px; margin-top: 3px; margin-bottom: 3px; padding:0px 0 0px 0; background: transparent url(/csf2009/images/bg_transparent_2.png) repeat-y !important /*Non-IE6*/; font-size:12px;}
.main-startsite {clear:both; float: left; width:863px; min-height: 480px; margin-top: 3px; margin-bottom: 3px; padding:0px 0 0px 0; background: none; font-size:12px;}
.content {display:inline; /*Fix IE floating margin bug*/; float:right; width:580px; background-color: transparent; font-size:12px; overflow:visible !important /*Non-IE6*/; overflow:hidden /*IE6*/;}
.subcontent {display:inline /*Fix IE floating margin bug*/; float:left; width:280px; background-color:none; font-size:12px; overflow:visible !important /*Non-IE6*/; overflow:hidden /*IE6*/;}
.footer {margin-bottom: 50px; clear:both; width:863px; height: 20px; padding: 0px 0 0px 0; background: transparent url(/csf2009/images/bg_transparent_1.png) repeat-x; font-size:1.1em !important /*Non-IE6*/; font-size:9px /*IE6*/; overflow:visible !important /*Non-IE6*/; overflow:hidden /*IE6*/;}


/****************/
/*  HEADER-TOP  */
/****************/

/* SITENAME AND SLOGAN */
.sitelogo {width:189px; height:86px; position:absolute; z-index:1; background:url(/csf2009/images/logo.gif) no-repeat; margin-left:34px; margin-right:0; margin-top:60px; margin-bottom:0}
.sitelogo_en {width:189px; height:86px; position:absolute; z-index:1; background:url(/csf2009/images/logo_englisch.gif) no-repeat; margin-left:34px; margin-right:0; margin-top:60px; margin-bottom:0}
.sitewanbackup {width:145px; height:45px; position:absolute; z-index:2; background:url(/csf2009/images/CSF-WAN-Backup.gif) no-repeat; margin-left:325px; margin-right:0; margin-top:105px; margin-bottom:0}
.sitecloud {width:180px; height:150px; position:absolute; z-index:1; background:url(/csf2009/images/cloud.jpg) no-repeat; margin-left:625px; margin-right:0; margin-top:25px; margin-bottom:0}
.sitename {width:300px; height:70px; position:absolute; z-index:1; margin:65px 0 0 250px; overflow:hidden;}
.sitename h1 {font-family:georgia,verdana; font-weight:normal; font-size:25px;}
.sitename h2 {font-family:verdana,arial,sans serif; margin-top:-5px; padding-bottom:2px; color:#5a6369; height:20px; font-weight:normal; font-size:13px;}
.sitename a{text-decoration:none; color:#5a6369;}
.sitename a:hover {text-decoration:none;}

/* GLOBAL NAVIGATION */
.navglobal {width:400px; float: right; z-index:3; margin:0px 34px 0px 0px !important /*Non-IE6*/; margin-right:20px /*IE6*/; font-family:verdana,arial,sans-serif;}
.navglobal ul {float:right; font-weight:normal;}	
.navglobal li {display:inline; list-style:none;}
.navglobal li a {display:block; float:left; background: url(/csf2009/images/bg_navglobal.gif) no-repeat; background-position: right; padding:4px 5px 4px 4px; color:#000; text-decoration:none; font-size:9px !important /*Non-IE6*/; font-size:9px /*IE6*/;}
.navglobal ul li a.no_background {background: none !important;}
.navglobal  li a.separator {padding-left:14px}
.navglobal  li a.focus {color:#35a6a3;}
.navglobal a:hover {text-decoration:none; color:#35a6a3;}


/*******************/
/*  HEADER BOTTOM  */
/*******************/

.header-bottom ul {float:left; width:430px; list-style:none; padding:8px 0 3px 10px !important /*Non-IE6*/; padding:7px 0 2px 10px /*IE6*/;}
.header-bottom ul li {display:inline; background:url(/csf2009/images/bg_bullet_arrow.gif) no-repeat 0 50%; font-size:110% !important /*Non-IE6*/; font-size:100% /*IE6*/ !important; padding-left:10px; padding-right:0; padding-top:0; padding-bottom:0}
.header-bottom ul li.nobullet {display:inline; padding:0; background:none; color:rgb(75,75,75);}
.header-bottom ul a {color:rgb(125,125,125); font-weight:bold; text-decoration:none;}
.header-bottom ul a:hover {color:rgb(255,255,255);}


/********************/
/*  NAVIGATION BAR  */
/********************/

/* MAIN MENU */
.navbar ul {list-style-type:none; margin-left:37px; }
.navbar ul li {float:left; z-index:auto !important /*Non-IE6*/; z-index:1000 /*IE6*/; background-color:none;}
.navbar ul li a {background: url(/csf2009/images/bg_navbar.gif) no-repeat; background-position: right; float:none !important /*Non-IE6*/; float:left /*IE-6*/; display:block; height:20px; line-height:20px; padding:0 10px 0 3px; text-decoration:none; font-weight:normal; color:#000; border-right:solid 0px #000;}
.navbar ul li a.no_background {background: none !important;}

/* MAIN MENU (Non-IE6 hovering) */
.navbar ul li:hover {position:relative;} /*Sylvain IE hack*/
.navbar ul li:hover a {background-color: none; text-decoration:none;}

/* MAIN MENU (IE6 hovering) */
.navbar table {position:absolute; z-index:1000; top:0px; left:-1px; border-collapse:collapse; background-color: none;}
.navbar ul li a:hover {position:relative /*Sylvain IE hack*/; z-index:1000 /*Sylvain IE hack*/; background-color: none; color:#35a6a3; text-decoration:none;}


/************/
/*  CONTENT */
/************/

/* CONTAINER FOR ANIMATION (STARTSITE ONLY) */
.startsite-animation {float: left; width:863px; padding-top: 0px; height: 480px; background: none;}

/* CONTAINER FOR CONTENT */
.content-1col {width:540px; padding-top: 0px; padding-right: 20px; padding-left: 20px; min-height: 480px;}


/***************/
/* SUBCONTENT (CONTAINS SIDE MENU ON THE LEFT SITE) */
/***************/
.subcontent-box {width:280px; min-height: 480px; float:right;}


/************/
/*  FOOTER  */
/************/
.footer p {clear:both; line-height:20px; padding-left: 40px; color:#5a6369; font-weight:normal; font-size:9px;}
.footer p.credits {clear:both; font-weight:normal;}
.footer a, .footer a:visited {text-decoration:underline; color:#000;}
.footer a:hover {text-decoration:none; color:#35a6a3;}


/******************/
/*  CLEAR FLOATS  */
/******************/
.container:after, .header:after, .header-top:after, .header-bottom:after, .navbar:after, .main:after, .content:after, .content div:after, .subcontent:after, .subcontent div:after, .footer:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.content-1col-nobox:after, .content-2col-nobox-leftcolumn:after, .content-2col-nobox-rightcolumn:after, .content-1col-box:after, .content-2col-box-leftcolumn:after, .content-2col-box-rightcolumn:after, .content-2col-box:after, .subcontent-box:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.corner-content-1col-top:after, .corner-content-1col-bottom:after, .corner-content-2col-top:after, .corner-content-2col-bottom:after, .corner-subcontent-top:after, .corner-subcontent-bottom:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
 p:after {content:"."; display:block; height:0; /*clear:both Do not use here to avoid paragraphs clearing next to images;*/  visibility:hidden;}
 
 
/**************/
/*  PRINTING  */
/**************/
/* To avoid that some layouts may break during printing */
/* we remove one vertical border-line for the columns  */                 
@media print {.content-2col-nobox-rightcolumn {display:inline; float:right; width:337px; border-left:none; background-color:rgb(255,255,255);}}

