@color: #06c0f5;

/*
	06c0f5 = blue;
	faef06 = yellow;
*/
@pfad: "b";

/*
	i = yellow
	b = blue
	
*/

html, body {
  background:url("../i/bg.png");
  font:14px Arial, Helvetica, sans-serif;
  margin:0;
  width:100%;
}
a, a:visited {
  color:#316fa3;
}
a:hover {
  color:#4192d7;
}
.l-ftr {
  clear:both;
  color:#888;
  font-size:12px;
  margin:0 auto;
  padding:15px 0 30px;
  width:820px;
}
.l-hdr {
  background:#000;
  background: rgba(0,0,0,0.9);
  border-bottom:1px solid #333;
  height:60px;
  padding:20px 0 0;
  position:relative;
  z-index:10;
  top: 0;
}
.l-main {
  margin:0 auto;
  width:820px;
}
.l-social {
  background:#316fa3;
  clear:both;
  padding:20px 0 40px;
  text-align:center;
}
.l-top {
  height:560px;
  margin:0 auto;
  padding:50px 0 0;
  text-align:center;
  width:1000px;
  overflow: visible;
}

.btn, .btn:visited {
  background:#165181;
  border:1px solid #165181;
  border-bottom-color:#0f3656;
  border-radius:5px;
  box-shadow:inset 0 35px 45px -10px rgba(255,255,255,.25), inset 0 1px 0 rgba(255,255,255,.3), 0 1px 2px rgba(0,0,0,.3);
  color:#fff;
  cursor:pointer;
  float:left;
  font:bold 16px Arial, Helvetica, sans-serif;
  padding:10px 20px;
  text-decoration:none;
  text-shadow:0 1px 0 rgba(0,0,0,.5);
  vertical-align:middle;
  -moz-transition:400ms background-color, 400ms border-color;
  -o-transition:400ms background-color, 400ms border-color;
  -webkit-transition:400ms background-color, 400ms border-color;
  transition:400ms background-color, 400ms border-color;
}
.btn:hover {
  background:#3271a5;
  color:#fff;
}
.btn:active {
  background:#165181;
  border:1px solid #165181;
  border-top-color:#0f3656;
  box-shadow:inset 0 -25px 35px rgba(255,255,255,.15), inset 0 -1px 0 rgba(255,255,255,.3), inset 0 1px 1px rgba(0,0,0,.2);
}
.copy {
  color:#83a9c8;
  display:inline-block;
  font-size:12px;  
}
.faq-a {
  font-size:16px;
  line-height:22px;
  margin:1em 0 .5em;

}
.faq-q {
  color:#316fa3;
  cursor:pointer;
  font-size:19px;
  font-weight:normal;
  line-height:28px;
  text-decoration:underline;
}
.faq-title {
  font:300 28px/34px 'Open Sans', Arial, Helvetica, sans-serif;
  margin:0 0 20px;
}
.faq-wrap {
  float:left;
  margin:20px 0;
  width:400px;
}
.features {
  list-style:none none outside;
  margin:40px 0;
  overflow:hidden;
  padding:0;
}
.features-ico {
  background:url("../i/spr-icons.png") no-repeat;
  display:block;
  height:100px;
}
.features-ico-1 {
  background-position:50% 0;
}
.features-ico-2 {
  background-position:50% -100px;
}
.features-ico-3 {
  background-position:50% -300px;
}
.features-item {
  float:left;
  line-height:20px;
  margin:0 0 0 40px;
  text-align:center;
  width:245px;
}
.features-item:first-child {
  margin:0;
}
.features-title {
  color:#666;
  font-size:16px;
  font-weight:bold;
  margin:1em 0 .5em;
}
.features-wrap {
  background:#fff;
  border:1px solid #ccc;
  border-radius:50%;
  height:150px;
  margin:0 auto;
  padding-top:50px;
  width:200px;
  -moz-transition:400ms box-shadow;
  -o-transition:400ms box-shadow;
  -webkit-transition:400ms box-shadow;
  transition:400ms box-shadow;
}
.features-wrap:hover {
  border-color:#316fa3;
  box-shadow:inset 0 0 0 4px #316fa3;
}
.inner {
  margin:0 auto;
  position:relative;
  width:880px;
  z-index:2;
}
.logo, .logo-small {
  float:left;
  margin:5px 0 0;
}
.logo-small {
  display:none;
}
.main-title {
  font:300 33px/40px 'Open Sans', Arial, Helvetica, sans-serif;
  text-align:center;
}
.main-title-icon {
  background:url("../i/spr-global.png") no-repeat;
  display:inline-block;
  height:21px;
  margin:0 0 0 4px;
  vertical-align:middle;
  width:24px;
}
.menu {
  margin:0 auto;
  overflow:hidden;
  padding:0 10px;
  width:800px;
}
.menu-item, .menu-item:visited {
  color:#fff;
  display:inline-block;
  float:right;
  font:16px Arial, Helvetica, sans-serif;
  margin:10px 0 0 40px;
  text-decoration:none;
  text-shadow:0 -1px 0 #000;
  -moz-transition:400ms color;
  -o-transition:400ms color;
  -webkit-transition:400ms color;
  transition:400ms color;
}
.menu-item:hover,
.menu-item.active {
  color:@color;
}
.order {
  border-top:1px solid #ccc;
  clear:both;
  padding:40px 0;
  text-align:center;
}
.order-btn {
  vertical-align:middle;
}
.order-buy {
  display:inline-block;
  vertical-align:middle;
}
.order-hdr {
  font:300 26px/34px 'Open Sans', Arial, Helvetica, sans-serif;
  margin:0;
}
.order-p {
  font-size:16px;
  margin:5px 0 0;
}
.order-price {
  color:#f00;
  display:block;
  font-size:26px;
  margin:0 0 5px;
}
.order-txt {
  display:inline-block;
  margin:0 0 0 20px;
  text-align:left;
  vertical-align:middle;
}
.partners {
  border:1px solid #ccc;
  border-width:1px 0;
  clear:both;
  padding:20px 0;
  text-align:center;
}
.partners-logo {
  margin:0 10px;
  opacity:.5;
  vertical-align:middle;
  -moz-transition:400ms opacity;
  -o-transition:400ms opacity;
  -webkit-transition:400ms opacity;
  transition:400ms opacity;
}
.partners-logo:hover {
  opacity:1;
}
.pseudo-bg {
  height:690px;
  left:0;
  width:100%;
  position:absolute;
  top:0;
  z-index:1;
}
.share {
  margin:0 0 40px;
  text-align:center;
}
.share-lbl {
  margin:0 10px 0 0;
}
.social-hdr {
  color:#fff;
  font:300 26px/34px 'Open Sans', Arial, Helvetica, sans-serif;
  margin:0 0 20px;
}
.social {
  background:url("../i/spr-social.png") no-repeat;
  display:inline-block;
  height:50px;
  margin:0 15px 0;
  opacity:.25;
  width:49px;
  -moz-transition:500ms opacity;
  -o-transition:500ms opacity;
  -webkit-transition:500ms opacity;
  transition:500ms opacity;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=25)" !important;
  filter: alpha(opacity=25) !important;
}
.social:hover {
  opacity:1 !important;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)" !important;
  filter: alpha(opacity=100) !important;
}
.social-row {
  display:inline-block;
}
.social-fb {
  background-position:0 0;
  width:25px;
}
.social-vim {
  background-position:-50px 0;
}
.social-tw {
  background-position:-120px 0;
}
.social-rss {
  background-position:-190px 0;
}
.social-pcs {
  background-position:-260px 0;
}
.social-drb {
  background-position:-330px 0;
}
.social-lin {
  background-position:-400px 0;
}
.social-frst {
  background-position:-470px 0;
}
.social-pin {
  background-position:-540px 0;
}
.subscr {
  background:#fff;
  border:10px solid #316fa3;
  float:right;
  height:320px;
  margin:25px 0 40px;  
  position:relative;
  width:340px;  
}
.subscr-fields {	
  border:0;
  height:260px;
  left:0;	
  margin:0;
  padding:30px;
  position:absolute;    
  top:0;	
  width:280px;    
}
.subscr-input {
  border:1px solid #ccc;
  border-radius:5px;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.2);
  font-size:16px;
  font-weight:bold;
  margin:0 0 10px;
  padding:9px;
  width:260px
}
.subscr-lnk {
  float:right;
  margin-top:10px;
}
.subscr-done {
  display:none;	
}
.subscr-done-ico {
  background:url("../i/spr-global.png") -170px 0;
  display:inline-block;
  height:50px;
  width:54px;
}
.subscr-done-wrap {
  background:#316fa3;
  border-radius:50%;
  display:block;
  height:70px;
  margin:10px auto;
  padding:10px 0 0;
  text-align:center;
  width:80px;
}
.subscr-done-txt {
  color:#666;	
  font-size:14px;
  font-weight:normal;
  margin:10px 0 0;
  text-align:center;
}
.subscr-title {
  color:#000;
  font:300 26px/34px 'Open Sans', Arial, Helvetica, sans-serif;
  text-align:center;
}
.subscr-txt {
  color:#666;
  font-size:12px;
  line-height:17px;
  margin:15px 0 20px;
}
.top-title {
  color:#fff;
  font: normal 45px 'Open Sans', Arial, Helvetica, sans-serif; line-height:50px;
  position:relative;
  z-index:2;
}
.top-txt {
  color:#fff;
  font-size:19px;
  margin:.5em 0 1em;
  position:relative;
  z-index:2;
}
.top-wrap {
  height:140px;
}
.touchslider {
  background:url("../i/bg-tablet.png") no-repeat;
  height:419px;
  margin:0 auto;
  padding:52px 84px 78px 94px;
  position:relative;
  text-align:left;
  width:556px;
  z-index:10;
}
.touchslider:after, .touchslider:before {
  bottom:130px;
  content:'';
  display:block;
  position:absolute;
  z-index:50;
}
.touchslider:after {
  background:url("../i/bg-hand-right.png") no-repeat;
  height:271px;
  right:-173px;
  width:283px;
}
.touchslider:before {
  background:url("../i/bg-hand-left.png") no-repeat;
  height:202px;
  left:-96px;
  width:216px;
}
.touchslider-item {
  display:block;
  height:419px;
  overflow:hidden;
}
.touchslider-nav-item {
  background:url("../i/spr-global.png") -8px -24px no-repeat;
  cursor:pointer;
  display:inline-block;
  height:8px;
  margin:10px 0 0;
  width:8px;
}
.touchslider-nav-item-current {
  background-position:0 -24px;
}
.touchslider-next, .touchslider-prev {
  background:url("../i/spr-global.png") no-repeat;
  cursor:pointer;
  height:50px;
  opacity:.5;
  position:absolute;
  top:75px;
  width:50px;
  -moz-transition:400ms opacity;
  -o-transition:400ms opacity;
  -webkit-transition:400ms opacity;
  transition:400ms opacity;
}
.touchslider-next:hover, .touchslider-prev:hover {
  opacity:1;
}
.touchslider-next {
  background-position:-75px 0;
  right:-50px
}
.touchslider-prev {
  background-position:-25px 0;
  left:-50px
}
.touchslider-viewport {
  height:419px;
  overflow:hidden;
  width:558px;
}
.tweets {
  border-top:1px solid #83a9c8;
  color:#fff;
  margin:20px 0 0;
  overflow:hidden;
  padding:20px 0 0;
}
.tweets a {
  color:#fff;
}
.tweets-ask {
  font-size:19px;
  font-weight:normal;
  margin:0 0 5px;;
}
.tweets-left {
  float:left;
  text-align:left;
  width:450px;
}
.tweets-right {
  color:#fff;
  float:right;
  font-size:12px;  
  margin:0 0 0 60px;
  position:relative;
  text-align:left;
  width:320px;	  
}
.tweets-right:before {
  background:url("../i/spr-global.png") -130px 0 no-repeat;
  content:'';
  display:inline-block;
  height:27px;
  left:-45px;
  position:absolute;
  top:0;
  width:33px;
}
.tweets-time {
  font-size:11px;
  margin:5px 0 0;
}
/*
@media (max-width:820px) {
  .l-ftr {
    font:300 15px 'Open Sans', Arial, Helvetica, sans-serif;
    padding:0 5% 3%;
    text-align:center;
    width:90%;
  }
  .l-top {
    background:#0c1220;
    padding:50px 5% 0;
    width:90%;
  }
  .btn {
    float:none;
    font-size:20px;
    padding:10px 0;
    width:84%;
  }
  .faq-title {
    text-align:center;
    font-size:35px;
  }
  .faq-wrap {
    background:#fff;
    border-top:2px solid #ccc;
    float:none;
    margin:0 -5%;
    padding:20px 5%;
    width:100%;
  }
  .faq-a, .subscr-txt {
    font:300 20px 'Open Sans', Arial, Helvetica, sans-serif;
  }
  .faq-q, .subscr-title, .social-hdr {
    font:300 30px 'Open Sans', Arial, Helvetica, sans-serif;
  }
  .features {
    margin-bottom:0;
  }
  .features-item, .features-item:first-child {
    float:none;
    font:300 25px 'Open Sans', Arial, Helvetica, sans-serif;
    margin:0 0 5%;
    text-align:left;
    overflow:hidden;
    width:100%;
  }
  .features-title {
    font-size:30px;
    margin-top:0;
  }
  .features-wrap {
    float:left;
    margin:0 5% 0 0;
    width:202px;
  }
  .logo {
    display:none;
  }
  .logo-small {
    display:block;
  }
  .l-main, .inner, .menu {
    padding:0 5%;
    width:90%;
  }
  .order-btn {
    display:block;
    width:100%;
  }
  .order-price {
    display:block;
    font-size:40px;
    margin-bottom:3%;
  }
  .order-txt {
    display:block;
    margin-top:5%;
    text-align:center;
  }
  .pseudo-bg {
    display:none;
  }
  .share {
    display:none;
  }
  .social-row {
    display:block;
    margin-bottom:5%;
  }
  .subscr {
    border-left:0;
    border-right:0;
    height:360px;
    margin:0 -5%;
    padding:20px 5%;
    text-align:center;
    width:100%;
  }
  .subscr-done-txt {
  font:300 20px 'Open Sans', Arial, Helvetica, sans-serif;
  }
  .subscr-fields {
    height:80%;
    padding:5%;
    width:90%	
  }
  .subscr-input {
    display:block;
    margin:0 auto 20px;
    padding:2%;
    width:80%;
  }
  .subscr-lnk {
    display:block;
    float:none;
  }
  .top-wrap {
    height:auto;
  }
  .touchslider {
    background:none;
    border:5px solid #333;
    border-radius:10px;
    box-shadow:0 5px 10px rgba(0,0,0,.5);
    height:auto;
    margin:0 auto;
    padding:0;
    max-width:98%;
    width:558px;
  }
  .touchslider:before, .touchslider:after {
    display:none;
  }
  .touchslider-item {
    text-align:center;
  }
  .touchslider-nav-item {
    display:none;
  }
  .touchslider-next, .touchslider-prev {
    bottom:-70px;
    top:auto;
  }
  .touchslider-next {
    left:auto;
    right:35%;
  }
  .touchslider-prev {
    left:35%;
    right:auto;
  }
  .touchslider-viewport {
    width:100%;
  }
  .tweets-left, .tweets-right {
    float:none;
    margin-top:3%;
    text-align:center;
    width:100%;
  }
  .tweets-right {
    display:none;
  }
}
*/

