/*
Theme Name: Beaver Builder Child Theme
Theme URI: http://www.wpbeaverbuilder.com
Version: 1.0
Description: An example child theme that can be used as a starting point for custom development.
Author: The Beaver Builder Team
Author URI: http://www.fastlinemedia.com
template: bb-theme
*/

/* Add your custom styles here... */

/* ######## Edit for custom styles ######### */

/* ### primary ### */

.primary-colour .fl-row-content-wrap {
	background-color: rgba(0, 0, 0, 0.8);
}

.primary-colour p, .primary-colour h2, .primary-colour label {
	color: #ffffff;
}
#menu-main_menu, #menu-main_menu li a > span, #menu-main_menu .sub-menu li a, #menu-main_menu .sub-menu li a > span, .header-top-bar, #menu-main_menu .uabb-menu-toggle, #main-nav .uabb-creative-menu-mobile-toggle {
	background-color: #000000;
	color: #ffffff;
}
#menu-main_menu li a:hover, #menu-main_menu .sub-menu li a:hover, #menu-main_menu li a:hover > span, #menu-main_menu .sub-menu li a:hover > span, #menu-main_menu .uabb-has-submenu-container:hover .uabb-menu-toggle {
        background-color: #F53435;
	color: #ffffff;
}

#menu-main_menu .current-menu-item a, #menu-main_menu .current-menu-item a > span, #menu-main_menu .current-menu-item .uabb-menu-toggle {
        background-color: #F53435;
	color: #ffffff;
}

/* ### Secondary colour ### */

.secondary-colour, #menu-quick_links, #menu-quick_links li a > span, #menu-quick_links .sub-menu li a, #menu-quick_links .sub-menu li a > span, #menu-quick_links .uabb-menu-toggle, #quick-links .uabb-creative-menu-mobile-toggle {
	background-color: #F53435;
	font-weight: 400;
	color: #ffffff;
}
#menu-quick_links li a:hover, #menu-quick_links li a:hover > span, #menu-quick_links .sub-menu li a:hover, #menu-quick_links .sub-menu li a:hover > span, #menu-quick_links .uabb-has-submenu-container:hover .uabb-menu-toggle {
        background-color: #ffffff;
	font-weight: 400;
	color: #000000;
}

#menu-quick_links .current-menu-item a, #menu-quick_links .current-menu-item a > span, #menu-quick_links .sub-menu .current-menu-item a, #menu-quick_links .sub-menu .current-menu-item a > span, #menu-quick_links .current-menu-item .uabb-menu-toggle {
        background-color: #ffffff;
	font-weight: 400;
	color: #000000;
}

/* ######## End Custom styles ######## */

#login-page {
	background-image: url("/wp-content/uploads/2018/10/Car-Background-black-and-white.jpg");
	background-position: center;
	background-size: cover;
}
#header-title {
	background-image: url("/wp-content/uploads/2018/10/Car-Background-black-and-white.jpg");
	background-position: center;
	background-size: cover;	
}
.primary-colour .fl-row-content-wrap:after {
    	display: block;
    	position: absolute;
	    top: 0;
    	right: 0;
    	bottom: 0;
    	left: 0;
		z-index: 1;
    }
.primary-colour-header .fl-row-content {
    	position: relative;
    	z-index: 3;
    }
.secondary-colour .fl-row-content-wrap:after {
    	content: '';
    	display: block;
    	position: absolute;
	    top: 0;
    	right: 0;
    	bottom: 0;
    	left: 0;
    	z-index: 0;
    }
.secondary-colour .fl-row-content {
    	position: relative;
    	z-index: 1;
    }
.loading-animation {
  color: #B2B2B2;
  font-size: 45px;
  text-indent: -9999em;
  overflow: hidden;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  margin: 72px auto;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load6 1.7s infinite ease, round 1.7s infinite ease;
  animation: load6 1.7s infinite ease, round 1.7s infinite ease;
}
.document-card {
  background-color: #ffffff;
  border-radius: 3px;
  width: 100%;
  margin: 20px 0px;
  box-shadow: 0 0px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  padding: 10px 20px;
  text-align: center;
}
.document-card.row div[class^="col-"], .document-card div[class*=" col-"] {
  margin: 15px 0!important;
}
.document-card h5{
  margin-top: 0px!important;
}
.document-card hr{
  margin:20px 10px!important;
}
.document-card a:hover{
  text-decoration: none;
}
.document-input {
  height: 34px;
  display: inline-block!important;
  width: 100%;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.428571429;
  color: #54595f;
  vertical-align: middle;
  background-color: #f2f2f2!important;
  background-image: none;
  border: 1px solid #dcdcdc;
  transition: all ease-in-out .15s;
  border-radius: 4px
}
.doc-btn{
  margin-top: 8px!important;
}
@-webkit-keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}
@keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}
@-webkit-keyframes round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
/* login form style */

