html { position: relative; heigth:100%;}
/* Move down content because we have a fixed navbar that is 50px tall */
body { overflow-x: hidden;
font-family: 'Roboto',Helvetica,Arial,sans-serif;padding-top: 60px; /* margin-bottom: 22px;*/}
p{font-size:16px}
p.small{font-size:14px}
a,a:hover,a:focus,a:active,a.active{outline:0;color:#f0a942}
h1,h2,h3,h4,h5,h6{font-family: 'Roboto',Helvetica,Arial,sans-serif;font-weight:400}
h1{color:#274c90;font-size:28px;margin:10px 0 16px}
h2{text-transform:none;margin-bottom:6px;}
h4{color:#06438d;font-size:16px;}
/*.container {max-width:940px;}*/
.btn { font-size: 16px; padding: 8px 18px; transition: all .3s ease-in-out;}
hr.star-light,hr.star-primary{margin:25px auto 30px;padding:0;max-width:250px;border:0;border-top:solid 1px;text-align:center}
hr.star-light:after,hr.star-primary:after{display:inline-block;position:relative;top:-.8em;padding:0 .25em;font-family:FontAwesome;font-size:2em}
hr.star-light{border-color:#fff}
hr.star-light:after{color:#fff;background-color:#337ab7}
hr.star-primary{border-color:#00a8f0}
hr.star-primary:after{color:#2c3e50;background-color:#FFF}
.img-centered{margin:0 auto}
/*header{text-align:center;color:#000;background:#f0e3c3}
header .container{padding-top:100px;padding-bottom:50px}
header img{display:block;margin:0 auto 30px}
header .intro-text .name{display:block;text-transform:uppercase;font-family:Lato,"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:2em;font-weight:700}
header .intro-text .skills{font-size:1.25em;font-weight:300}*/
/* Hero */
.banner-home {
text-align: center;
color: #000;
background-color: #fff;
background-image:url(/image/frontend/home-hero-vw-2.jpg);
background-repeat:no-repeat;
background-position: bottom center;
background-size: cover;
height:626px;
}
.banner-home .container {}
.banner-home .container .col-lg-12 { position:relative;}
.intro-home { padding:20px; margin-top:150px; color:#fff; text-align:left; max-width:395px; display: block; background-color:#fcb215;}
.intro-home span { color:#3b3928;}
.intro-home h1{ color:#fff; font-size:2.3em}
.container.video { padding-bottom: 20px; padding-top: 100px;}
.video-home {width:100%; margin-left: auto; margin-right: auto; left: 0; right: 0; max-width: 800px; /*background-image:url(/image/frontend/video-bg.jpg);
background-size: cover;
background-position: center center;*/}
.video-home video { position: relative; width:100%;
background-image:url(/image/frontend/video-bg.jpg);
background-size: cover;
background-position: center center;}
/* product page */
.video-product{ width:100%; margin-left: auto;
margin-right: auto; margin-top:-35%; /* margin-top needed for video */
left: 0;
right: 0; max-width: 800px;
}
.video-product video { position: relative; width:100%;
background-image:url(/image/frontend/video-bg.jpg);
background-size: cover;
background-position: center center;}
.yellow-bar {width:100%; padding:20px 0; background-color:#fcb215;}
.text-home { width:70%; padding:20px; float:left; display:block; max-width: 578px; text-align:left}
.text-home p{font-size:1.3em; }
.text-button-home {float:left; padding:20px; display:block}
/* LAPTOP SLIDERRRR */
.slider-laptop h2 { color: #3770b9; padding-bottom: 0px; font-size: 3em; margin-top: 0;}
.laptop-slider { width:100%; height: 600px; max-width:1020px; margin: 0px auto;}
.dt-content-left{ width:50%; float:left;}
.dt-laptop-slider{ width:100%; height: 100%; background: url('/image/frontend/slider/macbook.png');
background-repeat: no-repeat; background-position: 50% 50%; background-size: contain; margin: auto; z-index:4;}
.laptop-screen{ margin: auto; width: 100%; height: 100%; overflow: hidden; position: relative;}
.app-shot{ position:absolute; animation:round 32s infinite; opacity:0; z-index:-1; margin-left: auto; margin-right: auto; display: block;
width: 100%; height:auto;max-width:1020px; left: 50%; top: 50%; transform: translate(-50%,-50%); }
/*@keyframes round{ 25%{opacity:1;} 40%{opacity:0;} deze % zijn voor 4 afbeeldingen } */
@keyframes round{ 6.25%{opacity:1;} 20%{opacity:0;} }
.laptop-screen img:nth-child(8){animation-delay:0s;}
.laptop-screen img:nth-child(7){animation-delay:4s;}
.laptop-screen img:nth-child(6){animation-delay:8s;}
.laptop-screen img:nth-child(5){animation-delay:12s;}
.laptop-screen img:nth-child(4){animation-delay:16s;}
.laptop-screen img:nth-child(3){animation-delay:20s;}
.laptop-screen img:nth-child(2){animation-delay:24s;}
.laptop-screen img:nth-child(1){animation-delay:28s;}
/* Home Platform */
.platform { background-color: #f1f2f2; padding-top:40px;}
.platform H2 {color:#0070bb;margin-bottom:20px;}
.platform h2.demo { color: #f4ab2f; padding: 0px 0 15px 0;}
#platform .phone img { width: 300px; height: auto;}
.platform .platform-text { max-width: 385px;}
.platform p {padding-bottom:20px}
/* Home Waarom VW */
section.waaromVW .bgColor{background:rgba(255,255,255,0.94); padding: 30px 10px 10px 10px; }
section.waaromVW{color:#333;background:#fff; }
section.waaromVW .container{}
.waaromVW .row {padding-bottom:50px;}
.waaromVW .row.yellow {padding-bottom:10px;}
section.waaromVW h2{color: #3770b9; padding-bottom:0px; font-size:3em}
section.waaromVW .waaromIMG{ padding: 0; width: 400px;}
section.waaromVW .waaromIMG.rightSide{margin-right:-45px;}
section.waaromVW .waaromIMG.leftSide{margin-left:-45px;}
section.waaromVW h2.demo{color: #fff; padding: 0px 0 36px 0; font-size: 2.6em;}
/* Home blauwe balk */
.blauwebalk {
background-color: #3770b9;
height:40px;
width:100%;
}
/* Home testimonials */
.testimonials {
padding-top:0px;
padding-bottom:30px;
}
.testimonials h2 {color:#fff; padding-bottom:38px; font-size:3em}
.klantenLogotext {padding-top:30px; padding-bottom: 18px;}
.klantenLogo p{font-size:20px; padding-bottom:20px;}
.testimonials .row.klantlogos {
margin-right: -15px;
margin-left: -15px;
margin-bottom: 20px;
text-align:center
}
.klantenLogoLabelimg{
margin:0px 15px 5px 0px;
height:50px;
border:0;
}
.klantenLogoimg{
margin:0px 15px 25px 0px;
height:50px;
border:0;
}
/* Over VW / product page */
.banner-product { position:relative; padding-bottom:29%; background-image:url(/image/frontend/over-veiligwerk-bg.jpg); background-repeat: no-repeat;
background-position: bottom center; background-size: cover;}
.banner-product .container { padding-bottom: 0px; margin-top:10px; }
.intro-product { text-align: center; color:#fff; }
.intro-product h1{ color:#fff; font-size:3em; }
.intro-product h2 { font-size: 1.6em; margin:0px; padding:0px;}
.btn-hero{ color: #fff; background-color: #f0a942; border-color: #fff; }
.btn-hero.active, .btn-hero.focus, .btn-hero:active, .btn-hero:focus, .btn-hero:hover, .open>.dropdown-toggle.btn-hero { color: #fff; background-color: #0399d7; border-color: #fff;}
.btn-demo{ color: #fff; background-color: #f4ab2f; border-color: #f4ab2f; }
.btn-demo.active, .btn-demo.focus, .btn-demo:active, .btn-demo:focus, .btn-demo:hover, .open>.dropdown-toggle.btn-demo { color: #fff; background-color: #0399d7; border-color: #fff;}
h2.demo { color: #f4ab2f; padding:36px 0;}
legend { color:#06438d;}
.btn-demo-hollow{ color: #f4ab2f; background-color: #transparent; border-color: #f4ab2f; }
.btn-demo-hollow.active, .btn-demo-hollow.focus, .btn-demo-hollow:active, .btn-demo-hollow:focus, .btn-demo-hollow:hover, .open>.dropdown-toggle.btn-demo-hollow { color: #fff; background-color: transparent; color: #0399d7; border-color: #0399d7;}
section.usps {}
section.usps.color { background-color:#f1f2f2}
section.usps h1, section.usps h2{ font-size:2.6em; color:#2f76b7; padding-bottom:10px;}
section.usps .row {padding-bottom:10px 0;}
section.usps p.intro{ font-size:1.6em; padding-bottom:20px; }
.usps ul.list-checkmark , .usps ul.list-plus{list-style-type: none; padding: 0;margin: 0; padding-bottom:20px;}
.usps ul.list-checkmark li,.usps ul.list-plus li{line-height: 20px; padding: 0px 0 10px 30px;}
.usps ul.list-checkmark li{ background: url('/image/frontend/icon-check.png') no-repeat left top; }
.usps ul.list-plus li{ background: url('/image/frontend/icon-plus.png') no-repeat left top;}
section.usps img{max-width:500px; width: 100%; height:100% }
/* form en contact */
.contact { background-color:#f5f5f5;}
.contact h2 {color:#0070bb; padding-bottom:38px; font-size:3em}
.contact p{color:#000; font-size:24px; }
.contact input::placeholder,.contact textarea::placeholder {color:#000;}
.contact ul { list-style:none;}
.form-control{height:40px;}
.floating-label-form-group{position:relative;margin-bottom:0;padding-bottom:0;/*border-bottom:1px solid #eee*/}
.floating-label-form-group input,.floating-label-form-group textarea{z-index:1;position:relative;border-radius:0;font-size:1.2em;background:0 0;box-shadow:none!important;resize:none;
background-color:#fff; color:#000; padding: 8px;
}
.help-block{ margin-bottom:0;}
.floating-label-form-group label{display:block;z-index:0;position:relative;top:2em;margin:0;font-size:.85em;line-height:1.764705882em;vertical-align:middle;vertical-align:baseline;opacity:0;-webkit-transition:top .3s ease,opacity .3s ease;-moz-transition:top .3s ease,opacity .3s ease;-ms-transition:top .3s ease,opacity .3s ease;transition:top .3s ease,opacity .3s ease}
.floating-label-form-group::not(:first-child){padding-left:14px;border-left:1px solid #eee}
.floating-label-form-group-with-value label{top:0;opacity:1}
.floating-label-form-group-with-focus label{color:#337ab7}
form .row:first-child .floating-label-form-group{/*border-top:1px solid #eee*/}
/* steps
.step{font-size:110%;font-weight:200;color:#06438d;border:0;margin-bottom:8px;float:left;border-top:1px solid #EEE;border-bottom:1px solid #EEE;width:80%;cursor:pointer}
.step>.title{width:120px;border-right:1px solid #FAFAFA;clear:left;padding-right:6px;text-align:right;float:left;color:#555}
.step>.value{margin-left:120px;background-color:rgba(249,246,153,0.26);padding-left:4px;display:none}
#report_image{width:17%;height:120px}
#report_image>img{width:100%;height:100%;object-fit:contain}
.stepnr{color:#274c90;font-size:18px;font-weight:400;line-height:24px;margin:0 10px 0 0;padding:0;text-align:center;vertical-align:middle;width:26px;height:26px;float:left;-moz-border-radius:26px;-webkit-border-radius:26px;border-radius:26px;border:1px solid #274c90}
.stepnr.highlight{background-color:#274c90;color:#FFF;cursor:pointer}
*/
/* footer */
.footer { width: 100%;}
footer{color:#fff; line-height: 26px; font-size: 13px;}
footer h3{margin-bottom:30px}
footer .col-sm-6 {padding-top:20px;}
.footer-logo {float:left; margin-right:10px; margin-top:-10px; }
footer .footer-above{padding-top:50px;background-color:#2c3e50}
footer .footer-col{margin-bottom:50px}
footer .footer-below{padding:25px 0; background-color: #323232;}
footer .copyright {padding:20px 15px ;}
footer a {color:#fff}
footer a:hover {color:#f0a942}
.btn-social{display:inline-block;width:50px;height:50px;border:2px solid #fff;border-radius:100%;text-align:center;font-size:20px;line-height:45px}
.btn:focus,.btn:active,.btn.active{outline:0}
.scroll-top{z-index:1049;position:fixed;right:2%;bottom:5%;width:39px;height:39px}
.scroll-top .btn{width:50px;height:50px;border-radius:100%;font-size:20px;line-height:28px}
.scroll-top .btn:focus{outline:0}
.mainlogo { margin-right:10px;}
.home-animation { float:right;}
.row ul { text-align:left; font-size: 16px;}
ul.beacons{list-style:none;margin:0 0 1em 15px;padding:0}
ul.beacons li{line-height:2.3em;margin:.25em 0;padding:4px 0 0 32px;background:url(/image/mini-icon.png) no-repeat 0 7px}
ul.inspections{list-style:none;margin:0 0 1em 15px;padding:0}
ul.inspections li{line-height:2.3em;margin:.25em 0;padding:4px 0 0 32px;background:url(/image/inspection-icon.png) no-repeat 0 7px}
.float-clear{clear: both}
.float-left{float:left}
.float-right{float:right}
.selectboxit-selected{background:#ADD8E6}
.panel{background:#f8f8f8}
.ago-text{font-size:80%}
/*
.img-thumbnail.avatar { width:100px; height:100px;}
.thumbnail { position: relative; overflow: hidden; margin:0 8px 0 0; float:left;}
.thumbnail img { height: 100%; width: 100%; object-fit: contain;}
.thumbnail img.portrait { width: 100%; height: auto;}
.thumbnail.large { width: 200px; height: 200px;}
*/
.img-hover img {
-webkit-transition: all .3s ease; /* Safari and Chrome */
-moz-transition: all .3s ease; /* Firefox */
-o-transition: all .3s ease; /* IE 9 */
-ms-transition: all .3s ease; /* Opera */
transition: all .3s ease;
}
.img-hover img:hover {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform:translateZ(0) scale(1.20); /* Safari and Chrome */
-moz-transform:scale(1.20); /* Firefox */
-ms-transform:scale(1.20); /* IE 9 */
-o-transform:translatZ(0) scale(1.20); /* Opera */
transform:translatZ(0) scale(1.20);
}
.grayscale {
-webkit-filter: brightness(1.10) grayscale(100%) contrast(90%);
-moz-filter: brightness(1.10) grayscale(100%) contrast(90%);
filter: brightness(1.10) grayscale(100%);
}
.form-group.required input {
background: url("/image/required.svg") right 15px center no-repeat;
background-color: #fff
}
.minilogo { margin-top:-4px;}
.upload_preview { max-width:100px; max-height:100px; display:none; margin-top:10px;}
#slogan { font-size:16pt; font-weight:400; color:#faa71c;}
.widget { float:left; margin-right:10px;}
#overlay { position: fixed; width: 100%; height: 100%; top: 0px; left: 0px; background: black; opacity: 0.7; filter:alpha(Opacity=70); z-index: 2000; display: none;}
.plainmodel { position: fixed; width: 100%; height: 100%; top: 0px; left: 0px; background-color: white; z-index: 2000; display: none; padding:8px;}
ul.attachments { list-style:none; margin:4px; padding: 8;}
.btn-arrow-right,
.btn-arrow-left {
position: relative;
padding-left: 18px;
padding-right: 18px;
}
.btn-arrow-right {
padding-left: 36px;
}
.btn-arrow-left {
padding-right: 36px;
}
.btn-arrow-right:before,
.btn-arrow-right:after,
.btn-arrow-left:before,
.btn-arrow-left:after { /* make two squares (before and after), looking similar to the button */
content:"";
position: absolute;
top: 5px; /* move it down because of rounded corners */
width: 22px; /* same as height */
height: 22px; /* button_outer_height / sqrt(2) */
background: inherit; /* use parent background */
border: inherit; /* use parent border */
border-left-color: transparent; /* hide left border */
border-bottom-color: transparent; /* hide bottom border */
border-radius: 0px 4px 0px 0px; /* round arrow corner, the shorthand property doesn't accept "inherit" so it is set to 4px */
-webkit-border-radius: 0px 4px 0px 0px;
-moz-border-radius: 0px 4px 0px 0px;
}
.btn-arrow-right:before,
.btn-arrow-right:after {
transform: rotate(45deg); /* rotate right arrow squares 45 deg to point right */
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
-ms-transform: rotate(45deg);
}
.btn-arrow-left:before,
.btn-arrow-left:after {
transform: rotate(225deg); /* rotate left arrow squares 225 deg to point left */
-webkit-transform: rotate(225deg);
-moz-transform: rotate(225deg);
-o-transform: rotate(225deg);
-ms-transform: rotate(225deg);
}
.btn-arrow-right:before,
.btn-arrow-left:before { /* align the "before" square to the left */
left: -11px;
}
.btn-arrow-right:after,
.btn-arrow-left:after { /* align the "after" square to the right */
right: -11px;
}
.btn-arrow-right:after,
.btn-arrow-left:before { /* bring arrow pointers to front */
z-index: 1;
}
.btn-arrow-right:before,
.btn-arrow-left:after { /* hide arrow tails background */
background-color: white;
}
.panel-heading span{margin-top:-26px;font-size:15px;margin-right:-12px}
.panelclosebox{background:rgba(0,0,0,0.15);display:inline-block;padding:6px 12px;border-radius:4px;cursor:pointer}
.comment{-moz-transition:all .6s ease-in;-o-transition:all .6s ease-in;-webkit-transition:all .6s ease-in;transition:all .6s ease-in}
.comment.highlight{border-color:#ff0;background-color:rgba(255,255,0,.4)}
.hoverable:hover{background-color:#f8f8f8;cursor:pointer}
.icon-project-closed{color:#5CB85C}
.icon-project-in-progress{color:#EEE}
/* chat start */
.chat{ list-style: none; margin: 0; padding: 0;}
.chat li:not(:last-child){ margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px dotted #B3A9A9;}
.chat li.left .chat-body{ margin-left: 60px;}
.chat li.right .chat-body{ margin-right: 60px;}
.chat li .chat-body p{margin:0;color:#555}
/* chat end */
.remove-widget{font-size:80%;height:20px;padding:2px 4px 2px 15px}
.notification-panel{width:320px;height:400px;background-color:#fff;padding:0;overflow-y:auto}
.centered-button{text-align:center;font-weight:700;padding:12px;border:1px solid #DDD;border-radius:8px}
.centered-button>img{height:80px;width:auto;margin-bottom:8px}
.cellspacer{margin-bottom:8px}
img.avatar{width:60px;height:auto;border-radius:50%}
/* Navbar */
.navbar{font-weight:700;}
.navbar a:focus{outline:0}
.navbar-nav { padding: 5px 0;}
.navbar-nav>li>a {padding: 10px 15px;}
.navbar-default .navbar-toggle {border:0;}
.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover { color: #0399d7; background-color: transparent;}
.navbar-default .navbar-nav>li>a.active {color:#fcb215}
.navbar .navbar-nav{font-size: 1.1em; }
.navbar .navbar-nav li a:focus{outline:0}
.navbar-default,.navbar-inverse{background-color:#fff;border-color:#999}
.navbar-logo{float:left;max-height:50px;padding:0px}
.navbar-logo img{max-height:50px}
.navbar-fixed-top{padding:10px 0;-webkit-transition:padding .3s;-moz-transition:padding .3s;transition:padding .3s}
.navbar-fixed-top .navbar-brand{font-size:2em;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s}
.navbar-fixed-top.navbar-shrink{padding:10px 0}
.navbar-fixed-top.navbar-shrink .navbar-brand{font-size:1.5em}
.navbar-default .navbar-nav>li>a.demo { margin-left:10px; border-radius: 4px; color: #fff; background-color: #f0a942;}
.navbar-default .navbar-nav>li>a.demo:hover, .navbar-default .navbar-nav>li>a.demo:focus { color: #fff; background-color: #0399d7; }
.navbar-default .navbar-nav>li>a.login {}
.navbar-default .navbar-nav>li>a.login:before {content: " | "; padding-right: 10px;}
section{padding:20px 0}
section h2{font-size:2em}
/*footer app bar */
.app-download-bar {
text-align: right;
color: #fff;
background-color: #fff;
background-image:url(/image/frontend/apps-banner-bg.jpg);
background-repeat:no-repeat;
background-position: left center;
background-size: cover;
height:360px;}
.app-download-bar .text {float: right; padding:20px; max-width:250px; width:100%; text-align:center; margin-right: 8%; }
.app-store-icons { padding: 20px; width: 100%; text-align: left;}
.app-store-icons a { display: inline-block; margin: 10px ; padding:10px; border: 1px solid #fff; border-radius:4px; width: 162px;}
.app-store-icons a, .app-store-icons a:hover, .app-store-icons a:visited { color: #FFF !important; line-height: 15px; text-decoration: none}
.app-store-icons a:hover, .app-store-icons a:focus {background-color:#323232;}
.app-store-icons .app-store-download, .app-store-icons .app-store-name { text-align: left; white-space: nowrap; padding-left: 35px}
.app-store-icons .app-store-download {
font-size: 10px
}
.app-store-icons .app-store-name {
font-size: 16px
}
.app-store-icons img {
float: left;
height: 30px;
padding-right: 5px
}
@media (min-width: 1500px)
{
.text-home {bottom:1%}
}
@media (min-width: 1200px) and (max-width: 1500px)
{
}
@media (min-width: 992px) and (max-width: 1199px)
{
.video-home{ bottom:96px; right:125px; }
}
@media (max-width: 992px)
{
.laptop-slider { height: 530px;}
/*.banner-home{background-size:auto 135%}
.banner-home .container .col-lg-12{min-height:560px}*/
.intro-home{}
.app-download-bar .text {margin-right: 0; }
.video-home{}
section.waaromVW{padding:30px 10px}
section.waaromVW .waaromIMG{max-width:111%}
.banner-home {background-position: 36% 50%;}
}
@media(max-width:768px) {
.slider-laptop h2 { font-size: 2.4em;}
.laptop-slider { height: 410px;}
.navbar-default .navbar-nav>li>a.login:before {content: ""; padding-right: 0px;}
.navbar-default .navbar-nav>li>a.demo { margin-left:0px; border-radius: 0; color: #777; background-color: inherit;}
.navbar-default .navbar-nav>li>a.demo:hover, .navbar-default .navbar-nav>li>a.demo:focus { color: #0399d7; background-color: inherit; }
.platform .phone { display:none}
.platform {background:none; background-color:#e7e7e7}
.banner-home {height:450px; }
.waaromVW .row {padding-bottom:10px;}
.waaromVW .row .col-md-4 {padding:10px 0;}
section.waaromVW .container{padding-bottom:10px;}
section.waaromVW h2.demo{ font-size:1.8em; padding: 0px 0 18px 0;}
.waaromVW .row.yellow { padding-bottom: 0;}
section.usps h1, section.usps h2 { font-size: 2em;}
section.usps p.intro { font-size: 1.2em; padding-bottom: 0px;}
.app-download-bar {background-position: 30%center;}
.banner-home .container .col-lg-12 { }
.text-home{ max-width: 313px; }
.text-home p{font-size:1.1em;}
.video-home{ padding:10px 0; border:1px solid #e7e7e7; }
.container.video { padding-top: 70px;}
.video-product { max-width: 94%; padding-top: 20px;}
.intro-home h1{font-size:1.8em; }
.intro-home {max-width:316px}
section.waaromVW { text-align:center}
section.waaromVW .bgColor { margin-top: 20px; padding:20px 10px 20px 10px; max-width: 500px; margin-left: auto; margin-right: auto;}
section.waaromVW .bgColor .star-primary { display:none;}
section.waaromVW .waaromIMG.rightSide {margin:0; text-align:inherit;width: 100%;}
section.waaromVW .waaromIMG.leftSide {margin:0; text-align:inherit;width: 100%;}
/*section{padding:50px 0}*/
section.first{padding-top:75px}
.navbar-logo{padding:7px 15px 10px}
.navbar-logo img{max-height:35px}
.platform .col-sm-4{max-width:300px;margin:auto}
.contact p{font-size:16px}
}
@media(max-width:620px) {.laptop-slider { height: 300px;}}
@media(max-width:480px) {
.slider-laptop h2 { font-size: 1.6em;}
.laptop-slider { height: 250px;}
.banner-home {height:420px; background-position: bottom center; }
.banner-home .container .col-lg-12{text-align:center; padding:0; }
.text-home{padding:10px;width:100%;max-width:inherit}
.intro-home { margin: 42px auto 0 auto; max-width:100%; padding: 10px;}
.banner-product {padding-bottom:35%}
.video-product { max-width: 98%; margin-top: -50%;}
section.usps h1, section.usps h2 { font-size: 22px;}
section.usps p.intro { font-size: 16px; }
.text-button-home { padding: 0; margin:auto;}
.app-download-bar { background-image:url(/image/frontend/apps-banner-bg-mobile.jpg); background-position: center center;}
.app-store-icons { text-align: center;}
.app-download-bar .text {float:none; padding: 0;
max-width: 230px; width: 100%; text-align: center; margin-right: 8%; display: block; margin: auto;}
.app-download-bar .text-right {text-align:center}
.intro-home h1{font-size:1.4em; }
section.waaromVW h2{font-size:2em; padding-bottom: 25px;}
.testimonials h2{font-size:2em; text-align:center;}
.testimonials img { text-align: center; display: inline-block; margin-bottom: 20px;}
.contact h2{font-size:2em}
.footer-logo{float:none;margin-right:10px;margin-top:0;display:inherit;margin-bottom:20px}
section.waaromVW h2.demo{width:221px;margin:auto}
.banner-home { background-image:url(/image/frontend/home-hero-vw-mobile.jpg); background-position: bottom center; height:468px}
}