html, body {
    margin: 0;
    padding: 0;
    background-color: #ffffff;
}
templates,
partials {
     display: none;
}
.navfooter {
     height: 75px;
}
.navfooter > .row {
     position: fixed;
     bottom: 0px;
     background-color: rgba(200,200,200,0.8);
     border-top: 1px solid #dddddd;
     padding-left: 1em;
     padding-top: 1em;
     padding-bottom: 1em;
     width: 100%;
}
.navfooter button {
     background-color: white;
}
.hiddenfile {
     width: 0px;
     height: 0px;
     overflow: hidden;
}
.overlay {
    background-color: rgba(255,255,255,0.5);
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 100vh;
    z-index: 10000;
    display: none;
}
.clear {
    clear:both;
}
.filtro {
     margin: 1em;
     font-size: 0.9em;
}
.rolProfesor {
     display: none;
}
.clanID {
     border: 1px solid #666666;
     -webkit-border-radius: 15px;
     -moz-border-radius: 15px;
     border-radius: 15px;
     background-color: #eeeeee;
     padding: 1em;
}
.userAnon {
	color: #aaaaaa;
	font-style: italic;
}
.userAnon .z {
	display: none;
}

/* NAVBAR */
.wrapper {
    display: flex;
    width: 100%;
    align-items: stretch;
}
#appcontent {
    padding: 1em;
}
#appcontent > h1 {
    font-size: 1.8em;
    font-weight: bold;
    margin-bottom: 1em;
    border-bottom: 1px solid #aaa;
}

#sidebar {
    min-width: 250px;
    max-width: 250px;
    min-height: 100vh;
    margin-right: 1em;
    background-color: #385265;
    -webkit-box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.75);
    border-right: 2px solid #3d505e; //385297;
}
.sidebar-header {
    min-width: 250px;
    max-width: 250px;
    text-align: center;
    padding: 1em;
}
.sidebar-content {
    padding: 1em;
}
.sidebar-content .userInfo {
     font-size: 0.9em;
     color: #aaa;
     padding: 0.5em;
     border: 1px solid #aaa;
     -webkit-border-radius: 15px;
     -moz-border-radius: 15px;
     border-radius: 15px;
     text-align: center;
}
.sidebar-content h2 {
     font-size: 1em;
     font-weight: bold;
     background-color: #385265;
     padding: 0.5em;
     color: #eeeeee;
     margin-left: -1em;
     margin-right: -1em;
     border-bottom: 1px solid #eeeeee;
     text-transform:capitalize;
     font-variant:small-caps;
}
.sidebar-content .group > ul {
     display: none;
}
.sidebar-content .group > a {
     text-decoration: none;
}
.sidebar-content .group > a::after {
     content: "";
     border: solid white;
     border-width: 0 3px 3px 0;
     display: inline-block;
     padding: 3px;
     margin-left: 3px;
     transform: rotate(-45deg);
     -webkit-transform: rotate(-45deg);
}
.sidebar-content .group {
     display: block;
     margin: 0px;
     padding: 0px;
     width: 100%;
}
.sidebar-content .group ul a {
     background-color: #385265;
     display: block;
     margin-left: 0px !important;
}
#sidebar li {
     cursor: pointer;
}
#sidebar.active {
    margin-left: -250px;
}

#listado tbody tr {
     cursor: pointer;
}
#listado tbody tr:hover {
     background-color: #eeeeff;
}
.pregunta.card {
     margin-bottom: 1em;
}

#addPart {
     font-weight: bold;
     font-size: 24px;
     line-height: 1em;
     color: black;
}

a[data-toggle="collapse"] {
    position: relative;
}

.dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}

@media (max-width: 768px) {
    #sidebar {
        margin-left: -250px;
    }
    #sidebar.active {
        margin-left: 0;
    }
}

#sidebar ul p {
    color: #fff;
    padding: 10px;
}

#sidebar ul li a {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    padding-left: 1em;
    padding-right: 1em;
    margin-left: -1em;
    margin-right: -1em;
    font-size: 1.1em;
    display: block;
    color: #fff;
}
#sidebar ul li a:hover {
    color: #ffffff;
    background: #095bb1;
}

.subtitle {
     border-bottom: 1px solid #aaa;
     margin-top: 1em;
     margin-bottom: 2em;
     margin-left: -1em;
     margin-right: -1em;
     padding-left: 1em;
}
#sidebar ul li.active > a, a[aria-expanded="true"] {
    color: #fff;
    background: #ed5359;
}
ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
    background: #6d7fcc;
}

form label {
     font-weight: bold;
}

.chart-total tr {
     border-bottom: 1px dotted #aaaaaa;
}
.chart-total table td:first-child {
     font-weight: bold;
     padding-right: 1em;
}
.chart-total table td:last-child {
     text-align: right;
}
.chart-total .linkLecturas {
     cursor: pointer;
}
.chart-total .linkLecturas:hover {
     color: #666666;
}
.listadoLecturas {
     width: 100%;
}
.listadoLecturas th,
.listadoLecturas td {
     text-align: left;
}
.listadoLecturas tr {
     border-bottom: 1px dotted #aaaaaa;
}
.listadoLecturas td:first-child {
     width: 20rem;
     white-space: nowrap;
}
.listadoLecturas td:last-child {
     width: 10rem;
     white-space: nowrap;
}

