@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;800&display=swap');

/* Generales */

*{
	box-sizing:border-box;
	word-wrap:break-word;
}

*[test]{
	background-color:rgba(0,0,0,.5);
}

/* Etiquetas */

body{
	background-color: #EEE;
	padding: 0px;
	margin: 0px;
	width: 100%;
	font-family: 'Rubik', sans-serif;
	color: #111;
}

hr{
	width: 100%;
	border: 1px solid #EEE;
	margin: 10px 0px;
}

h1{
	font-family: 'Rubik', sans-serif;
	font-size: 25px;
	font-weight: 500;
	color: #FFF;
	background-color: #DC0000;
	padding: 10px 10px;
}

h2{
	font-family: 'Rubik', sans-serif;
	font-size: 20px;
	font-weight: 500;
	color: #333;
	margin: 0;
}

div{
	box-sizing: border-box;
	display: table;
}

a{
	text-decoration: none;
	color: #DC0000;
	display: contents;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

input[type=number] { -moz-appearance:textfield; }

.loader {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: inline-block;
  border-top: 4px solid #DC0000;
  border-right: 4px solid transparent;
  box-sizing: border-box;
  animation: rotation 1s linear infinite;
}

.loader::after {
  content: '';  
  box-sizing: border-box;
  position: absolute;
  left: 0;
  top: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border-left: 4px solid #FED000;
  border-bottom: 4px solid transparent;
  animation: rotation 0.5s linear infinite reverse;
}

.loader.ico{
  width: 15px;
  height: 15px;
  border-radius: 50%;
  display: inline-block;
  border-top: 2px solid #DC0000;
  border-right: 2px solid transparent;
  box-sizing: border-box;
  animation: rotation 1s linear infinite;
}

.loader.ico::after {
  content: '';  
  box-sizing: border-box;
  position: absolute;
  left: 0;
  top: 0;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  border-left: 2px solid #FED000;
  border-bottom: 2px solid transparent;
  animation: rotation 0.5s linear infinite reverse;
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
} 

a.bttn1{
	width: auto;
	height: auto;
	padding: 15px;
	background-color: #DC0000;
	font-size: 25px;
	color: #FFF;
	text-align: center;
	display: table;
	margin: 0 auto;
	border-radius: 7px;
	border: none;
	transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
}

a.bttn1:hover{
	background-color: #BF0000;
	color: #FED000;
}

a.bttn2{
	width: auto;
	height: auto;
	padding: 15px;
	background-color: #FED000;
	font-size: 25px;
	color: #DC0000;
	text-align: center;
	display: table;
	margin: 0 auto;
	border-radius: 7px;
	border: none;
	transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
}

a.bttn2:hover{
	background-color: #EDC900;
	color: #DC0000;
}

.blinkme {
  animation: blinker 1s linear infinite;
}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}

.no-padd{
	padding: 0px !important;
}

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

.ta-center{
	text-align: center;
}

.ta-justify{
	text-align: justify;
}

.ta-right{
	text-align: right;
}

.txt-b{
	color: #000 !important;
}

.status.s12, .status.s13, .status.s14{
	color: #555  !important;
	background-color: #eee !important;
}

.status.s15, .status.s16{
	color: #856404  !important;
	background-color: #fff3cd !important;
}

.status.s17{
	color: #155724 !important;
	background-color: #d4edda !important;
}

.status.s18{
	color: #B85CB5 !important;
	background-color: #FFC0FC !important;
}

.status.s19{
	color: #C04547 !important;
	background-color: #FFC2C3 !important;
}

.bg-b7{
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.7);
	z-index: 99;
	padding: 20px;
	overflow-y: auto;
	display: none;
}

.button-close{
	z-index: 99;
	position: absolute;
	top: -15px;
	right: -15px;
	width: 30px;
	height: 30px;
	font-size: 20px;
	font-weight: bold;
	background-color: #FFF;
	border-radius: 15px;
	text-align: center;
	border: 1px solid #D5D5D5;
	box-shadow: 0px 0px 5px #555;
	cursor: pointer;
	color: #777;
}

.button-close:hover{
	color: #560B0C;
}

