/*body*/
.fa {
    font-family: FontAwesome !important;
}

.BodyContainer {
    padding: 5px;
    margin: 0px auto;
}
.BodyContainer h4{
    font-size:13px;
    margin-top: 7px;
}
.BodyContainer h1 {
    margin-bottom: 10px;
}
/*header*/
.header .wrapper {
    position: relative;
}

.wrapper {
    margin: 0px auto;
    overflow: hidden;
}
.fontChange {
    font-family: Book Antiqua inherit !important;
    padding-left: 5px;
    font-size: 40px;
    float: left;
    margin: 30px 0;
    width: 65%;
    font-style: italic;
}
a {
    text-decoration: none;
    color: #333;
}
.login-form {
    padding-top: 1em;
    padding-right: 5px;
    float: right;
}
.login-form .field label, .resetPasswordForm .field.password label {
    font-size: 12px;
    line-height: 20px;
    min-width: 100px;
    float: left;
    text-align: right;
}
.login-form .field input[type="text"], .login-form .field input#Password, .resetPasswordForm .field.password input {
    width: 100% !important;
    margin: 0px !important;
    border: 1px solid #ccc !important;
    border-radius: 3px;
}
.control-label-left {
    text-align: left !important;
}
.logoutSection {
    padding-top: 12px;
}
div[class*="dxmLite_Oaks"] .dxm-main {
    border: 0px !important;
    padding: 0px !important;
}
div[class*="dxmLite_Oaks"] span.dx-vam {
    padding: 6px 12px !important;
    font-size: 16px !important;
}
div[class*="dxmLite_Oaks"] .dxm-popup {
    border: 0px !important;
}
.new-recurring-payment-button {
    margin-bottom: 10px !important;
    height: 25px!important;
}
input, input[type="text"][class^="dxeEditArea_"], input[type="password"][class^="dxeEditArea_"] {
    /*margin: 0 0 -3px !important;    
    line-height: 20px !important;
    height: 20px !important;*/
    padding: 0 4px !important;
    background: white;
}
/*banner*/
.banner {
    padding: 5px 0;
}
.wrapper {
    margin: 0px auto;
    overflow: hidden;
}
.banner-bg {
    width: 100%;
}
/*login btn*/
.login-form input#btnLogin {
    width: 68px;
    margin-top: 5px;
}
input[type="submit"], input[type="button"], input[type="reset"], div[class*="dxbButton_Oaks"] div.dxb {
    width: auto;
    border: 2px solid #6A6A6A;
    color: #FFF;
    font-size: 12px !important;
    background: #979797;
    padding: 0px 6px !important;
    height: auto !important;
    line-height: 20px !important;
    -moz-box-shadow: 2px 2px 4px #606060;
    -webkit-box-shadow: 2px 2px 4px #606060;
    -o-box-shadow: 2px 2px 4px #606060;
    -ms-box-shadow: 2px 2px 4px #606060;
    box-shadow: 2px 2px 4px #606060;
}
.resetPwd {
    font-size: 12px;
}
/*footer*/
.footer {
    color: #fff;
    padding: 25px 0 58px 0;
    border-top: 28px solid;
    border-bottom: 8px solid;
}
.fontFooterChange {
    font-family: Book Antiqua inherit !important;
    float: left;
    font-style: italic !important;
}
.footerContainer .logo {
    width: 50%;
    margin: 15px 0;
    color: #FFFFFF;
    font: 200 40px/1.2 'Great Vibes', Helvetica, sans-serif;
}
.ft-address {
    font-size: 15px;
}
.ft-phone {
    font-weight: bold;
    margin: 17px 0 0 0;
}

.registration-heading {
    font-size: 12px !important;
    font-weight: bold;
    top: -9px !important;
    width: auto !important;
}

.fieldset-border-color {
    border: 1px Solid #9F9F9F !important;
    border-radius: 3px !important;
    padding: 0 10px 15px !important;
}

.label-css {
    font-size: 12px !important;
    color: #4E4E4E;
    text-align: left !important;
    font-weight: 100;
    padding-right: 0px !important;
}

.input-css {
    height: 22px !important;
    line-height: 22px !important;
    padding: 0 4px !important;
    background: white;
    width: 100%;
    border: 1px solid #b3b3b3 !important;
}

.form-group-margin {
    padding-bottom: 20px;
}

.fieldset-row-css {
    padding: 25px;
}

.column-three-width {
    width: 19% !important;
}

.registerDropDownWidth table {
    width: 100% !important;
}

.form-control {
    border-radius: 0px !important;
}

