/* general */ .sprite {display:block; text-indent:-6000px; overflow:hidden; text-transform:capitalize} /* forms */ .cform legend,.cform label{position:relative;top:5px;font-size:11px;line-height:14px} .cform input,.cform textarea{font-size:11px} .cform legend{padding-bottom:14px} .cform label,.cform input,.cform textarea,.cform select,.cform button{margin-bottom:0} .cform input[type='text'],.cform input[type='password'],.cform textarea{border-width:1px;border-style:solid;border-color:#005395;padding:1px 2px} .cform input[type='text'],.cform input[type='password'],.cform textarea,.cform select{height:16px;margin-top:2px;margin-bottom:6px} .cform textarea{display:block;line-height:14px;height:108px} .cform input[type='submit'],.cform button{margin-top:2px;margin-bottom:6px} /* lookbook 2010 */ #lookbook {position:relative; padding:10px; height:720px; background-color:#fff} /* grid of images */ .cell {position:absolute} .cell a, .cell img {display:block} /* row 1 */ .cell_1 {top:15px; left:15px} .cell_2 {top:15px; left:255px} .cell_3 {top:15px; left:495px} .cell_4 {top:15px; left:735px} /* row 2*/ .cell_5 {top:255px; left:15px} .cell_6 {top:255px; left:255px} .cell_7 {top:255px; left:495px} .cell_8 {top:255px; left:735px} /* row 3 */ .cell_9 {top:495px; left:15px} .cell_10 {top:495px; left:255px} .cell_11 {top:495px; left:495px} .cell_12 {top:495px; left:735px} /* rollover information panels */ .info {display:none; position:absolute; padding:10px; width:430px; height:210px; background:transparent url('../images/lookbook/2010/spring/info-bg.png?v=1') no-repeat} .info h3, .info p {display:none; width:210px; color:#fff; text-align:center} .info h3 {text-transform:uppercase; line-height:27px; font-size:24px; margin-top:36px; font-family:'Helvetica 25 Ultra Light','HelveticaNeue-UltraLight','Helvetica Light',Helvetica,Arial,sans-serif} .info img {display:block; float:right} /* left column */ .info_1, .info_5, .info_9 {padding-left:30px} /* right column */ .info_4, .info_8, .info_12 {padding-right:30px} .info_1 {top:50px; left:240px} .info_5 {top:255px; left:240px; background-position:0 -230px} .info_9 {top:460px; left:240px; background-position:0 -460px} .info_4 {top:50px; right:240px; background-position:-470px 0} .info_8 {top:255px; right:240px; background-position:-470px -230px} .info_12 {top:460px; right:240px; background-position:-470px -460px} /* contests */ #contests h4 {font-weight:normal; line-height:28px; margin-bottom:28px} #contests .enter {width:660px; padding:0 19px; border:1px solid #005395} #contests .cform label.block {display:block; float:left; width:110px} #contests .cform input[type=text] {display:block; float:left; width:200px} #contests .cform input[type=submit] {display:block; margin-left:110px; margin-bottom:14px; border:none; width:66px; padding:5px 14px; background-color:#005395; color:#fff; text-transform:uppercase; cursor:pointer} #contests .cform input[type=submit]:hover {background-color:#666} #contests .cform input[type=checkbox] {display:none; float:left; position:relative; top:3px; margin-left:110px; margin-bottom:28px; margin-right:5px} #contests .form_error {float:left; margin-left:110px; color:#f00; margin-bottom:14px} /* CUSTOM CHECKBOX */ #contests .cform span.checkbox { width: 20px; height: 15px; padding: 0; background: url(../images/layout/custom-checkbox.png) no-repeat; display: block; clear: left; float: left; } #contests .cform div.boxGroup { width: 24px; float: left; padding-right: 0; padding-top: 4px; padding-bottom: 4px; margin: 4px 0 0 110px; } /* FACEBOOK BUTTON ########################################################## */ .btnFacebook { width: 186px; background-position: -600px -750px; margin: 36px auto 18px auto; } .btnFacebook:hover { background-position: -800px -750px; } .fbHome { display: block; width: 160px; height: 32px; margin-bottom: 22px; text-align: center; text-transform: uppercase; } .fbHome a { text-decoration: none; } .fbHome a:hover { text-decoration: underline; } .fbHome iframe { margin: 6px auto 0 auto; } .fbHome.fbSidebar { width: 220px; height: 32px; margin: 20px 0 22px 0; } iframe { display: block; margin-bottom: 12px; } /* PROMOS ########################################################## */ #ajaxHome { display: none; } .promoLeft img, div.promoRight img { display: block; } #homePromo { width: 520px; height: 520px; display: block; position: relative; } #homePromo .homePromoSet { width: 520px; height: 520px; margin: 0; position: absolute; } #homePromo .homePromoButtons { position: absolute; top: 0; left: 0; } #homePromo .homePromoButtons a { position: absolute; display: block; width: 110px; height: 25px; background: transparent url('/content/images/layout/page-elements-promo.png?v=12') 0 0 no-repeat; border: none; text-indent: -6000px; overflow: hidden; cursor: pointer; color: transparent; text-transform: capitalize; } #homeMens, #homeWomens { height: 266px; } .promoLeft { width: 220px; height: 127px; text-align: center; } .promoLeft p { font-size: 11px; text-align: center; line-height: 14px; margin: 7px 0 14px 0; } .promoRight { width: 160px; height: 190px; overflow: hidden; text-align: center; } #banner { margin-bottom: 20px; } #jeanOfTheDay { border: 1px solid #005395; margin-bottom: 20px; height: 208px; width: 158px; } #jeanOfTheDay img { margin-left: 10px; } #jeanOfTheDay div { background: transparent url('/content/images/layout/page-elements.png?v=4') no-repeat 16px -46px; height: 30px; text-indent:-6000px; overflow: hidden; color: transparent; text-transform: capitalize; margin-top: 10px; } /* PROMOS: Cling */ #homePromo div.homePromoSet img.homePromoCling { position: relative; top: 80px; left: 40px; } /* PROMOS: buttons */ #homePromo .homePromoButtons a.homePromoButtonWomens { height: 32px; width: 118px; top: 320px; left: 40px; background-position: 0 0; } #homePromo .homePromoButtons a.homePromoButtonWomens:hover { background-position: -200px 0; } #homePromo .homePromoButtons a.homePromoButtonMens { height: 32px; width: 118px; top: 360px; left: 40px; background-position: 0 -40px; } #homePromo .homePromoButtons a.homePromoButtonMens:hover { background-position: -200px -40px; } #homePromo .homePromoButtons a.homePromoButtonWomensJeans { height: 34px; width: 188px; top: 320px; left: 40px; background-position: 0px -470px; } #homePromo .homePromoButtons a.homePromoButtonWomensJeans:hover { background-position: -200px -470px; } #homePromo .homePromoButtons a.homePromoButtonMensJeans { height: 34px; width: 188px; top: 360px; left: 40px; background-position: 0px -510px; } #homePromo .homePromoButtons a.homePromoButtonMensJeans:hover { background-position: -200px -510px; } #homePromo .homePromoButtons a.homePromoButtonWomensJeansBlue { height: 24px; width: 148px; top: 320px; left: 40px; background-position: -400px 0; } #homePromo .homePromoButtons a.homePromoButtonWomensJeansBlue:hover { background-position: -600px 0; } #homePromo .homePromoButtons a.homePromoButtonMensJeansBlue { height: 24px; width: 148px; top: 360px; left: 40px; background-position: -400px -40px; } #homePromo .homePromoButtons a.homePromoButtonMensJeansBlue:hover { background-position: -600px -40px; } #homePromo .homePromoButtons a.homePromoButtonWomens4 { width: 152px; height: 28px; top: 320px; left: 40px; background-position: -400px -160px; } #homePromo .homePromoButtons a.homePromoButtonWomens4:hover { background-position: -600px -160px; } #homePromo .homePromoButtons a.homePromoButtonMens4 { width: 152px; height: 28px; top: 360px; left: 40px; background-position: -400px -200px; } #homePromo .homePromoButtons a.homePromoButtonMens4:hover { background-position: -600px -200px; } #homePromo .homePromoButtons a.homePromoButtonWomens5 { width: 148px; height: 24px; top: 320px; left: 40px; background-position: -400px -250px; } #homePromo .homePromoButtons a.homePromoButtonWomens5:hover { background-position: -600px -250px; } #homePromo .homePromoButtons a.homePromoButtonMens5 { width: 148px; height: 24px; top: 360px; left: 40px; background-position: -400px -280px; } #homePromo .homePromoButtons a.homePromoButtonMens5:hover { background-position: -600px -280px; } #homePromo .homePromoButtons a.homePromoButtonWomens6 { width: 152px; height: 36px; top: 320px; left: 40px; background-position: -400px -320px; } #homePromo .homePromoButtons a.homePromoButtonWomens6:hover { background-position: -600px -320px; } #homePromo .homePromoButtons a.homePromoButtonMens6 { width: 152px; height: 36px; top: 360px; left: 40px; background-position: -400px -360px; } #homePromo .homePromoButtons a.homePromoButtonMens6:hover { background-position: -600px -360px; } #homePromo .homePromoButtons a.homePromoButtonWomens7 { width: 148px; height: 34px; top: 320px; left: 40px; background-position: -400px -410px; } #homePromo .homePromoButtons a.homePromoButtonWomens7:hover { background-position: -600px -410px; } #homePromo .homePromoButtons a.homePromoButtonMens7 { width: 148px; height: 34px; top: 360px; left: 40px; background-position: -400px -450px; } #homePromo .homePromoButtons a.homePromoButtonMens7:hover { background-position: -600px -450px; } #homePromo .homePromoButtons a.homePromoButtonWomens8 { height: 32px; width: 148px; top: 320px; left: 40px; background-position: 0 -350px; } #homePromo .homePromoButtons a.homePromoButtonWomens8:hover { background-position: -200px -350px; } #homePromo .homePromoButtons a.homePromoButtonMens8 { height: 32px; width: 148px; top: 360px; left: 40px; background-position: 0 -390px; } #homePromo .homePromoButtons a.homePromoButtonMens8:hover { background-position: -200px -390px; } #homePromo .homePromoButtons a.homePromoButtonDresses { height: 32px; width: 148px; top: 360px; left: 40px; background-position: 0 -430px; } #homePromo .homePromoButtons a.homePromoButtonDresses:hover { background-position: -200px -430px; } #homePromo .homePromoButtons a.homePromoButtonWomensJeansRed { height: 24px; width: 118px; top: 320px; left: 40px; background-position: -400px -80px; } #homePromo .homePromoButtons a.homePromoButtonWomensJeansRed:hover { background-position: -600px -80px; } #homePromo .homePromoButtons a.homePromoButtonMensJeansRed { height: 24px; width: 118px; top: 360px; left: 40px; background-position: -400px -120px; } #homePromo .homePromoButtons a.homePromoButtonMensJeansRed:hover { background-position: -600px -120px; } #homePromo .homePromoButtons a.homePromoButtonBuyCard { height: 24px; width: 110px; top: 360px; left: 40px; background-position: 0px -80px; } #homePromo .homePromoButtons a.homePromoButtonBuyCard:hover { background-position: -200px -80px; } #homePromo .homePromoButtons a.homePromoButtonBuyCardSmall { height: 19px; width: 82px; top: 360px; left: 40px; background-position: 0 -300px; } #homePromo .homePromoButtons a.homePromoButtonBuyCardSmall:hover { background-position: -90px -300px; } #homePromo .homePromoButtons a.homePromoButtonLargeWomens { top: 310px; left: 17px; width:150px; height:35px; background-position: 0 -120px; } #homePromo .homePromoButtons a.homePromoButtonLargeWomens:hover { background-position: -200px -120px; } #homePromo .homePromoButtons a.homePromoButtonLargeMens { top: 310px; left: 177px; width:150px; height:35px; background-position: 0px -180px;} #homePromo .homePromoButtons a.homePromoButtonLargeMens:hover { background-position: -200px -180px; } /* PROMOS:SPECIAL ########################################################## */ #homePromo div.homePromoScratchSave { width: 520px; height: 520px; margin: 0px; position: absolute; } #homePromo .homePromoButtonscratchSave { top: 243px; left: 260px; position: absolute; display: block; z-index: 20; cursor: pointer; } #homePromo .homePromoButtonscratchSave img { display: block; } #homePromo div.discountInfo { position: absolute; display: block; width: 200px; height: 154px; padding: 15px; top: 243px; left: 260px; text-align: center; color: #ffffff; z-index: 10; background: #00853e url('/content/images/promos/home/20101029-scratchSave/scratch-residue.png?v=3') no-repeat; } #homePromo div.homePromoDiscountAmount { width: 200px; text-align: center; } #homePromo div.homePromoScratchText { font-size: 9px; width: 200px; text-align: center; line-height: 11px; padding-top: 2px; } #homePromo div.homePromoDiscountCode { font-size: 13px; width: 200px; text-align: center; font-weight: bold; line-height: 18px; } /* CATEGORY LANDING ACCORDION ######################################### */ .accordionWrapper { height: 700px; display: inline-block; background-color: #ffffff; overflow: hidden; position: relative; } .accordionWrapper img { vertical-align: top; border: 0; margin: 0; padding: 0; } .accordionWrapper div { display: block; float: left; margin: 0; padding: 0; } .accordionWrapper div.set { } .accordionWrapper div.title { cursor: pointer; display: block; width: 40px; } .accordionWrapper div.content { display: none; width: 1px; } /* JEANEOLOGY ACCORDION ######################################### */ .jeaneologyWrapper { width: 960px; height: 700px; display: inline-block; background-color: #ffffff; overflow: hidden; position: relative; } .jeaneologyWrapper img { vertical-align: top; border: 0; margin: 0; padding: 0; } .jeaneologyWrapper div { display: block; float: left; margin: 0; padding: 0; } .jeaneologyWrapper div.set { } .jeaneologyWrapper div.title { cursor: pointer; display: block; width: 40px; } .jeaneologyWrapper div.titleMain { display: block; width: 40px; } .jeaneologyWrapper div.content { display: none; width: 1px; } /* JEANEOLOGY STORY ######################################### */ .jeaneologyBook { width: 700px; display: block; overflow: hidden; } .jeanBtns { position: absolute; display: block; width: 230px; padding: 240px 0 0 442px; } .jeanBtns a { display: block; width: 195px; padding: 11px 25px 11px 10px; margin-bottom: 10px; background: #005395 url('/content/images/layout/page-elements-jeaneology.png') no-repeat 0 -100px; color: #ffffff; text-decoration: none; text-transform: uppercase; line-height: 14px; font-size: 10px; } .jeanBtns a:hover { background-color: #cccccc; background-position: 0 -150px; color: #005395; } .jeanBtns a.dbl { background-position: 0 -93px; } .jeanBtns a.dbl:hover { background-position: 0 -143px; } .jeanImg {} .jeanImg img { display: block; } .jeanNav { width: 700px; height: 22px; display: block; margin-top: 10px; } .jeanNav a { width: 59px; height: 22px; display: block; text-indent: -6000px; background: url('/content/images/layout/page-elements-jeaneology.png') no-repeat; } .jeanNav a.navPrev { background-position: -300px 0; float: left; } .jeanNav a.navPrev:hover { background-position: -300px -30px; } .jeanNav a.navNext { background-position: -400px 0; float: right; } .jeanNav a.navNext:hover { background-position: -400px -30px; } /* SHOP THE LOOK ######################################### */ .shopTheLook { height: 650px; overflow: hidden; } .shopTheLook .banner { width: 190px; height: 650px; float: left; } .shopTheLook .looksGrid { width: 510px; height: 650px; float: right; } .shopTheLook .looksGrid .item { width: 160px; height: 320px; display: block; position: relative; margin: 0 0 10px 10px; float: left; z-index: 2; } .shopTheLook .looksGrid .item img { display: block; position: absolute; z-index: 1; top: 0; } .shopTheLook .looksGrid .item a { width: 158px; height: 318px; display: block; position: absolute; top: 0; border: solid #cccccc 1px; z-index: 2; background: url('/content/images/layout/blank.png'); } .shopTheLook .looksGrid .item a:hover { border-color: #005395; background: url('/content/images/layout/page-elements-jeaneology.png') no-repeat -120px 242px; } .shopTheLook .lookDetail { float: right; width: 498px; height: 648px; display: none; border: solid #005395 1px; overflow: hidden; position: relative; top: -650px; z-index: 2; } .shopTheLook .lookDetail .itemWrapper { width: 9000px; position: absolute; height: 648px; margin-left: 0; z-index: 2; background-color: #ffffff; } .shopTheLook .lookDetail .item { width: 498px; height: 648px; float: left; } .shopTheLook .lookDetail .items { width: 160px; height: 648px; float: left; } .shopTheLook .lookDetail .item .look { float: right; width: 323px; height: 648px; display: block; background-position: -1px -1px; background-repeat: no-repeat; } .shopTheLook .lookDetail .product { width: 160px; height: 176px; padding: 10px 0 10px 10px; text-align: center; } .shopTheLook .lookDetail .product a { text-decoration: none; text-transform: none; } .shopTheLook .lookDetail .product a:hover { text-decoration: underline; } .shopTheLook .lookDetail .product a.thumbLink { display: block; height: 174px; overflow: hidden; margin-bottom: 14px; border: solid #ffffff 1px; padding: 10px; background-color: #ffffff; } .shopTheLook .lookDetail .product a.thumbLink:hover { border-color: #dddddd; text-decoration: none; } .shopTheLook .lookDetail .product .notation { font-size: 10px; width: 138px; text-align: center; display: block; margin-top: -58px; display: none; } .shopTheLook .lookDetail .product .notation span { padding: 4px 8px; color: #ffffff; background-color: #005395; text-transform: uppercase; line-height: 32px; } .shopTheLook .lookDetail .product h3 { font-size: 11px; padding: 0 10px; color: #005395; margin: 10px 0 0 0; top: 0; font-weight: normal; text-transform: lowercase; } .shopTheLook .lookDetail .product h3 span.productBrand { font-weight: normal; text-transform: uppercase; } .shopTheLook .lookDetail .product h3 span.productFit { display: block; } .shopTheLook .lookDetail .product h4 { font-size: 11px; padding: 0 10px; color: #005395; margin: 0; top: 0; font-weight: normal; font-weight: bold; } .shopTheLook .lookDetail .product h4 span.salePrice { color: #cd0000; } .shopTheLook .lookDetail .product h4 span.listPrice { text-decoration: line-through; } .shopTheLook .lookDetail .product h4 span.promoMsg { color: #777777; font-weight: bold; } .shopTheLook .lookDetail .product h4 div.rating { display: inline; } .shopTheLook .lookDetail .product h4 div.rating img { margin: 1px 0 0 0; } .shopTheLook #close { width: 34px; height: 34px; padding: 0 10px; position: absolute; margin-top: 9px; z-index: 10; } .shopTheLook #close a { background: url('/content/images/layout/page-elements-jeaneology.png') no-repeat 0 0; width: 34px; height: 34px; display: block; text-indent: -6000px; margin-left: 444px; } .shopTheLook #close a:hover { background-position: 0 -40px; } .shopTheLook #nav { width: 478px; height: 34px; padding: 0 10px; position: absolute; margin-top: 605px; z-index: 10; } .shopTheLook #navPrev { background: url('/content/images/layout/page-elements-jeaneology.png') no-repeat -40px 0; width: 34px; height: 34px; display: block; text-indent: -6000px; float: left; } .shopTheLook #navPrev:hover { background-position: -40px -40px; } .shopTheLook #navNext { background: url('/content/images/layout/page-elements-jeaneology.png') no-repeat -80px 0; width: 34px; height: 34px; display: block; text-indent: -6000px; float: right; } .shopTheLook #navNext:hover { background-position: -80px -40px; }