/**
*  url("../images/   umwandeln in  url("/fileadmin/salsafreaks/images/
*
*/

/* BASICS */
* {margin:0;padding:0}

html, body {
  height: 100%; /* Anzeigebereich in der Vertikalen auf 100% strecken */
}

body {
  color: #000;
  font:83%/1.5 arial,tahoma,verdana,sans-serif;
  padding-top: 0;
  padding-right: 0;
  padding-bottom: 20px;
  padding-left: 0;
  background-attachment: scroll;
  background-color: #000;
  
  background-image: url(/fileadmin/salsafreaks/images/bg_home.jpg);
  
  background-repeat: no-repeat;
  background-position: left top;
}


/* GENERAL */
img {border:none} 
hr {margin: 1em 0;background:#f2f2f2;height:1px;color:#f2f2f2;border:none;clear:both}
.clear {clear:both;position:relative;font-size:0px;height:0px;line-height:0px} 


/* LINKS */

a, a:link, a:hover {
  text-decoration:none;
  cursor:pointer;
  font-weight: bold;
  color: #499DD4;
}
a:link { color:#c00 } 
/* a:visited {color:#840000} */
a:hover, a:active { color:#333 }

/* FORMS */
/*
form {margin: 0 0 1.5em}
input {font-family: arial,tahoma,verdana,sans-serif;margin: 2px 0}
fieldset {border: none}
label {display:block;padding: 5px 0}
label br {clear:left}
*/

/* TYPOGRAPHY */
p, ul, ol {
  margin: 0 0 0.8em
}


h1, h2, h3, h4, h5, h6 {
  font-family: arial,verdana,sans-serif;
  color: #961365;
  padding-bottom: 0.1em;
  margin-top: 1.2em;
  margin-right: 0;
  margin-bottom: 0.8em;
  margin-left: 0;
}

h1 { font-size: 24px; text-transform: uppercase; font-weight: bold }
h2 { font-size: 18px; text-transform: uppercase; font-weight: bold }
h3 { font-size: 13px; font-weight: bold }
h4 { font-size: 12px; font-weight: bold }
h5 { font-size: 9px; font-weight: bold }
h6 { font-size: 96%; letter-spacing:.1em;word-spacing:.8em }

h1.csc-firstHeader {
  text-transform: uppercase;
}

div.csc-header h2, div.csc-header h3, div.csc-header h4, div.csc-header h5, div.csc-header h6 { color: #008d58 }

div.csc-header h1 { margin-top:.6em }
div.csc-header h2 { margin-top: 30px }
div.csc-header h3 { margin-top: 20px }
div.csc-header h4 { margin-top: 20px }




.csc-frame div.csc-header h2, .csc-frame div.csc-header h1 {
  margin-top: 10px
}

.csc-frame .csc-firstHeader, div.csc-header h1.csc-firstHeader, div.csc-header h2.csc-firstHeader, div.csc-header h3.csc-firstHeader, div.csc-header h4.csc-firstHeader, div.csc-header h5.csc-firstHeader, div.csc-header h6.csc-firstHeader {
  margin-top: 0
}

.highlight {color:#E17000}
.subdued {color:#999}
.error {color:#c00;font-weight:bold}
.success {color:#390;font-weight:bold}
.caption {color:#999;font-size:11px}
.date {font: bold 82% arial;color:#bbb;display:block;letter-spacing: 1px}
small {font-size:11px}
.small {font-size:86%}


/* LISTS */
#content ul {
  margin-top: 0.3em;
  margin-right: 0;
  margin-bottom: 1.5em;
  margin-left: 3em;
}

#content ul.related {margin-top: -1em}
#content ol {margin: .5em .5em 1.5em}
#content ol li {margin-left: 1.4em;padding-left: 0;background: none; list-style-type: decimal}

li {line-height: 1.4em;padding-left: 25px;background: transparent url("/fileadmin/templates2/images/sprites.gif") no-repeat 0 0}
li {line-height: 1.4em;padding-left: 25px;background: transparent url("/fileadmin/templates2/images/mainnav/list2.gif") no-repeat 5px 7px}


#content li.doc {background-position: 3px -500px}
#content ul.nomarker li {background:none;padding-left:0}

#content dl {margin: 0 0 1em 0}
#content dt {font-weight:bold;margin-top: 1.3em}
#content dl dl {margin: 0 0 1.5em 30px}

/* Auf der Startseite hatten die Grafiken etwas zu groï¿½e Abstï¿½nde nach unten. */ 
#content dl.csc-textpic-image { 
  margin:0
}


/*  
  .featurebox {color:#333;padding: 15px 20px 20px;border-top: 1px solid #d7d7d7;margin: 0 0 1.5em;background: #f6f6f6 url("/fileadmin/templates2/images/featurebox_bg.jpg") no-repeat 100% 100%}
  .featurebox p, .featurebox h1, .featurebox h2, .featurebox h3, .featurebox h4, .featurebox h5, .featurebox h6 {margin: 0 0 .3em;border-bottom: 1px solid #c00;color:#c00}
  .featurebox p {border:none;margin: 0 0 1em;color:#444}
  .featurebox a {font-weight:bold}
*/

/*
  .thumbnail {margin: 0 0 0 10px;position:relative;z-index:9999;border: 1px solid #eee;float:right;width:100px;padding:5px;background:#fff}
  .thumbnail img {border: 1px solid #000}
*/  

/*  
  #resultslist-wrap {margin: 0 0 1.5em;font-size:92%}
  #resultslist-wrap dt, #resultslist-wrap dl {margin: 0}
  #resultslist-wrap dt {font: bold 85% arial;padding: 3px 0}
  #resultslist-wrap li {padding: 0 0 1em;margin:0 0 0 1.2em;font: bold 145% arial}
  #resultslist-wrap li dd {font: normal 73% arial}
  #resultslist-wrap li dl {margin:0}
  #resultslist-wrap dd {line-height:1.3}
  #resultslist-wrap dd.filetype, #resultslist-wrap dd.date {color:#999;display:inline;padding-right:.5em}
*/

   
/* 'MORE' LINK - provides an accessible alternative to just using 'more' as a link at the end of paragraphs */
a.morelink:link, a.morelink:visited, a.morelink:hover, a.morelink:active {background: transparent url("/fileadmin/templates2/images/sprites.gif") no-repeat 5px -500px;padding-left:21px}
a.morelink:hover {background: transparent url("/fileadmin/templates2/images/sprites.gif") 5px -400px}
.morelink span {position:absolute;left:-9999px;width:900px}
    

/******************************************************************************/


  
  /* NAV - top horizontal nav */
  #nav, #nav ul {padding: 0;margin: 0;list-style: none}
  #nav {
    height:2.09em;
    font: 86% arial;
    margin-top: 0;
    margin-right: 5px;
    margin-bottom: 0;
    margin-left: 5px;
  }
  #nav li { position:relative; float: left;width: 10em; display:block;margin: 0; padding:0 }
  #nav a, #nav a:link, #nav a:visited, #nav a:hover, #nav a:active {
    text-decoration:none;
    cursor:pointer;
    color:#fff;
    display: block;
    padding-top: 4px;
    padding-right: 30px;
    padding-bottom: 2px;
    padding-left: 0px;
    font-weight: normal;
  }
  
  #nav a:hover {
    color:#FFF;
    font-weight: bold;    
  }
  
  
  #nav li ul {border-left: 1px solid #c00;background: #f6f6f6 url("/fileadmin/templates2/images/featurebox_bg.jpg") no-repeat 100% 100%;width:15.8em;font-size:90%;margin-top:3px;position: absolute;font-weight:normal;left: -999em}
  #nav li:hover ul, #nav li.sfhover ul {left: 0;z-index:99999}
  
  #nav li li {background:none;float:none;border:none;border: 1px solid #999;border-top:1px solid #fff;border-right:none;border-left:none;padding-left:0}
  #nav li li.last {border-bottom:none}
  #nav li li a, #nav li li a:link, #nav li li a:visited, #nav li li a:hover {color:#000;padding: 3px 10px 2px;width:14em}
  #nav li li a:hover {color:#fff;background:#c00}
  
  #nav li.active {background: #c00;border-bottom: 3px solid #c00}
  #nav li.active ul {border:none;background: #c00 url("/fileadmin/templates2/images/featurebox2_bg.gif") no-repeat 100% 100%}
  #nav li.active a:link, #nav li.active a:visited, #nav li.active a:hover, #nav li.active a:active {}
  #nav li.active a:hover {color:#000}
  
  #nav li.active li {border:none;border-top: 1px solid #c15c5c;border-bottom: 1px solid #870000}
  #nav li.active li.last {border-bottom: none}
  #nav li.active li a:link, #nav li.active li a:visited, #nav li.active li a:hover, #nav li.active li a:active {color:#fff}
  #nav li.active li a:hover {background: #666 url("/fileadmin/templates2/images/sprites.gif") repeat-x 0 99%;color:#fff}
  
  #nav li.active li.active a:link, #nav li.active li.active a:visited, #nav li.active li.active a:hover, #nav li.active li.active a:active {color:#fff;font-weight:bold;background: #666 url("/fileadmin/templates2/images/sprites.gif") repeat-x 0 99%}

  /* hide from IE mac \*/
  #nav li {width:auto}
  /* end hiding from IE5 mac */
  
  

/* LAYOUT - main body of page */
#wrap {
  width:960px;

  min-height: 100%; /* Mindesthï¿½he in modernen Browsern */
  height: auto !important; /* !important-Regel fï¿½r moderne Browser */
  height: 100%; /* Mindesthï¿½he in IE (<7) */
}

#banner-wrap {
  position:relative;
  width:100%;
  height: 140px;
}

#content-wrap { position:relative; width:100%; }
  
  #utility {
    position:relative;
    float:left;
    top:0;
    left:0;
    width:250px;
    padding-top: 20px;
    padding-bottom: 40px;
    padding-left: 15px;
    padding-right: 10px;
  }

  #sidebar {position:absolute;top:0;right:25px;width:20%;border-top: 5px solid #999;padding-top: 1px;padding-bottom: 40px}

#content-top {
  margin-top: 0;
  margin-right: 50px;
  padding-bottom: 0;
  margin-left: 50px;
  height: 100px;
}
  
  
/*******************
* Subtitle2
*/

#subtitle2 {
  background-color: #C33;
  text-align: center;
  margin-left: 10px;
  margin-right: 10px;
  padding-left: 10px;
  padding-right: 10px;
  width: 25%;
  color: #FFF;
  float:right;
  font-size: 86%;
  font-weight: bold;
  text-transform: uppercase;
}

