/* === JPL CM Core Layout Stylesheet ===============================================
       
       This stylesheet sets the layout of the CM.  Do not add custom stylings here
       unless part of global product; use the respective Themes instead

   ========================================================================== */

/* ===  GENERAL CONSTRUCTS === */

    body {
    	background-color: #f2f2f2;
    	margin:0; 
    	padding:0;
    	text-align: center;
        font:normal 11px/15px verdana,arial,sans-serif;
        color:Black;
    }
    
    h1 {
        font:bold 30px "Trebuchet MS", verdana;
    }
        
    h2 {
        margin:0; 
        padding:0 0 10px 0;
        font:normal 18px "Trebuchet MS", verdana;
    }
    
    img { border:0; }

    a {
    	color:#990000;
    	text-decoration: underline;
    }

    a:hover {
    	color: #FF0000;
    	text-decoration: none;
    }
    
    .fixer { clear:both; height:1px; font-size:1px; overflow:hidden; }
    
    .nowrap { white-space:nowrap; }


/* === CONTAINER (OUTER SHELL) === */

    #container {
    	background:white;
    	width:950px;
    	margin:15px auto;
    	padding:2px;
    	border:solid 1px #A4A4A4;
    	text-align: left;
    }


/* === MASTHEAD ========================================================= */

    #masthead {
    	background:url(img/header/masthead-bg.gif);
    	border:solid 1px #CACACA;
    	position:relative;
    	min-height: 82px;
    }

    #masthead h1#logo {
        margin:0;
    	padding:10px;
    	width: 300px;
    }
    
    #masthead #status {
    	position:absolute;
    	top:0;
    	right:0;
    	width:368px;
        height:50px;
    	padding:5px 10px;
    	margin:10px;
    	background:white;
    	border:solid 1px #CACACA;
    	overflow:hidden;
    }


