1 /* Style is optimized for iphone and android. Note that -webkit properties create errors in the CSS validator. Relative units
2 for sizes are used unless it is a border. Classes beginning with ".fl-" override Mobile FSS,
3 see the API @ http://wiki.fluidproject.org/display/fluid/Mobile+FSS+API for more details.
28 background-color: #4B6B90;
30 background-image: -moz-linear-gradient(
39 #header-section-title {
42 background-image: -webkit-gradient(linear, left top, left bottom,
44 color-stop(0.5, #6d8cb3),
45 color-stop(0.50, #4b6b90),
46 color-stop(0.5, #6d8cb3),
49 background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#6d8cb3), to(#4b6b90));
53 .fl-theme-iphone .fl-navbar{
65 border-top: 1px solid black;
66 border-bottom: .5px solid black;
67 background-color: #4b6b90;
71 #navigation-contentwrapper{
73 background-color: #4b6b90;
79 border-bottom: .5px solid black;
80 /*padding-bottom: .3em;*/
89 background-color:white;
92 #site-name, h1#section-title{
101 /************************************************************************************************/
102 /* "Navigation" button, also this CSS creates a button that looks exactly like a Mobile FSS tab.*/
103 /************************************************************************************************/
104 .navigation-bar-button{
106 -webkit-border-radius: 5px;
107 -moz-border-radius:5px;
109 font-size: 18px;/*keep this in px*/
115 /* default mobile fss color scheme for tabs not AA compliant. Here is a compliant bg image: */
116 background-image: -webkit-gradient(linear, left top, left bottom,
118 color-stop(0.5, #374e6b),
119 color-stop(0.50, #354d68),
122 -webkit-border-image: url(images/navbar_normal_button_insetShadow.png) 5 5 5 5 stretch;
123 -webkit-border-left-image: none;
124 -webkit-background-origin: border;
125 -webkit-background-clip: border;
129 .navigation-bar-button a:hover, .navigation-bar-button a:active, .navigation-bar-button a:focus{
130 background-color: white;
133 .fl-theme-iphone .fl-tabs li{
134 /* default mobile fss color scheme for tabs not AA compliant against a white foreground text.therefore its backgroud-image must be overrided */
135 background-image: -webkit-gradient(linear, left top, left bottom,
137 color-stop(0.5, #374e6b),
138 color-stop(0.50, #354d68),
142 .fl-theme-iphone .topnavlistcontainer .topnavlist-link {/*makes the navigation button link white*/
144 text-decoration: none;
147 -moz-border-image: url("images/navbar_normal_button_insetShadow.png") 5 5 5 5 stretch;
148 background-color: #354D68;
151 #content_link_phone.topnavlist-link-highlight {/*makes the content link highlight*/
153 text-decoration: none;
156 .fl-theme-iphone .topnavlistcontainer .topnavlist-link-highlight{/*makes the navigation button link highlight*/
158 text-decoration: none;
167 /*background-color: white;*/
170 div#content-link-container.flc-screenNavigator-navbar {
174 .content-link-surround a:active, .content-link-surround a:focus, .content-link-surround a:hover{
178 #content_link_phone {
181 text-decoration: none;
196 font-size: 17px;/*keep this in px*/
201 ul.home-guide li a:hover, ul.home-guide li a:focus, ul.home-guide li a:active, ul.home-guide li.back a:hover, ul.home-guide li.back a:focus, ul.home-guide li.back a:active,
202 ul.home-guide li.forward a:hover, ul.home-guide li.forward a:focus, ul.home-guide li.forward a:active {
204 background:transparent;
207 /* main body attributes */
217 text-decoration: underline;
222 background-color: transparent;
226 background-color: transparent;
229 h1, h2, h3, h4, h5, h6 {
232 font: 100% Helvetica, Arial, sans-serif;
255 text-decoration: none;
264 a:hover, a:visited, a:focus {
266 text-decoration: underline;
269 /************************************************************************************************/
270 /* Preferences tabs */
271 /************************************************************************************************/
272 .etabbed-list-container {
286 padding:0.5em 0.3em 0;
293 padding:0.7em 0.3em 0;
302 /************************************************************************************************/
303 /* link attributes */
304 /************************************************************************************************/
305 a:link, /*a:visited*/ a:focus {
309 .top-tool a:link, .top-tool a:focus{
310 text-decoration: none;
313 /* main submit button */
315 background-color: #808080;
318 -webkit-border-radius:3px;
319 -moz-border-radius:3px;
321 padding-top: 0.313em;
322 padding-bottom: 0.313em;
326 border:1px solid #A50707;
327 background-color: #FFDAB9;
329 /* small submit button at top */
331 font-family: Helvetica,sans-serif;
332 background-color: #E9F4F3;
336 background-color: #E9F4F3;
337 border: #ACCFCC solid 1px;
340 /* Editor box large */
342 font-family: Helvetica,sans-serif;
343 background-color: #E9F4F3;
348 padding-bottom: .4em;
349 border: 1px #ACCFCC solid;
352 /* edit content tabs */
354 background-color: #E6E6E6;
357 padding-left: .188em;
358 padding-right: .188em;
365 background-color: #E6E6E6;
366 border-top: 1px #B8AE9C solid;
367 border-left: 1px #B8AE9C solid;
368 border-right: 1px #B8AE9C solid;
369 text-decoration: none;
375 .buttontab selected {
376 font-family: Helvetica, Arial, Helvetica, sans-serif;
377 background-color: #6F7172;
380 padding-left: .188em;
381 padding-right: .188em;
386 font-family: Helvetica, Arial, Helvetica, sans-serif;
388 text-decoration: none;
390 background-color: white;
391 border-top: 1px #B8AE9C solid;
392 border-left: 1px #B8AE9C solid;
393 border-right: 1px #B8AE9C solid;
396 .tab a:link, .etab a:visited {
398 background-color: white;
402 td.dropdown-heading {
403 background-color: #DBFDD4;
405 border-left: 1px solid #ECFEEA;
406 border-right: 1px solid #ECFEEA;
407 border-top: 1px solid #ECFEEA;
410 /* the side menu content */
413 background-color: white;
415 border-left: 1px solid #ECFEEA;
416 border-right: 1px solid #ECFEEA;
417 border-bottom: 1px solid #ECFEEA;
420 td.dropdown a, td.dropdown a:visited {
422 text-decoration: none;
424 td.dropdown a:hover {
426 text-decoration: underline;
429 /* added for 1.4.2: */
431 padding-left: 1.25em;
436 margin-bottom: 0.313em;
439 margin-left: 0.313em;
443 background-color: #F7F3ED;
445 border-left: 1px solid #595241;
446 border-right: 1px solid #595241;
447 border-top: 1px solid #595241;
457 border:thin black solid;
459 table.tabbed-table th#left-empty-tab {
460 background-color: transparent;
462 border-bottom: 1px solid #B8AE9C;
464 table.tabbed-table th#right-empty-tab {
466 background-color: transparent;
467 border-bottom: 1px solid #B8AE9C;
469 padding-right: 0.313em;
471 table.tabbed-table th#right-empty-tab a {
472 text-decoration: underline;
474 table.tabbed-table th.tab-spacer {
475 background-color: transparent;
477 border-bottom: 1px solid #B8AE9C;
480 table.tabbed-table th.tab {
481 padding-top: 0.125em;
482 padding-bottom: 0.125em;
484 background-color: #E9F4F3;
485 border-bottom: 1px solid #B8AE9C;
486 border-left: 1px solid #B8AE9C;
487 border-top: 1px solid #B8AE9C;
488 border-right: 1px solid #B8AE9C;
490 table.tabbed-table th.tab:hover {
491 background-color: #ACCFCC;
494 table.tabbed-table th.tab a:focus {
497 table.tabbed-table th.selected {
498 padding-top: 0.125em;
499 padding-bottom: 0.125em;
501 background-color: #ACCFCC;
502 border-left: 1px solid #B8AE9C;
503 border-top: 1px solid #B8AE9C;
504 border-right: 1px solid #B8AE9C;
507 table.tabbed-table a, table.tabbed-table a:visited, table.tabbed-table a:hover {
509 text-decoration: none;
513 .preference-buttons-container{
514 background-color: red;
520 div.preference-buttons-container li{
537 font-family: monospace;
538 border: 2px solid rgb(0, 0, 0);
541 color: rgb(255, 255, 255);
542 background-color: rgb(0, 0, 0);
546 border-bottom-width: 0;
554 #display-settings-preview{
562 #defaultfontsize-wrapper{
568 padding-left: 0.938em;
569 background-repeat: no-repeat;
570 background-position: 0.125em 0.313em;
574 padding-left: 1.25em;
575 background-image: url(images/back.gif);
576 background-repeat: no-repeat;
577 background-position: 0 0;
580 .breadcrumbs, .previous-next /*a#guide*/{
581 /* The path bar, including breadcrumbs and add to favorites */
586 background-color: white;
589 #breadcrumbs-container{
590 background-color: #4d4d4d;
600 #subnavlistbacktopage{
605 margin-bottom: 0.313em;
611 border-left: 1px solid black;
612 border-right: 1px solid black;
613 border-bottom: 1px solid black;
614 padding-left: 0.313em;
615 padding-right: 0.313em;
616 padding-bottom: 0.313em;
617 background-color: #F7F3ED;
618 margin-left: 0.313em;
619 margin-right: 0.313em;
624 margin-left: 0.313em;
625 margin-right: 0.313em;
626 border-left: 1px solid black;
627 border-right: 1px solid black;
629 background-color: #F7F3ED;
632 border-bottom: 1px solid black;
641 padding-left: 0.625em;
645 /**********************************************************************/
647 /**********************************************************************/
654 background-color: #4b6b90;
661 ul.footer-links-tabs li a:hover, ul.footer-links-tabs li a:focus, ul.footer-links-tabs li a:active,
662 ul.footer-links-tabs li.back a:hover, ul.footer-links-tabs li.back a:focus, ul.footer-links-tabs li.back a:active,
663 ul.footer-links-tabs li.forward a:hover, ul.footer-links-tabs li.forward a:focus, ul.footer-links-tabs li.forward a:active {
665 background:transparent;
667 div#top-links a:link, div#top-links a:visited {
668 text-decoration:none;
672 background-color:#F6EAD6;
679 background-color: #F7F3ED;
680 padding-top: 0.063em;
681 padding-bottom: 0.063em;
682 padding-left: 0.938em;
683 padding-right: 0.5em;
684 border: 1px solid #cccccc;
686 text-decoration: none;
689 a#editor-link:hover {
690 background-color: #F7F3ED;
691 border: 1px solid #B8AE9C;
695 background-image: url(images/pen.gif);
696 background-repeat: no-repeat;
697 background-position: 0 0.125em;
700 background-image: url(images/pen2.gif);
701 background-repeat: no-repeat;
702 background-position: 0 0.125em;
706 /* for data tables */
708 border: #A9ADB0 1px solid;
709 border: #cccccc 1px solid;
710 -webkit-border-radius:5px;
711 -moz-border-radius:5px;
725 background-color: transparent;
727 /* contains the headings */
735 background-image: url('../default/images/sort.gif');
736 background-repeat: no-repeat;
737 background-position: right;
742 table.data tbody th {
753 table.data td a:link, a:visited{
758 /*should table.data tbody tr:hover and table.data tbody tr.selected highlighting
759 be improved to sync with Mobile FSS highlighting */
760 table.data tbody tr:hover {
761 background-color: #efefef;
765 table.data tbody tr.selected {
766 background-color: #E9F4F3;
768 border: 5px solid #E9F4F3;
772 background-color: #F7F3ED;
775 table.data tfoot tr:first-child td {
777 background-image: url('images/arrow_ltr.gif');
778 background-repeat: no-repeat;
779 background-position: .25em 0.313em;
782 table.data.static tfoot td, table.data.static tfoot tr:first-child td {
784 background-image: none;
788 /* add borders to row in Required Information, Personal Information*/
793 #last-row, .row-buttons, #last-row1, .row-blurb{
796 #browse-courses-table{
802 table.data tfoot input {
803 background-color: #efefef;
806 table.data tfoot input:focus {
807 background-color: #FFDAB9;
811 /* used for static tables with no form elements: */
812 table.data.static tbody tr:hover {
813 background-color: transparent;
819 /* course browser: */
827 div.browse-selected {
828 background-image: url('images/side_arrow.gif');
829 background-repeat: no-repeat;
830 padding-left: 0.563em;
831 background-position: center left;
834 div.browse-unselected {
835 padding-left: 0.563em;
843 /* feedback /errors */
849 margin-bottom: 0.938em;
850 border: 1px solid #DD0000;
852 background-color: #F4DCDC;
854 background-color: #F4DCDC;
855 padding-left: 1.563em;
857 -webkit-border-radius:5px;
858 -moz-border-radius:5px;
866 div#error ul, div#feedback ul, div#help ul {
877 div#feedback, div#info {
882 margin-bottom: 0.313em;
884 font-family: Helvetica, Arial, sans-serif;
885 -webkit-border-radius:5px;
886 -moz-border-radius:5px;
888 border: 1px solid #17B506;
889 background-color: #E7EFD0;
894 div#feedback li, div#info li, div#error li{
904 margin-bottom: 0.938em;
905 border: 1px solid #ACCFCC;
907 background-color: #E9F4F3;
917 margin-bottom: 0.938em;
918 border: 1px solid #FF8400;
920 background-color: #FFF6ED;
933 font-family:Helevetica, Arial, sans-serif;
943 /* home page links */
952 div.home-link:hover {
954 background-color: #F7F3ED;
955 border: 1px solid #afafaf;
961 text-decoration: none;
973 div#sequence-links a {
974 text-decoration: none;
984 background-color: white;
986 border-left: 1px solid #ECFEEA;
987 border-right: 1px solid #ECFEEA;
988 border-bottom: 1px solid #ECFEEA;
992 div.dropdown-heading {
993 background-color: #ACCFCC;
995 border-left: 1px solid #ECFEEA;
996 border-right: 1px solid #ECFEEA;
997 border-top: 1px solid #ECFEEA;
1008 margin-top: -0.313em;
1010 padding-right: 0.125em;
1014 margin-left: 0.313em;
1018 padding-top: .313em;
1019 background-color: white;
1042 padding-left: 0.125em;
1043 padding-right: 0.125em;
1050 text-decoration: none;
1051 padding-left: 0.25em;
1052 padding-right: 0.25em;
1053 border-left: 1px solid white;
1054 border-right: 1px solid white;
1058 div.paging li a:hover, div.paging li a.current {
1059 border: 1px solid #4c96f4;
1061 background-color: #4c96f4;
1062 -webkit-border-radius: 3px;
1063 -moz-border-radius: 3px;
1069 background-image:url(images/tl_corner.gif);
1070 background-position: top left;
1071 background-repeat: no-repeat;
1076 /* Navigational Plone Tabs(tm), implemented by customizing the a tag - they are surprisingly elegant. The power of CSS runs strong in these :) */
1077 background-color: transparent;
1078 border-collapse: collapse;
1079 border-bottom: 1px solid #B8AE9C;
1080 padding: 0.5em 0em 0em 2em;
1081 white-space: nowrap;
1085 /* The normal, unselected tabs. They are all links */
1086 background-color: transparent;
1087 border-color: #B8AE9C;
1089 border-style: solid solid none solid;
1092 margin-right: 0.5em;
1093 padding: 0em 2em 0em;
1097 div.tabs a.selected {
1098 /* The selected tab. There's only one of this */
1099 background-color: white;
1100 border-bottom: #B8AE9C 1px solid;
1102 font-weight: normal;
1105 div.tabs a:hover, div.tabs a.active {
1106 background-color: #B8AE9C;
1107 border-bottom: 1px solid #B8AE9C;
1114 .headingbox a:link, .headingbox a:visited{
1115 text-decoration: none;
1120 background-color: #F5F5F5;
1126 background-color: #F5F5F5;
1127 text-decoration: none;
1133 background-color: #F5F5F5;
1135 border: 1px solid #B8AE9C;
1137 font-weight: normal;
1142 background-color: #6F7172;
1143 border: 1px solid #B8AE9C;
1144 border-style: solid solid none solid;
1146 padding: 0em 1em 0em 1em;
1153 text-decoration: none;
1158 text-decoration: none;
1162 text-decoration: underline;
1176 text-transform: none;
1177 border-left: 1pt solid #B8AE9C;
1190 background-color: #F7F3ED;
1194 background-color: transparent;
1198 /* users/index.php */
1204 border: rgb(204, 204, 204) 1px solid;
1205 background-color: #F7F7F7;
1217 font-weight: normal;
1223 background-color:#FBF4E9;
1224 border: #B8AE9C 1px solid;
1228 table.data .odd img.headicon{
1231 -webkit-border-radius:5px;
1232 -moz-border-radius:5px;
1237 -webkit-border-radius:10px;
1238 -moz-border-radius:10px;
1239 border-radius: 10px;
1240 border-color: white;
1245 div.course div.shortcuts {
1248 vertical-align: middle;
1252 fieldset#shortcuts {
1254 background-color: #FEFDEF;
1255 border: 1pt solid #B8AE9C;
1256 margin: -5pt 5pt 5pt 5pt;
1257 padding-right: 10pt;
1258 padding-bottom: 5pt;
1263 margin-bottom: 10pt;
1264 -webkit-border-radius:5px;
1265 moz-border-radius:5px;
1272 border:thin #6D7B8D solid;
1273 border:thin #A9ADB0 solid;
1281 list-style-type: none;
1285 /*a#guide,*/ a#my-courses-link {
1286 background-color: #6D84A2;
1297 div#content-test, div.content-from-module {
1314 ul#home-links, ul#home-detail-links {
1319 #my_courses_container{
1326 border: solid 1px #A9ADB0;
1327 -webkit-border-radius:8px;
1328 -moz-border-radius:8px;
1332 margin-bottom: .375em;
1336 .my-courses-list-ul{
1349 padding-left: 0.875em;
1350 padding-bottom: 0.875em;
1354 .fl-theme-iphone [class*="fl-list"] > li .fl-link-summary{
1369 list-style-type: none;
1371 padding-bottom: .5em;
1375 .current_list_date_time{
1378 #show-all, #show-pages{
1382 /* enrollment tabs */
1388 margin-bottom: .25em;
1389 margin-top: 0.938em;
1390 white-space: nowrap;
1400 padding: 0.188em 0.563em;
1401 border: 1px solid #F7F3ED;
1402 border-bottom: none;
1403 background-color: #F7F3ED;
1404 text-decoration: none;
1406 white-space: nowrap;
1409 #navlist li a:hover, #navlist li a:active {
1411 background-color: #fff;
1416 vertical-align: middle;
1423 dl#public-profile dt {
1426 border-right: 1px solid #F7F3ED;
1427 padding: 0.313em 0.313em 0.313em 0;
1429 margin-right: 0.313em;
1431 dl#public-profile dd {
1449 padding-bottom: .375em;
1452 border: 1px #cccccc solid;
1460 #forum-thread li {border:1px solid #eee; border-bottom: 1px solid #F7F3ED; float:left; width: 97%; list-style: none; }
1461 #forum-thread li.even { background-color: #F7F3ED; border-top: none; }
1462 #forum-thread li.odd { background-color: #fff; }
1463 div.forum-post-author { float:left; width:19.375em; padding:0.5em 0.625em; }
1464 div.forum-post-author a.title {font-size: 1.1em; line-height: 1.2em; font-weight: bold; text-decoration:none; }
1465 div.forum-post-author img.profile-picture { border: 2px solid #F7F3ED; text-align:right;}
1466 div.forum-post-content { margin-left: 19.375em; padding: 0.313em 0 1.125em 1.125em;}
1467 div.forum-post-content h3 { font-weight: 500; float:left;clear:right; }
1468 div.forum-post-ctrl { float: right; padding-right: 0.313em; color: #a1a1a1;}
1469 div.forum-post-ctrl a { text-decoration: none; }
1470 div.forum-post-ctrl span { color: black; background-color: #fefdc2; padding: 0.188em; }
1471 div.forum-post-content p.date { color: #a1a1a1; border-bottom: 1px solid #F7F3ED; }
1472 div.forum-post-content div.body p { margin-bottom:1em; }
1473 div.forum-paginator{border:thin #cccccc solid; padding:.3em; width:95%;margin:auto;background-color:#F7F3ED;}
1474 span.forum-paginator-active{font-weight:700;text-decoration:underline; height:2em;}
1478 /** inbox stuff - reuses some of the forum layout **/
1479 #inbox-msg li {border:1px solid #eee; border-bottom: 1px solid #F7F3ED; width: 95%; list-style: none; min-height: 11em;}
1481 /* tool list on admin home and manage screens */
1484 padding: 0.125em 0.125em 0.125em 0.938em;
1485 margin-bottom: 0.313em;
1487 border: solid 1px #A9ADB0;
1488 -webkit-border-radius:5px;
1489 -moz-border-radius:5px;
1495 font-weight: normal;
1499 margin-top: -0.313em;
1507 margin-right: 0.313em;
1512 /* browse courses */
1514 padding-bottom: 0.625em;
1519 padding-bottom: 0.625em;
1520 background-color: #fffaf0;
1524 dl.browse-course dt {
1530 padding: 0.313em 0.625em 0.313em 0;
1531 vertical-align: middle;
1534 dl.browse-course dd {
1535 margin-bottom: 0.313em;
1537 padding: 0.313em 0 0.313em 0.625em;
1545 /* form fields grouping for WCAG 2.0 conformance*/
1546 fieldset.group_form{
1550 border: 1px #6D7B8D solid;
1551 -webkit-border-radius:5px;
1552 -moz-border-radius:5px;
1558 background-color:white;
1562 border: 1px #6D7B8D solid;
1563 -webkit-border-radius:5px;
1564 -moz-border-radius:5px;
1568 /* highlight active links for WCAG 2.0 conformance */
1569 a:active:not(.subnavcontain a),
1570 a:hover:not(.subnavcontain a),
1571 a:focus:not(.subnavcontain a),
1574 background: url(../images/themes/iphone/listmenu_loader.gif) no-repeat 97% center,
1575 -webkit-gradient(linear, left top, left bottom, from(#4a94f4), to(#236de5));
1579 /*Overrides above a:active, a:hover, a:focus so the "Navigation" button itself isn't highlighted when activated.
1580 Ensure styling matches that in fl-tabs.*/
1581 .topnavlistcontainer a:hover, .topnavlistcontainer a:active, .topnavlistcontainer a:focus{
1582 background-image: -webkit-gradient(linear, left top, left bottom,
1584 color-stop(0.5, #374e6b),
1585 color-stop(0.50, #354d68),
1592 /*Added by Silvia */
1593 div.column_primary {
1598 min-width: 10.625em;
1601 div.column_equivalent{
1604 margin-left: 0.938em;
1605 margin-top: 0.313em;
1606 margin-right: 0.313em;
1607 margin-bottom: 0.313em;
1608 min-width: 10.625em;
1610 border: 1px solid #EEE;
1611 background-color: #FFF;
1615 border: 1px solid #aaa;
1620 background-color: #eee;
1629 div.alternative_box{
1630 border: 1px solid #ddd;
1635 background-color: #fff;
1638 div.alternative_box legend {
1642 div.resource_box legend {
1648 font-weight: bolder;
1649 background-color: white;
1652 /* format of "table of contents" on content page */
1653 #toc a { display:block; margin:0.188em; }
1654 #toc .h2, #toc .h3, #toc .h4, #toc .h5, #toc .h6{
1660 background-color: #FEFDEF;
1661 border: 1pt solid #B8AE9C;
1669 /* cleans up glossary question mark line spacing*/
1671 border: 1pt solid #B8AE9C;
1672 vertical-align:bottom;
1676 /* jQuery tooltip styles */
1680 border:3px solid #111;
1681 background-color:#eeeeee;
1684 #tooltip h3,#tooltip div{
1688 /* style for home page modules "detail view" */
1714 background-image:url(images/details_r.png);
1715 background-position: top right;
1716 background-repeat:no-repeat;
1722 background-image:url(images/details_l.png);
1723 background-position: top left;
1724 background-repeat:no-repeat;
1730 background-image:url(images/details_ir.png);
1731 background-position: top right;
1732 background-repeat:no-repeat;
1737 background-image:url(images/details_il.png);
1738 background-position: top left;
1739 background-repeat:no-repeat;
1750 .draggable_selected {
1751 background-color: lightgrey;
1758 border:1px solid #cccccc;
1761 list-style: disc url(../../images/folder.gif) outside;
1762 font-family: Helvetica,sans-serif;
1768 li.folders .disabled {
1773 list-style-image:none;
1774 list-style-position:outside;
1775 list-style-type:none;
1781 /* hiding/showing results-display */
1784 div#results-display{
1793 ul#topnavlist>li:hover, ul#topnavlist>li:hover a, ul#topnavlist>li:active, ul#topnavlist>li:active a, ul#topnavlist>li:focus,
1794 ul#topnavlist>li:focus a {
1796 background: url(../images/themes/iphone/listmenu_loader.gif) no-repeat 97% center,
1797 -webkit-gradient(linear, left top, left bottom, from(#4a94f4), to(#236de5));
1800 ul#topnavlist li a {
1802 text-decoration: none;
1807 border: #cccccc 1px solid;
1808 -webkit-border-radius:5px;
1809 -moz-border-radius:5px;
1815 ul#subnavlist li a:hover, ul#subnavlist li a:focus, ul#subnavlist li a.active{
1820 ul#subnavlist li a, ul#subnavlist li a:visited {
1825 /* list attributes */
1835 /*border: 1px solid #e0e0e0;*/
1836 background-color: #e6e6e6;
1840 background: url(../images/themes/iphone/listmenu_loader.gif) no-repeat 97% center,
1841 -webkit-gradient(linear, left top, left bottom, from(#4a94f4), to(#236de5));
1844 ol#tools>li:hover a{
1851 #content-contentwrapper{
1862 margin-left: 0.313em;
1863 margin-top:-0.625em;
1880 /* ATutor Social Styles */
1882 div .profile_container {
1883 background-color:#eee;
1884 border: 1px solid #8e8e8e;
1887 margin-bottom: 0.5em;
1890 div .profile_container .top_right {
1894 dl.public-profile dd{
1897 dl.public-profile dt {
1908 div .search_form .row{
1909 background-color: #DEDEC0;
1913 background-color: #eee;
1914 border: 1px solid #aaa;
1917 background-color: #cccccc;
1924 ul.social_side_menu {
1927 ul.social_side_menu li {
1928 padding-bottom: 0.2em;
1933 border-bottom:1px solid #C1C157;
1934 padding-bottom:0.5em;
1935 margin-bottom:0.5em;
1943 div.contentbox, input-form{
1946 background-color: #ffffff;
1948 border: #A9ADB0 solid 1px;
1949 -webkit-border-radius: 5px;
1950 -moz-border-radius:5px;
1955 border:1px solid #a50707;
1956 margin-left:0.625em;
1963 ul.social_inline_menu{
1964 background-color: #eeeeee;
1965 border:thin #cccccc solid;
1979 /*mobile FSS override */
1980 .fl-theme-iphone [class*="fl-list"]:not(.fl-list):not(.fl-grid) a:hover,
1981 .fl-theme-iphone [class*="fl-list"]:not(.fl-list):not(.fl-grid) a:focus,
1982 .fl-theme-iphone [class*="fl-list"]:not(.fl-list):not(.fl-grid) a:active {
1984 background: url(../images/themes/iphone/listmenu_loader.gif) no-repeat 97% center,
1985 -webkit-gradient(linear, left top, left bottom, from(#4a94f4), to(#236de5));
1988 ul#subnavlist li a:focus, ul#subnavlist li a:active, ul#subnavlist li a:hover{
1994 /************************************************************************************************/
1995 /*Adds arrows to Fluid Tabs. Here is a good guide for creating triangles with CSS:
1996 http://jonrohan.me/guide/css/creating-triangles-in-css/ */
1997 /************************************************************************************************/
2001 ul.sequence-links li {
2007 ul.sequence-links li.back a:link, ul.sequence-links li.back a:visited {
2009 padding-left:0.438em;
2013 ul.sequence-links li.forward a:link, ul.sequence-links li.forward a:visited {
2015 padding-right:0.313em;
2019 ul.sequence-links li a:hover, ul.sequence-links li a:focus, ul.sequence-links li a:active,
2020 ul.sequence-links li.back a:hover, ul.sequence-links li.back a:focus, ul.sequence-links li.back a:active,
2021 ul.sequence-links li.forward a:hover, ul.sequence-links li.forward a:focus, ul.sequence-links li.forward a:active {
2023 background:transparent;
2027 ul.sequence-links li:before, ul.sequence-links li:after, ul.sequence-links li a:before, ul.sequence-links li a:after {
2034 ul.sequence-links li a:before, ul.sequence-links li a:after {
2038 ul.sequence-links li a:hover:before, ul.sequence-links li a:focus:before, ul.sequence-links li a:active:before {
2041 /*arrow that points to the left, beside the "Previous" text */
2042 .arrow.back a:after {/*arrow pointing to the left*/
2043 background: none repeat scroll 0% 0% transparent;
2044 border-color: transparent #005689;
2046 border-style: solid;
2047 border-width: 5px 0pt 5px 6px;
2049 margin-top: -0.39em;
2052 /*left and right triangle icons change color*/
2053 .arrow a:hover:after, .arrow a:focus:after, .arrow a:active:after, .arrow.forward a:hover:after, .arrow.forward a:focus:after, .arrow.forward a:active:after{
2054 border-color: transparent #4c96f4;
2057 .arrow.back a:after {
2058 border-width: 6px 6px 6px 0pt;
2064 /*arrow that points to the right, beside the "Next" text */
2065 .arrow.forward a:after {
2066 background: none repeat scroll 0% 0% transparent;
2067 border-color: transparent #FFFFFF;
2068 border-style: solid;
2069 margin-top: -0.425em;
2070 margin-top: -0.313em;
2073 .arrow.forward a:after {
2075 background: none repeat scroll 0% 0% transparent;
2076 border-color: transparent transparent transparent #005689;
2078 border-style: solid;
2094 border-left: #A9ADB0 1px solid;
2095 border-right: #A9ADB0 1px solid;
2096 border-bottom: #A9ADB0 1px solid;
2097 -webkit-border-radius: 5px;
2098 -moz-border-radius: 5px;
2108 /*hiding and showing content */
2110 #results-hide-show-simple-content{
2111 -webkit-border-radius:5px;
2112 -moz-border-radius:5px;
2114 border: 1px #A9ADB0 solid;
2116 padding-bottom: .6em;
2117 padding-right: .2em;
2119 margin-bottom: 0.875em;
2120 margin-top: 0.875em;
2122 background-color: none;
2124 #results-hide-show-link{
2127 text-decoration: none;
2134 background-image:url("images/up.png");
2135 background-position: 100% 100%;
2136 background-repeat: no-repeat;
2140 background-image:url("images/down.png");
2141 background-position: 100% 100%;
2142 background-repeat: no-repeat;
2145 background-color: #F7F3ED;
2146 -webkit-border-radius:8px;
2147 -moz-border-radius:8px;
2149 border: 1px #A9ADB0 solid;
2153 .hide-show-container-surround a:active, .hide-show-container-surround a:focus, .hide-show-container-surround a:hover{
2154 background-color: transparent;
2157 .subnavcontain2, .subnavcontain{
2159 background-color: white;
2160 border: #A9ADB0 1px solid;
2161 -webkit-border-radius:8px;
2162 -moz-border-radius:8px;
2167 /* .fl-theme-iphone .subnavcontain a:hover, .fl-theme-iphone .subnavcontain a:active, .fl-theme-iphone .subnavcontain a:focus*/
2168 .fl-theme-iphone .subnavcontain a {
2169 text-decoration: none;
2172 .fl-theme-iphone .subnavcontain-active{
2174 text-decoration: none;
2178 background-color: #4c96f4;
2179 background-image: -webkit-gradient(linear, left top, left bottom, from(#4a94f4), to(#236de5));
2180 border: #A9ADB0 1px solid;
2181 -webkit-border-radius:8px;
2182 -moz-border-radius:8px;
2190 #page-title-back-to-page{
2191 display: inline-block;
2195 .page-title, #back-to-page{
2199 .fl-theme-iphone #subnavlist-link a:active,
2200 .fl-theme-iphone #subnavlist-link a:hover,
2201 .fl-theme-iphone #subnavlist-link a:focus{
2202 background-color: none;
2204 .fl-theme-iphone .subnavcontain{
2209 display: inline-block;
2214 border-right: #A9ADB0 1px solid;
2217 .rectangle2:last-child{
2222 text-decoration: none;
2233 #content_link_phone a:active, #content_link_phone a:focus, #content_link_phone a:hover{
2235 background-color: white;
2237 /* style for "last modified" information of course content*/
2242 ul.my-courses-list-ul > li:hover{
2243 background-color: #4c96f4;
2247 ul.my-courses-list-ul > li:hover a{
2249 text-decoration: none;
2252 /* to be created as a separate desktop theme file. The classes below should be removed when
2253 Mark McLaren's port of mobile fss to firefox is committed to infusion:
2254 https://github.com/fluid-project/infusion/blob/25ad6755ef78347b414d60bd4037a0f197f9d09d/infusion-branch/src/webapp/framework/fss/css/fss-mobile-theme-firefox.css */
2255 .fl-tabs li:first-child {
2256 border-bottom-left-radius: 5px;
2257 border-top-left-radius: 5px;
2260 .fl-theme-iphone .fl-tabs li {
2261 -moz-border-image: url("images/navbar_normal_button_insetShadow.png") 5 5 5 5 stretch;
2262 background-color: #354D68;
2264 [class*="fl-container"] [class*="fl-list"] > li:first-child, [class*="fl-container"] [class*="fl-list"] > li:first-child a {
2265 border-top-left-radius: 8px;
2266 border-top-right-radius: 8px;
2268 [class*="fl-container"] [class*="fl-list"] > li:last-child, [class*="fl-container"] [class*="fl-list"] > li:last-child a {
2269 border-bottom-left-radius: 8px;
2270 border-bottom-right-radius: 8px;
2273 .fl-theme-iphone .fl-tabs .fl-tabs-active {
2274 background-image: -moz-linear-gradient(
2276 rgba(149, 184, 239,1),
2278 rgba(149, 184, 239,1) 50%,
2279 rgba(75,148,244,1) 50%
2283 /* A simulation for a:active on the device, requires JS */
2284 /* since .fl-list is for mixed material lists, dont include them in these effects */
2285 .fl-theme-iphone [class*=fl-list]:not(.fl-list):not(.fl-grid) a:active,
2286 .fl-theme-iphone [class*=fl-list]:not(.fl-list):not(.fl-grid) a.fl-link-hilight {
2287 background: url(../images/themes/iphone/listmenu_arrow.png) no-repeat right -25px,
2288 -moz-linear-gradient(#4a94f4, #236de5);