/* This is the css for the Project Remedies website, created by Mary
Ecsedy, Circuit Riders, LLC, May 2009. */


/* The file is self-documenting with extensive comments. */




/* The basic browser viewport window. This is the blue frame around
the page. */

	body {
		margin: 0;
                padding: 0;
		background-color: #1d4270;
                color: #000000;
		font-size: 100%;  
	}





/* Default rules for the most common HTML elements. Many are modified
by rules further down in the CSS. */

	h1, h2, h3, h4, h5, h6 {
		font-family: Verdana, Arial, helvetica, sans-serif;
        }


        p, ol, ul, li, dl, dt, dd { 
		font-family: Verdana, Arial, helvetica, sans-serif;
        }  



/* Additional default heading rules.  */

	h1 {
		font-size: large;
		color: #911100;
		text-align: left;  /* MSIE work-around for this, h2, h3, p and ul also. */
                margin: 0px 0px 15px 0px;
		padding: 0px;
	}

	h2 {
		font-size: medium;
                background-color: #ffffff;
		color: #911100;
		text-align: left;
		margin: 30px 0px 5px 0px;
                padding: 5px 0px 5px 0px;	
                border-top: 1px dotted #d2cda9;
	}

	h3 {
		font-size: small;
		color: #911100;
		text-align: left;	
		margin: 10px 0px 10px 0px;
/*		padding-bottom: 6px; */
	}

	h4 {
		font-size: x-small;
		color: #911100;
		text-align: left;	
		margin: 20px 0px 10px 0px;
/*		padding-bottom: 6px; */
	}
	



/* Default paragraph. */

	p {
		font-size: small;
		line-height: 130%;
		text-align: left;
		padding: 0px 15px 0px 10px;

	}




/* Default unordered - bulleted - lists, and ordered - numbered - lists. */	

	ul, ol {
		font-size: small;
		line-height: 200%;
		text-align: left;
                margin: 10px 10px 5px 10px;
		padding: 0px 10px 5px 20px;		
	}
	
        ul { 
                list-style-type: disc;
        }

        ul li { 
                line-height: 150%;
                text-align: left;
                margin: 15px 0px 10px 0px;
        }


        ol li {  
                line-height: 150%;
                text-align: left;
                margin: 15px 0px 10px 0px;
        }
        
/* Use this when you want a plain, non-bulleted list. */

	.plain-ul  ul {
	        list-style-type: none;
	}
	




/* Default links. */

        a:link {
                background-color: #ffffff;
	        color: #297788;
	        text-decoration: none;
        }

        a:visited {
                background-color: #ffffff;
	        color: #349bb1;
	        text-decoration: none;
        }

        a:active {
                background-color: #ffffff;
	        color: #48cbe9;
	        text-decoration: underline;
        }

        a:hover {
                background-color: #ffffff;
	        text-decoration: underline;
	        color: #c38a00;
        }




/* Default image rule overrides the browser's default of putting a
border around images. */

	img {
                border: 0px;
	}
	
	.caption {
		font-size: x-small;
		line-height: 120%;
		text-align: center;
                background-color: #ffffff;
                color: #c38a00;
		font-weight: bold;
	}	
	



/* Definition list rules used in qa.php. */
	
	dl dt {
		background-color: #ffffff;
		color: #0092b1;
		margin: 10px 20px 5px 20px;
		font-weight: bold;
		font-size: small;
		line-height: 130%;
		text-align: left;
	}

	dl dd {
		margin: 5px 20px 20px 20px;
		text-align: left;
		font-size: small;
		line-height: 130%;
	}
	





/* The Container div is the main page container that holds everything
else. The page is centered in the viewport, with a 1em margin all
around. Originally 780 px wide. Changed to 787px for MSIE6. */

	#container {
	width: 1000px;   /* was 780 */
        margin-top: 1em;
        margin-left:auto;
        margin-right:auto;
        background-color: #e3e4e7;
        color: #000000;
        padding: 0px;
/*                border: 0px solid #00ff00; */
	}






/* The Header div displays the PRI logo image at the top of the page. */

        #header { 
        /* needs to be relative so absolute position of hnav works */
        position:relative; 
        background-color: #fff;
        background-image: url(../images/project-remedies.png);
        background-repeat: no-repeat; 
		height: 100px;
/*		border: 0px solid #02b2d7;               */
        }





