/** STYLES FOR HTML ELEMENTS *********************************************************/
/*************************************************************************************/
html {font-size: x-small;}
body {font-family: Arial, Helvetica, Verdana, sans-serif; font-size: 110%; color: #000; margin: 10px 0 0 0; padding: 0;}
p {margin:0px;}
hr {overflow: hidden; height: 1px; color: black; margin: 5px 0 5px 0; padding: 0; font-size: 1px; line-height: 1px;}
ul {margin:0; padding: 0;}
li {margin-left: 20px; list-style-type:disc;}
a, a:link, a:active {color: #223184; text-decoration:none; border: 0;font-weight:bold;}
a:visited {color: #223184; text-decoration:none; border: 0; font-weight: bold;}
a:hover {color: #223184; text-decoration:underline; border: 0; font-weight: bold;}
.img {border: 0;}
.bold {font-weight: bold;}
.imgmargin {padding-right: 10px; float: left;}
.lineheight {line-height: 20px;}

/** STYLES FOR TEMPLATE ELEMENTS ******************************************************/
/*************************************************************************************/
.H1header{font: bold 150% Arial, Verdana, Helvetica, sans-serif; color: #000000; margin: 0 0 5px 0; line-height: normal;}
.H2header{font: bold 130% Arial, Verdana, Helvetica, sans-serif; color: #000000; margin: 0 0 5px 0; line-height: normal;}
.H2headerWhite{font: bold 130% Arial, Verdana, Helvetica, sans-serif; margin: 0 0 5px 0; color: #FFFFFF; line-height: normal;}
.H3header{font: bold 110% Arial, Verdana, Helvetica, sans-serif; color: #000000; margin: 0 0 5px 0; line-height: normal;}
.H4header{font: bold 125% Arial, Verdana, Helvetica, sans-serif; color: #000000; margin: 0 0 5px 0; line-height: normal;}

/** STYLES FOR EDITOR DROP DOWN LIST (PARAGRAPH FORMAT) ********/
/*************************************************************************************/
h1{font: bold 150% Arial, Verdana, Helvetica, sans-serif; margin: 0px 0px 5px 0px; color: #000000;}
h2{font: bold 130% Arial, Verdana, Helvetica, sans-serif; margin: 0px 0px 5px 0px; color: #000000;}
h3{font: bold 110% Arial, Verdana, Helvetica, sans-serif; margin: 0px 0px 5px 0px; color: #000000;}
h4{font: bold 125% Arial, Verdana, Helvetica, sans-serif; margin: 10px 0px 0px 0px; color: #000000;}

/** STYLES FOR EDITOR DROP DOWN LIST (ADAPTED STYLE) *********************************/
/*************************************************************************************/
.ImportantEditor{FONT-WEIGHT:bold; COLOR:#7D7207!important;}
.ImagetextEditor{FONT-WEIGHT:normal; FONT-SIZE:90%;}

/** STYLES FOR THE BASEFILE ************************************************************************/
/** The class names below are used in the basefile (/Templates/Framework/FrameworkStartpage.aspx) */
/*************************************************************************************************/

/** TOP TAB MENU ********************************************************************/
/***********************************************************************************/
ul.navUl {padding:0; margin:auto; list-style-type:none;}
ul.navUl a {
     font-size: 110%; 
}
a.nav:link, a.nav:visited, a.nav:active {float:left; text-decoration:none; color:#333; line-height: normal; padding: 12px 8px 0 8px; font-size: 110%; font-weight: bold; }
a.nav:hover {color: #000;}
a.navSelected:link, a.navSelected:visited, a.navSelected:active, a.navSelected:hover {color: #000;}
li.navLi {display:inline;}
.navBox {float:left; padding: 4px 0px 0 20px;}
.leftCorner {width: 5px; height: 36px; float: left; background: url(images/lefttab.png) no-repeat left top;}
* html .leftCorner {background-image: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../Styles/pip/images/lefttab.png", sizingMethod="scale");}
.navBg {float: left; height: 36px; background: url(images/tab_bg.gif) repeat-x center top; }
.navBg .pad {float: left; padding: 12px 8px 0 8px;}
.rightCorner {width: 5px; height: 36px; float: left; background-image:url(images/righttab.png); background-repeat:no-repeat;}
* html .rightCorner {background-image: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../Styles/pip/images/righttab.png", sizingMethod="scale");}

/** LAYOUT *************************************************************************/
/***********************************************************************************/
.clearfix:after {
    content: '.';
    display: block;
    visibility: hidden;
    clear: both;
    height: 0;
    line-height: 0;
}
.clearfix {
    display: inline-block;
}
* html .clearfix {
    height: 1%;
}
.clearfix {
    display: block;
}
#mainBg {height:100%; background-image:url(images/main_bg.gif); background-repeat: repeat-x;}
#headerArea {width: 1000px; height: 74px; }
#logoLeft {margin: 0 0 0 15px; float:left;}
#searchIcon {width: 70px; height: 74px; margin: 0 70px 0 10px; float:right;}
#contactIcon {width: 98px; height: 74px; margin: 0 0 0 15px; float:right;}
#navWrap {min-width: 1000px; -width: 1000px; text-align: center;}
#navigationArea {min-width: 1000px; -width: 1000px; background-repeat: repeat-x; height: 40px;}
#templateWrap {
    clear: both;
    min-height: 350px; 
    _height: 350px; 
    width: 960px; 
    margin: 20px 0 0 0;
}
#contentWrap {
    margin: 0 0 0 20px;
    background: url(images/contentdivider.gif) repeat-y 710px 0;
}
#contentWrap #contentMain {
    display: inline;
    float: left;
    width: 690px;
}
#contentWrap #contentRight {
    display: inline;
    float: left;
    width: 210px;
    margin: 0 0 0 40px;
}
#contentStartContainer {
    background: url(images/contentdivider.gif) repeat-y 250px 0;
}
#contentWrap #contentStart1 {
    display: inline;
    float: left;
    width: 440px;
    margin: 0 0 0 40px;
}
#contentWrap #contentStart2 {
    display: inline;
    float: left;
    width: 210px;
    margin: 0 0 0 0px;
}
#contentWrap #contentStart3 {
    display: inline;
    float: left;
    width: 210px;
    margin: 0 0 0 40px;
}
#startBanner {
    border-bottom: 20px solid white;
}
#footerArea {
    margin: 20px 0 20px 5px;
}
#footerContent {
    padding: 5px 15px 0 15px; 
    border-top: 1px solid #999;
    color: #666; 
    font-family: Arial, helvetica, sans-serif;
}
#footerContent * {
    color: #666 !important; 
    font-weight: normal !important;
}
#contentRight .Image,
#contentStart2 .Image,
#contentStart3 .Image  {
    margin: 0 0 20px 0;
}
/* /layout */

/* puffboxes */
.puffbox {
    width: 210px;
    margin: 0 0 15px 0;
    padding: 18px 0 0 0;
    font-size: 110%;
}
.puffbox .puffboxContent {
    padding: 0 20px 18px 20px;
    background: no-repeat left bottom;
    color: white !important;
}
.puffbox .puffboxContent * 
{
    margin: 0;
    padding: 0;
    color: white !important;
}

.puffbox .puffboxContent a 
{
    text-decoration:none;
    font-weight:normal;
}

.puffboxBlue {
    background: #1d2c81 url(images/box_blue_top.gif) no-repeat left top;
}
.puffboxBlue .puffboxContent 
{
    background-image: url(images/box_blue_bottom.gif);
}

.puffboxBlue .puffboxContent 
{
   text-decoration:none;
   /*background-image: url(images/box_blue_bottom.gif);*/
}


.puffboxGold {
    background: #f4d231 url(images/box_gold_top.gif) no-repeat left top;   
}
.puffboxGold .puffboxContent {
    background-image: url(images/box_gold_bottom.gif);
}
.puffboxGold .puffboxContent,
.puffboxGold .puffboxContent * {
    color: black !important;
}
.puffboxGreen {
    text-decoration:none;
    background: #098a0f url(images/box_green_top.gif) no-repeat left top;
}
.puffboxGreen .puffboxContent {
    background-image: url(images/box_green_bottom.gif);
}
.puffboxRed {
    background: #d10f0f url(images/box_red_top.gif) no-repeat left top;
}
.puffboxRed .puffboxContent {
    background-image: url(images/box_red_bottom.gif);
}
/* /puffboxes */

.hrLine {height: 1px; color: black; margin: 5px 0 5px 0;}
.mainAreaPrint{width:600px; background-color:#FFFFFF;}
.w3cArea{width:757px; text-align:right;}
.copyrightArea{width:750px; FONT-SIZE:110%; text-align:right; margin-top:5px; margin-bottom:5px; color:#CCCCCC;}
A.copyrightLink:link, A.copyrightLink:active, A.copyrightLink:hover, A.copyrightLink:visited{color:#CCCCCC; text-decoration:none;}
.logoArea{PADDING-BOTTOM:5px;}
.logoContentLeft{FLOAT:left;}
.logoContentRight{FLOAT:right; MARGIN-TOP:20px; FONT-SIZE:110%; COLOR:#375268;}
.lineArea{height:12px; background-color:#666666; border-bottom:1px solid white;}
.lineAreaThin{MARGIN-BOTTOM:10px; height:1px; background-color:#CCCCCC; border-top:1px solid white;}
.menuAreaLeft{width:128px; MIN-HEIGHT:170px; _HEIGHT:170px; float:left; border:1px solid #CCCCCC; background-color:#F6F6F6; BACKGROUND-IMAGE: url(../images/menuleft_bg.gif); background-repeat:repeat-x; margin-right:20px;}
.menuAreaLeftInside{width:106px; MIN-HEIGHT:148px; _HEIGHT:148px; border:1px solid #FFFFFF; padding:10px;}
.searchArea{FLOAT:right; HEIGHT:18px; PADDING:8px;}
.inputSearch{FONT-SIZE:110%; COLOR:#000000; FONT-FAMILY:Verdana,Arial,Helvetica;}
.left {float: left}
.printIcon  {float: left; padding: 0  5px 0 0;}
.iconList {float: left; padding-left: 50px;}
.icons {float: left; margin-top: 18px;}

/*************************************************************************************
This stylesheet will be used for the templates included in Litium Studio. Changes
below will change the appearance of the pages using the templates in the folder
"Templates".
**************************************************************************************/
.Intro{font: 110% Arial, Verdana, Helvetica, sans-serif; color: #000; font-weight:normal; margin-top:0px; margin-bottom:10px;}
.Text{font: 110% Arial, Verdana, Helvetica, sans-serif; color: #000; margin-top:0px; margin-bottom:10px;}
.Normal{FONT-SIZE:110%;}
.Textbold{FONT-WEIGHT:bold;}
.Factheader{FONT-WEIGHT:bold; COLOR:white; BACKGROUND-COLOR:#555555; PADDING:5px;}
.Facttext{FONT-WEIGHT:normal; BACKGROUND-COLOR:#DDDDDD; PADDING:5px;}
.Imagetext{FONT-WEIGHT:normal; MARGIN-TOP:2px; TEXT-ALIGN:CENTER;}
.Date{COLOR:#AAAAAA; MARGIN-TOP:0px; MARGIN-BOTTOM:0px;}

.Linklist{FONT-WEIGHT:normal; MARGIN-TOP:20px;}
.Linkicon{MARGIN-RIGHT:3px; HEIGHT:10px;}
.Filelist{FONT-WEIGHT:normal; MARGIN-TOP:20px;}
.Fileicon{MARGIN-RIGHT:5px;}
.Productlist{FONT-WEIGHT:normal; MARGIN-TOP:20px;}
.Newslist{FONT-WEIGHT:normal; MARGIN-TOP:20px;}
.Form Input{}
.InputItem{FONT-SIZE:110%; MARGIN-BOTTOM:10px; COLOR:#000000; FONT-FAMILY:Arial,Helvetica, Verdana, Sans-Serif;}
.InputItemFixedWidth{FONT-SIZE:110%; MARGIN-BOTTOM:10px; WIDTH:300px; COLOR:#000000; FONT-FAMILY:Arial,Helvetica, Verdana, Sans-Serif;}
.InputItemFullWidth{FONT-SIZE:110%; MARGIN-BOTTOM:10px; WIDTH:100%; COLOR:#000000; FONT-FAMILY:Arial,Helvetica, Verdana, Sans-Serif;}
.SelectItemFixedWidth{FONT-SIZE:110%; MARGIN-BOTTOM:10px; WIDTH:305px; FONT-WEIGHT:bold; COLOR:#000000; FONT-FAMILY:Arial,Helvetica, Verdana, Sans-Serif;}
.MarginSingle{MARGIN-TOP:10px;}
.MarginDouble{MARGIN-TOP:20px;}

.Image{MARGIN-TOP:20px;}
.ImageCenter{TEXT-ALIGN:CENTER; MARGIN-TOP:20px;}
.ImageLeft{TEXT-ALIGN:LEFT; MARGIN-TOP:20px;}
.ImageRight{TEXT-ALIGN:RIGHT; MARGIN-TOP:20px;}
.ImageLeftFloat{FLOAT:LEFT; MARGIN-TOP:10px; MARGIN-RIGHT:10px; MARGIN-BOTTOM:10px; DISPLAY:INLINE;}
.ImageRightFloat{FLOAT:RIGHT; MARGIN-TOP:10px; MARGIN-LEFT:10px; MARGIN-BOTTOM:10px; DISPLAY:INLINE;}

.ColumnSpace{HEIGHT:10px; WIDTH:10px;}
.CrossHorizontal{FONT-SIZE:1%; HEIGHT:2px; BACKGROUND-COLOR:#555555;}
.CrossHorizontalCell{FONT-SIZE:1%; PADDING-BOTTOM:10px; PADDING-TOP:10px;}
.CrossVertical{FONT-SIZE:1%; WIDTH:2px; BACKGROUND-COLOR:#555555;}
.CrossVerticalCell{FONT-SIZE:1%; HEIGHT:100%; PADDING:5px;}

.threeColumnLeft{VERTICAL-ALIGN:top; WIDTH:350px; padding-right:5px;}
.threeColumnMiddle{VERTICAL-ALIGN:top; WIDTH:189px; padding-top:5px; padding-left:5px; padding-right:5px;}
.threeColumnRight{VERTICAL-ALIGN:top; WIDTH:189px; padding-top:5px; padding-left:5px;}
.threeColumnLineV{padding-top:5px; BACKGROUND-IMAGE: url(../templates/common/images/dotlineV_bg.gif);}
.threeColumnLineH{MARGIN-TOP:5px; MARGIN-BOTTOM:5px; HEIGHT:1px; BACKGROUND-IMAGE: url(../templates/common/images/dotlineH_bg.gif);}

.twoColumnTable{WIDTH:100%; HEIGHT:350px;}
.twoColumnLeft{VERTICAL-ALIGN:top; PADDING-RIGHT:20px;}
.twoColumnRight{VERTICAL-ALIGN:top; WIDTH:180px; PADDING-LEFT:20px;}
.twoColumnInnerTable{MARGIN-TOP:20px;}
.twoColumnInnerOne{HEIGHT:100%; WIDTH:33%; VERTICAL-ALIGN:top; PADDING-TOP:10px; PADDING-RIGHT:10px;}
.twoColumnInnerTwo{HEIGHT:150px; WIDTH:34%; VERTICAL-ALIGN:top; PADDING-TOP:10px; PADDING-LEFT:10px; PADDING-RIGHT:10px;}
.twoColumnInnerThree{HEIGHT:150px; WIDTH:33%; VERTICAL-ALIGN:top; PADDING-TOP:10px; PADDING-LEFT:10px;}
.twoColumnLineH{HEIGHT:1px; BACKGROUND-COLOR: #9A9A9A;}
.twoColumnLineV{WIDTH:1px; BACKGROUND-COLOR: #9A9A9A;}

.Fileheader{FONT-SIZE:110%; FONT-WEIGHT:bold; MARGIN-BOTTOM:5px;}
.Fileitem{FONT-SIZE:110%; FONT-WEIGHT:normal; MARGIN-BOTTOM:5px;}
.Linkheader{FONT-SIZE:110%; FONT-WEIGHT:bold; MARGIN-BOTTOM:5px; BORDER-BOTTOM:1px solid black;}
.Linkitem{FONT-SIZE:110%; FONT-WEIGHT:normal; MARGIN-BOTTOM:5px;}
.Productname{FONT-SIZE:110%; FONT-WEIGHT:bold; MARGIN-BOTTOM:5px;}
.Productlink, A.Productlink:link, A.Productlink:active, A.Productlink:hover, A.Productlink:visited{font: bold 110% Arial, Verdana, Helvetica, sans-serif; color: #223184;}
.Productdesc{FONT-SIZE:110%; FONT-WEIGHT:normal;}
.ProductRowItem1{PADDING:5px; BACKGROUND-COLOR:#F7F7F7;}
.ProductRowItem2{PADDING:5px; BACKGROUND-COLOR:#EBEBEB;}
.ProductColumnItem1{PADDING:10px; border-left:1px solid #9A9A9A; WIDTH:33%;}
.ProductColumnItem2{PADDING:10px; border-left:1px solid #9A9A9A; WIDTH:34%;}
.ProductColumnItem3{PADDING:10px; border-left:1px solid #9A9A9A; WIDTH:33%;}
.ProductitemLineH{HEIGHT:1px; BACKGROUND-COLOR:#9A9A9A;}
.ProductitemLineV{PADDING:10px; border-left:1px solid #9A9A9A;}
.Productitem{FONT-SIZE:110%; LINE-HEIGHT:20px;}
.Productitemlist{PADDING-RIGHT:20px; WIDTH:150px;}
.ProductitemlistLineV{border-left:1px solid #9A9A9A;}
.Newsimage{FLOAT:RIGHT; MARGIN-LEFT:10px; DISPLAY:INLINE;}
.Newsdate{font:  x-small Arial, Verdana, Helvetica, sans-serif; color: #000;}
.Newsheader{font: bold 110% Arial, Verdana, Helvetica, sans-serif; color: #000;}
.Newslink, A.Newslink:link, A.Newslink:active, A.Newslink:hover, A.Newslink:visited{}
.Newsintro{font: small Arial, Verdana, Helvetica, sans-serif; color: #000;}
.Newsitem1{PADDING:5px; BACKGROUND-COLOR:#F7F7F7;}
.Newsitem2{PADDING:5px; BACKGROUND-COLOR:#EBEBEB;}

.Breadcrumb{font: 100% Arial, Verdana, Helvetica, sans-serif; color:#666;}
a.Breadcrumb:link, a.Breadcrumb:active, a.Breadcrumb:hover, a.Breadcrumb:visited{font: 100% Arial, Verdana, Helvetica, sans-serif; color:#666 !important;}
.Linklist{font: bold 100% Arial, Verdana, Helvetica, sans-serif; color:#000;}
a.Linklist:link, a.Linklist:active, a.Linklist:hover, a.Linklist:visited{font: 100% Arial, Verdana, Helvetica, sans-serif; color:#000!important;}

/** SYSTEM ERROR MESSAGE *************************************************************/
/*************************************************************************************/
.litErrorFieldset{MARGIN-TOP:10px; MARGIN-BOTTOM:10px;}
.litErrorLegend{COLOR: #FF0000! important; FONT-SIZE:110%; PADDING-RIGHT:6px;}
.litErrorDiv{PADDING-TOP:8px; PADDING-BOTTOM:5px;}
.litErrorIcon{WIDTH:16px; HEIGHT:16px; MARGIN-RIGHT:3px;}
.litErrorMsg{COLOR: #FF0000! important; FONT-SIZE:110%;}

/** PRINT STUFF *************************************************************/
/*************************************************************************************/
@media print {
    #searchIcon,
    #contactIcon,
    #navigationArea,
    #startBanner,
    #footerArea {
        display: none !important;
    }
    #mainBg,
    #headerArea,
    #templateWrap,
    #contentWrap,
    #contentWrap #contentMain,
    #contentStartContainer {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        background-image: none !important;
        font-size: 8pt !important;
    }
    #contentWrap {
        width: 100% !important;
        margin: 0 !important;
    }
    #contentWrap #contentMain {
        width: 60% !important;
        margin: 0 !important;
    }    
    #contentWrap #contentRight {
        overflow: hidden !important;
        float: right !important;
        width: 35% !important;
        margin: 0 !important;
    }
    #contentWrap #contentStart1 {
        display: block !important;
        float: none !important;
        width: 95% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    #contentWrap #contentStart2,
    #contentWrap #contentStart3 {
        width: 40% !important;
        margin: 0 !important;
    }
    #contentWrap #contentStart3 {
        float: right !important;
    }   
    /* /layout */    
    /* puffboxes */
    #contentWrap .puffbox {
        padding: 0 !important;
        background-color: transparent !important;
        background-image: none !important;
    }
    #contentWrap .puffbox .puffboxContent 
    {
        text-decoration:none;
        padding: 0 !important;
        background-color: transparent !important;
        background-image: none !important;
        color: black !important;
    }
    
    #contentWrap .puffbox .puffboxContent a {
        text-decoration:none;
    }
    
    
}