﻿/*

Hoja secundaria de estilo para el SRM de:
 _           ___   __   _   _____   _   _       ___   _____   _____  
| |         /   | |  \ | | /  ___| | | | |     /   | /  ___| | ____| 
| |        / /| | |   \| | | |     | | | |    / /| | | |     | |__   
| |       / / | | | |\   | | |  _  | | | |   / / | | | |  _  |  __|  
| |___   / /  | | | | \  | | |_| | | |_| |  / /  | | | |_| | | |___  
|_____| /_/   |_| |_|  \_| \_____/ \_____/ /_/   |_| \_____/ |_____| 

 _____   _____   _       _   _   _____   _   _____   __   _   _____  
/  ___/ /  _  \ | |     | | | | |_   _| | | /  _  \ |  \ | | /  ___/ 
| |___  | | | | | |     | | | |   | |   | | | | | | |   \| | | |___  
\___  \ | | | | | |     | | | |   | |   | | | | | | | |\   | \___  \ 
 ___| | | |_| | | |___  | |_| |   | |   | | | |_| | | | \  |  ___| | 
/_____/ \_____/ |_____| \_____/   |_|   |_| \_____/ |_|  \_| /_____/ 

*/

html {
    font-family: 'Lato', sans-serif;
}

body {
	background: none;
}

a:hover {
	color: #395087;
}

.btn {
	background: #f8d304;
	border: 1px solid #f8d304;
	color: #000;
}

.btn:hover {
	background: #e2c212;
	border: 1px solid #e2c212;
}

.no {
	background: url('../img/login_fnd.jpg') no-repeat fixed 10% 90px;
	background-size: cover;
}

.no #header .logo{
    float: right;
    width: 435px;
    margin-right: 2%;
}

.no #header .logo img{
    height: 90px;
    width: 152px;
    display: block;
    margin: 0 auto;
}

.login_contenedor .login {
	margin-top: 125px;
	box-shadow: 0px 1px 5px 5px rgba(0,0,0,0.05);
}

.login_contenedor .login p .enter,
.login_contenedor .login p .recover {
	background: #395087;
	border: 1px solid #28478c;
	color: #fff;
}

.login_contenedor .login p .enter:hover,
.login_contenedor .login p .recover:hover {
	background: #254180;
}

.login_contenedor .notyet {
	background: rgba(80,102,149,0.9);
	box-shadow: 0px 1px 5px 5px rgba(0,0,0,0.05);
	padding: 30px 30px 20px	
}

.login_contenedor .notyet .txt1 {	
	border-bottom: 1px solid #8f9fbe;
	margin-bottom: 20px;
	padding: 0 0 10px 0;
	font-size: 21px;
}

.login_contenedor .notyet .txt2 {
	color: #fff;
} 

.login_contenedor .notyet .register {
	background: #ccd4e2;
	color: #455773;	
	border: 1px solid #ccd4e2;
	font-weight: bold;
	font-size: 14px;
	padding: 15px 50px;
}

.login_contenedor .notyet .register:hover {
	background: #bdc8da;	
}

.no .header img {
	right: 5%;
	top: 10px;
	margin-right: 150px;
	position: absolute;
}

#main {
	width: calc(100% - 40px);
}

#main_content {
	padding: 0;
        background: #f1f4f5;
        position: relative;
}

#header {
	background: #06488d;
        height: auto;
        min-height: 5.715rem;
}

#header .logo {
        display: -webkit-inline-box;
        width: 250px;
}

#header .logo > a{
        display: block;
        margin: 0 auto;
}

#header .mdi-menu {
	background: #fff;
	border-radius: 50%;
	padding: 5px;
        color: #06488d;
}
#header .mdi-menu:hover {
        background: rgba(163,175,183,.9) !important;
        color: #fff;
}

body.menu-responsive-active #header .mdi-menu{
        background: rgba(163,175,183,.9) !important;
        color: #fff;
}


#header .left {
	display: none;
	font-size: 24px;
	margin: 39px 10px 0 -3px;
	float: left;
	cursor: pointer;
	color: #787878;	
}

#header .info {
	margin: 16px 0px 0 0;	
}

#header .info .options .icon-moodle:hover,
#header .info .options .mdi:hover {	
        color: rgba(163,175,183,.9) !important;
}

#main .inicio .block.half {
	min-height: auto;	
	/*height: auto;*/
}

#main .inicio .block h2 {
	background: #fff;
	color: #395087
}

