/*
FONT PATH
*/
/* latin-ext */
@font-face {
  font-family: 'Inconsolata'; font-style: normal; font-weight: 400;
  src: local('Inconsolata'), url(https://fonts.gstatic.com/s/inconsolata/v12/BjAYBlHtW3CJxDcjzrnZCCYE0-AqJ3nfInTTiDXDjU4.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inconsolata'; font-style: normal; font-weight: 400;
  src: local('Inconsolata'), url(https://fonts.gstatic.com/s/inconsolata/v12/BjAYBlHtW3CJxDcjzrnZCI4P5ICox8Kq3LLUNMylGO4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/*
CSS class order DOES MATTER!!
Classes declared here are to be the default setting and allow overriding as necessary.
*/
body { background: url(/gps/user/resources/images/bg-new.gif) center top repeat-y #EAEBF3;
	opacity: 1; color: #0069ad; font-family: Arial, Helvetica, sans-serif; font: 13px/1.231 arial, helvetica, clean, sans-serif; padding-right: 0!important;}
.wrapper { max-width: 850px; width:100%; margin: 0 auto; }
.gpsLogo { color: white; font-size: 14px; position: relative; background: #191919E6 0% 0% no-repeat padding-box;
	opacity: 1;}
.content { background: transparent linear-gradient(180deg, #EAEBF3 0%, #000000 80%) 0% 0% no-repeat padding-box; opacity: 1; background-size: 100% 100%; width: 848px; padding-top: 30px; }
.box { border: 1px solid #fff; background: #fff; width: 600px; margin: 0 auto 0px auto; }
.boxPad { padding: 5px; }
.receipt-box { min-height: 620px; }
.t-detail-box { min-height: 520px; }
.long-form { background-color: #fff;  padding: 0 0; }
.summaryBox { background: #a9d9bc; padding-top: 5px; padding-bottom: 5px; font-size: 11px; }
.mobile { display: block; }
label { font-weight: normal; }
/*
BOOTSTRAP size-specific CSS
CSS classes declared in the below 4 @media classes will only apply to that specific size.
For example, class declared in XS size will not be applied in SM, MD, or LG size.
*/
/* Bootstrap 3 Default XS size */
@media (max-width: 767px) {
   .content { width: 100%; padding-top: 0; }
   .box { width: 100%; border: none; padding-left: 2px; padding-right: 2px; }
   .boxPad { padding-top: 1px; padding-right: 0px; padding-left: 0px; }
   .receipt-content { margin: 20px 10px; }
   .mobile { display: block; }
}
/* Bootstrap 3 SM size */
@media (min-width: 768px) and (max-width: 991px) {
	.content { width: 100%; padding-top: 30px; }
	.box { width: 90%; }
	.boxPad { padding: 0; }
	.agency .boxPad { padding: 5px; }
}
/* Bootstrap 3 MD size */
@media (min-width: 992px) and (max-width: 1199px) {
	.content { width: 100%; padding-top: 30px; }
	.box { width: 90%; }
}
/* Bootstrap 3 LG Size */
@media (min-width: 1200px) {

}
/*
BOOTSTRAP scaling CSS
CSS classes declared in the below 4 @media classes will apply to that specific size and up.
For example, class declared in SM size will not be applied in XS but will be applied in SM, MD, and LG sizes.
*/
/* Bootstrap 3 Default XS size */
.text-xs-left { text-align: left; }
.text-xs-right { text-align: right; }
.text-xs-center { text-align: center; }
.text-xs-justify { text-align: justify; }
#confirmation-details { padding: 0 10px 10px 10px; }
/* Bootstrap 3 SM size */
@media (min-width: 768px) {
	.text-sm-left { text-align: left; }
	.text-sm-right { text-align: right; }
	.text-sm-center { text-align: center; }
	.text-sm-justify { text-align: justify; }
	.long-form { padding: 10px; }
}
/* Bootstrap 3 MD size */
@media (min-width: 992px) {
   .text-md-left { text-align: left; }
   .text-md-right { text-align: right; }
   .text-md-center { text-align: center; }
   .text-md-justify { text-align: justify; }
   .gps-logo-wrapper { width: 848px !important; }
}
/* Bootstrap 3 LG Size */
@media (min-width: 1200px) {
   .text-lg-left { text-align: left; }
   .text-lg-right { text-align: right; }
   .text-lg-center { text-align: center; }
   .text-lg-justify { text-align: justify; }
}
/*
All CSS classes declared below are not specific to any Bootstrap sizing.
*/
.text-red { color: red; }
.text-black { color: black; }
.text-green { color: #17B1A0; }
.text-blue { color: #00649e; }
.text-grey { color: #737373; }
.text-italic { font-style: italic; }
.text-bold { font-weight: bold; }
.text-monospace {font-family: Inconsolata, Monaco, monospace}
.text-break-word { word-wrap: break-word; }
.border-red { border-color: red; border-style: solid; border-width: thin; border-radius: 5px; }
.border-blue { border: 1px solid #90AEC6; }
.border-green-middle { border-bottom: 1px solid #17B1A0; top: -0.6em; }
.no-gutter > [class*='col-'] { padding-right:0; padding-left:0; }
.vcenter { vertical-align: middle; }
.required { color: #000; margin-left: 10px; line-height: 20px; font-size: 11px; }
.welcome-banner-ui { font: normal normal bold 24px/50px Nunito Sans;
	letter-spacing: 0px;
	color: #337AB7;
	opacity: 1;
	height: 35px;
}
.welcome-banner-title {
	margin-left: 15px;
}
.footer { text-align: center; font-size: 11px; color: #fff; padding-top: 30px;}
.footer p a { color: #fff; text-decoration: underline; margin: 0 5px; cursor: pointer; }
.footer p a:hover { color: green }
.footer p { line-height:20px; }
.clear { clear: both; }
.row-flex { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
.row-margins { margin-top: 10px; margin-bottom: 10px; }
.margin-left-pc-30 { margin-left:30%; }
.clickable { cursor: pointer; }
body.paused .pausable:after { display: block; }
.pausable { position: relative; }
.pausable:after {
	content: " "; display: none; /* Hide by default */
	filter: alpha(opacity = 75); height: 100%; width: 100%;
	position: absolute; z-index: 1; left: 0px; top: 0px; width: 100%;
	background-color: #fff; background-color: rgba(255, 255, 255, 0.75);
	background-image: url('/gps/user/resources/images/indicator.gif');
	background-position: center center; background-repeat: no-repeat;
}
.loading {
	background: url('/gps/user/resources/images/indicator.gif');
	width: 16px; height: 16px; float: right; display: none;
}
.form-control-date { min-width: 0; max-width: 70px; display: inline; margin-right: 5px; }
.form-control-phone { min-width: 0; max-width: 70px; display: inline; margin-right: 7px; }
.form-control-zip { min-width: 0; max-width: 100px; display: inline; margin-right: 7px; }
.form-control-ss { min-width: 0; max-width: 70px; display: inline; margin-right: 7px; }
.form-control-lookup-input { min-width: 0; max-width: 150px; display: inline-block; margin-right: 7px; }
.form-control-lookup-button { vertical-align: top !important; }
.form-control-cvv { min-width: 0; max-width: 100px; display: inline; margin-right: 7px; }
.form-control-exp { min-width: 0; max-width: 100px; display: inline; margin-right: 7px; }
.chargeTotals label { margin: 0px; }
#tos { max-height: 300px; overflow: scroll; }
#tos a { outline-width: medium; outline-style: none; outline-color: invert; text-decoration: underline; }
#tos h4 { color: #00649e; font-size: 16px; font-weight: bold; margin-bottom: 10px; }
#tos p { font-size: 11px; margin: 10px 0px; }
#tos ul { font-size: 11px; list-style: disc; }
#privacyPolicy h3 { color: #00ad7e; font-size: 24px; padding-bottom: 5px; font-weight: bold; }
#privacyPolicy h4 { color: #00649e; font-size: 16px; font-weight: bold; margin-bottom: 10px; }
#faq h3 { color: #00649e; font-size: 24px; padding-bottom: 5px; font-weight: bold; }
#faq h4 { color: #00649e; font-size: 16px; font-weight: bold; margin-bottom: 10px; }
li.faq { padding: 10px 0px 0px 0px; }
a.faq:link { font-size: 12px; color:#00649E; }
a.faq:visited { font-size: 12px; padding: 1px 1px 1px 1px; color: #00649E; }
h4.faqGeneral { color: #00649e; font-size: 14px; font-weight: bold; }
h4.faqCriminal { color: #00649e; font-size: 14px; font-weight: bold; }
#complaint h3 { color: #00ad7e; font-size: 24px; padding-bottom: 5px; font-weight: bold; }
#complaint h4 { color: #00649e; font-size: 16px; font-weight: bold; margin-bottom: 10px; }
#complaint li { padding: 10px 0px 0px 0px; }
#complaint a { font-size: 12px; color:#00ad7e; cursor: pointer; }
.modal-title { color: #00ad7e; font-size: 24px; font-weight: bold; }
.modal-title-legal { color: #00ad7e; font-size: 20px; font-weight: bold; }
.popover-title { color: #00ad7e; font-size: 18px; font-weight: bold; }
.no-script { margin-top: 30px; }
/* label.error { color: red; } */
div.errorList ul li { list-style-type: none; }
div.errorList { display: none; }
/* .error label.error { display: inline; } */
.validation-invalid { border: 1px solid red }
.validation-invalid-label { color: red }
.validation-error-msg { font: 11px arial, helvetica, clean, sans-serif; }
.error { color: #a94442; }
.fieldInstructions { font: 12px arial, helvetica, clean, sans-serif; font-style: italic; }
a.disabledLink { color:gray; text-decoration: none; cursor:pointer; }
.longPageForm .panel { margin-left: 5px; margin-right:5px; }
.btn-sq { width: 70px !important; height: 72px !important; font-size: 10px; }
.cardMethodTypeSelectionArea { margin-left: 5px; margin-right: 5px; margin-bottom: -20px; }
.paymentTypeOption img { padding-top: 1px; max-height: 49px; max-width: 49px; }
.paymentTypeOption label { vertical-align: middle; text-align: center !important; margin: 0 !important; padding: 0 !important; cursor: pointer; }
.paymentTypesInformation .btn {
	border: 2px solid #A9A9A9; text-align: center;
	white-space: normal; padding: 3px; margin-right: 3px; margin-bottom: 3px;
	color: #000000; background-color: #FFFFFF; border-radius: 4px !important; cursor: pointer;
}
.paymentTypesInformation .btn.active, .paymentTypesInformation .btn:active {
	border: 2px solid #0069ad; background-color: #E8E8E8; box-shadow: 2.5px 2.5px 10px #888888;
}
.paymentTypesInformation .btn.hover, .paymentTypesInformation .btn:hover,
	.paymentTypesInformation .btn.focus, .paymentTypesInformation .btn:focus {
	border: 2px solid #000000; background-color: #E1E1E1; box-shadow: 2.5px 2.5px 10px #888888;
}
.information-field { float: none; text-align: center; }
.panel-heading .panel-toggle:after { font-family: 'Glyphicons Halflings'; content: "\e113"; float: right; color: grey; }
.panel-heading .panel-toggle.collapsed:after { content: "\e114"; }
.texticon-inline {display: inline !important; margin-right: 5px;}
.none-border-top { border-top-style: none !important; }
.none-border-bottom { border-bottom-style: none !important; }
.none-border-left { border-left-style: none !important; }
.none-border-right { border-right-style: none !important; }
.ui-autocomplete {
    position: absolute;
    z-index: 1000;
    cursor: default;
    padding: 0;
    margin-top: 2px;
    list-style: none;
    color: black;
    background-color: #ffffff;
    border: 1px solid #ccc;
    -webkit-border-radius: 5px;
       -moz-border-radius: 5px;
            border-radius: 5px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
       -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
            box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}
.ui-autocomplete > li { padding: 3px 20px; }
.ui-autocomplete > li.ui-state-focus { background-color: #DDD; color: #0069ad; }
.ui-helper-hidden-accessible { display: none; }
/*
Custom Agency CSS classes
*/
.header-sample-img { max-width: 848px; }
.agency-content { max-width: 848px; background: transparent  linear-gradient(180deg, #EAEBF3 0%, #000000 80%) 0% 0% no-repeat padding-box; opacity: 1; background-size: cover;
 padding: 20px; }
.agency-box { border: none; background: #fff; width: 100%; margin: 0px auto 30px auto; }
.agency .agency-box { border: 1px solid #ddd; }
.agency .header-image-container { background-color: #ffffff; width: 100%; }
.agency .header-image-container img { max-width: 100%; width: auto; }
.agency .header-cardtypes-image-container { width: 100%; }
.agency .header-cardtypes-image-container img { max-width: 100%; width: auto; }
/* Default-look doesn't ever get to see this img. */
.card-types-input-img { display: none; }
/* Agency-look, sees the image. */
.agency .card-types-input-img { display: inline; }
/* Agency-look for split payments doesn't get to see the image. */
.payment-details-required .card-types-input-img { display: none; }
.agency .content { background: none; }
#agency-conf-cancel-info { margin: 0 10px 20px; }
.buttons { width:100%; margin:20px 0 40px; }
.center-buttons { width:100%; margin:0 auto; }
.agency .center-buttons { width:80%; margin:0 auto; }
.buttons input { width:100%; }
.agency .receipt-content { padding:0 10px; }
.agency .receipt-box { min-height: 100%; }
/*
Custom WarranTrak CSS classes
*/
.warranTrakDisabled { opacity: 0.5; background: #c0c0c0; }
.warranTrakDisabled select { background: #c0c0c0; border-style: solid; border-width: 1px; }
/*
Custom Store CSS classes
*/
.store-banner { background: #00ad7f; color: white; font-weight: lighter; }
.store-banner-name { margin-top: 20px; margin-bottom: 20px; }
.store-banner-info { margin-top: 15px; margin-bottom: 15px; }
.store-banner-icon { margin-top: 30px; margin-bottom: 30px; }
.store-banner-icon-small { margin-top: 10px; margin-bottom: 10px; }
.fa-stack[data-count]:after{
	position:absolute;
	right:0%;
	top:0%;
	content: attr(data-count);
	font-size:40%;
	padding:.6em;
	border-radius:999px;
	line-height:.75em;
	color:white;
	text-align:center;
	min-width:2em;
	font-weight:bold;
	background: #2e6da4;
}
/*
CSS classes declared below are Bootstrap bug fixes and any other fixes.
*/
/* Fixes issue in Bootstrap when modal dialogs cause entire screen to shift left. */
.modal-open { overflow: hidden!important; padding-right:0!important }
/* Fixes issues with Bootstrap margins on checkbox/radio inputs. Marked as won't fix for Bootstrap v3. */
input[type="checkbox"],input[type="radio"] { margin: 1px 0 0 0; }
/* Below two classes remove the number spinner from inputs of type number. */
input[type='number'] { -moz-appearance:textfield; }
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; }
.rightCol-label { padding-top: 7px; }
/*
CSS for Ticket Search
 */

.frames {
	min-height: 140px;
}
.containerflex {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-end;
	align-items: center;
	align-content: stretch;
	padding: 5px;
	margin: auto;
}

.search-input {
	width: 100%;
	height: 30px;
	border-radius: 3px;
	border: 1px solid;
	color:black;

}

.search-descripton  {
	height: 140px;
	width: 100%;
	color:black;
}
.containerflex-descripton {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-end;
	align-items: center;
	align-content: stretch;
	padding: 5px;
	min-width: 320px;
	margin: auto;
	color: #0c0c0c;
}
.button-footer {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-end;
	padding-right: 10px;
}
.btn-footer {
	width: 140px;
	padding-right: 25px;
}
.containerflex-mess {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-end;
	align-items: center;
	align-content: stretch;
	margin-top: 10px;
	color: #a94442;
}
#descripton {
	resize: none;
	width: 95%;
	height: 100px;

}
leb {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
	align-content: stretch;
	margin-left: 5px;
	margin-top: 5px;
}


.leb-btn {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
	align-content: stretch;
	margin-top: 2px;
	font-size: .8em !important;
}
.div-btn {
	visibility: unset;
}





