ul  {
    margin:0;
    padding:0;
}
html, body{
	height: 100%;
	background-color: #F3F3F3;
}
#homepage main {
	margin: 0.938em;
	font-family: 'Roboto', serif;
}
#minha-conta, #outros, #suporte-tecnico {
	display: none;
}
#homepage header {
	background-color: #660099;
}
#homepage.header-inner h1 img {
    width: 6.3rem !important;
}
#homepage header > div {
	text-align: center;
}
#homepage .box, #main-menu .box {
	background-color: #fff;
	padding: 1.25rem;
	border-radius: 5px;
	margin-bottom: 0.9375rem;
}
.title-status-pagamento {
	color: #333333;
	font-weight: bold;
	font-style: normal;
	font-stretch: normal;
	line-height: 1.25;
	letter-spacing: normal;
	text-align: left;
	font-family: 'ProximaNovaBold';
	font-size: 1.25rem;
}
.icon-seta {
	float: right;
	padding-top: 3px;
}
.link {
	display: inline;
	text-decoration: none;
	font-family: 'Roboto', sans-serif;
	font-weight: bold !important;
	font-style: normal;
	font-stretch: normal;
	line-height: 1.43;
	letter-spacing: normal;
	text-align: left;
	color: #660099 !important;
	font-size: 0.875rem;
}
.list {
	color: #660099;
	list-style: none;
	font-family: Roboto, sans-serif;
	font-size: 0.813em;
	padding: 1.25rem 0;
	border-bottom: 0.125em solid #F3F3F3;
}
.btn-codigo-barras{
	background-color: #99cc33 !important;
	border: none;
	border-radius: 2px !important;
	width: 7.625rem !important;
	height: 1.875rem;
	color: #fff !important;
	font-family: Roboto;
	font-size: 0.75rem;
	text-shadow: none !important;
}
.debito-automatico {
	margin: 0 -1.25rem 1.25rem -1.25rem;
	padding: 0 1.25rem;
	padding-bottom: 0.625rem;
	border-bottom: 0.125rem solid #F3F3F3;
}
.status-pagamento {
	border-top: black solid 3px;
}

.fatura-pendente {
    color: #ee4646;
    border-color: #ee4646;
}

.fatura-paga {
    color: #99cc33;
    border-color: #99cc33;
}

.trocar-linha {
    position: fixed;
    right: 0;
    top: 0;
    margin-top: 0.89285rem;
    margin-right: 1.1161rem;
    display: none;
}

.icone-troca-linha {
    width: 1.5rem;
}


.fatura-em-aberto {
    color: #ff9901;
    border-color: #ff9901;
}
.header-inner h1 img {
    height: 1.063rem !important;
}
.box-valoriza-titulo, .box-valoriza-subtitulo, .box-valoriza-btn-cadastro {
    padding: 0 !important;
    margin: 0 !important;
}

.box-valoriza-titulo {
    font-family: 'ProximaNovaBold' !important;
    font-size: 1.4881rem !important;
    font-style: normal;
    font-stretch: normal;
    letter-spacing: normal;
    text-align: left;
    color: #333333 !important;
    margin-bottom: 1.4881rem !important;
}

.box-valoriza-subtitulo {
    font-size: 1.0417rem !important;
    margin-bottom: 2.9762rem !important;
	word-break: break-word;
    overflow-y: auto;
	line-height: 1.43 !important;
}

.box-valoriza-btn-cadastro {
    display: block;
    border-radius: 5px;
    background-color: #99cc33;
    font-size: 1.0417rem !important;
    text-align: center;
    padding-top: 1.4881rem !important;
    padding-bottom: 1.4881rem !important;
}


.box-valoriza-error-img {
	background-image: url(/Portal%20VIVO/_ArquivosEstaticos/mobile-gvt/images/orange_error.png);
    height: 5rem;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
	margin-top: 1.4881rem !important;
    margin-bottom: 1.4881rem !important;
}

