/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.bpdancewear.com/
   TEMPLATE NAME:  Black & Pink Dancewear
   DATE:           Jan-26th-2009
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: #d6e5ea url(/images/bg.gif) repeat-x; 
}

img{
border: 0px;
}
.line { border: none; border-bottom: 1px solid #4e5b28; height: 0px; margin: 0 auto }
.clear { clear: both; }
.center { text-align: center;}



/* ----------CART--------------------- */

font, table, tr, td { border: none; background-color: transparent;}
table, td, tr { border: none; font: 8pt Verdana, Arial, sans-serif;}
table b { color: #0e84a8; }
table a, tr a, td a, font a, .content table a {color: #0e84a8; font: 9pt Verdana, Arial, sans-serif; }
table a:hover, tr a:hover, td a:hover, font a:hover, .content table a:hover {color: #000;}
table hr {border: none; border-bottom: 1px solid #e1e1e1; height: 0px;}
font img { border: 0px}

/* ----------Centered Container Or the Layout--------------------- */

#container { 
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -4em; /* make sure this matches in the body footer DIV */
width: 960px;
background: url(/images/mainbg.gif) repeat-y; /* Main DIV Background Img */

} 

/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/

#main {
min-height: 100%; 
height: auto !important; 
height: 100%; 
background: url(/images/mainbg.gif) repeat-y; /* Main DIV Background Img */
}

#main .content {
padding: 0px;
margin-left: 260px;
min-height: 550px; /* Height of Background Img */
height: auto;
height: 100%; 
width: 680px;
color: #4b3e3e;
font: 8pt verdana, Sans-Serif;

}

#main .left {
float: left;
padding: 0px;
width: 330px;
}
#main .right {
float: right;
padding: 0px;
width: 330px;
}


#main .navleft {
float:left; 
width: 180px;
margin: 0px;
padding: 15px 0px 0px 60px;
background: url(/images/leftnavbg.gif) no-repeat top left;
line-height: 20px;
}


#main .navleft a{
color: #403f3f;
font: 9pt verdana, Sans-Serif;
text-decoration: none;
padding-bottom: 5px;
}

#main .navleft a:hover{
color: #027194;
}

#main .navleftsub{
padding: 0px 0px 0px 10px;
}

#main .navleftsub a{
color: #027194;
font: 8pt verdana, Sans-Serif;
text-decoration: none;
}

#main .navleftsub a:hover{
color: #0e84a8;
}

#main .errormessage{
color: #e90339;
font: bold 10pt 'Trebuchet MS', Sans-Serif;
}

.navheader{
margin-top: 10px;
color: #000;
font: bold 10pt 'Trebuchet MS', Sans-Serif;
}

/* --------------LABELS BUTTONS & FORMS-----------*/
 
#main .label {
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #000;
margin-left: 5px;
}
 
#main INPUT[type="text"], INPUT[type="password"], select{
border: 1px solid #c0c0c0;
font: 8pt verdana, Arial, Sans-serif;
color: #000;
padding: 1px;
margin-bottom: 5px;
}
 
INPUT[type="button"] {
}

/* --------------TOP------------- */
#topheader {
height: 36px;
width: 960px;
margin: 0 auto;
background: #d6e5ea url(/images/bg.gif) repeat-x; 
}

#toplogin {
float: left;
height: 21px;
width: 365px;
font: 8pt Verdana, Arial, Sans-serif;
color: #3c3535;
margin-top: 15px;
padding-left: 40px;
}

#toplogin a{
color: #0e84a8;
}


#topmessage {
float: right;
height: 21px;
width: 555px;
font: bold 12pt Verdana, Arial, Sans-serif;
color: #000;
margin-top: 15px;
text-align: right;

}

/* --------------HEADER------------- */


#header {
height: 135px;
background: url(/images/headerbg.gif) repeat-x; 
}

#catalogheader {
height: 135px;
background: url(/images/headerbg.gif) repeat-x; 
width: 960px;

}


#headerleft{
float: left; 
width: 271px;
}

