/* -- VARS ---------------------------------------- */

/* MAIN COLORS */
@Color1: #08a27c;
@Color2: #06775b;
@Color3: #f4f6f5;
@Color4: #f4f6f5;
@Color5: #fff;
@Color7: #01556d;
@Color8: #0f728e;
@Color9: #ccc;

/* FONTS */
@import url('https://fonts.googleapis.com/css?family=Merienda');
@FontMerienda: 'Merienda';

@font-face {
	font-family: 'Proxima';
	font-style: normal;
	font-weight: normal;
	src: url('../fonts/ProximaNova-Black.woff')  format('woff');
}
@FontProxima: 'Proxima';

@font-face {
	font-family: 'Bradley Hand ITC';
	font-style: normal;
	font-weight: normal;
	src: url('../fonts/BRADHI.woff')  format('woff');
}
@FontBradley: 'Bradley Hand ITC';

.border (@radius: 2px){
	-webkit-border-radius: @radius;
	-moz-border-radius: @radius;
	border-radius: @radius;
}

.textShadow (@shadow: 0.3){
	-webkit-text-shadow: 0 2px rgba(0,0,0,@shadow); 
	-moz-text-shadow: 0 2px rgba(0,0,0,@shadow); 
	text-shadow: 0 2px rgba(0,0,0,@shadow); 
}

.shadow (@left: 3px, @right: 3px, @blur: 1px, @dist: 0px, @trans: 0.1){
	-webkit-box-shadow: @left @right @blur  @dist rgba(0,0,0,@trans); 
	-moz-box-shadow: @left @right @blur  @dist rgba(0,0,0,@trans); 
	box-shadow: @left @right @blur  @dist rgba(0,0,0,@trans); 
}

.insetShadow (@left: 4px, @right: 4px, @blur: 4px, @dist: 4px, @trans: 0.5){
	-webkit-box-shadow: inset @left @right @blur  @dist rgba(0,0,0,@trans); 
	-moz-box-shadow: inset @left @right @blur  @dist rgba(0,0,0,@trans); 
	box-shadow: inset @left @right @blur  @dist rgba(0,0,0,@trans); 
}

.insetShadowBottom (@shadow: 4px, @trans: 0.2){
	-webkit-box-shadow: inset 0 -@shadow 0 0 rgba(0,0,0,@trans); 
	-moz-box-shadow: inset 0 -@shadow 0 0 rgba(0,0,0,@trans); 
	box-shadow: inset 0 -@shadow 0 0 rgba(0,0,0,@trans); 
}

.insetShadowRight (@shadow: 4px, @trans: 0.05){
	-webkit-box-shadow: inset -@shadow 0 0 0 rgba(0,0,0,@trans); 
	-moz-box-shadow: inset -@shadow 0 0 0 rgba(0,0,0,@trans); 
	box-shadow: inset -@shadow 0 0 0 rgba(0,0,0,@trans); 
}

.rotate (@value: -90deg, @valueIE: 3){
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=@valueIE);
	-webkit-transform: rotate(@value);
	-moz-transform: rotate(@value);
    transform: rotate(value);
}

.borderGradientDouble (@color1: #000, @color2: #fff, @dir1: left, @dir2: right){
	-moz-border-image: -moz-linear-gradient(@dir1, @color2 0%, @color1 50%, @color2 100%);
	-webkit-border-image: -webkit-linear-gradient(@dir1, @color2 0%, @color1 50%, @color2 100%);
	border-image: linear-gradient(to @dir2, @color2 0%, @color1 50%, @color2 100%);
	border-image-slice: 1;
}

