@charset "utf-8";

/* CSS Document */



@font-face {

	font-family: 'iconos';

	src:url('../fonts/icomoon.eot?-ei75am');

	src:url('../fonts/icomoon.eot?#iefix-ei75am') format('embedded-opentype'),

		url('../fonts/icomoon.woff?-ei75am') format('woff'),

		url('../fonts/icomoon.ttf?-ei75am') format('truetype'),

		url('../fonts/icomoon.svg?-ei75am#icomoon') format('svg');

	font-weight: normal;

	font-style: normal;

}



/*-- Estilo Notificaciones Login ---*/

.msje_log {

	float: left;

	display: table;

	background: #F3F3F3;

	border-radius: 1em;

	border: 2px solid #FF5722;

	height: 104px;

	margin: 30px 0 30px 0;

	position: relative;

	text-align: center;

	width: 320px;

}

.msje_log span {

	color: #FF5722;

	display: block;

	font-size: 13px;

	padding: 36px 0 36px 0;

}

.msje_log:before, .msje_log:after {

  z-index: -1;

  position: absolute;

  content: "";

  bottom: 15px;

  left: 10px;

  width: 50%;

  top: 80%;

  max-width:300px;

  background: #777;

  -webkit-box-shadow: 0 15px 10px #777;

  -moz-box-shadow: 0 15px 10px #777;

  box-shadow: 0 15px 10px #777;

  -webkit-transform: rotate(-3deg);

  -moz-transform: rotate(-3deg);

  -o-transform: rotate(-3deg);

  -ms-transform: rotate(-3deg);

  transform: rotate(-3deg);

}

.msje_log:after {

  -webkit-transform: rotate(3deg);

  -moz-transform: rotate(3deg);

  -o-transform: rotate(3deg);

  -ms-transform: rotate(3deg);

  transform: rotate(3deg);

  right: 10px;

  left: auto;

}

.cont-icon {

	background: #FF5722;

	border-radius: 8px 0 0 8px;

	color: white;

	float: left;

	font-size: 45px;

	padding: 26px 0 26px 0;

	position: relative;

	width: 80px;

}

.pulse {

	-webkit-animation: pulse 1s linear infinite;

	-moz-animation: pulse 1s linear infinite;

	-ms-animation: pulse 1s linear infinite;

	animation: pulse 1s linear infinite;

}



@keyframes "pulse" {

 0% {

    -webkit-transform: scale(1.1);

   	-moz-transform: scale(1.1);

   	-o-transform: scale(1.1);

   	-ms-transform: scale(1.1);

   	transform: scale(1.1);

 }

 50% {

    -webkit-transform: scale(0.8);

   	-moz-transform: scale(0.8);

   	-o-transform: scale(0.8);

   	-ms-transform: scale(0.8);

   	transform: scale(0.8);

 }

 100% {

    -webkit-transform: scale(1);

   	-moz-transform: scale(1);

   	-o-transform: scale(1);

   	-ms-transform: scale(1);

   	transform: scale(1);

 }



}



@-moz-keyframes pulse {

 0% {

   -moz-transform: scale(1.1);

   transform: scale(1.1);

 }

 50% {

   -moz-transform: scale(0.8);

   transform: scale(0.8);

 }

 100% {

   -moz-transform: scale(1);

   transform: scale(1);

 }



}



@-webkit-keyframes "pulse" {

 0% {

   -webkit-transform: scale(1.1);

   transform: scale(1.1);

 }

 50% {

   -webkit-transform: scale(0.8);

   transform: scale(0.8);

 }

 100% {

   -webkit-transform: scale(1);

   transform: scale(1);

 }



}



@-ms-keyframes "pulse" {

 0% {

   -ms-transform: scale(1.1);

   transform: scale(1.1);

 }

 50% {

   -ms-transform: scale(0.8);

   transform: scale(0.8);

 }

 100% {

   -ms-transform: scale(1);

   transform: scale(1);

 }



}

/*-- Estilo Notificaciones Login ---*/