.validationFontSize {
    font-size: 12px;
}

.contactUsTextArea {
    height: 100px;
    padding: 0 4px !important;
    background: white;
    width: 100%;
    border: 1px solid #b3b3b3 !important;
}

.mobilePageColor {
    color: #474646;
    font-size: 15px;
    font-weight: 100;
    width: 12.666667% !important;
}

.mobileRadioButtonColor {
    color: #474646;
    font-size: 15px;
    font-weight: 100;
}

.mobileConformationInput {
    margin: 0 0 5px !important;
    width: 150px !important;
    height: 20px !important;
    line-height: 20px !important;
    padding: 0 4px !important;
    background: white;
}
.mobileConfirmationBorder{
   border: 1px solid #6c6c6c;
}
legend {
     border-bottom: 0px solid #e5e5e5;
}
@media only screen and (max-width:767px){
    .column-three-width {
    width: 100% !important;
}
}
.inner-body-contianer {
    background-color: #fff;
}
.text-danger{
    color:red !important;
}
li.dropdown:hover > .dropdown-menu {
    display: block;
}
.navbar {
     margin-bottom: 0px !important; 
    min-height:0px !important;
}
.nav > li > a {
    position: relative;
    display: block;
    padding: 12px 15px !important; 
    color: #E5E5E5 !important; 
    font-size: 16px !important; 
}
.navbar {
   border-radius: 0px !important; 
   border: 0px solid transparent !important;
}
.navbar-collapse {
    padding-right: 0px !important;
    padding-left: 0px !important;
}
.dropdown-arrow{
    margin-top:-4px;
    width: 34px !important;
}
.dropdown-menu > li > a {
     padding: 8px 12px !important;
     font: 16px Tahoma,Geneva,sans-serif !important; 
 }
