
body {
	background-color: #fff;
	font-family: Century;
}

@font-face {
	font-family: Century;
	src: url("../fonts/Century.TTF");
}

@font-face {
	font-family: Galanobold;
	src: url("../fonts/GalanoGrotesqueSemiBold.eot");
	src: url("../fonts/GalanoGrotesqueSemiBold.otf");
	src: url("../fonts/GalanoGrotesqueSemiBold.ttf");
	src: url("../fonts/GalanoGrotesqueSemiBold.woff");
	src: url("../fonts/GalanoGrotesqueSemiBold.woff2");
}

@font-face {
	font-family: Galanomedium;
	src: url("../fonts/GalanoGrotesqueMedium.eot");
	src: url("../fonts/GalanoGrotesqueMedium.otf");
	src: url("../fonts/GalanoGrotesqueMedium.ttf");
	src: url("../fonts/GalanoGrotesqueMedium.woff");
	src: url("../fonts/GalanoGrotesqueMedium.woff2");
}

@font-face {
	font-family: Galanolight;
	src: url("../fonts/GalanoGrotesqueLight.eot");
	src: url("../fonts/GalanoGrotesqueLight.otf");
	src: url("../fonts/GalanoGrotesqueLight.ttf");
	src: url("../fonts/GalanoGrotesqueLight.woff");
	src: url("../fonts/GalanoGrotesqueLight.woff2");
}

.items-bar-1 {
	margin-right: 15px; /* 35px */
}

.bk {
	padding-left: 20px;
	padding-right: 20px;
	background-color: #DFAB00;
	color: #000;
	border: 1px solid #DFAB00;
}

.bk:hover {
	background-color: #F6F6F6;
	color: #000;
	border: 1px solid #F6F6F6;
}

.search {
	font-family: Arial, FontAwesome;
	width: 200px;
	border: 1px solid #fff;
	background-color: #fff;
	color: snow;
	padding: .375rem .75rem;
	transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.search:focus {
	background-color: #eee;
	color: #000;
	border-color: #eee;
	box-shadow: 0 0 0 0.2rem rgba(255,215,0,0.25);
	outline: 0;
}

::placeholder {
	color: #aaa;
	opacity: 1;
}

.selectpicker {
	height: 100%;
	padding: 0 10px;
	border: 1.2px solid goldenrod;
	font-family: Century;
}

.header-cupon {
	display: inline-block;
	width: 50%;
	position: absolute;
	top: 20%;
	left: 45%;
    text-align: center;
    font-size: 2.8rem;
}

.header-cupon span {
	border-left: 3px solid #DFAB00;
}

/** Como funciona **/
.como-funciona-padding {
	padding: 20px;
}
.box1 {
	background-color: black;
	padding: 40px;
	border-radius: 45px;
}
.box1-title {
	font-family: Galanobold;
	color: white;
	text-align: center;
}
.box1-subtitle {
	font-family: Galanolight;
	color: #DFAB00;
	letter-spacing: 2px;
	text-align: center;
}

.img-works1, .img-works2, .img-works3 {
	height:150px;
}

.box-descarga {
	width: 40%;
	margin: 0 auto;
}

.box-descarga-p {
	font-family: Galanomedium;
	color: white;
	font-size: 18px;
	line-height: 20px;
}

.box-click {
	width: 60%;
	margin: 0 auto;
}

.box-click-p {
	font-family: Galanomedium;
	color: white;
	font-size: 18px;
	line-height: 20px;
}

.box-folio {
	width: 33%;
	margin: 0 auto;
}

.box-folio-p {
	font-family: Galanomedium;
	color: white;
	font-size: 18px;
	line-height: 20px;
}

.box2 {
	background-color: #dfab00;
	padding: 40px;
	border-radius: 45px;
	margin-top: 15px;
}

.img-cel {
	height: 800px;
	position:absolute;
	top: 10%;
	left: 20%;
}

.box2-title {
	font-family: Galanobold;
	color: black;
	display: inline-block;
	text-align: left;
	width: 53%;
}

.box-tienda, .box-cupon, .box-cuenta {
	display: inline-flex;
}

.img-works4 {
	height:125px;
	margin-top: 16%;
}

.subbox-tienda {
	margin-top: 30px;
}

.subbox-tienda-title {
	font-family: Galanobold;
	padding: 15px 15px 0px 10px;
	margin-bottom: 0px;
}

.subbox-tienda-p {
	font-family: Galanomedium;
	font-size: 18px;
	line-height: 20px;
	padding: 5px 0px 0px 10px;
	margin-bottom: 0px;
}

.img-works5, .img-works6 {
	height:125px;
	margin-top: 6%;
}

.subbox-cupon, .subbox-cuenta {
	margin-top: 10px;
}

.subbox-cupon-title, .subbox-cuenta-title {
	font-family: Galanobold;
	padding: 15px 15px 0px 10px;
	margin-bottom: 0px;
}

.subbox-cupon-p, .subbox-cuenta-p {
	font-family: Galanomedium;
	font-size: 18px;
	line-height: 20px;
	padding: 5px 15px 0px 10px;
	margin-bottom: 0px;
}

.box3 {
	background-color: #000;
	padding: 40px;
	border-radius: 45px;
	margin-top: 15px;
}

.box3-title {
	font-family: Galanobold;
	color: #dfab00;
	margin-top: 185px;
	margin-bottom: 20px;
	margin-left: 100px;
}

.box3-left {
	display: inline-flex;
	margin-left: 35px;
}

.box3-left-img {
	height:50px;
	margin-top: 1%;
}

.subbox3-left, .subbox-right {
	margin-top: 10px
}

.subbox3-left-p1, .subbox3-left-p2, .subbox3-left-p3 {
	font-family: Galanomedium;
	font-size: 18px;
	line-height: 20px;
	padding: 5px 455px 0px 15px;
	margin-bottom: 0px;
	color: #fffcf5;
}

.subbox3-left-p4 {
	font-family: Galanomedium;
	font-size: 18px;
	line-height: 20px;
	padding: 5px 400px 0px 15px;
	margin-bottom: 0px;
	color: #fffcf5;
}

.box3-right-title {
	font-family: Galanobold;
	color: #dfab00;
	padding-right: 75px;
}

.box3-right-subtitle {
	font-family: Galanobold;
	color: #dfab00;
	margin-top: 60px;
	margin-bottom: 20px;
}

.box3-right {
	display: inline-flex;
	margin-left: -65px;
}

.box3-right-img {
	height:50px;
	margin-top: 3%;
}

.subbox3-right-p1 {
	font-family: Galanomedium;
	font-size: 18px;
	line-height: 20px;
	padding: 5px 60px 0px 15px;
	margin-bottom: 0px;
	color: #fffcf5;
}

/***** Primer Nav ****/
.bg-black {
	background-color: #000;
}

.a-cupon {
	height: 70px; /* 171px standar */
	position: relative;
}

.img-logo {
	position: absolute; /* relative standar */
	top: 14px; /* 0 standar */
	z-index: 1; /* 0 standar */
	height: 145px;
}

.search-button {
	margin-left: 10px; /* 35px */
	height: 38px;
	padding: 5px 20px;
	background-color: #DFAB00;
	color: #fff;
	border: 1px solid #DFAB00;
	transition: all .5s ease-out;
	border-radius: 50px;
}

.search-button:hover {
	background-color: #ce9e00;
	border: 1px solid #ce9e00;

}
/*********************/

/***** Segundo Nav ****/
.second-nav {
	background-color: #F6F6F6;
	text-transform: uppercase;
	padding: 0rem 0rem;
	/* right: -3%; */
}

.li-2 {
	padding: 15px 0;
}
.op:link, .op:visited {
	color: #000;
	padding-right: 10px !important;
	padding-left: 10px !important;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 14px;
}
.op:hover, .op:active {
	color: #000;
	background-color: #efefef;
	padding-right: 12px !important;
	padding-left: 12px !important;
	padding-bottom: 10px;
	padding-top: 10px;
	font-size: 14px;
	border-radius: 50px;
}

.cat:link, .cat:visited {
	color: #000 !important;
	background-color: #F6F6F6;
}

.cat:hover, .cat:active{
	color: #000 !important;
	background-color: #e3e3e3;
}

.fa.fa-navicon {
	color: #000;
}

.iconscuponerapp {
	color: #E1AF0B;
	margin-right: 7px;
}

.marca, .marca:hover {
	border: 1px solid #000;
	border-radius: 50px;
	/* margin-right: -35px; */
	/* margin-left: 35px; */
}
/***************************************/

/****************  Cover  **************/
.cover {
	background-image: url("../images/banner-cuponerapp.png");
	background-size: cover;
	background-position: center;
	height: 500px;
}
/***************************************/

.fer {
    height: 0;
    padding: 0; /* remove any pre-existing padding, just in case */
    padding-bottom: 33%; /* h/w * 100 */
	background: url('../images/portada-banner.png') no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100%;
    background-repeat: no-repeat;
	position: relative;
}

.banner-button {
    height: 0;
    padding: 0; /* remove any pre-existing padding, just in case */
    padding-bottom: 44%; /* h/w * 100 */
	background: url('../images/banner-button.png') no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100%;
    background-repeat: no-repeat;
	position: relative;
}

.bottom-text{
	text-align: center;
	font-size: 22px;
	position: absolute;
	width: 690px;
	top: 90%;
	left: 60%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%); /* translate the element half of its width and height up and left */
}