img.loading{
	width: 55px;
}

.newalert{
	position: fixed;
	top: 0px;
	z-index: 97;
	width: 100%;
	height: auto;
	border: 1px solid;
	padding: 10px;
	margin: 0px 0px 10px;
	font-size: 15px;
	transition:top 500ms ease;
}

.newalert.hide{
	top: 0px;
}

.alert{
	width: 100%;
	height: auto;
	display: none;
	border: 1px solid;
	border-radius: 5px;
	padding: 5px;
	margin: 0px 0px 10px;
	font-size: 15px;
}

.alert-info{
	top: 60px;
	display: block;
	color: #333;
	background-color: #EDEDED;
	border-color: #DFDFDF;
}

.alert-prevent{
	top: 60px;
	display: block;
	color: #856404;
	background-color: #fff3cd;
	border-color: #ffeeba;
}

.alert-danger{
	top: 60px;
	display: block;
	color: #842029;
	background-color: #f8d7da;
	border-color: #f5c2c7;
}

.alert-done{
	top: 60px;
	display: block;
	color: #0b7a09;
	background-color: #e2f8d7;
	border-color: #c3f5c2;
}

div.alert-view{
	position: relative;
	width: 100%;
	height: auto;
	border-radius: 7px;
	margin: 0px auto;
	background-color: #FFF;
	box-shadow: 0px 0px 10px #000;
	padding: 20px;
	font-size: 18px;
}

div.content-view{
	position: relative;
	width: 100%;
	height: 98%;
	border-radius: 7px;
	margin: 0px 0px 10px;
	background-color: #FFF;
	box-shadow: 0px 0px 10px #000;
}

button{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 5px;
	border: 1px solid #CCC;
	border-radius: 7px;
	margin: 0px 0px 5px;
	background-color: #999;
	color: #FFF;
	cursor: pointer;
	transition:all 300ms ease;
}

button:hover{
	background-color: #666;
}

button.red{
	border: 1px solid #7B0002;
	background-color: #DC0000;
	color: #FFF;
}

button.red:hover{
	background-color: #BC0000;
}

/* Contenido */

div.header{
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 60px;
	background-color: #DC0000;
	color: #FFF;
	z-index: 98;
	box-shadow: 0px 0px 7px #222;
}

div.header div.logo{
	width: 160px;
	height: 60px;
	font-size: 35px;
	font-weight: bold;
	padding: 9px 10px;
	float: left;
	background-image: url("/img/logo_web.png");
	background-position: 10px center;
	background-size: auto 40px;
	background-repeat: no-repeat;
}

div.header div.menu-pc{
	width: auto;
	height: 60px;
	float: right;
}

div.menu-pc div.profile-info{
	width: 300px;
	height: 60px;
	color: #FFF;
	padding: 5px 15px;
	display: inline-block;
	font-size: 13px;
}

div.menu-pc div.profile-info .nav-photo{
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}

div.header div.menu-pc a.button{
	width: auto;
	height: 60px;
	color: #FFF;
	padding: 20px 15px;
	display: inline-block;
	font-size: 14px;
	transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
}

div.header div.menu-pc a.button.active{
	background-color: #BF0000;
	font-weight: bold;
}

div.header div.menu-pc a.button:hover{
	background-color: #BF0000;
}

div.header div.menu-toggle{
	float: right;
	width: auto;
	height: 60px;
	font-size: 30px;
	padding: 12px;
	display: none;
}

div.menu-responsive{
	position: fixed;
	top: -100%;
	left: 0px;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.7);
	overflow-y: auto;
	display: none;
	padding: 60px 0px 10px;
	transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	z-index: 1;
}

div.menu-responsive div.profile-data{
	width: 100%;
	height: auto;
	padding: 20px;
	background-color: rgba(220,0,0,.7);
	border-top: 1px solid #DC0000;
	color: #FFF;
	display: flex;
}

