@charset "utf-8";
/* ====================================================================================== 
	Copyright (C) 2008 JPL Creative.  All Rights Reserved. 
	----------------------------------------------------------------------------------- 
	Author(s) : Joshua Barlup 		jbarlup@jplprod.com 

	Date      : 08/13/2008  
	Notes     : Template css document for JPL Extranet. 
	----------------------------------------------------------------------------------- 
	Change Log 
        
	Date		Name				Desc 
	8/12/2008	Josh Barlup			Created file, this file is updated from the original
									extranet.css file created by Dave R in 2003
	8/22/2008	Larry Daughenbaugh	Tweaking, edits, updates.
         
 ========================================================================================= */

.body-container { width: 100%; background: url(../img/template/bg-container.gif) repeat-x center top; }
#outercontainer {
	width: 933px;
	margin:0 auto;
	padding:0;
	position: relative;
}

#logo {
	width: 143px;
	height: 78px;
	position: relative;
	top: 32px;
}

#jplcreative {
	width: 257px;
	height: 27px;
	position: absolute;
	top: 9px;
	right: -15px;
	background: url(../img/template/visit-jplcreative.gif) no-repeat;
	text-indent: -999em;
}

#jplcreative a {
	display: block;
	height: 27px;
}

#banner {
	height: 167px;
}

#banner p {
	text-align: right;
	font: bold 25px Calibri, Arial, Helvetica, sans-serif;
	margin-right: 18px;
}
#banner .group div.contents p {
	text-align: left;
	font-size: 12px;
}

#project-nav {
	background: url(../img/template/project-nav.png) top center no-repeat;
	height: 35px;
	width: 868px;
	position: relative;
}

#project-hav-header {
	background: url(../img/template/header-select-project.png) no-repeat;
	height: 15px;
	width: 110px;
	text-indent: -999em;
	position: relative;
	top: 11px;
	left: 11px;
}
#project-hav-user {
	background: url(../img/template/header-select-user.png) no-repeat;
	height: 15px;
	width: 110px;
	text-indent: -999em;
	position: relative;
	top: 11px;
	left: 11px;
}
#project-documentation {
	height: 15px;
	width: 115px;
	text-indent: -999em;
	position: relative;
	top: 11px;
	left: 11px;
	background: url(../img/template/header-documentation.gif) no-repeat;
}
#project-hav-header2 {
	height: 15px;
	width: 110px;
	text-indent: -999em;
	position: relative;
}

#project-nav ul {
	list-style: none;
	width: 374px;
	float: right;
	position: relative;
	top: -2px;
	margin: 0;
	padding: 0;
}

#project-nav ul li {
	float: left;
	padding-right: 20px;
}

#project-nav a {
	background-image:url(../img/template/project-nav-menu.gif);
	background-repeat: none;
	display: block;
	text-indent: -999em;
	font-size: 2px; /* IE6 inline H4ck that drops the font size so the height doesnt grow */
	height: 13px;
}

#project-nav a.add { width: 68px; background-position: 0px 0px; }
#project-nav a.profile { width: 85px; background-position: 258px 0px; }
#project-nav a.documentation { width: 94px; background-position: 155px 0px; }
#project-nav a.logout { width: 42px; background-position: 42px 0px; }
#project-nav a:hover { background-image: url(../img/template/projects-list-over.gif); }

#doc-nav {
	background: url(../img/template/project-nav.png) top center no-repeat;
	height: 35px;
	width: 868px;
	position: relative;
}
#doc-nav ul {
	list-style: none;
	float: right;
	position: relative;
	top: -2px;
	margin: 0px;
	padding: 0px;
}

#doc-nav ul li { float: left; 	margin: 0px 20px 0px 0px; }
#doc-nav a.project-listing {
	display: block;
	text-indent: -999em;
	font-size: 2px; /* IE6 inline H4ck that drops the font size so the height doesnt grow */
	height: 13px;
	background: url(../img/template/project-listing.gif) no-repeat;
	width: 142px; 
}
#doc-nav a.add-user {
	display: block;
	text-indent: -999em;
	font-size: 2px; /* IE6 inline H4ck that drops the font size so the height doesnt grow */
	height: 13px;
	background: url(../img/template/add-user.gif) no-repeat;
	width: 52px; 
}
#doc-nav a:hover { background-position: 0px -13px; }

