/* jqt */
h1, h2 {
	text-shadow: rgba(255, 255, 255, .2) 0 1px 1px;
}
.toolbar {
	border-bottom-color: #000;
	background: #000000 url(img/toolbar2.png) repeat-x;
}

.toolbar > h1 {
	text-shadow: rgba(0,0,0,1) 0 -1px 1px;
	color: #fff;
}

.button, .back, .cancel, .add {
	color: #fff;
	text-shadow: rgba(0, 0, 0, 0.5) 0px -1px 0;
	-webkit-border-image: url(img/button2.png) 0 5 0 5;
}

.blueButton {
    -webkit-border-image: url(img/blueButton.png) 0 5 0 5;
}
.back {
	-webkit-border-image: url(img/back_button2.png) 0 8 0 14;
}

.back.active {
    -webkit-border-image: url(img/back_button_clicked.png) 0 8 0 14;
    color: #aaa;
}
.whiteButton {
    -webkit-border-image: url(img/whiteButton.png) 0 12 0 12;
    text-shadow: rgba(255, 255, 255, 0.7) 0 1px 0;
	color: #333;
}
.grayButton {
    -webkit-border-image: url(img/grayButton.png) 0 12 0 12;
    color: #FFFFFF;
}
.menu {color: #aaa;border-color: #333333;}
.menu > li {
    color: #666;
    border-top-color: #333;
    border-bottom-color: #555858;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4c4d4e), to(#404142));
}
.menu .arrow {
    background-image: url(img/chevron.png), -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4c4d4e), to(#404142));
}
.menu li.forward {
    background-image: url(img/chevron_circle.png), -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4c4d4e), to(#404142));
}
.menu > li > a, .menu > li.img > a + a {
    color: #fff;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.menu > li a.active {
    background-color: #53b401;
    color: #fff;
}
/* TODO: check to see if this style is needed
.menu > li a.button {}
*/
.menu > li a.active.loading {
    background-image: url(img/loading.gif);
}
.menu > li.arrow a.active {
    background-image: url(img/chevron.png);
}
.menu > li.forward a.active {
    background-image: url(img/chevron_circle.png);
}
.menu > li a + a {color: #000;}
.menu > li a + a + a,
.menu > li.img a + a + a + a,
.menu > li.img a + small + a + a + a {color: #666;}
.menu > li small {color: #64c114;}
.menu > li small.counter {color: #fff; background: rgba(0,0,0,.15); -webkit-box-shadow: rgba(255,255,255,.1) 0 1px 0;}
.form > li.error {border-color: red;}
.form > li input[type="text"],
.form > li input[type="password"],
.form > li textarea,
.form > li select {
    color: #777;
    background: transparent;
}
.form > li select {
	background-color: transparent;
	background-image: url(img/chevron.png);
}
/* TODO: figure out if this needs a color like the apple theme
.form > li input[type="checkbox"], .form > li input[type="radio"] {
	color: rgb(50,79,133);
}
*/
.form > li input[type="checkbox"]:after, ul > li input[type="radio"]:after {color: #777;}
.info {
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ccc), to(#aaa), color-stop(.6,#CCCCCC));
    text-shadow: rgba(255,255,255,.8) 0 1px 0;
    color: #444;
    border-top-color: rgba(255,255,255,.2);
}