@import url('https://fonts.googleapis.com/css?family=Mukta:700');

body {
	font-family: Arial;
	font-size: 12px !important;
	color: #666;
	width: 100px;
	padding: 0;
	margin: 0;
	width: 100%;
	background-color: #f7f7f7;
}

a {
	text-decoration: none;
	color: #313d45;
}

a:hover {
	text-decoration: underline;
}

h1 {
	font-size: 22px;
	color: #2E3940;
}

h2 {
	font-size: 18px;
	color: #2E3940;
}

h3 {
	color: #2E3940;
	font-size: 14px;
	padding: 0;
	margin: 0;
}

#header,#content {
	width: 100%
}

#menu {
	width: 100%;
}

#menu td {
	width: 12%;
	height: 30px;
}

#tabs {
	width: 1200px;
}

.tableHeader {
	width: 100%;
	height: 40px;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 20px;
}

.userData {
	font-size: 14px;
}

.userData a {
	font-size: 12px;
	color: #999;
}

#main {
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 5px;
}

.errosMsg {
	color: red;
	font-size: 11px;
	font-style: italic;
}

#addContact,.delete,.inputButton {
	cursor: pointer;
}

.inputButton {
	outline: none;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border: 1px solid rgba(0, 0, 0, 0.2);
	background-color: #f5f3f3;
	padding: 3px;
	color: #000;
}

.borderBottom {
	border-bottom: 1px solid #CCC;
}

/*
=====
ACTIVIDADES POR CONFIRMAR - MODERNIZED
=====
*/

/* Encabezados de fecha modernizados */
.eventCalendar-currentTitle.titleDateAgenda {
	background: #2f4255 !important;
	color: #fff !important;
	padding: 5px !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	border-radius: 8px !important;
	margin: 8px 0 !important;
	box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
}

