body {
  background:#f2f2f2;
  width: 100vw;
  height: 100vh;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between; }

a {
  transition: all .3s ease; }
@import url(https://fonts.googleapis.com/css?family=Roboto:400,400italic,700,700italic,900);

button, fieldset, iframe, img {
  border: 0; }

/* fontes */

@font-face {
  font-family: 'FuturaStd-Medium';
  src: url("../fontes/FuturaStd-Medium.eot");
  src: url("../fontes/FuturaStd-Medium.eot?#iefix") format("embedded-opentype"), url("../fontes/FuturaStd-Medium.woff") format("woff"), url("../fontes/FuturaStd-Medium.ttf") format("truetype"), url("../fontes/FuturaStd-Medium.svg#FuturaStd-Medium") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'FuturaStd-Bold';
  src: url("../fontes/FuturaStd-Bold.eot");
  src: url("../fontes/FuturaStd-Bold.eot?#iefix") format("embedded-opentype"), url("../fontes/FuturaStd-Bold.woff") format("woff"), url("../fontes/FuturaStd-Bold.ttf") format("truetype"), url("../fontes/FuturaStd-Bold.svg#FuturaStd-Bold") format("svg");
  font-weight: normal;
  font-style: normal; }

.fonte-roboto, html, a strong {
  font-family: Roboto, Arial, sans-serif; }

.fonte-roboto-b, .conteudo .coluna1.passo1 .instrucao, .pre-impressao .info-ultima-fatura h2, .pre-impressao .info-ultima-fatura ul.dados li.codigo-barra strong, strong, form label, .conteudo .coluna2 .apresentacao header p strong, .conteudo .coluna2 .apresentacao h2, .conteudo .coluna2 .apresentacao ul li:nth-child(6) {
  font-family: Roboto, Arial, sans-serif; }

.fonte-futura, .popup.tipo-email h3, .botao, .conteudo .coluna2 .apresentacao header h1, .conteudo .coluna2 .calltoaction header h2 {
  font-family: 'FuturaStd-Medium', Arial, sans-serif; }

.fonte-futura-b, header h1, header h2, header strong, .conteudo .coluna2 .apresentacao header h1 strong, .conteudo .coluna2 .calltoaction header h2 strong {
  font-family: 'FuturaStd-Bold', Arial, sans-serif; }


/* conteúdo */

#content_login { width:960px; margin:8px auto; padding-bottom:70px; display: flex; justify-content: center; }
#content_login h1 { font-family: 'FuturaStd-Bold'; color: #00a4ec; text-transform:uppercase; font-size: 25px; padding-bottom:10px;}

#login_usuario{ width: 470px; height: 290px; float:right; background-color:#FFF;}
.imagem_usuario { background-image:url(https://loja.embratelcloud.com.br/store_images/servicos/net_sso/static/imagens/box-login-cliente-embratel.png); height: 120px;background-position: center;}

#botao { text-align:center; }
.txt_cliente { font-family:Roboto; color:#5d6267; padding: 30px; text-align:center; font-size: 13px; }


/* botões */
.botao {
  display: inline-block;
  height: 40px;
  padding: 0 15px;
  background-color: #ff2620;
  font-size: 16px;
  font-size: 1rem;
  line-height: 40px;
  text-transform: uppercase;
  color: #fff;
  text-decoration:none; }
.botao strong {
    display: inline-block;
    padding-right: 15px;
    background: url(../imagens/botao-seta-direita.png) right center no-repeat;
    font-family: FuturaStd-Medium;
    text-decoration:none; }
.botao:hover {
    background-color: #fb7200;
    text-decoration: none;
    color: #fff;
    cursor: pointer;
    text-decoration:none;
    }
.botao:hover strong {
    background-image: url(../imagens/botao-seta-direita.png); text-decoration:none; }
.botao.navegacao {
    background-color: #00a4ec;
    font-size: 14px;
    font-size: 0.875rem;
    color: #fff;
    text-decoration:none; }
.botao.navegacao strong {
    background-image: url(../imagens/botao-seta-direita.png); text-decoration:none; }
.botao.navegacao:hover {
    background-color: #0062ae;
    color: #fff;
    text-decoration:none; }

.botao-2 {
  display: inline-block;
  height: 40px;
  padding: 0 15px;
  background-color: #00d96d;
  font-size: 16px;
  font-size: 1rem;
  line-height: 40px;
  text-transform: uppercase;
  color: #fff;
  text-decoration:none;
}
.botao-2 strong {
    display: inline-block;
    padding-right: 15px;
    background: url(../imagens/botao-seta-direita.png) right center no-repeat;
    font-family: FuturaStd-Medium;
    text-decoration:none; }
.botao-2:hover {
    background-color: rgb(70,224,147);
    text-decoration: none;
    color: #fff;
    cursor: pointer;
    text-decoration:none;
}
.botao-2:hover strong {
    background-image: url(../imagens/botao-seta-direita.png); text-decoration:none; }
.botao-2.navegacao {
    background-color: #00a4ec;
    font-size: 14px;
    font-size: 0.875rem;
    color: #fff;
    text-decoration:none; }
.botao-2.navegacao strong {
    background-image: url(../imagens/botao-seta-direita.png); text-decoration:none; }
.botao-2.navegacao:hover {
    background-color: #0062ae;
    color: #fff;
    text-decoration:none; }

/* Footer */
.footer {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 0; }
.footer a {
  font-family: Roboto;
  text-align: center;
  font-size: 16px;
  color: #0DA2FF;
  text-decoration: none; }
.footer a:hover {
  color: #5d6267; }
.footer p {
  font-family: Roboto;
  color: #5d6267;
  font-size: 13px;
  margin: 0 15px; }