.header-text {
	position: absolute;
	width: 750px;
	top: 65%;
	left: 75%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%); /* translate the element half of its width and height up and left */
}

.header-master {
	display: inline-block;
}

.header-master img {
	height: 48px;
	width: auto;
	margin-right: 20px;
	margin-left: 20px;
}

/****** Como canjeo mis cupones *****/
.how-como {
	margin: 60px 0;
}

.title-about {
	margin: 25px auto;
	font-weight: 400;
	text-align: center;
}
.how-works-img {
	height: 100px;
	width: 100px;
}

.to-position {
	text-align: right;
}

.how-works {
	padding-right: 0px;
}

.about-bottom {
	margin-bottom: 35px;
}

h5 {
	color: #E1AF0B;
}

.download, .pay, .showed {
	position: relative;
}

.download::after {
	display: block;
	content: '';
	width: 105px;
	height: 1px;
	background: #E1AF0B;
	position: absolute;
	top: 25px;
	left: 0;
}

.pay::after {
	display: block;
	content: '';
	width: 55px;
	height: 1px;
	background: #E1AF0B;
	position: absolute;
	top: 25px;
	left: 0;
}

.showed::after {
	display: block;
	content: '';
	width: 95px;
	height: 1px;
	background: #E1AF0B;
	position: absolute;
	top: 25px;
	left: 0;
}

.except {
	margin-left: -13px;
}


.works-icons img {
	height: 40px;
	width: 135px;
	margin-bottom: 5px;
}
/***************************************/

/****************  Cards  **************/
.pago-en-linea, .paga-tu-cuenta, .canjea-tu-cupon, .todo-o-nada-ruleta {
	margin-bottom: 40px;
	margin-top: 25px;
}

.title-box {
	margin-bottom: 10px;
}

.title-card {
	margin-bottom: 0px;
	border-bottom: 2px solid;
	padding-bottom: 10px;
}

.red-border {
	color: #D0021B;
	border-color: #D0021B;
}

.green-border {
	color: #17A516;
	border-color: #17A516;
}

.yellow-border {
	color: #E1AF0B;
	border-color: #E1AF0B;
}

.black-border {
	color: #000;
	border-color: #000;
	padding: 15px;
	margin-bottom: 10px;
}

.purple-border{
	color: #6441a5;
	border-color: #6441a5;
}

.title-description {
	color: #777;
	display: inline-block;
	padding-top: 5px;
	font-size: 18px;
}

.button:link, .button:visited, .button-s {
	text-transform: uppercase;
	text-decoration: none;
	padding: 15px 40px;
	display: inline-block;
	border-radius: 50px;
	transition: all .2s;
	position: relative;
	color: #000;
	border: none;
	cursor: pointer;
}