.falha-vivo-valoriza h2 {
    color: #333333;
    font-size: 1.25rem;
    line-height: 1.4;
    margin-bottom: 0.75rem;
}

.falha-vivo-valoriza > p {
    font-family: 'Roboto';
    font-size: 0.875rem;
    color: #666666;
    margin-bottom: 0.9375rem;
    line-height: 1.43;
}

.falha-vivo-valoriza > ul {
    margin: 0 -1.25rem;
}

.falha-vivo-valoriza > ul >li {
    font-weight: bold;
    padding: 1.258rem 1.25rem;
    font-size: 0.875rem;
}

.falha-vivo-valoriza > ul >li:last-child > .icon-seta {
	margin-top: -1.15rem;
}

.falha-vivo-valoriza > ul >li >div:first-child > img {
    float: left;
    margin-right: 0.9375rem;
    margin-left: 0.3125rem;
}

.falha-faturas h2 {
    color: #333333;
    font-size: 1.25rem;
    line-height: 1.4;
    margin-bottom: 0.75rem;
}

.falha-faturas > p {
    font-family: 'Roboto';
    font-size: 0.875rem;
    color: #666666;
    margin-bottom: 0.9375rem;
    line-height: 1.43;
}

.falha-faturas > ul {
    margin: 0 -1.25rem;
}

.falha-faturas > ul >li {
    font-weight: bold;
    padding: 1.258rem 1.25rem;
    font-size: 0.875rem;
}

.falha-faturas > ul >li:last-child > .icon-seta {
	margin-top: -1.15rem;
}

.falha-faturas > ul >li >div:first-child > img {
    float: left;
    margin-right: 0.9375rem;
    margin-left: 0.3125rem;
}


#box-modal-codigo-barra {
	display: none;
}

#opacity-area{
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	position: fixed;
	opacity: 0.75;
	background-color: #000000;
	z-index: 9999;
}

.box-codigo-barra {
    background: #fff;
    bottom: 0;
    position: fixed;
    z-index: 99999999;
    border-radius: 5px 5px 0 0;
    width:  100%;
}

.box-codigo-barra > div {
	margin: 0 0.9375rem 0.625rem 0.9375rem;
}

.box-codigo-barra > div > p:first-child {
	font-size: 0.875rem;
	font-family: Roboto, sans-serif;
	color: #666666;
	margin: 1.875rem 0 0.9375rem 0;
}

.box-codigo-barra > div > p:first-child + p{
	font-size: 1rem;
	font-family: Roboto, sans-serif;
	color: #333333;
	font-weight: bold;
	line-height: 1.56;
	margin: 0 0 1.875rem 0;
}

#btn-copiar-codigo-barras {
	display: block;
	width: 100%;
	border-radius: 5px !important;
	padding: 1.25rem 0;
	border: none;
	color: #ffffff !important;
	font-family: Roboto, sans-serif;
	line-height: 1.43;
	font-weight: bold;
	background: linear-gradient(to right, #a1dd22 0% , #a1dd22 0%,#99cc33 0%, #99cc33 100%);
	margin-bottom: 1.25rem;
}

#animate-btn-copiar-codigo-barras {
    width:0;
}

.box-codigo-barras-erro {
	background-color: white;
	z-index: 9999;
	border-radius: 5px;
	padding: 1.25rem 1.25rem 1.813rem 1.25rem;
	position: fixed !important;
	top: 0rem !important;
	left: 0rem !important;
	right: 0rem !important;
	margin: auto !important;
	margin-top: 31vh !important;
	width: 83%;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}

.box-codigo-barras-erro > h2 {
	margin-bottom: 1.25rem;
	font-size: 1.25rem;
	font-family: 'ProximaNovaBold';
	color: #333333;
	line-height: 1.25;
	font-weight: bold;
}

.box-codigo-barras-erro > p {
	font-size: 0.875rem;
	font-family: "Roboto";
	color: #666666;
	line-height:  1.43;
}