#headerrightside{
width: 12px;
background: url(/images/headerright.gif) no-repeat;
float: right; 
height: 135px;
}

#headerright{
float: left; 
text-align: right;
width: 675px;
margin-top: 8px;
}


#headerright .toplinks{
height: 22px;
width: 675px;
}

#headerright .toplinks ul {
}

#headerright .toplinks li {
display: inline;
list-style-type: none;
}

#headerright .toplinks li a {
color: #000;
text-decoration: none;
padding: 0px 5px 0px 5px;
font: 8pt verdana, arial, Sans-Serif;
}

#headerright .toplinks li a:hover {
color: #0e84a8;
 }

#minibasket{
text-align: right;
width: 675px;
float: right;
height: 75px;
}

#minibasket td{
text-align: right;
}

#minibasket .left{
width: 575px;
float: left;
}

#minibasket .right{
font: 8pt Verdana, Arial, Sans-serif;
color: #a49999;
text-align: right;
width: 100px;
float: right;
}

#search{
font: bold 8pt Verdana, Arial, Sans-serif;
color: #000;
width: 190px;
float: right;
}

#search .form {
width: 20em;
border: 1px solid #000;
font: 8pt verdana, Sans-serif;
color: #000;
}


#search .left{
width: 55px;
float: left;
text-align: left;

}

#search .right{
text-align: right;
width: 135px;
float: right;
}



#headertabs{
width: 485px;
float: left;
text-align: center;
}

#headertabs a { float: left; }

#swap01 {background-image: url(/images/tabstudentsON.gif);  width: 108px;  height: 30px; }
#swap02 { background-image: url(/images/tabteachersON.gif); width: 108px;  height: 30px; }
#swap03 { background-image: url(/images/tabcoachesON.gif); width: 108px;  height: 30px; }
#swap04 { background-image: url(/images/tabteamsON.gif); width: 108px;  height: 30px; }


.rollover { display: inline; } /* Allow setting widths and heights */
.rollover img { height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */


#headerrightbg{
width: 12px;
background: url(/images/headerright.gif) no-repeat;
float: right; 
height: 135px;
}




/* --------------LOGO IN HEADER *always use this*------------- */

.logolink, #swap { width: 271px; height: 135px;}
.logolink { background-image: url('/images/logo.gif'); background-repeat: no-repeat;}
.logolink a { float: left;  }
 
#swap { background-image: url(/images/gif); }
 
.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { width: 100%; height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */

/* --------------TOPNAV------------- */

#topnav {
background: url(/images/topnavbg.gif) repeat-x; 
height: 48px;
}

#topnavcatalog {
background: url(/images/topnavbg.gif) repeat-x; 
height: 48px;
width: 960px;
}


#topnav .links{
background: url(/images/topnavleft.gif) no-repeat top left; 
float: left;
height: 48px;
text-align: center;
}

#topnav .right{
background: url(/images/topnavright.gif); 
width: 12px;
float: right;
}

#topnav ul {
margin: 10px 0px 0px 150px;
}


#topnav li {
display: inline;
list-style-type: none;
}

#topnav li a {
color: #fff;
text-decoration: none;
padding: 0px 20px 0px 20px;
font: bold 13pt 'Trebuchet MS', Sans-Serif;
}

#topnav li a:hover {
color: #deedf1;
 }


/* --------------VENDOR SEARCH------------- */

#vendorsearchbutton{
float: left;
}

#cbxvendor {
float: left;
color: #000;
font: 8pt verdana, Sans-Serif;
}

#vendorsearchform {
height: 20px;
}


/* --------------FOOTER------------- */

#footer, .push { 
clear: both;
width: 960px;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {
height: auto;
color: #5c4d4d;
font: 8pt verdana, Sans-Serif;
}

#top {
margin: 0 auto; 
position: relative; 
height: 91px;
width: 960px;
background: url(/images/footerbg.gif) repeat-x;
}

#topleft {
float: left;
background: url(/images/footer.gif) no-repeat;
width: 367px;
height: 91px;
}

