.buscadorPrincipal {
    display: flex;
}
.buscadorPrincipal > span {
	opacity: 0.5;
	padding:5px;
    width: 100%;
    text-align: center;
	border-top:1px solid rgba(0,0,0,0.5);
	border-left:1px solid rgba(0,0,0,0.5);
}
.buscadorPrincipal .onlyphone{
	display:none;
	background-color: slategrey;
    color: white;
}
.buscadorPrincipal .rightborder {

	border-right:1px solid rgba(0,0,0,0.5);
}
.buscadorPrincipal .comoboton {
	opacity: 0.5;
	/*width: 38px;*/
    font-size: 17px;
    padding: 0px 10px;
    border: 1px solid rgba(0,0,0,0.5);
    border-bottom: 0px;
    border-top: 0px;
    border-right: 1px solid rgba(0,0,0,0);
	border-left: 0px solid rgba(0,0,0,0);
}
.buscadorPrincipal input {
    border-right: 0.3px solid rgba(0,0,0,0) !important;
}
.buscadorPrincipal input {
    opacity: 0.5;
    border: 0.3px solid rgba(0,0,0,0.5);
    padding: 0px 5px 0px 10px;
    width: 100%;
    text-align: center;
    transition: all 0.3s;
}
.buscadorPrincipal input:hover,.buscadorPrincipal input:focus {
	opacity:1;
	border-right: 0.3px solid rgba(0,0,0,0.5) !important;
}
.buscadorPrincipal input{
	border-right: 0.3px solid rgba(0,0,0,0) !important;
}
.buscadorPrincipal select {
	opacity: 0.5;
	height: 40px;
    border: 0.3px solid rgba(0,0,0,0.5);
    padding: 10px 10px;
    width: 100%;
    text-align: center;
    transition: all 0.3s;
	border-right: 0.3px solid rgba(0,0,0,0) !important;
	
}
.buscadorPrincipal select:hover,.buscadorPrincipal select:focus {
	opacity:1;
	border-right: 0.3px solid rgba(0,0,0,0.5) !important;
}
.buscadorPrincipal option {
	padding:5px 20px;
}
.buscadorPrincipal .button {
  opacity:0.5;
  background: white;
  font-size: 17px;
  border: 1px solid rgba(0,0,0,0.5);
  cursor: pointer;
  transition:all 0.3s;
  color: #333435;
}
.buscadorPrincipal .button a {
	text-decoration: none;
    padding: 10px;
    display: block;
	transition:all 0.5s;
}
.buscadorPrincipal .button:hover {
	border: 1px solid rgba(0, 126, 202,1);
	opacity:1;
	color:rgba(0, 126, 202,1);
	
}
.buscadorPrincipal .button:hover a {
	color:rgba(0, 126, 202,1);	
}
.buscadorPrincipal input[type=date]::-webkit-inner-spin-button, .buscadorPrincipal
input[type=date]::-webkit-outer-spin-button,
.buscadorPrincipal input[type=month]::-webkit-inner-spin-button, .buscadorPrincipal
input[type=month]::-webkit-outer-spin-button  { 
  -webkit-appearance: none; 
  margin: 0; 
}
.buscadorPrincipal input[type="date"]::-webkit-calendar-picker-indicator,
.buscadorPrincipal input[type="month"]::-webkit-calendar-picker-indicator {
    color: rgba(0, 0, 0, 0);
    opacity: 0.8;
    display: block;
    background: url(http://icons.iconarchive.com/icons/paomedia/small-n-flat/1024/calendar-icon.png) no-repeat;
	background-size: 100% 100% ;
    width: 18px;
    height: 20px;
    border-width: thin;
	cursor:pointer;
	transition: all 0.5s;
}
.buscadorPrincipal input[type="date"]::-webkit-calendar-picker-indicator:hover,
.buscadorPrincipal input[type="month"]::-webkit-calendar-picker-indicator:hover {
	transform:scale(1.1);
}
.moree {
	display:flex;
	width:100%;
	justify-content:center;
}
.moree .more_text {
	opacity:0.5;
	width:20%;
	text-align:center;
	border:1px solid rgba(0,0,0,0.5);
	border-top:none;
	color:rgba(0,0,0,0.5);
	border-radius:0px 0px 20px 20px;
	padding:10px;
	cursor:pointer;
	transition:all 1s;
}
.moree .more_text:hover {
	opacity:1;
	width:25% !important;
	background-color:rgba(0,0,0,0.01);
	border:1px solid #0088DA;
	border-top:none;
	color: #0088DA;
	
}
.actfilter {
    border: 1px solid rgba(0,0,0,0.3);
    border-top: none;
    background-color: #f1f1f1 !important;
	transition:all 0.5s;
}
.moree .more_act {
	width:30% !important;
	opacity:1 !important;
	color: #0088DA;
	border:1px solid #0088DA;
	border-top:none;
}
.moree .more_act:hover {
	width:25% !important;
	box-shadow: 0px 2px 10px 2px rgba(0,136,218,0.1);
}
.moree i {
  border: solid black;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
}

.moree .right {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

.moree .left {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}

.moree .up {
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}

.moree .down {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.filter_content {
	width:100%;
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
}
.filter_content > div:first-child {
	margin-right:5px;
}
.filter_content > div:last-child {
	margin-left:5px;
}
.filter_content .conte_filter {
	width:50%;
	text-align:center;
	
}
.filter_content .conte_filter input[type="text"], .filter_content .conte_filter input[type="number"] {
	border: 1px solid rgba(0,0,0,0.5);
    border-radius: 5px;
	padding:5px;
	width:95%;
	opacity:0.7;
	transition:all 0.3s;
	text-align:center;
}
.filter_content .conte_filter input[type="text"]:focus, .filter_content .conte_filter input[type="number"]:focus,
.filter_content .conte_filter input[type="text"]:hover, .filter_content .conte_filter input[type="number"]:hover {
	border: 1px solid rgba(0,0,0,0.5);
	opacity:1;
}

.filter_content .conte_filter td {
	padding:0px;
	margin:0px;
	color:rgba(0,0,0,0.7);
}
.radiobtn {
	width:50%;
	display:flex;
}
.radiobtn input {
	display:none;
}
.radiobtn label {
	opacity: 0.5;
	text-align:center;
	display:block;
	padding:5px;
	width:100%;
	background-color:#f1f1f1;
	border:0.3px solid rgba(0,0,0,0.8);
	border-top:0px;
	transition:all 0.3s;
	cursor:pointer;
}
.radiobtn	input {
	display:none;
}
.radiobtn label:hover {
	opacity:1;
}
.radiobtn input:checked ~ label {
	color: #fff;
	background-color: #5562eb;
}
.conte{
	/*display:none;*/
	padding:10px; 
	font-weight:bold;
	font-weight:bold; 
	color:#333;
	line-height:30px;
	transition:all 0.3s;
}

/*  CONTENTS   */
.df2::before { 
    content: "";
    position: absolute;
}

.hf2::before {
	content: "";
    position: absolute;
}
.dp::before { 
    content: "Desde Periodo:";
    position: absolute;
}

.hp::before {
	content: "Hasta Periodo:";
    position: absolute;
}
.yr::before {
	content: "Año:";
    position: absolute;
}
.perI:before {
  content: "Periodo inicial:";
    position: absolute;
}
.perF:before {
  content: "Periodo final:";
    position: absolute;
}
.pf::before {
	content: "Periodo fin:";
    position: absolute;
}
/* DISPLAY */
.none {
	display:none;
}
/*  CHECKBOX AND RADIO */

.control-group {
  display: inline-block;
  width: 200px;
  height: 210px;
  margin: 10px;
  padding: 30px;
  text-align: left;
  vertical-align: top;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.1);
}
.flex-column .control {
    /* font-size: 18px; */
    position: relative;
    display: block;
    /* margin-bottom: 15px; */
    padding-left: 30px;
    cursor: pointer;
}
.flex-column > div.pais {
	display:flex;
}
.flex-column div.pais input {
	width:100%;
	padding:10px 10px;
	border: 1px solid rgba(0,0,0,0.3);
}
.flex-column div.pais .button {
    opacity: 0.5;
    background: white;
    font-size: 17px;
    border: 1px solid rgba(0,0,0,0.5);
    cursor: pointer;
    transition: all 0.3s;
    color: #333435;
}
.flex-column div.pais  .button:hover a {
    color: rgba(0, 126, 202,1);
}

.flex-column div.pais  .button a {
    text-decoration: none;
    padding: 10px;
    display: block;
    transition: all 0.5s;
}
.flex-column div.pais .infoboxPais {
	width:0px;
}
.flex-column div.pais .infoboxProvincia {
	width:0px;
}
.flex-column div.pais .infoboxPoblacion {
	width:0px;
}

.flex-column .more input {
    width: auto !important;
}

.color-green {
	color:#0C0;
}

.flex-column .control input {
  position: absolute;
  z-index: -1;
  opacity: 0;
}
.flex-column .control__indicator {
  position: absolute;
  top: 7px;
  left: 0;
  width: 15px;
  height: 15px;
  background: #e6e6e6;
}

.flex-column .control--radio .control__indicator {
  border-radius: 50%;
}
/* Hover and focus states */
.flex-column .control:hover input ~ .control__indicator,
.flex-column .control input:focus ~ .control__indicator {
  background: #ccc;
}

/* Checked state */
.flex-column .control input:checked ~ .control__indicator {
  background: #0088DA;
}
.flex-column .color-green input:checked ~ .control__indicator {
	background: #0C0 !important;
}

/* Hover state whilst checked */
.flex-column .control:hover input:not([disabled]):checked ~ .control__indicator,
.flex-column .control input:checked:focus ~ .control__indicator {
  background: #0e647d;
}

/* Disabled state */
.flex-column .control input:disabled ~ .control__indicator {
  pointer-events: none;
  opacity: .6;
  background: #e6e6e6;
}

/* Check mark */
.flex-column .control__indicator:after {
  position: absolute;
  display: none;
  content: '';
}

/* Show check mark */
.flex-column .control input:checked ~ .control__indicator:after {
  display: block;
}

/* Checkbox tick */
.flex-column .control--checkbox .control__indicator:after {
    top: 2px;
    left: 5px;
    width: 3px;
    height: 8px;
    transform: rotate(45deg);
    border: solid #fff;
    border-width: 0 2px 2px 0;
}

/* Disabled tick colour */
.flex-column .control--checkbox input:disabled ~ .control__indicator:after {
  border-color: #7b7b7b;
}

/* Radio button inner circle */
.flex-column .control--radio .control__indicator:after {
    top: 4px;
    left: 4px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #fff;
}

/* Disabled circle colour */
.flex-column .control--radio input:disabled ~ .control__indicator:after {
  background: #7b7b7b;
}


.flex-column {
    display: flex;
    justify-content: center;
    flex-direction: column;
}


/*  PARA OTRO ESTILO  */

.flex-column .otroradio input {
  position: absolute;
  z-index: -1;
  opacity: 0;
}
.flex-column .control__indicator {
  position: absolute;
  top: 7px;
  left: 0;
  width: 15px;
  height: 15px;
  background: #e6e6e6;
}

.flex-column .control--radio .control__indicator {
  border-radius: 50%;
}
/* Hover and focus states */
.flex-column .otroradio:hover input ~ .control .control__indicator,
.flex-column .otroradio input:focus ~ .control .control__indicator {
  background: #ccc;
}

/* Checked state */
.flex-column .otroradio input:checked ~ .control .control__indicator {
  background: #0088DA;
}
.flex-column .color-green input:checked ~ .control .control__indicator {
	background: #0C0 !important;
}

/* Hover state whilst checked */
.flex-column .otroradio:hover input:not([disabled]):checked ~ .control .control__indicator,
.flex-column .otroradio input:checked:focus ~ .control .control__indicator {
  background: #0e647d;
}

/* Disabled state */
.flex-column .otroradio input:disabled ~ .control .control__indicator {
  pointer-events: none;
  opacity: .6;
  background: #e6e6e6;
}

/* Check mark */
.flex-column .control__indicator:after {
  position: absolute;
  display: none;
  content: '';
}

/* Show check mark */
.flex-column .otroradio input:checked ~ .control .control__indicator:after {
  display: block;
}

/* Checkbox tick */
.flex-column .control--checkbox .control__indicator:after {
    top: 2px;
    left: 5px;
    width: 3px;
    height: 8px;
    transform: rotate(45deg);
    border: solid #fff;
    border-width: 0 2px 2px 0;
}

/* Disabled tick colour */
.flex-column .control--checkbox input:disabled ~ .control__indicator:after {
  border-color: #7b7b7b;
}
 /*  PARA OTRO ESTILO END  */


@media screen and (max-width: 720px)  {
.buscadorPrincipal {
	flex-wrap:wrap;
	position: relative;
}
.buscadorPrincipal .onlyphone{
	display:block;
}
.buscadorPrincipal .onlypc{
	display:none;
}
.buscadorPrincipal span {
	border-right:1px solid rgba(0,0,0,0.5);
}	
.buscadorPrincipal input {
    height: 40px;
    border-right: 0.3px solid rgba(0,0,0,0.5) !important;
    border-bottom: 0.3px solid rgba(0,0,0,0) !important;
	
}
.buscadorPrincipal input[type=date], .buscadorPrincipal input[type=month] {	
text-align: left;
}
.buscadorPrincipal select {
    border-right: 0.3px solid rgba(0,0,0,0.5) !important;
	border-bottom: 0.3px solid rgba(0,0,0,0) !important;
}
.buscadorPrincipal .button {
    width: 100%;
    text-align: center;
}
/*  CONTENTS   */
.df::before { 
    content: "Desde fecha";
    position: absolute;
    width: 100%;
	margin-left: -10px;
    text-align: center;
}

.hf::before {
	content: "Hasta fecha";
    position: absolute;
	width: 100%;
	margin-left: -10px;
    text-align: center;
}
.dp::before { 
    content: "Desde Periodo";
    position: absolute;
    width: 100%;
	margin-left: -10px;
    text-align: center;
}

.hp::before {
	content: "Hasta Periodo";
    position: absolute;
	width: 100%;
	margin-left: -10px;
    text-align: center;
}
.yr::before {
	content: "Año";
    position: absolute;
	margin-left: -10px;
}	
.pf::before {
	content: "Periodo fin";
    position: absolute;
	width: 100%;
	margin-left: -10px;
    text-align: center;
}
.none {
	display:none;
}
}