.borderGradrientLeftRight (){
	-moz-border-image: -moz-linear-gradient(left, #aaa 0%, @Color4 100%);
	-webkit-border-image: -webkit-linear-gradient(left, #aaa 0%, @Color4 100%);
	border-image: linear-gradient(to right, #aaa 0%, @Color4 100%);
	border-image-slice: 1;
}

.efectTransition (@seg: 0.2s){
	-webkit-transition: all @seg;
	-moz-transition: all @seg;
	transition: all @seg;
}

.noSelect (){
	-webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* -- GENERAL CLASS ------------------------------------- */

hr {
	margin-bottom: 20px;
	padding-top: 5px;
	border: 0;
    border-bottom: 2px solid #08a27c;
}

.display-none {
    display: none;
}

.clear {
	clear: both;
}

.box {
	padding: 20px;
	background-color: #f5f7f6;
	border: 1px solid @Color9;
	.border;
}

.button {
	display: inline-block;
	padding: 10px 20px;
	color: #fff;
	font-size: 0.9rem;
	background-color: @Color1;
	border: 1px solid @Color2;
	.border;
	.efectTransition;
}

.button:hover {
	cursor: pointer;
	background-color: @Color2;
	border-color: @Color2;
	.border;
}

a.button {
	padding: 11px 20px;
}

.button.delete {
	background-color: rgba(255,0,0,0.7);
	border: 1px solid red;
}

.button.delete:hover {
	background-color: red;
}

.banner {
	padding: 19px 30px;
	background-color: @Color3;
	border-bottom: 1px solid @Color9;
}

.banner h1 {
	/*display: inline-block;*/
	float: left;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	line-height: 18px;
}

.banner h1 span {
	font-size: 19px;
	font-size: 1.2rem;
	font-family: @FontMerienda;

}

.banner .return {
	float: left;
	/*display: inline-block;*/
	width: 8px;
	height: 15px;
	margin-right: 20px;
	margin-left: -5px;
	padding-top: 20px;
	padding-right: 38px;
	padding-bottom: 19px;
	background: url(../img/return.png) no-repeat 5px center transparent;
	border-right: 1px solid rgba(0,0,0,0.1);
	.efectTransition;
}

.banner .return:hover {
	cursor: pointer;
	background-position: left center;
}

.banner .button {
	display: inline-block;
	margin: 5px 10px 0 0;
	padding: 5px 10px;
}

.folders {
	padding: 10px;
}

.folders li {
	float: left;
	width: 30%;
	height: 320px;
	margin: 10px;
	text-align: center;
	background-color: @Color3;
	border: 1px solid @Color9;
	.border;
}

.folders li:hover {
	background-color: #eee;
	border-color: @Color1;
	.efectTransition;
}

.folders li span {
	display: block;
	padding: 20px 20px 15px 20px;
	font-weight: bold;
}

.folders li a > div {
	display: table;
	width: 100%;
	height: 250px;
	margin-bottom: 20px;
	background-color: #e5e5e5;
}

.folders li a > div > div {
	display: table-cell;
	vertical-align: middle;
	height: 250px;
}

.folders li img {
	max-width: 100%;
	max-height: 100%;
	margin: 0 auto;
}

.publications {
	padding: 10px;
}

.publications li {
	float: left;
	width: 30%;
	height: 300px;
	margin: 10px;
	text-align: center;
	background-color: @Color3;
	border: 1px solid @Color9;
	.border;
}

.publications li:hover {
	background-color: #eee;
	border-color: @Color1;
	.efectTransition;
}

.publications li span {
	display: block;
	padding: 20px 20px 15px 20px;
	font-weight: bold;
}

.publications li a > div {
	display: table;
	width: 100%;
	height: 100px;
	background-color: #eee;
}

.publications li a > div > div {
	display: table-cell;
	vertical-align: middle;
	height: 150px;
}

.publications li img {
	max-width: 100%;
	max-height: 100%;
	margin: 0 auto;
}

.publications li p {
	padding: 15px 20px 20px 20px;
	color: #666;
	font-size: 14px;
	line-height: 17px;
}

.publication {
	padding: 20px;
}

.publication h3 {
	display: block;
	margin-bottom: 20px;
	font-size: 20px;
}

.publication p {
	margin-bottom: 20px;
	color: #666;
	font-size: 14px;
	line-height: 17px;
}

iframe.pdf {
	width: 100%;
	min-height: 600px;
}

.exam {
	padding: 20px;
}

.exam h3 {
	display: block;
	margin-bottom: 20px;
	font-size: 20px;
}

.exam p {
	padding-bottom: 0px;
}

.exam .hr {
	clear: both;
	margin: 20px 0;
	border-bottom: 2px solid @Color1;
}

.exam .res {
	margin-bottom: 15px;
	padding-bottom: 15px;
	border-bottom: 1px solid #eee;
}

.exam .res .number {
	display: inline-block;
	width: 30px;
	height: 30px;
	margin-right: 8px;
	padding-top: 8px;
	color: #fff;
	text-align: center;
	background-color: @Color1;
	border-radius: 9999px 9999px;
}

.exam .res .subject {
	display: inline-block;
	margin-left: 10px;
	margin-right: 10px;
	padding: 5px 5px 3px 5px;
	color: #000;
	font-size: 12px;
	text-align: center;
	background-color: #eee;
	.border;
}

.exam .res .difficulty {
	display: inline-block;
	margin-right: 10px;
	padding: 5px 5px 3px 5px;
	color: #fff;
	font-size: 12px;
	text-align: center;
	background-color: @Color1;
	.border;
}

.exam .res .difficulty.directa {
	background-color: #28B463;
}

.exam .res .difficulty.intermedia {
	background-color: Orange;
}

.exam .res .difficulty.dificil, .exam .difficulty.difícil {
	background-color: red;
}

.exam .res .comment {
	width: 90%;
	margin: 10px 10% 10px 45px;
	padding: 15px;
	font-size: 14px;
	line-height: 18px;
	background-color: #eee;
	.border;
}

.exam .res label {
	margin-left: 5px;
	margin-right: 10px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 12px;
	font-size: 13px;
	border-right: 1px solid #eee;
}

.exam .res label:hover {
	cursor: pointer;
}

.exam .res label:hover span {
	background-color: #eee;
}

.exam .res label input {
	vertical-align: -2px;
}

.exam .res label span {
	padding: 2px 5px;
	.border;
}

.exam .res label input:checked+span {
	color: #fff;
	background-color: red;
}

.exam .res label.correct input:checked+span {
	background-color: #28B463;
	border: 0;
}

.exam .res label.first {
	padding-left: 12px;
	border-left: 1px solid #eee;
}

.exam .res label.correct.ok span {
	border-bottom: 2px solid #28B463;
}

.exam-corrected {
	padding: 20px;
}

.exam-corrected h3 {
	display: block;
	margin-bottom: 20px;
	font-size: 20px;
}

.exam-corrected p {
	padding-bottom: 0px;
}

.exam-corrected .hr {
	clear: both;
	margin: 20px 0;
	border-bottom: 2px solid @Color1;
}

.stats-exam-user-content {
	margin-bottom: 30px;
}

.char .mi-dato {
	display: inline-block;
	margin-top: 10px;
	padding: 10px 5px 10px 10px;
	background-color: @Color3;
	.border;
}

.char .mi-dato span {
	display: inline-block;
	margin: 2px 5px;
	padding: 3px 5px;
	color: #fff;
	background-color: @Color1;
	.border;
}

.char table {
	width: 100%;
	margin: 10px 0 40px 0;
	background-color: #f9f9f9;
}

.char table tr:nth-child(odd) {
	background-color: #eee;
}

.char table th {
	padding: 10px;
	color: #fff;
	font-weight: normal;
	background-color: @Color1;
}

.char table th:first-child {
	text-align: left;
}

.char table td {
	padding: 10px;
	text-align: center;
}

.char table td:first-child {
	font-weight: bold;
	text-align: left;
}

.char table td b {
	color: @Color2;
}

.char table td.per-rojo {
	color: Red;
}

.char-content {
	margin-bottom: 50px;
}

.users {
	padding: 20px;
}

.users h3 {
	display: block;
	margin-bottom: 10px;
	font-size: 20px;
}

.users .hr {
	clear: both;
	margin: 0 0 10px 0;
	padding-top: 10px;
	border-bottom: 2px solid @Color1;
}

.users .users-content {
	margin: 0 -5px;
}

.users .user {
	position: relative;
	display: flex;
	float: left;
	line-height: 18px;
	align-items: center;
	width: 30%;
	height: 100px;
	margin: 5px;
	padding: 15px 15px 45px 15px;
	font-size: 14px;
	background-color: #f4f6f5;
	border: 1px solid #ccc;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}

.users .user:hover {
	cursor: pointer;
	background-color: #eee;
	border-color: @Color1;
	.efectTransition;
}

.users .user > span {
	color: #777;
	font-size: 13px;
}

.users .user > span b {
	display: block;
	margin-bottom:3px;
	color: #222;
	font-size: 15px;
}

.users .user div.data {
	position: absolute;
	bottom: 15px;
	left: 15px;
}

.users .user div.data span {
	display: inline-block;
	padding: 5px 7px 3px 7px;
	color: #999;
	background-color: #fff;
	font-size: 12px;
	line-height: 12px;
	border-radius: 9999px;
	.efectTransition;
}

.users .user:hover div.data span.hits {
	color: #fff;
	background-color: green;
}

.users .user:hover div.data span.errors {
	color: #fff;
	background-color: red;
}

.users .user:hover div.data span.whites {
	color: #777;
	background-color: white;
}

.users .user div.score {
	position: absolute;
	bottom: 15px;
	right: 15px;
	padding: 5px 7px 3px 7px;
	color: #999;
	font-size: 12px;
	line-height: 12px;
	background-color: #fff;
	border-radius: 9999px;
	.efectTransition;
}

.users .user:hover div.score {
	color: #fff;
	background-color: @Color1;
}

.users .message-extra {
	margin: 0;
}

#evolucion-alumnos .users .user {
	height: 70px;
	padding: 15px;
}

.stats-exam-user {
	padding: 20px;
}

#mis-informes .stats-exam-user {
	padding: 30px 0;
}

.stats-exam-user h3 {
	display: block;
	margin-bottom: 10px;
	font-size: 20px;
}

.stats-exam-user h5 {
	display: block;
	margin-bottom: 10px;
}

.stats-exam-user .hr {
	clear: both;
	margin: 0 0 10px 0;
	padding-top: 10px;
	border-bottom: 2px solid @Color1;
}

.textarea-teacher-exam {
	margin: 20px 0 0 0;
	padding: 30px;
	background-color: @Color3;
	border: 2px solid @Color1;
	.border;
}

.textarea-teacher-exam .respuesta-teacher {
	padding: 20px;
	font-size: 14px;
	line-height: 18px;
	background-color: #fff;
}

.textarea-teacher-exam .respuesta-teacher.ok {
	color: #28B463;
	background-color: #fff;
}

.textarea-teacher-exam span {
	display: block;
	margin-bottom: 10px;
	font-size: 16px;
	font-weight: bold;
}

.textarea-teacher-exam textarea {
	width: 100%;
	height: 100px;
	padding: 10px;
}

.textarea-teacher-exam button {
	margin-top: 10px;
}

.textarea-teacher-exam .message-ok {
	display: inline-block;
	margin-left: 10px;
}

#crear-nuevo {
	padding: 30px;
}

.form h3 {
	margin-bottom: 30px;
	padding-bottom: 20px;
	border-bottom: 1px solid #eee;
}

.form form label {
	display: block;
	width: 100%;
	margin-bottom: 15px;
	font-size: 14px;
}

.form form label span {
	display: block;
	margin-bottom: 5px;
}

.form form label input {
	width: 30%;
	margin-top: 5px;
	padding: 5px 10px;
}

.form form label input[type=checkbox] {
	width: auto;
}

.form form label input.large50 {
	width: 50%;
}

.form form label textarea {
	width: 50%;
	min-height: 120px;
}

.form form label input[type=file] {
	padding: 0;
}

.form form button {
	margin-top: 15px;
}

.form form .button.delete {
	margin-left: 10px;
}

input[type=text], input[type=email], input[type=password], input[type=number], input[type=tel] {
	padding: 3px 5px;
	font-size: 13px;
	font-size: 0.85rem;
	border: 1px solid #bebebe;
	.border;
	-webkit-box-shadow: inset 1px 1px 2px 0 rgba(0,0,0,0.3); 
	-moz-box-shadow: inset 1px 1px 2px 0 rgba(0,0,0,0.3); 
	box-shadow: inset 1px 1px 2px 0 rgba(0,0,0,0.3); 
}

input:disabled, select:disabled {
    opacity: 0.6;
}

select {
	padding: 3px 5px;
	font-size: 13px;
	font-size: 0.85rem;
	border: 1px solid #bebebe;
	.border;
	-webkit-box-shadow: inset 1px 1px 2px 0 rgba(0,0,0,0.3); 
	-moz-box-shadow: inset 1px 1px 2px 0 rgba(0,0,0,0.3); 
	box-shadow: inset 1px 1px 2px 0 rgba(0,0,0,0.3); 
}

textarea {
	padding: 3px 5px;
	font-size: 13px;
	font-size: 0.85rem;
	border: 1px solid #bebebe;
	.border;
	-webkit-box-shadow: inset 1px 1px 2px 0 rgba(0,0,0,0.3); 
	-moz-box-shadow: inset 1px 1px 2px 0 rgba(0,0,0,0.3); 
	box-shadow: inset 1px 1px 2px 0 rgba(0,0,0,0.3); 
}

a.lightbox-floating-button {
	z-index: 9999;
	top: 45%!important;
	bottom: auto!important;
	right: -10px!important;
	.efectTransition;
}

a.lightbox-floating-button:hover {
	right: -5px!important;
}

input.at-required,
textarea.at-required,
select.at-required {
	border: 1px solid red;
}

input.at-required[type=checkbox] {
	outline: 1px solid red;
}

input.at-invalid,
textarea.at-invalid,
select.at-invalid {
	border: 1px solid DarkOrange;
}

.at-error,
.at-warning {
	z-index: 2;
	position: absolute;
	display: inline-block;
	margin-left: 10px;
	padding: 5px 10px;
	color: #fff;
	font-size: 13px;
	font-size: 0.8rem;
	.border(2px);
}

.at-error {
	background-color: red;
}

.at-warning {
	background-color: DarkOrange;
}

.message-ok {
	margin-bottom: 15px;
	padding: 10px 15px;
	color: #fff;
	text-align: left;
	font-size: 15px;
	line-height: 18px;
	background-color: #28B463;
	border-radius: 3px;
}

.message-ok b {
	color: #fff;
}

.message-extra {
	display: inline-block;
	margin-bottom: 15px;
	padding: 10px 15px;
	color: #333;
	text-align: left;
	font-size: 15px;
	line-height: 18px;
	background-color: #ddd;
	border-radius: 3px;
}

.message-extra b {
	color: #000;
}

.message-error {
	display: inline-block;
	margin-bottom: 15px;
	padding: 10px 15px;
	color: #fff;
	text-align: left;
	font-size: 15px;
	line-height: 18px;
	background-color: red;
	border-radius: 3px;
}

.message {
    padding: 2px 5px;
    border-radius: 3px;
    -webkit-transition: all ease .2s;
    -moz-transition: all ease .2s;
    -ms-transition: all ease .2s;
    -o-transition: all ease .2s;
    transition: all ease .2s;
}

.message.normal {
    background-color: #ddd;
}

.message.alert {
    background-color: gold;
}

.message.success {
    color: #fff;
    background-color: #08A27C;
}

.message.error {
    color: #fff;
    background-color: red;
}

a.message:hover {
    cursor: pointer;
    color: #fff;
    background-color: #06775B;
}

/* -- STRUCTURE ------------------------------------- */

#center {
	max-width: 1500px;
	height: 100%;
	margin: 0 auto;
}

/* -- HEADER ------------------------------------- */

#header {
	z-index: 3;
	position: fixed;
	width: 100%;
	height: 60px;
	color: #fff;
	background-color: @Color1;
	border-bottom: 4px solid rgba(0,0,0,0.2);
}