#topright {
float: right;
background: url(/images/footerright.gif) no-repeat;
width: 146px;
height: 91px;
}

#bottom {
margin: 0 auto; 
position: relative; 
width: 960px;
}

#bottomleft {
float: left;
width: 721px;
color: #5c4d4d;
font: 8pt verdana, Sans-Serif;
text-align: center;
padding-left: 100px;
padding-top: 25px;

}

#bottomright {
float: right;
background: url(/images/footerbottomright.gif) no-repeat;
width: 139px;
height: 74px;
}


#bottom ul { margin: 0px; padding: 0px;}
#bottom li { display: block; list-style-type: none;}

#bottom li a {
color: #b5aaaa;
text-decoration: none;
padding: 0px 10px 0px 10px;
font: 8pt verdana, Sans-Serif;
}



/* --------------FOOTER LINKS------------- */


#footerlinks {
height: 81px;
background: url(/images/footerlinksbg.gif) repeat-x;
}

#footerlinksleft {
float: left;
width: 259px;
height: 81px;
background: url(/images/footerlinksleft.gif) no-repeat;
}

#footerlinksleft p{
padding: 25px 0px 0px 55px;
color: #018ab3;
font: bold 10pt 'Trebuchet MS', Sans-Serif;
}

#footerlinksmid {
float: left;
height: 81px;
}

.footerlinkscolumn { 
padding: 0px;
float: left;
margin: 20px 15px 0px 0px;
width: 115px;
}

.footerlinkscolumnwide { 
padding: 0px;
float: left;
margin: 20px 15px 0px 0px;
width: 130px;
}


#footerlinks ul {
margin: 0px;
padding: 0px;
}

#footerlinks li {
display: block;
list-style-type: none;
}

#footerlinks li a {
color: #88c3d1;
text-decoration: none;
padding: 0px 0px 0px 0px;
font: 7pt verdana, Sans-Serif;
text-transform: uppercase
}

#footerlinks li a:hover {
text-decoration: underline;
}


#footerlinksright {
float: right;
width: 139px;
height: 81px;
background: url(/images/footerlinksright.gif) no-repeat;
}




/* --------ASC LINKS--------- */

#footer .copyright{
margin-top: 25px;
color: #5c4d4d;
font: 8pt verdana, Sans-Serif;
text-align: center;
}

#footer .asc ul { margin: 0px; padding: 0px;}
#footer .asc li { display: block; list-style-type: none;}

#footer .asc li a {
color: #b5aaaa;
text-decoration: none;
padding: 0px 10px 0px 10px;
font: 8pt verdana, Sans-Serif;
}

/* --------W3 LINKS--------- */

#footer .w3 ul { margin: 0px; padding: 10px;}
#footer .w3 li { display: inline; list-style-type: none;}
#footer .w3 li a { color: #000; text-decoration: none; border-right: 1px solid; padding: 0px 10px 0px 10px; font: 10pt Arial, 'Trebuchet MS', Sans-Serif;}
#footer .w3 li a:hover { text-decoration: underline;}



/* ----- TABLES ---------- */
#list {
width: 100%;
border: 1px solid #e8d9d9;
border-collapse: collapse;
color: #776262;
}

#list td{
padding: 5px;
border: 1px solid #e8d9d9;

}

#list .header{
padding: 2px;
color: #fff0f2;
font: bold 12pt 'Trebuchet MS', Sans-Serif;
text-transform: uppercase;
background-color: #88c3d1;
}

#list .bold{
font: bold 10pt verdana, Sans-Serif;
}

#list .bold a{
color: #0e84a8;
font: bold 10pt verdana, Sans-Serif;
}

#list .bold a:hover{
color: #000;
font: bold 10pt verdana, Sans-Serif;
}

#list .bold a:visited{
color: #0e84a8;
font: bold 10pt verdana, Sans-Serif;
}




#list .note{
padding: 0px;
color: #fff0f2;
font: 8pt verdana, Sans-Serif;
}