.button:hover, .button-s:hover {
	transform: translateY(-3px);
	box-shadow: 0 10px 20px rgba(0,0,0,.2);
}

.button::after {
	transform: scaleX(1.4) scaleY(1.6);
	opacity: 0;
}

.button-s:focus {
	outline: none;
}

.button:active, .button:focus {
	transform: translateY(-1px);
	box-shadow: 0 5px 10px rgba(0,0,0,.2);
	outline: none;
}

.button-red:link, .button-red:visited {
	background-color: #D0021B;
	color: #fff;
	float: right;
	padding: 10px 25px;
	border-radius: 0px;
}

.button-green:link, .button-green:visited {
	background-color: #17A516;
	color: #fff;
	float: right;
	padding: 10px 25px;
	border-radius: 0px;
}

.button-yellow:link, .button-yellow:visited {
	background-color: #E1AF0B;
	color: #fff;
	float: right;
	padding: 10px 25px;
	border-radius: 0px;
}

.button-purple:link, .button-purple:visited {
	background-color: #6441a5;
	color: #fff;
	float: right;
	padding: 10px 25px;
	border-radius: 0px;
}

.card {
	/* padding-bottom: 25px; */
	box-shadow: 0 15px 40px rgba(0,0,0,.15);
	margin-bottom: 25px;
}

.card-image {
	height: auto;
	width: 100%;
}

.card-photo {
	height: auto;
	width: 100%;
}

.card-title {
	border-left: 4px solid #D0021B;
	padding: 10px;
	margin-bottom: 0px;
	font-size: 18px;
	text-transform: uppercase;
}

.card-title{
	height: 60px;
}

.card-title a {
	color: black;
	text-decoration: none;
}

.card-content{
	height: 175px;
}

.card-description {
	display:block;
	color: #aaa;
	margin: 15px auto 0;
	width: 100%;
	max-width: 21vw;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

.card-button {
	margin: 0 auto;
}

.button-comprar:link, .button-comprar:visited, .button-stack {
	background-color: #D0021B;
	color: #fff;
	padding: 10px 35px;
}

.green {
	border-left-color: #17A516;
}

.yellow {
	border-left-color: #E1AF0B;
}

.purple {
	border-left-color: #6441a5;
}

.button-pagarCuenta{
	font-size: 16px;
	border: none;
	decoration: none;
	border-radius: 50px;
	transition: all .5s ease-out;
	background-color: #17A516;
	color: #fff;
	padding: 10px 55px;
}

.button-Ruleta{
	font-size: 16px;
	border: none;
	decoration: none;
	border-radius: 50px;
	transition: all .5s ease-out;
	background-color: #6441a5;
	color: #fff;
	padding: 10px 55px;
}

.button-ruleta:link, .button-ruleta:visited {
	background-color: #6441a5;
	color: #fff;
	padding: 10px 35px;
}

.fondoPopDescarga{
	background-color: #fff;
}

.button-pagar:link, .button-pagar:visited {
	background-color: #17A516;
	color: #fff;
	padding: 10px 35px;
}

.button-canjear:link, .button-canjear:visited {
	background-color: #E1AF0B;
	color: #fff;
	padding: 10px 35px;
}

.button-blue, .button-blue:hover {
	background-color: #007bff;
	color: #fff;
	padding: 10px 35px;
	border-radius: 50px;
	transition: all 0.2s;
}
/***************************************/

/***************** Como Funciona *************/
.video-cuponerapp {
	width: 100%;
	height:550px;
}
/*********************************************/

/* linear-gradient(rgba(20,20,20, .3), rgba(20,20,20, .3)), */

/***************** Internas ******************/
.restaurant {
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 350px;
	position: relative;
}

.header-interna {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%); /* translate the element half of its width and height up and left */
}

.header-restaurant {
	color: #fff;
	font-weight: 600;
	letter-spacing: 20px;
	text-transform: uppercase;
}

.margin-top{
	margin-top: 50px;
}
/*********************************************/

/***********  Destacados  ********************/
.destacados {
	background:url('../images/ma%CC%81s-vendidos.jpg') no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 350px;
	position: relative;
}
/*********************************************/

/***************** Contacto ******************/
.contacto {
	background:url('../images/banner-contacto.jpg') no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 350px;
	position: relative;
}

.form-box {
	margin: 60px auto;
}

.form-title {
	margin: 45px auto;
}

.form-name, .form-phone, .form-city, .form-type {
	margin: 25px auto;
}

.form-name > input, .form-phone > input, .form-city > select, .form-type > select {
	border: 1px solid #bebebe;
	width: 70%;
	padding: 5px 15px;
}

.form-type > select {
	margin-bottom: 20px;
}

.form-name > input::placeholder, .form-phone > input::placeholder {
	color: #000;
	opacity: 1;
}

.img-modal {
	width: 60%;
	margin: 0px auto 10px auto;
}
/*********************************************/

/***************** Ayuda ******************/
.ayuda {
	background:url('../images/banner-ayuda.jpg') no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 350px;
	position: relative;
}

.ayuda-box {
	padding: 75px 0;
}

.ayuda-title {
	background-color: #fff;
	border: none;
	border-bottom: 1px solid #aaa;
}

.ayuda-title > h5 {
	color: #000;
	font-size: 22px;
	cursor: pointer;
}

.ayuda-info {
	padding-top: 10px;
	padding-bottom: 5px;
}

.ayuda-info > p {
	padding-left: 45px;
	margin-bottom: 0rem;
}

h5[data-toggle="collapse"]::after {
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	content: "\f054";
	transform: rotate(90deg) ;
	transition: all linear 0.25s;
	float: left;
	color: #aaa;
	margin-right: 10px;
	margin-top: 5px;
}
h5[data-toggle="collapse"].collapsed::after {
	transform: rotate(0deg) ;
}

.space {
	margin-bottom: 15px;
}
/*********************************************/


#img_logo{
	max-height:100px;
	max-width:100px;
	margin: 0 auto;
}
.dialog{
	width:auto;
}

