* {
    outline: none !important;
    text-decoration: none !important;
    font-family: 'DIN Pro';
}

html {  
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;
    height: 100%;
    margin:0;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #666;
}
::-moz-placeholder { /* Firefox 19+ */
    color: #666;
}
:-ms-input-placeholder { /* IE 10+ */
    color: #666;
}
:-moz-placeholder { /* Firefox 18- */
    color: #666;
}

.tituloIco2 {
    margin: 1% auto 2% !important;
    color: #333;
    text-align: center;
    font-family: 'DIN Pro';
}

.ui-widget .ui-state-focus,
.ui-widget.ui-state-focus{
    box-shadow: 0 0 4px 0 rgba(241, 11, 11, 0.7) !important;
}

.ui-widget.ui-state-active .ui-button-text.ui-c {
    color: #fff !important;
}

.ui-selectonemenu.ui-state-focus,
.ui-selectcheckboxmenu.ui-state-focus,
.ui-paginator-page.ui-state-focus,
.ui-paginator-next.ui-state-focus,
.ui-paginator-prev.ui-state-focus,
.ui-paginator-last.ui-state-focus,
.ui-paginator-first.ui-state-focus,
.ui-paginator-rpp-options.ui-state-focus{border:solid 1px #c00 !important;}

.ui-selectonemenu.ui-state-hover,
.ui-selectcheckboxmenu:hover{border-color:#c00 !important;}

.ui-selectonemenu-panel .ui-state-highlight, .ui-selectcheckboxmenu-panel .ui-state-highlight{color:#333 !important; background-color:#fff;}

.topData {
    float: right; 
    border-style: none !important;
    right: 5% !important;
    position: absolute;
    top: 60px;
    border: 0px solid #fff !important;
    z-index: 99;
}

.topData tbody tr td {
    border: 0px solid #fff !important;
}

.topData tbody tr td label {
    color: #ac1409 !important;
}

.wrapper {
    flex: 1 0 auto;
}

body:before {
    content: '';
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: -1;
    bottom: 0;
    left: 0;
    background: linear-gradient(to bottom, #fff, #fff 44vh, #ccc 44vh);
    background-attachment: fixed;
    background-repeat: no-repeat;
}

body:after {
    content: '';
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: -1;
    bottom: 0;
    left: 0;
    background: url('/javax.faces.resource/img/bg_logo_d.png.xhtml') left bottom;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: 50%;
}

#desktopMenu {
    width: 100%;
    height: 80px;
    background: #f7121c;
    background: -moz-linear-gradient(left, #f7121c 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121c 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121c 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121c', endColorstr='#a61407',GradientType=1 );
    box-shadow: inset 0px -3px 5px 0px #a61407;
}

#desktopMenu nav {
    max-width: 1600px;
    margin: 0 auto;
    position: relative;
    height: 80px;
    width: 90%;
}

#desktopMenu nav .mobileMenu {
    display: none;
    width: 40px;
    height: 40px;
    border: 0px solid;
    background: transparent;
    cursor: pointer;
}

#desktopMenu nav .mobileMenu i {
    color: #fff;
    font-size: 2em;
    font-family: FontAwesome;
    font-style: normal;
}

#desktopMenu nav .headLogo {
    width: 160px;
    position: absolute;
}

#desktopMenu nav ul {
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: right;
    width: 100%;
    display: inline-block;
    height: 80px;
    line-height: 80px;
}

#desktopMenu nav ul li {
    display: inline-block;
    margin: 0 0 0 0.5%;
    font-family: FontAwesome;
    font-style: normal;
}


#desktopMenu nav ul li a {
    color: #fff;
    font-family: 'DIN Pro Medium';
    font-size: 1.1em
}
#desktopMenu nav ul li a.activeMenu {
    font-family: 'DIN Pro Black';
}
#desktopMenu nav ul li a.ui-widget.ui-commandlink, 
#desktopMenu nav ul li a:visited,
#desktopMenu nav ul li a:focus,
#desktopMenu nav ul li a:active,
#desktopMenu nav ul li a {  
    color: #fff !important;
    font-family: 'DIN Pro Medium' !important;
    font-size: 1.1em !important;
}

#sidebarMenu {
    display: none;
}

#sm-topmenu li {
    background-image: none !important;
    height: auto !important;
}
#sm-topmenu li a {
    color: #333 !important;
    display: block;
    line-height: 1 !important;
    margin: 0 0 !important;
    width: 100% !important;
    text-align: center;
    text-indent: 0 !important;
    height: 30px !important;
}

.tripleSaldoTablet, .tripleSaldoMobile {
    display: none;
}

#footerSlider {
    overflow: hidden;
    position: relative;
}

#footerSlider .slick-arrow {
    position: absolute;
    top: 45%;
    z-index: 99;
    border:0px solid #fff;
    background: transparent;
    width: 35px;
    height: 35px;
    text-align: center;
    cursor: pointer;
}

#footerSlider .slick-arrow i{
    color: #fff;
    font-size: 2em;
    font-family: FontAwesome;
    font-style: normal;
}

#footerSlider .slick-prev {
    left: 0;
}

#footerSlider .slick-next {
    right: 0;
}


.tripleSaldoDesktop {
    width: 100%;        
}

.Container96 {
    width: 95%;
    height: 25px;
    line-height: 25px;
    display: block;
}
.Container96 label {
    color: #ac1409 !important;
}

#sidebarMenu p {
    width: 100%;
    height: 70px;
    text-align: center;
    line-height: 90px;
    font-size: 3em;
    font-family: 'DIN Pro Bold';
    margin: 0;
}

#sidebarMenu ul {
    padding: 0;
    list-style: none;
    width: 85%;
    margin: 20px auto 0;
}

#sidebarMenu ul li {
    /*padding: 25px 0;*/
    border-bottom: 2px solid #999;
    text-indent: 20px;
    position: relative;
    height: 75px;
}


#sidebarMenu ul li .reporteria {
    background: url('/javax.faces.resource/img/ico-reportes.png.xhtml') no-repeat left center;
}

#sidebarMenu ul li .transacciones {
    background: url('/javax.faces.resource/img/ico-reportes.png.xhtml') no-repeat left center;
}

#sidebarMenu ul li .recargasMenu {
    background: url('/javax.faces.resource/img/ico-recargas.png.xhtml') no-repeat left center;
}

#sidebarMenu ul li .inicioMenu {
    width: 50px;
    background: url('/javax.faces.resource/img/ico-inicio.png.xhtml') no-repeat left center;
}

#sidebarMenu ul li .activacionesMenu {
	background: url('/javax.faces.resource/img/ico-activaciones.png.xhtml') no-repeat left center;
}

#sidebarMenu ul li .cambioPin {
	background: url('/javax.faces.resource/img/ico-ajustes.png.xhtml') no-repeat left center;
}

#sidebarMenu ul li .descargarApp {
	background: url('/javax.faces.resource/img/ico-paquetes.png.xhtml') no-repeat left center;
}

#sidebarMenu ul li .paquetesMenu {
    background: url('/javax.faces.resource/img/ico-paquetes.png.xhtml') no-repeat left center;
}

#sidebarMenu ul li .serviciosMenu {
	background: url('/javax.faces.resource/img/ico-servicios.png.xhtml') no-repeat left center;
}

#sidebarMenu ul li .chatMenu{
	background: url('/javax.faces.resource/img/ico-chats.png.xhtml') no-repeat left center;
}

#sidebarMenu ul li .ajustesMenu{
    background: url('/javax.faces.resource/img/ico-ajustes.png.xhtml') no-repeat left center;
}

#sidebarMenu ul li:last-child {
    border-bottom: 0px solid #666;
}

#sidebarMenu ul li a {
    color: #000 !important;
    font-size: 1.1em;
    font-family: 'DIN Pro Medium';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    text-indent: 60px;
    line-height: 75px;
}

#sidebarMenu .closeMenuBtn {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 36px;
    margin-left: 50px;
    width: 45px;
    height: 45px;
    line-height: 1;
    background: transparent;
    border: 1px solid #999;
    color: #666;
    border-radius: 50%;
    cursor: pointer;
}

#sidebarMenu .closeMenuBtn i {
    font-family: FontAwesome;
    font-style: normal;
}

#sidebarMenu .logoutBtn {
    font-size: 1.1em;
    font-family: 'DIN Pro Medium';
    margin: 20px auto 0;
    display: block;
    border: 0px solid;
    background: transparent;
    color: #999;
}