#wrapper {
	padding: 0 18px 0 49px;
}

#content {
	background: url(../img/template/bg-content-div.png) no-repeat top;
	width: 868px;
	margin: 44px 0 0 50px;
}
.content-more {
	background: url(../img/template/bg-content-div.png) no-repeat top;
	width: 868px;
	margin: 14px 0 0 50px;
}
#content2 {
	background: url(../img/template/bg-content-div.png) no-repeat top;
	width: 868px;
	margin: 5px 0px 0px 0px;
}

#content p.alert { padding: 10px 0px 0px 25px; text-align: left; font-size: 12px; font-weight: bold; color: #FF0000; }

#footer { clear: both; }
#footer p, #footer span {
	text-align: center;
	font: normal 11px Calibri, Arial, Helvetica, sans-serif;
	color: #969696;
	margin: 0;
	padding: 30px 0;
}
#footer span { padding: 0px 40px; }

.textname {
	margin:0 0 0 12px;
	padding:0;
	display:block;
}

#extranet_container {
    padding:10px;
    line-height:14px;
}

#extranet_container a:hover { color:#999999; }

#your-contacts {
	color: #901d3c;
	text-indent: -999em;
	background:url(../img/template/header-your-contacts.gif) no-repeat;
	height: 12px;
	width: 104px;
	border-bottom: none;
	margin: 0 0 18px 0;
	padding: 0;
	position: relative;
	top: 19px;
	left: 17px;
}

.contents {
	padding: 0;
}

.addEdit {
	list-style: none;
	background: url(../img/template/bg-add-edit.gif);
	width: 214px;
	height: 35px;
}

.addEdit li {
	float: left;
	background-image:url(../img/template/add-edit-menu.gif);
	background-repeat: none;
	height: 16px;
	margin: 10px 0 0 16px;
}

#addItems { width: 81px; padding: 0px; margin: 10px 0px 0px 16px; }
#sortItems { width: 83px; background-position: -95px 0px; }

.addEdit li a {
	display: block;
	height: 16px;
	text-indent: -999em;
}

div.hr { border-top:1px solid #CCCCCC; }
div.hr hr { display:none; }

.admin_buttons {
    display:block;
    float:right;
    font:normal 11px Calibri, Tahoma, Verdana;
    margin:0; 
	padding:0 5px 0 0;
}

.admin_buttons a { padding-right: 15px; }

.inactive {
    opacity:.5;
    filter:alpha(opacity=50);
    -moz-opacity: 0.5;
}
* html .inactive { height:1%; }

/* === APPROVED ITEMS === */

li.approved {
	background-color:#F6F6F6;
	border:1px solid #E3E3E3 !important;
	position:relative;
}

div.approved {
	font:normal 10px Calibri, Tahoma, Verdana;
	color:#578A8A;
	padding:0 0 2px 0;
	margin-top:-2px;
}

.form_row span#approved_date_container {
	float:none;
	display:inline;
	margin:0;
}

/* === APPROVED VIEW BAR === */

p#approved_view {
	text-align: left;
	float: left;
	width: 275px;
	font: normal 13px Calibri, Arial, Helvetica, sans-serif;
	margin-left: 25px;
	font-weight: bold;
}

p#approved_view a { 
	color: #afb1b3;
	text-decoration: underline;
	padding: 0;
	margin: 0;
}

p#approved_view span {
	padding: 0 11px;
}

p#approved_view a:hover { 
	color: #000000;
}

.menu_bar {
	float: right;
	background:url(../img/template/bg-menubar.png) no-repeat;
	width: 390px;
	height: 35px;
	margin-bottom: 11px;
}

.menu_bar li {
	float: left;
	height: 22px;
	text-indent: -999em;
	margin: 7px 0 0 14px;
}

.menu_bar li.edit {	background-image: url(../img/template/menubar-edit-project.gif); width: 95px; }
.menu_bar li.add {	background-image: url(../img/template/menubar-add-group.gif); width: 82px; }
.menu_bar li.sort {	background-image: url(../img/template/menubar-sort-group.gif); width: 91px; }
.menu_bar li.exit {	background-image: url(../img/template/menubar-exit.gif); width: 43px; }

.menu_bar a { text-decoration:none; display: block; height: 22px; }

#detailWrapper {
	width: 706px;
	float: left;
	font: normal 11px Calibri, Arial, Helvetica, sans-serif;
}

