path: root/pki/dogtag/ra-ui/shared/docroot/css/pki-360.css

/* --- BEGIN COPYRIGHT BLOCK ---
 * This program is free software; you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation; version 2 of the License.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License along
 * with this program; if not, write to the Free Software Foundation, Inc.,
 * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
 *
 * Copyright (C) 2007 Red Hat, Inc.
 * All rights reserved.
 * --- END COPYRIGHT BLOCK ---
 */

/* 
color scheme:

light gray:  #e6e6e6
medium gray:
dark gray:

link blue: #06c

red: #900

*/


/* This establishes background pattern and centering of content area as well
as font-styles for the site */
body {
	margin: 0;
	padding: 0;
	color: #333;
	text-align: center;
	background: #fff url(/img/bkgrnd_greydots.png) repeat;
	font-family: "Luxi Sans", "Bitstream Vera Sans", "Lucida Grande", "Trebuchet MS", helvetica, verdana, arial, sans-serif;
	}
	
td, th { /* for ie55  */
    font-size: x-small;      
    /* false value for WinIE4/5 */
    voice-family: "\"}\"";   
    /* trick WinIE4/5 into thinking rule is over */
    voice-family: inherit;   
    /* recover from trick */
    font-size: small;
    /* intended value for better browsers */
	}
	
img {
	border: 0;
	}
	
a {
	text-decoration: none;
	}
	
a:link {
	color: #06c;
	}
	
a:visited {
	color: #06c;
	}

/* This is the container for the content that is centered */
#wrap {
	margin: 0 20px 10px 20px;
	padding: 10px 15px;
	text-align: left;
	background: #fff;
/*
	min-width: 900px;
*/
	}

/* The following styles establish the header, top nav bar and systems and
search areas */	
#header {
	height: 31px;	/* changed height added bottom margin  */
	margin-top: 10px;
	margin-bottom: 20px;
	}
	
#headertitle {
	height: 31px;          /* same as header */
	margin-top: 10px;      /* same as header */
	margin-right: 100px;   /* "myLogo" margin-left + "logo_header.gif" */
	margin-bottom: 20px;   /* same as header */
	font-size: large;
	font-weight: bold;
	}

#headerpaddedtitle {
	height: 31px;          /* same as header */
	margin-top: 10px;      /* same as header */
	margin-bottom: 20px;   /* same as header */
	font-size: large;
	font-weight: bold;
	padding-left: 115px;   /* "myLogo" margin-left +
	                          "logo_header.gif" + 15px */
	}

img#myLogo {
	float: left;
	margin-left: 15px;
	}
	
img#pkiLogo {
	float: left;
	}
	
#account {
	float: right;
	width: 450px;
	margin-right: 15px;
	padding-top: 7px;	/* removed margin-bottom, added padding-top  */
	}
	
#account dl {
	float: right;
	padding: 0;
	margin: 0;
	}
	
#account dt {
	float: left;
	width: 66px;
	height: 1.1em;
	background: url(/img/account_loggedin.gif) 100% 100% no-repeat;
	}
	
#account dd {	/* note changes to dl, dt and dd   */
	float: left;
	margin-left: 10px;
	}
	
#account p {
	float: right;
	margin: 0 0 0 30px;
	padding: 0;
	}
	
#account p a {
	width: 56px;
	height: 1.1em;
	background: url(/img/account_signout.gif) 100% 100% no-repeat;
	display: block;
	}
	
#account span {
	display: none;
	}

#bar {
	margin-bottom: 10px; 
	background-color: #e6e6e6
	}
	
#bar:after {
    content: "."; 
    display: block;
    height: 0px;	/* took out negative margin and set height to 0  */
    overflow: hidden;
    clear: both; 
    visibility: hidden;
    }

    /* Holly Hack Targets IE Win only \*/
    * html #bar {height: 1%;}
    /* End Holly Hack */
	
#systembar {
	float: right;
	width: 34%;
	background: #e6e6e6 url(/img/greybar_tr.gif) 100% 0 no-repeat;
	}
	
#systembarinner {
	background: url(/img/greybar_br.gif) 100% 100% no-repeat;
	height: 2.8em;
	/* text-align: center; */
	text-align: right;
	padding-right: 10px;
	}
	
