/* DO NOT MODIFY THIS FILE! It is updated automatically */

/* INSERT COPYRIGHT HERE */

/* This is the stylesheet used in the main panels only.  

   This file inherits the styles use in sme_core in the "header" section, and
   as noted in the code below. Note that some of the styles here are empty.  
	This is because the style definition has moved safely to sme_core.css
	and the placeholder is left here for reference or future use.

   There are a lot of styles in here, so read carefully.  Each one is documented.

	Styles that were in the old stylesheets, but are not used in the UI are at the
	bottom, commented out.  These can be removed at the end of the 6.0 cycle */

/* general page properties */
body, body.main { 
    margin-top: 5px; 
    margin-right: 20px; 
    margin-bottom: 5px; 
    margin-left: 5px; 
    font-family: Verdana, Arial, Helvetica, sans-serif;
}


/* Table properties ****************************************/
/* There are THREE  types of tables
   1. *.sme-layout*     is used for layout purposes.  It is the "master
	                      container" on a page.  It controls the top-level table
                         inside of which everything else is put.
	2. *.sme-noborders*  is used for layout, and defines a borderless table and 
	                      cells used within it.
	2. *.sme-border*     is used for tabular data, and defines a header row and borders
	                      for tables that need borders

	*/

/*First, some defaults */
td {
    text-align: left;
}


/* 
sme-layout* : Used for top-level layout
*/

table.sme-layout {
    border-collapse: collapse;
	 margin-bottom: 2px;
	 margin-top: 2px;
}

tr.sme-layout {
    border: 1px solid #808184; 
}

table.sme-layout tr td,
td.sme-layout {
    border: 1px solid #808184; 
}

/*This special style is actually used only for the button row along the bottom of each page*/
table.sme-layout tr th,
th.sme-layout {
    border: 1px solid #808184; 
    color: white;
    background: #15325f;
    font-size: 9pt;
    font-weight: bold;
    text-align: right; 
    padding: 4px;
}

/* 
sme-noborders* : Used for mid-level layout
*/
table.sme-noborders {
    padding: 0px;
    margin-top: 0px;
    margin-bottom: 20px;
    margin-left: 0px;
    margin-right: 0px;
    font-size: 11px;
}
table.sme-noborders tr td.label,
td.sme-noborders-label {
    font-weight: bold;
    text-align: right;
    background: #cccdce;
    font-size: 11px;
}
table.sme-noborders tr td.content,
td.sme-noborders-content {
    text-align: left;
    vertical-align: top;	
    font-size: 11px;
}
table.sme-noborders tr td.info,
td.sme-noborders-info, div.sme-noborders-info {
    text-align: left;
    vertical-align: top;	
}
/* Used for a left-most column of radio buttons (see date/time panel) */
td.sme-radiobutton {
    width: 30px;
}
/* 
sme-border* : Used for tabular data
*/
table.sme-border {
    border-collapse: collapse;
    border: 2px solid #e7eaef;
    empty-cells: show;
    margin: 5px 5px 5px 2px;	 
}
table.sme-border tr td,
td.sme-border,
td.sme-border-warning,
td.sme-border-right,
td.sme-border-center {
    border: 1px solid #e7eaef;
    font-size: 10px;
    font-weight: normal;
    color: #000000;
    text-align: left;
    padding-left: 2px;
    padding-right: 2px;
    padding-top: 3px;
    padding-bottom: 3px;
}
table.sme-border tr td.warning,
td.sme-border-warning {
    color: red;
	 }
table.sme-border tr td.right,
td.sme-border-right {text-align: right;}
table.sme-border tr td.center,
td.sme-border-center {text-align: center;}
table.sme-border tr th,
th.sme-border {
    border: 1px solid #e7eaef; 
    color: white;
    background: #15325f;
    font-size: 10px;
    font-weight: bold;
    text-align: center;
	 vertical-align: bottom;
    padding-left: 2px;
    padding-right: 2px;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
    padding-bottom: 3px;
	 /*border-width: 1px;
	 border-style: solid;
    border-color: #F2F0EE #75736E #75736E #F2F0EE ;*/ 
}
table.sme-border th td a, table.sme-border th td.right a, table.sme-border th td.center a,
td.sme-border a, td.sme-border-right a, td.sme-border-center a {
    font-size: 10px;
}

/* misc layout stuff*/
/* these two are for any error messages that pop up*/
div.error, div.sme-error, span.error, span.sme-error {
    color: red;
    margin-left: 20px;
    margin-right: 20px;
    margin-top:0px;
    margin-bottom:0px;
    background-color: whitesmoke;
    border: 2px solid red;
    padding: 5px 10px 5px 10px;
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 5px;
    margin-bottom: 5px;
    /* drop shadow, done for various browsers */
    -moz-box-shadow: 1px 1px 2px red;
    -webkit-box-shadow: 1px 1px 2px red;
    box-shadow: 1px 1px 2px red;
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#00FF00')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#00FF00');
    /* Rounded corners */
    border-radius: 5px;

}