.trans{
	background: rgb(0, 0, 0) transparent
}

.btn-lg{
	width:100%;
}

.modal-header {
	border-bottom: none;
}

.btn-fb{
	width: 300px;
	color: #fff;
	border:1px solid #3B5998;
	background-color: #3B5998;
}
.btn-google{
	color: #fff;
	width: 300px;
	border:1px solid #B23121;
	background-color: #B23121;
}
.btn-telefono{
	width: 300px;
	background-color: #fff;
	border:1px solid #000;
}
.btn-correo{
	width: 300px;
	color: #fff;
	border:1px solid #000;
	background-color: #000;
}

.btn-inicar{
	color: #fff;
	border:1px solid #DAA520;
	background-color: #DAA520;
}

.btn-forgott{
	width: 300px;
	border:1px solid #000;
	background-color: #fff;
}

.inputxt{
	width: 300px;
}

.hr{
	border: 1px dashed grey;
	height: 0;
	width: 60%;
}

.Categorias{
	background-color: #F6F6F6;
	color: #fff;
}

/******* Footer ********/
/* .boxBanner{
	width: 100%;
  height: auto;
}

.bannersFooter{

} */

footer {
	border-top: 1px solid #DAA520;
	padding-top: 20px;
}
.copyright {
	font-size: 14px;
}
.terminos:link, .terminos:visited {
	color: #DAA520;
}
.terminos:hover, .terminos:active {
	color: #17A516;
}
.sitio {
	color: #DAA520;
}
.social {
	margin-top: 10px;
}
.social-ins, .social-fb {
	height: 30px;
	width: 30px;
	margin: 0 5px;
}
.bancos {
	margin: 20px 0;
	padding: 15px 0;
}
.bancos-styles-paypal {
	height: 27px;
	width: 65px;
}
.bancos-styles-oxxo {
	height: 27px;
	width: 52px;
}
.bancos-styles-american {
	height: 27px;
	width: 67px;
}
.bancos-styles-visa {
	height: 30px;
	width: 60px;
}
.bancos-styles-master {
	height: 30px;
	width: 58px;
}
/**********************/

/***********  Detalles de Cupon  ********************/
.slider {
	width: 93%;
	overflow: hidden;
	margin: 30px auto;
}

.nav-carousel {
	position: absolute;
	bottom: 60px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
}

.bar {
	width: 50px;
	height: 10px;
	border: 2px solid #fff;
	margin: 6px;
	cursor: pointer;
	transition: 0.4s;
	background: transparent;
}

.bar:hover {
	background: #fff;
}

input[name="r"] {
	position: absolute;
	visibility: hidden;
}

.slides {
	width: 500%;
	height: 100%;
	display: flex;
}

.slide {
	width: 20%;
	transition: 0.4s;
}

.slide img {
	width: 100%;
	height: 100%;
}

#r1:checked ~ .s1{
	margin-left: 0;
}

#r2:checked ~ .s1{
	margin-left: -20%;
}

#r3:checked ~ .s1{
	margin-left: -40%;
}

#r4:checked ~ .s1{
	margin-left: -60%;
}

.border-gray {
	border: 1px solid #aaa;
}

.main-box {
	width: 90%;
	margin-top: 30px;
}

.main-box-1 {
	margin: 5px;
}

.main-box-1 > h5 {
	color: #000;
}

.h4-cupon{
	margin-top: 20px;
	margin-bottom: 10px;
}

.h5-cupon{
	margin-bottom: 35px;
}

.p-cupon{
	margin-bottom: 10px;
}

.x24 {
	font-size: 24px;
}

.span-time {
	margin: 0 auto;
	vertical-align: super;
}

.gre{
	color: #77C84E;
}

.b-red{
	margin-bottom: 20px;
}

.p-cupon-star{
	margin-bottom: 1px;
	display: inline-block;
}

.star-top {
	margin-top: 8px;
}

.second-box {
	margin-top: 15px;
	width: 90%;
}

.second-box-p {
	padding: 10px;
	margin-bottom: 0rem;
}

.recommend {
	width: 90%;
}

.tab-box {
	padding: 20px 10px;
	box-shadow: 0 15px 40px rgba(0,0,0,.15);
	width: 93%;
	margin: 20px auto;
}

.tab-opcion > a:link, .tab-opcion > a:visited  {
	border-top: 2px solid #ff5722;
	text-decoration: none;
	background-color: #F1F5F8;
	padding: 10px 15px;
	color: #000;
	transition: 0.4s;
}

.tab-opcion > a:hover, .tab-opcion > a:active  {
	background-color: #ff5722;
	color: #fff;
}

.tab-info {
	margin-top: 15px;
	padding: 5px;
}

.stars-yellow {
	display: inline-block;
}

.stars-yellow > i{
	color: #DFAB00;
}
/*********************************************/

/*************Other Interns**********************/
.ttt {
	position: absolute;
}

.ttt select {
	padding: 4px;
	width: 70px;
	border: 1px solid #aaa;
	font-size: 18px;
	-webkit-appearance: button;
	outline: none;
}

.ttt:before {
	content: '\f063';
	font-family: "FontAwesome";
	position: absolute;
	top: 2px;
	right: 4px;
	width: 30px;
	height: 30px;
	text-align: center;
	line-height: 30px;
	color: #E1AF0B;
	font-size: 20px;
	background-color: #fff;
	pointer-events: none;
	transition: background-color 0.4s ease-in-out;
}

.ttt:hover:before {
	background-color: #eee;
}

.label-avatar {
	display: inline-block;
	vertical-align: bottom;
	padding-right: 15px;
}

.met-title {
	color: #000;
	padding-left: 40px;
}

.met-li {
	margin: 25px 0;
	padding-left: 60px;
}

.met-green {
	margin: 15px 0;
	padding-left: 70px;
	color: #090;
}

.resumen {
	width: 90%;
	margin: 20px auto 0 0;
	border-left: 1px solid #aaa;
	padding: 25px;
}

.pais {
	position: absolute;
	padding-top: 10px;
}

