/* basic stylesheet for www.surfschule-norddeich.de/ */
/* author: www.ideenwerft.com */

* {padding:0px;margin:0px;}
img {border:0;}

body {font-size:13px;font-family:arial,tahoma,verdana,Sans-Serif;color:#282828; text-align:center;background: url(img/background.jpg) #000 center top no-repeat ; line-height:18px; margin:0;}

#wrapper { position:relative;width:990px; text-align:left; margin:0 auto;background-color:#fff;}
#top { height:140px; background:url(img/bg_wolken.jpg) left #fff no-repeat;}
#head { width:680px; float:left; position:relative;}
#aktuell { position:relative;width:250px; float:right; height:247px; background:#0a7fd0 url(img/aktuell_box_bg.gif) no-repeat; color:#fff;overflow:auto; padding:45px 30px 0;font-size:12px;}
#content { position:relative; width:600px; float:left; padding:25px 40px 35px;}
#cLeft { width:281px; float:left; margin-top:20px;}
#cRight { width:281px; float:right;margin-top:20px;}
.teaserBox { width:249px; float:right; background-color:#f4f4f4; padding:15px 30px 5px; border-bottom:1px #919191 dotted; border-left:1px #919191 dotted;}
#footer { width:990px;  margin:0 auto; text-align:left;}
#right { width:310px; float:right;font-size:12px;}



/* +++ common styles +++ */
.small {font-size: 0.9em;}
.xsmall {font-size: 0.8em;}
.red, .error {color:#c00;}
.grey {color:#999;}
.clear {clear:both;}
.italic {font-style:italic;}
.hide {display:none;}

/* links */
a:link, a:visited {color: #737373; text-decoration:none; }
a:hover, a:focus {color: #c9231c;outline:none;}
a.internal-link,
a.pdf { color:#006ab3; background:url(img/arrow_blue.gif) no-repeat left ; padding-left:10px;}
.external-link {background:url(img/arrow_blue.gif) no-repeat left ; padding-left:10px; }
.external-link:link, .external-link:visited {color:#006ab3; }
.external-link:hover, .external-link:focus { color:#86bdf2;}
.extra-navi:link, .extra-navi:visited { background:url(img/extra-navi.gif) top left no-repeat;color:#595959; background-color:#e2e2e2;padding:5px 10px 4px 15px;  text-decoration:none; }
.extra-navi:hover, .extra-navi:focus { background:url(img/extra-navi.gif) bottom left no-repeat;color:#006ab3;background-color:#e2e2e2 }

p {margin-bottom:15px;}

h1 { margin-bottom:10px; line-height:30px;font-size:24px;}
h2 { margin-bottom:10px; line-height:21px;font-size:18px; }
h3 { margin-bottom:10px;} 

.csc-te xtpic-image { border:1px #898989 solid;} 
.csc-textpic-text { margin-bottom:25px;}
.align-right {text-align:right;}
.htmlarea-showtableborders td { padding:0 5px ;}

ul { margin-bottom:10px;}
li { list-style-position:inside; }

/* formulare */
form input, form textarea {font-size: 1em;color:#666;}
form input:focus, form textarea:focus {background-color:#99CCFF;color:#000;}

/* TOP  ( Logo, Flaggen, Subnavi) */
.logo { margin:20px 40px 0; float:left;}
#top ul { width:266px; height:80px; float:right; margin-top:20px; line-height:20px; margin-right:13px; list-style:none; font-size:12px;}
#top li { width:113px; float:right;}
#top ul a:link, #top ul a:visited { color:#595959; background:url(img/listenpunkt_navi.gif) top left no-repeat; padding-left:20px; }
#top ul a:hover, #top ul a:focus { background:url(img/listenpunkt_navi.gif) center left no-repeat;color:#006ab3; font-weight:bold; }
#top ul .cur a:link, #top ul .cur a:visited { background:url(img/listenpunkt_navi.gif) bottom left no-repeat;color:#006ab3; font-weight:bold; }
/* FLAGS */
.flag_spiekeroog:link, .flag_spiekeroog:visited { 
position:absolute;top:-2px;left:460px; display:block;
background:url(img/flag_spiekeroog.png) right top no-repeat; width:62px; height:192px;}
.flag_spiekeroog:hover, .flag_spiekeroog:focus {top:0;background:url(img/flag_spiekeroog.png) left top no-repeat;}

.flag_kitersclub:link, .flag_kitersclub:visited { 
position:absolute;top:-2px;left:525px; display:block;
background:url(img/flag_kitersclub.gif) right top no-repeat; width:62px; height:192px;}
.flag_kitersclub:hover, .flag_kitersclub:focus {top:0;background:url(img/flag_kitersclub.gif) left top no-repeat;}

.flag_achensee:link, .flag_achensee:visited { 
position:absolute;top:-2px;left:590px; display:block;
background:url(img/flag_achensee.gif) right top no-repeat; width:62px; height:192px;}
.flag_achensee:hover, .flag_achensee:focus {top:0;background:url(img/flag_achensee.gif) left top no-repeat;}

.flag_vdws:link, .flag_vdws:visited { 
position:absolute;top:-2px;left:655px; display:block;
background:url(img/vdws_flagge.gif) right top no-repeat; width:62px; height:192px;}
.flag_vdws:hover, .flag_vdws:focus {top:0;background:url(img/vdws_flagge.gif) left top no-repeat;}

.flag_supclub:link, .flag_supclub:visited { 
position:absolute;top:-2px;left:525px; display:block;
background:url("img/flag_supclub.gif") right top no-repeat; width:62px; height:192px;}
.flag_supclub:hover, .flag_supclub:focus {top:0;background:url("img/flag_supclub.gif") left top no-repeat;}

/* HEAD (Grafik, Navigation mit den Sportarten, Detailnavigation) */
#head li {display:inline;margin-left:20px;}
.navi { position:absolute; background-color:#000; text-transform:uppercase; font-weight:bold; list-style:none; list-style-position:inside; height:22px; padding:6px 20px 0; color:#fff;}
.navi  a:link, .navi  a:visited { color:#fff;}
.navi  a:hover, .navi  a:focus { color:#0a7fcf;}
.navi .cur a:link, .navi .cur a:visited {color:#0a7fcf;}
.subnavi { background:#fff url(img/naviDetail_bg.gif) repeat-x; height:31px; padding-top:4px; padding-left:20px;  position:absolute; width:660px; left:0; top:267px; font-size:12px;}
#head .subnavi li {margin-left:15px; float:left; font-size:1.1em;}
#head .subnavi li.first {margin-left:20px;}
.subnavi  a:link, .subnavi  a:visited { color:#fff; display:block;background:url(img/naviDetail_current.gif) 0 40px no-repeat;}
.subnavi  a:hover, .subnavi  a:focus { color:#0a7fcf;background:url(img/naviDetail_current.gif) no-repeat bottom;display:block;padding-bottom:13px;}
.subnavi .cur { color:#0a7fcf;background:url(img/naviDetail_current.gif) no-repeat bottom;display:block;padding-bottom:13px;}
.facebook { position:absolute; top:-16px; left:-28px;} 



/* NEUES VON NORDDEICH BOX */
#aktuell h2  {position:absolute;top:0;right:0; display:inline;background-color:#3388c3; text-transform:uppercase; font-weight:bold; padding:4px 20px; font-size:1.1em;}
#aktuell p { margin-bottom:10px; background:url(img/aktuell_line.gif) repeat-x left bottom; padding-bottom:10px; width:250px}
#aktuell .internal-link:link, #aktuell .internal-link:visited,
#aktuell .external-link:link, #aktuell .external-link:visited,
#aktuell .external-link-new-window:link, #aktuell .external-link-new-window:visited { color:#fff; background:url(img/arrow.gif) no-repeat 0 4px ; padding-left:10px; font-size:1em; text-decoration:none;}
#aktuell .internal-link:hover, #aktuell .internal-link:focus {color:#86bdf2;text-decoration:underline;}
h6 a:link, h6 a:visited { color:#fff; background:url(img/arrow.gif) no-repeat 5px ; padding-left:15px; font-size:0.9em; text-decoration:none}
h6 a:hover, h6 a:focus { color:#86bdf2; background:url(img/arrow.gif) no-repeat 5px ; padding-left:15px; font-size:0.9em; text-decoration:none}
.aktuellH1 { padding-bottom:10px;}

/* EVENT-BOX */
.kb_eventboard h6 {font-size:1.1em;font-weight:normal;}
.kb_eventboard {margin-bottom:7px; color:#444;}
.kb_eventboard span.kb_eventboard_date { font-weight:bold; color:#727272;}

/* CONTENT */
#content li {list-style-position:outside; margin-left:14px;}

.shop table {border-top:1px solid #999 !important;border-left:1px solid #999 !important;}
.shop table td {border-bottom:1px solid #999;border-right:1px solid #999;}

/* rechte Spalte*/


/* TEASER */
.teaserBox .internal-link   { color:#006ab3; background:url(img/arrow_blue.gif) no-repeat left ; padding-left:10px; }
.teaserBox  a:link, .teaserBox    a:visited { color:#006ab3;}
.teaserBox   a:hover, .teaserBox   a:focus { color:#86bdf2;}
.teaserBox p, .teaserBox ul { color:#727272; margin-bottom:10px;}
.teaserBox  { color:#006ab3;}


/*FOOTER */
#footer ul { list-style:none; color:#fff; margin-top:10px; width:500px; float:left; height:30px;}
#footer a:link, #footer a:visited { color:#fff;}
#footer a:hover, #footer a:focus { color:#86bdf2;}
#footer li { display:inline; margin-right:15px;}
#footer a.copy:link, #footer a.copy:visited { float:right; margin-top:10px; color:#fff; text-align:right; background:url(img/ideenwerft-anker.gif) right 0 no-repeat; display:block; padding-right:22px; text-align:right;}
#footer a.copy:hover, #footer a.copy:focus { background:url(img/ideenwerft-anker.gif) right -30px no-repeat; color:#931229}

/* FORMULAR POWERMAIL */
DIV.powermail_mandatory_js {color:#CC0000;margin-bottom:5px;}
span.powermail_mandatory {color:#c00;}
DIV.tx-powermail-pi1 {border:1px solid #CCCCCC;margin-bottom:20px;}
DIV.tx-powermail-pi1 fieldset {border:none;margin: 5px 0px 0px;}
DIV.tx-powermail-pi1 fieldset legend {font-weight:bold;font-size: 1.1em;padding:15px 0 10px 20px;color:#333;}
DIV.tx-powermail-pi1 fieldset div.tx_powermail_pi1_fieldwrap_html {
clear:both;
margin:5px 0 5px 20px;
float:left;
width:90%;
display:inline;
}
DIV.tx-powermail-pi1 form label  {float:left;width:110px;}
DIV.tx-powermail-pi1 form input, DIV.tx-powermail-pi1 form textarea, DIV.tx-powermail-pi1 form select {margin-left: 5px;font-size:1.1em;}
DIV.tx-powermail-pi1 form textarea {font-size:1.2em;}
DIV.tx-powermail-pi1 input.powermail_submit {margin-left:113px;padding:2px;font-size: 1.1em;margin-bottom:15px;}
/*kontaktformular*/
input#uid31 {width:295px;}/*betreff*/
/* checkbox nach links */
.powermail_check_inner {position:relative;}
.powermail_check_inner label {padding-left:25px;width:400px !important;}
.powermail_check_inner input.powermail_check {position:absolute;top:0;left:0;}
/* anmeldung meisterschaft */
#powermaildiv_uid81 p {font-weight:bold;}
/*dankeseite*/
.tx-powermail-pi1_thx {padding:15px 20px;}

/* KURSBUCHUNG  */
DIV.kontaktForm .error {color:#c00;font-weight:bold;}
DIV.kontaktForm form p label  {float:left;width:100px;}
DIV.kontaktForm form p input, DIV.kontaktForm form p textarea, DIV.kontaktForm form p select {margin-left: 5px;font-size:1.1em;}
DIV.kontaktForm form p textarea {font-size:1.2em;}
DIV.kontaktForm input.submit {padding:2px;font-size: 1.1em;}
#content table.kurse {margin-bottom:10px;}
#content table.kurse p {margin-bottom:0;}
#content table.kurse tr td {padding: 5px 8px;}
#content table.kurse tr td.border {border-bottom:1px solid #ccc;}
#content table.kurse input {margin-top:3px;}

#content table.teilnehmer {margin-bottom:15px;}
#content table.teilnehmer th {font-size:0.9em;font-weight:normal;}
#content table.teilnehmer th, #content table.teilnehmer tr td {border-bottom:1px solid #ccc;padding: 2px;}

DIV.anmeldung DIV.pflicht {border: 1px solid #C00;float:left;display:inline;margin-bottom:15px;}

DIV.anmeldung DIV.pflicht table tr td {padding:10px;}

/* EXT:rgaccordion */
/* Toggle default */
h3.rgaccord1-toggle {
  font-weight:bold;
  color:#555;
  line-height: 26px;
  height: 23px;
  background: #ccc url(img/plus.png) 5px center no-repeat;
  padding:2px 0 2px 25px;
  cursor:pointer;
}

/* Toggle act item */
h3.act {color:#edf2f7;background:#6899ce url(img/minus.png) 5px center no-repeat;}

/* the content */
div.rgaccord1-content {}

/* remove margin of a CE */
div.rgaccord1-content .ce {margin-bottom:0;}

/* remove the header inside the CE, twice is not nice */
div.rgaccord1-content h1 {display:none;}



/* default styles for extension "tx_cssstyledcontent" */
/* Captions */
	DIV.csc-textpic-caption-c .csc-textpic-caption { text-align: center; }
	DIV.csc-textpic-caption-r .csc-textpic-caption { text-align: right; }
	DIV.csc-textpic-caption-l .csc-textpic-caption { text-align: left; }

	/* Needed for noRows setting */
	DIV.csc-textpic DIV.csc-textpic-imagecolumn { float: left; display: inline; }

	/* Border just around the image */
	DIV.csc-textpic-border DIV.csc-textpic-imagewrap .csc-textpic-image IMG {
		border: 2px solid black;
		padding: 0px 0px;
	}

	DIV.csc-textpic-imagewrap { padding: 0; }

	DIV.csc-textpic IMG { border: none; }

	/* DIV: This will place the images side by side */
	DIV.csc-textpic DIV.csc-textpic-imagewrap DIV.csc-textpic-image { float: left; }

	/* UL: This will place the images side by side */
	DIV.csc-textpic DIV.csc-textpic-imagewrap UL { list-style: none; margin: 0; padding: 0; }
	DIV.csc-textpic DIV.csc-textpic-imagewrap UL LI { float: left; margin: 0; padding: 0; }

	/* DL: This will place the images side by side */
	DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image { float: left; }
	DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image DT { float: none; }
	DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image DD { float: none; }
	DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image DD IMG { border: none; } /* FE-Editing Icons */
	DL.csc-textpic-image { margin: 0; }
	DL.csc-textpic-image DT { margin: 0; display: inline; }
	DL.csc-textpic-image DD { margin: 0; }

	/* Clearer */
	DIV.csc-textpic-clear { clear: both; }

	/* Margins around images: */

	/* Pictures on left, add margin on right */
	DIV.csc-textpic-left DIV.csc-textpic-imagewrap .csc-textpic-image,
	DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap .csc-textpic-image,
	DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap .csc-textpic-image {
		display: inline; /* IE fix for double-margin bug */
		margin-right: 10px;
	}

	/* Pictures on right, add margin on left */
	DIV.csc-textpic-right DIV.csc-textpic-imagewrap .csc-textpic-image,
	DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap .csc-textpic-image,
	DIV.csc-textpic-intext-right DIV.csc-textpic-imagewrap .csc-textpic-image {
		display: inline; /* IE fix for double-margin bug */
		margin-left: 10px;
	}

	/* Pictures centered, add margin on left */
	DIV.csc-textpic-center DIV.csc-textpic-imagewrap .csc-textpic-image {
		display: inline; /* IE fix for double-margin bug */
		margin-left: 10px;
	}
	DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-image .csc-textpic-caption { margin: 0; }
	DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-image IMG { margin: 0; }

	/* Space below each image (also in-between rows) */
	DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-image { margin-bottom: 5px; }
	DIV.csc-textpic-equalheight DIV.csc-textpic-imagerow { margin-bottom: 5px; display: block; }
	DIV.csc-textpic DIV.csc-textpic-imagerow { clear: both; }

	/* No margins around the whole image-block */
	DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-firstcol { margin-left: 0px !important; }
	DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-lastcol { margin-right: 0px !important; }

	/* Add margin from image-block to text (in case of "Text w/ images") */
	DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap,
	DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap {
		margin-right: 10px !important;
	}
	DIV.csc-textpic-intext-right DIV.csc-textpic-imagewrap,
	DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap {
		margin-left: 10px !important;
	}

	/* Positioning of images: */

	/* Above */
	DIV.csc-textpic-above DIV.csc-textpic-text { clear: both; }

	/* Center (above or below) */
	DIV.csc-textpic-center { text-align: center; /* IE-hack */ }
	DIV.csc-textpic-center DIV.csc-textpic-imagewrap { margin: 0 auto; }
	DIV.csc-textpic-center DIV.csc-textpic-imagewrap .csc-textpic-image { text-align: left; /* Remove IE-hack */ }
	DIV.csc-textpic-center DIV.csc-textpic-text { text-align: left; /* Remove IE-hack */ }

	/* Right (above or below) */
	DIV.csc-textpic-right DIV.csc-textpic-imagewrap { float: right; }
	DIV.csc-textpic-right DIV.csc-textpic-text { clear: right; }

	/* Left (above or below) */
	DIV.csc-textpic-left DIV.csc-textpic-imagewrap { float: left; }
	DIV.csc-textpic-left DIV.csc-textpic-text { clear: left; }

	/* Left (in text) */
	DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap { float: left; }

	/* Right (in text) */
	DIV.csc-textpic-intext-right DIV.csc-textpic-imagewrap { float: right; }

	/* Right (in text, no wrap around) */
	DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap { float: right; clear: both; }
	/* Hide from IE5-mac. Only IE-win sees this. \*/
	* html DIV.csc-textpic-intext-right-nowrap .csc-textpic-text { height: 1%; }
	/* End hide from IE5/mac */

	/* Left (in text, no wrap around) */
	DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap { float: left; clear: both; }
	/* Hide from IE5-mac. Only IE-win sees this. \*/
	* html DIV.csc-textpic-intext-left-nowrap .csc-textpic-text { height: 1%; }
	/* End hide from IE5/mac */
	
	/* Browser fixes: */
	
	/* Fix for unordered and ordered list with image "In text, left" */
	.csc-textpic-intext-left ol, .csc-textpic-intext-left ul { padding-left: 40px; overflow: auto; height: 1%; }
DIV.csc-textpic DIV.csc-textpic-imagerow-last { margin-bottom: 0; }