#main .inicio.alumno .block,
#main .detail.alumno .block {	
	border: 0;
}

#main .inicio.alumno .block.half,
#main .detail.alumno .block.half {	
	height: auto;	
}

#main .inicio.alumno h2,
#main .detail.alumno h2 {
	font-size: 30px;
	font-weight: 200;
}

#main .inicio.alumno h2 span,
#main .detail.alumno h2 span {
	display: inline-block;
}

#main .inicio.alumno h2 span,
#main .detail.alumno h2 span {
	font-size: 20px;
	color: #395087;
	font-weight: 200;
}

#main .inicio.alumno h2 span a,
#main .detail.alumno h2 span a {	
	background: #5c709c;
	padding: 2px 10px;
	font-size: 15px;
	margin: -5px 6px;
	float: left;
}

#main .inicio.alumno h2 span a:hover,
#main .detail.alumno h2 span a:hover {	
	text-decoration: none;
	background: #395087;
}

#main .inicio.alumno h2 span a.active,
#main .detail.alumno h2 span a.active{
        background: #3e4b69;
}

#main .inicio.alumno h2.ico .mdi,
#main .detail.alumno h2.ico .mdi {	
	display: inline-table;
	color: #fff;
	font-size: 30px;
	background-color: #395087;
	border-radius: 50%;
	padding: 10px;
	margin-top: -13px;
	margin-right: 15px;	
	padding: 7px 8px;
}

#main .inicio.alumno h2.ico span .mdi,
#main .detail.alumno h2.ico span .mdi {	
	color: #395087;
	background: #fff;
	font-size: 20px;
	padding: 0 5px;
	margin: 0;
}

#main .course_box {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	margin-bottom: 2em;
}

#main .main-current,
#main .main-completed,
#main .main-upcoming {	
	margin-top: 50px;
	width: 420px;
	margin-left: 10px;
	margin-right: 10px;
	position: relative;		
}

#main .main-current>a,
#main .main-completed>a,
#main .main-upcoming>a{
    display: flow-root;
    width: 420px;
    margin: 0 auto;
    position: relative;
}

#main .main-current .calendar,
#main .main-completed .calendar,
#main .main-upcoming .calendar {
	position: absolute;
        z-index: 25;
	background: #395087;
	left: calc(50% - 70px);
	width: 135px;
	text-align: center;
	top: -34px;
	padding: 12px 20px 8px;
	box-sizing: border-box;
	-webkit-box-shadow: -2px 10px 5px -6px rgba(212,212,212,1);
	-moz-box-shadow: -2px 10px 5px -6px rgba(212,212,212,1);
	box-shadow: -2px 10px 5px -6px rgba(212,212,212,1);
}

#main .main-current .calendar p,
#main .main-completed .calendar p,
#main .main-upcoming .calendar p {
	margin: 0;
	padding: 0;
	color: #fff;
	line-height: 17px;
	text-align: center;
}

#main .main-current .calendar .left p:first-child,
#main .main-current .calendar .right p:first-child,
#main .main-completed .calendar .left p:first-child,
#main .main-completed .calendar .right p:first-child,
#main .main-upcoming .calendar .left p:first-child,
#main .main-upcoming .calendar .right p:first-child {
	font-size: 28px;
	font-weight: bold;
	margin-bottom: 5px;
}

#main .main-current .calendar .left p:nth-child(3),
#main .main-current .calendar .right p:nth-child(3),
#main .main-completed .calendar .left p:nth-child(3),
#main .main-completed .calendar .right p:nth-child(3),
#main .main-upcoming .calendar .left p:nth-child(3),
#main .main-upcoming .calendar .right p:nth-child(3) {
	font-size: 15px;
	font-weight: 200;
	text-transform: uppercase;
}

#main .main-current .calendar .left p:nth-child(5),
#main .main-current .calendar .right p:nth-child(5),
#main .main-completed .calendar .left p:nth-child(5),
#main .main-completed .calendar .right p:nth-child(5),
#main .main-upcoming .calendar .left p:nth-child(5),
#main .main-upcoming .calendar .right p:nth-child(5) {
	font-size: 11px;
	font-weight: 200;
}

#main .main-current .calendar .left,
#main .main-completed .calendar .left,
#main .main-upcoming .calendar .left {
	float: left;
	margin-right: 10px;
}