#content {
  padding-left: 20px;
  padding-right: 20px;
  min-height:400px;
  height:auto !important;
  height:400px;
}

div.startseite #content {
  margin-left: 420px;
  margin-top: 150px;
}

div.startseite #content, div.startseite #content-bottom-1 {
  color: #FFF;
}

div.startseite #content-bottom-1 {
  padding-left:20px;
  padding-right:20px;
}




#mainblock-top {
  background-image: url(/fileadmin/salsafreaks/images/bg_content.gif);
  background-repeat: no-repeat;
  height: 75px;
  background-position: left bottom;
}


#mainblock {
  padding-top: 20px;
  background-color: #FFF;
}

.startseite #mainblock {
  background-color: transparent;	
}



#nav-top2 {margin: 0; padding: 0}

  


/* SECONDARY NAVIGATION - vertical navigation */
  
  #nav-secondary, #nav-secondary ul {position:static}
  
  #nav-secondary, #nav-secondary li {list-style:none;margin:0;padding:0;}
  
  #nav-secondary {
    width: 230px;
    padding-top:10px;
    padding-bottom:30px;
  }
  
  #nav-secondary a {
    line-height:1.1em;
    padding: 5px 0 5px 23px;
    display:block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 86%;
    font-weight: bold;
    color: #fff;
  }
  
  #nav-secondary a, #nav-secondary a:link, #nav-secondary a:visited, #nav-secondary a:hover, #nav-secondary a:active {
    text-decoration:none;
    cursor:pointer
  }
  
  
  #nav-secondary a:hover {
    color: #961365;
    font-weight: bold;
  }
  