.style-course1 #header {
	background-color: RoyalBlue;
}

.style-course2 #header {
	background-color: Orange;
}

.style-course3 #header {
	background-color: purple;
}

/* LOGO */

#header .logo {
	float: left;
	width: 20%;
	height: 60px;
	margin-top: -3px;
	text-align: center;
}

#header .logo img {
	height: 75px;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
	border-radius: 3px;
}

/* SLOGAN */

#header .submenu {
	float: left;
	width: 34%;
	margin-top:18px;
}

#header .submenu > span {
	margin-right: 5px;
	font-size: 14px;
	color: #fff;
}

#header .submenu select {
	min-width: 100px;
	color: #fff;
	font-size: 13px;
	background-color: rgba(0,0,0,0.3);
	border: 0;
	box-shadow: none;
}

#header .submenu select option {
	font-size: 13px;
	background-color: #fff;
}

#header .submenu .button {
	position: relative;
	padding: 5px 8px;
	font-size: 14px;
	background-color: rgba(0,0,0,0.3);
	border: 0;
}

#header .submenu .button:hover {
	background-color: rgba(0,0,0,0.4);
}

#notifications-alumnos {
	position: absolute;
    top: -7px;
    right: -7px;
    min-width: 15px;
    height: 15px;
    padding-top: 1px;
    color: #fff;
    font-size: 11px;
    text-align: center;
    background-color: red;
    border-radius: 9999px;
}

/* LINKS */

#header .links {
	float: left;
	width: 46%;
	height: 55px;
	margin-top: 2px;
	padding: 16px 30px;
}

#header .links .login-register {
	float: right;
	margin-left: 25px;
}

#header .links .login-register a {
	display: inline-block;
	color: #fff;
	font-size: 13px;
	.efectTransition;
}