#main .main-current .calendar .center,
#main .main-completed .calendar .center,
#main .main-upcoming .calendar .center {
	float: left;
	color: #fff;
	font-size: 28px;
	font-weight: bold;
	vertical-align: middle;	
	margin-right: 10px;
}

#main .main-current .calendar .right,
#main .main-completed .calendar .right,
#main .main-upcoming .calendar .right {
	float: left;
}

#main .main-current span.typecourse,
#main .main-completed span.typecourse,
#main .main-upcoming span.typecourse{
    float: right;
    font-size: 16px;
    padding: 5px 15px;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    position: absolute;
    right: 0;
    top: -34px;
}

#main .main-current span.typecourse.virtual,
#main .main-completed span.typecourse.virtual,
#main .main-upcoming span.typecourse.virtual{
    background-color: rgba(175, 0, 0, 1);
}

#main .main-current span.typecourse.digital,
#main .main-completed span.typecourse.digital,
#main .main-upcoming span.typecourse.digital{
    background-color: rgba(0, 175, 110, 1);
}

#main .main-current span.typecourse.facetoface,
#main .main-completed span.typecourse.facetoface,
#main .main-upcoming span.typecourse.facetoface{
    background-color: rgba(0, 114, 255, .55);
}

#main .main-current a > img,
#main .main-completed a > img,
#main .main-upcoming a > img{
    min-height: 250px;
    display: block;
    margin: 0 auto;
}

#main .main-current .info,
#main .main-completed .info,
#main .main-upcoming .info {
	background: #ededed;
	width: 420px;
	padding: 17px;
	box-sizing: border-box;
	margin: 7px 0 0 0;
	height: 75px;
	margin: 0 auto;
}

#main .main-current .info h3,
#main .main-completed .info h3,
#main .main-upcoming .info h3 {
	margin: 0;
	padding: 0;
	font-size: 17px;
	color: #484848;
        width: 75%;
        float: left;
}

#main .main-current .info h3 span,
#main .main-completed .info h3 span,
#main .main-upcoming .info h3 span {
	font-size: 17px;
	font-weight: 200;
	color: #000;
}

#main .main-current .info .btn-zoom,
#main .main-completed .info .btn-zoom,
#main .main-upcoming .info .btn-zoom{
        float: right;
        width: 20% !important;
        color: #fff;
        background: #2d8cff;
}

#main .main-current .info .btn-zoom:hover,
#main .main-completed .info .btn-zoom:hover,
#main .main-upcoming .info .btn-zoom:hover{
        background: #54a0fb;
}

#main .main-current .btn,
#main .main-completed .btn,
#main .main-upcoming .btn {
	width: 420px !important;
	margin: 0 0 0 -10px !important;
	padding: 8px 5px;
	background: #395087;
	border: 0;
	color: #fff;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 15px;
}

#main .main-current .btn:hover,
#main .main-completed .btn:hover,
#main .main-upcoming .btn:hover {
	background: #5c709c;
}

#main .inicio.alumno .formulario .left,
#main .detail.alumno .formulario .left {	
	float: left;
	width: calc(100% - 450px);
	margin-bottom: 25px;
}

#main .inicio.alumno .formulario .right,
#main .detail.alumno .formulario .right {	
	float: right;
}

#main .main-current.detail .calendar,
#main .main-completed.detail .calendar,
#main .main-upcoming.detail .calendar {	
	padding: 5px;
}

#main .main-current.detail .calendar .up,
#main .main-completed.detail .calendar .up,
#main .main-upcoming.detail .calendar .up{	
	font-size: 20px;
}

#main .main-current.detail .calendar .up p,
#main .main-completed.detail .calendar .up p,
#main .main-upcoming.detail .calendar .up p {	
	margin-left: 7px;
	line-height: 23px;
}

#main .main-current.detail {
	margin-top: 15px;
}

#main .main-current .logo img {
    clip-path: circle();
}

#header .logo img {
	height: 70px;
}

#header .info .mdi,
#header .info .mdi:hover {
	color: #ffffff;
}

#header .info .icons,
#header .info .icons a {
	color: #ffffff;
}

#header .info .icons .options a {
	text-decoration: none !important;	
}

#header .info .user.mdi {
	color: #ffffff;
	font-size: 50px;
}

#header .info .icons {
	margin: 0 0 0 10px;
}

#header .info .icons p {
	margin: 0;
}

#header .info .icons a:hover {	
	text-decoration: underline;
}

