h1, h2 {font: bold 18px Helvetica;text-shadow: rgba(255,255,255,.2) 0 1px 1px;color: #000;margin: 10px 20px 5px;}

/* @group Toolbar */
.toolbar {padding: 10px;height: 20px;background: #444444;position: relative;margin:0 0 8px;}
.black-translucent .toolbar {margin-top: 20px;}
.toolbar > h1 {position: absolute;overflow: hidden;left: 50%;top:12px;margin: 1px 0 0 -75px;font-size:14px;text-transform:uppercase;width: 150px;line-height:14px;font-weight: bold;text-align: center;text-overflow: ellipsis;white-space: nowrap;color: #fff;}
body.landscape .toolbar > h1 {margin-left:-125px;width:250px;}
.toolbar > h1.logo {margin: 1px 0 0 0;text-align:left;left:0;}
body.landscape .toolbar > h1.logo {margin-left:8px;}
.button, .back, .cancel, .add {position: absolute;overflow: hidden;top: 3px;right: 10px;margin: 0;border-width:0 5px;padding:0 3px;width:auto;height:30px;line-height:30px;
  font-size: 12px;font-weight: bold;color: #fff;text-overflow: ellipsis;text-decoration: none;white-space: nowrap;background: none;-webkit-border-image: url(../images/button.png) 0 5 0 5;}
.blueButton {-webkit-border-image: url(../images/blueButton.png) 0 5 0 5;border-width: 0 5px;}
.back {height:auto;line-height:inherit;left:2px;right:auto;padding:10px 0 10px 4px;max-width:54px;font-size:11px;border-width: 0 8px 0 14px;-webkit-border-image: url(../images/back_button.png) 0 8 0 14;}
.back.active {-webkit-border-image: url(../images/button.png) 0 5 0 5;color: #aaa;}
.leftButton, .cancel {left: 6px;right: auto;}
.add {font-size: 24px;line-height: 24px;font-weight: bold;}
.whiteButton, .grayButton {display: block;border-width: 0 12px;padding: 10px;text-align: center;font-size: 20px;font-weight: bold;text-decoration: inherit;color: inherit;}
.whiteButton {-webkit-border-image: url(../images/whiteButton.png) 0 12 0 12;text-shadow: rgba(255, 255, 255, 0.7) 0 1px 0;}
.grayButton {-webkit-border-image: url(../images/grayButton.png) 0 12 0 12;color: #FFFFFF;}
/* @end */

/* @group Lists */
h1 + ul, h2 + ul, h3 + ul, h4 + ul, h5 + ul, h6 + ul {margin-top: 0;}
ul {color: #aaa;font-size:16px;font-family:"Trebuchet MS",Arial;padding: 0;}
ul.rounded {-webkit-border-radius: 8px;-webkit-box-shadow: rgba(0,0,0,.3) 1px 1px 3px;}
ul.rounded li:first-child, ul.rounded li:first-child a {border-top: 0;-webkit-border-top-left-radius: 8px;-webkit-border-top-right-radius: 8px;}
ul.rounded li:last-child, ul.rounded li:last-child a {-webkit-border-bottom-left-radius: 8px;-webkit-border-bottom-right-radius: 8px;}
#middle ul li {color: #666;list-style-type: none;border-bottom:1px solid #ABABAB;overflow: hidden;padding:10px;}
ul li.arrow {background-image: url(../images/chevron.png), -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4c4d4e), to(#404142));background-position: right center;background-repeat: no-repeat;}
ul li.forward {background-image: url(../images/chevron_circle.png), -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4c4d4e), to(#404142));background-position: right center;background-repeat: no-repeat;}

/* universal links on list */
#middle ul li a, #middle li.img a + a {color: #C40A42;text-decoration: none;white-space: nowrap;overflow: hidden;display: block;padding: 16px 0 16px 10px;margin: -10px;-webkit-tap-highlight-color: rgba(0,0,0,0);}
ul li a.active, ul li a.button {background:#C40A42 url(../images/puce05.png) no-repeat 98% 50%;color:#fff !important;}
ul li a.active.loading {background:#fff url(../images/loading.gif) 95% center no-repeat;background-color: rgba(0,0,0,1);}
ul li.arrow a.active {background:#C40A42 url(../images/puce05.png) no-repeat 98% 50%;color:#fff;}
ul li.forward a.active {background:#C40A42 url(../images/puce05.png) no-repeat 98% 50%;color:#fff;}
ul li.img a + a {margin: -10px 10px -20px -5px;font-size: 17px;font-weight: bold;}
ul li.img a + a + a {font-size: 14px;font-weight: normal;margin-left: -10px;margin-bottom: -10px;margin-top: 0;}
ul li.img a + small + a {margin-left: -5px;}
ul li.img a + small + a + a {margin-left: -10px;margin-top: -20px;margin-bottom: -10px;font-size: 14px;font-weight: normal;}
ul li.img a + small + a + a + a {margin-left: 0px !important;margin-bottom: 0;}
ul li a + a {color: #000;font: 14px Helvetica;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;display: block;margin: 0;padding: 0;}
ul li a + a + a, ul li.img a + a + a + a, ul li.img a + small + a + a + a {color: #666;font: 13px Helvetica;margin: 0;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;display: block;padding: 0;}
/* @end */

/* @group Forms */
ul.form li {padding: 7px 10px;}
ul.form li.error {border: 2px solid red;}
ul.form li.error + li.error {border-top: 0;}
ul li input[type="text"], ul li input[type="password"], ul li textarea, ul li select {color: #777;background: transparent url(../.png);border: 0;font: normal 17px Helvetica;padding: 0;display: inline-block;margin-left: 0px;width: 100%;-webkit-appearance: textarea;}
ul li textarea {height: 120px;padding: 0;text-indent: -2px;}
ul li select {text-indent: 0px;background: transparent url(../images/chevron.png) no-repeat right center;-webkit-appearance: textfield;margin-left: -6px;width: 104%;}
ul li input[type="checkbox"], ul li input[type="radio"] {margin: 0;padding: 10px 10px;}
ul li input[type="checkbox"]:after, ul li input[type="radio"]:after {content: attr(title);font: 17px Helvetica;display: block;width: 246px;color: #777;margin: -12px 0 0 17px;}
/* @end */

/* @group Mini Label */
ul li small {color: #64c114;font: 17px Helvetica;text-align: right;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;display: block;width: 23%;float: right;padding: 0;}
ul li.arrow small {padding: 0 15px;}
ul li small.counter {font-size: 17px;line-height: 13px;font-weight: bold;background: rgba(0,0,0,.15);color: #fff;-webkit-border-radius: 11px;padding: 4px 10px 5px 10px;display: block;
  width: auto;margin-top: -22px;-webkit-box-shadow: rgba(255,255,255,.1) 0 1px 0;}
ul li.arrow small.counter {margin-right: 15px;}
/* @end */

/* @group Individual */
ul.individual {border: 0;background: none;clear: both;overflow: hidden;padding-bottom: 3px;-webkit-box-shadow: none;}
ul.individual li {background: #4c4d4e;border: 1px solid #333;font-size: 14px;text-align: center;-webkit-border-radius: 8px;-webkit-box-sizing: border-box;width: 48%;float: left;display: block;
  padding: 11px 10px 14px 10px;-webkit-box-shadow: rgba(0,0,0,.2) 1px 1px 3px;background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4c4d4e), to(#404142));}
ul.individual li + li {float: right;}
ul.individual li a {color: #fff;line-height: 16px;margin: -11px -10px -14px -10px;padding: 11px 10px 14px 10px;-webkit-border-radius: 8px;}
/* @end */

/* @group Toggle */
.toggle {width: 94px;position: relative;height: 27px;display: block;overflow: hidden;float: right;}
.toggle input[type="checkbox"]:checked {left: 0px;}
.toggle input[type="checkbox"] {-webkit-appearance: textarea;-webkit-border-radius: 5px;-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-transition: left .15s;background-color: transparent;
  background: #fff url(../images/on_off.png) 0 0 no-repeat;border: 0;height: 27px;left: -55px;margin: 0;overflow: hidden;position: absolute;top: 0;width: 149px;}
/* @end */

/* @group Edge to edge */
ul.edgetoedge {border-width: 1px 0;margin: 0;padding: 0;}
ul.edgetoedge li {background:url(../images/puce01.gif) no-repeat 98% 50%;border-bottom:1px solid #ABABAB;font-size:16px;}
ul.edgetoedge li.sep {background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,0)), to(rgba(0,0,0,1)));border-bottom: 1px solid #111113;border-top: 1px solid #666;color: #3e9ac3;
  font-size: 16px;margin: 1px 0 0 0;padding: 2px 10px;text-shadow: #000 0 1px 0;}
ul.edgetoedge li em {font-weight: normal;font-style: normal;}
/* @end */

/* @group Plastic */
#plastic {background: #17181a;}
ul.plastic {background: #17181a;color: #aaa;font: bold 18px Helvetica;margin: 0;padding: 0;border-width: 0 0 1px 0;}
ul.plastic li {border-width: 1px 0;border-style: solid;border-top-color: #222;border-bottom-color: #000;color: #666;list-style-type: none;overflow: hidden;padding: 10px 10px 10px 10px;}
ul.plastic li a.active.loading {background:#fff url(../images/loading.gif) 95% center no-repeat;}
ul.plastic li small {color: #888;font-size: 13px;font-weight: bold;line-height: 24px;text-transform: uppercase;}
ul.plastic li:nth-child(odd) {background-color: #1c1c1f;}
ul.plastic li.arrow {background-image: url(../images/chevron.png);background-position: right center;background-repeat: no-repeat;}
ul.plastic li.arrow a.active {background-image: url(../images/chevron.png);background-position: right center;background-repeat: no-repeat;}
ul.plastic li.forward {background-image: url(../images/chevron_circle.png);background-position: right center;background-repeat: no-repeat;}
ul.plastic li.forward a.active {background-image: url(../images/chevron_circle.png);background-position: right center;background-repeat: no-repeat;}

/* @group Metal */
ul.metal {border-bottom: 0;border-left: 0;border-right: 0;border-top: 0;margin: 0;}
ul.metal li {background-image: none;border-top: 1px solid #fff;border-bottom: 1px solid #666;font-size: 26px;background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(238,238,238,1)), to(rgba(156,158,160,1)));}
ul.metal li a {line-height: 26px;margin: 0;text-shadow: #fff 0 1px 0;padding: 13px 0;}
ul.metal li a em {display: block;font-size: 14px;font-style: normal;color: #444;width: 50%;line-height: 14px;}
ul.metal li a.active {color: rgb(0,0,0);}
ul.metal li small {float: right;position: relative;margin-top: 10px;font-weight: bold;}
ul.metal li.arrow {background-image: url(../images/chevron.png), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(238,238,238,1)), to(rgba(156,158,160,1)));background-repeat: no-repeat;background-position: right center;}
ul.metal li.arrow a small {padding-right: 15px;line-height: 17px;}
/* @end */