﻿body { 
  font-family: 'lucida grande',tahoma,verdana,arial,sans-serif; font-size: 13px;
  background-color: black; color: white; margin: 0; padding: 0;
  min-width: 750px; text-align: center; }
  
 a img  
{  
border: none;  
} 

body.popup { 
  min-width: 0px; text-align: left; }

#wrapper { position: relative;
  text-align: left; width: 750px; margin-left: auto; margin-right: auto;}

#wrapper_full { position: relative; width: 100%;
  text-align: left; margin-left: auto; margin-right: auto; padding: 0;}

#logo { float: left; margin-top: 20px; width:160px; height: 540px; 
  background: url("images/side_logo_sj.gif") no-repeat center top;}

#logo.s_a_l_s_a { 
  background: url("images/side_logo_salsa.gif") no-repeat center top; }

#logo.j_i_v_e { 
  background: url("images/side_logo_jive.gif") no-repeat center top; }

#content {
  width: 590px; float: right; padding-top: 12px;}

#content_full {
  margin-left: 0px; padding-left: 160px; margin-right :0px; padding-top: 5px; z-index: 2;}

#content_full_em { /* extra margin */
  margin-left: 0px; padding-left: 166px; margin-right:10px; padding-top: 6px; z-index: 2; }

.full_center {width: 430px; margin-left: auto; margin-right: auto;}

#ads_s_a_l_s_a {
  position:absolute; top:0px; left: 0px; margin: 0px 0px 0px 0px; padding:0px 3px 3px 3px;
  width:150px; overflow:hidden; z-index: 0; /* -1 fixes HTC view problem but makes adverts unclickable  */
  background-color: #280000;  }

#ads_s_a_l_s_a a { display:block; background: none; padding: 0; margin: 0;}

#ads_s_a_l_s_a a img {
  background: none; border: none; padding: 3px 0px 0px 0px; margin: 0;}

#ads_j_i_v_e {
  position:fixed; top:0px; left: 0px; margin: 0px 0px 0px 0px; padding:0px 3px 3px 3px;
  width:150px; overflow:hidden;  z-index: 0;
  background-color: black;  }

#ads_j_i_v_e a { display:block; background: none; padding: 0; margin: 0;}

#ads_j_i_v_e a img {
  background: none; border: none; padding: 3px 0px 0px 0px; margin: 0;}

#footer {
  clear: both; margin-top: 25px;}

a:link { 
  text-decoration: none; color: yellow ; 
  }

a:visited { 
  text-decoration: none; color: orange; 
  }

a:hover, a:active { 
text-decoration: underline; color: white; 
}

label { display: block; float: left; width: 140px;
        padding-top: 1px; padding-right: 1px;
        font-weight: bold; text-align: right; vertical-align: top;}

label.ind_err {padding-left: 23px; width: 117px;  background :url("images/warning_sml.png") no-repeat 0 0 ;}


.maxin_width { /* max input width */ width: 380px;}

.fm_title { font-size: 130%; font-weight: bold; background: orange; width: 100%; 
            padding: 5px 0px 5px 3px; margin: 0;}
            
.fm_title_note {
	font-size: 60%; font-weight:normal; line-height: 12px;
}

fieldset { border: none; margin: 0px;}

fieldset p {clear: both; margin: 12px 0px 0px 0px; padding: 0; }

fieldset .cln {display: block; float: left; 
        padding-top: 1px; padding-right: 2px;
        font-weight: bold; text-align: right; vertical-align: top;}

fieldset .req {display: block; color: red; font-size: 80%; font-style: italic; font-weight: normal; margin-top: -1px;}

fieldset .add {display: inline-block; padding: 1px 0px 0px 5px; font-weight: bold; font-style: normal;}

fieldset .note {display: block; font-size: 70%; margin: 0; font-style: italic; font-weight: normal; 
   padding: 0px 25px 0px 150px;}
   
.chkbox { padding-left: 148px;
	
}

.btnspc { display: inline-block; margin-left: 200px;}

input, textarea, select {margin: 0;} /* safari benifit */

