File: /home/imensosw/www/imenso.co/dev/prc/css/style-2.css
/*!
Project Name: MPS
URL:
Author: Imenso Software
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Fonts
# Variables
# Common
# Header
/*--------------------------------------------------------------
# Fonts
--------------------------------------------------------------*/
@import url("https://fonts.googleapis.com/css?family=Work+Sans:400,500,600,700,800");
@import url('https://fonts.googleapis.com/css?family=Poppins:400,600,700,800');
@import url('https://fonts.googleapis.com/css2?family=Sen:wght@400;700;800&display=swap');
/*--------------------------------------------------------------
# Variables
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Common
--------------------------------------------------------------*/
@font-face {
font-family: 'AvenirLTStd';
font-style: normal;
font-weight: 400;
src: url(../fonts/AvenirLTStd-Book.otf);
}
@font-face {
font-family: 'AvenirLTStd';
font-style: normal;
font-weight: 500;
src: url(../fonts/AvenirLTStd-Medium.otf);
}
@font-face {
font-family: 'futura';
font-style: bold;
font-weight: 600;
src: url(../fonts/futura-heavy-font.ttf);
}
body {
font-size: 16px;
font-family: 'Sen', sans-serif;
}
a {
color: #37A000;
}
a:hover, a:focus {
text-decoration: none;
outline: none;
}
.navbar-dark .navbar-nav .nav-link {
font-family: 'Poppins', sans-serif;
}
strong, h1, h2, h3, h4, h5 {
font-weight: 700;
}
.text-theme
{
color: #1e9ba7;
}
.light-bg {
background-color: #FFFFFF;
}
form label {
font-weight: 400;
font-size: 0.8em;
}
.form-control {
padding: 0.575rem 0.85rem;
border: 1px solid #CCC;
border-radius: 4px;
}
.form-control:focus {
box-shadow: none;
background-color: #F5F5F5;
border-color: #DDD;
}
.btn-primary {
background: #1EA8AA;
border-color: #1EA8AA;
padding: 0.6em 3em;
transition: 0.3s all;
}
.white-text {
color: #FFF;
}
.btn-primary:hover {
background: #000;
border-color: #000;
}
.link {
color: #0A68AC;
}
.btn-secondary {
background: transparent;
border-color: #333;
padding: 0.475rem 1.85rem;
/*border-radius: 4px;*/ border-radius: 30px font-weight: 600;
transition: 0.3s all;
color: #333;
}
.burger {
padding: 100px 0;
}
.gutter {
padding: 0 100px;
}
.gutter-sm {
padding: 0 50px;
}
.navbar {
position: absolute;
width: 100%;
z-index: 9;
}
.navbar-brand {
width: 100px;
}
.nav-link.active {
opacity: 1;
}
.dropdown-menu {
background: #fff none repeat scroll 0 0;
border: medium none;
border-radius: 2px !important;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.3);
position: absolute;
top: 50px;
z-index: 501;
}
.bg-primary {
background: #0A68AC !important;
}
.nav-link {
color: #000;
display: block;
padding: 0.5rem 1rem;
text-transform: uppercase;
font-size: 0.9em;
}
.banner {
height: 100vh;
position: relative;
}
.banner::before {
background-image: linear-gradient(-135deg, #504581, #69A1AC);
bottom: 0;
content: "";
position: absolute;
top: 0;
background-size: cover;
background-position: left;
width: 30%;
}
.banner img {
top: 26%;
left: 16%;
position: absolute;
}
.banner-3 {
background: rgba(0, 0, 0, 0) linear-gradient(to right, #0A68AC, #FF411A) repeat scroll 0 0;
height: 100vh;
}
.scrollable {
height: 500px;
overflow-y: auto;
}
.btn-light {
background: #FFF;
border: 1px solid #333;
font-size: 0.75em;
letter-spacing: 1px;
text-transform: uppercase;
}
.new-card {
background: #FFF;
border-radius: 8px;
box-shadow: 0 8px 24px rgba(0,0,0,0.2);
}
.showcase-box {
background: #FFF;
border-radius: 8px;
box-shadow: 0 8px 24px rgba(0,0,0,0.2);
margin-top: 150px;
overflow: hidden;
}
.dark-bg {
background: #EFF5F5;
}
.showcase-box h1 {
font-size: 2em;
}
.showcase-box p {
font-size: 0.9em;
}
.semi-bold {
font-weight: 500;
}
.box-link {
padding: 40px;
box-shadow: 0 3px 9px rgba(0,0,0,0.2);
border-radius: 4px;
position: relative;
transition: 0.3s all;
min-height: 285px;
}
.box-link a {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
text-indent: -9999px;
z-index: 2;
}
.box-link:hover {
box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}
.box-link h3 {
font-size: 1.3em;
margin-top: 20px;
}
.heading-text {
font-size: 1em;
text-transform: uppercase;
letter-spacing: 1px;
opacity: 0.5;
}
.blue-bg {
background: rgba(10,104,172,1);
color: #FFF;
}
.green-bg {
background: rgba(150,190,58,1);
color: #FFF;
}
.orange-bg {
background: rgba(255,65,26,1);
color: #FFF;
}
div.balanceNoteContainer{
text-align:center;
padding: .5em .5em .5em .5em;
}
span.balanceNote{
font-size:.7em;
text-align:center;
}
/* -- Floating Action Buttons*/
.fab {
bottom: 1em;
position: fixed;
margin: 1em;
right: 1em;
}
.buttons {
box-shadow: 0px 5px 11px -2px rgba(0, 0, 0, 0.18), 0px 4px 12px -7px rgba(0, 0, 0, 0.15);
border-radius: 50%;
display: block;
width: 56px;
height: 56px;
margin: 20px auto 0;
position: relative;
-webkit-transition: all 0.1s ease-out;
transition: all 0.1s ease-out;
}
.buttons:active,
.buttons:focus,
.buttons:hover {
box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
}
.buttons:not(:last-child) {
margin: 20px auto 0;
opacity: 0;
-webkit-transform: translateY(50px);
-ms-transform: translateY(50px);
transform: translateY(50px);
}
.fab:hover .buttons:not(:last-child) {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
margin: 15px auto 0;
}
/* Unessential styling for sliding up buttons at differnt speeds */
.buttons:nth-last-child(1) {
-webkit-transition-delay: 25ms;
transition-delay: 25ms;
background-image: url("../images/support.png");
background-position: center center;
background-repeat: no-repeat;
background-color: #0A68AC;
}
.buttons:not(:last-child):nth-last-child(2) {
-webkit-transition-delay: 75ms;
transition-delay: 40ms;
background-image: url("../images/question.png");
background-position: center center;
background-repeat: no-repeat;
background-color: #ff411a;
}
.buttons:not(:last-child):nth-last-child(3) {
-webkit-transition-delay: 100ms;
transition-delay: 60ms;
background-image: url("../images/envelope.png");
background-position: center center;
background-repeat: no-repeat;
background-color: #96be3a;
}
[tooltip]:before {
top: -70%;
font-weight: 600;
border-radius: 4px;
background: #585858;
color: #fff;
content: attr(tooltip);
font-size: 12px;
visibility: hidden;
opacity: 0;
padding: 5px 7px;
margin-right: 12px;
position: absolute;
right: -28%;
white-space: nowrap;
line-height: 20px;
}
[tooltip]:hover:before,
[tooltip]:hover:after {
visibility: visible;
opacity: 1;
}
.footer {
padding: 50px 0;
}
.footer-links {
padding: 0;
margin: 0;
}
.footer-links li {
list-style: none;
display: inline-block;
margin-right: 10px;
}
.footer-links li a {
color: #666;
font-size: 0.8em;
}
.copy {
font-size: 0.8em;
color: #777;
}
.footer a {
color: rgb(59,134,189);
}
.or-text {
text-align: center;
position: relative;
font-weight: 600;
color: #000;
opacity: 0.8;
}
.or-text span {
display: inline-block;
height: 30px;
width: 30px;
border-radius: 100%;
line-height: 30px;
text-align: center;
background-color: #E4EDED;
font-size: 0.9em;
}
.or-text span:after {
content: "";
background: #E4EDED;
height: 2px;
width: 100%;
position: absolute;
top: 50%;
left: 0;
z-index: -1;
}
.opac {
opacity: 0.7;
border: 8px solid #E4EDED;
}
.bullets {
margin-top: 30px;
padding: 0;
}
.bullets li {
list-style: none;
margin-bottom: 7px;
font-size: 0.9em;
color: #666;
}
.bullets i {
color: #1EA5A9;
margin-right: 7px;
}
#step1 .p-5 {
padding-top: 100px !important;
padding-bottom: 100px !important;
}
#step1 .btn {
width: 70%;
}
/* --- FAB ends */
/*--------------------------------------------------------------
# Version 4
--------------------------------------------------------------*/
.banner-4 {
background: transparent;
min-height: 100vh;
}
.banner-4 .scrollable {
background: #FFF;
border-radius: 8px;
box-shadow: 0 8px 24px rgba(0,0,0,0.2);
height: 450px;
}
.slogan {
position: absolute;
bottom: 100px;
color: #FFF;
}
.banner-4 .btn-primary {
background-image: linear-gradient(-135deg, #ff7f04, #f60e81);
padding: 0.875rem 1.85rem;
border: none;
}
.ripped {
height: 100vh;
position: relative;
}
.ripped::before {
background-image: linear-gradient(-135deg, #504581, #69A1AC);
background: url('../images/OSZB6Y0.jpg');
bottom: 0;
content: "";
position: absolute;
top: 0;
background-size: cover;
background-position: left;
width: 30%;
}
.ripped h1 {
font-size: 2.5em;
color: #FFF;
}
.ripped h4 {
color: #514882;
}
.ripped .form-control {
border: 1px solid #DDD;
border-radius: 4px;
}
.ripped .btn-primary {
background-image: linear-gradient(-135deg, #ff7f04, #f60e81);
padding: 0.675rem 2.85rem;
border: none;
border-radius: 30px;
font-weight: 500;
}
.btn-flat {
background-image: none;
background: transparent;
padding: 0.675rem 2.85rem;
border: none;
border-radius: 30px;
font-weight: 500;
text-decoration: underline;
color: #777;
}
.btn-primary.focus, .btn-primary:focus {
box-shadow: none;
}
.btn-flat.focus, .btn-flat:focus {
box-shadow: none;
}
.banner5 .modal-dialog {
max-width: 100%;
}
.banner5 .form-control {
border: 1px solid #DDD;
border-radius: 4px;
}
.banner5 .modal-body {
padding: 50px 0;
}
.btn-primary {
background-color: linear-gradient(-135deg, #1EA8AA, #1C689A);
border-radius: 4px;
font-weight: bold;
padding: 0.675rem 2.85rem;
text-transform: uppercase;
font-size: 1.2em;
color: #FFF;
}
.btn-login {
background-color: #1EA8AA;
background-image: linear-gradient(-135deg, #1EA8AA, #1C689A);
padding: 0.575rem 2.85rem;
border: none;
border-radius: 4px;
font-weight: 500;
color: #FFF !important;
}
.btn-login:hover {
color: #FFF;
}
.btn-secondary {
background: transparent;
border-color: #000;
padding: 0.475rem 1.85rem;
border-radius: 4px;
font-weight: 500;
transition: 0.3s all;
border-width: 2px;
text-transform: uppercase;
font-size: 0.85em;
color: #000
}
.btn-secondary i {
display: inline-block;
margin-right: 5px;
}
.btn-white {
background: #FFF;
border-color: #FFF;
padding: 0.475rem 1.85rem;
border-radius: 30px;
font-weight: 500;
transition: 0.3s all;
color: #333;
font-size: 0.9em;
}
.banner5 h4 {
color: #1C689A;
}
.banner5 .modal-footer {
display: block;
}
.banner5 .modal-footer {
justify-content: flex-start;
}
.banner5 a {
color: #1C6B9B;
}
.banner5 {
min-height: 100vh;
background-image: linear-gradient(-135deg, #1EA8AA, #1C689A);
position: relative;
}
.banner6 {
position: relative;
background: #FFF;
}
.banner6::before {
background-image: linear-gradient(-135deg, #504581, #69A1AC);
background: url('../images/bgg2.jpg');
bottom: 0;
content: "";
position: absolute;
top: 0;
background-size: cover;
background-position: left;
width: 33.33%;
}
.banner6 .modal-content {
border: none;
}
.banner6 .modal-body {
padding: 0 0 50px;
}
.banner6 #form-2 {
height: 250px;
overflow-y: auto;
}
.banner7 {
position: relative;
background-image: linear-gradient(-135deg, #1EA8AA, #1C689A);
color: #FFF;
}
.banner7:before {
background-image: linear-gradient(-135deg, #504581, #69A1AC);
background: url('../images/bgg2.jpg');
bottom: 0;
content: "";
position: absolute;
top: 0;
background-size: cover;
background-position: left;
width: 33.33%;
}
.banner7 .modal-content {
border: none;
background: transparent;
}
.banner7 .modal-body {
padding: 0 0 50px;
}
.banner7 #form-2 {
height: 250px;
overflow-y: auto;
}
.banner7 h4 {
color: #FFF;
}
.banner7 .bullets li {
color: #FFF;
}
.banner7 .bullets li i {
color: #FFF;
}
.banner7 .btn-secondary {
border-color: #FFF;
color: #FFF;
text-decoration: none;
}
.banner7 a {
color: #FFF;
text-decoration: underline;
}
.banner7 .btn-flat {
color: #FFF;
}
.banner7 .btn-login {
background-image: linear-gradient(-135deg, #ff7f04, #f60e81);
}
.slogan-2 h1 {
font-size: 29px;
}
@supports (mix-blend-mode: lighten) {
section.light .gradient1 {
display: inline-block;
position: relative;
color: #000;
background: #fff;
mix-blend-mode: multiply;
}
section.light .gradient1::before {
content: '';
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: linear-gradient(to right,#FD691C, #1B6799);
pointer-events: none;
}
section.light .gradient1::before {
mix-blend-mode: screen;
}
}
.light p {
color: #666;
}
.light h1 {
color: #1C689A;
}
@supports (mix-blend-mode: lighten) {
section.light .gradient2 {
display: inline-block;
position: relative;
color: #000;
background: #fff;
mix-blend-mode: multiply;
}
section.light .gradient2::before {
content: '';
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: radial-gradient(circle, #23966c, #faaa54, #e23b4a, #db0768, #360670);
pointer-events: none;
}
section.light .gradient2::before {
mix-blend-mode: screen;
}
}
section.dark {
background: #222;
}
section.dark .gradient1 {
color: #fff;
}
@supports (mix-blend-mode: lighten) {
section.dark .gradient1 {
display: inline-block;
position: relative;
color: #fff;
background: #000;
mix-blend-mode: lighten;
}
section.dark .gradient1::before {
content: '';
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: linear-gradient(to right,#23966c, #faaa54, #e23b4a, #db0768, #360670);
pointer-events: none;
}
section.dark .gradient1::before {
mix-blend-mode: multiply;
}
}
section.dark .gradient2 {
color: #fff;
}
@supports (mix-blend-mode: lighten) {
section.dark .gradient2 {
display: inline-block;
position: relative;
color: #fff;
background: #000;
mix-blend-mode: lighten;
}
section.dark .gradient2::before {
content: '';
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: radial-gradient(circle, #23966c, #faaa54, #e23b4a, #db0768, #360670);
pointer-events: none;
}
section.dark .gradient2::before {
mix-blend-mode: multiply;
}
}
.header-icon li {
height: 50px;
width: 50px;
border-radius: 100%;
color: #FFF;
line-height: 50px;
text-align: center;
display: inline-block;
margin: 2px 5px;
position: relative;
}
.header-icon li:last-child {
margin-right: 0;
}
.top-icon {
padding: 0;
}
.top-icon li {
display: inline-block;
margin-right: 10px;
position: relative;
border-radius: 100%;
}
.top-icon li a {
height: 50px;
width: 50px;
color: #FFF;
line-height: 50px;
text-align: center;
display: block;
}
.top-icon li:last-child {
margin-right: 0;
}
.top-icon img {
max-width: 20px;
}
.modal-footer h4 {
color: #000;
font-size: 1em;
margin-left: 10px;
}
.shadowed {
border: 1px solid #DDD;
padding: 10px;
}
.modal-footer ul, .modal-footer p {
margin-bottom: 0;
}
/*--------------------------------------------------------------
# Dashboard
--------------------------------------------------------------*/
.left_panel {
background: #FFF;
position: fixed;
top: 0;
bottom: 0;
left: 0;
width: 300px;
box-shadow: 0 2px 4px #ddd;
border-right: 2px solid #DDD;
}
.scrollable .nav-link {
padding-left: 50px;
}
.right_panel {
position: relative;
margin-left: 300px;
}
/*.right {
margin-top: 20px;
margin-bottom: 50px;
}*/
.right h1 {
font-size: 1.3em;
font-weight: bold;
}
.white-bg {
background: #FFF;
}
/*Not require this class
.right table td {
font-size: 0.9em;
border-top: none;
border-bottom: 1px solid #F0F4F7;
}*/
.statement td {
border-bottom: 5px solid #F0F4F7 !important;
}
.table-responsive tbody {
background: #FFF;
}
.table-responsive thead th {
border-bottom: medium none;
border-top: medium none;
color: #777;
font-size: 12px;
letter-spacing: 1px;
text-transform: uppercase;
}
.opaq {
opacity: 0.6;
}
.lined-form .form-control {
border: none;
border-bottom: 1px solid #333;
background: transparent;
padding-left: 0;
}
.lined-form .form-control:focus {
border-color: #0A68AC;
}
.card-hz {
background: #FFF;
padding: 20px;
box-shadow: 0 2px 8px #DDD;
border-radius: 4px;
margin-bottom: 30px;
position: relative;
}
.card-hz h3 {
font-size: 1.1em;
}
.card-hz h2 {
font-size: 1.2em;
}
.card-hz p {
margin-bottom: 0;
opacity: 0.6;
}
.card-hz a {
color: #333;
}
.right-most {
/*padding: 50px;*/ padding: 3rem !important
}
.nav-link {
transition: 0.3s all;
}
.nav-link.active {
border-right: 6px solid rgba(30,155,167,1);
color: #1C689A;
font-weight: bold;
background-color: #F0F4F7;
}
.big-text {
font-size: 1.3em;
}
.card {
border: none;
/*box-shadow: 0 15px 32px rgba(0, 0, 0, 0.2);*/ box-shadow: 0 15px 25px rgba(0, 0, 0, 0.05);
margin-bottom: 5px;
}
.card-header {
font-weight: bold;
background: transparent;
}
.b-r-4 {
border-radius: 4px;
overflow: hidden;
}
.theme-bg {
background: linear-gradient(-135deg, #34a090, #1b74a0);
color: #FFF;
}
.green-bg-g {
background: linear-gradient(-135deg, #94BC39, #487B36) !important;
color: #FFF;
}
.gray-bg-g {
background: linear-gradient(-135deg, #828081, #585657);
color: #FFF;
}
.card-link {
font-weight: 500;
font-size: 0.7em;
letter-spacing: 1px;
text-transform: uppercase;
color: #0A68AC;
}
.card-footer {
background: transparent;
}
.sml-text {
font-size: 0.9em;
}
.card-header h4 {
font-size: 1em;
margin-bottom: 0;
}
#progressbar {
counter-reset: step;
margin-bottom: 30px;
overflow: hidden;
margin-left: 0;
padding-left: 0
}
#progressbar li::before {
background: #fff none repeat scroll 0 0;
border-radius: 25px;
color: #0A68AC;
content: counter(step, decimal);
counter-increment: step;
display: block;
font-size: 14px;
line-height: 36px;
margin: 0 auto 5px;
position: relative;
width: 40px;
height: 40px;
border: 2px solid #0A68AC;
z-index: 1;
}
#progressbar li:first-child::after {
content: none;
}
#progressbar li::after {
background: #0A68AC none repeat scroll 0 0;
content: "";
height: 2px;
left: -50%;
position: absolute;
top: 18px;
width: 100%;
z-index: 0;
}
#progressbar li {
float: left;
list-style-type: none;
position: relative;
text-align: center;
width: 33.33%;
}
#progressbar li.active:before {
background: #0A68AC;
color: #FFF;
border: 2px solid #f0f4f7;
cursor: pointer;
}
#progressbar li.active:before a {
color: #FFF;
}
#progressbar a {
color: #000;
}
.form-wrapper {
background: #FFF;
box-shadow: 0 15px 32px rgba(0, 0, 0, 0.2);
border-radius: 4px;
}
.form-wrapper label {
margin-bottom: 0;
}
.page-header {
margin-bottom: 20px;
}
.bold {
font-weight: bold;
}
.page-header i {
background: rgba(0, 0, 0, 0) linear-gradient(-135deg, #34a090, #1b74a0) repeat scroll 0 0;
border-radius: 4px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
font-size: 18px;
height: 40px;
line-height: 38px;
margin-right: 20px;
text-align: center;
width: 40px;
color: #FFF;
}
.page-header h1 {
margin-bottom: 20px;
font-size: 1.2em;
}
.page-header h1 small {
display: block;
opacity: 0.5;
}
.user-account {
position: relative;
padding: 13px 50px;
border-top: 1px solid #EEE;
border-bottom: 1px solid #EEE;
}
.user-img {
height: 60px;
width: 60px;
background: rgba(30,155,167,0.8);
color: #FFF;
border-radius: 100%;
text-align: center;
line-height: 60px;
font-weight: bold;
margin-right: 20px;
text-transform: uppercase;
}
.semi-bold {
font-weight: 500;
}
.nav-item.dropdown a {
color: #333;
}
.left-icons {
margin: 0;
padding: 0;
}
.left-icons li {
list-style: none;
margin-bottom: 10px;
display: inline-block;
width: 25%;
}
.left-icons span {
display: none;
}
.left-icons img {
max-width: 20px;
margin-bottom: 5px;
}
.left-icons a {
color: #666;
font-size: 0.9em;
}
.v-sml-btn {
border: 1px solid #ddd;
border-radius: 50px;
color: #666;
display: inline-block;
font-size: 11px;
letter-spacing: 0.5px;
line-height: 15px;
margin-top: 5px;
padding: 5px 15px;
text-transform: uppercase;
}
.v-sml-btn:hover {
background: #EFF3F6;
color: #333;
}
.fi-po {
position: fixed;
bottom: 0;
width: 300px;
}
.gray-bg {
background: #6D6B6C;
}
.table {
margin-bottom: 0;
}
.table tr:last-child > td {
border-bottom: none;
}
.same-h {
min-height: 272px;
}
#accordion .card, .accordion .card {
box-shadow: none;
margin-bottom: 0;
border-top: 1px solid #DDD;
}
#accordion .card-body, .accordion .card-body {
padding: 1.25rem 1.95em;
}
#accordion p, .accordion p {
color: #666;
}
#accordion p strong, .accordion p strong {
color: #000;
}
.right-links {
padding: 0;
list-style: none;
}
.right-links li {
color: #333;
padding: 5px;
margin-bottom: 10px;
padding-left: 10px;
}
.right-links li a {
color: #333;
font-size: 0.9em;
}
.right-links li.active {
background: #FFF;
border-left: 4px solid #90b839;
box-shadow: 0 3px 6px rgba(0,0,0,0.2);
}
.white-link a {
color: #FFF;
}
.trash-link {
color: black;
vertical-align: middle !important;
text-align: right !important;
position: absolute;
top: 0px;
opacity: 0;
}
.infobox:hover .trash-link {
opacity: 1;
}
.white-box {
background: #fff none repeat scroll 0 0;
border-radius: 4px;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
margin-bottom: 30px;
}
.dt-3 {
padding: 30px;
width: 25%;
}
.white-box h2 {
font-size: 1.2em;
}
.d-table-cell {
vertical-align: middle;
}
/*--------------------------------------------------------------
# Login
--------------------------------------------------------------*/
/*Vishal Code*/
.form-wrapper label {
color: #4bafb9;
font-size: 10px;
letter-spacing: 1px;
text-transform: uppercase;
}
.lined-form .form-control {
border-bottom: 1px solid #ddd !important;
border-radius: 0;
}
.lined-form .form-control:focus {
border-color: #0A68AC !important;
}
.form-group {
margin-bottom: 1.5rem;
}
.receipt { /*background: #0A68AC; */
color: #fff;
}
.receipt label {
color: rgba(255,255,255,.5)
}
.receipt h5 {
font-size: 1.1em;
}
.receipt .form-control {
color: #fff;
}
.lined-form .receipt .form-control.bold {
border: none !important;
color: #FFF;
text-align: center;
padding-left: 10px;
font-weight: 700;
font-size: 44px;
line-height: 32px;
padding-left: 10px;
}
.lined-form .receipt .form-control.bold.table-borderless {
border: none !important;
text-align: left !important;
padding-left: 0
}
.lined-form .receipt .form-control:focus {
border-color: #fff !important;
}
.receipt ::-webkit-input-placeholder {
color: #fff !important;
opacity: .8
}
.receipt ::-moz-placeholder {
color: #fff !important;
opacity: .8
}
.receipt :-ms-input-placeholder {
color: #fff !important;
opacity: .8
}
.receipt :-moz-placeholder {
color: #fff !important opacity: .8;
}
.receipt .btn-secondary {
border-color: #fff;
color: #fff
}
.receipt .btn-secondary:hover {
background: rgba(255,255,255,.2)
}
.receipt .container {
display: block;
position: relative;
padding-left: 35px;
margin-bottom: 12px;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
width: 100%;
}
.receipt .container input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.checkmark {
position: absolute;
top: -5px;
left: 0;
height: 25px;
width: 25px;
background-color: rgba(255,255,255,.5);
}
.container input:checked ~ .checkmark {
background-color: #0968ac;
}
.checkmark:after {
content: "";
position: absolute;
display: none;
}
.container input:checked ~ .checkmark:after {
display: block;
}
.container .checkmark:after {
left: 9px;
top: 7px;
width: 5px;
height: 10px;
border: solid white;
border-width: 0 3px 3px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.or {
position: relative;
background-color: #0A68AC;
color: #fff;
border: 2px solid #fff;
display: block;
font-size: 12px;
height: 32px;
width: 32px;
text-align: center;
line-height: 30px;
border-radius: 100%;
margin: -.5rem 0 .5rem;
z-index: 1
}
/*.or:after, .or:before{ content: ''; position: absolute; top: 14px; width: 15px; height: 2px; background: #fff; z-index: 0}
.or:after{left: -20px;}
.or:before{ right: -20px; }*/
.faq .card {
font-size: 16px
}
.faq .accordion .card {
margin-top: -1px
}
.faq .card-header {
padding: 0;
}
.faq .card-header a {
display: block;
padding: 1.5rem 1.9rem 1.5rem 1.5rem;
color: #333;
font-weight: 700
}
.faq .card-body {
color: #999
}
.faq .card-body p {
}
.faq .btn-link {
font-weight: 700
}
.faq .btn-link, .faq .btn-link:hover {
color: #333;
text-decoration: none;
}
.faq .nav-tabs {
border-bottom: none
}
.faq .nav-item {
}
.faq li.nav-item:first-child a {
border-radius: 25px 0 0 25px
}
.faq li.nav-item:last-child a {
border-radius: 0 25px 25px 0
}
.faq .nav-item a {
display: block;
border: 1px solid #ddd;
background: #fff;
padding: 1rem 1.85rem;
position: relative;
height: 50px;
}
.faq #inner_accordion .card-header a {
background: rgba(0,0,0,.02);
padding: .8rem 1.5rem;
}
.faq .card-header a:before {
font-family: FontAwesome;
content: "\f067";
color: #000;
font-size: 14px;
position: absolute;
right: 10px;
top: 20px;
text-shadow: none;
background: #fff;
padding: 5px
}
.faq #inner_accordion .card-header a:before {
right: auto;
right: 5px;
top: 14px;
background: #fafafa;
}
.faq .card-header a[aria-expanded="true"]:before {
content: '\f068';
}
.faq .nav-item img {
display: block;
margin: 10px auto;
}
.faq .nav-link:hover {
color: #333 !important
}
.faq .nav-link.active {
box-shadow: none;
background: linear-gradient(-135deg, #94BC39, #487B36);
color: #fff !important;
padding: 1rem 1.85rem;
}
.profie_edit {
}
.profie_edit .card-body input {
display: none;
}
.card-header a h4 {
color: #333
}
/*Vishal Code*/
.switchToggle input[type=checkbox] {
height: 0;
width: 0;
visibility: hidden;
position: absolute;
}
.switchToggle label {
cursor: pointer;
text-indent: -9999px;
width: 80px;
max-width: 80px;
height: 30px;
background: #d1d1d1;
display: block;
border-radius: 100px;
position: relative;
}
.switchToggle label:after {
content: '';
position: absolute;
top: 2px;
left: 2px;
width: 26px;
height: 26px;
background: #fff;
border-radius: 90px;
transition: 0.3s;
}
.switchToggle input:checked + label, .switchToggle input:checked + input + label {
background: #3e98d3;
}
.switchToggle input + label:before, .switchToggle input + input + label:before {
content: 'No';
position: absolute;
top: 5px;
left: 35px;
width: 26px;
height: 26px;
border-radius: 90px;
transition: 0.3s;
text-indent: 0;
color: #fff;
}
.switchToggle input:checked + label:before, .switchToggle input:checked + input + label:before {
content: 'Yes';
position: absolute;
top: 5px;
left: 10px;
width: 26px;
height: 26px;
border-radius: 90px;
transition: 0.3s;
text-indent: 0;
color: #fff;
}
.switchToggle input:checked + label:after, .switchToggle input:checked + input + label:after {
left: calc(100% - 2px);
transform: translateX(-100%);
}
.switchToggle label:active:after {
width: 60px;
}
.toggle-switchArea {
margin: 10px 0 10px 0;
}
.btn-default {
background: rgba(75,175,185,0.1);
font-size: 0.9em;
}
.dropdown-menu {
font-size: 0.9em;
}
.custom-search input {
background-color: rgb(223,237,241);
background-image: url('../images/search_icon.png');
background-position: 15px center;
background-repeat: no-repeat;
padding-left: 40px !important;
border: none;
padding: 8px 12px;
}
#includedContent {
position: relative;
z-index: 2
}
.hide_show {
position: absolute;
right: 0;
top: 17px;
z-index: 2;
width: 40px;
padding: 5px;
display: none;
}
.hide_show .icon-bar + .icon-bar {
margin-top: 4px;
}
.hide_show .icon-bar {
background-color: rgba(30,155,167,0.8);
height: 3px;
transition: all ease .3s;
float: right;
}
span.icon-bar.top {
width: 56%;
}
span.icon-bar.mid {
width: 84%;
}
span.icon-bar.btm {
width: 32%;
}
.hide_show:hover .icon-bar {
width: 100% !important;
}
.hide_show:hover {
cursor: pointer;
}
.hide_show img {
width: 16px
}
.hide_show.left_shift .mid {
opacity: 0
}
.hide_show.left_shift .top, .hide_show.left_shift .btm {
width: 100%;
background-color: #fff
}
.hide_show.left_shift .top {
transform: rotate(45deg) translateX(34%);
}
.hide_show.left_shift .btm {
transform: rotate(-45deg) translateX(33%);
}
.animate {
transition: .3s ease all;
-webkit-transition: .3s ease all;
-moz-transition: .3s ease all;
-o-transition: .3s ease all;
-ms-transition: .3s ease all;
}
.right-most1 {
padding: 0 2.5rem !important;
}
.d-pay-bill span, .login-first span {
margin-right: 10px !important;
margin-bottom: 10px;
display: inline-block;
}
.d-pay-bill a, .login-first a {
margin-left: 0 !important
}
.or-text {
color: #000;
font-weight: 600;
opacity: 0.8;
position: relative;
text-align: center;
}
.or-text span::after {
background: #e4eded none repeat scroll 0 0;
content: "";
height: 2px;
left: 0;
position: absolute;
top: 50%;
width: 100%;
z-index: -1;
}
.or-text span {
background-color: #e4eded;
border-radius: 100%;
display: inline-block;
font-size: 0.9em;
height: 30px;
line-height: 30px;
text-align: center;
width: 30px;
}
.form-group .card_pay {
background-image: url("../images/cards.png") !important;
background-size: 48px auto !important;
padding-left: 55px !important;
background-repeat: no-repeat !important;
}
.form-group .card_pay.default, .form-group .card_pay.uatp {
background-position: 0 6px;
}
.form-group .card_pay.visa {
background-position: 0 -53px !important;
}
.form-group .card_pay.visa_electron {
background-position: 0 -113px !important;
}
.form-group .card_pay.mastercard {
background-position: 0 -173px !important;
}
.form-group .card_pay.maestro {
background-position: 0 -232px !important;
}
.form-group .card_pay.discover {
background-position: 0 -293px !important;
}
.form-group .card_pay.amex {
background-position: 0 -349px !important;
}
.edit_amount {
display: inline-block;
vertical-align: 6px;
color: #7ca837;
background-color: #fff;
width: 30px;
height: 30px;
border-radius: 100%;
line-height: 30px;
}
span.form-control.bold {
display: inline-block !important;
width: auto !important;
}
.form-group {
position: relative;
}
.check .rounded-circle {
background: #fff;
}
.transaction_code {
border-bottom: 1px dotted rgba(255,255,255,.5);
font-size: 18px;
opacity: .6;
}
.mute {
color: #999
}
.receipt1, .lined-form .receipt1 .form-control.bold {
color: #333
}
.receipt1 h5 {
font-size: .9em;
opacity: .6;
letter-spacing: 1px;
}
.form-group .chosen-container-single .chosen-single {
padding: 0.575rem 0.85rem;
min-height: 45px;
border: 1px solid #CCC;
background: #fff !important
}
.radio_container {
display: inline-block;
position: relative;
padding-left: 30px;
margin-bottom: 12px;
cursor: pointer;
font-size: 22px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
margin-right: 20px
}
/* Hide the browser's default radio button */
.radio_container input {
position: absolute;
opacity: 0;
cursor: pointer;
}
.radio_container span {
vertical-align: -4px;
color: #333;
font-weight: 400;
text-transform: capitalize !important;
font-size: 13px;
}
/* Create a custom radio button */
.radio_container .checkmark {
position: absolute;
top: 0;
left: 0;
height: 20px;
width: 20px;
background-color: #eee;
border-radius: 50%;
border: 1px solid #989898;
}
/* On mouse-over, add a grey background color */
.radio_container:hover input ~ .checkmark {
background-color: #ccc;
}
/* When the radio button is checked, add a blue background */
.radio_container input:checked ~ .checkmark {
background-color: #0968ac;
}
/* Create the indicator (the dot/circle - hidden when not checked) */
.radio_container .checkmark:after {
content: "";
position: absolute;
display: none;
}
/* Show the indicator (dot/circle) when checked */
.radio_container input:checked ~ .checkmark:after {
display: block;
}
/* Style the indicator (dot/circle) */
.radio_container .checkmark:after {
top: 4px;
left: 4px;
width: 9px;
height: 9px;
border-radius: 50%;
background: white;
}
.checkbox_container {
display: block;
position: relative;
padding-left: 30px;
margin-bottom: 12px;
cursor: pointer;
font-size: 22px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
/* Hide the browser's default checkbox */
.checkbox_container input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.checkbox_container span {
vertical-align: -4px;
color: #333;
font-weight: 400;
text-transform: none !important;
font-size: 13px;
}
/* Create a custom checkbox */
.checkbox_container .checkmark {
position: absolute;
top: 0;
left: 0;
height: 20px;
width: 20px;
background-color: #eee;
border: 1px solid #989898;
}
/* On mouse-over, add a grey background color */
.checkbox_container:hover input ~ .checkmark {
background-color: #ccc;
}
/* When the checkbox is checked, add a blue background */
.checkbox_container input:checked ~ .checkmark {
background-color: #0968ac;
}
/* Create the checkmark/indicator (hidden when not checked) */
.checkbox_container .checkmark:after {
content: "";
position: absolute;
display: none;
}
/* Show the checkmark when checked */
.checkbox_container input:checked ~ .checkmark:after {
display: block;
}
/* Style the checkmark/indicator */
.checkbox_container .checkmark:after {
left: 7px;
top: 2px;
width: 5px;
height: 10px;
border: solid white;
border-width: 0 3px 3px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.where_find {
background-color: #f1f1f1;
width: 15px;
height: 15px;
display: inline-block;
text-align: center;
line-height: 18px;
position: relative;
z-index: 1
}
.where_find img {
position: absolute;
width: 190px;
height: auto;
border: 1px solid #eee;
display: none;
}
.where_find:hover img {
display: block;
}
.vertical_divider {
min-height: 400px;
background-color: #ddd;
width: 1px;
position: relative;
}
.vertical_divider span {
position: absolute;
top: 50%;
left: 50%;
margin: -15px 0 0 -15px;
width: 30px;
height: 30px;
line-height: 30px;
display: inline-block;
text-align: center;
background: #f1f1f1;
color: #333;
border: 1px solid #ddd;
font-size: 13px
}
.online_payment_option .pay-method {
border: 1px solid #DDD;
padding: 20px;
border-radius: 4px;
}
.neg-mar {
margin: -50px -50px 0;
border-bottom: 1px solid #DDD;
}
.w-40 {
width: 40%;
}
.w-60 {
width: 60%;
}
#v-pills-tab .nav-link {
border-bottom: 1px solid #DDD;
padding: 20px 15px;
text-transform: none;
border-radius: 0;
font-size: 0.8em;
}
#v-pills-tab .nav-link.active {
background: linear-gradient(-135deg, #1ea8aa, #1c689a);
/*color: #000;*/ color: #FFF;
border-left-color: #1D799E;
position: relative;
}
#v-pills-tab .nav-link.active span.m-hide {
font-size: 15px;
}
.arrow-left {
width: 0;
height: 0;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-right: 10px solid blue;
}
#v-pills-tab .nav-link.active::before {
content: "";
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
border-left: 18px solid #1EA2A9;
margin-top: -15px;
position: absolute;
right: -15px;
top: 50%;
color: #1EA2A9;
}
.grey-bg {
background: #F0F4F7;
}
.neg-mar-2 {
margin-left: -35px;
margin-bottom: -50px;
}
.form-height {
min-height: 410px;
}
.merchant-note {
position: absolute;
top: 25%;
padding: 50px 0; width:70%;
left:50%; margin-left:-35%;
}
.very-sml {
font-size: 0.7em;
color: #777;
letter-spacing: 1px;
}
li[data_txt="isDisabled"], li[data_txt="isDisabled"] a {
cursor: not-allowed;
text-decoration: none;
}
.active.cursor_default, .active.cursor_default a, #progressbar li.active.cursor_default:before {
cursor: context-menu !important;
}
.right table.table-borderless td {
border: none;
}
.lined-form .form-control.borderless {
border: none !important;
}
.dropdown.open .dropdown-menu {
display: block;
}
.table-striped tbody tr:nth-of-type(odd) {
background-color: white;
}
.right table td:first-child, .right table th:first-child {
white-space: normal;
}
.btn-default {
color: black;
}
.widthauto {
width: auto;
}
.field-validation-error {
color: red;
font-size: 13px;
margin-bottom: 0px;
}
.error-success {
color: forestgreen;
}
.modal-backdrop1 {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1050;
background-color: #000000;
opacity: 0.3;
filter: alpha(opacity=30);
}
.modal1 {
position: fixed;
top: 50%;
left: 50%;
z-index: 1050;
overflow: auto;
margin: -125px 0 0 -125px;
border: 1px solid #fff;
background: #fff !important;
padding: 20px;
/*border: 1px solid #ccc;*/
width: 260px;
border-radius: 342px;
}
.dataTables_filter label {
text-indent: -9999px;
}
.dataTables_filter input {
display: block;
position: absolute;
top: -43px;
background-color: rgb(223,237,241);
background-image: url('../images/search_icon.png');
background-position: 15px center;
background-repeat: no-repeat;
padding-left: 40px !important;
border: none;
padding: 0.575rem 0.85rem;
right: 18px;
border-radius: 4px;
}
.dataTables_length {
display: none;
}
.dropdown .btn-default {
font-size: 0.8em;
}
.UserLogin {
font-size: 0.8em;
text-transform: uppercase;
}
.varification {
position: absolute;
z-index: 9;
width: 831px;
top: -60px;
}
.varificaiton__overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0,0,0,0.7);
}
.varificaiton__content {
position: relative;
z-index: 999;
background: #FFF;
padding: 50px;
margin: 0 auto;
width: 60%;
border-radius: 4px;
}
.varification .forgot {
width: 538px;
margin-top: 100px;
}
.varification.forgot {
width: 100%;
}
.varification {
width: 100%;
left: 0;
top: 80px;
}
.link {
font-size: 0.8em;
}
.payment-option123 label {
color: #333;
font-size: 18px;
align-items: center;
}
.payment-option123 .btn {
background: linear-gradient(-135deg, #1ea8aa, #1c689a) !important;
color: #fff !important;
border-radius: 0 25px 25px 0;
padding: 6px 23px;
}
.lined-form .payment-option123 .form-control, .lined-form .payment-option123 .form-control:hover, .lined-form .payment-option123 .form-control:focus {
border: 1px solid #DDD;
background: #F5F5F5;
padding: 6px 10px;
border-radius: 25px 0 0 25px;
}
.payment-option123 .acc_del {
position: absolute;
right: 0;
top: 12px
}
#v-pills-credit .v-sml-btn {
border-color: #AAA;
padding: 9px 21px;
}
#v-pills-bank .v-sml-btn {
border-color: #AAA;
padding: 9px 21px;
}
.br25 {
border-radius: 25px !important;
}
.datepicker {
padding: 0.575rem 0.85rem !important;
}
.pagination li.active a {
background: #1C759D !important;
}
.filter_area .btn {
padding: .575rem .75rem !important;
}
.filter_area .btn-info {
background: #1C759D;
color: #fff !important;
}
/*New Account detail */
.ac__card {
background: #FFF;
box-shadow: 0 2px 4px rgba(0,0,0,0.2);
border-radius: 4px;
padding: 50px 20px;
text-align: center;
position: relative;
transition: 0.3s all;
margin-bottom: 30px;
}
.ac__card span {
font-size: 0.7em;
letter-spacing: 1px;
opacity: 0.6;
text-transform: uppercase;
}
.ac__card h4 {
font-size: 1.2em;
}
.ac__card:hover {
box-shadow: 0 8px 16px rgba(0,0,0,0.2);
background: linear-gradient(-135deg, #1ea8aa, #1c689a);
color: #FFF;
}
.ac__card .v-sml-btn {
font-size: 9px;
padding: 5px 8px;
letter-spacing: 1px;
background: #FFF;
border: 1px solid #1D96A6;
color: #1D96A6;
}
.ac__card-2 .v-sml-btn {
font-size: 9px;
padding: 5px 8px;
letter-spacing: 1px;
}
.ac__card-2 {
background: #FFF;
box-shadow: 0 2px 4px rgba(0,0,0,0.2);
border-radius: 4px;
padding: 50px 20px;
text-align: center;
position: relative;
transition: 0.3s all;
margin-bottom: 30px;
}
.ac__card-2 span {
font-size: 0.7em;
letter-spacing: 1px;
opacity: 0.6;
text-transform: uppercase;
}
.ac__card-2 h4 {
font-size: 1.2em;
}
.ac__card-2:hover {
box-shadow: 0 8px 16px rgba(0,0,0,0.2);
}
.ac__card1 {
background: #FFF;
border-radius: 4px;
padding: 2rem !important;
text-align: center;
position: relative;
transition: 0.3s all;
margin-bottom: 5px;
box-shadow: 0 15px 25px rgba(0, 0, 0, 0.05); /*box-shadow:0 0px 10px rgba(115, 136, 160, 0.1);*/
}
/*.ac__card1:hover{box-shadow: 0 7px 7px rgba(115, 136, 160, 0.2);}*/
.ac__card1 .btn-login {
font-size: 0.8em;
}
.ac__card1 span {
font-size: 0.9em
}
.ac__card1 .progress {
min-width: 100px;
}
.ac__card1 .progress-bar {
background: #1e9ba7;
}
.ac__card1 h4 {
font-size: 1em;
margin-bottom: 0
}
.view_stmt, .view_acc {
background-color: #1EA8AA;
color: #fff;
background-image: linear-gradient(-135deg, #1EA8AA, #1C689A);
border: none;
}
.view_acc:hover, .view_stmt:hover {
border: 1px solid #ddd;
color: #666;
}
.ac__card1 .list-inline {
margin-bottom: 0
}
.ac__card1 .list-inline-item {
margin-right: 1rem;
padding-right: 1rem;
border-right: 1px solid #ddd
}
.ac__card1 .list-inline-item:last-child {
margin-right: 0;
padding-right: 0;
border-right: none
}
/*--------------------*/
#diverror {
display: none;
}
.alert {
display: block !important;
}
/*
.payment-option123 .acc_del a{ color:#ccc}
.payment-option123 .acc_del a:hover {
color: #999
}
*/
.filter_area form {
width: 100%;
display: flex;
flex-direction: row;
white-space: nowrap;
align-items: center;
}
.filter_area .dropdown {
display: inline-flex;
width: auto;
margin-left: 10px;
}
.acc_del a {
color: #333
}
.paybill-top .big-text {
display: inline-block;
vertical-align: middle
}
.table td, .table th {
vertical-align: middle
}
.recent_payment_histry {
padding: 20px 30px;
}
.form-control:focus {
background-color: none !important
}
.modal-open .modal {
background: rgba(0,0,0,.5);
}
.modal.fade .v_middle {
transform: translateY(50%) !important;
-webkit-transform: translateY(50%) !important;
-moz-transform: translateY(50%) !important;
-o-transform: translateY(50%) !important;
-ms-transform: translateY(50%) !important;
}
.mobilepaysuccess {
position: fixed;
right: 50px;
bottom: 30px;
background: #86c724;
color: #FFF;
padding: 20px;
border-radius: 4px;
}
input[type=number]::-webkit-inner-spin-button,
input[type='number'] {
-moz-appearance: textfield;
-webkit-appearance: textfield;
}
.cardCodeNumber {
-webkit-text-security: disc;
-moz-text-security: disc;
}
.button-google-pay {
min-width: 200px;
min-height: 40px;
padding: 11px 24px;
margin: 10px auto;
background-color: #000;
background-image: url(data:image/svg+xml,%3Csvg%20width%3D%22103%22%20height%3D%2217%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20d%3D%22M.148%202.976h3.766c.532%200%201.024.117%201.477.35.453.233.814.555%201.085.966.27.41.406.863.406%201.358%200%20.495-.124.924-.371%201.288s-.572.64-.973.826v.084c.504.177.912.471%201.225.882.313.41.469.891.469%201.442a2.6%202.6%200%200%201-.427%201.47c-.285.43-.667.763-1.148%201.001A3.5%203.5%200%200%201%204.082%2013H.148V2.976zm3.696%204.2c.448%200%20.81-.14%201.085-.42.275-.28.413-.602.413-.966s-.133-.684-.399-.959c-.266-.275-.614-.413-1.043-.413H1.716v2.758h2.128zm.238%204.368c.476%200%20.856-.15%201.141-.448.285-.299.427-.644.427-1.036%200-.401-.147-.749-.441-1.043-.294-.294-.688-.441-1.183-.441h-2.31v2.968h2.366zm5.379.903c-.453-.518-.679-1.239-.679-2.163V5.86h1.54v4.214c0%20.579.138%201.013.413%201.302.275.29.637.434%201.085.434.364%200%20.686-.096.966-.287.28-.191.495-.446.644-.763a2.37%202.37%200%200%200%20.224-1.022V5.86h1.54V13h-1.456v-.924h-.084c-.196.336-.5.611-.91.826-.41.215-.845.322-1.302.322-.868%200-1.528-.259-1.981-.777zm9.859.161L16.352%205.86h1.722l2.016%204.858h.056l1.96-4.858H23.8l-4.41%2010.164h-1.624l1.554-3.416zm8.266-6.748h1.666l1.442%205.11h.056l1.61-5.11h1.582l1.596%205.11h.056l1.442-5.11h1.638L36.392%2013h-1.624L33.13%207.876h-.042L31.464%2013h-1.596l-2.282-7.14zm12.379-1.337a1%201%200%200%201-.301-.735%201%201%200%200%201%20.301-.735%201%201%200%200%201%20.735-.301%201%201%200%200%201%20.735.301%201%201%200%200%201%20.301.735%201%201%200%200%201-.301.735%201%201%200%200%201-.735.301%201%201%200%200%201-.735-.301zM39.93%205.86h1.54V13h-1.54V5.86zm5.568%207.098a1.967%201.967%200%200%201-.686-.406c-.401-.401-.602-.947-.602-1.638V7.218h-1.246V5.86h1.246V3.844h1.54V5.86h1.736v1.358H45.75v3.36c0%20.383.075.653.224.812.14.187.383.28.728.28.159%200%20.299-.021.42-.063.121-.042.252-.11.392-.203v1.498c-.308.14-.681.21-1.12.21-.317%200-.616-.051-.896-.154zm3.678-9.982h1.54v2.73l-.07%201.092h.07c.205-.336.511-.614.917-.833.406-.22.842-.329%201.309-.329.868%200%201.53.254%201.988.763.457.509.686%201.202.686%202.079V13h-1.54V8.688c0-.541-.142-.947-.427-1.218-.285-.27-.656-.406-1.113-.406-.345%200-.656.098-.931.294a2.042%202.042%200%200%200-.651.777%202.297%202.297%200%200%200-.238%201.029V13h-1.54V2.976zm32.35-.341v4.083h2.518c.6%200%201.096-.202%201.488-.605.403-.402.605-.882.605-1.437%200-.544-.202-1.018-.605-1.422-.392-.413-.888-.62-1.488-.62h-2.518zm0%205.52v4.736h-1.504V1.198h3.99c1.013%200%201.873.337%202.582%201.012.72.675%201.08%201.497%201.08%202.466%200%20.991-.36%201.819-1.08%202.482-.697.665-1.559.996-2.583.996h-2.485v.001zm7.668%202.287c0%20.392.166.718.499.98.332.26.722.391%201.168.391.633%200%201.196-.234%201.692-.701.497-.469.744-1.019.744-1.65-.469-.37-1.123-.555-1.962-.555-.61%200-1.12.148-1.528.442-.409.294-.613.657-.613%201.093m1.946-5.815c1.112%200%201.989.297%202.633.89.642.594.964%201.408.964%202.442v4.932h-1.439v-1.11h-.065c-.622.914-1.45%201.372-2.486%201.372-.882%200-1.621-.262-2.215-.784-.594-.523-.891-1.176-.891-1.96%200-.828.313-1.486.94-1.976s1.463-.735%202.51-.735c.892%200%201.629.163%202.206.49v-.344c0-.522-.207-.966-.621-1.33a2.132%202.132%200%200%200-1.455-.547c-.84%200-1.504.353-1.995%201.062l-1.324-.834c.73-1.045%201.81-1.568%203.238-1.568m11.853.262l-5.02%2011.53H96.42l1.864-4.034-3.302-7.496h1.635l2.387%205.749h.032l2.322-5.75z%22%20fill%3D%22%23FFF%22%2F%3E%3Cpath%20d%3D%22M75.448%207.134c0-.473-.04-.93-.116-1.366h-6.344v2.588h3.634a3.11%203.11%200%200%201-1.344%202.042v1.68h2.169c1.27-1.17%202.001-2.9%202.001-4.944%22%20fill%3D%22%234285F4%22%2F%3E%3Cpath%20d%3D%22M68.988%2013.7c1.816%200%203.344-.595%204.459-1.621l-2.169-1.681c-.603.406-1.38.643-2.29.643-1.754%200-3.244-1.182-3.776-2.774h-2.234v1.731a6.728%206.728%200%200%200%206.01%203.703%22%20fill%3D%22%2334A853%22%2F%3E%3Cpath%20d%3D%22M65.212%208.267a4.034%204.034%200%200%201%200-2.572V3.964h-2.234a6.678%206.678%200%200%200-.717%203.017c0%201.085.26%202.11.717%203.017l2.234-1.731z%22%20fill%3D%22%23FABB05%22%2F%3E%3Cpath%20d%3D%22M68.988%202.921c.992%200%201.88.34%202.58%201.008v.001l1.92-1.918c-1.165-1.084-2.685-1.75-4.5-1.75a6.728%206.728%200%200%200-6.01%203.702l2.234%201.731c.532-1.592%202.022-2.774%203.776-2.774%22%20fill%3D%22%23E94235%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E);
background-origin: content-box;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
border: 0;
border-radius: 4px;
box-shadow: 0 1px 1px 0 rgba(60, 64, 67, 0.30), 0 1px 3px 1px rgba(60, 64, 67, 0.15);
outline: 0;
cursor: pointer;
display: block;
}
.merchant-note #paypal-button-container {
z-index: 1 !important;
position: relative;
}
#applePayButton {
min-width: 200px;
min-height: 40px;
/*padding: 11px 24px;*/
margin: 10px auto;
background-color: #000;
background-origin: content-box;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
border: 0;
border-radius: 4px;
box-shadow: 0 1px 1px 0 rgba(60, 64, 67, 0.30), 0 1px 3px 1px rgba(60, 64, 67, 0.15);
outline: 0;
cursor: pointer;
display: block;
background-image: url("~/Content/images/ApplePayLogo.png")
}
.label-transparent,
.badge-transparent {
background-color: transparent !important
}
.label-grey,
.badge-grey {
background-color: #a0a0a0 !important
}
.label-info,
.badge-info {
background-color: #3a87ad !important
}
.label-primary,
.badge-primary {
background-color: #2283c5 !important
}
.label-success,
.badge-success {
background-color: #82af6f !important
}
.label-important,
.badge-important {
background-color: #d15b47 !important
}
.label-inverse,
.badge-inverse {
background-color: #333 !important
}
.label-warning,
.badge-warning {
background-color: #f89406 !important
}
.label-pink,
.badge-pink {
background-color: #d6487e !important
}
.label-purple,
.badge-purple {
background-color: #9585bf !important
}
.label-yellow,
.badge-yellow {
background-color: #fee188 !important
}
.label-light,
.badge-light {
background-color: #e7e7e7 !important
}
.badge-yellow,
.label-yellow {
color: #963 !important;
border-color: #fee188
}
.badge-light,
.label-light {
color: #888 !important
}
.label.arrowed,
.label.arrowed-in {
position: relative;
margin-left: 9px
}
.label.arrowed:before,
.label.arrowed-in:before {
display: inline-block;
content: "";
position: absolute;
left: -14px;
top: 0;
border: 9px solid transparent;
border-width: 9px 7px;
border-right-color: #abbac3
}
.label.arrowed-in:before {
border-color: #abbac3;
border-left-color: transparent !important;
left: -9px
}
.label.arrowed-right,
.label.arrowed-in-right {
position: relative;
margin-right: 9px
}
.label.arrowed-right:after,
.label.arrowed-in-right:after {
display: inline-block;
content: "";
position: absolute;
right: -14px;
top: 0;
border: 9px solid transparent;
border-width: 9px 7px;
border-left-color: #abbac3
}
.label.arrowed-in-right:after {
border-color: #abbac3;
border-right-color: transparent !important;
right: -9px
}
.label-info.arrowed:before {
border-right-color: #3a87ad
}
.label-info.arrowed-in:before {
border-color: #3a87ad
}
.label-info.arrowed-right:after {
border-left-color: #3a87ad
}
.label-info.arrowed-in-right:after {
border-color: #3a87ad
}
.label-primary.arrowed:before {
border-right-color: #2283c5
}
.label-primary.arrowed-in:before {
border-color: #2283c5
}
.label-primary.arrowed-right:after {
border-left-color: #2283c5
}
.label-primary.arrowed-in-right:after {
border-color: #2283c5
}
.label-success.arrowed:before {
border-right-color: #82af6f
}
.label-success.arrowed-in:before {
border-color: #82af6f
}
.label-success.arrowed-right:after {
border-left-color: #82af6f
}
.label-success.arrowed-in-right:after {
border-color: #82af6f
}
.label-warning.arrowed:before {
border-right-color: #f89406
}
.label-warning.arrowed-in:before {
border-color: #f89406
}
.label-warning.arrowed-right:after {
border-left-color: #f89406
}
.label-warning.arrowed-in-right:after {
border-color: #f89406
}
.label-important.arrowed:before {
border-right-color: #d15b47
}
.label-important.arrowed-in:before {
border-color: #d15b47
}
.label-important.arrowed-right:after {
border-left-color: #d15b47
}
.label-important.arrowed-in-right:after {
border-color: #d15b47
}
.label-inverse.arrowed:before {
border-right-color: #333
}
.label-inverse.arrowed-in:before {
border-color: #333
}
.label-inverse.arrowed-right:after {
border-left-color: #333
}
.label-inverse.arrowed-in-right:after {
border-color: #333
}
.label-pink.arrowed:before {
border-right-color: #d6487e
}
.label-pink.arrowed-in:before {
border-color: #d6487e
}
.label-pink.arrowed-right:after {
border-left-color: #d6487e
}
.label-pink.arrowed-in-right:after {
border-color: #d6487e
}
.label-purple.arrowed:before {
border-right-color: #9585bf
}
.label-purple.arrowed-in:before {
border-color: #9585bf
}
.label-purple.arrowed-right:after {
border-left-color: #9585bf
}
.label-purple.arrowed-in-right:after {
border-color: #9585bf
}
.label-yellow.arrowed:before {
border-right-color: #fee188
}
.label-yellow.arrowed-in:before {
border-color: #fee188
}
.label-yellow.arrowed-right:after {
border-left-color: #fee188
}
.label-yellow.arrowed-in-right:after {
border-color: #fee188
}
.label-light.arrowed:before {
border-right-color: #e7e7e7
}
.label-light.arrowed-in:before {
border-color: #e7e7e7
}
.label-light.arrowed-right:after {
border-left-color: #e7e7e7
}
.label-light.arrowed-in-right:after {
border-color: #e7e7e7
}
.label-grey.arrowed:before {
border-right-color: #a0a0a0
}
.label-grey.arrowed-in:before {
border-color: #a0a0a0
}
.label-grey.arrowed-right:after {
border-left-color: #a0a0a0
}
.label-grey.arrowed-in-right:after {
border-color: #a0a0a0
}
.label-large {
font-size: 13px;
padding: 3px 8px 4px
}
.label-large.arrowed,
.label-large.arrowed-in {
margin-left: 12px
}
.label-large.arrowed:before,
.label-large.arrowed-in:before {
left: -16px;
border-width: 11px 8px
}
.label-large.arrowed-in:before {
left: -12px
}
.label-large.arrowed-right,
.label-large.arrowed-in-right {
margin-right: 11px
}
.label-large.arrowed-right:after,
.label-large.arrowed-in-right:after {
right: -16px;
border-width: 11px 8px
}
.label-large.arrowed-in-right:after {
right: -12px
}
.more-details {
position: absolute;
transform: translate(-50%, -50%);
left: 50%;
bottom: -35px;
}
.more-details a {
background-color: #FFF;
box-shadow: 0 2px 4px rgba(0,0,0,0.2);
padding: 8px 26px;
border-radius: 25px;
display: inline-block;
text-align: center;
color: #000;
border: 1px solid #DDD;
}
.table-bill {
width: 100%;
background-color: #FFF;
}
.table-bill th {
background: #FFF;
color: #000;
border-color: #CCC;
box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.table-bill .highlighted td {
background-color: #F0F4F7;
}
.table-bill th:last-child, .table-bill td:last-child {
text-align: right;
}
.table-summary {
border: none;
text-align: right;
font-size: 1.2em;
margin-top: 10px;
}
.table-summary td {
border-top: none;
border-bottom: 1px solid #DDD;
}
.infobox h5 {
text-transform: uppercase;
letter-spacing: 1px;
margin-bottom: 20px;
font-size: 16px;
}
.viewbtn {
display: inline-block;
color: rgba(30,155,167,1);
text-transform: uppercase;
border-bottom: 2px solid;
font-size: 0.8em;
font-weight: 600;
padding-bottom: 3px;
}
.viewbtn i {
margin-right: 5px;
}
.fix_right {
position: fixed;
right: -7%;
transform: rotate(90deg);
background: black;
color: #FFF;
border-radius: 0;
top: 50%;
}
#pills-tab {
justify-content: center;
}
.tab-link {
padding: 0.5em 1em;
display: inline-block;
text-align: center;
border: 2px solid #DDD;
min-width: 150px;
color: #000;
}
.tab-link:hover, .tab-link.active {
background-color: #DDD;
color: #000;
}
.tab-link:hover {
opacity: 0.8;
}
.info {
height: 25px;
width: 25px;
background-color: rgba(30,155,167,0.5);
color: #FFF;
border-radius: 100%;
display: inline-block;
text-align: center;
line-height: 25px !important;
cursor: help;
}
.pr{
position:relative;
}
.infobox ul li {
margin-bottom: 5px;
}
.label {
border-radius: 0;
text-shadow: none;
font-size: 14px;
font-weight: normal;
padding: 1px 16px 1px;
color: #FFF;
background-color: #abbac3 !important
}
.infobox {
background-color: #FFF;
border-radius: 4px;
padding: 25px;
margin-top: 30px;
}
.subhead {
color: #777;
font-size: 16px;
margin-top: 5px;
display: block;
}
.infobox {
position: relative;
box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}
.infobox h2 {
font-size: 26px;
}
.infobox ul {
margin: 0;
padding: 0;
list-style: none;
margin-top: 30px;
}
.user-name span {
color: #000;
text-transform: uppercase;
font-weight: bold;
}
.label[class*="span"][class*="arrow"] {
min-height: 0
}
.badge {
text-shadow: none;
font-size: 12px;
padding: 1px 15px;
font-weight: normal;
color: #FFF;
line-height: 15px;
background-color: #ABBAC3 !important;
}
/*New Css*/
.more-details.more-details_top{ position: relative !important; transform: translate(0,0); left: 0; bottom: auto !important; text-align: center !important; margin-bottom: 20px}
.showmore{ position: relative; z-index: 1 }
.more-details.more-details_top:after{ content: ''; position: absolute; left: 0; top: 20px; width: 100%; height: 1px; background:#DDD }
.btn-sm{ padding: 0.375rem 1.5rem !important; font-size: 1em;}
.table-responsive{width: 100%; overflow-x: auto; }
.table-responsive .table-bordered {border: 1px solid #dee2e6 !important; }
.more-details a{ min-width: 180px }
/******/
.pay-btn1:hover, .pay-btn2:hover, .pay-btn3:hover, .pay-btn4:hover
{
background-color: #246d9d;
color: #fff;
}
.pay-btn1 {
background: #ffffff;
color: #246d9d;
padding: 13px 53px;
border: 1px solid #246d9d;
font-weight: 600;
}
.pay-btn2
{
background: #000;
color: #fff;
padding: 13px 53px;
border: 1px solid #cecbcb;
font-weight: 600;
}
.pay-btn3
{
background: #a5a1a1;
color: #fff;
padding: 13px 53px;
border: 1px solid #cecbcb;
font-weight: 600;
}
.pay-btn4
{
background: #791515;
color: #fff;
padding: 13px 53px;
border: 1px solid #cecbcb;
font-weight: 600;
}
.pym-noti .checkbox_container .checkmark {
position: absolute;
top: 3px;
left: 0;
height: 15px;
width: 15px;
}
.pym-noti .checkbox_container .checkmark:after {
left: 4px;
top: 0px;
}
.pym-noti .checkbox_container
{
padding-left: 25px;
}
.progressbar2 li
{
width: 24.33% !important;
}
.btn-dark2 {
background-color: #6d6b6c;
padding: 0.575rem 2.85rem;
border: none;
border-radius: 4px;
font-weight: 500;
color: #FFF !important;
}
.text-black
{
color: #000 !important;
}
.pym-noti input.em-int
{
width: 100%;
height: 36px;
font-size: 14px;
padding: 11px;
border-radius: 6px;
margin-top: 11px
}