/* SECONDARY NAVIGATION - 2nd TIER */
  #nav-secondary ul {
    margin-left: 10px;
  }
  
  #nav-secondary li a {
    font-weight: bold;
    line-height: 0.9em;
    font-size: 14px;
    text-transform: uppercase;
    color: #ffed00;
  }
  
  #nav-secondary li li a {
    color: #fff;
  }
  

/* SECONDARY NAVIGATION - 3rd TIER */
  #nav-secondary ul ul { color: #fff; margin: 0 0 1em 13px; padding:0 }
  #nav-secondary li.active li.active li a, #nav-secondary li.active li.active li a:link, #nav-secondary li.active li.active li a:visited {width:117px}
  #nav-secondary li.active li.active li a:link, 
  #nav-secondary li.active li.active li a:visited, 
  #nav-secondary li.active li.active li a:hover, 
  #nav-secondary li.active li.active li a:active {font-weight:normal}
  #nav-secondary li.active li.active li.active a:link, 
  #nav-secondary li.active li.active li.active a:visited, 
  #nav-secondary li.active li.active li.active a:hover, 
  #nav-secondary li.active li.active li.active a:active {font-weight:bold}


  
  #nav-secondary li.bM_CUR a, #nav-secondary li.bM_CURIFSUB a {
    color: #961365;    
  }
  

  #nav-secondary li li.bM_NO a {
    color: #FFFFFF;
    font-weight: normal;
  }
  
  
  