.um-field-label {
 color: #ffffff;
 font-size: 20px;
 text-align: left;
	font-family: source-sans-pro;
	font-weight: 200;
}

.um-field.um-field-username.um-field-text.um-field-type_text:nth-child(1) > .um-field-label:nth-child(1) > label:nth-child(1) {
 font-size: 18px;
 letter-spacing: 1px;
 font-weight: 400;
 font-style: normal;
 text-align: center;
 color: #ffffff;
}

.um-field.um-field-user_password.um-field-password.um-field-type_password:nth-child(2) > .um-field-label:nth-child(1) > label:nth-child(1) {
 font-size: 18px;
 letter-spacing: 1px;
 font-weight: 400;
 font-style: normal;
 color: #ffffff;
}
.um-icon-help-circled {
 opacity: 1;
 color: rgb(172, 172, 172);
 background-blend-mode: normal;
 background-color: transparent;
 height: 22px;
 position: relative;
 top: -1.063px;
 font-size: 22px;
}

.um-field-checkbox-option {
 color: rgb(255, 255, 255);
 font-size: 16px;
 letter-spacing: 1px;
 font-weight: 400;
 font-style: normal;
}

.main-menu {
	border: 0px;
	text-decoration: none;
}

.um-icon-android-checkbox-outline {
 color: rgb(255, 255, 255);
}
.um-center {
 opacity: 1;
 background-blend-mode: normal;
 background-color: transparent;
 border: 0px none rgb(0, 0, 0);
 color: rgb(102, 102, 102);
}

.um-col-1 {
 text-align: center;
}

#username-4 {
 background-blend-mode: normal;
 background-color: #f2f2f2;
}

#user_password-4 {
 background-blend-mode: normal;
 background-color: #f2f2f2;
}

.um .um-field-checkbox.active:not(.um-field-radio-state-disabled) i {
	color: #f2f2f2;
}

.um-avatar-default, .um-avatar-uploaded {
	height: 30px;
	width: 30px;
	margin-top: -25px;
	margin-bottom: -20px;
	margin-left: 5px;
	padding: 0px;
	border-radius: 20px
}
.landing-login {
    z-index: 4;
}
#main-login .um-button:hover,
.um a.um-button:hover {
    background-color: #ffffff!important;
	color: #000000;
}

#main-login .um-button,
.um a.um-button {
	background-color: transparent!important;
	border: 1px solid #ffffff!important;
	border-radius: 0px!important;
	color: #ffffff;
}

#main-login .um-link-alt {
 color: #ffffff;
	font-family: source-sans-pro;
	font-weight: 300;
}
/* this is for the forum category list. CHANGES NEEDED. Change outline hover colour */

.category-list ul {display: inline-block;
    list-style-type: none;
    margin: 0px;
    width: 100%;
}

.category-list li {font-size: 18px;
    color: #54595f;

}

.category-list li a {
    color: #54595f;
    display:block;
    text-transform: capitalize;
    background-color: #ffffff;
		padding: 5px 10px 40px 10px;
		margin-bottom: 10px;
}

.category-list li a:hover {
    text-decoration: none;
		color: #eb1c2d;
    outline-color: #eb1c2d;
		outline-style: solid;
		outline-width: 2px;

}

/* End of forum category list */

/* this is for the form styling. CHANGES NEEDED. Change focus outline colour */

.input[type="text"], textarea {

  background-color : #ffffff;

}
.input[type="text"], textarea:focus {

  	background-color : #ffffff;
		outline-color: #eb1c2d;
		outline-width: 2px;
		outline-style: solid;

}
.form-control {

		background-color: #ffffff;
}

.form-control:focus {

		background-color: #ffffff;
		outline-color: #eb1c2d;
		outline-width: 2px;
		outline-style: solid;
}
.comment-content {
	background-color: #ffffff;
}
body .gform_wrapper .gform_body .gform_fields .gfield input[type=text] {
	background-color: #ffffff;
}
body .gform_
wrapper .gform_body .gform_fields .gfield input[type=text]:active {
	outline-color: #eb1c2d;
	outline-width: 2px;
	outline-style: solid;
	background-color: white;
}


