@viewport{
  width: extend-to-zoom;
   zoom: 1.0; 
}
@-ms-viewport{
  width: extend-to-zoom; 
   zoom: 1.0; 
}
html, body {font-size:100%; padding:0; margin:0; background:#fff; min-width:250px;}
 
pre, code {
-webkit-overflow-scrolling: touch;
}
#wrapper { }
header {height:80px; position:absolute; width:100%; top:0; left:0; background:#329cd2; z-index:100002; text-align:center; backface-visibility: hidden;}
.home header {background:#329cd2;}
.demos header {background:#e23b2d;}
.menus header {background:#ea851d;}
.opacity header {background:#9e6ba9;}
.explorer header {background:#8b37aa;}
.mozilla header {background:#1672bb;}
.layouts header {background:#ffc20f;}
.boxes header {background:#7cb447;}
@media (min-width:991px){
 #tutorial {padding-top:1 px;  }
}
@media (min-width:769px) and (max-width:990px){
 #tutorial {padding-top:220px; padding-bottom:30px;}
}
@media  (max-width:768px){
 #tutorial {padding-top:220px; padding-bottom:30px;}
}
.demoNav {height:40px; margin:20px auto; text-align:center;}
.prevDemo {font:normal 16px/40px 'latomedium', arial, sans-serif; color:#c00; text-decoration:none; display:inline-block; padding:0 0 0 20px; width:120px; text-align:left; background:url(/new-images/previous.gif) no-repeat left center;}
.prevDemo {*display:inline;}
.nextDemo {font:normal 16px/40px 'latomedium', arial, sans-serif; color:#c00; text-decoration:none; display:inline-block; padding:0 20px 0 0; width:120px; text-align:right; background:url(/new-images/next.gif) no-repeat right center;}
.nextDemo {*display:inline;}