/*-CONDITIONER ELEMENTS----------------------------------------------------------------------
---It's important to remember these styles, as all page elements will inherit these settings
---first.  Sometimes it may be necessary to overide some of these styles further down the
---cascade, but generally these make it easier to create new styles.
-------------------------------------------------------------------------------------------*/

/*Begin Edited Styles (Clark)*/

/**/
.center { text-align:center; }
#carea h4 { font-size:13px; font-weight:bold; line-height:18px; color:#AB035C; margin:20px 0px -6px 0px!important; padding:20px 0 0px 0; border-top:1px solid #bcbcbc;   }

.floatLeft { float:left; }


#header { border-bottom:21px solid #AB035C; height:152px!important; display:block!important; margin:0px; width:989px!important; position:relative; }

.headrule { padding-bottom:1px!important; }

.headLogoLink { height:152px; width:164px; display:block; float:left; }

.headerImage {  width:825px; height:152px; display:block; float:right; }

#carea h4 span { font-size:12px; color:#3d3d3d!important; line-height:24px; }

#carea p { font:Arial, Helvetica, sans-serif; font-size:12px!important; line-height:20px!important; color:#3d3d3d;  }
#carea p.ErrorMessage { color:#F00!important; }

.Smaller a { font-size:15px; }

#ut_title_hint_container {font:Arial, Helvetica, sans-serif; font-size:11px; line-height:20px; color:#3d3d3d!important; font-weight:normal; display:block; margin:-5px 0 15px 0;  }

/* #disc_code_container, #addon_container_1061, #addon_container_1081 { margin-left:9px!important;} */

.fr_reg_summary_table table { border-bottom:1px solid #ababab!important;  padding:0px 0 15px 0  }

.SectionHead { font-size:14px; padding:9px!important; }

#carea a:link, #carea a:visited { text-decoration:none!important; }

#carea a:link, #carea a:hover { background-color:none!important; font-weight:normal!important;  }

.ProgressBox td { padding:3px; }

.ProgressBox td p font-size:10px!important; }

#carea p { font:Arial, Helvetica, sans-serif; font-size:11px; line-height:20px; color:#3d3d3d!important;  }

#carea h2, #carea h3 { font-size:16px; font-weight:bold; line-height:18px; color:#AB035C!important; margin:20px 0px 0px 0px!important;  }

