/* swad_desktop.css:style-sheet for desktop layout of SWAD */

/*
    SWAD (Shared Workspace At a Distance),
    is a web platform developed at the University of Granada (Spain),
    and used to support university teaching.

    This file is part of SWAD core.
    Copyright (C) 1999-2018 Antonio Caņas Vargas

    This program is free software: you can redistribute it and/or modify
    it under the terms of the GNU Affero General 3 License as
    published by the Free Software Foundation,either version 3 of the
    License,or (at your option) any later version.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU Affero General Public License for more details.

    You should have received a copy of the GNU Affero General Public License
    along with this program.  If not,see <http://www.gnu.org/licenses/>.
*/
/********************************* Body **************************************/
body
	{
	margin:0;
	background-color:white;
	font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size:1em;
	overflow-y:scroll;	/* force vertical scrollbar */
	}
input	
	{
	font-size:12pt;
	}
select
	{
	font-size:12pt;
	}
textarea
	{
	font-size:13pt;
	font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
	}
table
	{
	box-sizing:border-box;
	border-width:0;
	border-style:none;
	border-spacing:0;
	}
table th
	{
	box-sizing:border-box;
	padding:0;
	color:#4D88A1;
	font-weight:bold;
	}
table td
	{
	box-sizing:border-box;
	padding:0;
	}
img
	{
	border-width:0;
	border-style:none;
	}
form
	{
	display:inline;
	margin:0;
	}
address
	{
	font-style: normal;
	}