.menu {
	width: 300px;
	background: #263238;	
	border: 0;
	padding: 0;
	margin: 0 0 0 10px; /* Si pongo margin-top por arriba acaba mal en chrome */
}

.menu ul {
	margin: 0 0 0 -5px;
	width: 100%;
}

.menu ul li {
	border-bottom: none;	
	width: 100%;
	padding: 0;
	margin: 0;
}

.menu li {
	border: 0;
}

.menu ul li a{
    color: rgba(163,175,183,.9);
}

.menu li ul li a {
    padding: 12px 20px 12px 39px;
    margin: 0;
    display: -webkit-box;
}

.menu > li.active > a:first-child {
	background: transparent;
}

.menu li.active > a,
.menu > li > a.open{
        color: #fff;
}

.menu li a {
        color: rgba(163,175,183,.9);
	font-size: 16px;
	padding: 12px 20px;
}

.menu li a:hover,
.menu ul li a:hover{
    color: rgba(255,255,255,.8);
    background-color: rgba(255,255,255,.02);
    text-decoration: none;
}

.menu li a span {
	color: rgba(163,175,183,.9);
}

#navbar {
	margin-left: 30px;
}

#column {
	background: #263238; 
	padding: 0;
        border-top: 10px solid #385086;
	width: 300px;	
}

#column .menu li:not(.active) a:hover .mdi {
    color: rgba(255,255,255,.8);
}

#column .menu .mdi.arrowSwitch {
	color: rgba(163,175,183,.9);
}

#column .menu .mdi {
	color: rgba(163,175,183,.9);
}

#column .menu .active .mdi,
#column .menu .open .mdi{
        color: #fff;
}

#container {
	display: contents;
}

#main #bloque0 .header {
	background: #395087;	
}

#main .header.h3 {
	background: #395087;
}

#main .block_content table th {
	background: #7488a8;	
	color: #fff;
}

#main .block_content .inferior_tabla {
	width: 100%;
}

#main .block_content table th a {
	color: #fff;
}

#main .inicio {
}

#main .inicio .block, #main .inicio .block p span {
	font-size: 14px;
        line-height: 24px;
}

#main .inicio .block a {
	color: #395087;
}

#main .inicio .block table.inicio td a {
	color: #395087;
}

#main .inicio .block input.btn,
#main .inicio .block input.btn:hover {	
}

#main .inicio table.inicio .btn {
}

#main .block_content table tr:hover {
	background: #ffffe7;
}

#main .block_content p input:focus,
#main .block_content p select:focus,
#main .block_content textarea:focus {
	border-color: #a1b4d2;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(161, 180, 210, 0.6);	
}

#main .block_content .texto ul li::before {
    color: #395087;
}

/* ESPECÍFICO PARA EL PROYECTO */

/* Mensajería */

#main .block_content .formulario.mensajeria .derecha ul li {
}

#main .block_content .formulario.mensajeria .derecha .msg_head {
}

#main .block_content .formulario.mensajeria .derecha .tablefilter {	
	position: relative;
}

#main .block_content .formulario.mensajeria .derecha .tablefilter input[type="checkbox"] {
	position: absolute;
	left: 0;
	margin-top: 5px !important;
	margin-left: 5px !important;
}

#main .block_content .formulario.mensajeria .derecha .tablefilter .msg_head {
	background: none;
	padding: 0;
	font-style: normal;
	font-weight: normal;
	font-size: 9px;
	margin-left: 0;
	float: left;
	margin-left: 25px;
	margin-right: 5px;
}

#main .calendario_sesion {
	width: 95%;	
	margin: 20px auto;
}

#main .showhide {
	cursor: pointer;
}

/* Para el filtrado de tablas en envío de mensajes */

.cabecera .filter-table { 
	float:right; 
	line-height:35px;
}
.block_content .filter-table {
	float:right; 
	margin-right:2.5%;
}

.filter-table .quick { 
	margin-left: 0.5em; 
	font-size: 0.8em; 
	text-decoration: none; 
}
.fitler-table .quick:hover { 
	text-decoration: underline; 
}
td.alt { 
	background-color: #ffc; 
	background-color: rgba(255, 255, 0, 0.2); 
}

/* Mensajería columnas */

#main .block_content .formulario.mensajeria .sombra {
	margin: 0 0 0 -260px !important;
}

.derecha input[type=checkbox] {
	margin-top: -1px !important;
}

#main .block_content .formulario.mensajeria .derecha {
	width: 215px !important;
	padding-right: 20px;
}

