/*the text align atributes in the following two tags are a hack to centre the wrapper div in older versions of ie */
body {
position: relative;
font-size:1em;
background:url(background.jpg) ;
background-color: #fff;
background-repeat: repeat-x;
text-align: center;}


/*this tag contains the whole page. It's width should be set to the minimum width of users browser windows */
#wrapper {
width: 60em;
margin: 0 auto; 
text-align: left;
padding: 0em;
background: #fff;
border: none;
}

#hider {
position: relative;
top: 700px;
z-index: 800;
background: #4698ca;
width: 100%;
height: 700px;
}

div.banner  {

background: #fff;
margin: 0;

height: 95px;
}
.banner h1 {
font-family:"Rockwell", "Century Gothic", "Aharoni", "Arial", "Nueva Roman", "Lithos Regular";
font-weight:bold;
color:#ed1c24;
vertical-align:bottom;
margin: 0;
padding:0;
}

.banner img {border:0; float:left; margin:0.5em;}

/*headers are used in the welcome boxes*/
h1 {font-size:270%;
font-family: "Rockwell", "Century Gothic", "Aharoni", "Arial", "Nueva Roman", "Lithos Regular";
font-weight:bold;
color:#ed1c24;
vertical-align:bottom;
margin-left: 10px;
margin:0;
}

.messageLink  {
text-decoration: none;
color: #005bab;
}

.messageLink a:active, a:hover {
text-decoration: none;
color: #ed1c24;
}

em {
color: #ed1c24;
font-style: normal;
font-weight: bold;
}