.pais select {
	padding: 7px;
	width: 205px;
	border: 1px solid #aaa;
	font-size: 18px;
	-webkit-appearance: button;
	outline: none;
	height: 50px;
}

.address input::placeholder {
	color: #000;
	opacity: 1;
}

.pais:before {
	content: '\f063';
	font-family: "FontAwesome";
	position: absolute;
	top: 20px;
	right: 8px;
	width: 30px;
	height: 30px;
	text-align: center;
	line-height: 30px;
	color: #E1AF0B;
	font-size: 20px;
	background-color: #fff;
	pointer-events: none;
	transition: background-color 0.4s ease-in-out;
}

/***** Carousel Pagination *****/

.carousel-control:link, .carousel-control:visited {
	left: -12px;
	height: 40px;
	width: 40px;
	background: none repeat scroll 0 0 #fff;
	border: 3px solid #E1AF0B;
	border-radius: 23px 23px 23px 23px;
	margin-top: 90px;
	padding: 0px 20px;
	padding-bottom: 10px;
	font-size: 35px;
	color: #E1AF0B;
	transition: all 0.4s ease-in;
}

.carousel-control:hover, .carousel-control:active {
	background: none repeat scroll 0 0 #fff;
	border: 3px solid #E1AF0B;
	color: #E1AF0B;
	text-decoration: none;
}

.carousel-control.right {
	right: -12px;
}
/* The indicators */
.carousel {
	margin-bottom: 0;
	padding: 0 20px 0px 20px;
}

.carousel-indicators {
	right: 50%;
	top: auto;
	bottom: -10px;
	margin-right: -19px;
	margin: 0 auto;
}
/* The colour of the indicators */
.carousel-indicators li {
	background: #cecece;
}
.carousel-indicators .active {
	background: #E1AF0B;
}

.arrows-cuponerapp {
	margin-bottom: 30px;
	/*margin-top: 30px;*/
}

.tarjetas-bancos {
	width: 400px;
	margin-left: 12px;
	margin-top: 20px;
	margin-bottom: -5px;
}

.modal-titles {
	color: #E1AF0B;
	font-weight: 600;
	margin: 0 auto;
}

.modal-sign {
	margin: 15px 0;
	color: #090;
}

.perfil-panel {
	background-color: #fff;
}

.perfil-head {
	margin: 0 auto;
}

.perfil-opcion {
	margin: 5px 10px;
}