/* Filas de tareas modernizadas */
.pointerArrow {
	cursor: pointer;
	transition: all 0.3s ease;
	border-radius: 8px;
	margin-bottom: 4px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.pointerArrow:hover {
	background: #f8f9fa !important;
	box-shadow: 0 2px 8px rgba(0,0,0,0.15);
	transform: translateY(-1px);
}

/* Columna de tipo de tarea */
.pointerArrow td:first-child {
	background: #e3f2fd !important;
	color: #1565c0 !important;
	font-weight: 600 !important;
	font-size: 12px !important;
	padding: 12px 16px !important;
	border-radius: 8px 0 0 8px !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	border-right: 2px solid #fff !important;
}

/* Contenido de tarea */
.pointerArrow td:last-child {
	padding: 16px !important;
	border-radius: 0 8px 8px 0 !important;
	background: #fff !important;
	border-left: none !important;
}

/* Estilos para tareas especiales (términos) */
.termBack {
	background: linear-gradient(135deg, #fff3e0 0%, #ffe0b2 100%) !important;
	border-left: 3px solid #ff9800 !important;
}

/* Botones modernizados */
.myButtonGray {
	background: #2f4255 !important;
	color: #fff !important;
	border: none !important;
	padding: 8px 20px !important;
	border-radius: 6px !important;
	font-weight: 500 !important;
	font-size: 13px !important;
	cursor: pointer !important;
	transition: all 0.3s ease !important;
	box-shadow: 0 2px 4px rgba(47, 66, 85, 0.3) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
}

.myButtonGray:hover {
	background: #3a5168 !important;
	box-shadow: 0 3px 8px rgba(47, 66, 85, 0.4) !important;
	transform: translateY(-1px) !important;
}

.myButtonGray:active {
	transform: translateY(0) !important;
	box-shadow: 0 1px 3px rgba(47, 66, 85, 0.3) !important;
}

/* Enlaces a expedientes */
.pointerArrow a {
	color: #2f4255 !important;
	text-decoration: none !important;
	font-weight: 500 !important;
	font-size: 13px !important;
	padding: 6px 12px !important;
	border: 1px solid #2f4255 !important;
	border-radius: 6px !important;
	transition: all 0.3s ease !important;
	display: inline-block !important;
}

.pointerArrow a:hover {
	background: #2f4255 !important;
	color: #fff !important;
	text-decoration: none !important;
	transform: translateY(-1px) !important;
}

/* Información de la tarea */
.pointerArrow b {
	color: #2f4255 !important;
	font-weight: 600 !important;
}

/* Hora */
.pointerArrow div[style*="color: #999"] {
	color: #6c757d !important;
	font-size: 12px !important;
	font-weight: 500 !important;
}

/* Formularios de cierre */
.pointerArrow .form-row {
	background: #f8f9fa !important;
	border: 1px solid #e9ecef !important;
	border-radius: 8px !important;
	padding: 16px !important;
	margin-top: 12px !important;
	box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
}

.pointerArrow .form-control {
	border-radius: 6px !important;
	border: 1px solid #dee2e6 !important;
	font-size: 13px !important;
}

.pointerArrow .form-control:focus {
	border-color: #2f4255 !important;
	box-shadow: 0 0 0 0.2rem rgba(47, 66, 85, 0.25) !important;
}

/* Labels */
.pointerArrow label {
	color: #2f4255 !important;
	font-weight: 600 !important;
	font-size: 13px !important;
	margin-bottom: 4px !important;
}

/* Estados especiales */
.pointerArrow .cerrado {
	opacity: 0.6 !important;
	background: #f8f9fa !important;
}

.pointerArrow .cerrado td:first-child {
	background: #e9ecef !important;
	color: #6c757d !important;
}

/* Responsive */
@media (max-width: 768px) {
	.pointerArrow td:first-child,
	.pointerArrow td:last-child {
		padding: 8px !important;
		font-size: 12px !important;
	}
	
	.myButtonGray {
		padding: 6px 12px !important;
		font-size: 12px !important;
	}
}

.actorDemandado {
	border-bottom: 1px solid #ccc;
	padding: 3px;
}

.etapaTop {
	border-left: 2px solid #CCC;
	width: 16%;
	font-size: 10px;
}

.etapaBotton {
	border-bottom: 2px solid #CCC;
}


.tableTarea {
	font-weight: bold;
}

.tarea:hover {
	background-color: #f5f5f5;
}

.tituloFecha {
	background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0.2, #EEEEEE), color-stop(0.99, #CCCCCC) );
}

.audienciaAgenda {
	background-color: #ffc682;
}

.actividadAgenda {
	background-color: #e7e7e7;
}

.escritoAgenda {
	background-color: #b4f6bc;
}

.proveedorAgenda {
	background-color: #828eff;
}

.cerrado {
	text-decoration: line-through;
}

.etapaAcutal {
	background-image: url(../images/signEtapa.jpg);
	background-repeat: no-repeat;
}

.miniText {
	font-size: 10px;
	color: #666;
}

.tab table {
	width: 100%;
}

.tab table td {
	padding: 6px 10px 6px 0;
	vertical-align: top;
}

.tab dt {
	margin-top: 16px;
}

#table_agenda td {
	border-bottom: 1px solid #CCC;
	border-right: 1px solid #CCC;
}

.dateWithAppointment {
	font-weight: bold;
	background: #E4E4E4;
}

.gris {
	background-color: #f6f7f8;
}

.column:hover {
	background-color: #ffffdd;
}

.myButtonGray {
	-moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
	box-shadow: inset 0px 1px 0px 0px #ffffff;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9
		), color-stop(1, #e9e9e9));
	background: -moz-linear-gradient(center top, #f9f9f9 5%, #e9e9e9 100%);
	filter: progid:         DXImageTransform.Microsoft.gradient(      
		  startColorstr=    
		    '#f9f9f9', endColorstr=         '#e9e9e9');
	background-color: #f9f9f9;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	border: 1px solid #dcdcdc;
	display: inline-block;
	color: #666666;
	font-family: arial;
	font-size: 12px;
	font-weight: bold;
	padding: 4px 5px;
	text-decoration: none;
	text-shadow: 1px 1px 0px #ffffff;
}

.myButtonGray:hover {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e9e9e9
		), color-stop(1, #f9f9f9));
	background: -moz-linear-gradient(center top, #e9e9e9 5%, #f9f9f9 100%);
	filter: progid:         DXImageTransform.Microsoft.gradient(      
		  startColorstr=    
		    '#e9e9e9', endColorstr=         '#f9f9f9');
	background-color: #e9e9e9;
}

.myButtonGray:active {
	position: relative;
	top: 1px;
}

.bigConceptos {
	width: 220px;
}

.smallConceptos {
	width: 50px;
}

.verticalMenu .menuHeader {
	background: #1f272b;
	color: #FFF;
}

.verticalMenu li {
	width: 140px;
	background: #f8f6f6;
	list-style: none;
	padding: 5px;
	margin: 1px;
}

.verticalMenu li a {
	text-decoration: none;
}

.verticalMenu li:hover {
	-moz-box-shadow: 0px 0px 5px #999;
	-webkit-box-shadow: 0px 0px 5px #999;
	box-shadow: 0px 0px 5px #999;
}

.borderBottom {
	border-bottom: 1px solid #CCC;
}

.changedInput {
	border: 1px solid red;
}

.hidden {
	display: none;
}

.show {
	display: block;
}

.disabled {
	color: #A7A7A7;
}

#resultado_liga {
	color: #2E3940;
	float: right;
	font-size: 18px;
	font-weight: bold;
	height: 50px;
	line-height: 18px;
	margin-right: 30%;
	padding-top: 25px;
	position: relative;
	top: -54px;
	width: 525px;
}

#resultado_liga a {
	color: green;
	font-size: 20px;
}

.pad10 {
	padding-top: 5px;
}

.pad10b {
	padding-bottom: 10px;
}

.borderBottomG {
	border-bottom: 1px solid #999;
}

.inputW100 {
	width: 100px;
}

.inputCheckBox {
	width: 13px !important;
}

.noActiveDroppable {
	background: #ffca65;
	border: 1px solid #e7e5e5;
	height: 25px;
	width: 100%;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding-left: 5px;
	padding-top: 6px;
	padding-right: 10px;
	cursor: pointer;
}

.activeDroppable {
	background: #fddda0;
	border: 1px solid #b7b7b7;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

.droppableTR {
	cursor: move;
}

.floatRight {
	float: right;
}

.fatherFolder {
	background: #eceaea;
	border: 1px solid #e7e5e5;
	height: 25px;
	width: 100%;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding-left: 5px;
	padding-top: 10px;
	padding-right: 10px;
	cursor: pointer;
}

.subrayado {
	text-decoration: underline;
}

.emailContent input {
	width: 510px;
}

.emailContent textarea {
	width: 555px;
	height: 200px;
}

.emailContent td {
	padding-top: 5px;
}

.contactosEmail {
	display: none;
}

.addContactEmail {
	cursor: pointer;
}

.hiden {
	display: none;
}

.campo {
	border: 1px solid #CCC;
	padding: 10px;
	margin: 5px;
	cursor: pointer;
	background: #B0C8FF;
}

.divCampo {
	width: 190px;
}

.containerEditor {
	margin: 0 auto;
}

.field {
	border: 1px solid #CCC;
	padding: 10px;
	margin: 5px;
	cursor: pointer;
	width: 125px;
}

.tableSteps td{
	font-size: 14px;
	padding: 10px;
	color: #2E3940;
}
.gray{
	color: #999 !important;
}
.alreadyDrop{
	background: #BDDEC3;
}

.generalTable{
	width: 100%;
	padding-left: 40px;
	padding-right: 40px;
}

div#headerStick {
width: 100%;
background: #E8E6E6;
z-index: 100;
}

div#headerStick td{
font-size: 14px;
padding: 10px;
}