.msg_list .msg_body {
	height: 250px; 
	overflow-y: auto;
}

.block_content .formulario.mensajeria .derecha .msg_list .msg_body table tr td p.msg_head,
.block_content .formulario.mensajeria .derecha .msg_list .msg_body table tr td input {
	display: inline !important;
}

.filter-table input {
	width: 190px;
	margin-bottom: 15px;
}

#bloque0 .block_content .formulario.mensajeria .izquierda input[type=button] {
	float:right;
	margin-right:20px;	
	background: #ddd;
	border: 1px solid #cecece; 
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px; 
	font-weight: bold;
	padding: 4px 10px;
}

.sub-opciones {
	display:none;
	position:absolute;
	left: 73px;
	width: 250px;
	margin: 3px 0 0 0;
}

.sub-opciones label {
	float:left;
}

.sub-opciones label a img {
	box-shadow:none!important;
}

.sub-opciones label a {
	text-decoration:none!important;
}

#main .block_content .formulario.incidencia .usuarios {
	display: inherit;
	height: 150px;
	width: 50%;
	overflow: auto;
}
.invalidated{
	background-color: #FAA!important;
}

/* Calendario */

#calendar1 .aviso3 {
	margin: 20px auto 0 auto;	
}

#main #offer a.azul,
#main #offer span.azul {
    color: #5799cc !important;
}

#main #offer a.negro,
#main #offer span.negro {
    color: #000000 !important;
}

#main .block_content table#offer th:first-child {
	width: 250px;	
}

#main .block_content table#offer .header {
	background: #e5e5e5;
	cursor: pointer;
}

#main .block_content table#offer .header:nth-child(even) {
	background-color: #eee;
	cursor: pointer;
}

#main .block_content table#offer .header:nth-child(odd) {
	background-color: #fff;
	cursor: pointer;
}

#main .block_content table#offer .header {
	background-image: url('../../../img/ico_remove.png');
	background-repeat: no-repeat;
	background-position: 10px 12px;
	text-indent: 25px;	
}

#main .block_content table#offer .header.expand {
	background-image: url('../../../img/ico_add.png');
	background-repeat: no-repeat;
	background-position: 10px 12px;
	text-indent: 25px;
}

/* Dialog */

#dialog_form {
	margin: 20px 0;
}

#dialog_form fieldset {
	margin: 0 20px;
	border: 1px solid #ccc;
}

#dialog_form fieldset.no {
	border: 0;
	background: none;
}

#dialog_form fieldset legend {
	font-weight: bold;	
}

#dialog_form fieldset input[type="number"].calification,
#dialog_form fieldset input[type="text"] {
	width: 65px;
	border: 1px solid #c7c7c7;	
	font-size: 13px;
	background: #fff;
	margin: 0 10px 0 0;
}

#dialog_form fieldset textarea {
	background: #fff;
	width: 95%;	
	border: 1px solid #c7c7c7;	
	margin: 10px 0 0 0;
}

.ui-tabs .ui-tabs-nav {
	width: 95% !important;
	margin: 0 auto;	
}

 .ui-tabs .ui-tabs-panel {
	padding: 0 18px;
 }
 
#dialog_form #tab1 form,
#dialog_form #tab2 form {
	border-left: 1px solid #c7c7c7;	
	border-right: 1px solid #c7c7c7;	
	border-bottom: 1px solid #c7c7c7;	
	padding-top: 20px;
}

#dialog_form .ui-corner-all,
#dialog_form .ui-corner-bottom,
#dialog_form .ui-corner-right,
#dialog_form .ui-corner-br {
	border-radius: 0;
}

#dialog_form .ui-state-active,
#dialog_form .ui-widget-content .ui-state-active,
#dialog_form .ui-widget-header .ui-state-active {
	background: #f7f7f7;
}

.ui-dialog  h2 {
    margin: 0;
    font-size: 16px;
    padding: 0 13px;
    color: #666;
}

/* tablas dentro de dialogs */

.ui-dialog table.table {
    width: 100%;   
    border-spacing: 0;
    border: 0;
}

.ui-dialog table.table tr:nth-child(even) {
	background: #f4f4f4;
}

.ui-dialog table.table tr:nth-child(odd) {
	background: #fff;
}

.ui-dialog table.table tr:hover {
	background: #eee;
}

.ui-dialog table.table tr td {
	padding: 3px 10px;
}