#logo {
  
}

#logo a {
  height: 122px;
  width: 220px;
  position: relative;
  z-index: 200;
  left: 0;
  top: 0;
  display: block;
}

#logo a span {
  display: none;
}

/**********************************
* NEWS, wird nun von BOX bestimmt
*/

#news {
    width: 230px;
  color: #333;
  font-size: 86%;
}

#news li {
  margin-left: 20px;
}


#news div.frame-salsa, #news div.frame-gesellschaftstanz, #news div.frame-veranstaltungen {
  margin-top:20px;
  padding-top:10px;
  padding-bottom:30px;
  padding-right: 10px;
  padding-left: 10px;
  background-color: #FFFFFF;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  background-position: right bottom;
  background-image: url(../images/geschwungener-kreis/grau-transparent-20.jpg);
  background-repeat: no-repeat; 

}

#news div.frame-salsa a:hover, #news div.frame-gesellschaftstanz a:hover, #news div.frame-veranstaltungen a:hover {
    color: #555555;
}



/**********************************
* Footer Menï¿½ und "TO TOP"-Link
*/

/* LAYOUT - FOOTER */

#footer {
  clear:both;
    bottom: 0;
  background-color: #961365;
  border-top-width: 1px;
  border-top-style: solid;
  border-top-color: #FFFFFF;
  font-size:86%;
  color: #FFF;
  margin-top: 60px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 30px;
  padding-left: 20px;
}

div.startseite #footer {
  background-color: transparent !important;
  border-top-color: #961365;
}


  #footer p {margin:0}
  
  #footer a {
    color: #ffed00;
    text-decoration: none;
    text-transform: uppercase;
  }

  #footer a:hover {
    color: #FFFFFF;
  }

div.startseite #footer a {
    color: #961365;
}

  
.csc-linkToTop a {
  color: #3366FF;
  text-decoration: none;
  font-size: 86%;
  text-transform: uppercase;
}

.csc-linkToTop a:hover {
  color: #FFFFFF;
}




/* ***************** */
div.startseite div#content p {
  font-size:86%;
}

body.startseite #breadcrumb {
  visibility: hidden;  
}

/* ***************** */


body.base #content h1 {
  color: #FFF;
}

body.base #content h2, body.base #content h3, body.base #content h4, body.base #content h5, body.base #content h6 {
  color: #DDDFFF;
}

body.base #content a {
  color: #9CF;
}

body.base #content a:hover {
  color: #99F;
  text-decoration: none;
}

/**
Links in Frames
**/


div.frame-salsa a {
  color: #FFB652;
}

div.frame-gesellschaftstanz a {
  color: #97C5EB;
}

div.frame-veranstaltungen a {
  color: #C13405;
}

div.frame-salsa a:hover,
div.frame-gesellschaftstanz a:hover,
div.frame-veranstaltungen a:hover {
  color: #FFFFFF;
}




/**
ï¿½berschriften in Frames
**/