.verySmall{
	font-size: 1px;
}
.titleDateAgenda{
	font-weight: bold;
	color: #FFF;
	padding: 0;
}
#eventCalendarLocale .iconType{
	height: 25px;
	padding-left: 10px;
}
#eventCalendarLocale .responsable{
	float: right;
    padding-top: 5px;
    padding-right: 5px;
    font-size: 12px;
}

#eventCalendarLocale li{
	cursor: pointer;
}
.onlyMeBtn{
	float: right;
}
.devolucionTr{
	background-color: #FEE0B2;
}

.labelFromControl{
	font-size: 16px;
	font-weight: bold;
}
.form-control {
    box-shadow: 0 0 0 #000 !important;
    border-radius: 1px;
    display: block;
    width: 100%;
    height: 35px;
    font-size: 14px;
    line-height: 1.52857143;
    color: #3a3f51;
    background-color: #ffffff;
    background-image: none;
    border: 1px solid #dde6e9;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.text-center{
	text-align: center;
}
.text-left{
	text-align: left;
}
.text-right{
	text-align: right;
}
.evidenceSection{
	padding-top: 30px;
}
.evidenceSection a{
	font-size: 16px;
}
.btn{
	border-radius: 3px;
    font-size: 13px;
    border-color: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none !important;
    -webkit-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
        display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 6px 16px;
    font-size: 14px;
    line-height: 1.52857143;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	
}