.leftItem { background:none!important; border-bottom:1px solid #f8f8f8!important; border-top:none!important; }

.leftItem a { color:#212121!important; padding:10px!important; display:block!important; }

.leftItem a:hover { background: #c9006f!important; color: #fff!important; }

.headrule { border-bottom:3px solid #dcdcdc!important; }

#komen-main-content p { font:Arial, Helvetica, sans-serif; font-size:11px; line-height:20px; color:#3d3d3d!important;  }

#komen-main-content h2 { font-size:16px; font-weight:bold; line-height:18px; color:#AB035C; margin:20px 0px 0px 0px!important;  }

#komen-main-content h2 span { font-size:12px; color:#3d3d3d!important; line-height:24px; }

#komen-main-content { width: 557px; padding:0px 0 0 8px!important; }

.hero-block { width: 557px; height:188px; display:block; background:#444444; }

.main-content-block { border-right:1px solid #e6e6e6; width:557px; height:200px; display:block; margin-top:15px; }

.article-box {width: 557px; min-height:180px; height:auto; display:block; ; border-top:1px solid #e6e6e6; }

.article-left { float:left; width: 251px; height:auto; display:block; padding:0 13px 13px 13px;  }

.article-right { float:right; width: 251px;height:auto;  border-left:1px solid #e6e6e6; padding:0 13px 13px 13px;  }

.article  { padding:0 13px; width: 531px;}

.article-box { border-right:1px solid #e6e6e6; width:557px; display:block; overflow:hidden; } 

.article-box h2 { font-size:13px!important; margin:10px 0 0 0!important; }

.article-box h2 span { font-size:11px!important; line-height:16px!important; }

.article-box p { margin-top:10px; }

.logout-alert p { margin:0px 0px 11px 15px; padding:15px; border-bottom:1px dotted #e6e6e6; color:#444;  }

.logout-alert a:hover { background:none!important; color:#AB035C!important;}

#carea { height:10px!important; }

.topic-lable { font-size:10px; font-weight:bold; color:#AB035C; padding:10px 0 10px 0; }

.topic-lable span { color:#3d3d3d; }

.article-left .image-wrap, .article-right .image-wrap { display:block; background:#f5f5f5; border:1px solid #eaeaea; padding:8px 38px!important; }

.article-box .image-wrap { display:block; background:#f5f5f5; border:1px solid #eaeaea; padding:8px 9px; }


.appAreaNoWidth {margin:0px!important; }

/*Action Buttons*/
.become_sponsor { background: url(../images/2010_race/become-race-sponsor.png) no-repeat; width:146px; height:23px;  position:relative; display:block;float:right; margin:20px 70px 0 0;}

#komen-main-content .article-box a:hover { background-color:#fff!important; }

.become_sponsor span { position:absolute; left:-10000px;  }

.learn_more, .learn_more:visited  { background: url(../images/2010_race/learn-more.png) no-repeat; width:80px; height:30px;  display:block!important; cursor:pointer;  }

#komen-main-content .learn_more span, .race_center_btn span, .register_race_btn span { position:absolute; left:-10000px;  }

.race_center_btn { background: url(../images/2010_race/my-race-center.png) no-repeat; width:145px; height:31px;  position:absolute; display:block; right:177px; top:98px;    }

.register_race_btn { background: url(../images/2010_race/race_registration_header_btn.png) no-repeat; width:145px; height:31px;  position:absolute; display:block; right:16px; top:98px; }

h2.cstmTitle { display:none!important; }

.appAreaNoWidth td { padding:2px!important; }

.FormBox { margin-top:10px!important;  }

.FormBox a:link, .FormBox a:hover { color:#AB035C!important;  }

/*End Edited Styles (Clark)*/



body 
{
margin: 0px 0px 0px 0px;
font-family: Arial;
font-style: normal;
text-align: center;
}

/*--removes default margins and resets font to default browser size so it doesn't inherit
truncated font sizes of parent elements for all form elements--*/
form 
{
margin: 15px 0px;
font-size: 14px;
}

/*--removes default margins from all form elements--*/ 
table 
{
margin: 0px;
}

/*--add class="floatLeft" or "floatRight" to any image that needs to be floated--*/	
img.floatLeft 
{
float: left;
border: 0px;
}

img.floatRight 
{
float: right;
border: 0px;
}

/*--makes sure that all linked images don't get the default border--*/
a img
{
border: 0px;
}

/*--container block that defines the sites width of and centers the page--*/
#center 
{
width: 988px;
margin: 0px auto 0px auto;
text-align: left;
}



/*-HEADER TOP RIGHT-----------------------------------------------------------------------
---Contains all styles associated with the top right of the page. Sign in, messageboard,
---global site search, and details nav.
-----------------------------------------------------------------------------------------*/

/*-container block for the whole top right section-*/

#headerRight 
{
float: right;
position: relative;
width: 176px;
margin-top:-81px;
margin-right: 2px;
}

#signinMessageBoard
{
margin-top: 8px;
font-family: Arial;
color: #a60a58;
font-size: 14;
font-weight: bold;
text-decoration: none;
}

#signinMessageBoard a:link,
#signinMessageBoard a:visited
{
color: #a60a58;
font-family: Arial;
font-size: .88em;
font-weight: bold;
text-decoration: none;
}

#signinMessageBoard a:hover,
#signinMessageBoard a:active
{
color: #a60a58;
font-family: Arial;
font-size: .88em;
font-weight: bold;
text-decoration: underline;
}

#pinkSignIn a:link,
#pinkSignIn a:visited
{
color: #a60a58;
font-family: Arial;
font-size: .88em;
font-weight: bold;
font-style: normal;
}

#search
{
margin-top: 30px;
color: #696969;
font-family: Arial;
font-size: .88em;
font-weight: bold;
}

#advancedSearch,
#advancedSearch a:link,
#advancedSearch a:visited,
#advancedSearch a:hover,
#advancedSearch a:active
{
text-align: right;
font-family: Arial;
font-size: 10px;
color: #696969;
padding-right: 4px;
margin-bottom: 7px;
}

#detailsNav
{
font-family: Arial;
font-size: 10px;
padding: 21px 0px 10px 0px;
}

#detailsNav p
{
padding: 0px;
margin: 0px;

}

#detailsNav a:link, 
#detailsNav a:visited
{
font-family: Arial;
font-size: 10px;
text-decoration: none;
color: #696969;
}

#detailsNav a:hover,
#detailsNav a:active
{
font-family: Arial;
font-size: 10px;
text-decoration: underline;
color: #696969;
}


/*-SEARCH FORM STYLES-------------------------------------------------------------------------*/

form.search
{
margin: 5px 0px 5px 0px;
padding: 0px;
font-size: 12px;
}

input.search
{
border: solid 1px #696969;
width: 165px;
padding: 0px 3px 0px 3px;
}

input.btnSearch 
{
margin-bottom: -5px;
}


/*-TOP NAV STYLES-----------------------------------------------------------------------------
---The top nav is a little tricky.  It uses the LI and the A to define the look.  The LI 
---contains a 2px strip on the right side of each button, that works for the Active and 
---Inactive states.  The A contains an image that is reused in all the buttons (except the far 
---left and right buttons) that Slides under the right side of the the LI, meaning that each 
---button uses the same 2 images.  The far left and right buttons had to have their own custom 
---classes because of the different images. (Google Sliding Doors CSS for clear explainations)
----------------------------------------------------------------------------------------------*/


#navContainer ul
{
padding: 0px;
float: left;
color: White;
font-weight: bold;
font-family: Arial;
font-size: 11px;
width: 988px;
height: 25;
margin: 0px;
position: relative;

}


.navMainLEFT
{
padding: 0px;
float: left;
display: block;
padding: 9px 0px 6px 0px;
border-right: solid 2px white;
}

.navMainLEFT a:link, 
.navMainLEFT a:visited,
.navMainLEFT a:active 
{
text-decoration: none;
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: White;
padding: 5px 28px 5px 28px;
margin-right: 2px;
background-image:    url("../images/wrpr/mainNavBkAB035C.gif");
background-repeat: no-repeat;
background-position: top left;
}

.navMainLEFT a:hover 
{
text-decoration: none;
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: White;	
padding: 5px 28px 5px 28px;
border-right: 2px;
background-image:    url("../images/wrpr/mainNavBkFA559E.gif");
background-repeat: no-repeat;
background-position: top left;
}

.mainLeftActive
{
padding: 0px;
float: left;
display: block;
padding: 9px 0px 6px 0px;
border-right: solid 2px white;
}

.mainLeftActive a:link, 
.mainLeftActive a:visited,
.mainLeftActive a:hover,
.mainLeftActive a:active
{
text-decoration: none;
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: White;
padding: 5px 28px 5px 28px;
margin-right: 2px;
background-image:    url("../images/wrpr/mainNavBkFA559E.gif");
background-repeat: no-repeat;
background-position: top left;
}

.navMain
{
padding: 0px;
float: left;
display: block;
padding: 9px 0px 6px 0px;
border-right: solid 2px white;
}

.navMain a:link, 
.navMain a:visited,
.navMain a:active 
{
text-decoration: none;
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: White;
padding: 5px 27px 5px 27px;
margin-right: 2px;
background-image:    url("../images/wrpr/mainNavBkAB035C.gif");
background-repeat: no-repeat;
background-position: top left;
}

.navMain a:hover 
{
text-decoration: none;
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: white;
padding: 5px 27px 5px 27px;
margin-right: 2px;
background-image:    url("../images/wrpr/mainNavBkFA559E.gif");
background-repeat: no-repeat;
background-position: top left;
}

.topActive
{
padding: 0px;
float: left;
display: block;
padding: 9px 0px 6px 0px;
border-right: solid 2px white;
}

.topActive a:link, 
.topActive a:visited, 
.topActive a:hover,
.topActive a:active 
{
text-decoration: none;
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: White;
padding: 5px 27px 5px 27px;
margin-right: 2px;
background-image:    url("../images/wrpr/mainNavBkFA559E.gif");
background-repeat: no-repeat;
background-position: top left;
}

.navMainRIGHT
{
padding: 0px;
float: left;
display: block;
padding: 9px 0px 6px 0px;
}

.navMainRIGHT a:link, 
.navMainRIGHT a:visited,
.navMainRIGHT a:active 
{
text-decoration: none;
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: White;
padding: 5px 29px 5px 29px;
background-image:    url("../images/wrpr/mainNavBkAB035C.gif");
background-repeat: no-repeat;
background-position: top left;
}


.navMainRIGHT a:hover 
{
text-decoration: none;
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: White;	
padding: 5px 29px 5px 29px;
background-image:    url("../images/wrpr/mainNavBkFA559E.gif");
background-repeat: no-repeat;
background-position: top left;
}

.mainRightActive
{
padding: 0px;
float: left;
display: block;
padding: 9px 0px 6px 0px;
}

.mainRightActive a:link, 
.mainRightActive a:visited,
.mainRightActive a:hover,
.mainRightActive a:active
{
text-decoration: none;
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: White;
padding: 5px 29px 5px 29px;
background-image:    url("../images/wrpr/mainNavBkFA559E.gif");
background-repeat: no-repeat;
background-position: top left;
}

.headrule
{
border-bottom: 2px #AB035C solid;
padding-bottom: 8px;
*padding-bottom: 3px;
}

/*-LEFT NAV-----------------------------------------------------------------------------
---Broken down by levels with hovers and active states driven by JavaScript.  The class
---names should be a pretty good indication of what each style does.
--------------------------------------------------------------------------------------*/

/*-Container for the entire left bar including left nav and left side content-*/
#leftBar 
{
margin: 0px;
width: 250px;
float: left;
font-family: Arial;
font-size: 11px;
font-weight: bold;
position: relative;
margin-top: 14px;
}

#leftBar p
{
margin: 0px;
}

/*-Rounded corner dark grey bar used for titles in the left bar area-*/    
.titleBar
{
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: White;
background-image:   url("../images/wrpr/titleBar.gif");
line-height: 25px;
text-indent: 10px;
margin-top: 2px;
}


ul.navLvl2-4, ul.navLvl2-4 ul
{
padding: 0px; 
margin: 0px; 
list-style-type: none; 
width: 250px;
font-family: Arial;
font-size: 11px;
font-weight: bold;
line-height: 26px;
}

li.navLvl2linkActive a:link, 
li.navLvl2linkActive a:visited 
{
display: block; 
width: 250px;
text-decoration: none; 
color: white;
text-indent: 20px;
line-height: 26px;
background-image:   url("../images/wrpr/navLevel2active.gif");
font-family: Arial;
font-size: 11px;
font-weight: bold;
}

li.navLvl2linkActive a:hover, 
li.navLvl2linkActive a:active 
{
display: block; 
width: 250px;
text-decoration: none; 
color: white;
text-indent: 20px;
line-height: 26px;
background-image:   url("../images/wrpr/navLevel2active.gif");
font-family: Arial;
font-size: 11px;
font-weight: bold;
}

li.navLvl2linkActiveNoChild a:link, 
li.navLvl2linkActiveNoChild a:visited,
li.navLvl2linkActiveNoChild a:hover,
li.navLvl2linkActiveNoChild a:active
{
display: block; 
width: 250px;
text-decoration: none; 
color: white;
text-indent: 20px;
line-height: 26px;
background-image:   url("../images/wrpr/navLevel2hover.gif");
font-family: Arial;
font-size: 11px;
font-weight: bold;
}

li.navLvl2link a:link, 
li.navLvl2link a:visited 
{
display: block; 
width: 250px;
text-decoration: none; 
color: black;
text-indent: 20px;
line-height: 26px;
background-image:   url("../images/wrpr/navLevel2inactive.gif");
font-family: Arial;
font-size: 11px;
font-weight: bold;
}

li.navLvl2link:hover a:hover, 
li.navLvl2link a:hover 
{
border:0; 
color: white;
text-indent: 20px;
line-height: 26px;
background-image:   url("../images/wrpr/navLevel2hover.gif");
}

li.navLvl3Active a:link,
li.navLvl3Active a:visited,
li.navLvl3Active a:hover,
li.navLvl3Active a:active
{
display: block;
width: 250px;
color: #a60a58;
text-indent: 20px;
line-height: 26px;
font-family: Arial;
font-size: 10px;
background-color: #ebebeb;
border-bottom: solid 1px white;
text-decoration: none;
font-weight: bold;
margin: 0px;
}

li.navLvl3 a:link,
li.navLvl3 a:visited
{
display: block;
width: 250px;
text-decoration: none; 
color: black;
text-indent: 20px;
line-height: 26px;
font-family: Arial;
font-size: 10px;
background-color: #ebebeb;
border-bottom: solid 1px white;
text-decoration: underline;
font-weight: bold;
margin: 0px;
padding: 0px;
}

li.navLvl3 a:hover,
li.navLvl3 a:active
{
display: block; 
color: #a60a58;
text-indent: 20px;
line-height: 26px;
background-color: #ebebeb;
border-bottom: solid 1px white;
text-decoration: none;
margin: 0px;
padding: 0px;
}



/*-LEFT SIDE CONTENT-------------------------------------------------------------------*/

.leftItem
{ 
line-height: 16px;
font-family: Arial;
font-size: 11px;
color: black;
border-top: solid 2px white;
background-color: #dddddd;
font-weight: normal;
}

.leftItem a:link,
.leftItem a:visited
{ 
display:block;	
line-height: 12px;
padding: 5px 10px 5px 10px;
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: #000000;
text-decoration: none;
}

.leftItem a:hover
{ 
line-height: 12px;
font-weight: bold;
font-family: Arial;
color: #ffffff;
background-color:#FA559E;
text-decoration: none;
}


/*-CONTENT AREA STYLES-------------------------------------------------------------------------
---These styles are global for content. Includes breadcrumbs, email and print, content links,
---content images, content linked images, H1-H4, P, image float classes for floating content 
---images and etc. Section specific styles will have their own CSS files, so if you are changing 
---something here and find that it isn't reading, its probably being overwritten by a section 
---specific style sheet.
----------------------------------------------------------------------------------------------*/

#content 
{
font-family: Arial;
font-size: .75em;
color: Black;
float: right;
/*width: 692px;*/
position: relative;
margin-top: 20px;
margin-right: 12px;
}

#content #printEmail 
{
float: right;
}

#breadCrumb
{
font-family: Arial;
font-size: 1em;
margin-bottom: 20px;
color: Black;
}

#breadCrumb a:link,
#breadCrumb a:visited
{
font-family: Arial;
color: #a00256;
font-size: 1em;
text-decoration: underline;
padding: 1px;
display: inline;
}

#breadCrumb a:hover,
#breadCrumb a:active
{
font-family: Arial;
color: white;
font-size: 1em;
display: inline;
text-decoration: none;
background-color: #fa559e;
padding: 1px;
}

#content p a:link,
#content p a:visited
{
font-family: Arial;
font-size: 1em;
color: #ab035c;
text-decoration: underline;
padding: 1px;
}


#content p a:hover,
#content p a:active
{
font-family: Arial;
font-size: 1em;
color: white;
text-decoration: none;
display: inline;
background-color: #fa559e;
padding: 1px;
}

#content p 
{
font-family: Arial;
margin-top: 0px;
margin-bottom: 18px;
}

#content p.highLight
{
font-family: Arial;
font-size: 1em;
color: Black;
margin-top: 0px;
margin-bottom: 30px;
}

#content h1 
{
margin-top: 0px;
font-family: Arial;
font-size: 1.67em;
color: black;
}

#content h2 
{
margin-top: 0px;
margin-bottom: 0px;
font-family: Arial;
font-size: 1.17em;
color: #a00256;
font-weight: bold;
}

#content h3 
{
margin-top: 0px;
margin-bottom: 0px;
font-family: Arial;
font-size: 1em;
color: #a00256;
font-weight: bold;
}

#content h4
{
margin-top: 0px;
margin-bottom: 0px;
font-family: Arial;
font-size: 1em;
color: gray;
font-weight: bold;
}

.ribbonSmall 
{
display: block;
font-size: .88em;
margin: 0px;
text-indent: 15px;
background-image:   url("../images/wrpr/ribbonSmall.gif");
background-repeat: no-repeat;
}

/*-marketplace 2 color H1-*/	
#content h1 span 
{
margin-top: 0px;
margin-bottom: 0px;
font-family: Arial;
font-size: 1.13em;
color: #a00256;
line-height: 28px;
font-weight: normal;
}

#content img.floatLeft
{
float: left;
border: solid 1px Gray;
margin: 0px 30px 30px 0px;
}

/*-Content image floats, with margins set to space words from images-*/
#content img.floatRight
{
float: left;
border: solid 1px Gray;
margin: 0px 30px 30px 0px;
}

#content img.floatRight
{
float: Right;

border: solid 1px Gray;
margin: 0px 0px 30px 30px;
}

img.rightFloatImage 
{
float: right;
margin: 30px 0px 30px 40px;
}

/*-stlyle for the "*" on required form fields-*/   
.required 
{
font-size: 2em;
font-weight: bold;
color: #a60a58; 
}

/*-CONTENT BUTTON STYLES-------------------------------------------------------*/

#content a.btnShop:link,
#content a.btnShop:visited  
{
font-family: Arial;
font-size: 14px;
font-weight: bold;
line-height: 31px;
color: white;
display: inline;
text-decoration: none;
background-image:   url("../images/wrpr/btnShop.gif");
margin: 0px;
padding: 7px 59px 8px 10px;
margin-bottom: 30px;
}

#content a.btnShop:hover
{
font-family: Arial;
font-size: 14px;
font-weight: bold;
line-height: 31px;
color: white;
display: inline;
text-decoration: none;
background-image:   url("../images/wrpr/btnShop.gif");
margin: 0px;
padding: 7px 59px 8px 10px;
background-position: 0px -31px;
margin-bottom: 30px;
}

#content a.btnShop:active
{
font-family: Arial;
font-size: 14px;
font-weight: bold;
line-height: 31px;
color: white;
display: inline;
text-decoration: none;
background-image:   url("../images/wrpr/btnShop.gif");
margin: 0px;
padding: 7px 59px 8px 10px;
background-position: 0px -62px;
margin-bottom: 30px;
}


a.pillButtonCheck:link, 
a.pillButtonCheck:visited 
{
display: block; 
width: 127px;
text-decoration: none; 
color: white;
text-indent: 10px;
line-height: 25px;
background-image:   url("../images/wrpr/pillButtonCheck.gif");
font-family: Arial;
font-size: 11px;
list-style-type: none;
text-align: left;
margin:10px;
float:right;
}

a.pillButtonCheck:hover 
{
display: block; 
width: 127px;
text-decoration: none; 
border: 0px; 
color: white;
text-indent: 10px;
line-height: 25px;
background-image:   url("../images/wrpr/pillButtonCheck.gif");
background-position: 0px -30px;
list-style-type: none;
text-align: left;
float:right;
}

a.pillButtonCheck:active
{
display: block; 
width: 127px;
text-decoration: none; 
border: 0px; 
color: white;
text-indent: 10px;
line-height: 25px;
background-image:   url("../images/wrpr/pillButtonCheck.gif");
background-position: 0px -60px;
list-style-type: none;
text-align: left;
float:right;
}

a.pillButtonGrey:link, 
a.pillButtonGrey:visited 
{
display: block; 
width: 127px;
text-decoration: none; 
color: white;
text-indent: 10px;
line-height: 25px;
background-image:   url("../images/wrpr/pillButtonGrey.gif");
font-family: Arial;
font-size: 11px;
list-style-type: none;
text-align: left;
margin:10px;
float:right;
}

a.pillButtonGrey:hover 
{
display: block; 
width: 127px;
text-decoration: none; 
border: 0px; 
color: white;
text-indent: 10px;
line-height: 25px;
background-image:   url("../images/wrpr/pillButtonGrey.gif");
background-position: 0px -30px;
list-style-type: none;
text-align: left;
float:right;
}

a.pillButtonGrey:active
{
display: block; 
width: 127px;
text-decoration: none; 
border: 0px; 
color: white;
text-indent: 10px;
line-height: 25px;
background-image:   url("../images/wrpr/pillButtonGrey.gif");
background-position: 0px -60px;
list-style-type: none;
text-align: left;
float:right;
}

a.pillButtonShort:link, 
a.pillButtonShort:visited 
{
display: block; 
width: 127px;
text-decoration: none; 
color: white;
text-indent: 10px;
line-height: 25px;
background-image:   url("../images/wrpr/pillButtonShort.gif");
font-family: Arial;
font-size: 11px;
list-style-type: none;
text-align: left;
margin-bottom:10px;
}

a.pillButtonShort:hover 
{
display: block; 
width: 127px;
text-decoration: none; 
border: 0px; 
color: white;
text-indent: 10px;
line-height: 25px;
background-image:   url("../images/wrpr/pillButtonShort.gif");
background-position: 0px -30px;
list-style-type: none;
text-align: left;
}

a.pillButtonShort:active
{
display: block; 
width: 127px;
text-decoration: none; 
border: 0px; 
color: white;
text-indent: 10px;
line-height: 25px;
background-image:   url("../images/wrpr/pillButtonShort.gif");
background-position: 0px -60px;
list-style-type: none;
text-align: left;
}

a.pillButton:link, 
a.pillButton:visited 
{
display: block; 
width: 147px;
text-decoration: none; 
color: white;
text-indent: 10px;
line-height: 25px;
background-image:   url("../images/wrpr/pillButton.gif");
font-family: Arial;
font-size: 11px;
list-style-type: none;
text-align: left;
margin-bottom:10px;
}

a.pillButton:hover 
{
display: block; 
width: 147px;
text-decoration: none; 
border: 0px; 
color: white;
text-indent: 10px;
line-height: 25px;
background-image:   url("../images/wrpr/pillButton.gif");
background-position: 0px -30px;
list-style-type: none;
text-align: left;
}

a.pillButton:active
{
display: block; 
width: 147px;
text-decoration: none; 
border: 0px; 
color: white;
text-indent: 10px;
line-height: 25px;
background-image:   url("../images/wrpr/pillButton.gif");
background-position: 0px -60px;
list-style-type: none;
text-align: left;
}


/*-MARKETPLACE--------------------------------------------------------*/

.total
{
font-size: 1.13em;
color: black;
}

.totalAmount 
{
font-size: 1.13em;
color: #ab035c;
}

a.table:link,
a.table:visited
{
font-family: Arial;
font-size: .88em;
color: #ab035c;
text-decoration: underline;
}

#marketNav
{
margin: 0px;
font: arial;
font-size: 1em;
margin-bottom: 5px;
background-color: white;
width: 450px;
}

#marketNav a:link,
#marketNav a:visited
{
margin: 0px;
font: arial;
font-size: 1em;
color: #ab035c;
text-decoration: underline;
}

#marketNav a:hover,
#marketNav a:active
{
margin: 0px;
font: arial;
font-size: 1em;
color: #ab035c;
text-decoration: none;
}


/*-MARKETPLACE PROGRESS INDICATION-----------------------------------------*/

#progress 
{
margin: 0px;
padding: 2px;
padding-top: 6px;
list-style-type: none;
display: block;
width: 100%;
border-bottom: solid 1px #e7e7e7;
border-top: solid 1px #e7e7e7;
}

#progress li.dots 
{
margin: 0px;
padding: 0px;
list-style-type: none;
display: block;
float: left;
padding-right: 92px;
background-image:   url("../images/wrpr/progDotted.gif");
margin-left: 7px;
}

#progress li
{
margin: 0px;
padding: 0px;
list-style-type: none;
display: block;
float: left;
margin-left: 7px;
}

/*-MARKETPLACE FORMS-------------------------------------------------*/

form.sizeForm 
{
margin-top: 4px;
}

input.quantity
{
border: solid 1px #696969;
width: 50px;
padding: 3px 5px 3px 5px;
margin-right: 10px;
}

input.btnCheckout 
{
margin-bottom: -7px; 
}


/*-TABLE CELL STYLES--------------------------------------------------------*/

.whiteOnPink 
{
background-color: #ab035c;
color: White;
padding: 5px;
}

.border 
{
border: solid 1px #e7e7e7;
margin:5px;
vertical-align: top;
padding: 5px;
background-color: White;
}

.tableContainer 
{
background-color: #f1f1f1; 
padding: 20px;
}

.tablePink 
{
background-color: #ffe4ed;
padding: 5px;
vertical-align: top;
}

.tableGrey 
{
background-color: #f1f1f1;
padding: 5px;
vertical-align: top;
}

.tablePad 
{
padding: 5px;
vertical-align: top;
}

.alignRightNoColor 
{
vertical-align: top;
padding: 5px;
text-align: right;
}

.alignRightPink 
{
vertical-align: top;
padding: 5px; 
text-align: right;
background-color: #ffe4ed;
}

.alignRightGrey 
{
vertical-align: top;
padding: 5px;
text-align: right;
background-color: #f1f1f1;
}	


/*-PRODUCT BOX STYLES-----------------------------------------------------------------------

---These are marketplace specific styles for the boxes which contain product images, name,
---and price. These may have to be rethought because of the varying heights based on 
---longer product names which cause the boxes to wrap strangely.
------------------------------------------------------------------------------------------*/    

ul.productConsider 
{
margin: 0px;
padding: 0px;
list-style-type: none;
float: left;
}

ul.productConsider  li
{
padding:10px;
margin: 10px 20px 10px 0px;
display: inline;
list-style-type: none;
border: solid 1px gray;
float: left;
text-align: left;
width: 129px;
font-size: 14px;
}

ul.productConsider li a:link,
ul.productConsider li a:visited,
ul.productConsider li a:hover,
ul.productConsider li a:active
{
font: arial;
font-size: .88em;
color: #ab035c;
text-decoration: underline;
font-weight: bold;
}
#productContainer 
{
width: 100%;
}

ul.pageNumbers 
{
margin: 20px 0px 10px 0px;
padding: 0px;
list-style-type: none;
}

ul.pageNumbers li
{
margin: 0px;
padding: 0px;
display: inline;
margin-right: 1px;
}

ul.pageNumbers li a,
ul.pageNumbers li a:link,
ul.pageNumbers li a:visited,
ul.pageNumbers li a:hover,
ul.pageNumbers li a:active
{
font: arial;
font-size: .88em;
color: #ab035c;
padding: 0px 4px 4px 4px;
}

ul.pageNumbers li.activePage a,
ul.pageNumbers li.activePage a:link,
ul.pageNumbers li.activePage a:visited,
ul.pageNumbers li.activePage a:hover,
ul.pageNumbers li.activePage a:active
{
font: arial;
font-size: .88em;
color: #ab035c;
background-color: #e7e7e7;
padding: 2px 4px 2px 4px;
font-weight: bold;
}

.totalPages 
{
clear: both;
font: arial;
font-size: .88em;
color: black;
float: right;
font-weight: bold;
margin-top: -25px;
margin-bottom: 10px;
}

.totalPages a,
.totalPages a:link,
.totalPages a:visited,
.totalPages a:hover,
.totalPages a:active
{
font: arial;
font-size: 1em;
color: #ab035c;
font-weight: bold;
}


/*-FOOTER----------------------------------------------------------*/

#footer 
{
position: relative;
/*margin-top: 18px;*/
line-height: 27px;
color: White;
font-family: Arial;
font-size: 10px;
width: 988px;
padding-left: 10px;
padding-right: 10px;
text-align: center;
margin-bottom: 10px;
background-color: #ab035c;
}

#footer a 
{
color: White;
font-family: Arial;
font-size: 10px;
text-decoration: underline;
}

#footer .footerBold 
{
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
color: White;
font-family: Arial;
font-size: 11px;
font-weight: bold;

}

#footer span.footerBold a
{
color: White;
font-family: Arial;
font-size: 11px;
font-weight: bold;
text-decoration: underline;
}

.footerFloat 
{
padding-left: 10px;
float: left;
color: white;
}

.footerFloat2 
{
float: left;
padding-top: 2px;
text-align: center;
margin-left: 140px;
}

.footerFloat3 
{
font-size: 10px;
padding-top: 2px;
float: right;
text-align: right;
color: white;
}

/*-CONTROL BOX------------------------------------------------------------------------
---This box is reusable in content areas as well, but should only be used for controls
---like search and etc.  It is resizable, and will stretch to 100% of its parent.
-------------------------------------------------------------------------------------*/

.dialog 
{
width:100%;
margin:0px auto;
min-width:20em;
color:#fff;
}

.dialog .hd .c,
.dialog .ft .c 
{
font-size:1px; /* ensure minimum height */
height:13px;
}

.dialog .ft .c 
{
height:14px;
}

.dialog .hd 
{
background:transparent url("../images/wrpr/tl.gif") no-repeat 0px 0px;
}

.dialog .hd .c 
{
background:transparent url("../images/wrpr/tr.gif") no-repeat right 0px;
}

.dialog .bd 
{
background:transparent url("../images/wrpr/ml.gif") repeat-y 0px 0px;
}

.dialog .bd .c 
{
background:transparent url("../images/wrpr/mr.gif") repeat-y right 0px;
}

.dialog .bd .c .s 
{
margin:0px 8px 0px 4px;

background: #e7e7e7 url("../images/wrpr/ms.jpg") repeat-x 0px 0px;
padding:1em;
}

.dialog .ft 
{
background:transparent url("../images/wrpr/bl.gif") no-repeat 0px 0px;
}

.dialog .ft .c 
{
background:transparent url("../images/wrpr/br.gif") no-repeat right 0px;
}

.dialog h1 
{
/* side search header */
font-size: 14px;
margin:0px;
padding:0px;
margin-top:-0.6em;
color: #717171;
font-weight: bold;
font: arial;
}

.dialog p 
{
font: arial;
font-style: italic;
font-weight: normal;
color: #717171;
margin: 0px;
font-size: 11px;
}

.dialog p.help
{
font: arial;
font-weight: normal;
color: #717171;
margin: 40px 0px 0px 0px;
font-size: 11px;
font-style: normal;
}

.dialog p.help a:link,
.dialog p.help a:visited,
.dialog p.help a:hover,
.dialog p.help a:active
{
font: arial;
font-style: normal;
font-weight: normal;
color: #717171;
margin: 0px;
font-size: 11px;
text-decoration: underline;
}


/*-SIDE BAR FORM STYLES--------------------------------------------------------------------------*/

form.search2
{
margin: 5px 0px 5px 0px;
padding: 0px;
}

input.search2
{
border: solid 1px #696969;
width: 180px;
padding: 2px 5px 2px 5px;
}

form.search3
{
margin: 5px 0px 5px 0px;
padding: 0px;
}

input.search3
{
border: solid 1px #696969;
width: 202px;
padding: 2px 5px 2px 5px;
}

label.labelSideSearch 
{
display: block;
font: arial;
font-size: 11px;
color: Black;
font-weight: bold;
padding: 6px 0px 3px 0px;
}

input.btnLogin
{
float:right;
margin: 7px 0px 10px 10px;

}

/*-FLOATING BOX / PARENT CONTAINER HACK-------------------------------------------------------------
This hack insures that the #contentNavContainer DIV stretches to meet the size of its floated 
children (leftBar and content). Removing it will destroy everything below the header.
--------------------------------------------------------------------------------------------------*/

#contentNavContainer:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#ContentNavContainer { display: inline-block; _height: 1%; }

#header:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#header { display: inline-block; _height: 1%; }

#progress:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#progress { display: inline-block; _height: 1%; }

#footer:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#footer { display: inline-block; _height: 1%; }



/* ============ additions to komen style for templating ============ */

#pnav
{
font-family: Arial;
font-weight: bold;
font-size: 9pt;
color: #ffffff;
text-decoration: none;
padding-left: 2px;
padding-right: 2px;
}
#pnav a:link
{
font-weight: bold;
color: #ffffff;
text-decoration: none;
padding-left: 2px;
padding-right: 2px
}
#pnav a:visited
{
	font-weight: bold;
	color: #FFFFFF;
	text-decoration: none;
	padding-left: 2px;
	padding-right: 2px
}
#pnav a:active
{
font-weight: bold;
color: #FFFFFF;
text-decoration: none;
display: inline;
background-color: #fa559e;
padding-left: 2px;
padding-right: 2px
}
#pnav a:hover
{
font-weight: bold;
color: white;
text-decoration: none;
display: inline;
background-color: #fa559e;
padding-left: 2px;
padding-right: 2px
}

#snav
{
font-family: Arial;
font-weight: bold;
font-size: 9pt;
color: #ffffff;
text-decoration: none;
padding-left: 2px;
padding-right: 2px
}
#snav a:link, a:visited
{
font-weight: bold;
color: #ffffff;
text-decoration: none;
padding-left: 2px;
padding-right: 2px
}


#snav a:active
{
font-weight: bold;
text-decoration: none;
display: inline;
background-color: #ab035c;
padding-left: 2px;
padding-right: 2px
}
#snav a:hover
{
font-weight: bold;
color: white;
text-decoration: none;
display: inline;
background-color: #ab035c;
padding-left: 2px;
padding-right: 2px
}

#carea {
width:838px;
}

#carea .TitleBar {
	background-image: none;
	color:black;
}

#carea .TitleBar a{
	background-color: #ffffff;
	background-image: none;
	color:black;
	font-family: Arial;
	font-size: 11px;
	text-decoration:none;
}
#carea .TitleBar a:hover{
	background-color: #ffffff;
	background-image: none;
	color:black;
	font-family: Arial;
	font-size: 11px;
	text-decoration:none;
}
#carea a:link, #carea a:visited
{
font-family: Arial;
font-size: 9pt;
color: #ab035c;
text-decoration: underline;
padding: 2px;
}

#carea a:active
{
color: white;
text-decoration: none;
display: inline;
background-color: #fa559e;
}
#carea a:hover
{
color: white;
text-decoration: none;
display: inline;
background-color: #fa559e;
}

#carea td [align="center"] a:hover
{
	color: white;
	text-decoration: none;
	display: inline;
	background:none;
	border:0px transparent solid;
}
.newtitleBar
{
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: White;
background-color: #707070;
line-height: 25px;
text-indent: 10px;
margin-top: 3px;
}

.newtitleBarBottom
{
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: White;
background-color: #707070;
line-height: 15px;
text-indent: 10px;
margin-top: 0px;
}

.titleBarBottom
{
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: White;
background-image:   url("../images/wrpr/titleBarBottom.gif");
line-height: 20px;
text-indent: 10px;
margin-top: 0px;
}

.leftItemTop
{ 
line-height: 16px;
padding: 5px 10px 5px 10px;
font-family: Arial;
font-size: 11px;
color: #FFFFFF;
border-bottom: solid 1px white;
background-image:   url("../images/wrpr/titleBarPink.gif");
font-weight: bold;
}

.leftItemTop a:link,
.leftItemTop a:visited
{ 
line-height: 12px;
font-weight: bold;
font-family: Arial;
font-size: 11px;
color: #FFFFFF;
text-decoration: none;
}

.leftItemTop a:hover
{ 
line-height: 12px;
font-weight: bold;
font-family: Arial;
color: #FFFFFF;
text-decoration: underline;
}

.ErrorMessage {
color:red !important;
}