﻿/*modify the base font size for mobile devices*/
 body
{
    /*bumping up the font-sizes for higher res displays*/
    font-size:54%;
    
}

@media (max-width: 336px)
{
    body
    {
        font-size: 44%;
    }

    /*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: 44%;
    }

    /*article.helpMenu li a
    {
        height:2em;
        line-height:2em;
    }*/
   
}



body 
{

}

/*if the element is a main menu or a sub menu hide the placeholder element to the right*/
.helpMenu .helpContent
{
    display: none;
}

article .helpContent
{
    background-color: transparent;
    padding: 5px 0 5px 0;
    margin: 0;
    position: absolute;
    left: 6%;
    width: 88%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    line-height:1;
    top:7em;
   height: 78%;
}

article .contentPanel
{
    width: 96%;
    height: 100%;
    padding: 0px 2% 1em 2%;
    overflow:hidden;
}

article .helpContent
{

}

.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: 1em; 
    display: block;
    width: 90%;
    max-height: 3.8em;
    overflow: hidden;  
}

article .contentPanel .navLinks
{
    clear: both;
}

.helpMenu li a
{
    margin:-5px 0 0 -45px;
    padding:5px 25px 5px 45px; 
	height: 2.75em;
    line-height: 2.75em;
}

/*remove controller button states*/
.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;
}

.helpContent  .title
{
	display:block;
	font-size: 1.1em;
	font-weight: 700;
	margin: 0px 0 12px 0;
}

.helpContent .subtitle
{
	font-size: 1em;
	display:block;
	margin: 28px 0 12px 0;
}

.helpContent .stats
{
	display:block;
	margin: 4px 0 16px 0;
}

.helpContent ul
{
	margin: 5px 0 10px 0;
}
.helpContent li
{
	list-style-type:none;
	margin-left: 25px;
}



.helpContent .icon img
{
	display:inline;
	padding-right:0.5em;
	vertical-align: middle;
}

.helpContent .icon
{
	
	display:block;
}

#TOC .articleTitle 
{
	
	padding:.75em 0 1.2em 0;
	text-align:center;
}


article .contentPanel .articleTitle .articleTopic
{
	font-size: 1.2em;
	font-weight: 600;
	width: 100%;	
}

.helpContent .bigicon
{
	margin: 20px 0 0 0;
}

.helpContent .solo
{
	display:block;
}

li a:hover 
{
	color:#ffffff;
	background-image: url("textures/bg_selection_xs.png");
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.contentPanel a:focus
{
	color:#ffffff;
	background-image: url("textures/bg_selection_xs.png");
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

#fp_aurora
{
	display:none;/*hides the small Aurora*/
	visibility:hidden;
}

article .contentPanel .articleTitle .articleTopic
{
	font-size: 0.8em;
	height:1.5em;
	width: 100%;
	background-image: url("textures/col_top_line.png");
	background-repeat: no-repeat;	
	background-position: 50% 1.2em;
}
article
{
	background-image: url("textures/bg_top_left.png"),url("textures/bg_top_right.png"),url("textures/bg_bottom_left.png"), url("textures/bg_bottom_right.png");
	background-position: left top, right top, left bottom, right bottom;
	background-repeat: no-repeat;
	
}	