input, textarea, select, button {font-family:'lucida grande',tahoma,verdana,arial,sans-serif; font-size: 12px;} 

input[type=text]:focus, textarea:focus { background: #ffc; } /* buttons look bad when coloured */

a.aa:link, a.aa:visited { /* arrowed link */
  display: inline-block; text-decoration: none; color: yellow; 
  padding-left: 10px; padding-right: 10px; background: url("images/arrow_gl.gif") no-repeat; background-position: 0px 3px; }

a.aa:hover, a.aa:active { 
  display: inline-block; text-decoration: underline; color: white; 
  padding-left: 10px; padding-right: 10px; background: url("images/arrow_gl.gif") no-repeat; background-position: 0px 3px; }

a.ail:link, a.ail:visited { /* inline link */
  text-decoration: none; color: yellow; }

a.ail:hover, a.ail:active { 
  text-decoration: underline; color: white; }
  
  
a.daa:link, a.daa:visited { 
  text-decoration: none; color: darkblue;
  padding-left: 8px; padding-right: 10px; background: url("images/arrow_so.gif") no-repeat left center; }

a.daa:lhover, a.daa:lactive { 
  text-decoration: underline; color: blue; 
  padding-left: 8px; padding-right: 10px; background: url("images/arrow_so.gif") no-repeat left center; }
  

.ll_head { /* link list head */
  float: left; width: 235px; margin-left: -8px; padding-left: 6px; 
  background: darkred url("images/horz_fade_red.gif") repeat-y 0 0; }

#header_sj { position: relative; top: 0; left: 0;
  width: 750px; height: 144px; z-index: 3;margin-left: auto; margin-right: auto;
  background: darkred url("images/sj_logo_main.jpg") no-repeat top left;}

#header_s_a_l_s_a { position: relative; top: 0; left: 0; z-index: 3;
  width: 750px; height: 144px; margin-left: auto; margin-right: auto;
  background: darkred url("images/salsa_logo_main.jpg") no-repeat top left;}

#header_j_i_v_e { position: relative; top: 0; left: 0; z-index: 3;
  width: 750px; height: 144px; margin-left: auto; margin-right: auto;
  background: darkred url("images/jive_logo_main.jpg") no-repeat top left;}

#header_text { position: absolute; top: 20px; left: 370px; width: 350px;
  display: block; text-align: center; margin: 0;  
  padding: 0; color: white;}

#header_text h1 {display: inline-block; filter:shadow(color=black); margin: 0; padding: 0;}

#header_text .own {color: yellow;}

#header_text h3 {color: yellow;}

#hoz_nav { position: absolute; top:107px; left: 70px; margin: 0; padding: 0; list-style: none;}

#hoz_nav li { margin: 0; padding: 0; float: left;  height: 36px; width: 75px; text-align: center;
  font-weight: bold;              
  border-right: 1px solid orange; 
  background: url("images/alpha_mild_shade.png") repeat !important;
  background: url("images/alpha_mild_shade_b.png") no-repeat;
  behavior: url(/iepngfix.htc);  }

#hoz_nav .first { border-left: 1px solid orange;}

#hoz_nav .selected { 
  background: url("images/alpha_nav.png") repeat-x center center !important;
  background: url("images/alpha_nav_b.png") no-repeat center center;
  
}

#hoz_nav a:link, a:visited { 
  text-decoration: none; color: orange;}

#hoz_nav a:hover, a:active { 
  text-decoration: none; color: white;}

#hoz_nav a.single {display: block; padding-top: 9px;}

#salsa_neon {
  width: 290px; float: left;
  background: url("images/neon_bg.jpg") repeat-y 0 0; }

#salsa_neon p {
  margin-top: 0px;
  padding-top: 0px;
  padding-left: 30px; }

#salsa_neon_top {
  width: 290px; height: 85px; position: relative;
  background: url("images/salsa_neon.jpg") no-repeat 0 0; }

#salsa_neon_bottom {
  width: 290px; height: 30px; position: relative; 
  background: url("images/salsa_neon.jpg") no-repeat 0 100%; }