.navbar-toggle {
    background-color: black !important;
    border: 1px solid black !important;
}
.navbar-toggle .icon-bar {
    background: white !important;
}
.dropdown-menu {   
     border-radius: 0px !important;
}
@media only screen and (max-width:767px) {
    .navbar {
        height: auto !important;
        overflow:scroll;
    }
    .nav > li > a {
        padding: 12px 15px !important;
        padding-left: 40px !important;
    }
    .dropdown-menu > li > a {
        padding: 11px 40px !important;
    }
    .banner-bg {
    background: #38332f;
    height: 100% !important;
}
    .banner-bg .banner {
     width: 100% !important;
    display: block !important;
}
   .banner-bg .banner .banner-txt {
    width:100% !important;
}
    .wrapper {
        padding: 12px !important;
    }
    .login-form {
    float: none !important;
}
  .footer-container {
    padding: 0px 0px; 
    height: 440px;
}
      /*table{
          width:auto !important;
      }*/
      .Board-aging-popup{
          width: 100% !important;
         overflow-x: scroll !important;
       display: block !important;
      }
         #RecurPaymentCreationPopup_PW-1 .dxpc-contentWrapper{
    overflow-x: scroll !important;
    display: block !important;
   }
    #pcRecurringPayments{
     width:90% !important;
    }
    #RecurPaymentCreationPopup_PWC-1{
    width: 370px !important;
    }
    #RecurringPaymentForm_0 .dxflGroupBox, #RecurringPaymentForm_1 .dxflGroupBox {
 
        display:block !important;
    }
        #RecurringPaymentForm_1_2_5_0 .dxflGroupCell .dxflNestedControlCell table td{
        padding-left: 0px !important;
    }
}
.footer-container {
    border-top: 28px solid;
    border-bottom: 8px solid;
}
.header .logo p {
    font-family: Book Antiqua inherit !important;
    padding-left: 5px;
    font-size: 32px !important;
    float: left;
    font-style: italic;
    font-weight:100;
}
@media only screen and (min-width: 768px) and (max-width: 1100px) {
    .header .logo p {
        font-size: 22px !important;
    }
}
.payment-process fieldset.ui-widget-content {
    background: #fff !important;
}
.payment-process fieldset.ui-widget-content legend {
        background: #fff;
}
.payment-process fieldset.ui-widget-content legend {
    font-size: 12px !important;
    Font-Weight: bold;
}


 /*Css*/
  @media only screen and (min-width:767px){
    .threeTwoDownB #flUserInfo_0_0, .threeTwoDownB #flUserInfo_0_1, .threeTwoDownB #flUserInfo_0_2, .threeTwoDownB #flUserInfo_0_3, .threeTwoDownB #flUserInfo_0_4,
    .threeTwoDownB #flUserInfo_0_5, .threeTwoDownB #flUserInfo_0_6, .threeTwoDownB #flUserInfo_0_7,.threeTwoDownB #flUserInfo_0_8,
    .threeTwoDownB #flUserInfo_0_9,.threeTwoDownB #flUserInfo_0_10,.threeTwoDownB #flUserInfo_0_11,.threeTwoDownB #flUserInfo_0_12,.threeTwoDownB #flUserInfo_0_13,
    .threeTwoDownB #flUserInfo_0_14,.threeTwoDownB #flUserInfo_0_15{
        width:100% !important;
    }

    .threeTwoDownC #flUserInfo_0_0, .threeTwoDownC #flUserInfo_0_1, .threeTwoDownC #flUserInfo_0_2, .threeTwoDownC #flUserInfo_0_3, .threeTwoDownC #flUserInfo_0_4,
    .threeTwoDownC #flUserInfo_0_5, .threeTwoDownC #flUserInfo_0_6, .threeTwoDownC #flUserInfo_0_7,.threeTwoDownC #flUserInfo_0_8,
    .threeTwoDownC #flUserInfo_0_9,.threeTwoDownC #flUserInfo_0_10,.threeTwoDownC #flUserInfo_0_11,.threeTwoDownC #flUserInfo_0_12,.threeTwoDownC #flUserInfo_0_13,
    .threeTwoDownC #flUserInfo_0_14,.threeTwoDownC #flUserInfo_0_15{
        width:100% !important;
    }

    
    .threeTwoUpB #flUserInfo_0_0, .threeTwoUpB #flUserInfo_0_1, .threeTwoUpB #flUserInfo_0_2, .threeTwoUpB #flUserInfo_0_3, .threeTwoUpB #flUserInfo_0_4,
    .threeTwoUpB #flUserInfo_0_5, .threeTwoUpB #flUserInfo_0_6, .threeTwoUpB #flUserInfo_0_7,.threeTwoUpB #flUserInfo_0_8,
    .threeTwoUpB #flUserInfo_0_9,.threeTwoUpB #flUserInfo_0_10,.threeTwoUpB #flUserInfo_0_11,.threeTwoUpB #flUserInfo_0_12,.threeTwoUpB #flUserInfo_0_13,
    .threeTwoUpB #flUserInfo_0_14,.threeTwoUpB #flUserInfo_0_15{
        width:100% !important;
    }

      .threeTwoUpC #flUserInfo_0_0, .threeTwoUpC #flUserInfo_0_1, .threeTwoUpC #flUserInfo_0_2, .threeTwoUpC #flUserInfo_0_3, .threeTwoUpC #flUserInfo_0_4,
    .threeTwoUpC #flUserInfo_0_5, .threeTwoUpC #flUserInfo_0_6, .threeTwoUpC #flUserInfo_0_7,.threeTwoUpC #flUserInfo_0_8,
    .threeTwoUpC #flUserInfo_0_9,.threeTwoUpC #flUserInfo_0_10,.threeTwoUpC #flUserInfo_0_11,.threeTwoUpC #flUserInfo_0_12,.threeTwoUpC #flUserInfo_0_13,
    .threeTwoUpC #flUserInfo_0_14,.threeTwoUpC #flUserInfo_0_15{
        width:100% !important;
    }

     .leftRightHalfScreenB #flUserInfo_0_1, .leftRightHalfScreenB #flUserInfo_0_2, .leftRightHalfScreenB #flUserInfo_0_3, .leftRightHalfScreenB #flUserInfo_0_4,
    .leftRightHalfScreenB #flUserInfo_0_5, .leftRightHalfScreenB #flUserInfo_0_7,.leftRightHalfScreenB #flUserInfo_0_8,
    .leftRightHalfScreenB #flUserInfo_0_9,.leftRightHalfScreenB #flUserInfo_0_11,.leftRightHalfScreenB #flUserInfo_0_12,.leftRightHalfScreenB #flUserInfo_0_13,
    .leftRightHalfScreenB #flUserInfo_0_14,.leftRightHalfScreenB #flUserInfo_0_15{
        width:100% !important;
    }
     .leftRightHalfScreenB #flUserInfo_0_0,.leftRightHalfScreenB #flUserInfo_0_6,.leftRightHalfScreenB #flUserInfo_0_10{
         width:103% !important;
     }


      .leftRightHalfScreenA #flUserInfo_0_1, .leftRightHalfScreenA #flUserInfo_0_2, .leftRightHalfScreenA #flUserInfo_0_3, .leftRightHalfScreenA #flUserInfo_0_4,
    .leftRightHalfScreenA #flUserInfo_0_5, .leftRightHalfScreenA #flUserInfo_0_7,.leftRightHalfScreenA #flUserInfo_0_8,
    .leftRightHalfScreenA #flUserInfo_0_9,.leftRightHalfScreenA #flUserInfo_0_11,.leftRightHalfScreenA #flUserInfo_0_12,.leftRightHalfScreenA #flUserInfo_0_13,
    .leftRightHalfScreenA #flUserInfo_0_14,.leftRightHalfScreenA #flUserInfo_0_15{
        width:100% !important;
    }
     .leftRightHalfScreenA #flUserInfo_0_0,.leftRightHalfScreenA #flUserInfo_0_6,.leftRightHalfScreenA #flUserInfo_0_10{
         width:103% !important;
     }
       .leftRightHalfScreenA #Reg_AccountNumber, .leftRightHalfScreenA #Reg_AdditionalAddress, .leftRightHalfScreenA #Reg_UnitNumber{
      width:84%!important;
  }       

  .leftRightHalfScreenA #Reg_FirstName_ET, .leftRightHalfScreenA #Reg_LastName_ET, .leftRightHalfScreenA #Reg_StreetNumber_ET, .leftRightHalfScreenA #Reg_StreetAddress_ET, .leftRightHalfScreenA #Reg_City_ET, .leftRightHalfScreenA #Reg_State_ET,
  .leftRightHalfScreenA #Reg_Zip_ET, .leftRightHalfScreenA #Reg_HomePhone_ET, .leftRightHalfScreenA #Reg_WorkPhone_ET, .leftRightHalfScreenA #Reg_MobilePhone_ET{
          width: 100% !important;
  }
   

}
@media only screen and (min-width:768px){
     .threeTwoUp .threeTwoUpBlock .BodyContainer , .threeTwoUp .threeTwoUpB .BodyContainer, .threeTwoUp .threeTwoUpC .BodyContainer,
    .leftRightHalfScreen .leftRightHalfScreenB .BodyContainer, .leftRightHalfScreen .leftRightHalfScreenA .BodyContainer,
    .threeTwoDown .threeTwoDownC .BodyContainer, .threeTwoDown .threeTwoDownB .BodyContainer{
        -webkit-overflow-scrolling: touch !important;
        overflow: auto !important;
    }
}
/*new css*/
.accWidth {
    width: 93px !important;
}