hr.WHITE_SEPARA		{height:0; border-top:0; border-bottom:#707070 dotted 1px;}
hr.GREY_SEPARA		{height:0; border-top:0; border-bottom:#707070 dotted 1px;}
hr.BLUE_SEPARA		{height:0; border-top:0; border-bottom:#4D88A1 dotted 1px;}
hr.YELLOW_SEPARA	{height:0; border-top:0; border-bottom:#BD4815 dotted 1px;}

/*********************** Text decoration of links ****************************/
a
	{
	color:#4D88A1;
	}
a:link, a:visited, a:active
	{
	text-decoration:none;
	}
a:hover						/* Default ==> underlined */
	{
	text-decoration:underline;
	}	
.TAB_OFF a, .TAB_ON a, .MENU_LIST_ITEM a	/* Tabs and menus are the exceptions */
	{
	text-decoration:none;
	}

/****************** Layout (the whole page with a background) ****************/
#whole_page
	{
	display:table;
	box-sizing:border-box;
	width:100%;
	/*
	background-color:black;
	background-image:url('/swad/background.jpg');
	background-repeat:no-repeat;
	background-size:100%;
	*/
	}

/************************* Layout (first heading row) ************************/
#head_row_1
	{
	display:table;
	box-sizing:border-box;
	width:100%;
	height:40px;
	}
.HEAD_ROW_1_WHITE
	{
	background-color:black;
	}
.HEAD_ROW_1_GREY
	{
	background-image:-webkit-linear-gradient(#383838 0,#383838 26px,#404040 100%);	/* Safari */
	background-image:linear-gradient(#383838 0,#383838 26px,#404040 100%);
	background-repeat:no-repeat;
	}
.HEAD_ROW_1_BLUE
	{
	background-image:-webkit-linear-gradient(#5fa5df 0,#4f90c8 26px,#4f90c8 100%);	/* Safari */
	background-image:linear-gradient(#5fa5df 0,#4f90c8 26px,#4f90c8 100%);
	background-repeat:no-repeat;
	}
.HEAD_ROW_1_YELLOW
	{
	background-color:#201420;
	}

#head_row_1_left
	{
	display:table-cell;
	text-align:left;
	vertical-align:middle;
	}
@media only screen and (max-width: 1024px)
	{	/* For mobile-phones */
	#head_row_1_logo_small
		{
		display:inline-block;
		}
	#head_row_1_logo_big
		{
		display:none;
		}
	#head_row_1_tagline
		{
		display:none;
    		}
	}
@media only screen and (min-width: 1024px)
	{	/* For tablets and desktop */
	#head_row_1_logo_small
		{
		display:none;
		}
	#head_row_1_logo_big
		{
		display:inline-block;
		}
	#head_row_1_tagline
		{
		display:inline-block;
		box-sizing:border-box;
		padding:0 4px;
		font-size:11pt;
		font-weight:bold;
		line-height:110%;
		white-space:nowrap;
		text-align:left;
		vertical-align:middle;
		}
	}
.WHITE_TAGLINE	{color:#B0B0B0;}
.GREY_TAGLINE	{color:#E0E0E0;}
.BLUE_TAGLINE	{color:#BAD2DA;}
.YELLOW_TAGLINE	{color:#B3B0B3;}

#head_row_1_search
	{
	display:inline-block;
	padding:0 10px;
	}
@media only screen and (max-width: 1280px)
	{	/* For mobile phones and tablets */
	#head_search_text
		{
		display:none;
    		}
	}

@media only screen and (max-width: 480px)
	{	/* For mobile phones */
	.SEL_ROLE	{width:55px;}
	.HEAD_USR
		{
		display:inline-block;
		box-sizing:border-box;
		max-width:200px;
		text-align:left;
		vertical-align:middle;
		white-space:nowrap;
		overflow:hidden;
		text-overflow:ellipsis;
		}
	}
@media only screen and (min-width: 480px)
	{	/* For mobile phones */
	.SEL_ROLE	{width:130px;}
	.HEAD_USR
		{
		display:inline-block;
		box-sizing:border-box;
		max-width:320px;
		text-align:left;
		vertical-align:middle;
		white-space:nowrap;
		overflow:hidden;
		text-overflow:ellipsis;
		}
	}
.WHITE_USR		{color:#E0E0E0; font-size:15pt; font-weight:bold; white-space:nowrap;}
.GREY_USR		{color:#E0E0E0; font-size:15pt; font-weight:bold; white-space:nowrap;}
.BLUE_USR		{color:white;   font-size:15pt; font-weight:bold; white-space:nowrap;}
.YELLOW_USR		{color:#B3B0B3; font-size:15pt; font-weight:bold; white-space:nowrap;}

#head_row_1_right
	{
	display:table-cell;
	text-align:right;
	vertical-align:middle;
	}
#login_box
	{
	display:inline;
	padding:0 10px;
	}
@media only screen and (max-width: 1024px)
	{	/* For mobile phones and tablets */
	#login_txt
		{
		display:none;
    		}
	}
.WHITE_HEAD	{color:#E0E0E0; font-size:12pt; white-space:nowrap;}
.GREY_HEAD	{color:#E0E0E0; font-size:12pt; white-space:nowrap;}
.BLUE_HEAD	{color:white;   font-size:12pt; white-space:nowrap;}
.YELLOW_HEAD	{color:#B3B0B3; font-size:12pt; white-space:nowrap;}

/************************ Layout (second heading row) ************************/
#head_row_2
	{
	display:table;
	box-sizing:border-box;
	width:100%;
	vertical-align:top;
	}
.HEAD_ROW_2_WHITE
	{
	background-image:-webkit-linear-gradient(#cfcfce 0,white 40px,white 100%);	/* Safari */
	background-image:linear-gradient(#cfcfce 0,white 40px,white 100%);
	}
.HEAD_ROW_2_GREY
	{
	background-color:#404040;
	}
.HEAD_ROW_2_BLUE
	{
	background-color:#4f90c8;
	}
.HEAD_ROW_2_YELLOW
	{
	background-color:#201420;
	}

/******************************* Current time ********************************/
#head_row_2_time
	{
	display:table-cell;
	box-sizing:border-box;
	width:160px;
	text-align:center;
	vertical-align:middle;
	}
#current_date
	{
	box-sizing:border-box;
	background-color:rgba(255, 255, 255, 0.8);
	width:80px;
	margin-left:6px;
	border-radius:4px;
	box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 2px 1px -2px rgba(0,0,0,0.2), 0 1px 5px 0 rgba(0,0,0,0.12);
	}
#current_month
	{
	border-radius:4px 4px 0 0;
	background-color:rgba(222, 33, 33, 0.8);
	color:white;
	font-size:10pt;
	font-weight:bold;
	white-space:nowrap;
	overflow:hidden;
	}
.CURRENT_MONTH
	{
	color:white;
	}
#current_day
	{
	color:#606060;
	margin:2px 0 -2px 0;
	font-size:20pt;
	font-weight:bold;
	line-height:100%;
	}
.CURRENT_DAY
	{
	color:#606060;
	}
#current_time
	{
	border-radius:0 0 4px 4px;
	color:#606060;
	font-size:12pt;
	font-weight:bold;
	}
	
@media only screen and (max-width: 1024px)
	{	/* For mobile phones */
	#head_row_2_time
		{
		display:none;
    		}
	}

/****** Breadcrumb (platform/country/institution/centre/degree/course) *******/
#head_row_2_hierarchy
	{
	display:table-cell;
	text-align:center;
	vertical-align:middle;
	}
.TOP_LOGO	/* Institution / Centre / Degree logo in top title */
	{
	height:40px;
	margin-right:10px;
	text-align:left;
	vertical-align:top !important;
	}
@media only screen and (max-width: 480px)
	{	/* For mobile-phones */
	#breadcrumb
		{
		display:table;
		margin:0 auto;
		font-size:6pt;
		font-weight:bold;
		white-space:nowrap;
		}
	.BC
		{
		display:table-cell;
		max-width:28px;
		overflow:hidden;
		}
	}
@media only screen and (min-width: 480px) and (max-width: 800px)
	{	/* For mobile-phones */
	#breadcrumb
		{
		display:table;
		margin:0 auto;
		font-size:8pt;
		font-weight:bold;
		white-space:nowrap;
		}
	.BC
		{
		display:table-cell;
		max-width:60px;
		overflow:hidden;
		}
	}
@media only screen and (min-width: 800px) and (max-width: 1024px)
	{	/* For tablets */
	#breadcrumb
		{
		display:table;
		margin:0 auto;
		font-size:10pt;
		font-weight:bold;
		white-space:nowrap;
		}
	.BC
		{
		display:table-cell;
		max-width:100px;
		overflow:hidden;
		}
	}
@media only screen and (min-width: 1024px)
	{	/* For desktop */
	#breadcrumb
		{
		display:table;
		margin:0 auto;
		font-size:12pt;
		font-weight:bold;
		white-space:nowrap;
		}
	.BC
		{
		display:table-cell;
		max-width:150px;
		overflow:hidden;
		}
	}

.BC_SEMIOFF	{opacity:0.67;}
.BC_OFF		{opacity:0.33;}

.BC_WHITE	{color:#707070;}
.BC_GREY	{color:#FFB42E;}
.BC_BLUE	{color:#FFE880;}
.BC_YELLOW	{color:#FFC040;}

/******** Big name of country, institution, centre, degree or course *********/
#main_title
	{
	margin:0;
	padding:0;
	font-size:24pt;
	font-weight:normal;
	line-height:100%;
	white-space:nowrap;
	}
#big_name_container
	{
	display:inline-block;
	}
@media only screen and (max-width: 1024px)
	{	/* For mobile-phones */
	#big_short_name
		{
		display:table-cell;
		max-width:560px;
		height:40px;
		white-space:nowrap;
		overflow:hidden;
		text-overflow:ellipsis;
		margin:0 auto;
		vertical-align:middle;
		}
	#big_full_name
		{
		display:none;
		}
	}
@media only screen and (min-width: 1024px)
	{	/* For tablets and desktop */
	#big_short_name
		{
		display:none;
		}
	#big_full_name
		{
		display:table-cell;
		max-width:899px;
		height:40px;
		white-space:nowrap;
		overflow:hidden;
		text-overflow:ellipsis;
		margin:0 auto;
		vertical-align:middle;
		}
	}
.WHITE_COURSE	{color:#4D88A1;}
.GREY_COURSE	{color:#F7F6F5;}
.BLUE_COURSE	{color:white;}
.YELLOW_COURSE	{color:white;}
#my_courses
	{
	width:130px;
	margin:1px;
	}

/***************************** Notifications *********************************/
#msg	/* Notifications, used for AJAX based refresh */
	{
	display:table-cell;
	box-sizing:border-box;
	width:160px;
	text-align:center;
	vertical-align:top;
	padding-top:10px;
	}
@media only screen and (max-width: 1024px)
	{	/* For mobile phones */
	#msg
		{
		display:none;
    		}
	}
@media only screen and (min-width: 1024px) and (max-width: 1280px)
	{	/* For tablets */
	#notif_all
		{
		display:none;
    		}
	}
.WHITE_NOTIF		{color:#707070; font-size:12pt; white-space:nowrap;}
.GREY_NOTIF		{color:#E0E0E0; font-size:12pt; white-space:nowrap;}
.BLUE_NOTIF		{color:white;   font-size:12pt; white-space:nowrap;}
.YELLOW_NOTIF		{color:#B3B0B3; font-size:12pt; white-space:nowrap;}

/******************* Layout (third heading row with tabs) ********************/
.HEAD_ROW_3_WHITE
	{
	background-color:white;
	}
.HEAD_ROW_3_GREY
	{
	background-image:-webkit-linear-gradient(#404040 0,#404040 54px,white 54px,white 100%);	/* Safari */
	background-image:linear-gradient(#404040 0,#404040 54px,white 54px,white 100%);
	}
.HEAD_ROW_3_BLUE
	{
	background-image:-webkit-linear-gradient(#4f90c8 0,#4f90c8 54px,white 54px,white 100%);	/* Safari */
	background-image:linear-gradient(#4f90c8 0,#4f90c8 54px,white 54px,white 100%);
	}
.HEAD_ROW_3_YELLOW
	{
	background-image:-webkit-linear-gradient(#201420 0,#201420 54px,white 54px,white 100%);	/* Safari */
	background-image:linear-gradient(#201420 0,#201420 54px,white 54px,white 100%);
	}
@media only screen and (max-width: 480px)
	{	/* For mobile-phones */
	#tabs
		{
		display:table;
		box-sizing:border-box;
		margin:0 auto;
		border-spacing:1px 0;
		}
	.TAB_OFF
		{
		display:table-cell;
		box-sizing:border-box;
		width:38px;
		height:60px;
		margin:0;
		padding:0;
		border-radius:4px 4px 0 0;
		box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2);
		text-align:center;
		vertical-align:top;
		overflow:hidden;
		}
	.TAB_ON
		{
		display:table-cell;
		box-sizing:border-box;
		width:38px;
		height:60px;
		margin:0;
		padding:0;
		border-radius:4px 4px 0 0;
		box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2);
		text-align:center;
		vertical-align:top;
		overflow:hidden;
		}
	.TAB_TXT
		{
		font-size:9pt;
		font-weight:bold;
		line-height:100%;
		max-width:30px;
		white-space:nowrap;
		overflow:hidden;
		margin:0 auto;
		text-transform:uppercase;
		}
	}
@media only screen and (min-width: 480px) and (max-width: 800px)
	{	/* For mobile-phones */
	#tabs
		{
		display:table;
		box-sizing:border-box;
		margin:0 auto;
		border-spacing:1px 0;
		}
	.TAB_OFF
		{
		display:table-cell;
		box-sizing:border-box;
		width:58px;
		height:60px;
		margin:0;
		padding:0;
		border-radius:4px 4px 0 0;
		box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2);
		text-align:center;
		vertical-align:top;
		overflow:hidden;
		}
	.TAB_ON
		{
		display:table-cell;
		box-sizing:border-box;
		width:58px;
		height:60px;
		margin:0;
		padding:0;
		border-radius:4px 4px 0 0;
		box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2);
		text-align:center;
		vertical-align:top;
		overflow:hidden;
		}
	.TAB_TXT
		{
		font-size:9pt;
		font-weight:bold;
		line-height:100%;
		max-width:50px;
		white-space:nowrap;
		overflow:hidden;
		margin:0 auto;
		text-transform:uppercase;
		}
	}
@media only screen and (min-width: 800px)
	{	/* For tablets and desktop */
	#tabs
		{
		display:table;
		box-sizing:border-box;
		margin:0 auto;
		border-spacing:1px 0;
		}
	.TAB_OFF
		{
		display:table-cell;
		box-sizing:border-box;
		width:98px;
		height:60px;
		margin:0;
		padding:0;
		border-radius:4px 4px 0 0;
		box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2);
		text-align:center;
		vertical-align:top;
		overflow:hidden;
		}
	.TAB_ON
		{
		display:table-cell;
		box-sizing:border-box;
		width:98px;
		height:60px;
		margin:0;
		padding:0;
		border-radius:4px 4px 0 0;
		box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2);
		text-align:center;
		vertical-align:top;
		overflow:hidden;
		}
	.TAB_TXT
		{
		font-size:9pt;
		font-weight:bold;
		line-height:100%;
		max-width:90px;
		white-space:nowrap;
		overflow:hidden;
		margin:0 auto;
		text-transform:uppercase;
		}
	}

.TAB_ON_WHITE	{background-color:rgba(247, 246, 245, 0.99);}
.TAB_ON_GREY	{background-color:rgba(247, 246, 245, 0.99);}
.TAB_ON_BLUE	{background-color:rgba(232, 243, 246, 0.99);}
.TAB_ON_YELLOW	{background-color:rgba(255, 242, 189, 0.99);}

.TAB_OFF_WHITE	{background-color:#D4D4D4;}
.TAB_OFF_GREY	{background-color:#AEA79F;}
.TAB_OFF_BLUE	{background-color:#CAE1E8;}
.TAB_OFF_YELLOW	{background-color:#FADE94;}

.WHITE_TAB_OFF	{color:#707070;}
.GREY_TAB_OFF	{color:#505050;}
.BLUE_TAB_OFF	{color:#365E6E;}
.YELLOW_TAB_OFF	{color:#4A2E19;}

.WHITE_TAB_ON	{color:#4D88A1;}
.GREY_TAB_ON	{color:#606060;}
.BLUE_TAB_ON	{color:#4D88A1;}
.YELLOW_TAB_ON	{color:#BD4815;}

.TAB_ICO
	{
	width:36px;
	height:36px;
	vertical-align:middle;
	margin-top:2px;
	}

/*********************** Layout (fourth row, main zone) **********************/
#main_zone
	{
	display:table;
	box-sizing:border-box;
	width:100%;
	}
.LEFT_RIGHT_CELL
	{
	padding:0 6px 6px 6px;
	text-align:center;
	vertical-align:top;
	}

@media only screen and (max-width: 1280px)
	{	/* For mobile phones and tablets */
	#main_zone_central_none, #main_zone_central_left, #main_zone_central_right, #main_zone_central_both
		{
		display:table-cell;
		text-align:center;
		vertical-align:top;
		}
	#left_col
		{
		display:none;
		}
	#right_col
		{
		display:none;
		}
	}
@media only screen and (min-width: 1280px)
	{	/* For desktop */
	#main_zone_central_none /* Hide left and right columns */
		{
		display:table-cell;
		text-align:center;
		vertical-align:top;
		}
	#main_zone_central_left /* Show left column, hide right column */
		{
		display:table-cell;
		text-align:center;
		vertical-align:top;
		}
	#main_zone_central_right /* Hide left column, show right column */
		{
		display:table-cell;
		text-align:center;
		vertical-align:top;
		padding-right:160px;
		}
	#main_zone_central_both /* Show both columns */
		{
		display:table-cell;
		text-align:center;
		vertical-align:top;
		padding-right:160px;
		}
	#left_col
		{
		display:table-cell;
		box-sizing:border-box;
		width:160px;
		text-align:center;
		vertical-align:top;
		}
	#right_col
		{
		display:table-cell;
		box-sizing:border-box;
		width:160px;
		text-align:center;
		vertical-align:top;
		position:absolute;
		right:0;
		}
	}

@media only screen and (max-width: 800px)
	{	/* For mobile-phones */
	#main_zone_central_container
		{
		box-sizing:border-box;
		margin:-6px 0 0 0;
		padding:4px 0;
		border-radius:4px;
		box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2);
		text-align:center;
		vertical-align:top;
		position:relative;
		}
	}
@media only screen and (min-width: 800px)
	{	/* For tablets and desktop */
	#main_zone_central_container
		{
		box-sizing:border-box;
		min-height:900px;
		margin:-6px 0 0 0;
		padding:4px 0;
		border-radius:4px;
		box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2);
		text-align:center;
		vertical-align:top;
		position:relative;
		}
	}

/************* Main central zone with horizontal menu and canvas *************/
#main_horizontal
	{
	box-sizing:border-box;
	width:100%;
	}
#main_horizontal .MENU_LIST_CONTAINER
	{
	width:100%;
	}
#main_horizontal .MENU_LIST
	{
	display:table;
	box-sizing:border-box;
	height:60px;
	margin:0 auto;
	padding:0 8px;
	list-style-type:none;
	}
#main_horizontal .MENU_LIST_ITEM
	{
	display:table-cell;
	width:128px;
	height:60px;
	margin:0 auto;
	text-align:center;
	vertical-align:middle;
	}
#main_horizontal .MENU_OPT_OFF
	{
	opacity:0.67;
	}
#main_horizontal .MENU_OPT_OFF:hover, #main_horizontal .MENU_OPT_ON
	{
	opacity:1;
	transform:scale(1.286,1.286);
	}
#main_horizontal .MENU_ICO
	{
	box-sizing:border-box;
	padding:28px 0 0 0;
	background-size:28px 28px;
	background-repeat:no-repeat;
	background-position:center top;
	}
#main_horizontal .MAIN_ZONE_CANVAS	/* Where content for each action is written */
	{
	box-sizing:border-box;
	width:100%;
	padding:4px 8px;
	margin:0 auto;
	text-align:left;
	vertical-align:top;
	}

/************** Main central zone with vertical menu and canvas **************/
@media only screen and (max-width: 1024px)
	{	/* For mobile phones */
	/* Mobile phone will display menu always in horizontal
	   so the CSS must draw menu really in horizontal */
	#main_vertical
		{
		box-sizing:border-box;
		width:100%;
		}
	#main_vertical .MENU_LIST_CONTAINER
		{
		width:100%;
		}
	#main_vertical .MENU_LIST
		{
		display:table;
		box-sizing:border-box;
		height:60px;
		margin:0 auto;
		padding:0 8px;
		list-style-type:none;
		}
	#main_vertical .MENU_LIST_ITEM
		{
		display:table-cell;
		width:128px;
		height:60px;
		margin:0 auto;
		text-align:center;
		vertical-align:middle;
		}
	#main_vertical .MENU_OPT_OFF
		{
		opacity:0.67;
		}
	#main_vertical .MENU_OPT_OFF:hover, #main_vertical .MENU_OPT_ON
		{
		opacity:1;
		transform:scale(1.286,1.286);
		}
	#main_vertical .MENU_ICO
		{
		box-sizing:border-box;
		padding:28px 0 0 0;
		background-size:28px 28px;
		background-repeat:no-repeat;
		background-position:center top;
		}
	#main_vertical .MAIN_ZONE_CANVAS	/* Where content for each action is written */
		{
		box-sizing:border-box;
		width:100%;
		padding:4px 8px;
		margin:0 auto;
		text-align:left;
		vertical-align:top;
		}
	#action_title	/* Do not display action title */
		{
		display:none;
		}
	}

@media only screen and (min-width: 1024px)
	{	/* For tablets and desktop */
	#main_vertical
		{
		display:table;
		box-sizing:border-box;
		width:100%;
		}
	#main_vertical .MENU_LIST_CONTAINER
		{
		display:table-cell;
		box-sizing:border-box;
		width:170px;
		}
	#main_vertical .MENU_LIST
		{
		display:table;
		margin:0;
		padding-left:8px;
		list-style-type:none;
		}
	#main_vertical .MENU_LIST_ITEM
		{
		text-align:left;
		}
	#main_vertical .MENU_OPT_OFF
		{
		opacity:0.67;
		}
	#main_vertical .MENU_OPT_OFF:hover, #main_vertical .MENU_OPT_ON
		{
		opacity:1;
		}
	#main_vertical .MENU_ICO
		{
		display:table-cell;
		height:40px;
		vertical-align:middle;
		padding:2px 2px 2px 46px;
		background-size:36px 36px;
		background-repeat:no-repeat;
		background-position:2px 2px;
		}
	#main_vertical .MAIN_ZONE_CANVAS	/* Where content for each action is written */
		{
		display:table-cell;
		box-sizing:border-box;
		padding:4px 8px;
		margin:0 auto;
		text-align:left;
		vertical-align:top;
		}
	#action_title
		{
		box-sizing:border-box;
		width:400px;
		min-height:64px;
		clear:both;
		margin:0 auto;
		text-align:left;
		background-size:60px 60px;
		background-position:0 0;
		background-repeat:no-repeat;
		padding:4px 0 8px 70px;
		overflow:hidden;
		}
	}

/********************************* Menu fonts ********************************/
@media only screen and (max-width: 800px)
	{	/* For mobile-phones */
	.MENU_TEXT
		{
		font-size:12pt;
		font-weight:bold;
		line-height:110%;
		white-space:nowrap;
		overflow:hidden;
		width:30px;
		margin:0 auto;
		}
	}
@media only screen and (min-width: 800px)
	{	/* For tablets and desktop */
	.MENU_TEXT
		{
		font-size:12pt;
		font-weight:bold;
		line-height:110%;
		margin:0 auto;
		}
	}

.WHITE_MENU_OFF		{color:#4D88A1;}
.GREY_MENU_OFF		{color:#707070;}
.BLUE_MENU_OFF		{color:#4D88A1;}
.YELLOW_MENU_OFF	{color:#BD4815;}

.WHITE_MENU_ON		{color:#4D88A1;}
.GREY_MENU_ON		{color:#606060;}
.BLUE_MENU_ON		{color:#4D88A1;}
.YELLOW_MENU_ON		{color:#BD4815;}

/****************** Title of current action in main block ********************/
.WHITE_TITLE_ACTION	{color:#606060; font-size:20pt;}
.GREY_TITLE_ACTION	{color:#606060; font-size:20pt;}
.BLUE_TITLE_ACTION	{color:#4D88A1; font-size:20pt;}
.YELLOW_TITLE_ACTION	{color:#BD4815; font-size:20pt;}

.WHITE_SUBTITLE_ACTION	{color:#606060; font-size:12pt;}
.GREY_SUBTITLE_ACTION	{color:#606060; font-size:12pt;}
.BLUE_SUBTITLE_ACTION	{color:#4D88A1; font-size:12pt;}
.YELLOW_SUBTITLE_ACTION	{color:#BD4815; font-size:12pt;}

/***************************** Users connected *******************************/
.CONNECTED
	{
	box-sizing:border-box;
	margin:0 auto;
	background:white;
	border-style:solid;
	border-width:1px;
	border-color:#80C040;
	padding:5px;
	border-radius:4px;
	font-size:12pt;
	color:#398000;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}
.CONNECTED_LIST
	{
	box-sizing:border-box;
	margin-top:2px;
	padding-top:2px;
	border-style:solid;
	border-width:1px 0 0 0;
	border-color:#BFDF9F;
	white-space:nowrap;
	overflow:hidden;
	}
.CONNECTED_TXT
	{
	color:#398000;
	font-size:12pt;
	}
.CON_USR_NARROW_TIT
	{
	max-width:136px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	text-align:center;
	vertical-align:middle;
	}
.CON_USR_NARROW
	{
	width:68px;
	text-align:left;
	vertical-align:middle;
	}
.CON_USR_WIDE
	{
	width:320px;
	text-align:left;
	vertical-align:middle;
	}
.CON_NAME_NARROW
	{
	max-width:68px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}
.CON_NAME_WIDE
	{
	max-width:320px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}
.CON_NO_CRS	{color:#B8D070; font-size:11pt; line-height:110%; white-space:nowrap;}
.CON_CRS	{color:#398000; font-size:11pt; line-height:110%; white-space:nowrap;}

/*************************** Most frequent actions ***************************/
#MFU_actions
	{
	box-sizing:border-box;
	width:148px;
	margin:0;
	background:white;
	border-style:solid;
	border-width:1px;
	border-color:#8CBCCE;
	padding:5px;
	border-radius:4px;
	font-size:11pt;
	color:#4D88A1;
	}
#MFU_actions ul
	{
	box-sizing:border-box;
	width:138px;
	margin-top:2px;
	padding-top:2px;
	border-style:solid;
	border-width:1px 0 0 0;
	border-color:#DDECF1;
	}
#MFU_actions li
	{
	width:138px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}
#MFU_actions img
	{
	width:20px;
	height:20px;
	margin:1px;
	vertical-align:middle;
	}

#MFU_actions_big
	{
	padding:5px;
	}
#MFU_actions_big img
	{
	width:40px;
	height:40px;
	margin:1px 4px 1px 0;
	vertical-align:middle;
	}

/*********************************** Month ***********************************/
.MONTH_CONTAINER
	{
	box-sizing:border-box;
	width:148px;
	margin:0;
	padding:5px;
	background:white;
	border-style:solid;
	border-width:1px;
	border-color:#8CBCCE;
	border-radius:4px;
	text-align:center;
	overflow:hidden;
	}
.MONTH_TABLE_DAYS
	{
	box-sizing:border-box;
	width:138px;
	margin-top:2px;
	padding-top:2px;
	border-style:solid;
	border-width:1px 0 0 0;
	border-color:#DDECF1;
	}
.MONTH
	{
	color:#4D88A1;
	font-size:9pt;
	white-space:nowrap;
	text-transform:uppercase;
	}
.DAY_WRK_HEAD
	{
	color:#4D88A1;
	font-size:9pt;
	text-align:center;
	}
.DAY_NO_WRK_HEAD
	{
	color:red;
	font-size:9pt;
	text-align:center;
	}
.DAY_WRK
	{
	color:#202020;
	font-size:9pt;
	text-align:center;
	}
.DAY_NO_WORK
	{
	color:#C04080;
	font-size:9pt;
	text-align:center;
	}
.DAY_HLD
	{
	color:red;
	font-size:9pt;
	text-align:center;
	}
.DAY_WRK_LIGHT
	{
	color:#E0E0E0;
	font-size:9pt;
	text-align:center;
	}
.DAY_NO_WORK_LIGHT
	{
	color:#FFE0FF;
	font-size:9pt;
	text-align:center;
	}
.DAY_HLD_LIGHT
	{
	color:#FFE0E0;
	font-size:9pt;
	text-align:center;
	}
.DAY
	{
	border:solid 1px;
	border-color:white;
	text-align:center;
	}
.TODAY
	{
	border:solid 1px;
	border-color:#50B800;
	text-align:center;
	}
.DAY_EVENT
	{
	border:solid 1px;
	border-color:white;
	background-color:#FFF080;
	text-align:center;
	}
.TODAY_EVENT
	{
	border:solid 1px;
	border-color:#50B800;
	background-color:#FFF080;
	text-align:center;
	}

/********************************* Buttons ***********************************/
.BT_CREATE
	{
	background-color:#5BC33B;
	border:1px solid #518741;
	}
.BT_CONFIRM
	{
	background-color:#55ACEE;
	border:1px solid #3B88C3;
	}
.BT_REMOVE
	{
	background-color:#EF5555;
	border:1px solid #C33B3B;
	}
.BT_SUBMIT
	{
	margin:8px auto;
	padding:10px 20px;
	border-radius:4px;
	box-shadow:0 1px 0 rgba(255,255,255,0.15) inset;
	color:white;
	font-size:20px;
	font-weight:bold;
	line-height:normal;
	white-space:nowrap;
	}
.BT_SUBMIT_INLINE
	{
	box-sizing:border-box;
	min-width:170px;
	margin:0 10px;
	padding:2px 4px;
	border-radius:4px;
	box-shadow:0 1px 0 rgba(255,255,255,0.15) inset;
	color:white;
	font-size:15px;
	font-weight:bold;
	line-height:normal;
	white-space:nowrap;
	vertical-align:middle;
	}
.BT_SUBMIT:hover
	{
	background-image:-webkit-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.2));	/* Safari */
	background-image:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.2));
	}
.BT_SUBMIT_INLINE:hover
	{
	background-image:-webkit-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.2));	/* Safari */
	background-image:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.2));
	}

/********************************** Notice ***********************************/
.NOTICE_CONTAINER_ACTIVE
	{
	box-sizing:border-box;
	margin:0 auto 10px auto;
	padding:10px;
	background-image:-webkit-linear-gradient(rgba(238,216,108,0.8) 0%,rgba(248,237,149,0.8) 15%,rgba(250,240,152,0.8) 100%);	/* Safari */
	background-image:linear-gradient(rgba(238,216,108,0.8) 0%,rgba(248,237,149,0.8) 15%,rgba(250,240,152,0.8) 100%);	
	box-shadow:0 8px 10px -5px rgba(125,113,0,0.8);
	text-align:left;
	overflow:hidden;
	}
.NOTICE_CONTAINER_OBSOLETE
	{
	box-sizing:border-box;
	margin:0 auto 10px auto;
	padding:10px;
	background-image:-webkit-linear-gradient(rgba(238,216,108,0.4) 0%,rgba(248,237,149,0.4) 15%,rgba(250,240,152,0.4) 100%);	/* Safari */
	background-image:linear-gradient(rgba(238,216,108,0.4) 0%,rgba(248,237,149,0.4) 15%,rgba(250,240,152,0.4) 100%);	
	box-shadow:0 8px 10px -5px rgba(125,113,0,0.4);
	text-align:left;
	overflow:hidden;
	}
.NOTICE_DATE_ACTIVE
	{
	display:inline-block;
	float:right;
	font-size:12pt;
	color:#404040;
	text-align:right;
	overflow:hidden;
	}
.NOTICE_DATE_OBSOLETE
	{
	display:inline-block;
	float:right;
	font-size:12pt;
	color:#808080;
	text-align:right;
	overflow:hidden;
	}
.NOTICE_SUBJECT_ACTIVE
	{
	margin:12px auto;
	font-size:15pt;
	font-weight:bold;
	color:#404040;
	text-align:center;
	overflow:hidden;
	}
.NOTICE_SUBJECT_OBSOLETE
	{
	margin:12px auto;
	font-size:15pt;
	font-weight:bold;
	color:#808080;
	text-align:center;
	overflow:hidden;
	}
.NOTICE_TEXT_BRIEF
	{
	clear:both;
	font-size:12pt;
	color:#204080;
	overflow:hidden;
	}
.NOTICE_TEXT_ACTIVE
	{
	padding:10px 20px;
	clear:both;
	font-size:12pt;
	color:#204080;
	overflow:hidden;
	}
.NOTICE_TEXT_OBSOLETE
	{
	padding:10px 20px;
	clear:both;
	font-size:12pt;
	color:#4070A0;
	overflow:hidden;
	}
.NOTICE_AUTHOR
	{
	display:inline-block;
	box-sizing:border-box;
	float:right;
	max-width:120px;
	text-align:right;
	vertical-align:middle;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	font-size:12pt;
	}
.NOTICE_AUTHOR_ACTIVE
	{
	color:#404040;
	}
.NOTICE_AUTHOR_OBSOLETE
	{
	color:#808080;
	}

/**************************** Institutional links ****************************/
#institutional_links
	{
	box-sizing:border-box;
	width:148px;
	margin:0;
	background:white;
	border-style:solid;
	border-width:1px;
	border-color:#8CBCCE;
	padding:5px;
	border-radius:4px;
	font-size:11pt;
	color:#4D88A1;
	}
#institutional_links ul
	{
	box-sizing:border-box;
	width:138px;
	margin-top:2px;
	padding-top:2px;
	border-style:solid;
	border-width:1px 0 0 0;
	border-color:#DDECF1;
	}
#institutional_links li
	{
	width:138px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}
.INS_LNK
	{
	padding:1px;
	font-size:11pt;
	color:#4D88A1;
	}

/*********************************** Alerts **********************************/
.ALERT
	{
	display:inline-block;
	box-sizing:border-box;
	margin:8px auto;
	padding:12px;
	background-color:#FFF9EA;
	border-radius:2px;
	box-shadow: 0 2px 2px 0 rgba(124,121,109,0.14), 0 2px 1px -2px rgba(124,121,109,0.2), 0 1px 5px 0 rgba(124,121,109,0.12);
	}
.ALERT_CLOSE
	{
	float:right;
	margin:-8px -8px 8px 8px;
	opacity:0.3;
	}
.ALERT_CLOSE:hover
	{
	opacity:1;
	}
.ALERT_TXT
	{
	box-sizing:border-box;
	padding:8px 0 8px 40px;
	background-position:8px 8px;
	background-size:20px 20px;
	background-repeat:no-repeat;
	font-size:12pt;
	color:#632921;
	text-align:left;
	overflow:hidden;
	}

/*********************************** Icons ***********************************/
.ICO20x15	{width:20px; height:15px; vertical-align:middle;}
.ICO20x20	{width:20px; height:20px; vertical-align:middle;}
.ICO25x25	{width:25px; height:25px; vertical-align:middle;}
.ICO40x25	{width:40px; height:25px; vertical-align:middle;}
.ICO40x40	{width:40px; height:40px; vertical-align:middle;}
.ICO64x64	{width:64px; height:64px; vertical-align:middle;}
.ICO160x160	{width:160px; height:160px; vertical-align:middle;}
.BANNER		{width:150px; height:50px;}
.BANNER_SMALL	{width:75px; height:25px;}

/****** Contextual links with small icons and text to go to some action ******/
.CONTEXT_MENU
	{
	margin:4px auto 6px auto;
	text-align:center;
	}
.CONTEXT_OPT
	{
	display:inline-block;
	margin-left:2px;
	margin-right:2px;
	white-space:nowrap;
	}
.CONTEXT_COL
	{
	width:36px;
	text-align:center;
	vertical-align:top;
	}

/********************************** Frame ************************************/
.FRAME_INLINE
	{
	display:inline-block;
	margin:0 8px;
	vertical-align:top;
	}
.FRAME_CONTAINER
	{
	box-sizing:border-box;
	width:100%;
	text-align:center;
	vertical-align:middle;
	}
.FRAME
	{
	display:inline-block;
	box-sizing:border-box;
	margin:5px 0;
	padding:8px 12px 20px 12px;
	background-color:white;
	border-radius:2px;
	box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 2px 1px -2px rgba(0,0,0,0.2), 0 1px 5px 0 rgba(0,0,0,0.12);
	text-align:center;
	overflow:hidden;
	}
.FRAME_SHADOW
	{
	display:inline-block;
	box-sizing:border-box;
	margin:5px 0 18px 0;
	padding:12px;
	background-color:rgba(255,255,255,0.95);
	border-width:1px;
	border-style:solid;
	border-color:#C0C0C0;
	border-radius:4px;
	box-shadow:2px 5px 15px #888;
	text-align:center;
	overflow:hidden;
	}
.FRAME_ICO
	{
	box-sizing:border-box;
	height:20px;
	text-align:left;
	}
.FRAME_ICO_LEFT
	{
	display:inline-block;
	}
.FRAME_ICO_RIGHT
	{
	display:inline-block;
	float:right;
	}
.FRAME_TBL_WIDE
	{
	box-sizing:border-box;
	width:100%;
	}
.FRAME_TBL_WIDE_MARGIN
	{
	box-sizing:border-box;
	width:100%;
	margin-bottom:20px;
	}
.FRAME_TBL_CENTER
	{
	margin:0 auto;
	}
.FRAME_TBL_CENTER_MARGIN
	{
	margin:0 auto;
	margin-bottom:20px;
	}
.FRAME_TITLE
	{
	display:table;
	box-sizing:border-box;
	width:100%;
	margin:0 auto;
	padding:0 12px 12px 12px;
	}
.FRAME_TITLE_BIG
	{
	color:#606060;
	font-size:22pt;
	}
.FRAME_TITLE_SMALL
	{
	color:#808080;
	font-size:18pt;
	}

/* Apply only to the first level of th and td */
table.CELLS_PAD_1	> tbody > tr > th {padding: 1px;}
table.CELLS_PAD_1	> tbody > tr > td {padding: 1px;}
table.CELLS_PAD_2	> tbody > tr > th {padding: 2px;}
table.CELLS_PAD_2	> tbody > tr > td {padding: 2px;}
table.CELLS_PAD_5	> tbody > tr > th {padding: 5px;}
table.CELLS_PAD_5	> tbody > tr > td {padding: 5px;}
table.CELLS_PAD_10	> tbody > tr > th {padding:10px;}
table.CELLS_PAD_10	> tbody > tr > td {padding:10px;}

/******************** Selector below the title of a frame ********************/
.SEL_BELOW_TITLE
	{
	text-align:center;
	vertical-align:middle;
	margin-bottom:8px;
	}
.SEL_BELOW_TITLE ul
	{
	display:inline-block;
	list-style-type:none;
	padding:0;
	margin:0;
	text-align:left;
	vertical-align:middle;
	}
.SEL_BELOW_TITLE li
	{
	display:inline;
	text-align:left;
	vertical-align:middle;
	}
.SEL_BELOW_TITLE label
	{
	color:#404040;
	font-size:13pt;
	}

/*********************************** Title ***********************************/
.TIT
	{
	margin:13px auto 0 auto;
	font-size:13pt;
	font-weight:bold;
	color:#94745C;
	text-align:center;
	}

/********** Title of country, institution, centre, degree, course ************/
.TITLE_LOCATION
	{
	color:#808080;
	font-size:20pt;
	font-weight:bold;
	}

/************************** Map and name of country **************************/
.COUNTRY_SMALL
	{
	display:inline-block;
	box-sizing:border-box;
	max-width:300px;
	text-align:left;
	vertical-align:middle;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}
.COUNTRY_TINY
	{
	display:inline-block;
	box-sizing:border-box;
	max-width:120px;
	text-align:left;
	vertical-align:middle;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}
.COUNTRY_MAP_TITLE
	{
	box-sizing:border-box;
	width:40px;
	height:40px;
	margin-right:10px;
	vertical-align:top;
	}
.COUNTRY_MAP_SMALL
	{
	box-sizing:border-box;
	width:64px;
	height:64px;
	vertical-align:middle;
	}
.COUNTRY_MAP_TINY
	{
	box-sizing:border-box;
	width:20px;
	height:20px;
	vertical-align:middle;
	}
.COUNTRY_MAP_SHOW
	{
	box-sizing:border-box;
	width:320px;
	height:320px;
	margin:10px;
	}
.COUNTRY_MAP_PRINT
	{
	box-sizing:border-box;
	width:625px;
	height:625px;
	margin:12px;
	}

/********************* List of my courses ************************************/
.MY_CRSS_LNK
	{
	box-sizing:border-box;
	max-width:500px;
	text-align:left;
	vertical-align:middle;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}

/******************* Web of institution, centre, degree **********************/
.EXTERNAL_WWW_SHORT
	{
	box-sizing:border-box;
	max-width:100px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}
.EXTERNAL_WWW_LONG
	{
	box-sizing:border-box;
	max-width:250px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}

/****************************** Photo of centre ******************************/
.CENTRE_PHOTO_SHOW
	{
	box-sizing:border-box;
	width:480px;
	padding:6px; margin:9px;
	border:solid 1px #EEE;
	}
a:hover img.CENTRE_PHOTO_SHOW
	{
	border:solid 1px #CCC;
        box-shadow:1px 1px 6px #999;
	}
.CENTRE_PHOTO_PRINT
	{
	box-sizing:border-box;
	width:600px;
	padding:10px; margin:15px;
	border:solid 1px #EEE;
        box-shadow:1px 1px 6px #999;
	}

/**************** Attribution (author and license) of images *****************/
#AttributionArea
	{
	box-sizing:border-box;
	width:480px;
	}
.ATTRIBUTION
	{
	box-sizing:border-box;
	margin-bottom:15px;
	color:#A0A0A0;
	font-size:8pt;
	text-align:center;
	}

/******************************* User's photo ********************************/
.PHOTO15x20	{width: 15px; height: 20px; vertical-align:middle; border-radius:2px;}
.PHOTO15x20B	{width: 15px; height: 20px; vertical-align:middle; border-radius:2px; display:block; margin:0 auto;}
.PHOTO18x24	{width: 18px; height: 24px; vertical-align:middle; border-radius:2px;}
.PHOTO21x28	{width: 21px; height: 28px; vertical-align:middle; border-radius:2px;}
.PHOTO30x40	{width: 30px; height: 40px; vertical-align:middle; border-radius:2px;}
.PHOTO42x56	{width: 42px; height: 56px; vertical-align:middle; border-radius:3px;}
.PHOTO45x60	{width: 45px; height: 60px; vertical-align:middle; border-radius:3px;}
.PHOTO60x80	{width: 60px; height: 80px; vertical-align:middle; border-radius:3px;}
.PHOTO186x248	{width:186px; height:248px; vertical-align:middle; border-radius:8px;}
.IMG_USR
	{
	box-sizing:border-box;
	width:186px;
	height:248px;
	border-radius:4px;
	}
.ZOOM
	{
	box-sizing:border-box;
	position:absolute;
	z-index:1000;
	left:-300px;
	top:-400px;
	padding:6px;
	background-color:rgba(255,255,255,0.95);
	border-width:1px;
	border-style:solid;
	border-color:#C0C0C0;
	border-radius:6px;
	box-shadow:2px 5px 15px #888;
	}
.ZOOM_TXT_LINE
	{
	box-sizing:border-box;
	display:block;
	width:186px;
	margin:0 auto;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}

.NO_BR	{white-space:nowrap;}

/********************************* Messages **********************************/
.MSG_RECIPIENTS, .MSG_SUBJECT, .MSG_CONTENT
	{
	box-sizing:border-box;
	width:640px;
	}
.BG_MSG_BLUE
	{
	background-image:-webkit-linear-gradient(#eaf3f6 0,#eaf3f6 80%,white 100%);	/* Safari */
	background-image:linear-gradient(#eaf3f6 0,#eaf3f6 80%,white 100%);
	background-repeat:no-repeat;
	}
.BG_MSG_GREEN
	{
	background-image:-webkit-linear-gradient(#f5ffd7 0,#f5ffd7 80%,white 100%);	/* Safari */
	background-image:linear-gradient(#f5ffd7 0,#f5ffd7 80%,white 100%);
	background-repeat:no-repeat;
	}

/************************** Listing of users *********************************/
.USR_LIST_NUM	{color:#A0A0A0; font-size:15pt; font-weight:bold;}
.USR_LIST_NUM_N	{color:#404040; font-size:15pt; font-weight:bold;}

/*****************************************************************************/
.WHITE_TITLE		{color:#505050; font-size:18pt;}
.GREY_TITLE		{color:#505050; font-size:18pt;}
.BLUE_TITLE		{color:#4D88A1; font-size:18pt;}
.YELLOW_TITLE		{color:#BD4815; font-size:18pt;}

/*********************** Icon and checkbox highlighting **********************/
.ICO_HIDDEN
	{
	opacity:0.2;
	}
.ICO_HIGHLIGHT, .CHECKBOX_UNCHECKED
	{
	opacity:0.7;
	}
.ICO_HIGHLIGHT:hover, .CHECKBOX_UNCHECKED:hover, .CHECKBOX_CHECKED
	{
	opacity:1;
	}

.HLP_HIGHLIGHT
	{
	opacity:0.3;
	}
.HLP_HIGHLIGHT:hover
	{
	opacity:1;
	}

/********************************* Form fonts ********************************/
.WHITE_FORM		{color:#4D88A1; font-size:13pt;}
.GREY_FORM		{color:#4D88A1; font-size:13pt;}
.BLUE_FORM		{color:#4D88A1; font-size:13pt;}
.YELLOW_FORM		{color:#7C4D2A; font-size:13pt;}

.WHITE_FORM_DARK	{color:#365E6E; font-size:13pt;}
.GREY_FORM_DARK		{color:#365E6E; font-size:13pt;}
.BLUE_FORM_DARK		{color:#365E6E; font-size:13pt;}
.YELLOW_FORM_DARK	{color:#4A2E19; font-size:13pt;}

.WHITE_FORM_NOWRAP	{color:#4D88A1; font-size:13pt; white-space:nowrap;}
.GREY_FORM_NOWRAP	{color:#4D88A1; font-size:13pt; white-space:nowrap;}
.BLUE_FORM_NOWRAP	{color:#4D88A1; font-size:13pt; white-space:nowrap;}
.YELLOW_FORM_NOWRAP	{color:#7C4D2A; font-size:13pt; white-space:nowrap;}

.WHITE_FORM_BOLD	{color:#4D88A1; font-size:13pt; font-weight:bold;}
.GREY_FORM_BOLD		{color:#4D88A1; font-size:13pt; font-weight:bold;}
.BLUE_FORM_BOLD		{color:#4D88A1; font-size:13pt; font-weight:bold;}
.YELLOW_FORM_BOLD	{color:#7C4D2A; font-size:13pt; font-weight:bold;}

/****************************** Placing of objects ***************************/
.LEFT_TOP		{text-align:left; vertical-align:top;}
.LEFT_MIDDLE		{text-align:left; vertical-align:middle;}
.LEFT_BOTTOM		{text-align:left; vertical-align:bottom;}
.CENTER_TOP		{text-align:center; vertical-align:top;}
.CENTER_MIDDLE		{text-align:center; vertical-align:middle;}
.CENTER_BOTTOM		{text-align:center; vertical-align:bottom;}
.RIGHT_TOP		{text-align:right; vertical-align:top;}
.RIGHT_MIDDLE		{text-align:right; vertical-align:middle;}
.RIGHT_BOTTOM		{text-align:right; vertical-align:bottom;}

/***************** Colors used in headers,backgrounds,etc. *****************/
.COLOR0			{background-color:#F4F2EA;}
.COLOR1			{background-color:#FBFAF7;}
.LIGHT_GREEN		{background-color:#C0FF40;}
.LIGHT_BLUE		{background-color:#DDECF1;}
.VERY_LIGHT_BLUE	{background-color:#EAF3F6;}

/********************************* Course info *******************************/
#crs_info
	{
	margin:0;
	padding:0 12px;
	color:inherit;
	}
#crs_info table
	{
	border:1px solid grey;
	}
#crs_info th
	{
	border:1px solid grey;
	background-color:#F0F0F0;
	padding:6px;
	}
#crs_info td
	{
	border:1px solid grey;
	padding:6px;
	}

/************************ Help for the text editor ***************************/
.HELP_EDIT
	{
	margin:10px;
	text-align:center;
	color:#808080;
	font-size:8pt;
	}

/*********************************** Lists ***********************************/
.LIST_LEFT
	{
	display:inline-block;
	list-style-type:none;
	padding:0;
	margin:0;
	text-align:left;
	vertical-align:middle;
	}

/******************************* File browsers *******************************/
.FILENAME
	{
	display:inline-block;
	box-sizing:border-box;
	width:260px;	/* width of LST_EDIT + 10 */
	text-align:left;
	vertical-align:middle;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
		}
.FILENAME_TXT
	{
	color:#404040;
	font-size:18pt;
	font-weight:bold;
	}
.BROWSER_TITLE		{color:#94745C; font-size:13pt; font-weight:bold;}
.BROWSER_TITLE_LIGHT	{color:#D5C6BB; font-size:13pt; font-weight:bold;}
.BROWSER_SUBTITLE	{color:#94745C; font-size:12pt;}
.BROWSER_TABLE
	{
	box-sizing:border-box;
	width:100%;
	}
.LST			{color:#404040; font-size:11pt; white-space:nowrap;}
.LST_HID		{color:#A0A0A0; font-size:11pt; white-space:nowrap;}
.LST_REC		{color:#008000; font-size:11pt; white-space:nowrap;}
.LST_REC_HID		{color:#89BE87; font-size:11pt; white-space:nowrap;}
.LST_EDIT		{width:250px; color:#404040; font-weight:bold; font-size:11pt; height:20px; padding:0; margin:-1px; border-width:1px; border-style:solid; border-color:#ECE9D8;}
.LST_EDIT_HID		{width:250px; color:#A0A0A0; font-weight:bold; font-size:11pt; height:20px; padding:0; margin:-1px; border-width:1px; border-style:solid; border-color:#ECE9D8;}
.LST_EDIT_REC		{width:250px; color:#008000; font-weight:bold; font-size:11pt; height:20px; padding:0; margin:-1px; border-width:1px; border-style:solid; border-color:#ECE9D8;}
.LST_EDIT_REC_HID	{width:250px; color:#89BE87; font-weight:bold; font-size:11pt; height:20px; padding:0; margin:-1px; border-width:1px; border-style:solid; border-color:#ECE9D8;}
.LST_EDIT_ROWS		{width:30px;  color:#404040; font-weight:bold; font-size:11pt; height:20px; padding:0; margin:-1px; border-width:1px; border-style:solid; border-color:#ECE9D8;}

/************** Paragraph (margin on top and bottom of a div) ****************/
.PAR
	{
	margin-top:1em;
	margin-bottom:1em;
	}

/*****************************************************************************/

.T1			{color:#404040; font-size:15pt;}
.T2			{color:#404040; font-size:13pt;}
.T3			{color:#404040; font-size:12pt;}

.DAT			{color:#606060; font-size:13pt;}
.DAT_NOBR		{color:#606060; font-size:13pt; white-space:nowrap;}
.DAT_BOLD		{color:#606060; font-size:13pt; font-weight:bold;}
.DAT_GREEN		{color:#008000; font-size:13pt;}
.DAT_LIGHT		{color:#A0A0A0; font-size:13pt;}
.DAT_N			{color:black;   font-size:13pt;}
.DAT_NOBR_N		{color:black;   font-size:13pt; white-space:nowrap;}
.DAT_N_BOLD		{color:black;   font-size:13pt; font-weight:bold;}

/*********************** Line in top part of a table row *********************/
.DAT_N_LINE_TOP
	{
	color:black;
	font-size:13pt;
	border-style:solid none none none;
	border-width:1px;
	}

.DAT_SMALL		{font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#606060; font-size:12pt;}
.DAT_SMALL_LIGHT	{font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#A0A0A0; font-size:12pt;}
.DAT_SMALL_NOBR		{font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#606060; font-size:12pt; white-space:nowrap;}
.DAT_SMALL_N		{font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:black;   font-size:12pt;}
.DAT_SMALL_NOBR_N	{font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:black;   font-size:12pt; white-space:nowrap;}

.DAT_SMALL_GREY		{font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#707070; font-size:12pt;}
.DAT_SMALL_RED		{font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:red;     font-size:12pt;}
.DAT_SMALL_GREEN	{font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#008000; font-size:12pt;}
.DAT_SMALL_BLUE		{font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#0080FF; font-size:12pt;}
.DAT_SMALL_YELLOW	{font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#C0C000; font-size:12pt;}

/******************************** User's IDs *********************************/
.USR_ID		{font-size:18pt; font-weight:bold;}
.USR_ID_C	{color:#408020}
.USR_ID_NC	{color:#A02020}

/******************************* Record card *********************************/
.REC_USR
	{
	display:block;
	margin:0 0 12px 0;
	text-align:center;
	vertical-align:top;
	}
.REC_SHA, .REC_CRS, .REC_TT
	{
	display:inline-block;
	margin:0 6px;
	vertical-align:top;
	}

.REC_C1_TOP
	{
	box-sizing:border-box;
	width:68px;
	padding-top:8px !important;
	vertical-align:top;
	}
.REC_C2_TOP
	{
	box-sizing:border-box;
	width:278px;
	height:68px;
	padding-top:8px !important;
	}
.REC_C3_TOP
	{
	box-sizing:border-box;
	width:190px;
	}

.REC_C1_MID
	{
	box-sizing:border-box;
	width:68px;
	}
.REC_C2_MID
	{
	box-sizing:border-box;
	width:278px;
	}
.REC_C3_MID
	{
	box-sizing:border-box;
	width:190px;
	}

.REC_C1_BOT
	{
	box-sizing:border-box;
	width:170px;
	}
.REC_C2_BOT
	{
	box-sizing:border-box;
	width:362px;
	}
.REC_C2_BOT_INPUT
	{
	box-sizing:border-box;
	width:358px;
	}

.REC_HEAD	{font-family:Georgia,"DejaVu LGC Serif","Bitstream Vera Serif",serif; color:#808080; font-size:12pt;}
.REC_NAME
	{
	box-sizing:border-box;
	max-width:274px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	color:#808080;
	font-size:20pt;
	font-weight:bold;
	}
.REC_NICK
	{
	color:#808080;
	font-size:15pt;
	font-weight:bold;
	}
.REC_WEBS
	{
	width:180px;
	margin:0 auto;
	}
.REC_EMAIL
	{
	box-sizing:border-box;
	max-width:358px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}
.REC_DAT
	{
	color:#808080;
	font-size:13pt;
	line-height:110%;
	}
.REC_DAT_BOLD
	{
	color:black;
	font-size:13pt;
	line-height:110%;
	}

/******************************** Class photo ********************************/
.CLASSPHOTO_TITLE
	{
	color:#606060;
	font-family:Georgia,"DejaVu LGC Serif","Bitstream Vera Serif",serif;
	font-size:13pt;
	}
.CLASSPHOTO
	{
	color:#606060;
	font-size:10pt;
	line-height:110%;
	white-space:nowrap;
	}
.CLASSPHOTO_CAPTION
	{
	display:block;
	box-sizing:border-box;
	max-width:60px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	margin:0 auto;
	}

/*****************************************************************************/
.MSJ_AVISO		{color:#632921; font-size:12pt;}
.TIT_TBL		{color:#4D88A1; font-size:12pt; font-weight:bold;}

.GRP_TITLE		{color:#4D88A1; font-size:15pt; font-weight:bold;}

.ASG_TITLE		{color:#4D88A1; font-size:15pt; font-weight:bold;}
.ASG_TITLE_LIGHT	{color:#AFC4CC; font-size:15pt; font-weight:bold;}
.ASG_LABEL		{color:#4D88A1; font-size:13pt;}
.ASG_LABEL_LIGHT	{color:#AFC4CC; font-size:13pt;}
.ASG_GRP		{color:#4D88A1; font-size:12pt;}
.ASG_GRP_LIGHT		{color:#AFC4CC; font-size:12pt;}

.DATE_RED		{color:red;     font-size:13pt;}
.DATE_RED_LIGHT		{color:#F98A8A; font-size:13pt;}
.DATE_GREEN		{color:#008000; font-size:13pt;}
.DATE_GREEN_LIGHT	{color:#89BE87; font-size:13pt;}
.DATE_BLUE		{color:#4D88A1; font-size:13pt;}
.DATE_BLUE_LIGHT	{color:#AFC4CC; font-size:13pt;}

.ASG_LST_DATE_GREEN	{color:#008000; font-size:11pt; white-space:nowrap;}
.ASG_LST_DATE_RED	{color:red;     font-size:11pt; white-space:nowrap;}

.STATUS_GREEN		{color:#008000; font-size:12pt;}
.STATUS_GREEN_LIGHT	{color:#89BE87; font-size:12pt;}
.STATUS_RED		{color:red;     font-size:12pt;}
.STATUS_RED_LIGHT	{color:#F98A8A; font-size:12pt;}

/********************** Number of question, project, etc. ********************/
.BIG_INDEX	{color:#808080; font-size:20pt; font-weight:bold;}

/******************************** Projects ***********************************/
.PRJ_LST_USR
	{
	margin:0;
	padding-left:1em;
	}

/********************************** Tests ************************************/
.TAG_SEL	{box-sizing:border-box; width:346px;}
.TAG_TXT	{box-sizing:border-box; width:346px;}
.STEM		{box-sizing:border-box; width:700px;}
.ANS		{color:#404040; font-size:12pt;}
.ANS_OK		{color:#008000; font-size:12pt; font-weight:bold;}
.ANS_BAD	{color:red;     font-size:12pt; font-weight:bold;}
.ANS_STR	{box-sizing:border-box; width:600px;}
.TEST_SUBTITLE
	{
	margin:10px;
	color:#404040;
	font-size:13pt;
	text-align:center;
	vertical-align:middle;
	}
.TEST_EXA	{color:#404040; font-size:12pt;}
.TEST_EXA_LIGHT	{color:#A0A0A0; font-size:12pt;}
.TEST_EDI	{color:#404040; font-size:12pt;}
.TEST_EDI_LIGHT	{color:#A0A0A0; font-size:12pt;}

.TEST_TAG_LIST
	{
	padding:0;
	margin:0 0 0 1em;
	}

.TEST_IMG_SHOW_STEM_CONTAINER
	{
	box-sizing:border-box;
	width:100%;
	margin:10px 0;
	}
.TEST_IMG_SHOW_STEM
	{
	box-sizing:border-box;
	width:100%;
	border-radius:4px;
	}
.TEST_IMG_SHOW_ANS_CONTAINER
	{
	box-sizing:border-box;
	width:100%;
	margin:10px 0;
	}
.TEST_IMG_SHOW_ANS
	{
	box-sizing:border-box;
	width:100%;
	border-radius:4px;
	}
.TEST_IMG_EDIT_LIST_STEM_CONTAINER
	{
	box-sizing:border-box;
	width:100%;
	margin:5px 0;
	}
.TEST_IMG_EDIT_LIST_STEM
	{
	box-sizing:border-box;
	width:100%;
	border-radius:2px;
	}
.TEST_IMG_EDIT_LIST_ANS_CONTAINER
	{
	box-sizing:border-box;
	width:100%;
	margin:5px 0;
	}
.TEST_IMG_EDIT_LIST_ANS
	{
	box-sizing:border-box;
	width:100%;
	border-radius:2px;
	}

.TEST_FORM_EDIT_IMG
	{
	box-sizing:border-box;
	margin:15px 0;
	text-align:left;
	vertical-align:top;
	}

.TEST_IMG_EDIT_ONE_STEM_CONTAINER
	{
	box-sizing:border-box;
	width:100%;
	}
.TEST_IMG_EDIT_ONE_STEM
	{
	box-sizing:border-box;
	width:100%;
	border-radius:4px;
	}
.TEST_IMG_EDIT_ONE_ANS_CONTAINER
	{
	box-sizing:border-box;
	width:100%;
	}
.TEST_IMG_EDIT_ONE_ANS
	{
	box-sizing:border-box;
	width:100%;
	border-radius:4px;
	}

.TEST_EDI_ANS_LEFT_COL
	{
	box-sizing:border-box;
	width:50px;
	text-align:left;
	vertical-align:top;
	}
.TEST_EDI_ANS_CENTER_COL
	{
	box-sizing:border-box;
	width:50px;
	text-align:right;
	vertical-align:top;
	}
.TEST_EDI_ANS_RIGHT_COL
	{
	box-sizing:border-box;
	width:604px;
	text-align:left;
	vertical-align:top;
	}

/********************************** Games ************************************/
.GAM_PLAY_CONTAINER
	{
	box-sizing:border-box;
	display:table;
	margin:5%;
	}
.GAM_PLAY_NUM_QST
	{
	width:10%;
	float:left;
	/* position:relative; */
	padding-bottom:24pt;
	color:#808080;
	font-size:48pt;
	font-weight:bold;
	
	// background:pink;
	}
.GAM_PLAY_QST_CONTAINER
	{
	width:80%;
	float:left;
	/* position:relative; */

	// background:blue;
	}
.GAM_PLAY_NXT_CONTAINER
	{
	width:10%;
	float:left;
	/* position:relative; */

	// background:grey;
	}
.GAM_PLAY_QST
	{
	color:#404040;
	font-size:24pt;
	}
.GAM_PLAY_CONTINUE_CONTAINER
	{
	clear:all;
	text-align:center;
	}
.GAM_PLAY_CONTINUE_CONTAINER a
	{
	text-decoration:none;
	}
.GAM_PLAY_CONTINUE
	{
	font-size:16pt;
	}

/******************************* Time table **********************************/
#timetable
	{
	width:100%;
	margin:0 auto;
	}
.TT_CELL
	{
	box-sizing:border-box;
	max-width:80px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	margin:0 auto;
	}
.TT_TXT
	{
	font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif;
	color:#345C6C;
	font-size:10pt;
	line-height:100%;
	letter-spacing:0;
	}
.TT_DAY
	{
	font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif;
	color:#404040;
	font-size:10pt;
	letter-spacing:0;
	}
.TT_SUNDAY
	{
	font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif;
	color:red;
	font-size:10pt;
	letter-spacing:0;
	}
.TT_HOUR_BIG
	{
	/* font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; */
	color:#808080;
	font-size:10pt;
	font-weight:bold;
	line-height:100%;
	letter-spacing:0;
	}
.TT_HOUR_SMALL
	{
	font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif;
	color:#A0A0A0;
	font-size:10pt;
	line-height:100%;
	letter-spacing:0;
	}
.TT_HOURCOL	{box-sizing:border-box; height:16px; width:7%;}
.TT_HOUR	{box-sizing:border-box; height:32px; width:7%;}
.TT_MINICOL	{box-sizing:border-box; height:16px; width:2%;}
.TT_ALIGN	{box-sizing:border-box; height:16px; width:1%;}
.TT_FREE0	{box-sizing:border-box; height:16px; background-color:#F4F2EA; border:solid 1px; border-color:#F4F2EA #E0D9C2 #EEEADC #F4F2EA;}
.TT_FREE1	{box-sizing:border-box; height:16px; background-color:#F4F2EA; border:solid 1px; border-color:#F4F2EA #E0D9C2 #E0D9C2 #F4F2EA;}
.TT_FREE2	{box-sizing:border-box; height:16px; background-color:#FBFAF7; border:solid 1px; border-color:#FBFAF7 #E0D9C2 #F5F2E9 #FBFAF7;}
.TT_FREE3	{box-sizing:border-box; height:16px; background-color:#FBFAF7; border:solid 1px; border-color:#FBFAF7 #E0D9C2 #E0D9C2 #FBFAF7;}
.TT_LECT	{box-sizing:border-box; height:16px; background-color:#C0DAE4; border:solid 2px; border-color:#D5F1FC #AAC1C9 #AAC1C9 #D5F1FC;}
.TT_PRAC	{box-sizing:border-box; height:16px; background-color:#DBE5E9; border:solid 2px; border-color:#EDF8FC #C7D0D4 #C7D0D4 #EDF8FC;}
.TT_TUTO	{box-sizing:border-box; height:16px; background-color:#D6E9C3; border:solid 2px; border-color:#E8FCD3 #C2D4B1 #C2D4B1 #E8FCD3;}

/********************************* Preference ********************************/
.PREF_CONTAINER
	{
	display:inline-block;
	margin:0 10px;
	}
.PREF_OFF
	{
	display:table-cell;
	box-sizing:border-box;
	padding:6px;
	text-align:center;
	vertical-align:middle;
	border:solid 1px;
	border-color:transparent;
	}
.PREF_ON
	{
	display:table-cell;
	box-sizing:border-box;
        padding:6px;
	text-align:center;
	vertical-align:middle;
	border:solid 1px;
	border-color:#C0DAE4;
	background-color:#DDECF1;
	}

/************************************* Log ***********************************/
.LOG
	{
	font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif;
	font-size:11pt;
	color:#606060;
	}
.LOG_R
	{
	font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif;
	font-size:11pt;
	color:red;
	}

/***************************** Exam announcement *****************************/
/* Bottom space is used for signatures */
.EXA_ANN_VISIBLE
	{
	box-sizing:border-box;
	width:100%;
	padding:25px 25px 125px 25px;
	}
.EXA_ANN_HIDDEN
	{
	box-sizing:border-box;
	width:100%;
	padding:25px 25px 125px 25px;
	opacity:0.33;
	}

/****************************** Image uploading ******************************/
.IMG_UPLOAD_CONTAINER
	{
	vertical-align:top;
	margin-bottom:10px;
	}
.IMG_UPLOAD_BUTTON
	{
	cursor:pointer;
	}
.IMG_UPLOAD_ICO
	{
	width:20px;
	height:20px;
	margin:0 5px;
	vertical-align:middle;
	}
.IMG_UPLOAD_FILE
	{
	display:none;
	}
.IMG_UPLOAD_FILENAME
	{
	color:#808080;
	font-size:12pt;
	}

/********** Author of assignments, attendance, messages, surveys... **********/
.AUTHOR_1_LINE
	{
	display:inline-block;
	box-sizing:border-box;
	max-width:100px;
	height:20px;
	text-align:left;
	vertical-align:middle;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}
.AUTHOR_2_LINES
	{
	display:inline-block;
	box-sizing:border-box;
	max-width:60px;
	height:40px;
	text-align:left;
	vertical-align:middle;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}
.AUTHOR_TXT		{color:#4D88A1; font-size:11pt;}
.AUTHOR_TXT_LIGHT	{color:#AFC4CC; font-size:11pt;}
.AUTHOR_TXT_NEW		{color:#4D88A1; font-size:11pt; font-weight:bold;}

/************************** Owner of assignments and works *******************/
.OWNER_WORKS_PHOTO
	{
	box-sizing:border-box;
	width:64px;
	text-align:left;
	vertical-align:top;
	}
.OWNER_WORKS_DATA
	{
	display:inline-block;
	box-sizing:border-box;
	width:100px;
	text-align:left;
	vertical-align:top;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}

/***************************** Listing of users ******************************/
.USR_DAT
	{
	box-sizing:border-box;
	max-width:120px;
	overflow:hidden;
	text-overflow:ellipsis;
	}

/**************************** Enrolment requests *****************************/
.REQUESTER_NAME
	{
	box-sizing:border-box;
	max-width:100px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}

/******************************** Social activity ****************************/
#view_new_posts_container,#view_old_posts_container
	{
	display:table-cell;
	height:50px;
	text-align:center;
	vertical-align:middle;
	}
#just_now_timeline_list,#new_timeline_list,#old_timeline_list
	{
	display:none;
	margin:0;
	padding:0;
	}
#old_timeline_list
	{
	margin:0;
	padding:0;
	}

.SOCIAL_PUB
	{
	width:536px;
	border-top:1px solid silver;
	}
.SOCIAL_NEW_PUB
	{
	background-color:#DDECF1;
	animation: fadein 2s linear forwards;
	}
@keyframes fadein
	{
	to {background-color:white;}
	}

.SOCIAL_FORM_NEW_POST
	{
	padding:10px 0;
	width:480px;
	text-align:center;
	}
.SOCIAL_TOP_CONTAINER
	{
	box-sizing:border-box;
	width:536px;
	padding-top:10px;
	text-align:left;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}
.SOCIAL_TOP_PUBLISHER
	{
	color:#808080;
	font-size:13pt;
	}

.SOCIAL_NOTE_LEFT_PHOTO
	{
	display:inline-block;
	box-sizing:border-box;
	width:56px;
	height:70px;
	padding:10px 0;
	text-align:left;
	vertical-align:top;
	}
.SOCIAL_NOTE_RIGHT_CONTAINER
	{
	display:inline-block;
	box-sizing:border-box;
	width:480px;
	padding-top:10px;
	}
.SOCIAL_RIGHT_AUTHOR
	{
        display:inline-block;
	box-sizing:border-box;
        width:320px;
	text-align:left;
	vertical-align:top;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
        }
.SOCIAL_RIGHT_TIME
	{
        display:inline-block;
	box-sizing:border-box;
        width:160px;
        text-align:right;
	vertical-align:top;
        }
.SOCIAL_BOTTOM_LEFT	/* Container for button used to toggle new comment form */
	{
	display:inline-block;
	box-sizing:border-box;
	width:56px;
	vertical-align:bottom;
	}
.SOCIAL_BOTTOM_RIGHT	/* Container for fav, share, remove and comments */
	{
	display:inline-block;
	box-sizing:border-box;
	width:480px;
	vertical-align:top;
	}
.SOCIAL_ICOS_FAV_SHA_REM	/* Container for fav, share and remove */
	{
	padding-bottom:10px;
	}
.SOCIAL_TEXTAREA_POST
	{
	box-sizing:border-box;
	width:480px;
	margin:0;
	resize:none;
	}
.SOCIAL_TXT
	{
	padding:5px 0;
	color:#404040;
	font-size:13pt;
	}
.SOCIAL_POST_IMG_CONTAINER
	{
	box-sizing:border-box;
	width:480px;
	margin:10px 0;
	}
.SOCIAL_POST_IMG
	{
	box-sizing:border-box;
	width:480px;
	border-radius:4px;
	}
.SOCIAL_POST_IMG_TIT_URL
	{
	box-sizing:border-box;
	width:440px;
	}
.SOCIAL_ICO_COMMENT
	{
	display:inline-block;
	padding-bottom:10px;
	}
.SOCIAL_ICO_COMMENT_DISABLED
	{
	display:inline-block;
	padding-bottom:10px;
	opacity:0.1;
	}
.SOCIAL_ICO_FAV
	{
	display:inline-block;
	vertical-align:bottom;
	}
.SOCIAL_ICO_SHARE
	{
	display:inline-block;
	padding-left:20px;
	vertical-align:bottom;
	}
.SOCIAL_ICO_FAV_DISABLED
	{
	display:inline-block;
	vertical-align:bottom;
	opacity:0.1;
	}
.SOCIAL_ICO_SHARE_DISABLED
	{
	display:inline-block;
	padding-left:20px;
	vertical-align:bottom;
	opacity:0.1;
	}
.SOCIAL_ICO_REMOVE
	{
	display:inline-block;
	vertical-align:bottom;
	float:right;
	}
.SOCIAL_NUM_SHARES_FAVS
	{
	color:#A0A0A0;
	font-size:12pt;
	font-weight:bold;
	}
.SOCIAL_SHARER
	{
	display:inline-block;
	padding-left:4px;
	vertical-align:bottom;
	}
.SOCIAL_COMMENT
	{
	border-top:1px solid silver;
	}
.SOCIAL_COMMENT_PHOTO
	{
	display:inline-block;
	box-sizing:border-box;
	width:40px;
	height:54px;
	padding:10px 0;
	text-align:left;
	vertical-align:top;
	}
.SOCIAL_COMMENT_RIGHT_CONTAINER
	{
	display:inline-block;
	box-sizing:border-box;
	width:440px;
	padding:10px 0;
	}
.SOCIAL_COMMENT_RIGHT_AUTHOR
	{
        display:inline-block;
	box-sizing:border-box;
        width:280px;
	text-align:left;
	vertical-align:top;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
        }
.SOCIAL_FORM_NEW_COMMENT
	{
	display:inline-block;
	margin-left:56px;
	border-top:1px solid silver;
	padding-bottom:10px;
	width:480px;
	text-align:center;
	}
.SOCIAL_TEXTAREA_COMMENT
	{
	box-sizing:border-box;
	width:440px;
	margin:0;
	resize:none;
	}
.SOCIAL_COMMENT_IMG_CONTAINER
	{
	box-sizing:border-box;
	width:440px;
	margin:10px 0;
	}
.SOCIAL_COMMENT_IMG
	{
	box-sizing:border-box;
	width:440px;
	border-radius:4px;
	}
.SOCIAL_COMMENT_IMG_TIT_URL
	{
	box-sizing:border-box;
	width:440px;
	}

/************************************ Forum **********************************/
.FOR_IMG_CONTAINER
	{
	box-sizing:border-box;
	width:100%;
	margin:10px 0;
	}
.FOR_IMG
	{
	box-sizing:border-box;
	width:100%;
	border-radius:4px;
	}
.FOR_IMG_TIT_URL
	{
	box-sizing:border-box;
	width:480px;
	}

/*********************************** Messages ********************************/
.MSG_TO_ONE_RCP
	{
	display:inline-block;
	padding-left:4px;
	text-align:left;
	vertical-align:middle;
	}
.MSG_IMG_CONTAINER
	{
	box-sizing:border-box;
	width:100%;
	margin:10px 0;
	}
.MSG_IMG
	{
	box-sizing:border-box;
	width:100%;
	border-radius:4px;
	}
.MSG_IMG_TIT_URL
	{
	box-sizing:border-box;
	width:480px;
	}
.MSG_TXT	{color:#404040; font-size:13pt;}
.MSG_TIT	{color:#4D88A1; font-size:13pt;}
.MSG_TIT_NEW	{color:#4D88A1; font-size:13pt; font-weight:bold;}
.MSG_TIT_REM	{color:#AFC4CC; font-size:13pt;}
.MSG_TIT_BG
	{
	background-image:-webkit-linear-gradient(#eaf3f6 0,#eaf3f6 80%,white 100%);	/* Safari */
	background-image:linear-gradient(#eaf3f6 0,#eaf3f6 80%,white 100%);
	background-repeat:no-repeat;
	color:#4D88A1;
	font-size:13pt;
	}
.MSG_TIT_BG_NEW
	{
	background-image:-webkit-linear-gradient(#f5ffd7 0,#f5ffd7 80%,white 100%);	/* Safari */
	background-image:linear-gradient(#f5ffd7 0,#f5ffd7 80%,white 100%);
	background-repeat:no-repeat;
	color:#4D88A1;
	font-size:13pt;
	font-weight:bold;
	}
.MSG_TIT_BG_REM
	{
	background-image:-webkit-linear-gradient(#f3fcff 0,#f3fcff 80%,white 100%);	/* Safari */
	background-image:linear-gradient(#f3fcff 0,#f3fcff 80%,white 100%);
	background-repeat:no-repeat;
	color:#AFC4CC;
	font-size:13pt;
	}
.MSG_AUT_BG
	{
	background-image:-webkit-linear-gradient(#eaf3f6 0,#eaf3f6 80%,white 100%);	/* Safari */
	background-image:linear-gradient(#eaf3f6 0,#eaf3f6 80%,white 100%);
	background-repeat:no-repeat;
	color:#4D88A1;
	font-size:11pt;
	}
.MSG_AUT_BG_NEW
	{
	background-image:-webkit-linear-gradient(#f5ffd7 0,#f5ffd7 80%,white 100%);	/* Safari */
	background-image:linear-gradient(#f5ffd7 0,#f5ffd7 80%,white 100%);
	background-repeat:no-repeat;
	color:#4D88A1;
	font-size:11pt;
	font-weight:bold;
	}
.MSG_AUT_BG_REM
	{
	background-image:-webkit-linear-gradient(#f3fcff 0,#f3fcff 80%,white 100%);	/* Safari */
	background-image:linear-gradient(#f3fcff 0,#f3fcff 80%,white 100%);
	background-repeat:no-repeat;
	color:#AFC4CC;
	font-size:11pt;
	}
.MSG_DATE	{color:#4D88A1; font-size:11pt;}
.MSG_DATE_NEW	{color:#4D88A1; font-size:11pt; font-weight:bold;}

.BT		{width:20px; text-align:center; vertical-align:top;}
.BT0		{width:20px; text-align:center; vertical-align:top; background-color:#F4F2EA;}
.BT1		{width:20px; text-align:center; vertical-align:top; background-color:#FBFAF7;}
.BM		{width:20px; text-align:center; vertical-align:middle;}
.BM_SEL		{width:20px; text-align:center; vertical-align:middle; background-color:#C0FF40;}
.BM0		{width:20px; text-align:center; vertical-align:middle; background-color:#F4F2EA;}
.BM1		{width:20px; text-align:center; vertical-align:middle; background-color:#FBFAF7;}

/******************************** Pagination *********************************/
.PAG
	{
	display:inline-block;
	box-sizing:border-box;
	margin:4px 2px;
	padding:2px 8px;
	border-style:solid;
	border-width:1px;
	border-radius:4px;
	border-color:#C0DAE4;
	}
a.PAG:hover, .PAG_CUR
	{
	display:inline-block;
	box-sizing:border-box;
	margin:4px 2px;
	padding:2px 8px;
	border-style:solid;
	border-width:1px;
	border-radius:4px;
	border-color:#C0DAE4;
	background-color:#DDECF1;
	text-decoration:none;
	}
.PAG_TXT
	{
	font-size:13pt;
	font-weight:bold;
	color:#4D88A1;
	}

/***************************** Calls for exams *******************************/
.CONV_TIT
	{
	font-family:Garamond,"DejaVu LGC Serif","Bitstream Vera Serif",serif;
 	color:#404040;
 	font-weight:bold;
 	font-size:18pt;
 	}
.CONV_TIT_IMPR
	{
	font-family:Garamond,"DejaVu LGC Serif","Bitstream Vera Serif",serif;
	color:#202020;
	font-weight:bold;
	font-size:18pt;
	}
.CONV_NEG
	{
	font-family:Garamond,"DejaVu LGC Serif","Bitstream Vera Serif",serif;
	color:#404040;
	font-weight:bold;
	font-size:13pt;
	white-space:nowrap;
	}
.CONV_NEG_IMPR
	{
	font-family:Garamond,"DejaVu LGC Serif","Bitstream Vera Serif",serif;
	color:#202020;
	font-weight:bold;
	font-size:13pt;
	white-space:nowrap;
	text-align:right;
	}
.CONV
	{
	font-family:Garamond,"DejaVu LGC Serif","Bitstream Vera Serif",serif;
	color:#404040;
	font-size:13pt;
	}
.CONV_IMPR
	{
	font-family:Garamond,"DejaVu LGC Serif","Bitstream Vera Serif",serif;
	color:#202020;
	font-size:13pt;
	}

/***************************** Public user's profile *************************/
.PRF_FIG_LEFT_CONTAINER
	{
	display:inline-block;
	box-sizing:border-box;
	width:50%;
	padding-right:10px;
	text-align:right;
	vertical-align:top;
	}
.PRF_FIG_RIGHT_CONTAINER
	{
	display:inline-block;
	box-sizing:border-box;
	width:50%;
	padding-left:10px;
	text-align:left;
	vertical-align:top;
	}
.PRF_FIG_UL
	{
	display:inline-block;
	list-style-type:none;
	padding:0;
	margin:0;
	text-align:left;
	vertical-align:middle;
	}
.PRF_FIG_LI
	{
	padding:0 0 0 24px;
	background-size:20px 20px;
	background-repeat:no-repeat;
	background-position:left center;
	opacity:0.67;
	}

#following_side
	{
	display:inline-block;
	box-sizing:border-box;
	width:50%;
	padding-right:10px;
	}
#followers_side
	{
	display:inline-block;
	box-sizing:border-box;
	width:50%;
	padding-left:10px;
	}
.FOLLOW_SIDE
	{
	display:table;
	box-sizing:border-box;
	width:100%;
	}
#follows_me
	{
	display:table-cell;
	box-sizing:border-box;
	padding-right:20px;
	text-align:right;
	vertical-align:middle;
	}
#follow_usr
	{
	display:table-cell;
	height:60px;
	box-sizing:border-box;
	padding-left:20px;
	text-align:left;
	vertical-align:middle;
	}
.FOLLOW_BOX
	{
	display:table-cell;
	width:140px;
	text-align:center;
	vertical-align:middle;
	}
.FOLLOW_NUM
	{
	color:#404040;
	font-size:30pt;
	font-weight:bold;
	opacity:0.5;
	}
.FOLLOW_NUM_B
	{
	color:#404040;
	font-size:30pt;
	font-weight:bold;
	}
.FOLLOW_PHOTO
	{
	box-sizing:border-box;
	width:72px;
	height:90px;
	text-align:left;
	vertical-align:bottom;
	}
.FOLLOW_USR
	{
	box-sizing:border-box;
	width:100px;
	height:90px;
	}
.FOLLOW_USR_NAME
	{
	box-sizing:border-box;
	max-width:100px;
	text-align:left;
	vertical-align:bottom;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}
.FOLLOW_USR_ICO
	{
	padding:4px;
	}

/****************************** Users ranking ********************************/
.RANK_USR
	{
	box-sizing:border-box;
	max-width:50px;
	text-align:left;
	vertical-align:middle;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}

/************************* Indicators about courses **************************/
.INDICATORS td,.INDICATORS th
	{
	border:1px solid silver;
	border-collapse:collapse;
	padding:1px;
	}
.INDICATORS th
	{
	color:#4D88A1;
	font-size:12pt;
	font-weight:bold;
	}

/********************* Used to align buttons in account forms ****************/
.FORM_ACCOUNT
	{
	display:inline-block;
	box-sizing:border-box;
	min-width:312px;
	}

/************* Forms to edit institution, centre, degree, course *************/
.CODE
	{
	min-width:60px;
	text-align:right;
	vertical-align:middle;
	}
.INPUT_INS_CODE
	{
	width:90px;
	}
.INPUT_SHORT_NAME
	{
	width:90px;
	}
.INPUT_FULL_NAME
	{
	width:180px;
	}
.INPUT_WWW
	{
	width:90px;
	}

.INPUT_STATUS
	{
	width:80px;
	}
.INPUT_REQUESTER
	{
	width:90px;
	}

/********************************* Page foot *********************************/
@media only screen and (max-width: 800px)
	{	/* For mobile-phones */
	#foot_zone, #about_zone
		{
		display:none;
		}
	}
@media only screen and (min-width: 800px)
	{	/* For tablets and desktop */
	#foot_zone
		{
		padding:20px;
		}
	#about_zone
		{
		padding:20px;
		text-align:center;
		}
	}
.FOOT_LIST_CONTAINER
	{
	position:relative;
	float:left;
	text-align:left;
	padding-bottom:20px;
	background:white;
	}
.FOOT_LIST_TITLE
	{
	color:#666;
	font-size:14pt;
	font-weight:bold;
	white-space:nowrap;
	}
.FOOT_LIST
	{
	box-sizing:border-box;
	list-style-type:none;
 	margin:0;
	padding:0;
	border-width:0;
	font-size:12pt;
	white-space:nowrap;
 	line-height:140%;
	}
.FOOT_LINK
	{
	color:#2C90C9;
	}
.ABOUT
	{
	color:#A0A0A0;
	font-size:12pt;
	}

/************** Something that does not take up space and is not shown *******/
.NOT_SHOWN
	{
	display:none;
	}

/************ Something that takes up space but which is invisible ***********/
.HIDDEN
	{
	visibility:hidden;
	}