/* End of form styling */

/* this is for the post/news grid style. CHANGES NEEDED. Change outline hover colour */

.fl-post-grid-post {

		color: #54595f;

  -webkit-backface-visibility: hidden;

          backface-visibility: hidden;

}
input[type=text], input[type=password], input[type=email], input[type=tel], input[type=date], input[type=month], input[type=week], input[type=time], input[type=number], input[type=search], input[type=url], textarea {
background-color: white;
}
input[type=text]:active, input[type=password]:active, input[type=email]:active, input[type=tel]:active, input[type=date]:active, input[type=month]:active, input[type=week]:active, input[type=time]:active, input[type=number]:active, input[type=search]:active, input[type=url]:active, textarea:active {
background-color: white;
}
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=tel]:focus, input[type=date]:focus, input[type=month]:focus, input[type=week]:focus, input[type=time]:focus, input[type=number]:focus, input[type=search]:focus, input[type=url]:focus, textarea:focus {
background-color: #ffffff;
}


.fl-post-grid-post:hover {

    outline-width: 2px;
    outline-style: solid;
    outline-color: #eb2c1d;
}



.fl-post-grid-post a {

		color: #54595f;
}

.fl-post-grid-post a:hover {


  text-decoration: none;
		color: #eb1c2d;

}
.post-card-image-link {

  	overflow: hidden;
		position: relative;
		display: block;

}

.post-card-image {

  	height: 150px;
		background-position: center;
		background-size: cover;

}

.post-card-content {

    display: block;
  	padding: 20px;
		font-size: 14px;
  	background-color: #ffffff;
}

.list .post-card-content {

    display: block;
  	padding: 20px;
		font-size: 14px;
  	background-color: #ffffff;
}
.list .post-card-content:hover {

  	background-color: #ffffff;
		outline-width: 2px;
    outline-style: solid;
    outline-color: #eb2c1d;

}

.post-card-content-fullwidth {

    display: block;
		font-size: 14px;
  	background-color: #ffffff;
}


.post-card-content-fullwidth:hover {

  	background-color: #ffffff;
		outline-width: 2px;
    outline-style: solid;
    outline-color: #eb2c1d;

}


.post-card-content-link {

		display: block;
		color: #54595f;

}
.post-card-content-link:hover {

  	text-decoration: none;
		color: #eb1c2d;

}

.post-card-category {

  display: block;
	margin-bottom: 4px;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	color: #999999;
	font-size: 12px;
	font-weight: 500;
	line-height: 1;

}

.post-card-title {

  margin-top: 0;
	margin-bottom: 10px;
	font-size: 20px;

}

.post-card-title:first-letter {
		text-transform: uppercase;

}

.post-card-title:hover {

  margin-top: 0;
	margin-bottom: 10px;
	font-size: 20px;

}

.post-card-meta {
    margin-bottom: 10px;
}


/* End of post/news grid */


.driver-home-info-panel {
 padding: 20px;
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
 width: 100%;
}

.driver-home-info-panel-button:nth-child(2) > input:nth-child(1) {
 height: 40px;
 width: 90px;
}

.gsurvey-rating:not(:checked) > label, .gsurvey-rating:not(:checked) > label:hover,
.gsurvey-rating:not(:checked) > label:hover ~ label, .gsurvey-rating:not(:checked) > label,
.gsurvey-rating:not(:checked) > label:hover, .gsurvey-rating:not(:checked) > label:hover ~ label,
.gsurvey-rating > input:checked ~ label {
    width: 65px;
    line-height: 50px;
    background-size: 50px 50px;
    color: rgba(221, 221, 221, 0) !important;
}

.wpdatatablewrapper {
	margin: 0px;
	padding: 0px;
}

.ui-datepicker-month {
 color: rgb(0, 0, 0);
}

.ui-datepicker-year {
 color: rgb(0, 0, 0);
}
.um-button-tbl.column-profile:nth-child(3) > button:nth-child(2) > a:nth-child(2) {
 color: rgb(255, 255, 255);
 text-align: center;
}
.um-button-tbl.column-profile:nth-child(3) > button:nth-child(2) {
 text-align: center;
}
.wdt-column-sum {
 text-align: center;
}
.column-profile:nth-child(3) > .un-button-tbl:nth-child(2) > a:nth-child(2) {
 color: rgb(255, 255, 255);
}