#header .links .login-register > a:last-child {
	margin-top: -10px;
	margin-left: 13px;
	padding: 15px 0 15px 15px;
	border-left:1px solid rgba(0,0,0,0.05);
}

#header .links .login-register a:hover {
	color: #fff;
}

/* USER MENÚ */

#header .links .login-register #user-menu {
	position: relative;
	min-width: 10px;
	margin-top: -20px;
	padding: 10px 0;
	text-align: right;
	border: 1px solid transparent;
	.border(3px);
	.efectTransition;
}

#header .links .login-register #user-menu:hover {
	min-width: 150px;
	padding: 10px 10px;
	background-color: @Color2;
	border-color: rgba(0,0,0,0.1);
}

#header .links .login-register #user-menu:hover div.name span.name {
	color: #fff;
}

#header .links .login-register #user-menu:hover div.name span.company {
	color: rgba(255,255,255,1);
}

#header .links .login-register #user-menu:hover ul.menu {
	display: block;
}

#header .links .login-register #user-menu > div > div.name {
	float: right;
	padding: 6px 8px 0 0;
}

#header .links .login-register #user-menu div.name span.name {
	display: block;
	margin-bottom: 3px;
	color: rgba(255,255,255,1);
	font-size: 14px;
	font-size: 0.9rem;
	.efectTransition;
}

#header .links .login-register #user-menu div.name span.company {
	display: block;
	color: rgba(255,255,255,1);
	font-size: 12px;
	font-size: 0.7rem;
	.efectTransition;
}

#header .links .login-register #user-menu > div > div.image {
	float: right;
	/*display: inline-block;*/
	width: 40px;
	height: 40px;
	text-align: center;
	overflow: hidden;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	.border(25px);
}

#header .links .login-register #user-menu ul.menu {
	display: none;
	width: 100%;
	margin-top: 10px;
	padding-top: 8px;
	text-align: left;
	border-top: 1px solid rgba(0,0,0,0.1);
	.efectTransition;
}

#header .links .login-register #user-menu ul.menu li a {
	margin: 5px 0;
	color: rgba(255,255,255,1);
	font-size: 14px;
	font-size: 0.9rem;
	.efectTransition;
}

#header .links .login-register #user-menu ul.menu li a:hover {
	padding-left: 5px;
	color: #fff;
}

#header .links .login-register #user-menu ul.menu li:last-child {
	margin-top: 6px;
	padding-top: 6px;
	border-top: 1px solid rgba(0,0,0,0.1);
}

#header .links .login-register #user-menu ul.menu li:last-child a {
	margin-bottom: 2px;
}

/* -- MAIN ------------------------------------- */

#main {
	display: flex;
	position: relative;
	width: 100%;
	padding-top: 60px;
}

/* -- SIDEBAR ------------------------------------- */

#sidebar {
	position: relative;
	z-index: 2;
	float: left;
	width: 20%;
	padding-bottom: 70px;
	color: #444;
	background-color: @Color4;
	border-right: 1px solid @Color9;
}

#sidebar nav {
	overflow: auto;
    height: 100%;
	padding: 25px 5px 0 15px;
}

#sidebar nav ul li {
	float: left;
	width: 43%;
	height: 100px;
	margin: 5px 5px;
	padding: 72px 5px 5px 5px;
	background-color: #fff;
	color: @Color1;
	font-size: 10px;
	text-align: center;
	text-transform: uppercase;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100%;
	border: 1px solid #ddd;
	.border;
	.efectTransition;
}

#sidebar nav ul li:hover, #sidebar nav ul li.select {
	background-color: @Color1;
}

#sidebar nav ul li.menu-login {
	background-image: url(../img/login.jpg);
}

#sidebar nav ul li.menu-login:hover, #sidebar nav ul li.menu-login.select {
	color: #fff;
	background-image: url(../img/login-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-registro {
	background-image: url(../img/registro.jpg);
}

#sidebar nav ul li.menu-registro:hover, #sidebar nav ul li.menu-registro.select {
	color: #fff;
	background-image: url(../img/registro-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-inicio {
	background-image: url(../img/inicio.jpg);
}

#sidebar nav ul li.menu-inicio:hover, #sidebar nav ul li.menu-inicio.select {
	color: #fff;
	background-image: url(../img/inicio-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-calendarios {
	background-image: url(../img/calendarios.jpg);
}

#sidebar nav ul li.menu-calendarios:hover, #sidebar nav ul li.menu-calendarios.select {
	color: #fff;
	background-image: url(../img/calendarios-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-asignaturas {
	background-image: url(../img/asignaturas.jpg);
}

#sidebar nav ul li.menu-asignaturas:hover, #sidebar nav ul li.menu-asignaturas.select {
	color: #fff;
	background-image: url(../img/asignaturas-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-videoclases {
	background-image: url(../img/videoclases.jpg);
}

#sidebar nav ul li.menu-videoclases:hover, #sidebar nav ul li.menu-videoclases.select {
	color: #fff;
	background-image: url(../img/videoclases-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-simulacros {
	background-image: url(../img/simulacros.jpg);
}

#sidebar nav ul li.menu-simulacros:hover, #sidebar nav ul li.menu-simulacros.select {
	color: #fff;
	background-image: url(../img/simulacros-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-examenes {
	background-image: url(../img/examenes.jpg);
}

#sidebar nav ul li.menu-examenes:hover, #sidebar nav ul li.menu-examenes.select {
	color: #fff;
	background-image: url(../img/examenes-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-otros-documentos {
	background-image: url(../img/otros-documentos.jpg);
}

#sidebar nav ul li.menu-otros-documentos:hover, #sidebar nav ul li.menu-otros-documentos.select {
	color: #fff;
	background-image: url(../img/otros-documentos-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-foro {
	background-image: url(../img/administracion.jpg);
}

#sidebar nav ul li.menu-foro:hover, #sidebar nav ul li.menu-foro.select {
	color: #fff;
	background-image: url(../img/administracion-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-encuestas {
	background-image: url(../img/encuestas.jpg);
}

#sidebar nav ul li.menu-encuestas:hover, #sidebar nav ul li.menu-encuestas.select {
	color: #fff;
	background-image: url(../img/encuestas-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-excel-respuestas {
	background-image: url(../img/excel-respuestas.jpg);
}

#sidebar nav ul li.menu-excel-respuestas:hover, #sidebar nav ul li.menu-excel-respuestas.select {
	color: #fff;
	background-image: url(../img/excel-respuestas-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-corregir-simulacro {
	background-image: url(../img/corregir-simulacro.jpg);
}

#sidebar nav ul li.menu-corregir-simulacro:hover, #sidebar nav ul li.menu-corregir-simulacro.select {
	color: #fff;
	background-image: url(../img/corregir-simulacro-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-mis-informes {
	background-image: url(../img/mis-informes.jpg);
}

#sidebar nav ul li.menu-mis-informes:hover, #sidebar nav ul li.menu-mis-informes.select {
	color: #fff;
	background-image: url(../img/mis-informes-inactive.jpg);
	border-color: @Color1;
}

#sidebar nav ul li.menu-mi-evolucion {
	background-image: url(../img/mi-evolucion.jpg);
}

#sidebar nav ul li.menu-mi-evolucion:hover, #sidebar nav ul li.menu-mi-evolucion.select {
	color: #fff;
	background-image: url(../img/mi-evolucion-inactive.jpg);
	border-color: @Color1;
}

/* -- SIDEBAR-MOBILE ------------------------------------- */

#sidebar-mobile {
	z-index: 1;
	display: none;
	position: fixed;
	top:73px;
	left: -2px;
	width: 31px;
	height: 31px;
	background: url(../img/menu.png) no-repeat center center @Color1;
	border: 1px solid rgba(0,0,0,0.3);
	.border;
}

/* -- CONTENT ------------------------------------- */

#content {
	position: relative;
	float: left;
	width: 80%;
	min-height: 550px;
	min-height: 85vh;
	color: #000;
	background-color: #fff;
}

#body-content > h3 {
	margin: 30px;
}

#dark-layer {
	z-index: 1;
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.5);
}

.form form .label-aprobar {
	width: auto;
	min-width: 400px;
    display: inline-block;
    margin-bottom: 25px;
}

/* -- FORO ------------------------------------- */

#vanilla-comments {
	min-height: 1000px;
}

/* -- ESTADÍSITCAS ------------------------------------- */

.PDS_Poll {
	float: left;
	width: 30%;
	margin-right: 2%;
	margin-bottom: 15px;
}

.PDS_Poll .pds-box {
	width: 100% !important;
}

/* -- TABLES ------------------------------------- */

.table-content {
	padding: 20px;
	font-size: 12px;
}

.table-content .datatable {
	width: 100% !important;
}

.table-content .dataTables_scrollHeadInner {
	width: 100% !important;
}

/* -- FOOTER ------------------------------------- */

#footer {
	z-index: 3;
	position: relative;
	float: left;
	width: 100%;
	height: 45px;
	padding: 10px 0;
	color: #ccc;
	background-color: #222;
	border-top: 1px solid #000;
}

/* COPYRIGHT */

#footer .copyright {
	float: left;
	width: 20%;
	padding: 5px 0;
	font-size: 12px;
	font-size: 0.75rem;
	letter-spacing: 0.5px;
	text-align: center;
	border-right: 1px solid #444;
}

#footer .copyright p {
	color: #ccc;
}

/* MENU */

#footer .menu {
	float: left;
	width: 40%;
	padding: 5px 0 5px 30px;
	font-size: 12px;
	font-size: 0.75rem;
	letter-spacing: 0.5px;
	text-align: left;
}