/* The Header div on the Public Sector pages displays the flag version
of the PRI logo. */

        #header-public-sector { 
        /* needs to be relative so absolute position of hnav works */
        position:relative; 
        background-color: #fff;
        background-image: url(../images/pri-header-public-sector-01.png);
        background-repeat: no-repeat; 
		height: 100px;
/*		border: 0px solid #02b2d7;               */
        }




/* This holds the 3 navigation icons in the upper-right corner of the
header. Each link has its own class for handling the icon and
rollover. Originally a float, changed to absolute for MSIE6 fix.*/

        #hnav { 
            position:absolute;
            top:35px;
            left:606px;
            width:auto;

            /*
                float: left;
                right: 0px;
                margin: 35px 0px 0px 606px;
                width: 160px;
                border: 2px solid #000000;
            */
        }

         #hnav p { 
            color: #0077bc;
            font-size: large;
            font-weight: bold;
         }

/* The following rules control the layout and style of the header
link icons. The links are stored in header.inc. */

/* Home */
        .home { 
                float: left;
                background-image: url(../images/home.jpg);
                background-repeat: no-repeat;
                height: 35px;
                width: 44px;
        }

        .home span { 
                display:none; 
        } 

        a.home:hover { 
                background-image: url(../images/home2.jpg);
        }


/* Sitemap. Temporarily commented out in header.inc. Mary, June 2009. 

        .sitemap { 
                float: left;
                background-image: url(../images/sitemap.jpg);
                background-repeat: no-repeat;
                height: 35px;
                width: 60px;
        }

        .sitemap span { 
                display:none; 
        } 

        a.sitemap:hover { 
                background-image: url(../images/sitemap2.jpg);
        } */




/* Contact */
        .contact { 
                float: left;
                background-image: url(../images/contact.jpg);
                background-repeat: no-repeat;
                height: 35px;
                width: 54px;
        }

        .contact span { 
                display:none; 
        } 

        a.contact:hover { 
                background-image: url(../images/contact2.jpg);
        }





/* The lcol div contains the left column navigation links. */

        #lcol {  
                clear: both;
	        float: left;
                background-color: #e4e5e7;
                color: #777777;
                margin: 0px 0px 0px 0px;
                padding: 15px 0px 20px 0px;
                width: 188px;
                border: 0px solid #ff0000;
/*            overflow:clip; This is by Matt and it broke the validator. Correct attribute is hidden.*/
                overflow: hidden;
        }


/* Left column top-level navigation links. */

        #lcol ul { 
                background-color:#e4e5e7;
                color: #444444;
                list-style: none;
                margin: 0px 0px 0px 20px;
                padding: 0px;
        }

        #lcol ul li { 
                font-size: 13px;
		font-family: "Lucida Sans", Verdana, Arial, helvetica, sans-serif;
                font-weight: bold; 
                line-height: 120%;               
        }

        #lcol li a:link, #lcol li a:visited { 
                background-image: url(../images/logo-tiny-bw.png);
                background-position: left;
                background-repeat: no-repeat;
                display: block;
                margin: 0px 0px 0px 0px;
                padding: 6px 0px 6px 25px;
                background-color:#e4e5e7;
                color: #444444;
                line-height: 120%;               
                text-decoration: none;
                border-bottom: 1px solid #eeeff1;
        }

        #lcol li a:hover, #lcol li a:visited:hover { 
                background-image: url(../images/logo-tiny-bl.png);
                background-position: left;
                background-repeat: no-repeat;
                background-color: #e4e5e7;
                color: #f30000;
                line-height: 120%;               
                text-decoration: none;
        }

        #lcol li a:active { 
                background-color: #e4e5e7;
                color: #002578;
                line-height: 120%;               
                text-decoration: none;
        }



/* Left column secondary-level navigation links. NOTE that lcol-subnav has
been DEPRECATED. The secondary links have been moved into the
upper-right contents. */


        #lcol-subnav ul { 
                background-color:#e4e5e7;
                color: #444444;
                list-style-type: none;
                margin: 0px 0px 0px 20px;
                padding: 0px;
        }

        #lcol-subnav ul li { 
                font-size: 13px;
		font-family: "Lucida Sans", Verdana, Arial, helvetica, sans-serif;
                font-weight: bold;                
        }

        #lcol-subnav li a:link, #lcol li a:visited { 