.box-codigo-barras-erro > button {
	width: 100%;
	padding: 1.25rem;
	background-color:#99cc33;
	font-family: Roboto;
	font-size: 0.875rem;
	color: #ffffff;
	border-radius: 5px;
	border: none;
	margin-top: 2.5rem;
	font-weight: bold;
}

#status-pagamento i {
	color: #660099;
	font-size: 1.375rem;
	font-weight: bold;
	margin-top: -0.0625rem;
}
#status-pagamento .box p button {
	margin-bottom: 1.875rem;
}
#status-pagamento > .box > p > a > img {
	float: right;
}
#status-pagamento > .box > div:last-child {
	border-top: 0.1rem solid #F3F3F3;
	margin: 0.625rem -1.25rem 0 -1.25rem;
	padding: 0.625rem 1.25rem 0 1.25rem;
}
#status-pagamento ul li:last-child {
	border-bottom: none;
	margin-bottom: -0.9375rem;
	padding: 1.313rem 1.25rem;
}
#status-pagamento > .box > ul > li > a div > p {
	color:#888888;
	float: left;
	margin-left: -1.25rem;
	margin-right: 1.25rem;
	font-weight:  500;
}
.status-pagamento ul li {
	margin: 0 -1.25rem;
	padding-right: 1.25rem;
	padding-left: 1.25rem;
}
.status-valor {
	margin-top: 1rem;
	font-size: 2.8125rem;
	font-weight: bold;
	font-family: 'ProximaNovaBold';
	line-height: 1.11;
	letter-spacing: -2px;
}
.status-vencimento {
	font-family: Roboto, sans-serif;
	font-size: 0.8125rem;
	color: #aaa;
	margin-bottom: 1.25rem;
}
#vivo-valoriza > p {
	font-family: Roboto, sans-serif;
	font-size: 0.75rem;
	color: #666666;
	margin-bottom: 1.875rem;
	margin-top: -0.75rem;
	line-height: 1.25;
}
#vivo-valoriza > ul > li {
	list-style: none;
	font-family: Roboto, sans-serif;
	font-size: 0.875rem;
	padding: 1.25rem 0;
}
#vivo-valoriza > ul > li:first-child {
	/* border-bottom: 0.125em solid #F3F3F3; */
}
#vivo-valoriza > ul > li:last-child {
	margin: 0 -1.25rem;
	/* border-top: 0.125em solid #F3F3F3; */
}
#vivo-valoriza > ul > li > a {
	text-decoration: none;
	font-family: Roboto;
	font-size: 0.875rem;
	color: #333333 !important;
}
#vivo-valoriza > ul > li:last-child {
	padding: 0.9375rem 1.25rem 0 1.25rem;
}
#vivo-valoriza > ul > li:last-child > a {
	color: #660099 !important;
}
#vivo-valoriza > ul > li > a > div {
	float: right;
    font-weight: bold;
    font-family: roboto;
    color: #333333;
}
.configure-sua-conta {
	margin-bottom: -60px !important;
}
.configure-sua-conta > h2 {
	margin-bottom: 1.25rem;
}
.configure-sua-conta ul li {
	margin: 0 -1.25rem;
	padding-right: 1.25rem;
	padding-left: 1.25rem;
}
.configure-sua-conta p {
	display:none;
}
#link-resgate-seus-pontos > a{
	color: #660099 !important;
	font-weight: bolder;

}
#link-resgate-seus-pontos > a > div > i{
	color: #660099 !important;
	font-weight: bolder;
	font-size: 1.250em;
}
main h2 {
	color: #630096;
	margin-bottom: 0.9375rem;
	font-family: 'ProximaNovaBold';
	font-size:  1.5rem;
}
#minha-conta > .box > ul:first-child{
	margin-top: -0.9375rem;

}
#minha-conta > .box > ul > li {
	margin-right: -1.2rem;
	margin-left: -1.2rem;
	padding-right: 1.25rem;
	padding-left: 1.25rem;
}
#minha-conta > .box > ul > li:last-child{
	margin-bottom: -20px;
}
#minha-conta > .box > ul > li:first-child {
    margin-top: -20px !important;
}
#minha-conta > .box > ul > li > a > div > i {
	font-size: 1.375rem;
	font-weight: bold;
}
#suporte-tecnico .box > ul {
	margin-top: -0.9375rem;
    margin-bottom: -0.9375rem;
}
#suporte-tecnico .box > ul > li {
	margin-right: -1.2rem;
	margin-left: -1.2rem;
	padding-right: 1.25rem;
	padding-left: 1.25rem;
}
#suporte-tecnico .box > ul > li:first-child {
    margin-top: -20px;
}
#suporte-tecnico .box > ul > li:last-child {
	margin-bottom: -20px;
}
#suporte-tecnico .box > ul > li > a > div > i {
	font-weight: bold;
    font-size: 1.375rem;
}
#outros > .box > h2 {
	color: #000;
	margin-bottom: 0.9375rem;
	font-family: 'ProximaNovaBold';
}
#outros > .box > ul:last-child{
	margin-bottom: -1.25rem;
}
#outros > .box:last-child > a {
	font-size: 0.875rem;
}
#outros > .box:last-child > a > div > i {
	font-size: 1.375rem;
	font-weight: bold;
}
#outros ul li {
	margin-right: -1.2rem;
	margin-left: -1.2rem;
	padding-right: 1.25rem;
	padding-left: 1.25rem;
}
#outros ul li:last-child {
	border-bottom: none;
}
#outros ul li a i {
	font-size: 1.375rem;
	font-weight: bolder;
	margin-top: -0.1em;
}
#outros .box:last-child {
	margin: 0 0.82px;
}
#outros .box:last-child > div:first-child {
	max-height: 20px;
}
#homepage a {
    color: #660099 !important;
    font-family: 'Roboto' !important;
    font-weight: bold;
}