.dialog {

	background-color: #F3F3F3;

	border-radius: 8px;

	height: 55px;

	margin: 10px 0 20px 0;

	position:relative;

	width:100%;

}

.ok-dialog {

	border-radius: 6px 0 0 6px;

	float: left;

	width: 50px;

	font-size:30px;

	padding: 10px 0 11px 0;

	margin-right:10px;

	background-color: #CCCC52;

	color: #FFF;

	text-align: center;

}



.col-msj{

	color: #4b5468;

}



/*---- Estilo Checkbox ----*/

.formulario-agr label.check {

	position: relative;

	padding-left: 19px;

	width: 185px;

	float: left;

	color: #999999;

	font-size: 12px;

	text-transform: uppercase;

	cursor: pointer;

	-webkit-transition: color 0.3s;

	transition: color 0.3s;

}

.formulario-agr label.check:before, .formulario-agr label.check:after {

	font-family: FontAwesome;

	font-size: 18px;

	/*absolutely positioned*/

	position: absolute; top: 0; left: 0;

}

.formulario-agr label.check:before {

	content: '\f096'; /*unchecked*/

}

.formulario-agr label.check:after {

	content: '\f14a'; /*checked*/

	/*checked icon will be hidden by default by using 0 max-width and overflow hidden*/

	max-width: 0;

	overflow: hidden;

	opacity: 0.5;

	/*CSS3 transitions for animated effect*/

	transition: all 0.35s;

}



/*hiding the original checkboxes*/

.formulario-agr input[type="checkbox"] {

	display: none;

}



/*when the user checks the checkbox the checked icon will animate in*/

.formulario-agr input[type="checkbox"]:checked + label.check:after {

	max-width: 25px; /*an arbitratry number more than the icon's width*/

	opacity: 1; /*for fade in effect*/

}



.formulario-agr input[type="checkbox"]:checked + label.check {

	color: #006699;

}



/*adding some colors for fun*/

.formulario-agr label.check:before{

	color: #006699;

}



.formulario-agr label.check:after {

	color: #006699;

}

/*---- Fin Estilo Checkbox ----*/





/*---- Estilo Select ----*/

select.sel-filtro {

    padding:7px;

    margin: 0;

    -webkit-border-radius:4px;

    -moz-border-radius:4px;

    border-radius:4px;

    -webkit-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;

    -moz-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;

    box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;

    background: #f8f8f8;

    color:#069;

    border:none;

    outline:none;

    display: inline-block;

    -webkit-appearance:none;

    -moz-appearance:none;

    appearance:none;

    cursor:pointer;

	width: 100%;

}



/* Targetting Webkit browsers only. FF will show the dropdown arrow with so much padding. */

@media screen and (-webkit-min-device-pixel-ratio:0) {

    select.sel-filtro {padding-right:18px}

}



label.selector {position:relative}

label.selector:after {

    content: '<>';

	font: 13px "Consolas", monospace;

	color: #069;

	-webkit-transform: rotate(90deg);

	-moz-transform: rotate(90deg);

	-ms-transform: rotate(90deg);

	transform: rotate(90deg);

	right: 8px;

	top: 8px;

	padding: 0 0 2px;

	border-bottom: 1px solid #ddd;

	position: absolute;

	pointer-events: none;

}

label.selector:before {

    content:'';

    right:6px;

	top:2px;

    width:20px; height:20px;

    background:#f8f8f8;

    position:absolute;

    pointer-events:none;

    display:block;

}

/*---- Fin Estilo Select ----*/





/*---- ICONOS OPCIONES ----*/

.icon-pencil:before {

    content: "\e600";

	font-family: 'iconos';

	font-size: 16px;

}

.icon-pencil:hover {

    color: #006699;

}



.fa-eye:hover {

    color: #006699;

}



.icon-trash:before {

    content: "\e601";

	font-family: 'iconos';

}

.icon-trash:hover {

    color: #FF5722;

}

