﻿@import url("default.css"); 

html{}

body 
{
    font-family: "Palatino Linotype", "Times New Roman" Helvetica, Arial, Geneva, sans-serif; 
    color:#191717;
    background: #fff;
    margin: 0;
    padding: 0;
    border: none;
    font-size: 62.5%;    
}

h1,h2,h3,h4,h5,h6 {}
h1 {}
h2 {}
h3 {}
h4 {}
h5 {}
h6 {color: #959595; margin: 0;}

hr { color: #a5a5a5; height: 1px; background-color: #a5a5a5; }

p { }

ul, .bullet { list-style: none;margin-left: 0; padding-left: 1em; text-indent: 0; line-height: 1.3em; }	
ul li, .bullet { padding-left: 1em; background: url(../images/bullet_arrow.gif) no-repeat left 8px;}

#page-wrap
{
    min-width: 1008px;
    width:expression(document.body.clientWidth < 1010? "1008px" : document.body.clientWidth > 1962? "auto" : "auto");
}

#pnlHeader
{
    border-bottom: 3px double #191717;
}

#pnlHeader #pnlHeaderTop
{
    margin: 2px 0 0 0;   
    font-family: Verdana, Helvetica, Arial;   
    border-top: 3px double #191717;
    border-bottom: 3px double #191717;
    padding: 3px 10px; 
    
}
#SizeRestricter
{
    width: 1014px;
}

#pnlHeader #pnlHeaderBanner
{
    background: url(../images/CROL_skyline.jpg) no-repeat bottom right;
}

#pnlHeader #pnlHeaderBanner img
{
    margin: 10px 0 10px 10px;
    border: none;
}


#pnlHeader #pnlHeaderTop a
{
    text-decoration: none;
    color:#191717;
    font-size: 1em;
    letter-spacing: 1;
}

#pnlHeader #pnlHeaderTop a:hover { color: #0043b1; }

#body-wrap
{
    border-bottom: 3px double #191717;    
}

#pnlLeftNav
{
    width: 200px;
    border-right: 1px solid #191717;
}

ul.SideMenu
{
    list-style: none;
	margin-left: 0;
	padding: 0;
	text-indent: 0;
}

ul.SideMenu li
{
    display: block;
    margin-bottom:  0 0 0 0;
    padding: 0;
}

ul.SideMenu li a, ul.SideMenu li a:visited, ul.SideMenu li a:active
{
    background: white;
    border-left: 6px solid #00325b;
    padding: 5px 5px 5px 10px;
    text-decoration: none;
    margin: 0 0 0 0;
    border-bottom: 1px solid white;
    display: block;
    zoom: 1; /* fixes "Empty Text Node" bug in IE */
    line-height: 20px;
}

ul.SideMenu li.red a, ul.SideMenu li.red a:visited, ul.SideMenu li.red a:active { border-left-color: #c70000; color: #c70000; } ul.SideMenu li.red a:hover { border-left-color: #ea2727; color: #ea2727; }
ul.SideMenu li.blue a, ul.SideMenu li.blue a:visited, ul.SideMenu li.blue a:active { border-left-color: #0c4dd4; color: #0c4dd4; } ul.SideMenu li.blue a:hover { border-left-color: #4481ff; color: #0c4dd4; }
ul.SideMenu li.grey a, ul.SideMenu li.grey a:visited, ul.SideMenu li.grey a:active { border-left-color: #a5a5a5; color: #888888; } ul.SideMenu li.grey a:hover { border-left-color: #cacaca; color: #888888; }
ul.SideMenu li.olive a, ul.SideMenu li.olive a:visited, ul.SideMenu li.olive a:active { border-left-color: #b1c986; color: #8c9c71; } ul.SideMenu li.olive a:hover { border-left-color: #c7e88c; color: #8c9c71; }
ul.SideMenu li.green a, ul.SideMenu li.green a:visited, ul.SideMenu li.green a:active { border-left-color: #007469; color: #007469; } ul.SideMenu li.green a:hover { border-left-color: #00a999; color: #007469; }
ul.SideMenu li.purple a, ul.SideMenu li.purple a:visited, ul.SideMenu li.purple a:active { border-left-color: #a13d9e; color: #a13d9e; } ul.SideMenu li.purple a:hover { border-left-color: #c85cc5; color: #a13d9e; }
ul.SideMenu li.orange a, ul.SideMenu li.orange a:visited, ul.SideMenu li.orange a:active { border-left-color: #d86f29; color: #d86f29; } ul.SideMenu li.orange a:hover { border-left-color: #ff9147; color: #d86f29; }

ul.SideMenu li a:hover
{
    background: #eff5fd;
    color: #00325b;
    border-left: 6px solid #57f;
    text-decoration: none;
}


ul.SideMenu li.MenuHeader h3
{
    background: #191717;
    color: white;
    text-align: center;
    text-transform: uppercase;
    margin: 0;
    padding: 4px 2px;
    line-height: 30px;
    height: 30px;
    font-size: 0.9em;
    border-bottom: 1px solid white;
}


#pnlRightNav
{
    width: 200px;
    border-left: 1px solid #191717;
}

#pnlBody
{
    font-family: "Times New Roman" Helvetica, Arial, Geneva, sans-serif;
    line-height: 1.3em;
}

#pnlNav
{
    background: #dbdfe5;
    font-size: 0.8em;
    padding: 4px 20px;
    line-height: 30px;
    height: 30px;
    margin-bottom: 20px;
}

#pnlNav .NavStatus
{
    white-space:nowrap;
}

#pnlNav .floatleft
{
    
}

#pnlNav a, #pnlNav .nolink
{
    background: url(../images/bullet_arrow.gif) left center no-repeat;
    padding-left: 12px;
    margin: 0 3px 0 5px;
    white-space: nowrap;
}

#pnlNav .settings
{
    background: url(../images/icon_settings2.gif) left 2px no-repeat;
    padding-left: 18px;
    margin: 0 3px 0 3px;
}

#pnlNav .firstcrumb
{
    background: url(../images/icon_home.gif) left 3px no-repeat;
    padding-left: 18px;
    margin: 0 3px 0 3px;
}

.vspacer { padding: 10px 0;}
.hspacer { margin: 0 20px; }

.image-wrap-right {float: right; margin: 20px 0 20px 20px; border-left: 1px solid #dbdfe5; border-bottom: 1px solid #dbdfe5; text-align: center; }
.image-wrap-right img { margin: 20px 0 20px 20px; border: 3px double #191717; display: block;}
.image-wrap-right .caption  { display: block; font-size: 0.8em; margin: 10px 0 10px 10px;}

.image-wrap-left { float: left; margin: 20px 20px 20px 0; border-right: 1px solid #dbdfe5; border-bottom: 1px solid #dbdfe5; text-align: center; }
.image-wrap-left img { margin: 20px 20px 20px 0; border: 3px double #191717; display: block;}
.image-wrap-left .caption  { display: block; font-size: 0.8em; margin: 10px 10px 10px 0;}

a.nolink, a:hover.a.nolink, a:visited.nolink, a:active.nolink { text-decoration: none; }

.Hbox-blue { color: White; background: #00325b; padding: 5px 10px; letter-spacing: 1px; margin: 10px 0 10px 0;}
.Hbox-grey { color: #413c3c; background: #dbdfe5; padding: 5px 10px; letter-spacing: 1px; margin: 10px 0 10px 0;}
.Hbox-red { color: White; background: #c70000; padding: 5px 10px; letter-spacing: 1px; margin: 10px 0 10px 0;}
.Hbox-green { color: White; background: #007469; padding: 5px 10px; letter-spacing: 1px; margin: 10px 0 10px 0;}
.Hbox-orange { color: White; background: #d86f29; padding: 5px 10px; letter-spacing: 1px; margin: 10px 0 10px 0;}
.Hbox-purple { color: White; background: #a13d9e; padding: 5px 10px; letter-spacing: 1px; margin: 10px 0 10px 0;}



.lightertext { color: #6a6a6a; }
.lightesttext { color: #999 }
.smallertext { font-size: 0.8em; line-height: 1.5em; }
.largertext { font-size: 1.2em; }

#pnlFooter
{ text-align: center; }

.validator { color: Red; font-weight: bold; font-size: 0.9em;  }

.textbox, input, textarea
{
    
	border-top: 1px solid #888;
	border-left: 1px solid #888;
	border-right: 1px solid #888;
	border-bottom: 1px solid #888;
	background: #f5f6fc url(../images/txtboxbg.gif) -1px -1px;
	padding: 3px 2px 1px 4px;
    color: #191717;
    height: 1.7em;
}

/*.checkbox 
{
    padding: 1px 0 0 1px;
    height: 1.2em;
}*/

.linkbutton, button,
a.linkbutton:link, a.linkbutton:active, a.linkbutton:visited, 
a.linkbutton-blue:link, a.linkbutton-blue:active, a.linkbutton-blue:visited, 
a.linkbutton-grey:link, a.linkbutton-grey:active, a.linkbutton-grey:visited, 
a.linkbutton-red:link, a.linkbutton-red:active, a.linkbutton-red:visited, 
a.linkbutton-green:link, a.linkbutton-green:active, a.linkbutton-green:visited, 
a.linkbutton-orange:link, a.linkbutton-orange:active, a.linkbutton-orange:visited, 
a.linkbutton-purple:link, a.linkbutton-purple:active, a.linkbutton-purple:visited
{    
    border-top: 1px double #d9d9d9;
    border-left: 1px double #d9d9d9;
    border-right: 2px solid #bbb;
    border-bottom: 2px solid #bbb;
    line-height: 1.3em;
    padding: 3px 10px;
    display: inline-block;
    letter-spacing: 1px;
    text-decoration: none;
    margin: 0;
    font-size: 0.8em;
    font-family: arial, helvetica, sans-serif;
    white-space: nowrap;
}

button { padding: 0; line-height: 0.5em; font-size: 0.6em; }

.linkbutton:hover, a.linkbutton-blue:hover, a.linkbutton-grey:hover, a.linkbutton-red:hover, a.linkbutton-green:hover, a.linkbutton-orange:hover, a.linkbutton-purple:hover
{    
    border-top: 1px double #b8ccec;
    border-left: 1px double #b8ccec;
    border-right: 1px solid #8bb7ff;
    border-bottom: 1px solid #8bb7ff;
    margin: 1px 0 0 1px; 
}

.linkbutton, a.linkbutton:link, a.linkbutton:visited, a.linkbutton:active  { color: #191717; background: #fff url(../images/bg-button3.gif) 0 0 repeat-x; }
a.linkbutton-blue:link, a.linkbutton-blue:visited, a.linkbutton-blue:active { color: White; background: #00325b;}
a.linkbutton-grey, a.linkbutton-grey:visited, a.linkbutton-grey:active { color: #413c3c; background: #dbdfe5;}
a.linkbutton-red, a.linkbutton-red:visited, a.linkbutton-red:active { color: White; background: #c70000;}
a.linkbutton-green, a.linkbutton-green:visited, a.linkbutton-green:active { color: White; background: #007469;}
a.linkbutton-orange, a.linkbutton-orange:visited, a.linkbutton-orange:active { color: White; background: #d86f29;}
a.linkbutton-purple, a.linkbutton-purple:visited, a.linkbutton-purple:active { color: White; background: #a13d9e;}

a.linkbutton:hover { color: #002856; background: #fff url(../images/bg-button3.gif) 0 -396px repeat-x;}
a.linkbutton-blue:hover { color: White; background: #0060ae;}
a.linkbutton-grey:hover  { color: #413c3c; background: #ebeff5;}
a.linkbutton-red:hover { color: White; background: #e70000;}
a.linkbutton-green:hover { color: White; background: #009489;}
a.linkbutton-orange:hover { color: White; background: #f88f49;}
a.linkbutton-purple:hover { color: White; background: #c15dbe;}

.Hbox-blue a.linkbutton, .Hbox-grey a.linkbutton, .Hbox-red a.linkbutton, .Hbox-green a.linkbutton, .Hbox-orange a.linkbutton, .Hbox-purple a.linkbutton { margin-top: -2px; }

/* Start custom button CSS here
---------------------------------------- */
.btn {
      display:inline-block;
      background:none;
      margin:0;
      padding:3px 0;
      border-width:0;
      overflow:visible;
      font:100%/1.2 Arial,Sans-serif;
      text-decoration:none;
      color:#333;
      font-size: 0.8em;
      }
    * html button.btn {
      padding-bottom:1px;
      }
    /* Immediately below is a temporary hack to serve the 
       following margin values only to Gecko browsers
       Gecko browsers add an extra 3px of left/right 
       padding to button elements which can't be overriden.
       Thus, we use -3px of left/right margin to overcome this. */
    html:not([lang*=""]) button.btn {
      margin:0 -3px;
      }
    .btn span {
      background:#ddd url(../images/bg-button3.gif) repeat-x 0 0;
      margin:0;
      padding:3px 0;
      border-left:1px solid #bbb;
      border-right:1px solid #aaa;
      }
    * html .btn span {
      padding-top:0;
      }
    .btn span span {
      position:relative;
      padding:3px .4em;
      border-width:0;
      border-top:1px solid #bbb;
      border-bottom:1px solid #aaa;
      }
    
    /* pill classes only needed if using pill style buttons ( LEFT | CENTER | RIGHT ) */
    button.pill-l span {
      border-right-width:0;
      }
    button.pill-l span span {
      border-right:1px solid #bbb;
      }
    button.pill-c span {
      border-right-style:none;
      border-left-color:#fff;
      }
    button.pill-c span span {
      border-right:1px solid #bbb;
      }
    button.pill-r span {
      border-left-color:#fff;
      }
    
    /* only needed if implementing separate hover/focus/active state for buttons */
    .btn:hover span, .btn:hover span span, .btn:focus span, .btn:focus span span {
      cursor:pointer; /* important for any clickable/pressable element */
      border-color:#9cf !important;
      color:#000;
      }
    .btn:active span {
      background-position:0 -400px;
      outline:none;
      }
    .btn:focus, .btn:active {
      outline:none; /* doesn't seem to be respected for <button>, only <a> */
      }
 
    /* use if one button should be the 'primary' button */
    .primary {
      font-weight:bold;
      color:#000;
      }

/* End custom button CSS here
---------------------------------------- */

    .checkbox, .radio {
      width: 19px;
      height: 18px;
      padding: 0 5px 0 0;
      background: url(../images/checkbox.png) no-repeat;
      display: inline-block;
    }
    .radio {
      background: url(../images/radio.png) no-repeat;
    }
    .select {
      position: absolute;
      width: 250px;
      height: 21px;
      padding: 0 24px 0 8px;
      color: #fff;
      font: 12px/21px arial,sans-serif;
      background: url(../images/select2.gif) no-repeat;
      overflow: hidden;
    }
    
    .half
    {
        width: 50%;
    }
    
    table.formdata
    {
        
    }
    
    table.formdata tr { padding: 0 0 5px 0; }
    table.formdata tr td { padding: 3px 10px; }
    table.formdata tr td.label
    {
        padding: 3px 10px;
        font-size: 0.9em;
    }
    
    
   
    
    