/* Individual */

@font-face {
    font-family: 'u.s._101regular';
    src: url('../fonts/us101-webfont.eot');
    src: url('../fonts/us101-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/us101-webfont.woff') format('woff'),
         url('../fonts/us101-webfont.ttf') format('truetype'),
         url('../fonts/us101-webfont.svg#u.s._101regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MyriadProRegular';
    src: url('../fonts/myriadpro-regular.eot');
    src: url('../fonts/myriadpro-regular.eot') format('embedded-opentype'),
         url('../fonts/myriadpro-regular.woff') format('woff'),
         url('../fonts/myriadpro-regular.ttf') format('truetype'),
         url('../fonts/myriadpro-regular.svg#MyriadProRegular') format('svg');
}

.clear{clear: both;}

.slide{display:block; overflow: hidden; width:556px; height:419px; /*margin:52px 84px 78px 94px;*/ position:absolute; z-index:1;}
.glossy{background: url(../i/glossy.png) no-repeat; width:289px; height: 653px; position:absolute; right:23px; top: 0; z-index:100; display:block;}

.l-content{width: 1000px; display: block; margin: 140px auto 0 auto;}
.in-the-middle{width: 1000px; display:block; margin: 0 auto;}

#slider{width: 1003px; display: block; position:relative; z-index: 2;}

#slider .hand-left{ width:216px; position:absolute; background: url(../i/bg-hand-left.png) no-repeat; height:202px; z-index:2; top: 217px; left:0;}
#slider .ipad{ width:557px; position: absolute; left: -119px; background: url(../i/bg-tablet.png) no-repeat; height:419px; z-index:1; left:96px; padding: 51px 84px 79px 93px;}
#slider .hand-right{ width: 283px; position: absolute; left:-110px;background: url(../i/bg-hand-right.png) no-repeat; height:271px; left:720px;z-index:2; top:148px;}

.slider{display: block; overflow: visible; width:557px; height:419px; background:#343434;}

.cool-font{font-family: 'u.s._101regular'; font-size: 32px; color:white; line-height:32px;}

h2{font: normal 30px 'MyriadProRegular'; border-bottom: solid #bfbfbf 1px; padding: 50px 131px 0 131px; line-height: 40px; color:#060404; text-align: center; margin: 0 0 20px 0;}

dl.vorteile{float: left; display: inline; width: 229px; margin: 0 25px 0 0;}
.nomargin{margin:0 !important;}
.different-icon{margin-left: 130px !important;}

dl.vorteile dt{background: url("../@{pfad}/icons.png") no-repeat top; height: 229px;}
dl.vorteile dt.adka-1{background-position: 0 -1374px;}
dl.vorteile dt.adka-2{background-position: 0 -1145px;}
dl.vorteile dt.ad-3{background-position: 0 -916px;}
dl.vorteile dt.ad-4{background-position: 0 -687px;}
dl.vorteile dt.ad-5{background-position: 0 -458px;}
dl.vorteile dt.ad-6{background-position: 0 -229px;}
dl.vorteile dt.ad-7{background-position: 0 0;}

dl.vorteile dd{font: normal 15px 'MyriadProRegular'; width: 189px; text-align:center; color:#060404; padding: 0 20px; margin: 0;}

#price{display: block; position:relative; z-index:1; height:493px;}
#price .add-1{ width: 229px; background: url("../@{pfad}/add-1.png") no-repeat; height: 395px; position:absolute; bottom:0; left:155px;}
#price .add-2{ width: 229px; background: url("../@{pfad}/add-2.png") no-repeat; height: 442px; position:absolute; bottom:0; left:384px;}
#price .add-3{ width: 229px; background: url("../@{pfad}/add-3.png") no-repeat; height: 493px; position:absolute; bottom:0; left:613px;}

h3{padding: 33px 0 0 0; text-align:center;font-family: 'u.s._101regular'; font-size: 25px; color:white; line-height:25px; margin: 0 0 100px;}

ul.white{padding: 0 40px;}
ul.white li{color: white; list-style-type:none; font: normal 12px 'MyriadProRegular'; border-bottom: solid #464646 1px; line-height: 30px;}

#price a{background: url("../@{pfad}/request-button.png") no-repeat; width: 183px; height:60px; position:absolute; bottom: 50px; text-indent:-2000px; left:23px; bottom: 23px;}

.kontakt{ margin: 0 auto; background: url(../i/kontakt.png) no-repeat; width:714px; height:229px; display: block; }

.kontakt .kontakt-first{float: left; display:inline; margin: 0 0 0 224px; width:295px;}
.kontakt .kontakt-second{float: left; display: inline; width: 195px;}

#sendMail{margin: 47px 0 0 0;}

#sendMail input[type="text"]{background: #fafafa; 

    border:solid 1px #fafafa;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -moz-box-shadow: 2px -2px 10px #000000;
    -webkit-box-shadow: 2px -2px 10px #000000;
    box-shadow: 2px -2px 10px #000000;
	
	margin: 0 0 12px 0;
	height: 36px;
	line-height: 36px;
	padding: 0 0 0 14px;
	width:243px;
}

#sendMail input[type="submit"]{background: url("../@{pfad}/request-button.png") no-repeat; width: 183px; height:60px; display: block; border: 0; padding:0; text-indent: -2000px; margin: 0; position:relative; left:-10px;}
.kontakt .kontakt-second{margin: 68px 0 0 0;}
.kontakt .kontakt-second h4{font: normal 20px 'u.s._101regular'; color:white; line-height: 20px;}
.kontakt .kontakt-second p{margin: 0; color: white; font: normal 13px 'MyriadProRegular';}
.kontakt .kontakt-second a{color: @color; font: normal 13px 'MyriadProRegular';}

#footer{background: url(../i/footer.gif) repeat-x; height:207px; margin: 50px auto 0 auto; width: 100%; padding: 10px 0 0 0;}
#footer .auto{width: 1000px; margin: 0 auto; color: white;}
#footer .auto .content{margin: 0 0 0 162px; font: normal 13px 'MyriadProRegular';}
#footer .auto .content .logo{font: bold 30px Arial Black, Gadget, sans-serif; color:@color; float: none;}
#footer .auto .content .logo span{color: white; font: normal 30px Arial, Helvetica, sans-serif; color: white;}

#footer p.big{font: normal 24px 'MyriadProRegular';}
#footer p a{color: @color; font: normal 13px 'MyriadProRegular';}

#footer p.big span{font: normal 13px 'MyriadProRegular';}

body{position: relative; z-index:1;}
/*.l-top{margin-top: 80px;}*/
.l-hdr{position: fixed; width:100%;}

#header{-webkit-box-shadow:  2px 5px 10px 10px rgba(0, 0, 0, 0.2);
        box-shadow:  2px 5px 10px 10px rgba(0, 0, 0, 0.2);}
		
.pseudo-bg{top:-81px;}

.waypoint-content{margin: 80px 0 0 0;}

.blink_me {
    animation-name: blinker;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;

    -webkit-animation-name: blinker;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
}

@-moz-keyframes blinker {  
    0% { border-color: @color; box-shadow: inset 0px 0px 10px #888,0px 0px 10px @color;}
    50% { border-color: #000; box-shadow: none; }
    100% { border-color: @color; box-shadow: inset 0px 0px 10px #888,0px 0px 10px @color;}
}

@-webkit-keyframes blinker {  
    0% { border-color: @color;box-shadow: inset 0px 0px 10px #888,0px 0px 10px @color;}
    50% { border-color: #000; box-shadow: none;}
    100% { border-color: @color;box-shadow: inset 0px 0px 10px #888,0px 0px 10px @color; }
}

@keyframes blinker {  
    0% { border-color: @color; box-shadow: inset 0px 0px 10px #888,0px 0px 10px @color;}
    50% { border-color: #000; box-shadow: none;}
    100% { border-color: @color; box-shadow: inset 0px 0px 10px #888,0px 0px 10px @color;}
}