/**********************************************************************************************

     Title: SRO LO CSS
     Author: XHTMLized / Modified by Oliver Cai
     Date: Sept. 2008

***********************************************************************************************

     1.  GENERAL
               1.1 Headings and paragraphs
               1.2 Forms
               1.3 Links
               1.4     Table td tr th
               1.5 Miscellaneous
          
     2. GENERAL ELEMEMENTS
     
     3. LAYOUT
               3.1 Accessibility menu
               3.2 Header
               3.3 Navigation
               3.4 Content
               3.5 Footer
          
     4. LAYOUT ELEMENTS
***********************************************************************************************/

/* 1. GENERAL
-----------------------------------------------------------------------------------------------
===============================================================================================*/
/* Global reset */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: none;
    outline: 0;
    vertical-align: baseline;
}

html {
    background: #FFFFFF;
    height: 100%;
}

body {
    line-height: 1.4;
    font-family: Arial,Helvetica,adobe-helvetica,'Arial Narrow',sans-serif;
    font-size: 62.5%; /* 1em = 10px \ 1.1em = 11px \ 1.2em = 12px */
    font-weight: normal;
    background-color: #FFFFFF;
    text-align: center;
    height: 100%;
}

ol, ul {
    list-style: none;
}


/* 1.1     Headings and paragraphs
-----------------------------------------------------------------------------------------------*/
h1, h2, h3, h4, h5 {
    font-weight: bold;
    font-family:'Helvetica Neue',Helvetica,adobe-helvetica,'Arial Narrow', sans-serif;
}

h1 { font-size: 2.7em;
     padding:20px 0px 5px;
     margin-left:-10px;
}

h2{
     font-size: 20px;
     padding:20px 0px 5px;
}

h3 {
     font-size: 18px;
     margin:10px 1px 0px;     
}

h4, h5 {
     font-size: 18px;
     padding:10px 1px 5px 0px;     
}

.front-left h5{
     padding:20px 0px 0px;     
     color:#666666;
     font-size:16px;
}


.orange h2, .orange h3, .orange h2 a {
     color:#DF6001;
     text-decoration:none;
}

.blue h1,.blue h2, .blue h3 , .blue h5, .blue a.more-link  {
     color:#1070BA;

}

.green h1, .green h2, .green h3 , .green h5, .green a.more-link  {
     color:#62A93F;
}

p {
   width: 100%;
   text-align:justify;
   font-size: 13px;
   color:#8F8F8F; 
   padding:20px 0px 10px;
}

div.login-header{
     font-size:17px;
     width:348px;
     margin:0px auto;
     padding:20px 0px 15px;
     border-bottom: 1px solid #9B9B9B;     
     text-align:center;
}
div.login-header span.small{
     font-size:12px;
     padding-left:15px;
}

p span.textcolor{
   color:#8F8F8F; 
}

/* 1.2     Forms
-----------------------------------------------------------------------------------------------*/

input, textarea, select {
       font: 10px Verdana, Arial, Helvetica, sans-serif;
          color:#808080;
}

label {
          font: 11px Helvetica, sans-serif;
          font-weight:bold;
          color:#808080;     
}

label.contact{
          width:95px;
          text-align:right;
          display:block;
          float:left;
          padding-right:10px;
          padding-top:3px;
          font-size:14px;
          font-weight:normal;
}

.form-input select{
          width:300px;
          color:#000;
          font-size:11px;
          height:20px;
          border-top: 1px solid #C9CDBC;
          border-right: 1px solid #B3C08B;
          border-bottom: 1px solid #B3C08B;
          border-left: 1px solid #B3C08B;
          padding:2px 0px;     
}

input.narrow {
    width: 100px;
    vertical-align:top;
    height:14px;
}

input.wide {
    width: 200px;
    vertical-align:middle;     
    height:14px;
}

input.normal-input{
     height:16px;
     border-top: 1px solid #C9CDBC;
     border-right: 1px solid #B3C08B;
     border-bottom: 1px solid #B3C08B;
     border-left: 1px solid #B3C08B;
}

input.image {
    vertical-align:middle;
    margin-left:5px;
}

#top-login label{
     padding:0px 4px ;
     vertical-align:middle;
     color: black;
}

/* 1.3     Links
-----------------------------------------------------------------------------------------------*/

a {
    text-decoration: none;
}

a:visited {
}

a:hover {
    text-decoration: none;
}

a:active {}


h2 a {
    text-decoration: underline;
    color: #000;
}

a.more-link  {
     text-decoration: underline;
     font-weight:bold;
     font-size:13px;
}

#middle-nav a, #middle-nav span.active-menu {
     float:left;
     height:28px;
     display:block;
/*     cursor:pointer; 
     font-weight:bold; */
     text-decoration: none;
  color: #FEFEFF;
  padding:1px 16px 0px;

}

a.normaltext {
     text-decoration:none;
     color:#8F8F8F;
}
a.normaltext:hover{
     text-decoration:underline;
} 