div.error-noborders, div.sme-error-noborders,
span.error-noborders, span.sme-error-noborders
{
    color: red;
    background-color: white;
    border-width: 0px;
}

div.error h2, span.error h2,
div.error p, span.error p
{
    color: red;
}
/* These are for the special case of a link being inside an error message */
div.sme-error a, div.error a, span.error a, span.sme-error a,
div.error-noborders a, div.sme-error-noborders a,
span.error-noborders a, span.sme-error-noborders a
{
    color: #ff0000;
    font-weight: bold;
    text-decoration: underline;
}

div.sme-error p, span.sme-error p
{
    color: red;
}

/* For when a link is the error message */
a.error:link, a.error:visited, a.error:hover, a.error:active {
    color: #ff0000;
    font-weight: normal;
    text-decoration: underline;
}

/* these two are for any success messages that pop up*/
div.success, span.success {
    color: darkgreen;
    background-color: whitesmoke;
    border: 2px solid green;
    padding: 5px 10px 5px 10px;
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 5px;
    margin-bottom: 5px;
    /* drop shadow, done for various browsers */
    -moz-box-shadow: 1px 1px 2px green;
    -webkit-box-shadow: 1px 1px 2px green;
    box-shadow: 1px 1px 2px green;
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#00FF00')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#00FF00');
    /* Rounded corners */
    border-radius: 5px;
}

/* These two are for the special case of a link being inside a success message */
div.success a, span.success a 
{
    color: #006400;
    font-weight: bold;
    text-decoration: underline;
}

div.success h2, span.success h2,
div.success p, span.success p
{
    color: green;
}

/*These two define the copyright footer styles, one for the line and one for the text*/
hr.sme-copyrightbar {
}
.sme-copyright {
}

button,
input[type="button"],
input[type="file"],
input[type="reset"],
input[type="submit"] {
    /* round the corners */
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
}

/* These ones define styles for the links that are made to look like
   standard form submit buttons */
a.button-like:link, 
a.button-like:visited,
a.button-like:hover,
a.button-like:active,
a.button-like-small:link, 
a.button-like-small:visited,
a.button-like-small:hover,
a.button-like-small:active { 
    font-size: 13px; 
    color: black; 
    background: #D4D0C8; 
    text-decoration: none;
    text-align: left; 
    border-color: #F2F0EE #75736E #75736E #F2F0EE ; 
    margin-top: 10px; 
    margin-right: 2px; 
    margin-bottom: 10px; 
    margin-left: 2px; 
    border-style: solid; 
    border-top-width: 2px; 
    border-right-width: 2px; 
    border-bottom-width: 2px; 
    border-left-width: 2px;
    padding-top: 2px; 
    padding-bottom: 2px; 
    padding-left: 6px; 
    padding-right: 6px; 
    /* round the corners */
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
 }
a.button-like-small:link, 
a.button-like-small:visited,
a.button-like-small:hover,
a.button-like-small:active { 
    border-top-width: 1px; 
    border-right-width: 1px; 
    border-bottom-width: 1px; 
    border-left-width: 1px;
    font-size: 10px; 
    padding-top: 0px; 
    padding-bottom: 0px; 
    padding-left: 1px; 
    padding-right: 1px; 
}
a.button-like:active,
a.button-like-small:active { 
    border-color: #75736E #F2F0EE #F2F0EE #75736E  ; 
}

span.helpicon 
{
    display: inline;
    position: absolute;
    right: 5px;
}

/* EXPERIMENTAL SECTION */
/* These are styles used to experiment with. */

/* class for links, similar to the class in sme_menu.css, but for a red button */
a.button-like-red:link, 
a.button-like-red:visited,
a.button-like-red:hover,
a.button-like-red:active { 
    border-left: #F1726C 2px solid;
    border-right: #B42025 2px solid;
    border-top: #F1726C 2px solid;
    border-bottom: #B42025 2px solid;
 }
a.button-like-red:active { 
    border-color: #75736E #F2F0EE #F2F0EE #75736E  ; 
}

/* CSS for tab menu support.
   See http://getbootstrap.com/javascript/#tabs
   Need to standardize across all MSL and App pages.
   Used in the masinstaller with angularjs. Adapted from twitter bootstrap.css which contains css for
   many tab styles.
*/
.msl-tabbable {
  margin-top: 14px;
}