#jive_neon {
  width: 290px; float: right;
  background: url("images/neon_bg.jpg") repeat-y 0 0; }

#jive_neon p {
  margin-top: 0px;
  padding-top: 0px;
  padding-left: 30px; }

#jive_neon_top {
  width: 290px; height: 85px; position: relative;
  background: url("images/jive_neon.jpg") no-repeat 0 0; }

#jive_neon_bottom {
  width: 290px; height: 30px; position: relative;
  background: url("images/jive_neon.jpg") no-repeat 0 100%; }


H1 { font-size: 23px; margin: 8px 0px 8px 0px}

.h1_margins {margin: 8px 0px 8px 0px}
	
}

H2 {
   font-size : 18px;
}

H3 {
   font-size : 105%
}

small { 
    font-size: 70%;
}


.larger {
  font-size: 120%;
}

p {margin: 0; padding: 5px 0px;}

/* These needed as H's put space below in tight table cells: */
.h1font { font-family: Verdana, Arial; font-size: 26px}
.h2font { font-family: Verdana, Arial; font-size: 18px}
.h3font { font-family: Verdana, Arial; font-size: 16px}

.h1_2   { font-family: Arial, Helvetica, sans-serif, 'MS sans serif'; font-size: 18px}


.sm1 { 
    font-size: 80%;
}
.sm2 { 
    font-size: 70%;
}

.pm          { font-family: Verdana,Arial; font-size: 12px;
               margin-left: 30px; margin-right: 30px }

.sml_btn { font-size: 80% }

.chat {font-size: 85%; }

.chat hr {width: 50%; text-align: center;}

.chat ul { list-style-type: none; padding: 0; margin: 0;}

.chat li {  padding-left: 15px;} 

.chat .top { border-top: 1px dashed black; margin-top: 3px; padding-left: 2px; }

.chat .vtop { margin: 0;  padding-left: 2px; }

.chat a:link {
  text-decoration: none; color: yellow; }