div.menu-responsive div.profile-data div.profile-photo{
	width: 100%;
	padding-top: 100%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

div.menu-responsive div.profile-data div.profile-info{
	display: block;
	padding: 0px 0px 0px 10px;
}

div.menu-responsive div.profile-data div.profile-info span{
	width: 100%;
	display: block;
}

div.menu-responsive div.buttons{
	width: 100%;
	padding: 0px 20px;
	height: auto;
}

div.menu-responsive a.button{
	position: static;
	width: 100%;
	height: auto;
	background-color: #FFF;
	border-radius: 7px;
	display: block;
	margin: 15px 0px;
	padding: 20px;
	font-size: 25px;
}

div.menu-responsive a.button.active{
	background-color: #DC0000;
	font-weight: bold;
	color: #FFF;
}

div.content{
	width: 100%;
	height: auto;
	padding: 60px 0px 0px;
}

div.content div.container-wr{
	background-color: #FFF;
	border-radius: 7px;
	padding: 30px 50px;
}

div.content div.container-wr span{
	padding: 0px 0px 30px;
}

div.content div.container-wr span.title{
	font-weight: bold;
	font-size: 25px;
	color: #DC0000;
	display: block;
	text-align: center;
}

div.content div.container-wr span.text{
	font-size: 16px;
	display: block;
}

div.content div.container-wr a.button-signup{
	width: auto;
	height: auto;
	padding: 15px;
	background-color: #DC0000;
	font-size: 25px;
	color: #FFF;
	text-align: center;
	display: table;
	margin: 0 auto;
	border-radius: 7px;
}

div.content div.form-login{
	background-color: #FFF;
	border-radius: 7px;
}

div.content div.form-login input{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 15px;
	background-color: #FFF;
	border: 1px solid #DDD;
	border-radius: 7px;
	margin: 0px 0px 10px;
}

div.content div.form-login button.bttn-login{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 15px;
	background-color: #DC0000;
	border-radius: 7px;
	border: none;
	color: #FFF;
	cursor: pointer;
}

div.content div.form-login button.bttn-verify{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 15px;
	background-color: #DC0000;
	border-radius: 7px;
	border: none;
	color: #FFF;
	cursor: pointer;
}

div.content div.form-login span.recovery{
	width: 100%;
	display: block;
	text-align: center;
	margin: 20px 0px 10px;
}

div.content div.form-login a.button-signup{
	width: auto;
	height: auto;
	padding: 15px;
	background-color: #FED700;
	font-size: 25px;
	color: #FFF;
	text-align: center;
	display: table;
	margin: 0 auto;
	border-radius: 7px;
}

div.content div div.welcome-image{
	width: 100%;
	height: 100%;
	background-image: url('/img/welcome-image.png');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	border-radius: 7px;
	background-color: #DC0000;
}

div.content div div.signin-image{
	width: 100%;
	height: 350px;
	background-image: url('/img/signin-image.png');
	background-position: center;
	background-repeat: no-repeat;
	background-size: 60%;
	border-radius: 7px;
	background-color: #DC0000;
}

div.content div div.contact-image{
	width: 100%;
	height: 350px;
	background-image: url('/img/contact-image.jpg');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	border-radius: 7px;
}

div.content div.aboutus{
	background-color: #FFF;
	border-radius: 7px;
	padding: 30px;
}

div.content div div.aboutus-image{
	width: 100%;
	height: 350px;
	background-image: url('/img/aboutus-image.jpg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	border-radius: 7px;
}

div.content div.form-signup{
	background-color: #FFF;
	border-radius: 7px;
}

div.content div.form-signup select{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 15px;
	background-color: #FFF;
	border: 1px solid #DDD;
	border-radius: 7px;
	margin: 0px 0px 10px;
}

div.content div.form-signup input[type='text'],
div.content div.form-signup input[type='phone'],
div.content div.form-signup input[type='email'],
div.content div.form-signup input[type='password']{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 15px;
	background-color: #FFF;
	border: 1px solid #DDD;
	border-radius: 7px;
	margin: 0px 0px 10px;
}

div.content div.form-signup span{
	font-size: 14px;
}

div.content div.form-signup input[type='checkbox']{
	display: inline-block;
}

div.content div.form-signup button.bttn-signup{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 15px;
	background-color: #DC0000;
	border-radius: 7px;
	border: none;
	color: #FFF;
	cursor: pointer;
}

div.content div div.signup-image{
	width: 100%;
	height: 350px;
	background-image: url('/img/signup-image.jpg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	border-radius: 7px;
}

/* Aplicacion */

div.content div.section-content{
	background-color: #FFF;
	min-height: 220px;
}

div.content div.section-content .data{
	border: 1px solid #DFDFDF;
	margin-bottom: 10px;
}

div.content div.section-content div.data span.tag{
	font-size: 20px;
	position:absolute;
	top:50%;
	transform:translateY(-50%);
}

div.section-content div.subtitle{
	background-color: #DFDFDF;
}

div.section-content input{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 5px;
	border: 1px solid #CCC;
	background-color: #FFF;
	border-radius: 7px;
}

div.section-content input[type='number']{
	text-align: right;
}

div.section-content select{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 5px;
	border: 1px solid #CCC;
	background-color: #FFF;
	border-radius: 7px;
	margin: 0px 0px 5px;
}

div.content div.orders-submenu{
	padding: 10px 0px 10px 10px;
}

div.content div.orders-submenu a.button{
	width: 100%;
	height: auto;
	background-color: #E1E1E1;
	border-radius: 7px 0px 0px 7px;
	display: block;
	margin: 3px 0px;
	padding: 7px;
	font-size: 17px;
	color: #666;
	border: 1px solid #D5D5D5;
}

div.content div.orders-submenu a.button:nth-child(2n){
	background-color: #EAEAEA;
}

div.content div.orders-submenu a.button.active{
	background-color: #FFF;
	color: #1473e6;
	border: none;
	box-shadow: 0px 4px 4px #999;
}

div.content div.settings-submenu{
	padding: 10px 0px 10px 10px;
}

div.content div.settings-submenu a.button{
	width: 100%;
	height: auto;
	background-color: #E1E1E1;
	border-radius: 7px 0px 0px 7px;
	display: block;
	margin: 3px 0px;
	padding: 7px;
	font-size: 17px;
	color: #666;
	border: 1px solid #D5D5D5;
}

div.content div.settings-submenu a.button:nth-child(2n){
	background-color: #EAEAEA;
}

div.content div.settings-submenu a.button.active{
	background-color: #FFF;
	color: #DC0000;
	border: none;
	box-shadow: 0px 4px 4px #999;
}

div.content div.settings-content{
	background-color: #FFF;
	min-height: 220px;
}

div.content div.settings-content .data{
	border: 1px solid #DFDFDF;
	margin-bottom: 10px;
}

div.content div.settings-content.balance{
	font-size: 13px;
}

div.content div.settings-content.balance div{
	padding: 10px 5px;
}

div.content div.settings-content.balance div.entry{
	color: #2EA61C;
}

div.content div.settings-content.balance div.exit{
	color: #E72225;
}

div.content div.settings-content.balance span.date{
	font-size: 10px;
}

div.content div.orders-content{
	background-color: #FFF;
	min-height: 220px;
}

div.content div.orders-content .wappchannel{
	font-size: 12px;
	margin-bottom: 15px;
}

div.order-container{
	border: 1px solid #DDD;
	border-radius: 7px;
	margin: 0px 0px 10px;
	background-color: #FFF;
	box-shadow: 0px 0px 5px #DDD;
}

div.order-container div.info{
	padding: 10px 10px 10px 0px;
}

div.order-container div div.logo{
	width: 100%;
	padding-top: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

div.order-container div span.ready-time{
	width: 100%;
	display: block;
	text-align: center;
	font-size: 30px;
	font-weight: bold;
	line-height: 80%;
	margin: 15px 0px;
}

div.order-container div div.status{
	display: block;
	width: 100%;
	height: auto;
	padding: 10px 0px 5px;
	font-size: 30px;
	border-radius: 7px;
	text-align: center;
	color: #777;
	background-color: #EEE;
}

div.order-container div span.dynamic{
	width: 100%;
	display: block;
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	line-height: 80%;
	margin: 15px 0px;
}

div.order-container div span.station-name{
	width: 100%;
	font-size: 17px;
	font-weight: bold;
	color: #111;
	display: block;
}

div.order-container div span.icon-recharge{
	color: #00D304;
}

div.order-container div span.station-address{
	width: 100%;
	font-size: 14px;
	color: #555;
	display: block;
}

div.order-container div span.client-name{
	width: 100%;
	font-size: 20px;
	color: #111;
	display: block;
}

div.order-container div span.client-address{
	width: 100%;
	font-size: 17px;
	color: #333;
	display: block;
}

div.order-container div span.amounts{
	width: 100%;
	font-size: 14px;
	color: #555;
	display: block;
}

div.order-container div button{
	width: 100%;
	height: auto;
	font-size: 20px;
	padding: 10px;
	background-color: #1473e6;
	border-radius: 7px;
	border: none;
	color: #FFF;
	cursor: pointer;
	margin: 10px 0px 0px;
}

div.order-cont{
	background-color: #FFF;
}

div.order-cont div.row div div.logo{
	width: 100%;
	padding-top: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

div.icon-map{
	width: 39px;
	height: 39px;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	border: 1px solid #999;
	border-radius: 15px;
	display: inline-block
}

div.icon-map.google{
	background-image: url('/img/map_google.jpg')
}

div.icon-map.waze{
	background-image: url('/img/map_waze.jpg')
}

div.order-cont div.row div div.status{
	display: block;
	width: 100%;
	height: auto;
	padding: 10px 0px;
	font-size: 20px;
	border-radius: 7px;
	text-align: center;
}

div.order-cont div.row div span.times{
	display: block;
	width: 100%;
	margin: 10px 0px;
	text-align: center;
	font-size: 14px;
}

div.order-cont div.row div.station-info{
	padding: 0px 10px 10px
}

div.order-cont div.row div span.station-name{
	width: 100%;
	font-size: 18px;
	font-weight: bold;
	color: #111;
	display: block;
	text-align: center;
}

div.order-cont div.row div span.station-address{
	width: 100%;
	font-size: 14px;
	color: #555;
	display: block;
	text-align: center;
}

div.order-cont div.row div span.station-reference{
	width: 100%;
	font-size: 14px;
	color: #555;
	display: block;
	text-align: center;
}

div.order-cont div.picker-info{
	margin: 10px 0px 0px;
	background-color: #F5F5F5;
}

div.order-cont div.row  div.picker-photo{
	width: 100%;
	padding-top: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

div.order-cont div.row.client-info{
	padding: 0px;
	background-color: #F5F5F5;
}

div.order-cont div.row div span.client-name{
	width: 100%;
	font-size: 20px;
	font-weight: bold;
	color: #111;
	display: block;
	text-align: left;
}

div.order-cont div.row div span.client-address{
	width: 100%;
	font-size: 14px;
	color: #333;
	display: block;
	text-align: left;
	padding: 0px;
	border: none;
	background-color: transparent;
}

div.order-cont div.row div span.client-reference{
	width: 100%;
	font-size: 14px;
	color: #555;
	display: block;
	text-align: left;
}

div.order-cont div.row div span.client-phone{
	width: 100%;
	color: #333 !important;
	font-size: 14px;
	display: block;
	text-align: left;
}

div.order-cont div.row.amounts div{
	text-align: right;
}

div.order-cont div.row div div.warning{
	color: #939639;
	border: 1px solid #C3B34D;
	background-color: #FFFED4;
}

div.order-cont div.row div .button-status,
.button-status.change{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 10px;
	background-color: #E69C15;
	border-radius: 7px;
	border: none;
	color: #FFF;
	cursor: pointer;
	margin: 15px 0px;
}

div.order-history{
	font-size: 13px;
	background-color: transparent;
}

div.order-history .button-status{
	width: 100%;
	height: auto;
	font-size: 15px;
	padding: 10px;
	background-color: #9F1D1F;
	border-radius: 7px;
	border: none;
	color: #FFF;
	cursor: pointer;
	margin: 10px 0px;
}

/* Order Create */

#results{
	display: none;
	position: relative;
	transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
}

#results > div{
	position: relative;
	background-color: #FFF;
	border: 1px solid #DFDFDF;
	width: 100%;
}

#results div div.row span{
	color: #DC0000;
}

#results div div.row{
	background-color: #F3F3F3;
	margin-bottom: 5px;
	cursor: pointer;
	transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
}

#results div div.row:hover{
	background-color: #FFD3D4;
}

#results div div.row:last-child{
	margin-bottom: 0;
}

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