/* === SUBHEAD REGION ==================================================== */

    #subhead {
        margin:2px 0;
        height:24px;
        background:#999999;
        background-repeat:repeat-x;
    	border:solid 1px #666666;
    }
    
    /* === MENUS ========================================================= */
    
        .main_navigation {
            float:right;
            width:300px;
        }

        /* All tiers in the menu... */
        .main_navigation ul.AspNet-Menu, 
        .main_navigation ul.AspNet-Menu ul {
            width: 130px;
            font-size:10px;
        }

        /* All tiers EXCEPT THE TOP TIER in the menu... */
        .main_navigation ul.AspNet-Menu ul {
            left: 128px;
            top: 3px;
        }

        /* Each menu item. */
        .main_navigation ul.AspNet-Menu li {
            font-weight:bold;
        }

        /* Link area of each item */
        .main_navigation ul.AspNet-Menu li a,
        .main_navigation ul.AspNet-Menu li span {
            color:white;
            line-height:14px;
            padding:5px;
            border-left:1px solid #666666;
            border-bottom:0;
        }

        /* menu item that contains no submenu items (a "leaf") */
        .main_navigation ul.AspNet-Menu li.AspNet-Menu-Leaf a,
        .main_navigation ul.AspNet-Menu li.AspNet-Menu-Leaf span {
            background-image: none;
        }

        /* menu item icons. */
        .main_navigation ul.AspNet-Menu li a img {
            border-style: none;
            vertical-align: middle;
            margin:0 5px 0 0;
        }

        /* menu item hover state. */
        .main_navigation ul.AspNet-Menu li:hover, 
        .main_navigation ul.AspNet-Menu li.AspNet-Menu-Hover {
            background:#666666;            
        }

        /* menu item link/span hover state. */
        .main_navigation ul.AspNet-Menu li a:hover,
        .main_navigation ul.AspNet-Menu li span.Asp-Menu-Hover {
            color: White;
            background: transparent url(img/menu/activeArrowRight.gif) right center no-repeat;
        }

        .main_navigation ul.AspNet-Menu li.AspNet-Menu-Leaf a:hover {
            background-image: none;
        }

        /* === HORIZONTAL MENU RULES ======================================= */

            /* horizontal type menu */
            .main_navigation .AspNet-Menu-Horizontal {
                margin:0;
                width: 300px;
                z-index: 300;
            }

            /* top tier of the horizontal menu. MAKE SURE IT'S WIDE ENOUGH to accomodate all of the top tier menu items */
            .main_navigation .AspNet-Menu-Horizontal ul.AspNet-Menu {
                width:300px;
            }

            /* style all tiers EXCEPT THE TOP TIER in the menu this way... */
            .main_navigation .AspNet-Menu-Horizontal ul.AspNet-Menu ul {
                width:150px;
                left:0;
                top:2em;
                margin:4px 0 0 0;
            }

            /* all menu items. */
            .main_navigation .AspNet-Menu-Horizontal ul.AspNet-Menu li {
                width:100px;
                text-align:left;
            }

            /* menu items in the second tier (and lower) in the menu. */
            .main_navigation .AspNet-Menu-Horizontal ul.AspNet-Menu li li {
                text-align:left;
            }

            /* width of menu items below the top tier. */
            .main_navigation .AspNet-Menu-Horizontal ul.AspNet-Menu ul li {
                width:150px;
            }

        /* === SECOND LEVEL (and up) ======================================== */

            .main_navigation ul.AspNet-Menu ul {
                border-right:1px solid #666666;
                border-bottom:1px solid #666666;
            }
            
            .main_navigation ul.AspNet-Menu ul li {
                background-color:#666666;
                font-weight:normal;
            }

            /* Link area of each item */
            .main_navigation ul.AspNet-Menu ul li a,
            .main_navigation ul.AspNet-Menu ul span {
                background: transparent url(img/menu/arrowRight.gif) right center no-repeat;
            }
            
            /* menu item hover state. */
            .main_navigation ul.AspNet-Menu ul li:hover, 
            .main_navigation ul.AspNet-Menu ul li.AspNet-Menu-Hover {
                background:#999999;
            }
            

        /* === THIRD LEVEL (and up) ========================================= */

            /* Third tier menus have to be positioned differently than second (or top) tier menu items because */
            /* they drop to the side, not below, their parent menu item. This is done by setting the last margin */
            /* value (which is equal to margin-left) to a value that is slightly smaller than the WIDTH of the */
            /* menu item. So, if you modify the rule above, then you should modify this (below) rule, too. */
            .main_navigation .AspNet-Menu-Horizontal ul.AspNet-Menu li ul li ul {
                margin:-1.95em 0 0 150px;
            }

        
        
    /* --- END: MENUS ------------------------------------------------------- */

    /* === BREADCRUMBS ====================================================== */    
    
        #subhead .breadcrumbs {
            display:block;
            width:500px;
            line-height:14px;
            padding:5px 0 5px 12px;  
            color:white;
            font-size:10px;
            font-weight:bold;
        }
        
        #subhead .breadcrumbs a { color:white; }
        #subhead .breadcrumbs a:hover { color:black; }    

    /* --- END: BREADCRUMBS ------------------------------------------------- */

    /* === TABS ============================================================= */    

        .cm_tabs {
            margin-bottom:15px;
            border-bottom:1px solid #CACACA;
            height:25px;
            position:relative;
        }
        
        .cm_tabs ul {
            margin:0; padding:0;
            position:absolute;
        }
        
        .cm_tabs li {
            display:inline;
        }

        .cm_tabs a {
            display:block;
            width:auto;
            float:left;
            line-height:24px;
            padding:0 10px 0 4px;
            margin:0 4px 0 0;
            background:#CACACA;
            border:1px solid #CACACA;
            text-decoration:none;
            font-size:10px;
            color:black;
            outline:0;
        }

        .cm_tabs a:hover {
            background: url(img/header/masthead-bg.gif);
            color:Black;
        }

        .cm_tabs li.tabActive a {
            background:white;
            border-bottom:1px solid white;
        }

        .cm_tabs a img {
            float:left; 
            padding-top:4px;
            margin-right:4px;
        }

    /* --- END: TABS -------------------------------------------------------- */

    /* === CM BUTTONS ======================================================= */    
    
        #action_buttons {
            margin-bottom:0;
            padding:5px 0;
        }

        .cmbutton {
            padding:4px 10px 4px 3px;
            margin:0 4px 0 0;
            background:url(img/framework/cmbutton-bg.gif);
            text-decoration:none;
            font-size:10px;
            height:24px;
            line-height:16px;
            border-top:1px solid #E4E7EA;
            border-left:1px solid #E4E7EA;
            border-bottom:1px solid #cacaca;
            border-right:1px solid #cacaca;
            outline:0;
            color:Black;
        }

        .cmbutton:hover {
            background: url(img/header/masthead-bg.gif);
            color:Black;
        }

        .cmbutton:active {
            border-bottom:1px solid #E4E7EA;
            border-right:1px solid #E4E7EA;
            border-top:1px solid #cacaca;
            border-left:1px solid #cacaca;
        }

        .cmbutton img {
            vertical-align:top;
            padding-right:4px;
        }

        .button_row .cmbutton { padding-left:10px; }

        td.file_icon { text-align:right; padding-left:102px !important; padding-right:0 !important; }

        /* PNGFIX */
            .cmbutton .png { vertical-align:middle; }

        /* === IE PATCHES === */

            * html .cmbutton img { vertical-align:middle; }
            * html .cmbutton { padding:2px 10px 2px 3px; }
            * html .button_row .cmbutton { padding:4px 10px; }


    /* --- END: CM BUTTONS -------------------------------------------------- */




