/*  Define any CSS styles you wish to here. Whilst they will applied to the homepage only,
	you *may* need to !important them to so they take precedence. */

/* Home hero area */
#heroContainer
{
  margin: 0 0 10px 0;
  padding: 0;
  height: 380px;
}

#slideshowContainer
{
  float: left;  
  width: 630px;
  height: 380px;
}

#slideshow
{
  width: 630px;
  height: 320px;
  overflow: hidden;
}

#slideshow div
{
  width: 630px;
  height: 320px;
}

#slideshowNav
{
  padding: 23px 0 0 0;
  margin: 0;
  height: 37px;
  text-align: center;
}

#slideshowNav .slideshowBtn
{
  margin: 0 12px 0 12px;
}

#heroPromoContainer
{
  float: left;
  width: 310px;
  height: 380px;
  margin: 0;
  padding: 0 0 0 10px;
}

.heroPromoItem
{
  width: 310px;
  height: 120px;
  padding: 0;
  margin: 0 0 10px 0;
  overflow: hidden;
}

.deckShoeMen
{
  background: transparent url(deck-shoe-men-promo-bg.gif) no-repeat scroll left top;
}

.deckShoeWomen
{
  background: transparent url(deck-shoe-women-promo-bg.gif) no-repeat scroll left top;
}

.enduro
{
  background: transparent url(enduro-promo-bg.gif) no-repeat scroll left top;
}

a.heroPromoLink:link, a.heroPromoLink:hover, a.heroPromoLink:active, a.heroPromoLink:visited
{
  margin: 0;
  padding: 120px 0 0 0;
  display: block;
  color: white;
  text-decoration: none;
  font-size: 36px;
  line-height: 1em;
  background: transparent url(hero-promo-sprite.jpg) no-repeat scroll left top;
}

a.deckShoeMenLink:link, a.deckShoeMenLink:visited
{
  background-position: 0 0;
}

a.deckShoeMenLink:hover
{
  background-position: 0 -120px;
}

a.deckShoeWomenLink:link, a.deckShoeWomenLink:visited
{
  background-position: 0 -240px;
}

a.deckShoeWomenLink:hover
{
  background-position: 0 -360px;
}

a.enduroLink:link, a.enduroLink:visited
{
  background-position: 0 -480px;
}

a.enduroLink:hover
{
  background-position: 0 -600px;
}

/* Intro */
#introContainer
{
  margin: 0;
  padding: 39px 0 30px 0;
}

#introContainer h1
{
  display: block !important;
  font-family: georgia, arial, helvetica, sans-serif;
  font-size: 36px;
  font-weight: normal;
  line-height: 1em;
  margin-top: 0;
  margin-bottom: 0.1em;
}

#introContainer p
{
  font-size: 14px;
  color: #545454;
  line-height: 1.8em;
  margin-bottom: 0;
}

/* Home promo area */
#promoContainer
{
  margin: 0 0 30px 0;
  padding: 0;
}

/* Home feature area */
#featContainer
{
  margin: 0 0 20px 0;
  padding: 0;
}

.featItem
{
  float: left;
  overflow: hidden;
  width: 310px;
  height: 120px;
  margin: 0 10px 0 0;
  padding: 0;
  text-align: left;
}

.featFirst
{
  background: transparent url(feat-shop-mens-bg.jpg) no-repeat scroll left top;
}

.featMiddle
{
  background: transparent url(feat-shop-womens-bg.jpg) no-repeat scroll left top;
}

.featLast
{
  background: transparent url(feat-download-catalogue-bg.jpg) no-repeat scroll left top;
  margin-right: 0;
}

a.featLink:link, a.featLink:hover, a.featLink:active, a.featLink:visited
{
  margin: 0;
  padding: 19px 0 40px 10px;
  display: block;
  color: #172d56;
  text-decoration: none;
  font-size: 50px;
  line-height: .8em;
}

a.featLink span
{
  font-size: 35px;
  font-weight: bold;
}

.featMiddle a.featLink:link, .featMiddle a.featLink:hover, .featMiddle a.featLink:active, .featMiddle a.featLink:visited
{
  color: #172d56;
}

/* Home hero product area */
#heroProdContainer
{
  margin: 0 0 20px 0;
  padding: 0;
}

.heroProdWrapper
{
  margin: 0;
  padding: 0;
}

.heroProdItem
{
  float: left;
  position: relative;
  width: 460px;
  height: 390px;
  margin: 0 10px 0 0;
  padding: 0;
  border: solid 5px #c5c5c5;
}

.heroProdItemLast
{
  margin-right: 0;
}

.heroProdCorner
{
  position: absolute;
  top: -5px;
  left: -5px;
  width: 114px;
  height: 112px;
  margin: 0;
  padding: 0;
}

.heroProdLeftCol
{
  float: left;
  width: 290px;
  margin: 0 10px 0 0;
  padding: 15px 0 0 10px;
}