Ordenes de Tienda

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



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

Ordenes de Tienda

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

div.orders-create input,
div.orders-create select{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 5px;
	border: 1px solid #CCC;
	background-color: #FFF;
	border-radius: 7px;
	margin: 0px 0px 5px;
	text-align: left;
	font-family: 'Rubik', sans-serif;
}

div.orders-create input[type='tel'],
div.orders-create input[type='number']{
	text-align: right;
}

div.orders-create textarea{
	width: 100%;
	height: auto;
	font-size: 20px;
	padding: 5px;
	border: 1px solid #CCC;
	background-color: #FFF;
	border-radius: 7px;
	margin: 0px 0px 5px;
	text-align: left;
	resize:none;
	font-family: 'Rubik', sans-serif;
}

div.orders-create .search-address{
	width: 100%;
	display: block;
	margin: 0px 0px 5px;
	text-align: right;
	color: #1473e6;
	cursor: pointer;
}

div.orders-create button{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 5px;
	background-color: #1473e6;
	border-radius: 7px;
	border: none;
	color: #FFF;
	cursor: pointer;
	margin: 0px 0px 5px
}

div.orders-create button.create{
	background-color: #E69C15;
}

div.orders-create div.addresses{
	width: 100%;
	height: auto;
	max-height: 150px !important;
	margin: 10px 0px;
	overflow-y: scroll;
	display: block;
}