.icon-speedometer:before {

    content: "\e051";

	font-family: 'iconos';

}

.icon-speedometer:hover {

    color: #FF5722;

}

.icon-mic:before {

    content: "\e03a";

	font-family: 'iconos';

}

.icon-mic:hover {

    color: #2E7D32;

}

.icon-megaphone:before {

    content: "\e021";

	font-family: 'iconos';

}

.icon-megaphone:hover {

    color: #2E7D32;

}

/*---- FIN ICONOS OPCIONES ----*/



a {

  color: #2E7D32;

}



li {

	list-style-type: none;

}



.forms {

	background: #cddc39;

	border: 0;

	color: #fff;

	cursor: pointer;

	float: right;

	font-style: italic;

	padding: 0.2em 1.5em;

	margin-bottom: 30px;

	text-decoration: none;

	text-shadow: 1px 1px 0px #6B7315;



	-moz-transition: all 0.35s ease-in-out;

	-webkit-transition: all 0.35s ease-in-out;

	-o-transition: all 0.35s ease-in-out;

	-ms-transition: all 0.35s ease-in-out;

	transition: all 0.35s ease-in-out;



}



.forms:hover{

	color: #1B5E20;

  	text-shadow: 1px 1px 0px #FFFFFF;

}



body {

  	background: #e8e8e8;

  	color: #444;

  	font-family: Arial;

  	font-size: 16px;

}



footer {

  	background: #444;

	bottom: 0;

  	font-size: 20px;

	font-weight: lighter;

	float: left;

	margin-top: 30px;

	padding: 1em 0;

	text-align: center;

	text-shadow: 1px 1px 0px #000000;

  	width: 100%;

}



footer h3 {

	color: white;

  	font-size: 14px;

  	font-weight: normal;

}

footer h3 strong {

  display: block;

}



footer h3 .mejor:before,

footer h3 .mejor:after {

  content: " - ";

}





header {

  background: #444;

  box-shadow: 0 5px 0 rgba(0,0,0,0.2);

  color: #fff;

  overflow: hidden;

  padding: 1em;

  position: relative;

  z-index: 2;

}



.head-container-login {

	margin: 0 auto;

	position: relative;

	width: 900px;

}



.head-container-login h1 {

	font-size: 20px;

	position: relative;

	text-align: center;

	text-shadow: 1px 1px 0px #000000;

	font-weight: lighter;

}



.head-container {

	margin: 0 auto;

	position: relative;

	width: 900px;

}



.head-container .logo {

	border-right: 1px solid #707070;

	float: left;

	width: 105px;

}



.head-container .logo img {

	float: left;

  	width: 95px;

}



.head-container .titular {

  margin: 0 55px 0 115px;

}



.head-container .titular .filtro {

  color: #22bce0;

  font-size: 14px;

  font-style: italic;

  font-weight: bold;

  text-decoration: none;

}



.head-container .titular .configuracion {

  background: #cddc39;

  color: #fff;

  float: left;

  font-style: italic;

  padding: 0.2em 0.5em;

  text-decoration: none;

  text-shadow: 1px 1px 0px #6B7315;



	-moz-transition: all 0.35s ease-in-out;

	-webkit-transition: all 0.35s ease-in-out;

	-o-transition: all 0.35s ease-in-out;

	-ms-transition: all 0.35s ease-in-out;

	transition: all 0.35s ease-in-out;

}



.head-container .titular .configuracion:hover {

  color: #1B5E20;

  text-shadow: 1px 1px 0px #FFFFFF;

}



.head-container .titular .publicar {

  background: #cddc39;

  color: #fff;

  float: right;

  font-style: italic;

  margin-right: -5px;

  padding: 0.2em 1.5em;

  text-decoration: none;

  text-shadow: 1px 1px 0px #6B7315;



	-moz-transition: all 0.35s ease-in-out;

	-webkit-transition: all 0.35s ease-in-out;

	-o-transition: all 0.35s ease-in-out;

	-ms-transition: all 0.35s ease-in-out;

	transition: all 0.35s ease-in-out;

}



