/* CSS Container */ /* PAGENAME: CSS Container - discoverVF (vodafone.discovervf.css) PAGEID: 253434 PUBLISHING DATE: 2017-07-25 14:16:48 */ /* URL-Prefix: [] */ /* -[SNIPPETS >>>]---------------------------------------------------------------------------- */ /* ------------------------------------------------------------------------------------------- */ /* CONTENT CLASS: CSS Snippet - discoverVF */ /* PAGEID: 253438 */ /* PUBLISHING DATE: 2017-07-25 14:16:48 */ /* ------------------------------------------------------------------------------------------- */ body.isWide { background-image:none !important; } .dvfIntro { position:relative;width:100%;margin-top:-36px;background:url(/images/v5/css/HS_Start_2560x1230_heller.jpg) #d0d0d0 no-repeat center top fixed; } .dvfIntroConsumer { background:url(/images/v5/css/HS_DiscoverVf_Consumer_2560x1230.jpg) no-repeat center top fixed; } .dvfIntro .head { position:absolute;width:956px;height:150px;top:50%;left:50%;margin:-75px 0 0 -478px; } .dvfIntro .head p, .dvfIntro .head h1, .dvfIntro .head h2, .dvfIntro .head h3, .dvfIntro .head h4, .dvfIntro .head h5, .dvfIntro .head h6 { font-family:'VodafoneLtRegular',Arial,Helvetica,sans-serif;font-size:75px;line-height:75px;font-weight:normal;color:white;text-shadow: 1px 1px #333333; } .dvfIntro.dvfIntroConsumer .head { margin:-180px 0 0 -478px; } .dvfIntro.dvfIntroConsumer .head p, .dvfIntro.dvfIntroConsumer .head h1, .dvfIntro.dvfIntroConsumer .head h2, .dvfIntro.dvfIntroConsumer .head h3, .dvfIntro.dvfIntroConsumer .head h4, .dvfIntro.dvfIntroConsumer .head h5, .dvfIntro.dvfIntroConsumer .head h6 { color:#000000;text-shadow:none; } .dvfIntro .down { position:absolute;width:81px;height:45px;bottom:20px;left:50%;margin-left:-40px;background:url(/images/v5/down.png); } div.divContent5Col { overflow:visible;margin:0 0 0 3px;padding:70px 0 10px; } span.clear { position:relative;display:block;clear:both; } .pageNav { position:fixed;left:50%;width:477px;z-index:1; } .pageNav .back { position:absolute;top:0px;left:-560px;width:35px;height:59px;background:url(/images/v5/css/arrows_grey-back.png) no-repeat;background-size:35px 59px; } .pageNav .for { position:absolute;top:0px;left:525px;width:35px;height:59px;background:url(/images/v5/css/arrows_grey-for.png) no-repeat;background-size:35px 59px; } .pageNav .back:hover { background:url(/images/v5/css/arrows-red-back.png) no-repeat;background-size:35px 59px; } .pageNav .for:hover { background:url(/images/v5/css/arrows-red-for.png) no-repeat;background-size:35px 59px; } .dvfContainer { position:relative; } .mod { position:relative;margin:0 0 80px; } #discover .mod { position:relative;margin:-12px 0 0; } .modWrapper { position:relative; } .box { position:relative;margin:-6px;padding:22px 0 0 30px;border-width:12px;border-style:solid;border-color:#a0a0a0;cursor:pointer;color:#a0a0a0;background:rgba(255,255,255,0.8); -moz-transition-property: color, border-color; -moz-transition-duration: 1s, 1s; -webkit-transition-property: color, border-color; -webkit-transition-duration: 1s, 1s; -o-transition-property: color, border-color; -o-transition-duration: 1s, 1s; transition-property: color, border-color; transition-duration: 1s, 1s; } .mod .box .imgBox { position:absolute;top:0px;left:0px;overflow:hidden;background:none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .mod .box .imgBox img.light { position:relative;left:-36px; -moz-transition-property: left; -moz-transition-duration: 0.5s; -moz-transition-timing-function: linear; -moz-transition-delay: 0.2s; -webkit-transition-property: left; -webkit-transition-duration: 0.5s; -webkit-transition-timing-function: linear; -webkit-transition-delay: 0.2s; -o-transition-property: left; -o-transition-duration: 0.5s; -moz-transition-timing-function: linear; -o-transition-delay: 0.2s; transition-property: left; transition-duration: 0.5s; transition-timing-function: linear; transition-delay: 0.2s; } .mod .box .imgBox img.dark { position:absolute;top:0;left:-36px;opacity:0; -moz-transition-property: left, opacity; -moz-transition-duration: 0.5s, 1s; -moz-transition-timing-function: linear, ease; -moz-transition-delay: 0.2s, 0s; -webkit-transition-property: left, opacity; -webkit-transition-duration: 0.5s, 1s; -webkit-transition-timing-function: linear, ease; -webkit-transition-delay: 0.2s, 0s; -o-transition-property: left, opacity; -o-transition-duration: 0.5s, 1s; -moz-transition-timing-function: linear, ease; -o-transition-delay: 0.2s, 0s; transition-property: left, opacity; transition-duration: 0.5s, 1s; transition-timing-function: linear, ease; transition-delay: 0.2s, 0s; } .mod .box .head, .mod .box .head p { position:relative;font-family:'VodafoneRgBold',Arial,Helvetica,sans-serif;font-size:45px;line-height:45px;font-weight:normal;margin-bottom:20px; } .mod .box .txtBox, .mod .box .txtBox p { position:relative;font-family:'VodafoneRgRegular',Arial,Helvetica,sans-serif;font-size:22px;line-height:23px;font-weight:normal;opacity:0;padding-top:20px; -moz-transition-property: opacity, padding-top; -moz-transition-duration: 1s, 0.5s; -webkit-transition-property: opacity, padding-top; -webkit-transition-duration: 1s, 0.5s; -o-transition-property: opacity, padding-top; -o-transition-duration: 1s, 0.5s; transition-property: opacity, padding-top; transition-duration: 1s, 0.5s; } .mod .boxSup { padding:26px 0 0 30px; } .mod .boxSup .head, .mod .boxSup .head p { font-family:'VodafoneRgBold',Arial,Helvetica,sans-serif;font-size:25px;line-height:25px;font-weight:normal; } .mod.active .box { border-color:#e60000;z-index:1;color:#e60000; } .mod.active .box .imgBox img.light { left:0; } .mod.active .box .imgBox img.dark { left:0;opacity:1; } .mod.active .box .txtBox, .mod.active .box .txtBox p { opacity:1;padding-top:0; } .mod.soft .box { border-color:#e6e6e6;color:#e6e6e6; } .boxW3 { width:150px;height:86px; } .boxW3_2 { width:150px;height:118px; } .boxW3_3 { width:150px;height:52px; } .boxW4 { width:214px;height:86px; } .boxW4_2 { width:214px;height:52px; } .boxW4_3 { width:196px;height:86px; } .boxW5 { width:260px;height:118px; } .boxW5_2 { width:260px;height:52px; } .boxW5_3 { width:278px;height:52px; } .boxW6 { width:342px;height:128px; } .boxW6_2 { width:342px;height:52px; } .boxW7 { width:406px;height:52px; } .boxW8 { width:452px;height:298px; } .boxW8 .imgBox { width:482px;height:320px; } .boxW8_2 { width:452px;height:416px; } .boxW8_2 .imgBox { width:482px;height:438px; } .boxW9 { width:516px;height:278px; } .boxW9 .imgBox { width:546px;height:300px; } .boxW10 { width:580px;height:277px; } .boxW10 .imgBox { width:610px;height:299px; } .mod1 .boxW3 { position:absolute;top:6px;left:198px; } .mod1 .boxW4 { position:absolute;top:130px;left:134px; } .mod1 .boxW9 { margin-left:384px; } .mod2 .boxW3_2 { position:absolute;top:130px;left:564px; } .mod2 .boxW9 { margin-left:0;height:298px; } .mod2 .boxW9 .imgBox { height:320px; } .mod3 .boxW9 { margin-left:384px;height:430px; } .mod3 .boxW9 .imgBox { height:452px; } .mod4 .boxW3_2 { position:absolute;top:80px;left:564px; } .mod4 .boxW3 { position:absolute;top:80px;left:756px; } .mod4 .boxW4 { position:absolute;top:170px;left:692px; } .mod4 .boxW4_2 { position:absolute;top:80px;left:564px; } .mod4 .boxW9 { margin-left:0;height:360px; } .mod4 .boxW9 .imgBox { height:382px; } .mod5 .boxW3 { position:absolute;top:338px;left:262px;height:230px; } .mod5 .boxW5 { position:absolute;top:338px;left:454px; } .mod5 .boxW6 { position:absolute;top:172px;left:70px; } .mod5 .boxW8 { margin-left:448px;margin-bottom:268px; } .mod6 .boxW6_2 { position:absolute;top:95px;left:70px; } .mod6 .boxW4_2 { position:absolute;top:185px;left:198px; } .mod6 .boxW5_3 { position:absolute;top:275px;left:134px; } .mod6 .boxW7 { position:absolute;top:366px;left:6px; } .mod6 .boxW8_2 { margin-left:448px; } .mod7 .boxW5_3 { position:absolute;top:172px;left:564px;height:128px; } .mod7 .boxW3 { position:absolute;top:338px;left:372px;height:230px; } .mod7 .boxW4 { position:absolute;top:338px;left:564px; } .mod7 .boxW4_3 { position:absolute;top:338px;left:326px; } .mod7 .boxW8 { margin-left:64px;margin-bottom:124px; } .modc1 .boxW3 { position:absolute;top:6px;left:134px; } .modc1 .boxW10 { margin-left:320px; } .modc2 .boxW4 { position:absolute;top:80px;left:628px; } .modc2 .boxW10 { margin-left:0;height:296px; } .modc2 .boxW10 .imgBox { height:318px; } .modc3 .boxW5_2 { position:absolute;top:80px;left:152px; } .modc3 .boxW4_2 { position:absolute;top:170px;left:198px; } .modc3 .boxW3_3 { position:absolute;top:260px;left:262px; } .modc3 .boxW8 { margin-left:448px;height:470px; } .modc3 .boxW8 .imgBox { height:492px; } .modc4 .boxW3_2 { position:absolute;top:80px;left:564px; } .modc4 .boxW3 { position:absolute;top:80px;left:756px; } .modc4 .boxW4 { position:absolute;top:170px;left:692px; } .modc4 .boxW4_2 { position:absolute;top:80px;left:564px; } .modc4 .boxW9 { margin-left:0;height:340px; } .modc4 .boxW9 .imgBox { height:362px; } .modc5 .boxW9 { margin-left:384px;height:338px; } .modc5 .boxW9 .imgBox { height:360px; } .mod .svgrect { stroke-width:12; } .safari .mod .svgrect { stroke-width:8 !important; } .wideHeroContentBox .headline, .wideHeroContentBox .headline p, .wideHeroContentBox .headline h1, .wideHeroContentBox .headline h2, .wideHeroContentBox .headline h3, .wideHeroContentBox .headline h4, .wideHeroContentBox .headline h5, .wideHeroContentBox .headline h6 { color: #333333; font-family: "VodafoneLtRegular",Arial,Helvetica,sans-serif; font-size: 75px; font-weight: normal; line-height: 74px; } .wideHeroContentBox.white .headline, .wideHeroContentBox.white .headline p, .wideHeroContentBox.white .headline h1, .wideHeroContentBox.white .headline h2, .wideHeroContentBox.white .headline h3, .wideHeroContentBox.white .headline h4, .wideHeroContentBox.white .headline h5, .wideHeroContentBox.white .headline h6 { color:#ffffff; } .mod .headTop { display:none; } .mod .head, .mod .head p, .mod .head h1, .mod .head h2, .mod .head h3, .mod .head h4, .mod .head h5, .mod .head h6 { position:relative;font-family:'VodafoneRgRegular',Arial,Helvetica,sans-serif;font-size:30px;line-height:35px;font-weight:normal;margin-bottom:20px; } .mod .txt, .mod .txt p, .mod .txt span, .mod .txt li { position:relative;font-family:'VodafoneRgRegular',Arial,Helvetica,sans-serif;font-size:14px;line-height:22px;font-weight:normal; } .mod .txt strong { position:relative;font-family:'VodafoneRgBold',Arial,Helvetica,sans-serif;font-size:14px;line-height:22px;font-weight:normal; } .mod .txt ul.ulContent { margin: 11px 0 11px 13px; } .mod .buttonBox { position:relative;padding-top:20px; } .mod .dvfButton { position:relative;display:inline-block;text-decoration:none; } .mod .dvfButton .txt { position:relative;display:block;height:34px;border:1px solid #9c2aa0;padding:0 17px;margin-bottom:0;border-radius:5px;text-decoration:none;background:#ffffff; font-family:'VodafoneRgRegular',Arial,Helvetica,sans-serif;font-size:16px;line-height:34px;font-weight:normal;color:#9c2aa0; } .mod .dvfButton .pulse { position:absolute;top:0px;left:0px;border:1px solid #9c2aa0;height:36px;width:100%;border-radius:8px;box-sizing:border-box; -moz-transition-property: top, left, width, height, opacity; -moz-transition-duration: 0.1s, 0.1s, 0.1s, 0.1s, 0.1s; -moz-transition-timing-function: linear, linear, linear, linear, linear; -webkit-transition-property: top, left, width, height, opacity; -webkit-transition-duration: 0.1s, 0.1s, 0.1s, 0.1s, 0.1s; -webkit-transition-timing-function: linear, linear, linear, linear, linear; -o-transition-property: top, left, width, height, opacity; -o-transition-duration: 0.1s, 0.1s, 0.1s, 0.1s, 0.1s; -o-transition-timing-function: linear, linear, linear, linear, linear; transition-property: top, left, width, height, opacity; transition-duration: 0.1s, 0.1s, 0.1s, 0.1s, 0.1s; transition-timing-function: linear, linear, linear, linear, linear; } .mod .dvfButton:hover .txt { background-color:#9c2aa0;color:white; } .mod .dvfButton:active .pulse { top:-5px;left:-5%;width:110%;height:46px; } .mod .dvfLink { position:relative;display:inline-block;text-decoration:none; } .mod .dvfLink .txt { position:relative;display:block;top:0px;font-family:'VodafoneRgBold',Arial,Helvetica,sans-serif;font-size:14px;line-height:22px;font-weight:normal;color:#9c2aa0;text-decoration:none; background:url(/images/v5/css/dvf_link_arrow.png) no-repeat 0 4px;background-size:7px 12px;padding-left:15px; transition-property: top; transition-duration: 0.3s; transition-timing-function: linear; } .mod .dvfLink .pulse { position:absolute;display:block;top:20px;left:0px;width:100%;height:2px;background-color:#9c2aa0;opacity:0;box-sizing:border-box; transition-property: top, opacity; transition-duration: 0.3s, 0.3s; transition-timing-function: linear, linear; } .mod .dvfLink:hover .txt { top:-5px;font-family:'VodafoneRgRegular',Arial,Helvetica,sans-serif;letter-spacing:0.55px; } .mod .dvfLink:hover .pulse { top:18px;opacity:1; } .mod .imgWrapper { position:relative; } .mod .imgBox { position:relative;background:rgba(128,128,128,0.5); -webkit-box-shadow: 0px 6px 6px rgba(51,51,51,0.2); -moz-box-shadow: 0px 6px 6px rgba(51,51,51,0.2); box-shadow: 0px 6px 6px rgba(51,51,51,0.2); } .mod.noShade .imgBox { -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; } .mod .imgBox.onlyResponsive { display:none; } .mod .txtContainer { position:absolute;top:0px; } .mod.modRight .txtContainer { left:0px; } .mod .txtBox { position:relative;display:table; } .mod .txtBoxWrapper { position:relative;vertical-align:middle;display:table-cell; } /* modXS */ .modXS { float:left;margin-right:6px; } .modXS .imgBox { width:314px;height:314px;margin-bottom:60px; } .modXS .imgBox img { width:314px;height:314px; } .modXS .imgBox.noImg { height:0;margin-bottom:0; } .modXS .txtContainer { position:relative;left:0;width:250px; } .modXS .txtBox { width:250px; } .modXS .redLayer { position:absolute;bottom:0px;left:0px;width:314px;background:rgba(230,0,0,0.75); } /* modXSx3 */ .modXSx3 { float:left;margin-right:6px; } .modXSx3 .imgBox { width:314px;height:314px;margin-bottom:0; } .modXSx3 .imgBox img { width:314px;height:314px; } .modXSx3 .txtContainer { position:absolute;top:auto;bottom:0;left:0;width:314px; } .modXSx3 .txtBox { width:314px; } .modXSx3 .head, .modXSx3 .head p, .modXSx3 .head h1, .modXSx3 .head h2, .modXSx3 .head h3, .modXSx3 .head h4, .modXSx3 .head h5, .modXSx3 .head h6 { margin-bottom:12px; } .modXSx3 .head { padding:0 20px;color:#ffffff; } .modXSx3 .head:before { position:absolute;bottom:-12px;left:0px;content:" ";width:314px;height:314px; background:url(/images/v5/css/Verlauf_450x450.png);background-size:314px 314px; } .modXSx3 .txt { background-color:#e60000;color:#ffffff;height:0px;overflow:hidden; -moz-transition-property: height; -moz-transition-duration: 0.35s; -moz-transition-timing-function: ease; -webkit-transition-property: height; -webkit-transition-duration: 0.35s; -webkit-transition-timing-function: ease; -o-transition-property: height; -o-transition-duration: 0.35s; -o-transition-timing-function: ease; transition-property: height; transition-duration: 0.35s; transition-timing-function: ease; } .modXSx3:hover .txt { height:68px; } .modXSx3 .txt p { padding:11px 20px 0;opacity:0; -moz-transition-property: opacity; -moz-transition-duration: 0.35s; -moz-transition-timing-function: ease; -webkit-transition-property: opacity; -webkit-transition-duration: 0.35s; -webkit-transition-timing-function: ease; -o-transition-property: opacity; -o-transition-duration: 0.35s; -o-transition-timing-function: ease; transition-property: opacity; transition-duration: 0.35s; transition-timing-function: ease; } .modXSx3:hover .txt p { opacity:1; } .modXSx3 .buttonBox { display:none; } .modXSx3 .imgLink { position:absolute;top:0;left:0;width:100%;height:100%;font-size:0;opacity:0;text-indent:200%;white-space:nowrap;z-index:100; } .modXSx3.duo .imgBox { width:474px; } .modXSx3.duo .imgBox img { width:474px; } .modXSx3.duo .txtContainer { width:474px; } .modXSx3.duo .txtBox { width:474px; } .modXSx3.duo .head:before { position:absolute;bottom:-12px;left:0px;content:" ";width:474px;height:314px; background:url(/images/v5/css/Verlauf_450x450.png);background-size:474px 314px; } .modXSx3.invers .imgBox { width:312px;height:312px;background-color:#ffffff;border:1px solid #f3f3f3; } .modXSx3.invers .head { color:#333333; } .modXSx3.invers .head:before { background:url(/images/v5/css/Verlauf_450x450_weiss.png);background-size:314px 314px; } /* modS */ .modS { clear:both; } .modS .imgBox { width:378px;height:400px; } .modS .imgBox img { width:378px;height:400px; } .modS.modRight .imgBox { left:576px; } .modS .txtContainer { left:448px;width:506px;height:400px; } .modS .txtBox { width:506px;height:400px; } /* modM - Video */ .modM { clear:both; } .modM .imgBox { width:570px;height:321px; } .modM .imgBox img { width:570px;height:321px; } .modM.modRight .imgBox { left:384px; } .modM .txtContainer { left:640px;width:314px;height:321px; } .modM .txtBox { width:314px;height:321px; } .modM .imgBox.modSVGs { background:#ffffff;padding-top:80px;height:241px; } .modM .imgTeaser { position:relative;left:0px;width:570px;height:321px !important;z-index:1; -webkit-box-shadow: 0px 6px 6px rgba(51,51,51,0.2); -moz-box-shadow: 0px 6px 6px rgba(51,51,51,0.2); box-shadow: 0px 6px 6px rgba(51,51,51,0.2); -moz-transition-property: left, width, height; -moz-transition-duration: 0.5s, 0.5s, 0.5s; -moz-transition-timing-function: linear, linear, linear; -webkit-transition-property: left, width, height; -webkit-transition-duration: 0.5s, 0.5s, 0.5s; -webkit-transition-timing-function: linear, linear, linear; -o-transition-property: left, width, height; -o-transition-duration: 0.5s, 0.5s, 0.5s; -o-transition-timing-function: linear, linear, linear; transition-property: left, width, height; transition-duration: 0.5s, 0.5s, 0.5s; transition-timing-function: linear, linear, linear; } .modM.modRight .imgTeaser { left:384px; } .modM.maximised .imgTeaser { left:0px;width:954px;height:537px !important; } .modM.maximised .txtBox { animation-name: maximise; animation-duration: 1.0s; animation-iteration-count: 1; } @keyframes maximise { 0% { opacity:1; } 49% { opacity:0; } 51% { opacity:0; } 100% { opacity:1; } } .modM.minimised .txtBox { animation-name: minimise; animation-duration: 1.0s; animation-iteration-count: 1; } @keyframes minimise { 0% { opacity:1; } 49% { opacity:0; } 51% { opacity:0; } 100% { opacity:1; } } .modMap .txtContainer { left:640px;width:314px;height:406px; } .modMap .txtBox { width:314px;height:406px; } .modMap iframe { position:relative;left:-3px;width:570px;height:406px !important;z-index:1; -webkit-box-shadow: 0px 6px 6px rgba(51,51,51,0.2); -moz-box-shadow: 0px 6px 6px rgba(51,51,51,0.2); box-shadow: 0px 6px 6px rgba(51,51,51,0.2); -moz-transition-property: left, width, height; -moz-transition-duration: 0.5s, 0.5s, 0.5s; -moz-transition-timing-function: linear, linear, linear; -webkit-transition-property: left, width, height; -webkit-transition-duration: 0.5s, 0.5s, 0.5s; -webkit-transition-timing-function: linear, linear, linear; -o-transition-property: left, width, height; -o-transition-duration: 0.5s, 0.5s, 0.5s; -o-transition-timing-function: linear, linear, linear; transition-property: left, width, height; transition-duration: 0.5s, 0.5s, 0.5s; transition-timing-function: linear, linear, linear; } .modMap .imgBox { position:absolute;top:0px;left:0px;width:570px;height:406px;background:none;z-index:1; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -moz-transition-property: left, width, height, z-index; -moz-transition-duration: 0.5s, 0.5s, 0.5s, 0.5s; -moz-transition-timing-function: linear, linear, linear, linear; -moz-transition-delay: 0s, 0s, 0s, 1.5s; -webkit-transition-property: left, width, height, z-index; -webkit-transition-duration: 0.5s, 0.5s, 0.5s, 0.5s; -webkit-transition-timing-function: linear, linear, linear, linear; -webkit-transition-delay: 0s, 0s, 0s, 1.5s; -o-transition-property: left, width, height, z-index; -o-transition-duration: 0.5s, 0.5s, 0.5s, 0.5s; -o-transition-timing-function: linear, linear, linear, linear; -o-transition-delay: 0s, 0s, 0s, 1.5s; transition-property: left, width, height, z-index; transition-duration: 0.5s, 0.5s, 0.5s, 0.5s; transition-timing-function: linear, linear, linear, linear; transition-delay: 0s, 0s, 0s, 1.5s; } .modMap .imgBox img { position:relative;width:570px;height:406px;opacity:1; -moz-transition-property: width, height, opacity; -moz-transition-duration: 0.5s, 0.5s, 0.5s; -moz-transition-timing-function: linear, linear, linear; -moz-transition-delay: 0s, 0s, 1.0s; -webkit-transition-property: width, height, opacity; -webkit-transition-duration: 0.5s, 0.5s, 0.5s; -webkit-transition-timing-function: linear, linear, linear; -webkit-transition-delay: 0s, 0s, 1.0s; -o-transition-property: width, height, opacity; -o-transition-duration: 0.5s, 0.5s, 0.5s; -o-transition-timing-function: linear, linear, linear; -o-transition-delay: 0s, 0s, 1.0s; transition-property: width, height opacity; transition-duration: 0.5s, 0.5s, 0.5s; transition-timing-function: linear, linear, linear; transition-delay: 0s, 0s, 1.0s; } .modMap.maximised iframe { left:-3px;width:954px;height:680px !important; } .modMap.maximised .imgBox { left:0px;width:954px;height:680px !important;z-index:0; } .modMap.maximised .imgBox img { width:954px;height:680px !important;opacity:0; } .modMap .mapClose { position:absolute;top:18px;right:428px;width:37px;height:37px;cursor:pointer;z-index:2;opacity:0;background:url(/images/v5/css/map_close.png);background-size:37px 37px; -moz-transition-property: right, opacity; -moz-transition-duration: 0.5s, 0.5s; -moz-transition-timing-function: linear, linear; -webkit-transition-property: right, opacity; -webkit-transition-duration: 0.5s, 0.5s; -webkit-transition-timing-function: linear, linear; -o-transition-property: right, opacity; -o-transition-duration: 0.5s, 0.5s; -o-transition-timing-function: linear, linear; transition-property: right, opacity; transition-duration: 0.5s, 0.5s; transition-timing-function: linear, linear; } .modMap.maximised .mapClose { right:43px;opacity:1; } /* modMore */ .modMore .moreBox { position:relative;display:none; } .modMore .moreBox .moreBoxTextWrapper { position:relative;width:762px;padding-top:40px; } .modMore .moreBox .moreBoxTextWrapper.wide { position:relative;width:960px;} .modMore .moreBox .col33Box { position:relative;width:260px;float:left;margin-right:60px; } /* modBubble */ .modBubble .imgLayer { position:absolute;top:0px;left:0px;width:570px;height:273px; } .modBubble .imgLayer img { width:570px;height:273px; } .modBubble .imgOverlay { position:absolute;top:0px;left:0px;width:570px;height:273px; } .modBubble .imgOverlay img { position:relative;top:4px;width:570px;height:269px; } .modBubble .imgBox { background:none; } /* modL */ .modL { clear:both; } .modL .imgBox { width:762px;height:385px;margin-bottom:60px; } .modL .imgBox img { width:762px;height:385px; } .modL.modRight .imgBox { left:192px; } .modL .txtContainer { position:relative;left:0;width:762px; } .modL.modRight .txtContainer { left:192px; } .modL .txtBox { width:762px; } /* modXL */ .modXL { clear:both; } .modXL .imgBox { width:954px;height:325px;margin-bottom:60px; } .modXL .imgBox img { width:954px;height:325px; } .modXL .txtContainer { } .modXL .txtBox { } /* Spacer */ .modSpacer { position:relative;display:table;width:954px;margin:-20px 0 60px;clear:both; } .modSpacer .head { position:relative;font-size:40px;line-height:45px;vertical-align:middle;display:table-cell;text-align:center;color:#e60000;padding:10px 0; } .modSpacer .head p, .modSpacer .head h1, .modSpacer .head h2, .modSpacer .head h3, .modSpacer .head h4, .modSpacer .head h5, .modSpacer .head h6 { font-size:40px;line-height:45px;color:#e60000; } .modSVGs { position:relative;width:954px;height:169px; } .modSVGs .icon { position:relative;width:190px;height:211px;margin:-56px 0; } .modSVGs .iconBox { position:relative;float:left;width:190px; } .modSVGs .iconBox.demi { position:relative;width:95px; } .modSVGs .iconBox .head { position:relative;width:100%;text-align:center;margin-bottom:1px;color:#e60000; } .modSVGs .iconBox .txt { position:relative;width:100%;text-align:center;line-height:17px; } .modSVGs .iconBox.house svg { position:relative;margin:0 0 10px 61px; } .modSVGs .iconBox.handy svg { position:relative;margin:0 0 10px 61px; } .modSVGs .iconBox.phone2 svg { position:relative;margin:0 0 10px 61px; } .modSVGs .iconBox.person svg { position:relative;margin:0 0 10px 61px; } .modSVGs .iconBox.data svg { position:relative;margin:0 0 10px 61px; } .modSVGs .iconBox.business svg { position:relative;margin:0 0 10px 61px; } .modSVGs .iconBox.business2 svg { position:relative;margin:0 0 10px 61px; } .modSVGs .iconBox.clock2 svg { position:relative;margin:0 0 10px 61px; } .modSVGs .download:hover .arrow { -webkit-animation-name: move; -webkit-animation-duration: 1s; -webkit-animation-iteration-count: infinite; animation-name: move; animation-duration: 0.8s; animation-iteration-count: infinite; } @-webkit-keyframes move { 0% { -webkit-transform: translateY(0px); } 50% { -webkit-transform: translateY(10px); } } @keyframes move { 0% { transform: translateY(0px); } 50% { transform: translateY(10px); } } .modSVGs .phone:hover .phonering { -webkit-animation-name: ring; -webkit-animation-duration: 0.8s; -webkit-animation-iteration-count: infinite; animation-name: ring; animation-duration: 0.8s; animation-iteration-count: infinite; } @-webkit-keyframes ring { 10% { -webkit-transform: translate( 2px, 2px); } 20% { -webkit-transform: translate(-2px, -2px); } 30% { -webkit-transform: translate( 2px, 2px); } 40% { -webkit-transform: translate(-2px, -2px); } 50% { -webkit-transform: translate( 2px, 2px); } } @keyframes ring { 10% { transform: translate( 2px, 2px); } 20% { transform: translate(-2px, -2px); } 30% { transform: translate( 2px, 2px); } 40% { transform: translate(-2px, -2px); } 50% { transform: translate( 2px, 2px); } } .modSVGs .clock:hover .bigPointer { -webkit-animation-name: bigRotate; -webkit-animation-duration: 1.0s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; -webkit-transform-origin: 0px 0px; animation-name: bigRotate; animation-duration: 1.0s; animation-iteration-count: infinite; animation-timing-function: linear; transform-origin: 0px 0px; } @-webkit-keyframes bigRotate { 100% { -webkit-transform:rotate(360deg); } } @keyframes bigRotate { 100% { transform:rotate(360deg); } } .modSVGs .clock:hover .smallPointer { -webkit-animation-name: smallRotate; -webkit-animation-duration: 8.0s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; -webkit-transform-origin: 0px 0px; animation-name: smallRotate; animation-duration: 8.0s; animation-iteration-count: infinite; animation-timing-function: linear; transform-origin: 0px 0px; } @-webkit-keyframes smallRotate { 12.5% { -webkit-transform:rotate(45deg); } 25% { -webkit-transform:rotate(90deg); } 37.5% { -webkit-transform:rotate(135deg); } 50% { -webkit-transform:rotate(180deg); } 62.5% { -webkit-transform:rotate(225deg); } 75% { -webkit-transform:rotate(270deg); } 87.5% { -webkit-transform:rotate(315deg); } 100% { -webkit-transform:rotate(360deg); } } @keyframes smallRotate { 12.5% { transform:rotate(45deg); } 25% { transform:rotate(90deg); } 37.5% { transform:rotate(135deg); } 50% { transform:rotate(180deg); } 62.5% { transform:rotate(225deg); } 75% { transform:rotate(270deg); } 87.5% { transform:rotate(315deg); } 100% { transform:rotate(360deg); } } .modSVGs .world:hover .orbit { stroke-dasharray: 20; -webkit-animation-name: dash; -webkit-animation-duration: 5.0s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-name: dash; animation-duration: 5.0s; animation-iteration-count: infinite; animation-timing-function: linear; } @-webkit-keyframes dash { to { stroke-dashoffset: 200; } } @keyframes dash { to { stroke-dashoffset: 200; } } .modSVGs .world:hover .satelite { -webkit-animation-name: fade; -webkit-animation-duration: 1.0s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-name: fade; animation-duration: 1.0s; animation-iteration-count: infinite; animation-timing-function: linear; } @-webkit-keyframes fade { 0% { stroke-opacity: 1; } 100% { stroke-opacity: 0; } } @keyframes fade { 0% { stroke-opacity: 1; } 100% { stroke-opacity: 0; } } .modSVGs .user:hover .tie { -webkit-animation-name: tiesize; -webkit-animation-duration: 0.6s; -webkit-animation-iteration-count: infinite; animation-name: tiesize; animation-duration: 0.6s; animation-iteration-count: infinite; } @-webkit-keyframes tiesize { 50% { -webkit-transform: scale(1.0, 1.6); } } @keyframes tiesize { 50% { transform: scale(1.0, 1.6); } } .mod.modMrd .head, .mod.modMrd .head p, .mod.modMrd .head h1, .mod.modMrd .head h2, .mod.modMrd .head h3, .mod.modMrd .head h4, .mod.modMrd .head h5, .mod.modMrd .head h6 { margin-bottom:10px; } .mod.modMrd .imgBox { position:relative;width:700px;height:80px;margin:0 0 10px 0px;background:none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .mod.modMrd .head, .mod.modMrd .txt { text-align:left; } .navBar { position:relative;clear:both;width:954px;height:66px; } .navBar .navBarBox { position:relative;float:left;width:337px;height:52px;padding:14px 70px 0; font-family:'VodafoneRgRegular',Arial,Helvetica,sans-serif;font-size:14px;font-weight:normal;color:#ffffff;text-decoration:none; } .navBar .navBarBox strong { position:relative;display:block;font-family:'VodafoneRgRegular',Arial,Helvetica,sans-serif;font-size:20px;font-weight:normal;color:#ffffff;text-decoration:none;padding-top:5px; } .navBar .prev { background:url(/images/v5/css/dvf_prev_white.png) #e60000 no-repeat 20px 16px;background-size:35px 33px; } .navBar .next { background:url(/images/v5/css/dvf_next_white.png) #bd0000 no-repeat 422px 16px;background-size:35px 33px;text-align:right; } .navBar .prev:hover { background-image:url(/images/v5/css/dvf_prev_darkred.png);background-size:35px 33px; } .navBar .next:hover { background-image:url(/images/v5/css/dvf_next_red.png);background-size:35px 33px; } .appIcons { position:relative;clear:both;height:220px;margin-bottom:40px; } .appIcons .item { position:relative;display:block;float:left;width:205px;height:35px;margin:0 36px 0 36px;padding-top:180px; font-family:'VodafoneRgRegular',Arial,Helvetica,sans-serif;font-size:30px;font-weight:normal;color:#e60000;text-align:center;text-decoration:none; } .appIcons .item:first-child { margin-left:98px; } .appIcons .mv { background:url(/images/v5/css/App_MeinVf_290x290.png) no-repeat center top;background-size:145px 145px; } .appIcons .vp { background:url(/images/v5/css/App_VfProtect_290x290.png) no-repeat center top;background-size:145px 145px; } .appIcons .sn { background:url(/images/v5/css/App_SecureNet_290x290.png) no-repeat center top;background-size:145px 145px;width:249px;margin:0 14px 0 14px; } .appIcons .vc { background:url(/images/v5/css/App_Zubehoer_290x290.png) no-repeat center top;background-size:145px 145px; } .appIcons .ba { background:url(/images/v5/css/app-backupplus-290x290.jpg) no-repeat center top;background-size:145px 145px; } .social { position:relative;clear:both;height:152px;margin-bottom:40px; } .social .item { position:relative;display:block;float:left;width:117px;height:20px;margin:0 39px 0 131px;padding-top:132px; font-family:'VodafoneRgRegular',Arial,Helvetica,sans-serif;font-size:16px;font-weight:normal;color:#9c2aa0;text-align:center;text-decoration:none; } .social .fb { background:url(/images/v5/css/Facebook_115x115.png) no-repeat;background-size:115px 115px; } .social .tw { background:url(/images/v5/css/Twitter_115x115.png) no-repeat;background-size:115px 115px; } .social .kf { background:url(/images/v5/css/Kundenforum_115x115.png) no-repeat;background-size:115px 115px; } .social .fb:hover { background:url(/images/v5/css/Facebook_hover_115x115.png) no-repeat;background-size:115px 115px; } .social .tw:hover { background:url(/images/v5/css/Twitter_hover_115x115.png) no-repeat;background-size:115px 115px; } .social .kf:hover { background:url(/images/v5/css/Kundenforum_hover_115x115.png) no-repeat;background-size:115px 115px; } .dvfSEO { position:relative;width:954px;margin-bottom:80px;clear:both; } .dvfSEO p { position:relative;font-family:'VodafoneRgRegular',Arial,Helvetica,sans-serif;font-size:14px;line-height:16px;font-weight:normal;padding:15px; } .dvfFootnote { position:relative;width:954px;margin-bottom:80px;clear:both;background:url(//www.vodafone.de/images/v5/css/acco_down.png) no-repeat 910px 0;background-size:24px 12px; } .dvfFootnote.active { background:url(//www.vodafone.de/images/v5/css/acco_up.png) no-repeat 910px 0;background-size:24px 12px; } .dvfFootnote .head { position:relative;font-family:'VodafoneRgBold',Arial,Helvetica,sans-serif;font-size:20px;line-height:22px;font-weight:normal;border-bottom:1px solid #333333;padding:0 0 15px 15px;cursor:pointer; } .dvfFootnote .txt { position:relative;display:none; } .dvfFootnote .txt p { position:relative;font-family:'VodafoneRgRegular',Arial,Helvetica,sans-serif;font-size:14px;line-height:16px;font-weight:normal;padding:15px; } .dvfFootnote .txt p sup { line-height:8px; } @media only screen and (max-width: 767px) { .dvfIntro { width:480px;margin:-85px 0 0 -160px;background:url(/images/v5/css/HS_Start_2560x1230_heller.jpg) no-repeat center top scroll;background-size:auto 100%; } .dvfIntroConsumer { background:url(/images/v5/css/HS_DiscoverVf_Consumer_2560x1230.jpg) no-repeat center top scroll;background-size:auto 100%; } .dvfIntro .head { width:300px;height:60px;top:50%;left:50%;margin:-30px 0 0 -70px; } .dvfIntro.dvfIntroConsumer .head { margin:-170px 0 0 -70px; } .dvfIntro .head p, .dvfIntro .head h1, .dvfIntro .head h2, .dvfIntro .head h3, .dvfIntro .head h4, .dvfIntro .head h5, .dvfIntro .head h6 { font-size:26px;line-height:30px;text-shadow: 0 0 0.2em #000000, 0 0 0.2em #000000, 0 0 0.2em #000000; } .dvfIntro a.down { margin-left:40px; } .isWide #imheader { margin-bottom: 176px; } div.divContent5Col { overflow:visible;margin:0;padding:0; } .dvfContainer { padding:40px 0 10px; } .wideHero { height:228px; } .wideHero li { height:228px;background-size:cover; } .wideHeroContentWrapper { height:228px;width:320px; } .wideHeroContentBox { top:0px !important;left:0px !important; } .wideHeroContentBox .headline { position:absolute;width:240px; } .wideHeroContentBox .headline, .wideHeroContentBox .headline p, .wideHeroContentBox .headline h1, .wideHeroContentBox .headline h2, .wideHeroContentBox .headline h3, .wideHeroContentBox .headline h4, .wideHeroContentBox .headline h5, .wideHeroContentBox .headline h6 { font-size: 22px;line-height: 22px;text-shadow: 0 0 0.2em #ffffff, 0 0 0.2em #ffffff, 0 0 0.2em #ffffff; } .divMobileHeaderContainer { top:-261px; } .mobileMenu ul li:last-child a { border:0; } .mod { margin:0 10px 40px; } #discover .mod { margin:-4px 0 0; } .box { margin:-2px;padding:6px 0 0 8px;border-width:4px;border-color:#a0a0a0;color:#e60000; } .mod .boxSup { display:none; } .mod .box .txtBox { display:none; } .mod .box .imgBox img.light { display:none; } .mod .box .imgBox img.dark { left:0;opacity:1; -moz-transition: none !important; -webkit-transition: none !important; -o-transition: none !important; transition: none !important; } .mod.active .box { border-color:#a0a0a0;z-index:1;color:#e60000; } .mod.active .box .imgBox img.dark { left:0;opacity:1; } .mod.soft .box { border-color:#a0a0a0;color:#e60000; } .mod .box .head, .mod .box .head p { font-size:14px;line-height:16px; } .boxW3 { width:150px;height:86px; } .boxW3_2 { width:150px;height:118px; } .boxW4 { width:214px;height:86px; } .boxW5 { width:260px;height:118px; } .boxW6 { width:342px;height:128px; } .boxW8 { width:142px;height:94px; } .boxW8 .imgBox { width:150px;height:100px; } .boxW8_2 { width:142px;height:120px; } .boxW8_2 .imgBox { width:150px;height:126px; } .boxW9 { width:160px;height:88px; } .boxW9 .imgBox { width:168px;height:94px; } .boxW9 .imgBox img { height:94px; } .boxW10 { width:180px;height:82px; } .boxW10 .imgBox { width:188px;height:88px; } .boxW10 .imgBox img { height:88px; } .mod1 .boxW9 { margin-left:130px; } .mod2 .boxW9 { margin-left:15px;height:94px; } .mod2 .boxW9 .imgBox { height:100px; } .mod2 .boxW9 .imgBox img { height:100px; } .mod3 .boxW9 { margin-left:130px;height:126px; } .mod3 .boxW9 .imgBox { height:132px; } .mod3 .boxW9 .imgBox img { height:132px; } .mod4 .boxW9 { margin-left:15px;height:106px; } .mod4 .boxW9 .imgBox { height:112px; } .mod4 .boxW9 .imgBox img { height:112px; } .mod5 .boxW8 { margin-left:148px;margin-bottom:0px; } .mod5 .boxW8 .imgBox img { height:100px; } .mod6 .boxW8_2 { margin-left:130px; } .mod6 .boxW8_2 .imgBox img { height:126px; } .mod7 .boxW8 { margin-left:33px;margin-bottom:0px; } .mod7 .boxW8 .imgBox img { height:100px; } .modc1 .boxW10 { margin-left:110px; } .modc2 .boxW10 { margin-left:15px;height:94px; } .modc2 .boxW10 .imgBox { height:100px; } .modc2 .boxW10 .imgBox img { height:100px; } .modc3 .boxW8 { margin-left:148px;height:136px; } .modc3 .boxW8 .imgBox { height:142px; } .modc3 .boxW8 .imgBox img { height:142px; } .modc4 .boxW9 { margin-left:15px;height:106px; } .modc4 .boxW9 .imgBox { height:112px; } .modc4 .boxW9 .imgBox img { height:112px; } .modc5 .boxW9 { margin-left:130px;height:98px;margin-bottom:0px; } .modc5 .boxW9 .imgBox { height:104px; } .modc5 .boxW9 .imgBox img { height:104px; } .mod1 svg, .mod2 svg, .mod3 svg, .mod4 svg, .mod5 svg, .mod6 svg, .mod7 svg { display:none; } .modc1 svg, .modc2 svg, .modc3 svg, .modc4 svg, .modc5 svg { display:none; } .mod .headTop { position:relative;display:block; } .mod .head, .mod .head p { font-size:18px;line-height:21px;margin-bottom:10px; } .mod .txtContainer { position:relative;left:0px; } .mod.modRight .txtContainer { left:0px; } .mod .dvfButton .txt { width:264px;text-align:center; } .mod .dvfButton:active .pulse { top:-5px;left:-5px;width:310px;height:46px; } /* modXS */ .modXS .imgBox { width:300px;height:135px;margin-bottom:15px;display:none; } .modXS .imgBox img { width:300px;height:135px; } .modXS .txtBox .head { display:none; } .modXS .imgBox.onlyResponsive { display:block; } /* modXSx3 */ .modXSx3 .imgBox { width:300px;height:224px;display:none; } .modXSx3 .imgBox img { width:300px;height:169px; } .modXSx3 .txtContainer { position:absolute;width:300px; } .modXSx3 .txtBox { width:300px; } .modXSx3 .txt { height:55px; } .modXSx3:hover .txt { height:55px; } .modXSx3 .txt p { padding:5px 20px 0;opacity:1; } .modXSx3 .txtBox .head { display:block;margin-bottom:6px; } .modXSx3 .txtBox .head p, .modXSx3 .txtBox .head h1, .modXSx3 .txtBox .head h2, .modXSx3 .txtBox .head h3, .modXSx3 .txtBox .head h4, .modXSx3 .txtBox .head h5, .modXSx3 .txtBox .head h6 { margin-bottom:6px; } .modXSx3 .imgBox.onlyResponsive { display:block; } .modXSx3.duo .imgBox { width:300px;height:268px; } .modXSx3.duo .imgBox img { width:300px; } .modXSx3.duo .txtContainer { width:300px; } .modXSx3.duo .txtBox { width:300px; } .modXSx3.duo .txt { height:99px; } .modXSx3.duo .txt:hover { height:99px; } .modXSx3 .head:before, .modXSx3.duo .head:before { position:absolute;bottom:-6px;left:0px;content:" ";width:300px;height:169px; background:url(/images/v5/css/Verlauf_450x450.png);background-size:300px 169px; } .modXSx3.invers .imgBox { width:298px;height:222px;display:block; } .modXSx3.invers .imgBox.onlyResponsive { display:none; } .modXSx3.invers .head { color:#333333; } .modXSx3.invers .head:before { background:url(/images/v5/css/Verlauf_450x450_weiss.png);background-size:300px 169px; } /* modS */ .modS .imgBox { width:300px;height:169px;margin-bottom:15px;display:none; } .modS .imgBox img { width:300px;height:169px; } .modS.modRight .imgBox { left:0px; } .modS .txtContainer { left:0px;width:300px;height:auto; } .modS .txtBox { width:300px;height:auto; } .modS .txtBox .head { display:none; } .modS .imgBox.onlyResponsive { display:block; } /* modM - Video */ .modM .imgBox { width:300px;height:169px;margin-bottom:15px; } .modM .imgBox img { width:300px;height:169px; } .modM.modRight .imgBox { left:0px; } .modM .txtContainer { left:0px;width:300px;height:auto; } .modM .txtBox { width:300px;height:auto; } .modM .txtBox .head { display:none; } .modM .imgBox.modSVGs { padding-top:0px;height:291px; } .modM .imgTeaser { width:300px;height:169px !important;margin-bottom:15px; -moz-transition: none !important; -webkit-transition: none !important; -o-transition: none !important; transition: none !important; } .modM.modRight .imgTeaser { left:0px; } .modM.maximised .imgTeaser { left:0px;width:300px;height:169px !important; } .modMap iframe { width:300px;height:500px !important;margin-bottom:15px; -moz-transition: none !important; -webkit-transition: none !important; -o-transition: none !important; transition: none !important; } .modMap .imgBox { width:300px;height:500px;overflow:hidden; } .modMap .imgBox img { width:auto;height:500px;opacity:1;left:-200px; } .modMap.maximised iframe { width:300px;height:500px !important; } .modMap.maximised .imgBox { width:300px;height:500px !important; } .modMap.maximised .imgBox img { width:auto;height:500px !important;opacity:0; } .modMap .mapClose { right:18px;opacity:0; } .modMap.maximised .mapClose { right:18px;opacity:1; } /* modMore */ .modMore .moreBox .moreBoxTextWrapper { width:300px;padding-top:15px; } .modMore .moreBox .moreBoxTextWrapper.wide { position:relative;width:300px;padding-top:15px; } .modMore .moreBox .col33Box { position:relative;width:300px;float:none;margin:0 0 15px 0; } /* modBubble */ .modBubble .imgLayer, .modBubble .imgOverlay, .modBubble .imgBox { display:none; } .modBubble .imgBox.onlyResponsive { height:143px;display:block; } .modBubble .imgBox.onlyResponsive img { height:143px; } /* modL */ .modL .imgBox { width:300px;height:152px;margin-bottom:15px; } .modL .imgBox img { width:300px;height:152px; } .modL.modRight .imgBox { left:0px; } .modL .txtContainer { left:0px;width:300px;height:auto; } .modL .txtBox { width:300px;height:auto; } .modL .txtBox .head { display:none; } /* modXL */ .modXL .imgBox { width:300px;height:102px;margin-bottom:15px; } .modXL .imgBox img { width:300px;height:102px; } /* Spacer */ .modSpacer { width:300px; } .modSpacer .head { font-size:24px;line-height:28px; } .modSpacer .head p, .modSpacer .head h1, .modSpacer .head h2, .modSpacer .head h3, .modSpacer .head h4, .modSpacer .head h5, .modSpacer .head h6 { font-size:24px;line-height:28px; } .mod.modMrd .head, .mod.modMrd .head p, .mod.modMrd .head h1, .mod.modMrd .head h2, .mod.modMrd .head h3, .mod.modMrd .head h4, .mod.modMrd .head h5, .mod.modMrd .head h6 { margin-bottom:15px; } .mod.modMrd .imgBox { position:relative;width:300px;height:35px;margin:0 0 10px 0px; } .mod.modMrd .imgBox img { width:300px;height:35px; } .modSVGs { width:300px;height:auto; } .modSVGs .icon { margin:-56px -20px; } .modSVGs .iconBox { width:150px; } .modSVGs .lastIconBox { margin-left:75px; } .modSVGs .iconBox .head, .modSVGs .iconBox .head p, .modSVGs .iconBox .head h1, .modSVGs .iconBox .head h2, .modSVGs .iconBox .head h3, .modSVGs .iconBox .head h4, .modSVGs .iconBox .head h5, .modSVGs .iconBox .head h6 { font-size:30px;line-height:35px; } .modSVGs .iconBox.empty { display:none;} .modSVGs .iconBox.house { margin:0 0 20px 0px; } .modSVGs .iconBox.handy { margin:0 0 20px 0px; } .modSVGs .iconBox.phone2 { margin:0 0 20px 75px; } .modSVGs .iconBox.house svg { margin:0 0 10px 41px; } .modSVGs .iconBox.handy svg { margin:0 0 10px 41px; } .modSVGs .iconBox.phone2 svg { margin:0 0 10px 41px; } .modSVGs .iconBox.person { margin:0 0 20px 0px; } .modSVGs .iconBox.data { margin:0 0 20px 0px; } .modSVGs .iconBox.business { margin:0 0 20px 75px; } .modSVGs .iconBox.business2 { margin:0 0 20px 0px; } .modSVGs .iconBox.clock2 { margin:0 0 20px 0px; } .modSVGs .iconBox.person svg { margin:0 0 10px 41px; } .modSVGs .iconBox.data svg { margin:0 0 10px 41px; } .modSVGs .iconBox.business svg { margin:0 0 10px 41px; } .modSVGs .iconBox.business2 svg { margin:0 0 10px 41px; } .modSVGs .iconBox.clock2 svg { margin:0 0 10px 41px; } .navBar { width:320px;height:55px; } .navBar .navBarBox { position:relative;float:left;width:121px;height:43px;padding:11px 39px 0;font-size:10px; } .navBar .navBarBox strong { font-size:12px;padding-top:1px; } .navBar .prev { background-position:10px 18px;background-size:19px 18px;padding-right:0; } .navBar .next { background-position:131px 18px;background-size:19px 18px;padding-left:0; } .navBar .prev:hover { background-position:10px 18px;background-size:19px 18px; } .navBar .next:hover { background-position:131px 18px;background-size:19px 18px; } .appIcons { height:220px; } .appIcons .item { width:102px;height:35px;margin:0 6px 0 38px;padding-top:115px;font-size:14px; } .appIcons .item:first-child { margin-left:38px; } .appIcons .item:last-child { margin:0 8px 0 110px; } .appIcons .mv, .appIcons .vp, .appIcons .sn, .appIcons .vc, .appIcons .ba { background-size:100px 100px; } .appIcons .sn { width:117px;margin:0 6px 0 23px; } .social { height:290px; } .social .item { width:102px;height:30px;margin:0 6px 0 38px;padding-top:115px;font-size:14px; } .social .item:last-child { margin:0 8px 0 110px; } .social .fb, .social .tw, .social .kf, .social .fb:hover, .social .tw:hover, .social .kf:hover { background-size:100px 100px; } .dvfSEO { width:300px;margin:0 10px 40px; } .dvfSEO p { padding:15px 0; } .dvfFootnote { width:300px;margin:0 10px 40px;background-position:276px 28px; } .dvfFootnote.active { background-position:276px 28px; } .dvfFootnote .head { padding: 0 50px 15px 0; } .dvfFootnote .txt p { padding:15px 0; } } /* -[SNIPPETS <<<]---------------------------------------------------------------------------- */