.group { 
	clear: both;
	background: #ffffff;
	border: 1px solid #add3e8;
	margin-bottom: 30px;
}

/* for website reports and blog buttons within left-column */
.left-column { margin: 30px 0px 0px 0px; }
.left-column a#reports { margin: 0px 0px 65px 0px; background: url(../img/buttons/website-reports.png) no-repeat; height: 62px; display: block; width: 199px; }
.left-column a#blog { margin: 0px; color:#9bbb59; font:bold 14px Calibri, Tahoma, Verdana; text-decoration: underline; }
.left-column a span, .left-column h2 { display: none; }
	
.documentation-header { margin: 0px 10px; padding: 0px 15px; }

.group div.contents {
	padding: 0 17px 0 13px;
}
.group h4 {
	background: #add3e8;
	font: bold 18px Calibri, Arial, Helvetica, sans-serif;
	padding: 4px 17px 0 14px;
	height: 25px;
}

.updated {
    font:normal 11px Calibri, Tahoma, Verdana;
    color:#818501;
    padding:2px 0;
	margin-bottom: 4px;
}

.item_description {
    padding-top:5px;
    padding-bottom:5px;
	font-size: 12px;
}

/* === COLUMNS === */

#p_col1 {
	margin: 25px 0px 0px 0px;
    float:left;
    width:199px;
}

#p_col1 p {
	color: #666666;
	font: normal 12px Calibri, Arial, Helvetica, sans-serif;
	text-align: left;
	padding: 21px 10px 0 19px;
}

#p_col2 {
	margin: 25px 0px 0px 224px;
}

#contacts {
	background: url(../img/template/bg-sidebar.png) no-repeat;
	width: 199px;
}

#contacts span.name {
	font: bold 14px Calibri, Arial, Helvetica, sans-serif; 
}

#contacts a.email_link {
	font-weight: bold;
	text-decoration: underline;
}

#skiptoseo.group h4 {
    border-bottom:0;
}


/* === FORMS === */

#content { outline: none; }
fieldset ol { margin-top: 15px; }
label { text-align: right;  }
fieldset li { padding: 4px; margin-left:50px; }

#login-button {
	color: #cc9c4a;
	border: none;
	cursor: pointer;
	background: transparent url(../img/template/button-arrow.gif) no-repeat 2px 6px;
	vertical-align: top;
	font-size: 22px;
	width: 80px;
	margin-left: 195px;
	margin-bottom: 250px; /* Hack to create white space on login page */
}

.form_row { clear:left; padding: 6px 0px; }
.form_row_radio { clear:left; padding: 6px 0px; }

.checkboxes { padding-left: 155px; }

.form_row label, .form_row_radio label {
	float:left;
	display:block;
	width: 150px;
	height: 20px;
	text-align:right;
	padding-right:5px;
	font-weight:bold;
	color: #666;
}


* html .form_row span, * html .form_row_radio span { margin-left:0; }

.buttons { padding: 20px 0px 0px 100px; }
.buttons input, .checkboxes input, .form_row_radio input, .check_combo input, .noborder input { border: none; }
.buttons img { vertical-align: top; }

form .hr { margin-top:10px; padding-top:10px; }

.check_combo {
	border:1px solid #A5ACB2;
	width:240px;
	height:100px;
	overflow-y:auto;
	line-height:20px;
	padding:1px 0 3px 0;
	background-color: #FFF;
}

.check_combo input {
	vertical-align:middle;
	margin:-1px 6px 0 6px;
}



/* IE: */
* html .check_combo input { margin:-1px 4px 0 4px; }

/* === ICONIC LISTS === */

ul.iconic { padding:5px 0 0 0; margin:0; }
ul.iconic li { 
	margin:3px 0 2px 0;
	list-style:none;
	padding:5px 0 2px 30px; 
	background-repeat:no-repeat; 
	background-position: 0px 5px; 
	border-top:1px solid #bfc3c4;
}