.head-container .titular .publicar:hover {

  color: #1B5E20;

  text-shadow: 1px 1px 0px #FFFFFF;

}



.head-container .titular .titulo {

  font-size: 16px;

  font-weight: normal;

  margin: 0;

  padding: 0;

}



.head-container .usuario {

  position: absolute;

  right: 10px;

  top: 0;

}



.head-container .usuario .avatar {

  margin: 0;

  position: relative;

  z-index: 69;

}



.head-container .usuario .avatar img {

  border-radius: 50%;

  width: 50px;

}



.head-container .usuario .flechita {

  background: #dd4f24;

  color: #fff;

  display: block;

  padding: 2px;

  position: absolute;

  right: 0;

  text-align: right;

  text-decoration: none;

  top: 15px;

  width: 50%;

  z-index: 0;

}



.head-container .usuario .flechita:after {

  content: "\e602";

  display: block;

  font-family: "iconitos";

  margin: 1px 0 0 1px;

  text-shadow: 1px 1px 0px #000;

}



nav.menu {

  background: #069;

  border-left: 5px solid #e8e8e8;

  border-right: 5px solid #e8e8e8;

  margin-bottom: 2em;

  position: relative;

}



nav.menu:before {

  border-bottom: 20px solid transparent;

  border-left: 7px solid #e8e8e8;

  border-top: 20px solid transparent;

  content: "";

  left: 0px;

  position: absolute;

  top: 0;

}



nav.menu:after {

  border-bottom: 20px solid transparent;

  border-right: 7px solid #e8e8e8;

  border-top: 20px solid transparent;

  content: "";

  right: 0px;

  position: absolute;

  top: 0;

}



nav.menu .menu-lista {

  height: 40px;

  line-height: 40px;

  margin: 0;

  padding: 0;

  overflow-x: auto;

  text-align: center;

  white-space: nowrap;

}



nav.menu .menu-lista::-webkit-scrollbar {

  display: none;

}



nav.menu .menu-lista li {

  display: inline-block;

}



nav.menu .menu-lista li a {

  color: #fff;

  display: block;

  margin: 0 0.5em;

  padding: 0 0.2em;

  text-decoration: none;



	-moz-transition: all 0.35s ease-in-out;

	-webkit-transition: all 0.35s ease-in-out;

	-o-transition: all 0.35s ease-in-out;

	-ms-transition: all 0.35s ease-in-out;

	transition: all 0.35s ease-in-out;

}



nav.menu .menu-lista li a:hover {

  background: rgba(0,0,0,0.1);

}



nav.menu .menu-lista li a:hover {

  background: rgba(0,0,0,0.1);

}



.active {

  background: rgba(0,0,0,0.2);

}



.sub-menu li:hover {

	background: rgba(0,0,0,0.2);

}



#container-login{

	max-width: 320px;

	margin: 0 auto;

	position: relative;

}



.logo-login {

	width:220px;

	margin:0 auto;

}



.logo-login img {

	margin-top:30px

}



.login {

	background: rgba(38,50,56 ,1);

	border-radius: 1em;

	height: 380px;

	position: relative;

	width: 100%;

}



.login img {

	position: relative;

	width: 150px;

}



.header{

	background: #CDDC39;

	border-radius: 0.5em 0.5em;

	height: 60px;

	position: relative;

	width: 100%;

}



.header h1{

	color: white;

	padding-top: 15px;

	text-align: center;

	font-size: 24px;

}



.form-login{

	height: 200px;

	margin-top: 30px;

	width: 100%;

}



.form-login label {

	color: #cddc39;

	float: left;

	margin-bottom: 5px;

	padding-left: 1.5em;

	width: 100%;

}



.form-login input[type='text'], input[type='password']  {

	border: 0;

	border-radius: 2px;

	float: left;

	margin: 0 0 1.5em 1.5em;

	outline: 0;

	padding: 10px;

	width: 80%;

}