/*                background-image: url(/images/logo-tiny-bw.png);
                background-position: left;
                background-repeat: no-repeat; */
                display: block;
                margin: 0px 0px 0px 0px;
                padding: 6px 0px 6px 25px;
                background-color:#e4e5e7;
                color: #444444;
                text-decoration: none;
                border-bottom: 1px solid #eeeff1;
        }

        #lcol-subnav li a:hover, #lcol li a:visited:hover { 
/*                background-image: url(/images/logo-tiny-bl.png);
                background-position: left;
                background-repeat: no-repeat; */
                background-color: #e4e5e7;
                color: #f30000;
                text-decoration: none;
        }

        #lcol-subnav li a:active { 
                background-color: #e4e5e7;
                color: #002578;
                text-decoration: none;
        }




/* Left column styles */

/* Dotted blue outline. */

        .blue-outline { 
                border: 1px dotted #00afdb;
        }


/* Dotted gold outline. */

        .gold-outline { 
                border: 1px dotted #c38a00;
        }



/* Dotted red outline. */

        .red-outline { 
                border: 1px dotted #ee0013;
        }



/* BMC logos in lcol. */

        .grey-background { 
                background-color: #e4e5e7;
                color: #777777;
                text-align: center;
                padding-top: 20px;
        }

/* BMC logo top margin. */

        img.lcol { 
                margin: 30px 0px 0px 0px;
        }




/* The Banner is the big image and byline message located directly
below the Header. Contents are stored in banner.inc. Currently playing
the Flash movie by BizTech on the About page only. Also used by
banner-public-sector.inc. */

        #banner { 
                background-image: url(../images/shadow1.jpg);
                background-position: bottom;
                background-repeat: no-repeat;
                background-color: #ffffff;
                color: #777777;
                margin: 0px 0px 0px 0px;
                padding: 0px;
                height: 261px;
                text-align: center;
                border: 0px dotted #ff66ff;
        }





/* Main content block on each page. */

        #contents {  
                color: #000000;
                background-color: #ffffff;
	        margin: 0px 0px 0px 188px;
                padding: 0px 15px 100px 20px;
                border: 0px dotted #00afdb;  
        }





/* Upper-right box used for secondary navigation links, i.e., nav2
contents, sidebars, etc. */


        #contents-upper-right { 
                float: right;
                width: 250px;
                margin: 0px 0px 20px 30px;
                padding: 0px 0px 10px 0px;                
                color: #555555;
                background-color: #ffffff;
                border: 1px dotted #ff0000;
        }


	#contents-upper-right p, #contents-lower-right p {
		font-size: small;
		line-height: 120%;
		text-align: left;
                margin: 0px 0px 0px 0px;
		padding: 10px 10px 0px 10px;
                background-color: #ffffff; 
                color: #297788;
	}

 
	#contents-upper-right ul ol li a {
                background-color: #ffffff;
                color: #297788;
		font-size: small;
		line-height: 120%;
		text-align: left;
                margin: 10px 0px 0px 20px;
		padding: 0px 10px 0px 10px;		
	}






/* Box located in the lower-right corner. Use as needed. */

        #contents-lower-right { 
                clear: right;
                float: right;
                width: 250px;
                margin: 0px 0px 20px 30px;
                padding: 0px 0px 10px 0px;                
                color: #39006a;
                background-color: #f6fdff;
                border: 1px dotted #00afdb;
        }

/*        #contents-lower-right p { 
                color: #39006a;
                background-color: #ffffff;               
        } */




/* Gallery of small thumbnail images. */

        .gallery-th { 
                float: left;
                width: 158px;
                font-family: Verdana, Arial, helvetica, sans-serif;
                font-size: small;
                color: #9f965a;
                text-align: center;
                border: 1px solid #9f965a;
                margin: 10px 15px 15px 0px;
                padding: 5px;

        }

        .gallery-th a { 
                text-decoration: none;
        }




/* These rules format a two-column table grid. Used for displaying
tabular information such as in downloads.php, for example. */

        .infolist table { 
                width: 98%;
        }

        .infolist tr { 
                vertical-align: top;
        }

        
        .infolist td { 
                padding: 10px 10px 20px 10px;                
        }

        .infolist td.left {  
                width:65%;
                padding: 0px 20px 10px 10px;        
                border: 0px dotted #00afdb; 
        }

        .infolist td.right {
                width: 33%;  
                padding: 0px 10px 10px 0px;        
                border: 0px dotted #00afdb; 

        }

        .infolist td.right p {
                font-size: small;
                text-align: left;
        }

        .infolist img { 
                border: 0px solid #f1f1f1;
        }