/* Tablas */
table.dataTable thead .sorting::before,
table.dataTable thead .sorting_asc::before,
table.dataTable thead .sorting_desc::before,
table.dataTable thead .sorting_asc_disabled::before,
table.dataTable thead .sorting_desc_disabled::before {
    right: 0.5em;
    /* Up arrow */
    content: "\25B2";
    bottom: 10px;
    font-size: 0.7em;
}

table.dataTable thead .sorting::after,
table.dataTable thead .sorting_asc::after,
table.dataTable thead .sorting_desc::after,
table.dataTable thead .sorting_asc_disabled::after,
table.dataTable thead .sorting_desc_disabled::after {
    /* Down arrow */
    content: "\25BC";
    bottom: 0px;
    font-size: 0.7em;
}
.dataTable thead tr.prehead th {
	border-bottom: none;
}
/*
.dataTable th {
    border-bottom: 1px solid #aaa;
}
*/
.dataTable tbody tr:nth-child(even) {
    background: #eeeeee;
}
.dataTable tbody tr {
	cursor: pointer;
}
.dataTable.noclick tbody tr {
     cursor: default !important;
}
.dataTable tbody tr:hover {
	background: #dddddd;
}
.dataTable tbody tr:nth-child(even):hover {
    background: #cccccc;
}
.dataTable .right {
     text-align: right;
     /*padding-right: 10px;*/
}
.dataTable .center {
     text-align: center;
     /*padding-right: 10px;*/
}
.dataTable .btn {
     padding-top: 0px;
     padding-bottom: 0px;
}
.dataTable td {
     border-left: 1px solid #aaa;
     padding-left: 5px;
     padding-right: 5px;
}
.dataTable td:last-child {
     border-right: 1px solid #aaa;
}
.dataTable tr:last-child td {
     border-bottom: 1px solid #aaa;
}
.dataTable tr:last-child td:first-child {
     -webkit-border-bottom-left-radius: 0.5em;
     -moz-border-radius-bottomleft: 0.5em;
     border-bottom-left-radius: 0.5em;
}
.dataTable tr:last-child td:last-child {
     -webkit-border-bottom-right-radius: 0.5em;
     -moz-border-radius-bottomright: 0.5em;
     border-bottom-right-radius: 0.5em;
}
.dataTable tr:first-child td {
     border-top: 1px solid #aaa;
}
.dataTable tr:first-child td:first-child {
     -webkit-border-top-left-radius: 0.5em;
     -moz-border-radius-topleft: 0.5em;
     border-top-left-radius: 0.5em;
}
.dataTable tr:first-child td:last-child {
     -webkit-border-top-right-radius: 0.5em;
     -moz-border-radius-topright: 0.5em;
     border-top-right-radius: 0.5em;
}
.dataTable tfoot th,
.dataTable tfoot td {
     border: none;
}
.dt-buttons .dt-button {
	display: inline-block;
      font-weight: 400;
      text-align: center;
      vertical-align: middle;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      background-color: transparent;
      border: 1px solid transparent;
      padding: 0.375rem 0.75rem;
      font-size: 1rem;
      line-height: 1.2;
      border-radius: 0.25rem;
      transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	 color: #fff;
      background-color: #6c757d;
      border-color: #6c757d;
}
.dt-buttons .dt-button:hover,
.dt-buttons .dt-button:focus,
.dt-buttons .dt-button.focus {
	color: #000000;
	background-color: #6c757d;
}

#graphCompetencias {
     border: 1px solid #000000;
     background-color: #eeeeee;
     height: 224px;
     display: flex;
     flex-direction: column;
     justify-content: end;
     padding: 10px;
     -webkit-border-radius: 10px;
     -moz-border-radius: 10px;
     border-radius: 10px;
}
#graphCompetencias .comp {
     border: 2px dashed #385265;
     display: flex;
     align-items: center;
     align-content: center;
     width: 100%;
     justify-content: center;
     text-align: center;
     margin-top: 2px;
     -webkit-border-radius: 10px;
     -moz-border-radius: 10px;
     border-radius: 10px;
     transition: background-color 0.25s ease-in-out, border-color 0.25s ease-in-out;
}
#graphCompetencias .comp25 {
     background-color: #dbffc7;
     height: 50px;
}
#graphCompetencias .comp50 {
     background-color: #c8fbad;
     height: 100px;
}
#graphCompetencias .comp100 {
     background-color: #a6f87a;
     height: 200px;
}
#graphCompetencias .comp button {
     display: none;
}
#graphCompetencias .comp:hover button {
     display: block;
     position: absolute;
}
#graphCompetencias .comp:hover {
     background-color: #a2bd94;
     border-color: #ff0000;
}