.myframe {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.myframe iframe {
    border-width: 0px;
}


.login-page h1 {
    color: #f7121d;
    text-align: center;
    font-weight: 900;
    font-family: 'DIN Pro Bold';
    font-size: 3.3em;
    margin: 30px auto 5px;
}

.login-page h2 {
    color: #000;
    text-align: center;
    font-family: 'DIN Pro Medium';
    font-size: 2.5em;
    margin:0;
}

.login-page h3 {
    color: #000;
    text-align: center;
    font-family: 'DIN Pro Medium';
    font-size: 1.5em;
    margin:0;
}

.loginForm {
    width: 36%;
    height: auto;
    background: #00000035;
    margin: 3% auto;
    border: 5px solid #fff;
    border-radius: 15px;
    padding: 20px;
    text-align: center;
}

.restablecerContraseña {
    color: red;
}

.loginForm label {
    width: 80%;
    margin: 5px auto;
    display: block;
    text-align: left;
    font-size: 1.3em;
}

.loginForm input {
    width: 80%;
    margin: 0 auto;
    display: block;
    padding: 10px;
    border: 0px solid #fff;
    border-radius: 5px;
    text-align: center;
    font-size: 1.3em;
}
.loginForm select {
    width: 85%;
    margin: 0 auto;
    display: block;
    padding: 10px;
    border: 0px solid #fff;
    border-radius: 5px;
    text-align: center;
    font-size: 1em;
}

.loginForm a {
    color: red !important;
    font-size: 1.3em;
    text-decoration: underline !important;
}
.loginForm input[type=submit],
.loginForm input[type=button] {
    width: 36%;
    display: block;
    padding: 10px 0;
    color: #fff;
    font-family: 'DIN Pro Bold';
    border: 0px solid #00000000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
}
.popUpOk,
.loginForm input[type=submit],
.loginForm input[type=button] {
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    margin: 15px auto 20px;
    min-width: 150px;
    border: 0px solid #fff;
    height: 46px; 
    color: #fff;
    border-radius: 15px;
    font-size: 1em;
    font-family: 'DIN Pro Bold';
    cursor:pointer;
}

.loginForm input.crear-cuenta {
    background: #515151;
    background: -moz-linear-gradient(left, #515151 0%, #272727 100%);
    background: -webkit-linear-gradient(left, #515151 0%,#272727 100%);
    background: linear-gradient(to right, #515151 0%,#272727 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#515151', endColorstr='#272727',GradientType=1 );
    margin: 10px auto;
}

/**********************/
.modalForm {
    width: 80%;
    max-width: 600px;
    height: auto;
    background: #CCC;
    margin: 3% auto;
    border: 2px solid #f00;
    border-radius: 15px;
    padding: 20px;
    text-align: center;
}
.modalForm table tbody,
.modalForm table tbody tr,
.modalForm table tbody tr td,
.modalForm table {
    width: 100%;
    display: block;
}


.modalForm label {
    width: 80%;
    margin: 5px auto;
    display: block;
    text-align: left;
    font-size: 1.3em;
}

.modalForm input {
    width: 80%;
    height: 10%;
    margin: 1px auto;
    display: block;
    padding: 10px;
    border: 0.5px solid #aeacac;
    border-radius: 5px;
    text-align: center;
    font-size: 1.3em;
}
.modalForm select {
    width: 100%;

}
.modalForm a {
    color: #000;
    font-size: 1.3em;
}
.modalForm input[type=submit],
.modalForm input[type=button] {
    width: 200px;
    display: block;
    padding: 10px 0;
    color: #fff;
    font-family: 'DIN Pro Bold';
    border: 0px solid #00000000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
}
.modalForm input[type=submit],
.modalForm input[type=button] {
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    margin: 15px auto 20px;
}

.modalForm input.cancelar {
    background: #515151;
    background: -moz-linear-gradient(left, #515151 0%, #272727 100%);
    background: -webkit-linear-gradient(left, #515151 0%,#272727 100%);
    background: linear-gradient(to right, #515151 0%,#272727 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#515151', endColorstr='#272727',GradientType=1 );
    margin: 10px auto;
}
/*********************************/
a.regresarPagina,
button.regresarPagina {
    display: none;
    border: 0px solid #fff;
    background: #0000;
    color: #666;
    font-size: 1em;
    position: absolute;
    left: 7%;
    cursor: pointer;
    z-index: 99;
    top: 65px;
}
a.regresarPagina i,
button.regresarPagina i {
    font-family: FontAwesome;
    font-style: normal;
}

.tituloIco-international-recharge {
    text-align: center;
    vertical-align: middle;
    position: relative;
}

.tituloIco-international-recharge h1 {
    margin: 0;
    padding: 0;
    height: 50px;
    vertical-align: middle;
    font-family: 'DIN Pro Black';
}

.tituloIco {
    text-align: center;
    vertical-align: middle;
    position: relative;
    margin: 3% auto;
}

.tituloIco img {
    display: inline-block;
    position:relative;
    vertical-align: middle;
}

.tituloIco .chatImg {
    display: inline-block;
    position:relative;
    vertical-align: middle;
    width: 50px;
    height: 50px;
}

.tituloIco h1 {
    display: inline-block;
    margin: 0;
    padding: 0;
    height: 50px;
    vertical-align: middle;
    font-family: 'DIN Pro Black';
}

.tituloIco .chat {
    display: inline-block;
    margin: 0;
    padding: 0;
    height: 30px;
    vertical-align: middle;
    font-size: 18px;
    font-family: 'DIN Pro Black';
}

.disponibleRecargas {
    font-family: 'DIN Pro Bold';
    text-align: center;
    font-size: 1.3em;
    display: block !important;
}

.disponibleRecargas span {
    font-family: 'DIN Pro Bold';
}

.formRecargas {
    width: 40%;
    height: 285px;
    margin: 2% auto;
    display: block;
}

.formRecargasPaque {    
    margin: 2% auto;
    display: block;
}

.formRecargas label {
    width: 80%;
    margin: 5px auto;
    display: block;
    text-align: left;
    font-size: 1.3em;
}

.formRecargas label {
    width: 80%;
    margin: 5px auto;
    display: block;
    text-align: left;
    font-size: 1.3em;
}

.formRecargas .ui-selectonemenu {
    width: 75%;
    margin: 0 auto;
    display: block;
    padding: 0 10px !important;      
        border: 0;
    text-align: center;    
    background: #f3f3f2;
    font-size: 1em;
    color: #000;
}

.formRecargas .ui-selectonemenu .ui-selectonemenu-label {
    width: 100%;
    margin: 0 auto;
    display: block;       
    border: 0;
    text-align: center;    
    background: #fff !important;
    font-size: 1em;
    color: #000;
    height: 37px;
    line-height: 37px;
}

.formRecargas input {
    width: 80%;
    margin: 0 auto;
    display: block;
    padding: 10px;
    border: 0px solid #fff;
    border-radius: 5px;
    text-align: center;
    font-size: 1.3em;
    background: #f3f3f2;
}

.formRecargas .formRecargasBtn .ui-button-text{
	width: 30%;
    display: block;
    padding: 10px 0;
    color: #fff;
    font-family: 'DIN Pro Bold';
    border: 0px solid #0000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    margin: 25px auto 0;
    box-shadow: 0px 0px 0px #000 !important;
}

.formRecargas .formRecargasBtn {
    width: 50%;
    display: block;
    padding: 10px 0;
    color: #fff;
    font-family: 'DIN Pro Bold';
    border: 0px solid #0000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    margin: 25px auto 0;
    box-shadow: 0px 0px 0px #000 !important;
}

.recargarNumero {
    width: 45%;
    background: #fff !important;
    margin: 80px auto 25px;
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 20px;
}

@media (max-width: 1024px) {
  	.recargarNumero {
  		width: 70%; 
  	}
}

@media (max-width: 768px) {
  	.recargarNumero {
  		width: auto; 
  	}
}

.recargarNumero p {
    font-family: 'DIN Pro Medium';
    font-size: 1.3em;
    text-indent: 35px;
}

.recargarNumero label {
    font-family: 'DIN Pro';
    font-size: 1.3em;
    width: 100%;
    display:block;
}

.formSeleccionPaquete .formRecargasBtn {
	all: unset;
    width: 30%;
    display: block;
    margin: 25px auto 0;
}

.formSeleccionPaquete .formRecargasBtn .ui-button-text {
	all: unset;
    color: #fff;
    font-family: 'DIN Pro Bold';
    border: 0px solid #0000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    box-shadow: 0px 0px 0px #000 !important;
}


@media (max-width: 400px) {
  	.formSeleccionPaquete .formRecargasBtn {
  		width: 40%; 
  	}
}

@media (max-width: 350px) {
  	.formSeleccionPaquete .formRecargasBtn {
  		width: 53%; 
  	}
}

.formRecargas button.formRecargasBtn span {
    border:0px solid #fff !important;
    padding: 0px !important;
    background: #0000;
    box-shadow: 0px 0px 0px #000 !important;
    font-size: 1em;
}

.formRecargasPaquetesConfirmar {
    max-width: 1000px;
    margin: 0 auto 50px;
}

.formRecargasPaquetesConfirmar .volver {
	float: left;
}

.formRecargasPaquetesConfirmar .volver .ui-button-text  {
	all: unset;
    background: #515151;
    background: -moz-linear-gradient(left, #515151 0%, #272727 100%);
    background: -webkit-linear-gradient(left, #515151 0%,#272727 100%);
    background: linear-gradient(to right, #515151 0%,#272727 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#515151', endColorstr='#272727',GradientType=1 );
    width: 150px;
    display: block;
    padding: 10px 0;
    color: #fff;
    font-family: 'DIN Pro Bold';
    border: 0px solid #0000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
}

.formRecargasPaquetesConfirmar .recargar {
	float: right;
}

.formRecargasPaquetesConfirmar .recargar .ui-button-text {
	all: unset;
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    width: 150px;
    display: block;
    padding: 10px 0;
    color: #fff;
    font-family: 'DIN Pro Bold';
    border: 0px solid #0000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
}

.formRecargasConfirmar {
    max-width: 1000px;
    margin: 0 auto 50px;
    display: none;
}

.confirmarRecarga {
    width: 45%;
    background: #fff;
    margin: 0 auto 25px;
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 20px;
    margin-top: 50px !important;
}

.confirmarRecarga p {
    font-family: 'DIN Pro Medium';
    font-size: 1.3em;
    text-indent: 35px;
}

.confirmarRecarga label {
    font-family: 'DIN Pro';
    font-size: 1.3em;
    width: 100%;
    display:block;
}

.formRecargasConfirmar input.volver {
    float: left;
    background: #515151;
    background: -moz-linear-gradient(left, #515151 0%, #272727 100%);
    background: -webkit-linear-gradient(left, #515151 0%,#272727 100%);
    background: linear-gradient(to right, #515151 0%,#272727 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#515151', endColorstr='#272727',GradientType=1 );
    width: 150px;
    display: block;
    padding: 10px 0;
    color: #fff;
    font-family: 'DIN Pro Bold';
    border: 0px solid #0000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
}

.formRecargasConfirmar input.recargar {
    float: right;
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    width: 150px;
    display: block;
    padding: 10px 0;
    color: #fff;
    font-family: 'DIN Pro Bold';
    border: 0px solid #0000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
}

.modalClaro {
    width: 600px;
    height: auto;
    background: #00000035;
    margin: 3% auto;
    border: 5px solid #fff;
    border-radius: 15px;
    padding: 20px;
    text-align: center;
}

.modalClaro img {
    width: 50px;
    height: 50px;
    display: block;
    margin: 50px auto;
}

.modalClaro.recargaFallida img {
    margin: 35px auto;
}

.modalClaro p {
    font-family: 'DIN Pro Bold';
    font-size: 1.3em;
    width: 90%;
    margin: 0px auto 30px;
    text-align: center;
    color: #fff;
    text-shadow: 1px 1px 20px #666;
}
.modalClaro p span {font-family: 'DIN Pro Bold';}

.modalClaro.recargaFallida p {
    width: 80%;
    margin: 0 auto 30px;
}

.modalClaro input[type=button] {
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    margin: 15px auto 20px;
    width: 36%;
    display: block;
    padding: 7px 0;
    color: #fff;
    font-family: 'DIN Pro Bold';
    border: 0px solid #0000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
}

.activacionRealizada, .activacionFallida, .recargaRealizada, .recargaFallida {
    display: none;
}

.formPaquetes {
    width: 65%;
    height: 330px;
    margin: 2% auto 2%;
    max-width: 1000px;
}

.formPaquetes label {
    width: 60%;
    margin: 5px auto;
    display: block;
    text-align: left;
    font-size: 1.3em;
}

.formPaquetes input {
    width: 60%;
    margin: 0 auto;
    display: block;
    padding: 13px;
    border: 0px solid #fff;
    border-radius: 5px;
    text-align: center;
    font-size: 1.3em;
    background: #f3f3f2;
}

.formPaquetes input.recargar {
    width: 30%;
    min-width: 150px;
    display: block;
    padding: 10px 0;
    color: #fff;
    font-family: 'DIN Pro Black';
    border: 0px solid #0000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    margin: 25px auto 0;
}

.formPaquetes .wrapperTipoPaquete {
}

.formPaquetes .wrapperTipoPaquete p {
    font-size: 1.1em;
}

.formPaquetes .wrapperTipoPaquete .contBtnPaquete {
}

.formPaquetes .wrapperTipoPaquete .contBtnPaquete input {
    display:inline-block;
    border: 2px solid #fff;
    width: 23.666%;
    margin: 0 0.6666667%;
    height: 50px;
    border-radius: 9px;
    font-size: 1em;
    box-shadow: 1px 1px 10px #00033333;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: left center;
    background-color: #fff;
    background-size: contain;
    transition: all 0.3s ease;
}

.formPaquetes .wrapperTipoPaquete .contBtnPaquete input.seleccionado {
    border: 2px solid #f7121d;
}

.formPaquetes .wrapperTipoPaquete .contBtnPaquete input.paquete-voz {
    background-image: url('/javax.faces.resource/ico-paquete-voz.png.xhtml?ln=img');
}

.formPaquetes .wrapperTipoPaquete .contBtnPaquete input.paquete-datos {
    background-image: url('/javax.faces.resource/ico-paquete-datos.png.xhtml?ln=img');
}

.formPaquetes .wrapperTipoPaquete .contBtnPaquete input.paquete-mensaje {
    background-image: url('/javax.faces.resource/ico-paquete-mensajes.png.xhtml?ln=img');
}

.formPaquetes .wrapperTipoPaquete .contBtnPaquete input.paquete-todo {
    background-image: url('/javax.faces.resource/ico-paquete-todo.png.xhtml?ln=img');
}

.radioContainer {
    display: block;
    position: relative;
    padding-left: 30px;
    margin-bottom: 15px;
    cursor: pointer;
    font-size: 1.1em;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.radioContainer input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.checkmark {
    position: absolute;
    top: 1px;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #fff;
    border-radius: 0;
    border: 1px solid #666;
}

.radioContainer:hover input ~ .checkmark {
    background-color: #ccc;
}
.radioContainer input.checked ~ .checkmark,
.radioContainer input:checked ~ .checkmark {
    background-color: #000;
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}
.radioContainer input.checked ~ .checkmark:after,
.radioContainer input:checked ~ .checkmark:after {
    display: block;
}

.radioContainer .checkmark:after {
    top: 9px;
    left: 9px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #000;
}

.formIngresoNumero {
    max-width: 991px;
    width: 90%;
    margin: 0 auto 25px;
    clear: both;
    position: relative;
    overflow: hidden;
}

.formIngresoNumero input {
    width: 98%;
    margin: 0 auto 0px;
    display: block;
    padding: 10px 0;
    border: 0px solid #fff;
    border-radius: 5px;
    text-align: center;
    font-size: 1.3em;
    background: #f3f3f2;
}

.formIngresoNumero .siguiente {
    border: 0px solid #fff;
    height: 46px;
    width: 100%;
    color: #fff;
    border-radius: 15px;
    font-size: 15px;
    font-family: 'DIN Pro Bold';
    background: #f7121d;
    background: -moz-linear-gradient(left, #A4A4A4 0%, #A4A4A4 100%);
    background: -webkit-linear-gradient(left, #A4A4A4 0%,#A4A4A4 100%);
    background: linear-gradient(to right, #A4A4A4 0%,#A4A4A4 100%);
    cursor: pointer;
}

.formIngresoNumero label {
    width: 100%;
    display: block;
    font-size: 1em;
    color: #000;
}

.confirmarNumero {
    width: 45%;
    background: #fff;
    margin: 0 auto 25px;
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 20px;
}

.formSeleccionPaquete {
    display: block !important;
    max-width: 991px;
    width: 90%;
    margin: 0 auto 25px;
    clear: both;
    position: relative;
    overflow: hidden;
}

.formSeleccionPaquete label {
    width: 100%;
    display: block;
    font-size: 1em;
    color: #000;
}

.formSeleccionPaquete .ui-panelgrid-cell select {
    width: 100% !important;
    text-align: left;
    text-indent: 5px;
    font-size: 1em;
}

.formSeleccionPaquete .ui-panelgrid-cell div:first-child {
    width: 100%;
    background: #fff;
    padding: 0 !important;
}

.descPaqueteWrap .ui-panel {
    border: 0px solid #fff;
}

.ui-selectonemenu .ui-selectonemenu-trigger, .ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger{
    background: -webkit-linear-gradient(top, #c00 0%, #c00 100%) !important;
    border: 1px solid #c00 !important  ;
    box-shadow: inset 0 0 0 1px #c00 !important;
    top: 0 !important;
    height: 49px;
}
.formSeleccionPaquete select {
    width: 100%;
    margin: 0 auto 0px;
    display: block;
    padding: 10px 0;
    border: 0px solid #fff;
    border-radius: 5px;
    text-align: center;
    font-size: 1.3em;
    background: #f3f3f2;
}

.formSeleccionPaquete input {
    width: 98%;
    margin: 0 auto 0px;
    display: block;
    padding: 10px 0;
    border: 0px solid #fff;
    border-radius: 5px;
    text-align: center;
    font-size: 1.3em;
    background: #f3f3f2;
}

.confirmacionCompraPaquete input {
    width: 98%;
    margin: 0 auto 0px;
    display: block;
    padding: 10px 0;
    border: 0px solid #fff;
    border-radius: 5px;
    text-align: center;
    font-size: 1.3em;
    background: #f3f3f2;
    
}

.confirmacionCompraPaquete .controllerPaquetes, .formSeleccionPaquete .controllerPaquetes {
    width: 95%;
    height: 50px;
    float: left;
    clear: both;
    margin: 10px 0 0;
}

.confirmacionCompraPaquete .controllerPaquetes input,
.formSeleccionPaquete .controllerPaquetes input {
    border: 0px solid #fff;
    color: #fff;
    font-family: 'DIN Pro Black';
    height: 50px;
    border-radius: 10px;
    margin: 15px 0;
    font-weight: bold;
    width: 150px;
    margin: 0 0;
    font-size: 1.1em;
    cursor: pointer;
}

.confirmacionCompraPaquete .controllerPaquetes input.volver,
.formSeleccionPaquete .controllerPaquetes input.volver {
    float: left;
    clear: left;
    background: #515151;
    background: -moz-linear-gradient(left, #515151 0%, #272727 100%);
    background: -webkit-linear-gradient(left, #515151 0%,#272727 100%);
    background: linear-gradient(to right, #515151 0%,#272727 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#515151', endColorstr='#272727',GradientType=1 );
}

.controllerPaquetes input.recargar,
.formSeleccionPaquete .controllerPaquetes input.recargar {
    float: right;
    clear: right;
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    margin: 0 0;
}

.controllerPaquetes input.recargar,
.formSeleccionPaquete .controllerPaquetes input.ingresar {
    float: right;
    clear: right;
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    margin: 0 0;
}

.formSeleccionPaquete .paquetesDisponibles {
    width: 45%;
    float: left;
    clear: right;
    position: relative;
}

.formSeleccionPaquete .paquetesDisponibles p {
    font-size: 1.2em;
    font-weight: bold;
}

#accordionPaquetes .ui-accordion-content label {
    margin: 25px auto;
    width: 270px;
}

.formSeleccionPaquete .descPaquete {
    width: 45%;
    float: right;
    clear: right;
}

.formSeleccionPaquete .descPaquete strong {
    width: 100%;
    display: block;
    font-size: 1.1em;
}

.formSeleccionPaquete.propuestaSeleccion2 .descPaquete strong {
    width: 100%;
    display: block;
    font-size: 1.1em;
    margin: 40px 0 0;
}

.formSeleccionPaquete .descPaquete strong span {
    float: right;
}

.formSeleccionPaquete .descPaquete input.seguir {
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    border: 0px solid #fff;
    color: #fff;
    font-family: 'DIN Pro Bold';
    height: 45px;
    border-radius: 10px;
    float: right;
    margin: 15px 0;
    font-weight: bold;
    width: 80%;
    font-size: 1.1em;
    cursor: pointer;
}

.formSeleccionPaquete .descPaquete .descPaqueteWrap {
    border: 1px solid #999;
    border-radius: 10px;
    background: #fff;
    padding: 15px 25px;
    margin: 0 0 15px;
}

.formSeleccionPaquete.propuestaSeleccion2 .descPaquete .descPaqueteWrap {
    border: 1px solid #999;
    border-radius: 10px;
    padding: 15px 25px;
    margin: 0 0 15px;
    height: 430px;
}

.formSeleccionPaquete .descPaquete .descPaqueteWrap h3 {
    font-size: 1.2em;
    font-weight: bold;
}

.formSeleccionPaquete .descPaquete .descPaqueteWrap ul {
}

.formSeleccionPaquete .descPaquete .descPaqueteWrap ul li {
    font-size: 1.1em;
}

.formSeleccionPaquete .descPaquete .descPaqueteWrap ul li p {
    margin: 0 0 5px;
    font-weight: bold;
    font-size: 1.1em;
}

.formSeleccionPaquete .descPaquete .descPaqueteWrap ul li span {
    display: block;
    font-size: 1.1em;
}

.confirmacionCompraPaquete {
    max-width: 1000px;
    margin: 50px auto 50px !important;
    display: block !important;
}

.confirmacionCompraPaquete .descPaquete {
    width: 45%;
    background: #fff;
    margin: 0 auto 25px;
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 30px;
}

.confirmacionCompraPaquete strong {
    width: 45%;
    margin: 10px auto 15px;
    display: block;
}

.confirmacionCompraPaquete strong span {
    float: right;
}

.confirmacionCompraPaquete .floatSpan {
    float: right;
}

#accordionPaquetes {
}

#accordionPaquetes h3 {
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: left center;
    background-color: #f3f3f2;
    background-size: contain;
    padding: 0;
    height: 50px;
    line-height: 50px;
    text-indent: 50px;
    margin: 10px 0 0;
    border: 0px solid;
    font-family: 'DIN Pro Bold';
}

#accordionPaquetes h3:first-child {
    margin: 0 0;
}

#accordionPaquetes h3[aria-selected=true] {
    color: #000;
}

#accordionPaquetes h3.tituloPaqueteVoz {
    background-image: url('/javax.faces.resource/ico-paquete-voz.png.xhtml?ln=img');
}

#accordionPaquetes h3.tituloPaqueteDatos {
    background-image: url('/javax.faces.resource/ico-paquete-datos.png.xhtml?ln=img');
}

#accordionPaquetes h3.tituloPaqueteMensajes {
    background-image: url('/javax.faces.resource/ico-paquete-mensajes.png.xhtml?ln=img');
}

#accordionPaquetes h3.tituloPaqueteTodo {
    background-image: url('/javax.faces.resource/ico-paquete-todo.png.xhtml?ln=img');
}

#accordionPaquetes h3 span {
    display: none;
}

#accordionPaquetes div {
    overflow: hidden;
    padding: 0 !important;
    margin: 0 0 10px;
    height: 0px;
    transition:all 0.5s ease-in-out;
}

#accordionPaquetes div.ui-accordion-content-active {
    height: 260px !important;
}

.bannerTripleSaldo {
    flex-shrink: 0;
}

.seleccionTipoActivacion {
    max-width: 1100px;
    margin: 0 auto;
    width: 80%;
}

.seleccionTipoActivacion p {
    font-size: 1.3em;
    margin: 10px 1%;
}

.seleccionTipoActivacion .contBtnActivaciones {
    position: relative;
}
.seleccionReporte .contBtnReportes a,
.seleccionTipoActivacion .contBtnActivaciones a,
.seleccionTipoActivacion .contBtnActivaciones input {
    background-repeat: no-repeat !important;
    background-position: left center !important;
    background-color: #f3f3f2 !important;
    background-size: contain !important;
    border: 0px solid !important;
    border-radius: 10px !important;
    box-shadow: 1px 1px 10px #00033333 !important;
    cursor: pointer !important;
    font-family: 'DIN Pro Medium' !important;
    height: 50px !important;
    line-height: 50px !important;
    margin: 10px 1% 0 !important;
    padding: 0 !important;
    text-align: left !important;
    text-indent: 50px !important;
    vertical-align: top !important;
    width: 27% !important;
    display: inline-block;
    color: #333  !important;
}
.seleccionReporte .contBtnReportes a:last-child,
.seleccionTipoActivacion .contBtnActivaciones a:last-child,
.seleccionTipoActivacion .contBtnActivaciones input:last-child {
    overflow: hidden;
    white-space: normal;
    text-indent: 0px;
    padding: 0 0 0 50px;
}

.seleccionTipoActivacion .contBtnActivaciones .kit {
    background-image: url('/javax.faces.resource/activaciones-kit.png.xhtml?ln=img');
}

.seleccionTipoActivacion .contBtnActivaciones .portabilidad {
    background-image: url('/javax.faces.resource/activaciones-portabilidad.png.xhtml?ln=img');
}

.seleccionTipoActivacion .contBtnActivaciones .sim {
    background-image: url('/javax.faces.resource/activaciones-sim.png.xhtml?ln=img');
}

.seleccionTipoActivacion .contBtnActivaciones .modem {
    background-image: url('/javax.faces.resource/activaciones-modem.png.xhtml?ln=img');
}

.seleccionTipoActivacion .contBtnActivaciones .renovacion {
    background-image: url('/javax.faces.resource/activaciones-renovacion.png.xhtml?ln=img');
}

.scannerSIM {
    width: 80%;
    height: 60vh;
    margin: 0 auto;
    max-width: 1100px;
}

.scannerSIM p {
    font-size: 1.3em;
    margin: 10px auto;
    width: 75%;
}

.scannerSIM div {
    height: 60%;
    width: 75%;
    background: #000;
    margin: 0 auto;
}

.scannerSIM input {
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    width: 30%;
    min-width: 170px;
    display: block;
    padding: 10px 0;
    color: #fff;
    font-family: 'DIN Pro Black';
    border: 0px solid #0000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
    margin: 25px auto;
}

.formWrapper {
    max-width: 1100px;
    margin: 0 auto;
    width: 80%;
}

.formWrapper p {
    font-size: 1.2em;
    margin: 2% 1.333%;
}

.formWrapper .formActivaciones {
    vertical-align: hight;
}

.formWrapper .formCorporativos {
    position: relative;
    vertical-align: right;
}

.formWrapper .formActivaciones label {
    width: 30%;
    display: inline-block;
    vertical-align: top;
    margin: 0 1.333% 20px;
    font-size: 1.2em;
    position: relative;
}

.formWrapper .formActivaciones label select, 
.formWrapper .formActivaciones label input, 
.formWrapper .formActivaciones label div.ui-selectonemenu{
    width: 100%;
    background-color: #f3f3f2;
    border: 0px solid;
    height: 50px;
    text-indent: 15px;
    border-radius: 5px;
    margin: 5px 0 0;
}

.formWrapper .formActivaciones label div.ui-selectonemenu {
    width: 100%;
    line-height: 35px;
    text-indent: 0;
    padding: 0 !important;
}

.formWrapper .formActivaciones label div.ui-selectonemenu label {
    width: 90%;
    background: #f3f3f2;
}

.formWrapper .formActivaciones label select {
    background: url('/javax.faces.resource/flecha.png.xhtml?ln=img') no-repeat 95% center #f3f3f2;
    background-size: 15px;
    -webkit-appearance: none;
    appearance: none;
}
.formWrapper .formActivaciones input[type=button],
.formWrapper .formActivaciones button {
    width: 200px;
    display: block;
    padding: 10px 0;
    color: #fff;
    font-family: 'DIN Pro Black';
    border: 0px solid #0000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    margin: 10px auto 30px;
}

/* .formWrapper .formActivaciones button span {
	background: none;
	border: none;
	box-shadow: none;
	font-size: 1.3em;
}

.formWrapper .formActivaciones .ui-state-active {
	background: none;
	border: none;
	box-shadow: none;
} */

.formWrapper .formActivaciones input.activar{
    width: 200px;
    display: block;
    padding: 10px 0;
    color: #fff;
    font-family: 'DIN Pro Black';
    border: 0px solid #0000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    margin: 10px auto 30px;
}
.miniformRenovacionPrepago {
    max-width: 1100px;
    width: 80%;
    margin: 0 auto;
}

.miniformRenovacionPrepago p {
    margin: 0 auto 15px;
    width: 95%;
}

.miniformRenovacionPrepago label {
    width: 45%;
    display: inline-block;
    margin: 0 2.33333333%;
    font-size: 1.3em;
}

.miniformRenovacionPrepago label input {
    width: 100%;
    padding: 10px;
    border: 0px solid #fff;
    border-radius: 5px;
    text-align: center;
    font-size: 1.3em;
    background: #f3f3f2;
    margin: 10px 0 25vh;
}

.miniformRenovacionPrepago .miniformController {
    width: 95%;
    margin: 0 auto;
}
.wrapperTerminos .termsController input,
.wrapperTerminos .termsController button,
.miniformRenovacionPrepago .miniformController button {
    border: 0px solid #fff;
    color: #fff;
    font-family: 'DIN Pro Black';
    height: 50px;
    border-radius: 10px;
    margin: 15px 0;
    font-weight: bold;
    width: 150px;
    margin: 0 0;
    font-size: 1.1em;
    cursor: pointer;
}
.wrapperTerminos .termsController input.volver,
.wrapperTerminos .termsController input.volver,
.miniformRenovacionPrepago .miniformController input.volver {
    float: left;
    clear: left;
    background: #515151;
    background: -moz-linear-gradient(left, #515151 0%, #272727 100%);
    background: -webkit-linear-gradient(left, #515151 0%,#272727 100%);
    background: linear-gradient(to right, #515151 0%,#272727 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#515151', endColorstr='#272727',GradientType=1 );
}

.wrapperTerminos .termsController input.recargar, .wrapperTerminos .termsController input.recargar, .miniformRenovacionPrepago .miniformController input.recargar {
    float: right;
    clear: right;
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    margin: 0 0;
}

.wrapperTerminos {
    max-width: 1100px;
    margin: 0 auto 90px;
    width: 80%;
    text-align: justify;
}

.wrapperTerminos h1 {
    font-size: 1em;
}

.wrapperTerminos .termsController {
    width: 100%;
    margin: 0 auto;
}

.seleccionTipoServicio {
    max-width: 1100px;
    width: 80%;
    margin: 0 auto;
}

.seleccionTipoServicio p, .seleccionTipoServicio .contBtnServicios {
    width: 580px;
    margin: 0 auto 15px;
    display: block;
}

.seleccionTipoServicio .contBtnServicios input {
    background-repeat: no-repeat;
    background-position: left center;
    background-color: #f3f3f2;
    background-size: contain;
    border: 0px solid;
    border-radius: 10px;
    box-shadow: 1px 1px 10px #00033333;
    cursor: pointer;
    font-family: 'DIN Pro Medium';
    height: 50px;
    line-height: 1;
    margin: 10px 1% 0;
    text-align: left;
    padding: 0 0 0 50px;
    vertical-align: top;
    width: 48%;
}

.seleccionTipoServicio .contBtnServicios input.bloqueo {
    background-image: url('/javax.faces.resource/activaciones-bloqueo.png.xhtml?ln=img');
}

.seleccionTipoServicio .contBtnServicios input.consulta {
    background-image: url('/javax.faces.resource/activaciones-consulta.png.xhtml?ln=img');
}

.seleccionAjuste {
    width: 500px;
    margin: 0 auto 15px;
    display: block;
}

.seleccionAjuste p {
    font-family: 'DIN Pro Medium';
}

.seleccionAjuste .contBtnAjustes {
}

.seleccionAjuste .contBtnAjustes button {
    background-repeat: no-repeat;
    background-position: left center;
    background-color: #f3f3f2;
    background-size: contain;
    border: 0px solid;
    border-radius: 10px;
    box-shadow: 1px 1px 10px #00033333;
    cursor: pointer;
    font-family: 'DIN Pro Medium';
    height: 50px;
    line-height: 1;
    margin: 10px 1% 0;
    text-align: left;
    padding: 0 0 0 50px;
    vertical-align: top;
    width: 46%;
}

.seleccionAjuste .contBtnAjustes button[name=actualizar] {
    background-image: url('/javax.faces.resource/ajustes-actualizar.png.xhtml?ln=img');
}

.seleccionAjuste .contBtnAjustes button[name=cambiar] {
    background-image: url('/javax.faces.resource/ajustes-cambiar.png.xhtml?ln=img');
}

.seleccionReporte {
    max-width: 1100px;
    width: 80%;
    margin: 0 auto;
}

.seleccionReporte p {
    font-size: 1.3em;
}

.seleccionReporte .contBtnReportes {
    width: 100%;
    position: relative;
    margin: 0 auto 25px;
}

.seleccionReporte .contBtnReportes input {
    background-repeat: no-repeat;
    background-position: left center;
    background-color: #f3f3f2;
    background-size: contain;
    border: 0px solid;
    border-radius: 10px;
    cursor: pointer;
    font-family: 'DIN Pro Medium';
    height: 50px;
    line-height: 1;
    margin: 10px 1.666%;
    text-align: left;
    padding: 0 0 0 50px;
    vertical-align: top;
    width: 30%;
}



.seleccionReporte .contBtnReportes input.ventas {
    background-image: url('/javax.faces.resource/reportes-ventas.png.xhtml?ln=img');
    border: 1px solid;
    border-color: #333;
    background-color: #f3f3f2;
}

.seleccionReporte .contBtnReportes input.sim {
    background-image: url('/javax.faces.resource/reportes-sim.png.xhtml?ln=img');
}

.seleccionReporte .contBtnReportes input.inventarios {
    background-image: url('/javax.faces.resource/reportes-inventarios.png.xhtml?ln=img');
}

.seleccionReporte .contBtnReportes input.proyeccion {
    background-image: url('/javax.faces.resource/reportes-proyeccion.png.xhtml?ln=img');
}

.seleccionReporte .contBtnReportes input.dias {
    background-image: url('/javax.faces.resource/reportes-dias.png.xhtml?ln=img');
}

.seleccionReporte .contBtnReportes input.incentivos {
    background-image: url('/javax.faces.resource/reportes-incentivos.png.xhtml?ln=img');
}

.controllerReportes {
    max-width: 1100px;
    width: 80%;
    display: block;
    margin: 0px auto 20px;
}

.controllerReportes p {
}

.controllerReportes select {
    width: 30%;
    background-color: #f3f3f2;
    border: 0px solid;
    height: 50px;
    padding: 0 15px;
    border-radius: 5px;
    margin: 5px 0 0;
    background: url('/javax.faces.resource/flecha.png.xhtml?ln=img') no-repeat 95% center #f3f3f2;
    font-family: 'DIN Pro Bold';
    background-size: 15px;
    -webkit-appearance: none;
    appearance: none;
}

.tablaReporte {
    margin: 0 auto;
    max-width: 1100px;
    width: 100%;
}

.tablaReporte table {
    border: 2px solid #fff;
    margin: 0;
    padding: 0;
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
}
.tablaReporte table tbody input {
    text-align: center;
    background: #f7121d;
    color: #fff;
    padding: 0 15px;
    height: 40px;
    line-height: 40px;
    border: 0px solid;
    border-radius: 10px;
    cursor:pointer;
}
.tablaReporte table tfoot input {
    text-align: center;
    background: #f7121d;
    color: #fff;
    width: 160px;
    height: 40px;
    line-height: 40px;
    border: 0px solid;
    border-radius: 10px;
    cursor:pointer;
}

.tablaReporte table tr {
    border: 1px solid #ddd;
    padding: 0px;
}

.tablaReporte table tbody tr {
    background:#fff;
}
.tablaReporte table tbody tr:nth-child(2n+1) {
    background: #f3f3f2;
}
.ui-datatable table thead tr th,
.tablaReporte table th {
    padding: 10px !important;
    text-align: center;
    text-align: center;
    background: #f7121d !important;
    color: #fff !important;
}

.tablaReporte table td {
    padding: 10px;
    text-align: center;
    text-align: center;
    border-left: 1px solid #000;
}


.tablaReporte table th {
    font-size: 14px;
    letter-spacing: 0px;
    border-left: 1px solid #000;
}

.tablaReporte table td:first-child, .tablaReporte table th:first-child {
    border-left: 0px solid #000;
}

.controllerExsportacion {
    margin: 20px auto 100px;
    max-width: 1100px;
    width: 65%;
}
tfoot input,
.controllerExportacion button {
    border: 0px solid #fff;
    color: #fff;
    font-family: 'DIN Pro Black';
    height: 50px;
    border-radius: 10px;
    margin: 15px 0;
    font-weight: bold;
    width: 190px;
    margin: 0 0;
    font-size: 1.1em;
    cursor: pointer;
}
tfoot input.volver,
.controllerExportacion button[name=volver] {
    float: left;
    clear: left;
    background: #515151 !important;
    background: -moz-linear-gradient(left, #515151 0%, #272727 100%) !important;
    background: -webkit-linear-gradient(left, #515151 0%,#272727 100%) !important;
    background: linear-gradient(to right, #515151 0%,#272727 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#515151', endColorstr='#272727',GradientType=1 ) !important;
}
tfoot input.exportar,
.controllerExportacion button[name=exportar] {
    float: right;
    clear: right;
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    margin: 0 0;
}

.splash {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: url('/javax.faces.resource/splash.png.xhtml?ln=img') no-repeat center /cover;
    opacity: 1;
    transition: all 0.5s ease-in-out;
    z-index: 9999999;
}

.splashMask {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: #ff000085;
    opacity: 1;
    transition: all 0.5s ease-in-out;
    z-index: 9999999;
}

.chatWrapper {
    width: 95%;
    height: 80vh;
    margin: 0 auto 25px;
    background: #000;
}

.seleccionAdmin {
    width: 75%;
    display:block;
    margin: 0 auto;
    max-width: 1100px;
}
.seleccionAdmin form a {
    width: 31.333%;
    display: inline-block;
    color: #666;
    background-repeat: no-repeat;
    background-position: 5px center;
    background-color: #f3f3f2;
    background-size: auto 85%;
    border: 0px solid;
    border-radius: 10px;
    box-shadow: 1px 1px 10px #00033333;
    cursor: pointer;
    font-family: 'DIN Pro Medium';
    height: 50px;
    line-height: 50px;
    margin: 10px 1% 0;
    padding: 0;
    text-align: center;
}
.seleccionAdmin form a.adminNoticias {
    background-image: url('/javax.faces.resource/ico-reportes.png.xhtml?ln=img');
}
.seleccionAdmin form a.adminAdmin {
    background-image: url('/javax.faces.resource/ico-ajustes.png.xhtml?ln=img');
}
.seleccionAdmin form a.adminPaquetes {
    background-image: url('/javax.faces.resource/ico-paquetes.png.xhtml?ln=img');
}

table.formSeleccionPaquete {}
table.formSeleccionPaquete tr {}
table.formSeleccionPaquete tr td {
    float: left;
    width: 100%;
    position: relative;
    margin: 0 0 15px;
}
table.formSeleccionPaquete tr td label {
    cursor:pointer;
}
table.formSeleccionPaquete tr td input {
    display:none;
}

.ui-selectonemenu .ui-selectonemenu-trigger .ui-icon {
    margin-top: 100% !important;
}

.controllerReportes .ui-selectonemenu .ui-selectonemenu-trigger .ui-icon {
    margin-top: 50% !important;
}

.formWrapper .formActivaciones label input {
    padding: 0 !important;
    background: #f3f3f2;
}

.reporteLabelMobile {
    display: none;
}
.ui-datepicker .ui-datepicker-header {
    border: solid 1px #871717 !important;
    background: #c91515;
    background: -moz-linear-gradient(top, #c91515 0%, #b10b0b 100%) !important;
    background: -webkit-gradient(left top, left bottom, color-stop(0%, #c91515), color-stop(100%, #b10b0b)) !important;
    background: -webkit-linear-gradient(top, #c91515 0%, #b10b0b 100%) !important;
    background: -o-linear-gradient(top, #c91515 0%, #b10b0b 100%) !important;
    background: -ms-linear-gradient(top, #c91515 0%, #b10b0b 100%) !important;
    background: linear-gradient(to bottom, #c91515 0%, #b10b0b 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c91515', endColorstr='#b10b0b', GradientType=0 ) !important;
}

.ui-datepicker:hover, .ui-datepicker:focus {
    border: solid 1px #E12727 !important;
}

.consultaReporte, .consultaReporte span.ui-button-text {
    float: right;
    clear: right;
    background: #f7121d !important;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%) !important;
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%) !important;
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 ) !important;
    margin: 0 0;
    border: solid 0px #a83232;
    box-shadow: none;
    text-shadow: none;
}
.ui-button.ui-state-hover .ui-button-text, .ui-buttonset .ui-state-hover .ui-button-text{color:#fff;}

#dlgDet .ui-dialog-titlebar,
.ui-paginator.ui-paginator-top {
    display: none;
}

.ui-datatable .ui-paginator .ui-state-active, .ui-datatable .ui-paginator .ui-paginator-pages .ui-state-active {
    background-color: #E12727 !important;
    color: #ffffff !important;
    background-repeat: no-repeat;
    border: solid 1px #e12727 !important;
}
.ui-datepicker-header .ui-datepicker-prev-hover{
    background-color: #e12727; 
    left:3px; 
    top:3px;
}
.ui-datepicker-header .ui-datepicker-next-hover{
    background-color: #e12727; 
    right:3px; 
    top:3px;
}
.ui-datatable:hover, .ui-datagrid:focus {
    border: solid 1px #E12727 !important;
}

.ui-inputfield.ui-state-hover, .ui-inputfield.ui-state-focus{
    border:solid 1px #E12727; color:#E12727 !important;
}

.alignReport {
    max-width: 1100px;
    display: block;
    margin: 0 auto;
}

.DispFlex {
	display: flex;
}


.justifyCenter {
	justify-content: center;
}

.myLittleMenu .ui-corner-right {
    height: 32px;
}

.myLittleMenu .ui-corner-right .ui-icon {
    margin-top: 8px !important;
}


.rango1 input, .rango2 input {
    width: 130px;
    display: block;
    margin: 0 auto;
}
.RedButton .ui-button-text {
    box-shadow: none;
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    border: 0px solid #fff;
}


.cancelar .ui-button-text {
    box-shadow: inset 0 0 0 1px #8a8a8a;
    border: solid 0px #8a8a8a;
    text-shadow: 0 -1px 0 #8a8a8a;
    background: #8a8a8a;
    background: -moz-linear-gradient(top, #8a8a8a 0%, #646464 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, #8a8a8a),
        color-stop(100%, #646464));
    background: -webkit-linear-gradient(top, #8a8a8a 0%, #646464 100%);
    background: -o-linear-gradient(top, #8a8a8a 0%, #646464 100%);
    background: -ms-linear-gradient(top, #8a8a8a 0%, #646464 100%);
    background: linear-gradient(to right, #8a8a8a 0%, #646464 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8a8a8a',
        endColorstr='#646464', GradientType=0);
}

.cancelar:hover .ui-button-text, .cancelar:focus .ui-button-text {
    color: white !important;
    border:none;
    background: white;
    background: -moz-linear-gradient(top, #646464 0%, #c91515 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, #646464),
        color-stop(100%, #c91515));
    background: -webkit-linear-gradient(top, #b10b0b 0%, #545454 100%);
    background: -o-linear-gradient(top, #646464 0%, #545454 100%);
    background: -ms-linear-gradient(top, #646464 0%, #545454 100%);
    background: linear-gradient(to bottom, #646464 0%, #545454 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b10b0b',
        endColorstr='#c91515', GradientType=0);
}


.RedButton.ui-button-icon-only .ui-icon.fa {
    margin-top: -6px !important;
}
#dlgDet {
    width: 100% !important;
    margin: 0;
    border-radius: 0;
    top: 0 !important;
}

.excelLabel {
    vertical-align: top;
    cursor:pointer;
}  
.formSeleccionPaquete .paquetesDisponibles label {
    margin-left: 0px;
    width: 90%;
    height: 49px;
    line-height: 49px;
    padding: 0 10px !important;
}



.formSeleccionPaquete .paquetesDisponibles label.text-label-left {
    height: 20px;
    line-height: 1;
}


/******************* Responsive media queries*/

@media (max-width: 2600px) {
    .tripleSaldoDesktop {
        width: 100%;
        bottom: -5px;
        margin: 0;
        position: relative;
        max-height: 250px;
        min-height: 200px;
    }
    .confirmacionCompraPaquete {
        max-width: 70%;
        margin: 0 auto 100px;
        display: block !important;
    }

    #desktopMenu {
        height: 75px;
    }

    #desktopMenu nav {
        max-width: 1500px;
        height: 60px;
        width: 100%;
    }

    #desktopMenu nav .headLogo {
        width: 120px;
    }

    #desktopMenu nav ul {
        height: 60px;
        line-height: 60px;
    }

    #desktopMenu nav ul li a {
        font-size: 1.1em;
    }

    .loginForm {
        width: 45%;
        margin: 2% auto;
    }

    .login-page h1 {
        font-size: 3em;
        margin: 20px auto 0px;
    }

    .login-page h2 {
        font-size: 2em;
    }

    .scannerSIM button, .seleccionReporte p, .seleccionReporte .contBtnReportes button, .miniformRenovacionPrepago label, .miniformRenovacionPrepago label input, .miniformRenovacionPrepago .miniformController button, .formWrapper .formActivaciones label, .formWrapper .formActivaciones label select, .formWrapper .formActivaciones label input, .formWrapper .formActivaciones button, .seleccionTipoActivacion p, .confirmarRecarga p, .confirmarRecarga label, .formRecargasConfirmar button[name=volver], .formRecargasConfirmar button[name=recargar], .loginForm label, .loginForm input, .loginForm button, .loginForm a {
        font-size: 1.1em;
    }

    .formRecargasConfirmar {
        max-width: 70%;
        margin: 0 auto 100px;
    }
}

@media (max-width: 1440px) {
   #desktopMenu nav ul li {
        margin: 0 0 0 1%;
    }
}

@media (max-width: 1200px) {
    .tablaReporte {
        margin: 0 auto;
        max-width: 1100px;
        width: 90%;
    }
    .formPaquetes {
        width: 80%;
    }

    .tituloIco {
        margin: 5% auto;
    }

    #desktopMenu nav ul li {
        margin: 0 0 0 0%;
        font-size: 15px;
    }

    #desktopMenu nav {
        max-width: 1150px;
        height: 60px;
        width: 90%;
    }

    #desktopMenu nav .headLogo {
        width: 120px;
    }

    #desktopMenu nav ul {
        height: 60px;
        line-height: 60px;
    }

    #desktopMenu nav ul li a {
        font-size: 1.1em;
    }

    .loginForm {
        width: 45%;
        margin: 2% auto;
    }

    .login-page h1 {
        font-size: 3em;
        margin: 20px auto 0px;
        background: #fff;
    }

    .login-page h2 {
        font-size: 2em;
    }

    .controllerExportacion button, .loginForm label, .loginForm input, .loginForm button, .loginForm a {
        font-size: 1em;
    }

    button[name=regresarPagina] {
        left: 10%;
    }
}

@media (max-width: 1024px) {
    .formSeleccionPaquete label {
        font-size: 1em;
    }
    .seleccionAdmin {
        width: 85%;
        display: block;
        margin: 0 auto;
    }
    .controllerReportes select {
        width: 40%;
    }
    .controllerExportacion {
        width: 80%;
    }
    .controllerExportacion button {
        width: 170px;
    }

    .tituloIco {
        margin: 6% auto;
    }

    .formRecargas {
        width: 60%;
        height: 375px;
        margin: 2% auto;
    }
    .scannerSIM button,
    .controllerExportacion button,
    .seleccionReporte p,
    .seleccionReporte .contBtnReportes button,
    .miniformRenovacionPrepago label,
    .miniformRenovacionPrepago label input,
    .miniformRenovacionPrepago .miniformController button,
    .formWrapper .formActivaciones label,
    .formWrapper .formActivaciones label select,
    .formWrapper .formActivaciones label input,
    .formWrapper .formActivaciones button,
    .seleccionTipoActivacion p,
    .confirmarRecarga p,
    .confirmarRecarga label,
    .formRecargasConfirmar button[name=volver],
    .formRecargasConfirmar button[name=recargar],
    .loginForm label,
    .loginForm input,
    .loginForm button,
    .loginForm a,
    .radioContainer,
    .formSeleccionPaquete
    .paquetesDisponibles p,
    .formSeleccionPaquete .descPaquete strong,
    .formSeleccionPaquete .descPaquete input.seguir,
    .confirmacionCompraPaquete .controllerPaquetes input,
    .formSeleccionPaquete .controllerPaquetes input,
    .formSeleccionPaquete .descPaquete .descPaqueteWrap h3,
    .formSeleccionPaquete .descPaquete .descPaqueteWrap ul li,
    .formSeleccionPaquete .descPaquete .descPaqueteWrap ul li p,
    .formSeleccionPaquete .descPaquete .descPaqueteWrap ul li span {
        font-size: 1em;
    }
    ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
        font-size: 1em;
    }
    ::-moz-placeholder { /* Firefox 19+ */
        font-size: 1em;
    }
    :-ms-input-placeholder { /* IE 10+ */
        font-size: 1em;
    }
    :-moz-placeholder { /* Firefox 18- */
        font-size: 1em;
    }
}

@media (max-width: 1145px) {
    .formSeleccionPaquete .paquetesDisponibles label {
        margin: 0 !important;
    }
    .controllerReportes, .tablaReporte {
        width: 90%;
    }

    .seleccionReporte, .wrapperTerminos, .formWrapper {
        width: 90%;
    }

    .formWrapper .formActivaciones label {
        width: 46%;
        margin: 0 1.666% 20px;
        overflow: hidden;
        border-radius: 5px;
    }

    .seleccionTipoActivacion {
        width: 70%;
    }

    .seleccionTipoActivacion .contBtnActivaciones input {
        width: 45%;
        margin: 10px 1.3333%;
    }

    .formSeleccionPaquete .descPaquete {
        width: 50%;
    }

    .formSeleccionPaquete .descPaquete .descPaqueteWrap ul {
        padding: 0 0 0 15px;
    }



    .formPaquetes {
        width: 90%;
        margin: 35px auto;
    }

    .modalClaro {
        width: 75%;
        height: auto;
        margin: 3% auto;
        padding: 20px;
    }

    .modalClaro img {
        width: 50px;
        height: 50px;
        display: block;
        margin: 25px auto;
    }

    .modalClaro.recargaFallida img {
        margin: 15px auto 20px;
    }

    .modalClaro p {
        font-size: 1.5em;
        width: 90%;
        margin: 0 auto 50px;
    }

    .modalClaro.recargaFallida p {
        width: 80%;
        margin: 0 auto 30px;
    }

    .modalClaro button {
        margin: 15px auto 20px;
        width: 36%;
        font-size: 1.1em;
    }

    button[name=regresarPagina] {
        display: none;
        width: 0px;
        height: 0;
        overflow: hidden;
    }

    .confirmacionCompraPaquete .descPaquete, .confirmarRecarga {
        width: 65%;
    }

    .loginForm {
        width: 60%;
        margin: 2% auto 5%;
    }

    .loginForm button {
        width: 40%;
        font-size: 0.9em;
    }

    #desktopMenu nav ul {
        display: none;
    }

    #desktopMenu nav .headLogo {
        position: relative;
        display: block;
        margin: 0 auto;
    }

    #desktopMenu nav .mobileMenu {
        display: block;
        position: absolute;
        top: 10px;
    }

    #sidebarMenu {
        height: 100%;
        width: 0%;
        position: fixed;
        z-index: 999;
        top: 0;
        left: 0;
        background-color: #fff;
        overflow-x: hidden;
        transition: 0.5s;
        box-shadow: 0px 0px 15px #999;
        display: block;
    }

    .tablaReporte table {
        border: 0;
    }

    .tablaReporte table thead {
        display: none;
    }

    .tablaReporte table tr {
        margin-bottom: 0;
        display: block;
        border: 0px solid;
    }

    .tablaReporte table td {
        display: block;
        text-align: right;
        border: 0px solid #ccc;
        background-color: #fff;
        padding: 0;
        height: 30px;
        text-indent: 10px;
        line-height: 30px;
        font-size: 0.8em;
    }

    .tablaReporte table td:nth-child(2n+1) {
        background: #f3f3f2;
    }

    .tablaReporte table td span {
        width: 50%;
        height: 100%;
        float: right;
        text-indent: 20px;
        text-align: left;
        border-left: 1px solid #000;
        font-family: 'DIN Pro';
    }

    .tablaReporte table td:first-child span {
        width: 100%;
        border: 0px solid;
        text-align: center;
        text-indent: 0px;
        font-family: 'DIN Pro Bold';
    }

    .tablaReporte table tbody td:first-child {
        width: 100%;
        text-align: center;
        background: #f7121d;
        color: #fff;
        padding: 0;
        height: 30px;
        line-height: 30px;
    }

    .tablaReporte table tfoot td:first-child {
        width: 100%;
        text-align: center;
        background: #fff0;
        color: #fff;
        padding: 0;
        height: 60px;
        line-height: 60px;
    }

    .tablaReporte table td:first-child:before {
        display: none;
    }

    .tablaReporte table td:last-child {
        border-bottom: 0;
    }

    .tablaReporte table td:before {
        content: attr(data-label);
        float: left;
    }

    .controllerReportes select {
        width: 100%;
    }
    .seleccionReporte .contBtnReportes input {
        width: 46%;
    }

    .seleccionTipoActivacion .contBtnActivaciones a, .seleccionTipoActivacion .contBtnActivaciones input {
        background-repeat: no-repeat !important;
        background-position: left center !important;
        background-color: #f3f3f2 !important;
        background-size: contain !important;
        border: 0px solid !important;
        border-radius: 10px !important;
        box-shadow: 1px 1px 10px #00033333 !important;
        cursor: pointer !important;
        font-family: 'DIN Pro Medium' !important;
        height: 50px !important;
        line-height: 50px !important;
        margin: 10px 1% 0 !important;
        padding: 0 !important;
        text-align: left !important;
        text-indent: 50px !important;
        vertical-align: top !important;
        width: 48% !important;
        display: inline-block;
        color: #333 !important;
    }
    
	.seleccionReporte .contBtnReportes a,
	.seleccionTipoActivacion .contBtnActivaciones a,
	.seleccionTipoActivacion .contBtnActivaciones input {
	    background-repeat: no-repeat !important;
	    background-position: left center !important;
	    background-color: #f3f3f2 !important;
	    background-size: contain !important;
	    border: 0px solid !important;
	    border-radius: 10px !important;
	    box-shadow: 1px 1px 10px #00033333 !important;
	    cursor: pointer !important;
	    font-family: 'DIN Pro Medium' !important;
	    height: 50px !important;
	    line-height: 50px !important;
	    margin: 10px 1% 0 !important;
	    padding: 0 !important;
	    text-align: left !important;
	    text-indent: 50px !important;
	    vertical-align: top !important;
	    width: 32% !important;
	    display: inline-block;
	    color: #333  !important;
	}
}

@media (max-width: 768px) {
    .reporteLabelMobile {
        display: block;
    }
    .reporteLabelDesktop {
        display: none;
    }
    .seleccionReporte .contBtnReportes button {
        width: 47%;
    }

    .miniformRenovacionPrepago .miniformController {
        width: 100%;
    }

    .miniformRenovacionPrepago {
        width: 90%;
    }

    .miniformRenovacionPrepago label {
        width: 100%;
        margin: 0;
    }

    .miniformRenovacionPrepago label input {
        margin: 10px auto 20px;
    }

    .formPaquetes .wrapperTipoPaquete .contBtnPaquete button {
        border: 0px solid #fff;
        width: 23%;
        height: auto;
        border-radius: 9px;
        font-size: 0.8em;
        margin: 0 0 0 0.666%;
        padding: 70px 0 10px 0;
        background-repeat: no-repeat;
        background-position: top center;
        background-color: #fff;
        background-size: 50%;
    }

    .formPaquetes label {
        width: 100%;
        font-size: 1.1em;
    }

    .formPaquetes input {
        width: 100%;
        margin: 0 auto 15px;
        font-size: 1.1em;
    }

    .formPaquetes button[name=recargar] {
        width: 60%;
        max-width: 200px;
    }

    .bannerTripleSaldo {
        position: relative;
        bottom: 0;
    }

    .tripleSaldoTablet {
        display: block;
        width: 100%;
        height: auto;
        display: block;
        margin: 0;
        bottom: 0;
    }
}
@media (max-width: 768px) {
    .tituloIco {
        margin: 4% auto !important;
    }
    .seleccionAdmin form a {
        width: 100%;
        margin: 1% 1% 3%;
    }
    .formPaquetes .wrapperTipoPaquete .contBtnPaquete input {
        background-size: 35px;
    }
    .seleccionReporte .contBtnReportes a,
	.seleccionTipoActivacion .contBtnActivaciones a,
	.seleccionTipoActivacion .contBtnActivaciones input {
	    background-repeat: no-repeat !important;
	    background-position: left center !important;
	    background-color: #f3f3f2 !important;
	    background-size: contain !important;
	    border: 0px solid !important;
	    border-radius: 10px !important;
	    box-shadow: 1px 1px 10px #00033333 !important;
	    cursor: pointer !important;
	    font-family: 'DIN Pro Medium' !important;
	    height: 50px !important;
	    line-height: 50px !important;
	    margin: 10px 1% 0 !important;
	    padding: 0 !important;
	    text-align: left !important;
	    text-indent: 50px !important;
	    vertical-align: top !important;
	    width: 48% !important;
	    display: inline-block;
	    color: #333  !important;
	}
}
@media (max-width: 744px) {
    .consultaReporte, .consultaReporte span, .rango1 input, .rango2 input {
        margin: 0 auto;
        display: block;
        float:none;
    }
    #tblReporte table tbody tr td:first-child {
        background: #f7121d;
        color: #fff;
    } 
}

.myLittleMenu {
	width: 130px;
}

@media (max-width: 640px) {
    .reportInputWidth input{
		width: 90%;
	}
    
    .myLittleMenu {
		width: 85%;
	}
}

@media (max-width: 700px) {
    #footerSlider .slick-arrow {
        top: 33%;
    }
    #footerSlider .slick-arrow i {
        font-size: 1.2em;
    }
    .formSeleccionPaquete .descPaquete strong,
    .formSeleccionPaquete .descPaquete .descPaqueteWrap {
        width: 88%;
        margin: 20px auto;
    }
    .formPaquetes .wrapperTipoPaquete .contBtnPaquete input {
        width: 48.666%;
        margin: 10px 0.6666667%;
    }

    .formSeleccionPaquete .paquetesDisponibles, .formSeleccionPaquete .descPaquete {
        width: 100%;
        float: none;
        clear: none;
        position: relative;
        display: block;
    }

    .seleccionTipoActivacion .contBtnActivaciones a, .seleccionTipoActivacion .contBtnActivaciones input {
        background-repeat: no-repeat !important;
        background-position: left center !important;
        background-color: #f3f3f2 !important;
        background-size: contain !important;
        border: 0px solid !important;
        border-radius: 10px !important;
        box-shadow: 1px 1px 10px #00033333 !important;
        cursor: pointer !important;
        font-family: 'DIN Pro Medium' !important;
        height: 50px !important;
        line-height: 50px !important;
        margin: 10px 1% 0 !important;
        padding: 0 !important;
        text-align: left !important;
        text-indent: 50px !important;
        vertical-align: top !important;
        width: 100% !important;
        display: inline-block;
        color: #333 !important;
    }
}

@media (max-width: 640px) {

    .resultReporte table tbody tr td:first-child {
        background: #f7121d !important;
        color: #fff;
    }

    table.footerResultReport tbody tr td:first-child {
        background: transparent !important;
    }
    .ui-datatable-reflow .ui-datatable-data td[role="gridcell"] .ui-column-title {
        min-width: 45% !important;
    }
}
@media (max-width: 600px) {
    .formRecargasConfirmar input {
        max-width: 120px;
        font-size: 0.9em !important;
    }
    .seleccionAjuste .contBtnAjustes input,
    .seleccionTipoServicio .contBtnServicios input {
        font-family: 'DIN Pro';
        height: 50px;
        line-height: 1;
        margin: 10px 1% 0;
        padding: 0 0 0 40px;
        font-size: 0.8em;
    }
    .seleccionTipoServicio .contBtnServicios input {
        width: 255px;
        margin: 0 auto 10px;
        display: block;
    }
    .controllerExportacion {
        width: 85%;
    }

    .controllerExportacion button {
        width: 45%;
        font-size: 0.8em;
        height: 40px;
    }

    .seleccionTipoServicio {
        width: 90%;
    }

    .seleccionTipoServicio p, .seleccionTipoServicio .contBtnServicios {
        width: 100%;
    }
    .seleccionAjuste {
        width: 90%;
    }

    #accordionPaquetes .ui-accordion-content label {
        width: 225px;
        font-size: 0.9em;
    }

    .formWrapper .formActivaciones label {
        width: 100%;
        margin: 0 0 20px;
    }

    .scannerSIM {
        width: 100%;
    }

    .scannerSIM div {
        height: 70%;
        width: 90%;
    }

    .confirmacionCompraPaquete strong {
        width: 90%;
    }

    .confirmacionCompraPaquete {
        max-width: 85%;
    }

    .formSeleccionPaquete .descPaquete input.seguir {
        width: 100%
    }

    .formSeleccionPaquete .descPaquete .descPaqueteWrap {
        border: 0px solid #999;
        margin: 45px 0 10px;
        height: auto !important;
    }


    .formSeleccionPaquete .descPaquete {
        margin: 20px 0 0;
    } 

    .confirmacionCompraPaquete .controllerPaquetes input, .formSeleccionPaquete .controllerPaquetes input {
        width: 45%;
    }

    .formPaquetes .wrapperTipoPaquete .contBtnPaquete button {
        background-size: 75%;
    }

    .confirmacionCompraPaquete .descPaquete h3 {
        font-size: 1.1em;
    }

    .confirmacionCompraPaquete .descPaquete ul {
        padding: 0 0 0 20px;
    }

    .confirmacionCompraPaquete .descPaquete ul li p {
        font-weight: bold;
        color: #000;
    }

    .confirmacionCompraPaquete .descPaquete ul li p span {
        display: block;
        color: #ccc;
    }

    .confirmacionCompraPaquete .descPaquete, .modalClaro {
        padding: 0 0 0 20px;

        height: auto;
        margin: 3% auto;
        padding: 20px;
    }

    .modalClaro img {
        width: 50px;
        height: 50px;
        display: block;
        margin: 25px auto;
    }

    .modalClaro.recargaFallida img {
        margin: 15px auto 20px;
    }

    .modalClaro p {
        font-size: 1.5em;
        width: 90%;
        margin: 0 auto 30px;
    }

    .modalClaro.recargaFallida p {
        width: 90%;
        margin: 0 auto 30px;
    }

    .modalClaro button {
        margin: 15px auto 20px;
        width: 36%;
        font-size: 1.1em;
    }

    .formRecargas, .loginForm {
        width: 100%;
        height: 100%;
        margin: 0% auto 3%;
        background: #00000000;
        border: 0px solid #fff;
        padding: 0px;
    }

    .loginForm form {
        padding: 10px 20px;
    }

    .login-page h2 {
        font-size: 2em;
        background: #fff;
        padding: 0 0 20px;
    }

    .tituloIco {
        text-align: center;
        vertical-align: middle;
        position: relative;
        margin: 2% auto 4%;
        background: #fff;
        padding: 0px 15px;
    }

    .tituloIco img {
        display: block;
        margin: 0 auto;
        width: 65px;
    }

    .tituloIco h1 {
        margin: 0;
        padding: 0;
        height: auto;
        vertical-align: middle;
        background: #fff;
    }

    .disponibleRecargas, .formRecargas label, .formRecargas input {
        font-size: 1.1em;
    }

    .formRecargas input {
        background: #fff;
    }


    .formRecargas button {
        width: 180px !important;
    }

    body {
        margin-bottom: 0px;
    }

    .formRecargasConfirmar {
        max-width: 90%;
        margin: 0 auto 100px;
    }

    .confirmarRecarga {
        width: 85%;
    }

    .formRecargasConfirmar button[name=volver] {
        margin: 0 0 0 10%;
        width: 120px;
        font-size: 14px;
        padding: 7px 0;
    }

    .formRecargasConfirmar button[name=recargar] {
        margin: 0 10% 0 0;
        width: 120px;
        font-size: 14px;
        padding: 7px 0;
    }
    
    .seleccionReporte .contBtnReportes a,
	.seleccionTipoActivacion .contBtnActivaciones a,
	.seleccionTipoActivacion .contBtnActivaciones input {
	    background-repeat: no-repeat !important;
	    background-position: left center !important;
	    background-color: #f3f3f2 !important;
	    background-size: contain !important;
	    border: 0px solid !important;
	    border-radius: 10px !important;
	    box-shadow: 1px 1px 10px #00033333 !important;
	    cursor: pointer !important;
	    font-family: 'DIN Pro Medium' !important;
	    height: 50px !important;
	    line-height: 50px !important;
	    margin: 10px 1% 0 !important;
	    padding: 0 !important;
	    text-align: left !important;
	    text-indent: 50px !important;
	    vertical-align: top !important;
	    width: 75% !important;
	    display: inline-block;
	    color: #333  !important;
	}
}
@media (max-width: 550px) {
    .seleccionReporte .contBtnReportes input {
        width: 90%;
        margin: 0 auto 10px;
        display: block;
        font-size: 1em;
    }
}
@media (max-width: 500px) {
    #footerSlider .slick-arrow {
        top: 45%;
    }
    a.regresarPagina {
        width: 70px;
        overflow: hidden;
        height: 20px;
    }

    #desktopMenu, #desktopMenu nav {
        height: 60px;
    }
    
    .nameTopbar {
    margin-top: 0px !important;
	}

    #desktopMenu nav .mobileMenu {
        top: 5px;
    }

    #desktopMenu nav .headLogo {
        width: 75px;
        margin: 0 auto;
        padding: 5px 0 0;
    }

    .loginForm label, .loginForm input {
        width: 95%;
    }

    .seleccionTipoActivacion {
        width: 90%;
    }

    .seleccionTipoActivacion .contBtnActivaciones input {
        width: 43%;
        margin: 15px 3%;
    }
}

@media (max-width: 375px) {
    .controllerExportacion {
        width: 90%;
    }
    .wrapperTerminos .termsController button, .miniformRenovacionPrepago .miniformController button {
        width: 45%;
    }

    .seleccionTipoActivacion {
        width: 90%;
    }

    .seleccionTipoActivacion .contBtnActivaciones input {
        width: 46%;
        margin: 15px 1%;
        font-family: 'DIN Pro Medium';
        font-size: 0.8em !important;
    }

    .formPaquetes .wrapperTipoPaquete .contBtnPaquete input.paquete-todo {
        padding: 12px 5px 10px 5px;
        vertical-align: top;
    }
}

@media (max-width: 360px) {
    .formPaquetes .wrapperTipoPaquete .contBtnPaquete input {
        background-size: 30px;
    }
    .tablaReporte table td span {
        width: 40%;
    }

    .seleccionReporte .contBtnReportes input {
        width: 100%;
        font-size: 1em;
    }

    .formPaquetes .wrapperTipoPaquete .contBtnPaquete input.paquete-todo {
        padding: 12px 3px 10px;
        vertical-align: top;
    }
}

@media (max-height: 1080px) {
    body:before {
        background: linear-gradient(to bottom, #fff, #fff 44%, #ccc 44%);
    }

    body:after {
        background-size: 60%;
    }
}

@media (max-height: 1024px) {
    body:before {
        background: linear-gradient(to bottom, #fff, #fff 40%, #ccc 40%);
    }

    body:after {
        background-size: 60%;
    }
}

@media (max-height: 990px) {
    body:before {
        background: linear-gradient(to bottom, #fff, #fff 47%, #ccc 47%);
    }

    body:after {
        background-size: 50%;
    }
}

@media (max-height: 900px) {
    body:before {
        background: linear-gradient(to bottom, #fff, #fff 40%, #ccc 0%);
    }

    body:after {
        background-size: 60%;
    }
}

@media (max-height: 800px) {
    body:before {
        background: linear-gradient(to bottom, #fff, #fff 33%, #ccc 0%);
    }

    body:after {
        background-size: 50%;
    }
}

@media (max-height: 700px) {
    .tripleSaldoDesktop {
        width: 100%;
        bottom: -5px;
        margin: 0;
        position: relative;
        max-height: 175px;
        min-height: 150px;        
    }
}

@media (max-height: 1024px) and (max-width: 768px) {
    body:before {
        background: linear-gradient(to bottom, #fff, #fff 29%, #ccc 0%);
    }

    body:after {
        background-size: 80%;
    }
}

@media (max-height: 900px) and (max-width: 600px) {
    body:before {
        background: linear-gradient(to bottom, #fff, #fff 25%, #ccc 25%);
    }

    body:after {
        background-size: 100%;
        background-position-y: 100%;
    }

    .bannerTripleSaldo {
        position: relative;
        bottom: 0px;
    }

    .seleccionTipoActivacion .contBtnActivaciones a,
    .seleccionTipoActivacion .contBtnActivaciones input {
        background-repeat: no-repeat !important;
        background-position: left center !important;
        background-color: #f3f3f2 !important;
        background-size: contain !important;
        border: 0px solid !important;
        border-radius: 10px !important;
        box-shadow: 1px 1px 10px #00033333 !important;
        cursor: pointer !important;
        font-family: 'DIN Pro Medium' !important;
        height: 50px !important;
        line-height: 50px !important;
        margin: 10px 1% 0 !important;
        padding: 0 !important;
        text-align: left !important;
        text-indent: 50px !important;
        vertical-align: top !important;
        width: 48% !important;
        display: inline-block;
        color: #333  !important;
    }
}

@media (max-height: 896px) and (max-width: 600px) {
    .bannerTripleSaldo {
        position: relative;
        margin: 30px 0 0;
    }

    .tripleSaldoMobile {
        width: 100%;
        bottom: 0;
        margin: 0;
        position: relative;
        display: block;
    }
    #sidebarMenu ul li {
        height: 65px;
    }
    .seleccionTipoActivacion .contBtnActivaciones a,
    .seleccionTipoActivacion .contBtnActivaciones input {
        background-repeat: no-repeat !important;
        background-position: left center !important;
        background-color: #f3f3f2 !important;
        background-size: contain !important;
        border: 0px solid !important;
        border-radius: 10px !important;
        box-shadow: 1px 1px 10px #00033333 !important;
        cursor: pointer !important;
        font-family: 'DIN Pro Medium' !important;
        height: 50px !important;
        line-height: 50px !important;
        margin: 10px 1% 0 !important;
        padding: 0 !important;
        text-align: left !important;
        text-indent: 50px !important;
        vertical-align: top !important;
        width: 98% !important;
        display: inline-block;
        color: #333  !important;
    }
}


.radioTipo tbody tr td{
    border: none !important;
}

.box-part{
    background-color: #FFF;
    border-radius:10px;
    padding:5px 5px;     
    width: 85%;
    margin: 0 auto;    
}

/*.box-part:hover{
    background: -moz-linear-gradient(to right, #f7121c 0%,#a61407 100%);
    background: -webkit-gradient(to right, #f7121c 0%,#a61407 100%);
    background: -webkit-linear-gradient(to right, #f7121c 0%,#a61407 100%);
    background: -o-linear-gradient(to right, #f7121c 0%,#a61407 100%);
    background: -ms-linear-gradient(to right, #f7121c 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121c 0%,#a61407 100%);
}*/

/*.box-part:hover .fa , 
.box-part:hover .title , 
.box-part:hover .text ,
.box-part:hover a,
.box-part:hover .precio,
.box-part:hover .recargaMonto{
    color:#FFF;
    -webkit-transition: all 1s ease-out;
    -moz-transition: all 1s ease-out;
    -o-transition: all 1s ease-out;
    transition: all 1s ease-out;
}*/

.box-part .recharge{    
    margin : 40px auto 0 auto;
    text-align: center;
}

.box-part .recharge .recargaMonto{    
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}

.fa{
    color:#4183D7;
}

.card-container{
    width: 100%;    
    border: none;
    margin: 10px 10px 10px 10px;

}
.card{
    width: 100%;
    z-index: 10;
}

.centermx{
    margin-left:auto;
    margin-right: auto;
}

.card-header {  
    font-size: 12px;  
    font-weight: bold;
    text-align: center;
    border-bottom: none;

}
.card-body{
    background-color: #A4A4A4;
    padding: 5px 5px 5px 5px; 
    border-radius: 10px;   
    width: 90%;
}

.ui-carousel{
    border: solid 1px #d1d3d4;
    padding: 2px 1px !important;
    background-color: transparent;
    color: #0D0D0D;
    text-align: center;
}

.ui-carousel .ui-carousel-header {  
    border: solid 1px #a61407 !important;
    background: -moz-linear-gradient(to right, #f7121c 0%,#a61407 100%);
    background: -webkit-gradient(to right, #f7121c 0%,#a61407 100%);
    background: -webkit-linear-gradient(to right, #f7121c 0%,#a61407 100%);
    background: -o-linear-gradient(to right, #f7121c 0%,#a61407 100%);
    background: -ms-linear-gradient(to right, #f7121c 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121c 0%,#a61407 100%);
}

.top .ui-carousel-viewport{    
    background: -moz-linear-gradient(to bottom, #FFF 50%,#F79149 100%);
    background: -webkit-gradient(to bottom, #FFF 50%,#F79149 100%);
    background: -webkit-linear-gradient(to bottom, #FFF 50%,#F79149 100%);
    background: -o-linear-gradient(to bottom, #FFF 50%,#F79149 100%);
    background: -ms-linear-gradient(to bottom, #FFF 50%,#F79149 100%);
    background: linear-gradient(to bottom, #FFF 40%,#F79149 100%);
}

.ui-carousel .ui-carousel-header .ui-carousel-header-title{
    display: inline-block;
    width: 30%;
    padding-top: 5px;
    overflow: hidden;
    font-size: 14px;
}

.ui-carousel{
    border:none !important;
}

.ui-carousel .ui-carousel-page-links{
    float: left;
    align-content: center;
}

.box-part .title span{
    font-size: 15px;
    font-weight: bold;
}

.box-part .precio{
    font-size: 15px;
    font-weight: bold;
}

.box-part .text span{
    font-size: 15px;    
}

.swiper-scrollbar{
    display: none;
}

.swiper-pagination{
    display: block;
}


.box-part{
    overflow:hidden;
    background-color: #FFF;
    border-radius:10px;
    padding:5px 5px;    
    width: 85%;
    margin: 0 auto;    
    height: 100px;
}

.box-part .title{
    width: 100%;
    text-align: center;
}

.box-part .text{    
    width: 100%; 
    text-align: center;
}

.formSeleccionPaquete .recargar{    
	all: unset;
    height: 46px;
    width: 100%;
}

.formSeleccionPaquete .recargar .ui-button-text {
	all: unset;
	border: 0px solid #fff;
    color: #fff;
    border-radius: 15px;
    font-size: 15px;
    font-family: 'DIN Pro Bold';
    background: #f7121d;
    background: -moz-linear-gradient(left, #A4A4A4 0%, #A4A4A4 100%);
    background: -webkit-linear-gradient(left, #A4A4A4 0%,#A4A4A4 100%);
    background: linear-gradient(to right, #A4A4A4 0%,#A4A4A4 100%);
    cursor: pointer;
    display: block;
    text-align: center;
}

.formSeleccionPaquete .recargaBtn{
	all: unset;
    height: 46px;
    width: 100%;
}

.formSeleccionPaquete .recargaBtn .ui-button-text {
	all: unset;
	display: block;
	text-align: center;
	border: 0px solid #fff;
    color: #fff;
    border-radius: 15px;
    font-size: 15px;
    font-family: 'DIN Pro Bold';
    background: #f7121d;
    background: -moz-linear-gradient(left, #A4A4A4 0%, #A4A4A4 100%);
    background: -webkit-linear-gradient(left, #A4A4A4 0%,#A4A4A4 100%);
    background: linear-gradient(to right, #A4A4A4 0%,#A4A4A4 100%);
    cursor: pointer;
}

@media (max-width:642px){
	.formSeleccionPaquete .recargaBtn .ui-button-text {
	    padding-left: 9px !important;
	}
	
	.formSeleccionPaquete .recargar .ui-button-text {
	    padding-left: 9px !important;
	}
	
	.formRecargasPaquetesConfirmar .volver {
		width: 88%;
	}
	
	.formRecargasPaquetesConfirmar .recargar {
		float: none;
		width: 88%;
	}
	
	.formRecargasPaquetesConfirmar .volver .ui-button-text {
		width: 100%;
	}
	
	.formRecargasPaquetesConfirmar .recargar .ui-button-text{
		width: 100%;
	}
}

@media (max-width:340px){
    .box-part .text{    
        width: 100%;  
        line-height: 80%;
        word-wrap: break-word;
        text-align: center;
    }

    .formSeleccionPaquete .recargar{      
        border: 0px solid #fff;
        height: 46px;  
        color: #fff;
        width:100%;
        border-radius: 15px;
        font-size: 10px;
        font-family: 'DIN Pro Bold';
        background: #f7121d;
        background: -moz-linear-gradient(left, #A4A4A4 0%, #A4A4A4 100%);
        background: -webkit-linear-gradient(left, #A4A4A4 0%,#A4A4A4 100%);
        background: linear-gradient(to right, #A4A4A4 0%,#A4A4A4 100%);
        cursor: pointer;
    }

    .formSeleccionPaquete .recargaBtn{
        border: 0px solid #fff;
        height: 46px;  
        color: #fff;
        width:100%;
        border-radius: 15px;
        font-size: 10px;
        font-family: 'DIN Pro Bold';
        background: #f7121d;
        background: -moz-linear-gradient(left, #A4A4A4 0%, #A4A4A4 100%);
        background: -webkit-linear-gradient(left, #A4A4A4 0%,#A4A4A4 100%);
        background: linear-gradient(to right, #A4A4A4 0%,#A4A4A4 100%);
        cursor: pointer;
    }
    
    .formSeleccionPaquete .recargaBtn .ui-button-text {
	    padding-left: 7px !important;
	}
	
	.formSeleccionPaquete .recargar .ui-button-text {
	    padding-left: 7px !important;
	}
}

@media (max-width:640px){
    body .ui-carousel .ui-carousel-mobiledropdown {
        display: none !important;
    }

    .box-part .title span{
        font-size: 12px;
        font-weight: bold;

    }
    .box-part .title{    
        width: 100%;  
        line-height: 65%;
        text-align: center;
    }

    .box-part .text span{    
        width: 100%;  
        line-height: 65%;
    }

    .box-part .precio{
        font-size: 14px;
        font-weight: bold;
    }

    .box-part .text span{
        font-size: 10px;   
        line-height: 65%;
    }

    .swiper-pagination{
        display: none;
    }

    .swiper-scrollbar{
        display: block;
    }

    .box-part{        
        background-color: #FFF;
        border-radius:10px;
        padding:5px 5px;    
        width: 85%;
        margin: 0 auto;        
    }

    .formSeleccionPaquete .recargar{      
        border: 0px solid #fff;
        height: 46px;  
        color: #fff;
        width:100%;
        border-radius: 15px;
        font-size: 10px;
        font-family: 'DIN Pro Bold';
        background: #f7121d;
        background: -moz-linear-gradient(left, #A4A4A4 0%, #A4A4A4 100%);
        background: -webkit-linear-gradient(left, #A4A4A4 0%,#A4A4A4 100%);
        background: linear-gradient(to right, #A4A4A4 0%,#A4A4A4 100%);
        cursor: pointer;
    }

    .formSeleccionPaquete .recargaBtn{
        border: 0px solid #fff;
        height: 46px;  
        color: #fff;
        width:100%;
        border-radius: 15px;
        font-size: 10px;
        font-family: 'DIN Pro Bold';
        background: #f7121d;
        background: -moz-linear-gradient(left, #A4A4A4 0%, #A4A4A4 100%);
        background: -webkit-linear-gradient(left, #A4A4A4 0%,#A4A4A4 100%);
        background: linear-gradient(to right, #A4A4A4 0%,#A4A4A4 100%);
        cursor: pointer;   
    }
    
}

.ui-carousel .ui-carousel-header .ui-carousel-next-button:hover, .ui-carousel .ui-carousel-header .ui-carousel-prev-button:hover{
    background-color: #A4A4A4;

}
.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
    bottom:-2px;
}

.swiper-pagination-bullet{
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 100%;
    background: #FFF;
    opacity: .5;
}

.swiper-pagination-bullet-active{
    opacity: 1;
    background: #871717;
}

.formRecargas .ui-selectonemenu {
    width: 75%;
    margin: 0 auto;
    display: block;
    padding: 0 14px !important;      
        border: 0;
    text-align: center;    
    background: #f3f3f2;
    font-size: 1em;
    color: #000;
}

/*********************************/

.subir {
    width: 95%;
    margin: 0 auto;
    color: #fff;
    background: #f7121d;
    border: none;
    padding: 10px;
    border-radius: 7px;
    border-bottom: 4px solid #b4b4b4;
    transition: all .2s ease;
    outline: none;
    font-size: 20px;;
}

.subir:hover {
    background: #f7121d;
    color: #ffffff;
    transition: all .2s ease;
    cursor: pointer;
}

.subir:active {
    border: 0;
    transition: all .2s ease;
}

.file-upload-input {

    margin: 0;
    padding: 0;


    outline: none;
    opacity: 0;
    cursor: pointer;
}


.hiddenFormSeleccionarPaquete * {
    display: none !important;
}

.fixDiv {
	margin-top: -37px;
}

.fix-title {
	 margin-left: -10px;
}

.grid-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 1rem;
}

.grid-container > div > * {
	box-sizing: border-box;
}

.grid-container input {
	height: 50px;
	line-height: 35px;
    font-size: 1.1em;
    font-family: 'titillium_webregular' !important;
}

.grid-container .ui-selectonemenu-label{
    height: 37px;
    line-height: 35px;
    font-size: 1.1em;
    font-family: 'titillium_webregular' !important;
}

.w-col-100{
	width: 100%;
}

@media (max-width: 455px) {
  	.w-col-100 {
  		width: 74% !important; 
  		min-width: 234px !important;
  		font-size: 16px !important;
  	}
}

@media (max-width: 356px) {
  	.w-col-100 {
  		width: 70% !important; 
  		min-width: 164px !important;
  		font-size: 13px !important;
  	}
}

@media (max-width: 275px) {
  	.w-col-100 {
  		width: 65% !important; 
  		min-width: 164px !important;
  		font-size: 13px !important;
  	}
}

@media (max-width: 250px) {
  	.w-col-100 {
  		width: 65% !important; 
  		min-width: 130px !important;
  		font-size: 13px !important;
  	}
}

.w-col-33{
	width: 33% !important;
}

@media (max-width: 1024px) {
  .grid-container {
    grid-template-columns: repeat(2, 1fr);
  }
  .w-col-33{
	width: 50% !important;
  }
}

@media (max-width: 768px) {
  .grid-container {
    grid-template-columns: 1fr;
  }
  .w-col-33{
	width: 100% !important;
  }
}

.item-full {
  grid-column: 1 / -1;
}

.item-full-double {
	grid-column: 1 / 3;
}

.item-full-end {
	grid-column: 3 / 4;
}

.m-0{
	margin: 0rem;
}

.mb-1{
	margin-bottom: 0.25rem;
}

.mb-2{
	margin-bottom: 0.5rem;
}

.mb-3{
	margin-bottom: 0.75rem;
}

.mb-4{
	margin-bottom: 1rem;
}

.mt-0{
	margin-top: 0rem;
}

.mt-1{
	margin-top: 0.25rem;
}

.mt-2{
	margin-top: 0.5rem;
}

.mt-3{
	margin-top: 0.75rem;
}

.mt-4{
	margin-top: 1rem;
}

.error-label {
	display: block;
	color: #f7121d;
	font-size: 0.875rem;
}

.center{
	text-align: center;
}

.secondary-button-2 {
    color: #f7121d;
    border: 0.1px solid #f7121d;
    border-radius: 10px;
    cursor: pointer;
    background: linear-gradient(to right, #f3f3f2 0%,#ffffff 100%);
    height: 50px;
    line-height: 35px;
    font-size: 1.1em;
    font-family: 'titillium_webregular' !important;
    font-size: 17px;
}

.secondary-button-2 .ui-button-text {
    all: unset;
}

.secondary-button-2:hover .ui-button-text, .secondary-button-2:focus .ui-button-text, .secondary-button-2:active .ui-button-text.ui-c {
    all: unset;
    color: #f7121d !important;
}

.primary-button{
	display: block;
    padding: 10px 0;
    color: #fff;
    font-family: 'DIN Pro Black';
    border: 0px solid #0000;
    border-radius: 10px;
    font-size: 1.3em;
    cursor: pointer;
    background: #f7121d;
    background: -moz-linear-gradient(left, #f7121d 0%, #a61407 100%);
    background: -webkit-linear-gradient(left, #f7121d 0%,#a61407 100%);
    background: linear-gradient(to right, #f7121d 0%,#a61407 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7121d', endColorstr='#a61407',GradientType=1 );
    margin: 10px auto 30px;
}

.primary-button .ui-button-text {
    all: unset;
}

.primary-button:hover .ui-button-text, 
.primary-button:visited .ui-button-text, 
.primary-button:focus .ui-button-text, 
.primary-button:active .ui-button-text.ui-c {
    all: unset !important;
    color: #fff !important;
}

.my-datepicker .ui-datepicker {
	display: table-cell !important;
}

.my-datepicker .ui-datepicker-calendar td a.ui-state-active {
  color: #007bff;
}

.my-datepicker .ui-datepicker-calendar td:has(a.ui-state-active) {
  border-color: #007bff;
}

.my-dialog {
   max-width: 30% !important;
}

@media (max-width: 1024px) {
  	.my-dialog {
   		max-width: 70% !important;
	}
}

@media (max-width: 768px) {
  	.my-dialog {
   		max-width: 95% !important;
	}
}

.none-display{
	display: none !important;
}

.error-border{
	border-color: #f7121d !important;
}

.loading {
    position: fixed;
    z-index: 99999;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
}

.loading i {
    color: #fff;
    font-size: 30px;
}

.formTabs {
	display: block;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.w-70{
	width: 30% !important
}

.centered-image{
	display: block;
  	margin-left: auto;
  	margin-right: auto;
}

.doc-image {
	max-height: 13.5rem !important;
	max-width: 100%;
	display: block;
  	margin-left: auto;
  	margin-right: auto;
  	margin-bottom: 0.5rem;
  	width: 80%;
}

.offset-one-col {
	grid-column-start: 1;
    grid-column-end: 1;
}

.custom-file-upload .ui-icon-plusthick {
    display: none; /* hide the plus icon */
}

.w-70-grid{
	width: 70%;
	margin-left: auto;
	margin-right: auto;
}

.action-footer {
	display: flex;
	flex-direction: row;
	margin: auto;
	margin-top: 1rem;
	align-items: center;
	justify-content: center;
	margin-bottom: 1rem;
	width: 80%;
}

.action-footer .primary-button {
	margin: 0;
	align-items: center;
    justify-content: center;
    margin-right: 1rem;
    width: 33%;
}

.action-footer .secondary-button-2 {
	width: 33%;	
}

@media (max-width: 1024px) {
	.action-footer {
		display: flex;
		flex-direction: column;
		margin: auto;
		margin-top: 1rem;
		align-items: center;
		justify-content: center;
		margin-bottom: 1rem;
		width: 80%;
	}

  	.action-footer .primary-button {
    	width: 100%;
    	margin: 0;
    	margin-bottom: 0.5rem;
  	}
  	.action-footer .secondary-button-2 {
		width: 100%;	
	}
}

.ui-tabs .ui-tabs-nav {
    background: #c00;
}

.ui-tabs-top .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs-top .ui-tabs-nav li.ui-tabs-active a, .ui-tabs-top .ui-tabs-nav li.ui-state-hover a {
    color: #c00 !important;
}

.ui-tabs-top .ui-tabs-nav{
	border: solid 1px #C00 !important;
}

.ui-tabs-top:hover {
	border: solid 1px #C00;
}

.fw-normal {
	font-weight: normal;
}

.text-ellipsis {
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mobile-taken-image {
	width: 100%;
}

@media (max-width: 768px) {
  	.mobile-taken-image {
   		width: 62%;
    	height: 240px;
    	display: block;
    	margin: auto;
	}
	.custom-photocam video {
		height: unset !important;
	}
	.custom-photocam{
		height: 350px !important;
	}
}

.nameTopbar {
    margin-top: -7px;
    color: white;
    font-family: 'DIN Pro Medium' !important;
    margin-left: 9px;
}

.nameTopbarSideMenu {
    margin-top: -7px;
    color: black;
    font-family: 'DIN Pro Medium' !important;
    margin-left: 9px;
    font-size: 1em !important;
}

.transaction-container {
	width: 40%;
	margin: auto;
}

@media (max-width: 768px) {
	.transaction-container {
		width: 95%;
		margin: auto;
	}
}

.summary-row {
	display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0.25rem 0.5rem 0.25rem 0.5rem;
    background: #FFFFFF;
    border-radius: 0.5rem;
}

.mr-auto {
	margin-right: auto;
}

.transaction-img {
	width: 30px;
	height: 30px;
}

.mr-2 {
	margin-right: 0.5rem;	
}

.fw-bold {
	font-weight: bold !important;
}
.carouselNoticias .ui-carousel-viewport {
    margin-top: -9px !important;
}
.carouselNoticias .ui-carousel:hover, .ui-carousel:focus{
	border: none !important;
}

.carouselNoticias .ui-carousel-header {
    display: none !important;
}

.w-100 {
	width: 100% !important;
}

.border-box {
	box-sizing: border-box !important;
}

.custom-primary .ui-button-text{
	background: #f7121d !important;
    border-bottom-color: #f7121d !important;
    border-top-color: #f7121d !important;
    border-left-color: #f7121d !important;
    border-right-color: #f7121d !important;
    box-shadow: #f7121d 0px 0px 0px 1px inset !important;
    color: white !important;
}

.custom-secondary .ui-button-text{
	background: #f3f3f2 !important;
    color: #f7121d !important;
    border: 0.1px solid #f7121d;
    border-bottom-color: #f7121d !important;
    border-top-color: #f7121d !important;
    border-left-color: #f7121d !important;
    border-right-color: #f7121d !important;
    box-shadow: #f7121d 0px 0px 0px 1px inset !important;
}

.d-flex {
	display: flex;
}
/*********************************/