.olvido-pass {

	position: relative;

	margin: 0 auto;

	width: 150px;

}



.olvido-pass a {

	font-size: 12px;

	position: relative;

	text-align: center;

	text-decoration: none;

}



.animate

{

	transition: all 0.1s;

	-webkit-transition: all 0.1s;

}



.action-button {

	border: 0;

	border-radius: 2px;

	color: #FFF;

	float: left;

	font-size: 20px;

	height: 39px;

	margin: 0 0 1.5em 1.2em;

	outline: 0;

	position: relative;

	text-decoration: none;

	width: 86%;

}

.green {
	background-color: #cddc39;
	border-bottom: 5px solid #669644;
}

.action-button:active {
	transform: translate(0px,5px);
  	-webkit-transform: translate(0px,5px);

}

#main-container{
	margin: 0 auto;
	min-height: 400px;
	position: relative;
	width: 1020px;
}

/*---- CAMPAÑAS ----*/
.titulo-pagina, .sub-titulo-pagina {
	float: left;
	position: relative;
	width: 100%;
}

.titulo-pagina h3 {
	color: #069;
	display: inline-block;
	font-size: 20px;
	font-weight: lighter;
	margin: 0 0 10px;
	padding-top: 8px;
	width: 50%;
}

.titulo-pagina a {
	background: #cddc39;
	color: #fff;
	float: right;
	font-style: italic;
	padding: 0.2em 0.5em;
	text-decoration: none;

	text-shadow: 1px 1px 0px #6B7315;



	-moz-transition: all 0.35s ease-in-out;

	-webkit-transition: all 0.35s ease-in-out;

	-o-transition: all 0.35s ease-in-out;

	-ms-transition: all 0.35s ease-in-out;

	transition: all 0.35s ease-in-out;

}



.titulo-pagina a:hover {

	color: #1B5E20;

	text-shadow: 1px 1px 0px #FFFFFF;

}



.border {

	border-bottom: 2px solid #CCCCCC;

	display: block;

	margin-bottom: 10px;

	width: 100%;

}



.sub-titulo-pagina h3 {

	color: #069;

	display: inline-block;

	font-size: 16px;

	font-weight: lighter;

	margin: 0 0 10px;

	padding-top: 8px;

	width: 50%;

}





/*---- AGREGAR CAMPAÑA -----*/



.formulario-agr {

	position: relative;

	float: left;

	width: 100%;

}



.list-input {

	position: relative;

	margin: 0;

	padding: 0;

	overflow-x: auto;

	/*white-space: nowrap;	*/

}



.list-input.full li {

	padding-right: 0px;

	width: 100%;

}



.list-input.full li:last.child {

	padding-bottom: 0px;

}



.list-input.full textarea {

	border: none;

	outline: none;

	padding: 0;

	resize: none;

	width: 100%;

}



.list-input li {

	display: inline-block;

	padding: 0 2em 2em 0;

	position: relative;

	width: 260px;

}



.list-input li:nth-child(3n+3) {

	padding: 0 0 2em 0;

}



.list-input li label {

	color: #069;

	float: left;

	padding-bottom: 0.5em;

	width: 100%;

}



.list-input li input {

	border: 0;

	border-radius: 2px;

	float: left;

	outline: 0;

	padding: 0.5em 0 0.5em 0;

	position: relative;

	width: 100%;

}



fieldset {

    font-family: sans-serif;

    border: 3px solid #006699;

    background: #ddd;

    border-radius: 3px;

	margin-bottom: 20px;

    padding: 15px;

}



fieldset legend {

    background: #006699;

    color: #fff;

    padding: 5px 10px ;

    font-size: 25px;

    border-radius: 3px;

    box-shadow: 0 0 0 5px #ddd;

    margin-left: 20px;

}



fieldset h3 {

	color: #006699;

}