.heroProdRightCol
{
  float: left;
  width: 145px;
  margin: 0;
  padding: 15px 0 0 0;
}

.heroProdLeftCol img, .heroProdRightCol img
{
  border: solid 1px #c5c5c5;
}

.heroProdImgMain
{
  margin: 0 0 18px 0;
  padding: 0;
}

.heroProdName, .heroProdDesc, .heroProdSize, .heroProdPrice
{
  display: block;
  font-family: arial, helvetica, sans-serif;
}

.heroProdName
{
  margin-bottom: 0.5em;
  font-size: 24px;
  font-weight: bold;
  color: #003c70;
}

a.heroProdNameLink:link, a.heroProdNameLink:hover, a.heroProdNameLink:active, a.heroProdNameLink:visited
{
  font: inherit;
  text-decoration: none;
}

.heroProdDesc, .heroProdSize
{
  font-size: 12px;
  color: #5e5e5e;
}

.heroProdSize
{
  margin-top: 45px;
  margin-bottom: 1em;
}

.heroProdPrice
{
  margin-bottom: 40px;
  font-size: 16px;
  color: #5e5e5e;
}

.heroProdImgDetail
{
  margin: 0 0 20px 0;
  padding: 0;
}

.heroProdBtn
{
  margin: 0 0 10px 0;
  padding: 0;
}

.heroProdBtn img
{
  border: none;
}

/* Home product area */
#prodContainer
{
  margin: 0 0 20px 0;
  padding: 0;
}

.prodItemWrapper
{
  margin: 0;
  padding: 0;
}

.prodItem
{
  float: left;
  overflow: hidden;
  width: 220px;
  height: 210px;
  border: solid 5px #c5c5c5;
  margin-right: 10px;
}

.prodItemLast
{
  margin-right: 0;
}

.prodLink
{
  display: block;
  text-decoration: none !important;
}

.prodImg
{
  width: 220px;
  height: 118px;
  padding: 0;
  overflow: hidden;
  display: block;
}

.prodName, .prodDesc
{
  display: block;
  line-height: 1.3em;
  padding: 0 10px;
}

.prodName
{
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 0.5em;
  line-height: 1em;
}

.prodWasPrice
{
  text-decoration: line-through;
}

.prodNewPrice
{
  color: #bb0026;
}

.prodDesc
{
  padding-bottom: 40px;
  font-size: 12px;
  color: #5e5e5e;
}

.prodBuyLink
{
  color: #ffc000;
  text-decoration: underline;
}

/* Home news area */
#newsContainer
{
  margin: 0 0 30px 0;
  padding: 0;
}

.newsItemWrapper
{
  margin: 0;
  padding: 0;
}

.newsItem
{
  float: left;
  width: 310px;
  margin-right: 10px;
}

.newsItemLast
{
  margin-right: 0;
}

.newsContentWrapper
{
  margin: 0;
  padding: 0 10px 0 0;
}

.newsItem h3
{
  margin-bottom: .5em;
}

a.newsItemHeader
{
  font-size: 18px;
  color: #003c70;
  text-decoration: none;
  font-weight: normal;
}

.newsDate
{
  color: #888888;
  font-size: 12px;
}

.newsItem p
{
  color: #474747;
  line-height: 1.3em;
  margin-bottom: 0;
}

.newsImg
{
  float: right;
  width: 80px;
  height: 80px;
  margin: 0 0 0 10px;  
}

a.newsItemMoreLink
{
  color: #ffc000;
  text-decoration: underline;
}

/* Home social area */
#socialContainer
{
  margin: 0 0 30px 0;
  padding: 0;
}

.socialItemWrapper
{
  margin: 0;
  padding: 0;
}

.socialItem
{
  float: left;
  overflow: hidden;
  margin-right: 10px;
  width: 470px;
  height: 100px;
}

.socialItemWrapper .twitter
{
  background: transparent url(social-twitter-bg.jpg) no-repeat scroll left top;
}

.socialItemWrapper .facebook
{
  background: transparent url(social-facebook-bg.jpg) no-repeat scroll left top;
  margin-right: 0;
}

a.socialLink:link, a.socialLink:hover, a.socialLink:active, a.socialLink:visited
{
  margin: 0;
  padding: 17px 40px 40px 104px;
  display: block;
  color: #2d2d2d;
  text-decoration: none;
  font-size: 18px;
  font-weight: normal;
  line-height: 1.5em;
}

/* Home pre footer area */
#preFooterContainer
{
  margin: 0 0 60px 0;
  padding: 0;
}

.preFooterItemWrapper
{
  margin: 0;
  padding: 0;
}

.preFooterItem
{
  float: left;
  overflow: hidden;
  margin: 0 116px 0 0;
  width: 150px;
  height: 93px;
}

.preFooterItemLast
{
  margin-right: 0;
}