From e10185af2e1911ef66c51a3312c5220527dc2043 Mon Sep 17 00:00:00 2001 From: acanas Date: Sun, 16 Oct 2022 13:48:14 +0200 Subject: [PATCH] Version 22.49: Oct 16, 2022 Changes in project review form. --- css/swad22.49.css | 5087 +++++++++++++++++++++++++++++++++++++++++++++ js/swad22.49.js | 2173 +++++++++++++++++++ 2 files changed, 7260 insertions(+) create mode 100644 css/swad22.49.css create mode 100644 js/swad22.49.js diff --git a/css/swad22.49.css b/css/swad22.49.css new file mode 100644 index 000000000..d5181f2ca --- /dev/null +++ b/css/swad22.49.css @@ -0,0 +1,5087 @@ +/* style-sheet for 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-2022 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 . +*/ +/********************************* Body **************************************/ +body + { + margin:0; + font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; + font-size:1em; + overflow-y:scroll; /* force vertical scrollbar */ + } +.BODY_WHITE, +.BODY_GREY, +.BODY_PURPLE, +.BODY_BLUE, +.BODY_YELLOW, +.BODY_PINK {background-color:white;} +.BODY_DARK {background-color:#383838;} + +input + { + font-size:12pt; + } +select + { + font-size:12pt; + } +textarea + { + font-size:13pt; + font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; + } +.INPUT_WHITE, +.INPUT_GREY, +.INPUT_PURPLE, +.INPUT_BLUE, +.INPUT_YELLOW, +.INPUT_PINK {} +.INPUT_DARK {border-color:#505050;background-color:#1f1f1f;color:white;} + +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 ****************************/ +.BODY_WHITE a, +.BODY_GREY a, +.BODY_PURPLE a, +.BODY_BLUE a, +.BODY_YELLOW a, +.BODY_PINK a {color:#4d88a1;} +.BODY_DARK a {color:#afc4cc;} +a + { + text-decoration:none; + } +a:link, a:visited, a:active + { + text-decoration:none; + } +a:hover /* Default ==> underlined */ + { + text-decoration:underline; opacity:1; + } + +.NICK_WHITE, +.NICK_GREY, +.NICK_PURPLE, +.NICK_BLUE, +.NICK_YELLOW, +.NICK_PINK + { + background:transparent; + border:none; + padding:0; + font:inherit; + color:#4d88a1; + text-decoration:none; + } +.NICK_DARK + { + background:transparent; + border:none; + padding:0; + font:inherit; + color:#afc4cc; + } +.NICK_WHITE:hover, +.NICK_GREY:hover, +.NICK_PURPLE:hover, +.NICK_BLUE:hover, +.NICK_YELLOW:hover, +.NICK_PINK:hover, +.NICK_DARK:hover + { + cursor:pointer; + text-decoration:underline; + } + +/****************** Layout (the whole page with a background) ****************/ +#whole_page + { + display:table; + box-sizing:border-box; + width: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(#8e5e8f 0,#ab5c84 100%); /* Safari */ + background-image:linear-gradient(#8e5e8f 0,#ab5c84 100%); + background-repeat:no-repeat; + } +.HEAD_ROW_1_DARK + { + background-image:-webkit-linear-gradient(#303030 0,#383838 100%); /* Safari */ + background-image:linear-gradient(#303030 0,#383838 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;} +.TAGLINE_DARK {color:#e0e0e0;} + +#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;} +.USR_DARK {color:#e0e0e0; 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; + } +.HEAD_ROW_2_DARK + { + background-color:#383838; + } + +/******************************* 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: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); + } +#current_month + { + border-radius:2px 2px 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:#404040; + margin:2px 0 -2px 0; + font-size:20pt; + font-weight:bold; + line-height:100%; + } +.CURRENT_DAY + { + color:#404040; + } +#current_time + { + border-radius:0 0 2px 2px; + color:#404040; + 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/center/degree/course) *******/ +#head_row_2_hierarchy + { + display:table-cell; + text-align:center; + vertical-align:middle; + } +.TOP_LOGO /* Institution / Center / Degree logo in top title */ + { + height:40px; + margin-right:10px; + text-align:left; + vertical-align:middle !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_DARK {color:#ffb42e;} + +.BC_ICO + { + display:inline-block; + width:20px; + height:20px; + vertical-align:middle; + margin:-1px 0 1px 0; + } + +/* Creating filter from RGB: https://codepen.io/sosuke/pen/Pjoqqp */ +.BC_ICO_WHITE {filter: invert(45%) sepia(0%) saturate(14%) hue-rotate(159deg) brightness(96%) contrast(89%);} /* #707070 */ +.BC_ICO_GREY {filter: invert(61%) sepia(96%) saturate(366%) hue-rotate(352deg) brightness(103%) contrast(101%);} /* #ffb42e */ +.BC_ICO_PURPLE {filter: invert(77%) sepia(91%) saturate(1669%) hue-rotate(327deg) brightness(110%) contrast(103%);} /* #ffc040 */ +.BC_ICO_BLUE {filter: invert(77%) sepia(91%) saturate(1669%) hue-rotate(327deg) brightness(110%) contrast(103%);} /* #ffc040 */ +.BC_ICO_YELLOW {filter: invert(61%) sepia(96%) saturate(366%) hue-rotate(352deg) brightness(103%) contrast(101%);} /* #ffb42e */ +.BC_ICO_PINK {filter: invert(77%) sepia(91%) saturate(1669%) hue-rotate(327deg) brightness(110%) contrast(103%);} /* #ffc040 */ +.BC_ICO_DARK {filter: invert(61%) sepia(96%) saturate(366%) hue-rotate(352deg) brightness(103%) contrast(101%);} /* #ffb42e */ + +/******** Big name of country, institution, center, 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; + 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; + 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;} +.MAIN_TITLE_DARK {color:#f7f6f5;} +#my_courses + { + width:130px; + margin:1px; + } + +/******************************** Search *************************************/ +.WHAT_TO_SEARCH + { + width:186px; + } + +/***************************** 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;} +.NOTIF_DARK {color:#e0e0e0; font-size:12pt; white-space:nowrap;} + +/* Creating filter from RGB: https://codepen.io/sosuke/pen/Pjoqqp */ +.NOTIF_ICO_WHITE {filter: invert(45%) sepia(0%) saturate(14%) hue-rotate(159deg) brightness(96%) contrast(89%);} /* #707070 */ +.NOTIF_ICO_GREY {filter: invert(98%) sepia(44%) saturate(30%) hue-rotate(167deg) brightness(116%) contrast(76%);} /* #e0e0e0 */ +.NOTIF_ICO_PURPLE {filter: invert(98%) sepia(44%) saturate(30%) hue-rotate(167deg) brightness(116%) contrast(76%);} /* #e0e0e0 */ +.NOTIF_ICO_BLUE {filter: invert(100%) sepia(19%) saturate(4118%) hue-rotate(214deg) brightness(115%) contrast(100%);} /* #ffffff */ +.NOTIF_ICO_YELLOW {filter: invert(89%) sepia(3%) saturate(180%) hue-rotate(251deg) brightness(79%) contrast(92%);} /* #b3b0b3 */ +.NOTIF_ICO_PINK {filter: invert(100%) sepia(19%) saturate(4118%) hue-rotate(214deg) brightness(115%) contrast(100%);} /* #ffffff */ +.NOTIF_ICO_DARK {filter: invert(98%) sepia(44%) saturate(30%) hue-rotate(167deg) brightness(116%) contrast(76%);} /* #e0e0e0 */ + +/******************* 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%); + } +.HEAD_ROW_3_DARK + { + background-image:-webkit-linear-gradient(#383838 0,#383838 54px,#383838 54px,#383838 100%); /* Safari */ + background-image:linear-gradient(#383838 0,#383838 54px,#383838 54px,#383838 100%); + } + +.TAB_LIST + { + display:inline-block; + list-style-type:none; + padding:0; + margin:0; + text-align:left; + vertical-align:middle; + } + +@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:58px; + margin:0; + padding:0; + border-radius:2px 2px 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:58px; + margin:0; + padding:0; + border-radius:2px 2px 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; + max-width:30px; + white-space:nowrap; + overflow:hidden; + padding-top:2px; + 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:58px; + margin:0; + padding:0; + border-radius:2px 2px 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:58px; + margin:0; + padding:0; + border-radius:2px 2px 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; + max-width:50px; + white-space:nowrap; + overflow:hidden; + padding-top:2px; + 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:108px; + height:58px; + margin:0; + padding:0; + border-radius:2px 2px 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:108px; + height:58px; + margin:0; + padding:0; + border-radius:2px 2px 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; + max-width:100px; + white-space:nowrap; + overflow:hidden; + padding-top:2px; + 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_ON_DARK {background-color:#505050;} + +.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_DARK {background-color:#404040;} + +.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_OFF_TXT_DARK {color:#d0d0d0;} + +.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_ON_TXT_DARK {color:#e0e0e0;} + +.TAB_ICO + { + height:28px; + vertical-align:middle; + padding:4px 0; + } +/* Creating filter from RGB: https://codepen.io/sosuke/pen/Pjoqqp */ +.TAB_ICO_WHITE, +.TAB_ICO_GREY, +.TAB_ICO_PURPLE, +.TAB_ICO_BLUE, +.TAB_ICO_YELLOW, +.TAB_ICO_PINK {} +.TAB_ICO_DARK {filter:invert(1);} + +/*********************** Layout (fourth row, main zone) **********************/ +#main_zone + { + display:table; + box-sizing:border-box; + width:100%; + } +.LEFT_RIGHT_CELL + { + padding:0 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:-4px 0 0 0; + padding:4px 0; + border-radius:2px; + box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2); + text-align:center; + 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:-4px 0 0 0; + padding:4px 0; + border-radius:2px; + box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2); + text-align:center; + position:relative; + } + } + +/************* Main central zone with horizontal menu and canvas *************/ +#main_horizontal + { + box-sizing:border-box; + width:100%; + } +#main_horizontal .MENU_LIST_CONT + { + 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.6; + } +#main_horizontal .MENU_OPT_OFF:hover, #main_horizontal .MENU_OPT_ON + { + opacity:1; + transform:scale(1.286,1.286); + } + +#main_horizontal .MENU_ICO_TXT + { + } +#main_horizontal .MENU_ICO + { + box-sizing:border-box; + padding:28px 0 0 0; + background-size:auto 26px; + 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_CONT + { + 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.6; + } + #main_vertical .MENU_OPT_OFF:hover, #main_vertical .MENU_OPT_ON + { + opacity:1; + transform:scale(1.286,1.286); + } + #main_vertical .MENU_ICO_TXT + { + } + #main_vertical .MENU_ICO + { + box-sizing:border-box; + padding:28px 0 0 0; + background-size:auto 26px; + 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_CONT + { + 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.6; + } + #main_vertical .MENU_OPT_OFF:hover, #main_vertical .MENU_OPT_ON + { + opacity:1; + } + #main_vertical .MENU_ICO_TXT + { + display:table-cell; + vertical-align:middle; + } + #main_vertical .MENU_ICO + { + display:inline-block; + box-sizing:border-box; + height:40px; + vertical-align:middle; + padding:2px 2px 2px 42px; + background-size:28px 28px; + 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; + } + } +/* Creating filter from RGB: https://codepen.io/sosuke/pen/Pjoqqp */ +.MENU_ICO_WHITE, +.MENU_ICO_GREY, +.MENU_ICO_PURPLE, +.MENU_ICO_BLUE, +.MENU_ICO_YELLOW, +.MENU_ICO_PINK {} +.MENU_ICO_DARK {filter:invert(1);} + +/********************************* Menu fonts ********************************/ +@media only screen and (max-width: 800px) + { /* For mobile-phones */ + .MENU_TXT + { + display:inline; + font-size:12pt; + font-weight:bold; + line-height:110%; + white-space:nowrap; + overflow:hidden; + width:30px; + margin:0 auto; + padding:2px 0; + } + } +@media only screen and (min-width: 800px) + { /* For tablets and desktop */ + .MENU_TXT + { + display:inline; + font-size:12pt; + font-weight:bold; + line-height:110%; + margin:0 auto; + padding:2px 0; + } + } +.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;} +.MENU_TXT_DARK {color:#d0d0d0;} + +/***************************** Users connected *******************************/ +.CON + { + box-sizing:border-box; + margin:0 auto; + border-style:solid; + border-width:1px; + border-color:#80c040; + margin:6px 0; + padding:5px; + border-radius:2px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + +.CON_WHITE, +.CON_GREY, +.CON_PURPLE, +.CON_BLUE, +.CON_YELLOW, +.CON_PINK {color:#398000;} +.CON_DARK {color:#80c040;} + +.CON_LIST + { + box-sizing:border-box; + width:100%; + margin-top:2px; + padding:6px 0 0 0; + border-style:solid; + border-width:1px 0 0 0; + border-color:rgba(128,192,64,0.2); + white-space:nowrap; + overflow:hidden; + } +.CON_USR_NARROW_TIT + { + max-width:136px; + text-align:center; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + +/* Connected to the current course? */ +.CON_CRS {font-size:10pt; line-height:110%; white-space:nowrap;} +.CON_NO_CRS {font-size:10pt; line-height:110%; white-space:nowrap; opacity:0.5;} + +/* 1st. column */ +.CON_PHOTO + { + width:22px; + text-align:left; + vertical-align:middle; + } + +/* 2nd. column */ +.CON_NAME_NARROW + { + width:66px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.CON_NAME_FOLLOW + { + width:90px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.CON_NAME_WIDE + { + width:360px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + +/* 3rd. column */ +.CON_SINCE + { + width:48px; + text-align:right; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + } +.CON_ICON_FOLLOW + { + width:24px; + vertical-align:middle; + } + +/*************************** Most frequent actions ***************************/ +#MFU_actions + { + box-sizing:border-box; + width:148px; + border-style:solid; + border-width:1px; + border-color:#8cbcce; + padding:5px; + border-radius:2px; + font-size:11pt; + } +#MFU_actions ul + { + display:inline-block; + box-sizing:border-box; + width:138px; + margin:2px 0; + padding:6px 0 0 0; + border-style:solid; + border-width:1px 0 0 0; + border-color:rgba(140,188,206,0.2); + list-style-type:none; + text-align:left; + vertical-align:middle; + } +#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:2px 4px 2px 0; + vertical-align:middle; + } + +/********************************* Hierarchy *********************************/ +.HIE_SEL + { + width:175px; + } +.HIE_LOGO + { + text-align:left; + vertical-align:middle; + width:25px; + } +.HIE_SEL_NARROW + { + width:64px; + } + +#chart_div + { + width:600px; + margin:12px auto; + } + +.HIE_CFG_LEFT, .HIE_CFG_RIGHT + { + display:inline-block; + margin:0 6px; + vertical-align:top; + width:480px; + } + +@media only screen and (max-width: 590px) + { /* For mobile-phones (maximum width visible on Moto G4 vertical) */ + .HIE_CFG_WIDTH {width:280px;} + .COUNTRY_MAP_SHOW, .COUNTRY_MAP_PRINT + { + box-sizing:border-box; + width:260px; + height:260px; + margin:10px; + } + .CENTER_PHOTO_WIDTH {width:260px;} + #AttributionArea + { + box-sizing:border-box; + width:260px; + } + } +@media only screen and (min-width: 590px) + { /* For tablets and desktop (maximum width visible on Moto G4 horizontal) */ + .HIE_CFG_WIDTH {width:480px;} + .COUNTRY_MAP_SHOW, .COUNTRY_MAP_PRINT + { + box-sizing:border-box; + width:360px; + height:360px; + margin:10px; + } + .COUNTRY_MAP_WIDTH, .CENTER_PHOTO_WIDTH {width:460px;} + #AttributionArea + { + box-sizing:border-box; + width:460px; + } + } + +.HIE_CFG_LEFT, .HIE_CFG_RIGHT + { + display:inline-block; + margin:0 6px; + vertical-align:top; + } + +#sys_mapid, #cty_mapid, #ins_mapid, #ctr_mapid + { + width:100%; + height:460px; + margin:9px auto; + } +.CENTER_PHOTO_SHOW + { + box-sizing:border-box; + padding:2px; + margin:9px auto; + border:solid 1px #EEE; + } +a:hover img.CENTER_PHOTO_SHOW + { + border:solid 1px #CCC; + box-shadow:1px 1px 6px #999; + } +.CENTER_PHOTO_PRINT + { + box-sizing:border-box; + padding:2px; + margin:9px auto; + border:solid 1px #EEE; + box-shadow:1px 1px 6px #999; + } +.ATTRIBUTION + { + box-sizing:border-box; + margin-bottom:15px; + color:#a0a0a0; + font-size:8pt; + text-align:center; + } + +/*********************************** Places **********************************/ +.PLC_SEL + { + width:60px; + } + +/***************************** Buildings and rooms ***************************/ +.BLD_SEL, .ROOM_TYPE_SEL + { + width:80px; + } + +/*********************************** Month ***********************************/ +.CALENDAR + { + margin:0 auto; + border-spacing:12px 0; + } +.MONTH_CONT + { + box-sizing:border-box; + width:148px; + margin:6px 0; + padding:5px; + border-style:solid; + border-width:1px; + border-color:#8cbcce; + border-radius:2px; + 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:rgba(140,188,206,0.2); + } +.MONTH + { + font-size:9pt; + white-space:nowrap; + text-transform:uppercase; + } + +.DAY_WRK_HEAD_WHITE, +.DAY_WRK_HEAD_GREY, +.DAY_WRK_HEAD_PURPLE, +.DAY_WRK_HEAD_BLUE, +.DAY_WRK_HEAD_YELLOW, +.DAY_WRK_HEAD_PINK {color:#4d88a1;} +.DAY_WRK_HEAD_DARK {color:#8cbcce;} + +.DAY_NO_WRK_HEAD_WHITE, +.DAY_NO_WRK_HEAD_GREY, +.DAY_NO_WRK_HEAD_PURPLE, +.DAY_NO_WRK_HEAD_BLUE, +.DAY_NO_WRK_HEAD_YELLOW, +.DAY_NO_WRK_HEAD_PINK {color:red;} +.DAY_NO_WRK_HEAD_DARK {color:#ff8080;} + +.DAY_WRK_WHITE, +.DAY_WRK_GREY, +.DAY_WRK_PURPLE, +.DAY_WRK_BLUE, +.DAY_WRK_YELLOW, +.DAY_WRK_PINK {color:#202020;} +.DAY_WRK_DARK {color:white;} + +.DAY_WRK_LIGHT_WHITE, +.DAY_WRK_LIGHT_GREY, +.DAY_WRK_LIGHT_PURPLE, +.DAY_WRK_LIGHT_BLUE, +.DAY_WRK_LIGHT_YELLOW, +.DAY_WRK_LIGHT_PINK {color:rgba( 32, 32, 32,0.3);} +.DAY_WRK_LIGHT_DARK {color:rgba(255,255,255,0.3);} + +.DAY_NO_WORK_WHITE, +.DAY_NO_WORK_GREY, +.DAY_NO_WORK_PURPLE, +.DAY_NO_WORK_BLUE, +.DAY_NO_WORK_YELLOW, +.DAY_NO_WORK_PINK {color:#c04080;} +.DAY_NO_WORK_DARK {color:#e0a0c0;} + +.DAY_NO_WORK_LIGHT_WHITE, +.DAY_NO_WORK_LIGHT_GREY, +.DAY_NO_WORK_LIGHT_PURPLE, +.DAY_NO_WORK_LIGHT_BLUE, +.DAY_NO_WORK_LIGHT_YELLOW, +.DAY_NO_WORK_LIGHT_PINK {color:rgba(192, 64,128,0.3);} +.DAY_NO_WORK_LIGHT_DARK {color:rgba(224,160,192,0.3);} + + +.DAY_HLD_WHITE, +.DAY_HLD_GREY, +.DAY_HLD_PURPLE, +.DAY_HLD_BLUE, +.DAY_HLD_YELLOW, +.DAY_HLD_PINK {color:red;} +.DAY_HLD_DARK {color:#ff8080;} + +.DAY_HLD_LIGHT_WHITE, +.DAY_HLD_LIGHT_GREY, +.DAY_HLD_LIGHT_PURPLE, +.DAY_HLD_LIGHT_BLUE, +.DAY_HLD_LIGHT_YELLOW, +.DAY_HLD_LIGHT_PINK {color:rgba(255, 0, 0,0.3);} +.DAY_HLD_LIGHT_DARK {color:rgba(255,128,128,0.3);} + +.DAY + { + border:solid 1px; + border-color:transparent; + font-size:9pt; + text-align:center; + } +.TODAY + { + border:solid 1px; + border-color:#50b800; + font-size:9pt; + text-align:center; + } +.DAY_EVENT + { + border:solid 1px; + border-color:rgba(255,255,255,0.5); + background-color:rgba(255,240,128,0.5); + font-size:9pt; + text-align:center; + } +.TODAY_EVENT + { + border:solid 1px; + border-color:#50b800; + background-color:rgba(255,240,128,0.5); + font-size:9pt; + text-align:center; + } + +/********************************* Buttons ***********************************/ +.BT_CREATE + { + background-color:#5bc33b; + border-color:#518741; + } +.BT_CONFIRM + { + background-color:#55acee; + border-color:#3b88c3; + } +.BT_REMOVE + { + background-color:#ef5555; + border-color:#c33b3b; + } +.BT_SUBMIT + { + margin:8px auto; + padding:10px 20px; + border-radius:2px; + border-width:1px; + border-style:solid; + 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:2px; + border-width:1px; + border-style:solid; + 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)); + } + +.BT_LINK, .BT_LINK_OFF + { + background:none; + border:none; + padding:0; + font:inherit; + color:inherit; + } +.BT_LINK:hover + { + cursor:pointer; + } + +/****************************** Course program *******************************/ +.PRG_COL1 + { + box-sizing:border-box; + width:44px; + } + +.PRG_TITLE_DESCRIPTION_WIDTH + { + box-sizing:border-box; + width:100%; + } + +.PRG_NUM + { + width:30px; + text-align:left; + vertical-align:top; + } + +.PRG_MAIN + { + text-align:left; + vertical-align:top; + } + + +.PRG_TIT_1_WHITE, +.PRG_TIT_1_GREY, +.PRG_TIT_1_PURPLE, +.PRG_TIT_1_BLUE, +.PRG_TIT_1_YELLOW, +.PRG_TIT_1_PINK {color:#4d88a1; font-size:20pt; font-weight:bold;} +.PRG_TIT_1_DARK {color:#afc4cc; font-size:20pt; font-weight:bold;} + +.PRG_TIT_2_WHITE, +.PRG_TIT_2_GREY, +.PRG_TIT_2_PURPLE, +.PRG_TIT_2_BLUE, +.PRG_TIT_2_YELLOW, +.PRG_TIT_2_PINK {color:#4d88a1; font-size:18pt; font-weight:bold;} +.PRG_TIT_2_DARK {color:#afc4cc; font-size:18pt; font-weight:bold;} + +.PRG_TIT_3_WHITE, +.PRG_TIT_3_GREY, +.PRG_TIT_3_PURPLE, +.PRG_TIT_3_BLUE, +.PRG_TIT_3_YELLOW, +.PRG_TIT_3_PINK {color:#4d88a1; font-size:16pt; font-weight:bold;} +.PRG_TIT_3_DARK {color:#afc4cc; font-size:16pt; font-weight:bold;} + +.PRG_TIT_4_WHITE, +.PRG_TIT_4_GREY, +.PRG_TIT_4_PURPLE, +.PRG_TIT_4_BLUE, +.PRG_TIT_4_YELLOW, +.PRG_TIT_4_PINK {color:#4d88a1; font-size:14pt; font-weight:bold;} +.PRG_TIT_4_DARK {color:#afc4cc; font-size:14pt; font-weight:bold;} + +.PRG_TIT_5_WHITE, +.PRG_TIT_5_GREY, +.PRG_TIT_5_PURPLE, +.PRG_TIT_5_BLUE, +.PRG_TIT_5_YELLOW, +.PRG_TIT_5_PINK {color:#4d88a1; font-size:13pt; font-weight:bold;} +.PRG_TIT_5_DARK {color:#afc4cc; font-size:13pt; font-weight:bold;} + +.PRG_TXT_WHITE, +.PRG_TXT_GREY, +.PRG_TXT_PURPLE, +.PRG_TXT_BLUE, +.PRG_TXT_YELLOW, +.PRG_TXT_PINK {color:#202020; font-size:12pt; line-height:1.5;} +.PRG_TXT_DARK {color:#e0e0e0; font-size:12pt; line-height:1.5;} + +.PRG_DATE + { + box-sizing:border-box; + width:70px; + } + +.PRG_HIDDEN + { + opacity:0.33; + } + +#prg_highlighted + { + animation:itemfadein 1s ease forwards; + } +@keyframes itemfadein + { + /* from {outline:thick solid #4d88a1;} + to {outline:thick solid transparent;} */ + from {opacity:0;} + to {opacity:1;} + } + +.PRG_RSC_COL1 + { + box-sizing:border-box; + width:66px; + } + +.PRG_RSC_WHITE, +.PRG_RSC_GREY, +.PRG_RSC_PURPLE, +.PRG_RSC_BLUE, +.PRG_RSC_YELLOW, +.PRG_RSC_PINK {color:#202020; font-size:13pt;} +.PRG_RSC_DARK {color:#e0e0e0; font-size:13pt;} + +.PRG_RSC_INPUT + { + box-sizing:border-box; + width:360px; + } + +.PRG_LNK_WHITE {color:#4d88a1; font-size:13pt;} +.PRG_LNK_GREY {color:#4d88a1; font-size:13pt;} +.PRG_LNK_PURPLE {color:#4d88a1; font-size:13pt;} +.PRG_LNK_BLUE {color:#4d88a1; font-size:13pt;} +.PRG_LNK_YELLOW {color:#7c4d2a; font-size:13pt;} +.PRG_LNK_PINK {color:#4d88a1; font-size:13pt;} +.PRG_LNK_DARK {color:#afc4cc; font-size:13pt;} + +/************************* Program resource clipboard ************************/ +.PRG_CLIPBOARD + { + box-sizing:border-box; + list-style-type:none; + padding:0; + margin:0; + text-align:left; + vertical-align:middle; + } +/* +.PRG_CLIPBOARD li + { + text-align:left; + vertical-align:middle; + } +.PRG_CLIPBOARD label + { + font-size:13pt; + } +*/ +/********************************** Notice ***********************************/ +.NOTICE_CONT + { + padding:10px 0; + } +.NOTICE_HIGHLIGHT {animation:fadeinnotice 2s linear forwards;} +@keyframes fadeinnotice + { + from {background-color:rgba(166,196,208,0.33);} + to {background-color:rgba(166,196,208,0);} + } + +.NOTICE_BOX + { + box-sizing:border-box; + margin:0 auto 10px auto; + padding:10px; + background-image:-webkit-linear-gradient(rgba(238,216,108,0.5) 0%,rgba(248,237,149,0.5) 15%,rgba(250,240,152,0.5) 100%); /* Safari */ + background-image:linear-gradient(rgba(238,216,108,0.5) 0%,rgba(248,237,149,0.5) 15%,rgba(250,240,152,0.5) 100%); + box-shadow:0 8px 10px -5px rgba(125,113,0,0.5); + text-align:left; + overflow:hidden; + } +.NOTICE_BOX_NARROW {width:148px;} +.NOTICE_BOX_WIDE {width:500px;} +.NOTICE_DATE + { + float:right; + font-size:12pt; + text-align:right; + overflow:hidden; + } +.NOTICE_DATE_WHITE, +.NOTICE_DATE_GREY, +.NOTICE_DATE_PURPLE, +.NOTICE_DATE_BLUE, +.NOTICE_DATE_YELLOW, +.NOTICE_DATE_PINK {color:#202020;} +.NOTICE_DATE_DARK {color:white;} +.NOTICE_SUBJECT + { + margin:12px auto; + font-size:15pt; + font-weight:bold; + text-align:center; + overflow:hidden; + } +.NOTICE_SUBJECT_WHITE, +.NOTICE_SUBJECT_GREY, +.NOTICE_SUBJECT_PURPLE, +.NOTICE_SUBJECT_BLUE, +.NOTICE_SUBJECT_YELLOW, +.NOTICE_SUBJECT_PINK {color:#202020;} +.NOTICE_SUBJECT_DARK {color:white;} +.NOTICE_TEXT_BRIEF + { + clear:both; + font-size:12pt; + overflow:hidden; + } +.NOTICE_TEXT + { + padding:10px 20px; + clear:both; + font-size:12pt; + overflow:hidden; + } +.NOTICE_TEXT_WHITE, +.NOTICE_TEXT_GREY, +.NOTICE_TEXT_PURPLE, +.NOTICE_TEXT_BLUE, +.NOTICE_TEXT_YELLOW, +.NOTICE_TEXT_PINK {color:#204080;} +.NOTICE_TEXT_DARK {color:#f0f8ff;} +.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_WHITE, +.NOTICE_AUTHOR_GREY, +.NOTICE_AUTHOR_PURPLE, +.NOTICE_AUTHOR_BLUE, +.NOTICE_AUTHOR_YELLOW, +.NOTICE_AUTHOR_PINK {color:#202020;} +.NOTICE_AUTHOR_DARK {color:white;} +.NOTICE_USERS + { + box-sizing:border-box; + text-align:center; + vertical-align:middle; + margin:12px; + font-size:12pt; + color:#202020; + } + +/**************************** Institutional links ****************************/ +#institutional_links + { + box-sizing:border-box; + width:148px; + margin:0; + border-style:solid; + border-width:1px; + border-color:#8cbcce; + padding:5px; + border-radius:2px; + font-size:11pt; + } +#institutional_links ul + { + display:inline-block; + box-sizing:border-box; + width:138px; + margin:2px 0; + padding:6px 0 0 0; + border-style:solid; + border-width:1px 0 0 0; + border-color:rgba(140,188,206,0.2); + list-style-type:none; + text-align:left; + vertical-align:middle; + } +#institutional_links li + { + width:138px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.INS_LNK + { + padding:1px; + } + +/*********************************** Alerts **********************************/ +.ALERT + { + display:inline-block; + box-sizing:border-box; + margin:8px auto; + padding:12px; + 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_BG_WHITE, +.ALERT_BG_GREY, +.ALERT_BG_PURPLE, +.ALERT_BG_BLUE, +.ALERT_BG_YELLOW, +.ALERT_BG_PINK {background-color:#fff8e5;} +.ALERT_BG_DARK {background-color:#808080;} + +.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; + text-align:left; + overflow:hidden; + } +.ALERT_TXT_WHITE, +.ALERT_TXT_GREY, +.ALERT_TXT_PURPLE, +.ALERT_TXT_BLUE, +.ALERT_TXT_YELLOW, +.ALERT_TXT_PINK {color:#632921;} +.ALERT_TXT_DARK {color:white;} + +/*********************************** 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;} + +.ICO80x40 {width:80px; height:40px; vertical-align:middle;} +.ICO140x40 {width:140px; height:40px; vertical-align:middle;} +.ICO212x40 {width:212px; height:40px; vertical-align:middle;} +.ICO220x40 {width:220px; height:40px; vertical-align:middle;} +.ICO265x40 {width:265px; height:40px; vertical-align:middle;} + +.ICO160x160 {width:160px; height:160px; vertical-align:middle;} +.BANNER {width:150px; height:50px;} +.BANNER_SMALL {width:75px; height:25px;} + +.ICO_DARKRED {color:#660000;} + +/****** 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_ICO16x16 + { + width:16px; + height:16px; + margin-top:-2px; + vertical-align:middle; + } +.CONTEXT_ICOx16 + { + height:16px; + margin-top:-2px; + vertical-align:middle; + } +/* Creating filter from RGB: https://codepen.io/sosuke/pen/Pjoqqp */ +.ICO_BLACK_WHITE, +.ICO_BLACK_GREY, +.ICO_BLACK_PURPLE, +.ICO_BLACK_BLUE, +.ICO_BLACK_YELLOW, +.ICO_BLACK_PINK {filter: invert(26%) sepia(0%) saturate(1%) hue-rotate(288deg) brightness(97%) contrast(102%);} /* #404040 */ +.ICO_BLACK_DARK {filter: invert(92%) sepia(44%) saturate(2%) hue-rotate(176deg) brightness(110%) contrast(88%);} /* #f0f0f0 */ + +.ICO_GREEN_WHITE, +.ICO_GREEN_GREY, +.ICO_GREEN_PURPLE, +.ICO_GREEN_BLUE, +.ICO_GREEN_YELLOW, +.ICO_GREEN_PINK {filter: invert(31%) sepia(16%) saturate(3727%) hue-rotate(60deg) brightness(94%) contrast(104%);} /* #246600 */ +.ICO_GREEN_DARK {filter: invert(75%) sepia(13%) saturate(1915%) hue-rotate(46deg) brightness(89%) contrast(89%);} /* #80c040 */ + +.ICO_RED_WHITE, +.ICO_RED_GREY, +.ICO_RED_PURPLE, +.ICO_RED_BLUE, +.ICO_RED_YELLOW, +.ICO_RED_PINK {filter: invert(8%) sepia(61%) saturate(5373%) hue-rotate(0deg) brightness(92%) contrast(114%);} /* #660000 */ +.ICO_RED_DARK {filter: invert(51%) sepia(58%) saturate(1457%) hue-rotate(320deg) brightness(126%) contrast(104%);} /* #ff8080 */ + +.ICO_WHITE_WHITE, +.ICO_WHITE_GREY, +.ICO_WHITE_PURPLE, +.ICO_WHITE_BLUE, +.ICO_WHITE_YELLOW, +.ICO_WHITE_PINK {filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(194deg) brightness(106%) contrast(105%);} /* #ffffff */ +.ICO_WHITE_DARK {filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(194deg) brightness(106%) contrast(105%);} /* #ffffff */ + +.ICO_YELLOW_WHITE, +.ICO_YELLOW_GREY, +.ICO_YELLOW_PURPLE, +.ICO_YELLOW_BLUE, +.ICO_YELLOW_YELLOW, +.ICO_YELLOW_PINK {filter: invert(61%) sepia(96%) saturate(366%) hue-rotate(352deg) brightness(103%) contrast(101%);} /* #ffb42e */ +.ICO_YELLOW_DARK {filter: invert(61%) sepia(96%) saturate(366%) hue-rotate(352deg) brightness(103%) contrast(101%);} /* #ffb42e */ + +/********************************** Frame ************************************/ +.FRAME_INLINE + { + display:inline-block; + margin:0 8px; + vertical-align:top; + } +.FRAME_CONT + { + box-sizing:border-box; + width:100%; + text-align:center; + vertical-align:middle; + } + +.FRAME + { + display:inline-block; + box-sizing:border-box; + margin:2px 0; + padding:10px; + /* padding:8px 12px 12px 12px; */ + 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_WHITE, +.FRAME_GREY, +.FRAME_PURPLE, +.FRAME_BLUE, +.FRAME_YELLOW, +.FRAME_PINK {background-color:white;} +.FRAME_DARK {background-color:#383838;} + +.FRAME_SHADOW + { + display:inline-block; + box-sizing:border-box; + margin:5px 0; + padding:8px 12px 20px 12px; + border-width:1px; + border-style:solid; + border-color:#c0c0c0; + border-radius:2px; + box-shadow:2px 5px 15px #888; + text-align:center; + overflow:hidden; + } +.FRAME_SHADOW_WHITE, +.FRAME_SHADOW_GREY, +.FRAME_SHADOW_PURPLE, +.FRAME_SHADOW_BLUE, +.FRAME_SHADOW_YELLOW, +.FRAME_SHADOW_PINK {background-color:#ddecf1; animation:fadetowhite 2s linear forwards;} +.FRAME_SHADOW_DARK {background-color:#707070; animation:fadetodark 2s linear forwards;} +@keyframes fadetowhite {to {background-color:white;}} +@keyframes fadetodark {to {background-color:#383838;}} + +.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:10px; + } +.FRAME_TBL_CENTER + { + margin:0 auto; + } +.FRAME_TBL_CENTER_MARGIN + { + margin:0 auto; + margin-bottom:10px; + } +.FRAME_TITLE + { + display:table; + box-sizing:border-box; + width:100%; + margin:0 auto; + padding:0 12px 12px 12px; + } +.FRAME_TITLE_BIG + { + font-size:20pt; + } +.FRAME_TITLE_SMALL + { + font-size:16pt; + } +.FRAME_TITLE_WHITE, +.FRAME_TITLE_GREY, +.FRAME_TITLE_PURPLE, +.FRAME_TITLE_BLUE, +.FRAME_TITLE_YELLOW, +.FRAME_TITLE_PINK {color:#404040;} +.FRAME_TITLE_DARK {color:#d0d0d0;} + +/* 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 + { + 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, center, 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_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; + } + +/******************* Web of institution, center, 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; + } + +/******************************* User's photo ********************************/ +.PHOTOC12x16 {width: 12px; height: 16px; clip-path: circle(40% at center); vertical-align:middle; margin-top:-2px;} +.PHOTOC15x20 {width: 15px; height: 20px; clip-path: circle(40% at center); vertical-align:middle;} +.PHOTOC15x20B {width: 15px; height: 20px; clip-path: circle(40% at center); vertical-align:middle; display:block; margin:0 auto;} +.PHOTOC18x24 {width: 18px; height: 24px; clip-path: circle(40% at center); vertical-align:middle;} +.PHOTOC21x28 {width: 21px; height: 28px; clip-path: circle(40% at center); vertical-align:middle;} +.PHOTOC30x40 {width: 30px; height: 40px; clip-path: circle(40% at center); vertical-align:middle;} +.PHOTOC45x60 {width: 45px; height: 60px; clip-path: circle(40% at center); vertical-align:middle;} +.PHOTOC60x80 {width: 60px; height: 80px; clip-path: circle(40% at center); vertical-align:middle;} +.PHOTOC186x248 {width:186px; height:248px; clip-path: circle(40% at center); margin-top:-24px;} + +.PHOTOE12x16 {width: 12px; height: 16px; clip-path: ellipse(50% 50% at center); vertical-align:middle; margin-top:-2px;} +.PHOTOE15x20 {width: 15px; height: 20px; clip-path: ellipse(50% 50% at center); vertical-align:middle;} +.PHOTOE15x20B {width: 15px; height: 20px; clip-path: ellipse(50% 50% at center); vertical-align:middle; display:block; margin:0 auto;} +.PHOTOE18x24 {width: 18px; height: 24px; clip-path: ellipse(50% 50% at center); vertical-align:middle;} +.PHOTOE21x28 {width: 21px; height: 28px; clip-path: ellipse(50% 50% at center); vertical-align:middle;} +.PHOTOE30x40 {width: 30px; height: 40px; clip-path: ellipse(50% 50% at center); vertical-align:middle;} +.PHOTOE45x60 {width: 45px; height: 60px; clip-path: ellipse(50% 50% at center); vertical-align:middle;} +.PHOTOE60x80 {width: 60px; height: 80px; clip-path: ellipse(50% 50% at center); vertical-align:middle;} +.PHOTOE186x248 {width:186px; height:248px; clip-path: ellipse(50% 50% at center);} + +.PHOTOO12x16 {width: 12px; height: 16px; border-radius: 6px; vertical-align:middle; margin-top:-2px;} +.PHOTOO15x20 {width: 15px; height: 20px; border-radius: 8px; vertical-align:middle;} +.PHOTOO15x20B {width: 15px; height: 20px; border-radius: 8px; vertical-align:middle; display:block; margin:0 auto;} +.PHOTOO18x24 {width: 18px; height: 24px; border-radius: 9px; vertical-align:middle;} +.PHOTOO21x28 {width: 21px; height: 28px; border-radius:11px; vertical-align:middle;} +.PHOTOO30x40 {width: 30px; height: 40px; border-radius:15px; vertical-align:middle;} +.PHOTOO45x60 {width: 45px; height: 60px; border-radius:23px; vertical-align:middle;} +.PHOTOO60x80 {width: 60px; height: 80px; border-radius:30px; vertical-align:middle;} +.PHOTOO186x248 {width:186px; height:248px; border-radius:92px;} + +.PHOTOR12x16 {width: 12px; height: 16px; border-radius:1px; vertical-align:middle; margin-top:-2px;} +.PHOTOR15x20 {width: 15px; height: 20px; border-radius:1px; vertical-align:middle;} +.PHOTOR15x20B {width: 15px; height: 20px; border-radius:1px; vertical-align:middle; display:block; margin:0 auto;} +.PHOTOR18x24 {width: 18px; height: 24px; border-radius:2px; vertical-align:middle;} +.PHOTOR21x28 {width: 21px; height: 28px; border-radius:2px; vertical-align:middle;} +.PHOTOR30x40 {width: 30px; height: 40px; border-radius:2px; vertical-align:middle;} +.PHOTOR45x60 {width: 45px; height: 60px; border-radius:3px; vertical-align:middle;} +.PHOTOR60x80 {width: 60px; height: 80px; border-radius:3px; vertical-align:middle;} +.PHOTOR186x248 {width:186px; height:248px; border-radius:4px;} + +.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; + border-width:1px; + border-style:solid; + border-radius:4px; + } +.ZOOM_WHITE, +.ZOOM_GREY, +.ZOOM_PURPLE, +.ZOOM_BLUE, +.ZOOM_YELLOW, +.ZOOM_PINK + { + background-color:rgba(255,255,255,0.9); + border-color:#c0c0c0; + box-shadow:2px 5px 15px #888; + } +.ZOOM_DARK + { + background-color:rgba(0,0,0,0.9); + border-color:#c0c0c0; + box-shadow:2px 5px 15px #888; + } + +.ZOOM_TXT + { + box-sizing:border-box; + display:block; + width:186px; + margin:0 auto; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + +.ZOOM_DEG + { + display:inline-block; + margin:0 auto; + /*padding:0 0 0 20px;*/ + width:16px; + background-size:16px 16px; + background-repeat:no-repeat; + background-position:left center; + } +.ZOOM_ICO_WHITE, +.ZOOM_ICO_GREY, +.ZOOM_ICO_PURPLE, +.ZOOM_ICO_BLUE, +.ZOOM_ICO_YELLOW, +.ZOOM_ICO_PINK {} +.ZOOM_ICO_DARK {filter:invert(1);} + +.NO_BR {white-space:nowrap;} + +/************************** Listing of users *********************************/ +.USR_LIST_NUM_WHITE, +.USR_LIST_NUM_GREY, +.USR_LIST_NUM_PURPLE, +.USR_LIST_NUM_BLUE, +.USR_LIST_NUM_YELLOW, +.USR_LIST_NUM_PINK {color:#a0a0a0; font-size:15pt; font-weight:bold;} +.USR_LIST_NUM_DARK {color:#808080; font-size:15pt; font-weight:bold;} + +.USR_LIST_NUM_N_WHITE, +.USR_LIST_NUM_N_GREY, +.USR_LIST_NUM_N_PURPLE, +.USR_LIST_NUM_N_BLUE, +.USR_LIST_NUM_N_YELLOW, +.USR_LIST_NUM_N_PINK {color:#202020; font-size:15pt; font-weight:bold;} +.USR_LIST_NUM_N_DARK {color:#e0e0e0; 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;} +.TITLE_DARK {color:#505050; font-size:18pt;} + +/*********************** Icon and checkbox highlighting **********************/ +.ICO_HIDDEN + { + opacity:0.33; + } +.ICO_HIGHLIGHT, .CHECKBOX_UNCHECKED + { + opacity:0.7; + } + +.ICO_HIGHLIGHT:hover, .CHECKBOX_UNCHECKED:hover, .CHECKBOX_CHECKED + { + opacity:1; + } + +.HLP_HIGHLIGHT + { + opacity:0.33; + } +.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;} +.FORM_IN_DARK {color:#afc4cc; 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;} +.FORM_OUT_DARK {color:#d3e2e8; font-size:13pt;} + +/****************************** Placing of objects ***************************/ +.LT {text-align:left; vertical-align:top; } /* Left Top */ +.LM {text-align:left; vertical-align:middle;} /* Left Middle */ +.LB {text-align:left; vertical-align:bottom;} /* Left Bottom */ +.CT {text-align:center; vertical-align:top; } /* Center Top */ +.CM {text-align:center; vertical-align:middle;} /* Center Middle */ +.CB {text-align:center; vertical-align:bottom;} /* Center Bottom */ +.RT {text-align:right; vertical-align:top; } /* Right Top */ +.RM {text-align:right; vertical-align:middle;} /* Right Middle */ +.RB {text-align:right; vertical-align:bottom;} /* Right Bottom */ + +/***************** Colors used in headers, backgrounds, etc. *****************/ +.COLOR0_WHITE, +.COLOR0_GREY, +.COLOR0_PURPLE, +.COLOR0_BLUE, +.COLOR0_YELLOW, +.COLOR0_PINK {background-color:#f4f2ea;} +.COLOR0_DARK {background-color:#404040;} + +.COLOR1_WHITE, +.COLOR1_GREY, +.COLOR1_PURPLE, +.COLOR1_BLUE, +.COLOR1_YELLOW, +.COLOR1_PINK {background-color:#fbfaf7;} +.COLOR1_DARK {background-color:#484848;} + +.LIGHT_GREEN {background-color:#C0FF40;} + +.BG_HIGHLIGHT {background-color:rgba(166,196,208,0.33);} + +/********************************* Course info *******************************/ +#crs_info + { + margin:0; + padding:0 12px; + } +#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; + } + +.CRS_INFO_WHITE, +.CRS_INFO_GREY, +.CRS_INFO_PURPLE, +.CRS_INFO_BLUE, +.CRS_INFO_YELLOW, +.CRS_INFO_PINK {color:#202020;} +.CRS_INFO_DARK {color:#e0e0e0;} + +/************************ Help for the text editor ***************************/ +.HELP_EDIT + { + margin:10px; + text-align:center; + color:#808080; + font-size:8pt; + } + +/****************************** Date range form ******************************/ +.DATE_RANGE + { + float:left; /* To display something after the table in the same line */ + } + +/*********************************** Lists ***********************************/ +.LIST_LEFT, .LIST_TREE + { + display:inline-block; + list-style-type:none; + padding:0; + margin:12px 0; + text-align:left; + vertical-align:middle; + } +.LIST_TREE li + { + box-sizing:border-box; + max-width:500px; + height:25px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + } + +.LIST_I_MUST_READ + { + display:inline-block; + padding:0; + margin:12px 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_BIG_WHITE, +.FILENAME_BIG_GREY, +.FILENAME_BIG_PURPLE, +.FILENAME_BIG_BLUE, +.FILENAME_BIG_YELLOW, +.FILENAME_BIG_PINK {color:#202020; font-size:18pt; font-weight:bold;} +.FILENAME_BIG_DARK {color:#f0f0f0; 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_WHITE, +.LST_GREY, +.LST_PURPLE, +.LST_BLUE, +.LST_YELLOW, +.LST_PINK {color:#202020; font-size:11pt; white-space:nowrap;} +.LST_DARK {color:#e0e0e0; font-size:11pt; white-space:nowrap;} + +.LST_HID_WHITE, +.LST_HID_GREY, +.LST_HID_PURPLE, +.LST_HID_BLUE, +.LST_HID_YELLOW, +.LST_HID_PINK {color:#a0a0a0; font-size:11pt; white-space:nowrap;} +.LST_HID_DARK {color:#909090; font-size:11pt; white-space:nowrap;} + +.LST_REC_WHITE, +.LST_REC_GREY, +.LST_REC_PURPLE, +.LST_REC_BLUE, +.LST_REC_YELLOW, +.LST_REC_PINK {color:#246600; font-size:11pt; white-space:nowrap;} +.LST_REC_DARK {color:#80c040; font-size:11pt; white-space:nowrap;} + +.LST_REC_HID {color:#92b380; font-size:11pt; white-space:nowrap;} +.LST_REC_HID {color:#92b380; font-size:11pt; white-space:nowrap;} +.LST_REC_HID {color:#92b380; font-size:11pt; white-space:nowrap;} +.LST_REC_HID {color:#92b380; font-size:11pt; white-space:nowrap;} +.LST_REC_HID {color:#92b380; font-size:11pt; white-space:nowrap;} +.LST_REC_HID {color:#92b380; font-size:11pt; white-space:nowrap;} +.LST_REC_HID {color:#406020; font-size:11pt; white-space:nowrap;} + +.LST_EDIT {width:250px; font-weight:bold; font-size:11pt; height:20px; padding:0; margin:-1px; border-width:1px; border-style:solid;} +.LST_EDIT_ROWS {width:30px; font-weight:bold; font-size:11pt; height:20px; padding:0; margin:-1px; border-width:1px; border-style:solid;} + +.LST_EDIT_WHITE, +.LST_EDIT_GREY, +.LST_EDIT_PURPLE, +.LST_EDIT_BLUE, +.LST_EDIT_YELLOW, +.LST_EDIT_PINK {color:#202020; border-color:#ece9d8;} +.LST_EDIT_DARK {color:#e0e0e0; border-color:#404040;} + +.LST_EDIT_HID_WHITE, +.LST_EDIT_HID_GREY, +.LST_EDIT_HID_PURPLE, +.LST_EDIT_HID_BLUE, +.LST_EDIT_HID_YELLOW, +.LST_EDIT_HID_PINK {color:#a0a0a0; border-color:#ece9d8;} +.LST_EDIT_HID_DARK {color:#909090; border-color:#404040;} + +.LST_EDIT_REC_WHITE, +.LST_EDIT_REC_GREY, +.LST_EDIT_REC_PURPLE, +.LST_EDIT_REC_BLUE, +.LST_EDIT_REC_YELLOW, +.LST_EDIT_REC_PINK {color:#008000; border-color:#ece9d8;} +.LST_EDIT_REC_DARK {color:#008000; border-color:#404040;} + +.LST_EDIT_REC_HID_WHITE, +.LST_EDIT_REC_HID_GREY, +.LST_EDIT_REC_HID_PURPLE, +.LST_EDIT_REC_HID_BLUE, +.LST_EDIT_REC_HID_YELLOW, +.LST_EDIT_REC_HID_PINK {color:#89be87; border-color:#ece9d8;} +.LST_EDIT_REC_HID_DARK {color:#89be87; border-color:#404040;} + +.PUBLIC_FILE {max-width:400px;} +.LICENSE {max-width:400px;} + +/************** Paragraph (margin on top and bottom of a div) ****************/ +.PAR + { + margin-top:0.5em; + margin-bottom:0.5em; + } + +/*****************************************************************************/ + +.SYL1_WHITE, +.SYL1_GREY, +.SYL1_PURPLE, +.SYL1_BLUE, +.SYL1_YELLOW, +.SYL1_PINK {color:#202020; font-size:15pt;} +.SYL1_DARK {color:#e0e0e0; font-size:15pt;} + +.SYL2_WHITE, +.SYL2_GREY, +.SYL2_PURPLE, +.SYL2_BLUE, +.SYL2_YELLOW, +.SYL2_PINK {color:#202020; font-size:13pt;} +.SYL2_DARK {color:#e0e0e0; font-size:13pt;} + +.SYL3_WHITE, +.SYL3_GREY, +.SYL3_PURPLE, +.SYL3_BLUE, +.SYL3_YELLOW, +.SYL3_PINK {color:#202020; font-size:12pt;} +.SYL3_DARK {color:#e0e0e0; font-size:12pt;} + +.DAT_WHITE, +.DAT_GREY, +.DAT_PURPLE, +.DAT_BLUE, +.DAT_YELLOW, +.DAT_PINK {color:#404040; font-size:13pt;} +.DAT_DARK {color:#d0d0d0; font-size:13pt;} + +.DAT_STRONG_WHITE, +.DAT_STRONG_GREY, +.DAT_STRONG_PURPLE, +.DAT_STRONG_BLUE, +.DAT_STRONG_YELLOW, +.DAT_STRONG_PINK {color:black; font-size:13pt;} +.DAT_STRONG_DARK {color:white; font-size:13pt;} + +.DAT_LIGHT_WHITE, +.DAT_LIGHT_GREY, +.DAT_LIGHT_PURPLE, +.DAT_LIGHT_BLUE, +.DAT_LIGHT_YELLOW, +.DAT_LIGHT_PINK {color:#a0a0a0; font-size:13pt;} +.DAT_LIGHT_DARK {color:#909090; font-size:13pt;} + +.DAT_SMALL_WHITE, +.DAT_SMALL_GREY, +.DAT_SMALL_PURPLE, +.DAT_SMALL_BLUE, +.DAT_SMALL_YELLOW, +.DAT_SMALL_PINK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#404040; font-size:12pt;} +.DAT_SMALL_DARK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#d0d0d0; font-size:12pt;} + +.DAT_SMALL_STRONG_WHITE, +.DAT_SMALL_STRONG_GREY, +.DAT_SMALL_STRONG_PURPLE, +.DAT_SMALL_STRONG_BLUE, +.DAT_SMALL_STRONG_YELLOW, +.DAT_SMALL_STRONG_PINK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:black; font-size:12pt;} +.DAT_SMALL_STRONG_DARK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:white; font-size:12pt;} + +.DAT_SMALL_NOBR_WHITE, +.DAT_SMALL_NOBR_GREY, +.DAT_SMALL_NOBR_PURPLE, +.DAT_SMALL_NOBR_BLUE, +.DAT_SMALL_NOBR_YELLOW, +.DAT_SMALL_NOBR_PINK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#404040; font-size:12pt; white-space:nowrap;} +.DAT_SMALL_NOBR_DARK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#d0d0d0; font-size:12pt; white-space:nowrap;} + +.DAT_SMALL_NOBR_STRONG_WHITE, +.DAT_SMALL_NOBR_STRONG_GREY, +.DAT_SMALL_NOBR_STRONG_PURPLE, +.DAT_SMALL_NOBR_STRONG_BLUE, +.DAT_SMALL_NOBR_STRONG_YELLOW, +.DAT_SMALL_NOBR_STRONG_PINK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:black; font-size:12pt; white-space:nowrap;} +.DAT_SMALL_NOBR_STRONG_DARK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:white; font-size:12pt; white-space:nowrap;} + +.DAT_GREEN_WHITE, +.DAT_GREEN_GREY, +.DAT_GREEN_PURPLE, +.DAT_GREEN_BLUE, +.DAT_GREEN_YELLOW, +.DAT_GREEN_PINK {color:#246600; font-size:13pt;} +.DAT_GREEN_DARK {color:#80c040; font-size:13pt;} + +.DAT_RED_WHITE, +.DAT_RED_GREY, +.DAT_RED_PURPLE, +.DAT_RED_BLUE, +.DAT_RED_YELLOW, +.DAT_RED_PINK {color:#660000; font-size:13pt;} +.DAT_RED_DARK {color:#ff8080; font-size:13pt;} + +.NOWRAP {white-space:nowrap;} +.BOLD {font-weight:bold;} + +/*********************** Line in top part of a table row *********************/ +.LINE_TOP + { + border-top-style:solid; + border-width:1px; + border-color:#808080; + } +.LINE_BOTTOM + { + border-bottom-style:solid; + border-width:1px; + border-color:#808080; + } +.LINE_LEFT + { + border-left-style:solid; + border-width:1px; + border-color:#808080; + } +.LINE_RIGHT + { + border-right-style:solid; + border-width:1px; + border-color:#808080; + } + +.DAT_SMALL_LIGHT_WHITE, +.DAT_SMALL_LIGHT_GREY, +.DAT_SMALL_LIGHT_PURPLE, +.DAT_SMALL_LIGHT_BLUE, +.DAT_SMALL_LIGHT_YELLOW, +.DAT_SMALL_LIGHT_PINK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#a0a0a0; font-size:12pt;} +.DAT_SMALL_LIGHT_DARK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#a0a0a0; font-size:12pt;} + +.DAT_SMALL_BLUE_WHITE, +.DAT_SMALL_BLUE_GREY, +.DAT_SMALL_BLUE_PURPLE, +.DAT_SMALL_BLUE_BLUE, +.DAT_SMALL_BLUE_YELLOW, +.DAT_SMALL_BLUE_PINK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#0080ff; font-size:12pt;} +.DAT_SMALL_BLUE_DARK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#0080ff; font-size:12pt;} + +.DAT_SMALL_GREEN_WHITE, +.DAT_SMALL_GREEN_GREY, +.DAT_SMALL_GREEN_PURPLE, +.DAT_SMALL_GREEN_BLUE, +.DAT_SMALL_GREEN_YELLOW, +.DAT_SMALL_GREEN_PINK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#246600; font-size:12pt;} +.DAT_SMALL_GREEN_DARK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#80c040; font-size:12pt;} + +.DAT_SMALL_RED_WHITE, +.DAT_SMALL_RED_GREY, +.DAT_SMALL_RED_PURPLE, +.DAT_SMALL_RED_BLUE, +.DAT_SMALL_RED_YELLOW, +.DAT_SMALL_RED_PINK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#660000; font-size:12pt;} +.DAT_SMALL_RED_DARK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#ff8080; font-size:12pt;} + +.DAT_SMALL_YELLOW_WHITE, +.DAT_SMALL_YELLOW_GREY, +.DAT_SMALL_YELLOW_PURPLE, +.DAT_SMALL_YELLOW_BLUE, +.DAT_SMALL_YELLOW_YELLOW, +.DAT_SMALL_YELLOW_PINK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#C0C000; font-size:12pt;} +.DAT_SMALL_YELLOW_DARK {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_WHITE, +.USR_ID_C_GREY, +.USR_ID_C_PURPLE, +.USR_ID_C_BLUE, +.USR_ID_C_YELLOW, +.USR_ID_C_PINK {color:#246600} +.USR_ID_C_DARK {color:#80c040} + +.USR_ID_NC_WHITE, +.USR_ID_NC_GREY, +.USR_ID_NC_PURPLE, +.USR_ID_NC_BLUE, +.USR_ID_NC_YELLOW, +.USR_ID_NC_PINK {color:#660000} +.USR_ID_NC_DARK {color:#f98a8a} + +/******************************* 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_FIELDNAME + { + width:200px; + } + +/******************************** Class photo ********************************/ +.CLASSPHOTO_TITLE + { + font-family:Georgia,"DejaVu LGC Serif","Bitstream Vera Serif",serif; + font-size:13pt; + } +.CLASSPHOTO + { + 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; + } +.CLASSPHOTO_WHITE, +.CLASSPHOTO_GREY, +.CLASSPHOTO_PURPLE, +.CLASSPHOTO_BLUE, +.CLASSPHOTO_YELLOW, +.CLASSPHOTO_PINK {color:#404040;} +.CLASSPHOTO_DARK {color:#d0d0d0;} + +/************************** Left column menu *********************************/ +.INS_LNK_WHITE, .MFU_WHITE, .MONTH_WHITE, +.INS_LNK_GREY, .MFU_GREY, .MONTH_GREY, +.INS_LNK_PURPLE, .MFU_PURPLE, .MONTH_PURPLE, +.INS_LNK_BLUE, .MFU_BLUE, .MONTH_BLUE, +.INS_LNK_YELLOW, .MFU_YELLOW, .MONTH_YELLOW, +.INS_LNK_PINK, .MFU_PINK, .MONTH_PINK {color:#4d88a1;} +.INS_LNK_DARK, .MFU_DARK, .MONTH_DARK {color:#8cbcce;} + +/*****************************************************************************/ +.TIT_TBL_WHITE, +.TIT_TBL_GREY, +.TIT_TBL_PURPLE, +.TIT_TBL_BLUE, +.TIT_TBL_YELLOW, +.TIT_TBL_PINK {color:#4d88a1;} +.TIT_TBL_DARK {color:#afc4cc;} + +.GRP_TITLE {color:#4d88a1; font-size:15pt; font-weight:bold;} + +.ASG_TITLE_WHITE, +.ASG_TITLE_GREY, +.ASG_TITLE_PURPLE, +.ASG_TITLE_BLUE, +.ASG_TITLE_YELLOW, +.ASG_TITLE_PINK {color:#4d88a1; font-size:15pt; font-weight:bold;} +.ASG_TITLE_DARK {color:#afc4cc; font-size:15pt; font-weight:bold;} + +.ASG_TITLE_LIGHT_WHITE, +.ASG_TITLE_LIGHT_GREY, +.ASG_TITLE_LIGHT_PURPLE, +.ASG_TITLE_LIGHT_BLUE, +.ASG_TITLE_LIGHT_YELLOW, +.ASG_TITLE_LIGHT_PINK {color:rgba( 77,136,161,0.3); font-size:15pt; font-weight:bold;} +.ASG_TITLE_LIGHT_DARK {color:rgba(175,196,204,0.3); font-size:15pt; font-weight:bold;} + +.ASG_LABEL_WHITE, +.ASG_LABEL_GREY, +.ASG_LABEL_PURPLE, +.ASG_LABEL_BLUE, +.ASG_LABEL_YELLOW, +.ASG_LABEL_PINK {color:#4d88a1; font-size:13pt;} +.ASG_LABEL_DARK {color:#afc4cc; font-size:13pt;} + +.ASG_LABEL_LIGHT_WHITE, +.ASG_LABEL_LIGHT_GREY, +.ASG_LABEL_LIGHT_PURPLE, +.ASG_LABEL_LIGHT_BLUE, +.ASG_LABEL_LIGHT_YELLOW, +.ASG_LABEL_LIGHT_PINK {color:rgba( 77,136,161,0.3); font-size:13pt;} +.ASG_LABEL_LIGHT_DARK {color:rgba(175,196,204,0.3); font-size:13pt;} + +.ASG_GRP_WHITE, +.ASG_GRP_GREY, +.ASG_GRP_PURPLE, +.ASG_GRP_BLUE, +.ASG_GRP_YELLOW, +.ASG_GRP_PINK {color:#4d88a1; font-size:12pt;} +.ASG_GRP_DARK {color:#afc4cc; font-size:12pt;} + +.ASG_GRP_LIGHT_WHITE, +.ASG_GRP_LIGHT_GREY, +.ASG_GRP_LIGHT_PURPLE, +.ASG_GRP_LIGHT_BLUE, +.ASG_GRP_LIGHT_YELLOW, +.ASG_GRP_LIGHT_PINK {color:rgba( 77,136,161,0.3); font-size:12pt;} +.ASG_GRP_LIGHT_DARK {color:rgba(175,196,204,0.3); font-size:12pt;} + +.DATE_RED_WHITE, +.DATE_RED_GREY, +.DATE_RED_PURPLE, +.DATE_RED_BLUE, +.DATE_RED_YELLOW, +.DATE_RED_PINK {color:#660000; font-size:13pt;} +.DATE_RED_DARK {color:#f98a8a; font-size:13pt;} + +.DATE_RED_LIGHT_WHITE, +.DATE_RED_LIGHT_GREY, +.DATE_RED_LIGHT_PURPLE, +.DATE_RED_LIGHT_BLUE, +.DATE_RED_LIGHT_YELLOW, +.DATE_RED_LIGHT_PINK {color:rgba(102, 0, 0,0.3); font-size:13pt;} +.DATE_RED_LIGHT_DARK {color:rgba(249,138,138,0.3); font-size:13pt;} + +.DATE_GREEN_WHITE, +.DATE_GREEN_GREY, +.DATE_GREEN_PURPLE, +.DATE_GREEN_BLUE, +.DATE_GREEN_YELLOW, +.DATE_GREEN_PINK {color:#246600; font-size:13pt;} +.DATE_GREEN_DARK {color:#80c040; font-size:13pt;} + +.DATE_GREEN_LIGHT_WHITE, +.DATE_GREEN_LIGHT_GREY, +.DATE_GREEN_LIGHT_PURPLE, +.DATE_GREEN_LIGHT_BLUE, +.DATE_GREEN_LIGHT_YELLOW, +.DATE_GREEN_LIGHT_PINK {color:rgba( 36,100, 0,0.3); font-size:13pt;} +.DATE_GREEN_LIGHT_DARK {color:rgba(128,196, 64,0.3); font-size:13pt;} + +.DATE_BLUE_WHITE, +.DATE_BLUE_GREY, +.DATE_BLUE_PURPLE, +.DATE_BLUE_BLUE, +.DATE_BLUE_YELLOW, +.DATE_BLUE_PINK {color:#4d88a1; font-size:13pt;} +.DATE_BLUE_DARK {color:#afc4cc; font-size:13pt;} + +.DATE_BLUE_LIGHT_WHITE, +.DATE_BLUE_LIGHT_GREY, +.DATE_BLUE_LIGHT_PURPLE, +.DATE_BLUE_LIGHT_BLUE, +.DATE_BLUE_LIGHT_YELLOW, +.DATE_BLUE_LIGHT_PINK {color:rgba( 77,136,161,0.3); font-size:13pt;} +.DATE_BLUE_LIGHT_DARK {color:rgba(175,196,204,0.3); font-size:13pt;} + +.ASG_LST_DATE_GREEN_WHITE, +.ASG_LST_DATE_GREEN_GREY, +.ASG_LST_DATE_GREEN_PURPLE, +.ASG_LST_DATE_GREEN_BLUE, +.ASG_LST_DATE_GREEN_YELLOW, +.ASG_LST_DATE_GREEN_PINK {color:#246600; font-size:11pt; white-space:nowrap;} +.ASG_LST_DATE_GREEN_DARK {color:#80c040; font-size:11pt; white-space:nowrap;} + +.ASG_LST_DATE_RED_WHITE, +.ASG_LST_DATE_RED_GREY, +.ASG_LST_DATE_RED_PURPLE, +.ASG_LST_DATE_RED_BLUE, +.ASG_LST_DATE_RED_YELLOW, +.ASG_LST_DATE_RED_PINK {color:#660000; font-size:11pt; white-space:nowrap;} +.ASG_LST_DATE_RED_DARK {color:#ff8080; font-size:11pt; white-space:nowrap;} + +.STATUS_GREEN_WHITE, +.STATUS_GREEN_GREY, +.STATUS_GREEN_PURPLE, +.STATUS_GREEN_BLUE, +.STATUS_GREEN_YELLOW, +.STATUS_GREEN_PINK {color:#246600; font-size:12pt;} +.STATUS_GREEN_DARK {color:#80c040; font-size:12pt;} + +.STATUS_GREEN_LIGHT_WHITE, +.STATUS_GREEN_LIGHT_GREY, +.STATUS_GREEN_LIGHT_PURPLE, +.STATUS_GREEN_LIGHT_BLUE, +.STATUS_GREEN_LIGHT_YELLOW, +.STATUS_GREEN_LIGHT_PINK {color:rgba( 36,102, 0,0.3); font-size:12pt;} +.STATUS_GREEN_LIGHT_DARK {color:rgba(128,192, 64,0.3); font-size:12pt;} + +.STATUS_RED_WHITE, +.STATUS_RED_GREY, +.STATUS_RED_PURPLE, +.STATUS_RED_BLUE, +.STATUS_RED_YELLOW, +.STATUS_RED_PINK {color:#660000; font-size:12pt;} +.STATUS_RED_DARK {color:#ff8080; font-size:12pt;} + +.STATUS_RED_LIGHT_WHITE, +.STATUS_RED_LIGHT_GREY, +.STATUS_RED_LIGHT_PURPLE, +.STATUS_RED_LIGHT_BLUE, +.STATUS_RED_LIGHT_YELLOW, +.STATUS_RED_LIGHT_PINK {color:rgba(102, 0, 0,0.3); font-size:12pt;} +.STATUS_RED_LIGHT_DARK {color:rgba(255,128,128,0.3); font-size:12pt;} + +/********************** Number of question, project, etc. ********************/ +.BIG_INDEX_WHITE, +.BIG_INDEX_GREY, +.BIG_INDEX_PURPLE, +.BIG_INDEX_BLUE, +.BIG_INDEX_YELLOW, +.BIG_INDEX_PINK {color:#808080; font-size:20pt; font-weight:bold;} +.BIG_INDEX_DARK {color:#d0d0d0; font-size:20pt; font-weight:bold;} + +.BIG_INDEX_RED_WHITE, +.BIG_INDEX_RED_GREY, +.BIG_INDEX_RED_PURPLE, +.BIG_INDEX_RED_BLUE, +.BIG_INDEX_RED_YELLOW, +.BIG_INDEX_RED_PINK {color:#660000; font-size:20pt; font-weight:bold;} +.BIG_INDEX_RED_DARK {color:#ff8080; font-size:20pt; font-weight:bold;} + +/******************************** Update links *******************************/ +.UPD + { + padding-top:12px; + text-align:center; + vertical-align:middle; + } + +/******************************** Projects ***********************************/ +.PRJ_LOCK, .PRJ_DATE + { + display:inline-block; + } +.PRJ_LST_USR + { + margin:0; + padding-left:1em; + } +.PRJ_MEMBER_ICO + { + width:30px; + text-align:center; + vertical-align:middle; + } +.PRJ_MEMBER_PHO + { + width:30px; + text-align:center; + vertical-align:middle; + } + +/********************************** Tests ************************************/ +.TAG_SEL {box-sizing:border-box; width:346px;} +.TAG_TXT {box-sizing:border-box; width:346px;} +.STEM + { + box-sizing:border-box; + margin:0 auto; + width:700px; + } +.STEM_TEXTAREA + { + width:696px; + } +.ANSWER + { + box-sizing:border-box; + margin:0 auto; + width:600px; + } +.ANSWER_TEXTAREA + { + width:596px; + } + +.Tst_SUBTITLE + { + margin:10px; + text-align:center; + vertical-align:middle; + } + +.Qst_TXT_WHITE, +.Qst_TXT_GREY, +.Qst_TXT_PURPLE, +.Qst_TXT_BLUE, +.Qst_TXT_YELLOW, +.Qst_TXT_PINK {color:#202020; font-size:12pt;} +.Qst_TXT_DARK {color:#e0e0e0; font-size:12pt;} + +.Qst_TXT_LIGHT_WHITE, +.Qst_TXT_LIGHT_GREY, +.Qst_TXT_LIGHT_PURPLE, +.Qst_TXT_LIGHT_BLUE, +.Qst_TXT_LIGHT_YELLOW, +.Qst_TXT_LIGHT_PINK {color:rgba( 32, 32, 32,0.3); font-size:12pt;} +.Qst_TXT_LIGHT_DARK {color:rgba(224,224,224,0.3); font-size:12pt;} + +.Qst_TXT_RED_WHITE, +.Qst_TXT_RED_GREY, +.Qst_TXT_RED_PURPLE, +.Qst_TXT_RED_BLUE, +.Qst_TXT_RED_YELLOW, +.Qst_TXT_RED_PINK {color:#660000; font-size:12pt;} +.Qst_TXT_RED_DARK {color:#ff8080; font-size:12pt;} + +.Qst_TXT_LIGHT_RED_WHITE, +.Qst_TXT_LIGHT_RED_GREY, +.Qst_TXT_LIGHT_RED_PURPLE, +.Qst_TXT_LIGHT_RED_BLUE, +.Qst_TXT_LIGHT_RED_YELLOW, +.Qst_TXT_LIGHT_RED_PINK {color:rgba(102, 0, 0,0.3); font-size:12pt;} +.Qst_TXT_LIGHT_RED_DARK {color:rgba(255,128,128,0.3); font-size:12pt;} + +.Qst_ANS_0_WHITE, +.Qst_ANS_0_GREY, +.Qst_ANS_0_PURPLE, +.Qst_ANS_0_BLUE, +.Qst_ANS_0_YELLOW, +.Qst_ANS_0_PINK {color:#202020; font-size:12pt; font-weight:bold;} +.Qst_ANS_0_DARK {color:#e0e0e0; font-size:12pt; font-weight:bold;} + +.Qst_ANS_OK_WHITE, +.Qst_ANS_OK_GREY, +.Qst_ANS_OK_PURPLE, +.Qst_ANS_OK_BLUE, +.Qst_ANS_OK_YELLOW, +.Qst_ANS_OK_PINK {color:#246600; font-size:12pt; font-weight:bold;} +.Qst_ANS_OK_DARK {color:#80c040; font-size:12pt; font-weight:bold;} + +.Qst_ANS_BAD_WHITE, +.Qst_ANS_BAD_GREY, +.Qst_ANS_BAD_PURPLE, +.Qst_ANS_BAD_BLUE, +.Qst_ANS_BAD_YELLOW, +.Qst_ANS_BAD_PINK {color:#660000; font-size:12pt; font-weight:bold;} +.Qst_ANS_BAD_DARK {color:#ff8080; font-size:12pt; font-weight:bold;} + +.Tst_TAG_LIST + { + padding:0; + margin:0 0 0 1em; + } + +.Tst_MED_SHOW_CONT + { + box-sizing:border-box; + width:50%; + margin:10px 0; + } +.Tst_MED_SHOW + { + box-sizing:border-box; + width:100%; + border-radius:2px; + } +.Tst_MED_EDIT_LIST_CONT + { + box-sizing:border-box; + width:50%; + margin:5px 0; + } +.Tst_MED_EDIT_LIST + { + box-sizing:border-box; + width:100%; + border-radius:2px; + } + +.Tst_MED_EDIT_FORM + { + box-sizing:border-box; + margin:15px 0; + text-align:left; + vertical-align:top; + } +.Tst_MED_INPUT + { + box-sizing:border-box; + margin:0 auto; + width:400px; + } + +.Tst_MED_EDIT_ONE_CONT + { + box-sizing:border-box; + width:100%; + } +.Tst_MED_EDIT_ONE + { + box-sizing:border-box; + width:100%; + border-radius:2px; + } + +.Tst_EDI_ANS_LEFT_COL + { + box-sizing:border-box; + width:48px; + text-align:left; + vertical-align:top; + } +.Tst_EDI_ANS_CENTER_COL + { + box-sizing:border-box; + width:48px; + text-align:right; + vertical-align:top; + } +.Tst_EDI_ANS_RIGHT_COL + { + box-sizing:border-box; + width:600px; + text-align:left; + vertical-align:top; + } + +.Tst_FILE_CONTENT + { + padding-bottom:20px; + } + +/*********************************** Exams ***********************************/ +.EXA_SET_TITLE + { + text-align:left; + vertical-align:middle; + color:black; + font-size:16pt; + } +.EXA_SET_NUM_QSTS + { + text-align:right; + vertical-align:middle; + color:#404040; + font-size:12pt; + } + +.EXA_PRN_DESC + { + margin:1%; + text-align:left; + vertical-align:top; + } +#examprint + { + margin:1%; + } + +/********************************** Matches **********************************/ +.MCH_BG + { + background-image:url("/swad/icon/bg.jpg"); + background-size:cover; + background-repeat:no-repeat; + height:100%; + background-color:white; + } +.MCH_CONT + { + box-sizing:border-box; + display:table; + margin:2%; + width:96%; + } +.MCH_LEFT_TCH + { + box-sizing:border-box; + float:left; + width:20%; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.MCH_LEFT_STD + { + box-sizing:border-box; + float:left; + width:40%; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.MCH_RIGHT_TCH + { + box-sizing:border-box; + display:table; + float:left; + width:80%; + } +.MCH_RIGHT_STD + { + box-sizing:border-box; + display:table; + float:left; + width:60%; + } +.MCH_TOP + { + box-sizing:border-box; + width:100%; + height:64px; + color:#404040; + font-size:16pt; + font-weight:bold; + text-overflow:ellipsis; + } +.MCH_BOTTOM + { + box-sizing:border-box; + width:100%; + } + +.MCH_REFRESHABLE_TEACHER + { + box-sizing:border-box; + width:100%; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.MCH_NUM_QST + { + color:#404040; + font-size:32pt; + font-weight:bold; + text-align:center; + vertical-align:top; + } +.MCH_TIME_QST + { + color:#404040; + font-size:16pt; + font-weight:bold; + text-align:center; + vertical-align:top; + } +.MCH_SHOW_HOURGLASS, .MCH_SHOW_ANSWERED, .MCH_REM_MY_ANS, .MCH_SHOW_RESULTS + { + text-align:center; + padding:16pt 0; + } +.MCH_NUM_ANSWERERS + { + text-align:center; + padding:8pt 0; + color:#404040; + font-size:16pt; + } + +.MCH_BUTTONS_CONT + { + display:table; + box-sizing:border-box; + width:100%; + padding:20px 0; + } +.MCH_BUTTON_LEFT_CONT + { + display:table; + box-sizing:border-box; + float:left; + width:35%; + text-align:center; + } +.MCH_BUTTON_CENTER_CONT + { + display:table; + box-sizing:border-box; + float:left; + width:30%; + text-align:center; + } +.MCH_BUTTON_RIGHT_CONT + { + display:table; + box-sizing:border-box; + float:left; + width:35%; + text-align:center; + } + +.MCH_BIGBUTTON_CONT + { + box-sizing:border-box; + display:inline-block; + font-size:32pt; + font-weight:bold; + padding:2px; + text-align:center; + vertical-align:middle; + } +.MCH_SMALLBUTTON_CONT + { + box-sizing:border-box; + display:inline-block; + font-size:16pt; + font-weight:bold; + padding:2px; + text-align:center; + vertical-align:middle; + } +.MCH_BUTTON_ON, .MCH_BUTTON_OFF + { + display:table-cell; + width:100%; + text-align:center; + vertical-align:middle; + opacity:0.7; + } +.MCH_BUTTON_ON:hover + { + opacity:1; + } + +.MCH_BUTTON_HIDDEN + { + display:table-cell; + width:100%; + text-align:center; + vertical-align:middle; + opacity:0.1; + } + +.MCH_RED {color:#913b00;} +.MCH_YELLOW {color:#a27600;} +.MCH_LIMEGREEN {color:#636e00;} +.MCH_GREEN {color:#246600;} + +.MCH_TCH_STEM_WHITE, +.MCH_TCH_STEM_GREY, +.MCH_TCH_STEM_PURPLE, +.MCH_TCH_STEM_BLUE, +.MCH_TCH_STEM_YELLOW, +.MCH_TCH_STEM_PINK +.MCH_TCH_STEM_DARK + { + color:#202020; + font-size:24pt; + padding-bottom:24pt; + } +.MCH_TCH_ANS + { + color:#202020; + font-size:24pt; + } + +.MCH_WAIT_CONT + { + box-sizing:border-box; + margin-top:5%; + text-align:center; + } +.MCH_WAIT_IMG + { + box-sizing:border-box; + width:100px; + } + +.MCH_SCO_SCO + { + width:5%; + text-align:right; + vertical-align:middle; + height:10px; + font-size:6pt; + font-weight:bold; + } +.MCH_SCO_NUM + { + width:95%; + text-align:left; + vertical-align:middle; + background:white; + height:10px; + font-size:6pt; + font-weight:bold; + } +.MCH_SCO_BAR + { + display:inline-block; + height:10px; + vertical-align:middle; + } +.MCH_SCO_TOP + { + color:grey; + border-style:solid solid none solid; + border-width:1px; + } +.MCH_SCO_MID + { + color:grey; + border-style:none solid none solid; + border-width:1px; + } +.MCH_SCO_BOT + { + color:grey; + border-style:none solid solid solid; + border-width:1px; + } + +.MCH_TCH_BUTTON_TD + { + box-sizing:border-box; + width:84px; + text-align:center; + vertical-align:top; + } +.MCH_TCH_BUTTON + { + box-sizing:border-box; + width:64px; + margin:0 16px; + padding:8px; + border-radius:2px; + border-width:1px; + border-style:solid; + color:rgba(255,255,255,0.75); + font-size:36pt; + font-weight:bold; + line-height:normal; + white-space:nowrap; + } + +.MCH_NUM_COL_OFF + { + display:table-cell; + box-sizing:border-box; + padding:6px; + text-align:center; + vertical-align:middle; + border:solid 1px; + border-color:transparent; + } +.MCH_NUM_COL_ON + { + display:table-cell; + box-sizing:border-box; + padding:6px; + text-align:center; + vertical-align:middle; + border:solid 1px; + border-color:#404040; + background-color:rgba(0,0,0,0.1); + } + +.MCH_STD_CELL + { + text-align:center; + vertical-align:middle; + } + +.MCH_STD_BUTTON + { + box-sizing:border-box; + width:100%; + margin:10px auto; + padding:20px; + border-radius:2px; + border-width:1px; + border-style:solid; + color:rgba(255,255,255,0.75); + font-size:44pt; + font-weight:bold; + line-height:normal; + white-space:nowrap; + } + +.MCH_STD_ANSWER_SELECTED + { + box-shadow: 0px 0px 18px 12px rgba(0,128,0,1); + animation:fadeinshadow 1s ease forwards; + } +@keyframes fadeinshadow + { + from {box-shadow:0px 0px 18px 12px rgba(0,128,0,1);} + to {box-shadow:none;} + } + +.MCH_RESULT + { + padding:10px 0; + color:#404040; + font-size:16pt; + text-align:left; + vertical-align:top; + } +.MCH_RES_TR + { + height:10px; + } +.MCH_RES_CORRECT + { + width:1%; + background:green; + } +.MCH_RES_WRONG + { + width:1%; + background:red; + } +.MCH_RES_VOID + { + width:1%; + } + +.BT_A {background-color:#e21c3d; border-color:#a9152d;} /* red */ +.BT_B {background-color:#1369ce; border-color:#0e519c;} /* blue */ +.BT_C {background-color:#d89e00; border-color:#a27600;} /* yellow */ +.BT_D {background-color:#2b9010; border-color:#206c0c;} /* green */ +.BT_E {background-color:#e30087; border-color:#aa0064;} /* pink */ +.BT_F {background-color:#00b5e9; border-color:#0089b0;} /* light blue */ +.BT_G {background-color:#f58700; border-color:#b86400;} /* orange */ +.BT_H {background-color:#b3d00a; border-color:#869d07;} /* light green */ +.BT_I {background-color:#642075; border-color:#4b1858;} /* purple */ +.BT_J {background-color:#f5e800; border-color:#b8ad00;} /* light yellow */ + +/********************************* Surveys ***********************************/ +.SVY_OPT + { + width:50px; + } + +/******************************* Time table **********************************/ +.TT + { + width:100%; + margin:0 auto; + } +.Tmt_TXT + { + box-sizing:border-box; + max-width:80px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + margin:0 auto; + font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; + color:#345c6c; + font-size:10pt; + line-height:100%; + letter-spacing:0; + } + +.Tmt_DAY + { + font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; + font-size:10pt; + letter-spacing:0; + text-transform:uppercase; + } + +.Tmt_DAY_WHITE, +.Tmt_DAY_GREY, +.Tmt_DAY_PURPLE, +.Tmt_DAY_BLUE, +.Tmt_DAY_YELLOW, +.Tmt_DAY_PINK {color:#202020;} +.Tmt_DAY_DARK {color:#e0e0e0;} + +.Tmt_SUNDAY_WHITE, +.Tmt_SUNDAY_GREY, +.Tmt_SUNDAY_PURPLE, +.Tmt_SUNDAY_BLUE, +.Tmt_SUNDAY_YELLOW, +.Tmt_SUNDAY_PINK {color:#660000;} +.Tmt_SUNDAY_DARK {color:#ff8080;} + +.Tmt_HOUR + { + box-sizing:border-box; + height:32px; + width:7%; + font-size:10pt; + font-weight:bold; + line-height:100%; + letter-spacing:0; + } + +.Tmt_HOUR00_WHITE, +.Tmt_HOUR00_GREY, +.Tmt_HOUR00_PURPLE, +.Tmt_HOUR00_BLUE, +.Tmt_HOUR00_YELLOW, +.Tmt_HOUR00_PINK {color:#808080;} +.Tmt_HOUR00_DARK {color:#d0d0d0;} + +.Tmt_HOURXX_WHITE, +.Tmt_HOURXX_GREY, +.Tmt_HOURXX_PURPLE, +.Tmt_HOURXX_BLUE, +.Tmt_HOURXX_YELLOW, +.Tmt_HOURXX_PINK {color:#d0d0d0;} +.Tmt_HOURXX_DARK {color:#808080;} + +.Tmt_HOURCOL {box-sizing:border-box; height:16px; width:7%;} +.Tmt_MINICOL {box-sizing:border-box; height:16px; width:2%;} +.Tmt_ALIGN {box-sizing:border-box; height:16px; width:1%;} + +.Tmt_CELL {box-sizing:border-box; height:16px; border:solid 1px;} + +.Tmt_FREE0_WHITE, +.Tmt_FREE0_GREY, +.Tmt_FREE0_PURPLE, +.Tmt_FREE0_BLUE, +.Tmt_FREE0_YELLOW, +.Tmt_FREE0_PINK {background-color:#f4f2ea; border-color:#f4f2ea #e0d9c2 #eeeadc #f4f2ea;} +.Tmt_FREE0_DARK {background-color:#404040; border-color:#404040 #686868 #505050 #404040;} + +.Tmt_FREE1_WHITE, +.Tmt_FREE1_GREY, +.Tmt_FREE1_PURPLE, +.Tmt_FREE1_BLUE, +.Tmt_FREE1_YELLOW, +.Tmt_FREE1_PINK {background-color:#f4f2ea; border-color:#f4f2ea #e0d9c2 #e0d9c2 #f4f2ea;} +.Tmt_FREE1_DARK {background-color:#404040; border-color:#404040 #686868 #686868 #404040;} + +.Tmt_FREE2_WHITE, +.Tmt_FREE2_GREY, +.Tmt_FREE2_PURPLE, +.Tmt_FREE2_BLUE, +.Tmt_FREE2_YELLOW, +.Tmt_FREE2_PINK {background-color:#fbfaf7; border-color:#fbfaf7 #e0d9c2 #f5f2e9 #fbfaf7;} +.Tmt_FREE2_DARK {background-color:#484848; border-color:#484848 #686868 #585858 #484848;} + +.Tmt_FREE3_WHITE, +.Tmt_FREE3_GREY, +.Tmt_FREE3_PURPLE, +.Tmt_FREE3_BLUE, +.Tmt_FREE3_YELLOW, +.Tmt_FREE3_PINK {background-color:#fbfaf7; border-color:#fbfaf7 #e0d9c2 #e0d9c2 #fbfaf7;} +.Tmt_FREE3_DARK {background-color:#484848; border-color:#484848 #686868 #686868 #484848;} + +.Tmt_LECT {background-color:#c0dae4; border-color:#d5f1fc #aac1c9 #aac1c9 #d5f1fc;} +.Tmt_PRAC {background-color:#dbe5e9; border-color:#edf8fc #c7d0d4 #c7d0d4 #edf8fc;} +.Tmt_TUTO {background-color:#d6e9c3; border-color:#e8fcd3 #c2d4b1 #c2d4b1 #e8fcd3;} + +.Tmt_TYP, .Tmt_DUR, .Tmt_GRP, .Tmt_INF + { + width:80px; + font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; + font-size:10pt; + border:0; + } + +/********************************* Preference ********************************/ +.PREF_CONTS + { + margin:0 auto; + text-align:center; + } +.PREF_CONT + { + 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:rgba(77,136,161,0.5); /* #4d88a1 */ + background-color:rgba(192,218,228,0.5); /* #c0dae4 */ + } + +/************************************* Log ***********************************/ +.LOG_WHITE, +.LOG_GREY, +.LOG_PURPLE, +.LOG_BLUE, +.LOG_YELLOW, +.LOG_PINK {color:#404040; font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; font-size:11pt;} +.LOG_DARK {color:#d0d0d0; font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; font-size:11pt;} + +.LOG_R_WHITE, +.LOG_R_GREY, +.LOG_R_PURPLE, +.LOG_R_BLUE, +.LOG_R_YELLOW, +.LOG_R_PINK {color:#660000; font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; font-size:11pt;} +.LOG_R_DARK {color:#ff8080; font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; font-size:11pt;} + +/****************************** Calls for exams ******************************/ +/* Bottom space is used for signatures */ +.CALL_FOR_EXAM_VISIBLE + { + box-sizing:border-box; + width:100%; + padding:25px 25px 125px 25px; + } +.CALL_FOR_EXAM_HIDDEN + { + box-sizing:border-box; + width:100%; + padding:25px 25px 125px 25px; + opacity:0.3; + } +.CALL_FOR_EXAM_TIT + { + font-weight:bold; + text-transform:uppercase; + } + +/*********************** Media (image/video) uploading ***********************/ +.MED_UPLOADER + { + text-align:center; + margin-bottom:10px; + } +.MED_PLAY + { + position:relative; + } +/* The icon inside the overlay is positioned in the middle vertically and horizontally */ +.MED_PLAY_ICO + { + position:absolute; + left:50%; + top:50%; + transform:translate(-50%,-50%); + font-size:20pt; + font-weight:bold; + color:white; + text-shadow: 0 0 8px black; + } + +/* For YouTube embedded videos. See https://avexdesigns.com/responsive-youtube-embed/ */ +.MED_VIDEO_CONT /* Adjust container height to get a 16:9 aspect ratio */ + { + position:relative; + box-sizing:border-box; + margin:10px 0; + padding-bottom:56.25%; /* percentage relative to width */ + } +.MED_VIDEO_CONT iframe, +.MED_VIDEO_CONT object, +.MED_VIDEO_CONT embed + { + position:absolute; + top:0; + left:0; + width:100%; + height:100%; + } + + /* Slideshare: + 487 / 599 = 0,813021703 + 422 / 514 = 0,821011673 + 357 / 429 = 0,832167832 + 292 / 344 = 0,848837209 */ +.MED_EMBED_CONT /* Adjust container height to get a 16:9 aspect ratio */ + { + position:relative; + box-sizing:border-box; + margin:10px 0; + padding-bottom:56.25%; /* percentage relative to width */ + } +.MED_EMBED_CONT iframe, +.MED_EMBED_CONT object, +.MED_EMBED_CONT embed + { + position:absolute; + top:0; + left:0; + width:100%; + height:100%; + } + +/********** 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; + } + +/************************** 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; + } +.ATT_CHECK_WHITE, +.ATT_CHECK_GREY, +.ATT_CHECK_PURPLE, +.ATT_CHECK_BLUE, +.ATT_CHECK_YELLOW, +.ATT_CHECK_PINK {color:#246600;} +.ATT_CHECK_DARK {color:#80c040;} + +.ATT_CROSS + { + display:inline-block; + font-size:13pt; + font-weight:bold; + opacity:0.2; + } +.ATT_CROSS_WHITE, +.ATT_CROSS_GREY, +.ATT_CROSS_PURPLE, +.ATT_CROSS_BLUE, +.ATT_CROSS_YELLOW, +.ATT_CROSS_PINK {color:#660000;} +.ATT_CROSS_DARK {color:#ff8080;} + +/********************* Edition of attendance events, games *******************/ +.TITLE_DESCRIPTION_WIDTH + { + box-sizing:border-box; + width:500px; + } + +/**************************** Enrolment requests *****************************/ +.REQUESTER_NAME + { + box-sizing:border-box; + max-width:100px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + +/********************************* Timeline **********************************/ +#view_new_container,#view_old_pubs_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; + } +.Tml_LIST + { + list-style-type:none; + padding:0; + margin:0; + text-align:left; + vertical-align:middle; + } + +@media only screen and (max-width: 590px) + { /* For mobile-phones (maximum width visible on Moto G4 vertical) */ + .Tml_WIDTH {width:316px;} /* 556-240 */ + .Tml_RIGHT_WIDTH {width:260px;} /* 500-240 */ + .Tml_RIGHT_AUTHOR_WIDTH {width:100px;} /* 340-240 */ + .Tml_COM_WIDTH {width:220px;} /* 460-240 */ + .Tml_COM_AUTHOR_WIDTH {width: 60px;} /* 300-240 */ + .Tml_MED_INPUT_WIDTH {width:160px;} /* 400-240 */ + .TmlNot_FOOT_WIDTH {width:260px;} /* 500-240 */ + .Tml_COMM_FOOT_WIDTH {width:220px;} /* 460-240 */ + .Tml_FAV_NOT_WIDTH {width:120px;} /* (480-240)/2 */ + .Tml_SHA_NOT_WIDTH {width:120px;} /* (480-240)/2 */ + .Tml_FAV_COM_WIDTH {width:200px;} /* 440-240 */ + } +@media only screen and (min-width: 590px) + { /* For tablets and desktop (maximum width visible on Moto G4 horizontal) */ + .Tml_WIDTH {width:556px;} + .Tml_RIGHT_WIDTH {width:500px;} + .Tml_RIGHT_AUTHOR_WIDTH {width:340px;} + .Tml_COM_WIDTH {width:460px;} + .Tml_COM_AUTHOR_WIDTH {width:300px;} + .Tml_MED_INPUT_WIDTH {width:400px;} + .Tml_FAV_NOT_WIDTH {width:240px;} + .Tml_SHA_NOT_WIDTH {width:240px;} + .Tml_FAV_COM_WIDTH {width:440px;} + } + +.Tml_NEW_PUB_WHITE, +.Tml_NEW_PUB_GREY, +.Tml_NEW_PUB_PURPLE, +.Tml_NEW_PUB_BLUE, +.Tml_NEW_PUB_YELLOW, +.Tml_NEW_PUB_PINK {background-color:#ddecf1; animation:fadetowhite 2s linear forwards;} +.Tml_NEW_PUB_DARK {background-color:#707070; animation:fadetodark 2s linear forwards;} + +@keyframes fadein + { + to {background-color:white;} + } +.Tml_FORM_NEW_PST + { + padding:10px 0; + text-align:center; + } +.Tml_SEP /* Separator (upper line between publications) */ + { + border-top:1px solid silver; + } +.Tml_TOP_CONT + { + box-sizing:border-box; + padding-top:10px; + text-align:left; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.Tml_TOP_PUBLISHER + { + color:#808080; + font-size:13pt; + } +.Tml_LEFT_PHOTO + { + display:inline-block; + box-sizing:border-box; + width:56px; + height:76px; + padding:10px 0; + text-align:left; + vertical-align:top; + } +.Tml_RIGHT_CONT + { + display:inline-block; + box-sizing:border-box; + padding-top:10px; + } +.Tml_RIGHT_AUTHOR + { + display:inline-block; + box-sizing:border-box; + text-align:left; + vertical-align:top; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.Tml_RIGHT_TIME + { + display:inline-block; + box-sizing:border-box; + width:160px; + text-align:right; + vertical-align:top; + } +.Tml_PST_MED_CONT + { + box-sizing:border-box; + margin-top:10px; + } +.Tml_PST_MED + { + box-sizing:border-box; + border-radius:2px; + } +.Tml_COM_CONT + { + display:inline-block; + box-sizing:border-box; + padding-top:10px; + } +.Tml_COM_AUTHOR + { + display:inline-block; + box-sizing:border-box; + text-align:left; + vertical-align:top; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.Tml_COM_MED_CONT + { + box-sizing:border-box; + margin-top:10px; + } +.Tml_COM_MED + { + box-sizing:border-box; + border-radius:2px; + } +.Tml_FORM_NEW_COM + { + display:inline-block; + margin-left:56px; + border-top:1px solid silver; + padding-bottom:10px; + text-align:center; + } +.Tml_COM_TEXTAREA + { + box-sizing:border-box; + margin:0; + resize:none; + } +.Tml_BOTTOM_LEFT /* Container for button used to toggle new comment form */ + { + display:inline-block; + box-sizing:border-box; + width:56px; + padding-right:11px; + text-align:center; + vertical-align:bottom; + } +.Tml_BOTTOM_RIGHT /* Container for fav, share, remove and comments */ + { + display:inline-block; + box-sizing:border-box; + vertical-align:top; + } +.Tml_FORM + { + padding-top:8px; + overflow:hidden; + text-overflow:ellipsis; + } +.Tml_FORM_OFF, +.Tml_LOC + { + padding-top:8px; + color:#808080; + font-size:13pt; + overflow:hidden; + text-overflow:ellipsis; + } +.Tml_TXT + { + text-align:left; + padding-top:5px; + font-size:13pt; + line-height:1.4; + overflow:hidden; + text-overflow:ellipsis; + } +.Tml_TXT_WHITE, +.Tml_TXT_GREY, +.Tml_TXT_PURPLE, +.Tml_TXT_BLUE, +.Tml_TXT_YELLOW, +.Tml_TXT_PINK {color:#202020;} +.Tml_TXT_DARK {color:#e0e0e0;} + +.Tml_EXPAND_COM + { + text-align:center; + padding:10px 0; + } +.Tml_ICO_COM_OFF + { + display:inline-block; + box-sizing:border-box; + padding:6px; + text-align:center; + vertical-align:middle; + border:solid 1px; + border-color:transparent; + } +.Tml_ICO_COM_ON + { + display:inline-block; + box-sizing:border-box; + padding:6px; + text-align:center; + vertical-align:middle; + border:solid 1px; + border-color:rgba(77,136,161,0.5); /* #4d88a1 */ + background-color:rgba(192,218,228,0.5); /* #c0dae4 */ + } +.Tml_FOOT /* Container for favs, shares and remove */ + { + display:table; + vertical-align:top; + padding:7px 0; + } +.Tml_FAV_NOT, .Tml_SHA_NOT + { + display:table-cell; + text-align:left; + vertical-align:top; + } +.Tml_FAV_COM + { + display:table-cell; + text-align:left; + vertical-align:top; + } +.Tml_REM + { + display:table-cell; + width:20px; + text-align:right; + vertical-align:bottom; + } +.Tml_ICO + { + display:table-cell; + } +.Tml_NUM_USRS + { + display:table-cell; + color:#A0A0A0; + font-size:12pt; + font-weight:bold; + } +.Tml_USRS + { + display:table-cell; + } +.Tml_ICO_DISABLED + { + opacity:0.2; + } +.Tml_SHARER + { + display:inline-block; + padding-left:4px; + vertical-align:bottom; + } +.Tml_COM + { + border-top:1px solid silver; + } +.Tml_COM_PHOTO + { + display:inline-block; + box-sizing:border-box; + width:40px; + height:54px; + padding:10px 0; + text-align:left; + vertical-align:top; + } + +/************************************ Forum **********************************/ +.FOR_IMG_CONT + { + box-sizing:border-box; + width:100%; + margin:10px 0; + } +.FOR_IMG + { + box-sizing:border-box; + width:100%; + border-radius:2px; + } +.FOR_MED_INPUT + { + box-sizing:border-box; + margin:0 auto; + width:400px; + } + +/*********************************** Messages ********************************/ +.MSG_RECIPIENTS, .MSG_SUBJECT, .MSG_CONTENT + { + box-sizing:border-box; + width:640px; + } + +.MSG_TO_ONE_RCP + { + display:inline-block; + padding-left:4px; + text-align:left; + vertical-align:middle; + } +.MSG_IMG_CONT + { + box-sizing:border-box; + width:100%; + margin:10px 0; + } +.MSG_IMG + { + box-sizing:border-box; + width:100%; + border-radius:2px; + } +.MSG_MED_INPUT + { + box-sizing:border-box; + margin:0 auto; + width:400px; + } + +.MSG_TXT_WHITE, +.MSG_TXT_GREY, +.MSG_TXT_PURPLE, +.MSG_TXT_BLUE, +.MSG_TXT_YELLOW, +.MSG_TXT_PINK {color:#202020; font-size:13pt; line-height:1.4;} +.MSG_TXT_DARK {color:#f0f0f0; font-size:13pt; line-height:1.4;} + +.MSG_TIT_WHITE, +.MSG_TIT_GREY, +.MSG_TIT_PURPLE, +.MSG_TIT_BLUE, +.MSG_TIT_YELLOW, +.MSG_TIT_PINK {font-size:13pt; color:#4d88a1;} +.MSG_TIT_DARK {font-size:13pt; color:#afc4cc;} + +.MSG_TIT_NEW_WHITE, +.MSG_TIT_NEW_GREY, +.MSG_TIT_NEW_PURPLE, +.MSG_TIT_NEW_BLUE, +.MSG_TIT_NEW_YELLOW, +.MSG_TIT_NEW_PINK {font-size:13pt; font-weight:bold; color:#4d88a1;} +.MSG_TIT_NEW_DARK {font-size:13pt; font-weight:bold; color:#afc4cc;} + +.MSG_TIT_REM_WHITE, +.MSG_TIT_REM_GREY, +.MSG_TIT_REM_PURPLE, +.MSG_TIT_REM_BLUE, +.MSG_TIT_REM_YELLOW, +.MSG_TIT_REM_PINK {font-size:13pt; color:#afc4cc;} +.MSG_TIT_REM_DARK {font-size:13pt; color:#4d88a1;} + +.MSG_BG_WHITE, +.MSG_BG_GREY, +.MSG_BG_PURPLE, +.MSG_BG_BLUE, +.MSG_BG_YELLOW, +.MSG_BG_PINK + { + 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; + } +.MSG_BG_DARK + { + background-image:-webkit-linear-gradient(#414e52 0,#414e52 80%,#444444 100%); /* Safari */ + background-image:linear-gradient(#414e52 0,#414e52 80%,#444444 100%); + background-repeat:no-repeat; + } + +.MSG_BG_NEW_WHITE, +.MSG_BG_NEW_GREY, +.MSG_BG_NEW_PURPLE, +.MSG_BG_NEW_BLUE, +.MSG_BG_NEW_YELLOW, +.MSG_BG_NEW_PINK + { + 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; + } +.MSG_BG_NEW_DARK + { + background-image:-webkit-linear-gradient(#5f6b3a 0,#5f6b3a 80%,#444444 100%); /* Safari */ + background-image:linear-gradient(#5f6b3a 0,#5f6b3a 80%,#444444 100%); + background-repeat:no-repeat; + } + +.MSG_BG_REM_WHITE, +.MSG_BG_REM_GREY, +.MSG_BG_REM_PURPLE, +.MSG_BG_REM_BLUE, +.MSG_BG_REM_YELLOW, +.MSG_BG_REM_PINK + { + 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; + } +.MSG_BG_REM_DARK + { + 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; + } + +.MSG_AUT_WHITE, +.MSG_AUT_GREY, +.MSG_AUT_PURPLE, +.MSG_AUT_BLUE, +.MSG_AUT_YELLOW, +.MSG_AUT_PINK {color:#4d88a1; font-size:11pt;} +.MSG_AUT_DARK {color:#afc4cc; font-size:11pt;} + +.MSG_AUT_NEW_WHITE, +.MSG_AUT_NEW_GREY, +.MSG_AUT_NEW_PURPLE, +.MSG_AUT_NEW_BLUE, +.MSG_AUT_NEW_YELLOW, +.MSG_AUT_NEW_PINK {color:#4d88a1; font-size:11pt; font-weight:bold;} +.MSG_AUT_NEW_DARK {color:#afc4cc; font-size:11pt; font-weight:bold;} + +.MSG_AUT_LIGHT_WHITE, +.MSG_AUT_LIGHT_GREY, +.MSG_AUT_LIGHT_PURPLE, +.MSG_AUT_LIGHT_BLUE, +.MSG_AUT_LIGHT_YELLOW, +.MSG_AUT_LIGHT_PINK {color:rgba( 77,136,161,0.3); font-size:11pt;} +.MSG_AUT_LIGHT_DARK {color:rgba(175,196,204,0.3); 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;} +.BM {width:20px; text-align:center; vertical-align:middle;} +.BM_SEL {width:20px; text-align:center; vertical-align:middle; background-color:#c0ff40;} + +/******************************** Pagination *********************************/ +.PAG + { + display:inline-block; + box-sizing:border-box; + margin:4px 2px; + padding:2px 8px; + border-style:solid; + border-width:1px; + border-radius:2px; + } + +.PAG_WHITE, +.PAG_GREY, +.PAG_PURPLE, +.PAG_BLUE, +.PAG_YELLOW, +.PAG_PINK {border-color:#c0dae4;} +.PAG_DARK {border-color:#808080;} + +.PAG_CUR + { + display:inline-block; + box-sizing:border-box; + margin:4px 2px; + padding:2px 8px; + border-style:solid; + border-width:1px; + border-radius:2px; + text-decoration:none; + } + +button.PAG_WHITE:hover, .PAG_CUR_WHITE, +button.PAG_GREY:hover, .PAG_CUR_GREY, +button.PAG_PURPLE:hover, .PAG_CUR_PURPLE, +button.PAG_BLUE:hover, .PAG_CUR_BLUE, +button.PAG_YELLOW:hover, .PAG_CUR_YELLOW, +button.PAG_PINK:hover, .PAG_CUR_PINK {background-color:#ddecf1;} +button.PAG_DARK:hover, .PAG_CUR_DARK {background-color:#707070;} + +.PAG_TXT_WHITE, +.PAG_TXT_GREY, +.PAG_TXT_PURPLE, +.PAG_TXT_BLUE, +.PAG_TXT_YELLOW, +.PAG_TXT_PINK {color:#4d88a1; font-size:13pt;} +.PAG_TXT_DARK {color:#afc4cc; font-size:13pt;} + +/***************************** Calls for exams *******************************/ +.EXAM_TIT_WHITE, +.EXAM_TIT_GREY, +.EXAM_TIT_PURPLE, +.EXAM_TIT_BLUE, +.EXAM_TIT_YELLOW, +.EXAM_TIT_PINK {color:#202020; font-size:18pt; font-weight:bold;} +.EXAM_TIT_DARK {color:#f0f0f0; font-size:18pt; font-weight:bold;} + +/******************************** Separation row *****************************/ +.SEPAR_ROW + { + height:10px; + } + +/********************************** Statistics *******************************/ +.STAT_SEL + { + width:300px; + } + +/******************************** User's report ******************************/ +.TITLE_REPORT + { + margin-bottom:10px; + } + +/***************************** Public user's profile *************************/ +.PRF_FIG_LEFT_CONT + { + display:inline-block; + box-sizing:border-box; + width:50%; + padding-right:10px; + text-align:right; + vertical-align:top; + } +.PRF_FIG_RIGHT_CONT + { + 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 + { + opacity:0.7; + } +.PRF_FIG_ICO + { + display:inline-block; + width:30px; + text-align:center; + vertical-align:middle; + } + +#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:#202020; + font-size:30pt; + font-weight:bold; + opacity:0.5; + } +.FOLLOW_NUM_B + { + color:#202020; + 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; + text-align:left; + } +.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 + { + text-align:left; + padding:4px; + } + +/****************************** Users ranking ********************************/ +.RANK_USR + { + box-sizing:border-box; + max-width:48px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + +.RANK_PHOTO + { + width:34px; + height:48px; + } + +/************************* Indicators about courses **************************/ +.INDICATORS td,.INDICATORS th + { + border:1px solid silver; + border-collapse:collapse; + padding:1px; + } +.INDICATORS_INPUT + { + max-width:500px; + } + +/************* Forms to edit institution, center, degree, course *************/ +.CODE + { + box-sizing:border-box; + min-width:60px; + text-align:right; + vertical-align:middle; + } +.INPUT_INS_CODE + { + box-sizing:border-box; + width:180px; + } +.INPUT_SHORT_NAME + { + box-sizing:border-box; + width:180px; + } +.INPUT_FULL_NAME + { + box-sizing:border-box; + width:180px; + } +.INPUT_LONG + { + box-sizing:border-box; + width:60px; + } +.INPUT_WWW_NARROW + { + box-sizing:border-box; + width:90px; + } +.INPUT_WWW_WIDE + { + box-sizing:border-box; + width:180px; + } +.INPUT_COORD + { + box-sizing:border-box; + width:180px; + } +.INPUT_STATUS + { + box-sizing:border-box; + width:80px; + } +.INPUT_REQUESTER + { + box-sizing:border-box; + width:90px; + } + +/******************************** Last clicks ********************************/ +.LC_CLK {text-align:right; vertical-align:top; min-width:60px;} +.LC_TIM {text-align:right; vertical-align:top; min-width:60px; max-width:60px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} +.LC_ROL {text-align:left; vertical-align:top; min-width:100px; max-width:100px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} +.LC_CTY {text-align:left; vertical-align:top; min-width:100px; max-width:100px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} +.LC_INS {text-align:left; vertical-align:top; min-width:100px; max-width:100px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} +.LC_CTR {text-align:left; vertical-align:top; min-width:100px; max-width:100px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} +.LC_DEG {text-align:left; vertical-align:top; min-width:150px; max-width:150px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} +.LC_ACT {text-align:left; vertical-align:top; min-width:200px; max-width:200px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} + +/********************************** Privacy **********************************/ +.PRI_LIST + { + width:100%; + } + +/****************************** SWADroid banner ******************************/ +.SWADROID {width:150px; height:325px; opacity:0.6;} +.SWADROID:hover {opacity:1;} + +/********************************* 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_zone div + { + position:relative; + float:left; + text-align:left; + padding-bottom:20px; + } +#foot_zone h2 + { + color:#606060; + font-size:14pt; + font-weight:bold; + white-space:nowrap; + } +#foot_zone ul + { + 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_zone a + { + color:#4d88a1; + } + +.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 ***********/ +.LIGHT + { + opacity:0.5; + } +.VERY_LIGHT + { + opacity:0.2; + } diff --git a/js/swad22.49.js b/js/swad22.49.js new file mode 100644 index 000000000..db0fe9944 --- /dev/null +++ b/js/swad22.49.js @@ -0,0 +1,2173 @@ +// swad.js: javascript functions + +/* + SWAD (Shared Workspace At a Distance), + is a web platform developed at the University of Granada (Spain), + and used to support university teaching. + Copyright (C) 1999-2022 Antonio Cañas-Vargas + University of Granada (SPAIN) (acanas@ugr.es) + + This program is free software: you can redistribute it and/or modify + it under the terms of the GNU Affero General Public 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 . +*/ +"use strict"; + +// Global variable (string) used to write HTML +var Gbl_HTMLContent; + +// Global variable used to call SWAD via AJAX +var actionAJAX; + +/*****************************************************************************/ +/************************** Handle match keystrokes **************************/ +/*****************************************************************************/ + +function handleMatchKeys(event) { + switch (event.key) { + case 'PageUp': + case 'ArrowLeft': + case 'ArrowUp': + submitForm('backward'); + break; + case ' ': // Space + submitForm('play_pause'); + break; + case 'PageDown': + case 'ArrowRight': + case 'ArrowDown': + submitForm('forward'); + break; + } +} + +/*****************************************************************************/ +/************************ Submit a form given its id *************************/ +/*****************************************************************************/ + +function submitForm(FormId) { + var Form = document.getElementById(FormId); + + if (Form) + Form.submit(); + + return false; +} + +/*****************************************************************************/ +/*************** Write a date-time in client local time **********************/ +/*****************************************************************************/ +// id is the id of the HTML element in which date-time will be written +// TimeUTC is the date-time to write in UTC UNIX time format +// DateFormat: +// Dat_FORMAT_YYYY_MM_DD = 0 +// Dat_FORMAT_DD_MONTH_YYYY = 1 +// Dat_FORMAT_MONTH_DD_YYYY = 2 +// separator is HTML code to write between date and time +// StrToday is a string in current language ('today', 'hoy'...) +// WriteDateOnSameDay = false ==> don't write date if it's the same day than the last call +// WriteWeekDay = true ==> write day of the week ('monday', 'tuesday'...) +// WriteHMS = 3 least significant bits for hour, minute and second +var txtToday = [ + "", // Unknown + "Avui", // CA + "Heute", // DE + "Today", // EN + "Hoy", // ES + "Aujourd'hui", // FR + "Ko ára", // GN + "Oggi", // IT + "Dzisiaj", // PL + "Hoje", // PT +]; + +function writeLocalDateHMSFromUTC (id,TimeUTC,DateFormat,Separator,Language, + WriteToday,WriteDateOnSameDay,WriteWeekDay,WriteHMS) { + // HMS: Hour, Minutes, Seconds + var today = new Date(); + var todayYea = today.getFullYear (); + var todayMon = today.getMonth () + 1; + var todayDay = today.getDate (); + var d = new Date(); + var WriteDate; + var Yea,Mon,Day; + var DayOfWeek; + var Hou,Min,Sec; + var StrDat; + var StrMon; + var StrDay; + var StrHou; + var StrMin; + var StrSec; + + d.setTime (TimeUTC * 1000); + Yea = d.getFullYear (); + Mon = d.getMonth () + 1; + Day = d.getDate (); + + if (WriteDateOnSameDay) + WriteDate = true; + // Check to see if the last date has been initialized + else if (typeof writeLocalDateHMSFromUTC.lastd == 'undefined') + // lastd: static variable to remember current date for the next call + // Not initialized + WriteDate = true; + else + WriteDate = (Yea != writeLocalDateHMSFromUTC.lastd.getFullYear () || + Mon != writeLocalDateHMSFromUTC.lastd.getMonth () + 1 || + Day != writeLocalDateHMSFromUTC.lastd.getDate ()); + + writeLocalDateHMSFromUTC.lastd = d; // Update last date for the next call + + /* Set date */ + StrDat = ''; + if (WriteDate) { + WriteToday = WriteToday && (Yea == todayYea && + Mon == todayMon && + Day == todayDay); // Date is today + if (WriteToday) + StrDat = txtToday[Language]; + else + switch (DateFormat) { + case 0: // Dat_FORMAT_YYYY_MM_DD + StrMon = ((Mon < 10) ? '0' : '') + Mon; + StrDay = ((Day < 10) ? '0' : '') + Day; + StrDat = Yea.toString () + '-' + StrMon + '-' + StrDay; + break; + case 1: // Dat_FORMAT_DD_MONTH_YYYY + StrDat = Day.toString () + ' ' + + MonthsShort[Mon - 1] + ' ' + + Yea.toString (); + break; + case 2: // Dat_FORMAT_MONTH_DD_YYYY + StrDat = MonthsShort[Mon - 1] + ' ' + + Day.toString() + ', ' + + Yea.toString (); + break; + default: + break; + } + + if (WriteWeekDay) { + DayOfWeek = d.getDay(); + DayOfWeek = (DayOfWeek == 0) ? 6 : DayOfWeek - 1; + StrDat += Separator + DAYS[DayOfWeek]; + } + StrDat += Separator; + } + + /* Set HH:MM:SS */ + StrHou = ''; + StrMin = ''; + StrSec = ''; + if (WriteHMS & (1<<2)) { + // Bit 2 on => Write hour + Hou = d.getHours(); + StrHou = ((Hou < 10) ? '0' : '') + Hou; + if (WriteHMS & (1<<1)) { + // Bits 2,1 on => Write minutes + Min = d.getMinutes (); + StrMin = ((Min < 10) ? ':0' : ':') + Min; + if (WriteHMS & 1) { + // Bits 2,1,0 on => Write seconds + Sec = d.getSeconds (); + StrSec = ((Sec < 10) ? ':0' : ':') + Sec; + } + } + } + + /* Write date and time */ + document.getElementById (id).innerHTML = StrDat + StrHou + StrMin + StrSec; +} + +/*****************************************************************************/ +/************** Set local date-time form fields from UTC time ****************/ +/*****************************************************************************/ + +function setLocalDateTimeFormFromUTC (id,TimeUTC) { + var FormYea = document.getElementById(id+'Year' ); + var FormMon = document.getElementById(id+'Month' ); + var FormDay = document.getElementById(id+'Day' ); + var FormHou = document.getElementById(id+'Hour' ); + var FormMin = document.getElementById(id+'Minute'); + var FormSec = document.getElementById(id+'Second'); + var d; + var Year; + var YearIsValid = false; + var Hou; + var Min; + var Sec; + + if (TimeUTC) { + d = new Date(); + d.setTime(TimeUTC * 1000); + + Year = d.getFullYear(); + for (var i=0; i=0; i--) + if (FormMin.options[i].value <= Min) { + FormMin.options[i].selected = true; + break; + } + + if (FormSec) { + Sec = d.getSeconds(); + FormSec.options[d.getSeconds()].selected = true; + } + } + } + + if (!YearIsValid) { + FormYea.options[0].selected = true; + FormMon.options[0].selected = true; + FormDay.options[0].selected = true; + FormHou.options[0].selected = true; + FormMin.options[0].selected = true; + FormSec.options[0].selected = true; + } +} + +/*****************************************************************************/ +/************** Set UTC time from local date-time form fields ****************/ +/*****************************************************************************/ + +function setUTCFromLocalDateTimeForm (id) { + var Seconds = 0; + var idSecond = document.getElementById(id+'Second'); + if (idSecond) // id+'Second' present + Seconds = idSecond.value; + // Important: set date all at once to avoid problems with different length of months + var d = new Date(document.getElementById(id+'Year' ).value, + document.getElementById(id+'Month' ).value-1, + document.getElementById(id+'Day' ).value, + document.getElementById(id+'Hour' ).value, + document.getElementById(id+'Minute').value, + Seconds, + 0); + document.getElementById(id+'TimeUTC').value = d.getTime() / 1000; +} + +/*****************************************************************************/ +/******************* Set form params related to time zones *******************/ +/*****************************************************************************/ + +// Set form param with time difference between UTC time and client local time, in minutes +// For example, if your time zone is GMT+2, -120 will be returned +function setTZ (id) { + var FormTZ = document.getElementById(id); + var d = new Date(); + + FormTZ.value = d.getTimezoneOffset(); +} + +// Set form param with the name of the time zone +function setTZname (id) { + var FormTZname = document.getElementById(id); + var tz = jstz.determine(); // Determines the time zone of the browser client + FormTZname.value = tz.name(); // Returns the name of the time zone eg "Europe/Berlin" +} + +/*****************************************************************************/ +/********* Adjust a date form correcting selector days in the month **********/ +/*****************************************************************************/ + +// The selector of days can start by 1, 2, 3... or by -, 1, 2, 3... +function adjustDateForm (id) { + var FormYea = document.getElementById(id+'Year' ); + var FormMon = document.getElementById(id+'Month'); + var FormDay = document.getElementById(id+'Day' ); + var Yea = Number(FormYea.options[FormYea.selectedIndex].value); + var Mon = Number(FormMon.options[FormMon.selectedIndex].value); + + if (Yea != 0 && Mon != 0) { + var LastDayIndex = FormDay.options.length - 1; + var LastDayValue = Number(FormDay.options[LastDayIndex].value); + var SelectedDay = Number(FormDay.options[FormDay.selectedIndex].value); + var Days = daysInMonth (Mon,Yea); + + // If current selected day is out of range... + if (SelectedDay > Days) + // Select last day in month + for (var i=LastDayIndex; i>=0; i--) + if (FormDay.options[i].value == Days) { + FormDay.options[i].selected = true; + break; + } + + // Create new days at the end if necessary + for (var Day = Number(LastDayValue) + 1; Day <= Days; Day++) { + var opt = document.createElement('option'); + opt.value = opt.text = Day; + FormDay.add(opt); + } + + // Remove days from the end if necessary + for (var i=LastDayIndex; i>=0; i--) + if (FormDay.options[i].value > Days) + FormDay.options[i] = null; + else + break; + } +} + +/*****************************************************************************/ +/*********************** Get number of days in a month ***********************/ +/*****************************************************************************/ + +function daysInMonth (month, year) { // Month is 1 based + return new Date(year, month, 0).getDate(); // 0 is the last day of previous month +} + +/*****************************************************************************/ +/****************** Set a date range form to a specific day ******************/ +/*****************************************************************************/ + +// Set a date range form to yesterday +function setDateToYesterday (idStart,idEnd) { + var d = new Date(); + + d.setTime (d.getTime () - 24 * 60 * 60 * 1000); // Today - 1 day + setDateRange(idStart,idEnd,d); +} + +// Set a date range form to today +function setDateToToday (idStart,idEnd) { + var d = new Date(); + + setDateRange(idStart,idEnd,d); +} + +function setDateRange (idStart,idEnd,d) { + var FormYea; + var Yea = d.getFullYear(); + var Mon = d.getMonth() + 1; + var Day = d.getDate(); + + FormYea = document.getElementById(idStart+'Year'); + for (var i=0; i= 60) { + H = Math.floor(M / 60); + M %= 60; + } else + H = 0; + S = ListSeconds[i] % 60; + if (H != 0) { + StrM = ((M < 10) ? '0' : '') + M; + StrS = ((S < 10) ? '0' : '') + S; + PrintableClock = H + ':' + StrM + '′' + StrS + '″'; + } else if (M != 0) { + StrS = ((S < 10) ? '0' : '') + S; + PrintableClock = M + '′' + StrS + '″'; + } else + PrintableClock = S + '″'; + BoxClock.innerHTML = PrintableClock; + } + } + } + setTimeout('writeClockConnected()',1000); // refresh after 1 second +} + +/*****************************************************************************/ +/************* Automatic refresh of connected users using AJAX ***************/ +/*****************************************************************************/ + +// This function must be called from time to time +var objXMLHttpReqCon = false; +function refreshConnected () { + objXMLHttpReqCon = AJAXCreateObject(); + if (objXMLHttpReqCon) { + var refreshParams = refreshParamNxtActCon + '&' + + refreshParamIdSes + '&' + + refreshParamCrsCod; + + // onreadystatechange must be lowercase + objXMLHttpReqCon.onreadystatechange = readConnUsrsData; + objXMLHttpReqCon.open('POST',actionAJAX,true); + objXMLHttpReqCon.setRequestHeader('Content-Type', + 'application/x-www-form-urlencoded'); + objXMLHttpReqCon.send(refreshParams); + } +} + +// Receive and show connected users data +function readConnUsrsData () { + if (objXMLHttpReqCon.readyState == 4) // Check if data have been received + if (objXMLHttpReqCon.status == 200) { + var endOfDelay = objXMLHttpReqCon.responseText.indexOf('|',0); // Get separator position + var endOfNotif = objXMLHttpReqCon.responseText.indexOf('|',endOfDelay + 1); // Get separator position + var endOfGblCon = objXMLHttpReqCon.responseText.indexOf('|',endOfNotif + 1); // Get separator position + var endOfCrsCon = objXMLHttpReqCon.responseText.indexOf('|',endOfGblCon + 1); // Get separator position + var endOfNumUsrs = objXMLHttpReqCon.responseText.indexOf('|',endOfCrsCon + 1); // Get separator position + + var delay = parseInt(objXMLHttpReqCon.responseText.substring(0,endOfDelay)); // Get refresh delay + var htmlNotif = objXMLHttpReqCon.responseText.substring(endOfDelay + 1,endOfNotif); // Get HTML code for new notifications + var htmlGblCon = objXMLHttpReqCon.responseText.substring(endOfNotif + 1,endOfGblCon); // Get HTML code for connected + var htmlCrsCon = objXMLHttpReqCon.responseText.substring(endOfGblCon + 1,endOfCrsCon); // Get HTML code for course connected + var NumUsrsStr = objXMLHttpReqCon.responseText.substring(endOfCrsCon + 1,endOfNumUsrs); // Get number of users + var startOfUsr; + var endOfUsr; + + NumUsrsCon = (NumUsrsStr.length ? parseInt(NumUsrsStr) : 0); + + var divNewNotif = document.getElementById('msg'); // Access to new notifications DIV + if (divNewNotif) + divNewNotif.innerHTML = (htmlNotif.length) ? htmlNotif : ''; // Update new notifications DIV + + var divGblConnected = document.getElementById('globalconnected'); // Access to global connected DIV + if (divGblConnected) + divGblConnected.innerHTML = htmlGblCon; // Update global connected DIV + if (htmlCrsCon.length) { + var divCrsConnected = document.getElementById('courseconnected'); // Access to course connected DIV + if (divCrsConnected) { + divCrsConnected.innerHTML = htmlCrsCon; // Update course connected DIV + countClockConnected = 0; // Don't refresh again using writeClockConnected until past 10 seconds + startOfUsr = endOfNumUsrs + 1; + for (var NumUsr=0; NumUsr= 60000) // If refresh slower than 1 time each 60 seconds, do refresh; else abort + setTimeout('refreshConnected()',delay); + } +} + +/*****************************************************************************/ +/***************** Update exam print main area using AJAX ********************/ +/*****************************************************************************/ + +var txtConnectionIssues = [ + "", // Unknown + "Problemes de connexió. Els canvis no s'han desat.", // CA + "Verbindungsprobleme. Die Änderungen wurden nicht gespeichert.", // DE + "Connection issues. The changes have not been saved.", // EN + "Problema de conexión. Los cambios no se han guardado.", // ES + "Problèmes de connexion. Les modifications n'ont pas été enregistrées.",// FR + "Problema de conexión. Los cambios no se han guardado.", // GN Okoteve traducción + "Problemi di connessione. Le modifiche non sono state salvate.", // IT + "Problemy z połączeniem. Zmiany nie zostały zapisane.", // PL + "Problemas de conexão. As alterações não foram salvas." // PT +]; + +var txtSaving = [ + "", // Unknown + "Desant…", // CA + "Speichern…", // DE + "Saving…", // EN + "Guardando…", // ES + "Enregistrement…", // FR + "Guardando…", // GN Okoteve traducción + "Salvataggio…", // IT + "Zapisywanie…", // PL + "Salvando…", // PT +]; + +var IHaveFinishedTxt; + +// This function is called when user changes an answer in an exam print +function updateExamPrint (idDiv,idInput,nameInput,Params,Language) { + var objXMLHttp = false; + + objXMLHttp = AJAXCreateObject (); + if (objXMLHttp) { + /* Send request to server */ + // onreadystatechange must be lowercase + objXMLHttp.onreadystatechange = function() { + if (objXMLHttp.readyState == 4) // Check if data have been received + if (objXMLHttp.status == 200) { + // Response received + clearTimeout (xmlHttpTimeout); // Clear timeout + if (idDiv) { + var div = document.getElementById(idDiv); // Access to DIV + if (div) { + div.innerHTML = objXMLHttp.responseText; // Update DIV content + + // Scripts in div got via AJAX are not executed ==> execute them + evalScriptsInElem (div); + + // Process maths; see http://docs.mathjax.org/en/latest/advanced/typeset.html + MathJax.typeset(); + } + } + } + }; + + var inputElem = document.getElementById(idInput); + + if (inputElem) + if (inputElem.type) { + if (inputElem.type === 'radio') { + if (inputElem.checked) + Params += '&' + nameInput + '=' + inputElem.value; + } + else if (inputElem.type === 'checkbox') { + var inputElems = inputElem.form.elements; + var i = 0; + + // First checkbox checked + for (; i user will see ? input + } + } + + IHaveFinishedTxt = disableFinished (txtSaving[Language]); // Disable finished button on sending. When answer is saved and response received ==> the button will be reloaded + + objXMLHttp.open('POST',actionAJAX,true); + objXMLHttp.setRequestHeader('Content-Type', + 'application/x-www-form-urlencoded'); + objXMLHttp.send(Params); + + /* Timeout to abort in 5 seconds. + See https://stackoverflow.com/questions/1018705/how-to-detect-timeout-on-an-ajax-xmlhttprequest-call-in-the-browser + and http://geekswithblogs.net/lorint/archive/2006/03/07/71625.aspx + "ontimeout" based solutions does not work when network disconnects */ + var xmlHttpTimeout = setTimeout (ajaxTimeout,5000); // 5 s + function ajaxTimeout () { + objXMLHttp.abort (); + alert (txtConnectionIssues[Language]); + disableFinished (IHaveFinishedTxt); // Sending aborted ==> change "Saving..." to original "I have finished" + }; + } +} + +// Escape the same chars as encodeURIComponent(), but in ISO-8859-1 +function getEscapedString (str) { + const len = str.length; + var escaped = ''; + + for (var i = 0; i < len; i++) { + const code = str.charCodeAt(i); + switch (true) { // Escape punctuation marks except - _ . ! ~ * ' ( ) + case (code <= 0x09): // Spec. + escaped += '%0' + code.toString(16).toUpperCase(); // %0X + break; + case (code >= 0x10 && code <= 0x20): // Spec. 0x20 space + case (code >= 0x22 && code <= 0x26): // 0x22 " 0x23 # 0x24 $ 0x25 % 0x26 & + case (code == 0x2B): // 0x2B + + case (code == 0x2C): // 0x2C , + case (code == 0x2F): // 0x2F / + case (code >= 0x3A && code <= 0x40): // 0x3A : 0x3B ; 0x3C < 0x3D = 0x3E > 0x3F ? 0x40 @ + case (code >= 0x5B && code <= 0x5E): // 0x5B [ 0x5C \ 0x5D ] 0x5E ^ + case (code == 0x60): // 0x60 ` + case (code >= 0x7B && code <= 0x7D): // 0x7B { 0x7C | 0x7D } + case (code >= 0x7F && code <= 0xFF): // ISO-8859-1 or windows-1252 + escaped += '%' + code.toString(16).toUpperCase(); // %XX + break; + case (code >= 0x100): + escaped += '%26%23' + code.toString(10) + '%3B'; // &#code; instead of %uXXXX + break; + default: // 0x21 ! + // 0x27 ' 0x28 ( 0x29 ) 0x2A * + // 0x2D - 0x2E . + // 0x30 0 ... 0x39 9 + // 0x41 A ... 0x5A Z + // 0x5F _ + // 0x61 a ... 0x7A z + // 0x7E ~ + escaped += str.charAt(i); + break; + } + } + return escaped; +} + +/* +// To generate a table with the codification generated by encodeURIComponent() +// and escape(), copy the following code in https://playcode.io/ +//----------------------------------------------------------------------------- +var arr = []; +for(var i=0;i<256;i++) { + var char=String.fromCharCode(i); + arr.push({ + character:char, + encodeURIComponent:encodeURIComponent(char), + escape:escape(char) + }); +} +console.table(arr); +//----------------------------------------------------------------------------- +*/ + +/*****************************************************************************/ +/********* Disable button to finish exam when focus on a input text **********/ +/*****************************************************************************/ + +function disableFinished (buttonNewTxt) { + var f = document.getElementById('finished'); // Access to form + var buttonOldTxt = ''; + + if (f) + for (var i = 0; i < f.elements.length; i++) { + var b = f.elements[i]; + if (b.type == 'submit') { + b.disabled = true; + b.style.opacity = 0.5; + buttonOldTxt = b.innerHTML; + b.innerHTML = buttonNewTxt; + } + } + + return buttonOldTxt; +} + +/*****************************************************************************/ +/********** Automatic refresh of current match question using AJAX ***********/ +/*****************************************************************************/ + +// This function must be called from time to time +var objXMLHttpReqMchStd = false; +function refreshMatchStd () { + objXMLHttpReqMchStd = AJAXCreateObject(); + if (objXMLHttpReqMchStd) { + var refreshParams = refreshParamNxtActMch + '&' + + refreshParamMchCod + '&' + + refreshParamIdSes; + + // onreadystatechange must be lowercase + objXMLHttpReqMchStd.onreadystatechange = readMatchStdData; + objXMLHttpReqMchStd.open('POST',actionAJAX,true); + objXMLHttpReqMchStd.setRequestHeader('Content-Type', + 'application/x-www-form-urlencoded'); + objXMLHttpReqMchStd.send(refreshParams); + } +} + +function readMatchStdData () { + if (objXMLHttpReqMchStd.readyState == 4) // Check if data have been received + if (objXMLHttpReqMchStd.status == 200) { + var htmlMatch = objXMLHttpReqMchStd.responseText; // Get HTML code + + var div = document.getElementById('match'); // Access to refreshable DIV + if (div) + div.innerHTML = htmlMatch; // Update DIV content + // Global delay variable is set initially in swad-core + setTimeout('refreshMatchStd()',delayMatch); + } +} + +/*****************************************************************************/ +/**** Automatic refresh of left part of current match question using AJAX ****/ +/*****************************************************************************/ + +//This function must be called from time to time +var objXMLHttpReqMchTch = false; +function refreshMatchTch () { + objXMLHttpReqMchTch = AJAXCreateObject(); + if (objXMLHttpReqMchTch) { + var refreshParams = refreshParamNxtActMch + '&' + + refreshParamMchCod + '&' + + refreshParamIdSes; + + // onreadystatechange must be lowercase + objXMLHttpReqMchTch.onreadystatechange = readMatchTchData; + objXMLHttpReqMchTch.open('POST',actionAJAX,true); + objXMLHttpReqMchTch.setRequestHeader('Content-Type', + 'application/x-www-form-urlencoded'); + objXMLHttpReqMchTch.send(refreshParams); + } +} + +function readMatchTchData () { + if (objXMLHttpReqMchTch.readyState == 4) // Check if data have been received + if (objXMLHttpReqMchTch.status == 200) { + var endOfId = objXMLHttpReqMchTch.responseText.indexOf('|',0 ); // Get separator position + var endOfEv = objXMLHttpReqMchTch.responseText.indexOf('|',endOfId + 1); // Get separator position + + var id = objXMLHttpReqMchTch.responseText.substring(0 ,endOfId); // Get id + var ev = objXMLHttpReqMchTch.responseText.substring(endOfId + 1,endOfEv); // Get ev ('0' / '1') + var html = objXMLHttpReqMchTch.responseText.substring(endOfEv + 1); // Get HTML code + + var div = document.getElementById(id); // Access to refreshable DIV + if (div) { + div.innerHTML = html; // Update DIV content + + if (parseInt(ev)) { // 0 / 1 + // Scripts in div got via AJAX are not executed ==> execute them + evalScriptsInElem (div); + + // Process maths; see http://docs.mathjax.org/en/latest/advanced/typeset.html + MathJax.typeset(); + } + } + + // Global delay variable is set initially in swad-core + setTimeout('refreshMatchTch()',delayMatch); + } +} + +/*****************************************************************************/ +/****************** Update match control area using AJAX *********************/ +/*****************************************************************************/ + +// This function is called when user submit a form inside two parent divs +function updateMatchTch (id,Params) { + var objXMLHttp = false; + + objXMLHttp = AJAXCreateObject (); + if (objXMLHttp) { + /* Send request to server */ + // onreadystatechange must be lowercase + objXMLHttp.onreadystatechange = function() { + if (objXMLHttp.readyState == 4) // Check if data have been received + if (objXMLHttp.status == 200) + if (id) { + var div = document.getElementById(id); // Access to DIV + if (div) + div.innerHTML = objXMLHttp.responseText; // Update DIV content + } + }; + objXMLHttp.open('POST',actionAJAX,true); + objXMLHttp.setRequestHeader('Content-Type', + 'application/x-www-form-urlencoded'); + objXMLHttp.send(Params); + } +} + +/*****************************************************************************/ +/**************** Automatic refresh of last clicks using AJAX ****************/ +/*****************************************************************************/ + +// This function must be called from time to time +var objXMLHttpReqLog = false; +function refreshLastClicks () { + objXMLHttpReqLog = AJAXCreateObject(); + if (objXMLHttpReqLog) { + var refreshParams = refreshParamNxtActLstClk + '&' + + refreshParamIdSes + '&' + + refreshParamCrsCod; + + // onreadystatechange must be lowercase + objXMLHttpReqLog.onreadystatechange = readLastClicksData; + objXMLHttpReqLog.open('POST',actionAJAX,true); + objXMLHttpReqLog.setRequestHeader('Content-Type', + 'application/x-www-form-urlencoded'); + objXMLHttpReqLog.send(refreshParams); + } +} + +function readLastClicksData () { + if (objXMLHttpReqLog.readyState == 4) // Check if data have been received + if (objXMLHttpReqLog.status == 200) { + var endOfDelay = objXMLHttpReqLog.responseText.indexOf('|',0); // Get separator position + + var delay = parseInt(objXMLHttpReqLog.responseText.substring(0,endOfDelay)); // Get refresh delay + var htmlLastClicks = objXMLHttpReqLog.responseText.substring(endOfDelay + 1); // Get HTML code for last clicks + + var divLastClicks = document.getElementById('lastclicks'); // Access to last click DIV + if (divLastClicks) + divLastClicks.innerHTML = htmlLastClicks; // Update global connected DIV + if (delay > 200) // If refresh slower than 1 time each 0.2 seconds, do refresh; else abort + setTimeout('refreshLastClicks()',delay); + } +} + +/*****************************************************************************/ +/******* Automatically refresh new publications in timeline using AJAX *******/ +/*****************************************************************************/ + +// This function must be called from time to time + +var objXMLHttpReqNewTml = false; + +function refreshNewTimeline () { + objXMLHttpReqNewTml = AJAXCreateObject(); + if (objXMLHttpReqNewTml) { + var refreshParams = refreshParamNxtActNewPub + '&' + + refreshParamIdSes + '&' + + refreshParamWho; + + // onreadystatechange must be lowercase + objXMLHttpReqNewTml.onreadystatechange = readNewTimelineData; + objXMLHttpReqNewTml.open('POST',actionAJAX,true); + objXMLHttpReqNewTml.setRequestHeader('Content-Type', + 'application/x-www-form-urlencoded'); + objXMLHttpReqNewTml.send(refreshParams); + } +} + +function readNewTimelineData () { + if (objXMLHttpReqNewTml.readyState == 4) // Check if data have been received + if (objXMLHttpReqNewTml.status == 200) { + + // Access to UL for just now timeline + var justNowTimeline = document.getElementById('just_now_timeline_list'); + if (justNowTimeline) { + // Update list of publications in just now timeline + justNowTimeline.innerHTML = objXMLHttpReqNewTml.responseText; + + var numNotesJustGot = justNowTimeline.childNodes.length; + if (numNotesJustGot) { // New notes received + // Scripts in timeline got via AJAX not executed ==> execute them + evalScriptsInElem (justNowTimeline); + + // Process maths; see http://docs.mathjax.org/en/latest/advanced/typeset.html + MathJax.typeset(); + + // Move all the LI elements (notes) in UL 'just_now_timeline_list'... + // ...to the top of UL 'new_timeline_list' + var newTimeline = document.getElementById('new_timeline_list'); + + for (var i=0; i