.msl-tabbable:before,
.msl-tabbable:after {
  display: table;
  content: "";
  line-height: 0;
}
.msl-tabbable:after {
  clear: both;
}
.msl-tab-content {
  overflow: auto;
}
.msl-tab-content > .msl-tab-pane {
  display: none;
}
.msl-tab-content > .active {
  display: block;
}
.msl-nav {
  margin-left: 0;
  margin-bottom: 20px;
  padding: 0;
  list-style: none;
}
.msl-nav > li > a {
  display: block;
}
.msl-nav > li > a:hover,
.msl-nav > li > a:focus {
  text-decoration: none;
  background-color: #eeeeee;
}
.msl-nav-tabs:before,
.msl-nav-tabs:after {
  display: table;
  content: "";
  line-height: 0;
}
.msl-nav-tabs:after {
  clear: both;
}
.msl-nav-tabs > li {
  float: left;
}
.msl-nav-tabs {
  border-bottom: 1px solid #ccc;
  margin: 0px;
  padding: 0px 0px 0px 10px;
}
.msl-nav-tabs > li {
  background: #E8EBF0;
  border: 1px solid #ccc;
  color: #666;
  line-height: 28px;
  font-size: 11px;
  margin-right: 8px;
  margin-bottom: -1px;
  padding: 2px 10px 2px 10px;
  -webkit-border-radius: 4px 4px 0 0;
  -moz-border-radius: 4px 4px 0 0;
  border-radius: 4px 4px 0 0;
}
.msl-nav-tabs > li > a {
  color: #666;
  text-decoration : none;
}
.msl-nav-tabs > li > a:hover {
  color: #f00;
}
.msl-nav-tabs > .active {
  background: #fff;
  margin-bottom: -1px;
  border-bottom: 1px solid #fff;
  color: #000;
  font-weight: bold;
  cursor: default;
}
.msl-nav-tabs > .active > a,
.msl-nav-tabs > .active > a:hover,
.msl-nav-tabs > .active > a:focus {
  color: #000;
  background: #fff;
  cursor: default;
}


/*
Searching the web panels on a MAS server I don't see any use of the 'nav' tags below for tabs.
Implementing a similiar look for msl-tab tags above. Commenting them out for removal later.
*/

/* Support for tabbed menus in the main panel. */
/*
#nav-noborders {
    padding: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    font-size: 11px;
    width: 100%;
}

#navmenu {
    border-bottom : 1px solid #ccc;
    margin : 0;
    padding-top : 10px;
    padding-bottom : 19px;
    padding-left : 10px;
}

#navmenu ul, #navmenu li    {
    display : inline;
    list-style-type : none;
    margin : 0;
    padding : 0;
}

#navmenu a {
    background : #E8EBF0;
    border : 1px solid #ccc;
    color : #666;
    float : left;
    font-size : small;
    font-weight : normal;
    line-height : 14px;
    margin-right : 8px;
    padding : 2px 10px 2px 10px;
    text-decoration : none;
}

#navmenu a:link.active, #navmenu a:visited.active, #navmenu a.here {
    background : #fff;
    border-bottom : 1px solid #fff;
    color : #000;
}

#navmenu a:hover    {
    color : #f00;
}

#navmenu ul a:hover {
    color : #f00 !important;
}
*/

/*
Override the 'table.sme-border tr td' specific style. Used in the MAS installer.
Not able to override the css unless it is in this file, since the header loads this
with the style tag.

*/
table.sme-border tr td.display-app-header-cell {
    border: 1px solid #e7eaef;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-style: italic;
    font-size: 10px;
    font-weight: bold;
    color: #000000;
    text-align: left;
    padding-left: 2px;
    padding-right: 2px;
    padding-top: 10px;
    padding-bottom: 3px;
}


/*These are style definitions found in the UI but not defined in any file I 
  could locate.  They're listed here for historical purposes, but have been
  removed from the UI

pagedescription (used in the first paragraph of text on a page) [HTML.pm]
label (used in forms) [HTML.pm]
field (used in forms) [HTML.pm]
fielddescription (used ???)[HTML.pm]
buttons (used in forms) [HTML.pm]
*/  
/*td.sme-submitbutton {
	text-align: right;
}
*/

/*These style definitions were found int he old css file (manager.css)
  but don't seem to ever be referenced in the code.  They're here
  for reference.

.banner {
    background: #000000;
    color: #ffffff;
}
.banner-right {
    background: #e17200;
    color: #ffffff;
}
.border {
    background: #000000;
    color: #000000;
    border-color: #000000;
}
.sidebar {
    width: 200px;
    background: #ffffff;
    font-size: smaller;
    font-weight: normal;
}
.sidebar-title {
    background: #1e385b;
    color: #ffffff;
    font-weight: bold;
}
.newsitem {
    background: #ffffff;
    color: #000000;
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
}
.newsitem-title {
    background: #e7eaef;
    color: #ffffff;
    font-weight: bold;
}
.newsitem-footer {
    background: #e7eaef;
    color: #000000;
    font-size: smaller;
    text-align: right;
}
.newsitem-detail {
    font-size: smaller;
    font-weight: normal;
} 
.formlabel {
    background: #c0c0c0;
    color: #000000;
    font-size: small;
    font-weight: bold;
    text-align: right;
}
.welcome-link {
    background: #ffffff;
    color: #1e385b;
}
.littlelink {
}
#textlayer {
    position: absolute;
    visibility: inherit;
    top: 160px;
    left: 50px;
    z-index: 2;
}
#para {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #000000;
}  
#title {
    font-weight: bold;
    padding: 7px 7px 7px 7px;
    color: #ffffff;
} 
*/