div.orders-create div.addresses div.no-results{
	width: 100%;
	height: auto;
	margin: 5px 0px;
	padding: 15px;
	background-color: #FFF;
	border: 1px solid #DDD;
	border-radius: 5px;
	font-size: 14px;
	color: #A62325;
	font-weight: bold;
	text-align: center;
}

div.orders-create div.addresses div.results{
	width: 100%;
	height: auto;
	margin: 5px 0px;
	padding: 15px;
	background-color: #FFF;
	border: 1px solid #DDD;
	border-radius: 5px;
	font-size: 14px;
	cursor: pointer;
}

div.orders-create div.addresses div.results:hover{
	background-color: #DDD;
	transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;

}

div.orders-create div.addresses div span{
	
}

div.orders-create div.new-order{
	width: 100%;
	height: auto;
	display: table;
	padding: 15px 0px;
}

div.orders-create div.new-order div.row div{
	padding: 0px;
}
/**
div.orders-create div.new-order div.row div[class^="col-10"],
div.orders-create div.new-order div.row div[class^="col-5"]{
	padding: 0px;
}
**/
div.orders-status{
	padding: 10px 0px 0px;
}

div.orders-status a.button{
	width: 50%;
	height: auto;
	border-radius: 14px 14px 0px 0px;
	display: block;
	margin: 0px;
	padding: 10px 7px;
	font-size: 22px;
	color: #666;
	text-align: center;
	background-color: #E1E1E1;
	border: 1px solid #D5D5D5;
}