/* Footer. The following rules control the footer position, and the
style and behavior of the links. The links and other contents such as
the copyright date are stored in footer.php */

        #footer {
		clear: both;
		margin: 0px 0px 0px 0px;
                padding-bottom: 15px;
		background-color: #ffffff;
                color: #666666;
                font-size: small;
                text-align: center;
                border: 0px solid #ff66ff; 
	}

        #footer ul {
                background-color: #666666; 
                color: #ffffff;
                margin: 0px;
                padding: 10px 0px 15px 0px;
		list-style-type: none;
                text-align: center;
        }

	#footer li{
                background-color: #666666;
                color: #ffffff;
		display: inline;
	}
	
	#footer li a {
                background-color: #666666;
		color: #ffffff;
		text-decoration: none;
                font-weight: normal;
	}

	#footer li a:hover {
		text-decoration: underline; 
                background-color: #666666;
		color: #f07228; /* Orange */
	}

        #footer p { 
                padding-right: 10px; 
        }

 /* This is a Span Class that is used to style the "|" character
between the footer links. */

        .black-bar {
                background-color: #666666;
                color: #000000;
        }




/* Miscellaneous styles. */


/* From edits I made to the original styles.css file for pri-us.com. */

        .heading-blue {		
		color: #0092b1;
        }
		
		
        .dividing-line {
                margin: 20px 0px 20px 0px;
		border-top: 1px solid #ff0000;
	}



/* Used by the Back to Top links. */

	.top {
		background-color: #ffffff;
		color: #7e6e00;
		font-family: Verdana, Arial, helvetica, sans-serif;
		font-size: x-small;
		text-align: right;
                margin: 10px 0px 20px 0px;
	}





/* Because sometimes you need a basic override. */

        .center { 
                text-align: center;
        }

        .left { 
                text-align: left;
        }

        .right { 
                text-align: right;
        }



/* Use to clear left and right floating divs. */

        .clearboth { 
                clear: both;
        }





/* Font class for the forms. */

        .form-label { 
		background-color: #ffffff;
		color: #939fb8;
		font-family: Verdana, Arial, helvetica, sans-serif;
                font-size: small;
                text-align: left;
                font-weight: bold;                
        }

        .required { 
		background-color: #ffffff;
		color: #ff0000;
		font-family: Verdana, Arial, helvetica, sans-serif;
                font-size: small;
                text-align: left;
        }




/* Image Rules */

        .image-float-left {
             float: left;
             margin-bottom: 20px;
             padding-right: 15px;
             text-align: center;
             background-color: transparent;
             color: #54839d; 
             font-size: .85em;
        } 

        .image-float-right { 
             float: right;
             padding: 0px 0px 15px 15px;
             background-color: #ffffff;
             color: #939fb8;
             font-size: small;
             text-align: left;
        }


        .image-center-nofloat { 
             float: none;
             background-color: #ffffff;
             color: #939fb8;
             font-size: .9em;
             text-align: center;
        }


/* Screenshots */

        .screenshot { 
             font-family: Verdana, Arial, helvetica, sans-serif;
             margin-bottom: 50px;
             text-align: center;
             background-color: transparent;
             color: #54839d; 
             font-size: small;
        }



/* New */

       .new { 
             background-color: transparent;
             color: #ff0000;
             font-size: small;
             font-weight: bold;
       }






/* Sandbox login page. See
http://sandbox.projectremedies.com:8080/arsys/shared/login.jsp?/arsys/
*/

        .login {font: 11px "Tahoma", "Lucida Grande", "Verdana", "Arial", "Helvetica", sans-serif; color: #fff; line-height: 12px; }

	.LoginError {font: 11px "Tahoma", "Lucida Grande", "Verdana", "Arial", "Helvetica", sans-serif; color:red; line-height: 12px; }

	.loginfield {font: 11px "Tahoma", "Lucida Grande", "Verdana", "Arial", "Helvetica", sans-serif; color: #333; line-height: 12px; }