footer {
	bottom: 0;
	left: -0.625rem;
	position: fixed;
	width: calc(100% + 0.625rem);
	height: 3.125rem;
	display: flex;
	flex-direction: row;
	background: #fff;
	box-shadow: 0 0 15px 0 rgba(220, 220, 220, 0.3);
	border-top: 0.1rem solid #f4f4f4;
	z-index: 9999;
}

footer div {
	text-align: center;
	margin-top: 0.625rem;
}

.nav-item {
	width: 20%;
	color: #979797;
}

.nav-item-active {
	color: #660099;
}

.nav-item p {
    font-family: Roboto;
    font-size: 0.6875rem;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 0.91;
    letter-spacing: normal;
	text-align: center;
}

.ui-mobile [data-role="page"] {
    z-index: 1;
    background: #f4f4f4 !important;
}

#main-menu {
	margin: 0.938rem;
	font-family: 'Roboto', serif;
	margin-top: 3.813rem;
	margin-bottom:  4rem;
}

#homepage + script + #main-menu {
	margin: 14.2px;
	font-family: 'Roboto', serif;
	margin-top: 0.9375rem;
	margin-bottom:  4rem;
}

.ui-overlay-a{
	background-color:#f4f4f4;
}

.ui-mobile [data-role="page"] {
	left: 0;
	-webkit-transition: unset !important;
	-moz-transition: unset !important;
	-o-transition: unset !important;
	transition: unset !important;
	position: absolute !important;
}

.ui-mobile [data-role="page"].menu-open {
    left: 100%;
    position: fixed !important;
}

#detalhamentoTT [data-role="footer"] {
	/*position: fixed;*/
}

table[id*="6f399fbb18ae64b5acd1d322e9cfa2a0"] {
	margin-top: -5rem;
}

.margin-IOS .header {
	padding-top: 0!important;
}

.caixa-avaliacao {
   /* position: fixed;*/
    margin-bottom: 3rem;
}

#cancelamentoContentBackground #botaoProximo {
    margin-bottom: 3.5rem;
}

@supports (-webkit-overflow-scrolling: touch) {
	@media only screen and (min-device-width: 320px) and (max-device-height: 568px) 
	and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
		.configure-sua-conta {
			margin-bottom: 60px !important;
		}
    }
}