/* ~~~ Default Styles Template ~~~ */
html, body
{
	margin: 0;
	padding: 0;
}
body
{
	font: 11px Arial, Helvetica, sans-serif;
	background: #4870B1 url(../images/body_bg.gif) repeat-x 0 62px;
}
td{font-size: 11px;}
a,
a:link,
a:visited{color: #324E7C;}
a:hover,
a:active{color: #000;}

h1,h2,h3,h4,h5
{
	margin: 0 0 .5em;
}
h1{font: bold 22px Tahoma, Arial, Helvetica, sans-serif;}
h2{font: bold 18px Tahoma, Arial, Helvetica, sans-serif;}
h3{font: bold 13px Tahoma, Arial, Helvetica, sans-serif; margin: 1em 0 .5em;}
p{margin: 0 0 .8em;}
ul{}
hr
{
	height: 1px;
	border: none;
	color: #A0B4D6;
	background-color: #A0B4D6;
}
a img{border: none;}

/* ~~~ POSITIONING SELECTORS ~~~ */
#wrapper
{
	width: 100%;
	height: 100%;
	margin: 0;
}
#masthead{background-color: #fff; height: 41px;}
	#masthead h1{margin: 0 0 0 20px;}
#nav
{
	height: 21px;
	background-color: #fff;

}
	#nav p.login-links{margin: 0 20px 0 0; text-align: right;}
	#nav p.login-links a{font-weight: bold;}

#main
{
	vertical-align: top;
	padding: 10px 10px 0;
}

/* ~~~ ===== MAIN CONTENT TABLE =========================================================================== ~~~ */
table#tblcontent
{
	/*width: 100%;*/
	height: 100%;
	margin: 0 10px;
	background: url(../images/main_bg.gif) repeat-y 0 0;
}


td#leftcol-top
{
	width: 173px;
	height: 10px;
}

td#submenu
{
	vertical-align: top;
	background: url(../images/left_col_bg.gif) no-repeat 0 0;
	padding: 0 24px 0 16px;
}

td#midcol-top
{
	background: url(../images/midcol_bg.gif) repeat-x;
}
#content
{
	width: 100%;
	vertical-align: top;
	background-color: #fff;
	padding: 24px;
}

td#rightcol
{
	background: url(../images/rightcol_bg.gif) repeat-y;
}
/* ~~~ === MAIN NAVIGATION ================================================================================== ~~~ */
#nav ul
{
	list-style-type: none;
	margin: -1px 0 0 20px;
	padding: 0;
	float: left;
}
#nav ul li
{
	display: block;
	line-height: 21px;
	float: left;
	text-align: center;
	background: url(../images/tab_left.gif) no-repeat 0 1px;
	margin-right: 2px;
}
#nav ul li a
{
	display: block;
	height: 21px;
	float: left;
	color: #fff;
	font-weight: bold;
	font-size: 12px;
	padding: 0 16px;
	text-decoration: none;
	border-bottom: 1px solid #fff;
	background: url(../images/tab_right.gif) no-repeat 100% 1px;
}
#nav ul li a:hover{color: #324E7C; text-decoration: underline;}
#nav ul li.active a:hover{color: #fff; text-decoration: underline;}
#nav ul li.active
{
	background: url(../images/tab_left_on.gif) no-repeat 0 1px;
}
#nav ul li.active a
{
	border-bottom: 1px solid #324E7C;
	background: url(../images/tab_right_on.gif) no-repeat 100% 1px;
}
/* Correct the tab background image position for Standards complient browsers */
#nav > ul li,
#nav > ul li.active{background-position: 0 0;}
#nav > ul li a,
#nav > ul li.active a{background-position: 100% 0;}


/* ~~~ === SUB NAVIGATION =================================================================================== ~~~ */
#submenu h3
{
	color: #fff;
	font: bold 11px Arial, Helvetica, sans-serif;
	line-height: 2.5em;
	border-bottom: 1px solid #A0B4D6;
	margin: 0 0 .8em;
}
#submenu ul
{
	list-style-type: none;
	margin: 0 0 1em;
	padding: 0;
}
#submenu ul li
{
	background: url(../images/menu_arrow.gif) no-repeat 0 3px;
	padding-left: 14px;
	margin: 0 0 2px 4px;
}
#submenu ul li a,#submenu ul li a:link,#submenu ul li a:visited
{
	color: #fff;
	text-decoration: none;
}
#submenu ul li a:hover,#submenu ul li a:active{text-decoration: underline;}
/* ~~~ === PAGINATION ======================================================================================= ~~~ */

div.pagination
{
	height: 1.5em;
}
p.pleft{float: left;}
p.pright{float: right;}

/* ~~~ === TABLES =========================================================================================== ~~~ */
table.recordstable
{
	clear: both;
	width: 100%;
	border-collapse: collapse;
	border: 1px solid #ccc;
}
table.recordstable thead th
{
	border: 1px solid #ccc;
	background-color: #324E7C;
	color: #fff;
	font: bold 11px Arial, Helvetica, sans-serif;
	text-align: left;
	text-transform: uppercase;
	padding: 4px;
}
table.recordstable thead th a,
table.recordstable thead th a:link,
table.recordstable thead th a:visited{color: #fff;}
table.recordstable thead th.asc{}
table.recordstable thead th.desc{background: #2A4167 url(../images/arrow_down.gif) no-repeat 96% 50%;}

table.recordstable tbody tr.even{background-color: #ddd;}
table.recordstable tbody tr.ruled{background-color: #ddd;}
table.recordstable tbody tr.even{background-color: #eee;}
table.recordstable tbody td
{
	border: 1px solid #ccc;
	padding: 2px 4px;
}

/* center column text */
table.recordstable thead th.center,
table.recordstable tbody td.center{text-align: center;}

/* Right align column text */
table.recordstable thead th.right,
table.recordstable tbody td.right{text-align: right;}
table.recordstable tbody td.functions{white-space: nowrap;}

/* ~~~ FORM TABLE ~~~ */


table.formtable
{
	border-collapse: collapse;
}
table.formtable tfoot td
{
	padding: 4px 0;
	text-align: right;
	border: none;
}
table.formtable thead th
{
	border: 1px solid #ccc;
	background-color: #324E7C;
	color: #fff;
	font: bold 11px Arial, Helvetica, sans-serif;
	text-align: left;
	text-transform: uppercase;
	padding: 4px 10px;
}
table.formtable tbody th,
table.formtable tbody td
{
	border: 1px solid #ccc;
	padding: 4px 10px;
	background-color: #eee;

}
.checkbox{border: none;}
table.formtable tbody td table.mceEditor tbody td.mceToolbarTop{}
table.formtable tbody th{text-align: left;  white-space: nowrap;}
table.formtable tbody th label{font-weight: bold; font-size: 11px; text-align: right; vertical-align: middle;}
table.formtable tbody td a{font-weight: bold;}
/*table.formtable tbody td img{position: relative; top: -2px; left: 4px;}*/

/* ~~~ Radio and Checkbox Table ~~~ */
table.formtable tbody td table.radiotable td{border: none; padding: 0 2px 0 0;}

/* ~~~ === FORMS ================================================================================================ ~~~ */

form{margin: 0;}
input, textarea, select{font: 11px Arial, Helvetica, sans-serif; border: 1px solid #ccc;}
legend{display: none;}
fieldset{border: none;}
.button,
.cancel-button
{
	font: bold 11px Arial, Helvetica, sans-serif;
	color: #fff;
	padding: 1px 2px;
	text-transform: uppercase;
}
.button{background-color: #7C6032;}
.cancel-button{background-color: #655A49;}
.radio{border: none;}

/* ~~~ === LIST ================================================================================================== ~~~ */

/* ~~~ FORMATING CLASSES ~~~ */
.g10
{
	width: 10px;
	vertical-align: top;
}
.replace span{display: none;}
.center{text-align: center;}

/* ~~~ === LOGIN PAGE STYLES ===================================================================================== ~~~ */
#loginform
{
	width: 317px;
	margin: 0 auto;
	background: url(../images/login_bg.gif) repeat-y;
}
#loginform h1{font: bold 12px Tahoma, Arial, Helvetica, sans-serif; color: #fff; margin:0 0 1.2em;}
#loginform-top
{
	padding-top: 14px;
	background: url(../images/login_top.gif) no-repeat;
}
#loginform-btm
{
	height: 14px;
	background: url(../images/login_bottom.gif) no-repeat 0 100%;
}

/* ~~~ === POPUP PAGE STYLES ====================================================================================== ~~~ */
#indicator-bar
{
	height: 20px;
	border: 1px solid #ccc;
	margin: 1em 40px;
	background-color: #fff;
}
#indicator-bar span
{
	width: 80px;
	height: 20px;
	display: block;
	float: left;
	background-color: #5B7FB8;
}


/* ~~~ === SITE MAP =============================================================================================== ~~~ */
#sitemap .root a span{vertical-align: middle;}
table.sitemap-row,
table.sitemap-child
{
	width: 100%;
}

table.sitemap-row td.lastchild,
table.sitemap-row td.icon{width: 18px;}
table.sitemap-row td.icon{background: url(../images/line.gif) repeat-y; vertical-align: top;}
table.sitemap-row td.lastchild{background: url(../images/empty.gif) no-repeat; vertical-align: top;}


table.sitemap-page{width: 100%; border-collapse: collapse;}
table.sitemap-page tr{background-color: #eee; border-bottom: 1px solid #fff;}
table.sitemap-page td.page-icon{width: 18px; background-color: #fff;}
table.sitemap-page td.actions
{
	width: 1%;
	white-space: nowrap;
	text-align: right;
}
table.show{display: ; width: 100%;}

table.treetable tbody td {
    border-bottom: 3px solid #FFFFFF;
}
/* ~~~ Tree View Icons ~~~ */
a.edit
{
    padding: 1px 4px 1px 20px;
    background: url(../images/icons/pencil.png) no-repeat 0 50%;
}
a.delete
{
    padding: 1px 4px 1px 20px;
    background: url(../images/icons/delete.png) no-repeat 0 50%;
}
a.addSubPage
{
    padding: 1px 8px 1px 20px;
    background: url(../images/icons/layout_add.png) no-repeat 0 50%;
}
a.editPage
{
    padding: 1px 8px 1px 20px;
    background: url(../images/icons/layout_edit.png) no-repeat 0 50%;
}
a.deletePage
{
    padding: 1px 4px 1px 20px;
    background: url(../images/icons/layout_delete.png) no-repeat 0 50%;
}
a.up
{
    padding: 1px 6px 1px 16px;
    background: url(../images/icons/arrow_up.png) no-repeat 0 50%;
}
a.down
{
    padding: 1px 4px 1px 16px;
    background: url(../images/icons/arrow_down.png) no-repeat 0 50%;
}
a.back
{
    padding: 1px 0 1px 16px;
    background: url(../images/icons/resultset_previous.png) no-repeat 0 100%;
}
a.add
{
    background: url(../images/icons/add.gif) no-repeat 0 0;
    padding: 1px 0 1px 18px;
    margin-right: 4px;
}
a.view
{
    background: url(../images/icons/magnifier.gif) no-repeat 0 0;
    padding: 1px 0 1px 18px;
    margin-right: 4px;
}
p.plan-links{margin: 0 0 1em;}
table.treetable tbody tr
{
	background-color: #F9F9F9;
}
table.treetable tbody tr.ruled
{
	background-color: #ebebeb;
}
table.treetable tbody tr.ruled{background-color: #ddd;}
table.treetable tbody tr.foo{background-color: #f4f4f4;}
table.treetable td.actions{white-space: nowrap;}
table.treetable td.actions div.buttons
{
    float: right;
}
table.treetable td.actions div.buttons a
{
    display: block;
    float: left;
    text-align:left;
}


.requiredfield
{
    font-size: 11px;
    font-weight: normal;
    color: red;
}

/* ~~~ === FILE MANAGEMENT STYLES =============================================================================== ~~~ */


td.path,
td.totals{border-bottom: 2px solid #fff;}
td.path
{
    background-color: #DDD;
    padding: 4px;
}
td.totals
{
    font-weight: bold;
    text-align: right;
    background-color: #DDD;
    padding: 2px 4px 4px;
}
td.totals a.previous img,
td.totals a.next img{position: relative; top: 3px;}

/* ~~~ OPTIONS LISTS ~~~ */
#folder-options
{
    background-color: #eee;
    /*width: 100%;*/
}
#filedetail-options ul,
#folder-options ul
{
    list-style-type: none;
    margin: 0 0 0 4px;
    padding: 0;
}
#filedetail-options ul li,
#folder-options ul li
{
    float: left;
    line-height: 1.8em;
}
#filedetail-options li a,
#folder-options ul li a
{
    font-weight: bold;
    padding: 2px 4px 2px 0;
}
#folder-options p
{
    float: right;
    line-height: 1.8em;
    font-weight: bold;
    color: #333;
    margin: 0 4px 0 0;
}
/* ~~~ File Details Options List ~~~ */
#filedetail-options
{
    background-color: #eee;
    height: 1.8em;
}
#filedetail-options ul{float: right;}
#filedetail-options p{float: left; margin: 0 0 0 4px;}
#filedetail-options p a{font-weight: bold; padding-top: 4px;}

/* ~~~ Folders Table ~~~ */
div.folders
{
    clear: both;
    margin: 4px 0 1em;
}
div.folders div.folder
{
    text-align: center;
    border: 1px solid #ccc;
    float: left;
    width: 120px;
    height: 120px;
    margin: 4px;
}
div.folders div.folder table td
{
    padding: 12px;
    text-align: center;
}
table.tblfolders td a{font-weight: bold;}

/* ~~~ List view ~~~ */
table.listview tbody td a{font-weight: bold;}
table.listview tbody td{white-space: nowrap;}

/* ~~~ FILE DETAIL ~~~ */
table.filedetail
{
    clear: both;
    width: 100%;
    margin: 4px 0 1em;
    border-collapse: collapse;
}
table.filedetail td
{
    border: 1px solid #ccc;
    vertical-align: top;
}
table.filedetail td p.setoptions
{
    margin: 1em;
    padding-left: 18px;
}
table.filedetail td.file
{
    padding: 28px 48px;
    text-align: center;
    vertical-align: middle;
}

table.filedetail td.filedetails{ background-color: #eee;}
table.filedetail td.filedetails table
{
    width: 100%;
    border-collapse: collapse;
}
table.filedetail td.filedetails table{height: 100%;}
table.filedetail td.filedetails table th
{
    background-color: #DEDEDE;
    font-size: 11px;
    font-weight: normal;
    text-align: right;
    width: 1%;
    white-space: nowrap;
}
table.filedetail td.filedetails table th.header{background-color: #D7D7D7; font-weight: bold;}
table.filedetail td.filedetails table td{background-color: #eee; white-space: nowrap;}
table.filedetail td.filedetails table th,
table.filedetail td.filedetails table td
{
    padding: 2px 4px;
    border: 1px solid #fff;
}
/* ~~~ ICONS ~~~ */
#filedetail-options li,
#folder-options li
{
    padding: 0 2px 0 18px;
    margin-right: 1px;
}
#folder-options .refreshfolder{background: url(../images/icons/arrow_refresh.png) no-repeat 0 2px;}
#folder-options .addfolder{background: url(../images/icons/folder_add.png) no-repeat 0 2px;}
#folder-options .editfolder{background: url(../images/icons/folder_edit.png) no-repeat 0 2px;}
#folder-options .removefolder{background: url(../images/icons/folder_delete.png) no-repeat 0 2px;}
#folder-options .addfile{background: url(../images/icons/page_add.png) no-repeat 0 2px;}
#folder-options .listview{background: url(../images/icons/application_view_list.png) no-repeat 0 2px;}
#folder-options .iconview{background: url(../images/icons/application_view_icons.png) no-repeat 0 2px;}
#folder-options .viewoptions
{
    position: relative;
    background: url(../images/icons/layout_edit.png) no-repeat 0 2px;
}
#optionstable
{
    position: absolute;
    top: 1.8em;
    left: 0;
    width: 400px;
    z-index: 3;
    background-color: #fff;

}
#optionstable table
{
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #ccc;
}
#optionstable table thead th
{
    font-size: 12px;
    text-align: left;
    border: 1px solid #ccc;
    background-color: #EEEEEE;
    padding: 4px;
}
#optionstable table thead th.right{text-align: right;}
#optionstable table tbody td
{
    padding: 6px;
    border: 1px solid #ccc;
}
#optionstable table tfoot td
{
    text-align: right;
    padding: 4px;
    border: 1px solid #ccc;
}
#filedetail-options p{margin: 0; line-height: 18px;}
#filedetail-options .delete{background: url(../images/icons/delete.png) no-repeat 0 2px;}
#filedetail-options .edit{background: url(../images/icons/pencil.png) no-repeat 0 2px;}
#filedetail-options .download
{
    background: url(../images/icons/arrow_down.png) no-repeat 0 2px;
}
#filedetail-options .movefile{background: url(../images/icons/page_go.png) no-repeat 0 2px; }

p.setoptions{background: url(../images/icons/cog_go.png) no-repeat 0 2px;}


/* ~~~ IE HACKS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
* html table.treetable tbody td{border-bottom: none;}
* html table.formtable img.arrowRequired{position: relative; top: -2px; left: 2px;}