/* CCSTheme v 3.x */
/* General */

/* BEGIN Common */
body
{
    font-family: Tahoma;
    font-size: 80%;
}

.text
{
    color: #000000;
}

a.menulink:link, a.menulink:visited
{
    color: #5284b7;
}

a.menulink:hover, a.menulink:active
{
    color: #ff7272;
}

a:link
{
    color: #5284b7;
}

a:visited
{
    color: #873c87;
}

a:hover, a:active
{
    color: #ff7272;
}

ul, ol, blockquote
{
    margin-top: 5px;
    margin-bottom: 10px;
    margin-left: 20px;
}

form
{
    margin: 0px;
}

h1
{
    font-size: 150%;
    margin-top: 5px;
    margin-bottom: 5px;
}

h2
{
    font-size: 130%;
    margin-top: 15px;
    margin-bottom: 5px;
}

h3
{
    font-size: 110%;
    font-style: italic;
    margin-top: 15px;
    margin-bottom: 5px;
}

h4
{
    font-size: 100%;
    margin-top: 15px;
    margin-bottom: 5px;
}

h5
{
    font-size: 100%;
    font-style: italic;
    margin-top: 15px;
    margin-bottom: 5px;
}

h6
{
    font-size: 90%;
    margin-top: 15px;
    margin-bottom: 5px;
}

th
{
    font-family: Tahoma;
    font-size: 80%;
}

td
{
    font-family: Tahoma;
    font-size: 80%;
}

/* END Common */

.Header
{
    width: 100%;
	margin:0;
}

.Header th
{
    font-size: 110%;
    font-weight: bold;
    text-align: left;
    padding: 3px;
    background-image: url('Images/HeaderBg.gif');
    color: #ffffff;
    width: 100%;
    white-space: nowrap;
}

.Header a:link
{
    color: #ffffff;
}

.Header a:visited
{
    color: #ffffff;
}

.Header a:hover, .Caption a:active
{
    color: #ffffff;
    text-decoration: none;
}

.HeaderLeft
{
    background-image: url('Images/HeaderLeft.gif');
	padding:0;
}

.HeaderRight
{
    background-image: url('Images/HeaderRight.gif');
	padding:0;
}

.HeaderLeft img
{
    width: 4px;
}

.HeaderRight img
{
    width: 9px;
}

.TableRow th.Right
{
    text-align: right;
}

/* Grid Options */
.Grid
{
    border: 1px solid #81a9d2;
    width: 100%;
	margin: 0;
}

.Caption th, .TableRow th.Caption
{
    font-size: 80%;
    text-align: left;
    vertical-align: top;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    background-color: #e1e1f6;
    color: #000000;
    white-space: nowrap;
}

.Caption td
{
    font-size: 80%;
    text-align: left;
    vertical-align: top;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    background-color: #e1e1f6;
    color: #000000;
    white-space: nowrap;
}

.Caption a:link
{
    color: #000000;
}

.Caption a:visited
{
    color: #000000;
}

.Caption a:hover, .Caption a:active
{
    color: #ff7272;
}

.Caption img
{
    margin: 2px;
    vertical-align: middle;
}

.Caption input
{
    vertical-align: middle;
}

.Row th
{
    font-size: 80%;
    font-weight: normal;
    text-align: left;
    vertical-align: top;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    background-color: #f9f9f9;
    color: #000000;
    white-space: nowrap;
    color: #000000;
}

.Row td,
.RowNoColor td
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    vertical-align: top;
    background-color: #f9f9f9;
}

.Row td
{
    color: #000000;
}

.Row a:link
{
    color: #5284b7;
}

.Row a:visited
{
    color: #873c87;
}

.Row a:hover, .Row a:active
{
    color: #ff7272;
}

.TableRow th
{
    font-size: 80%;
    font-weight: normal;
    text-align: left;
    vertical-align: top;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    background-color: #f9f9f9;
    color: #000000;
    white-space: nowrap;
    color: #000000;
}

.TableRow td
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    vertical-align: middle;
    text-align: left;
    background-color: #f9f9f9;
    color: #000000;
}

.TableRow a:link
{
    color: #5284b7;
}

.TableRow a:visited
{
    color: #873c87;
}

.TableRow a:hover, .TableRow a:active
{
    color: #ff7272;
}

.Separator
{
    color: #81a9d2;
}

.Separator td
{
    height: 1px;
}

.AltRow th
{
    font-size: 80%;
    font-weight: normal;
    text-align: left;
    vertical-align: top;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    background-color: #f9f9f9;
    color: #000000;
    white-space: nowrap;
    color: #000000;
}