div.orders-status a.button.active{
	background-color: #FFF;
	color: #1473e6;
	border: none;
}

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

Settings

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

div.settings-content div.tag{
	font-size: 18px;
	padding: 22px 0px 10px 10px !important;
}

div.settings-content input{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 5px;
	border: 1px solid #CCC;
	background-color: #FFF;
	border-radius: 7px;
	margin: 0px 0px 5px;
}

div.settings-content button{
	width: 100%;
	height: auto;
	font-size: 25px;
	padding: 5px;
	border: 1px solid #CCC;
	border-radius: 7px;
	margin: 0px 0px 5px;
	/*background-color: #DC0000;
	color: #FFF;*/
	background-color: #666;
	color: #FFF;
	cursor: pointer;
}

div.settings-content input[type='file']{
	width: 100%;
	height: auto;
	font-size: 15px;
	padding: 5px;
	border: 1px solid #CCC;
	background-color: #FFF;
	border-radius: 7px;
	margin: 0px 0px 5px;
}

div.settings-content div.subtitle{
	background-color: #DFDFDF;
}

div.places-results div.row:nth-child(even){
	background-color: #EEE;
}

div.settings-content img{
	width: auto;
	height: auto;
	max-width: 150px;
	max-height: 82px;
}

/* Footer */