.ui-dialog table.table tr td.right {
    text-align: right;
}


/* Días de la semana */

.configuration_course_days {
    margin-bottom: 5px;
    float: left;
}

.configuration_course_days span {
    float:left;
    margin-right: 10px;
}

.configuration_course_days label {
   display: inline-grid;
   text-align: center;
   float: none !important;
   margin: 0 !important;
   line-height: inherit;
   width: auto !important;
}
.configuration_course_days input {
   margin: 0 auto !important;
}

#main .block_content .formulario.perfil .derecha img {
    margin: 0px 0px 0 0px;
}

@media only screen and (max-width: 1625px) { 
	#main .inicio.alumno .formulario .left,
	#main .detail.alumno .formulario .left {		
		width: 100%;		
	}
	
	#main .inicio.alumno .formulario .right,
	#main .detail.alumno .formulario .right	{		
		width: 100%;	
		margin: 20px 0;		
	}
}

@media only screen and (max-width: 1150px) { 
    .no #header{ padding: 0;}
    .no #header .logo{ width: 100%; margin: 0;}
    .no #header .logo img{
        display: block;
        margin: 0 auto;
        vertical-align: middle;
    } 
    
    #header .logo{ width: auto; float: left; }
    
    
     #main .detail.alumno h2 {
		margin-left: 10px !important;
	}	
	#navbar {		
		margin-left: 17px;
	}
	
	#main_content #column {
                background: #263238;
                display: block;
                left: -100%;
                top: 0;
	}
	
	#main .inicio.alumno h2.ico .mdi,
	#main .detail.alumno h2.ico .mdi {		
		font-size: 20px;
	}
	
	#main .inicio.alumno h2,
	#main .detail.alumno h2 {		
		font-size: 23px;
	}			
	
	#main {
		width: 100%;		
	}
}
	
@media screen and (max-width: 700px) {	
	#main .inicio.alumno h2 span a,
	#main .detail.alumno h2 span a {		
		padding: 0 4px;
		font-size: 10px;
	}		
        
        #main .inicio .block .calendario{
                margin-top: 0;
        }
}	

@media only screen and (max-width: 1150px) {          
        body.no {
			background: url('../img/login_fnd.jpg') no-repeat fixed 80% 90px;
			background-size: cover;
        }
		.no .header img {
			right: 29% !important;
			margin: 0;
		}
		.login_contenedor .login {
			margin-top: 50px;
		}		
		.no .header img {
			margin-right: 0 !important;
			position: relative !important;
			right: inherit !important;
		}	
		.no .header {
			text-align: center;
		}
}

@media screen and (max-width: 520px) {			
		.login_contenedor {
			width: 100%;
		}
                
                #header { display: flow-root; padding: 0 25px; }
		#header i.mdi-menu{ position: absolute }
                #header .logo { width: 100%; float: none; margin: 0 }
                
		#header .info {
                        text-align: center;
                        width: 100%;
			float: left;
			clear: both;
                        margin: 0 0 10px 0;
		}
                
                #header .info i.mdi.user{ display: none }
                #header .info div.icons{ float: none }
                
                #header .info div.icons,
                #header .info div.icons form{
                        display: table;
                        margin: 0 auto;
                }
                
                #main_content #column,
                #main_content #column .menu{ width: 100vw; }
		
		#main .inicio.alumno h2 span, #main .detail.alumno h2 span {
			margin: 20px 0;
			display: table;
		}
		
		#main .inicio.alumno h2 .line, #main .detail.alumno h2 .line {
			display: none;
		}	

}

@media screen and (max-width: 450px) {	
    /*
        #main .main-current > a, #main .main-completed > a, #main .main-upcoming > a,
        #main .main-current .info, #main .main-completed .info, #main .main-upcoming .info,
        #main .main-current, #main .main-completed, #main .main-upcoming{
            width: 100%;
        }
    */
}

@media screen and (max-width: 360px) {		
	#page {
		display: inline-table;
	}	
	
	#header .info {
		position: relative;
		float: left;	
		margin-left: -19px !important;		
	}
	
	#header .info .user.mdi {
		font-size: 150%;
		position: absolute;
		top: -2px;
		left: 15px;
	}
	
	#header .info .icons .name {
		margin: 5px 5px 0 25px;
	}
	
	#header .info .icons {
		margin: -5px 0 0 15px;
	}
	
	#header .info .options {
		margin-top: 3px;
	}
}