#smart-home-list-banner{ height:422px; background:#F4F4F4 url(../img/list-banner.jpg) 50% 50% no-repeat; text-align:center} .change-box{ width:100%; height:100%} .change-box div{ position:absolute; background-position:50% 50%; background-size:cover; display:none; width:100%; height:100%} .change-box div.act{ display:block} #SlideBox{ position:relative; overflow:hidden} #SlideBox li{ display:none; position:absolute; left:0; right:0; top:0; bottom:0; background-size:cover; background-position:50% 50%} #SlideBox .wd{ position:absolute; right:6%; top:25%; z-index:999; color:#fff; font-family:'MyriadPro-Light','Myriad Pro';font-weight: bold;letter-spacing:-1px} #SlideBox .wd .w1{ font-size:7.8em;position: relative;} #SlideBox .wd p{ color:#fff} #SlideBox .wd .w1 sup{ font-size:1em;position: absolute;top:-15px} #SlideBox .wd .w2{ font-size:13em; line-height:80%} #SlideBox .wd .w3{ font-size:7em} #SlideBox .wd .w4{ padding-top:8%; padding-left:37px} #SlideBox .wd .w4 img{ width:100%; max-width:284px} .section p{ color:#313131;-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;font-weight: bold;line-height: 33px!important;} #DownApp{ background:#F4F4F4; text-align:center; position:relative} #DownApp .iphone{ position:absolute; left:18.5%; top:13%; width:100%; text-align:left} #DownApp .iphone img{ width:19%} #DownApp .desc{ padding-left:32%; color:#333333; font-family:'MyriadPro-Light','Myriad Pro'; position:relative} #DownApp .desc h2{ font-size:4.9em;font-size: 55.7938px;text-align: center;font-weight: bold;margin-top: 50px;} #DownApp .desc .txt{ font-size:1.56em; padding-bottom:42px} #DownApp .desc a{ margin:11px 0; display:inline-block} #DownApp .desc span{ font-size:2em; display:block; padding:8px} #ColorBox{ background-size:cover} #ColorBox .wd{ text-align:center; font-family:'MyriadPro-Light','Myriad Pro'; color:#333; padding-left:45%} #ColorBox .wd h2{ font-size:4.6em; color:#000; padding-bottom:5%;text-align: center;font-weight: bold;} #ColorBox .wd p{ font-size:2.08em} #ColorBox .color-ctrl{ padding-top:15%} #ColorBox .color-ctrl a{ display:inline-block; background-position:50% 50%; background-repeat:no-repeat; width:84px; height:84px; border-radius:5px; margin:0 10px} #ColorBox .color-ctrl .c1{ background-color:#9E008E} #ColorBox .color-ctrl .c2{ background-color:#20CFF5} #ColorBox .color-ctrl .c3{ background-color:#A7E155} #ColorBox .color-ctrl .c4{ background-color:#FFD905} #ColorBox .color-ctrl .c5{ background-color:#E45600} #ColorBox .color-ctrl .c6{ background-color:#CE0000} #ColorBox .color-ctrl a.on{ background-image:url(../img/bg-tick.png); background-position:50% 50%; background-repeat:no-repeat; background-size:78%} #DesignBox{ background-size:contain; overflow:hidden} #DesignBox .lamp{ position:relative; width:50%; text-align:center} #DesignBox .lamp .bd{ display:inline-block; width:321px} #DesignBox .lamp .bd div{ position:absolute; background-position:50% 50%; background-repeat:no-repeat; width:321px; transition:all 0.5s ease} #DesignBox .lamp .bd div a{ display:none; width:57px; height:57px; background:url(../img/ic-more.png)/*tpa=http://www.divoom.com/image/smart-home/aurabulb/ic-more.png*/; float:right; transition:all 0.5s ease} #DesignBox .lamp .bd .sec-1 a{ margin-top:138px; margin-right:-29px} #DesignBox .lamp .bd .sec-4 a{ margin-top:73px; margin-right:38px} #DesignBox .lamp .bd .sec-6 a{ margin-top:93px; margin-right:42px} #DesignBox .lamp .bd .sec-1{ /*background-image:url(aurabulb/sec-1.png);*/ z-index:6; height:339px; top:-169px} #DesignBox .lamp .bd .sec-2{ /*background-image:url(aurabulb/sec-2.png);*/ z-index:5; height:49px; top:-22px} #DesignBox .lamp .bd .sec-3{ /*background-image:url(aurabulb/sec-3.png);*/ z-index:4; height:42px; top:-25px} #DesignBox .lamp .bd .sec-4{ /*background-image:url(aurabulb/sec-4.png);*/ z-index:3; height:203px; top:-33px} #DesignBox .lamp .bd .sec-5{ /*background-image:url(aurabulb/sec-5.png);*/ z-index:2; height:74px; top:96px} #DesignBox .lamp .bd .sec-6{ /*background-image:url(aurabulb/sec-6.png);*/ z-index:1; height:173px; top:51px} #DesignBox .lamp .act div a{ display:block} #DesignBox .lamp .act .sec-1{ top:-429px} #DesignBox .lamp .act .sec-2{ top:-105px} #DesignBox .lamp .act .sec-3{ top:-60px} #DesignBox .lamp .act .sec-4{ top:-33px} #DesignBox .lamp .act .sec-5{ top:151px} #DesignBox .lamp .act .sec-6{ top:225px} #SoundQty{ background:#E7E7E7 url(b.gif)/*tpa=http://www.divoom.com/image/b.gif*/ 50% bottom no-repeat; background-size:cover; text-align:center} #SoundQty .fp-tableCell{ vertical-align:top} #SoundQty .ms_note{ position:relative; height:80%; margin:0 auto} #SoundQty .ms_note div{ position:absolute} #SoundQty .wd{ position:absolute; width:100%; text-align:center} #SoundQty h2{font-weight: bold;text-align: center;} #DesignBox .wd{ position:absolute; right:0; width:55%; color:#fff; text-align:center; font-size:2.06em; font-family:'MyriadPro-Light','Myriad Pro'; line-height:150%} #DesignBox .desc-list .ct{ position:absolute; width:50%; background:#000000; text-align:center; top:0; height:100%; left:120%; color:#FFF; font-family:'MyriadPro-Light','Myriad Pro'; transition:all 0.3s ease} #DesignBox .desc-list .ct .close{ display:block; width:57px; height:57px; background:url(../img/btn-close.png)/*tpa=http://www.divoom.com/image/smart-home/aurabulb/btn-close.png*/ 50% 50% no-repeat; margin-left:-29px; top:50%; margin-top:-29px; position:absolute} #DesignBox .desc-list .ct div{ height:50%; position:relative} #DesignBox .desc-list .ct div img{; position:absolute; bottom:0} #DesignBox .desc-list .ct h3{ font-size:3.9em; padding-top:60px; padding-bottom:38px} #DesignBox .desc-list .ct p{ font-size:1.5em; line-height:180%; color:#fff} #DesignBox .desc-list .ct.act{ left:50%} #SleepBox{} #SleepBox ul, #SleepBox li{ width:100%; height:100%} #SleepBox li{ background-size:cover} #SleepBox .wd{ position:absolute; z-index:999; color:#fff} #SleepBox .wd p{ color:#fff} #SleepBox .change-box div{ background-position:50% bottom} #VideoBox{} #VideoBox table{ width:100%} #VideoBox td{ text-align:center; width:33.3%} #SceneBox{} #SceneBox .phone{ height:100%; position:absolute; top:0; z-index:10} #SceneBox .fp-controlArrow{ display:none} #SceneBox .fp-slidesNav ul li a span{ width:16px; height:16px; background:#fff; margin:4px; border:none} #SceneBox .fp-slidesNav ul li a:hover span{ border:2px solid #E75B16; margin:2px} #SceneBox .fp-slidesNav ul li a.active span{ border:4px solid #E75B16; margin:0; background:#E75B16} #SceneBox .fp-slidesNav ul li{ padding:0 5px} #SceneBox .bottom{ bottom:45px!important} #SceneColorBox{ background:url(../img/b.gif)/*tpa=http://www.divoom.com/image/b.gif*/ 50% 50% no-repeat; background-size:cover} #SceneColorBox .desc{ font-family:'MyriadPro-Light','Myriad Pro'; color:#fff; position:absolute;; top:0; z-index:2; padding-left:110px} #SceneColorBox .desc h3{ font-size:7.8em; padding-bottom:0.3em} #SceneColorBox .desc p{ font-size:2.6em; line-height:150%; color:#fff} #SceneColorBox .bg-color-list{} #SceneColorBox .bg-color-list div{ width:100%; height:100%} #SceneColorBox .bg-color-list .bg-1{ background:rgba(255,64,234,0.2)} #SceneColorBox .bg-color-list .bg-2{ background:rgba(196,47,91,0.2)} #AurJoinBox{ background:#1A1A1A} #AurJoinBox .stage{ height:100%; position:relative} #AurJoinBox .stage *{ transition:all 1s ease} #AurJoinBox .aur-top{ position:absolute; width:687px; height:697px; background:url(../img/aur-top.png); top:20px; left:50%} #AurJoinBox .aur-bottom{ position:absolute; width:547px; height:565px; background:url(../img/aur-bottom.png); top:323px; left:65px} #AurJoinBox .aur-yellow, #AurJoinBox .aur-blue{ position:absolute; width:100%; height:965px; background:url(../img/aru-blue.png) 50% 0 no-repeat; top:-130px; left:0%; opacity:0; transition:all 0 ease} #AurJoinBox .aur-yellow{background-image:url(../img/aru-yellow.png)} #AurJoinBox .wwp{ position:absolute; width:100%} #AurJoinBox .txt1{ color:#fff; font-family:'MyriadPro-Light','Myriad Pro'; position:absolute; text-align:center; z-index:99999; width:50%; opacity:1; transition-property:all 1s linear 1s; -moz-transition:all 1s linear 1s; -webkit-transition:all 1s linear 1s; -o-transition:all 1s linear 1s;} #AurJoinBox .txt2{ color:#fff; z-index:99999; position:absolute; line-height:150%; opacity:0; transition-property:all 1s linear 3s; -moz-transition:all 1s linear 3s; -webkit-transition:all 1s linear 3s; -o-transition:all 1s linear 3s; } #AurJoinBox .stage.act .aur-top{ margin-left:-343.5px} #AurJoinBox .stage.act .aur-bottom{ margin-left:-276.5px; left:50%} #AurJoinBox .stage.act .txt1{ opacity:0} #AurJoinBox .stage.act .txt2{ opacity:1} /*#AurJoinBox .stage:hover .aur-blue{ opacity:1}*/ #AurPhone .wd{ text-align:center; margin-left:-12%; z-index:9999999999999999999} #smarthome-aurabulb #Page3-1{ color:#333} #smarthome-aurabulb #Page3-1 .border{ border-color:#333} /* -------------------------------------------------------------------------------------------------------------------------------------------------------*/ #smarthome-aurabox{} #smarthome-aurabox .cts{ text-align:center; color:#fff} #smarthome-aurabox .cts h2{ font-family:'MyriadPro-Light','Myriad Pro'; color:#fff} #smarthome-aurabox .cts p{ color:#fff} #smarthome-aurabox #Page1{ background:url(../img/s1-bg.jpg) 50% bottom no-repeat!important; background-size:cover} #smarthome-aurabox #Page2{ background:#010101 /*url(../img/aurabox/s2-bg.jpg?) 50% top no-repeat!important*/; color:#fff} #smarthome-aurabox #Page2 .wd{ width:55%} #smarthome-aurabox #Page2 .change-box{ position:absolute} #smarthome-aurabox #Page2 .change-box div{ width:100%} #smarthome-aurabox #Page2 .change-box div img{ width:100%} #smarthome-aurabox #Page3-1{ background:#000; color:#fff} #smarthome-aurabox #Page3{background: -webkit-linear-gradient(#030505, #2D2D2D);} #smarthome-aurabox #Page3 .wd{ position:absolute; width:50%; left:50%} #smarthome-aurabox #Page3 .im{ position:absolute; background:url(../img/s3-p.png); background-size:cover} #smarthome-aurabox #Page3 .im .click{ position:relative; width:100%} #smarthome-aurabox #Page3 .im .click a{ display:inline-block; background:#2A5164; border:2px solid #2A2E30; color:#000; text-align:center; border-radius:100%} #smarthome-aurabox #Page3 .im .click a.act{ background:#206586} #smarthome-aurabox #Page3 .imtxt{ position:absolute; color:#fff} #smarthome-aurabox #Page3 .imtxt i{ display:inline-block; background:#2A5164; border:2px solid #2A2E30; color:#000; border-radius:100%; text-align:center; margin-right:0.5em} #smarthome-aurabox #Page3 .imtxt .act i{ background:#206586} #smarthome-aurabox #Page3 .imtxt .act span{ color:#2186B8; font-weight:bold} #smarthome-aurabox #Page4{background: -webkit-linear-gradient(#0F0F0F, #262626, #181818);} #smarthome-aurabox #Page4 .des-box{ color:#fff; text-align:center} #smarthome-aurabox #Page4 .des-box p{ color:#fff} #smarthome-aurabox #Page4 .des-box h2{ font-family:'MyriadPro-Light','Myriad Pro'; font-weight:normal} #smarthome-aurabox #Page4 .des-box .item{ opacity:0} #smarthome-aurabox #Page4 .des-box .pic{ position:absolute; right:-50%; width:50%} #smarthome-aurabox #Page4 .des-box .txt{ position:absolute; left:-50%; width:50%; transition:left 0.5s ease} #smarthome-aurabox #Page4 .des-box .act{ opacity:1} #smarthome-aurabox #Page4 .des-box .act .pic{ right:0} #smarthome-aurabox #Page4 .des-box .act .txt{ left:0} #smarthome-aurabox #Page4 .ctrl{ text-align:center; position:absolute; width:50%} .ClickBtnBox{} .ClickBtnBox .www{ position:absolute; text-align:center; width:100%} .ClickBtnBox .www a{ background:rgba(255,120,0,0.5); z-index:999; display:inline-block; position:relative; height:50px; border-radius:10px; text-align:center; color:#fff; overflow:hidden} .ClickBtnBox .www a span{ position: absolute; right: 40px; color: #fff; -webkit-animation: coolors 1s infinite; animation: coolors 1s infinite;} #smarthome-aurabox #Page4 .phone{ position:absolute; background:url(../img/s4--l-1.png); background-size:cover; text-align:center} #smarthome-aurabox #Page4 .phone a{ background:rgba(255,120,0,0.5); display:block; float:right; height:50px; border-radius:10px; transform: rotateX(40deg) rotateY(-13deg) rotateZ(17.5deg); text-align:center; color:#fff; overflow:hidden} #smarthome-aurabox #Page4 .phone a span{ position: absolute; right: 30px; color: #fff; -webkit-animation: coolors 1s infinite; animation: coolors 1s infinite;} @-webkit-keyframes coolors { 50% { right: 40px; } } @keyframes coolors { 50% { right: 40px; } } #smarthome-aurabox #Page5{ background:#000} #smarthome-aurabox #Page5 .pic{} #smarthome-aurabox #Page5 .pic div{ text-align:center; float:left; width:25%} #smarthome-aurabox #Page5 .absb{ position:absolute; width:100%} #smarthome-aurabox #Page6 .fp-slidesNav ul li a span{ background:#fff; border-color:#535353} #smarthome-aurabox #Page6 .fp-slidesNav ul li a.active span{ padding:2px; margin-left:-2px; margin-top:-2px} #smarthome-aurabox #Page6 .bottom{ bottom:45px!important} #smarthome-aurabox #Page6 .fp-controlArrow{ display:none} #smarthome-aurabox #Page7 .absb{ position:absolute; width:100%} #smarthome-aurabox #Page7 .absb .txt{ width:50%; color:#fff; text-align:center; position:absolute} #smarthome-aurabox #Page7 .absb .txt h2{ font-family:'MyriadPro-Light','Myriad Pro'; font-weight:normal} #smarthome-aurabox #Page7 .absb .txt div{ } #smarthome-aurabox #Page7{ background:#000} #smarthome-aurabox #Page7 .col-1{ width:29%; padding-top:12%; float:left; text-align:right; position:relative} #smarthome-aurabox #Page7 .col-1 a{ background:rgba(255,255,255, 0.38); text-align:center; display:block; position:absolute; border-radius:5px} #smarthome-aurabox #Page7 .col-2{ width:21%; float:left; text-align:center; color:#fff; font-family:'MyriadPro-Light','Myriad Pro'} #smarthome-aurabox #Page7 .col-3{ width:50%; float:left} #smarthome-aurabox #Page7 .col-1 a span { position: absolute; right: 55%; color: #fff; -webkit-animation: coolors 2s infinite; animation: coolors 2s infinite;} @-webkit-keyframes coolors { 50% { right: 10%; } } @keyframes coolors { 50% { right: 10%; } } #smarthome-aurabox #Page8{ background:url(../img/s8-bg.jpg)/*tpa=http://www.divoom.com/image/smart-home/aurabox/s8-bg.jpg*/} #smarthome-aurabox #Page9{ background:url(../img/s9-bg.png)/*tpa=http://www.divoom.com/image/smart-home/aurabox/s9-bg.png*/ #000000} #smarthome-aurabox #Page9 .im{ position:absolute} #smarthome-aurabox #Page9 .cts{ width:50%; margin-left:50%} #smarthome-aurabox #Page11{background: -webkit-linear-gradient(#0F0F0F, #262626, #181818);} #smarthome-aurabox #Page11 .slide{ text-align:center} #smarthome-aurabox #Page11 .fp-slidesNav ul li a span{ display:none} #smarthome-aurabox #Page11 .fp-slidesNav ul li{ *display:inline; *zoom:1;} #smarthome-aurabox #Page11 .fp-slidesNav ul li a span{ background:#FFF; border:2px solid rgba(255, 255, 255, 0); transition:all 0.2s ease} #smarthome-aurabox #Page11 .fp-slidesNav ul li a:hover span, #smarthome-aurabox #Page11 .fp-slidesNav ul li a.active span{ background:none; border:2px solid rgba(255, 255, 255, 1)} #smarthome-aurabox #Page11 .fp-slidesNav.bottom{ bottom:38px} #smarthome-aurabox #Page11 .fp-controlArrow{ width:36px; height:51px; border:none; margin:0;background:#040404; filter:alpha(opacity=50); background:rgba(4, 4, 4, 0.5); border-radius:4px; background-position:50% 50%; background-repeat:no-repeat; transition:all 0.2s ease} #smarthome-aurabox #Page11 .fp-controlArrow:hover{ background-color:#D55514} #smarthome-aurabox #Page11 .fp-controlArrow.fp-prev{ background-image:url(../img/arr-fbl.png)/*tpa=http://www.divoom.com/image/arr-fbl.png*/; left:-36px} #smarthome-aurabox #Page11 .fp-controlArrow.fp-next{ background-image:url(../img/arr-fbr.png)/*tpa=http://www.divoom.com/image/arr-fbr.png*/; right:-36px} #smarthome-aurabox #Page11:hover .fp-prev{ left:68px} #smarthome-aurabox #Page11:hover .fp-next{ right:68px} #smarthome-aurabox #Page12{ background:#000; font-family:'MyriadPro-Light','Myriad Pro'} #smarthome-aurabox #Page12 .app-list{ position:absolute; color:#fff; text-align:center} #smarthome-aurabox #Page12 .app-list .app{ padding:2em 0} #smarthome-aurabox #Page12 .app-list .app li{ float:left; margin:0.2em 0.8em} #smarthome-aurabox #Page12 .app-list .app li.clr{ margin:0} #smarthome-aurabox #Page12 .app-list .dlb div{ width:50%; float:left; padding-top:1em} #smarthome-aurabox #Page12 .app-list .dlb img{ margin-bottom:0.5em} #smarthome-aurabox #Page13{ background:#000; font-family:'MyriadPro-Light','Myriad Pro'} #smarthome-aurabox #Page13 .desc{ position:absolute; color:#fff; text-align:center} #smarthome-aurabox #Page14{ background:#000; font-family:'MyriadPro-Light','Myriad Pro'; color:#fff} #smarthome-aurabox #Page14 p{ color:#fff} #smarthome-aurabox #Page14 .text{ position:relative; width:50%; height:100%; float:left} #smarthome-aurabox #Page14 .text .item{ right:100%; position:absolute; transition:all 0.5s ease} #smarthome-aurabox #Page14 .text .item.act{ right:0; display:block} #smarthome-aurabox #Page14 .text .item h3{ padding-bottom:0.2em} #smarthome-aurabox #Page14 .picture{ position:relative; width:50%; float:left} #smarthome-aurabox #Page14 .picture img{ transform-origin:0 0; position:absolute; left:100%; transform:rotate(-60deg); transition:all 0.5s ease} #smarthome-aurabox #Page14 .clk{ text-align:center; color:#fff; position:absolute; width:100%; line-height:2em} #smarthome-aurabox #Page14 .picture img.act.p1{ transform:rotate(-15deg); margin-left:5em; left:0} #smarthome-aurabox #Page14 .picture img.act.p2{ transform:rotate(-6deg); margin-left:3em; left:0} #smarthome-aurabox #Page14 .picture img.act.p3{ transform:rotate(10deg); left:0} #smarthome-aurabox #Page15 { background:#000; color:#fff} #smarthome-aurabox #Page15 p{ color:#fff; padding:1em} #smarthome-aurabox #Page15 h3{ font-family:'MyriadPro-Light','Myriad Pro'} #smarthome-aurabox #Page15 .desc{ text-align:center; position:absolute} /*--------------------------------------------outdoor--------------------------------------------------*/ #outdoor-speaker-list-banner{ height:422px; background:#F4F4F4 url(../img/list-banner.jpg) 50% 50% no-repeat; text-align:center} .st{ text-align:center} .wv .wd a{ display:inline-block; border:1px solid #fff; font-family:'MyriadPro-Light','Myriad Pro'; color:#fff; padding:0 0.4em} .wv .wd strong{ font-family:'MyriadPro-Light','Myriad Pro'; font-weight:normal} .wv .wd{ text-align:center} #Page1{background-position:50% 50%; background-repeat:no-repeat; background-size:cover;} #outdoor-speaker-ongo #Page1{ background-position:50% 50%; background-repeat:no-repeat; background-size:cover; font-family:'MyriadPro-Light','Myriad Pro'} #outdoor-speaker-ongo #Page1 .wd{ color:#fff; text-align:right; position:absolute} #outdoor-speaker-ongo .st{ text-align:center} #outdoor-speaker-ongo #Page6 h2{ font-weight:normal; font-family:'MyriadPro-Light','Myriad Pro'; font-weight:normal} #outdoor-speaker-ongo #Page8 .st{ text-align:left} #outdoor-speaker-outdoor #Page1{ background-position:50% 50%; background-repeat:no-repeat; color:#fff; background-size:cover; font-family:'MyriadPro-Light','Myriad Pro'} #outdoor-speaker-outdoor .st{ text-align:center} #outdoor-speaker-outdoor #Page2 .st{ text-align:right} #outdoor-speaker-party #Page1{ background:#F4F4F4} #outdoor-speaker-party #Page1 *{ color:#000} #outdoor-speaker-party #Page1 a{ border-color:#000; color:#000} #outdoor-speaker-travel #Page1{ background-position:50% 50%; background-repeat:no-repeat; background-size:cover; font-family:'MyriadPro-Light','Myriad Pro'; color:#fff} #outdoor-speaker-travel #Page1 h2{font-family:'MyriadPro-Light','Myriad Pro';} #outdoor-speaker-travel #Page5{ background:#BDBDBD; text-align:center} h2{text-align: center;font-weight: bold;} /*--------------------------------------------Timebox-mini--------------------------------------------------*/ #timebox_mini .px100{width: 100%;left: 0;top: 185px;position: absolute;} .ct{text-align: center;} .c38{color: #382f31;} #timebox_mini .posr{position: relative;} #timebox_mini .pos{position: absolute;color: #382f31;} #timebox_mini .text_l{text-align: right;} #timebox_mini .text_r{text-align: left;} #timebox_mini .text4{z-index: 9;} #timebox_mini .text4 img{padding-bottom: 24px;} #timebox_mini .text4 .box{padding-bottom: 2%;} #timebox_mini .page{position: relative;height: 996px;z-index: 9;} #timebox_mini #Page5 .box{float: left;width:49%;margin-bottom: 45px;} #timebox_mini .fhei{color: #000000;} #timebox_mini .z2{z-index: 9;} #timebox_mini #Page6 .box{float: left;width: 32.3333%;text-align: center;} #timebox_mini h2{font-weight: normal;} #timebox_mini #Page7{position: relative;height: 996px !important;} #timebox_mini #Page7 .cons{position: relative;z-index: 9;height: 996px;width: 100%;} #timebox_mini #Page7 .con{position: relative;height: 996px;width: 100%;} #timebox_mini #Page7 .con:after,#timebox_mini #Page7 .con:before{position: absolute;left: 0;width: 100%;content: '';z-index: 1;} #timebox_mini .fbai{color: #FFFFFF;} #timebox_mini .fhei{color: #000000;} #timebox_mini #Page7 .st{z-index: 9;} #timebox_mini #Page7 .icon li{display: inline-block;padding: 0 10px;cursor: pointer;} #timebox_mini #Page7 .icon li img{border-radius:50%;margin:0 6px;display: block;box-shadow:0 0 7px #818181;} #timebox_mini #Page7 .icon li.active img{border: 6px solid #ff8400;margin: 0;margin-bottom: -5px;} #timebox_mini #Page7 .icon li p{padding-top: 27px;color: #FFFFFF;} #timebox_mini #page8{background:#FFFFFF;} #timebox_mini #page9{background:#FFFFFF;} #timebox_mini #page9 img{left: 0;} #timebox_mini #page9 .st{width: 100%;} #timebox_mini #page9 .page{height: 950px!important;} #timebox_mini #Page10 .page{background-position:center center;background-size:cover;} #timebox_mini #Page10 .st{width:100%;} #timebox_mini #Page10 #shuzi{letter-spacing:15px;color:#fff;} #timebox_mini #Page10 .shuzi{padding-left: 20px;} #timebox_mini #Page11 .page{height: 960px !important;background-position:center center;background-size:cover;} #timebox_mini #Page11 .st{width:100%;} #timebox_mini #Page11 li{display: inline-block;margin:0 1.1%;cursor: pointer;} #timebox_mini #Page11 li .hide{display: none;} #timebox_mini #Page11 li.active .show,#timebox_mini #Page11 li:hover .show{display: none;} #timebox_mini #Page11 li.active .hide,#timebox_mini #Page11 li:hover .hide{display: block;} #timebox_mini #Page12 .page{height: 1040px !important;} #timebox_mini #Page12 .st{width: 100%;} #timebox_mini #Page13{height: 1050px;position: relative;} #timebox_mini #Page13 .page{height: 1050px !important;} #timebox_mini #Page13:after,#timebox_mini #Page13:before{position: absolute;width: 100%;content: '';left: 0;} #timebox_mini #Page13:after{height: 31%;background:#f2f2f2;top: 0;} #timebox_mini #Page13:before{height: 69%;background:#152331;bottom: 0;} #timebox_mini #Page13 .st{width: 100%;} #timebox_mini #Page14 .page{height: 970px !important;} #timebox_mini #Page14 .abs img{z-index: 11;} #timebox_mini .abs2 img{z-index: 11;} #timebox_mini #Page14 .st{text-align: left;} #timebox_mini #Page14 .st h2{text-align: left;} #timebox_mini #Page15 .page{height: 1080px !important;background-size:cover ;background-position:center center;background-repeat:no-repeat ;} #timebox_mini #Page15 .st {width: 100%;} #timebox_mini #Page15 .pos_img{position: absolute;width: 100%;left: 0;} #timebox_mini #Page15 ol .hide{display: none;} #timebox_mini #Page15 ol li{position: absolute;bottom: 300px;text-align: center;} #timebox_mini #Page15 ol li img{max-width: 100%;} #timebox_mini #Page15 ol li.active .hide{display: inline-block !important;} #timebox_mini #Page15 ol li.active .show{display: none !important;} #timebox_mini #Page15 ul{position: absolute;top: 723px;text-align: center;} #timebox_mini #Page15 ul .hide{position: absolute;top: 0;left: 0;display: block;} #timebox_mini #Page15 ul .show{opacity: 0.4;} #timebox_mini #Page15 ul .pos{padding:10px;position: relative;cursor: pointer;} #timebox_mini #Page15 ul li{display: inline-block;padding:0 9%;} #timebox_mini #Page15 ul li.active .hide,#timebox_mini #Page15 ul .pos:hover .hide{display: none;} #timebox_mini #Page15 ul li.active .show,#timebox_mini #Page15 ul .pos:hover .show{opacity:1;} #timebox_mini p,#timebox_minih2{-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;} #timebox_mini #Page15 img{max-width:100%;} #timebox_mini #Page16,#timebox_mini #Page17,#timebox_mini #Page18,#timebox_mini #Page19,#timebox_mini #Page20{background:#f2f2f2} #timebox_mini #Page16 p{text-align: center;} #timebox_mini .line{display: inline-block;width: 40%;height:6px;background:#871917;} #timebox_mini #Page20:after{position: absolute;bottom: 0;height: 160px;content: '';background: #2f3342;width: 100%;left: 0;} #timebox_mini #Page20 li{text-align: center;position: absolute;} #timebox_mini #Page20 li img{max-width: 100%;} #timebox_mini #Page21 li{float: left;padding-bottom: 5%;width: 16.666666%;} #timebox_mini #Page22{height: 1040px !important;} #timebox_mini .btext{position: absolute;width: 90%;} #timebox_mini .btext .col {width: 33%;float: left; line-height:200%;} #timebox_mini .btext .border { border-left:1px solid #333333; position: absolute; height: 100%;} #timebox_mini #page23 .ct{text-align: center;} #timebox_mini #page23 h3{padding-bottom: 17px;font-weight: normal;} #timebox_mini #page23 table{width: 100%;} #timebox_mini #page23 table td,#timebox_mini #page23 table th{padding: 5px 10px;line-height: 20px;} #timebox_mini .buyer{display: block;} #timebox_mini .posr{position:relative} @media (max-width: 768px) { #timebox_mini #Page7 .con{height: 450px;} #timebox_mini #Page7 .icon li p{padding-top: 5px;} #timebox_mini #Page7 .icon li{padding: 0 0.1rem;} #timebox_mini .posr{background-size:contain !important;} #timebox_mini #Page7 .icon li.active img{border:1px solid #ff8400;} #timebox_mini #page9 .page{height: 497px !important;} #timebox_mini #Page7{height: 497px !important;} #timebox_mini #Page10 .page,#timebox_mini #Page10 .fp-tableCell,#timebox_mini #Page10{height: 400px !important;} #timebox_mini #Page11 .page,#timebox_mini #Page11,#timebox_mini #Page11 .fp-tableCell{height: 300px !important;} #timebox_mini #Page12 .st{bottom:13% !important;} #timebox_mini #Page12 .page,#timebox_mini #Page12 .fp-tableCell,#timebox_mini #Page12{height: 250px !important;} #timebox_mini #Page12 .page{background-size:cover !important;} #timebox_mini #Page13::before{height: 100%;} #timebox_mini #Page13::after{height: 0;} #timebox_mini #Page15,#timebox_mini #Page21{display: none !important;} #timebox_mini #Page13 .page{height: 450px !important;} #timebox_mini #Page22{height: 440px !important;} #timebox_mini .btext .col{line-height: 100%;} #timebox_mini #page23 table td, #timebox_mini #page23 table th{line-height: 10px;} #timebox_mini #Page11 img{bottom: 10% !important;} #timebox_mini #Page11 .st{top: 20% !important;} #timebox_mini #Page14 .page,#timebox_mini #Page14 .fp-tableCell,#timebox_mini #Page14{height: 300px !important;} #timebox_mini #Page14 .abs img{top: 40% !important;} #timebox_mini .abs.abs2 img{top: 23% !important;} #timebox_mini #Page14 .st{top: 10% !important;} #timebox_mini #page23 .btext{top: 20% !important;} #timebox_mini #Page7 .icon li img{margin: 0;} #timebox_mini .btext{width: 100%;} #timebox_mini #Page7 .icon li.active img{margin-bottom: -1px;} #timebox_mini #Page22 .page,#timebox_mini #Page22 .fp-tableCell,#timebox_mini #Page22{height: 250px !important;} #timebox_mini #Page22 .st {top:45% !important;} #timebox_mini #Page20:after{height: 80px;} #timebox_mini #Page20 .z2{bottom: 18% !important;} #timebox_mini #Page20 .page,#timebox_mini #Page20 .fp-tableCell,#timebox_mini #Page20{height: 270px !important;} #timebox_mini #Page20 li{top: 0 !important;} #timebox_mini #Page22 .abs img{top: auto !important; bottom:0 !important;} #page23{background-size:contain !important;background-repeat:no-repeat !important;background-position:center bottom !important;background-color:#dcdbd6;} #timebox_mini #Page23 .page,#timebox_mini #Page23 .fp-tableCell,#timebox_mini #Page23{height: 340px !important;} #minid,#minid .fp-tableCell,#minid .page{height: 400px !important;} #timebox_mini #minid .px100{top: 250px;} #timebox_mini .fbai,#timebox_mini .fhei{line-height:13px !important;} #timebox_mini #page8,#timebox_mini #page8 .fp-tableCell,#timebox_mini #page8 .page{height: 400px !important;} #timebox_mini #page8 img{ top: 205px !important;} #timebox_mini #page8 .st { top: 135px !important;} } .vb-trek div{ display: inline-block; width: 49.5%; vertical-align: top; } .vb-trek div p{ color: #fff; line-height: 30px; width: 50%; display: inline-block; vertical-align: top; margin-bottom: 0; }