#systembarinner div {
	color: #000;
	font-variant: small-caps;
	padding-top: 5px;
	}
	
#searchbar {
	float: left;
	width: 66%;
	background: #e6e6e6 url(/img/greybar_tl.gif) 0 0 no-repeat;
	}
	
#searchbarinner {
	padding-left: 10px;
	background: url(/img/greybar_bl.gif) 0 100% no-repeat;
	height: 2.8em;
	/*
	text-align: left;
	text-align: center;
	*/
	text-align: right;

	}
	
#systembarinner form,
#searchbarinner form {
	margin: 0;
	padding-top: 5px;	/* changed to padding-top: 5px  */
	/*text-align: center;*/
	}
/* end header */
	
/* The following styles establish the new side nav bar */
#sidenav {	/* for ie55  */
	width: 132px;
	background-color: #999;
	background-image: url(/img/corner_sidenav_top.gif);
	background-position: top right;
	background-repeat: no-repeat;
	font-family: "Luxi Sans", verdana, arial, sans-serif;	
	font-size: xx-small;
    /* false value for WinIE4/5 */
    voice-family: "\"}\"";   
    /* trick WinIE4/5 into thinking rule is over */
    voice-family: inherit;   
    /* recover from trick */
    font-size:  x-small;
    /* intended value for better browsers */
	font-weight: bold;
	}

	
#sidenav ul {
	background-image: url(/img/corner_sidenav_bottom.gif);
	background-position: bottom left;
	background-repeat: no-repeat;
	list-style: none;
	padding: 10px 0 10px 0;
	margin: 0;
	}
	
#sidenav ul ul {
	background: none;
	/* background-color: #c1c1c1; */
	background-color: #ccc;
	margin: 0;
	padding: 0;
	border-top: 1px solid #999;
	}
	
#sidenav ul li {
	border-bottom: 1px solid #a7a7a7;
	margin: 0;
	}
	
#sidenav ul li:last-child {
	border-bottom: 1px solid #999;
	}

#sidenav ul li.sidenav-selected {
	/*
	background: #8a8a8a;
	background: #7b7b7b;
	*/
	background: #6c6c6c;
	/* border-top: 1px solid #999; */
	}

#sidenav ul li.sidenav-selected span {
	display: none;
	}
	
#sidenav ul li a {
	display: block;
	color: white;
	text-decoration: none;
	padding: 3px 5px 3px 15px;
	margin: 0;
	}
	
#sidenav ul ul li.sidenav-selected {
	background: #6c6c6c;
	/* background: #7b7b7b;
	background: #8a8a8a;
	*/
	}

	
#sidenav ul ul li:last-child {
	border-bottom: none;
	}
	
#sidenav ul ul li a {
	padding-left: 30px;
	color: #555;
	}

#sidenav ul ul li.sidenav-selected a {
	padding-left: 30px;
	color: white;
	}


#content {
	clear: both;
	}

/* The following styles establish the legend boxes in the left sidebar */
.sideleg {
	width: 132px;
	background: url(/img/sidelegend_top.gif) 0 0 no-repeat;
	padding-top: 9px;
	margin-top: 1em;
	}
	
	
.sideleg h2 {
	font-size: x-small;
	color: #666;
	border: 1px solid #acacac;
	border-top: none;
	padding: 0 0 3px 15px;
	margin: 0;
	}
	
.sideleg ul {
	padding: 0 0 9px 0 ;
	margin: 0;
	list-style: none;
	background: url(/img/sidelegend_bottom.gif) 0 100% no-repeat;
	}
	
.sideleg ul li {
	padding: 12px 0 6px 15px;
	font-size: x-small;
	color: #666;
	border-left: 1px solid #acacac;
	border-right: 1px solid #acacac; /* removed clear:left  */
	}
	
.sideleg ul li img {
	float: left;
	padding-right: 3px;
	margin-top: -3px;
	}
	
h1 {
	margin-top: 0;
	}
	
/* existing PKI STYLES - modded - these need to be inserted carefully */

.sidebar {
	padding-right: 15px;
    vertical-align: top;
}

table.iso_dl {
    border-collapse: collapse;
}    

table.iso_dl td {
    padding: 4px;
}

table.iso_dl th {
    color: #999;
    background-color: #eee;
    border:  1px solid #999;
    padding: 6px 3px;
    text-align: right;
}

