@charset "utf-8"; /*navigation*/ /************Page of index 2014-10***************/ .mobile-hide {display: block;} .mobile-show {display: none;} .font-gold {color:#c2a125;} .font-thick {font-weight: 900;} /* Slider CTA */ #gender-carousel .carousel {overflow: hidden;} #gender-carousel #carousel .slider-cta {left: 4.5%; width:32%; top: 24%;} #gender-carousel #carousel .slider-cta p {margin: 0 auto;} #gender-carousel .slider-cta .btn {margin-top: 1em;} #gender-carousel .slider-cta .large-header {font-size:6vw; letter-spacing: 5px;border-bottom: 3px solid #fff; line-height: .8em; padding-bottom: 3%;} #gender-carousel .slider-cta p {font-size:1.4vw; line-height: 1em;} .men-slide-text p {border-bottom: 3px solid white; border-top: 3px solid white; line-height: 1.5em!important;padding: 10px;} /* Carousel Override */ #gender-carousel .carousel-control {opacity:1; visibility: visible;} #gender-carousel .carousel-control.left:after, #gender-carousel .carousel-control.right:after {top: 42%; font-size: 2em; color: #7e6b59;background: none; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0;} #gender-carousel .carousel-control.left:hover:after, #gender-carousel .carousel-control.right:hover:after {color: #7e6b59;} #gender-carousel .carousel-control.left:after {left: -10%; padding: 1em;} #gender-carousel .carousel-control.right:after {right: -10%; padding: 1em;} .carousel .carousel-indicators {position: relative; visibility: visible; opacity:1 !important; background-color:transparent !important; padding:1.5em 0;text-align: center;} .carousel .indicators-black li {border:1px solid #030303; width:10px; height:10px; margin:0 2px;display: inline-block;text-indent: -999px;border-radius: 10px;cursor: pointer;background-color: transparent;} .carousel .indicators-black li.active {border:1px solid #030303; background-color:#030303; margin:0 2px; width:10px; height:10px;} .carousel .indicators-disney li {width:300px; height:28px; margin:0 2px;display: inline-block;text-indent: -10px;cursor: pointer;background-color: transparent;border-bottom:none;} .carousel .indicators-disney li.active {margin:0 2px; width:300px; height:28px;} .carousel .indicators-disney li.active span {border-bottom:2px solid black;} .carousel .indicators-classic li {width:19%; height:28px; margin:0 2px;display: inline-block;text-indent: -10px;cursor: pointer;background-color: transparent;border-bottom:none;} .carousel .indicators-classic li.active {margin:0 2px; width:19%; height:28px;} .carousel .indicators-classic li.active span {border-bottom:1px solid black;} .carousel .indicators-gold li {border:1px solid #7e6b59; width:10px; height:10px; margin:0 2px;display: inline-block;text-indent: -999px;border-radius: 10px;cursor: pointer;background-color: transparent;} .carousel .indicators-gold li.active {border:1px solid #7e6b59; background-color:#7e6b59; margin:0 2px; width:10px; height:10px;} #gender-carousel .carousel figcaption {position:absolute;z-index:1;top:15%;color:#fff;font-family: "ff-good-headline-web-pro-con", sans-serif;padding:0 20px} #gender-carousel .carousel figcaption h2,.carousel figcaption h4,.carousel figcaption h5 {letter-spacing:7px} #gender-carousel .carousel figcaption h2{font-size:5.5em;border-bottom:2px solid #fff;padding-bottom:0.05em} #gender-carousel .carousel figcaption h4 span {position:relative;left:3px;padding:0 15px} #gender-carousel .carousel figcaption h4{position: relative; z-index: 1;overflow: hidden;text-align: center;bottom:0} #gender-carousel .carousel figcaption h4:before, .carousel figcaption h4:after {position: absolute;top: 51%;overflow: hidden;width: 50%;height: 3px;content: '\a0';background-color: #fff} #gender-carousel .carousel figcaption h4:before {margin-left: -50%;text-align: right} .btn.solid-black-white-btn {background:#030303; color:#fff; padding:13px 1.5em;} .btn.solid-black-white-btn:hover {color:#000; background:#fff;} .btn.solid-gold-white-btn {background:#fff; color:#000; padding:13px 1.5em;} .btn.solid-gold-white-btn:hover {color:#fff; background:#c2a125;} .btn.solid-white-black-btn {background:#fff; color:#030303; padding:13px 1.5em;} .btn.solid-white-black-btn:hover {color:#fff; background:#000;} /* Border Sides */ .border-sides {line-height: 1.5;} .border-sides span {display: inline-block; position: relative;} .border-sides span:before, .border-sides span:after { content: ""; position: absolute; height: 5px; border-top: 3px solid #fff; top: 16px; width: 100%; } .border-sides span:before { right: 100%; margin-right: 15px;} .border-sides span:after { left: 100%; margin-left: 15px;} /* Viewport Sized Typography */ @media (min-width: 1440px) { } /* Large desktop */ @media (min-width: 1200px) { } /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 991px) { #gender-carousel .carousel-control.left:after, #gender-carousel .carousel-control.right:after {bottom: 36%;} } /* Landscape phone to portrait tablet */ @media (max-width: 767px) { #delivery_info_time{width:30%;} .mobile-hide {display: none;} .mobile-show {display: block;} #gender-carousel #carousel .slider-cta p {font-size: 4vw !important; } #gender-carousel .border-bottom-thick span:after, #gender-carousel .border-bottom-thick-white span:after {border-bottom: none;} /*#star-wars-homepage .carousel-indicators li {visibility: hidden;}*/ #gender-carousel .carousel-control.left:after, #gender-carousel .carousel-control.right:after {bottom: 38%;} #gender-carousel .slider-cta .large-header {font-size:17.5vw;} #gender-carousel #carousel .slider-cta {left: 0% !important; width:100% !important; top: 24% !important;} #gender-carousel .carousel-control.left:after, #gender-carousel .carousel-control.right:after {bottom: 20% !important;} } /* Landscape phones and down */ @media (max-width: 479px) { #gender-carousel .carousel-inner h4 {font-size:1em !important;} #gender-carousel .carousel-control.left:after, #gender-carousel .carousel-control.right:after {bottom: 30%;} } .carousel {position: relative} .carousel-inner {position: relative;overflow: hidden;width: 100%;} .carousel-inner>.item {display: none;position: relative;-webkit-transition: 0.6s ease-in-out left;transition: 0.6s ease-in-out left;} .carousel-inner>.item>img,.carousel-inner>.item>a>img {display: block;max-width: 100%;height: auto;line-height: 1} .carousel-inner>.active,.carousel-inner>.next,.carousel-inner>.prev {display: block;} .carousel-inner>.active {left: 0;} .carousel-inner>.next,.carousel-inner>.prev {position: absolute;top: 0;width: 100%;} .carousel-inner>.next {left: 100%;} .carousel-inner>.prev {left: -100%;} .carousel-inner>.next.left,.carousel-inner>.prev.right {left: 0;} .carousel-inner>.active.left {left: -100%;} .carousel-inner>.active.right {left: 100%;} .carousel-control {position: absolute;top: 0;left: 0;bottom: 0;width: 5%;opacity: 0.5;filter: alpha(opacity=50);font-size: 20px;color: #7e6b59;text-align: center;text-shadow: 0 1px 2px rgba(0,0,0,0.6);} .carousel-control.right {left: auto;right: 0;} .carousel-control: hover,.carousel-control: focus {color: #7e6b59;text-decoration: none;opacity: 0.9;filter: alpha(opacity=90);} .carousel-control .icon-prev,.carousel-control .icon-next,.carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right {position: absolute;top: 50%;z-index: 5;display: inline-block;} .carousel-control .icon-prev,.carousel-control .glyphicon-chevron-left {left: 50%;} .carousel-control .icon-next,.carousel-control .glyphicon-chevron-right {right: 50%;} .carousel-control .icon-prev,.carousel-control .icon-next {width: 20px;height: 20px;margin-top: -10px;margin-left: -10px;font-family: serif;} .carousel-control .icon-prev: before {content: '\2039'} .carousel-control .icon-next: before {content: '\203a'} .carousel-caption {position: absolute;left: 15%;right: 15%;bottom: 20px;z-index: 10;padding-top: 20px;padding-bottom: 20px;color: #fff;text-align: center;text-shadow: 0 1px 2px rgba(0,0,0,0.6);} .carousel-caption .btn {text-shadow: none;} @media screen and (min-width: 768px) { .carousel-control .glyphicons-chevron-left,.carousel-control .glyphicons-chevron-right,.carousel-control .icon-prev,.carousel-control .icon-next { width: 30px;height: 30px;margin-top: -15px;margin-left: -15px;font-size: 30px;} .carousel-caption {left: 20%;right: 20%;padding-bottom: 30px;} } .product-listing-1x5 .search-result-items .grid-tile .product-name:after { content: ""; } .product-listing-1x5 .search-result-items .grid-tile .product-name { font-size: 12px; } /*home-section-b*/ #home-section-b{background:#eeeeee;} #home-section-b #gender-shop {padding-bottom: 2em;} /* Figure */ #home-section-b #gender-shop figure {background-color: black;} #home-section-b #gender-shop figure img {opacity:.7;} /* default opacity */ #home-section-b #gender-shop figure:hover img {opacity: 1;} /* rollover opacity */ /* Figcaption */ #home-section-b #gender-shop figcaption {top:42%; left:0;} #home-section-b #gender-shop figcaption h4 {border-bottom: 2px solid white; border-top: 2px solid white; padding: 4px; display: inline-block;} #home-section-b #gender-shop figcaption a:hover, #gender-shop figcaption a:focus {text-decoration: none;} #home-section-b .home-section-b-headline{padding-top: 1em} #home-section-b .home-section-b{padding-bottom:2em;margin-bottom:1.5em} #home-section-b .home-section-b-headline h2{font-size:1.3em;padding-bottom:1.5em;margin:0 auto;text-align:center;color:#000} #home-section-b .home-section-b ul{margin:0;padding:0} #home-section-b .home-section-b li a.button{width:90%;margin:0 auto;display: table;background:#f6f6f6;border:1px solid #c2a125;margin-bottom:0.75em} #home-section-b .home-section-b h5{font-size:1.75em} /* Buttons */ #home-section-b #gender-shop figure:after {content: "\f154"; font-family: "icomoon"; font-size: 1em; color: white; position: absolute; bottom: 0; right: 0; padding: 10px 18px; background-color: #030303; border: 1px solid transparent;} #home-section-b #gender-shop figure:hover:after {background-color: white; color:black; border: 1px solid #white;} /*gold button*/ .btn.gold-btn{background: transparent; color: #7e6b59; border: 2px solid #d2c081; padding: .9em 1.25em !important; font-size: 18px;} .btn.gold-btn:hover {color: #fff; background: #d2c081;} /*blue button*/ .btn.blue-btn{background: transparent; border: 1px solid #aeaeae;color: #91b9dc;font-size: 18px;font-weight: 500;padding: 0.8em 1.35em !important;} .btn.blue-btn:hover {background-color:#91b9dc;border: 1px solid #91b9dc;color:#f1f1f3} /*pink button*/ .btn.pink-btn{background: transparent; color: #7e6b59; border: 2px solid #e3738c; padding: .9em 1.25em !important; font-size: 18px;} .btn.pink-btn:hover {color: #fff; background: #e3738c;} /*black button*/ @media (min-width: 768px){.btn.black-btn{background: transparent; color: #111; border: 2px solid #111; padding: .8em 1.35em !important; font-size: 18px;font-weight:500;}} @media (max-width: 767px){.btn.black-btn{border: 1px solid #111; padding: .5em .8em !important;}} .btn.black-btn:hover {color: #fff; background: #111;font-weight:500;} .btn.gray-btn{background: transparent; color: #fff; border: 1px solid #f4f4f4; padding: .8em 2.5em !important; font-size: 18px;} .btn.gray-btn:hover {color: #111; background:rgba(255, 255, 255, 0.5);} /*red button*/ .btn.red-btn{background: transparent; color:#982329; border: 1px solid #982329; padding: .5em .8em !important;} .btn.red-btn:hover {color: #fff; background: #982329;} /* Landscape phone to portrait tablet */ @media (max-width: 767px) { .mobile-hide {display: none;} .mobile-show {display: block;} } /*home-section-d*/ #home-section-d {background-color: #eeeeee;} #favorites-shop figure {background-color: black;} #favorites-shop figure img {opacity:1;} /* default opacity */ #favorites-shop figure:hover img {opacity: 1;} /* rollover opacity */ /* Figcaption */ #favorites-shop figcaption a:hover, #favorites-shop figcaption a:focus {text-decoration: none;} /* Large desktop */ @media (min-width: 1200px) { } /* Portrait tablet to landscape and desktop */ @media (min-width: 992px) { .visible-sm-block {display:none;} } /* Landscape phone to portrait tablet */ @media (max-width: 767px) { } /* Landscape phones and down */ @media (max-width: 480px) { } .what_we_re { text-align: center;} .what_we_re span { width: 200px; font-size:1.5em;} .bd { padding: 0 20px;text-decoration: line-through;} .line_opt {font-family: "ff-good-headline-web-pro-con","Meiryo","Hiragino Kaku Gothic Pro",sans-serif !important;} .text-justify { text-align: left; } #tinybox{position:fixed; display:none; padding:10px;border:0px solid #e3e3e3; z-index:2000;left: 0;top: 1% ;max-width: 500px;max-height: 768px;margin: auto;right: 0;} #notice-close{background: url("http://www.uggaustralia.cn/public/themes/images/resources/interface/close-empty-white.png") repeat scroll 0% 0% black; height: 32px; width: 32px; position: absolute; top: 16px; right: 16px;} #tinymask{position:fixed; display:none; top:0; left:0; height:100% ; width:100%; background:#000000; z-index:1500;} #tinycontent{ font-size:1.1em;height:100%;} #tinycontent img{max-width:100%} /***************Page of men women kids 2014-10******************/ /* cat-landing-grid-slot-b figure*/ #cat-landing-grid-slot-b {background-color: #eeeeee;} #cat-landing-grid-slot-b #favorites-shop figure {background-color: black;} #cat-landing-grid-slot-b #favorites-shop figure img {opacity:.7;} /* default opacity */ #cat-landing-grid-slot-b #favorites-shop figure:hover img {opacity: 1;} /* rollover opacity */ /*cat-landing-grid-slot-b Figcaption */ #cat-landing-grid-slot-b #favorites-shop figcaption {top:35%; left:0;} #cat-landing-grid-slot-b #favorites-shop figcaption a:hover, #favorites-shop figcaption a:focus {text-decoration: none;} /* Border Sides */ #cat-landing-grid-slot-c .border-sides {line-height: 1.5;} #cat-landing-grid-slot-c .border-sides span {display: inline-block; position: relative;} #cat-landing-grid-slot-c .border-sides span:before, #cat-landing-grid-slot-c .border-sides span:after {content: ""; position: absolute; height: 5px; border-top: 1px solid #111; top: 12px; width: 60px;} #cat-landing-grid-slot-c .border-sides span:before {right: 100%; margin-right: 15px;} #cat-landing-grid-slot-c .border-sides span:after {left: 100%; margin-left: 15px;} #cat-landing-grid-slot-c .btn-font{background-color: #fff;border-color: #111;border-width: 2px;color: #111;border-style: solid;line-height: 40px;padding: 10px;} /* Water drop icons for products */ .product-listing-1x5 .search-result-items .grid-tile{ text-align:center;} .product-listing-1x5 .tile-1 .product-tile:after, .product-listing-1x5 .tile-2 .product-tile:after,.product-listing-1x5 .tile-3 .product-tile:after, .product-listing-1x5 .tile-4 .product-tile:after {content: "\e602"; font-family: "icomoon"; font-size: 1.8em;} .product-listing-1x5 .tile-5 .product-tile:after {content: "\e601"; font-family: "icomoon"; font-size: 1.8em;} /* Large desktop */ @media (min-width: 1200px) { } /* Portrait tablet to landscape and desktop */ @media (max-width: 991px) { } /* Landscape phone to portrait tablet */ @media (max-width: 747px) { } /* Landscape phones and down */ @media (max-width: 479px) { #cat-landing-grid-slot-c h2 {font-size: 2.6em !important;} } /* cat-landing-grid-slot-d */ #cat-landing-grid-slot-d{background:#eeeeee;} #cat-landing-grid-slot-d #gender-shop {padding-bottom: 2em;} /* Figure */ #cat-landing-grid-slot-d #gender-shop figure {background-color: black;} #cat-landing-grid-slot-d #gender-shop figure img {opacity:.7;} /* default opacity */ #cat-landing-grid-slot-d #gender-shop figure:hover img {opacity: 1;} /* rollover opacity */ /* Figcaption */ #cat-landing-grid-slot-d #gender-shop figcaption {top:42%; left:0;} #cat-landing-grid-slot-d #gender-shop figcaption h4 {border-bottom: 2px solid white; border-top: 2px solid white; padding: 4px; display: inline-block;} #cat-landing-grid-slot-d #gender-shop figcaption a:hover, #gender-shop figcaption a:focus {text-decoration: none;} #cat-landing-grid-slot-d .home-section-b-headline{padding-top: 1em} #cat-landing-grid-slot-d .home-section-b{padding-bottom:2em;margin-bottom:1.5em} #cat-landing-grid-slot-d .home-section-b-headline h2{font-size:1.3em;padding-bottom:1.5em;margin:0 auto;text-align:center;color:#000} #cat-landing-grid-slot-d .home-section-b ul{margin:0;padding:0} #cat-landing-grid-slot-d .home-section-b li a.button{width:90%;margin:0 auto;display: table;background:#f6f6f6;border:1px solid #c2a125;margin-bottom:0.75em} #cat-landing-grid-slot-d .home-section-b h5{font-size:1.75em} /* Buttons */ #cat-landing-grid-slot-d #gender-shop figure:after {content: "\f154"; font-family: "icomoon"; font-size: 1em; color: white; position: absolute; bottom: 0; right: 0; padding: 10px 18px; background-color: #030303; border: 1px solid transparent;} #cat-landing-grid-slot-d #gender-shop figure:hover:after {background-color: white; color:black; border: 1px solid #white;} /* cat-landing-grid-slot-e */ #cat-landing-grid-slot-e{background-color:white;} #cat-landing-grid-slot-e .inside-banner figcaption {top:88%;} @media (max-width: 479px) { #cat-landing-grid-slot-e .inside-banner figcaption {top:80%;} } /***************Page of styleWomen 2014-10******************/ /* Animations */ .wp1, .wp2, .wp3, .wp4, .wp5, .wp6 {visibility:hidden;} .fadeInUp, .fadeInUpDelay, .fadeInDown, .fadeInUpD, .fadeInLeft, .fadeInRight {visibility: visible;} .delay-05s { animation-delay: 0.5s; -webkit-animation-delay: 0.5s; } .delay-1s { animation-delay: 1s; -webkit-animation-delay: 1s; } /* Sections */ #style-guide #intro figcaption {top:40%;} #style-guide #style-files figcaption {top: auto; bottom: 0;} #style-guide #style-files .btn {background: white; border: none; display: block; padding: 4px 15px;} #style-guide #style-files .btn:hover {opacity:.8;} #style-guide #collection h3 {} #style-guide #collection .inner-container {margin-top:6em; width:70%;} #style-guide #collection .btn-container {margin: 4em 0 2em;} #style-guide #collection .btn {display: block; width: 260px; margin: 0 auto; padding: 10px 0;} /* Border Sides */ #style-guide .border-sides {line-height: 1.5;} #style-guide .border-sides span {display: inline-block; position: relative;} #style-guide .border-sides span:before, #style-guide .border-sides span:after {content: ""; position: absolute; height: 5px; border-top: 1px solid white; top: 12px; width: 60px;} #style-guide .border-sides span:before {right: 100%; margin-right: 15px;} #style-guide .border-sides span:after {left: 100%; margin-left: 15px;} /* Border Bottom */ #style-guide .border-bottom-thick {line-height: 1.5;} #style-guide .border-bottom-thick span {display: inline-block; position: relative;} #style-guide .border-bottom-thick span:after, #style-guide .border-bottom-thick-white span:after {content: ""; border-bottom: 3px solid #111; width: 56px; margin: 0 auto; display: block; padding-top: 24px;} #style-guide .border-bottom-thick-white span:after {border-bottom: 3px solid white;} /* Vertical Align */ #style-guide .vertical-center {display: flex; align-items: center; display: -webkit-flex; -webkit-align-items: center;} #style-guide .padding-5-perc {padding: 5% !important;} /* Viewport Sized Typography */ @media (min-width: 1440px) { #style-guide h2 {font-size: 3.4vw !important;} #style-guide h3 {font-size: 1.7vw !important;} #style-guide h4 {font-size: 1.3vw !important;} #style-guide p {line-height: 2vw; font-size: .9vw !important} #style-guide .btn {font-size: 1.2vw !important; min-width: 14vw;} #style-guide #style-files a {font-size: 1.2em !important;} #style-guide #collection .inner-container {margin-top: 10vw !important;} } /* Large desktop */ @media (min-width: 1200px) { } /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 991px) { #style-guide #intro figcaption {top:25%;} #style-guide #intro figcaption h2 {font-size: 2.5em !important;} #style-guide #collection .inner-container {margin-top: 1em; width: 80%;} #style-guide #collection .btn-container {margin-top: 1em;} #style-guide .padding-5-perc {padding: 0 5% !important;} } /* Landscape phone to portrait tablet */ @media (max-width: 767px) { #style-guide #intro figcaption {top:25%;} #style-guide #intro figcaption h2 {font-size: 1.8em !important;} #style-guide #collection .inner-container {margin-top: 4em; margin-bottom: 4em;} #style-guide .vertical-center {display: block;} } /* Landscape phones and down */ @media (max-width: 480px) { #style-guide #intro figure {margin-bottom: 8em;} #style-guide #intro figcaption {top: 120%;} #style-guide #collection .inner-container {margin-top: 0; margin-bottom: 2em; width: 100%; padding: 0 15px;} } /******************UGG-timeline************************/ /* Animations */ .wp1, .wp2, .wp3, .wp4, .wp5, .wp6, .wp7, .wp8, .wp9, .wp10, .wp11, .wp12, .wp13, .wp14, .wp15, .wp16, .wp17, .wp18, .wp19, .wp20 {visibility:hidden;} .fadeInUp, .fadeInUpDelay, .fadeInDown, .fadeInUpD, .fadeInUp, .fadeInUp {visibility: visible;} .delay-05s { animation-delay: 0.5s; -webkit-animation-delay: 0.5s; } .delay-1s { animation-delay: 1s; -webkit-animation-delay: 1s; } /* Typography */ #ugg-timeline p {line-height: 2;} /* Borders and Dividers */ #ugg-timeline .border-bottom-thick {line-height: 1.5;} #ugg-timeline .border-bottom-thick span {display: inline-block; position: relative;} #ugg-timeline .border-bottom-thick span:after, #ugg-timeline .border-bottom-thick-white span:after {content: ""; border-bottom: 3px solid #111; width: 56px; margin: 0 auto; display: block; padding-top: 24px;} #ugg-timeline .border-bottom-thick-white span:after {border-bottom: 3px solid white;} #ugg-timeline hr {margin: 0; border-color: #ddd; position: absolute; bottom:0; left:0; width:100%; z-index: 0;} /* Vertical Align */ #ugg-timeline .vertical-center {display: flex; align-items: center; display: -webkit-flex; -webkit-align-items: center;} #ugg-timeline .padding-5-perc {padding: 0 5%;} /* Sticky Date */ #ugg-timeline p.sticky-element {position:relative; text-align:center; background:#111; opacity: .8; color:white; width:100%; margin:0 auto; font-size:2.6em; z-index: 1;} #ugg-timeline .sticky-element.stuck {position:fixed; top:0; box-shadow:0 2px 4px rgba(0, 0, 0, .3);} #ugg-timeline .triangle-down:before {font-size: 2.3em; color: #111; top: 55px; width: auto;} #ugg-timeline .margin-top-72 {margin-top: -72px;} /* Viewport Sized Typography */ @media (min-width: 1440px) { #ugg-timeline h2 {font-size: 3.4vw !important;} #ugg-timeline h3 {font-size: 1.7vw !important;} #ugg-timeline h4 {font-size: 1.3vw !important;} #ugg-timeline .col-xs-12 p {line-height: 2vw; font-size: .9vw !important} } /* Large desktop */ @media (min-width: 1200px) { } /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 991px) { #ugg-timeline .padding-5-perc {padding: 0 15px !important;} #ugg-timeline p {line-height: 1.2;} #ugg-timeline p.sticky-element {display:none;} #ugg-timeline .margin-top-72 {margin-top: 0;} #ugg-timeline .logo-small {width: 100px !important; margin-bottom: 0 !important;} } /* Landscape phone to portrait tablet */ @media (max-width: 767px) { #ugg-timeline hr {display:none;} #ugg-timeline .padding-5-perc {padding: 15px !important;} #ugg-timeline .vertical-center {display: block;} #ugg-timeline p.sticky-element {display:none;} #ugg-timeline .margin-top-72 {margin-top: 0;} #ugg-timeline .logo-small {width: 100px !important; margin-bottom: 0 !important;} } /* Landscape phones and down */ @media (max-width: 480px) { } /***********landingpage*************/ .twinsole .vertical-center{display: flex;align-items: center;display: -webkit-flex;-webkit-align-items: center;} @media (max-width: 767px){.twinsole .vertical-center {display: block !important;}} .twinsole-btn:hover{opacity:0.7;} #uggupturn .goods-img a img{width: 16.6667%; float: left;} #uggupturn .upturn2 { bottom: 0; display: none; left: 0px; position: absolute; margin-left: 0px; z-index: 20; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); opacity: 1.0; transition: 0.5s; } #uggupturn .upturn1 a img:hover #uggupturn .row div .upturn2{ bottom: 0; display: block; left: 0; margin-left: 0; opacity: 1; position: absolute; transition: all 0.5s ease 0s; z-index: 20; } /***********landingpage-treadlite**************/ #treadlite-landing-grid-slot-a #attributes h2 {} #treadlite-landing-grid-slot-a #attributes p {line-height: 2;} #treadlite-landing-grid-slot-a #attributes img {padding:30px;} #treadlite-landing-grid-slot-a #attributes .padding-left-30 {padding-left:30px;} #treadlite-landing-grid-slot-a #attributes .padding-right-30 {padding-right:30px;} #treadlite-landing-grid-slot-a .big-video-wrapper {position:relative; overflow:hidden; max-height: 610px;} #treadlite-landing-grid-slot-a video#video-bg {min-width: 100%; min-height: 100%; max-width: 100%; z-index: -1; background: url(http://www.ugg.cn/public/themes/images/S15-MAR-treadlite-video-fallback.jpg) no-repeat top left; background-size: cover;margin: -5% auto;} #treadlite-landing-grid-slot-a .video-header {position: absolute; top: 30%; width: 100%; z-index: 1;} #treadlite-landing-grid-slot-a .video-header img {margin: 0 auto; height:auto;} #treadlite-landing-grid-slot-a .video-header a img:hover {opacity:.7;} /* Override Styles */ .btn-lg {padding: 10px 3em;} /* Viewport Sized Typography */ @media (min-width: 1440px) { } @media (min-width: 992px) and (max-width: 1199px) { #treadlite-landing-grid-slot-a .video-header {top:20%;} } /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 990px) { #treadlite-landing-grid-slot-a .video-header {top:17%;} #treadlite-landing-grid-slot-a .video-header .js-popup img {margin-top:2em !important;} } /* Landscape phone to portrait tablet */ @media (max-width: 767px) { .mobile-pdp-main .swiper-pagination{bottom:11px !important;} .pdp-detail-pagination {position:relative !important;top: 26px !important;} #cat-landing-grid-slot-a .swiper-pagination{bottom:5px !important;padding: 10px 0;} .swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{left:0;width:100%} /*body {background: url(polina.jpg) #000 no-repeat center center fixed;}*/ #treadlite-landing-grid-slot-a video#video-bg {display: none;} #treadlite-landing-grid-slot-a .big-video-wrapper {background: url(http://www.ugg.cn/public/themes/images/S15-MAR-treadlite-video-fallback.jpg) no-repeat center center; background-size: cover;} #treadlite-landing-grid-slot-a .video-header img#treadlite-logo {padding:0 1.5em;} #treadlite-landing-grid-slot-a .video-header {top:21%;} #treadlite-landing-grid-slot-a .big-video-wrapper {min-height: 400px;} #treadlite-landing-grid-slot-a .video-header .js-popup img {margin-top:2em !important;} } /* Landscape phones and down */ @media (max-width: 479px) { #treadlite-landing-grid-slot-a .video-header {top:25%;} } #treadlite-landing-grid-slot-b h2 {} #treadlite-landing-grid-slot-b p {line-height: 2;} #treadlite-landing-grid-slot-b img {padding:30px;} #treadlite-landing-grid-slot-b .padding-left-30 {padding-left:30px;} #treadlite-landing-grid-slot-b .padding-right-30 {padding-right:30px;} /* Viewport Sized Typography */ @media (min-width: 1440px) { } @media (min-width: 992px) and (max-width: 1199px) { } /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 990px) { } /* Landscape phone to portrait tablet */ @media (max-width: 767px) { #treadlite-landing-grid-slot-b .mobile-hide {display:none;} #treadlite-landing-grid-slot-b h2 {font-size: 30px !important;} } /* Landscape phones and down */ @media (max-width: 479px) { .btn-lg {padding: 10px 2em !important;} #treadlite-landing-grid-slot-b h2 {font-size: 20px !important; letter-spacing: 3px;} #treadlite-landing-grid-slot-b .mobile-hide {display:none;} } #treadlite-landing-grid-slot-c p {line-height: 2; margin-left: 4em; width:280px;} #treadlite-landing-grid-slot-c .parallax {background-image: url(http://www.ugg.cn/public/themes/images/S15-MAR-treadlite-video-cityscape.jpg);} /* grid slot d styles */ #treadlite-landing-grid-slot-d .product-name {border:none;} #treadlite-landing-grid-slot-d .search-result-items .grid-tile .product-name {text-decoration:underline;} /* Viewport Sized Typography */ @media (min-width: 1440px) { } @media (min-width: 992px) and (max-width: 1199px) { } /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 990px) { } /* Landscape phone to portrait tablet */ @media (max-width: 767px) { #treadlite-landing-grid-slot-d .search-result-items .grid-tile {width: 90%;} } /* Landscape phones and down */ @media (max-width: 479px) { #treadlite-landing-grid-slot-c p {width: 100%; margin: 0; padding: 0 2em;} } /***************************page innovation*************************************/ .font-bold {font-weight: bold;} .text-transform {text-transform: none;} .pc-area {display: block;} .sp-area { display: none; } .section1 {position: relative;} .section1 img {width: 100%;} .section1 div.inner-content {width:24%;padding: 0 2%;position: absolute;top: 38%;left: 38%;} .section2 .inner-content{position: relative;display: inline-block;line-height: 2;} .section2 .tread-title1 { position: absolute; top:33%; left: 6%;} .section2 .tread-title2 { position: absolute; width: 24%; top:25%; left: 38%;} .innovation-btn {background: none repeat scroll 0 0 black;color: white; display: inline-block; font-weight: 400; line-height: 30px; padding: 10px 20px;} .innovation-btn:hover{color: white;opacity: 0.7;} .innovation .section-top { background-color: #eeeeee; height:220px; text-align:center; color: #4d4d4f; padding-top:62px;} .innovation .section-top h1 {font-size: 4.8em;margin-top:0;} .inner-content.title {font-size: 14px;} .innovation .treadlite-title { font-size: 3em; font-weight: 200;} .innovation .font-weight { font-weight: 200;} .innovation .section-top .inner-content { margin:0 auto;} .innovation .section-top .inner-content > div { display:inline-block; width:155px; border-right:2px solid #4d4d4f;} .innovation .section-top .inner-content > div:last-child { border-right:none;} .innovation .section1 .inner-content { margin:0 auto; width: 24%; line-height: 2; -webkit-font-smoothing: antialiased;} .innovation .gray-section { background-color:#eeeeee; border-top:1px solid #cccccc; border-bottom:1px solid #cccccc; padding:65px 0; text-align:center;} .innovation .section2 > .inner-content {} .innovation .section2 h2 { text-align:center;} .innovation .section2 .inner-content .inner-content {} .innovation .section3 .inner-content { max-width:1140px; margin:0 auto;} .innovation .section3 .inner-content .item { float: left; margin: 0; width: 33.3%; position: relative;} .innovation .section3 .inner-content .item .treadlite-desc {position: absolute; top:70%; left:0; padding:0 10%;} .sp-area { display: none;} @media(max-width: 1140px) { .pc-area { display: none; } .sp-area { display: block; } .section1 div.inner-content { left: 21%; } .section2 .inner-content{ position: relative; display: inline-block; width: 100%; } .section2 img{ width: 100%; } .section2 .tread-title1 { position: absolute; top: 47%; left: 0; width:100%; } .section2 .tread-title2 { position: absolute; width: 100%; top:60%; left: 0; padding: 0 10%; } .innovation .section3 .inner-content .item { width: 100%; } .innovation .section3 .inner-content .item img { width: 100%; } .innovation .section2 .inner-content .inner-content { line-height: 2.5; } .caption .caption-content{ line-height: 2.5!important; font-size: 3.0vw!important;} .innovation .section-top .inner-content { display:none; } .innovation .section1 .inner-content { color: #ffffff; width:60%; font-size: 3.8vw!important; text-align: justify; } .innovation .section2 h2 { text-align:center; margin-top:0; font-size:4.5em; } .innovation .section2 h4 { padding-top:2%; text-align:center; margin-top:0; font-size:2em; } .innovation .section2 .inner-content .inner-content { padding-top:1%; font-size: 3.0vw!important; } .innovation .section2 h2 { padding-top:0; margin-bottom: 0; } .sp-area { display: block; } .border-style { display:inline-block; width:25%; border-bottom:solid 1px #fff; } } @media (max-width: 767px) { .innovation .section2 h2 { font-size:2em; } .innovation .section2 h4 { font-size:1.2em; } } .innovation-section2 .gray-section { padding:90px 0;} .innovation .section5 .inner-content { margin:0 auto; max-width:1140px;} .innovation .section5 .inner-content > div { float:right; height:565px; width:33.333%;} .innovation .section5 .right { background-image:url('http://www.uggaustralia.cn/public/themes/images/innovation-sheerblissright.jpg');} .innovation .section5 .left { background-image:url('http://www.uggaustralia.cn/public/themes/images/innovation-sheerblissleft.jpg');} .innovation .section5 .middle { padding:45px; text-align:justify; line-height:2;background:#f6f6f6;} .innovation .section5 .middle h2 { margin-top:0; text-align:center; line-height:1; margin-bottom: 10px;} .innovation .section5 .middle a { display:block; margin:auto; width:140px; padding: 5px 10px;} .innovation .section9 { text-align:center;} @media(max-width: 1140px) { .innovation .section5 .inner-content > div { display:block; width:100%; height:7em; background-size:cover;} .innovation .section5 .inner-content > div.middle { height:auto; min-height:127vw; padding:12vw; font-size: 3.5vw!important;} .innovation .section5 .inner-content > div.middle a {padding: 15px 10px;width: auto;} .innovation .section5 h2 { font-size: 6vw;} .innovation .section9 a { width:100%; } } .innovation .section10 .main-title { font-size: 2vw;} .innovation .section10 .inner-content,.innovation .section11 .inner-content,.innovation .section6 .inner-content,.section8 .inner-content,.section12 .inner-content { max-width:1140px; margin:0 auto;} .innovation .section10 .inner-content .item { position: relative;} .innovation .section10 .inner-content .item1, .innovation .section10 .inner-content .item2 { float: left; color: #fff; padding-right: 0; padding-left: 0;} .innovation .section10 .inner-content .item1 div{left: 0; line-height: 2; padding: 10%; position: absolute; top: 20%;} .innovation .section10 .inner-content .item1 div span { font-size: 1.3em; } .innovation .section10 .inner-content .item2 div{ left: 0;padding: 10%; position: absolute; top: 58%;} .innovation .section10 .sub-title { font-size: 1.3em; } .innovation .section10 .inner-content .item3 { float: right; padding-right: 0; padding-left: 0;} .innovation .section11 {} .innovation .section11 img{ width:100%;} .innovation .section12 {} .pc-area { display: block;} .sp-area { display: none;} .innovation .section6 .inner-content .images { display: inline-block; float: left; width: 66.6%;} .innovation .section6 .inner-content .caption { display: inline-block; float: left; width: 33.3%; position: relative;} .innovation .section6 .inner-content .caption > div{ position:absolute; left:0; top:12%; padding:0 10%;line-height: 2;} .innovation .section7 {background: #EEEEEE;max-width: 1140px;margin: 0 auto} .innovation .section7 .vertical-center{color: #5B5B5B;} @media(min-width: 1141px) { .innovation .section10 .inner-content .item { max-width: 380px; width: 33.3%; } } @media(max-width: 1140px) { .pc-area { display: none; } .sp-area { display: block; } .innovation .section12 img{ width: 100%; height:auto; } .innovation .section8 img { width: 100%; height: auto; } .innovation .section10 .inner-content .item { width:100%!important; } .innovation .section10 .inner-content .item1,.innovation .section10 .inner-content .item2,.innovation .section10 .inner-content .item3 { float: none; width: 100%; } .innovation .section10 .inner-content .item1 img,.innovation .section10 .inner-content .item2 img ,.innovation .section10 .inner-content .item3 img{ width: 100%; } .innovation .section10 .main-title { font-size: 6.3vw; } .innovation .section10 .sub-title { font-size: 3.5vw; } .innovation .section10 .inner-content .item1 div span { font-size: 3.5vw; } .innovation .section6 .inner-content .images { width: 100%; } .innovation .section6 .inner-content .images img{ width: 100%; } .innovation .section6 .inner-content .caption { width: 100%; position: relative; } .innovation .section6 .inner-content .caption img{ width: 100%; } } /*******************page star wars************************/ #pc-show div {float: left;width: 33.33%;} #pc-show div img{padding:10px;width: 100%;} #mobile-show,#mobile-show-header-top,#mobile-show-header-search,#mobile-show-header-nav { display: none; } #pc-show { display: block; } @media(max-width: 991px) { #mobile-show,#mobile-show-header-top,#mobile-show-header-search,#mobile-show-header-nav { display: block !important; } #pc-show { display: none !important;} .star-wars-product{float: left;width: 50%!important;padding:5px;} .star-wars-product-right{float: right;width: 50%!important;padding:5px;} } /*articleID178 articleID177*/ .article-imprint .vertical-center{display: flex;align-items: center;display: -webkit-flex;-webkit-align-items: center;} @media (max-width: 990px){ .article-imprint .vertical-center {display: block !important;} .article-imprint .vertical-center .div-left{width: 100% !important;} .article-imprint .vertical-center .div-right{width: 100% !important;} } #article-imprint-top .top-main figcaption {top:45%; left:5%;max-width: 275px;} #article-imprint-top .top-main figcaption p{line-height: 24px;} @media (max-width: 990px){ #article-imprint-top .top-main figcaption {top:35%; left:3%;max-width: 245px;} #article-imprint-top .top-main figcaption p{line-height: 20px;} } @media (max-width: 767px){ #article-imprint-top .top-main figcaption {top:45%; left:5%;max-width: 275px;} #article-imprint-top .top-main figcaption p{line-height: 24px;} #article-imprint-top .top-main figure img{width: 150%;} } @media (max-width: 479px) { #article-imprint-top .top-main figcaption {top:40%; left:5%;max-width: 275px;} #article-imprint-top .top-main figcaption p{line-height: 20px;} #article-imprint-top .top-main figure img{width: 210%;} #article-imprint-top .top-main figcaption img{margin:5px!important;} .summer-title p{font-size: 2.5em !important;} } @media (max-width: 767px) { .font-resp{font-size: 20px !important;} } @media (max-width: 479px) { .font-resp{font-size: 16px !important;} } /*articleID181*/ .insideout-nav {z-index: 6;} #joy {z-index: 5;} #sadness {z-index: 4;} #anger {z-index: 3;} #disgust {z-index: 2;} #fear {z-index: 1;} .imagesWrapper > a {display: block !important;} .mainVisual a.insideout_collection {background-color: #fff; border-color: #999; color: #111;} .mainVisual a.insideout_collection:hover {background-color: #0081bc; border-color: #e6e6e6; color: #fff;} .btn.insideout_collection {display: inline-block;margin: 20px auto;padding: 10px;font-size: 18px;font-weight: bold;letter-spacing: 2px;line-height: 1.42857;} .subVisual a,.subVisual a:hover {display: inline-block;border-color: #999;color: #fff;font-size: 18px;font-weight: bold;letter-spacing: 2px;} .subVisual .joy-button a {background-color: #02addb;} .subVisual .joy-button a:hover {background-color: #0081bc;} .subVisual .sadness-button a {background-color: #6aabe3;} .subVisual .sadness-button a:hover {background-color: #194e91;} .subVisual .anger-button a {background-color: #ec7727;} .subVisual .anger-button a:hover {background-color: #d9232e;} .subVisual .disgust-button a {background-color: #03783d;} .subVisual .disgust-button a:hover {background-color: #a3d65c;} .subVisual .fear-button a {background-color: #ab7bca;} .subVisual .fear-button a:hover {background-color: #9895d3;} .subVisual .mbshopWrapper .collection-button a {background-color: #fff; border-color: #999; color: #111;} .subVisual .mbshopWrapper .collection-button a:hover {background-color: #fff; border-color: #e6e6e6; color: #5e5e5e;} a.text-blue, a.text-blue:hover { color: rgb(0, 173, 224); } @media (min-width: 768px){ .displaySP{display: none !important;} .mainVisual{background-image: url("http://www.ugg.cn/public/themes/images/background_inside-head.jpg");background-color: #232659;background-repeat: no-repeat;background-size: cover;text-align: right;position: relative;} .mainVisualRight{float: right;width: 33%;max-width: 364px;margin-top: 50px;margin-right: 5%;margin-bottom: 75px;text-align: center;} .mainVisualHeader{display: inline-block;width: 50%;} .mainVisualHeader > .headerImage{padding-bottom: 10px;border-bottom: 1px solid #fff;text-align: center;} .mainVisualHeader > .brandImage{margin-top: 15px;padding: 0 20px;} .mainVisualHeader img{width: 100%;} .mainImage{display: none;} .mainVisualBody{margin-top: 40px;color: rgb(0, 173, 224);} .comingsoon{margin: 0;font-size: 24px;font-family: ff-good-headline-web-pro-con;letter-spacing: 3px;} .campaignTitle{margin: 5px 0 15px;font-size: 19px;font-weight: bold;text-transform: none;} .bodyText{line-height: 2.5;text-align: left;} .releaseLabel{display: inline-block;margin: 20px auto;padding: 10px 20px;background-color: rgb(0, 168, 227);color: #fff;font-size: 16px;font-weight: bold;letter-spacing: 2px;} .insideout-nav{display: table;position: absolute;left: 3%;bottom: 0;margin: 15px auto;width: 100%;} .insideout-nav li{float: left;text-align: center;} .insideout-nav a{background-image: url("http://www.ugg.cn/public/themes/images/inside-out-nav-v2-sprite.png");display: inline-block;margin: 0 auto;} .insideout-nav a span{display: none;} .insideout-nav .header-nav-joy,.insideout-nav .header-nav-sadness, .insideout-nav .header-nav-anger,.insideout-nav .header-nav-disgust, .insideout-nav .header-nav-fear{width: 18%;} .insideout-nav .header-nav-joy a{background-position: 0 0;height: 57px;width: 91px;} .insideout-nav .header-nav-joy a:hover{background-position: 0 -59px;} .insideout-nav .header-nav-sadness a{background-position: -111px 0;height: 57px;width: 205px;} .insideout-nav .header-nav-sadness a:hover{background-position: -111px -59px;} .insideout-nav .header-nav-anger a{background-position: -333px 0;height: 57px;width: 157px;} .insideout-nav .header-nav-anger a:hover{background-position: -333px -59px;} .insideout-nav .header-nav-disgust a{background-position: -500px 0;height: 57px;width: 190px;} .insideout-nav .header-nav-disgust a:hover{background-position: -500px -59px;} .insideout-nav .header-nav-fear a{background-position: -700px 0;height: 57px;width: 113px;} .insideout-nav .header-nav-fear a:hover{background-position: -700px -59px;} .subVisual .joy-button,.subVisual .sadness-button,.subVisual .anger-button,.subVisual .disgust-button,.subVisual .fear-button{position: relative;top: 90%;line-height: 0;/*width: 100%;*/} .joy-button .btn,.sadness-button .btn,.anger-button .btn,.disgust-button .btn,.fear-button .btn{margin-top: -190px;} .subVisual .collection-button{position: relative;top: 90%;} .subVisual .joyImage{background-image: url(" http://www.ugg.cn/public/themes/images/inside-out-LP-joy-min.jpg");background-repeat: no-repeat;background-size: cover;background-position: center center;height: 1100px;max-height: 1200px;min-height: 1000px;width: 100%;} .subVisual .sadnessImage{background-image: url(" http://www.ugg.cn/public/themes/images/inside-out-LP-sadness-min.jpg");background-repeat: no-repeat;background-size: cover;background-position: center center;height: 1100px;max-height: 1200px;min-height: 1000px;width: 100%;} .subVisual .angerImage{background-image: url(" http://www.ugg.cn/public/themes/images/inside-out-LP-anger-min.jpg");background-repeat: no-repeat;background-size: cover;background-position: center center;height: 1100px;max-height: 1200px;min-height: 1000px;width: 100%;} .subVisual .disgustImage{background-image: url(" http://www.ugg.cn/public/themes/images/inside-out-LP-disgust-min.jpg");background-repeat: no-repeat;background-size: cover;background-position: center center;height: 1100px;max-height: 1200px;min-height: 1000px;width: 100%;} .subVisual .fearImage{background-image: url(" http://www.ugg.cn/public/themes/images/inside-out-LP-fear-min.jpg");background-repeat: no-repeat;background-size: cover;background-position: center center;height: 1100px;max-height: 1200px;min-height: 1000px;width: 100%;} .imagesWrapper{margin: -80px auto 0;padding-top: 80px;position: relative;} .imagesWrapper img{width: 100%;} } @media (min-width: 768px) and (max-width: 1199px){ .insideout-nav .header-nav-joy a{background-position: 0 -123px;height: 48px;width: 72px;} .insideout-nav .header-nav-joy a:hover{background-position: 0 -174px;} .insideout-nav .header-nav-sadness a{background-position: -87px -123px;height: 48px;width: 159px;} .insideout-nav .header-nav-sadness a:hover{background-position: -87px -174px;} .insideout-nav .header-nav-anger a{background-position: -260px -123px;height: 48px;width: 123px;} .insideout-nav .header-nav-anger a:hover{background-position: -260px -174px;} .insideout-nav .header-nav-disgust a{background-position: -392px -123px;height: 48px;width: 149px;} .insideout-nav .header-nav-disgust a:hover{background-position: -392px -174px;} .insideout-nav .header-nav-fear a{background-position: -551px -123px;height: 48px;width: 88px;} .insideout-nav .header-nav-fear a:hover{background-position: -551px -174px;} } @media (min-width: 768px) and (max-width: 1024px){ .mainVisualRight{width: 25%;margin-top: 20px;} .mainVisualHeader > .headerImage{padding-bottom: 8px;} .mainVisualHeader > .brandImage{margin-top: 10px;} .mainVisualBody{margin-top: 0px;} .comingsoon{font-size: 20px;} .campaignTitle{margin: 0 0 5px;font-size: 14px;} .bodyText{font-size: 10px;line-height: 1.2;margin: 0px;} .releaseLabel{margin: 5px auto;padding: 5px;font-size: 8px;} .btn.insideout_collection{margin: 5px auto;padding: 5px;font-size: 10px;} .loadshow{font-size: 9px;} .subVisual .joyImage,.subVisual .sadnessImage,.subVisual .angerImage,.subVisual .disgustImage,.subVisual .fearImage{height: 1000px;max-height: 800px;min-height: 600px;} } @media (min-width: 768px) and (max-width: 991px){ .imagesWrapper{margin: -55px auto 0;padding-top: 55px;} } @media (max-width: 767px){ .mainVisual{height: auto !important;} .displayPC{display: none !important;} .mainVisualRight{background-color: rgb(37, 37, 91);} .mainVisualHeader{width: 50%;margin: 0 auto;margin-bottom: 30px;padding-top: 20px;} .mainVisualHeader > .headerImage{padding-bottom: 10px;border-bottom: 1px solid #fff;text-align: center;} .mainVisualHeader > .brandImage{margin-top: 15px;padding: 0 20px;} .mainVisualHeader img{width: 100%;} .mainImage img{width: 100%;} .mainVisualBody{padding: 20px 15px 5px;background-color: rgb(20, 19, 53);color: rgb(0, 173, 224);text-align: center;} .comingsoon{margin: 0;font-size: 18px;font-family: ff-good-headline-web-pro-con;letter-spacing: 2px;} .campaignTitle{margin: 5px 0 25px;font-size: 14px;font-weight: bold;text-transform: none;} .bodyText{line-height: 2.0;font-size: 14px;text-align: left;} .releaseLabel{display: inline-block;margin: 20px auto;padding: 10px 20px;background-color: rgb(0, 168, 227);color: #fff;font-size: 12px;font-weight: bold;letter-spacing: 2px;}.imagesWrapper{width: 100%;margin: 0 auto;position: relative;} .imagesWrapper img{width: 100%;} .btn.insideout_collection,.subVisual a,.subVisual a:hover{font-size: 14px;font-weight: normal;} .subVisual .joyImage,.subVisual .sadnessImage,.subVisual .angerImage,.subVisual .disgustImage,.subVisual .fearImage,.subVisual .mbshopWrapper{position: relative;} .subVisual .mbshopWrapper{height: 300px;} .subVisual .joy-button,.subVisual .sadness-button,.subVisual .anger-button,.subVisual .disgust-button,.subVisual .fear-button{position: relative;top: 87%;line-height: 0;} .joy-button .btn,.sadness-button .btn,.anger-button .btn,.disgust-button .btn,.fear-button .btn{margin-top: -75px;margin-left: auto;margin-right: auto;max-width: 200px;} .subVisual .collection-button{position: absolute;left: 0;right: 0;top: 44%;} .subVisual a,.subVisual a:hover{display: block;} .subVisual .joyImage{background-image: url(" http://www.ugg.cn/public/themes/images/inside-out-LP-joy-min.jpg");background-color: #fff5a9;background-repeat: no-repeat;background-position: center top;background-size: cover;min-height: 350px;max-height: 510px;width: 100%;} .subVisual .sadnessImage{background-image: url(" http://www.ugg.cn/public/themes/images/inside-out-LP-sadness-min.jpg");background-color: #cbeff7;background-repeat: no-repeat;background-position: center top;background-size: cover;min-height: 350px;max-height: 510px;width: 100%;} .subVisual .angerImage{background-image: url(" http://www.ugg.cn/public/themes/images/inside-out-LP-anger-min.jpg");background-color: #ffc02e;background-repeat: no-repeat;background-position: center top;background-size: cover;min-height: 350px;max-height: 510px;width: 100%;} .subVisual .disgustImage{background-image: url(" http://www.ugg.cn/public/themes/images/inside-out-LP-disgust-min.jpg");background-color: #00a683;background-repeat: no-repeat;background-position: center top;background-size: cover;min-height: 350px;max-height: 510px;width: 100%;} .subVisual .fearImage{background-image: url(" http://www.ugg.cn/public/themes/images/inside-out-LP-fear-min.jpg");background-color: #73557e;background-repeat: no-repeat;background-position: center top;background-size: cover;min-height: 350px;max-height: 510px;width: 100%;} .subVisual .mbshopWrapper{background-image: url(" http://www.ugg.cn/public/themes/images/inside-out-LP-mobile-shopall-min.jpg");background-repeat: no-repeat;background-position: center center;background-size: cover;max-height: 200px;width: 100%;} } /*****************articleID183***************/ .font-gold-dull {color:#be9d56;} .letter-space-3 {letter-spacing: 3px;} .tablet-hide {display:block;} .tablet-show {display:none;} #main-top, #shop-icon, #classic-looks, #materials {background:#f6f6f6;} #materials {padding-bottom:7em;} #materials figure{background:none;} .top-copy figure {background: #000; padding: 90% 0;} .top-copy figcaption {top:7%;} .top-copy li {border-bottom:1px solid #292929; padding:7px 0} .top-copy p {width:78%; margin:0 auto; line-height:1.5em; font-size:1.5em;} .top-copy ul {width:72%; margin: 5em auto;border-top:1px solid #292929; padding:0;} .top-copy ul a:hover {color:#be9d56; text-decoration:underline;} .top-copy ul a:visited, .top-copy ul a:focus, .top-copy ul a:active {color:#be9d56;} .top-copy h1 {font-size: 5vw; margin-bottom: .2em; letter-spacing: 5px;} .classic-section-header { position:relative; padding-top:5.5em; padding-bottom:1.5em;} .classic-section-header::after { content: ""; border-bottom: 3px solid #be9d56; width: 60px; margin: 0 auto; display: block; padding-top: 24px;} .classic-section-header.white-header::after { content: ""; border-bottom: 3px solid #fff;} .icon-arrow {width: 30px; height: 30px; background: url(http://www.ugg.cn/public/themes/images/S15-JUL-icon-gold-arrow.png) no-repeat top left; background-size: contain; display: inline-block;} #shop-icon .slider-buttons {background:#fff; color:#000; padding:10px 0; border: 1px solid #eee; margin-bottom: 30px; white-space: normal;} #shop-icon .slider-buttons:hover { background:#be9d56; color:#fff; border: 1px solid #fff;} #shop-icon .slider-buttons:hover a{color:#fff;} #shop-icon .slider-buttons.double-line {padding:4px 0; line-height: 1.1em;} #shop-icon .carousel .carousel {background:#fff; padding-bottom:50px;} #shop-icon .classic-banner figcaption {top:25%; right:0; width:47%;} #shop-icon .classic-banner figcaption .btn {background: #000; border: 1px solid #fff; color: #fff; width: 94%; padding: 4% 0;} #shop-icon .classic-banner:hover figcaption .btn {border: 1px solid #be9d56; color: #be9d56;} /* On-Page Caption Hovers */ figure .fade-in-caption {position: absolute;background: rgba(0, 0, 0, 0.5);width:100%;height:100%;opacity: 0;bottom: 0%;left: 0%;-webkit-transition: opacity 0.2s ease-in;-moz-transition: opacity 0.2s ease-in;-o-transition: opacity 0.2s ease-in;font-size:.8em;} figure.caption-hover:hover .fade-in-caption { opacity: 1; left: 0; bottom:0;} #classic-looks .fade-in-caption .caption-inner {top: 0; position: absolute; text-align: center; margin: 0 auto; overflow: hidden; width: 100%; height:100%; padding-top: 50%;} #classic-looks .fade-in-caption .caption-inner p {font-size: 1.8em} #classic-looks .fade-in-caption .caption-inner-small {padding-top:25%;} .icon-play:hover:before {color:#be9d56; background: #000;} #icon-play-luxe::before{padding:4px 18px 4px 25px;} #icon-play::before{padding:8px 20px 8px 25px;} .icon-play:before {border: none; padding: none;} .icon-play { margin-top:-5%; font-size:4em;} .popup {padding:0; width:1140px;} .popup .popup-content {padding:0;} /* Border Buttons*/ .btn.gold-black-btn {background:none !important; color:#be9d56 !important; border: 2px solid #be9d56; padding:8px 2em;} .btn.gold-black-btn:hover {color:#000 !important; border: 2px solid #000;} .btn.white-gold-btn {background:none !important; color:#fff !important; border: 2px solid #fff; padding:8px 2em;} .btn.white-gold-btn:hover {color:#be9d56 !important; border: 2px solid #be9d56;} /* Viewport Sized Typography */ @media (min-width: 1440px) { .top-copy p {width:75%;} } @media (min-width: 991px) and (max-width: 1199px) { #shop-icon .slider-buttons {line-height: 1.1em;} #shop-icon .slider-buttons.double-line {padding:10px 0;} .top-copy figure {padding: 111% 0;} } /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 990px) { .tablet-hide {display: none;} .tablet-show {display: block;} .top-copy p {font-size: .7em !important;} .top-copy figcaption {top:3%;} .classic-hero {width:130%;} #shop-icon .classic-banner figcaption {top:6%; right:0; width:94%;} #shop-icon .classic-banner figcaption .btn {background: none; border: 1px solid #fff; color: #fff; padding: 38% 0; line-height: normal;} #shop-icon .classic-banner:hover figcaption .btn {background: none; border: 1px solid #fff; color: #fff; opacity: .7;} } /* Landscape phone to portrait tablet */ @media (max-width: 767px) { .mobile-hide {display: none!important;} #classic-looks .margin-top-negative {margin-top:-238px;} } /*****************articleID187***************/ .white-stroke-button{border:2px solid #fff;color:#fff;padding:0.75em 1.25em;font-size:16px;} a.white-stroke-button:hover{color:#fff} .classicluxe-details{background:#000;color:#fff} .play-button {top:16%;} .play-button-button{top:25%;} @media screen and (max-width:35.5em) { .hide-mobile{display:none !important} .sectiona-headline{padding:2em 0} .sectiona-headline img{width:85%} .section-shopbutton{top:61%} } @media screen and (min-width:35.5em) { .hide-desktop{display:none !important} .sectiona-headline{top:27%} .sectiona-headline img{width:52%} .section-shopbutton{top:61%} } @media screen and (max-width:64em){ .classicluxe-details{padding:2.5em 1em 2em} } @media screen and (min-width:64em) { .classicluxe-details{padding:2.5em 18em 2em} } /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 991px) { .play-button {top:12%;} .play-button-button{top:15%;} } /* Portrait tablet to landscape and desktop */ @media (max-width: 767px) { .play-button {top:7%;} } @media (max-width: 479px) { .play-button {top:45%;} .play-button-button{top:12%;} } #materials{padding-bottom: 2em} #materials p{line-height:2em;padding-top:1em} .materials-headline{width:55%;text-align:center;margin:0 auto;font-size:18px;} @media screen and (max-width:35.5em) { .materials-headline{width:95%} } @media screen and (min-width:35.5em) { #materials{margin-top:4em} } #styleguide{border-top:2px solid #c3890d;margin-bottom:-120px;} #styleguide-bg{border-top:300px solid #000;margin-bottom:-120px;} #styleguide figure{position:relative} #styleguide h4{letter-spacing:0.35em} #styleguide p{font-size:0.7em;letter-spacing:0.1em;color:#c3890d;font-style:italic} #styleguide .button{background:#000;color:#fff;padding:1em 3em;border:0;position:relative;top:-0.6em} @media screen and (max-width:35.5em) { .hide-mobile {display:none !important} #styleguide figure{top:-19.5em} #styleguide p{padding-bottom:1em} } @media screen and (min-width:35.5em) { .hide-desktop {display:none !important} #styleguide figure{top:-18em} #styleguide h4{padding:1.5em 0 0.2em 0} #styleguide p{padding-bottom:5em} } #classicluxe p{line-height:2em;padding-top:1em} .classicluxe-headline{width:55%;text-align:center;margin:0 auto} @media screen and (max-width:35.5em) { #classicluxe{padding-bottom: 0;margin-bottom:0;margin-top:-18em} #classicluxe h4{margin-bottom:0em !important} } @media screen and (min-width:35.5em) { #classicluxe{padding-bottom: 2em} #classicluxe{margin-top:-17em} } #tuscany{margin-bottom:5em} #tuscany figcaption{color:#fff} #tuscany figcaption p{text-align:justify} @media screen and (max-width:35.5em) { .hide-mobile{display:none !important} } @media screen and (min-width:35.5em) { .hide-desktop{display:none !important} } @media screen and (min-width:64em) { #tuscany figcaption p{padding:1.25em 30em;line-height:2em} #tuscany figcaption{top:34%} } @media screen and (max-width:64em) { #tuscany figcaption{top:13%} #tuscany figcaption p{padding:1.25em 1em;line-height:2em} } /*201603 women+men+kids category style*/ @media (min-width:1200px){ .mobile-hide {display: block;} .mobile-show {display: none;}} .tablet-hide {display: block;} .tablet-show {display: none;} .gold {color: #7e6b59;} .grid-title {position: relative; text-align: center; margin-bottom: 20px;} .grid-title span {background: #fff; padding: 0 15px; position: relative; z-index: 1;} .grid-title:before {background: #ddd; content: ""; display: block; height: 1px; position: absolute; top: 50%; width: 100%;} .grid-title:before {left: 0;} .grid-wrapper a {display: block; background: #d2c081; color: #fff; height: 62px; padding-top: 18px; text-transform: uppercase; vertical-align: middle; text-align: center; font-size: 16px; font-weight:bold;max-width: 300px; margin: 0 auto 30px; position: relative;} .grid-wrapper a .overlay {display: block; position: absolute; background: rgba(0, 0, 0, 0.25); width: 100%; height: 100%; opacity: 0; bottom: 0%; left: 0%; -webkit-transition: opacity 0.2s ease-in; -moz-transition: opacity 0.2s ease-in; -o-transition: opacity 0.2s ease-in; font-size: .8em;} .grid-wrapper a:hover, .grid-wrapper a.active {text-decoration: none;} .grid-wrapper a:hover .overlay {opacity: 1; left: 0; bottom: 0;} .grid-wrapper .overlay {z-index: 1; position: relative;} .grid-wrapper .text {z-index: 2; display: block; position: relative;} #section-c figure figcaption {top: 43%; right: -1px;} /*button*/ .white-btn{background: #fff; color: #7e6b59; border: 2px solid #fff; padding: 0.75em 1.25em!important; font-size: 16px; line-height: 22px;} @media screen and (max-width: 1199px) { .grid-wrapper a {margin: 0 auto 14px} } @media screen and (max-width: 991px) { .tablet-hide {display: none;} .tablet-show {display: block;} } @media screen and (min-width: 767) { #.mobile-hide {display: none;} #.mobile-show {display: block;} .grid-wrapper a {font-size: 14px;} } /*lunbo*/ #section-a figcaption {right: 0; margin: 0 auto;width: 47%; padding: 3.5em 0 3.5em 3em; margin-left:46%; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);} #section-a figcaption h1 {font-size: 42px;} #section-a figcaption p {font-size: 20px;} #section-a .item figcaption a:hover {text-decoration: none;} @media (min-width: 481px) { .zx-01{position:absolute;top:70%;left:58%;} .zx-02{position:absolute;top:92%;left:35%;} .zx-03{position:absolute;top:30%;left:58%;} .zx-04{position:absolute;top:40%;left:58%;} .zx-05{position:absolute;top:2%;left:20%;} .zx-06{position:absolute;top:12%;left:28%;} .zx-07{position:absolute;top:96%;left:25%;} .zx-08{position:absolute;top:16%;left:30%;} .zx-09{position:absolute;top:80%;left:25%;} .zx-10{position:absolute;top:90%;left:58%;} .zx-11{position:absolute;top:3%;left:58%;} .zx-12{position:absolute;top:16%;left:56%;} .zx-13{position:absolute;top:88%;left:45%;} .zx-14{position:absolute;top:10%;left:58%;} .zx-15{position:absolute;top:40%;left:58%;} .zx-16{position:absolute;top:87%;left:58%;} .zx-17{position:absolute;top:95%;left:58%;} .zx-18{position:absolute;top:25%;left:58%;} .zx-19{position:absolute;top:40%;left:58%;} .zx-20{position:absolute;top:25%;left:17%;} .zx-21{position:absolute;top:40%;left:30%;} .zx-22{position:absolute;top:25%;left:17%;} .zx-23{position:absolute;top:40%;left:30%;} .zx-24{position:absolute;top:60%;left:58%;} .zx-25{position:absolute;top:75%;left:58%;} .zx-26{position:absolute;top:0%;left:58%;} .zx-27{position:absolute;top:16%;left:58%;} .zx-28{position:absolute;top:90%;left:30%;} } @media(max-width:480px) { .zx-01{position:absolute;top:65%;left:58%;} .zx-02{position:absolute;top:92%;left:13%;} .zx-03{position:absolute;top:30%;left:58%;} .zx-04{position:absolute;top:38%;left:58%;} .zx-05{position:absolute;top:2%;left:20%;} .zx-06{position:absolute;top:5%;left:0%;} .zx-07{position:absolute;top:96%;left:0%;} .zx-08{position:absolute;top:12%;left:10%;} .zx-09{position:absolute;top:80%;left:10%;} .zx-10{position:absolute;top:90%;left:58%;} .zx-11{position:absolute;top:3%;left:58%;} .zx-12{position:absolute;top:16%;left:56%;} .zx-13{position:absolute;top:88%;left:30%;} .zx-14{position:absolute;top:10%;left:58%;} .zx-15{position:absolute;top:35%;left:58%;} .zx-16{position:absolute;top:87%;left:58%;} .zx-17{position:absolute;top:90%;left:58%;} .zx-18{position:absolute;top:25%;left:58%;} .zx-19{position:absolute;top:40%;left:58%;} .zx-20{position:absolute;top:25%;left:17%;} .zx-21{position:absolute;top:35%;left:10%;} .zx-22{position:absolute;top:25%;left:17%;} .zx-23{position:absolute;top:35%;left:10%;} .zx-24{position:absolute;top:60%;left:58%;} .zx-25{position:absolute;top:75%;left:58%;} .zx-26{position:absolute;top:0%;left:58%;} .zx-27{position:absolute;top:16%;left:58%;} .zx-28{position:absolute;top:90%;left:15%;} } /*201604*/ /* On-Page Caption Hovers */ #home-banner-a figure .fade-in-caption,#home-banner-b figure .fade-in-caption,#home-banner-c figure .fade-in-caption {position: absolute; background: rgba(0, 0, 0, 0.25); width:100%; height:100%; opacity: 0; bottom: 0%; left: 0%; -webkit-transition: opacity 0.2s ease-in; -moz-transition: opacity 0.2s ease-in; -o-transition: opacity 0.2s ease-in; font-size:.8em;} #home-banner-a figure.caption-hover:hover .fade-in-caption,#home-banner-b figure.caption-hover:hover .fade-in-caption,#home-banner-c figure.caption-hover:hover .fade-in-caption { opacity: 1; left: 0; bottom:0;} #home-banner-a figure.caption-hover .fade-in-caption .caption-inner{top: 0; position: absolute; text-align: center; margin: 0 auto; overflow: hidden; width: 100%; height:100%; padding-top: 31%;} #home-banner-b figure.caption-hover .fade-in-caption .caption-inner{top: 0; position: absolute; text-align: center; margin: 0 auto; overflow: hidden; width: 100%; height:100%; padding-top: 55%;} #home-banner-c figure.caption-hover .fade-in-caption .caption-inner{top: 0; position: absolute; text-align: center; margin: 0 auto; overflow: hidden; width: 100%; height:100%; padding-top: 10%;} .m-search { background: rgba(0, 0, 0, 0) url("../../images/resources/header/search.png") no-repeat scroll 0 0; border: medium none; height: 34px; text-indent: -999em; vertical-align: top; } /*hot cat*/ /* Shop Women title used at 776 and below only */ .gold {color: #7e6b59;} .grid-title {position: relative; text-align: center; font-style: italic; font-family: "Times New Roman", Georgia, Serif; margin-bottom: 20px;} .grid-title span {background: #fff; padding: 0 15px; position: relative; z-index: 1;} .grid-title:before {background: #ddd; content: ""; display: block; height: 1px; position: absolute; top: 50%; width: 100%;} .html-slot-container .grid-title:before {background: #ddd !important; content: ""; display: block; height: 1px; position: absolute; top: 60%; width: 100%;} .grid-title:before {left: 0;} /* Padding tweak to align with slot B */ #cat-landing-grid-slot-c .container {padding-left:0px; padding-right: 0px;} /* This will make the buttons and image bottom align */ .padding-tweak .col-lg-offset-1 {padding-left:0px; padding-right: 0px;} /* Allows the buttons to fully expand */ /* Button - Gold */ #cat-landing-grid-slot-c span.btn.btn-default {background: #d2c081; color: #fff; border: 0px; font-size: 16px; width: 100%; padding: 18px 0px; margin-bottom: .5em; -moz-transition: all .2s ease-in; -o-transition: all .2s ease-in; -webkit-transition: all .2s ease-in; transition: all .2s ease-in;} #cat-landing-grid-slot-c span.btn.btn-default:hover {background-color: #9e9161;} @media screen and (max-width: 1199px) { #cat-landing-grid-slot-c .container {padding-left: 15px; padding-right: 15px;} #cat-landing-grid-slot-c span.btn.btn-default {margin-bottom: .8em;} /* button tweak */ } @media screen and (min-width: 767) { #cat-landing-grid-slot-c span.btn.btn-default {padding: 20px 0px;} /* button tweak */ } .playBtnWrapper { position: absolute; top: 48%; left: 0; width: 100%; text-align: center; } .danpins{padding-left:3%;padding-right:3%;} .danpins-border{border-top:1px solid #a6a2a1;padding-top:5px;max-width:90%;margin:0 auto;} /*crm login页面*/ .index { background: #fff url("../images/bg-main.jpg") no-repeat scroll center top / cover ; min-height: 300px; } .container, #wrapper { margin-left: auto; margin-right: auto; padding-left: 15px; padding-right: 15px; } .main { margin: 10px; } .input-list { margin-bottom: 15px; } input.validateCode { width: 58%; } .img-text { color: #666; height: 40px; line-height: 40px; margin-left: 3px; text-decoration: underline; } .vcode_img { margin-top: 10px; } .input-control { padding-top: 10px; } a.btn-submit { background: rgba(0, 0, 0, 0) url("../images/bg-purple.png") no-repeat scroll 0 0 / cover ; } a.btn { text-decoration: none; } a.btn-submit-back { background: rgba(0, 0, 0, 0) url("../images/bg-blue.png") no-repeat scroll 0 0 / cover ; } a.btn { text-decoration: none; } span.icon-ugg{ background: rgba(0, 0, 0, 0) url("../icon.png") no-repeat scroll 0 0 / 21px auto; display: inline-block; height: 12px; width: 21px; } span.icon-weibo{ background: rgba(0, 0, 0, 0) url("../icon.png") no-repeat scroll 0 -24px / 21px auto; display: inline-block; height: 12px; width: 21px; } .crm_login_link{ margin: 10px 0; width: 100%; } .crm_login_link a{color: #000;float: left;text-align: center;text-decoration: none;width: 50%;height:30px;line-height:30px;} div.middle{ font-family:"Gotham-Book","黑体"; } .middle_img{float:left;width:32%;} .middle_right{margin-right:2%;} #change_left li { text-align: center; width: 100%; } .middle_up_left li { border: 1px solid #c6c6c6; height: auto; line-height: 35px; list-style: outside none none; margin-top: 20px; } .middle .caption-inner{top: 0; position: absolute; text-align: center; margin: 0 auto; overflow: hidden; width: 100%; height:100%; padding-top: 31%;} .middle_up_right{float: left;font-family: "Gotham-Book","黑体";font-size: 14px;width: 59.6667%;} @media (max-width: 991px){.middle_up_right{width:100%} #line{display:none;}} /*crm login页面结束*/ /*825直播文章页*/ strong{font-weight:600;} .zhibo_img{width:100%;text-align:center;} .logo a{display: block;height: 48px;width: 95px;background-image: url("http://www.ugg.cn/public/themes/images/resources/logo.svg");} #mobile-show-header-nav{background:#fff url("http://www.ugg.cn/public/themes/images/resources/logo.svg") no-repeat scroll center center / 73px 40px !important;} .winning_list_left{width:15%;text-align:center;float:left;color:#fff;background-color:rgba(151, 140, 122,0.1);opacity: 0;} .winning_list {width:100%;text-align:center;float:left;color:#fff;font-size:12px;} .winning_list_right{width:15%;text-align:center;float:right;color:#fff;background-color:rgba(151, 140, 122,0.1);opacity: 0;} .bofang{width:33%;text-align:center;float:left;} .share{width:33%;text-align:center;float:right;border-radius:3px;} ul,li{ list-style:none; padding:0; margin:0} #mq{width:100%;height:56px;margin:0 auto; text-align:center;font-size:21px;} /*825直播文章页结束*/ .goods-pic-magnifier{background:none !important;} /*商品列表页排序方式样式*/ .mobileOrderBy{width:142px !important;} .facets_wrap{right: 192px; position: absolute;/*top: 40px;*/width: 100%;} .sort_facet{/*left: 275px;top: 0;*/width: 162px;} .facets_nav_sort{overflow: hidden;position: relative;z-index: 11;background-color:#fff;} .facets_nav_item{background: rgba(0, 0, 0, 0) none repeat scroll 0 center;} .facets_nav_item::after{background: #fff none repeat scroll 0 0;content: "";display: block;height: 1px;width: 100%;} .sort_facet .facets_nav_item{border: 1px solid #eaedeb;padding-top: 0 !important;} .facets_nav_item:first-child{ padding-top: 10px;} .facets_nav_item{border-bottom: 0 none;padding-left: 20px;padding-right: 20px;padding-top: 5px;} .facets_nav_item{-moz-border-bottom-colors: none;-moz-border-left-colors: none;-moz-border-right-colors: none;-moz-border-top-colors: none;border-color: #eaedeb;border-image: none;border-style: solid;border-width: 0 1px 1px;padding-left: 10px;} .facets_wrap h4.plus_minus::before {top: 17px;} .plus_minus::before {right: -2px;} .plus_minus::before {background: rgba(0, 0, 0, 0) url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4xLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHdpZHRoPSIyMHB4IiBoZWlnaHQ9IjIwcHgiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjAgMjAiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGxpbmUgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNTU1NjU1IiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgeDE9Ii0wLjA2MyIgeTE9IjEwLjAwNyIgeDI9IjIwLjAwMiIgeTI9IjEwLjAwNyIvPg0KPC9zdmc+DQo=") repeat scroll 0 0 / 11px 11px;content: "";height: 12px;margin-top: -5px;position: absolute;top: 18px;width: 11px;} .product_list_area div.heading h4.plus_minus::after {top: 12px;} .product_list_area div.heading .plus_minus::after {top: 13px;} .facets_nav_item h4::after {right: -3px;} .facets_wrap h4.plus_minus::after {top: 12px;} .plus_minus::after {background: rgba(0, 0, 0, 0) url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4xLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHdpZHRoPSIyMHB4IiBoZWlnaHQ9IjIwcHgiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjAgMjAiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGxpbmUgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNTU1NjU1IiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgeDE9IjEwLjEwMiIgeTE9IjAuMDAzIiB4Mj0iMTAuMTAyIiB5Mj0iMjAuMDY3Ii8+DQo8L3N2Zz4NCg==") repeat scroll 0 0 / 11px 11px;content: "";height: 11px;margin-top: 0;position: absolute;top: 13px;transform: rotate(0deg);transition: all 500ms ease-out 0s;width: 12px;} .facets_nav_item h4 {margin:0px !important;cursor: pointer;/*font-family: "FuturaMedium","Futura","Century Gothic",sans-serif;*/font-size: 13px;line-height: 37px;position: relative;} .plus_minus {backface-visibility: hidden;position: absolute;} .facets_wrap h4 {font-size: 10px;} .facets_wrap h4 {/*font-family: "FuturaMedium","Futura","Century Gothic",sans-serif;*/font-size: 13px;font-style: normal;font-weight: normal;letter-spacing: 2px;text-transform: uppercase;} .facets_nav_sort .facets_group {display: none;} .facets_checkbox {margin-bottom: 5px;position: relative;} .facets_checkbox input {left: -9999px;position: absolute;z-index: 1;} .facets_checkbox label::before {border: 1px solid #555;content: "";display: block;height: 10px;left: 0;margin-top: -6px;position: absolute;top: 50%;width: 10px;} .facets_checkbox label {text-align:left;box-sizing: border-box;cursor: pointer;display: block;font-size: 13px;letter-spacing: 1px;margin-bottom: 0;overflow: hidden;padding-left: 20px;position: relative;text-transform: none;width: 100%;} .facets_checkbox {margin-bottom: 5px;position: relative;} .facets_wrap h4.plus_minus.active::after {top: 12px;} .plus_minus.active::after, .plus_minus.nav_header-active::after {right: -2px;} .plus_minus.active::after, .plus_minus.nav_header-active::after {background: rgba(0, 0, 0, 0) url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4xLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHdpZHRoPSIyMHB4IiBoZWlnaHQ9IjIwcHgiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjAgMjAiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGxpbmUgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNTU1NjU1IiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgeDE9IjEwLjEwMiIgeTE9IjAuMDAzIiB4Mj0iMTAuMTAyIiB5Mj0iMjAuMDY3Ii8+DQo8L3N2Zz4NCg==") repeat scroll 0 0 / 11px 11px;height: 12px;margin-top: 0;top: 13px;transform: rotate(90deg);transition: all 500ms ease-out 0s;width: 12px;} .orderbychecked label::before {background-color: #555;} /*评分*/ .start-point { line-height: 20px; } .star-point-items { position: relative; overflow: hidden; } .star-point-items .b, .star-point-items .f { width: 85px; height: 20px; overflow: hidden; position: relative; cursor: pointer; } .star-point-items .b { position: absolute; top: 0; left: -92px; } .goods-point { padding: 6px 0; line-height: 1.5; } .goods-point a { color: blue; text-decoration: underline; } /*列表页色块下划线*/ .gallery_color_spec{border-bottom:2px solid;border-color:#000 #000 -moz-use-text-color;display:inline-block;width:22px;height:25px;} /*点击红包领取优惠券*/ .coupon-dialog{ background-color: white;display: none;margin: 0;padding: 0;position: fixed;z-index: 131061;overflow-y: scroll;} .coupon-dialog-div{background-color: black;bottom: 0;display: none;left: 0;opacity: 0.6;position: fixed;right: 0;top: 0;z-index: 1000;} .coupon-popup-btn-close {background: rgba(0, 0, 0, 0) url("http://www.ugg.cn/public/themes/images/close-btn.png") no-repeat scroll 0 0;display: block;height: 28px !important;text-indent: -9999px !important;width: 28px !important;} .coupon-dialog{display: none; top: 50px; left: 25%; width: 50%; margin: 0px auto;overflow-y:hidden;} .coupon-dialog img{max-width:80%;} .pc_barcode{width:200px;height:44px;margin-top:-14px;} @media screen and (max-width: 1199px) { .coupon-dialog{display: none; top: 15%; left: 25%; width: 50%;height:70%; margin: 0px auto;overflow-y:hidden;} .pc_barcode{width:200px;height:34px;margin-top:-10px;margin-left:-20px;} } @media (max-width: 991px){ .coupon-dialog{display: none; top: 20%; left: 20%; width: 60%;height:60%; margin: 0px auto;overflow-y:hidden;} .pc_barcode{width:160px;height:30px;margin-top:-9px;margin-left:-18px;} } @media (max-width: 767px){ .coupon-dialog{display: none; top: 20%; left: 10%; width: 80%;height:60%; margin: 0px auto;overflow-y:hidden;} .pc_barcode{width:180px;height:34px;margin-top:-9px;} } .hongbao-font{font-size:12px;width:675px} @media(max-width:1200px){.hongbao-font{font-size:10px;width:588px}} @media(max-width:992px){.hongbao-font{font-size:8px;width:468px}} .share-wx{background:url("../hongbao/wx.png");height:32px;width:32px;display:inline-block;cursor: pointer;background-position: 0 0;} .share-wx:hover{opacity:0.8;} @media (min-width: 400px){.barcode123{width:160px;height:45px;line-height:45px;}} @media (max-width: 400px){.barcode123{width:140px;height:35px;}} @media (max-width: 380px){.barcode123{width:130px;height:35px;}} @media (max-width: 360px){.barcode123{width:140px;height:40px;}} @media (max-width: 350px){.barcode123{width:125px;height:35px;}} .main-image-slide{width:579px;height:509px;float:left;} .product-main-image{width:6948px;height:509px;} .store-slt{margin-bottom:1em;} .store-slt .s-input{width:100%;max-width:240px;font-size:1.2em;border-radius:3px; border: 1px solid #ccc;padding: 4px;} @media(max-width:767px){.store-slt .x-input{font-size:1em;}} .store-table-f{max-width:1170px;margin-left: auto;margin-right: auto;padding-left: 15px;padding-right: 15px;} .store-table-f tbody{width:100%;display:table;} .store-table-f th,.store-table-f td{text-align:left;padding:5px 10px 5px 5px;} .CartInfoItems{height:103px;overflow:hidden;} .CartInfoItems .p10{height:54px;overflow:hidden;} .CartInfoItems .p10 p{margin:0px !important;} .product-shuxian:after{content:" .";visibility:hidden;} .product-shuxian{height:28px;border-left:1px solid #f4f4f4;width:0;float:left;margin-right:10px;margin-top:2px;} /*定位栏*/ .location-bar{ position:fixed; right:0; top:50vh; margin-top:-150px; z-index:99; background-color:#f4f4f4; font-size:1.2em; border-radius: 3px 0 0 3px; transform: translateX(5px) scale(0.8); } .location-bar>div{ width:40px; height:50px; margin:0 5px; padding:5px 0; line-height:20px; text-align:center; border-top:1px solid #fff; border-bottom:1px solid #8f8f8f; position:relative; cursor:pointer; color:#30c641; display:none; } .location-bar>div:first-child{border-top:0;}.location-bar>div:last-child{border-bottom:0;display:block;} .location-bar.pcbarshow>div{display:block;} .location-bar>div:after{content:'';position:absolute;top:5px;left:0;z-index:1;background:#f4f4f4 url(../resources/pdp-tab.png) no-repeat 0 -160px / 80px auto;width:40px;height:40px;transition:transform 600ms ease,background-color 600ms ease;-webkit-transition:transform 600ms ease,background-color 600ms ease;-moz-transition:transform 600ms ease,background-color 600ms ease;} .location-bar>div:nth-of-type(2):after{background-position:0 -120px} .location-bar>div:nth-of-type(3):after{background-position:0 -200px} .location-bar>div:nth-of-type(4):after{background-position:0 -80px} .location-bar>div:nth-of-type(5):after{background-position:0 -40px} .location-bar>div:nth-of-type(6):after{background-position:0 0} .location-bar>div:hover:after{background-position-x:-40px;transform:translateX(-45px);background-color:transparent;} .location-bar>div a:hover,.location-bar>div a{text-decoration:none;color:#30c641} .plp.location-bar{top:75vh;margin-top:-160px;} .location-bar.plp #backtotop {display: block;} .plp.location-bar>div:nth-of-type(1),.plp.location-bar>div:nth-of-type(2),.plp.location-bar>div:nth-of-type(3),.plp.location-bar>div:nth-of-type(4){display:none} .plp.location-bar>div:nth-of-type(5){border-top:0;} @media(max-width:767px){ .plp.location-bar{top:60%;margin-top:-160px;} .location-bar{top:60%;background-color:transparent;margin-top:-180px;height:100px;display: flex;flex-direction: column;justify-content: flex-end;transform:none;} .location-bar>div,.location-bar>div a,.location-bar>div a:hover{border:0;color:transparent;} .location-bar>div:nth-of-type(1),.location-bar>div:nth-of-type(2),.location-bar>div:nth-of-type(3),.location-bar>div:nth-of-type(4),.location-bar>div:nth-of-type(5){display:none} .location-bar>div:nth-of-type(5):after{background:url(../resources/endtop.png) no-repeat 0 / 40px auto;} .location-bar>div:nth-of-type(6):after{background:url(../resources/callwaiter.png) no-repeat 0 / 40px auto;z-index:-1;} .location-bar>div:hover:after{background-position:0;transform:none;z-index:-1;} } /* ugglife页面样式 */ #medium_container,#tag_box{width:936px;margin:0 auto;} .medium-items{display:inline-block;overflow:hidden;position:relative;width:292px;height:292px;margin:15px;padding:0;} .medium-items img{position:absolute;top:-180.067px;left:-113.55px;width:519.11px;} .medium-cart{background:#00bff0 url(../mediumcart.png?v=20170915) no-repeat 0 / 100%;width:40px;height:40px;display:block;position:absolute;bottom:110px;right:30px;cursor:pointer;border-radius:100%;} .tag-box{position:absolute;width:100%;left:0;height:auto;color:#fff;margin-top:4px;margin-left:-2px;} .tag-item{display:inline-block;background-color:transparent;border-radius:100%;border:1px solid #fff;font-size:14px;padding:2px 12px;margin:0 6px 6px;cursor:pointer;} .tag-item:hover{background-color:#00bff0;border-color:#00bff0;} #tag_box .tag_table{margin:0 -2px 11px} #tag_box .tag_item,.tag-item{display:inline-block;border-radius:12.5px / 50%;border:1px solid #01bff1;font-size:14px;padding:2px 8px;margin:0 2px 4px;cursor:pointer;color:#01bff1;background:transparent;} #tag_box .tag_item:hover,.tag-item:hover{color:#fff;background-color:#01bff1;} #medium-pop .left-pdp{background: url(../resources/this-is-ugg_03.png) no-repeat 0 0 / contain;z-index:5000;opacity:.6;width:40px;height:40px;left: calc(50% - 320px);margin-top:-20px;} #medium-pop .right-pdp{background: url(../resources/this-is-ugg_05.png) no-repeat 0 0 / contain;z-index:5000;opacity:.6;width:40px;height:40px;left: calc(50% + 280px);margin-top:-20px;} #medium-pop .left-pdp:hover,#medium-pop .right-pdp:hover{opacity:1;} #medium-pop-back { z-index: 1000; } @media(max-width:991px){ #medium_container,#tag_box{width:100%;} .medium-items{width:240px;height:240px;margin:10px;} .medium-items img{width:416px;top:-141px;left:-88px;} #tag_box .tag_table{margin:5px -2px 0;} } #medium_container .zoom-image { display: block; box-shadow: inset 0px 0px 0px 20px #ccc; transition: all .2s ease; cursor:pointer; } #medium_container .zoom-image img { opacity: .8; } @media(max-width:767px){ .mobmedium{margin:0 -1px;position:relative;} .medium-items{width:calc(33.3333% - 1px);height:33.3333vw;margin:0 0 1px 1px;} .medium-items img{width:200%;top:-81%;left:-50%;} #medium-pop .right-pdp,#medium-pop .left-pdp{left:5px} #medium-pop .right-pdp{right: 5px;left:auto} .medium-cart{right:4.8%;bottom:19%;width:9%;height:8%;} #tag_box .tag_table{margin:14px -2px 11px;} } .medium-message{width:100%;height:100%;left:0;position: fixed;top: 0;z-index: 100000;display:flex;justify-content:center;align-items:center;} .medium-container{margin: 0 auto;overflow: hidden;position: relative;z-index: 5000;width:480px;padding:60px 0 80px;} .medium-container img{width:100%} .medtlt-close{line-height: 34px; overflow: hidden; position: absolute; top: 0; right: 0; z-index: 5001;} .med-close{cursor: pointer; display: inline-block; float: right; margin-right: 18px; overflow: hidden; font-size: 5em; color:#fff } .medium-titile .tagnum{display:none;text-align:center;font-size: 16px;margin-top:16px;margin-bottom:16px;color:#333;} .medium-titile .tag_num,.medium-titile .tag_reflesh,.medium-titile .get_tag{display:inline-block;text-align:center;line-height:22px;height:22px;} .medium-titile .tag_reflesh{color:#01bff1} .medium-titile .tag_reflesh:hover{color:#333;cursor:pointer;} @media(max-width:767px){.medium-titile .tagnum{font-size:14px;margin-top:6px;margin-bottom:8px;}} .medium_name{position:absolute;width:80px;top:200px;right:0;padding:3px;} .medium_name li{padding:4px 2px;margin:5px 0;border-left:4px solid rgba(51,51,51,1);} .medium_name li:first-child{margin-top:0;} .medium_name li a{text-decoration:none;color:rgba(51,51,51,1);} .medium_name li:hover{border-left:4px solid #01bff1;} .medium_name li:hover a{text-decoration:none;color:#01bff1;} .medium_name li.active{background-color:#01bff1;opacity:1;border-radius:0 3px 3px 0;border-left:4px solid #01bff1;} .medium_name li.active a{color:#fff;} #medium-container .swiper-slide{height:auto;} #medium_container .mob-select{border-radius:3px;border:1px solid #333;width:calc(33.3333% - 2px);color:#333;margin-bottom:4px;margin-left:2px;} /* ugglife页面样式 --end */ /*pom页面*/ #pompom .yinying:before{z-index:1;} #pompom .cheng-btn span:before{background-color:#773e33;} .colorinhert:before,.colorinhert:after{background-color:currentColor !important;} /*****************phillp lp********************/ .lunbo1,.lunbo2,.lunbo3,.lunbo4{margin: 0 auto;position: relative;z-index: 1;} .lunbo1-pagination,.lunbo2-pagination,.lunbo3-pagination,.lunbo4-pagination{bottom:-20px !important;} .lunbo1-pagination.swiper-pagination-bullets .swiper-pagination-bullet,.lunbo2-pagination.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 5px;} video::-webkit-media-controls-enclosure { overflow:hidden; } video::-webkit-media-controls-panel { width: calc(100% + 30px); } .home-banner-width{width:77.4%;margin:0 auto;} .home-img-underline:hover .new_span_underline:before{ visibility: visible; -webkit-transform: scaleX(1); transform: scaleX(1);} /***saleicon***/ .saleicon{ position: absolute; right: 0; top: calc(100% *.0695); width: 39.85%; height: 22.8%; z-index:1; } @media(min-width:768px){ .grid-tile .saleicon{ position: absolute; right: 0; top: calc((100% - 20px) *.0695); width: 39.85%; height: 22.8%; } } .saleicon img{ width:100%; } /********************列表页橱窗区块****************************/ .tile--right{float:right;} .tile--left{float:left;} .tile--medium{ overflow:hidden; width:50%; height:442px; } @media(min-width:1600px){.tile--medium{width:50%;height:530px;}} @media(max-width: 1199px){.tile--medium{width:50%;height:384px;}} @media (max-width: 991px){.tile--medium{width:50%;height:320px;}} @media (max-width: 767px){.tile--medium{width:100%;height:68vw;}} /********************商品详情关联销售*******************************/ /* #relate-area .detailonlytag{border:0;} */ /* .relatd_sale .swiper-slide{padding-top:20px;border-top:1px solid #ccc} */