.AltRow td
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    vertical-align: top;
    background-color: #efeff9;
    color: #000000;
}

.HighlightRow td
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    vertical-align: top;
    background-color: #ffff66;
    color: #000000;
}

.HighlightRedRow td
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    vertical-align: top;
    background-color: #ff0000;
    color: #000000;
}

.HighlightDeletedRow td
{
    font-size: 80%;
    font-style: italic;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    vertical-align: top;
    background-color: #DDDDDD;
    color: #000000;
}

.HighlightUpdatedRow td
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    vertical-align: top;
    background-color: #D6EEFF;
    color: #000000;
}

.HighlightAddedRow td
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    vertical-align: top;
    background-color: #D2FFBF;
    color: #000000;
}

.MergedRows td
{
    font-size: 80%;
    padding: 3px;
    border: 0px;
    vertical-align: top;
    background-color: #f9f9f9;
    color: #000000;
}

.AltRow a:link
{
    color: #5284b7;
}

.AltRow a:visited
{
    color: #873c87;
}

.AltRow a:hover, .AltRow a:active
{
    color: #ff7272;
}

.NoRecords td
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    background-color: #f9f9f9;
    color: #000000;
    vertical-align: top;
}

.Footer td
{
    font-size: 80%;
    padding: 3px;
    border: 1px solid #e1e1f6;
    border-left: 0px none;
    background-color: #f9f9f9;
    color: #000000;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    color: #000000;
}

.Footer a:link
{
    color: #5284b7;
}

.Footer a:visited
{
    color: #873c87;
}

.Footer a:hover, .Footer a:active
{
    color: #ff7272;
}

.Footer img
{
    margin: 2px;
    vertical-align: middle;
}

.Footer input
{
    margin: 2px;
    vertical-align: middle;
}

/* Record Options */
.Record
{
    border: 1px solid #81a9d2;
    width: 100%;
	margin:0;
}

.Error td
{
    font-size: 100%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    color: #FF0000;
    vertical-align: top;
    background-color: #f9f9f9;
}

.Controls th
{
    font-size: 80%;
    font-weight: normal;
    text-align: left;
    vertical-align: top;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    background-color: #f9f9f9;
    color: #000000;
    white-space: nowrap;
    color: #000000;
}

.Controls td
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    vertical-align: top;
    background-color: #f9f9f9;
    color: #000000;
}

.Bottom td
{
    font-size: 80%;
    padding: 3px;
    border: 1px solid #e1e1f6;
    border-left: 0px none;
    background-color: #f9f9f9;
    color: #000000;
    text-align: right;
    vertical-align: middle;
    white-space: nowrap;
    color: #000000;
}

.Bottom a:link
{
    color: #5284b7;
}

.Bottom a:visited
{
    color: #873c87;
}

.Bottom a:hover, .Caption a:active
{
    color: #ff7272;
}

.Bottom img
{
    margin: 2px;
    vertical-align: middle;
}

.Bottom input
{
    margin: 2px;
    vertical-align: middle;
}

/* Report */
.GroupCaption th
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    white-space: nowrap;
    text-align: left;
    vertical-align: top;
    font-weight: bold;
    background-color: #efeff9;
    color: #000000;
}

.GroupCaption td
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    vertical-align: top;
    font-weight: bold;
    background-color: #f9f9f9;
    color: #000000;
}

.GroupCaption a:link
{
    color: #000000;
}

.GroupCaption a:visited
{
    color: #000000;
}

.GroupCaption a:hover, .GroupCaption a:active
{
    color: #ff7272;
}

.GroupFooter td
{
    font-size: 80%;
    padding: 3px;
    border: 1px solid #e1e1f6;
    border-left: 0px none;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    background-color: #e1e1f6;
    color: #000000;
}

.GroupFooter a:link
{
    color: #5284b7;
}

.GroupFooter a:visited
{
    color: #873c87;
}

.GroupFooter a:hover, .GroupFooter a:active
{
    color: #ff7272;
}

.GroupFooter img
{
    margin: 2px;
    vertical-align: middle;
}

.GroupFooter input
{
    margin: 2px;
    vertical-align: middle;
}

.SubTotal td
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    vertical-align: top;
    font-weight: bold;
    background-color: #efeff9;
    color: #000000;
    border-bottom: 2px solid #81a9d2;
}

.SubTotal a:link
{
    color: #5284b7;
}

.SubTotal a:visited
{
    color: #873c87;
}

.SubTotal a:hover, .SubTotal a:active
{
    color: #ff7272;
}

.Total td
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    vertical-align: top;
    white-space: nowrap;
    font-weight: bold;
    background-color: #efeff9;
    color: #000000;
}

