/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
/* Styles */
section .dp-panel h3{
text-align: center;
}
#RequestType_lbl
{
top: 0px;
}
th.hideSmallRes, td.hideSmallRes, a.hideSmallResOnly, .hideSmallResOnly{
display: none;
}
.inforDotChart
{
height: 100%;
}
}
@media (max-width: 1000px) {
/* registration screen */
#login.account-registration,
#login.account-registration.continued {
background-color: #f7f7f7;
border: none;
margin: 56px 0 0 0;
padding: 5%;
top: 0;
width: 100%;
}
/* notifications table */
.notifications-table thead th {
white-space: normal;
}
.modal-content .buttons .btn-close {
margin-bottom: 10px;
margin-right: 0px!important;
}
}
/* smaller screens ----------- */
@media only screen
and (max-width : 768px) {
/* Styles */
.login #bg {
display: none;
}
body, body.main{
background-color: #cbebf8;
background: -moz-linear-gradient(top, #cbebf8 10em, #00bff3 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(10em,#cbebf8), color-stop(100%,#00bff3));
background: -webkit-linear-gradient(top, #cbebf8 10em,#00bff3 100%);
background: -o-linear-gradient(top, #cbebf8 10em,#00bff3 100%);
background: -ms-linear-gradient(top, #cbebf8 10em,#00bff3 100%);
background: linear-gradient(to bottom, #cbebf8 10em,#00bff3 100%);
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cbebf8', endColorstr='#00bff3',GradientType=0 );*/
background-image: none;
}
body.main .jPanelMenu-panel{
background-color: #cbebf8 !important;
}
body.login{
background-color: #F7F7F7;
background-image: none;
}
body.login .jPanelMenu-panel{
background-color: #F7F7F7 !important;
}
#login {
background-color: transparent;
border: medium none;
width: auto;
padding: 5%;
top: 56px;
}
#login h1{
font-size: 1.75em;
padding: 12px 0;
}
#login1 h2{
font-size: 1.25em;
padding-bottom: 14px;
}
#login form {
width: auto;
}
#login input.text-box {
padding: 0 10%;
width: 80%;
}
#login input.text-box.alt {
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 13px;
width: 100%;
}
#login .col1, #login .col2{
width: 100%;
position: relative;
text-align: inherit;
left: auto;
right: auto;
}
.primaryBtn, .secondaryBtn, p .primaryBtn, p .secondaryBtn{
letter-spacing: 0;
}
#login .primaryBtn, #login .secondaryBtn {
padding-left: inherit;
padding-right: inherit;
}
#loginResetConfirmation a.primaryBtn {
display: inline-block;
}
.centerText a.primaryBtn, .centerText a.secondaryBtn{
margin-left: auto;
margin-right: auto;
}
#login .postForm {
display: none;
}
#login2 h4, #login3 h4 {
padding: 0 5%;
}
#login .dataEntry .icon{
display: block;
left: 8px;
margin-bottom: 0;
padding-right: 0;
position: absolute;
top: 18px;
}
/*
#login > .dataEntry label{
display: none;
}
*/
#login1 .dataEntry label,
#login2 .dataEntry label,
#login3 .dataEntry label,
#login4 .dataEntry label,
#login5 .dataEntry label{
display: none;
}
.buttonBar1 {
margin: 0 auto 20px;
text-align: center;
width: 170px;
}
.buttonBar1 .primaryBtn, .buttonBar1 .secondaryBtn{
width: auto;
}
.buttonBar1 .secondaryBtn {
margin-bottom: 10px;
}
.dataEntry label br {
display: none;
}
#topNav, .dp-container section {
padding-left: 1.5em;
padding-right: 1.5em;
}
.login #navigation, .main #navigation{
background-color: #FFFFFF;
-webkit-box-shadow: 1px 2px 2px rgba(0,0,0,.28);
-moz-box-shadow: 1px 2px 2px rgba(0,0,0,.28);
box-shadow: 1px 2px 2px rgba(0,0,0,.28);
height: 55px;
position: fixed;
top: 0;
width: 100%;
z-index: 10;
}
#login p.dataEntry{
line-height: 18px;
}
#login #register input.text-box, #onetimepay input.text-box, .userform input.text-box{
margin: 0;
padding: 0 13px;
width: 100%;
position: relative;
left: auto;
}
#login p.dataEntry.mobilehide label {
display:none;
}
#login #register p.dataEntry label, #onetimepay .dataEntry label, .userform .dataEntry label{
line-height: 24px;
}
#login #register p.dataEntry, #onetimepay .dataEntry, .userform .dataEntry {
margin: 0;
}
#login #register h2{
padding-bottom: 0;
}
#login #register .subForm {
height: auto;
margin: 0 auto;
text-align: center;
width: 100%;
}
#login #register .col1, #login #register .col2{
display: block;
left: auto;
padding: 0;
top: auto;
}
#login #register .col1 {
margin: 40px auto 10px;
}
#login #register .col2{
margin: 0 auto;
}
#login #register .notifications-table .inforDropdownContainer,
.notifications-table .inforDropdownContainer {
width: 100%!important;
}
/*registration drop down*/
#securityQueryContainer.inforTriggerField{
position: relative!important;
right: auto;
width: 100%;
}
#securityQueryContainer table.inforTriggerFieldTable,
#securityQueryContainer table.inforTriggerFieldTable tr,
#securityQueryContainer table.inforTriggerFieldTable tbody{
width: 100%;
}
#securityQueryContainer table.inforTriggerFieldTable tr{
background-color: #fff;
}
#securityQueryContainer table.inforTriggerFieldTable td{
width: 90%;
}
#securityQueryContainer .inforDropDownList{
width: 100%
}
#securityQueryContainer table.inforTriggerFieldTable td.arrow{
width: 10%;
}
#login #register .formFeedback{
margin-bottom: 10px;
padding-left: 0;
padding-top: 10px;
}
#login #register span.icon-no, #login #register span.icon-yes{
left: -2px;
top: 44px;
z-index: 200;
}
#login #register span.icon-no{
background: url("../images/sprites.png") no-repeat scroll -31px -5px transparent;
}
#login #register span.icon-yes{
background: url("../images/sprites.png") no-repeat scroll -31px -35px transparent
}
/*content*/
section.dp-container{
background: url("../images/bg-mobile.png") left top repeat transparent;
padding-top: 55px;
padding-bottom: 2em;
}
section.dp-container section.dp-inner {
margin: 0 auto;
padding-top: 1.5em;
}
.dp-panel{
padding: 3%;
margin-top: 20px;
}
section li.dp-panel h3.inline{
display: block;
}
section li.dp-panel p.inlineP{
float: none;
margin: 0 0 1em;
}
.centerText {
font-size: 0.875em;
}
#content-header{
height: auto;
padding: 0 0 1px 0;
}
#content-header, .dp-panel{
background-color: #fff;
-webkit-box-shadow: 0 2px 2px rgba(212,212,212,.23), inset 0 -1px 1px rgba(0,0,0,.22);
-moz-box-shadow: 0 2px 2px rgba(212,212,212,.23), inset 0 -1px 1px rgba(0,0,0,.22);
box-shadow: 0 2px 2px rgba(212,212,212,.23), inset 0 -1px 1px rgba(0,0,0,.22);
}
#content-header h1{
margin-top: 0;
padding-top: 10px;
}
#content-header .address{
margin-bottom: 12px;
padding: 0 20px;
}
#content-header h1, #content-header .address{
text-align: center;
}
#content-header .styledSeparator, .styledSeparatorRel, #content-header .outterList{
display: none;
}
section li.dp-panel, section li.dp-panel:nth-child(odd){
margin: 0 auto 1.5em;
padding: 1em 0 3em;
float: none;
width: 100%;
background-color: #fff;
}
section li.dp-panel.last{
margin: 0;
}
section .space-panel{
display: none;
}
section .dp-panel h3, section .dp-panel p{
text-align: center;
}
.fullwidth.data td.rightAlign, .fullwidth.data td.leftAlign{
padding: 5px 20px;
}
.fullwidth.data td, .fullwidth.data th{
padding: 8px 5%;
}
.onetimepayform input.text-box,
.userform input.text-box{
top: 0;
}
.controlSeparate span.icon {
margin-right: -24px;
position: relative;
right: 33px;
top: -2px;
}
.fromToField.first{
margin-bottom: 0;
}
.fromToField{
margin-left: auto;
margin-right: auto;
width: 206px;
height: auto;
}
.fromToLabel{
display: block;
text-align: left;
}
.controlSeparate input.text-box{
left: auto;
position: relative;
}
.controlSeparate.right {
text-align: center;
}
.controlSeparate .fromToField span.icon {
left: 176px;
position: absolute;
top: 29px;
}
#timeDropDownContainer input.inforDropDownList{
width: auto !important;
}
/*data*/
.col-1of3, .col-2of3{
width: auto !important;
display: inline-block;
border: none;
padding: 5%;
word-break: break-all;
}
#onetimepay .onetimepayform .dataEntry.colTwo,
.userform .dataEntry.colTwo {
padding-bottom: 0;
}
#onetimepay .onetimepayform .dataEntry .col2,
.userform .dataEntry .col2 {
top: 0;
}
.onetimepayform .text-box,
.userform .text-box{
position: relative;
left: 0;
top: 0;
}
#login #register .dataEntry .text-box,
#onetimepay .dataEntry .text-box,
.userform .dataEntry .text-box {
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
}
#login #register .inforDropdownContainer,
#login select {
position: relative;
width: 100%!important;
}
.postPay td, .postPay th {
padding: 15px;
}
.postPay th:first-child+td {
overflow: hidden;
text-overflow: ellipsis;
}
#mobile-header {
display: block;
position: relative;
margin: 0 1.5em;
}
#quickLinks{
display: none;
background: url("../images/sprites.png") no-repeat scroll -610px -42px transparent;
height: 40px;
position: fixed;
right: 7px;
top: 62px;
width: 40px;
z-index: 500;
text-indent: -9999px;
padding: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
#responsive-menu-button{
background: url("../images/sprites.png") no-repeat scroll -609px top transparent;
display: inline-block;
height: 38px;
margin-top: 20px;
text-indent: -9999px;
width: 49px;
}
#mobile-header .mobile-logo{
display: inline-block;
position: absolute;
top: 0;
right: 0;
}
.topMainMenu ul li a, .topMainMenu ul li .active{
height: auto;
margin: 0;
text-indent: 0;
width: auto;
}
th.desk, td.desk, a.deskOnly, .deskOnly{
display: none;
}
.pageArrows, .pageNumbers{
text-align: center;
display: block;
}
.mobile{
display: inherit;
}
.request-search-email label
{
padding-right: 0;
padding-top: 12px !important;
display: block;
margin-bottom: 0px !important;
}
/*control elements*/
#options.inforRadioButtonSet label{
/*padding-right: 0;
display: block;*/
margin-bottom: 12px;
}
.address-matches-table, .contact-matches-table td .inforRadioButtonLabel {
display: inline!important;
margin-bottom: 0!important;
}
.controlSeparate{
display: block;
width: 100%;
text-align: center;
}
/*footer*/
/*footer{
bottom: auto;
height: auto;
position: relative;
}*/
footer > ul.botLinks{
padding: 0 1.5em 24px;
font-size: 1.1em;
}
footer > ul > li {
width: 100%;
}
/*footer > ul > li.copyright{
}*/
.topMainMenu, .botSideMenu, #navigation .menuPointer, #navContainer, #quickLinks .quickButton{
display:none;
}
/* #jPanelMenu-menu .botSideMenu, #jPanelMenu-menu .topMainMenu{
display: block;
}*/
}
/* small screens and iPads ----------- */
@media only screen
and (max-width : 1024px) {
/* Styles */
body.main, body.login {
background-image: none;
}
/*
header{
display: none;
}
.main #navigation{
margin: 0 auto;
}
*/
#headerContainer {
padding-left: 20px;
}
#headerContainer ul {
right: 20px;
}
.dp-container {
margin: 0 auto;
width: 100%;
}
li.dp-panel .pastDue {
padding: 40px 10% 90px;
}
.tooltip:hover:before, .tooltip:hover:after{
display: none;
}
#login p.dataEntry, #onetimepay .dataEntry, .userform .dataEntry {
line-height: inherit;
}
#onetimepay .onetimepayform .dataEntry .col1, .onetimepayform .dataEntry .col2,
.userform .dataEntry .col1, .userform .dataEntry .col2 {
display: block;
}
#onetimepay .onetimepayform .dataEntry,
.userform .dataEntry{
padding: 0;
}
#onetimepay .onetimepayform .dataEntry.colSingle,
#onetimepay .onetimepayform .dataEntry.colTwo .col1,
#onetimepay .onetimepayform .dataEntry.colTwo .col2,
.userform .dataEntry.colSingle,
.userform .dataEntry.colTwo .col1,
.userform .dataEntry.colTwo .col2{
margin-bottom: 2px;
padding: 10px 5%;
}
#onetimepay .onetimepayform .dataEntry.colTwo .col1,
.userform .dataEntry.colTwo .col1{
left: 105px;
border-bottom: 2px solid white;
}
#onetimepay .onetimepayform .dataEntry.colTwo .col2,
.userform .dataEntry.colTwo .col2 {
left: 0;
position: relative;
top: auto;
}
.onetimepayform .dataEntry .col1,
.onetimepayform .dataEntry .col2,
.userform .dataEntry .col1,
.userform .dataEntry .col2 {
float: none;
width: auto;
}
.onetimepayform .col2 .text-box,
.onetimepayform .col2 .text-box.dropDownField,
.userform .col2 .text-box,
.userform .col2 .text-box.dropDownField {
top: 10px;
}
#onetimepay .onetimepayform .dataEntry.colTwo,
.userform .dataEntry.colTwo{
margin-bottom: 2px;
}
#onetimepay .onetimepayform .dataEntry .col1,
#onetimepay .onetimepayform .dataEntry .col2,
#onetimepay .onetimepayform .dataEntry.colSingle,
.userform .dataEntry .col1,
.userform .dataEntry .col2,
.userform .dataEntry.colSingle{
line-height: 40px;
}
.onetimepayform .col2 input.text-box,
.userform .col2 input.text-box {
top: 10px;
}
.onetimepayform input.text-box.fullwidth,
.userform input.text-box.fullwidth {
width: 70%;
}
.controlBar3 input[type=search] {
width: 180px;
}
.fullWidth .inforDropDownList{
width: 216px!important;
}
footer{
bottom: auto;
height: auto;
position: relative;
width: auto;
}
footer > ul{
height: auto;
padding: 0 6em 24px;
width: auto;
}
footer > ul > li {
border-right: medium none;
display: inline-block;
margin-right: 0;
width: 49%;
padding-top: 28px;
}
footer > ul > li.copyright{
right: auto;
text-align: left;
width: 100%;
line-height: 2.4em;
}
}
#securityQueryContainer .inforDropDownList {
width: 100% !important;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#securityQueryContainer table.inforTriggerFieldTable td.arrow{
width: 10px;
}
#securityQueryContainer table.inforTriggerFieldTable {
display: table;
width: 366px;
}
#securityQueryContainer table.inforTriggerFieldTable tbody {
display: table-row-group;
}
#securityQueryContainer table.inforTriggerFieldTable tr{
display: table-row;
}
#securityQueryContainer table.inforTriggerFieldTable td {
display: table-cell;
}
#securityQueryContainer table.inforTriggerFieldTable td:first-child {
width: auto;
}
#securityQueryContainer .inforTriggerButton {
margin: 0;
}
@media (max-width: 768px) {
header{
display: none;
}
.main #navigation{
margin: 0 auto;
}
#headerContainer {
padding-left: 0;
}
#headerContainer ul {
right: 0;
}
/* login screen */
.primaryBtn.btn-login {
width: auto;
}
body.login.register {
height: auto;
min-height: 0;
}
#login {
top: 0;
margin-top: 56px;
}
#content-header.alternate {
background-image: none;
margin: 0;
padding: 10px;
}
.controlSeparate {
text-align: left;
}
.fromToField {
width: auto;
}
.controlSeparate.right input[type="search"] {
padding-right: 36px;
}
.controlSeparate span.icon {
top: 0;
}
.controlSeparate.right {
text-align: left;
}
.dataEntry label {
display: block;
max-width: inherit;
margin-bottom: 5px;
}
.userform input.text-box.fullwidth {
width: 100%;
}
#onetimepay .dataEntry label,
.userform .dataEntry label {
line-height: normal;
}
.onetimepayform .col2 .text-box,
.onetimepayform .col2 input.text-box,
.onetimepayform .text-box.dropDownField,
.onetimepayform .col2 .text-box.dropDownField,
.userform .col2 .text-box,
.userform .col2 input.text-box,
.userform .text-box.dropDownField,
.userform .col2 .text-box.dropDownField {
top: auto;
}
#onetimepay .dataEntry #customAmount,
.userform .dataEntry #customAmount {
left: 14px;
padding: 0 13px;
width: 75px;
}
#expirationDate {
line-height: normal;
margin-bottom: 5px;
}
.dataEntry .formFeedback {
padding: 10px ;
}
.inforTriggerField,
.inforTriggerField .inforTextbox,
table.inforTriggerFieldTable,
table.inforTriggerFieldTable tbody,
table.inforTriggerFieldTable tr,
table.inforTriggerFieldTable td {
width: 100%!important;
}
table.inforTriggerFieldTable td {
display: table-cell;
}
table.inforTriggerFieldTable td.arrow {
width: 18px!important;
}
.expdatePlaceholder .inforTriggerField,
.expdatePlaceholder table.inforTriggerFieldTable td.arrow,
.expdatePlaceholder table.inforTriggerFieldTable,
.expdatePlaceholder table.inforTriggerFieldTable tbody,
.expdatePlaceholder table.inforTriggerFieldTable tr,
.expdatePlaceholder table.inforTriggerFieldTable td {
width: auto!important;
}
.expdatePlaceholder .inforTextbox {
width: 40px!important;
}
.inforTriggerField .inforTextbox {
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
.inforDropDownList {
height: 40px;
}
#login.account-registration.continued {
}
/* registration screen */
#login.account-registration .dataEntry {
min-height: 47px;
padding: 5px;
}
.account-registration .dataEntry label {
position: static;
width: 100%;
}
.dataEntry.security-question {
height: auto;
}
.account-registration .formFeedback {
position: relative;
}
.account-registration .formFeedback:before {
margin-right: 8px;
position: static;
top: -2px;
vertical-align: middle;
}
#login.account-registration .primaryBtn,
#login.account-registration .secondaryBtn {
width: auto;
}
/* notifications table */
.notifications-table {
}
.notifications-table caption {
text-align: center;
}
.notifications-table thead {
display: none;
}
.notifications-table tbody .row {
display: block;
margin-bottom: 20px;
}
.notifications-table tbody td {
background: #fff!important;
}
.notifications-table tbody .col {
border-bottom: none;
border-right: none!important;
display: block!important;
padding: 15px!important;
width: 100%!important;
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
.notifications-table .col-type-description,
.notifications-table .col-method-description {
margin-bottom: 1px;
}
.notifications-table .col-delete.desktop {
display: none!important;
}
.notifications-table .col-delete.mobile {
display: block!important;
}
.notifications-table .col-delete {
text-align: center;
}
.notifications-table .secondaryBtn {
font-size: inherit;
}
.notifications .add-notification {
background: #fff;
}
.notifications-table .dataEntry {
height: auto!important;
padding-left: 0!important;
}
.notifications-table .dataEntry label {
color: #5a5a5a!important;
display: block;
font-family: 'mainFontSemiBold'!important;;
font-size: 14px!important;
font-weight: 600!important;
margin-bottom: 5px!important;
text-transform: uppercase!important;
}
.notifications-table .inforTriggerField .inforTextbox,
.notifications-table .inforTriggerField .inforTriggerButton {
background-color: #f7f7f7;
}
.notifications-table .text-box {
background-color: #f7f7f7;
}
/* profile settings */
.account-holder-settings-container,
.contact-information-container {
background-image: none;
margin-bottom: 40px;
padding-bottom: 0;
}
.notifications-container {}
.notifications-container tbody td {
background: #f7f7f7!important;
}
.notifications-container tbody .col-notification-method,
.notifications-container tbody .col-method-description {
background: #f0f3f3!important;
}
.notifications-container input.text-box {
background: #fff!important;
}
.notifications-container .add-notification {
background: #f7f7f7;
}
/* service request */
#content-header.service-request .buttons {
display: block;
padding: 3%;
text-align: center;
}
#content-header.service-request .buttons .secondaryBtn {
display: inline-block;
width: 48%;
}
#content-header.service-request .buttons .secondaryBtn.active {
background: #dcdcdc;
color: #858585;
}
.request-type-container h3 {
display: block;
}
.request-location-container,
.personal-information-container,
.request-type-container,
.attachments-container,
.request-details-container {
background-image: none;
margin-bottom: 40px;
padding-bottom: 30px;
}
.attachments-container h3 {
float: none;
}
.attachments-container .note {
float: none;
width: 100%;
}
.attachments-container .buttonBar1 {
margin-bottom: 0;
}
.personal-information-container h3 {
float: none;
}
.personal-information-container .note {
float: none;
width: 100%;
}
#requestTypeLabel {
top: 0;
}
.activity-container .controlBar3 input[type=search] {
width: 100%;
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
.activity-container .controlSeparate.right {
position: relative;
}
.activity-container .controlSeparate span.icon-search {
position: absolute;
right: 30px;
top: 6px;
}
.request-options-container .btn-cancel {
display: block;
height: 30px;
margin: 0 0 10px 0;
width: 100%;
}
.request-options-container .secondaryBtn {
width: auto;
}
/* move-in service request */
.form-buttons {
text-align: center;
}
.form-buttons .primaryBtn,
.form-buttons .exportBtn,
.form-buttons .secondaryBtn {
float: none;
margin-bottom: 10px;
}
.form-buttons .primaryBtn {
margin-right: 10px;
}
.request-confirmation p {
margin-left: 0;
margin-right: 0;
width: 100%;
}
.form-buttons .exportBtn
{
margin-right: 10px;
}
/* payments */
.payment-account-container {
background-image: none;
margin-bottom: 20px;
}
.multiple-accounts-table thead {
display: none;
}
.multiple-accounts-table tr {
display: block;
margin-bottom: 30px;
}
.multiple-accounts-table td {
display: block;
vertical-align: top;
padding: 10px!important;
width: 100%;
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
.multiple-accounts-table tr {
padding: 0;
}
.multiple-accounts-table td.col-account-number {
background: #f7f7f7;
color: #00aeef;
}
.multiple-accounts-table td.col-account-number .label {
color: #00aeef;
}
.multiple-accounts-table td.col-service-address {
background: #f0f3f3;
}
.multiple-accounts-table td.col-paid-status {
background: #f7f7f7;
}
.multiple-accounts-table td.col-amount-due {
background: #f0f3f3;
}
.multiple-accounts-table td.col-payment {
background: #f7f7f7;
}
.multiple-accounts-table td .label, .multiple-accounts-table td label {
display: inline-block;
width: 150px;
}
.total-current-charges {
margin-top: 0;
}
.payment-method-option .inforCheckboxLabel {
display: inline-block!important;
margin-bottom: 0!important;
}
footer > ul > li > ul > li
{
font-family: 'mainFontReg', Helvetica, Arial, sans-serif;
text-transform: uppercase;
font-size: 1em;
line-height: 1.8em;
}
footer > ul > li
{
border-right: medium none;
display: inline-block;
margin-right: 0;
width: 49%;
padding-top: 12px;
}
footer > ul > li.copyright
{
right: auto;
text-align: left;
width: 100%;
line-height: 1.5em;
}
.buttonBarh3
{
text-align: center;
width: 100%;
padding-bottom: 14px;
}
.buttons
{
text-align: center;
}
}
@media (max-width: 640px) {
#login {
background-image: url(../images/bg-diagnol-lines.png);
background-repeat: repeat;
}
.form-buttons {
text-align: center;
}
.form-buttons .col-1,
.form-buttons .col-2 {
float: none;
}
/* service request */
#content-header.service-request .buttons .secondaryBtn {
display: block;
width: 100%;
}
#content-header.service-request .buttons .btn-create-new {
margin-bottom: 10px;
}
#content-header.service-request .buttons .secondaryBtn.active {
background: #dcdcdc;
color: #858585;
}
.attachments-table td.col-file-name {
word-break: break-word;
width: auto;
}
.attachments-table td {
vertical-align: top;
}
.attachments-table .btn-remove {
display: block;
margin-top: 4px;
}
.attachments-table td.col-file-name {
line-height: 20px;
}
.attachments-table td.col-description {
}
.attachments-table td .field {
padding-left: 0;
}
.attachments-table td .field label {
display:block;
line-height: 20px;
position: static;
width: auto;
}
/* service request location */
.request-location-container .radio-buttons .inforRadioButtonLabel {
display: block;
margin-right: 0;
}
.request-location-options.inforRadioButtonSet {
background: none;
padding: 0 3% 3%;
}
.request-location-options.inforRadioButtonSet .inforRadioButtonLabel {
display: block;
height: 23px;
margin: 0;
}
.request-location-options.inforRadioButtonSet .inforRadioButtonLabel:last-child {
margin-bottom: 0;
}
.request-location-options.inforRadioButtonSet .inforRadioButtonLabel .labelText {
top: -4px;
}
.request-location-options .inforRadioButtonSet {
padding-left: 0;
}
/* payments */
.payment-account-container .radio-buttons .inforRadioButtonLabel {
display: block;
margin-right: 0;
}
.payment-account-options.inforRadioButtonSet {
background: none;
padding: 0 3% 3%;
}
.payment-account-options.inforRadioButtonSet .inforRadioButtonLabel {
display: block;
height: 23px;
margin: 0;
}
.payment-account-options.inforRadioButtonSet .inforRadioButtonLabel:last-child {
margin-bottom: 0;
}
.payment-account-options.inforRadioButtonSet .inforRadioButtonLabel .labelText {
top: -4px;
}
.payment-account-option .inforRadioButtonSet {
padding-left: 0;
}
.multiple-accounts-table td .label, .multiple-accounts-table td label {
margin-bottom: 6px;
width: 100%;
}
.payment-account-choices-container .payment-account-option .group-label {
display: block;
font-family: 'mainFontBold';
font-size: 17px;
font-weight: 700;
margin: 0;
text-align: center;
}
.payment-account-choices-container .payment-account-option .inforRadioButtonSet #customAmount {
width: 50px;
}
.payment-methods-container h3 {
/* display: block; */
}
.payment-method-options {
}
.payment-method-options .inforRadioButtonLabel {
display: block;
height: 23px;
margin: 0 0 12px 0;
padding: 0;
}
.payment-method-options .inforRadioButtonLabel:last-child {
margin-bottom: 0;
}
.payment-method-options.inforRadioButtonSet .inforRadioButtonLabel .labelText {
top: -4px;
}
.saved-bank-accounts-table {}
.saved-bank-accounts-table td.col-check-number {
border-left: none;
}
.saved-bank-accounts-table tr {
}
.saved-bank-accounts-table td {
display: block;
vertical-align: top;
padding: 10px!important;
width: 100%;
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
.saved-bank-accounts-table .field label {
display: block;
left: 0;
line-height: 40px;
position: absolute;
top: 0;
width: 65px;
}
.modal-content .buttons .btn-close {
/*margin-bottom: 10px;*/
}
.attachments .add-attachment {
text-align: center;
}
.buttons {
text-align: center;
}
}
@media (max-width: 480px) {
/* login screen */
#login .additional-actions .secondaryBtn {
display: inline-block;
min-width: 100px;
}
.additional-actions .divider {
display: block;
height: 1px;
margin: 20px 0;
width: 100%;
}
/* payment */
.total-current-charges .field label {
display: block;
margin: 0 0 10px;
text-align: left;
}
.total-current-charges .field input {
width: 100%;
}
}
@media (max-width: 320px) {
/*
section .dp-panel h3 {
text-align: left;
}
*/
.pageArrows {
margin-bottom: 10px;
}
.pageNumbers {
text-align: left;
}
.pageNumbers label[for="pagesize"] {
float: left;
width: 50%;
margin-bottom: 30px;
}
.pageNumbers label[for="gotopage"] {
float: left;
clear: left;
width: 50%;
}
#pagesizeContainer,
#gotopageContainer {
float: left;
}
.dp-container .dp-panels .dp-panel h3 {
padding: 0 10px;
}
#login1 input.text-box {
padding-left: 15%;
width: 75%;
}
#onetimepay .dataEntry #customAmount,
.userform .dataEntry #customAmount {
padding: 0 13px;
width: 60px;
}
/* login screen */
.sub-form .col-1,
.sub-form .col-2 {
float: none;
}
.pageNumbers .field {
float: none;
text-align: left;
width: 100%;
margin-bottom: 10px;
}
.pageNumbers .field:last-child {
margin-bottom: 0;
}
.pageNumbers .field label,
.pageNumbers label[for="gotopage"],
.pageNumbers label[for="pagesize"] {
display: block;
margin: 0;
padding: 0;
}
}