@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');
body{padding:0; margin:0}
*{box-sizing: border-box; font-family:Lato; -webkit-tap-highlight-color:rgba(0, 0, 0, 0); }
input[type=search]::-ms-clear {  display: none; width : 0; height: 0; }
input[type=search]::-ms-reveal {  display: none; width : 0; height: 0; }
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }

.container{width: 100%; padding:0px }
.header{width: 100%; background-color: #e6eef4; padding: 20px; box-shadow: 0 5px 5px 2px rgba(0,0,0,.1); text-align: center}
.header img{max-height:150px}
#map_canvas{height:350px}
b, h1, h2, h3, h4, h5, h6{font-weight:500}

input,textarea, select{ border-radius:3px; outline:none; border:solid 1px #E4DADA; box-shadow:0 2px 2px 0 rgba(0,40,0,.4); padding:12px 10px; width:100%; margin:10px 0; color:#555; font-size:15px; display:inline-block; background-color:white}
input[type="checkbox"]{width: auto; margin-right: 10px;}
input:focus,textarea:focus, select:focus{border:solid 1px #D8A2A2; box-shadow:0 4px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 4px 5px 0 rgba(0,0,0,.12);}
textarea{box-sizing: border-box; resize:none;}
input::placeholder,textarea::placeholder, select::placeholder{color:#ccc}
.formData{width:50%; margin:0 25%; padding: 30px}
#loading, #loadingModal{display: none; text-align: center; padding:40px 0}
.toast{color:white; padding:20px 25px; display:none; position:fixed; bottom:20px; box-shadow:0 5px 10px 5px rgba(0,0,0,.4); width:300px; left:50%; margin-left:-150px; z-index:9300544; text-align: center; border-radius: 7px; text-transform: uppercase}
.divInput{ position:relative; padding:10px 7px; float: left; width:100%}
#DivBotonOk{width:100% !important}
.divInput>label{color:#1F3F6C; position:absolute; top:5px; left:20px; font-size:12px}
.divInput>div>label{color:#1F3F6C; font-size:12px; display: block}

.divInput .btnMas{position: absolute; right:25px; top:28px; width: 35px; height: 35px; background-color: white}
.divInput .btnMas img{width: 30px; height: 30px; filter: grayscale(100%); cursor: pointer; user-select: none; transition: .2s; border-radius: 100%;}
.divInput .btnMas img:hover{filter: grayscale(0%); box-shadow: 0 2px 4px 2px rgba(0,0,0,.17)}

.btnEnviar{background-color:#1F3F6C; color: white; box-shadow: 0 2px 4px 2px rgba(0,0,0,.1); padding:17px 14px; font-size:17px; text-align:center; text-transform: uppercase; border-radius:5px; cursor: pointer; user-select: none !important; width:40%; float: right}

.ContainerImg{width:90%; margin:10px 5% 30px 5%; display:block; position:relative}
.ContainerImg>img{width:60%; border-radius:5px; margin:10px 20%}
.containerButtonImg{ position:absolute; left:50%; margin-left:-28px; bottom:-28px;}
.labelButtonImg{background-color:#1F3F6C; border-radius:50%; height:56px; margin:auto; min-width:56px; width:56px; padding:0; overflow:hidden; box-shadow:0 1px 1.5px 0 rgba(0,0,0,.12), 0 1px 1px 0 rgba(0,0,0,.24); position:relative; outline:none; cursor:pointer; text-decoration:none; text-align:center; font-weight:500; display:inline-block; border:none;}

.labelButtonImg .material-icons{vertical-align:middle; position:absolute; top:50%; left:50%; transform: translate(-12px,-12px); line-height:24px; width:24px; font-style:normal; font-size:24px; display:inline-block; direction:ltr;}

.NombreFile{margin:10px 5%; width: 90%; background-color:#e5e5e5; border-radius:3px; padding:3px 9px; display:none; word-wrap: break-word}

.divCheckbox{margin-top: 5px}
.divCheckbox > label{font-size: 16px !important}


.registroAdmin{width: 50%; margin: 40px 25%}

.btnNuevo{background-color:#1F3F6C; color: white; box-shadow: 0 2px 4px 2px rgba(0,0,0,.1); padding:10px 14px; font-size:15px; text-align: center; position:absolute; z-index:9; text-transform: uppercase; top: 130px; right: 5%; border-radius:5px; cursor: pointer; user-select: none}

.buscar{width:100%; display:block; margin:7px 0}

.containerLista{width: 90%; margin: 20px 5%}

.divBuscarIndex{padding: 0 30px; margin-bottom: -35px; margin-top: 30px;}

.itemLista{border-top: solid 1px #1F3F6C; cursor:pointer; display: block; transition: .4s;}
.itemLista:last-child{border-bottom: solid 1px #1F3F6C}
.itemLista:hover{background-color: #DCE6F4}
.col5,.col10,.col15,.col20,.col25,.col30,.col35,.col40,.col45,.col50{padding: 10px 5px; float: left; color: #333; text-align: left; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.col5{width:5%}
.col10{width:10%}
.col15{width:15%}
.col20{width:20%}
.col25{width:25%}
.col30{width:30%}
.col35{width:35%}
.col40{width:40%}
.col45{width:45%}
.col50{width:50%}
.iconLista{width:28px; height:28px; position: absolute; top:6px; left:40%}

.infoEmp{display: none}
.divHidden{display: block}

.flechaArriba{transform: rotate(-180deg);}



.rubros{
	margin-top: 50px;
	padding: 20px 20px 0 20px;
}

.itemRubro{
	
}



.rubrosHidden{display:none}

.arrowMenuRubros{width:60%;
    background-color: antiquewhite;
    text-align: center;
    padding: 5px;
    margin-top: 50px;
    margin-left:20%;
    border-radius: 20px;}

.flechaMenuRubro{width:40px; height: 40px; transition:.3s}

.itemRubro:active , .itemRubro:hover {background-image: linear-gradient(to bottom, #1E479B 0%, #4681C7 100%);}

.itemRubro {
	text-decoration: none;
	display: block;
    color: white;
    box-shadow: 0 2px 10px 2px #ffaf88;
    text-align: left;
    font-size: 18px;
    background-image: linear-gradient(to top, #1E479B 0%, #4681C7 100%);
    float: left;
	position: relative;
      padding: 12px 5px 14px 20px;
      width: 19%;
      border-radius: 20px;
      margin: 8px .5%;
}


.itemRubro .flechaRubro{transform: rotate(-90deg); vertical-align: middle; margin-top: 0px; filter: brightness(5.5); position: absolute; top: 13px; right: 10px;}


.titleRubros{
    text-align: center;
    margin-top: 40px;
    font-size: 30px;
    text-decoration: underline;
    color: #1e479b;
}


.itemEmpIndex {
    min-height: 175px;
    margin: 9px 0.5%;
    background-image: none;
    border-bottom: 3px solid #248cd6;
    background-color: #efefef;
}

.itemEmpIndex .logoEmp{display:none}
.itemEmpIndex .logoEmp img{}
.itemEmpIndex .deliveryEmp{display:none}
.itemEmpIndex .columnaRight{min-height: 0; padding-bottom: 0; width:100%;}
.itemEmpIndex .nombreEmp{margin-bottom: 5px;}
.itemEmpIndex .rubroEmp{max-height: 60px; overflow: hidden}
.itemEmpIndex .shareEmp{display:none}
.itemEmpIndex .shareLabel{display:none}
.itemEmpIndex .separadorHorario{display:none}
.itemEmpIndex .horarioEmp{display:none}
.itemEmpIndex .contactoEmp{display:none}
.itemEmpIndex .infoEmp{display:none}
.itemEmpIndex .divHidden{display:none}
.itemEmpIndex .pagosEmp{}
.itemEmpIndex .direccionEmp{}


.colHead{background-color: #8F0000; color:white; text-align: center; padding: 5px }
.colFecha{width:10%; float:left; padding:10px}
.colNombre{width:25%; float:left; text-align: left; padding:10px}
.colCelular{width:10%; float:left; padding:10px}
.colMonto{width:10%; float:left; font-weight: bolder; padding:10px}
.colDireccion{width:25%; float:left; padding:10px}
.colMapa{width:15%; float:left; padding:10px}
.colPagado{width:5%; float:left; padding:10px}

.divPetiso{height:1200px; overflow: hidden}

.btnSession{width: auto; float: right; margin: 23px 15px 30px 0; border: solid 1px #248cd6; color: #ffffff; background-color: #248cd6;}


.tituloModulo {background-color: #90D3F8}
.tituloModulo b{margin: 21px 10px 5px 47px; font-size: 25px; float: left;}
/***************************************************************************************/
/***************************************************************************************/
/***************************************************************************************/
/***************************************************************************************/
/***************************************************************************************/
/***************************************************************************************/


@media (max-width: 750px) {

.tituloModulo b{
	margin: 32px 10px 5px 47px;
    font-size: 25px;
    float: left;
}


.itemListaHead{display: none}
.itemLista{position: relative; padding: 12px}
.colFecha{width:50%; float:left}
.colNombre{width:50%; float:left; padding:2px 10px}
.colCelular{width:50%; float:left; color: #888888; padding:2px 10px}
.colMonto{width:50%; float:right; text-align: right;}
.colDireccion{width:100%; float:left; padding:2px 10px}
.colMapa{width:100%; float:left}
.colPagado{display: none}



#map_canvas{height:300px !important}


.divBuscarIndex{
	padding: 0;
	margin-bottom: -35px;
	margin-top:10px;
	position: sticky;
    top: 0;
    z-index: 111111;
    background-color: white;
}

.divBuscarIndex .inputSearch{
	width: 100%;
    margin-left: 0%;
	padding: 20px 16px;
	border:none;
	box-shadow: 0 2px 8px 1px #d2d2d2;
    font-size: 18px;
}


.header .logoHeader {
    width: 100%;
}
.header .logoHeader img {
    max-height: 200px;
}

.header h5{
	width:100%; font-size: 15px; margin:15px 0 10px 0;
}

.header .leyendaHeader {
    width: 90%;
    margin-left: 5%;
    font-size: 17px;
}

.header .leyendaHeader a {
    padding: 15px
}

.itemEmp {
    width: 100%;
    margin:18px 0;
	min-height: 100px;
	border-radius: 15px;
	box-shadow: 0 4px 6px 1px rgba(0,0,0,.15);
}

.logoEmp {
    height: 100px;
    float: left;
    width: 25%;
}

.logoEmp img {
    height: auto;
	max-height: 100px;
	max-width: 100%;
	border-radius: 12px;
}


.columnaRight{
	float: right;
	width: 75%;
	min-height: 100px;
	padding-bottom:50px
}

.nombreEmp {
    font-size: 21px;
    color: #333;
    padding: 7px 12px 0;
    font-weight: 600;
    margin-top: 0;
    width: 100%;
	line-height: 23px;
}

.deliveryEmp{
	margin-left: 10px;
    margin-top: 10px;
    top: -5px;
    right: 5px;
	left: auto;
	bottom: auto;
}

.rubroEmp {
    font-size: 14px;
    color: #555;
    font-weight: 600;
    width: 100%;
	padding: 8px 12px 12px 12px;
}


.horarioEmp {
	height: auto;
	font-size: 16px;
	padding-top: 22px;
}

.pagosEmp {
	height: auto;
	padding: 0 12px 7px 12px;
}

.formData {
    width: 100%;
    margin: 0;
    padding: 7px;
}

.containerButtonImg {
    right: 10%; left: auto
}

.btnEnviar {
    padding:14px;
    font-size: 15px;
    width: 100%;
}


.contactoEmp {
    padding:0px;
    width:51%;
	float: left;
    margin: 17px 2% 9px 3%;
}

.contactoEmp a {
	padding:8px 7px 10px 7px;
	font-size: 20px;
	letter-spacing: 1px; 
	user-select: none
}

.contactoEmp a img {
    width: 23px;
    height: 23px;
	margin-top: 1px;
}

.infoEmp{
	display: block;
	padding: 14px 7px 0px 7px;
	width: 41%;
    margin: 17px 3% 9px 0%;
	border-radius: 7px;
	text-align: center;
	float: left;
	user-select: none;
}

.infoEmp a{
	font-size: 16px;
    font-weight: 600;
	user-select: none;
	color: #333;
}

.infoEmp img{
	vertical-align: middle;
	margin-top: -4px;
	transition: .3s
}

.divHidden{
	padding: 3px 0 10px 0;
	display: none
}

.direccionEmp {
	padding: 7px 12px;
}


.direccionEmp img{
	vertical-align: middle;
	margin-top: -2px;
    margin-right: 5px;
}

.btnNuevo {
    top: 180px;
}


.clearMovil{
	clear: both
}


.rubros{
	margin-top: 50px;
	padding: 20px 20px 0 20px;
}

.itemRubro {
    padding: 14px 5px 16px 20px;
    width: 48%;
    border-radius: 25px;
    margin: 11px 1%;
}

.itemRubro .flechaRubro{top: 15px; }



.superContainer{
	overflow-x: scroll; width: 800px;
}


.titleRubros{
    font-size: 35px;
}

.itemEmpIndex{min-height: 80px; margin: 9px 0; background-image: none; border-bottom: 3px solid #248cd6; background-color: #efefef;
}





}