.Total a:link
{
    color: #5284b7;
}

.Total a:visited
{
    color: #873c87;
}

.Total a:hover, .Total a:active
{
    color: #ff7272;
}

/* Form Options */
.Button
{
    background-color: #81a9d2;
    color: #ffffff;
    border-left: solid 1px #EDEDED;
    border-top: solid 1px #EDEDED;
    border-right: solid 1px #848284;
    border-bottom: solid 1px #848284;
    padding: 2px;
    font-weight: bold;
    font-size: 85%;
    font-family: Tahoma;
}

/* Calendar */

.Calendar
{
    border: 1px solid #81a9d2;
    width: 100%;
}

.CalendarWeekdayName
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    text-align: center;
    vertical-align: top;
    white-space: nowrap;
    background-color: #efeff9;
    color: #000000;
}

.CalendarWeekdayName a:link
{
    color: #5284b7;
}

.CalendarWeekdayName a:visited
{
    color: #873c87;
}

.CalendarWeekdayName a:hover, .CalendarWeekdayName a:active
{
    color: #ff7272;
}

.CalendarWeekendName
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    white-space: nowrap;
    text-align: center;
    vertical-align: top;
    background-color: #efeff9;
    color: #000000;
}

.CalendarWeekendName a:link
{
    color: #000000;
}

.CalendarWeekendName a:visited
{
    color: #000000;
}

.CalendarWeekendName a:link, .CalendarWeekendName a:visited
{
    color: #ff7272;
}

/* Calendar Day */
.CalendarDay
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    text-align: center;
    background-color: #f9f9f9;
    color: #000000;
}

.CalendarDay a:link
{
    color: #5284b7;
}

.CalendarDay a:visited
{
    color: #873c87;
}

.CalendarDay a:hover, .CalendarDay a:active
{
    color: #ff7272;
}

/* Calendar Weekend */
.CalendarWeekend
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    text-align: center;
    background-color: #efeff9;
    color: #000000;
}

.CalendarWeekend a:link
{
    color: #5284b7;
}

.CalendarWeekend a:visited
{
    color: #873c87;
}

.CalendarWeekend a:hover, .CalendarWeekend a:active
{
    color: #ff7272;
}

/* Calendar Today */
.CalendarToday
{
    font-size: 80%;
    padding: 1px;
    border: 2px solid #81a9d2;
    text-align: center;
    background-color: #f9f9f9;
    color: #000000;
}

.CalendarToday a:link
{
    color: #5284b7;
}

.CalendarToday a:visited
{
    color: #873c87;
}

.CalendarToday a:hover, .CalendarToday a:active
{
    color: #ff7272;
}

/* Calendar Weekend Today */
.CalendarWeekendToday
{
    font-size: 80%;
    padding: 1px;
    border: 2px solid #81a9d2;
    text-align: center;
    background-color: #efeff9;
    color: #000000;
}

.CalendarWeekendToday a:link
{
    color: #5284b7;
}

.CalendarWeekendToday a:visited
{
    color: #873c87;
}

.CalendarWeekendToday a:hover, .CalendarWeekendToday a:active
{
    color: #ff7272;
}

/* Calendar Other Month's Day */
.CalendarOtherMonthDay
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    text-align: center;
    background-color: #f9f9f9;
    color: #81a9d2;
}

.CalendarOtherMonthDay a:link
{
    color: #81a9d2;
}

.CalendarOtherMonthDay a:visited
{
    color: #81a9d2;
}

.CalendarOtherMonthDay a:hover, .CalendarOtherMonthDay a:active
{
    color: #ff7272;
}

/* Calendar Other Month's Today */
.CalendarOtherMonthToday
{
    font-size: 80%;
    padding: 1px;
    border: 2px solid #81a9d2;
    text-align: center;
    background-color: #f9f9f9;
    color: #81a9d2;
}

.CalendarOtherMonthToday a:link
{
    color: #81a9d2;
}

.CalendarOtherMonthToday a:visited
{
    color: #81a9d2;
}

.CalendarOtherMonthToday a:hover, .CalendarOtherMonthToday a:active
{
    color: #ff7272;
}

/* Calendar Other Month's Weekend */
.CalendarOtherMonthWeekend
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    text-align: center;
    background-color: #efeff9;
    color: #81a9d2;
}

.CalendarOtherMonthWeekend a:link
{
    color: #81a9d2;
}

.CalendarOtherMonthWeekend a:visited
{
    color: #81a9d2;
}

.CalendarOtherMonthWeekend a:hover, .CalendarOtherMonthWeekend a:active
{
    color: #ff7272;
}

