/* Diseño de botones de compra */
.btn.btn-orange-solid {
    background: #ff530d;
    color: #FFFFFF;
    font-family: "Lato", sans-serif;
    margin-bottom: 10px !important;
}
.btn.btn-orange-outline {
    background: transparent;
    border: solid 3px #ff530d !important;
    color:#ff530d;
    font-family: "Lato", sans-serif;
}
.btn.btn-send-design-corners {
    -webkit-border-radius: 10px !important;
    -moz-border-radius: 10px !important;
    border-radius: 10px !important;
    font-size: 17px;
}
.btn.btn-send-design.btn-lg {
    -webkit-border-radius: 50px !important;
    -moz-border-radius: 50px !important;
    border-radius: 50px !important;
    font-size: 20px;
}
.btn.btn-send-design.btn-lg.btn-call{
    background: white;
    display: block;
    margin-bottom: 20px;
    width: 100%;
}
.btn.btn-send-design.btn-lg.btn-movil{
    display: block;
    margin-bottom: 20px;
    width: 100%;
}


.btn.btn-send-design.btn-md {
    -webkit-border-radius: 50px !important;
    -moz-border-radius: 50px !important;
    border-radius: 50px !important;
    font-size: 18px;
}
.btn.btn-send-design {
    -webkit-border-radius: 50px !important;
    -moz-border-radius: 50px !important;
    border-radius: 50px !important;
    font-size: 16px;
}

.btn.btn-secundary-design.btn-lg {
    -webkit-border-radius: 50px !important;
    -moz-border-radius: 50px !important;
    border-radius: 50px !important;
    font-size: 20px;
}
.btn.btn-secundary-design.btn-md {
    -webkit-border-radius: 50px !important;
    -moz-border-radius: 50px !important;
    border-radius: 50px !important;
    font-size: 18px;
}
.btn.btn-secundary-design {
    -webkit-border-radius: 50px !important;
    -moz-border-radius: 50px !important;
    border-radius: 50px !important;
    font-size: 16px;
}

.btn.btn-orange-solid.btn-md {
    -webkit-border-radius: 50px !important;
    -moz-border-radius: 50px !important;
    border-radius: 50px !important;
    font-size: 16px!important;
    margin-bottom: 0;
}
.btn.btn-orange-outline.btn-md {
    -webkit-border-radius: 50px !important;
    -moz-border-radius: 50px !important;
    border-radius: 50px !important;
    font-size: 16px !important;
    margin-bottom: 0;
}

.btn.btn-orange-solid.btn-xs {
    -webkit-border-radius: 50px !important;
    -moz-border-radius: 50px !important;
    border-radius: 50px !important;
    font-size: 14px!important;
    margin-bottom: 0;
}
.btn.btn-orange-outline.btn-xs {
    -webkit-border-radius: 50px !important;
    -moz-border-radius: 50px !important;
    border-radius: 50px !important;
    font-size: 14px !important;
    margin-bottom: 0;
}
.btn.btn-orange-solid.btn-xs.process-pay{
    padding: 6px 25px;
}

/* OPPS --------------------------------------------------------------------- */
h3 ,.pay-messages-2 h3{
	margin-bottom: 10px;
	font-size: 15px;
	font-weight: 600;
	text-transform: uppercase;
}
.opps ,.pay-messages-2 .opps{
	width: 496px;
	box-sizing: border-box;
	padding: 0 45px;
	margin: 0px auto;
	overflow: hidden;
	font-family: 'Lato', sans-serif;
	color: #4f5365;
	text-align: left !important;
}
.opps-reminder ,.pay-messages-2 .opps-reminder{
	position: relative;
	top: -1px;
	padding: 9px 0 10px;
	font-size: 11px;
	text-transform: uppercase;
	text-align: center;
	color: #ffffff;
	background: #000000;
}
.opps-info ,.pay-messages-2 .opps-info{
	margin-top: 26px;
	position: relative;
}
.opps-info:after ,.pay-messages-2 .opps-info:after {
	visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
}
.opps-brand ,.pay-messages-2 .opps-brand {
	width: 45%;
	float: left;
}
.opps-brand img ,.pay-messages-2 .opps-brand img{
	max-width: 88px;
	margin-top: 2px;
}
.opps-ammount ,.pay-messages-2 .opps-ammount{
	width: 55%;
	float: right;
}
.opps-ammount h2 ,.pay-messages-2 .opps-ammount h2{
	color: #000000;
	font-family: 'Lato', sans-serif;
	font-size: 36px;
	line-height: 24px;
	margin-bottom: 15px;
}
.opps-ammount h2 sup ,.pay-messages-2 .opps-ammount h2 sup{
	font-size: 16px;
	position: relative;
	top: -2px
}
.opps-ammount p ,.pay-messages-2 .opps-ammount p{
	font-size: 10px;
	line-height: 14px;
}
.opps-reference ,.pay-messages-2 .opps-reference{
	margin-top: 14px;
}
h1 ,.pay-messages-2 h1{
	background: #f8f9fa;
	border: 1px solid #b0afb5;
	border-radius: 4px;
	color: #000000;
	font-family: 'Lato', sans-serif;
	font-size: 27px;
	margin-top: -1px;
	padding: 6px 0 7px;
	text-align: center;
}
.opps-instructions ,.pay-messages-2 .opps-instructions{
	box-sizing: border-box;
	margin: 32px -45px 0;
	padding: 32px 45px 45px;
	border-top: 1px solid #b0afb5;
	background: #f8f9fa;
	width: 494px;
}
ol ,.pay-messages-2 ol {
	margin: 17px 0 0 16px;
}
.opps-instructions li + li ,.pay-messages-2 .opps-instructions li + li{
	margin-top: 10px;
	color: #000000;
}
a ,.pay-messages-2 a{
	color: #1155cc;
}
.opps-footnote ,.pay-messages-2 .opps-footnote{
	margin-top: 22px;
	padding: 22px 20 24px;
	color: #108f30;
	text-align: center;
	border: 1px solid #108f30;
	border-radius: 4px;
	background: #ffffff;
}