.dt-button.buttons-print.DTTT_button.DTTT_button_print:nth-child(1) > span:nth-child(1) {
 color: rgb(84, 89, 95);
 border: 1px none rgb(84, 89, 95);
 padding: 0px 4px 0px 0px;
}

.dt-button.buttons-print.DTTT_button.DTTT_button_print {
 border: 1px solid rgb(84, 89, 95);
 padding-left: 8px;
 padding-right: 8px;
 margin-left: 3px;
}
.dt-button.buttons-excel.buttons-html5.DTTT_button.DTTT_button_xls {
 border: 1px solid rgb(84, 89, 95);
 padding-left: 8px;
 padding-right: 11px;
 color: rgb(84, 89, 95);
}
.dt-button.buttons-excel.buttons-html5.DTTT_button.DTTT_button_xls:nth-child(2) > span:nth-child(1) {
 color: rgb(84, 89, 95);
}
.column-profile:nth-child(4) > .un-button-tbl:nth-child(2) > a:nth-child(2) {
 color: rgb(255, 255, 255);
}
.driver-rating {
	font-size: 46px;
	position: relative;
	text-align: center;
}
.driver-rating-icon {
	font-size: 46px;
	color: gold;
	position: relative;
	top: 2px;
}
.ratings-bkd {
	text-align: center;
	align-content: center;
	margin: auto;
	width: 100%;
	position: relative;
}
.ratings-bkd-left {
	Float: left;
	text-align: center;
	padding: 0px 10px 0px 5px;
}
.ratings-bkd-right {
	float: left;
	text-align: center;
	padding: 0px 5px 0px 10px;
}

.driver-rating-icon-bkd {
	font-size: 16px;
	color: gold;
	position: relative;
	top: 2px;
}
.lightbox-button {
	background-color: #54595f; /* Grey */
    border: none;
    color: white;
    padding: 10px 32px;
	border-radius: 3px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
	margin-left: 20px;
	margin-right: 20px;
	width: 150px;
}
.lightbox-button:hover {
	background-color: #eb1c2d; /* Red */
    border: none;
    color: white;
    padding: 10px 32px;
	border-radius: 3px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
	margin-left: 20px;
	margin-right: 20px;
	width: 150px;
}
.driver-earnings-card {
  background-color: #ffffff;
  border-radius: 3px;
  width: 100%;
  margin:20px 0px 20px 0px;
  padding: 10px 20px;
  text-align: center;
}
	.col-container {
		text-align: center;
		padding: 10px;
		width: 96%;
		display: inline-block;
	}
	.col {
		padding: 0px;
		display: inline-block;
	}
.table-cell {
	padding: 10px;
}
.table-cell.heading {
	font-weight: 600;
	border-bottom: 1px #e9e9e9 solid;
}
.fl-post {
    margin-bottom: 0px;
}

@media only screen and (max-width: 600px) {
    .col { 
        display: inline-block;
        width: 95%;
		border-bottom: 1px #e9e9e9 solid;
		padding: 5px;
    }
	.table-cell {
		display: inline-block;
		width: 20%;
		vertical-align: middle;
		margin: 0px 10px 0px 0px;
		padding: 5px;
		text-align: left;
	}
	.table-cell.heading {
	border: none;
		width: 45%;
}
#col-last {
		border: none;
	}
}
.um-notice.err.um-error-code-incorrect_password {
 display: none;
}
#dr-profile .um-button {
 background-color: #54595f!important;
}
#dr-profile .um-button.um-alt {
	background-color: rgba(255, 255, 255, 0.1)!important;
	border-color: #54595f!important;
}
#dr-profile .um-button:hover {
	 background-color: #eb1c2d!important;
}
#dr-profile .um-button.um-alt:hover {
	border-color: #eb1c2d!important;
	background-color: rgba(255, 255, 255, 0.1)!important;
}
#ac-profile .gravatar.avatar.avatar-120.um-avatar.um-avatar-default {
	display: none!important;
}

#ac-profile .um-account-name.uimob800-hide {
	display: none!important;
}