/* Calendar Other Month's Weekend Today */
.CalendarOtherMonthWeekendToday
{
    font-size: 80%;
    padding: 1px;
    border: 2px solid #81a9d2;
    text-align: center;
    color: #81a9d2;
    background-color: #efeff9;
}

.CalendarOtherMonthWeekendToday a:link
{
    color: #81a9d2;
}

.CalendarOtherMonthWeekendToday a:visited
{
    color: #81a9d2;
}

.CalendarOtherMonthWeekendToday a:hover, .CalendarOtherMonthWeekendToday a:active
{
    color: #ff7272;
}

/* Calendar Selected Day (for DatePicker) */
.CalendarSelectedDay
{
    font-size: 80%;
    padding: 3px;
    border-top: 1px solid #e1e1f6;
    border-right: 1px solid #e1e1f6;
    background-color: #e1e1f6;
    color: #000000;
    text-align: center;
    font-weight: bold;
}

.CalendarSelectedDay a:link
{
    color: #000000;
}

.CalendarSelectedDay a:visited
{
    color: #000000;
}

.CalendarSelectedDay a:hover, .CalendarSelectedDay a:active
{
    color: #ff7272;
}

/* Calendar Navigator */
.CalendarNavigator
{
    font-size: 80%;
    padding: 3px;
    background-color: #f9f9f9;
    color: #000000;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    color: #000000;
}

.CalendarNavigator a:link
{
    color: #5284b7;
}

.CalendarNavigator a:visited
{
    color: #873c87;
}

.CalendarNavigator a:hover, .CalendarNavigator a:active
{
    color: #ff7272;
}

.CalendarNavigator img
{
    margin: 2px;
    vertical-align: middle;
}

/* Calendar Extra */
.CalendarEvent
{
    font-size: 80%;
    text-align: left;
}

.CalendarEvent a:link
{
    color: #5284b7;
}

.CalendarEvent a:visited
{
    color: #873c87;
}

.CalendarEvent a:hover, .CalendarEvent a:active
{
    color: #ff7272;
}

.ApplyButton, .ForceButton
{
    width:120px;
    height:60px;
    background-color:#FFFFD1;
    border:1px solid #000;
    float:left;
    line-height: 60px;
    cursor: pointer;
    cursor: hand;
    padding-left: 30px;
}

.ApplyButton
{
    background-image:url("Images/apply.png");
    background-repeat: no-repeat;
}

.ForceButton
{
    background-image:url("Images/force.png");
    background-repeat: no-repeat;
    margin-left: 20px;
}
	
.Error{
	color: #FF0000;
   font-size: 120%;
   padding: 3px;
   vertical-align: top;
	}

.UpdateText{
	color: blue;
	}
pre {
	font-size: 130%;
	}
input.readonly    {
    background-color: #C0C0C0;
}

input[readonly]
   {
	background-color: #C0C0C0;
	 }

/* Device config */
.DeviceLink
{
    white-space: nowrap;
}

TR.AdvancedParam TD
{
    /* color: grey; */ /* TODO: Define appearance of advanced params */
}

P.ErrorMsg
{
    color: #FF0000;
}

/* Popup div */
#overlay-back
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.6;
    filter: alpha(opacity=60);
    z-index: 5;
    display: none;
}

#popup
{
    display: none;
    position: absolute;
    background: #FFFFFF;
    left: 50px;
    top: 50px;
    z-index: 100;
    border: 1px solid #000000;
    background-image: url('Images/popup/back.png');
    background-repeat: no-repeat;
}

#popupin
{
    padding: 20px 10px 20px 10px;
}
div.center_div{
	margin-left: auto;
    margin-right: auto;
	min-height: 10em;
    vertical-align: middle;
}
div.logo{
	margin-left: auto;
    margin-right: auto;
}

/* Fallback technique styles */
.progress-bar-div {
	background-color: whiteSmoke;
	border-radius: 3px;
	box-shadow: 0 2px 3px rgba(0,0,0,.5) inset;

	/* Dimensions should be similar to the parent progress element. */
	width: 100%; height:20px;
}

.progress-bar-span {
	background-color: royalblue;
	border-radius: 3px;
	
	display: block;
	text-indent: -9999px;
}

.progress-bar-span:before {
    content: "\200D";
    display:inline;
}  

.progress-bar-warn-span {
	background-color: red;
	border-radius: 3px;
	
	display: block;
	text-indent: -9999px;
}

.text-warn {
	color: red;
}

.hide {
  box-shadow: 0 0 10px rgba(0,0,0,0.3);
  display:none;
  margin:1em;
}