File: /home/imensosw/www/imenso.co/dev/prc/css/responsive.css
@media (min-width: 1200px) {
.container { width: 1020px; }
}
@media(max-width: 1300px){
.login-modal .ml-5{ margin-left: 2rem!important }
.login-modal .mr-5{ margin-right: 2rem!important;}
.login-modal .px-5 { padding-left: 2rem!important;}
}
@media(max-width: 1200px){
.receipt{ margin-bottom: 3rem !important }
.lined-form .steps .w-75 img{ max-width: 320px; width: 100% }
.receipt1{ background-color: #f1f1f1; border: 1px solid #ddd; padding: 10px; margin: 0 0 1.5rem 0 !important }
#step-3 .receipt1{ margin: 2rem auto !important }
.make_payment .border-right{ border-right: none !important}
.pay-option{ margin-top: 3rem }
}
@media(max-width: 1100px){
.header-icon li:last-child{ margin-right: 5px }
.right_panel>.m-5{ margin: 2rem 1rem !important;}
.filter_area{ display: block !important; }
.filter_area small{ display: block; }
.filter_area .dropdown{ display: inline-block; margin:5px 10px 5px 0 !important }
.right-most1{padding: 0 !important;}
.form-wrapper{ padding: 30px !important }
.payment_code .table_block tr{ display: block; }
.payment_code .table_block td{ padding: 5px 0 }
.payment_code .table_block td.trash-link { position: absolute; right: 10px; top: 15px; width: 25px; text-align: right !important; }
.payment_code .table_block td:nth-child(1), .payment_code .table_block td:nth-child(2), .payment_code .table_block td:nth-child(3) {width: 32%; display: inline-block; padding: 5px }
.payment_code .table_block td:nth-child(5), .payment_code .table_block td:nth-child(4) {width: 100%; display: inline-block; text-align: left !important; }
}
@media(max-width: 992px){
.left_panel{ overflow-y: auto; left: -100%; box-shadow: none !important }
.left_panel.collaps{left: 0px;}
.right_panel{ position: absolute; width: 100%; left: 0; margin-left: 0 }
.right_panel.collaps{left: 0; height: 100%; overflow: hidden;}
.right_panel.collaps:before{ content: ''; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.4); z-index: 1 }
.hide_show{ display: block; }
.custom-search{ margin-bottom: 1.5rem !important }
.fix_bottom{ margin-right: 40px }
.hide_show {top: 35px; right: 10px}
.modal-dialog p a[data-toggle="tooltip"]{ display: block; }
.modal-dialog p small br{ display: none; }
}
@media(max-width: 767px){
.pay-btn1 {
padding: 14px 22px;
font-size: 13px;
}
.btn-login.slect-mt
{
padding: 9px 0;
}
.pym-noti input.em-int {
width: 100%;
margin-top: 9px;
}
.btn-login
{
font-size: 12px;
}
.mr-xs-0
{
margin-right:0 !important;
}
.form-control{font-size: 13px;}
.modal-dialog.login-modal{margin: .5rem 0; width: 100%}
.login-modal .modal-body .col-md-5, .login-modal .modal-body .col-md-7{ text-align: center !important; }
.login-modal .modal-body .col-md-5.mb-5{ margin-bottom: 1.5rem!important }
.login-modal .modal-body .col-md-6{ margin: 10px auto !important }
.login-modal .ml-5, .login-modal .px-5, .login-modal .px-5 {margin-left: 0rem !important; margin-right: 0rem !important; padding-left:0 !important; padding-right:0 !important; }
.login-modal .modal-footer .text-right ,.login-modal .modal-footer p{ text-align: center !important }
.btn.register{ margin: 1.5rem auto !important; }
.btn.btn-login,.btn.register{display: block; width: 100%}
.login-modal .modal-footer p br, .form-2, .filter_area .dropdown{ display: none; }
.header-icon li{ margin: 20px 5px !important }
.login-modal .mr-5{margin-right: 0rem!important;}
.login-modal .modal-body .border-right { border-right: none !important; }
.fix_bottom{ position: fixed; margin-right: 0; bottom: 0; left: 0; width: 100%; background: #fff; z-index: 1; border-radius: 0; border: 1px solid #eee;background-color: #1EA8AA; background-image: linear-gradient(-135deg, #1EA8AA, #1C689A); color: #fff }
.fix_bottom:hover{border: 1px solid #eee;}
.right_panel>.m-5 {margin: 0rem !important;}
.header_area{ margin: 1rem auto }
.header_area .d-flex{ display: block !important; text-align:left; }
.header_area h4{ margin-bottom: 1rem }
.hide_show {top: 17px; right: 0px}
table.table_block td{ display: block; width: 100%; padding: .5rem 0; border: none }
table.table_block tr{ border-bottom: 1px solid #eee }
.payment_code .card{ margin-bottom: 1.5rem !important }
.payment_code table td, .payment_code table td.text-center{text-align: left !important;}
.payment_code table.table_block tr, table.table_block tr:last-child{ border-bottom:none !important }
.payment_code table.table_block td br{ display: none; }
.payment_code table.table_block td span{ margin-right: 10px }
.payment_code table.table_block td:first-child span{ display: none; }
.payment_code table.table_block td span:after{ content: ":" }
.payment_code table.table_block td a{ display: block; padding: 5px 0 }
.payment_code table td.trash-link a{ padding: 10px; display: inline-block; background: #fff; }
.payment_code .table-responsive td, .payment_code .table-responsive th{ min-width: 120px }
.card-link span{ display: none; }
.dashboard{}
.modal-dialog{ width: 90%; margin: 2rem auto !important; }
.mobile_horizontal{ display: block !important; }
.mobile_horizontal.mb-5, .custom-search{ }
.my_account, .payment_history, .statement{ margin-bottom: 3rem !important }
.mobile_horizontal small{ display: block; }
.my_account .mobile_horizontal .dropdown{ margin: 5px 10px 5px 0 !important}
.filter_area .dropdown.show1{ display: inline-block;}
.filter_area .dropdown.show1 button{ min-width: 135px; text-align: left; }
.filter_area .dropdown.show1 .dropdown-toggle::after{ float: right; margin-top: 9px; }
.table-responsive td, .table-responsive th{ min-width: 120px }
.make_payment{ margin-top: 2rem !important }
.make_payment .receipt{ margin-top: 1rem !important }
.form-wrapper{ padding: 15px !important }
.light h1{ font-size: 20px; margin: 2rem auto !important }
.banner5 .modal-body { padding: 50px 0 20px;}
.highlight{ background-color: #f1f1f1; border: 1px solid #ddd; padding: 10px; margin-top: 2rem }
.filter_hideshow {cursor: pointer;}
.filter_hideshow span{ display: inline-block; margin-left: 5px; padding: 5px; position: relative; }
.filter_hideshow span:before{content: ''; position: absolute; top: 3px; left: 0px; border-top: 6px solid #333; border-left: 6px solid transparent; border-right: 6px solid transparent; }
.faq .nav{ margin-top: 1rem !important }
.lined-form .steps .w-75, .lined-form .steps .w-75 img{ margin: 0px auto }
.lined-form .steps .w-75 img{ max-width: 280px; width: 100% }
#v-pills-tab {display: flex; flex-direction: row !important; justify-content: space-between;}
#v-pills-tab .nav-link.active { border-left: none; border-bottom:4px solid #1d799e; }
#v-pills-tab .m-hide {display: none;}
.neg-mar {margin: 0 -15px;}
.neg-mar-2 {margin: 0;}
#v-pills-tab .nav-link { padding: 12px 14px; border-bottom:none; }
#v-pills-tab { border-bottom: 1px solid #DDD; }
.form-height {min-height: auto;}
.merchant-note {position: relative; padding: 15px; margin-top: 50px;}
.hide-xs { display: none; }
.p-5 { padding: 10px !important; }
.form-height {
display: flex;
flex-wrap: wrap;
margin-left: -15px;
margin-right: -15px;
}
#v-pills-tab .nav-link.active::before {
border:none;
}
.px-5 {
padding: 10px 0 !important;
}
}
@media(max-width: 575px){
.pay-option a{ display: inline-block; margin: 1rem auto !important }
}
@media(max-width: 544px){
.profie_edit td{ display: block; width: 100%; padding: .75rem 0; border: none }
.profie_edit td.text-right{text-align: left !important;}
.profie_edit .p-3{padding: 1rem 0 !important;}
.d-pay-bill,.login-first{ text-align: center; }
.d-pay-bill span,.login-first span{display: inline-block; margin-bottom: 10px; width: 100% /*margin-right: 5px; font-size: 13px*/}
.d-pay-bill a,.login-first a{}
.faq .nav-item a{padding: 1rem .5rem !important;}
.my_account .mb-5{ margin-bottom: 2rem !important }
.payment_code table td.trash-link{ top: 5px }
.payment_code .table_block td:nth-child(1), .payment_code .table_block td:nth-child(2), .payment_code .table_block td:nth-child(3), .payment_code .table_block td:nth-child(5), .payment_code .table_block td:nth-child(4) {width: 100%; display: inline-block; text-align: left !important; }
.card-body{ padding: 1rem !important }
.filter_area .dropdown.show1{width: 46%; margin: 5px 1.5% !important}
.filter_area .dropdown.show1 button , .filter_area .dropdown-menu.show{width: 100%;}
}
@media(max-width: 350px){
.faq .nav-item a{font-size: 10px !important}
}
/*iPad in portrait & landscape*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
.spark-container #toc, .spark-container #toc .scroll{ bottom: 40px !important;}
}
/*iPad in landscape*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
}
/*iPad in portrait*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
}
/*IE code*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
}
/*New Css*/
@media(max-width: 1200px){
.ac__card1.d-flex{ display: block !important; }
.ac__card1 .list-inline-item{ width: 23%; margin-right: 1%; padding-right: 1% }
.ac__card1 .btn-login{ margin-top: 20px !important }
}
@media(min-width: 768px){
.mobile_logo{ display: none; }
.mobile_logo img{ height: 50px; width: auto; }
}
@media(max-width: 767px){
.infobox{ padding: 0 0 20px !important; margin: 20px auto 30px; }
.fix_right{ top: calc(100% - 90px); right: 15px; transform: rotate(0deg); padding: 10px !important;}
.fix_right i{ margin-right: 0 }
.fix_right span{ display: none; }
.payment_code table td.text-right, .table-bill td:last-child{ text-align: right !important; }
.scrollable .px-5, .user-account{ padding: 0 20px 0 30px !important }
.scrollable .nav-link{ padding-left: 30px !important }
.infobox>.card-body{ padding: 25px !important }
.table-responsive {border: 1px solid #dee2e6 !important; }
.table-responsive .table-bordered {border:none!important; }
.col-sm-4 .balance{ display: flex;flex-wrap: wrap; flex-direction: column; align-content: space-between;}
.mobile_logo img{ height: 50px; width: auto; }
.hide_show {top: 24px !important;}
.header_area h4{ text-align: center; margin-bottom: 0 !important }
}
@media(max-width: 576px){
.balance.text-center {text-align: left !important; border-top: 1px solid #ddd !important; border-bottom: 1px solid #ddd !important; padding: 15px 0; margin-bottom: 20px}
.table.table-summary{ max-width: 100% !important; position: relative !important; width: 100% !important }
.ac__card1 .list-inline-item{ width: 100%; margin-right: 0%; padding-right: 0%; border-right: none !important }
.ac__card1{ padding: 1rem !important }
.btn-sm {padding: 0.175rem 1rem !important; font-size: 1em; }
.details.mt-5{ margin-top: 1.5rem !important }
}
@media(max-width: 420px){
.infobox ul li.nav-item{ width: 48%; margin: 0 1% }
.infobox ul li.nav-item a{ display: block; min-width: auto; padding: 0.5em 1.5em; }
.tab-pane .button-center{ text-align: center !important; }
.table-summary td:first-child{font-size: 80%}
}