h2 {font-size:120%;font-weight:normal;font-family:"Arial", "Nueva Roman", "Lithos Regular"; color:#000000;vertical-align:bottom;text-align:center;}

h3 {font-size:120%;font-weight:normal;font-family:"Arial", "Nueva Roman", "Lithos Regular"; color:#333333;vertical-align:bottom;}
h4 {font-size:300%;font-weight:normal;font-family:"Arial", "Nueva Roman", "Lithos Regular"; color:#333333;vertical-align:bottom;margin:0em;margin-bottom:0.2em;}

p {font-size:100%;
font-family:"Arial", "Myriad Roman", "Verdana";
color:black;
text-align:justify;
margin-left: 15px;
margin-right: 15px;
}



p.panel {text-align:justify;font-family:"Myriad Roman", "Verdana";background:#def3bd;}

/****fcl table styles****************/
table.fclDestCharges {
border: #ed1c24 solid 0.2em;
border-collapse: collapse;
background:#ed1c24;
empty-cells: show;
margin: 1px;
}
table.fclFreightRates {
border: #ed1c24 solid 0.2em;
border-collapse: collapse;
background:#ed1c24;
empty-cells: show;
margin: 1px;
}
table.history {background:#bbd5e3;border:solid black 0.1em;}
table.exchangeRates {
border: solid 0.1em black;
border-collapse: collapse;
background:#ed1c24;
empty-cells: show;
}

table.history {
border: solid 0.1em black;
border-collapse: collapse;
background:#ed1c24;
empty-cells: show;
}


th {
background:#005bab;
color: #fff;
border:  #ed1c24 solid 0.2em;
padding:0.2em;
padding-left: 0.5em;
padding-right: 0.5em;
text-align: center;
}
/*table.exchangeRates tr#row1 {background:#63C6DE; */
td {background:#fff;
border: solid #ed1c24 0.2em;
padding:0.2em;
text-align: center;
}

/*these are used by EditGroupage */
table {font-size:100%; background:#fff;}
table.editGroupage {border-collapse: collapse;}
/*td {text-align:center;vertical-align:center;padding:0.2em;}*/
td.country {text-align:right;}
td.countryvals {text-align:left;}
.port {background:#dfe7f5;}
.portname {font-weight:bold;text-align:left;}
.zonename {font-style:italic;text-align:left;text-indent:1em;}
.colTitles {font-weight:bold;text-align:center;background:#dfe7f5;}
.colTitlesBoundary {font-weight:bold;text-align:center;border-right:solid .5em #ed1c24; background:#005bab;margin-right:1em;}
.priceBoundary {border-right:solid .5em #ed1c24;margin-right:1em;}

textarea.caption {background-color:#ffffff;font-size:85%;font-family:"Trebuchet", "Century Gothic", "Myriad Roman", "Verdana";color:black;}


#thumbs {background:#9cc2d8;}





/************************************************************************************************************
*   DHTML modal dialog box  (CSS for the DHTMLSuite_modalMessage class)
*
*   Created:                        August, 26th, 2006
*   @class Purpose of class:        Display a modal dialog box on the screen.
*           
*   Css files used by this script:  modal-message.css
*
*   Update log:
*
************************************************************************************************************/

.modalDialog_transparentDivs{   
    filter:alpha(opacity=40);   /* Transparency */
    opacity:0.4;    /* Transparency */
    background-color:#AAA;
    z-index:1;
    position:absolute; /* Always needed */
}
.modalDialog_contentDiv{
    border:3px solid #000;  
    padding:2px;
    z-index:100;/* Always needed    */
    position:absolute;  /* Always needed    */
    background-color:#FFF;  /* White background color for the message */
}
.modalDialog_contentDiv_shadow{
    z-index:90;/* Always needed - to make it appear below the message */
    position:absolute;  /* Always needed    */
    background-color:#555;
    filter:alpha(opacity=30);   /* Transparency */
    opacity:0.3;    /* Transparency */  
}

.modalDialog_loginDiv{
    border:3px solid #005bab;
    padding:2px;
    z-index:100;/* Always needed    */
    position:absolute;  /* Always needed    */
    background: #ffffff;  /* blue background color for the message */
    color:red;
}

.modalDialog_loginDiv_shadow{
    z-index:90;/* Always needed - to make it appear below the message */
    position:absolute;  /* Always needed    */
    background-color:#555;
    filter:alpha(opacity=30);   /* Transparency */
    opacity:0.3;    /* Transparency */  
}

    .modalDialog_contentDiv_history{
        border:3px solid #FFF;  

        padding-bottom: 0;
        z-index:100;/* Always needed    */
        position:absolute;  /* Always needed    */
        background-color:#F00;  /* White background color for the message */
        color:#FFF;
        margin-bottom: 0;

    }
    .modalDialog_contentDiv_history a{
        color:#FFF;
    }
/*******************Buttons*******************/
div.button {position: relative;
  margin: 1em 0;
  margin-bottom: 0px;
  font-family: helvetica,arial,sans-serif;
  font-size: 100%;
  font-weight: bold;
  padding: 1 em;
  padding-top: 6px; padding-bottom: 6px;
  }

  div.button a:link, div.button a:visited{
  border: 1px solid #fff;
color: #FFF;
background-color: #ed1c24;
text-decoration: none;
  padding-left: 0.5em;
  padding-right: 0.5em;
  padding-top: 6px;
  padding-bottom: 6px;
}
div.button a:hover, div.button a:active{
border: 1px solid #fff;
color: #fff;
background-color: #4698ca;
text-decoration: none;
}

#getRatesGroupage {margin-left:15px;display: block; width: 7em;text-align: center; margin-bottom: 0px;padding-top: 6px; padding-bottom: 6px;}
#getratesFcl {margin-left:7.5px;display: block; width: 7em;text-align: center;padding-top: 6px; padding-bottom: 6px;}
#printRate {margin:0; display: block; width: 7em;text-align: center; position: relative;padding-top: 6px; padding-bottom: 6.8px;bottom:55px;left:10em;}
#printRateFcl {margin:0;display: block; width: 7em;text-align: center; position: relative; padding-top: 6px; padding-bottom: 6px;bottom:55px;left:10em;}
#update {width:100px}
#delete {display: inline}
#login {display: block; width: 12em;text-align: center;padding-top: 6px; padding-bottom: 6px;}

/***********************Menus********************************/

/****************Forms and Tabs************************/
#formContainer {
position:relative;
top: 1.5em;
background: #fff;
width: 15em;
margin: 0;
margin-left: 1em;
color:white;
padding:0px;
}

form {
margin:0px;
padding:0px;
}

.tab a:link {
text-decoration: none;
color: white;
font-family: "arial";
}

.tab a:visited {
text-decoration: none;
color: white;
font-family: "arial";
}

.tab a:active {
text-decoration: none;
color: white;
font-family: "arial";
}

.tab a:hover {
text-decoration: none;
color: black;
font-family: "arial";

}

.fclForm {
padding: 1em;
padding-top: 0.1em;
padding-bottom: 0.1em;
margin: 0;
}

.groupageForm {
padding: 1em;
padding-bottom: 0.1em;
margin: 0;
}

#FclForm {
position: relative;
top: 0px;
z-index: 2;
background: #005bab;
border: none;
padding:0.2em;
padding-top: 0.05em;
padding-bottom: 0.1em;
width: 20em;
margin: 0;
height:390px;
line-height: 0.8;
}

#FclForm  {

}

#GroupageForm {
position: relative;
top: 0px;
z-index: 2;
background:#005bab;
border: none;
padding:0.2em;
width: 20em;
margin-left:none;
margin-top: none;
margin-bottom: none;
padding-bottom: 0.1em;
height:360px;
line-height: 0.8;
}

#FclTab{
display: inline;
z-index: 1;
position: relative;
bottom: 0.1em;
left: 0em;
background:#E0E0E0;
border: none;
padding:0.3em;
margin: 0;
}

#GroupageTab{
display: inline;
z-index: 3;
position: relative;
bottom: 0.2em;
background:#005bab;
border: none;
padding:0.3em;
width: 5em;
margin: 0;
}

#car {
position: relative;
left: 2em;
}
#mbike {
position: relative;
left: 2em;
}
#gpiano {
position: relative;
left: 5.65em;
}
#upiano  {
position: relative;
left: 3em;
}

#delText {
    display: none;
}

#fclvolText {
    display: none;
}
/****************Rates Div ****************/

#ratesDivFcl {
position: relative;
left: 380px;
bottom: 362px;
max-width: 35em;
overflow: auto;
height: 24em;
border: solid 0px;
margin: 0;
background: #fff;
}

#ratesDivGroupage {
position: relative;
left: 380px;
bottom: 362px;
max-width: 35em;
overflow: auto;
height: 24em;
border: solid 0px;
margin: 0;
background: #fff;
padding-top:0em;
}

#exchangeRates {
background: white;
margin:0;
padding-top: 0.3em;
padding-left: 0.3em;
padding-bottom: 0.4em;
}
/******MileageDivs*********/
#mileageZones  {
margin-left: 1em;
margin-top: 0.5em;
max-width: 14em;
}
.selectedMileage {
position: relative;
bottom: 18em;
left: 12em;
text-align: right;
width: 14em;
}

/*****MTC update*****/
#progressDiv {
padding: 1em;
border: solid black 2px;
background: #fff;
}

select {
max-width:282px;
}