div.content div.footer{
	text-align: center;
	color: #777;
	font-size: 12px;
}

div.content div.footer span.icon-facebook,
div.content div.footer span.icon-instagram,
div.content div.footer span.icon-whatsapp{
	transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	font-size: 20px;
	color: #777;
}

div.content div.footer span.icon-facebook:hover{
	color: #1877F2;
}

div.content div.footer span.icon-instagram:hover{
	color: #DD2A7B;
}

div.content div.footer span.icon-whatsapp2:hover{
	color: #25D366;
}

div.create-order{
	position: fixed;
	bottom: 0px;
	right: 0px;
	min-width: 70px;
	width: 70px;
	height: 70px;
	margin: 15px;
	background-color: #339F0E;
	border-radius: 15px;
	overflow: hidden;
	transition: width 0.4s ease;
}

div.create-order div{
	position: absolute;
	height: 70px;
	padding: 10px;
	vertical-align: middle;
}

div.create-order div.phone{
	right: 70px;
	width: calc(100% - 70px);
	color: #FFF;
}

div.create-order div.phone input{
	width: 100%;
	height: 100%;
	font-size: 25px;
	text-align: right;
	color: #000;
	border: none;
	border-radius: 10px;
	padding: 5px;
}

div.create-order div.button{
	user-select: none;
	right: 0;
	width: 70px !important;
	cursor: pointer;
	font-size: 40px;
	color: #FFF;
	text-align: center;
	background-color: #2D8C0C;
	font-weight: bold;
}

/* VALIDAR PICKERS */

div.document img{
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
}

div.document input{
	display: block;
	width: 100%;
	padding: 5px;
	font-size: 16px;
	border-radius: 5px;
	margin: 0px 0px 10px;
}

div.document button.approved{
	background-color: #1473e6;
	color: #fff;
}

div.document button.disapproved{
	background-color: #8E0002;
	color: #fff;
}

div.document button{
	display: block;
	width: 100%;
	padding: 10px;
	font-size: 16px;
	border-radius: 5px;
	margin: 0px 0px 15px;
	border: none;
	cursor: pointer;
}

/* TERMINOS Y CONDICIONES */

span.terms{
	font-size: 14px;
	color: #888;
	width: 100%;
	margin: 10px 0px 15px;
	display: block;
	text-align: center;
}
div.terms{
	background-color: #fff;
	padding: 30px;
	font-size: 15px;
}

@media screen and (max-width: 880px) {
	
	div.content div.orders-submenu a.button{
		width: 50%;
		height: auto;
		border-radius: 14px 14px 0px 0px;
		display: block;
		margin: 0px;
		padding: 7px;
		font-size: 30px;
		color: #666;
		text-align: center;
	}
	
	div.content div.orders-submenu{
		padding: 10px 10px 0px;
	}

	div.content div.orders-submenu a.button span:nth-child(2){
		display: none;
	}
	
	div.content div.settings-submenu a.button{
		width: 25%;
		height: auto;
		border-radius: 14px 14px 0px 0px;
		display: block;
		margin: 0px;
		padding: 7px;
		font-size: 30px;
		color: #666;
		text-align: center;
	}
	
	div.content div.settings-submenu{
		padding: 10px 10px 0px;
	}

	div.content div.settings-submenu a.button span:nth-child(2){
		display: none;
	}
	
	div.orders-status a.button{
		font-size: 15px;
	}

	div.order-history{
		font-size: 11px;
		background-color: #fff;
	}
	
}


@media screen and (min-width: 880px) {
	
	div.menu-responsive{
		display: none !important;
	}
	
	div.alert-view{
		max-width: 400px;
		margin: 0px auto;
	}
	
	div.content-view.order{
		max-width: 400px;
		margin: 0px auto;
	}
	
}