.box-radios {

	background: #e8e8e8;

	border-radius: 3px;

	float: left;

	height: auto;

	margin-bottom: 10px;

	min-height: 100px;

	padding: 1em;

	width: 96%;



	-moz-box-shadow: inset 0 0 10px #ccc;

	-webkit-box-shadow: inset 0 0 10px #ccc;

	box-shadow: inset 0 0 10px #ccc;

}



.leyenda {

	float: left;

	height: 50px;

	position: relative;

	text-align: center;

	width: 100%;

}



.leyenda p {

	color: #006699;

	font-size: 16px;

	font-style: italic;

	position: relative;

}



/*--- Estilo Selectable Draggable ----*/



#selectable .ui-selecting {

    background: #cddc39;

}



#selectable .ui-selected {

    background: #006699;

    color: white;

}



#selectable {

	height: auto;

    margin: 0;

	min-height: 100px;

    padding: 0;

    position: relative;

	font-size:10px;

}



#selectable > div {cursor:move}

#droppable > div {cursor:pointer}



#selectable > div, #droppable > div{

	background: white;

	border:solid 1px #CCC;

    display: inline-block;

    padding:10px;

	text-align: center;

    width: 100px;

}



.ui-selectable-helper{

    position: absolute;

    z-index: 100;

    border:1px dotted black;

}



#droppable{

	border: 2px dashed #006699;

	border-radius: 3px;

	float: left;

	height: auto;

	margin-bottom: 30px;

	min-height: 100px;

	padding: 1em;

	width: 96%;

}



.ui-state-highlight {

	background: rgba(205, 220, 57, 0.9);

}



/*--- Fin Estilo Selectable Draggable ----*/



/*--- AGREGAR CONCESIONES ---*/



.autocomplete {

	display: inline-block;

	margin-bottom: 30px;

	position: relative;

	width: 100%;

}



.autocomplete label {

	color: #069;

	float: left;

	padding: 0 0 0.5em 0;

	position: relative;

	width: 100%;

}



.autocomplete input[type="text"] {

	border: 0;

	border-radius: 2px;

	float: left;

	outline: 0;

	padding: 0.5em 0 0.5em 0;

	width: 260px;

}



#info-socio, #info-socio-comercial {

	position: relative;

	float: left;

	width: 96%;

	height: 60px;

	/* background: rgba(153, 165, 190, 0.06); */

	margin-bottom: 30px;

	/* border: 2px solid rgba(75, 84, 104, 0.49); */

    border: 3px solid #006699;

    background: #ddd;

    border-radius: 3px;

    padding: 15px;

}



#info-socio ul, #info-socio-comercial ul {

	position: relative;

	float: left;

	width: 100%;

	margin-top: 20px;

	padding: 0;

	text-align: center;

}



#info-socio ul li, #info-socio-comercial ul li {

	color: #808D00;

	font-weight: bold;

	position: relative;

	display: inline-block;

	width: auto;

	margin-left: 15px;

}



/*#info-socio {

	position: relative;

	float: left;

	width: 96%;

	height: 60px;

	margin-bottom: 30px;

    border: 3px solid #006699;

    background: #ddd;

    border-radius: 3px;

    padding: 15px;

}



#info-socio ul {

	position: relative;

	float: left;

	width: 100%;

	margin-top: 20px;

	padding: 0;

	text-align: center;

}



#info-socio ul li {

	color: #808D00;

	font-weight: bold;

	position: relative;

	display: inline-block;

	width: auto;

	margin-left: 15px;

}*/



#señalexiste, #loginexiste, #rutexiste {

	color: #FF5722;

	display: none;

	left: 3px;

	position: absolute;

	top: 34px;

}



.btn-ag{

		padding: 7px;

		margin: 0;

		-webkit-border-radius: 4px;

		-moz-border-radius: 4px;

		border-radius: 4px;

		-webkit-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;

		-moz-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;

		box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;

		background: #f8f8f8;

		color: #069;

		border: none;

		outline: none;

		display: inline-block;

		-webkit-appearance: none;

		-moz-appearance: none;

		appearance: none;

		cursor: pointer;

		border:solid 1px;

}