#footer-links a{
    text-decoration: none;
    color: #666666;
}

/* 1.5     Miscellaneous
-----------------------------------------------------------------------------------------------*/

hr {
    display: none;
}

strong, .strong {
    font-weight: bold;
}

em {
    font-style: italic;
}

.smalltext{
          font-size: 13px;
}

abbr, acronym {
    border-bottom: 1px dotted #999;
    cursor: help;
}

img.next-gt{
          vertical-align:middle;
          padding-left:10px;
          margin-top:-1px;
}

/* 2. GENERAL ELEMENTS
-----------------------------------------------------------------------------------------------
===============================================================================================*/

.hide {
    position: absolute;
    left: -9999px;
}

.outerbox.inner {
    display: none;
}

.clear {
    clear: both;
    font-size: 0;
    height: 1px;
    line-height: 0;
    overflow: hidden;
}


.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {
    display: inline-block;
}

/* Hides from IE-mac \*/
* html .clearfix {
    height: 1%;
}

.clearfix {
    display: block;
}

/* End hide from IE-mac */

.text-center{
     text-align:center;
}

.fright{
     float:right;
}

.fleft{
     float:left;
}

/* 3. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/

.container {
    width: 848px;
    position: relative;
    margin: 0 auto;
    text-align: left;
    border-left: 1px solid #b3b3b3;
    border-right: 1px solid #b3b3b3;
    font-size: 14px;
}

#minheightpx {
    float: right;
    position: relative;
    width: 1px;
    height: 10px;
}

/* 3.1     Accessibility menu
-----------------------------------------------------------------------------------------------*/

#accessibility-menu {
    position: absolute;
    left: -1000em;
    text-align: left;
}

/* 3.2     Header
-----------------------------------------------------------------------------------------------*/

#header {
    height: 83px;
    background: #FFFFFF;
}

#logo{
     position:absolute;
     top:20px;
     left:38px;     
     
}

#top-login{
     position:absolute;
     width:416px;
     top:0px;
     right:24px;     
}

#top-login span{
     float:left;
     height:32px;
}

.top-login-left{
     width:6px;     
     background:url(../img/bg/login_left.png) no-repeat;     
}

.top-login-center{
     width:404px;     
     background:url(../img/bg/login_center.png) repeat-x;
     padding-top:4px;
}

.top-login-right{
     width:6px;
     background:url(../img/bg/login_right.png) no-repeat;
     
}

/* 3.3     Navigation
-----------------------------------------------------------------------------------------------*/

#navigation {
    z-index: 100;
    position: absolute;
    left: 0px;
    top: 70px;
    width: 848px;
}

.top-nav {
     position: absolute;
     top: 0px;
     height:33px;
}
#nav-right{
     right: 29px;
}

#nav-left{
     right:159px;
}

.active-top{
     z-index:102;
}

#middle-nav {
     position: absolute;
     left: 0px;
     top: 29px;
     height:33px;
     width: 818px;
     z-index:101;
     padding-left:30px;
}

#middle-nav span {
     float:left;
     margin-top:4px;
}


.nav-pipe {
     height:25px;
     padding:0px 2px;

}

div.orange #middle-nav{
  background: transparent url( ../img/bg/nav_orange_bg.png ) repeat-x left top;
}

div.orange .nav-pipe{
     background:transparent url(../img/bg/nav_orange_pipe.png) no-repeat scroll center -1px;
}

div.orange #middle-nav a:hover{
     background:transparent url(../img/bg/nav_orange_inactive_dot.png) no-repeat scroll center 20px;
}

div.orange #middle-nav span.active-menu{
     background:transparent url(../img/bg/nav_orange_active_dot.png) no-repeat scroll center 20px;
}
/**************FOR LANDLORD NAV***************/
div.blue #middle-nav{
   background: transparent url( ../img/bg/nav_blue_bg.png ) repeat-x left top;
}

div.blue .nav-pipe{
     background:transparent url(../img/bg/nav_blue_pipe.png) no-repeat scroll center -1px;
}

div.blue #middle-nav a:hover{
     background:transparent url(../img/bg/nav_blue_inactive_dot.png) no-repeat scroll center 20px;
}

div.blue #middle-nav span.active-menu{
     background:transparent url(../img/bg/nav_blue_active_dot.png) no-repeat scroll center 20px;
}

/**************FOR TETANT NAV***************/
div.green #middle-nav{
   background: transparent url( ../img/bg/nav_green_bg.png ) repeat-x left top;
}

div.green .nav-pipe{
     background:transparent url(../img/bg/nav_green_pipe.png) no-repeat scroll center -1px;
}

div.green #middle-nav a:hover{
     background:transparent url(../img/bg/nav_green_inactive_dot.png) no-repeat scroll center 20px;
}

div.green #middle-nav span.active-menu{
     background:transparent url(../img/bg/nav_green_active_dot.png) no-repeat scroll center 20px;
}