ul.iconic li strong  { font: bold 13px Calibri, Arial, Helvetica, sans-serif; color: #000000; }
ul.iconic li.i_audio { background-image:url(../img/fileicons/audio.gif) }
ul.iconic li.i_movie { background-image:url(../img/fileicons/movie.gif) }
ul.iconic li.i_swf   { background-image:url(../img/fileicons/flash.gif) }
ul.iconic li.i_wmv   { background-image:url(../img/fileicons/wmv.gif) }
ul.iconic li.i_image { background-image:url(../img/fileicons/camera.gif) }
ul.iconic li.i_earth { background-image:url(../img/fileicons/new-window.gif) }
ul.iconic li.i_pdf   { background-image:url(../img/fileicons/pdf.gif) }
ul.iconic li.i_doc   { background-image:url(../img/fileicons/doc.gif) }
ul.iconic li.i_xls   { background-image:url(../img/fileicons/xls.gif) }
ul.iconic li.i_ppt   { background-image:url(../img/fileicons/ppt.gif) }
ul.iconic li.i_box   { background-image:url(../img/fileicons/box.gif) }
ul.iconic li.i_page  { background-image:url(../img/fileicons/page.gif) }
ul.iconic li.i_paper { background-image:url(../img/fileicons/page.gif) }
ul.iconic li.i_form  { background-image:url(../img/fileicons/form.gif) }
ul.iconic li.i_note  { background-image:url(../img/fileicons/note.gif) }
ul.iconic li.i_env   { background-image:url(../img/fileicons/envelope.gif); background-position:0px 6px; }
ul.iconic li.i_arrow { background-image:url(../img/template/arrow.gif); background-position:2px 9px; }
ul.iconic li.i_none  { background-image:none; }
* html ul.iconic li  { height:1%; }

ol ul.iconic { padding-left:0px; }

ul.iconic.noborder li { border:0; }
ul.iconic li.noborder { border:0; }

/* === PROJECTS LIST === */

#col1 li, #col2 li {
	font:bold 12px Calibri, Tahoma, Verdana;
	background-position:8px 2px;
	border-bottom:1px solid #bfc3c4;
	padding:0 0 3px 0;	
	margin:4px 0 0 0;
	height: 18px;	
}

#col1, #col2 {
	width:413px;
	float:left;
}

#colspan-2col { 826px }
#colspan-2col li {
	font:bold 12px Calibri, Tahoma, Verdana;
	background-position:8px 2px;
	border-top:1px solid #bfc3c4;
	padding:0 0 3px 0;	
	margin:4px 0 0 0;
	height: 18px;	
}
#colspan-2col li {
	font:bold 12px Calibri, Tahoma, Verdana;
	background-position:8px 2px;
	border-top:1px solid #bfc3c4;
	padding:0 0 3px 0;	
	margin:4px 0 0 0;
	height: 18px;	
}
#colspan-2col li.first {
	font:bold 12px Calibri, Tahoma, Verdana;
	background-position:8px 2px;
	border: none;
	padding:0 0 3px 0;	
	margin:4px 0 0 0;
	height: 18px;	
}
#colspan-2col li.newgroup {
	font:bold 12px Calibri, Tahoma, Verdana;
	background-position:8px 2px;
	border-top:1px dashed #bfc3c4;
	padding:0 0 3px 0;	
	margin:4px 0 0 0;
	height: 18px;	
}

#col2  {
	padding-left:35px;
}

/* === USERS LIST === */

/* === MISC === */

p#logout {
	clear:both;
	margin:15px 0 0 0;
	padding:0;
	display: none; /* I just turned this off, since the reskin designs comps dont have this button */
}

p#logout a {
	display:block;
	text-align:center;
	background:#DDDDDD;
	text-decoration:none;
	font-weight:bold;
	width:100px;
	padding:5px;
	border:2px outset #EEEEEE;
}

p#logout a:hover {
	border:2px inset #EEEEEE;
	background-color:#BBBBBB;
	color:black;
	padding:6px 5px 4px 5px;
	text-indent:1px;
}

.archive_group {
	max-height:259px;
	border:1px solid #CCCCCC;
	overflow:auto;
	margin:10px 0 0 0;
}

* html .archive_group {
	height:expression(this.scrollHeight > 259? "259px" : "auto" );
}

.archive_group ul {
	width:455px;
	padding-top:0;
	padding-bottom:5px;
}

#emarketing span.admin_buttons a, #archive span.admin_buttons a {
	font-size: 12px;
	color: #000;
	margin-top: 4px;
	display: block;
	text-decoration: underline;
}

#emarketing span.admin_buttons a:hover,  #archive span.admin_buttons a:hover {
	text-decoration: none;
}

.cursor { cursor: pointer; }