/* soluna.ch | styled by digital design | www.digital-design.ch */

/* LAYOUT */
/* hide from IE5 mac \*/
html,body { height: 100%; }
/* end hiding from IE5 mac */
body  { font-size: 62.5%; background-color: #fff; align: center; margin: 0; padding: 0;}
#Main, #Top, #Header, #Window, #Content, .Spacer, #Line, #Footer { position: relative; width: 760px; height: auto}  
#Top, .Spacer, #Line, #Footer { height: 2em; }
#Main   { margin: 0 auto; padding: 0; }
#Top       { background-color: white; text-align: right; }
#Header     { background: #650C66 url("../layout/bg_header.png") no-repeat; text-align: right; margin-top: 0; padding: 0; height: 100px }
#Logo, #Typo { float: left; position: relative }
#Logo { height:85px; left:36px; top:7px; *top: -7px; width:82px }
#Typo { height:85px; left:44px; top:7px; *top: -7px; width:124px }
#Window { margin: 0; padding: 0; height: 0 }
#Menu { background: #EFE6EF url(../layout/bg_mainnav.png) no-repeat; position: relative; height: 30px; width: 760px}
#Content   { width: 760px; height: auto; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod='scale', src='layout/trans.png') }
#Content[Class]    { background-image: url(../layout/trans.png) }
.Teaser  { line-height: auto; margin: 0 0 0 8px; padding: 0; position: relative; width: 184px; height: auto; float: left; }
/* .Teaser { display: none } */
.bleu {color: #CC33CC }
.rouge {color: #971299}
#NoMargin {margin: 0;}
.ten {margin-right: 10px}
.dix {position: relative; width: auto; padding: 0; margin: 0; margin-bottom: 10px; _margin-bottom: 6px; }
#FullWidth { position: relative; top: 0; left: 0; margin: 0; padding: 0; width: 760px; line-height: auto; float: left; }
.FullWidthMult { position: relative; top: 0; left: 0; margin: 0; padding: 0; width: 760px; height: auto; line-height: auto; float: left; }
#FullWidthHP { float: left; position: relative; top: 0; left: 0; margin: 0; padding: 0; width: 760px; height: 184px; line-height: auto }
#Text   { margin: 0 auto 0 0; padding-right: 10px; top: 0; left: 0; width: 552px; height: auto; float: right }
.home #Text {width: 534px; padding-right: 6px;} 
.Spacer { clear: both }
#FooterLine  { position: relative; height: 22px; border-bottom: 2px solid #606; clear: both }
#Footer  { background-color: #fff; text-align: center; padding: 0.25em 0; }
/* hide from IE mac \*/
#dummy {display: none }
/* end hiding from IE5 mac */
.right  { position: relative; float: right }
.txtright {display: inline; float: right}
.center {text-align: center}
#chakra1 #Text a#bandeau, p#bandeau {width: 100%; text-align: center; background-color: #650c66; padding: 0.25em; text-decoration: none; color: #EFE6EF}
#chakra1 #Text a#bandeau:hover {background-color:#EFE6EF ; color: #650c66}
h2.bigger {font-size: 1.6em}
#chakra4 #Text p#bandeau {width: 100%; height: auto; line-height: 2em; text-align: center; background-color: #33715C; text-decoration: none; color: white; font-weight: bold}

/* TEASERS */

a.prev { float: left; display: block; width: 30px; height: 184px; margin-right: 12px; _margin-right: 10px; background: transparent url("../layout/bg_nav.gif") left top no-repeat}
a.prev:hover {background: transparent url("../layout/bg_nav.gif") -30px top no-repeat}
a.prevoff { float: left; display: block; width: 30px; height: 184px; margin-right: 12px; _margin-right: 10px; background: transparent url("../layout/bg_nav.gif") -60px top no-repeat}

a.next { float: left;  display: block; width: 30px; height: 184px; margin-left: 12px; padding: 0; background: transparent url("../layout/bg_nav.gif") -90px top no-repeat}
a.next:hover {background: transparent url("../layout/bg_nav.gif") -120px top no-repeat}
a.nextoff { float: left;  display: block; width: 30px; height: 184px; margin-left: 12px; padding: 0; background: transparent url("../layout/bg_nav.gif") -150px top no-repeat}

.TeaserHP a, .TeaserHPnew a, #Typo a, #Logo a, a.next, a.prev {outline:none}


/* tmp */
#leftnav {float: left;  display: block; width: 30px; height: 184px; margin-right:12px; padding: 0; background-image:  url("../layout/navleft_off.gif")}
#rightnav {float: left;  display: block; width: 30px; height: 184px; margin:0; padding: 0; background-image: url("../layout/navright_off.gif")}

.TeaserTop, .TeaserMiddle, .TeaserBottom  { margin: 0; position: relative; width: 184px }
.TeaserTop   { min-height: 40px; _height: 40px; padding: 8px 0 0; background-position: center top;  }
.TeaserMiddle  { min-height: 110px; _height: 100px; padding-top: 10px; background-position: center top; }
.TeaserBottom  { margin-bottom: 10px; padding-bottom: 16px; background-position: center bottom; }

.TeaserHP, .TeaserHPnew { float: left; margin: 0 12px 0 0; _margin: 0 6px 0 0; position: relative; width: 160px; height: 184px; text-align: center; overflow:hidden } 
.TeaserHP { background: transparent url(../layout/bg_hp.gif) left top no-repeat }
.TeaserHPnew { background: transparent url(../layout/bg_hp.gif) -320px top no-repeat }
.TeaserHP:hover {background: transparent url(../layout/bg_hp.gif) -160px top no-repeat}
.TeaserHPnew:hover {background: transparent url(../layout/bg_hp.gif) -480px top no-repeat}


/* TEXT */
h1 { font-family: 'century gothic', Century Gothic, century gothic, "lucida grande", 'URW Gothic L', avantgarde, "avant garde", "microsoft sans serif", arial, helvetica, "trebuchet ms", univers, geneva, sans-serif; color: #971299 /* CC27CF */ }
h2, h3, #Text a, #Text p, #Text td, #Text th, #Text ol li, #Text ul li { font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, sans-serif; margin: 0;  }

h1 { font-size: 2.4em; margin: 0; padding: 0 0 0.6em 0 }
h2 { font-size: 1.4em; margin: 0; padding: 1.5em 0 0.6em; }
h3 { font-size: 2em; padding: 0 0 0.6em; margin: -0.6em 0 0 0 }


#Text p, #Text td, #Text th { font-size: 1.3em; text-align: justify; }
#Text p.center {text-align: center}
#Text p.big, td span.big {font-size: 1.6em}
#Text th { font-size: 1.3em; text-align:right; }
#Text ol, #Text ul {margin-top:0;margin-bottom: 1.6em}
#Text ul {list-style-type: square}
#Text ol li, #Text ul li { font-size: 1.3em }
#Text td ol li, #Text td ul li{ font-size: 1em; margin:0 0 0 -26px }
#Text a { text-decoration: none; color: #650C66 }
#Text a:hover { text-decoration:underline }
#Text p, #Text td, #Text th  { color: #202020; }
#Text th {font-weight: bold; text-align:left}
#Text img.center {text-align: center}

#Text a:hover {color: #650C66;}
#Text a:visited {color: #971299;}

/*
#chakra1 #Text a:hover {color: #650C66;}
#chakra1 #Text a:visited {color: #AD558C;}
#chakra1 h1, #chakra1 h3, #chakra1 #Text a, #chakra1 #Text a:focus, #chakra1 #Text a:hover, #chakra1 #Text a:active  { color: #650C66; }
#chakra2 h1, #chakra2 h3, #chakra2 #Text a, #chakra2 #Text a:visited, #chakra2 #Text a:focus, #chakra2 #Text a:hover, #chakra2 #Text a:active  { color: #650C66; }
#chakra3 h1, #chakra3 h3, #chakra3 #Text a, #chakra3 #Text a:visited, #chakra3 #Text a:focus, #chakra3 #Text a:hover, #chakra3 #Text a:active  { color: #3d5dce; }
#chakra4 h1, #chakra4 h3, #chakra4 #Text a, #chakra4 #Text a:visited, #chakra4 #Text a:focus, #chakra4 #Text a:hover, #chakra4 #Text a:active  { color: #33715c; }
#chakra5 h1, #chakra5 h3, #chakra5 #Text a, #chakra5 #Text a:visited, #chakra5 #Text a:focus, #chakra5 #Text a:hover, #chakra5 #Text a:active  { color: #ea7901; }
#chakra6 h1, #chakra6 h3, #chakra6 #Text a, #chakra6 #Text a:visited, #chakra6 #Text a:focus, #chakra6 #Text a:hover, #chakra6 #Text a:active  { color: #ce2410; }
#chakra7 h1, #chakra7 h3, #chakra7 #Text a, #chakra7 #Text a:visited, #chakra7 #Text a:focus, #chakra7 #Text a:hover, #chakra7 #Text a:active  { color: #dc1955; }
*/

/*#Text a:link, #Text a { color: #339999; }*/
#chakra4 #Text ul { list-style-image:url(../layout/b_green.gif); list-style-type: square}
ul.purple { list-style-image:url(../layout/bullet.gif); list-style-type: square}

#Header p { display: inline; color: #EFE6EF; font-size: 1em; font-family: 'century gothic', Century Gothic, century gothic, "lucida grande", 'URW Gothic L', avantgarde, "avant garde",  "microsoft sans serif", arial, helvetica, "trebuchet ms", univers, geneva, sans-serif; text-transform: uppercase; text-align: right; padding-right: 10px; position: relative; top: 78px}

#Top p { position: relative; display: inline; top: 0.4em; right: 5px; }
#Top p, a, #Footer p, a { font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif }
#Top p, a { color: #666}
#Top a { padding-right: 5px; padding-left: 5px}
#Top a, #Footer a { text-decoration: none; }
#Top a:link, #Top a:visited { color: #666 }
#Top a:focus, #Top a:hover, #Top a:active { color:#650C66; text-decoration: underline }

#Logo a img, #Typo a img { border: 0 }

.noborder a img {border:none}

#Menu a {color: #650C66; font-size: 1.3em; font-family: 'century gothic', Century Gothic, century gothic, "lucida grande", 'URW Gothic L', avantgarde, "avant garde",  "microsoft sans serif", arial, helvetica, "trebuchet ms", univers, geneva, sans-serif; text-transform: uppercase; line-height: 30px; text-decoration: none; text-align: right; margin: 0; padding: 0 1em 0; position: relative; width: auto; float: left }
#Menu a.current, #Menu a#Section1#current { background: white url(../layout/triangle.gif) no-repeat scroll center top }
#Menu a:hover { background: white }
/* #Menu iframe#datamain { position: relative; display: inline; margin-left: 12px; _margin-left: 10px; width: 292px; _width: 289px; height: 20px; _height: 22px } */
#Menu iframe#datamain { display: none }
#Menu a#Section1 { margin-left: 32px } /* ; border-left: solid 1px #650C66 */
#Menu a#Section6 { border-right: none }
/* #Menu a#Section1:hover { border-left:10px solid white; left: -10px; margin-right: -10px } */

div.jCarouselLite { float: left; width: 676px !important; margin: 0; padding: 0; overflow: hidden }

/* Needed for rendering without flicker */ 
div#FullWidthHP .carousel .jCarouselLite {
position: relative;
visibility: hidden;
left: -5000px;
}


.TeaserHP h4, .TeaserHP h4 a, .TeaserHPnew h4, .TeaserHPnew h4 a { font-family: 'century gothic', Century Gothic, century gothic, "lucida grande", 'URW Gothic L', avantgarde, "avant garde",  "microsoft sans serif", arial, helvetica, "trebuchet ms", univers, geneva, sans-serif; font-size: 1.6em; height: 20px; overflow: hidden; margin: 0 auto; text-align:center; color: #650c66; margin: 8px auto 2px; text-decoration:none}
.TeaserHP h5, .TeaserHP h5 a, .TeaserHPnew h5, .TeaserHPnew h5 a { margin: 3px 0 1px 0; font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, sans-serif; font-size: 1.1em; margin: 2px 0 2px 0; text-align:center; color: #650c66;line-height: 1.2em; font-weight: normal; text-decoration:none }
.TeaserHP img, .TeaserHPnew img { position:relative; margin: 6px 0 3px 0; width: 140px; height: 105px; border: none}
/* body:first-of-type .TeaserHP img { margin: 6px 0 6px 0; border: 2px solid red} */
.TeaserHP p, .TeaserHPnew p { margin: 0; font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, sans-serif; font-size: 1.1em; color: #333; font-weight: bold; overflow:hidden; line-height:1.6em }
.TeaserHP a, .TeaserHPnew a {text-decoration:none}
.TeaserHP a:hover p, .TeaserHPnew a:hover p {color:#650c66; text-decoration:underline}
/*.TeaserTop h4 {font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, sans-serif; margin: 0 auto;  }
.TeaserTop a h4, .TeaserTop a h5 { text-decoration: none; cursor: pointer } */


.TeaserTop h5, .TeaserTop h5 a, .TeaserMiddle p, .TeaserBottom p, .TeaserMiddle a { font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, sans-serif; margin: 0 auto; }
.TeaserTop h4, .TeaserTop h4 a {font-family: 'century gothic', Century Gothic, century gothic, "lucida grande", 'URW Gothic L', avantgarde, "avant garde",  "microsoft sans serif", arial, helvetica, "trebuchet ms", univers, geneva, sans-serif; margin: 0 auto}
.TeaserTop h4 a, .TeaserTop h5 a { text-decoration: none; cursor: pointer }
/* .TeaserMiddle a: visited, .TeaserMiddle a:focus, .TeaserMiddle a:hover, .TeaserMiddle a:active { color: white } */
.TeaserMiddle a:focus, .TeaserMiddle a:hover, .TeaserMiddle a:active, .TeaserBottom a:focus, .TeaserBottom a:hover, .TeaserBottom a:active { text-decoration: underline }
.TeaserMiddle p, .TeaserBottom p { position: relative; width: 140px; color: #333; text-align: left; padding: 0; }
.TeaserMiddle p { font-size: 1.2em; }
.TeaserMiddle p.center { text-align: center }
.TeaserBottom p { font-size: 1.1em; }
.TeaserBottom p.center { text-align: center }
.TeaserMiddle a, .TeaserBottom a { text-decoration: none; color: #971299 } /* #CE2410 */
/* #Teaser .sec6tc a, #Teaser .sec6tf a, #Teaser .sec6mf a, #Teaser .sec6mc a, #Teaser .sec6bf a, #Teaser .sec6bf a, #Teaser .sec6bc a {color: #CE2410} */
.TeaserMiddle img { margin-top: 6px; margin-bottom: 6px}
.TeaserMiddle a img { border:none}
.TeaserTop h4, .TeaserTop h4 a, h5, h5 a {  width: 160px; font-weight: bold; color: white }
.TeaserTop h4 {  font-size: 18px; }
.TeaserTop h5 {  font-size: 12px; }
/* .TeaserTop.sec5tc h4, .TeaserTop.sec5tc h5  { color: #666; }
.TeaserTop.sec3tc h5  { color: white; } */
.TeaserMiddle span.right { position: absolute; bottom: 0; right: 0; margin: 0; padding: 0;}

.TeaserMiddle a.curteach { font-weight: bold }

#Footer p, #Footer a, #Footer a:link, #Footer a:visited { color: #ababab}
#Footer a:focus, #Footer a:hover {color: #650C66}
#Footer p { color: #ababab; font-size: 1em; font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; display: inline; position: relative; top: 0.5em }

/* BACKGROUNDS */
.bl {
background: url(../layout/bl.png) bottom left no-repeat;
_background: url(../layout/bl8.png) bottom left no-repeat
}
.bl_h {
background: url(../layout/bl_horaires.png) bottom left no-repeat;
/*_background: url(../layout/bl8.png) bottom left no-repeat*/
}
.br {
background: url(../layout/br.png) bottom right no-repeat;
_background: url(../layout/br8.png) bottom right no-repeat
}
.br_h {
background: url(../layout/br_horaires.png) bottom right no-repeat;
/*_background: url(../layout/br8.png) bottom right no-repeat */
}
.tl {
background: url(../layout/tl.png) top left no-repeat;
_background: url(../layout/tl8.png) top left no-repeat
}
.tl_h {
background: url(../layout/tl_horaires.png) top left no-repeat;
/*_background: url(../layout/tl8.png) top left no-repeat*/
}
.tr {
background: url(../layout/tr.png) top right no-repeat;
_background: url(../layout/tr8.png) top right no-repeat
}
.tr_h {
background: url(../layout/tr_horaires.png) top right no-repeat;
/*_background: url(../layout/tr8.png) top right no-repeat*/
}
body  { background-repeat: no-repeat; background-attachment: fixed; }
body#chakra1 { background-image: url(../layout/chakra1.jpg); background-position: center -20px; } 
body#chakra2 { background-image: url(../layout/chakra2.jpg); background-position: center 8px }
body#chakra3 { background-image: url(../layout/chakra3.jpg); background-position: center -78px }
body#chakra4 { background-image: url(../layout/chakra4.jpg); background-position: center -76px }
body#chakra5 { background-image: url(../layout/chakra5.jpg); background-position: center -72px }
body#chakra6 { background-image: url(../layout/chakra6.jpg); background-position: center -58px } 
body#chakra7 { background-image: url(../layout/chakra7.jpg); background-position: center -61px }

.sec2tc { background-image: url(../layout/9tf.png); }
.sec2tf { background-image: url(../layout/9tc.png); }
.sec2mc { background-image: url(../layout/9mf.png); }
.sec2mf { background-image: url(../layout/9mc.png); }
.sec2bc { background-image: url(../layout/9bf.png); }
.sec2bf { background-image: url(../layout/9bc.png); }

.sec3tc { background-image: url(../layout/9tf.png); }
.sec3tf { background-image: url(../layout/9tc.png); }
.sec3mc { background-image: url(../layout/9mf.png); }
.sec3mf { background-image: url(../layout/9mc.png); }
.sec3bc { background-image: url(../layout/9bf.png); }
.sec3bf { background-image: url(../layout/9bc.png); }

.sec4tc { background-image: url(../layout/9tf.png); }
.sec4tf { background-image: url(../layout/9tc.png); }
.sec4mc { background-image: url(../layout/9mf.png); }
.sec4mf { background-image: url(../layout/9mc.png); }
.sec4bc { background-image: url(../layout/9bf.png); }
.sec4bf { background-image: url(../layout/9bc.png); }

.sec5tc { background-image: url(../layout/9tf.png); }
.sec5tf { background-image: url(../layout/9tc.png); }
.sec5mc { background-image: url(../layout/9mf.png); }
.sec5mf { background-image: url(../layout/9mc.png); }
.sec5bc { background-image: url(../layout/9bf.png); }
.sec5bf { background-image: url(../layout/9bc.png); }

.sec6tc { background-image: url(../layout/9tf.png); }
.sec6tf { background-image: url(../layout/9tc.png); }
.sec6mc { background-image: url(../layout/9mf.png); }
.sec6mf { background-image: url(../layout/9mc.png); }
.sec6bc { background-image: url(../layout/9bf.png); }
.sec6bf { background-image: url(../layout/9bc.png); }

.sec7tc { background-image: url(../layout/9tf.png); }
.sec7tf { background-image: url(../layout/9tc.png); }
.sec7mc { background-image: url(../layout/9mf.png); }
.sec7mf { background-image: url(../layout/9mc.png); }
.sec7bc { background-image: url(../layout/9bf.png); }
.sec7bf { background-image: url(../layout/9bc.png); }

#dd    { background: url(../layout/ddvibes_ov.gif) no-repeat left bottom; display: block; position: relative; top: 2px; left: 0; width: 80px; height: 22px }	
#dd a  { background: url(../layout/ddvibes.gif) no-repeat left bottom; display: block; width: 80px; height: 22px }
#dd a:hover {
background: transparent none }