/*modify the base font size for mobile devices*/
 body
{
    /*bumping up the font-sizes for higher res displays*/
    font-size:48%;
    
}

@media (max-width: 336px)
{
    body
    {
        font-size: 40%!important
    }
    article.helpMenu li a
    {
        height:2.25em;
        line-height:2.25em;
    }
	
}

/*for odd Android aspect ratios*/
@media (max-width: 385px) and (min-width:337px) and (max-height:520px)
{
    body
    {
        font-size: 48%!important;
    }
    article.helpMenu li a
    {
        height:2em;
        line-height:2em;
    }

}

@media (max-width:600px){
#TOC {
	background-size: auto 100%!important;
	background-position: center top;
}
#article1000{
	background-size: auto 100%!important;
	background-position: center top;
}
#article2000{
	background-size: auto 100%!important;
	background-position: center top;
}
#article9000{
	background-size: auto 100%!important;
	background-position: center top;
}
.cnt2000 .keyInfo{
	line-height: 0.2em;
	padding: 0;
	margin-top: 0;
	margin-bottom: 0.8em;
}
}

@media (max-height:1000px) 
{
 body
    {
        font-size:48%!important;
    }

  .helpMenu li a
    {
        height:2.5em;
        line-height: 2.5em;
    }
.cnt2000 img{
	width: 55%!important;
	margin: 0;
}

}
@media (max-height:900px) 
{
 body
    {
        font-size:45%!important;
    }
.cnt2000 img{
	width: 45%!important;
	margin: 0;
}

}
/*gradient for smartglass UI*/
body 
{
   /*gradient for smartglass UI*/
   background: -webkit-linear-gradient(top, #000000 50%, #323232); /* Safari and Chrome*/
   background: -moz-linear-gradient(top, #000000 50%, #323232);/*Firefox*/
   background: -ms-linear-gradient(top, #000000 50%, #323232);/*IE*/
}

/*if the element is a main menu or a sub menu hide the placeholder element to the right*/
.helpMenu .helpContent
{
    display: none;
}

article .helpContent
{
    height: 75%;
    background-color: transparent;
    padding: 0;
    margin: 0;
    position: absolute;
    top: 5em;
    left: 5%;
    width: 90%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    line-height:1;
}

article .contentPanel
{
    width: 96%;
    height: 100%;
    padding: 0px 2% 1em 2%;
    overflow:hidden;
}

article .helpContent
{
   top:7em;
   height: 65%;
}

.contentPanel .backLink
{
	background-position-x: 1em;
    background-position-y: 1em;
    /*need to resize the back button due the change in font size for retina displays*/
    background-size:75%;
    background-position:.15em .5em;
    height:2.5em;
    width:2.5em;
    float: left;
    margin: 0px;
}

/*note you must re-initialize any background properties if you swap images*/
.contentPanel .backLink:focus
{
    background-position-x: 1em;
    background-position-y: 1em;
    background-size:75%;
    background-position:.15em .5em;
}

.articles article:not(.helpMenu) .articleTitle 
{
    margin-top: 1.9em;
    margin-left: .35em;
    height: 2.25em;
    
}

article .contentPanel .articleTitle
{
    margin-top:.25em;
    left: 2em; 
    display: block;
    width: 70%;
    max-height: 3.8em;
    overflow: hidden;  
}

article .contentPanel .navLinks
{
    clear: both;
}

.helpMenu li a
{
    height: 2.75em;
    line-height: 2.75em;
}

.cnt2000 img{
	width: 75%;
}


/*remove controller button states*/
.navLinks li:first-child a 
{
    border-top:none;
}
.navLinks a, .navLinks a:focus, .navLinks a:hover:not(:focus) 
{
   
    border:none;
    background-color: transparent;
    outline:0; 
    box-shadow:none; 
}

article .contentPanel .panelButtons
{
   display: none;
}

.pageCounter
{
   display:block;
   position:fixed;
   bottom:.15em;
   right:.5em;
}

/* contents */
.headCaption {
    margin:15px 0;
}
.arrowBlock img {
	width: 20px;
}
.imageBlock img{
	width: 45%;
	}	
/* BACKGROUNDS */
#TOC {
    background-image: url(img_common/bg/bg_main_mobile.jpg);
	background-size: 100% auto;
}
#article1000{
    background-image: url(img_common/bg/bg_10_mobile.jpg);
	background-size: 100% auto;
}
#article2000{
    background-image: url(img_common/bg/bg_20_mobile.jpg);
	background-size: 100% auto;
}
#article9000{
    background-image: url(img_common/bg/bg_90_mobile.jpg);
	background-size: 100% auto;
}