header {width: 100%; height: 100px; background: #2c2c2c;}
header .container {width: 90%; max-width: 1100px; height: 100%; margin: 0 auto; display: flex; align-items: center; justify-content: space-between;}
.logo a {display: flex; align-items: flex-end;}
.logo img{ width: 120px; height: 20px; }
.logo span {font-size: 18px; color: #fff; margin-left: 10px;}
.menu-mobile-link {color: #fff; font-size: 35px; cursor: pointer;}
.menu {display: none;}
.menu a {font-size: 16px; color: #fff; margin-left: 15px;}

.form {width: 100%; padding: 50px 5%; background: url(../img/bg-mobile.jpg) fixed center no-repeat; background-size: cover; display: flex; flex-flow: column; align-items: center;}
.form h2 {font-size: 20px; color: #d5c06b; font-weight: 300; text-transform: uppercase; padding: 0 0 15px; position: relative; margin-bottom: 30px;}
.form h2:after {content: ''; width: 90%; height: 5px; background: #d5c06b; position: absolute; bottom: 0; left: 5%;}
.form h2 strong {font-weight: 900;}
.form form {width: 100%; display: flex; flex-flow: row wrap; justify-content: center; align-items: center;}
.input {width: 100%; height: 45px; background: rgba(17,17,17,0.8); border: 1px solid #d5c06b; font-weight: 300; padding: 0 5px; font-size: 14px; margin-bottom: 10px; color: #fff; transition: .3s;}
.select-half {width: 48%; height: 45px; background: rgba(17,17,17,0.8); border: 1px solid #d5c06b; font-weight: 300; font-size: 14px; margin-bottom: 10px; color: #fff; background: url(../img/caret-white.png) 95% 50% no-repeat rgba(17,17,17,0.8); transition: .3s;}
.input-half {width: 48%;}
.form form a {font-size: 16px; color: #d5c06b; font-weight: 300; margin-bottom: 10px;}
.button {width: 100%; height: 50px; background: #d5c06b; font-weight: bold; display: flex; align-items: center; justify-content: center; transition: .3s; color: #000; font-size: 16px;}
.button:hover {background: #e0d193;}
.button:first-child {margin-bottom: 10px;}
button.first {margin-bottom: 10px;}
a.first {margin-bottom: 10px;}
.login form .icon {font-size: 18px;}
.radio {width: 100%; padding: 30px 0; display: flex; flex-flow: column; align-items: center;}
.radio .item {width: 284px; display: flex; align-items: center;}
.radio .item:first-child {margin-bottom: 10px;}
.radio .item span {color: #fff; font-size: 14px; font-weight: 300;}
.radio .item a {display: inline; font-size: 14px !important;}
.form-edit {width: 95%; margin: 0 auto; display: flex; flex-flow: row wrap; justify-content: space-between;}
.form-edit .select-half, .form-edit .input-half {width: 49%;}
.form-edit .select-half, .form-edit .input {background: transparent; color: #2c2c2c; font-weight: 400;}
.form-edit .input::placeholder {color: #2c2c2c;}
.form-edit .input-half::placeholder {color: #2c2c2c;}
.form-edit .input::-ms-placeholder {color: #2c2c2c;}
.form-edit .input-half::-ms-placeholder {color: #2c2c2c;}
.form-edit .radio .item span {color: #2c2c2c; font-weight: 400; margin-left: 10px;}
.radio .item span {margin-left: 10px;}

.about {width: 100%; background: #212121; padding: 30px 5%; display: flex; flex-flow: column; align-items: center;}
.title {font-size: 30px; color: #d5c06b; font-weight: 300; text-transform: uppercase; padding: 0 0 15px; position: relative; margin-bottom: 40px; text-align: center;}
.title strong {font-weight: 900;}
.title:after {content: ''; width: 20%; height: 5px; background: #d5c06b; position: absolute; bottom: 0; left: 40%;}
.title-confirm {line-height: 24px; padding: 0 !important; margin-bottom: 10px !important;}
.title-confirm:after {display: none;}
.title-black {color: #2c2c2c; line-height: 24px; margin: 40px 0;}
.title-left {text-align: left;}
.title-left:after {left: 0;}
.title .white {color: #fff;}
.about p {width: 80%; font-size: 14px; color: #fff; font-weight: 300; line-height: 16px; text-align: center; margin-bottom: 20px;}
.about .icon {font-size: 18px;}

footer {width: 100%; height: 250px; background: #000; border-bottom: 3px solid #d5c06b; display: flex; flex-flow: column; align-items: center; justify-content: center;}
footer h2 {font-family: 'Rockwell Condensed'; font-weight: bold; font-size: 25px; color: #d5c06b; text-transform: uppercase;}
footer img {max-width: 90%; margin-top: 26px; }
.social {display: flex; margin: 20px 0;}
.social a {width: 40px; height: 40px; border-radius: 40px; line-height: 40px; text-align: center; background: #d5c06b; color: #000; font-size: 20px; transition: .3s;}
.social a:first-child {margin-right: 15px;}
.social a:hover {background: #e0d193;}
.links {display: flex;}
.links a {font-size: 16px; color: #d5c06b; margin-bottom: 20px;}
.links a:hover {color: #e0d193;}
.links a:first-child {margin-right: 15px;}
.group {font-size: 16px; color: #b6b6b6;}

.pop-up {width: 95%; height: 95vh; position: fixed; z-index: 6; top: 2.5%; left: 2.5%; background: #151515; padding: 100px 2.5% 0; display: none;}
.pop-up p {color: #fff; text-align: center; font-size: 16px; line-height: 20px; font-weight: 300; margin-bottom: 10px;}
.pop-up input {width: 100% !important; max-width: 450px;}
.pop-up .buttons {display: flex; justify-content: center; margin-top: 40px; }
.pop-up .buttons .button:first-child {margin-right: 10px;}
.pop-up .button {width: 100% !important;}
.pop-up .close {font-size: 12px; color: #fff;  font-weight: 300px; position: absolute; top: 2.5%; right: 2.5%; cursor: pointer;}
.pop-up .close strong {color: #d5c06b; font-weight: bold; font-size: 10px;}
.confirm {display: none; flex-flow: column; align-items: center;}
.confirm img {margin-bottom: 10px;}
.pop-up form {display: flex; flex-flow: column; align-items: center;}
.pop-message {display: block;}


.new-pass {height: calc(100vh - 350px) !important; min-height: 250px; justify-content: center;}
.sign-up {justify-content: flex-start; padding: 35px 5% 20px;}
.sign-up form {justify-content: space-between;}
.banner {width: 100%; height: 150px; background: url(../img/bg-mobile.jpg) fixed center no-repeat; background-size: cover; display: flex; justify-content: center; align-items: center;}
.banner .title {margin: 0 !important; font-weight: 900 !important;}

.text-rules {width: 100%; background: #212121;}
.text-rules .container {width: 90%; max-width: 900px; margin: 0 auto; padding: 50px 0;}
.text-rules h3 {font-size: 16px; color: #fff; margin-bottom: 20px; text-transform: uppercase; }
.text-rules p {font-size: 14px; color: #fff; font-weight: 300; line-height: 22px; margin-bottom: 20px;}
.text-rules p span{ text-transform: uppercase; }
.text-rules p:last-child {margin: 0;}
.text-rules p.yellow {color: #d5c06b;}
.text-rules .border {width: 100px; height: 5px; background: #d5c06b; margin-bottom: 20px;}
.title-table {font-size: 22px !important; font-weight: 900; line-height: 30px; text-align: center; width: 305px; margin: 40px auto !important; padding-bottom: 20px; position: relative;}
.title-table:after {content: ''; width: 100px; height: 5px; background: #d5c06b; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
.table {width: 100%; padding: 20px 0 40px; border-radius: 5px; background: #fff; display: flex; flex-flow: column; align-items: center; margin-bottom: 40px;}
.table .logo {display: flex; justify-content: center; width: 90%; padding-bottom: 15px; border-bottom: 1px solid #d9d9d9;}
.table .logo img {width: 120px;}
.table .item {width: 80%; display: flex; border-bottom: 1px solid #d9d9d9; padding: 15px 0;}
.table .item:last-child {border: none;}
.table .item .left, .table .item .right {width: 50%; color: #333232; font-size: 14px; line-height: 20px; position: relative; padding: 0}
.table .item .left:after {content: ''; width: 1px; height: 100%; background: #d9d9d9; position: absolute; top: 0; right: 0;}
.table .item .right {padding-left: 10px;}
.text-rules .rule {margin-bottom: 40px !important;}

.user {width: 100%; padding: 35px 0 20px;}
.box-user {width: 90%; padding: 35px 10%; background: #2c2c2c; margin: 0 auto;}
.box-user .info {width: 100%; display: flex; flex-flow: column;}
.box-user .item {width: 100%; display: flex; align-items: center; padding: 0 5px 10px; border-bottom: 1px solid #d5c06b; margin-bottom: 15px;}
.box-user .ico {width: 40px; height: 30px; border-right: 1px solid #d5c06b; display: flex; align-items: center;}
.box-user .ico img {max-width: 25px; max-height: 25px}
.box-user .ico p.text {font-size: 14px; font-weight: bold; color: #d5c06b; margin: 0 !important;}
.box-user p {font-size: 12px; color:  #fff; margin-left: 15px;}
.box-user .buttons {width: 100%; height: 35px; display: flex; justify-content: space-between;}
.box-user .buttons a {width: 48%; height: 35px; line-height: 35px; text-align: center; background: #d5c06b; color: #000; font-weight: bold; font-size: 12px; transition: .3s;}
.box-user .buttons a:hover {background: #e0d193;}

.welcome {width: 95%; padding: 100px 2.5%; max-height: 95vh; overflow-y: scroll; background: #fff; position: fixed; top: 50%; left: 2.5%; transform: translateY(-50%);}
.welcome p {font-size: 12px; line-height: 20px; color: #2c2c2c; margin-bottom: 15px}
.welcome .close {font-size: 12px; color: #2c2c2c;  font-weight: 300px; position: absolute; top: 2.5%; right: 2.5%; cursor: pointer;}
.welcome .close strong {color: #d5c06b; font-weight: bold; font-size: 10px;}

.purchase-list {width: 90%; margin: 0 auto}
.purchase-list select {width: 100%; height: 35px; border: 1px solid #c8c8c8; padding: 0 10px; background: url(../img/caret-down.png) 95% 50% no-repeat;}
.purchases {padding-top: 10px; margin-top: 10px; width: 100%;}
.purchases .item {width: 100%; height: 100px; border: 1px solid #c8c8c8; display: flex; justify-content: space-between; align-items: center; padding: 20px 5%; margin-bottom: 15px;}
.purchases .left {display: flex; flex-flow: column; align-items: center; width: 40%;}
.purchases .date {font-size: 14px; font-weight: bold; color: #2c2c2c; padding-bottom: 10px; width: 100%; border-bottom: 1px solid #c8c8c8; margin-bottom: 10px; font-weight: 900;}
.purchases .local {width: 100%; font-size: 18px; color: #2c2c2c; font-weight: 900;}
.purchases .value {font-size: 14px; color: #2c2c2c; font-weight: 900;}
.purchases .value strong {font-size: 28px;}
.purchases .selected {background: #d5c06b; border: none; box-shadow: 0 0 30px rgba(0,0,0,0.35);}
.purchases .selected .date {color: #7c6c29; border-bottom: 1px solid #7c6c29;}
.purchases .selected .value, .purchases .selected .local {color: #7c6c29;}

.about-program {width: 90%; max-width: 800px; padding: 50px 0; margin: 0 auto;}
.about-program p {font-size: 14px; color: #2c2c2c; margin-left: 8px; line-height: 22px; margin-bottom: 20px; font-weight: 300;}
.tabs {width: 100%; display: flex; justify-content: space-between; margin: 40px 0;}
.tabs a {width: 48%; height: 60px; border: 1px solid #d5c06b; line-height: 60px; text-align: center; font-size: 16px; font-weight: 900; color: #2c2c2c; transition: .3s;}
.tabs a:hover {background: #d5c06b;}
.tabs a.selected {background: #d5c06b;}
.categorys {width: 100%;}
.categorys h2 {font-size: 22px; text-transform: uppercase; color: #d5c06b; text-align: center; font-weight: 300;padding-bottom: 15px; border-bottom: 1px solid #aeaeae; position: relative;}
.categorys h2 strong {font-weight: 700;}
.categorys h2 span {position: absolute; top: 50%; right: 0; transform: translateY(-85%);}
.categorys .item {width: 100%; margin-bottom: 20px;}
.categorys .flag {width: 100%; display: flex; justify-content: space-between; align-items: center; padding-top: 20px;}
.categorys .flag figure {width: 48%;}
.categorys .flag p {width: 48%; float: right; line-height: 40px; }
.categorys .flag p span{ font-weight: 700; }

.how-to-use {width: 100%; display: none;}
.how-to-use .steps {width: 100%; display: flex; flex-flow: column; align-items: center;}
.how-to-use .item {width: 90%; display: flex; flex-flow: column; align-items: center; background: #fbfbfb; padding: 40px; margin-bottom: 25px; }
.how-to-use .border {width: 2px; height: 35px; background: #cccccc;}
.how-to-use figure span {font-size: 25px; font-weight: 900; color: #d5c06b;}
.how-to-use p {font-size: 16px; color: 212121; margin: 0; }
.box-info {width: 85%; display: flex; flex-flow: column; background: #fbfbfb; padding: 60px; box-shadow: 0 0 20px rgba(0,0,0,0.1); margin: 40px auto 0;}
.box-info .line {display: flex; align-items: center; padding-left: 50px; }
.box-info .line:first-child {padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #aeaeae;}
.box-info .line p {margin: 0 0 0 20px;}

.menu-mobile {width: 100%; height: calc(100vh - 100px); background: #212121; position: fixed; top: 100; right: 0; z-index: 2; padding: 20px; display: none;}
.menu-mobile a {font-size: 18px; color: #fff; text-align: center; line-height: 50px;}
.menu-mobile a.close-menu {position: absolute; top: 10px; left: 20px; font-size: 38px; z-index: 5;}

@media (min-width: 992px){
	.form {background: url(../img/bg-home.jpg) fixed top center no-repeat; padding: 70px 5%; background-size: cover; }
	.form form {flex-flow: column; width: 450px;}
	.sign-up form {flex-flow: row wrap;}
	.sign-up form .button {margin: 0 auto;}
	.radio {max-width: 350px; margin: 0 auto; align-items: flex-start;}
	.menu-mobile-link {display: none;}
	.menu {display: flex;}
	.button {max-width: 300px;}
	.sign-up .button {max-width: 350px;}
	.about p {max-width: 500px; font-size: 16px; line-height: 22px;}
	.pop-up {width: 40%; height: auto; padding: 100px 20px; left: 50%; top: 50%; transform: translate(-50%, -50%);}
	.user {display: flex; width: 1100px; margin: 0 auto; padding: 100px 0; justify-content: space-between; min-height: calc(100vh - 350px);}
	.user .title-black {height: 80px; flex: 1; font-size: 25px; line-height: 32px; align-self: center;}
	.box-user {width: 300px; height: 380px; margin: 0; padding: 40px 20px;}
	.user .right {flex: 1; margin-left: 5%;}
	.user .right .title-black {height: auto; margin-top: 0;}
	.user .right .button {max-width: 100%;}
	.purchase-list {width: 100%;}
	.text-rules p {font-size: 16px;}
	.text-rules .button {max-width: 100%;}
	.about-program p {font-size: 16px;}
	.about-program .button {max-width: 100%; margin-top: 50px;}
	.how-to-use .item {flex-flow: row;}
	.how-to-use figure { display: flex; justify-content: center; align-items: center; border-right: 1px solid #aeaeae;}
	.how-to-use p { padding-left: 60px; padding-bottom: 20px; }
	.how-to-use p strong{ font-weight: bold; }
	.how-to-use p:last-child{ padding-bottom: 0; }
	.how-to-use h3{ padding-left: 60px; font-size: 16px; margin-bottom: 20px; }
	.item figure img{ padding-right: 40px; }
	.welcome {width: 500px; height: 500px; overflow: hidden; box-shadow: 0 0 30px rgba(0,0,0,0.2); position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);}
	.welcome p {font-size: 16px; line-height: 22px;}
}

@media (max-width: 1366px){

	.form { width: 100%; padding: 50px 5%; background: url(../img/bg-home-desk.jpg) fixed center no-repeat; background-size: none;  display: flex; flex-flow: column; align-items: center;}

}

@media (max-width: 992px){

	.how-to-use p { padding-bottom: 20px; text-align: center; }
	.how-to-use p strong{ font-weight: bold; }
	.how-to-use p:last-child{ padding-bottom: 0; }
	.how-to-use h3{ font-size: 16px; margin: 20px 0; text-align: center; }
	.about-program .button { max-width: 100%; margin-top: 50px; }
	.box-info{ width: 100%; padding: 30px; }
	.box-info .line{ padding-left: 30px; }
	.engloba-beneficios-body{ padding: 10px 10px 0 10px; }
	.tabs a{ font-size: 14px; }
	.button{ height: 45px; font-size: 14px; }
	.form-edit { margin: 0 auto 40px auto; }
}


/*****************************************
*                                        *
*      AtualizaÃ§Ã£o Madero fidelidade     *
*                                        *
*****************************************/

.orbital-fidelidade{ position: relative; width: 100%; height: 100%; margin: 0 auto; padding: 30px 0; }
.enbloga-orbital{ position: relative; width: 1100px; height: 100%; margin: 0 auto; }
.dados-usuario{ width: 49%; padding: 40px 20px; margin-right: 2%; border: 1px solid #d5c06b; background-color: #2c2c2c; float: left; }
.enbloba-dados-usuario{ position: relative; width: 100%; height: 100%; }
.box-dados{ width: 100%; }
.border-fidelidade{ border-bottom: 1px solid #d5c06b; padding-bottom: 15px; margin-bottom: 15px }
.item-dados{ width: 49%; float: left; margin-right: 2%; }
.item-dados:last-child{ margin-right: 0%; }
.item-dados p{ color: #fff; font-size: 14px; margin-top: 5px; margin-left: 15px; padding-left: 15px; border-left: 1px solid #d5c06b; }
.ico-dados img{  }
.ico-dados span{ display: block; font-size: 18px; color: #d5c06b; font-weight: 700; padding: 5px 0; }
.orbital{ width: 49%; padding: 30px 0; border: 1px solid #d5c06b; background-color: #2c2c2c; float: right; }
.orbital h2{ font-size: 30px; text-align: center; font-weight: 300; text-transform: uppercase; color: #fff; }
.orbital h2 span{ font-weight: 700; }
.left{ float: left; }
.engloba-buttons{ display: flex; }
.button-cartao-virtual, .button-cartao-virtual2{ transition: 0.3s; width: 49%; height: 65px; color: #000; border: 1px solid #d5c06b; background-color: #d5c06b; font-size: 16px; font-weight: 700; margin: 50px auto 10px auto; }
.button-cartao-virtual:first-child, .button-cartao-virtual2:first-child{ margin-right: 2%; }
.button-cartao-virtual:hover, .button-cartao-virtual2:hover{ background-color: #fff; }

.extrato-compras{ position: relative; width: 100%; height: 100%; padding: 30px 0; }
.color-text{ color: #000; }
.color-text:after { content: ''; width: 11%; height: 5px; background: #d5c06b;position: absolute; bottom: 0; left: 45%; }
.buttons-extrato{ position: relative; padding:0 0 25px 0; width: 100%; height: 100%; display: flex; flex-flow: row nowrap;  }
.cada-button-extrato{ width: 24.50%; height: 75px; border: 1px solid #ccc; margin-right: 2%; color: #777; font-size: 16px; transform: translate(0, 0); }
.cada-button-extrato:hover{ background-color: #2c2c2c; color: #fff; transform: translate(0, -10px); box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.3); }
.cada-button-extrato-ativo{ background-color: #2c2c2c; color: #fff; transform: translate(0, -10px); box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.3); }
.cada-button-extrato:last-child{ margin-right: 0; }

.lista-extrato-compra{ position: relative; width: 100%; height: 100%; padding: 20px 0 5px 0; border: 1px solid #ccc; }
.engloba-header{ position: relative; width: 100%; height: 100%; padding: 0 0 20px 0; display: flex; flex-flow: row nowrap; }
.header-extrato{ width: 25%; display: flex; flex-flow: row nowrap; align-items: center; font-size: 16px; color: #777; padding: 0 20px; }
.seta-header{ display: flex; flex-flow: column; margin-left: 14px; }
.seta-header span{ cursor: pointer; }

.engloba-itens-extrato{ position: relative; width: 100%; height: 100%; display: flex; flex-flow: column; }
.cada-linha{ position: relative; width: 100%; height: 100%; display: flex; flex-flow: row nowrap; border-top: 1px solid #ccc; }
.itens-extrato{ padding: 25px 20px; width: 25%; font-size: 16px; font-weight: 700; display: flex; align-items: center; }
.validade-item{ display: block; }
.itens-extrato span{ display: block; margin-top: 5px; }
.validade, .resgate{ color: #777; }
.expirado{ color: #ba3030 !important; }
.bonus{ background-color: #d5c06b; color: #fff;  }
.bonus .validade{ color: #fff; }
.bandeira-bonus{ display: block; padding: 25px 20px; display: flex; align-items: center; background-color: #2c2c2c; }
.button-ver-mais{ transition: 0.3s; width: 260px; height: 65px; color: #000; border: 1px solid #d5c06b; background-color: #d5c06b; font-size: 16px; font-weight: 700; margin: 50px auto 10px auto; }
.button-ver-mais:hover{ background-color: transparent; }
.hide{ display: none; }
.quant-pontos{ position: absolute; color: #fff; top: -12px; right: -12px; display: block; text-align: center; border-radius: 50%; height: 30px; width: 30px; line-height: 28px; background-color: #d5c06b; }
#pontos-ganhos .cada-linha p{ color: #000; }
.detalhe-cat{ display: flex; align-items: center; text-align: justify; }
.detalhe-cat p{ line-height: 30px; }
.detalhe-cat span{ font-weight: 700; }


@media (max-width: 1250px){

	.enbloga-orbital{ width: 97%; }

}

.center{ text-align: center; }
.button-cadastre{ width: 250px; margin: 0 auto; height: 60px; }
.line-up{ border-top: 1px solid #aeaeae; padding-top: 10px; margin-top: 10px; }
.pontuacao-minima{ margin-top: 60px; }
.pontuacao-minima h3{ font-size: 16px; margin-bottom: 50px; text-align: center; font-weight: 400; }
.engloba-img-pontos{ margin: 0 auto; display: flex; flex-flow: row nowrap; margin-bottom: 50px; }
.engloba-img-pontos span{ font-size: 14px; }
.engloba-img-pontos span:nth-child(3){ font-size: 30px; line-height: 25px; color: #d5c06b; padding: 10px 0; }
.img-pontos{ width: 33.33%; text-align: center; display: flex; flex-flow: column; margin-bottom: 30px; }
.img-pontos img{ margin: 0 auto; }

.pontuacao-orbital{ position: absolute; color: #fff; line-height: 60px; padding-top: 2px; text-align: center; font-size: 17px; text-transform: uppercase; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.pontuacao-orbital span{ font-weight: 700; font-size: 17px; }
.orbital h4{ font-size: 16px; color: #fff; font-weight: 300; text-align: center; line-height: 20px; }
.orbital span{ font-weight: 700; }
.engloba-pontos-topo{ background-color: #d5c06b;  }
.engloba-pontos-topo{ margin-top: 30px; }
.pontos-topo{ display: flex; align-items: center; }
.pontos-topo p{ width: 50%; float: left; margin-top: 20px; font-weight: 700; }
.pontos-topo p span{  display: block; text-align: center; }
.engloba-pontos-body{ position: relative; width: 100%;  }
.border-pontos{  border-bottom: 1px solid #aeaeae; }
.pontos-body { display: flex; }
.pontos-body p{ width: 50%; float: left; margin-top: 20px; }
.pontos-body p span{  display: block; text-align: center; }


.engloba-beneficios-topo{ position: relative; margin-top: 30px; width: 100%; padding: 20px; background-color: #d5c06b; display: flex; justify-content: flex-end; margin-bottom: 15px; }
.bandeira-beneficios{ width: 250px; display: flex; flex-flow: row nowrap; justify-content: space-around; }
.engloba-beneficios-body{ position: relative; width: 100%; padding: 20px 20px 0px 20px; display: flex; flex-flow: row nowrap; }
.titulo-benef{ display: flex; width: 75%; flex-flow: row nowrap; justify-content: flex-start; }
.check-benef{ display: flex; width: 250px; flex-flow: row nowrap; justify-content: space-around; }
.check-benef p:last-child{ margin-right: 17px; }
.cada-link{ cursor: pointer; }
.detalhe{ display: none; }
.show{ display: block; }
.engloba-box-orbital{ display: flex; justify-content: center; margin-top: 22px; }
.itens-orbital{ position: absolute; }
.engloba-itens-orbital{ position: absolute; position: absolute; top: 45px; left: 60px; text-align: center; }
.engloba-itens-orbital p{ color: #fff; font-size: 16px; text-transform: uppercase; font-weight: 300; }
.engloba-itens-orbital p span{ font-weight: 700; }
.engloba-itens-orbital p { line-height: 60px; }
.value-orbital{ display: flex;  flex-flow: column; height: 100%; margin-top: 50px;  }
.orbital-madero-fidelidade{ position: relative; width: 210px; height: 210px; }
.orbital-madero-fidelidade:first-child{ margin-right: 25px; }
.value-orbital p{ color: #fff; font-size: 16px; text-transform: uppercase; font-weight: 300; line-height: 20px; }
.value-orbital p span{ font-weight: 700; }
.value-orbital h3{ font-size: 22px; color: #d5c06b; line-height: 45px; }
.cont-faltam-mob{ display: none; }
.border-fidel { width: 70px; height: 5px; background: #d5c06b; position: relative; margin: 0 auto; margin-top: 30px; }
.baixe-app{ display: none; }
.baixe-app img:first-child{ margin-bottom: 10px; }
.carregamento{ margin: 0 auto; }
.baixe-app-desk a:first-child{ margin-right: 10px; }
.cartao-virtual{ width: 260px; margin: 0 auto; background-color: #fff;  padding: 15px; border-radius: 6px; }
.background-linha{ position: absolute; width: 100%; height: 100%; background: url(../img/linha.png) no-repeat; left: 82%; top: 50%; transform: translate(-50%,-50%); }
.linha{ position: relative; z-index: 1; padding: 15px; border: 1px solid #fff; border-radius: 6px; }
.linha h4{ font-size: 18px; font-weight: 400; line-height: 25px; }
.linha h3{ font-size: 15px; font-weight: 400; text-transform: initial; line-height: 25px; margin-bottom: 7px; }
.linha h5{ font-size: 13px; font-weight: 400; text-transform: initial; line-height: 22px; }
.back-cartao-green{ background-color: #1b917f; color: #fff;  }
.back-cartao-black{ background-color: #000; color: #fff;  }

@media (max-width: 992px){

	.buttons-extrato{ display: none; }
	.dados-usuario{ width: 97%; float: none; margin: 0 auto 20px auto; }
	.orbital{ width: 97%; float: none; margin: 0 auto; }
	.bandeira-bonus{ display: none; }
	.baixe-app{ display: block; display: table; margin: 0 auto; }
	.button-cartao-virtual, .button-cartao-virtual2{ width: 100%; height: 60px; font-size: 14px; margin-top: 10px; }
	.engloba-buttons{ flex-flow: column; }
	.detalhe-cat { flex-flow: column; text-align: justify; }
	.background-linha{ left: 64%; }
	.button-cartao-virtual{ margin-top: 30px; }


}

@media (max-width: 768px){

	.engloba-box-orbital{ display: block; }
	.orbital-madero-fidelidade:first-child{ margin: 0 auto; }
	.orbital-madero-fidelidade{ margin: 0 auto; height: auto; text-align: center; }
	.cont-faltam{ display: none; }
	.cont-faltam-mob{ display: block; margin-top: 20px; }
	.color-text:after { content: ''; width: 27%; height: 5px; background: #d5c06b; position: absolute; bottom: 0; left: 38%; }
	.value-orbital{ margin-top: 30px; }
	.item-dados { width: 100%; float: none; margin: 0 auto; padding-left: 30px; }
	.item-dados:last-child { margin: 0 auto; }
	.border-fidelidade{  border-bottom: 0px; padding-bottom: 0; margin-bottom: 0; }
	.item-dados{ border-bottom: 1px solid #d5c06b; margin: 15px auto; padding-bottom: 15px; }
	.border-none{ border-bottom: none; }
	.orbital h2, .title{ font-size: 26px; }
	.seta-header{ display: none; }
	.itens-extrato { padding: 20px 10px; width: 25%; font-size: 12px; }
	.header-extrato { font-size: 13px; padding: 0 10px; }
	.engloba-beneficios-body{ align-items: center; padding: 20px 0 0 0; }
	.how-to-use .item{ padding: 20px; }
	.button-ver-mais{ width: 260; height: 60px; }
	.box-info .line{ display: block; text-align: center; }
	.box-info .line img{ margin: 0 auto 10px auto; }
	.engloba-beneficios-topo{ padding: 20px 0; }

}

@media (max-width: 550px){
	.img-pontos { width: 100%; }
	.engloba-img-pontos{ flex-flow: column; }
	.categorys .flag{ flex-flow: column; }
	.categorys .flag figure{ margin-bottom: 15px; }
	.categorys .flag p{ width: 97%; }
	.validade{ font-size: 10px; }
	.box-info .line p{ margin: 0; }
	.box-info .line{ padding-left: 0; }
	.baixe-app-desk a{ float: none; }
	.baixe-app-desk a:first-child{ margin-right: 0px; margin-bottom: 10px; }
	.background-linha{ left: 57%; }
}

/*****************************************
*                                        *
*           popups fidelidade            *
*                                        *
*****************************************/

#novos-pontos{ display: none; }
#pontos-presente{ display: none; }
#mudanca-categoria{ display: none; }
#cartao-virtual{ display: none; }
.pano-madero-fidelidade { position: absolute; top: 0; width: 100%; height: 100%; z-index: 5; background-color: rgba(0,0,0,.2); display: none; }
.popop-fidelidade{ position: fixed; z-index: 10; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #222; }
.engloba-conteudo{ position: static; top: 0; width: 800px; height: 500px; text-align: center; }
.conteudo-popup{ position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%); text-transform: uppercase; line-height: 35px; }
.conteudo-popup img{ margin: 0 auto; margin-bottom: 20px; }
.conteudo-popup p{ font-size: 24px; color: #d5c06b;  }
.conteudo-popup span{ color: #fff; font-weight: 700; font-size: 26px; }
.conteudo-popup p span{ font-weight: 700; color: #d5c06b; }
.fechar-popup{ position: absolute; color: #fff; font-weight: 300; top: 20px; right: 20px; }
.fechar-popup span{ color: #d5c06b; font-weight: 700; }
.conferir-extrato{ position: relative; top: 20px; width: 220px; height: 55px; color: #000; font-size: 16px; background-color: #d5c06b; margin: 0 auto; }
.conferir-extrato:hover{ background-color: #fff; }
.uso{ font-size: 12px !important; color: #fff !important; text-transform: initial !important; line-height: 15px !important; }
.buttons-extrato-mob{ position: relative; width: 100%; display: none; }
.button-extrato-mob{ width: 100%; border: 1px solid #ccc; padding: 13px; font-size: 18px; color: #777; }
.right{ float: right; }
.buttons-extrato-mob ul{ position: absolute; z-index: 10; width: 100%; background-color: #fff; font-size: 16px; color: #777; display: none; }
.buttons-extrato-mob ul li{ width: 100%; border: 1px solid #ccc; padding: 15px; text-align: center; background-color: #fff; cursor: pointer;  }
.circle-mob{ position: absolute; top: 8px; right: 10px; display: block; width: 30px; height: 30px; border: 1px solid #d5c06b; background-color: #d5c06b; line-height: 20px; border-radius: 50%; color: #fff; line-height: 25px; }
.pontos-ganhos-circle{ position: relative; }
.novo-usuario{ display: block }
.paragrafo-novo-user{ font-size: 16px !important; text-transform: initial !important; color: #fff !important; }
.conteudo-user-novo{ position: relative; width: 70%; margin: 0 auto; }
.title span{ color: #fff !important; font-weight: 300; }

.group {
  width: 100%;
}

.extra {
  width: 70% !important;
  float: right;
  text-align: right;
  font-size: 1em;
}

@media (max-width: 992px){

	.engloba-conteudo{ width: 500px; }
	.icon-popup img{ width: 70px; }
	.conteudo-popup p{ font-size: 18px; }
	.conteudo-popup span{ font-size: 20px; }
  .buttons-extrato-mob{ display: block; }
  .extra{font-size: .5em;}

}

@media (max-width: 520px){

  .engloba-conteudo{ width: 310px; }
  .extra{font-size: .5em;}

}