#ac-profile #um_account_submit_general {
 background-color: rgb(84, 89, 95)!important;
 background-blend-mode: normal;
}
#ac-profile #um_account_submit_general:hover {
 background-color: #eb1c2d!important;
 background-blend-mode: normal;
}
#ac-profile .um-field.um-field-user_login.um-field-text.um-field-type_text {
	display: none!important;
}
.fl-post.fl-404 {
	display:none!important;
}
.pods-field-label {
 margin-right: 20px;
}

#pods-form-ui-pods-field-trading-name {
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}

#pods-form-ui-pods-field-registered-company-name {
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}

#pods-form-ui-pods-field-company-registration-number {
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}

#pods-form-ui-pods-field-dispatch-phone-number {
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}

#pods-form-ui-pods-field-office-contact-number {
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}

#pods-form-ui-pods-field-driver-call-my-customer-number {
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}

#pods-form-ui-pods-field-rent-payment-notification-email {
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}

#pods-form-ui-pods-field-marketing-post-review-email {
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}

#pods-form-ui-pods-field-icabbi-app-url {
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}

#pods-form-ui-pods-field-icabbi-app-key {
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}

#pods-form-ui-pods-field-icabbi-secret-key {
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}

#pods-form-ui-pods-field-company-vat-number {
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}
#pods-form-ui-pods-field-driver-deavtivate-limit {
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}

.pods-dfv-list-meta.media-item {
 list-style-type: none;
 padding-left: 4px;
}

.pods-dfv-list-col.pods-dfv-list-actions:nth-child(3) > ul:nth-child(1) {
 list-style-type: none;
 padding-left: 0px;
 width: 69px;
}

.pods-ui-form:nth-child(3) > div:nth-child(1) {
 width: 65px;
 padding-left: 6px;
}

.pods-dfv-list {
 list-style-type: none;
 margin-left: 1px;
 padding-left: 0px;
}

#pods-form-ui-pods-field-logo-3600-title {
 padding-left: 12px;
 background-color: rgb(255, 255, 255);
 background-blend-mode: normal;
}

.pinkynail {
 padding-bottom: 20px;
 margin-left: 0px;
 padding-left: 20px;
 padding-right: 20px;
 width: 100px;
 height: 100px;
}

.pods-dfv-list-col.pods-dfv-list-remove {
 width: 69px;
}

.description.pods-form-ui-comment.pods-form-ui-comment-pods-field-logo.pods-validate.pods-validate-required {
 margin-top: 10px;
}

/* car background image  */

.dwnbtn {
color: #ffffff!important;
}
.dwnbtn:hover {
color: #ffffff!important;
}
.mobile-help-img {
width: 200px;
margin:10px;
}
.desktop-help-img {
width: 600px;
margin:10px;
}

.multiple-mobile-help-img {
display: flex;
}
.mobile-img-wrapper {
text-align: center;
margin-top:10px;
}
.mobile-img-wrapper p {
margin: 0px;
font-size:12px;
}

@media only screen and (max-width: 600px) {
    .col { 
        display: inline-block;
        width: 95%;
		border-bottom: 1px #e9e9e9 solid;
		padding: 5px;
    }
	.table-cell {
		display: inline-block;
		width: 20%;
		vertical-align: middle;
		margin: 0px 10px 0px 0px;
		padding: 5px;
		text-align: left;
	}
	.table-cell.heading {
	border: none;
		width: 45%;
}
	#col-last {
		border: none;
	}
}

/* Balance styling */

