/* iphone styles */

body
{
margin:0;
font-family:Helvetica;
background:#FFF;
color:#000;
overflow-x:hidden;
-webkit-user-select:none;
-webkit-text-size-adjust:none;
}

body >*:not(.toolbar)
{
display:none;
position:absolute;
margin:0;
padding:0;
left:0;
top:45px;
width:100%;
min-height:372px;
}

body[orient="landscape"] >*:not(.toolbar)
{
min-height:268px;
}

body >*[selected="true"]
{
display:block;
}







a[selected],a:active
{
background-color:#194fdb !important;
background-image:url(default/listArrowSel.png),url(default/selection.png) !important;
background-repeat:no-repeat,repeat-x;
background-position:right center,left top;
color:#FFF !important;
}

a[selected="progress"]
{
background-image:url(default/loading.gif),url(default/selection.png) !important;
}

body >.toolbar
{
box-sizing:border-box;
-moz-box-sizing:border-box;
border-bottom:1px solid #111111;
border-top:1px solid #333333;
padding:10px;
height:24px;
background:#222222;
}

.toolbar >h1
{
position:absolute;
overflow:hidden;
left:50%;
margin:1px 0 0 -75px;
height:45px;
font-size:20px;
width:150px;
font-weight:bold;
text-shadow:rgba(0,0,0,0.4) 0px -1px 0;
text-align:center;
text-overflow:ellipsis;
white-space:nowrap;
color:#eeeeee;
}

body[orient="landscape"] >.toolbar >h1
{
margin-left:-125px;
width:250px;
}

.button
{
position:absolute;
overflow:hidden;
top:8px;
right:6px;
margin:0;
border-width:0 5px;
padding:0 3px;
width:auto;
height:30px;
line-height:30px;
font-family:inherit;
font-size:12px;
font-weight:bold;
color:#FFF;
text-shadow:rgba(0,0,0,0.6) 0px -1px 0;
text-overflow:ellipsis;
text-decoration:none;
white-space:nowrap;
background:none;
-webkit-border-image:url(default/toolButton.png) 0 5 0 5;
}



body >ul >li
{
position:relative;
margin:0;
border-bottom:1px solid #E0E0E0;
padding:8px 0 8px 10px;
font-size:20px;
font-weight:normal;
list-style:none;
}

body >ul >li.group
{
position:relative;
top:-1px;
margin-bottom:-2px;
border-top:1px solid #7d7d7d;
border-bottom:1px solid #999999;
padding:1px 10px;
font-size:22px;
font-weight:bold;
text-shadow:rgba(0,0,0,0.4) 0 1px 0;
color:#000000;
}

body >ul >li.group:first-child
{
top:0;
border-top:none;
}

body >ul >li >a
{
display:block;
margin:-8px 0 -8px -10px;
padding:8px 0 8px 10px;
text-decoration:none;
color:inherit;
background:url(default/listArrow.png) no-repeat right center;
}




#preloader
{
display:none;
background-image:url(default/loading.gif),url(default/selection.png), url(default/rightButton.png),url(default/listArrowSel.png),url(default/listGroup.png);
}







#buttonBack
{
//display:none;
left:6px;
right:auto;
padding:0;
max-width:55px;
border-width:0 8px 0 14px;
-webkit-border-image:url(default/buttonBack.png) 0 8 0 14;
}

#buttonHome
{
//display:none;
left:auto;
right:6px;
padding:0;
max-width:55px;
border-width:0 8px 0 14px;
-webkit-border-image:url(default/buttonHome.png) 0 8 0 14;
}











/* overrides */
a[selected="progress"] {background-image: url(default/loading.gif), none !important;}
fieldset > input { padding-left: 5px !important; }
.homeButton { position: absolute; }
body > toolbar { padding: 0px; line-height: 45px; }





/*  COLORS   */
body { background: #faf9f5; color: #444444; }
body > ul > li { background-color: #e4e2dc; border-top: 1px solid #DDDDDD; border-bottom: 1px solid #888888; }
body > ul > li.content { background-color: #faf9f5; border-top: 1px solid #DDDDDD; border-bottom: 2px solid #888888; margin-bottom: inherit; position: static; }
body > ul > li.handicaped { background-color: #a7a08b; border-top: 1px solid #555555; border-bottom: 1px solid #888888; margin-bottom: inherit; position: static; }
body > ul > li > a > img { vertical-align: middle; margin-right: 10px; border: none;}
a[target="_replace"] { color: #ff9900; background-color: #111111; }
body > .toolbar { border-bottom-color: #222222 !important; }
body > .toolbar, .dialog > fieldset { background-color: #a7a08b !important; border-top-color: #222222 !important; }
a[selected], a:active {color: #000000 !important; background-color: #a7a08b !important; background-image: url(default/listArrowSel.png), none !important;}




/* FONTS */
body > ul > li.content {font-size: 14px; color:#444444; }
body > ul > li.content >H1 {font-size: 18px; color:#000000; }
body > ul > li.content >H2 {font-size: 14px; color:#111111; }
body > ul > li.content >H3 {font-size: 12px; color:#222222; }
body > ul > li.content >H4 {font-size: 11px; color:#333333; }
body > ul > li.content >H5 {font-size: 11px; color:#999999; }
body > ul > li.content >B {font-size: 16px; color:#000000; }

body > ul > li.handicaped {font-size: 12px; color:#FFFFFF; }
body > ul > li.handicaped >H1 {font-size: 14px; color:#FFFFFF; }
body > ul > li.handicaped >H2 {font-size: 11px; color:#111111; }
body > ul > li.handicaped >H3 {font-size: 11px; color:#222222; }
body > ul > li.handicaped >H4 {font-size: 11px; color:#333333; }
body > ul > li.handicaped >H5 {font-size: 11px; color:#999999; }
body > ul > li.handicaped >B {font-size: 16px; color:#000000; }


.mediaName  { font-size: 16px; color:#444444; }
.mediaId  { font-size: 12px; color:#666666; }
.mediaDate  { font-size: 10px; color:#666666; }

.mediaHead  { font-size: 14px; color:#666666; }
.mediaInfo  { font-size: 14px; color:#FFFFFF; }