div.frame-salsa h1, div.frame-salsa h2, div.frame-salsa h3, div.frame-salsa h4, div.frame-salsa h5, div.frame-salsa h6 {
  color: #FFB652;
}

div.frame-gesellschaftstanz h1, div.frame-gesellschaftstanz h2, div.frame-gesellschaftstanz h3, div.frame-gesellschaftstanz h4, div.frame-gesellschaftstanz h5, div.frame-gesellschaftstanz h6 {
  color: #97C5EB;
}

div.frame-veranstaltungen h1, div.frame-veranstaltungen h2, div.frame-veranstaltungen h3, div.frame-veranstaltungen h4, div.frame-veranstaltungen h5, div.frame-veranstaltungen h6 {
  color: #C13405;
}





/*
body.startseite .featurebox { color:#333; }
*/

/**********************************
* Typo3, ï¿½berschriften und Links in diesen
*/

.csc-header a {
  border-bottom-width: 1px;
  border-bottom-style: dotted;
  border-bottom-color: #000066;
  text-decoration: none;
  color: #000066;
}

.csc-header a:hover {
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #06C;
  text-decoration: none;
  color: #06C;
}


/**********************************
* Typo3, Rahmenlayout
*/

div.csc-frame-rulerBefore {
  border-top-width: 1px;
  border-top-style: dashed;
  border-top-color: #E8E8E8;
  width: 100%;
  float: left;
  padding-top: 20px;
  padding-bottom: 30px;

}

div.csc-frame-rulerAfter {
  border-bottom-width: 1px;
  border-bottom-style: dashed;
  border-bottom-color: #E8E8E8;
  width: 100%;
  float: left;
  padding-top: 20px;
  padding-bottom: 30px;
}

div.csc-frame-frame1 {
  border: 10px solid #8F9DCA;
  padding: 10px;
  background-color: #CCF;
  margin-top: 20px;
}

div.csc-frame-frame2 {
  border: 10px solid #F90;
  background-color: #333;
  padding: 10px;
  color: #FFF;
  margin-top: 20px;
}




/* Textformatierungen aus dem RTE */
.important{
  color: #C00;
}

.name-of-person {
  color: #069;  
}

.detail {
  color: #6C0;  
}

/**
FUNKTIONIERT NICHT !!!
dd.csc-textpic-caption {
  color: #000066;
  font-size: 86%;
}
*/


/***
* Sitemap, SEO
*/

/*
.tx-flseositemap-pi1 ul li.deep0 {
  color: #333;
  background-color: #69F;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #66F;
  padding-left: 10px;
  text-decoration: none;
  list-style-type: none;  
}

.tx-flseositemap-pi1 ul li.deep0 a {
  color: #333;
  display: block;
  text-decoration: none;
}

.tx-flseositemap-pi1 ul li.deep0 a:hover {
  color: #FFF;
  background-color: #36C;
}



.tx-flseositemap-pi1 ul li.deep1 {
  padding-left: 20px;  
}

.tx-flseositemap-pi1 ul li.deep2 {
  padding-left: 30px;  
}

.tx-flseositemap-pi1 ul li.deep3 {
  padding-left: 40px;  
}

.tx-flseositemap-pi1 li {
  list-style-type: none;  
}
*/

.tx-flseositemap-pi1 ul li.deep0 {
  margin-left: 10px;  
}

.tx-flseositemap-pi1 ul li.deep1 {
  margin-left: 25px;  
}

.tx-flseositemap-pi1 ul li.deep2 {
  margin-left: 40px;  
}

.tx-flseositemap-pi1 ul li.deep3 {
  margin-left: 55px;  
}

/**********************************
* Typo3, Tabellen
*/


table.contenttable {
  border-collapse:collapse; 
  width: 100%;
}

table.contenttable th {
  padding: 2px;
  color: #ffed00;
  font-size: 130%;
  font-weight: bold;
  text-transform: uppercase;
  background-color: #961365;
}

table.contenttable td {
  font-size: 100%;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #961365;
  padding: 2px;
}

table.contenttable td.w50, table.contenttable th.w50 {
  width: 50px;
}

table.contenttable td.w100, table.contenttable th.w100 {
  width: 100px;
}

table.contenttable td.w150, table.contenttable th.w150 {
  width: 150px;
}