/* FORMULARIO DESCRIPCION O FORMATO RADIAL */

.formulario-agr input[type="checkbox"] {

	display: inline-block !important;

}

.inline-input {

	float: none !important;

	padding: 0 !important;

	text-align: center;

	width: 35px !important;

}

.inline-input.number {

	width: 60px !important;

}

.full-width {

	float: left;

	position:  relative;

	width: 100%;

}

.table {

	width: 100%;

	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);

	display: table;

}

.table.auto {

	width: auto;

}

@media screen and (max-width: 580px) {

	.table {

		display: block;

	}

}

.row-table {

	display: table-row;

	background: #f6f6f6;

}

.row-table:nth-of-type(odd) {

	background: #e9e9e9;

}

.row-table.header-table {

	font-weight: 600;

	color: #ffffff;

	background: #006699;

}

@media screen and (max-width: 580px) {

  .row-table {

		padding: 8px 0;

		display: block;

  }

}

.cell {

	padding: 6px 12px;

	display: table-cell;

}

.cell.center {

	text-align: center;

}

.cell input[type="time"] {

	margin-right: 15px;

	padding: 0px;

	width: 80px;

}

}

@media screen and (max-width: 580px) {

	.cell {

		padding: 2px 12px;

		display: block;

	}

}

.option-input {

	-webkit-appearance: none;

	-moz-appearance: none;

	-ms-appearance: none;

	-o-appearance: none;

	appearance: none;

	position: relative;

	height: 25px;

	width: 25px !important;

	-webkit-transition: all 0.15s ease-out 0s;

	-moz-transition: all 0.15s ease-out 0s;

	transition: all 0.15s ease-out 0s;

	background: #cbd1d8;

	border: none;

	color: #fff;

	cursor: pointer;

	float: none !important;

	/*display: inline-block !important;*/

	margin-right: 0.5rem;

	outline: none;

	position: relative;

	z-index: 1000;

}

.option-input:hover {

  	background: #9faab7;

}

.option-input:checked {

  	background: #CDDC39;

}

.option-input:checked::before {

	  height: 25px;

	  width: 25px;

	  position: absolute;

	  content: '\2716';

	  display: inline-block;

	  font-size: 17px;

	  text-align: center;

	  line-height: 12px;

}

.option-input:checked::after {

	  -webkit-animation: click-wave 0.65s;

	  -moz-animation: click-wave 0.65s;

	  animation: click-wave 0.65s;

	  background: #CDDC39;

	  content: '';

	  display: block;

	  position: relative;

	  z-index: 100;

}

.option-input.radio {

  	border-radius: 50%;

}

.option-input.radio::after {

  	border-radius: 50%;

}

.cont-radio {

	float: left;

	padding-right: 15px;

	position: relative;

}

.cont-radio span {

	float: left;

	padding-right: 5px;

	padding-top: 4px;

	position: relative;

}

.in-label {
	margin-top: 15px;
}

.duracion {

	width: 80px !important;

	padding: 3px !important;

}

/* FIN FORMULARIO DESCRIPCION O FORMATO RADIAL */
/* Clase que tendra el tooltip */
.modToolTip {
    position: relative; /* Esta clase tiene que tener posicion relativa */
    color: #ff8c00; /* Color del texto */
}

/* El tooltip */
.modToolTip span {
    background: rgba(20,20,20,0.9) url('img/info.gif') center left 5px no-repeat;
    border: 2px solid #87cefa;
    border-radius: 5px;
    box-shadow: 5px 5px 5px #333;
    color: #87cefa;
    display: none; /* El tooltip por defecto estara oculto */
    font-size: 0.8em;
    padding: 10px 10px 10px 35px;
    max-width: 6000px;
    position: absolute;
    top: 15px;
    /* left: 100px;  */
		left: -78px;
    z-index: 100;
}

/* El tooltip cuando se muestra */
.modToolTip:hover span {
    display: inline; /* Para mostrarlo simplemente usamos display block por ejemplo */
}