.chat a:active, .chat a:visited {
  text-decoration: none; color: #934600; }

.chat a:hover {
  text-decoration: underline; color: white; }

.chat img {position: relative; top: 2px}

.chat_msg {width: 40em; padding-right: 10px; border-right: 1px dashed black; font-size: 90%}

.scol_form { /* single column form */
  width: 40em; }

.end_float {clear: both;}

/* table row shaded with purple border. background:url(images/shade_lp_l.gif) */
.trspb { border-left-style: solid; border-left-width: 1px; border-left-color: orange;
         border-right-style: solid; border-right-width: 1px; border-right-color: orange;
         border-bottom-style: none;
         border-top-style: solid; border-top-width: 1px; border-top-color: orange;
         background-color: darkred}

/* table row purple border */
.trpb { border-left-style: solid; border-left-width: 1px; border-left-color: orange;
        border-right-style: solid; border-right-width: 1px; border-right-color: orange;
        border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: orange;
        border-top-style: solid; border-top-width: 1px; border-top-color: orange;
        background-color: #280000;}

/* search match hightlight */
.mh {background-color: yellow; color: black;}

/* no padded background img */
.npi { background-image: none !important; padding-left: 0px !important; padding-right: 0px !important; }

table.events { width: 100%; border-collapse: collapse;}

table.events a:link, table.events a:visited { 
  text-decoration: none; color: darkblue;
  padding-left: 8px; padding-right: 10px; background: url("images/arrow_so.gif") no-repeat left center; }

table.events a:hover, table.events a:active { 
  text-decoration: underline; color: blue;
  padding-left: 8px; padding-right: 10px; background: url("images/arrow_so.gif") no-repeat left center; }
  


table.events td { border-bottom: 1px solid orange; padding: 3px;}

table.events .c1 { width: 100px; border-left: 1px solid orange;}

table.events .c1 img { display: inline; margin-bottom: 5px; vertical-align: top;}

table.events .c1 input {display: block; margin-top: 5px; height: 22px; font-size: 10px;}

table.events .c2 { width: 100px; border-left: 1px dotted orange }

table.events .c3 {border-left: 1px dotted orange; border-right: 1px solid orange }

table.events .ma {display:inline; font-style:italic; font-weight:bold}

table.events .li { padding: 0; margin: 0; vertical-align:middle;}

table.events th { font-weight: bold; font-size: 125%; text-align: center; background-color: orange;
  border: 1px solid orange; }

table.events_cal { width: 100%; border-collapse: collapse;}

table.events_cal a:link, table.events_cal a:visited { 
  text-decoration: underline; color: darkblue; padding-right: 6px;}

table.events_cal a:hover, table.events_cal a:active { 
  text-decoration: underline; color: blue; padding-right: 6px;}

table.events_cal th { font-weight: bold; font-size: 140%; text-align: center; background-color: orange;
                  border: 1px solid orange; }

table.events_cal td { border: 1px solid orange; padding: 3px; vertical-align: top; }

table.events_cal td h2 { text-align: center; padding: 0; margin :0;}

table.events_cal td p { padding: 5px 0 5px 0; margin :0; border-bottom: 1px dotted orange;}

table.classes { width: 100%; border-collapse: collapse;}

table.classes a:link, table.classes a:visited { 
  text-decoration: none; color: darkblue;
  padding-left: 8px; padding-right: 10px; background: url("images/arrow_so.gif") no-repeat left center; }

table.classes a:hover, table.classes a:active { 
  text-decoration: underline; color: blue;
  padding-left: 8px; padding-right: 10px; background: url("images/arrow_so.gif") no-repeat left center; }

table.classes td { border-bottom: 1px solid orange; padding: 3px;}

table.classes .c1 { width: 75px; border-left: 1px solid orange;}

table.classes .c2 { width: 100px; border-left: 1px dotted orange; }

table.classes .c3 { border-left: 1px dotted orange;}

table.classes .c3e { border-left: 1px dotted orange; border-right: 1px solid orange}

table.classes .c4 { width: 100px; border-left: 1px dotted orange; 
  border-right: 1px solid orange }

table.classes .cw { font-weight: bold; font-style: italic; border: 1px solid orange; font-size:110%}

table.classes th { font-weight: bold; font-size: 125%; text-align: center; background-color: orange;
  border: 1px solid orange; }

.row_hl { font-weight: bold;}

.cal_head {text-align: center; padding-bottom: 10px; margin: 0;}

.glow_rdu {padding-left: 10px; padding-right: 10px;}

.vh { /* venue hightlight */
   font-weight: bold; }

.awesome {position: absolute; color: darkred; font-style: italic; font-size: 70%; padding-top: 0.25em;}

.compact_top {margin-top: 0px; padding-top: 0px}

.compact_vert {margin-top: 0px; margin-bottom: 0px; padding-top: 0px; padding-bottom: 0px;}

.compact_all {margin: 0; padding: 0}

.news_auth {font-size: 80%; font-style: italic; }

.news_auth a:link, .news_auth a:visited { 
  text-decoration: none; color: darkblue; }

.news_auth a:hover, .news_auth a:active { 
  text-decoration: underline; color: blue; }

.news_item {margin: 0; padding-top: 10px; font-size: 90%}

.news_item a:link, .news_item a:visited { 
  text-decoration: none; color: darkblue;
  padding-left: 8px; padding-right: 10px; background: url("images/arrow_so.gif") no-repeat left center; }

.news_item a:hover, .news_item a:active { 
  text-decoration: underline; color: blue; 
  padding-left: 8px; padding-right: 10px; background: url("images/arrow_so.gif") no-repeat left center; }

.contact_item {margin: 0; padding-top: 10px; font-size: 90%}

.contact_item a:link, .contact_item a:visited { 
  text-decoration: none; color: darkblue;
  padding-left: 8px; padding-right: 10px; background: url("images/arrow_so.gif") no-repeat left center; }

.contact_item a:hover, .contact_item a:active { 
  text-decoration: underline; color: blue; 
  padding-left: 8px; padding-right: 10px; background: url("images/arrow_so.gif") no-repeat left center; }

table.links { width: 100%; border-collapse: collapse; margin-bottom: 20px;}

table.links th { font-weight: bold; font-size: 140%; background-color: darkred;
                  border: 1px solid orange; }

table.links td { border: 1px solid orange; padding: 3px; font-size:90%}

table.venues { width: 100%; border-collapse: collapse; margin-bottom: 20px;}

table.venues th { font-weight: bold; font-size: 140%; background-color: darkred;
                  border: 1px solid orange; }

table.venues td { border: 1px solid orange; padding: 3px; font-size:90%}


/*** IMAGE BOXES ***/

.slim .cb {margin:0.5em 0;}
.slim .bt { /* top */
	height:10px;
	margin:0 0 0 10px;
	background:url("images/box_slim.gif") no-repeat 100% 0;
}
.slim .bt div {
	position:relative;
	left:-10px;
	width:10px;
	height:10px;
	background:url("images/box_slim.gif") no-repeat 0 0;
	font-size:0;
	line-height:0;
}
.slim .bb { /* bottom */
	height:10px;
	margin:0 0 0 10px;
	background:url("images/box_slim.gif") no-repeat 100% 100%;
}
.slim .bb div {
	position:relative;
	left:-10px;
	width:10px;
	height:10px;
	background:url("images/box_slim.gif") no-repeat 0 100%;
	font-size:0;
	line-height:0;
}
.slim .i1 {
	padding:0 0 0 5px;
	background:url("images/box_slim_bdr.gif") repeat-y 0 0;
}
.slim .i2 {
	padding:0 5px 0 0;
	background:url("images/box_slim_bdr.gif") repeat-y 100% 0;
}
	/* wrapper - own use*/
.slim .i3 {
	display:block;
	margin: 0px;
	padding:0px 5px;}

.slim .i3:after {
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden;}
.slim .i3 {display:inline-block;}
.slim .i3 {display:block;}

.glow .cb {margin: 0.5em 0;}
.glow .bt { /* top */
	height:20px;
	margin:0 0 0 20px;
	background:url("images/box_glow.png") no-repeat 100% 0;
}
.glow .bt div {
	position:relative;
	left:-20px;
	width:20px;
	height:20px;
	background:url("images/box_glow.png") no-repeat 0 0;
	font-size:0;
	line-height:0;
}
.glow .bb { /* bottom */
	height:20px;
	margin:0 0 0 20px;
	background:url("images/box_glow.png") no-repeat 100% 100%;
}

.glow .bb div  {
	position:relative;
	left:-20px;
	width:20px;
	height:20px;
	background:url("images/box_glow.png") no-repeat 0 100%;
	font-size:0;
	line-height:0;
}

.glow .i1 {
	padding:0 0 0 15px;
	background:url("images/box_glow_bdr.png") repeat-y 0 0;
}
.glow .i2 {
	padding:0 15px 0 0;
	background:url("images/box_glow_bdr.png") repeat-y 100% 0;
}
	/* wrapper - own use*/
.glow .i3 {
	display:block;
	margin: 0px;
	padding:0px 5px;
        color: black;
        background-color: #ffcc00;}

.glow .i3:after {
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden;}

.glow .i3 {display:inline-block;}
.glow .i3 {display:block;}

.glow_margin {margin-left: 10px; margin-right: 10px}


.solid .cb {margin: 0.1em 0;}
.solid .bt { /* top */
	height:10px;
	margin:0 0 0 10px;
	background:url("images/box_solid.gif") no-repeat 100% 0;
}
.solid .bt div {
	position:relative;
	left:-10px;
	width:10px;
	height:10px;
	background:url("images/box_solid.gif") no-repeat 0 0;
	font-size:0;
	line-height:0;
}
.solid .bb { /* bottom */
	height:10px;
	margin:0 0 0 10px;
	background:url("images/box_solid.gif") no-repeat 100% 100%;
}

.solid .bb div  {
	position:relative;
	left:-10px;
	width:10px;
	height:10px;
	background:url("images/box_solid.gif") no-repeat 0 100%;
	font-size:0;
	line-height:0;
}

.solid .i1 {
	padding:0 0 0 7px;
	background:url("images/box_solid_bdr.gif") repeat-y 0 0;
}
.solid .i2 {
	padding:0 7px 0 0;
	background:url("images/box_solid_bdr.gif") repeat-y 100% 0;
}
	/* wrapper - own use*/
.solid .i3 {
	display:block;
	margin: 0px;
	padding:0px 4px;
        color: black;
        background-color: #ffcc00;}

.solid .i3:after {
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden;}

.solid .i3 {display:inline-block;}
.solid .i3 {display:block;}

.solid_pad {margin-left: 10px; margin-right: 10px}

.dark .cb {margin: 0.1em 0;}
.dark .bt { /* top */
	height:10px;
	margin:0 0 0 10px;
	background:url("images/box_dark.gif") no-repeat 100% 0;
}
.dark .bt div {
	position:relative;
	left:-10px;
	width:10px;
	height:10px;
	background:url("images/box_dark.gif") no-repeat 0 0;
	font-size:0;
	line-height:0;
}
.dark .bb { /* bottom */
	height:10px;
	margin:0 0 0 10px;
	background:url("images/box_dark.gif") no-repeat 100% 100%;
}

.dark .bb div  {
	position:relative;
	left:-10px;
	width:10px;
	height:10px;
	background:url("images/box_dark.gif") no-repeat 0 100%;
	font-size:0;
	line-height:0;
}

.dark .i1 {
	padding:0 0 0 7px;
	background:url("images/box_dark_bdr.gif") repeat-y 0 0;
}
.dark .i2 {
	padding:0 7px 0 0;
	background:url("images/box_dark_bdr.gif") repeat-y 100% 0;
}
	/* wrapper - own use*/
.dark .i3 {
	display:block;
	margin: 0px;
	padding:0px 4px;
        background-color: #280000;}

.dark .i3:after {
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden;}

.dark .i3 {display:inline-block;}
.dark .i3 {display:block;}

.dark_dashb {border: 1px dashed #280000; }

.spcr_s { /* spacer small */
margin: 0; padding: 0; height: 5px }

.error_dlg {
	width: 300px; height: 230px; padding: 5px 15px 5px 275px;
	background:url("images/error_bg.jpg") no-repeat;
}

.error_dlg h2 { /* to help IE7 */
	margin: 15px 0px 10px 0px;
}

.centre {
	text-align:center
}

.il_field_img { vertical-align:middle; 
}


.warnbox {
	border: #e2c822 1px solid; margin: 10px 0px; padding: 0px 10px;
	background-color: #fff9d7; color: black;}

.warnbox h2 {
	margin: 10px 0px;
	padding: 0;
	font-size: 130%;
	font-weight: bold;
}

.warnbox p {margin: 10px 0px; padding: 0;}
	
.errbox {
	border: 1px #FF0000 solid;
	margin: 10px 0px;
	padding: 0px 10px;
	background-color: #FFB3B3;
	color: black;
}

.errbox h2 {
	margin: 10px 0px;
	padding: 0;
	font-size: 130%;
	font-weight: bold;
}

.errbox p {margin: 10px 0px; padding: 0;}
	

.infobox {
	border: 1px #3B5998 solid; margin: 10px 0px; padding: 0px 10px;
	background-color: #ECEFF5;  color: black;}

.infobox h2 {
	margin: 10px 0px;
	padding: 0;
	font-size: 130%;
	font-weight: bold;
}

.infobox p {margin: 10px 0px; padding: 0;}

table.usr_details {
	width: 100%; 
}

.usr_details tbody th {
	font-weight:bold; text-align:right; width: 25%;
}

table.usr_details tbody td {
	border: 1px solid orange; width: 75%
}

.sngl_btn {
	 width: 200px; font-weight: bold; font-size: 110%;
}

.no_entry {
	 font-size: 130%; font-style:italic;
}

.entrybtns {
	padding-top: 3px; margin-top: 3px; border-top: 1px orange dashed;
}

.side_note {
	margin: 5px;
	padding: 5px;
	border: 1px #666666 dashed;
	float: right;
	font-style: italic;
	font-size: 85%;
}