#list .attribute{
padding-top: 7px;
color: #000;
font: bold 8pt verdana, Sans-Serif;
line-height: 20px;
}

#list .subheader{
background-color: #ffebee;
font: bold 8pt verdana, Sans-Serif;
}


#list a{
color: #0e84a8;
text-decoration: underline;
font: 8pt verdana, Sans-Serif;
}

#list a:hover{
color: #000;
text-decoration: underline;
font: 8pt verdana, Sans-Serif;
}

#list a:visited{
color: #0e84a8;
text-decoration: underline;
font: 8pt verdana, Sans-Serif;
}

#main .attributeheader{
padding: 2px;
color: #fff0f2;
font: bold 10pt 'Trebuchet MS', Sans-Serif;
text-transform: uppercase;
background-color: #88c3d1;
}



/* ----- FEATURED PRODUCTS ---------- */
#featuredproducts{
width: 670px;
padding: 10px 10px 10px 0px;
}

#featuredproducts .left{
width: 340px;
height: 305px;
padding: 10px 0px 0px 20px;
background: url(/images/fplgboxbg.gif) repeat-y;
border: 1px solid #c0c0c0;
margin-right: 12px;
}

#featuredproducts .lefttitle{
float: left;
width: 330px;
color: #000;
font: bold 12pt 'Trebuchet MS', Sans-Serif;
text-transform: capitalize;
margin-bottom: 5px;
}
#featuredproducts .lefttext{
float: left;
width: 330px;
}

#featuredproducts .leftdesc{
font: 8pt verdana, Sans-Serif;
color: #4b3e3e;
height: 250px;
}
#featuredproducts .leftshopnow{
float: left;
}


#featuredproducts .leftpic{
width: 330px;
margin: 0px;
padding: 0px;
text-align: center;
}




#featuredproducts .right{
width: 295px;
height: 312px;
}

#featuredproducts .righttitle{
width: 160px;
color: #027194;
font: bold 12pt 'Trebuchet MS', Sans-Serif;
text-transform: capitalize;
margin-bottom: 10px;
}

#featuredproducts .righttext{
float: right;
font: 8pt verdana, Sans-Serif;
width: 160px;
padding: 10px 5px 10px 5px;
color: #fff;
background-color: #88c3d1;
height: 130px;
}

#featuredproducts .rightdesc{
height: 50px;
}


#featuredproducts .rightpic{
float: left;
width: 125px;
margin: 0px;
padding: 0px;
background-color: #fff;
text-align: center;
}


#featuredproducts .righttop{
width: 295px;
border: 1px solid #c0c0c0;
height: 150px;
margin-bottom: 12px;
}

#featuredproducts .rightbottom{
width: 295px;
border: 1px solid #c0c0c0;
height: 150px;
}


/* ----- SPECIALS ---------- */
.special{
width: 670px;
}


.specialtitle{
width: 160px;
color: #0e84a8;
font: bold 12pt 'Trebuchet MS', Sans-Serif;
text-transform: capitalize;
margin-bottom: 10px;
}

.specialright{
float: right;
width: 500px;
padding: 10px 5px 10px 5px;
height: 128px;
}

.specialdesc{
height: 75px;
}

.specialcode{
padding: 10px;
color: #0e84a8;
font: bold 9pt 'Trebuchet MS', Sans-Serif;
}



.specialpic{
float: left;
width: 150px;
margin: 0px;
padding: 0px;
background-color: #fff;
}

/* ----- HOME TEXT BOX ---------- */
#hometextbox {
float: left;
background: #fff url(/images/homepageboxbg.gif) repeat-x; 
width: 642px;
padding: 15px;
margin-top: 12px;
color: #403f3f;
font: 8pt verdana, Sans-Serif;

}

#hometextbox .left{
width: 290px;
margin-right: 15px;
padding: 10px;

}


#hometextbox .right{
width: 280px;
padding: 10px;
}


#hometextbox .title {
color: #027194;
font: bold 14pt 'Trebuchet MS', Sans-Serif;
text-transform: capitalize;
width: 290px;
margin-bottom: 10px;
}