table.contenttable td.w200, table.contenttable th.w200 {
  width: 200px;
}


table.contenttable td.td-last {
  border-right-width: 1px;
  border-right-style: solid;
  border-right-color: #961365;
}

table.contenttable tr.tr-odd td {
  background-color: #FFF;
}

table.contenttable tr.tr-even td {
  background-color: #F8F8F8;
}

/*
body.salsa table.contenttable tr.tr-odd td {
  background-color: #A37415;
}

body.salsa table.contenttable tr.tr-even td {
  background-color: #FC3;
}
*/



.contenttable-1 {
    text-align:left;
    border: 5px solid #CCF;
    border-collapse:collapse;
}
  
  
.contenttable-2 {
    text-align:left;
    border: 2px solid #F60;
    border-collapse:collapse;
    width:100%
}

.contenttable-2 th {
    text-align:left;
    border: 1px solid #fff;
    background-color: #6C3;
    color: #666;
}

.contenttable-3 {border: 2px solid #900;border-collapse:collapse;width:100%}
.contenttable-3 td {background: #fff url("/fileadmin/templates2/images/sprites.gif") repeat-x 0 -1600px;padding:3px;border: 1px solid #fff}
.contenttable-3 th {text-align:left;border: 1px solid #fff}
.contenttable-3 thead th {color:#fff;font-size:145%;background: #900 url("/fileadmin/templates2/images/sprites.gif") repeat-x 0 -1300px;padding: 10px 6px}
.contenttable-3 tbody th {color:#fff;font-size:115%;background: #88b8db url("/fileadmin/templates2/images/sprites.gif") repeat-x 0 -1400px;padding: 6px}
.contenttable-3 tbody th.sub {font-size:100%;color:#000;background: #efefef url("/fileadmin/templates2/images/sprites.gif") repeat-x 0 -1500px;padding: 6px}


/**********************************
* Typo3, LAYOUT - Spalten
*/
.col-50 {
  width: 300px;
  float: left;
  padding-left: 5px;
  padding-right: 5px;
}

.col-33 {
  width: 190px;
  float: left;
  padding-left: 5px;
  padding-right: 5px;
}

.col-66 {
  width: 400px;
  float: left;
  padding-left: 5px;
  padding-right: 5px;
}

/*
.colborder {
  border-right-width: 1px;
  border-right-style: dashed;
  border-right-color: #E8E8E8;
}
*/


/**********************************
* Typo3, MailForm
*/

/* Formular */
fieldset.csc-mailform {
  border: 10px solid #8F9DCA;
  padding: 10px;
  background-color: #CCF;  
}

fieldset.csc-mailform label {
  width: 30%;
  float: left;
  text-align: right;
  margin-right: 10px;
  display: block;
}


fieldset.csc-mailform input,
fieldset.csc-mailform textarea {
  margin-bottom: 10px;
  font-family: Verdana, Helvetica, sans-serif;
  border: 2px solid #E8E8E8;
  padding:2px;
  width: 60%;
}

.csc-mailform-radio fieldset legend {
  visibility: hidden;
}

.csc-mailform input.csc-mailform-radio {
  width: 10px;
  margin-right: 5px;
  float: left;
}

.csc-mailform-radio fieldset label {
  width: 60px;
  margin-right: 20px;
  text-align: left;
}


.csc-mailform-submit {
  float: right;
  margin-right: 50px;
  width: 150px !important;
}


#mailformformtype_mail {
  padding:2px;
  margin-left:40px;
  background:#eee;
  border:1px solid #ccc;
  width:80px;
  text-align:center;
}





/* CSS-Box säubern */
.floatbox { overflow:hidden; }


/* Clearfix-Methode zum Clearen der Float-Umgebungen */
.clearfix:after {
   content: ".";
   display: block;
   height: 0;
   clear: both;
   visibility: hidden;
}

/* Diese Angabe benï¿½tigt der Safari-Browser zwingend !! */
.clearfix { display: block; }


#star-u18 {
  position: absolute;
  z-index: 100;
  left: 672px;
  top: 79px;
}


h2.imageheader {
     height:26px;
     background-repeat:no-repeat;
     padding: 0;
     margin: 0;
}


h2.imageheader strong{
       display:none;
}

