swad-core/css/swad18.60.1.css

3491 lines
71 KiB
CSS

/* 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-2019 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;
}
/*********************** 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,#404040 100%); /* Safari */
background-image:linear-gradient(#383838 0,#404040 100%);
background-repeat:no-repeat;
}
.HEAD_ROW_1_PURPLE
{
background-image:-webkit-linear-gradient(#812b5a 0,#874c80 100%); /* Safari */
background-image:linear-gradient(#812b5a, #874c80 100%);
background-repeat:no-repeat;
}
.HEAD_ROW_1_BLUE
{
background-color:#3781c1;
}
.HEAD_ROW_1_YELLOW
{
background-image:-webkit-linear-gradient(#292229 0,#302830 100%); /* Safari */
background-image:linear-gradient(#292229 0,#302830 100%);
background-repeat:no-repeat;
}
.HEAD_ROW_1_PINK
{
background-image:-webkit-linear-gradient(#bf667f 0,#c86b85 100%); /* Safari */
background-image:linear-gradient(#bf667f 0,#c86b85 100%);
background-repeat:no-repeat;
}
.HEAD_ROW_1_PINK
{
background-image:-webkit-linear-gradient(#8e5e8f 0,#ab5c84 100%); /* Safari */
background-image:linear-gradient(#8e5e8f 0,#ab5c84 100%);
background-repeat:no-repeat;
}
#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;
}
}
.TAGLINE_WHITE {color:#b0b0b0;}
.TAGLINE_GREY {color:#e0e0e0;}
.TAGLINE_PURPLE {color:#e0e0e0;}
.TAGLINE_BLUE {color:#bad2da;}
.TAGLINE_YELLOW {color:#b3b0b3;}
.TAGLINE_PINK {color:#e8e8e8;}
#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;
}
}
.USR_WHITE {color:#b0b0b0; font-size:15pt; font-weight:bold; white-space:nowrap;}
.USR_GREY {color:#e0e0e0; font-size:15pt; font-weight:bold; white-space:nowrap;}
.USR_PURPLE {color:#e0e0e0; font-size:15pt; font-weight:bold; white-space:nowrap;}
.USR_BLUE {color:white; font-size:15pt; font-weight:bold; white-space:nowrap;}
.USR_YELLOW {color:#b3b0b3; font-size:15pt; font-weight:bold; white-space:nowrap;}
.USR_PINK {color:white; 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;
}
/************************ 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_PURPLE
{
background-image:-webkit-linear-gradient(#874c80 0,#a070a1 100%); /* Safari */
background-image:linear-gradient(#874c80 0,#a070a1 100%);
background-repeat:no-repeat;
}
.HEAD_ROW_2_BLUE
{
background-image:-webkit-linear-gradient(#3781c1 0,#4f90c8 100%); /* Safari */
background-image:linear-gradient(#3781c1 0,#4f90c8 100%);
background-repeat:no-repeat;
}
.HEAD_ROW_2_YELLOW
{
background-color:#302830;
}
.HEAD_ROW_2_PINK
{
background-image:-webkit-linear-gradient(#ab5c84 0,#c86b85 100%); /* Safari */
background-image:linear-gradient(#ab5c84 0,#c86b85 100%);
background-repeat:no-repeat;
}
/******************************* 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.7;}
.BC_OFF {opacity:0.3;}
.BC_WHITE {color:#707070;}
.BC_GREY {color:#ffb42e;}
.BC_PURPLE {color:#ffc040;}
.BC_BLUE {color:#ffc040;}
.BC_YELLOW {color:#ffb42e;}
.BC_PINK {color:#ffc040;}
.BC_ICON
{
display:inline-block;
width:20px;
height:20px;
vertical-align:middle;
margin:-1px 0 1px 0;
}
/******** 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;
}
}
.MAIN_TITLE_WHITE {color:#4d88a1;}
.MAIN_TITLE_GREY {color:#f7f6f5;}
.MAIN_TITLE_PURPLE {color:white;}
.MAIN_TITLE_BLUE {color:white;}
.MAIN_TITLE_YELLOW {color:white;}
.MAIN_TITLE_PINK {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;
}
}
.NOTIF_WHITE {color:#707070; font-size:12pt; white-space:nowrap;}
.NOTIF_GREY {color:#e0e0e0; font-size:12pt; white-space:nowrap;}
.NOTIF_PURPLE {color:#e0e0e0; font-size:12pt; white-space:nowrap;}
.NOTIF_BLUE {color:white; font-size:12pt; white-space:nowrap;}
.NOTIF_YELLOW {color:#b3b0b3; font-size:12pt; white-space:nowrap;}
.NOTIF_PINK {color:white; 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_PURPLE
{
background-image:-webkit-linear-gradient(#a070a1 0,#a070a1 54px,white 54px,white 100%); /* Safari */
background-image:linear-gradient(#a070a1 0,#a070a1 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(#302830 0,#302830 54px,white 54px,white 100%); /* Safari */
background-image:linear-gradient(#302830 0,#302830 54px,white 54px,white 100%);
}
.HEAD_ROW_3_PINK
{
background-image:-webkit-linear-gradient(#c86b85 0,#c86b85 54px,white 54px,white 100%); /* Safari */
background-image:linear-gradient(#c86b85 0,#c86b85 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:#f7f6f5;}
.TAB_ON_GREY {background-color:#f7f6f5;}
.TAB_ON_PURPLE {background-color:#fdf3f3;}
.TAB_ON_BLUE {background-color:#e8f3f6;}
.TAB_ON_YELLOW {background-color:#faf0da;}
.TAB_ON_PINK {background-color:#faf0e8;}
.TAB_OFF_WHITE {background-color:#d4d4d4;}
.TAB_OFF_GREY {background-color:#aea79f;}
.TAB_OFF_PURPLE {background-color:#f2dada;}
.TAB_OFF_BLUE {background-color:#cae1e8;}
.TAB_OFF_YELLOW {background-color:#f4dfb2;}
.TAB_OFF_PINK {background-color:#f3dcca;}
.TAB_OFF_TXT_WHITE {color:#707070;}
.TAB_OFF_TXT_GREY {color:#505050;}
.TAB_OFF_TXT_PURPLE {color:#505050;}
.TAB_OFF_TXT_BLUE {color:#365e6e;}
.TAB_OFF_TXT_YELLOW {color:#4a2e19;}
.TAB_OFF_TXT_PINK {color:#505050;}
.TAB_ON_TXT_WHITE {color:#4d88A1;}
.TAB_ON_TXT_GREY {color:#606060;}
.TAB_ON_TXT_PURPLE {color:#573c4d;}
.TAB_ON_TXT_BLUE {color:#4d88A1;}
.TAB_ON_TXT_YELLOW {color:#7c4d2a;}
.TAB_ON_TXT_PINK {color:#63474e;}
.TAB_ICO
{
height:32px;
vertical-align:middle;
margin-top:2px;
padding:2px 0;
}
/*********************** 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.7;
}
#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 .MENU_ICO
{
box-sizing:border-box;
padding:28px 0 0 0;
background-size:auto 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.7;
}
#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 .MENU_ICO
{
box-sizing:border-box;
padding:28px 0 0 0;
background-size:auto 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.7;
}
#main_vertical .MENU_OPT_OFF:hover, #main_vertical .MENU_OPT_ON
{
opacity:1;
}
#main_vertical .MENU_ICO
{
display:table-cell;
box-sizing:border-box;
height:44px;
vertical-align:middle;
padding:2px 2px 2px 46px;
background-size:32px 32px;
background-repeat:no-repeat;
background-position:4px 6px;
}
#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:440px;
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;
}
}
.MENU_TXT_WHITE {color:#4D88a1;}
.MENU_TXT_GREY {color:#606060;}
.MENU_TXT_PURPLE {color:#573c4d;}
.MENU_TXT_BLUE {color:#4D88a1;}
.MENU_TXT_YELLOW {color:#7c4d2a;}
.MENU_TXT_PINK {color:#63474e;}
/****************** Title of current action in main block ********************/
.TITLE_ACTION_WHITE {color:#606060; font-size:20pt;}
.TITLE_ACTION_GREY {color:#606060; font-size:20pt;}
.TITLE_ACTION_PURPLE {color:#573c4d; font-size:20pt;}
.TITLE_ACTION_BLUE {color:#4D88A1; font-size:20pt;}
.TITLE_ACTION_YELLOW {color:#7c4d2a; font-size:20pt;}
.TITLE_ACTION_PINK {color:#63474e; font-size:20pt;}
.SUBTITLE_ACTION_WHITE {color:#606060; font-size:12pt;}
.SUBTITLE_ACTION_GREY {color:#606060; font-size:12pt;}
.SUBTITLE_ACTION_PURPLE {color:#573c4d; font-size:12pt;}
.SUBTITLE_ACTION_BLUE {color:#4D88A1; font-size:12pt;}
.SUBTITLE_ACTION_YELLOW {color:#7c4d2a; font-size:12pt;}
.SUBTITLE_ACTION_PINK {color:#63474e; 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;
width:100%;
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:360px;
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:360px;
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
{
float:right;
font-size:12pt;
color:#404040;
text-align:right;
overflow:hidden;
}
.NOTICE_DATE_OBSOLETE
{
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
{
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:#fff3d4; */
background-color:#fff8e5;
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);
}
.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 ***********************************/
.ICOx16 { height:16px; vertical-align:middle;}
.ICO16x16 {width:16px; height:16px; vertical-align:middle;}
.ICO20x20 {width:20px; height:20px; vertical-align:middle;}
.ICOx20 { height:20px; vertical-align:middle; margin:0 auto;}
.ICO25x25 {width:25px; 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:32px;
text-align:center;
vertical-align:top;
}
.CONTEXT_ICO_16x16
{
width:16px;
height:16px;
margin-top:-2px;
vertical-align:middle;
}
.CONTEXT_ICO_x16
{
height:16px;
margin-top:-2px;
vertical-align:middle;
}
/********************************** 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
{
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 ********************************/
.PHOTO12x16 {width: 12px; height: 16px; border-radius:1px; vertical-align:middle; margin-top:-2px;}
.PHOTO15x20 {width: 15px; height: 20px; border-radius:2px; vertical-align:middle;}
.PHOTO15x20B {width: 15px; height: 20px; border-radius:2px; display:block; margin:0 auto;}
.PHOTO18x24 {width: 18px; height: 24px; border-radius:2px; vertical-align:middle;}
.PHOTO21x28 {width: 21px; height: 28px; border-radius:2px; vertical-align:middle;}
.PHOTO30x40 {width: 30px; height: 40px; border-radius:2px; vertical-align:middle;}
.PHOTO42x56 {width: 42px; height: 56px; border-radius:3px; vertical-align:middle;}
.PHOTO45x60 {width: 45px; height: 60px; border-radius:3px; vertical-align:middle;}
.PHOTO60x80 {width: 60px; height: 80px; border-radius:3px; vertical-align:middle;}
.PHOTO186x248 {width:186px; height:248px; border-radius:8px; vertical-align:middle;}
.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;}
/*****************************************************************************/
.TITLE_WHITE {color:#505050; font-size:18pt;}
.TITLE_GREY {color:#505050; font-size:18pt;}
.TITLE_PURPLE {color:#573c4d; font-size:18pt;}
.TITLE_BLUE {color:#4D88A1; font-size:18pt;}
.TITLE_YELLOW {color:#7c4d2a; font-size:18pt;}
.TITLE_PINK {color:#63474e; font-size:18pt;}
/*********************** Icon and checkbox highlighting **********************/
.ICO_HIDDEN
{
opacity:0.3;
}
.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 ********************************/
/* Inside white box */
.FORM_IN_WHITE {color:#4d88a1; font-size:13pt;}
.FORM_IN_GREY {color:#4d88a1; font-size:13pt;}
.FORM_IN_PURPLE {color:#4d88a1; font-size:13pt;}
.FORM_IN_BLUE {color:#4d88a1; font-size:13pt;}
.FORM_IN_YELLOW {color:#7c4d2a; font-size:13pt;}
.FORM_IN_PINK {color:#4d88a1; font-size:13pt;}
/* Outside white box */
.FORM_OUT_WHITE {color:#4d88a1; font-size:13pt;}
.FORM_OUT_GREY {color:#4d88a1; font-size:13pt;}
.FORM_OUT_PURPLE {color:#573c4d; font-size:13pt;}
.FORM_OUT_BLUE {color:#4d88a1; font-size:13pt;}
.FORM_OUT_YELLOW {color:#7c4d2a; font-size:13pt;}
.FORM_OUT_PINK {color:#63474e; font-size:13pt;}
.BOLD {font-weight:bold;}
.NOWRAP {white-space:nowrap;}
/****************************** 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:darkgreen; font-size:13pt;}
.DAT_RED {color:darkred; 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_PURPLE {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#707070; 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;}
.DAT_SMALL_PINK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#707070; 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;
}
.REC_LEFT, .REC_RIGHT
{
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;
}
.PRJ_INPUT
{
max-width:500px;
}
/********************************** 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_TXT {color:#404040; font-size:12pt;}
.ANS_0 {color:#404040; font-size:12pt; font-weight:bold;}
.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;
}
.GAM_PLAY_QST_CONTAINER
{
width:80%;
float:left;
/* position:relative; */
}
.GAM_PLAY_NXT_CONTAINER
{
width:10%;
float:left;
/* position:relative; */
}
.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_CONTAINERS
{
margin:0 auto;
}
.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.3;
}
/****************************** Image uploading ******************************/
.IMG_UPLOAD_CONTAINER
{
vertical-align:top;
margin-bottom:10px;
}
.IMG_UPLOAD_BUTTON
{
cursor:pointer;
}
.IMG_UPLOAD_ICO
{
width:16px;
height:16px;
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;
}
/********************************* Attendance ********************************/
.ATT_CHECK
{
display:inline-block;
font-size:13pt;
font-weight:bold;
color:darkgreen;
}
.ATT_CROSS
{
display:inline-block;
font-size:13pt;
font-weight:bold;
color:darkred;
opacity:0.1;
}
/**************************** 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
{
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 20px;
background-size:16px 16px;
background-repeat:no-repeat;
background-position:left center;
opacity:0.7;
}
#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;
}
.INDICATORS_INPUT
{
max-width:500px;
}
/************* 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;
}