#UserInformationForm_2_0, #UserInformationForm_2_2, #UserInformationForm_2_4{
     width:3% !important;
 }

/*#RegisterPropertyForm_1_2 .dxflCaptionCellSys, #RegisterPropertyForm_1_5 .dxflCaptionCellSys {
    width: 89px !important; 
    min-width: 89px !important;
}*/

.leftRightHalfScreenA .colwidth{
    width:100%;
}
.leftRightHalfScreenA .colwidthmargin{
   margin-left:-26px;
}

.leftRightHalfScreenA .registerHeader {
       min-width:93px !important;
       width:93px !important;
}

#HeaderImageSlider{
    width:100% !important;
}

#BoardACCPopUp_PW-1 , #ACCRequestdetailsPopUp_PW-1{
    top:0px !important;
}
.OaksAccount{
    margin-top: 2px !important;
    margin-bottom: 10px !important;
}
  #paybyecheck, #paybycreditcard{
      padding:3px !important;
  }

    #VOdetailsPopUp_PW-1 .dxpc-content{
          height:373px !important;
  }
  #VOdetailsPopUp_PW-1 .dxpc-headerContent{
          line-height: 0px !important;
  }
  #VOdetailsPopUp_HCB-1{
          margin-top: 0px !important;
  }
  .nav > li > a {
    display: inline-flex !important;
}

  @supports (-ms-ime-align:auto) {
     div.dxb {
    padding-left: 0px !important;
    padding-top: 0px !important;
    margin-bottom: 8px !important;
  }

}
    @-moz-document url-prefix() {
      div.dxb {
    padding-left: 5px !important;
    padding-top: 2px !important;
    margin-bottom: 8px !important;
  }
}

.profileButtonAddAddtionalProperty {
    width: 200px !important;
}

.profileButtonSubmit {
    width: 70px !important;
}
.recurringbuttonEditRecurringPayment {
    width: 60px !important;
}

/*.submiteCheckPaymentOnetimePayment {
    width: 160px !important;
}*/

.returnBackToProcessPaymentButtonClass {
    width: auto !important;
    margin-bottom: 10px !important;
    margin-left: 10px !important;
}

div[class^="dxbButton_"] profileButtonAddAddtionalProperty profileButtonSubmit {
}