.btn-primary {
    color: #fff;
    background-color: #303B43;
    border-color: #cccccc;
}
.col-md-12 {
    width: 100%;
  }
  .col-md-11 {
    width: 91.66666667%;
  }
  .col-md-10 {
    width: 83.33333333%;
  }
  .col-md-9 {
    width: 75%;
  }
  .col-md-8 {
    width: 66.66666667%;
  }
  .col-md-7 {
    width: 58.33333333%;
  }
  .col-md-6 {
    width: 50%;
  }
  .col-md-5 {
    width: 41.66666667%;
  }
  .col-md-4 {
    width: 33.33333333%;
  }
  .col-md-3 {
    width: 25%;
  }
  .col-md-2 {
    width: 16.66666667%;
  }
  .col-md-1 {
    width: 8.33333333%;
  }
  .cur-pointer{
	  cursor: pointer;
  }
  .loading1{
	  background: #00000029;
	  height: 95%;
	  width: 94%;
	  position: absolute;
  }
  .loading2{
	  height:100%;
	  display: flex;
	  align-items: center;
	  top: 0;
  }
  .loading3{
	  display: flex;
	  margin: 0 auto;
  }
  #ui-datepicker-div{
	  border: 1px solid #CCC !important;
  }
  .alert{
	  z-index: 900;
  }


/*
=====
EFFECT FADING OUT FOR SIBLINGS MENU OPTIONS
=====
*/


/*
=====
MENU STYLES - MODERNIZED
=====
*/

/* core styles */
.menu{
	background: #2f4255;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	border-radius: 0;
}

.menu__list{
	display: flex;
	text-align: center;
	padding-left: 0;
	margin-top: 0;
	margin-bottom: 0;
	list-style: none;
}

.menu__group{
	flex-grow: 1;
	border-right: 1px solid rgba(255, 255, 255, 0.1);
	transition: all 0.3s ease;
	position: relative;
}

.menu__group:last-child {
	border-right: none;
}

.menu__link{
	display: block;
	padding: 10px 5px;
	font-weight: 500;
	font-size: 13px;
	color: rgba(255, 255, 255, 0.9);
	text-decoration: none;
	transition: all 0.3s ease;
	position: relative;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

/* Modern hover effects */
.menu__group:hover {
	background: rgba(255, 255, 255, 0.05);
}

.menu__link:hover{
	color: #fff;
	text-decoration: none;
	background: rgba(255, 255, 255, 0.08);
}

/* Active state */
.menu__link.active,
.menu__link:focus{
	color: #fff;
	background: rgba(255, 255, 255, 0.12);
	outline: none;
}

/* Modern underline animation */
.menu__link::before{
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 2px;
	background: #fff;
	transition: width 0.3s ease;
}

.menu__link:hover::before,
.menu__link.active::before{
	width: 80%;
}

/* Responsive adjustments */
@media (max-width: 1200px) {
	.menu__link {
		padding: 12px 12px;
		font-size: 12px;
	}
}

@media (max-width: 768px) {
	.menu__list {
		flex-wrap: wrap;
	}
	
	.menu__group {
		flex: 1 1 25%;
		border-right: none;
		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	}
	
	.menu__link {
		padding: 10px 8px;
		font-size: 11px;
	}
}

.page{
	box-sizing: border-box;
	max-width: 640px;
	width: 100%;
	padding-left: 1rem;
	padding-right: 1rem;

	order: 1;
	margin: auto;
}

button.btn.dropdown-toggle.btn-light {
	border-color: #ced4da !important;
	background: none !important;
	line-height: 1.1 !important;
	border: 1px solid #ced4da !important;
}

.btn-outline-secondary{
	border-color: #cccccc !important;
}
.btn-special{
	padding: 3px 3px !important;
	font-size: 12px !important;
}
.mt5{
	margin-top: 5px;
}
.dropdown.bootstrap-select.show-tick{
	width: 100% !important;
}
.fz16{
	font-size: 16px;
}
.minW125{
	min-width: 125px;
}

.stickyMenu{
	width: 100px;
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	left: 0;
	float: left;
	font-size: 40px;
	background: #FFF;
	border: 1px solid #CCC;
	border-radius: 0px 20px 20px 0px;
}

.stickyMenu ul{
	padding-left: 0;
}

.stickyMenu ul li{
	list-style: none;
}
.styledButtonTab{
	background-color: #e5e5e5;
	padding: 10px;
	font-size: 14px;
	font-weight: normal;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	margin-right: 15px;
	border: 1px solid #b7b7b7;
}
.styledButtonTab.active, .styledButtonTab:hover{
	background-color: #fdfdfd;
	text-decoration: none;
}
.bg-success-e{
	background-color: #d4edda;
}
.bg-danger-e{
	background-color: #f8d7da;
}