.credit-balance {
	color: #11CD24;
	font-weight: bold;
}
.debt-balance {
	color: #DC143C;
	font-weight: bold;
}
.card-status-container {
	margin: 0 auto;
	max-width: 1100px;
}
.card-status-card {
	padding: 30px;
	margin: 30px 30px 0px 30px;
	background-color: #ffffff;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}
.fa-plus {
	font-size:30px;
	margin:0px 30px 0px 30px;
	color:black;
}
.store-link {
	margin: 0px 20px 0px 20px;
}
.store-icon {
	height: 40px;
}
.status-message {
	max-width: 800px;
	margin: 5px 60px 10px 20px;
}
.btn-primary {
	background-color: #54595f; 
	border: none;
}
.btn-primary:hover, .btn-primary:focus {
	border: none;
	background-color: #eb1c2d;
}
.form-check-label {
	font-weight: normal;
	margin-right: 20px;
	margin-left: 10px;
}
.name-panel {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items:center;
}
.driver-name {
	font-size: 26px;
}
.driver-info {
	width: 100%;
	display:flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
}
.driver-name-container {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
.driver-rating-container {
	font-size: 30px;
}
.driver-profile-photo {
	width: 50px;
	height: 50px;
	border: 1px solid #DCDCDC;
	border-radius:50%;
	margin-right:20px;
}
.rating-icon {
	color: #FFD700;
	font-size: 30px;
}
.balance-panel {
	padding: 15px 0px 0px 0px;
	font-size: 18px;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	width: 100%;
}
.balance-panel-button-container {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: stretch;
	width: 100%;
	padding-top: 15px;
}
.balance-panel-button {
	padding:12px 20px;
	min-width: 30%;
	max-width: 50%;
}

@media only screen and (max-width: 768px) {

.card-status-card {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	background-color: #ffffff;
	padding: 30px 20px 30px 20px;
	margin: 10px;
}
.fa-plus {
	font-size:25px;
	margin:0px 20px 0px 20px;
	color:black;
}
.store-icon {
	height: 40px;
}
.status-message {
	max-width: 800px;
	margin: 5px 20px 10px 20px;
	text-align: center;
}
.fa-exclamation-circle {
	display:none;
}
.store-link {
	margin: 0px 10px 0px 10px;
}
.driver-info {
	display:flex;
	flex-direction:column;
}
.balance-panel-button-container {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: stretch;
	width: 100%;
	padding-top: 15px;
}
.balance-panel-button {
	padding:12px 20px;
	min-width: 100%;
	margin: 10px 0px;
}
.driver-name {
	font-size: 22px;
}
.driver-profile-photo {
	height: 40px;
	width: 40px;
	margin-right: 10px;
}
.driver-rating-container {
	font-size: 22px;
}
.rating-icon {
	font-size:26px;
}
}
.settings-card {
	background-color: #ffffff;
	margin: 20px;
	padding: 0px 20px 10px 20px;
}
.row {
	margin-left: 0px!important;
	margin-right: 0px!important;
}
.checkbox-inline {
	margin-left:0px!important;	
}
.help-menu {
	padding: 0px 10px;
	display:flex;
	flex-direction: column;
}
.help-container {
	margin: 10px 10px 10px 20px;
	padding: 20px
}
/* The container <div> - needed to position the dropdown content */
.dropbtn {
  font-size: 12px!important;
}
.notes-dropbtn, .notes-dropbtn:hover, .notes-dropbtn:focus, .notes-dropbtn:active {
  font-size: 12px!important;
  background: none!important;
	border:none;
color: #54595f!important;
	padding: 0px!important;
	margin:0px!important;
	cursor: pointer;
}

.dropdown, .notes-dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content, .notes-dropdown-content {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 80px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
	padding: 15px 20px;
	min-width: 200px!important;
}

/* Links inside the dropdown */
.dropdown-content a, .dropdown-content input[type=submit] {
  color: black;
  padding: 12px 10px;
	margin: 0px!important;
  text-decoration: none;
  font-size: 12px!important;
  display: block;
  background: none!important;
  border: none;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #ddd}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;}

.un-button-tbl {
	Color: #ffffff!important;
}
.dashboard-card {
	background-color: #ffffff;
	height: 120px;
	padding: 20px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.dashboard-heading {
	font-size: 18px;
	font-weight: bold;
}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.grow {
  border-radius: 10px;
  float: left;
  transition: transform 0.5s, height 0.2s;
  -webkit-transition: transform 0.5s, height 0.2s;
  overflow: hidden;
	position:relative;
	margin: 0px 15px 15px 0px; 
	padding: 15px 15px 15px 15px;
	background-color:#fff;
	width: 180px;
	height: 220px;
}
.grow:hover {
  transform: scale(1.2);
	box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px;
	z-index:2;
	height: 360px;
	overflow-y: scroll;
}

/* custom scrollbar */
.custom-scrollbar::-webkit-scrollbar {
  width: 20px;
}

.custom-scrollbar::-webkit-scrollbar-track {
  background-color: transparent;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
  background-color: #d6dee1;
  border-radius: 20px;
  border: 6px solid transparent;
  background-clip: content-box;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background-color: #a8bbbf;
}
.more-icon {
	position: absolute;
	bottom: 5px;
	right: 5px;
}
.grow:hover .more-icon {
	display: none;
}
@media (min-width: 768px) {
  .modal-xl {
    width: 95%;
   max-width:1400px;
  }
}

.modal {
  overflow-y:auto;
}