.tarjeta-pagos .panel-title {
	color: #FFF !important;
}

h3.dtitle {
	font-family: 'Questrial', sans-serif;
	color: #4C4C4C;
}
.pagos-main-row {
	padding-top:100px;
}

.tarjeta-pagos .panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid #4c4c4c;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}

.tarjeta-pagos .panel-heading {
    background-color: #4c4c4c !important;
	color: #FFF !important;
}
.tarjeta-pagos .panel-heading h4.productTitle {
	color: #FFF !important;
}
.tarjeta-pagos .cycleTitle {
    color: #FFF !important;
}
.contenedor-pagos .panel-info>.panel-heading h1,
.contenedor-pagos .panel-info>.panel-heading h1 h2,
.contenedor-pagos .panel-info>.panel-heading h1 h3,
.contenedor-pagos .panel-info>.panel-heading h1 h4,
.contenedor-pagos .panel-info>.panel-heading h1 h5 {
	font-family: 'Questrial', sans-serif;
	color: #FFF;
}

.btn-view {
	background-color: transparent !important;
	color: #4c4c4c !important;
	border-color: #e8e8e8 !important;
}
.btn-view .far, .btn-view .fa {
	color: #4c4c4c !important
}
.btn-pay {
	background-color: #5cb85c !important;
	color: #FFF !important;
	border-color: #FFF !important;
}
.btn-pay .far, .btn-pay .fa {
	color: #FFF !important
}
.panel-info>.panel-heading p {
	margin: 0px !important;
	color: #FFF !important;
}
.contenedor-pagos>div.card {
	padding: 0px 5px !important
}

.activeBis {
	background-color: #4C4C4C !important;
	border-radius: 4px;
	border: 0px solid #e8e8e8;
	padding-bottom: 0px;
	padding-top: 0px;
	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 0px;
}

.activeBis a {
	color: #FFF;
}

.activeBis a:hover {
	background-color: #d9edf7 !important;
	color: #333;
	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 0px;
}

.activeBisNormal {
	background-color: #e8e8e8 !important;
	border-radius: 4px;
	border: 0px solid #e8e8e8;
	padding-bottom: 0px;
	padding-top: 0px;
	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 0px;
}

.activeBisNormal a {
	color: #333;
}

.activeBisNormal a:hover {
	background-color: #d9edf7 !important;
	color: #333;
	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 0px;
}

.fa-pendiente,
.fa-pendiente:hover {
	background-color: #ffc107 !important;
}

.fa-pendiente i {
	color: #333;
}

.cycleTitle {
	margin: 0px;
	margin-bottom: 5px;
}

.productTitle {
	margin: 0px;
}

.cycleDates {
	margin: 0px
}

.table-orders-id td.date i {
	color: #666 !important;
	font-size: 15px;
	margin-left: 5px;
	position: relative;
	top: 1px;
}

.table-orders-id td.date .label {
	color: #666 !important;
}

.table-orders-id .btn {
	color: #666;
	width: 100%;
	padding: 5px 5px;
	display: inline-block;
	margin-bottom: 5px;
}


.f1-step.active .f1-step-icon {
	background: #5cb85c !important;
}

.f1-step.active p {
	color: #4c4c4c !important;
}

.f1-progress {
	background: #d9edf7;
}

.f1-progress-line {
	background: #5cb85c;
}

.f1-step-icon {
	background: #5cb85c;
	color: #fff;
}

.f1-step.activated .f1-step-icon {
	background: #5cb85c;
	border: 1px solid #3AB2B1;
	color: #3AB2B1;
}

.f1-step.active .f1-step-icon {
	background: #5cb85c;
}

.f1-step p {
	color: #ccc;
}

.f1-step.activated p {
	color: #3AB2B1;
}

.f1-step.active p {
	color: #3AB2B1;
}

.f1 .input-error {
	border-color: #3AB2B1;
}

/** SPINNER CREATION **/
.fade .modal-dialog {
	width: 600px;
	margin: 200px auto !important;
}

.modal .loader {
	position: relative;
	text-align: center;
	margin: 15px auto 35px auto;
	z-index: 9999;
	display: block;
	width: 80px;
	height: 80px;
	border: 10px solid rgba(0, 0, 0, .3);
	border-radius: 50%;
	border-top-color: #000;
	animation: spin 1s ease-in-out infinite;
	-webkit-animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
	to {
		-webkit-transform: rotate(360deg);
	}
}

@-webkit-keyframes spin {
	to {
		-webkit-transform: rotate(360deg);
	}
}


/** MODAL STYLING **/

.modal-content {
	border-radius: 0px;
	box-shadow: 0 0 0px 8px rgba(0, 0, 0, 0.7);
}

.modal-backdrop.show {
	opacity: 0.75;
}

.loader-txt {
	p {
		font-size: 13px;
		color: #666;

		small {
			font-size: 11.5px;
			color: #999;
		}
	}
}
.container-constancias {

}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
	.pagos-main-row {
		padding-top:20px;
	}
	h3.dtitle {
		font-size:18px !important
	}
	body > div.container > div > div > div.row.pagos-main-row > div.col-md-12.text-center > p {
		font-size:16px !important
	}
	body > div.container > div > div > div.row.pagos-main-row > div.col-md-12.contenedor-pagos > div.row > div {
		padding:10px !important;
	}
	body > div.container > div > div > div.row.pagos-main-row > div.col-md-12.contenedor-pagos > div.row > div > ul > li {
		width:100% !important;
		border-radius: 0px !important;
		border:0px !important;
		margin:0px !important;
	}
	body > div.container > div > div > div.row.pagos-main-row > div.col-md-12.contenedor-pagos > div.row > div > ul > li.activeBis, body > div.container > div > div > div.row.pagos-main-row > div.col-md-12.contenedor-pagos > div.row > div > ul > li.activeBisNormal {
		width:100% !important;
		border-radius: 0px !important;
		border:0px !important;
		margin:0px !important;
	}
	body > div.container > div > div > div.row.pagos-main-row > div.col-md-12.contenedor-pagos > div.card.tarjeta-pagos {
		padding: 0px !important
	}
	.card .tarjeta-pagos {
		padding:0px !important;
		margin:0px !important;
	}
	body > div.container > div > div > div.row.pagos-main-row > div.col-md-12.contenedor-pagos > div.card.tarjeta-pagos > div > div.panel-body {
		padding:5px !important;
		margin:5px !important;
	}
	div.card.tarjeta-pagos div.panel-body table thead {
		display: none !important;
	}
	/* recibo */
	.pagos-recibo {
		margin-right:0px !important
	}

}
@media (max-width: 767px) {
	.col-xs-12, [class*="col-md-"].boxed-inverse, [class*="col-md-"].boxed, .col-md-6.boxed-inverse:not([class*="col-sm-"]), .col-md-6.boxed:not([class*="col-sm-"]), .col-md-4.boxed-inverse:not([class*="col-sm-"]), .col-md-4.boxed:not([class*="col-sm-"]), [class*="col-md-"].boxed-inverse.col-sm-6, [class*="col-md-"].boxed.col-sm-6, .col-md-6.boxed-inverse:not([class*="col-sm-"]), .col-md-6.boxed:not([class*="col-sm-"]), .col-md-8.boxed:not([class*="col-sm-"]), .col-md-8.boxed:not([class*="col-sm-"]), .col-md-8.boxed-inverse:not([class*="col-sm-"]) {
		width: 100% !important;
	}
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {

}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {

}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
	.container-constancias {
		padding-top: 100px !important;
		min-height: 800px !important;
	}
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {

}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
	.container-pagos {
		min-height: 800px;
	}
}