/* Estilos para la vista de pagos */
.pay-messages-2 .pay-messages{
	width:100%;
}
.pay-messages-2 {
	border: 1px solid #DDD;
}
.pay-messages-2,.pay-messages-2 .opps{
	width:100% !important;
}
.pay-messages-2 .opps {
	padding:0;
}
.pay-messages-2 h1 {
	margin:0 0 10px 0;
}
.pay-messages-2 .opps-info{
	margin-top: 10px;
}
.pay-messages-2 .opps-brand {
	width:30%;
}
.pay-messages-2 .opps-ammount {
	width:69%;
}
.pay-messages-2 .opps-reference {
	padding: 0 10px;
	margin-top: 0;
}
.pay-messages-2 .opps-instructions {
	box-sizing: border-box;
    margin: 0; 
    padding: 10px 10px 10px;
    border-top: 1px solid #b0afb5;
    background: #f8f9fa;
    width: 100%;
}
.pay-messages {
    border: none;
    max-width: 496px;
    width: auto;
}
.xs-form-control {
    display: inline-block;
    width: 35%;
    height: 40px;
    padding: 8px 9px;
    font-size: 15px;
    line-height: 1.42857143;
    color: #555555;
    background-color: #ffffff;
    background-image: none;
    border: 2px solid #DDD;
    border-radius: 0 !important;
    -webkit-transition: border-color ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s;
    transition: border-color ease-in-out .15s;
}
/* Media Queris */
/* ----------------------------------------------------------------
	Responsive CSS
-----------------------------------------------------------------*/
@media (max-width: 1199px) {
	.opps-info, .opps-reference, .opps-instructions{
		padding:0 ;
	}
}
@media (min-width: 992px) and (max-width: 1199px) {

}
@media (max-width: 991px) {

}
@media (min-width: 768px) and (max-width: 991px) {

}
@media (max-width: 767px) {

}
@media (min-width: 480px) and (max-width: 767px) {

}
@media (max-width: 479px) {
	.opps {
		width:100%;
		padding:0px;
	}
	.opps-info {
	    padding: 0 5px;
	}
	.opps-brand {
		width:30%;
	}
	.opps-ammount {
		width:65%;
	}
	.opps-reference {
	    margin-top: 0;
	    padding: 0 5px;
	}
	.opps-instructions {
	    box-sizing: border-box;
	    margin:0; 
	    padding: 0; 
	    border-top: 1px solid #b0afb5;
	    background: #f8f9fa;
	    width :100%;
	    padding: 0 5px;
	}
	.text-finish{
		padding: 10px 5px;
	}
}
/* ----------------------------------------------------------------
	Retina CSS
-----------------------------------------------------------------*/
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) {

}

@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 991px),
only screen and (   min--moz-device-pixel-ratio: 2) and (max-width: 991px),
only screen and (     -o-min-device-pixel-ratio: 2/1) and (max-width: 991px),
only screen and (        min-device-pixel-ratio: 2) and (max-width: 991px),
only screen and (                min-resolution: 192dpi) and (max-width: 991px),
only screen and (                min-resolution: 2dppx) and (max-width: 991px) {

}