#footer .menu li {
	display: inline-block;
	padding-right: 10px;
	padding-left: 4px;
	background: url(../img/dot-menu-footer.jpg) no-repeat right center transparent;
}

#footer .menu li:first-child {
	padding-left: 0;
}

#footer .menu li:last-child {
	background: none;
}

#footer .menu li a {
	color: #ccc;
	.efectTransition;
}

#footer .menu li a:hover {
	color: #fff;
}

/* LINKS */

#footer .links {
	float: left;
	width: 40%;
	padding-right: 30px;
	text-align: right;
}

#footer .links a {
	display: inline-block;
	padding: 6px 10px 6px 10px;
	color: #fff;
	font-size: 12px;
	font-size: 0.7rem;
	letter-spacing: 0.5px;
	background-color: #444;
	.insetShadowBottom(2.5px,0.3);
	border: 1px solid #111;
	.border;
	.efectTransition;
}

#footer .links a.app {
	padding-right: 25px;
	background: url(../img/arrow-download-box.png) no-repeat right top #444;
}

#footer .links a:hover {
	background-color: #555;
}

/* -- COOKIES ------------------------------------ */

#cookies-bar {
	display: none;
    position: fixed;
    right: 15px;
    bottom: 15px;
    width: 30%;
    padding: 8px;
    text-align: left;
    min-height: 40px;
    background-color: @Color1;
    color: #fff;
    border: 1px solid @Color2;
    z-index: 99999;
    .border;
}
 
/*#cookies-bar span {
    position: absolute;
    top: -8px;
    left: -8px;
    width: 18px;
    height: 18px;
    padding: 3px 1px 3px 0px;
    color: #fff;
    font-size: 12px;
    text-align: center;
    background-color: @Color1;
    .border(100px);
}
 
#cookies-bar span:hover {
	cursor: pointer;
    background-color: @Color2;
    .efectTransition;
}*/
 
#cookies-bar .inner {
    width: 90%;
    padding-left: 5px;
    color: #fff;
    font-family: verdana;
    font-size: 11px;
    line-height: 15px;
    top: 30%;
}
 
#cookies-bar .inner a.ok {
	position:absolute;
	top: 5px;
	right: 7px;
	display: inline-block;
	margin-top: 5px;
    margin-right: 2px;
    padding: 2px 8px 2px 6px;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    background-color: @Color2;
    .border;
}
 
#cookies-bar .inner a.ok:hover {
	cursor: pointer;
    background-color: @Color2;
    .efectTransition;
}
 
#cookies-bar .inner a.info {
    font-weight: bold;
    text-decoration: none;
    color: @Color2;
}

/* ---------------------------------------------------------------
-- INDEX ---------------------------------------------------------
--------------------------------------------------------------- */

@import 'index.less';

/* ---------------------------------------------------------------
-- PROFESORES Y ALUMNOS ------------------------------------------
--------------------------------------------------------------- */

@import 'profesores-y-alumnos.less';

/* ---------------------------------------------------------------
-- ORDENAR -------------------------------------------------------
--------------------------------------------------------------- */

@import 'ordenar.less';

/* ---------------------------------------------------------------
-- FORO ----------------------------------------------------------
--------------------------------------------------------------- */

@import 'foro.less';

/* ---------------------------------------------------------------
-- REGISTER REQUIREMENT ------------------------------------------
--------------------------------------------------------------- */

@import 'register-requirement.less';

/* ---------------------------------------------------------------
-- REQUIREMENT ---------------------------------------------------
--------------------------------------------------------------- */

@import 'requirement.less';

/* ---------------------------------------------------------------
-- EDIT REQUIREMENT ----------------------------------------------
--------------------------------------------------------------- */

@import 'edit-requirement.less';

/* ---------------------------------------------------------------
-- LOGIN ---------------------------------------------------------
--------------------------------------------------------------- */

@import 'login.less';

/* ---------------------------------------------------------------
-- LOST PASSWORD -------------------------------------------------
--------------------------------------------------------------- */

@import 'lost-password.less';

/* ---------------------------------------------------------------
-- CHANGE PASSWORD -----------------------------------------------
--------------------------------------------------------------- */

@import 'change-password.less';

/* ---------------------------------------------------------------
-- CONFIRM EMAIL -------------------------------------------------
--------------------------------------------------------------- */

@import 'confirm-email.less';

/* ---------------------------------------------------------------
-- REGISTER ------------------------------------------------------
--------------------------------------------------------------- */

@import 'registro.less';

/* ---------------------------------------------------------------
-- ACCOUNT -------------------------------------------------------
--------------------------------------------------------------- */

@import 'account.less';

/* ---------------------------------------------------------------
-- CONTACT US ----------------------------------------------------
--------------------------------------------------------------- */

@import 'contact-us.less';

/* ---------------------------------------------------------------
-- LEGAL ---------------------------------------------------------
--------------------------------------------------------------- */

@import 'legal.less';

/* ---------------------------------------------------------------
-- PRIVACY POLICY ------------------------------------------------
--------------------------------------------------------------- */

