/* Import of icons */ @import url("icons.css"); @import url("icons-codes.css"); /** BASE CSS STARTS HERE **/ /* general start */ /* general : tags start */ /* wow - nasty knock ons - remove for now * { word-wrap: break-word; } */ body { background: url(../images/newui/background-tile.jpg) #EEEEEE; color: #333333; font-size: 75%; margin: 0; padding: 0; height: 100%; line-height: 1.25; min-width: 320px; } ul {list-style-type: disc;} ol {list-style-type: decimal;} ul, ol {list-style-position: outside;margin-left: 1em;padding-left: 1em;padding-top: 0.25em;padding-bottom: 0.25em;} td {vertical-align: top;padding: 0;} img {border: 0px; max-width: 100%; } p {padding: 0 0 0.72em 0; margin: 0; } h1 {font-size: 1.5em; padding: 0.67em 0; margin: 0; } h2 {font-size: 1.4em; padding: 0.5em 0 0.4em 0; margin: 0; line-height: 1.3em; } h3 {font-size: 1.1em; padding: 0.3em 0; margin: 0; } h4 {padding: 0.3em 0; margin: 0; font-weight: normal; } hr {margin: 1.5em 0;} /* general : tags end */ /* general : classes start */ .fleft{float:left;} .fright{float:right;} .cleft{clear:left;} .clear, .clearspinner{clear:both;} .vspace{clear:both;height: 1em;} .vspace2{clear:both;height: 3.5em;} .inline{display:inline;} .inline-block{display:inline-block;} .clrspan{clear:both;display:block;} .centre {text-align:center} .breakword { /* Warning: Needed for oldIE support, but words are broken up letter-by-letter */ -ms-word-break: break-all; word-break: break-all; /* Non standard for webkit */ word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } .single_line_truncate {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} .subtle_paragraph {color: #999999;} .capitalise {text-transform: uppercase;} .dont_capitalise {text-transform: none;} /* general : classes end */ /* general end */ /* main menu start */ #main_menu:not(.admin_menu) { margin-top:40px; position: relative; } /* NB the position relative came from i2web branch of old code - so remove if causes issues - AJ */ #main_menu ul { list-style: none; padding: 0; margin: 0; box-shadow: 0 3px 5px #BBB; -moz-box-shadow: 0 3px 5px #BBB; -webkit-box-shadow: 0 3px 5px #BBB; } /* use lighter shadow for light background / dark text */ body.cs_menu_icon_dark #main_menu ul { box-shadow: 0 3px 5px #CBCBCB; -moz-box-shadow: 0 3px 5px #CBCBCB; -webkit-box-shadow: 0 3px 5px #CBCBCB; } #main_menu ul li { float: left; display: block; line-height: 80px; text-align: center; min-width: 124px; } .ie6 #main_menu ul li { width: 124px; } #main_menu ul li a{ display: block; height: 80px; padding: 0 1.6em; text-decoration: none; border: 1px #fff ; border-style: none solid none none; border-color: rgba(255,255,255,0.25); font-size: 1.2em; } body.cs_menu_icon_dark #main_menu ul li a { border-color: rgba(255,255,255,0.45); } .ie6 #main_menu ul li a { display: inline-block; width: 122px; } #main_menu.single_row ul li a, #main_menu.single_row ul li span { border-top:none; border-bottom:none; } /* #main_menu ul li.last_in_row a { border-right: none; } */ #main_menu ul li.first_in_row { clear:left; } #main_menu a#reduce_main_menu_button { position: absolute; right: 10px; } #main_menu a#hide_main_menu_button { position: absolute; right: 15px; } a#extend_main_menu_button { display: block; padding-top: 1.7em; margin-top: 1.7em; margin-right: 2%; position: absolute; right: 0; bottom: -1em; } html.no-js .menucontrol { display: none; } /* below was part of custom css - but only 2 options so can be driven by body class */ .cs_text_shadow_light_dark { text-shadow: 1px 1px 2px #333333; } body.cs_menu_icon_dark .cs_text_shadow_light_dark { text-shadow: 1px 1px 1px #FFFFFF; } /* main menu end */ /* .admin_menu start */ /* .admin_menu - hide opener / closer */ #main_menu.admin_menu ul li#show_full_menu, #main_menu.admin_menu ul li#hide_full_menu { display: none; } /* .admin_menu - remove box shadow from standard menu */ #main_menu.admin_menu ul, body.cs_menu_icon_dark #main_menu.admin_menu ul { box-shadow: none; border: 1px solid #D4D4D4; } /* .admin_menu - reduce height */ #main_menu.admin_menu ul li { line-height: 80px; min-width: 0; font-size: 1.4em; } #main_menu.admin_menu ul li a { height: 80px; padding: 0 15px; text-shadow: none;} /* .admin_menu - link colour */ #main_menu.admin_menu ul li a, #main_menu.admin_menu ul li a:link, #main_menu.admin_menu ul li a:visited { color: #777777; } #main_menu.admin_menu ul li a:hover, #main_menu.admin_menu ul li a:focus, #main_menu.admin_menu ul li a:active { color: #333333; } /* remove selected background */ #main_menu.admin_menu ul li a.active { background: none; } /* sub menu specific */ #sub_menu.admin_menu ul { border-bottom: 1px solid #D4D4D4; } /* .admin_menu - sub menu reduce height */ #sub_menu.admin_menu ul li { line-height: 20px; float: left; display: block; } #sub_menu ul li a { display: block; padding: 3px 15px; height: 20px; text-decoration: none; font-size: 1em; text-shadow: 0 1px 0 #FFFFFF; } /* .admin_menu - sub menu - link colour */ #sub_menu.admin_menu ul li a, #sub_menu.admin_menu ul li a:link, #sub_menu.admin_menu ul li a:visited { color: #777777; } #sub_menu.admin_menu ul li a:hover, #sub_menu.admin_menu ul li a:focus, #sub_menu.admin_menu ul li a:active { color: #333333; } /* .admin_menu end */ /** CORE CSS STARTS HERE **/ /* page structure start */ #container { width: 100%; margin-left: 0%; margin-right: 0%; background: url(../images/newui/background-gradient.jpg) scroll repeat-x top left transparent; } #inner_container { width: 100%; margin-left: 0%; margin-right: 0%; } #content { margin-left: 20px; margin-right: 20px; } #content_inner { margin-left: auto; margin-right: auto; } /* removed max-width: 1400px; */ .functions { float:right; } /* hmm smacks of widget .functions */ /* page structure end */ /* tag filter start */ .active_filter { margin-top:20px; font-size:1.2em; background: #D2D2D2; padding: 10px 7px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; } .filter .remove_text { margin-right:20px; float:left; color:#333; } .filter .remove_cross { width:16px; height:16px; background-image: url(../images/newui/sprite.png); background-position: -1500px -690px; float:right; } .filter_black_arrow { width:16px; height:16px; background-image: url(../images/newui/sprite.png); background-position: -1000px -40px; float:left; } .message_flash { margin-right: 2%; clear:both} /* In IE6, this div creates an odd looking blue block at the top of the page */ .ie6 #tag_filter { display: none; } /* tag filter end */ /* breadcrum start */ #breadcrumb { padding: 0.2em 0; margin: 5px 0 0 0; font-size: 1.1em; } #breadcrumb a { display: block; float: left; font-weight: bold; text-decoration: none; } #breadcrumb .seperator { display: block; float: left; width: 20px; height: 15px; text-indent: -500px; background: url(../images/arrow.gif) no-repeat center center; } /* breadcrum end */ /* ticker start */ #tickertext { background: #003668; color: white; margin-bottom: 20px; padding: 0 0 5px 0; } #tickertext p { background: url(../images/arrow-white.gif) 0 10px no-repeat; padding: 10px 10px 5px 14px; } #tickertext p strong { font-weight: normal; } #tickertext p a { color: white; text-decoration: underline; } /* ticker end */ /* footer start */ #footer { width: 98%; padding: 1%; background:#FFFFFF; display:block; } #footer #footnav { padding:0; margin:0; float:left; clear: none; width:50%; } #footer #footnav li { display:block ; float: left; line-height: 12px; list-style-type: none; padding: 0 20px 8px; position:relative} /* now fontello #footer #footnav li span.ico{ top:0;left:0;width: 11px; height: 13px; position:absolute; display:block ; background-image: url("../images/newui/sprite.png"); background-repeat: no-repeat; background-position:-1000px -120px; } */ #footer #footnav li a { text-decoration:none } #footer div.powered_by { padding:0; margin:0; float: right; clear: none; text-align: right; width: 50%; } /* contents of powerwed by */ #footer div.powered_by .product_logo, #footer div.powered_by .pi_logo { max-width: 25%; } #footer div.powered_by .product_logo { margin-top: -5px; } #footer div.powered_by .pi_logo { margin-top: -11px; } #foot_innovation_by,#super_footer_innovation_by,#newstyle_admin_foot_innovation_by { max-width: 48%; display: inline-block; margin: 0 1% 0 1%; color: #777777; line-height: 48px; } .ie6 #footer div.powered_by #foot_innovation_by { display: block; } .ie7 #footer div.powered_by #foot_innovation_by { display: inline; } /* footer end */ /* generic form css start */ form { padding: 0 0 0 0; } form fieldset { margin: 0 0 1em 0; padding: 0; border: none; } form legend { font-weight: bold; margin: 0; padding: 0.5em 0 0.5em 5px; color:inherit;} .adaptation_enhanced_help form fieldset legend { background: none repeat scroll 0 0 #6D6E71; border: 1px solid #6D6E71; color: white; float: left; height: 5px; display:block; } /*form fieldset label, form fieldset .label { display: block; float: left; width: 120px; padding-top:.5em; padding-right:.5em;}*/ /*form fieldset input[type="text"], form fieldset input[type="password"], form fieldset .input {width: 250px; background-color: #ffffff; border: 1px solid #cccccc; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); display: inline-block; margin-bottom: 0; vertical-align: middle; font-size:inherit; display: inline-block; height: 1.7em; padding: 4px 6px; margin-bottom: 10px; line-height: 1.7em; color: inherit; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; vertical-align: middle;}*/ form input.input-medium {width:190px;} form input.input-small {width:100px;} .form-controls {text-align:left; padding:1.5em 1em 2em 0; margin-left: 33%;} .formfield .label, .formfield label { float:left; width:35%; font-weight:bold; text-align:right; margin:10px 10px 0 0; color:inherit; } .controls .label, .controls label { clear:left; float:none; text-align:left; width:auto; font-weight:normal; margin: 5px; } .formfield .label .req, .formfield label .req { font-size:.8em; display:block; color:#666; } .formfield .formcontrols { background:none; } .formfield .controls { margin-left:35%; padding:3px 0; } .formfield .controls input[type="file"], .formfield .controls input[type="text"], .formfield .controls input[type="password"] { background-color: #ffffff; border: 1px solid #cccccc; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-transition: border linear .2s, box-shadow linear .2s; -moz-transition: border linear .2s, box-shadow linear .2s; -o-transition: border linear .2s, box-shadow linear .2s; transition: border linear .2s, box-shadow linear .2s; height: 20px; padding: 4px 6px; border-radius: 4px; font-family:inherit; color:inherit; float:left; } form .editable { display: block; clear: both; background: #f1f1f1; padding: 0.7em 10px; min-width: 200px; margin-bottom: 3px; border-radius:5px;} form fieldset input, form fieldset select { display: block; } form fieldset .checkbox { display: block; clear: both; padding: 0 0 4px 0; } form fieldset .checkbox input { width: auto; } form fieldset .checkbox label { padding-top: 1px; float: left; font-weight: normal; } form .formbottom { padding: 0.5em 0; } form .formbottom input, form .formbottom .input { width: auto; float: right; font: 1em Arial, Helvetica sans-serif; } /* font should probably go from this !! */ form .formelement { float: left; background: #EEEEEE; padding: 0.5em 0; } form .linked_identity { display: block; clear: both; background: #EEEEEE; padding: 0.5em 10px; border-bottom: 2px solid white; min-width: 200px; margin-bottom: 1em; } form .linked_identity .identity { float:left; min-width: 300px;} form .linked_identity .info_popup { float:left; } /* generic form css end */ /* join page summary - small responsive block at bottom - max-width 768 */ .join-summary { padding: 0 10px 10px 20px; } .join-summary h3 {font-size:1.3em;} .pi_widget .join-summary p {max-width:800px; padding:20px;} .columns { min-height: 500px;} .columns div.col-one {width:100%;float:left;} .columns div.col-half {width:50%;float:left;} .columns div.col-third {width:33%;float:left;} .columns div.col-2thirds {width:66%;float:left;} .columns div .col-inner {margin-right:20px;} .columns div:first-child .col-inner {margin-left:20px;} /* dunno ? maybe my profile maybe image widget? start */ #my_image_paragraph_1 { margin: 200px 0px 0px 0px; background-color: black; filter: alpha(opacity=50); opacity: 0.5; } #my_image_paragraph_1 p { margin: 0 7px; padding: 5px 0 10px 0; color: white; } #my_image_paragraph_1 a, #my_image_paragraph_1 h1, #my_image_paragraph_1 h2, #my_image_paragraph_1 h3, #my_image_paragraph_1 h4, #my_image_paragraph_1 h5 { color: white; } .ie6 #my_image_paragraph_1 { background-color: #555555; } #my_image_1 { background: url(/images/test-image.jpg) no-repeat top left; } /* test image ?? wtf ?? */ /* dunno ? maybe my profile maybe image widget? end */ /* calendar css start - should this be in widget css ?? */ .calendar_nav { text-align: center; padding: 1% 2%; font-size: 1.05em; background: #B7DCEB; } .calendar_nav .next, .calendar_nav .previous { display: block; width: 16px; height: 16px; background: url(../images/cal.png) no-repeat; } .ie6 .calendar_nav .next, .ie6 .calendar_nav .previous { background-image: url(../images/cal.gif); } .calendar_nav .next { background-position: -16px -300px; float: right; } .calendar_nav .next:hover { background-position: -16px -316px; } .calendar_nav .previous { background-position: 0px -300px; float: left; } .calendar_nav .previous:hover { background-position: 0px -316px; } .calendar_nav strong { line-height: 1.6em; } table.cal_table { border: 1px solid #B7DCEB; margin: 2px 0 0 0; border-collapse: collapse; width: 100%; } table.cal_table thead { background: #B7DCEB; } table.cal_table thead th { text-align: center; padding: 0 0 1px 0; font-size: 0.9em; } table.cal_table tbody td { border: 1px solid #B0BAC8; width: 14%; background: #F4F5F7; } table.cal_table tbody td span { display: block; background: #F4F5F7; font-size: 1.1em; padding: 2px 3px; font-weight: bold; text-align: center; color: #494949; } table.cal_table tbody td span a { display: block; color: white; } table.cal_table tbody .events { background-color: #25AAE1; } table.cal_table tbody .events span { background: #25AAE1 url(../images/cal.png) left 0px repeat-x; color: white; } table.cal_table tbody .today { background-color: #E1E2E6; } table.cal_table tbody .today span { background: #E1E2E6 url(../images/cal.png) left -100px repeat-x; } table.cal_table tbody .today span a { color: #333333; } table.cal_table tbody .events.today { background-color: #25AAE1; } table.cal_table tbody .events.today span { background-color: #25AAE1; } table.cal_table tbody .inactive { background-color: #C9E6F3; } table.cal_table tbody .inactive span { background: #C9E6F3 url(../images/cal.png) left -200px repeat-x; color: #999999; } .ie6 table.cal_table tbody td.events { background: #C9C9C9; } .ie6 table.cal_table tbody td.today { background: #C9C9C9; } .ie6 table.cal_table tbody td.inactive { background: #C9C9C9; } .ie6 table.cal_table tbody td span, .ie6 table.cal_table tbody td span a { color: #333333; } .ie6 table.cal_table tbody td.events span, .ie6 table.cal_table tbody td.events span a { color: #333333; } .ie6 table.cal_table tbody td.inactive span, .ie6 table.cal_table tbody td.inactive span a { color: #999999; } .ie6 table.cal_table tbody td.today span, .ie6 table.cal_table tbody td.events span, .ie6 table.cal_table tbody td.inactive span { background-image: url(../images/cal.gif); } /* calendar css end */ /* tab menu */ .tab-content > div {display:none; margin:0 10px;} .widget_tab_menu.standalone { margin:0 10px; } .widget_tab_menu.standalone ul { border-bottom:2px solid #ddd; } .widget_tab_menu.standalone ul li a, .widget_tab_menu.standalone ul li:first-child a { background:#ddd; border-radius:5px 5px 0 0; border:none; margin:6px 3px 0 3px; padding:11px 20px 11px 20px; border-bottom:2px solid #ddd; margin-bottom:-2px; font-size: 1.1em; } .widget_tab_menu.standalone ul li a:hover { background:#e7e7e7; } .widget_tab_menu.standalone ul li a.active, .widget_tab_menu.standalone ul li a.active:hover { background:#fff; border-radius:5px 5px 0 0; border:2px solid #ddd; border-bottom:none; } .widget_tab_menu.standalone ul li .icon { } /* large calendar start */ table.cal_table.large_cal { font-size: 1em; } table.cal_table.large_cal tbody td span { padding: 10px 0; } table.cal_table.large_cal tbody td b.event { display: block; clear: both; font-size: 0.9em; color: white; padding: 0 0 3px 0; text-align: left; border-top: 1px solid #CCCCCC; margin: 0 3px; } .ie6 table.cal_table.large_cal tbody td b.event { color: #333333; } table.cal_table.large_cal tbody td b.details { padding: 0 5px 6px 20px; color: white; font-size: 0.9em; font-weight: normal; } table.cal_table.large_cal tbody td b.details a { text-decoration: underline; color: white; font-weight: normal; } table.cal_table.large_cal tbody td .hide, table.cal_table.large_cal tbody td .show { display: block; width: 16px; height: 16px; background: url(../images/cal.png) no-repeat; float: left; margin: 0 2px 0 0; cursor: pointer; } .ie6 table.cal_table.large_cal tbody td .hide, .ie6 table.cal_table.large_cal tbody td .show { background-image: url(../images/cal.gif); } table.cal_table.large_cal tbody td .show { background-position: -32px -300px; } table.cal_table.large_cal tbody td .show:hover { background-position: -32px -316px; } table.cal_table.large_cal tbody td .hide { background-position: -48px -300px; } table.cal_table.large_cal tbody td .hide:hover { background-position: -48px -316px; } /* large calendar end */ /* bubble css start - not sure if help bubble or user bubble ? */ .bubble_anchor { position: relative; } .bubble { visibility: hidden; position: absolute; top: 0; left: -50px; } .ie6 .bubble { width: 170px; height: auto; overflow: hidden; margin-left: -10px; } .bubble ul { padding: 0 10px 3px 10px; margin: 0 0 0 10px; } .ie6 .bubble ul { padding: 0 0 0 10px; } .bubble ul li { white-space: nowrap; } .ie6 .bubble ul li { width: 134px; overflow-x: hidden; } .bubble .topleft { height: 6px; margin-right: 15px; background: url(../images/cal.png) 0px -400px no-repeat; } .ie6 .bubble .topleft { margin-right: 12px; overflow: hidden; background-image: url(../images/cal.gif); } .bubble .topright { width: 15px; height: 6px; float: right; background: url(../images/cal.png) right -400px no-repeat; } .ie6 .bubble .topright { margin-left: -3px; overflow: hidden; background-image: url(../images/cal.gif); } .bubble .middleleft { margin-right: 15px; background: url(../images/cal.png) 0px -406px no-repeat; overflow: hidden; } .ie6 .bubble .middleleft { background-image: url(../images/cal.gif); } .bubble .middleright { background: url(../images/cal.png) right -406px no-repeat; overflow: hidden; min-width: 110px; max-width: 300px; max-height: 170px; } .ie6 .bubble .middleright { background-image: url(../images/cal.gif); } .bubble .bottomleft { height: 20px; margin-right: 15px; background: url(../images/cal.png) 0px -580px no-repeat; } .ie6 .bubble .bottomleft { margin-right: 12px; background-image: url(../images/cal.gif); } .bubble .bottomright { width: 15px; height: 20px; float: right; background: url(../images/cal.png) right -580px no-repeat; } .ie6 .bubble .bottomright { margin-left: -3px; background-image: url(../images/cal.gif); } /* bubble css end */ /* taxonomy [?] start */ .taxonomy_tag { background-color: #D2F1FC; width: 150px; border: 1px solid #CCCCCC; } li.hover { border: 1px solid #cccccc; } /* way to generuc a rule ! */ #tax_col1 { width: 49%; float: left; border: 1px solid #CCCCCC; } #tax_col2 { width: 49%; float: left; border: 1px solid #CCCCCC; } #tax_col1 ul { clear: left; } /* taxonomy [?] end */ /* smells like admin start */ #widgets_not_in_use .widget_item { float: left; background-color: #D2F1FC; width: 150px; border: 1px solid #CCCCCC; margin-left: 20px; margin-right: 20px; } .widget_item, .header_nav_item, .footer_nav_item { background-color: #D2F1FC; width: 150px; } ul#col1_widgets, ul#col2_widgets, ul#col3_widgets { min-height: 20px; border: 5px solid #CCCCCC; width: 152px; margin-left: 0; padding: 0; list-style: none; min-height: 30px; } div#widgets_not_in_use { min-height: 30px; border: 1px solid #CCCCCC; position: relative; margin-bottom: 10px; overflow: hidden; display: inline-block; } div#widgets_not_in_use { display: block; } ul#widgets_not_in_use, ul#header_nav_list_use, ul#header_nav_list_nuse, ul#footer_nav_list_use, ul#footer_nav_list_nuse { margin-left: 0; padding: 0; list-style: none; min-height: 30px; } .combined_admin_page_widget_layout #row_1, .combined_admin_page_widget_layout #row_2 { border: 1px solid #CCCCCC; clear: left; } .combined_admin_page_widget_layout #row_1 .float, .combined_admin_page_widget_layout #row_2 .float { float: left; margin-left: 20px; } .combined_admin_page_widget_layout #column_1 { clear: left; float: left; margin-left: 20px; } .combined_admin_page_widget_layout #column_2, .combined_admin_page_widget_layout #column_3 { float: left; margin-left: 20px; } .combined_admin_page_widget_layout #widgets_not_in_use { min-height: 30px; } .combined_admin_page_widget_layout h3 { margin-top: 5px; } #col_2 h3, #col_2 p { clear: none; } /*scary suspect this should only be for admin but will have knockon everywhere ! */ .combined_admin_widget_add h3, .combined_admin_widget_add p { clear: left; } #addadbsource { clear: left; } .admin_form_container { margin: 0 auto 15px 30px; } .ds_left { width:35%; float:left; border-right: 2px solid #DAE7EC;} .ds_middle { float:left; width:48%; margin-left:2em; margin-right:2em; height:100%; } .right { float:right; list-style:none; } .right_link_actions{ list-style:none; clear:right; } .right h3{ } /**** USER PROFILES ****/ .method_manage_my_details .pi_widget .pi_widget_title h2 .widget_icon { background: url("/core/public/images/newui/sprite.png") no-repeat scroll -360px -160px transparent; display: block; float: left; height: 32px; width: 32px; } /* and dark one */ body.cs_menu_icon_dark .method_manage_my_details .pi_widget .pi_widget_title h2 .widget_icon { background-position: -360px -120px; } .pi_widget_menu {background: #DDDDDD; font-size: 1.1em; margin: 0 0 2px; padding: 0;} .pi_widget_menu .tabbed_items{list-style: none; margin: 0; padding: 5px 0 0 5px; height: 27px;} .pi_widget_menu .tab_item{float: left; display: block; height: 27px;} .pi_widget_menu .tab_item a{padding: 0 15px; margin: 0; display: block; height: 27px; line-height: 30px; text-decoration: none; font-weight: bold;} .pi_widget_menu .tab_item.active{background: url(/core/public/images/user_profiles/tab-right.png) no-repeat right top transparent;} .ie6 .pi_widget_menu .tab_item.active{background-image: url(/core/public/images/user_profiles/tab-right.gif);} .pi_widget_menu .tab_item.active a{color: #000;padding:0 11px 0 15px; margin: 0 11px 0;background: url(/core/public/images/user_profiles/tab-left.png) no-repeat left top transparent;} .ie6 .pi_widget_menu .tab_item.active a{background-image: url(/core/public/images/user_profiles/tab-left.gif);} a.has-bubble { position:relative; z-index:24; color:#3CA3FF; font-weight:bold; text-decoration:none; } a.has-bubble span { display: none; } a.has-bubble:hover span.tooltip { margin:10px; position: relative; padding: 10px 0 0 10px; bottom: 0; background: url('/core/public/images/balloon.gif') no-repeat bottom left; text-align: left; } a.has-bubble:hover span { display: block; } a.has-bubble:hover span.bubble-middle { position: relative; bottom:25px; } /* different middle bg for stretch */ body #skip_nav{ display:none; padding-top: 40px; } body #skip_nav .overlay_adaptation { margin-top: 40px; height: 75%;} #widget_list_nav { position: relative; } .adaptation_skip_links #skip_nav{ display:block; position: relative; } .adaptation_skip_links #heading_nav_heading{ display:block; } .adaptation_skip_links #heading_nav{ display:block; } .adaptation_skip_links #skip_nav li { list-style: none outside none;} .adaptation_skip_links #heading_nav li { list-style: none outside none;} #heading_nav_heading{ display:none; } #heading_nav{ display:none; } .fb-like-box{ margin-left:10px; } .combined_portal_hidden { margin-left: 2%; margin-right: 2%; } .dir_admin_cms input.editable_text, .div_admin_cms div.editable_text, .dir_admin_cms .admin_field .field_edit div.editable_text {min-height:1.35em;background:#d9d9d9 !important; border: solid 1px #c7cbd4; padding:.2em} .dir_admin_cms div.editable_text:hover, .dir_admin_cms input.editable_text:hover, .dir_admin_cms .admin_field .field_edit div.editable_text:hover {background:#d9d9d9 !important; border-color: #fff #7b7e85 #7b7e85 #fff} #view_profile_profile_image {max-width: 200px;float:left;margin:20px} .view_profile ul{max-width: 1600px;margin-left:0;padding:0;display: table;} .pi_widget .pi_widget_body.view_profile ul li.item{display: table-cell;max-width: 500px;min-width: 300px; border:none;width: 40%; padding:0;margin: 0.5em 0.5em 0.5em 0; float:left; list-style: none} .view_profile_key,.view_profile_value {padding: 3px 3px 0px 7px; color:#333; float: left;display: block;} .view_profile_key {width: 30%; } .view_profile_key,.detail_key {height:20px; font-weight:normal; background:#eee;color:#333; border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;} .detail_key { margin-right: 6px; padding: 4px 8px; } .view_profile_value {width: 60%} h2.screenname {font-weight:normal; font-size:1.2em;padding-top:20px;} hr.profile_separator {box-shadow: 0 3px 3px #BBBBBB;-moz-box-shadow: 0 3px 3px #BBBBBB;-webkit-box-shadow: 0 3px 3px #BBBBBB; height: 2px; margin-bottom: 20px; margin-right: 20px; } /* hmmmm - why is this here and not with the rest of clear fix ??? */ /* get rid of silly spare line at end of page !!!! .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } **/ .clearfix:after { content: ""; display: block; height: 0; clear: both; visibility: hidden; } .clearleft {clear:left;} /* html validation fixes show none */ .display_none { display:none; } form.inplaceeditor2-form { display: inline; } /*CSS popup info windows*/ .info_popup { background: url(../images/newui/sprite.png) -360px -520px; position:relative; width: 32px; height: 32px; } .ie6 .info_popup { background: url(../images/icon-info.gif) no-repeat 0 0; } .info_popup div { display: none; background: url("/core/public/images/balloon.gif") no-repeat scroll 0 bottom transparent; max-height: 70px; width: 235px; position: absolute; right: -105px; bottom: 26px; padding: 5px 0 54px 0; } .info_popup div span { padding: 0 14px 0 8px; display: block; } .info_popup div h4 { display:none; background: url("/core/public/images/balloon.gif") no-repeat scroll 0 top transparent; position:absolute; top:-8px; left:0; height: 8px; width: 235px; padding:0; margin:0; } .info_popup div h4 i {font-size:0;text-indent:-9999px} .info_popup:hover div, .info_popup:hover h4{ display:block; } .hide-text { text-indent: 100%; white-space: nowrap; overflow: hidden; } #content .form_switch { width: 100px; height: 1em; position: relative; display: block; float: right; } #content .form_switch .ico { width: 18px; height: 18px; border-radius: 12px; -webkit-border-radius: 12px; -moz-border-radius: 12px; border:solid 1px #aaa; left: -8px; position: relative; float: left; margin: 0; } #content .form_switch.switched_on .ico {background:green} #content .form_switch.switched_off .ico {background:red} #content .form_switch .switch_label { font-size: 0.8em; margin: auto; text-align: center; width: auto; float: left; line-height: 20px; font-weight: normal; font-size:1.1em; } .min-width-800 { min-width: 800px; } .extra_special_button{padding: 0 2em;width:auto; border: 0 none;border-radius: 3px;height: 45px;margin: 5px; color:#fff; background: #666; font-size:1.2em;} .extra_special_button:hover {filter: brightness(120%)} #cookie_overlay_outer { position: fixed; z-index: 1001; width:100%; display: block; left: 0; bottom: 0; background-color: #333; color: #FFF; text-align: center; } #cookie_overlay_outer .cookie_overlay_inner { max-width: 900px; margin: auto; text-align: left; padding: 20px 20px 10px; } #cookie_overlay_outer .cookie_overlay_inner .cookie_text { font-size:1.3em; max-width: 550px; display: inline-block; margin-bottom: 10px; } #cookie_overlay_outer .cookie_overlay_inner form { max-width: 350px; display: inline-block; vertical-align: top; } #cookie_overlay_outer .cookie_overlay_inner form button { text-transform: uppercase; font-weight: bold; margin-top: 0; margin-bottom: 0; } /*************** share 2016 begin ***************/ /* For share started in winter 2016, as relacement for previous look and operation. Rules for share email, LinkedIn, Twitter, Facebook share, share link, and embed link, as well as video start time. */ div.share_2016 h1 { font-weight: normal; padding-bottom: 3px; padding-top: 7px; font-size: 1.2em; } div.share_2016 a:link, div.share_2016 a:visited, div.share_2016 a:active, div.share_2016 a:hover { text-decoration: none; color: black } div.share_2016 h1.head_pad, div.share_2016 .head_pad { padding-top: 18px; } div.share_2016 ul { list-style-type: none; padding-left: 0; margin-left: 0; margin-top: 0; margin-bottom: 0px; font-size: 1.0em; } div.share_2016 li { padding-bottom: 10px; } div.share_2016 .link_img { height: 22px; width: 22px; background: black; display: inline-block; margin-right: 10px; } div.share_2016 .link_text { display: inline-block; padding-top: 2px; } div.share_2016 #share_video_time { width: 28%; /*float: right;*/ } div.share_2016 #video_time_check { margin-right: 5px; } div.share_2016 #video_time { margin-right: -67px; margin-bottom: 12px; display: none; margin-top: 12px; } div.share_2016 #start_text { display: inline; } div.share_2016 #share_link_input, div.share_2016 #embed_link_text, div.share_2016 #share_link, div.share_2016 #video_time_check { cursor: pointer; } div.share_2016 #fb_a { padding: 6px 6px 9px 6px; height: 5px; line-height: 9px; } div.share_2016 .faked_fb_share a { padding: 0 6px; width: 30px; background: rgba(0, 0, 0, 0) linear-gradient(#4c69ba, #3b55a0) repeat scroll 0 0; border: medium none; border-radius: 2px; color: #fff !important; text-decoration: none !important; cursor: pointer; font-weight: bold; height: 20px; line-height: 20px; /*padding: 0 0.7em 0 20px;*/ text-shadow: 0 -1px 0 #354c8c; white-space: nowrap; font-family: helvetica,arial,sans-serif; position:relative; font-size: 11px; display:block; /*display: inline-block;*/ /*float: none;*/ display: inline-block; line-height: normal; padding: 6px 6px 0px 6px; height: 14px; } div.share_2016 .faked_fb_share a:hover { background: rgba(0, 0, 0, 0) linear-gradient(#5b7bd5, #4864b1) repeat scroll 0 0; border-color: #58743c #4961a8 #41599f; box-shadow: 0 0 1px #607fd6 inset; } div.share_2016 #fb-like-id { float: left; margin-right: 10px; } div.share_2016 #share_link_input, div.share_2016 #embed_link_text { width: 176px; } div.share_2016 #embed_link { } div.share_2016 { position:absolute; display: none; /* initial only - then updated on attribute */ top: 0; /* initial only - then updated on attribute */ left: 0; /* initial only - then updated on attribute */ z-index: 1001; max-width: 100%; opacity: 0; color: #000; background: #fff; padding: 4px 20px 14px 20px; border-color: #7c7c7c; border-style: solid; border-width: 1px; border-radius: 5px; transition: opacity 0.175s linear; } div.share_2016.fixed { position: fixed; } div.share_2016.show_me { display: block; opacity: 1; } div.share_2016.down div.up-arrow { display: block; position: absolute; width: 11px; height: 11px; top: -11px; right: 31px; /* padd + border */ background-image: url('/core/public/images/share-arrow-up.png'); } div.share_2016.left div.up-arrow { display: none; } div.share_2016.left div.right-arrow { display: block; position: absolute; width: 11px; height: 11px; right: -11px; top: 31px; background-image: url('/core/public/images/share-arrow-right.png'); } div.share_2016.left div.up-arrow { display: none; } /* resposive share - when too narrow */ @media (max-width: 800px) { div.share_2016 { left: 1% !important; width: 96% !important; padding-left: 1% !important; padding-right: 1% !important; } div.share_2016.left div.right-arrow, div.share_2016.down div.up-arrow { display: none !important; } } /* resposive share - when too short */ @media (max-height: 400px) { div.share_2016 { position: absolute !important; } div.share_2016.left div.right-arrow, div.share_2016.down div.up-arrow { display: none !important; } } /************* share 2016 end *************/ /******************* Simple overlay**************/ /* the overlayed element */ .lozenge.simple_overlay { display:none; z-index:100; max-width:95%; padding:0; } .lozenge.simple_overlay .pi_widget{ margin-top: 0; } .header_fixed { background:#2a2a2a;width:99%;padding-right:1%;height:40px; position:fixed; top:0; z-index: 1000; } #site_name h1 { display: block; font-size: 1.4em; height: 40px; vertical-align: middle; padding: 0; } #site_name h1 a { text-decoration: none; color: #fff; font-weight: normal; height: 40px; line-height: 40px; overflow: hidden; text-overflow: ellipsis; -moz-text-overflow: ellipsis; -webkit-text-overflow: ellipsis; display: block; white-space: nowrap; } #header #full_width_search.search {float:right;padding: 6px 0 0; height: 34px; margin: 0 40px 0 0;} #header #admin_search.search,#user_panel_container, .language_switcher {float:right;padding: 6px 0 0; height: 34px; margin: 0 10px 0 0;} #header .search form legend, #header #header_search_label {display:none} #header .search form .search_text { vertical-align:bottom; border-radius: 14px; -moz-border-radius: 14px; -webkit-border-radius: 14px; background: url(../images/newui/sprite.png) 6px 3px #fff; height: 26px; text-indent: 30px; border:none; float:none; width: auto} .ie6 .search form, .ie7 .search form {position:relative} #login_text_container { color: #fff; line-height: 2.4em; display:inline-block; margin-right: 5px} .logged_in #login_text_container { color: #fff; line-height: 2.4em; display:inline-block; margin-right: 30px} #header #full_width_search.search form .search_text_container{display:inline} #header_search,#full_width_submit {display: inline} #menu_login {display:block} #menu_account {display:none;} #menu_account img.avatar {border-radius:50%; width:30px; height:30px; margin:-3px 8px 0 0;} #menu_account .default-avatar {margin:-3px 8px 0 0; font-size:15px;} #menu_account .account-overview {float:left; color:#e6e6e6; line-height: 28px; padding: 0 10px 0 0;} #menu_account .status-completeness .percent {color:#f0ff49; font-size:1.3em;} #menu_account .account-overview a, #menu_account .status-completeness a {color:#e6e6e6; text-decoration:none;} #menu_account .status-completeness {float:left; background:#222; border-radius:15px; height:28px; line-height:28px; padding:0 10px;} #menu_account .status-completeness div {float:left; } #menu_account .status-completeness div.done a {color:#f0ff49;} #login_text_container label {display:inline; float:none; font-weight:bold;color:#e6e6e6} .logged_in #login_text_container div {display:inline} .logged_in #login_text_container a, .logged_in #login_text_container p{ margin:0; padding: 0;color: #fff; font-size: 1em; line-height: 1em;} .search form .search_submit, #loginlogout_btn, .editor_edit_button, .editor_ok_button, .add_datasource_action_btn, .switch_lang_btns{ font-weight:bold; height: 28px; width: auto; line-height: 30px; border-radius: 14px; -moz-border-radius: 14px; -webkit-border-radius: 14px; border:none; margin-left: 3%; margin-top: 0; padding: 0 13px; } .search form .search_submit {float:none;display:inline;position: relative;left:3%;margin:0} #header .search form .search_submit, #loginlogout_btn, .editor_edit_button, .editor_ok_button, .add_datasource_action_btn, .switch_lang_btns{ color: #333; background: #d6d4d3; } .switch_lang_btns{ border:solid #d6d4d3;border-width: 2px 0; height: 28px; line-height:24px;}/*-2px from height, +bordertop and bottom. So background can start 1px down from top*/ #loginlogout_form legend {display:none} #loginlogout_form fieldset {margin: 0} #loginlogout_btn {display:inline;float:none; margin:0} /*#header #loginlogout_btn { width: 70px; }*/ #loginlogout_form {display:inline-block;vertical-align: top} #header .search form .search_submit:hover, #header .search form .search_submit:focus, #header #loginlogout_btn:hover, #header #loginlogout_btn:focus, .switch_lang_btns.current_lang{ background: #FFFFFF; } .switch_lang_btns.current_lang{ background: #FFFFFF; border: solid #e6e6e6;border-width: 2px 0 } #header .search form .search_submit:active, #header #loginlogout_btn:active, .switch_lang_btns:active{ background: #AFAFAF; } .switch_lang_btns:active{ border: solid #AFAFAF; border-width: 2px 0} #header #loginlogout_btn.login_menu {font-weight:normal;background:#e6e6e6} #header #loginlogout_btn .avatar{max-width:24px;max-height:24px;left:-2px;top:-2px;border-radius:10px; position:relative} /* more lang switcher stuff*/ .language_switcher form, .language_switcher fieldset, .language_switcher input {font-weight:bold;width:auto;margin:0;display:inline; } .switch_lang_btns.first_lang_btn {border-top-right-radius: 0; -moz-border-top-right-radius: 0; -webkit-border-top-right-radius: 0;border-bottom-right-radius: 0; -moz-border-bottom-right-radius: 0; -webkit-border-bottom-right-radius: 0;} .switch_lang_btns.second_lang_btn {border-top-left-radius: 0; -moz-border-top-left-radius: 0; -webkit-border-top-left-radius: 0;border-bottom-left-radius: 0; -moz-border-bottom-left-radius: 0; -webkit-border-bottom-left-radius: 0;} .switch_lang_btns.current_lang {background-image: url("../images/newui/gradients.png");background-position: center -435px;} .language_switcher.full_language_names {display:none} #header #menu_myAccount_ico {width: 22px;height: 22px;float:left;display:none;overflow:hidden;margin: 8px 0 0 5px; } #header #menu_myAccount_ico a{width: 16px;height: 16px;display:block;background: url(../images/newui/sprite.png) -360px -160px;padding:2px;text-decoration:none;color:transparent;} #header #menu_myAccount_ico a i{font-size:0;color:transparent;text-decoration:none; text-indent: 100%; white-space: nowrap;overflow: hidden;} #site_name { margin-left: 20px;} #main_menu ul li a:hover {background-image: url(../images/newui/gradients.png); background-position: 0 -340px} #main_menu ul li a.active {background-image: url(../images/newui/gradients.png); background-position: center -430px} #main_menu.single_row #show_full_menu a {border-right:none} #main_menu #show_full_menu a {padding-right: 20px; background: url(../images/newui/sprite.png) -1400px -418px; } #main_menu #hide_full_menu a {padding-right: 20px; background: url(../images/newui/sprite.png) -1400px -578px; } #container ul li.menucontrol a span {font-size:1em; padding:0; margin:0} /* versions for light colored gradient / dark text */ body.cs_menu_icon_dark #main_menu #show_full_menu a { background-position: -1400px -498px } body.cs_menu_icon_dark #main_menu #hide_full_menu a { background-position: -1400px -658px } #main_menu ul li.image_slot a, #main_menu ul li.image_slot:hover a, #main_menu ul li.image_slot.active a, #main_menu ul li.image_slot.active:hover a, #main_menu ul li.image_slot span, #main_menu ul li.image_slot:hover span, #main_menu ul li.image_slot.active span, #main_menu ul li.image_slot.active:hover span { display:block; border: 0 none; -moz-box-shadow: inset 0 0 20px #D7D7D7; -webkit-box-shadow: inset 0 0 20px #D7D7D7; box-shadow: inset 0 0 20px #D7D7D7; background: #fff; margin:0; padding:0; font-size: 0; } #main_menu ul li.image_slot a, #main_menu ul li.image_slot span {text-align:center;overflow:hidden;border:none;} #main_menu ul li.image_slot a img, #main_menu ul li.image_slot span img {margin:auto; vertical-align:middle; max-height: 80px;} .ie8 #main_menu ul li.image_slot a img, .ie8 #main_menu ul li.image_slot span img {margin-top: -1px;} #main_menu ul li.image_slot.last_image_slot {float:right;clear:none} .lozenge { display:none; position:absolute; background: #fff; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; box-shadow: 0 0 12px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.8); -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.8); z-index:10000; } .lozenge {opacity: 1; transition: all .25s ease-in-out; -moz-transition: all .25s ease-in-out; -webkit-transition: all .25s ease-in-out; }form fieldset label, form fieldset .label { display: block; float: left; width: 120px; font-weight: bold; } form fieldset input, form fieldset .input { display: block; float: left; width: 250px; } form fieldset input, form fieldset select { display: block; float: left; } #login_lozenge div.reset-password > strong > a {text-decoration: none; font-weight: bold;} #login_lozenge div.reset-password {text-align: center;} #login_lozenge {width: 420px; display:none;} #login_lozenge form {margin:1em 0 2em 0;} #logged_in_lozenge {display:none;min-width: 200px} #logged_in_lozenge hr {margin:0;padding:0} #logged_in_lozenge ul {list-style:none;text-decoration:none; margin: 0.8em 0.2em; padding:0;} #logged_in_lozenge ul a{text-decoration: none;color: #333;display:block;padding: 0.2em 0.8em;} #logged_in_lozenge ul a:hover{background: #d6d4d3;} #logged_in_lozenge ul li {margin: 0;} #login_lozenge strong {font-weight:normal;} #login_lozenge .login_bubble_heading {font-size:1.3em;} #login_lozenge .widget_tab_menu ul li{padding:0;margin:0;float: left;} .pi_widget .widget_tab_menu.user-account-nav ul li a,#login_lozenge .widget_tab_menu ul li a {display:block;color:#333;text-decoration: none;border-right: solid 1px #d7d7d7; padding: 11px 20px;} .pi_widget .widget_tab_menu.user-account-nav,#login_lozenge .widget_tab_menu.user-account-nav {margin-bottom:0} .quicklogin {background:#f1f1f1; padding:5px; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; margin:10px;} .quicklogin a {text-decoration:none;} .quicklogin a {color:#444;} .quicklogin a:hover {color:#666;} .quicklogin .icon {color: #fff; border-radius: 50%; padding: 3px 4px 5px 3px; background:#555; font-size:12px; } .quicklogin a:hover .icon {background:#666;} .quicklogin strong {display:block; width:80px; float:left; text-align:right; color:#555; padding:4px 0 0 0;} .quicklogin ul {margin: 0;padding:0 0 0 3px; margin-left:90px; border-left:1px solid #ccc;} .quicklogin ul li {list-style: none; display:inline-block; padding:3px 3px 5px 2px;} .quicklogin ul li a {text-decoration:none;} .method_login a{ text-decoration:none; } .js .openid_login_opt {display:none} .openid_login_opt {list-style:none;text-align: center;margin:0} .openid_login_opt label,.openid_login_opt input,.openid_login_opt button {margin: 0.2em} .createaccount {display:none;} /*.reset-password-form {display: none;}*/ #login_lozenge .login-box-inner {margin:25px 15px 15px 15px;} .lozenge_bubble_arrow { width: 23px; height: 12px; display:block; background: url(../images/newui/sprite.png) 0 -400px; position: absolute; right:24px; top:-12px; } .lozenge_bubble_arrow.down_arrow { background: url(../images/newui/sprite.png) 0 -440px; right: 32px;bottom: -12px;top: auto; } .closeLozenge, .simple_overlay .close {cursor:pointer; position:absolute; top:-15px; right: -15px; width:40px; height:40px; float:right; background: url(../images/newui/sprite.png) -120px -200px; font-size:0; text-align:-9999px;z-index:20} .closeLozenge:hover, .simple_overlay .close:hover { background: url(../images/newui/sprite.png) -160px -200px;} .closeLozenge:active, .simple_overlay .close:active { background: url(../images/newui/sprite.png) -199px -200px;} #login_lozenge #username {width:150px} #login_lozenge #username_label {display: none;} #login_lozenge .register_success_container { /** need to move buttons out of here before styling success !! */ /** tried to hack as is by adding style on successful call (when buttons replaced with message) - but dom really needs a tidy !! */ text-align: center;/* center for button */ padding: 10px; margin: 10px 0; border-radius: 10px; } #login_lozenge .register_success_container p { text-align: left; } #login_lozenge .register_success_container strong { font-weight: bold; } #login_lozenge .register_error_container { color: #FFF; background-color: #F44; padding: 10px; margin: 10px 0; border-radius: 10px; } #login_lozenge .register_error_container strong { font-weight: bold; } .icon.icon-mini {font-size:.6em;} .icon.icon-small {font-size:.8em;} .icon {font-size:1.2em;} .icon.icon-large {font-size:1.8em; } .icon.icon-xlarge {font-size:2.3em; } .login-register-toggle {float:right; text-decoration:underline;} /*.back-to-login {display:none; float:right; margin: 0 0 5px 0;}*/ /*#login_lozenge .reset-password {opacity:.75;} #login_lozenge fieldset {margin:0;}*/ /*#login_lozenge .btn-primary {background:#454545;color:#fff;}*/ #reset_your_password_container, #change_your_password_container {max-width: 620px;} #reset_your_password_container #password_reset_button, #change_your_password_container #password_change_button {margin-top: 22px;} #reset_your_password_container #reset_your_password_paragraph, #change_your_password_container #change_your_password_paragraph {margin-bottom: 20px;} #reset_your_password_container .reset_your_password_input_label, #change_your_password_container .change_your_password_input_label {text-align: left; width: auto; margin-left: 24px;} .state-actions {width:37%; float:left; margin:10px 0 10px 0; padding:0; list-style-type: none;} .state-actions li {list-style-type: none; margin:5px 0 5px 10px; font-weight:bold;} .state-actions li.done a {/*background:#454545; color:#79ff4f; color:#fff;*/ font-weight:normal; padding:0 19px;} .state-actions li.do a {/*background:#454545; color:#1cf4dd; color:#f0ff49;*/ font-weight:normal; padding:0 19px;} .state-actions li a:hover {/*background:#555;*/} .state-actions li .icon {margin: 7px 0 0; width: 12px;} .state-actions .icon-small {width:10px;} .state-heading {display:block; margin-top:15px; font-size:1.5em; font-weight: normal; color:#555;} .state.done .state-heading {margin-top:28px; } .state .badge {display:block; background:#666; color:#E6E6E6; width:40px; height:40px; padding:6px 14px 14px 6px; line-height:40px; border-radius:50%; float:left; font-size:1.3em; text-align: center; margin:10px 5px 10px 10px;} .state.done .badge {color:#f0ff49; background:#454545;} .tab-content .state h2 {float:left;} .box-controls {text-align:right; padding: 10px 15px 15px; border-top: 2px solid #e4e4e4;} .login_progress_percentage {font-size:1.5em; color:#f0ff49; text-align:right; } .login_progress_bar {height:8px; background-color:#222; border-radius:8px; margin: 3px 15px 20px; } .login_progress_bar .login_progress_bar_filled {height:8px; background-color:#f0ff49; border-radius:8px 0 0 8px;} .percentage_100 .login_progress_bar .login_progress_bar_filled {border-radius:8px} section.screen_prompt {width: 380px; display:block; opacity:0; transition: opacity 1000ms ease-in-out;} .screen_prompt .prompt-heading {font-size:1.3em; margin:15px 15px 7px 15px;} .screen_prompt .prompt-heading strong {font-weight:normal;} .screen_prompt img {float:left; margin:0 10px 5px 15px; border-radius:4px;} .screen_prompt .prompt-text {line-height:1.5em; margin:0 15px 3px 15px;} .screen_prompt .prompt-controls {margin:0 15px;} .screen_prompt .more-info {font-size:.9em; opacity:.9; margin:15px 15px 10px 15px; padding:0;} .screen_prompt.inline {width:150px; height:230px; padding:0 0 10px 0; float:left; opacity:1;} .screen_prompt.inline .prompt-text {color:#666;} .screen_prompt.inline img {float:none;} .screen_prompt.inline .prompt-heading {color:#666; margin-left:5px; margin-right:5px;} .screen_prompt.inline .prompt-text {margin-left:5px; margin-right:15px; padding:0;} .screen_prompt.inline img {margin-left:5px; margin-right:5px;} #search_lozenge_container {display:none} #search_lozenge {position:absolute; padding-left:2.5%; padding-right: 2.5%; width: 90%; max-width:300px;} #search_lozenge_opener{margin-top: 5px; float:Right; background: url(../images/newui/sprite.png) -480px 0 ; width: 24px; height: 20px; border:none;text-indent:-150px;color:transparent;font-size:0;display:none/*visibility:hidden;rather than display none so it can still be positioned against if someone opens lozenge, then resizes up past 200px*/} #header #search_lozenge .search_text_container {width: 45%; position:relative} #header #search_lozenge .search_text_container input {padding-left: 30px;text-indent: 0;width: 80%; border: 1px solid #999; box-shadow: 1px 3px 2px #CCCCCC inset;} #search_lozenge form fieldset { margin: 0; } section.login_prompt { display: none; transition: opacity 1000ms ease-in-out 0s; width: 380px; } .login_prompt .prompt-heading { font-size: 1.3em; margin: 15px 15px 7px; } .login_prompt .prompt-heading strong { font-weight: normal; } .login_prompt img { border-radius: 4px; float: left; margin: 0 10px 5px 15px; } .login_prompt .prompt-text { line-height: 1.5em; margin: 0 15px 3px; } .login_prompt .prompt-controls { margin: 0 15px; } .login_prompt .more-info { font-size: 0.9em; margin: 15px 15px 10px; opacity: 0.9; padding: 0; } .login_prompt.inline { float: left; height: 230px; opacity: 1; padding: 0 0 10px; width: 150px; } .login_prompt.inline .prompt-text { color: #666666; } .login_prompt.inline img { float: none; } .login_prompt.inline .prompt-heading { color: #666666; margin-left: 5px; margin-right: 5px; } .login_prompt.inline .prompt-text { margin-left: 5px; margin-right: 15px; padding: 0; } .login_prompt.inline img { margin-left: 5px; margin-right: 5px; } #recent_activities .item {margin: 4px} #recent_activities .pub_date { font-size: 1.1em; color: #666; width:240px; display:inline-block} #recent_activities .ico {width:32px; height: 32px;margin-left:30px; display:inline-block;background: url(../images/newui/sprite.png) } .ie7 #recent_activities .ico , .ie6 #recent_activities .ico {display:inline;position:relative; left: 1px} #recent_activities .webcast_activity .ico{background-position: 0 -754px} #recent_activities .twitter_activity .ico{background-position: -560px -747px} #recent_activities .uservoice_activity .ico{background-position:-400px -749px} #recent_activities .disqus_activity .ico{background-position: -80px -755px;} .ie6 .pi_widget .pi_widget_body .view_profile, .ie7 .pi_widget .pi_widget_body .view_profile, .ie6 .pi_widget .pi_widget_body .edit_my_profile, .ie7 .pi_widget .pi_widget_body .edit_my_profile{position:relative;} .ie6 .pi_widget .pi_widget_body .view_profile .item, .ie7 .pi_widget .pi_widget_body .view_profile .item, .ie6 .pi_widget .pi_widget_body .edit_my_profile .item, .ie7 .pi_widget .pi_widget_body .edit_my_profile .item{position:static;} /* I2Web adaptation overlay CSS */ .pi_widget { position: relative; } .structured_links { position: relative; margin: 20px; padding: 10px; background-color: #FFFFFF; border-radius: 6px; -mozborder-radius: 6px; -webkit-border-radius: 6px; } body.cs_menu_icon_dark .structured_links { box-shadow: 0 3px 5px #CBCBCB; } .structured_links li { list-style: none outside none; } .overlay_adaptation { position: absolute; width: 99%; height: 97%; opacity: 1; font-size: xx-large; z-index: 1; color: black; font: bold 24px/45px Helvetica, Sans-Serif; letter-spacing: -1px; text-align:center; vertical-align: middle; min-height: 10%; float: left; top: 0; left: 0; filter: alpha(opacity=80); -moz-opacity:1; /* Fallback for web browsers that doesn't support RGBa */ background: rgb(238, 221, 130); /* RGBa with 0.6 opacity */ background: rgba(238, 221, 130, 0.8); border:1px solid red; } /* Slightly modified font sizes (etc), popularised by BC in 2016 */ section#content.pi_admin_bootstrap_wrapper .ux2016 h2{font-size:1.7em} section#content.pi_admin_bootstrap_wrapper .ux2016 h3{font-size:1.8em} section#content.pi_admin_bootstrap_wrapper .ux2016 h3.integrations_subheading{text-transform: capitalize; font-weight: bold} section#content.pi_admin_bootstrap_wrapper .ux2016 .control-label {font-size: 1.2em} section#content.pi_admin_bootstrap_wrapper .ux2016 .nav-tabs > li > a {font-size: 1.3em} section#content.pi_admin_bootstrap_wrapper .ux_summer_2016_table tbody tr:nth-child(2n) {background: #f2f2f2} section#content.pi_admin_bootstrap_wrapper .ux_summer_2016_table tbody tr:nth-child(2n+1) {background: #e4e4e4} section#content.pi_admin_bootstrap_wrapper .gray_text {color: #999} .lozenge_small_centered {left: 50%; margin-left: -140px; width: 280px; position:absolute; top: 100px; } #help_us_popup {padding: 2em 1em 1em} #help_us_popup input,#help_us_popup textarea,#help_us_popup select{width: 90%;} /* responsive css start */ @media screen and (max-width: 1200px) { #main_menu.admin_menu .navbar-section ul li {font-size: 1em;} #main_menu.admin_menu ul li a {padding: 0 10px;} #main_menu.admin_menu ul li.image_slot a {padding: 0;} .megatabs li {font-size: 0.8em;} /*.stat_tab_mini_pad a {padding-bottom: 13px;}*/ section#content.pi_admin_bootstrap_wrapper .megatabs.mega_padding.stat_tab_mini_pad li a {padding-bottom: 13px;} } @media screen and (min-width: 1024px) { .language_switcher.full_language_names {display:block} .language_switcher.abbr_language_names {display:none} } @media screen and (max-width: 1024px) { /* responsive for fixed header menu start */ #full_width_submit,#header #full_width_search.search form .search_text_container{display:none} #search_lozenge_opener{display:block} .logged_in #header #menu_myAccount_ico {display:block;} #login_container {padding-right: 11px;} /* responsive for fixed header menu end */ #search_lozenge_container {display:block} } @media screen and (min-width: 769px) and (max-width: 1024px) { /* responsive for fixed header menu start */ #header #login_text_container { display: none; } /* only show login text when big enough ! */ #site_name h1 { font-size: 1.2em; } /* shrink site title a little */ /* responsive for fixed header menu end */ /* old css - doesnt do this < 768 - so i dont thinnk this has to be here anymore */ /* .dir_admin .admin_field .label, div.editable label, div.editable input { float: none; padding-left: 10px; padding-bottom: 0px; clear: both; } div.editable input, div.admin_field input, div.admin_field div.label, div.editable label { width: 97%; } .dir_admin .admin_field .field_add, .dir_admin .admin_field .field_edit, .dir_admin .admin_field .field_desc, div.editable span.forminfo { float: none; padding-left: 10px; padding-bottom: 0px; width: auto; clear: both; } div.editable span.forminfo { text-indent: 30px; clear: both; } */ } @media screen and (max-width: 768px) { /* responsive for fixed header menu start */ #header #login_text_container { display: none; } /* only show login text when big enough ! */ #site_name h1 { font-size: 1.1em; } /* shrink site title a little */ .logged_in #header #menu_myAccount_ico {margin-left:6px;} /* responsive for fixed header menu end */ .combined_portal_hidden { margin-left: 20px; margin-right: 20px; } .filter, .message_flash { margin-right: 0px; } #footer #footnav { float:none; clear: both; width:100%; } #footer div.powered_by { float: none; clear: both; text-align: right; width: 100%; } /* remove nav menu logo and reduce height */ #main_menu ul li { line-height: 40px; white-space: nowrap;} #main_menu ul li.image_slot { display: none; } /* push into grid on mbl */ .multi_row.per_row_1 ul li { width:100%; } .multi_row.per_row_2 ul li { width:50%; } .multi_row.per_row_3 ul li { width:33.3333%; } .multi_row.per_row_4 ul li { width:25%; } .multi_row.per_row_5 ul li { width:20%; } .multi_row.per_row_6 ul li { width:16.6666%; } .multi_row ul li.menucontrol { width: auto; } #main_menu ul li a { height: 40px; } #main_menu #show_full_menu a { background-position: -1400px -438px; } #main_menu #hide_full_menu a { background-position: -1400px -598px; } /* versions for light background / dark text / icons */ body.cs_menu_icon_dark #main_menu #show_full_menu a { background-position: -1400px -518px; } body.cs_menu_icon_dark #main_menu #hide_full_menu a { background-position: -1400px -678px; } #recent_activities .pub_date {display:block} #recent_activities .ico {margin-left:0} .method_manage_my_details .pi_widget div.activities_under{display: inline-block;margin-left: 46px;} /* join / login page */ #pi_widget_content_static_login .columns div.col-half {width:100%;float:left;} /*Smaller login bubbles*/ #login_lozenge {width: 300px; display:none;} #login_lozenge form input.input-medium {width: 100px;} } @media screen and (max-width: 500px) { /* responsive for fixed header menu end */ .cookie_overlay { position: fixed; z-index: 1001; width: 80%; max-width:400px; left: 10%; margin-left: 0; } @media screen and (max-width: 360px) { #content { margin-left: 0; margin-right: 0; } } @media screen and (max-height: 490px) and (orientation: portrait) { } /* responsive css end */ /* Default custom css rules */ /* there is a mirror of this block in widget css but prepended by .pi_widget */ /* the actual custom css file contains both these sets of rules - and should be kept in sync */ /* Default custom css rules - to be overriden */ /* custom body font-family */ body, button, input, select, textarea, .cs_body_font_family { font-family: Verdana, sans-serif; } /* custom menu font-family */ .cs_menu_font_family { font-family: Arial,Helvetica,sans-serif; } /* custom menu font-family */ .cs_heading_font_family { font-family: Arial,Helvetica,sans-serif; } /* custom background flat */ .cs_background_flat { background-color: #444444; } .js .cs_hover_group:hover .cs_background_flat, .js .cs_hover_group:focus .cs_background_flat { background-color: #666666; } .js .cs_hover_group:active .cs_background_flat { background-color: #888888; } /* custom background gradient */ .cs_background_grad, .cs_background_grad_flat { background: #444444; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQ0NDQ0NCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzNDJmMmMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #444444 0%, #342f2c 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#444444), color-stop(100%,#342f2c)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #444444 0%,#342f2c 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #444444 0%,#342f2c 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #444444 0%,#342f2c 100%); /* IE10+ */ background: linear-gradient(top, #444444 0%,#342f2c 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444', endColorstr='#342f2c',GradientType=0 ); /* IE6-8 */ } .ie6 .cs_background_grad, .ie6 .cs_background_grad_flat, .ie7 .cs_background_grad, .ie7 .cs_background_grad_flat { zoom: 1; } .ie9 .cs_background_grad, .ie9 .cs_background_grad_flat { filter: none; } /* custom border */ .cs_border_flat { border-color: #444444; } /* custom link colors - this is a place holder as we use browser defaults as default ! */ /* would have * a, a:link {} * a:visited{} * a:hover, a:focus{} * a:active */ .js .cs_hover_group:hover a, .js .cs_hover_group:focus a { color: #666666; } .js .cs_hover_group:active a { color: #888888; } /* custom menu font light or dark */ .cs_menu_font_light_dark, a.cs_menu_font_light_dark { color: #FFFFFF; } /* pi_error div */ div.pi_error {border-radius: 8px;border-width: 4px; border-style: double;background: #fff; display:inline-block; padding:1.5em 2em;font-size: 1.2em;} div.pi_error h3 {font-size: 1.2em; text-shadow: 2px 2px #DDD;} /*Widgets to have rounded corners on bottom of last div (so bottom of widget or shrae) */ .pi_widget > div:last-child {border-radius:0 0 6px 6px;}