/* 3.4     Content
-----------------------------------------------------------------------------------------------*/

#content {
   position: relative;
   overflow: hidden;
   padding: 49px 24px 20px 25px;
   width: 799px;
   background: url( ../img/bg/content_bg.png) repeat-x left 49px;

}

#login-content{
   overflow: hidden;
   padding: 20px;
   width: 808px;
   background: url( ../img/bg/content_login_bg.png) repeat-x left 15px;
}

div.one-column{
     width:798px;
     position:relative;
}

div#login-box{
     width:396px;
     height:100%;
     border-top: 1px solid #999999;
     border-left: 1px solid #999999;
     border-right: 2px solid #CDCDCD;
     border-bottom: 2px solid #CDCDCD;
     margin:65px auto 100px;
     padding-bottom:25px;
     color:#808080;
}


.form-input{
     padding:20px 30px 0px;
}

.form-input div{
          height:auto;
          padding:0px 0px 10px;
}

div#front-submit{
     padding:15px 0px 0px 100px;
}
.form-input div.login-msg{
     padding:5px 0px 0px 105px;
     font-size:12px;
}

div.warning{
     color:#FF144E;
}

div.grey-lined{
     background:url( ../img/bg/divider_bg.png) repeat-x 0px 0px;
     height:4px;
     display: block;

}

ul.dot-listing{
     list-style-position:inside;
     list-style-type:disc;
     padding-left:16px;
     
}

ul.dot-content-list{
     list-style-type:disc;
     padding-left:20px;
     color:#8F8F8F; 
     
}

#faq-details ul{
     padding-left:0px;
     list-style-position:inside;
}

#faq-details ul li{
     cursor:pointer;
}

div.content-middle-col ul.dot-content-list {
     width:230px;
}

div.content-left-col {
     float:left;
     width: 268px;
     padding:10px 10px 10px 0px;
}

div.content-middle-col {
     float:left;
     width: 290px;
     padding:10px 5px;
}

div.content-right-col {
     float:right;
     width: 208px;
     padding:12px 0px 0px 0px;
     text-align:right;
     margin-right:-3px;
}

div.next-more{
     position:absolute;
     bottom:15px;
     right:30px;
}

.left-pane{
     float:left;
     text-align:left;
     padding:35px 10px 20px 102px;
     width:344px;
}

ul.list-correct{
     list-style-position:outside;
     color:#A0A0A0;
     line-height:250%;
     font-size:16px;
     font-weight:bold;
}

ul.list-correct li{
     
     padding: 0 0 0 45px; /* or whatever the bullet size is plus a few pixels */
     background: url(../img/bg/list_correct.png) center left no-repeat;
     
}

.right-pane{
     float:left;
     width: 245px;
     text-align:center;
     padding:70px 15px 20px 20px;
}

.blue .right-pane{
     padding:70px 0px 20px 15px;
}

.blue .left-pane{
     padding:35px 0px 20px 67px;
     width:425px;
}

#quick-tour{
     padding:24px 0px 65px;
     
}

div.home-options {
  float:left;
     padding-left:54px;
     text-align:center;
     width:696px;
}

div.list-details{
     width:550px;
     padding:8px;
     margin:10px;
     color:black;
     background-color:#C9E9F6;
     border:1px solid #97D1E9;
     cursor:text;
}


.green  div.list-details{
     background-color:#A8D570;
     border:1px solid #78A936;
}

.home-options  div{
     float:left;
     width:206px;
     padding:5px 13px;

}

div.rfloat{
     float:right;
     margin:10px 60px 10px 0px;
}

.faq-search{
     padding:25px 0px;
}

/***********For about-us page */
div.front-left{
     float:left;
     width:540px;
     padding:5px 5px 10px 0px;
}

div.front-right{
     float:right;
     text-align:right;
     width:250px;
     padding:20px 0px;
     margin-right:-5px;
}

/* 3.5     Footer
-----------------------------------------------------------------------------------------------*/
#content_bottom{
     padding-top:25px;
}


#footer-links{
     margin:10px 0px 20px;
     text-align:center;
     color:#666666;
     font-size:11px;
     font-weight:bold;
     vertical-align:baseline;

}

.pipe{
     background:transparent url(../img/bg/footer_pipe.png) no-repeat scroll center center;
     padding:6px 9px 8px;
}

#footer{
   padding: 10px 0;
   width: 100%;
   text-align: center;
   font-size: 12px;
   color: #999;
  /* border-top: 1px solid #b3b3b3; */
}

#trailer{
     padding:20px 50px 10px;
     font-size:12px;
     color:#666666;
}

#trailer p {
     padding:10px 0px;
     color:#666666;

}

.top-border{
     border-top: 1px solid #b3b3b3;
}

.message {
    color: red;
    font-weight: bold;
    padding: 5px 0px;
    font-size:10px;
}