.resetPassword {
    width: 100% !important;
}

.resetPasswordSection {
    padding: 15px !important;
}
.resetPasswordSection1 {
    width: 1000px !important;
    margin: auto;
    border: 1px solid grey;
    padding: 15px !important;
}

.resetPasswordSection2 {
    border: 1px solid grey;
    padding: 15px !important;
}

.resetPasswordSection1 h1 {
    font-size: 22px !important;
}

.resetPasswordSection1 label {
    width: 100%;
}

.resetPasswordSection1 input[type="password"] {
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.75);
    outline: none !important;
}

@media (max-width: 767px) {
    .resetPasswordSection1 {
        width: 100% !important;
    }
}
.elips {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 152px;
}
.resetPasswordTitle {
    margin-top: 15px;
}

.paymentPrintButtonCSS {
    text-decoration: none!important;
   /* width: 50px;
    height: 25px;*/
    padding: 4px 0px 6px !important;
}
/*.registerHeader-dt {
    width: 150px !important;
    min-width: 150px !important;
}*/
.dxeTextBoxDefaultWidthSys, .dxeButtonEditSys {
    width: 230px !important;
    min-width: 230px !important;
}

#frmDirectory .dxflGroup, .dxflGroupCell {
    padding-left: 0px !important;
    padding-right: 0px !important;
}
.dxtcLite > .dxtc-stripContainer .dxtc-link {
    color: #333333 !important;
    text-decoration: none !important;
}
#RecurPaymentCreationPopup_PW-1 {
    width: 800px !important;
}
#ContactUsForm .dxeMemo {
    width: 230px !important;
}

#Details_ET .dxeMemo {
    width: 230px !important;
}
input[type="radio"], input[type="checkbox"] {
    margin-top:-2px !important;
}
#RequestType.dxeButtonEditSys {
    width: 201px !important;
    min-width: 201px !important;
}

.dxb-hb {
    display: none !important;
}

.eye-icon {
    top: 29px !important;
}

@media only screen and (max-width: 800px) {
    #MainNewMessageForm_0 .dxflGroupBox {
        display: inline-block !important;
        width: 100% !important;
    }
}
/************************************************************************* Eye Icon Classes **********/
.eye-position {
    left: -323px;
}

@media only screen and (min-width:1025px) and (max-width:1152px) {
    #UserInformationForm_4_3 .eye-position {
        left: 212px;
        top: -30px;
    }

    #UserInformationForm_4_5 .eye-position {
        left: 212px;
        top: -30px;
    }
}

@media only screen and (max-width:1024px) {
    #UserInformationForm_4_3 .eye-position {
        left: 212px;
        top: -29px;
    }

    #UserInformationForm_4_5 .eye-position {
        left: 212px;
        top: -29px;
    }
}
/************************************************************************* Eye Icon Classes End**********/
.dxpcLite .dxpc-header {
    padding: 10px !important;
    border-bottom: 0px !important;
}

.dxpc-headerContent {
    overflow: visible !important;
}

.modal-dialog {
    padding-top: 15% !important;
}

#contact-preference-modal .modal-dialog {
    padding-top: 5% !important;
}
#contact-preference-modal-registration .modal-dialog {
    padding-top: 5% !important;
}
/************************** One time payment tab active class ****************************/
#divAIOneTimePayment .nav > li > a {
    font-size: 14px !important;
    background: #ccc;
    line-height: 15px;
}

    #divAIOneTimePayment .nav > li > a:hover {
        background: #3a913f !important;
        color: #fff !important;
        border: 0px solid #dddddd;
        border-bottom-color: transparent;
    }

#divAIOneTimePayment .nav-tabs > li > a {
    margin-right: 4px;
}

#divAIOneTimePayment .nav > li.disabled > a {
    background: #dbdbdb !important;
    color: #acacac !important;
}

    #divAIOneTimePayment .nav > li.disabled > a:hover {
        background: #dbdbdb !important;
        color: #acacac !important;
    }
/************************** One time payment tab active class End ****************************/
.neighborhoodnews-link {
    padding:3px 12px;
}
.qr-position {
    padding-top: 20px;
    padding-bottom: 20px;
    width: 130px;
    margin: auto;
}

@media only screen and (max-width : 768px) {
    .qr-position {
        padding-top: 20px;
        padding-bottom: 20px;
        width: 130px;
        float: left;
    }
}

#mobileAppToastDialog .modal-dialog {
    position: relative;
    left: 3%;
    top: 10% !important;
    padding-top: 55% !important;
    margin-left: 3% !important;
}