/* === FOOTER === */

    #footer {
        margin:0; padding:5px 10px;
        background:#CCCCCC; 
        border: solid 1px #999999;
        color:#666666;
        font:normal 10px tahoma,verdana,arial,sans-serif;
        text-align:right;        
    }

    #footer p { margin:0; padding:0; }
    #footer a { color:#666666; }
    #footer a:hover { color:white; }

    * html #footer { height:1%; }


/* === CONTENT REGION === */

    #content {
    	margin: 5px 0;
    	padding: 10px 20px 20px 20px;
    }
    
    /* === LOGIN FORM === */

        #content #loginform {
            margin: 0 auto;
            padding: 20px;
            width: 360px;
        }

    .warning {
	    background: #ffffed url(img/framework/ico/error.gif) 5px 10px no-repeat;
	    margin: 10px 0;
	    padding: 10px 5px 8px 28px;
	    border: 1px solid #e5e081;
	    line-height: 1.2em !important;
	    color: #333;
    }
    
    .warning strong {
        display:block;
    }
    
    .accepted {
	    background: #e8f6e5 url(img/framework/ico/accept.png) 5px 10px no-repeat;
	    margin: 10px 0;
	    padding: 10px 5px 8px 28px;
	    border: 1px solid #b4ddaa;
	    line-height: 1.2em !important;
	    color: #333;
    }

    

/* ==== NOT USED VAULT? === */


    /* === SAMPLE LOGO === */

        img.sample_logo {
            border:1px dashed #ADBFC7;
            margin:5px 0;
        }
        
    /* === FLASH UPGRADE MESSAGE === */
    
        p.upgrade {
            background-color:#FFFFCC;
            border:5px solid #FFCC00;            
            padding:10px !important;
            width:350px;
        }
        
        .help {
            display:none;
        
        }




    /* === FORMS (overrides /lib/css/forms.css) === */
/*
        fieldset {
            border:1px solid #ADBFC7;
            padding:6px 0 12px 0;
        }

        legend {
            background-color:#607985;
            color:white;
        }

        fieldset fieldset {
            margin:15px 20px 10px 20px;
            padding:5px 0 15px 1px;
            border:0;
            border:1px solid #ADBFC7;
        }

        fieldset fieldset {
            padding-bottom:5px;
        }

        fieldset fieldset legend {
            background-color:#607985;
            color:white;
        }

        fieldset fieldset .button_row {
            padding:0;
            margin-bottom:0;
        }

        .form_row ul { margin-top:2px; margin-left:0; padding-left:18px; list-style:square; }

*/

/* CHANGE PASSWORD */


.changePwd {
    border: 1px solid #999999;
}

.changePwd td {
    padding: 2px;
}

.changePwd td.changePwdHeader {
    background: #999999;
    color: #FFFFFF;
    font-weight: bold;
    padding: 4px 4px 6px 4px;
}

/* Styles for Ajax progress indicator */
.progress
{
	display: block;
	position: absolute;
	padding: 2px 3px;
}

.container
{
	border: solid 1px #808080;
	border-width: 1px 0px;
}

.header
{
	background: url(img/sprite.png) repeat-x 0px 0px;
	border-color: #808080 #808080 #ccc;
	border-style: solid;
	border-width: 0px 1px 1px;
	padding: 0px 10px;
	color: #000000;
	font-size: 9pt;
	font-weight: bold;
	line-height: 1.9;
	font-family: Arial,helvetica,clean,sans-serif;
}

.body
{
	background-color: #f2f2f2;
	border-color: #808080;
	border-style: solid;
	border-width: 0px 1px;
	padding: 10px;
}

#AlertDiv{
left: 40%; top: 40%;
/*position: absolute; width: 200px;*/
padding: 12px; 
border: #000000 1px solid;
background-color: white; 
text-align: left;
visibility: hidden;
z-index: 99;
}