@import 'privacy-policy.less';

/* ---------------------------------------------------------------
-- ALUMNOS ------------------------------------------------
--------------------------------------------------------------- */

@import 'alumnos.less';

/* ---------------------------------------------------------------
-- MI PERFIL ------------------------------------------------
--------------------------------------------------------------- */

@import 'mi-perfil.less';

/* ---------------------------------------------------------------
-- CURSO ------------------------------------------------
--------------------------------------------------------------- */

@import 'curso.less';

/* ------------------------------------------------------------------
----- MEDIA QUERIES -------------------------------------------------
------------------------------------------------------------------ */

@media (min-width: 1500px) { /* --------------------------------------------------------*/
	
	body {
		background-color: #ddd;
	}
	
	#center {
		border-right: 1px solid #aaa;
		border-left: 1px solid #aaa;
		-webkit-box-shadow: 0 0 5px 5px rgba(0,0,0,0.1); 
		-moz-box-shadow: 0 0 5px 5px rgba(0,0,0,0.1); 
		box-shadow: 0 0 5px 5px rgba(0,0,0,0.1); 
	}
	
	#header {
		position: relative;
	}
	
	#main {
		padding-top: 0;
	}

}

@media (min-width: 1150px) and (max-width: 1300px) { /* --------------------------------------------------------*/
	
	.PDS_Poll {
		width: 45% !important;
	}

}

@media (min-width: 1000px) and (max-width: 1149px) { /* --------------------------------------------------------*/

	/* HEADER */

	#header {
		height: 63px;
	}

	#header .logo {
		width: 18%;
	}

	#header .logo img {
		height: 60px;
	}

	#header .links {
		width: 48%;
		margin-top: 3px;
		padding-bottom: 0;
	}

	#header .links .app {
		display: none;
	}

	#header .links .login-register a {
		font-size: 11px;
		font-size: 0.7;
	}

	#header .links .login-register > a:last-child {
		margin-top: -2px;
		margin-left: 8px;
		padding-top: 8px;
		padding-bottom: 8px;
		padding-left: 10px;
	}

	/* MAIN */

	#main {
		padding-top: 63px;
	}

	#sidebar {
		width: 22%;
	}

	#content {
		width: 78%;
	}

	#content .banner {
		padding: 10px 30px;
	}

	.exam .res label {
		display: inline-block;
	}

	.exam .res .subject {
		margin-top: 10px !important;
		margin-left: 0 !important;
		margin-right: 5px !important;
	}
	
	/* SIDEBAR */

	#sidebar .sell .sell-text {
		margin-top: 5px;
		padding-left: 0;
		border: 0;
		transform: rotate(0);
	}

	#sidebar .sell ul {
		margin-top: 30px;
		margin-left: 0;
	}

	#sidebar .sell ul li {
		padding-left: 0;
	}

	#sidebar .buy .buy-text {
		margin-top: 5px;
		padding-left: 0;
		border: 0;
		transform: rotate(0);
	}

	#sidebar .buy ul {
		margin-top: 30px;
		margin-left: 0;
	}

	#sidebar .buy ul li {
		padding-left: 0;
	}

	#sidebar .seafood {
		padding-left: 15px;
	}

	#sidebar .search {
		padding: 15px;
	}

	#sidebar .search button {
		top: 21px;
		right: 16px;
	}

	/* CONTENT */

	#header-content {
		padding-top: 22px;
		padding-bottom: 22px;
	}
	
	.PDS_Poll {
		width: 45% !important;
	}

	/* FOOTER */

	#footer .copyright {
		width: 23%;
	}

	#footer .copyright p {
		padding-top: 3px;
		font-size: 0.6rem;
	}

	#footer .menu {
		width: 37%;
		padding-top: 6px;
		padding-left: 20px;
	}

	#footer .menu a {
		font-size: 0.6rem;
	}

	#footer .links {
		padding-right: 20px;
	}

}

@media (min-width: 800px) and (max-width: 999px) { /* --------------------------------------------------------*/

	/* HEADER */

	#header {
		height: 63px;
	}

	#header .logo {
		width: 23%;
	}

	#header .logo img {
		height: 60px;
	}

	#header .links {
		width: 43%;
		margin-top: 3px;
		padding-bottom: 0;
	}

	#header .links .app {
		display: none;
	}

	#header .links .login-register a {
		font-size: 11px;
		font-size: 0.7;
	}

	#header .links .login-register > a:last-child {
		margin-top: -2px;
		margin-left: 8px;
		padding-top: 8px;
		padding-bottom: 8px;
		padding-left: 10px;
	}

	/* MAIN */

	#main {
		padding-top: 63px;
	}

	#sidebar {
		width: 25%;
	}

	#content {
		width: 75%;
	}

	#content .banner {
		padding: 10px 30px;
	}

	.publications li {
		width: 45%;
	}

	.folders li {
		width: 45%;
	}

	.exam .res label {
		display: inline-block;
	}

	.exam .res .subject {
		margin-top: 10px !important;
		margin-left: 0 !important;
		margin-right: 5px !important;
	}

	.exam .res label {
		display: inline-block;
	}

	.exam .res .subject {
		margin-top: 10px !important;
		margin-left: 0 !important;
		margin-right: 5px !important;
	}

	.exam .res .comment {
		width: 100%;
		margin: 10px 0 !important;
	}

	.users .user {
		width: 47%;
	}
	
	/* SIDEBAR */

	#sidebar .sell .sell-text {
		margin-top: 5px;
		padding-left: 0;
		border: 0;
		transform: rotate(0);
	}

	#sidebar .sell ul {
		margin-top: 30px;
		margin-left: 0;
	}

	#sidebar .sell ul li {
		padding-left: 0;
	}

	#sidebar .buy .buy-text {
		margin-top: 5px;
		padding-left: 0;
		border: 0;
		transform: rotate(0);
	}

	#sidebar .buy ul {
		margin-top: 30px;
		margin-left: 0;
	}

	#sidebar .buy ul li {
		padding-left: 0;
	}

	#sidebar .seafood {
		padding-left: 15px;
	}

	#sidebar .search {
		padding: 15px;
	}

	#sidebar .search button {
		top: 21px;
		right: 16px;
	}

	/* CONTENT */

	#header-content {
		padding-top: 22px;
		padding-bottom: 22px;
	}

	.form form label input {
		width: 50%;
	}
	
	.PDS_Poll {
		width: 45% !important;
	}

	/* FOOTER */

	#footer .copyright {
		width: 23%;
	}

	#footer .copyright p {
		padding-top: 3px;
		font-size: 0.6rem;
	}

	#footer .menu {
		width: 37%;
		padding-top: 6px;
		padding-left: 20px;
	}

	#footer .menu a {
		font-size: 0.6rem;
	}

	#footer .links {
		padding-right: 20px;
	}

}

