﻿/*
   This is the StatePoint Media Advanced Feed CSS File for the Article Viewer.

   IMPORTANT: AFTER CUSTOMIZING THE CSS FILE AS DESIRED, UPLOAD IT AS A STAND-ALONE FILE IN A DIRECTORY ON YOUR WEBSITE. 
    
      After uploading this CSS File you MUST reference it within the code of the Web page on which you are inserting 
      the Article Viewer. This code reference should resemble the following line of code, with your web address 
      and CSS File location inserted into the appropriate places: 

      <link rel="stylesheet" type="text/css" href="http://Your_Site_Name.com/Your_CSS_File_Location/ArticleViewer.css"> 
     
      For example, if your site URL is MySite.com and your CSS File is in a directory called styles, the code would read:
      <link rel="stylesheet" type="text/css" href="http://MySite.com/styles/ArticleViewer.css">


   TO CHANGE THE WIDTH OF ARTICLES: Change the pixel width in the section called '#spmViewerMainArticleContainer.' 
  

   TO CHANGE THE WIDTH OF PHOTOS: You must change the pixel width in TWO sections for photos to appear correctly. 
   You must change it in both '#spmViewerArticlePhotos' and in '#spmViewerArticlePhotos img.' 
   The pixel value needs to be the same in BOTH sections. 

   
   IMPORTANT: BOTH OF THESE PHOTO SECTIONS ARE REQUIRED FOR PHOTOS TO APPEAR CORRECTLY. 
*/


#spmViewerArticleTitle
{
    padding-bottom: 20px;
	font-weight:bold;
	font-size: 12pt;
	padding-top: 6px;
	padding-left: 3px;
	padding-right: 3px;
	font-family: 'Arial' , 'Lucida Grande' , 'Lucida Sans Unicode' , Arial, Verdana, sans-serif;
}

#spmViewerArticleTitleWithPhoto
{
	padding-bottom: 20px;
	font-weight:bold;
	font-size: 12pt;
	padding-top: 6px;
	padding-left: 3px;
	padding-right: 3px;
	font-family: 'Arial' , 'Lucida Grande' , 'Lucida Sans Unicode' , Arial, Verdana, sans-serif;
}

#spmViewerArticleHeader
{
	padding-bottom: 4px;
	font-weight: bold;
	font-size: 16pt;
	background-color: #E6E6E6;
	padding-left: 3px;
	padding-right: 3px;
	font-family: 'Arial' , 'Lucida Grande' , 'Lucida Sans Unicode' , Arial, Verdana, sans-serif;
}

#spmViewerArticleHeaderImage
{
	margin-right: 3px;
	margin-left: 3px;
	margin-top: 3px;
	padding-bottom: 6px; 
	padding-left: 2px;
	border-bottom: 1px gray solid;
}

#spmViewerMainArticleContainer
{
	background: #FFFFFF;
	overflow:hidden;
	border-style: solid;
	border-width: 1px;
	width: 550px;
	font-family: 'Arial' , 'Lucida Grande' , 'Lucida Sans Unicode' , Arial, Verdana, sans-serif;	
	font-size: 10pt;
	position:relative;
	line-height:normal;
}

#spmViewerArticleContainer
{
	margin-right: 5px;
	margin-left: 5px;
	font-family: 'Arial' , 'Lucida Grande' , 'Lucida Sans Unicode' , Arial, Verdana, sans-serif;	
	display:block;
	position:relative;
}

#spmViewerArticlePhotos
{
	padding: 6px;
	margin-left: 4px;	
	float: right;
	font-size: 8pt;
	background-color: #E6E6E6;
    /* The width value below should be the same as the width of spmViewerArticlePhotos img */
	width: 300px;
	display:block;
	position:relative;
	font-family: 'Arial' , 'Lucida Grande' , 'Lucida Sans Unicode' , Arial, Verdana, sans-serif;			
}

#spmViewerArticlePhotos img
{
    /* The width value below should be the same as the width of spmViewerArticlePhotos */
	width: 300px;
}

#spmViewerArticle
{
	margin-top: 0px;
	background-color: #FFFFFF;
	font-family: 'Arial' , 'Lucida Grande' , 'Lucida Sans Unicode' , Arial, Verdana, sans-serif;
}

#spmViewerMainArticleContainer p
{
    padding: 0;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 1em;
    margin-left: 0;
	line-height: normal;
}

#spmViewerArticleNoPhoto
{
	background-color: #FFFFFF;
}

#spmViewerFooter
{
	clear: both;
	width: 100%;
	background-color: #C0C0C0;
	text-align: center;
	font-size: 8pt;
	font-weight: normal;
	margin-top: 10px;
	font-family: 'Arial' , 'Lucida Grande' , 'Lucida Sans Unicode' , Arial, Verdana, sans-serif;		
}

#spmViewerArticlePhotos table
{
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
}

#spmViewerArticlePhotos td
{
    margin: 0;
    padding: 0px;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
}

#spmViewerArticlePhotos tr
{
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
}

.spmSource
{
	font-size: 10px;
	text-align: right;
	display: block;
	color: Gray;
	font-family: 'Arial' , 'Lucida Grande' , 'Lucida Sans Unicode' , Arial, Verdana, sans-serif;		
}

.spmCaption
{
    padding-top: 0px;
	text-align: left;
	font-size: 12px;
	display:block;
	font-family: 'Arial' , 'Lucida Grande' , 'Lucida Sans Unicode' , Arial, Verdana, sans-serif;	
	color: #3F3F3F;
}