table.iso_dl th.first {
    text-align: left;
}

th {
	padding: 4px 6px;
	color: #fff;
   /* background-color: #b4b19a; */
	text-align: left;
	font-size: small;
}


/* -- YOUR PKI stuff -- */
table.half-table {
	background: #b4b19a url(/img/table_corner_tr.gif) 100% 0 no-repeat;
	padding: 0px;
	margin: 0px;
	}

.half-table td {
	background-color: #fff;
}	

table.your-pki table.half-table td { 
  padding: 2px 8px;
}

table.your-pki table.full-table td { 
  padding-left: 4px;
  padding-right: 4px;
  padding-top: 4px;
}

table.half-table thead th:first-child { 
	background: url(/img/table_corner_tl.gif) top left no-repeat;
	}




/* -- General list stuff -- */
table.list {
	font-size: 10px;
	background: #b4b19a url(/img/table_corner_tr.gif) top right no-repeat;
	border-bottom: 1px solid #b4b19a;
}

/* Holly Hack Targets IE Win only \*/
    * html table.list, * html table.half-table {background-image: none;}
    /* End Holly Hack */



table.list thead th:first-child {
	background: url(/img/table_corner_tl.gif) top left no-repeat;
	}

table.list-pagination {
	font-size: smaller;
}


td.first-column {
	border-left: 1px solid #b4b19a;
}

td.last-column  {
	border-right: 1px solid #b4b19a;
}

td.only-column  {
	border-right: 1px solid #b4b19a;
	border-left: 1px solid #b4b19a;
}


.list-checkbox {
	text-align: center;
	border-left: 1px solid #b4b19a;
}

.list-checkbox-header {
	text-align: center;
}

.list th a {
	display: inline;
	}

.list a:hover {
	text-decoration: underline;
}

/* list row classes */
.list-row-even td{
	background-color: #F1EBDC;
}
.list-row-odd td {
        background-color: #ffffff;
}
.list-row-summary {
	text-align: right;
	font-weight: bold;
	border: 1px solid #ccc;
	background-color: #eee;
}
.list-row-even td, .list-row-odd td, .list-row-summary td {
	padding: 4px 8px;
}

.list-horiz-separator hr {
	border: 0;
	border-bottom: 1px solid #ccc;
	padding: 0px;
}


/* default class def for row color toggling */
.list-row-even-selected {
        background-color: #dde5ff;
}
.list-row-odd-selected {
        background-color: #dde5ff;
}

.list-row-odd-selected td, .list-row-even-selected td {
	border-bottom: 1px solid #ccc;
	padding: 4px 8px;
}

/* special column classes */
th + th {
	border-left: 0;
}
a[name]:hover {
	color: inherit;
}




/* --- TABLE TREE VIEW --- */
tr.table-tree-even td, tr.table-tree-odd td {
   padding: 10px 15px;
}
tr.table-tree-even img,
tr.table-tree-odd img {
   margin-left: 4px;
}
tr.table-tree-odd {
   background-color: #F1EBDC;
}
tr.table-tree-even {
   background-color: #fff;
}
                                                                                                                                                             
/* padding for parent+child channels  */
tr.table-tree-even + tr.table-tree-even td,
tr.table-tree-odd + tr.table-tree-odd td {
   padding-top: 0;
}




/* signin page stuff start */
#footer {
        /*
	border-top: 2px dotted #ccc;
	padding: 2em 4em 2em 4em;
	*/
	padding: 1em;
	margin: 1em 4em 1em 4em;
	text-align: center;
	font-size: 10px;
	color: #aaa;

	margin-left: auto;
	margin-right: auto;
        margin-top: 64px;
}

h1#pki_welcome {
	background-image: url(/img/pki_welcome.gif);
	background-position: 0 0;
	background-repeat: no-repeat;
	padding-bottom: 5px;
	height: 20px;
	}
	
h1#pki_welcome2 {
	background-image: url(/img/pki_welcome2.gif);
	background-position: 0 0;
	background-repeat: no-repeat;
	height: 37px;
	}
	
h1#pki_welcome3 {
	background-image: url(/img/pki_welcome3.gif);
	background-position: 0 0;
	background-repeat: no-repeat;
	height: 40px;
	}
	