.perfil-opcion > a:link, .perfil-opcion > a:visited  {
	border-top: 2px solid #DFAB00;
	text-decoration: none;
	background: linear-gradient(to left, #DFAB00, gold);
	padding: 10px 15px;
	color: #fff;
	transition: all 1s;
}

.perfil-opcion > a:hover, .perfil-opcion > a:active  {
	background: linear-gradient(to left, darkgoldenrod, goldenrod );
	color: #fff;
}

.t4 {
	width: 92%;
}

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

.unitario, .servicio, .subtotal {
	display: inline-block;
	font-size: 15px;
	font-weight: 600;
	color: #777;
	margin-bottom: 3px;
}

.unitario-precio, .servicio-precio, .subtotal-precio {
	font-size: 18px;
	font-weight: 400;
	margin-bottom: 3px;
	float: right;
}

.trash {
	position: absolute;
	right: 30%;
}

.trash-b {
	height: 40px;
	width: 40px;
	background-color: tomato;
	border: none;
	border-radius: 5px;
	color: white;
}

.header-carrito {
	margin: 15px 1px;
	padding: 1px 10px;
}

.bg-green {
	background-color: #090;
}

.bg-yellow {
	background-color: #DFAB00;
}

.redcuponerapp {
	color: #D0021B;
}

.border-pago {
	border-bottom-color: #D0021B;
}

.yellowcuponerapp {
	color: #DFAB00;
}

.border-pago-yellow {
	border-bottom-color: #DFAB00;
}

.white-star {
	color: #fff;
}

.sello-cupon {
	position: absolute;
	top: 1%;
	left: 1%;
	height: 55px;
	width: 55px;
	background: linear-gradient(gold, #D4B136);
	border-radius: 50px;
	border: 3px dotted #fff;
	text-align: center;
	padding: 10px 0 0;
	font-size: 20px;
	animation: anim-star 2.5s infinite ease-in;
}

.fb-as:link, .fb-as:visited {
	padding: 10px 63px;
	border-radius: 5px;
	color: #fff;
	background-color: #3B5998;
}

.goo-as:link, .goo-as:visited {
	padding: 10px 72px;
	border-radius: 5px;
	color: #fff;
	background-color: #B23121;
}

.fb-as:hover, .fb-as:active, .goo-as:link, .goo-as:visited {
	color: whitesmoke;
	text-decoration: none;
}

.welcome-email {
	padding: 10px 75px;
	border-radius: 5px;
}

.welcome-number {
	padding: 10px 11px;
	border-radius: 5px;
	border: 1px solid #000;
}

.welcome-login {
	padding: 10px 28px;
	border-radius: 5px;
}

.modal-header {
	border-bottom: none;
	padding: 0px;
	padding-right: 15px;
	padding-top: 10px;
}

.title-vox {
	margin: 0 auto;
	padding-top: 5px;
	text-align: center;
}

.lower-c {
	text-transform: none !important;
}

.footer-color {
	color: #777;
}

.owl-carousel > .owl-nav > button.owl-prev {
	position: absolute;
	left: -3%;
	top: 20%;
	font-size: 125px !important;
}

.owl-carousel > .owl-nav > button.owl-next {
	position: absolute;
	right: -3%;
	top: 20%;
	font-size: 125px !important;
}

.access-marca {
	margin-right: 15px;
}

.a-access {
	font-size: 10px;
	height: 100%;
	padding-top: 10px;
	border: 2px dotted #D4B136;
}

.valido {
	padding-left: 85px;
}

/* switch */
.onoffswitch {
	position: relative; width: 90px;
	-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
	display: none;
}
.onoffswitch-label {
	display: block; overflow: hidden; cursor: pointer;
	border: 2px solid #D4AF37; border-radius: 20px;
}
.onoffswitch-inner {
	display: block; width: 200%; margin-left: -100%;
	transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
	display: block; float: left; width: 50%; height: 30px; padding: 0; line-height: 30px;
	font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
	box-sizing: border-box;
}
.onoffswitch-inner:before {
	font-family: FontAwesome;
	content: "\f183";
	padding-left: 10px;
	background-color: #D4AF37; color: #FFFFFF;
}
.onoffswitch-inner:after {
	font-family: FontAwesome;
	content: "\f182";
	padding-right: 10px;
	background-color: #D4AF37; color: #FFFFFF;
	text-align: right;
}
.onoffswitch-switch {
	display: block; width: 18px; margin: 6px;
	background: #FFFF;
	position: absolute; top: 0; bottom: 0;
	right: 56px;
	border: 2px solid #D4AF37; border-radius: 20px;
	transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
	margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
	right: 0px;
}

.detalle-button {
	padding: 5px 10px;
	background-color: #D4AF37;
	color: #fff;
	border: 1px solid #D4AF37;
	transition: all .5s ease-out;
}

.detalle-button:hover {
	background-color: #ce9e00;
	border: 1px solid #ce9e00;

}

.enviar-button {
	/* margin-left: 10px; /* 35px */
	height: 38px;
	padding: 5px 30px 30px 30px;
	background-color: #D4AF37;
	color: #fff;
	border: 1px solid #D4AF37;
	transition: all .5s ease-out;
}

.enviar-button:hover {
	background-color: #ce9e00;
	border: 1px solid #ce9e00;

}

.tooltip-c {
	position: relative;
	display: inline-block;
}

.tooltip-c .tooltiptext{
	visibility: hidden;
	width: 120px;
	background-color: #555;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px 0;
	position: absolute;
	z-index: 1;
	bottom: 125%;
	left: 50%;
	margin-left: -60px;
	opacity: 0;
	transition: opacity 0.3s;
}

.tooltip-c .tooltiptext::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: #555 transparent transparent transparent;
}

.tooltip-c:hover .tooltiptext {
	visibility: visible;
	opacity: 1;
}

/* Nueva version desktop */
.nav-pills > li > a{
		font-size: 20px;
		color: black;
}
.nav-pills .navlShop.active {
		background-color: #D0021B!important;
		padding: 5px 40px;
		border-radius: 20px;
}
.nav-pills .navlCupons.active {
		background-color: #DFAB00!important;
		padding: 5px 40px;
		border-radius: 20px;
}
.nav-pills .navlRuleta.active {
		background-color: #6441a5!important;
		padding: 5px 40px;
		border-radius: 20px;
}

/* nueva version movil */
.indexMovil{
	display: none;
}
.inicioMovil{
	display: none;
}

/* ----- */

@media (max-width: 1024px) {

	.op:link, .op:visited {
		font-size: 12px !important;
	}
	.op:hover, .op:active {
		font-size: 12px !important;
	}
	.header-cupon {
		top: 25%;
		left: 36%;
	}
	.owl-carousel > .owl-nav > button.owl-prev {
		left: -2.5% !important;
	}
	.owl-carousel > .owl-nav > button.owl-next {
		right: -2.5% !important;
	}
	.img-cel {
		height:850px;
		position:absolute;
		top: 19%;
		left: -8%;
	}
	.card-description {
		max-width: 28vw;
	}
}

@media (max-width: 992px) {
	/* nuevo navbar */
	.bg-dark{
		background-color: black;
	}
	.indexMovil{
		display: block;
	}
	.indexDesktop{
		display: none;
	}
	/* ----- */
	.nav-pills > li > a{
      color: black;
  }
	.nav-pills .navlShop.active {
	    background-color: #D0021B!important;
			padding: 5px 25px;
			border-radius: 20px;
	}
	.nav-pills .navlCupons.active {
			background-color: #DFAB00!important;
			padding: 5px 25px;
			border-radius: 20px;
	}
	.nav-pills .navlRuleta.active {
			background-color: #6441a5!important;
			padding: 5px 25px;
			border-radius: 20px;
	}
	/* inicio */
	.inicioDesktop{
		display: none;
	}
	.inicioMovil{
		display: block;
	}

	body {
		background-color: #fff;
	}

	.fer{
    background-position:center top;
		background-size:contain;
	}
	/* body {
		background-color: #fff;
	}
	.logo {
		padding-bottom: 8px;
	}
	.a-cupon {
		height: 171px !important;
		margin: 0 auto !important;
	} */
	/* .img-logo {
		position: relative !important;
		top: 0px !important;
	} */
	.search-button {
		margin: 10px 0 !important;
		width: 100%;
	}
	.items-bar-1 {
		padding-bottom: 12px;
		margin-left: -7px;
		width: 100%;
	}

	/* .navbar > .container > .block {
		display: block;
	}
	.navbar-expand-lg > .container > .container-scale {
		padding-right: 30%;
		padding-left: 30%;
	} */
	.box-image {
		width: 100%;
		text-align: center;
	}
	.bk {
		margin-left: 7px;
		width: 100% !important;
	}
	.selectpicker {
		margin-left: 7px;
		width: 100% !important;
	}
	.search {
		width: 100% !important;
	}
	.x-100 {
		width: 100%;
	}
	/* .navbar-toggler-icon {
		padding-top: 4px;
		background-color: #e3e3e3;
	} */
	.icon-about {
		display: block !important;
		margin-bottom: 5px !important;
	}
	.text-about {
		text-align: center !important;
	}
	.text-about::before {
		background: #DFAB00 !important;
		width: 30% !important;
		margin: 0px 32%;
	}
	.video-cuponerapp {
		height: 410px !important;
	}
	.marca, .marca:hover {
		margin-left: 0px !important;
	}
	.in-blocks {
		display: inline-block !important;
	}
	.header-text {
		width: 352px !important;
	}
	.extra-padd {
		padding-bottom: 42px !important;
	}
	.tarjetas-bancos {
		width: 300px !important;
	}
	.header-cupon {
		width: 56%;
		top: 22%;
		left: 31%;
	}
	.t4 {
		width: 88% !important;
	}
	.owl-carousel > .owl-nav > button.owl-prev {
		left: -3.7% !important;
	}
	.owl-carousel > .owl-nav > button.owl-next {
		right: -3.7% !important;
	}
	.access-marca {
		margin-right: 0px !important;
		margin-bottom: 10px;
	}
	.access-marca > a {
		width: 100%;
	}
	.img-works1, .img-works2, .img-works3 {
		height: 150px;
	}
	.box-descarga {
		width: 75%;
	}
	.box-click {
		width: 100%;
	}
	.box-folio {
		width: 100%;
	}
	.img-cel {
		height: 420px;
		top: 35%;
		left: -2%;
	}
	.box2-title {
		width: 90%;
	}
	.card-description {
		max-width: 42vw;
	}
}

@media (max-width: 499px) {
	/* nuevo navbar */
	.bg-dark{
		background-color: black;
	}
	.indexMovil{
		display: block;
	}
	.indexDesktop{
		display: none;
	}
	.rowResponsive{
		margin-right: 0;
		margin-left: 0;
	}
	/* ----- */
	.nav-pills > li > a{
      color: black;
  }
	.nav-pills .navlShop.active {
	    background-color: #D0021B!important;
			padding: 5px 25px;
			border-radius: 20px;
	}
	.nav-pills .navlCupons.active {
			background-color: #DFAB00!important;
			padding: 5px 25px;
			border-radius: 20px;
	}
	.nav-pills .navlRuleta.active {
			background-color: #6441a5!important;
			padding: 5px 25px;
			border-radius: 20px;
	}
	/* inicio */
	.inicioDesktop{
		display: none;
	}
	.inicioMovil{
		display: block;
	}

	body {
		background-color: #fff;
	}

	.fer{
    background-position:center top;
		background-size:contain;
	}
	/* .navbar-dark{
		background-color: #fff;
	}

	.navbar-expand-lg > .container > .container-scale {
		padding-right: 0%;
		padding-left: 0%;
	}

	.container{
		background-color: #fff;
	} */

	/* .fer{
		margin-top: 0;
		background: none;
	} */

	.appDescarga{
		display: none;
	}

	.how-como {
		margin: 0 0;
	}

	.box-image {
		width: 100%;
		text-align: center;
	}
	.bk {
		margin-left: 0px;
		width: 100% !important;
	}
	.selectpicker {
		margin-left: 7px;
		width: 100% !important;
		padding: 7px 10px !important;
	}
	.search {
		border: 1.2px solid goldenrod;
		width: 100% !important;
	}
	.navbar-toggler{
		right: 0;
	}
	.img-h{
		height: 300px !important;
	}
	.op:link, .op:visited {
		font-size: 16px !important;
	}
	.op:hover, .op:active {
		font-size: 16px !important;
	}
	.cupon-info {
		text-transform: uppercase;
		margin-bottom: 6px !important;
	}
	.icon-about {
		display: block !important;
		margin-bottom: 5px !important;
	}
	.text-about {
		text-align: center !important;
	}
	.text-about::before {
		background: #DFAB00 !important;
		width: 30% !important;
		margin: 0px 32%;
	}
	.title-about {
		float: none !important;
	}
	.video-cuponerapp {
		height: 375px !important;
	}
	.to-position {
		text-align: center !important;
	}
	.how-works {
		text-align: center !important;
		padding-right: 15px !important;
		margin-bottom: 10px !important;
	}
	.except {
		margin-left: 0px !important;
	}
	.download::after {
		width: 35% !important;
		left: 33% !important;
	}
	.pay::after {
		width: 20% !important;
		left: 40% !important;
	}
	.showed::after {
		width: 32% !important;
		left: 34% !important;
	}
	/* .card {
		margin-bottom: 25px !important;
	} */
	.header-text {
		width: 352px !important;
		left: 51.5% !important;
	}
	.header-interna {
		top: 50% !important;
		left: 50% !important;
	}
	.header-restaurant {
		font-weight: 200 !important;
		letter-spacing: 4px !important;
		font-size: 35px;
		text-align: center;
	}
	.copyright {
		text-align: center !important;
	}
	.main-box {
		width: 100% !important;
		margin-top: 1px !important;
	}
	.star-center {
		text-align: center !important;
	}
	.star-bottom {
		margin-bottom: 10px !important;
	}
	.slider {
		width: 100% !important;
	}
	.nav-carousel {
		bottom: 40px !important;
	}
	.second-box {
		width: 100% !important;
	}
	.recommend {
		width: 100% !important;
	}
	.tab-box {
		width: 100% !important;
	}
	.tab-opcion > a:link, .tab-opcion > a:visited  {
		padding: 10px 5px !important;
		display: inline-block !important;
		width: 100%;
		border: none !important;
		background-color: #e3e3e3 !important;
	}
	.tab-opcion > a:hover, .tab-opcion > a:active  {
		color: #ff5722 !important;
	}
	.zone {
		display: inline-block !important;
		width: 100% !important;
	}
	.nav-bk {
		background-color: #e3e3e3;
	}
	.met-title {
		padding-left: 10px !important;
	}
	.met-li {
		padding-left: 12px !important;
	}
	.met-green {
		padding-left: 12px !important;
	}
	.resumen {
		width: 100% !important;
	}
	.extra-h {
		height: 70px !important;
	}
	.pais {
		width: 91% !important;
	}
	.pais select {
		width: 100% !important;
	}
	.tarjetas-bancos {
		width: 225px !important;
	}
	.extra-padd {
		margin-top: 12px !important;
		margin-bottom: -35px !important;
	}
	.header-cupon {
		font-size: 15px;
		width: 55%;
		top: 13%;
		left: 44%;
		right: 0;
	}
	.bottom-text{
		font-size: 10px;
		width: 60%;
		top: 87%;
		left: 70%;
		right: 0;
	}
	.perfil-opcion {
		margin: 0px !important;
	}
	.perfil-opcion > a {
		padding: 8px 8px !important;
		color: #000 !important;
	}
	.cel-phone {
		margin-top: 50px !important;
	}
	.t4 {
		width: 91.5% !important;
	}
	.blue-movil {
		margin: 15px 1px;
	}
	.query {
		width: 50% !important;
	}
	.query2 {
		margin-top: 55px;
	}

	.trash {
		right: 5% !important;
	}

	.presr {
		text-align: right !important;
	}

	.header-carrito {
		text-align: center !important;
	}

	.media-auto {
		width: 50% !important;
	}

	.newboton {
		margin-left: -1px !important;
	}

	.nav-media {
		padding: 0px !important;
		font-size: 15px;
	}

	.owl-carousel > .owl-nav > button.owl-prev {
		left: -7.5% !important;
	}
	.owl-carousel > .owl-nav > button.owl-next {
		right: -7.5% !important;
	}
	.sitio {
		color: #DAA520;
		font-size: 16px;
	}
	.title-17 {
		font-size: 17px !important;
	}
	.valido {
		padding-left: 35px !important;
	}
	.como-funciona-padding {
		padding: 12px;
	}
	.box3-title {
		margin-top: 5px;
		margin-left: 0px;
		font-size: 25px;
	}
	.box1-title {
		text-align: center;
		font-size: 30px;
	}
	.box1-subtitle {
		text-align: center;
		font-size: 25px;
	}
	.img-works1, .img-works2, .img-works3 {
		height: 130px;
	}
	.box3-left {
		margin-left: 0px;
	}
	.subbox3-left-p1, .subbox3-left-p2, .subbox3-left-p3 {
		padding: 5px 5px 0px 15px;
	}
	.subbox3-left-p4 {
		padding: 5px 10px 35px 15px;
	}
	.box3-right-title {
		padding-right: 0px;
		font-size: 30px;
		text-align: center;
		margin-bottom: 30px;
	}
	.box3-right {
		margin-left: 0px;
	}
	.subbox3-right-p1 {
		padding: 5px 5px 0px 15px;
	}
	.box3-right-subtitle {
		margin-top: 0px;
		font-size: 25px;
	}
	.img-cel {
		display: none;
	}
	.box2-title {
		width: 100%;
		text-align: center;
		font-size: 26px;
	}
	.img-works4 {
		margin-top: 5%;
	}
	.subbox-tienda {
		margin-top: 0px;
	}
	.case-iphonex {
		padding-left: 0px;
		padding-right: 0px;
	}
	.box-tienda, .box-cupon, .box-cuenta {
		display: block;
		text-align: center;
	}
	.subbox-tienda-title {
		padding: 0px 15px 0px 10px;
	}
	.subbox-tienda-p {
		padding: 5px 0px 0px 0px;
		text-align: justify;
	}
	.subbox-cupon-title, .subbox-cuenta-title {
		padding: 0px 15px 0px 10px;
	}
	.subbox-cupon-p, .subbox-cuenta-p {
		padding: 5px 0px 0px 0px;
		text-align: justify;
	}
	.card-description {
		max-width: 76vw;
	}

	.titleNameTransfer{
		margin-top: 70px !important;
	}
}


.popover  {
background: #DFAB00!important;
}

.popover-body{
	/* max-width: auto; */
	width: 100%;
	background: #FFECB3;
	border-color: #17A516;
	padding: -25px;
 	text-align: center;
}


/* whatsapp */
.float{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	right:40px;
	background-color:#25d366;
	color:#FFF;
	border-radius:50px;
	text-align:center;
  font-size:30px;
	box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.float:hover{
	color: #DFAB00;
}
.my-float{
	margin-top:16px;
}

.nUser{
	padding-left: 350px;
	width: 100%;
}

@keyframes anim-star {
	0%   {top: 1%;}
	50%  {top: 2.5%;}
	100% {top: 1%;}
}

.e-commerce a, img{
	color: #ff0000;
}

.e-commerce .nav-link.active{
	color: #ff0000;
}

.cupones a, img{
	color: #E1AF0B
}

.cupones .nav-link.active{
	color: #E1AF0B;
}

.ruletaT a, img{
	color: #6441a5;
}

.ruletaT .nav-link.active{
	color: #6441a5;
}

/* .e-commerce, .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
	color: #ffd700;
	color: #ff0000;
} */


/* Absolute Center Spinner */
.loading {
    position: fixed;
    z-index: 999;
    height: 2em;
    width: 2em;
    overflow: show;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

/* Transparent Overlay */
.loading:before {
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(rgba(20, 20, 20, .8), rgba(0, 0, 0, .8));

    background: -webkit-radial-gradient(rgba(20, 20, 20, .8), rgba(0, 0, 0, .8));
}

/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required) {
    /* hide "loading..." text */
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0;
}

.loading:not(:required):after {
    content: '';
    display: block;
    font-size: 10px;
    width: 1em;
    height: 1em;
    margin-top: -0.5em;
    -webkit-animation: spinner 150ms infinite linear;
    -moz-animation: spinner 150ms infinite linear;
    -ms-animation: spinner 150ms infinite linear;
    -o-animation: spinner 150ms infinite linear;
    animation: spinner 150ms infinite linear;
    border-radius: 0.5em;
    -webkit-box-shadow: rgba(255, 255, 255, 0.75) 1.5em 0 0 0, rgba(255, 255, 255, 0.75) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) 0 1.5em 0 0, rgba(255, 255, 255, 0.75) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) -1.5em 0 0 0, rgba(255, 255, 255, 0.75) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.75) 0 -1.5em 0 0, rgba(255, 255, 255, 0.75) 1.1em -1.1em 0 0;
    box-shadow: rgba(255, 255, 255, 0.75) 1.5em 0 0 0, rgba(255, 255, 255, 0.75) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) 0 1.5em 0 0, rgba(255, 255, 255, 0.75) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) -1.5em 0 0 0, rgba(255, 255, 255, 0.75) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.75) 0 -1.5em 0 0, rgba(255, 255, 255, 0.75) 1.1em -1.1em 0 0;
}

/* Animation */

@-webkit-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-o-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

