﻿body
{
    width: 480px;
}

.contentPanel .articleTitle
{ 
    height: 2.5em;

    width: 100%;
    overflow: hidden;
    margin-top:8px;
}


/*if the element is a main menu or a sub menu hide the placeholder element to the right*/
.helpMenu .helpContent
{
    display: none;
}

nav.contentPanel
{
    /*padding: 64px 64px 64px 28px;*/
	padding: 32px 64px 48px 28px;
}

/*if in snapped we need to modify the positioning scheme to allow us to insert the contents between existing nav elements*/
article .helpContent
{
    height: 616px;
    overflow: hidden;
    background-color: transparent;
    padding: 0 0 0 28px;
    position: absolute;

    left: 0px;
    /*top: 10em;*/
	top: 8em;
    /*column-width: 424px;*/
    column-width:384px;
}



article .contentPanel
{
    height: 100%;
}

article .contentPanel .panelButtons
{
   left: 28px; /* safe region area on the right side: 480 - 28 - 386 ~ 64px */
}

/*in snapped the safe area is on the right so these need to be different than in main.css*/
.helpMenu li a
{
    margin:0px -26px 0 -26px;
    padding:9px 60px 8px 26px;
}

.contentPanel a:focus
{
	
}

.helpContent  .title
{
	display:block;
	margin: 14px 0 5px 0;
	
}

.helpContent .subtitle
{
	display:block;
	margin: 14px 0 5px 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
{
	vertical-align: middle;
	display:inline;
	padding-right:0.5em;
	
}

.helpContent .icon
{
	
	display:block;
}




article .contentPanel .articleTitle .articleTopic
{
	font-size: 0.75em;
	height:1.5em;
	width: 100%;
	background-image: url("textures/col_top_line.png");
	background-repeat: no-repeat;	
	background-position: 50% 1.2em;
}

.helpContent .bigicon
{
	margin: 20px 0 0 0;
}

.helpContent .solo
{
	display:block;
}
#TOC .fp_logo
{
	/*display:block;
	height:100px;
	width:100%;
	background-image: url("textures/col_logo.png");
	background-repeat: no-repeat;
	background-position: top left;
	background-size: 100%;*/
}

#TOC .articleTitle 
{
	
	padding:.75em 0 1.2em 0;
	text-align:center;
}

li a:hover 
{
	color:#ffffff;
	background-image: url("textures/bg_selection_xs.png");
	background-repeat: no-repeat;
}

.contentPanel a:focus
{
	color:#ffffff;
	background-image: url("textures/bg_selection_xs.png");
	background-repeat: no-repeat;
}

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;
	
}	