h1#pki_welcome span {
	display: none;
	}
	
h1#pki_welcome2 span {
	display: none;
	}
	
h1#pki_welcome3 span {
	display: none;
	}
	
ul.linkage {
	list-style: none;
	padding: 8px;
	margin: 0px;
	}
	
ul.linkage li{
	background-image: url(/img/bullet_arrowblue.png);
	background-repeat: no-repeat;
	background-position: 0 .4em;
	padding-left: 10px;
	margin: .4em 0;
	}

#contentLeft {
	float: left;
	margin-top: 20px;
}

#contentRight {
	margin: 0 15px 0 295px;
}

 /**** following styles define the CLEAR BOX W/ROUNDED CORNERS */
 
 .clearBox {
 	width: 279px;
 	background: url(/img/corner_halflinebox_top.png) top right no-repeat;
 	}
 	
 .clearBox {
 	padding-top: 7px;
 	margin-bottom: 15px;
 	}
 	
 .clearBoxInner {
 	background: url(/img/corner_halflinebox_bottom.png) bottom left no-repeat;
 	}
 	
 .clearBoxInner {
 	width: 100%;
 	padding-bottom: 7px;
 	}
 	
 .clearBoxBody {
 	padding: 5px 14px;
 	border-left: 1px solid #b4b4b4;
 	border-right: 1px solid #b4b4b4;
 	}
 	
 .clearBoxBody h2 {
 	font-size: small;
 	}
 	
div.formrow {
  	padding: 5px 0;
  	font-size: x-small;
  	}
  	
div.formrow:after {
    content: "."; 
    display: block; 
    height: 0;
    overflow: hidden;
    clear: right; 
    visibility: hidden;
    }

    /* Holly Hack Targets IE Win only \*/
    * html .formrow {height: 1%;}
    /* End Holly Hack */

div.formrow span.label {
	float: left;
	width: 110px;
	text-align: right;
	font-weight: bold;
	padding: .5em 0;
	}

div.formrow span.formfield {
	float: right;
	width: 130px;
	text-align: left;
	}
	
p#intro {
	font-size: 1.3em;
	line-height: 1.2em;
	color: #000;
	}
	
p.endnote {
	font-size: smaller;
	margin-top: 3em;
	padding-top: 10px;
	line-height: 1.5em;
	border-top: 1px solid #333;
	}


/* CONTENT-NAV - begin */
	
.content-nav {
	margin: 0;
	padding: 0;
}

.content-nav a:visited {
    color: #06c;
}
		
.content-nav ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	font-size: 10px;
      	font-family: "Luxi Sans", verdana, arial, sans-serif;
	}
		
.content-nav:after,
.content-nav ul:after {
	content: "."; 
	display: block;
	height: 1px;
	margin-top: -1px;
	overflow: hidden;
	clear: both; 
	visibility: hidden;
	}

/* Holly Hack Targets IE Win only */
* html .content-nav {height: 1%;}
* html .content-nav ul {height: 1%;}
/* End Holly Hack */
		
ul.content-nav-rowone,
ul.content-nav-rowthree {
	margin-left: 10px;
	}
		
ul.content-nav-rowone {
	border-bottom: 3px solid #e6e6e6;
	margin-bottom: -3px;
	}
		
/* Holly Hack Targets IE Win only \*/
* html ul.content-nav-rowone {margin-right: 8px;}
* html ul.content-nav-rowone {margin-bottom: -2px;}
/* End Holly Hack */
		
ul.content-nav-rowone li, ul.content-nav-rowthree li {
	float: left;
	}
	
ul.content-nav-rowone li a, ul.content-nav-rowthree li a {
	display: block;
	padding: 4px 8px;
	}
		
ul.content-nav-rowtwo {
	background: url(/img/contentnav_rowtwo_b.gif) bottom left no-repeat;
	padding-bottom: 6px;
	margin-right: 8px;
	}
		
ul.content-nav-rowtwo li {
	display: inline;
	padding-left: 18px;
	}
		
a.content-nav-selected-link {
	color: #000;
	font-weight: bold;
	}
		
ul.content-nav-rowone li.content-nav-selected {
	background: url(/img/contentnav_tabr.gif) top right no-repeat;
	}
		