@media (min-width: 650px) and (max-width: 799px) { /* --------------------------------------------------------*/

	/* HEADER */

	#header {
		height: 63px;
	}

	#header .logo {
		width: 27%;
	}

	#header .logo img {
		height: 60px;
	}

	#select-course {
		min-width: auto !important;
	}

	#header .links {
		width: 39%;
		margin-top: 3px;
		padding-bottom: 0;
		padding-left: 0;
	}

	#header .links .app {
		display: none;
	}

	#header .links .login-register a {
		font-size: 11px;
		font-size: 0.7;
	}

	#header .links .login-register > a:last-child {
		margin-top: -2px;
		margin-left: 8px;
		padding-top: 8px;
		padding-bottom: 8px;
		padding-left: 10px;
	}

	/* MAIN */

	#main {
		padding-top: 63px;
	}

	#sidebar {
		width: 33%;
	}

	#main #sidebar-mobile {
		display: block;
	}

	#content {
		width: 67%;
	}

	#content .banner {
		padding: 10px 20px 10px 20px;
	}

	.publications li {
		width: 45%;
	}

	.folders li {
		width: 45%;
	}

	.exam .res label {
		display: inline-block;
	}

	.exam .res .subject {
		margin-top: 10px !important;
		margin-left: 0 !important;
		margin-right: 5px !important;
	}

	.exam .res .comment {
		width: 100%;
		margin: 10px 0 !important;
	}

	.users .user {
		width: 98%;
	}
	
	/* SIDEBAR */

	#sidebar .sell .sell-text {
		margin-top: 5px;
		padding-left: 0;
		border: 0;
		transform: rotate(0);
	}

	#sidebar .sell ul {
		margin-top: 30px;
		margin-left: 0;
	}

	#sidebar .sell ul li {
		padding-left: 0;
	}

	#sidebar .buy .buy-text {
		margin-top: 5px;
		padding-left: 0;
		border: 0;
		transform: rotate(0);
	}

	#sidebar .buy ul {
		margin-top: 30px;
		margin-left: 0;
	}

	#sidebar .buy ul li {
		padding-left: 0;
	}

	#sidebar .seafood {
		padding-left: 15px;
	}

	#sidebar .search {
		padding: 15px;
	}

	#sidebar .search button {
		top: 21px;
		right: 16px;
	}

	/* CONTENT */

	#header-content {
		padding-top: 22px;
		padding-bottom: 22px;
		padding-left: 40px;
	}

	.form form label input {
		width: 50%;
	}
	
	.PDS_Poll {
		width: 95% !important;
	}

	/* FOOTER */

	#footer .copyright {
		width: 27%;
	}

	#footer .copyright p {
		padding-top: 3px;
		font-size: 0.6rem;
	}

	#footer .menu {
		width: 32%;
		padding-top: 6px;
		padding-left: 20px;
	}

	#footer .menu a {
		font-size: 0.6rem;
	}

	#footer .links {
		padding-right: 20px;
	}

}

@media (min-width: 550px) and (max-width: 649px) { /* --------------------------------------------------------*/

	/* HEADER */

	#header {
		height: 53px;
	}

	#header .logo {
		width: 25%;
	}

	#header .logo img {
		margin-top: 3px;
		height: 45px;
	}

	#header .submenu {
		width: 45%;
		margin-top: 13px;
	}

	#select-course {
		min-width: auto !important;
	}

	#header .links {
		width: 30%;
		margin-top: -2px;
		padding-bottom: 0;
	}

	#header .links .app {
		display: none;
	}

	#header .links .login-register {
		margin-left: 15px;
	}

	#header .links .login-register a {
		font-size: 11px;
		font-size: 0.7;
	}

	#header .links .login-register > a:last-child {
		margin-top: -2px;
		margin-left: 8px;
		padding-top: 8px;
		padding-bottom: 8px;
		padding-left: 10px;
	}

	.login-register .name {
		display: none;
	}

	/* MAIN */

	#main {
		padding-top: 53px;
	}

	#sidebar {
		position: fixed;
		width: 50%;
		height: 100%;
		margin-left: -50%;
		color: #444;
		background-color: @Color4;
		border-right: 1px solid #aaa;
		.insetShadowRight;
		.efectTransition;
	}

	#main #sidebar-mobile {
		display: block;
		top: 63px;
	}

	#content {
		width: 100%;
	}

	#content .banner {
		padding: 8px 30px 8px 40px;
	}

	.publications li {
		width: 45%;
	}

	.folders li {
		width: 45%;
	}

	.exam .res label {
		display: inline-block;
	}

	.exam .res .subject {
		margin-top: 10px !important;
		margin-left: 0 !important;
		margin-right: 5px !important;
	}

	.exam .res .comment {
		width: 100%;
		margin: 10px 0 !important;
	}

	.users .user {
		width: 47%;
	}
	
	/* SIDEBAR */

	#sidebar .sell .sell-text {
		margin-top: 5px;
		padding-left: 0;
		border: 0;
		transform: rotate(0);
	}

	#sidebar .sell ul {
		margin-top: 30px;
		margin-left: 0;
	}

	#sidebar .sell ul li {
		padding-left: 0;
	}

	#sidebar .buy .buy-text {
		margin-top: 5px;
		padding-left: 0;
		border: 0;
		transform: rotate(0);
	}

	#sidebar .buy ul {
		margin-top: 30px;
		margin-left: 0;
	}

	#sidebar .buy ul li {
		padding-left: 0;
	}

	#sidebar .seafood {
		padding-left: 15px;
		background-image: none;
	}

	#sidebar .search {
		padding: 15px;
	}

	#sidebar .search button {
		top: 21px;
		right: 16px;
	}

	/* CONTENT */

	#header-content {
		padding-top: 22px;
		padding-bottom: 22px;
		padding-left: 40px;
	}

	.form form label input {
		width: 50%;
	}
	
	.PDS_Poll {
		width: 45% !important;
	}

	/* FOOTER */

	#footer .copyright {
		width: 30.5%;
	}

	#footer .copyright p {
		padding-top: 3px;
		font-size: 0.6rem;
	}

	#footer .menu {
		width: 23.5%;
		padding-top: 6px;
		padding-left: 10px;
	}

	#footer .menu a {
		font-size: 0.6rem;
	}

	#footer .links {
		width: 46%;
		padding-right: 20px;
	}
	
}