/* ----- FAQ ---------- */

#main .faqletter{
color: #0e84a8;
font: bold 12pt 'Trebuchet MS', Sans-Serif;
}



#faq .faqnumber{
color: #0e84a8;
font: bold 14pt 'Trebuchet MS', Sans-Serif;
}


#main .faqquestion{
color: #0e84a8;
font: bold 10pt 'Trebuchet MS', Sans-Serif;
}



#faq a{
color: #0e84a8;
font: bold 10pt 'Trebuchet MS', Sans-Serif;
text-decoration: underline;
}

#faq ol{
padding-left: 50px;
}

#faq ol li{
color: #0e84a8;
font: bold 14pt 'Trebuchet MS', Sans-Serif;
padding-top: 5px;
padding-bottom: 5px;

}

#faq ol li a{
text-decoration: underline;
color: #0e84a8;
font: bold 10pt 'Trebuchet MS', Sans-Serif;

}





/* ----- TEXT STYLES ---------- */

#main .topper{
padding: 5px;
color: #0e84a8;
font: bold 12pt 'Trebuchet MS', Sans-Serif;
text-transform: uppercase;
background-color: #d4dddf;
margin-top: 10px;
text-align: center;
}

#main h1 {
margin: 0px;
padding: 15px 0px 5px 0px;
color: #0e84a8;
font: bold 14pt 'Trebuchet MS', Sans-Serif;
text-transform: capitalize;
}

#main p {
color: #403f3f;
font: 8pt verdana, Sans-Serif;
padding-top: 15px;
}

#main hr {
color: #c0c0c0;
height: 1px;
}



#main a{
color: #0e84a8;
text-decoration: underline;
}

#main .boldheader{
font: bold 9pt verdana, Sans-Serif;
}

#main .programnote{
font: bold 9pt verdana, Sans-Serif;
color: lime;
}


#main .caps{
text-transform: uppercase;
}

#main .pinknote{
color: #0e84a8;
font: 8pt verdana, Sans-Serif;
font-style:italic;
}

#main .pinkheader{
color: #0e84a8;
font: bold 10pt 'Trebuchet MS', Sans-Serif;
}

#main .stylename{
padding-left: 25px;
}


.blackheader{
color: #000;
font: bold 10pt 'Trebuchet MS', Sans-Serif;
}

.blackcaps{
color: #000;
font: bold 12pt 'Trebuchet MS', Sans-Serif;
text-transform: uppercase;
}

.pinkcaps{
color: #0e84a8;
font: bold 12pt 'Trebuchet MS', Sans-Serif;
text-transform: uppercase;
}





#main ul.bullet {
padding: 20px 20px 0px 20px;
}

#main .bullet li {
background: url(/images/bullet.gif) no-repeat;
padding-left: 15px;
list-style-type: none;
display: block;
padding-bottom: 10px;
padding-top: 0px;
color: #465355;
}

#main .bullet li a {
text-decoration: none;
padding: 0px 20px 0px 20px;
font: bold 13pt 'Trebuchet MS', Sans-Serif;
}

#main .bullet li a:hover {
color: #efe0e0 ;
 }
 
#admin ul{
padding: 5px 0px 10px 10px;
}

#admin li {
background: url(/images/bullet.gif) no-repeat;
padding-left: 0px;
list-style-type: none;
display: block;
padding-bottom: 10px;
padding-top: 0px;
color: #998888;
}

#admin li a {
text-decoration: underline;
padding: 0px 20px 0px 20px;
font: bold 10pt 'Trebuchet MS', Sans-Serif;
}

#admin li a:hover {
color: #efe0e0 ;
 }






/* ----- Customer Cart TABLES ---------- */
#awscustomertables table{margin: 1em; border-collapse: collapse;}
#awscustomertables td{ padding: .3em; border: 1px #F2F2F2 solid; }
#awscustomertables th{ padding: .3em; border: 1px #F2F2F2 solid; background: #F2F2F2; }