ul.content-nav-rowone a.content-nav-selected-link {
	background: url(/img/contentnav_tabl.gif) top left no-repeat;
	}
		
ul.content-nav-rowthree li.content-nav-selected {
	background: url(/img/contentnav_tabr.gif) bottom right no-repeat;
	}
		
ul.content-nav-rowthree a.content-nav-selected-link {
	background: url(/img/contentnav_tabl.gif) bottom left no-repeat;
	}
		
div.contentnav-row2 {
	background: #e6e6e6 url(/img/contentnav_rowtwo_t.gif) top left no-repeat;
	padding: 0px;
	clear: left;
	}
		
div.contentnav-row2 div.top {
	background: url(/img/contentnav_rowtwo_t.gif) top right no-repeat;
	margin-left: 8px;
	height: 6px;
	font-size: 0;
	}
		
div.contentnav-row2 div.bottom {
	background: url(/img/contentnav_rowtwo_b.gif) bottom right no-repeat;
	}
		
/* CONTENTNAV - end */




/************************************************************** MAIN NAVIGATION */
	
#mainNavOuter {
	width: 100%;
	background-image: url(/img/corner_mainnav_bottom_chopped.png);
	background-position: bottom right;
	background-repeat: no-repeat;
	background-color: #4f52b5;
	}
	
#mainNav {
	width: 100%;
	font-weight: bold;
	font-family: "Luxi Sans", verdana, helvetica, arial, sans-serif;
	font-size: x-small;
	}
	
	
/* float clear hack that has been hacked for Moz 1.5x and below */
#mainNavOuter:after {
    content: "."; 
    display: block; 
    height: 1px;
    margin-top: -1px;
    overflow: hidden;
    clear: both; 
    visibility: hidden;
    }
    /* Holly Hack Targets IE Win only \*/
    * html .mainNavOuter {height: 1%;}
    /* End Holly Hack */
    
    
#mainNavInner {
	width: 100%;
	height: 7px;
	background-image: url(/img/corner_mainnav_top_chopped.png);
	background-position: top right;
	background-repeat: no-repeat;
	}
	
#mainNav ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
	background-image: url(/img/corner_mainnav_tl.png);
	background-position: top left;
	background-repeat: no-repeat;
	}
	
#mainNav ul li {
	background: #b70000;
	display: block;
	float: left;
	padding: 0;
	margin: 0;
	}
	
#mainNav li#mainFirst-active,
#mainNav li#main-active,
#mainNav li#mainLast-active {
	background-color: #000080;
	}
	

/* special casing for left-most top tab */
#mainNav ul li a.mainFirstLink {
	background-image: url(/img/corner_mainnav_tl.png);
	background-position: top left;
	background-repeat: no-repeat;
	}
	
#mainNav li#mainFirst-active a.mainFirstLink {
	background-image: url(/img/corner_mainnav_tl_hi.png);
	background-position: top left;
	background-repeat: no-repeat;
	}
	
#mainNav ul li#mainFirst {
	background-image: url(/img/corner_mainnav_bl.png);
	background-position: bottom left;
	background-repeat: no-repeat;
	}
	
#mainNav li#mainFirst-active {
	background-image: url(/img/corner_mainnav_bl_hi.png);
	background-position: bottom left;
	background-repeat: no-repeat;
	}

/* special casing for right-most top tab */	
#mainNav ul li a.mainLastLink {
	background-image: url(/img/corner_mainnav_tr.png);
	background-position: top right;
	background-repeat: no-repeat;
	}
	
#mainNav li#mainLast-active a.mainLastLink {
	background-image: url(/img/corner_mainnav_tr_hi.png);
	background-position: top right;
	background-repeat: no-repeat;
	}
	
#mainNav ul li#mainLast {
	background-image: url(/img/corner_mainnav_br.png);
	background-position: bottom right;
	background-repeat: no-repeat;
	}
	
#mainNav li#mainLast-active {
	background-image: url(/img/corner_mainnav_br_hi.png);
	background-position: bottom right;
	background-repeat: no-repeat;
	}
	
#mainNav ul li a {
	display: block;
	float: left;
	text-decoration: none;
	color: #fff;
	padding: 5px 15px;
	font-size: 11px;
	text-decoration: none !important;
	}