@media (min-width: 450px) and (max-width: 549px) { /* --------------------------------------------------------*/

	/* HEADER */

	#header {
		height: 53px;
	}

	#header .logo {
		width: 25%;
	}

	#header .logo img {
		margin-top: 3px;
		height: 45px;
	}

	#header .submenu {
		width: 38%;
		margin-top: 4px;
	}

	#header .submenu .button {
		display: inline-block;
		font-size: 10px !important;
	}

	#select-course {
		min-width: auto !important;
		display: block;
		margin-bottom: 2px;
		font-size: 10px !important;
	}

	#header .links {
		width: 37%;
		margin-top: -2px;
		padding-bottom: 0;
	}

	#header .links .app {
		display: none;
	}

	#header .links .login-register {
		margin-left: 15px;
	}

	#header .links .login-register a {
		font-size: 11px;
		font-size: 0.7;
	}

	#header .links .login-register > a:last-child {
		margin-top: -2px;
		margin-left: 8px;
		padding-top: 8px;
		padding-bottom: 8px;
		padding-left: 10px;
	}

	.login-register .name {
		display: none;
	}

	/* MAIN */

	#main {
		padding-top: 53px;
	}

	#sidebar {
		position: fixed;
		width: 50%;
		height: 100%;
		margin-left: -50%;
		color: #444;
		background-color: @Color4;
		border-right: 1px solid #aaa;
		.insetShadowRight;
		.efectTransition;
	}

	#main #sidebar-mobile {
		display: block;
		top: 63px;
	}

	#content {
		width: 100%;
	}

	#content .banner {
		padding: 8px 30px 8px 40px;
	}

	.publications li {
		width: 45%;
	}

	.folders li {
		width: 45%;
	}

	.exam .res .number {
		margin-bottom: 10px !important;
	}

	.exam .res label {
		display: block;
		border-right: 0;
	}

	.exam .res label.first {
		padding-left: 0 !important;
		border-left: 0 !important;
	}

	.exam .res .subject {
		margin-top: 10px !important;
		margin-left: 0 !important;
		margin-right: 5px !important;
	}

	.exam .res .comment {
		width: 100%;
		margin: 10px 0 !important;
	}

	.users .user {
		width: 98%;
	}
	
	/* SIDEBAR */

	#sidebar .sell .sell-text {
		margin-top: 5px;
		padding-left: 0;
		border: 0;
		transform: rotate(0);
	}

	#sidebar .sell ul {
		margin-top: 30px;
		margin-left: 0;
	}

	#sidebar .sell ul li {
		padding-left: 0;
	}

	#sidebar .buy .buy-text {
		margin-top: 5px;
		padding-left: 0;
		border: 0;
		transform: rotate(0);
	}

	#sidebar .buy ul {
		margin-top: 30px;
		margin-left: 0;
	}

	#sidebar .buy ul li {
		padding-left: 0;
	}

	#sidebar .seafood {
		padding-left: 15px;
		background-image: none;
	}

	#sidebar .search {
		padding: 15px;
	}

	#sidebar .search button {
		top: 21px;
		right: 16px;
	}

	/* CONTENT */

	#header-content {
		padding-top: 22px;
		padding-bottom: 22px;
		padding-left: 40px;
	}

	.form form label input {
		width: 50%;
	}
	
	.PDS_Poll {
		width: 45% !important;
	}

	/* FOOTER */

	#footer .copyright {
		width: 40%;
	}

	#footer .copyright p {
		padding-top: 3px;
		font-size: 0.6rem;
	}

	#footer .menu {
		width: 30%;
		padding-top: 6px;
		padding-left: 10px;
	}

	#footer .menu a {
		font-size: 0.6rem;
	}

	#footer .links {
		width: 30%;
		padding-right: 20px;
	}

	#footer .links a:last-child {
		display: none;
	}
	
}

@media (min-width: 1px) and (max-width: 449px) { /* --------------------------------------------------------*/

	/* HEADER */

	#header {
		height: 53px;
	}

	#header .logo {
		width: 30%;
	}

	#header .logo img {
		margin-top: 10px;
		height: 35px;
	}

	#header .submenu {
		width: 33%;
		margin-top: 4px;
	}

	#header .submenu .button {
		display: inline-block;
		font-size: 9px !important;
	}

	#select-course {
		min-width: auto !important;
		display: block;
		margin-bottom: 2px;
		font-size: 10px !important;
	}

	#header .links {
		width: 35%;
		margin-top: -2px;
		padding: 16px 10px;
		padding-bottom: 0;
	}

	#header .social {
		display: none;
	}

	#header .links .app {
		display: none;
	}

	#header .links .login-register {
		margin-left: 0px;
	}

	#header .links .login-register a {
		font-size: 11px;
		font-size: 0.7rem;
	}

	#header .links .login-register > a:last-child {
		margin-top: -2px;
		margin-left: 5px;
		padding-top: 8px;
		padding-bottom: 8px;
		padding-left: 7px;
	}

	.login-register .name {
		display: none;
	}

	/* MAIN */

	#main {
		padding-top: 53px;
	}

	#sidebar {
		position: fixed;
		width: 75%;
		height: 100%;
		margin-left: -75%;
		color: #444;
		background-color: @Color4;
		border-right: 1px solid #aaa;
		.insetShadowRight;
		.efectTransition;
	}

	#main #sidebar-mobile {
		display: block;
		top: 63px;
	}

	#content {
		width: 100%;
	}

	#content .banner {
		padding: 8px 30px 8px 40px;
	}

	.publications li {
		width: 95%;
	}

	.folders li {
		width: 95%;
	}

	.exam .res .number {
		margin-bottom: 10px !important;
	}

	.exam .res label {
		display: block;
		border-right: 0;
	}

	.exam .res label.first {
		padding-left: 0 !important;
		border-left: 0 !important;
	}

	.exam .res .subject {
		margin-top: 10px !important;
		margin-left: 0 !important;
		margin-right: 5px !important;
	}

	.exam .res .comment {
		width: 100%;
		margin: 10px 0 !important;
	}

	.users .user {
		width: 98%;
	}
	
	/* SIDEBAR */

	#sidebar .sell .sell-text {
		margin-top: 5px;
		padding-left: 0;
		font-size: 16px;
		font-size: 1rem;
		border: 0;
		transform: rotate(0);
	}

	#sidebar .sell ul {
		margin-top: 25px;
		margin-left: 0;
	}

	#sidebar .sell ul li {
		padding-bottom: 5px;
		padding-left: 0;
	}

	#sidebar .sell ul li:last-child {
		padding-top: 5px;
	}

	#sidebar .buy .buy-text {
		margin-top: 5px;
		padding-left: 0;
		font-size: 16px;
		font-size: 1rem;
		border: 0;
		transform: rotate(0);
	}

	#sidebar .buy ul {
		margin-top: 25px;
		margin-left: 0;
	}

	#sidebar .buy ul li {
		padding-bottom: 5px;
		padding-left: 0;
	}

	#sidebar .buy ul li:last-child {
		padding-top: 5px;
	}

	#sidebar .seafood {
		padding: 17px 15px;
		background-image: none;
	}

	#sidebar .seafood .title {
		font-size: 16px;
		font-size: 1rem;
	}

	#sidebar .seafood .subtitle {
		font-size: 14px;
		font-size: 0.9rem;
	}

	#sidebar .search {
		padding: 15px;
	}

	#sidebar .search button {
		top: 21px;
		right: 16px;
	}

	/* CONTENT */

	#header-content {
		padding-top: 18px;
		padding-bottom: 18px;
		padding-left: 40px;
	}

	#header-content h1 span {
		font-size: 16px;
		font-size: 1rem;
	}

	#body-content {
		padding: 0 !important;
	}

	.form form label input {
		width: 100%;
	}
	
	.PDS_Poll {
		width: 95% !important;
	}

	/* FOOTER */

	#footer .copyright {
		width: 32%;
		margin-top: -3px;
		padding: 0;
	}

	#footer .copyright p {
		padding-top: 3px;
		font-size: 10px;
		font-size: 0.6rem;
		line-height: 13px;
		line-height: 0.8rem;
	}

	#footer .menu {
		width: 40%;
		padding-top: 6px;
		padding-left: 10px;
	}

	#footer .menu li {
		padding-right: 8px;
		padding-left: 0;
	}

	#footer .menu a {
		font-size: 0.6rem;
	}

	#footer .links {
		width: 28%;
		padding-right: 10px;
	}

	#footer .links a {
		padding: 6px 6px;
	}

	#footer .links a:last-child {
		display: none;
	}
	
}




































